/* Damar Atelier 14.4.1 — compact controls, a full-height studio, comfortable touch targets. */
[hidden]{display:none!important}
body{overflow-x:clip}
button,input,select,textarea{font-family:inherit}
.site-integrated .app{padding:12px 16px 0}
.site-integrated .topbar{height:48px;margin-bottom:12px;padding-inline:5px;gap:12px}
.brand-logo-image{width:112px;height:42px}
.brand-section{font-size:9px;letter-spacing:.12em}
.site-integrated .live{font-size:9px;letter-spacing:.08em}
.atelier-nav-actions{gap:6px}
.atelier-nav-actions a{min-height:34px;padding:0 12px;gap:9px;font-size:11px;letter-spacing:.03em;font-weight:600}
.shell{grid-template-columns:minmax(0,1fr) minmax(320px,360px);height:min(1080px,calc(100svh - 86px));gap:16px}
.main{display:flex;flex-direction:column;min-height:0;border-radius:22px}
.intro{flex:none;min-height:0;padding:17px 23px 16px;gap:14px;align-items:center}
.intro h1{font-size:clamp(23px,2.05vw,32px);line-height:1.12;letter-spacing:-.045em}
.intro h1 span{display:inline;color:#b3b0ab;font-weight:400}
.intro p{font-size:12px;line-height:1.5;margin-top:8px;max-width:48em}
.eyebrow,.control-kicker{font-size:9px;letter-spacing:.14em;margin-bottom:8px;color:#b2aca4}
.model-tag{display:none}
.viewer-wrap{height:auto;min-height:0;flex:1;background:#817e78}
.viewer-wrap:after{box-shadow:inset 0 0 65px rgba(0,0,0,.055);background:none}
.studio-lines{display:none}
.mode-switch{top:14px;width:288px;max-width:calc(100% - 28px);padding:3px;gap:2px;box-shadow:0 5px 20px #0002}
.site-integrated .mode-btn{min-width:0;min-height:34px;padding:8px 11px;font-size:11px;letter-spacing:.035em;font-weight:650}
.viewer-top{top:64px;left:16px;right:16px;gap:8px}
.viewer-chip{font-size:10px;line-height:1.3;letter-spacing:0;padding:6px 9px;max-width:48%;overflow-wrap:anywhere}
.viewer-chip strong{font-weight:600}
.viewer-bottom{display:grid;gap:5px;left:16px;right:16px;bottom:12px}
.hint{font-size:10px;line-height:1.4;letter-spacing:0;border:0;padding:3px 0;background:none;backdrop-filter:none;color:#b2b0aa}
.camera-bar{justify-content:flex-start;gap:5px;flex-wrap:wrap}
.site-integrated .cam-btn{font-size:11px;line-height:1.2;min-height:32px;padding:7px 9px;font-weight:400}
.icon-btn{min-width:32px}
.controls{height:100%;min-width:0;min-height:0;padding:18px;border-radius:22px;scrollbar-gutter:stable;overscroll-behavior:contain;scroll-padding:16px}
.control-head{padding-bottom:12px;gap:12px}
.control-head p{font-size:12px;line-height:1.5;margin-top:5px;color:#aaa69f}
.control-head h2{font-size:23px;line-height:1.1;letter-spacing:-.04em}
.control-head .control-kicker{display:none}
.magic{width:34px;height:34px;border-radius:10px;font-size:17px}
.status-box{grid-template-columns:auto minmax(0,1fr) auto;padding:10px 11px;margin-top:11px;gap:9px;border-radius:12px}
.status-title{font-size:12px;line-height:1.35;font-weight:600}
.status-sub{font-size:10px;color:#aaa69f;line-height:1.5;margin-top:2px}
.status-badge{display:none}.status-dot{width:5px;height:5px;box-shadow:none}
.status-dot.ready{box-shadow:none!important}
.focus-btn{grid-column:auto;min-height:32px;padding:6px 8px;max-width:64px;border-radius:7px;font-size:9px;line-height:1.4;letter-spacing:.025em;font-weight:500}
.focus-btn:hover{background:#252523;color:#f1ede6}
.panel-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;margin-top:9px}
.ui-mode-switch{margin:0;padding:3px;gap:3px;border-radius:10px}
.ui-mode-btn{min-height:30px;padding:7px 9px;font-size:10px;line-height:1.2;font-weight:600;letter-spacing:.06em;border-radius:7px}
.history-actions{display:flex;gap:4px}
.history-btn{display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid var(--line);border-radius:8px;background:#141614;color:#d4cdc4;font-size:21px;line-height:1;cursor:pointer;transition:background .2s,border-color .2s}
.history-btn:disabled{opacity:.32;cursor:not-allowed}
.history-btn:not(:disabled):hover{background:#242521;border-color:#756151}
.mode-help{font-size:10px;line-height:1.5;color:#aaa69f;margin:7px 1px 0}
.group{padding:15px 0}
.group-title{font-size:10px;line-height:1.4;letter-spacing:.07em;align-items:start;margin-bottom:9px;gap:9px;color:#b3aea6}
.group-title span:last-child{font-size:9px;line-height:1.5;color:#aaa69f;letter-spacing:.025em;max-width:44%}
.zone-grid{gap:5px}
.zone{font-size:12px;letter-spacing:0;min-height:37px;line-height:1.35;padding:8px 10px;border-radius:9px;font-weight:500}
.zone-tools{gap:5px;margin-top:9px;padding-top:9px}
.zone-tools .mini-btn.active{color:#ead5c0;background:#33271f;border-color:#795941}
.two-grid,.preset-grid,.stitch-grid,.pattern-collection-grid{gap:6px}
.option,.preset{min-height:49px;padding:9px 10px;line-height:1.35;border-radius:10px}
.option b,.preset b{font-size:12px;line-height:1.35;font-weight:550;overflow-wrap:anywhere;margin-bottom:2px}
.option small,.preset small{font-size:10px;line-height:1.45;color:#aaa69f}
.pattern-collection-label{font-size:9px;letter-spacing:.09em;color:#b8a994;margin:12px 0 7px}
.pattern-thumb{height:48px;margin-bottom:7px;border-radius:6px}.pattern-option{padding:7px}
.preset-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none;cursor:pointer;font-size:10px;line-height:1.5;letter-spacing:.07em;color:#b3aea6}
.preset-summary::-webkit-details-marker{display:none}
.preset-summary>span:last-child{display:flex;align-items:center;gap:8px;color:#aaa69f;font-size:10px;letter-spacing:0}
.preset-summary>span:last-child>span{font-size:17px;line-height:1;font-weight:400;transition:transform .2s}
.preset-group[open] .preset-summary{margin-bottom:12px}
.preset-group[open] .preset-summary>span:last-child>span{transform:rotate(45deg)}
.more-options{width:100%;border:1px solid var(--line);border-radius:9px;background:transparent;color:#d4bba4;min-height:34px;margin-top:9px;padding:7px 9px;font-size:11px;cursor:pointer;transition:background .2s,border-color .2s}
.more-options:hover{background:rgba(184,146,111,.08);border-color:#79614e}
.range-caption,.tailoring-control{font-size:9px;line-height:1.4;letter-spacing:.025em;color:#b4b0aa}
.tailoring-controls{padding:10px;gap:8px;border-radius:10px}
.tailoring-control{grid-template-columns:88px minmax(42px,1fr) 36px;gap:6px;line-height:1.4}
.tailoring-control output,.range-value{font-size:11px;color:#c4bdb3}
input[type=range]{height:24px;background:linear-gradient(#45423e,#45423e) center/100% 3px no-repeat}
input[type=range]::-moz-range-thumb{width:16px;height:16px;border:0;border-radius:50%;background:#f1ede6}
.material-preview{height:68px;border-radius:10px;margin:0 0 8px}
.preview-label{font-size:8px;letter-spacing:.04em;padding:4px 6px;left:7px;bottom:6px}
.swatches{grid-template-columns:repeat(8,minmax(0,1fr));gap:9px;padding:3px}
.swatch{min-height:0;min-width:0;max-width:36px;width:100%}
.custom-color{font-size:10px;line-height:1.4;letter-spacing:.025em;gap:12px;color:#b4b0aa;margin-top:10px}
.custom-color input{width:30px;height:30px;flex:none}.thread-row{gap:10px;padding:3px}.thread{width:28px;height:28px}
.bounded-note{font-size:10px;color:#b4b0aa;line-height:1.5;padding:8px 9px;border-radius:9px;margin-top:9px}.bounded-note span{box-shadow:none}
.mini-btn{font-size:11px;min-height:33px;padding:7px 8px;line-height:1.35;border-radius:8px}
.custom-drawer{padding:9px;border-radius:11px}#stitchCanvas{height:158px;border-radius:9px}
.signature{padding:13px;border-radius:12px;margin-top:15px}
.signature-kicker{font-size:9px;letter-spacing:.1em;color:#b8a994}
.signature-title{font-size:19px}.signature-overview{font-size:12px;line-height:1.6;color:#d4cdc4;margin:8px 0}
.signature-details summary{cursor:pointer;padding:7px 0;font-size:11px;line-height:1.5;color:#cdb398}
.signature-lines{font-size:11px;line-height:1.65;color:#bcb8b1;white-space:normal}
.signature-zone{padding:9px 0;border-top:1px solid var(--line)}.signature-zone strong{display:block;color:#e1d8cc;font-weight:600}
.signature-code{font-size:11px;line-height:1.2;letter-spacing:.12em}
.export-quality{gap:7px;padding:14px 0;font-size:10px;letter-spacing:.06em}
.export-quality select{min-height:36px;padding:7px 9px;font-size:12px}
.export-quality small{font-size:10px;line-height:1.5}
.actions{gap:6px;margin-top:0}
.action{font-size:11px;min-height:38px;line-height:1.4;padding:9px;border-radius:9px;letter-spacing:0!important}
.actions #resetBtn{grid-column:1/-1}
.disclaimer{font-size:10px;line-height:1.6;color:#aaa69f}
.toast{font-size:12px;line-height:1.5;max-width:calc(100vw - 32px);width:max-content;text-align:center;border-radius:12px}
.offer-kicker,.offer-form>small{font-size:11px;color:#aaa69f;line-height:1.55}
.offer-form>p{font-size:14px;color:#b4b0aa}.offer-form label{font-size:12px;letter-spacing:0}
.offer-form input,.offer-form textarea{font-size:16px;min-height:44px}
.offer-consent input{min-height:0;min-width:18px}.offer-summary{font-size:12px;line-height:1.4}
.offer-summary span{font-size:10px;line-height:1.4}.offer-submit{font-size:12px;min-height:44px;letter-spacing:.03em}
.loader-box{width:min(340px,80%)}.loader-ring{width:44px;height:44px;margin-bottom:16px}
.loader-title{font-size:11px;line-height:1.5;letter-spacing:.1em}
.loader-sub{font-size:12px;line-height:1.6;color:#b2aea8}
.exit-presentation{font-size:11px;min-height:38px}.presentation-tag span{font-size:12px}
.presentation-tag .presentation-scene{font-size:10px}.presentation-tag{width:90%}
.atelier-footer{padding:0 16px 16px;margin-top:14px}
.atelier-footer-inner{grid-template-columns:auto minmax(180px,1fr) minmax(300px,1.6fr);padding:14px 16px;border-radius:16px;gap:14px}
.atelier-footer-inner>*{min-width:0}
.atelier-footer-brand{width:90px;height:38px}
.atelier-footer p,.atelier-footer-bottom{font-size:10px;line-height:1.6;letter-spacing:0;color:#aaa69f}
.atelier-footer nav a,.atelier-footer nav button[data-privacy-open]{min-height:30px;display:inline-flex;align-items:center;font-size:10px;line-height:1.4;letter-spacing:0;padding:6px 8px;font-weight:400;text-transform:none}
.atelier-footer nav button[data-privacy-open]{background:transparent;border:1px solid transparent;color:inherit;text-decoration:underline;text-underline-offset:3px;border-radius:8px;cursor:pointer}
body[data-ui-mode="simple"] [data-advanced-only],body[data-ui-mode="simple"] .tailoring-controls,body[data-ui-mode="simple"] .range-caption,body[data-ui-mode="simple"] #patternGroup>.range-row{display:none}
body[data-ui-mode="advanced"] .more-options{display:none}
.group[aria-disabled="true"] .bounded-note{border-color:var(--line)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid #d9ac83;outline-offset:3px}
button:disabled{cursor:not-allowed}
@media(min-width:960px) and (max-width:1190px){
  .shell{grid-template-columns:minmax(0,1fr) 330px;gap:12px}
  .intro{padding:15px 18px}.intro h1{font-size:25px}.intro h1 span{display:block}
  .controls{padding:15px}.brand-section,.site-integrated .live{display:none}
  .viewer-top{top:61px}.viewer-bottom{left:12px;right:12px}.hint{display:none}
  .site-integrated .cam-btn{font-size:10px;padding-inline:8px}
}
@media(min-width:960px) and (max-height:680px){
  .intro{padding:12px 18px}.intro h1{font-size:24px}.intro h1 span{display:inline}
  .intro p{margin-top:5px;font-size:11px}.eyebrow{margin-bottom:5px;font-size:8px}
  .viewer-top{top:57px}.viewer-bottom{bottom:9px}.hint{display:none}
  .mode-switch{top:11px}
}
@media(min-width:960px) and (max-height:510px){
  .intro{display:none}.viewer-top{display:none}
  .site-integrated .topbar{height:40px;margin-bottom:8px}
  .site-integrated .app{padding-top:8px}
  .shell{height:calc(100svh - 66px)}
}
@media(max-width:959px){
  .shell{display:block;height:auto}
  .main{display:block;position:sticky;top:0;z-index:25;background:#0c0e11}
  .intro{display:none}
  .viewer-wrap{height:clamp(290px,48svh,520px);min-height:0}
  .controls,.site-integrated .controls{position:relative;height:auto;min-height:0;overflow:visible;overscroll-behavior:auto;margin:12px 0 0;padding:20px 22px;border-radius:20px;z-index:1;background:#101312;box-shadow:none}
  .controls:before{display:none}.controls .control-head{display:none}
  .status-box{margin-top:0}
  .brand-section,.site-integrated .live{display:none}
  .viewer-top,.hint{display:none}
  html{scroll-padding-top:calc(48svh + 20px)}
  .controls :is(button,input,select,summary){scroll-margin-top:calc(48svh + 20px)}
  .zone-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .swatches{grid-template-columns:repeat(8,minmax(0,1fr));max-width:460px}
  .material-preview{height:82px}
  .atelier-footer-inner{grid-template-columns:auto minmax(0,1fr)}
  .atelier-footer nav{grid-column:1/-1;justify-content:flex-start}
  .atelier-footer-bottom{grid-column:1/-1}
}
@media(max-width:600px){
  .site-integrated .app{padding:6px 8px 0}
  .site-integrated .topbar{height:46px;margin-bottom:6px;padding:0 2px;gap:8px}
  .brand-logo-image{width:96px;height:40px}
  .atelier-nav-actions{gap:4px}.atelier-nav-actions a{font-size:10px;min-height:40px;padding-inline:10px}
  .atelier-nav-actions a:nth-child(2){display:none}
  .main{border-radius:17px}.viewer-wrap{height:clamp(270px,43svh,420px);min-height:0}
  .viewer-wrap:after{box-shadow:inset 0 0 40px rgba(0,0,0,.04)}
  .mode-switch{top:9px;width:276px;max-width:calc(100% - 20px)}
  .site-integrated .mode-btn{min-height:40px;font-size:11px;padding:9px 8px;letter-spacing:.025em}
  .viewer-bottom{left:9px;right:9px;bottom:7px}
  .camera-bar{width:100%;flex-wrap:nowrap;overflow:auto;scrollbar-width:none;justify-content:flex-start;padding:2px;gap:5px}
  .site-integrated .cam-btn{flex:none;font-size:11px;min-height:40px;padding:8px 10px}
  .controls,.site-integrated .controls{padding:17px 15px;margin-top:10px;border-radius:17px}
  .controls :is(button,input,select,summary){scroll-margin-top:calc(43svh + 20px)}
  html{scroll-padding-top:calc(43svh + 20px)}
  .zone-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
  .zone{min-height:44px;font-size:12px}
  .status-box{padding:11px 10px}.status-title{font-size:13px}.status-sub{font-size:11px}
  .focus-btn{min-height:40px;font-size:10px}
  .ui-mode-btn{min-height:38px;font-size:11px}.history-btn{width:40px;height:40px}
  .mode-help{font-size:11px}
  .group{padding:17px 0}.group-title{font-size:11px;letter-spacing:.035em}
  .group-title span:last-child{font-size:10px}
  .option,.preset{min-height:52px}.option b,.preset b{font-size:13px}.option small,.preset small{font-size:11px}
  .swatches{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.swatch{min-height:38px;max-width:44px}
  .custom-color{font-size:11px}.custom-color input{width:40px;height:40px}
  .thread{width:36px;height:36px}.thread-row{gap:11px}
  .mini-btn,.more-options{min-height:42px;font-size:12px}
  .action{min-height:44px;font-size:12px}
  .preset-summary{min-height:34px;font-size:11px}.preset-summary>span:last-child{font-size:11px}
  .signature-details summary{min-height:42px;display:flex;align-items:center}
  .tailoring-control{grid-template-columns:88px minmax(38px,1fr) 36px;font-size:10px}
  .bounded-note,.disclaimer{font-size:11px}.export-quality select{min-height:44px;font-size:14px}
  .atelier-footer{padding:0 8px 10px;margin-top:10px}.atelier-footer-inner{grid-template-columns:minmax(0,1fr);padding:14px;gap:10px;border-radius:17px}
  .atelier-footer p{font-size:11px}.atelier-footer nav a,.atelier-footer nav button[data-privacy-open]{min-height:40px;font-size:11px}
  .offer-form{padding:28px 18px}.offer-grid{grid-template-columns:1fr}
}
@media(max-width:959px) and (max-height:540px){
  .main{position:relative}.viewer-wrap{height:calc(100svh - 82px);min-height:230px}
  .controls :is(button,input,select,summary){scroll-margin-top:12px}html{scroll-padding-top:12px}
}
@media(max-width:380px){
  .brand-logo-image{width:85px}.controls,.site-integrated .controls{padding-inline:12px}
  .swatches{gap:9px}.swatch{min-height:34px}.group-title span:last-child{max-width:42%}
  .tailoring-control{grid-template-columns:80px minmax(34px,1fr) 35px;gap:5px}
}
@media(pointer:coarse) and (min-width:601px){
  .zone,.mini-btn,.more-options,.action{min-height:44px}
  .history-btn{width:40px;height:40px}.ui-mode-btn{min-height:36px}
  .site-integrated .mode-btn,.site-integrated .cam-btn,.atelier-nav-actions a{min-height:40px}
}
body.presentation-mode .shell{height:auto}body.presentation-mode .main{position:static;display:block;height:100svh}
body.presentation-mode .viewer-wrap{height:100svh;min-height:0}
body.embed-mode:not(.presentation-mode) .shell{height:100svh}
.viewer-wrap:fullscreen{width:100vw;height:100svh;min-height:0;flex:none}
body.viewer-unavailable:not(.presentation-mode) .viewer-wrap{height:auto;min-height:0}
@media(max-width:959px){
  body.embed-mode:not(.presentation-mode) .shell{height:auto}
  body.embed-mode:not(.presentation-mode) .main{position:relative}
  body.embed-mode:not(.presentation-mode) .viewer-wrap{height:clamp(280px,55svh,480px);min-height:0}
  body.embed-mode:not(.presentation-mode) .controls{height:auto}
  body.viewer-unavailable:not(.presentation-mode) .viewer-wrap{height:clamp(310px,48svh,460px);min-height:0}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.viewer-wrap.model-transition #viewer{animation:none}*{transition-duration:.001ms!important;animation-duration:.001ms!important}}