:root{--ink:#223f36;--muted:#637067;--paper:#f6f3ec;--line:#d9d9cc;--accent:#b9925d;font-family:Arial,sans-serif;color:var(--ink);background:var(--paper);font-size:15px}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}a{color:inherit;text-underline-offset:4px}button,.button{min-height:44px;padding:12px 17px;background:transparent;color:var(--ink);border:1px solid var(--line);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px}button:hover,.button:hover{background:#e9eadd;border-color:#637067}button[aria-pressed=true],.primary{background:var(--ink);color:#fff;border-color:var(--ink)}button:disabled{cursor:default;opacity:.45}a[aria-disabled=true]{pointer-events:none;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible,textarea:focus-visible{outline:3px solid #b77d31;outline-offset:3px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Georgia,serif;font-weight:400}h1{font-size:clamp(52px,5.5vw,86px);line-height:.99;letter-spacing:-3px}h1 em{font-weight:400;color:#71816b}h2{font-size:clamp(28px,3vw,42px);line-height:1.1}h3{font-size:25px}p{line-height:1.6}.eyebrow{font-size:10px;letter-spacing:.18em;font-weight:bold;margin-bottom:14px}.small{font-size:12px;line-height:1.55;color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}[hidden]{display:none!important}.skip{position:absolute;top:-100px;padding:15px;background:#fff;z-index:10}.skip:focus{top:0}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid var(--line)}.brand{font-family:Georgia,serif;font-size:31px;text-decoration:none}.brand span{font-size:18px}.header-tag{font-size:11px;letter-spacing:.16em}.site-header>a:last-child{font-size:12px}main{max-width:1580px;margin:auto;padding:0 4vw}.intro{display:grid;grid-template-columns:1.1fr 1fr;gap:8%;padding:65px 0 52px;align-items:center}.intro-copy>p{font-family:Georgia,serif;font-size:30px;line-height:1.3;margin-bottom:22px}.intro-copy>span{display:block;max-width:400px;font-size:14px;line-height:1.7;color:var(--muted)}.purpose{border-top:1px solid var(--line);padding:28px 0 40px}.purpose h2{font-size:24px;margin-bottom:19px}.purpose-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.purpose-grid button{justify-content:space-between;text-align:left;padding:20px 17px;font-size:13px;min-height:72px}.purpose-grid button span{font-size:24px;color:var(--accent)}.scene-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;border-top:1px solid var(--line);padding-top:30px}.scene-nav{display:flex;gap:8px;flex-wrap:wrap}.scene-nav button{font-size:12px;padding:12px}.scene-heading .eyebrow{margin-bottom:10px}.scene-description{max-width:760px;font-size:14px;color:var(--muted);margin:18px 0 27px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:26px;align-items:start}.visual-column{min-width:0}.viewbar{display:flex;gap:5px;padding-bottom:12px}.viewbar button{font-size:12px}.stage{position:relative;background:#e9e4d9;overflow:hidden;aspect-ratio:1.44}.stage canvas{display:block;width:100%;height:100%;touch-action:pan-y}.stage-caption{position:absolute;bottom:14px;left:16px;right:16px;display:flex;justify-content:space-between;gap:10px;pointer-events:none}.stage-caption span{background:#f6f3ece8;font-size:10px;padding:7px 10px}.stage-caption span:first-child{font-weight:bold}#loading{position:absolute;inset:0;display:grid;place-items:center;background:#f0ece1cf;color:var(--ink);font-family:Georgia,serif;font-size:25px}.motion-panel{padding:22px;background:#eceee4;border:1px solid #d7dbcf}.motion-title{display:flex;justify-content:space-between;gap:10px;font-size:13px}.motion-title span{font-size:11px}.motion-buttons{display:flex;gap:8px}.motion-buttons button{flex:1;background:#f7f6ef;font-size:12px}.motion-buttons button[aria-pressed=true]{background:var(--ink)}input[type=range]{width:100%;accent-color:var(--ink);min-height:40px;cursor:pointer}#layer-controls{padding-top:17px;border-top:1px solid var(--line);margin-top:17px}#layer-controls label{display:flex;justify-content:space-between;font-size:13px}.motion-panel .small{margin-top:10px}.controls{background:#fffdf7;border:1px solid var(--line);padding:23px}.control-section{padding-bottom:20px;margin-bottom:20px;border-bottom:1px solid var(--line)}label{display:block;font-size:12px;font-weight:bold;margin-bottom:9px}select{padding:12px 9px;width:100%;min-height:44px;background:#fffdf7;color:var(--ink);border:1px solid var(--line);border-radius:0;margin-bottom:13px}.fabric-summary{display:flex;gap:13px;align-items:center;margin:15px 0}.fabric-summary img{width:68px;height:68px;object-fit:cover}.fabric-summary span{font-size:10px}.fabric-summary h3{font-size:19px;line-height:1.2;margin-top:5px}.fabric-card button{width:100%;font-size:12px}.fabric-card .small{margin:12px 0}.fabric-card a{font-size:12px;display:block;margin-top:13px}.next-step>p{font-size:12px;margin:13px 0}.next-step h3{font-size:25px}.next-step>button{width:100%;font-size:12px}.next-step details{margin-top:20px;font-size:12px;line-height:1.5}.next-step details p{margin:12px 0}summary{cursor:pointer;min-height:44px;padding:10px 0}.below-scene{display:grid;grid-template-columns:1.1fr 1fr;gap:20px;margin-top:23px}.plan-card,.construction-card{border:1px solid var(--line);padding:22px}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.card-heading h3{font-size:22px}.card-heading span{font-size:10px;color:var(--muted)}#plan{width:100%;max-height:240px;display:block;margin:14px 0;background:#efeee5}.plan-key{display:flex;gap:12px;flex-wrap:wrap;font-size:10px}.plan-card>.small{margin-top:12px}.construction-card>p{font-size:13px;margin:15px 0}.construction-card .small{font-size:11px}.text-button{border:0;border-bottom:1px solid var(--ink);padding:9px 0;font-size:12px}.notice{background:#eee4ce;padding:12px;font-size:12px;line-height:1.5;margin:10px 0}.reference{display:grid;grid-template-columns:1fr 1fr;gap:45px;align-items:center;margin:60px 0}.reference img{width:100%;aspect-ratio:1.5;object-fit:cover}.reference h2{font-size:35px}.reference p{margin:15px 0;font-size:14px}.reference p.small{font-size:12px}footer{margin:55px 0 35px;padding-top:28px;border-top:1px solid var(--line);font-size:13px;line-height:1.6;color:var(--muted)}footer p{margin:12px 0}footer>span{font-size:11px}dialog{border:1px solid var(--line);background:#fffdf7;color:var(--ink);max-width:min(900px,95vw);max-height:90dvh;padding:0;width:900px}dialog::backdrop{background:#14282099;backdrop-filter:blur(4px)}.dialog-shell{padding:30px}.dialog-shell p{margin:18px 0}.close{float:right;font-size:25px}.dialog-actions{display:flex;gap:10px;flex-wrap:wrap}textarea{width:100%;padding:15px;line-height:1.5;font-size:12px;border:1px solid var(--line);background:#f7f6ef;color:var(--ink);resize:vertical;margin-bottom:20px}.fabric-dialog-heading{display:flex;justify-content:space-between;gap:20px;padding:25px;border-bottom:1px solid var(--line)}.fabric-dialog-heading h2{font-size:28px}.fabric-dialog-heading .eyebrow{font-size:10px}.fabric-browser{padding:22px}.fabric-browser input{width:100%;min-height:46px;padding:12px;border:1px solid var(--line);background:#fff}.fabric-filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.fabric-browser-status{font-size:12px;margin:15px 0}.cuk-fabrics{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.cuk-fabric{border:1px solid var(--line);min-width:0}.cuk-fabric img{width:100%;aspect-ratio:1;object-fit:cover}.cuk-fabric__body{padding:14px;font-size:12px}.cuk-fabric__body h3{font-size:21px}.cuk-fabric__body p{margin:7px 0}.cuk-fabric button,.cuk-fabric a{font-size:11px;width:100%;margin-top:7px}.cuk-fabric__actions{display:flex;flex-wrap:wrap}.fabric-pagination{display:flex;justify-content:space-between;margin:20px 0}.fabric-dialog-note{padding:0 22px 22px;font-size:12px}.fabric-clear{font-size:12px}#debug{font-size:11px}#proof{white-space:pre-wrap;overflow-wrap:anywhere}
@media(min-width:1450px){.workspace{grid-template-columns:minmax(0,1fr) 340px}.stage{aspect-ratio:1.6}}
@media(max-width:950px){.workspace{grid-template-columns:minmax(0,1fr) 270px;gap:15px}.controls{padding:17px}.scene-heading{display:block}.scene-nav{margin-top:20px}.below-scene{grid-template-columns:1fr}.purpose-grid{gap:8px}.purpose-grid button{padding:14px 10px;font-size:12px}.stage{aspect-ratio:1.2}}
@media(max-width:700px){main{padding:0 18px}.site-header{height:66px;padding:0 18px}.header-tag{display:none}.brand{font-size:25px}.intro{padding:35px 0 30px;grid-template-columns:1fr;gap:25px}.intro h1{font-size:56px;letter-spacing:-2px}.intro-copy>p{font-size:23px;margin-bottom:12px}.intro-copy>span{font-size:13px}.purpose{padding:22px 0 28px}.purpose h2{font-size:22px}.purpose-grid{grid-template-columns:1fr 1fr}.purpose-grid button{font-size:12px;min-height:72px}.workspace{grid-template-columns:1fr}.scene-nav{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px}.scene-nav button{font-size:10px;padding:10px 6px}.scene-heading h2{font-size:32px}.scene-description{font-size:13px}.stage{aspect-ratio:1.18}.stage-caption{left:8px;right:8px;bottom:8px}.stage-caption span{font-size:9px;padding:6px}.stage-caption span:last-child{max-width:45%}.viewbar button{flex:1;padding:10px 8px;font-size:11px}.motion-panel{padding:16px}.controls{padding:20px}.below-scene{grid-template-columns:1fr 1fr;gap:10px}.plan-card,.construction-card{padding:14px}.card-heading{display:block}.card-heading h3,.construction-card h3{font-size:21px}.construction-card>p{font-size:11px}.construction-card .eyebrow{font-size:9px}.plan-key{gap:5px;font-size:9px}.reference{grid-template-columns:1fr;gap:20px;margin:30px 0}.reference h2{font-size:28px}select,input{font-size:16px}dialog{max-width:100vw;width:100vw;max-height:100dvh;height:100dvh;border:0}.dialog-shell{padding:20px}.cuk-fabrics{grid-template-columns:1fr 1fr}.fabric-dialog-heading{padding:18px}.fabric-dialog-heading h2{font-size:24px}.fabric-browser{padding:16px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Keep the room and its movement controls beside the settings being edited. */
.preview-pane{position:sticky;top:12px;z-index:2;min-width:0;background:var(--paper);box-shadow:0 8px 12px -12px #223f3655}
.preview-pane .stage{aspect-ratio:auto;height:clamp(220px,calc(100dvh - 290px),600px)}
.preview-pane .motion-panel{padding:9px 14px}
.preview-pane .motion-buttons button{min-height:38px;padding:7px 10px}
.preview-pane input[type=range]{min-height:30px}
.preview-pane .viewbar{padding-bottom:8px}
.use-cases{padding:20px 24px;margin:0 0 26px;border:1px solid var(--line);background:#eceee4;display:grid;grid-template-columns:1fr 1.5fr;gap:12px 25px}
.use-cases .eyebrow{margin-bottom:8px}
.use-cases h3{font-size:24px}
.use-cases ul{margin:0;padding-left:20px;display:grid;gap:10px;font-size:13px;line-height:1.5}
.use-cases>.small{grid-column:1/-1}
.heading-label{font-size:12px;margin:16px 0 8px}
@media(max-width:700px){
  .preview-pane{top:0;margin:0 -6px;padding:6px;box-shadow:0 5px 12px #223f3622}
  .preview-pane .stage{height:clamp(135px,27dvh,235px)}
  .preview-pane .motion-panel{padding:10px 12px}
  .preview-pane .viewbar button{min-height:40px;padding:8px 6px}
  .preview-pane .motion-buttons button{padding:8px;min-height:40px}
  .preview-pane #layer-controls{padding-top:6px;margin-top:6px}
  .preview-pane input[type=range]{min-height:32px}
  .use-cases{grid-template-columns:1fr;padding:18px;gap:15px}
}
@media(max-height:550px){.preview-pane .stage{height:clamp(160px,calc(100dvh - 290px),320px)}}
@media(max-height:380px){.preview-pane{position:relative;top:auto}}

.material-choices{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}
.material-choices button{display:flex;flex-direction:column;gap:6px;padding:10px 6px;text-align:center}
.material-choices strong{font-size:12px}.material-choices small{font-size:10px;line-height:1.3;font-weight:normal}
.material-swatch{display:block;width:100%;height:42px;background-color:#f5f0e5;border:1px solid #d9d9cc}
.material-swatch.fabric{background:repeating-linear-gradient(90deg,#b6b69a 0,#dedbc5 8px,#a4a88f 15px)}
.material-swatch.voile{background:repeating-linear-gradient(90deg,#cbd8cc88 0,#fff9 5px,#d6dfce88 10px),linear-gradient(25deg,#798f77 45%,#e6e4d4 46%)}
.material-swatch.ball{background:radial-gradient(circle at 50% 50%,#ddd 0,#a98d62 2px,#5d685e 3px,transparent 3.5px) 0 0/10px 8px,#f5f0e5}
.material-swatch.linked{background:radial-gradient(ellipse at 50% 50%,transparent 2px,#9a8e75 2.5px,#d6c6a0 4px,transparent 4.5px) 0 0/12px 10px,#f5f0e5}
.material-swatch.layered{background:repeating-linear-gradient(90deg,#b6b69a 0,#dedbc5 7px,#a4a88f 13px) left/45% 100% no-repeat,repeating-linear-gradient(90deg,#cedbc6 0,#fff 5px,#dfdfd5 10px)}
.material-swatch.mixed{background:linear-gradient(90deg,#cbd8cbbb 50%,transparent 50%),radial-gradient(circle,#c2b086 2px,transparent 3px) 0 0/10px 8px,#f5f0e5}
@media(min-width:701px){.preview-pane.has-layer .stage{height:clamp(180px,calc(100dvh - 390px),500px)}}
