.demo-page .header{height:86px}.demo-heading{display:flex;align-items:end;justify-content:space-between;gap:35px;padding:28px 0 22px}.demo-heading h1{font-size:clamp(2.25rem,3.5vw,3.6rem);margin-top:8px;letter-spacing:-.05em}.demo-heading>p{font-size:14px;line-height:1.65;color:var(--muted);max-width:39ch}.demo-shell{border:1px solid var(--line);background:var(--white);display:grid;grid-template-columns:minmax(0,1fr) 338px;min-height:594px;margin-bottom:21px}.model-column{min-width:0;position:relative;border-right:1px solid var(--line);display:flex;flex-direction:column;background:#f0f2eb}.model-topbar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 19px;position:relative;z-index:2;background:#f8f9f4;border-bottom:1px solid var(--line)}.model-title{font-size:14px}.model-title small{font-size:12px;color:var(--muted);margin-left:10px}.scene-status{font-size:12px;color:var(--accent)}.model-viewport{width:100%;height:385px;min-height:280px;position:relative;overflow:hidden;flex:1;isolation:isolate}.model-viewport canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline-offset:-4px}.model-viewport canvas:active{cursor:grabbing}.model-loading{position:absolute;inset:0;display:grid;place-content:center;text-align:center;background:#f0f2eb;z-index:3;color:var(--muted);font-size:14px}.model-loading[hidden]{display:none}.loading-line{width:80px;height:2px;background:var(--line);margin:16px auto;overflow:hidden}.loading-line:after{content:'';display:block;width:30px;height:2px;background:var(--accent);animation:load-slide 1.4s ease-in-out infinite}@keyframes load-slide{50%{transform:translateX(50px)}}.software-note{position:absolute;bottom:10px;left:14px;z-index:2;font-size:12px;color:var(--muted);background:#fafbf5d9;padding:3px 7px;pointer-events:none}.canvas-caption{position:absolute;left:21px;top:19px;z-index:2;pointer-events:none;font-size:12px;color:var(--muted);line-height:1.5}.canvas-caption strong{font-size:14px;font-weight:400;display:block;color:var(--ink);margin-top:3px}.canvas-hint{position:absolute;right:16px;bottom:12px;z-index:2;font-size:12px;color:#626963;background:#fafbf5d9;padding:3px 7px;pointer-events:none}.camera-tools{display:flex;align-items:center;gap:6px;position:absolute;right:15px;top:15px;z-index:2}.camera-tools button{background:#fcfcfadf;border:1px solid #cdd4c7;padding:7px 10px;font-size:12px;min-height:34px;line-height:1.4}.camera-tools button:hover,.camera-tools button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}.model-controls{border-top:1px solid var(--line);background:var(--white);padding:13px 18px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.control-label{font-size:12px;color:var(--muted);display:block;margin-bottom:4px}.model-controls select,.phase-select{width:100%;border:1px solid var(--line);padding:8px 10px;background:var(--paper);font-family:var(--sans);font-size:14px;color:var(--ink);min-height:39px;border-radius:0}.control-bottom{display:flex;align-items:center;justify-content:space-between;gap:14px;border-top:1px solid var(--line);padding:10px 18px;background:#fcfcfa}.toggle-label{display:flex;align-items:center;gap:8px;font-size:12px;cursor:pointer;white-space:nowrap}.toggle-label input{accent-color:var(--accent);width:15px;height:15px;margin:0}.control-bottom button{font-size:12px;background:none;border:0;padding:5px 0;border-bottom:1px solid #acb6a4}.guide-column{min-width:0;padding:20px 24px;display:flex;flex-direction:column}.guide-kicker{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;font-size:12px;color:var(--muted)}.guide-kicker span:first-child{color:var(--accent);letter-spacing:.08em;text-transform:uppercase}.phase-select{margin-bottom:13px}.guide-column h2{font-size:26px;line-height:1.2;margin:0 0 11px;letter-spacing:-.03em}.guide-intro{font-size:14px;line-height:1.65;color:var(--muted);margin-bottom:13px}.guide-tabs{display:flex;border-bottom:1px solid var(--line);gap:21px;margin:2px 0 11px}.guide-tabs button{padding:8px 0;border:0;background:transparent;font-size:14px;color:var(--muted);border-bottom:2px solid transparent;line-height:1.5}.guide-tabs button[aria-selected=true]{color:var(--ink);border-bottom-color:var(--accent)}.guide-panel[hidden]{display:none}.step-checklist{padding:0;margin:0;list-style:none}.step-checklist li{border-bottom:1px solid #e4e7df}.step-checklist label{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.5;cursor:pointer;padding:10px 0}.step-checklist input{width:16px;height:16px;flex-shrink:0;accent-color:var(--accent);margin:3px 0 0}.guide-panel .materials-list{font-size:14px;line-height:1.5;list-style:none;padding:0;margin:0}.materials-list li{padding:10px 0;border-bottom:1px solid var(--line)}.guide-panel .muted-info{font-size:12px;color:var(--muted);margin-top:12px;line-height:1.6}.question-box{border-left:2px solid var(--accent);padding-left:13px;margin-top:16px;font-size:12px;color:var(--muted);line-height:1.65}.question-box strong{display:block;color:var(--ink);font-weight:400;margin-bottom:3px}.stage-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:20px;margin-top:auto}.stage-nav button{font-size:14px;padding:9px 14px;border:1px solid var(--line);background:var(--paper)}.stage-nav button.next{background:var(--ink);border-color:var(--ink);color:#fff}.stage-nav button:disabled{opacity:.4;cursor:default}.progress-track{height:2px;background:var(--line);margin-top:18px}.progress-track span{height:100%;background:var(--accent);display:block;width:0;transition:width .2s}.session-note{font-size:12px;color:var(--muted);display:flex;justify-content:space-between;margin-top:8px;gap:10px}.part-details{background:var(--white);position:absolute;left:18px;bottom:39px;width:min(335px,calc(100% - 36px));padding:16px 18px;box-shadow:0 5px 25px #20302e12;border:1px solid var(--line);z-index:5}.part-details[hidden]{display:none}.part-details p{font-size:12px;color:var(--muted);line-height:1.5}.part-details h3{font-size:15px;line-height:1.4;margin:6px 23px 7px 0;font-weight:400}.part-details .part-close{position:absolute;right:8px;top:7px;border:0;background:none;font-size:23px;line-height:1;padding:5px}.demo-foot{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:2px 0 27px}.demo-foot p{font-size:12px;line-height:1.65;color:var(--muted);max-width:84ch}.demo-foot .text-link{flex-shrink:0}.model-column:fullscreen{border:0;width:100%;height:100%;background:#f0f2eb;display:flex}.model-column:fullscreen .model-viewport{height:auto;flex:1}.model-column:fullscreen .model-topbar{padding:19px 25px}.model-column:fullscreen .model-controls{max-width:none;grid-template-columns:1fr 1fr;padding-left:25px;padding-right:25px}.model-column:fullscreen .control-bottom{padding-left:25px;padding-right:25px}.showcase-intro{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:20px}.showcase-intro h2{font-size:31px;line-height:1.25;letter-spacing:-.035em}.showcase-intro p{font-size:14px;color:var(--muted);margin-top:6px}.model-showcase{border-top:1px solid var(--line);padding:31px 0 35px}.showcase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.showcase-card{margin:0}.showcase-card button{display:block;padding:0;border:1px solid var(--line);width:100%;background:var(--soft);position:relative;overflow:hidden;cursor:zoom-in}.showcase-card img{width:100%;height:auto;aspect-ratio:1.6;object-fit:cover;transition:transform .25s}.showcase-card button:hover img{transform:scale(1.025)}.showcase-card button:after{content:'↗';position:absolute;right:9px;bottom:8px;font-size:17px;color:var(--ink);background:#ffffffe6;padding:0 7px}.showcase-card figcaption{display:flex;align-items:baseline;gap:10px;padding-top:11px;font-size:14px}.showcase-card figcaption span{font-size:12px;color:var(--accent)}.gallery-caption{font-size:12px;color:var(--muted);margin-top:16px}.gallery-dialog{width:min(1050px,calc(100% - 35px));border:1px solid var(--line);padding:0;background:var(--paper);color:var(--ink);max-height:94vh}.gallery-dialog::backdrop{background:#172622b8;backdrop-filter:blur(4px)}.gallery-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 19px;border-bottom:1px solid var(--line);font-size:14px}.gallery-bar button{background:none;border:0;padding:5px;font-size:24px;line-height:1}.gallery-dialog img{width:100%;max-height:70vh;object-fit:contain;background:var(--soft)}.gallery-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:13px 19px;font-size:12px;color:var(--muted)}.gallery-bottom button{font-size:14px;padding:5px 10px;background:none;border:1px solid var(--line);color:var(--ink)}.home-demo-link{border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:30px;padding:21px 0 29px}.home-demo-link h2{font-size:27px;line-height:1.25;letter-spacing:-.035em}.home-demo-link p{font-size:14px;color:var(--muted);margin-top:5px}.home-demo-link .text-link{flex-shrink:0}.demo-ready{font-size:12px;color:var(--muted)}
@media(min-width:1500px){.demo-shell{min-height:652px}.model-viewport{min-height:430px}}
@media(max-width:1100px){.demo-shell{grid-template-columns:minmax(0,1fr) 306px}.guide-column{padding:18px}.canvas-caption{left:14px;top:14px}.canvas-caption strong{font-size:12px}.camera-tools{right:11px;top:11px;gap:4px}.camera-tools button{padding:6px 8px}.canvas-hint{right:12px;bottom:34px;font-size:12px}.showcase-grid{gap:14px}.navigation{gap:23px}.header-note{display:none}}
@media(max-width:760px){.demo-page .header{height:78px}.demo-page .navigation{top:77px}.demo-heading{padding:23px 0 17px;display:block}.demo-heading h1{font-size:2.6rem}.demo-heading>p{font-size:14px;margin-top:12px;max-width:47ch}.demo-shell{grid-template-columns:1fr;margin-bottom:16px}.model-column{border-right:0;border-bottom:1px solid var(--line)}.model-topbar{padding:10px 13px}.model-title{font-size:13px}.model-title small{display:none}.scene-status{font-size:12px}.model-viewport{height:330px;min-height:330px;flex:auto}.canvas-caption{top:14px;left:13px}.camera-tools{top:auto;right:11px;bottom:13px}.camera-tools button{padding:7px 10px;background:#ffffffe8}.canvas-hint{bottom:auto;top:53px;left:10px;right:auto;font-size:12px;background:none}.software-note{bottom:13px;left:8px;font-size:12px;max-width:135px;line-height:1.35}.model-controls{padding:11px 12px;gap:10px}.control-bottom{padding:9px 12px;gap:9px;flex-wrap:wrap}.toggle-label{font-size:12px}.guide-column{padding:19px}.guide-column h2{font-size:27px}.guide-intro{font-size:14px}.guide-kicker{margin-bottom:10px}.phase-select{margin-bottom:14px}.guide-tabs{margin-top:0}.stage-nav{padding-top:18px}.demo-foot{display:block;padding-bottom:22px}.demo-foot .text-link{margin-top:14px}.part-details{bottom:55px}.model-showcase{padding:25px 0}.showcase-intro{display:block;margin-bottom:17px}.showcase-intro h2{font-size:28px}.showcase-intro .text-link{margin-top:12px}.showcase-grid{grid-template-columns:1fr;gap:22px}.showcase-card img{aspect-ratio:1.7}.showcase-card figcaption{font-size:14px;padding-top:8px}.home-demo-link{padding:21px 0;display:block}.home-demo-link h2{font-size:25px}.home-demo-link .text-link{margin-top:12px}.gallery-bottom{gap:10px;padding:11px 12px}.gallery-bottom button{font-size:13px}.gallery-dialog{width:calc(100% - 24px)}.model-column:fullscreen .model-viewport{min-height:240px}.model-column:fullscreen .model-controls{padding:10px 12px}.model-column:fullscreen .control-bottom{padding:8px 12px}}
@media(prefers-reduced-motion:reduce){.loading-line:after{animation:none}.showcase-card img,.progress-track span{transition:none}}

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.session-note button{font-size:12px;background:none;border:0;border-bottom:1px solid #acb6a4;padding:0}.demo-ready{margin-top:5px}.workbook-details{border-top:1px solid var(--line);margin-bottom:28px}.workbook-details>summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:19px 0;cursor:pointer;font-size:16px;list-style:none}.workbook-details>summary::-webkit-details-marker{display:none}.workbook-details>summary:after{content:'+';color:var(--accent);font-size:23px}.workbook-details[open]>summary:after{content:'−'}.workbook-details>summary .quiet-note{margin-left:auto}.workbook-details[open]>.pack-layout{padding-top:13px}.guide-intro:empty{display:none}
@media(max-width:760px){.showcase-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.showcase-card img{aspect-ratio:1;object-fit:cover}.showcase-card figcaption{display:block;font-size:12px;line-height:1.5}.showcase-card figcaption span{display:block;margin-bottom:2px}.showcase-card button:after{font-size:13px;right:4px;bottom:4px;padding:0 4px}.workbook-details>summary{font-size:14px}.workbook-details>summary .quiet-note{display:none}.showcase-intro .button{margin-top:16px}.demo-heading h1{font-size:2.45rem}}

.model-dialog{width:calc(100% - 44px);height:calc(100% - 44px);max-width:1440px;max-height:none;border:1px solid var(--line);padding:0;background:#f0f2eb;color:var(--ink)}.model-dialog::backdrop{background:#20302eaa}.model-dialog .model-column{width:100%;height:100%;border:0}.model-dialog .model-viewport{min-height:0;height:auto;flex:1}.model-dialog .model-controls{flex-shrink:0}.model-dialog .model-topbar{flex-shrink:0}.model-dialog .control-bottom{flex-shrink:0}

/* Readable against the natural lighting environment. */
.canvas-caption{background:#fafbf5e8;padding:8px 11px;border:1px solid #ffffff70;backdrop-filter:blur(8px)}
@media(max-width:760px){.canvas-hint{display:none}}