/* Visual comparison surfaces, scoped to preserve detailed research documents. */
.nav-tree{margin:4px 0}.nav-tree>summary,.nav-subtree>summary{min-height:44px;padding:10px 12px;cursor:pointer;font-size:.9375rem;font-weight:700;border-radius:8px;list-style:none;display:flex;align-items:center;gap:8px}.nav-tree>summary:after,.nav-subtree>summary:after{content:'';width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);margin:0 6px 3px auto}.nav-tree[open]>summary:after,.nav-subtree[open]>summary:after{transform:rotate(225deg);margin-bottom:-3px}.nav-tree summary:hover{background:#e0e8de}.nav-tree.active-tree>summary{color:var(--teal)}.nav-tree summary small{font-size:.6875rem;font-weight:400;color:var(--muted)}.nav-children{padding:0 0 4px 14px;display:flex;flex-direction:column;gap:4px}#main-nav .nav-children a{font-size:.875rem}.nav-subtree>summary{font-size:.8125rem;color:var(--muted);font-weight:600}.nav-subtree .nav-children{padding-left:10px}.research-tree{border-top:1px solid var(--line);padding-top:12px;margin-top:12px}.sidebar-note{margin-top:32px}
body[data-surface=visual] .reader-layout{display:block}body[data-surface=visual] .page-outline{display:none}body[data-surface=visual] #reading-tools{margin-bottom:24px}body[data-surface=visual] #reading-status{color:var(--teal)}
.studio-intro{margin-bottom:24px}.studio-intro p{font-size:var(--reading-size);line-height:1.85;color:var(--muted);max-width:75ch;margin-top:16px}.studio-tabs{display:flex;flex-direction:row;flex-wrap:wrap;gap:8px 24px;border-bottom:1px solid var(--line);margin:24px 0 32px}.studio-tabs a{min-height:48px;padding:10px 0;border-radius:0;font-size:1rem;color:var(--muted);border-bottom:3px solid transparent}.studio-tabs a[aria-current=page]{border-color:var(--teal);color:var(--teal);font-weight:700}.studio-tabs a:hover{background:transparent;color:var(--teal)}.studio-section{margin:48px 0}.studio-section>h2{margin-bottom:24px}.section-copy{font-size:1rem;color:var(--muted);max-width:75ch;margin:0 0 24px;line-height:1.85}.capture-coverage{display:flex;align-items:center;flex-wrap:wrap;gap:16px 24px;padding:20px 0;border-bottom:1px solid var(--line)}.capture-coverage>div{display:flex;flex-direction:column;gap:4px}.capture-coverage strong{font-size:.9375rem}.capture-coverage span{font-size:.8125rem;color:var(--muted)}progress{accent-color:var(--teal);height:10px;max-width:100%;width:160px}.capture-coverage .text-link{margin-left:auto}
.motion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.motion-card{min-width:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface)}.motion-stage{background:#edf2e8;aspect-ratio:320/190;overflow:hidden;display:grid;place-items:center}.motion-stage svg{width:100%;max-height:240px}.motion-info{padding:20px}.motion-info h3{font-size:1.0625rem}.motion-info>p{font-size:.9375rem;color:var(--muted);margin-top:10px;line-height:1.75}.motion-timing{font-size:.8125rem;color:#6c512f;border-top:1px solid var(--line);padding-top:12px;margin-top:16px;min-height:55px}.motion-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}.motion-actions .button{font-size:.8125rem}.motion-actions .source-button{font-size:.8125rem}.capture-slot{border-top:1px solid var(--line);margin-top:16px;padding-top:8px}.capture-slot summary{cursor:pointer;min-height:44px;padding:8px 0;font-size:.875rem;color:var(--teal)}.capture-slot>p{font-size:.75rem;margin-top:8px;color:var(--muted);overflow-wrap:anywhere}.capture-slot code{font-size:.75rem}
.scene-grid rect{fill:#f7f9f3;stroke:#bccbbb;stroke-width:1}.scene-item{fill:#d6e7c9;stroke:#486f43;stroke-width:1.6}.scene-mark{stroke:#486f43;stroke-width:1.6}.scene-result .scene-item{fill:#f0dcb4;stroke:#846133}.scene-route{fill:none;stroke:#9bae97;stroke-width:1.5}.motion-stage text,.interaction-stage text{font:12px var(--font);fill:#526158}.scene-bubble{fill:#f3fafc90;stroke:#577d83;stroke-width:2;opacity:0}.scene-lock{fill:#c5d4be;stroke:#6d8463;stroke-width:2;opacity:0}.scene-device{fill:#f7f9f3;stroke:#a8b7aa;stroke-width:1.5}.scene-hud rect{fill:#bfd6b1}.scene-window rect{fill:white;stroke:#6e9074;stroke-width:1.5}.scene-window path{stroke:#9aab98;stroke-width:2}.scene-queue rect{fill:#e0e7da;stroke:#a8b7aa}.scene-queue path{stroke:#6e9074;stroke-width:1.5}.scene-focus{fill:#f4dfad90;stroke:#a47b3a;stroke-dasharray:4 4;stroke-width:2}.scene-a,.scene-b,.scene-result,.scene-hud,.scene-window,.scene-bubble{transform-box:fill-box;transform-origin:center}
.demo-merge .scene-result,.demo-generate .scene-b,.demo-drag .scene-b,.demo-bubble .scene-b,.demo-hint .scene-result,.demo-cooldown .scene-b,.demo-unlock .scene-b,.demo-reward .scene-b{opacity:0}.demo-bubble .scene-bubble{opacity:1}.demo-unlock .scene-lock{opacity:1}.demo-generate .scene-result{opacity:.4}.demo-cooldown .scene-bubble{opacity:1;stroke-dasharray:130 110}.demo-window .scene-window{opacity:.65}
.playing.demo-merge .scene-a{animation:merge-in .4s ease-out forwards}.playing.demo-merge .scene-b{animation:merge-away .4s ease-out forwards}.playing.demo-merge .scene-result{animation:item-pop .4s ease-out forwards}.playing.demo-generate .scene-result{animation:generated 1s ease-out forwards}.playing.demo-drag .scene-a{animation:drag-item 1.2s ease-in-out forwards}.playing.demo-bubble .scene-bubble{animation:bubble-out .7s ease-out forwards}.playing.demo-hint .scene-a,.playing.demo-hint .scene-b{animation:hint-item .8s ease-in-out 2}.playing.demo-cooldown .scene-bubble{animation:cooldown 1.5s linear forwards}.playing.demo-unlock .scene-lock{animation:bubble-out .6s ease-out forwards}.playing.demo-reward .scene-a{animation:reward-fly 1.2s ease-out forwards}.playing.demo-window .scene-window,.playing.demo-mask .scene-window{animation:window-open 1.5s ease-out forwards}.playing.demo-queue .scene-window{animation:window-open 1.7s ease-out forwards}.playing.demo-hud .scene-hud{animation:hud-shift 1.6s ease-in-out forwards}.playing.demo-tutorial .scene-focus{animation:focus-pulse 1.2s ease-in-out forwards}
@keyframes merge-in{to{translate:96px 0;opacity:0}}@keyframes merge-away{0%,24%{opacity:1}100%{opacity:0}}@keyframes item-pop{0%,24%{opacity:0;scale:.3}75%{opacity:1;scale:1.3}100%{opacity:1;scale:1}}@keyframes generated{0%{opacity:0;translate:-175px 0;scale:.4}60%{translate:0 -20px;scale:1.1}100%{opacity:1;translate:0 0;scale:1}}@keyframes drag-item{0%{translate:0 0}70%{translate:190px -12px}100%{translate:192px 0}}@keyframes bubble-out{70%{scale:1.25;opacity:.5}100%{scale:1.4;opacity:0}}@keyframes hint-item{50%{translate:8px 0;scale:1.12}}@keyframes cooldown{to{stroke-dasharray:240 0}}@keyframes reward-fly{40%{translate:70px -25px;scale:.8}100%{translate:192px -40px;scale:.3;opacity:0}}@keyframes window-open{0%{opacity:0;scale:.8}20%,70%{opacity:1;scale:1}100%{opacity:0;scale:.8}}@keyframes hud-shift{40%,65%{translate:0 -20px;opacity:.2}100%{translate:0 0;opacity:1}}@keyframes focus-pulse{50%{stroke-width:4;fill:#f4dfad}100%{stroke-width:2}}
.visual-toolbar{display:grid;grid-template-columns:minmax(170px,1fr) minmax(180px,1fr) minmax(140px,.7fr);gap:16px;padding:20px 0}.visual-toolbar label{display:flex;flex-direction:column;gap:8px;font-size:.875rem;font-weight:650}.visual-toolbar input,.visual-toolbar select{width:100%;font-size:.9375rem}.catalog-scope{font-size:.875rem;color:var(--muted);margin:0 0 24px}.type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.type-card,.ui-registry-card{min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden}.type-card-body{padding:16px}.type-card h3{font-size:1rem;word-break:break-all}.type-card .badge{margin-top:8px}.type-card p{font-size:.875rem;color:var(--muted);margin-top:10px}.type-card small{display:block;font-size:.75rem;color:var(--muted);margin-top:8px;overflow-wrap:anywhere}.type-card details{margin-top:12px;font-size:.8125rem}.type-card summary{cursor:pointer;min-height:44px;padding:8px 0;color:var(--teal)}.type-card code{display:block;font-size:.6875rem;overflow-wrap:anywhere;margin-top:8px}.media-wait{min-height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:#edf1e8;padding:20px;color:#60725b}.media-wait>svg{width:44px;height:44px}.media-state{font-size:.75rem;color:var(--muted);border:1px dashed #a8b6a3;border-radius:5px;padding:3px 8px}.type-shape{display:flex;flex-direction:column;align-items:center;gap:4px}.type-shape strong{font:650 1.75rem var(--mono);color:var(--teal)}.type-shape span{font-size:.75rem;color:var(--muted)}.media-open{display:block;position:relative;width:100%;min-height:160px;aspect-ratio:16/10;border:0;background:#edf1e8;padding:0;color:var(--teal)}.media-open img{width:100%;height:100%;object-fit:contain}.media-view-label{position:absolute;right:12px;bottom:12px;background:var(--teal);color:white;padding:6px 10px;border-radius:6px;font-size:.8125rem}.media-format{font-size:1.25rem;font-weight:700}.gallery-pagination{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:24px;font-size:.875rem;color:var(--muted)}.gallery-pagination>div{display:flex;gap:8px}
.research-overview{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0;margin:32px 0}.research-overview p{font-size:1rem;color:var(--muted);margin-top:12px}.research-overview svg{width:24px;height:24px;flex:none}.research-index-section{margin:48px 0}.research-index-section>h2{margin-bottom:24px}.research-list{display:grid;grid-template-columns:1fr 1fr;gap:0 36px}.research-list>a{padding:24px 0;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px}.research-list h3{font-size:1.125rem}.research-list p{font-size:.9375rem;line-height:1.75;margin-top:8px;color:var(--muted)}.research-list a:hover h3{color:var(--teal);text-decoration:underline}.research-list span{display:flex;align-items:center;gap:12px;flex:none;font-size:.875rem;color:var(--muted)}.research-list svg{width:20px;height:20px;flex:none}
.scenario-switch{display:flex;gap:8px;flex-wrap:wrap;margin:24px 0}.scenario-switch button[aria-pressed=true]{background:var(--teal);color:white}.interaction-comparison{display:grid;grid-template-columns:1.4fr 1fr;gap:32px;align-items:center;border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:24px}.interaction-stage{background:#edf2e8;min-width:0}.interaction-stage svg{width:100%}.interaction-comparison p{font-size:1rem;color:var(--muted);margin:16px 0}.interaction-comparison .source-button{display:block}.decision-flow{list-style:none;padding:0;display:flex;gap:12px;flex-wrap:wrap;counter-reset:decision}.decision-flow li{counter-increment:decision;display:flex;align-items:center;gap:12px;padding:12px 16px;background:var(--teal-soft);border-radius:8px;font-size:1rem}.decision-flow li:before{content:counter(decision);font-size:.8125rem;color:var(--teal)}
.difficulty-lab{display:grid;grid-template-columns:minmax(0,2fr) minmax(220px,1fr);gap:32px;border-bottom:1px solid var(--line);padding:24px 0 32px;margin-bottom:24px}.depth-chart{height:300px;display:flex;gap:8px;align-items:flex-end;border-bottom:1px solid #859b8b;padding-bottom:0}.depth-chart>div{flex:1;min-width:0;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;position:relative}.depth-chart i{display:block;width:100%;height:var(--bar);max-height:220px;background:var(--teal);border-radius:4px 4px 0 0;min-height:4px}.depth-chart span{font:.6875rem var(--mono);color:var(--muted)}.depth-chart small{font-size:.75rem;color:var(--muted);position:absolute;bottom:-28px}.depth-control{padding:24px;background:var(--teal-soft);border-radius:12px}.depth-control label{font-weight:650;font-size:.9375rem}.depth-control input{margin:12px 0}.depth-control strong{display:block;font-size:2.5rem;color:var(--teal);font-variant-numeric:tabular-nums}.depth-control strong span{font-size:1rem;margin-left:8px}.depth-control p{font-size:1rem;color:var(--muted);margin:12px 0}.pressure-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.pressure-grid article{border-top:1px solid var(--line);padding-top:24px}.pressure-grid p{font-size:1rem;color:var(--muted);margin:12px 0}.pressure-diagram{height:120px;margin-bottom:20px;background:#edf2e8;display:flex;align-items:center;justify-content:center;gap:8px;padding:20px}.pressure-depth i{background:var(--teal);width:22px;height:20px}.pressure-depth i:nth-child(2){height:35px}.pressure-depth i:nth-child(3){height:55px}.pressure-depth i:nth-child(4){height:80px}.pressure-time svg{height:80px;width:80px;color:var(--teal)}.pressure-space{display:grid;grid-template-columns:repeat(4,22px);gap:6px}.pressure-space i{height:22px;width:22px;background:#8ca57d;border-radius:4px}.pressure-space i:nth-child(n+10){background:transparent;border:1px solid #8ca57d}
.ui-entry-links{display:grid;grid-template-columns:1fr 1fr;gap:32px}.ui-entry-links a{position:relative;display:block;border-bottom:1px solid var(--line);padding:12px 36px 24px 0}.ui-entry-links h2{font-size:1.375rem}.ui-entry-links p{font-size:1rem;color:var(--muted);margin-top:8px}.ui-entry-links svg{position:absolute;right:0;top:24px;width:22px;height:22px}.ui-registry-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.ui-registry-card>div:last-child{padding:16px}.ui-registry-card h3{font-size:.9375rem;word-break:break-all}.ui-registry-card p{font-size:.8125rem;color:var(--muted);margin:12px 0}.ui-registry-card details{font-size:.8125rem}.ui-registry-card summary{cursor:pointer;min-height:44px;padding:8px 0;color:var(--teal)}.ui-registry-card code{display:block;font-size:.6875rem;overflow-wrap:anywhere;margin:8px 0}.ui-registry-card .media-wait{min-height:140px}.ui-anatomy{display:grid;grid-template-columns:minmax(250px,380px) minmax(0,1fr);gap:48px;align-items:start}.anatomy-screen{position:relative;aspect-ratio:9/16;border:1px solid #a8b6a3;border-radius:20px;background:#e9eee1;padding:48px 12px 12px;display:grid;grid-template-columns:1fr 1.4fr 1fr;grid-template-rows:60px 1fr 55px 50px;gap:10px}.screen-caption{position:absolute;top:14px;width:100%;left:0;text-align:center;font-size:.8125rem;color:var(--muted)}.anatomy-region{border:1px dashed #8ba582;background:#f6f8f0;border-radius:8px;font-size:.875rem;padding:8px;color:#39563c}.anatomy-region:hover,.anatomy-region[aria-pressed=true]{background:var(--teal);color:white;border-style:solid;border-color:var(--teal)}.region-top{grid-column:1/-1}.region-left{grid-column:1}.region-center{grid-column:2}.region-right{grid-column:3}.region-bottom{grid-column:1/-1}.region-overlay{grid-column:1/-1}.region-inspector{padding:24px;background:var(--surface);border:1px solid var(--line);border-radius:12px}.region-inspector p{font-size:var(--reading-size);color:var(--muted);margin:16px 0;line-height:1.85}.region-capture-note{font-size:.875rem;color:var(--muted);padding-top:16px;border-top:1px solid var(--line);margin-top:16px}.layer-chart{max-width:800px}.layer-chart>div{display:grid;grid-template-columns:170px minmax(0,1fr) 70px;gap:16px;align-items:center;margin:16px 0}.layer-chart strong{font-size:.875rem}.layer-line{height:20px;background:var(--teal);width:var(--layer);max-width:100%;border-radius:3px}.layer-chart code{font-size:.8125rem;text-align:right}
.journey-steps{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.journey-steps li{font-size:.875rem;padding:8px 12px;border-radius:6px;color:var(--muted);background:#e9eee4}.journey-steps li.current{background:var(--teal);color:white;font-weight:700}.journey-steps li.visited{background:#dcebd8;color:#385c3a}.experience-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px 0 24px}.experience-toolbar>span{font-size:.875rem;color:var(--muted);margin-right:auto}.experience-scene{background:#edf2e8;border:1px solid var(--line);border-radius:16px;padding:32px;min-height:480px}.experience-loading,.experience-title{max-width:520px;margin:40px auto;text-align:center}.experience-loading p,.experience-title p{font-size:1rem;color:var(--muted);margin:16px 0 24px}.experience-loading progress{width:100%;height:12px}.experience-loading ol{list-style:none;text-align:left;padding:0;margin:24px 0;color:var(--muted);font-size:1rem}.experience-loading li{padding:8px;border-bottom:1px solid var(--line)}.experience-title h2{font-size:2rem}.experience-title>span{display:block;font-size:.8125rem;color:var(--muted);margin-top:24px}.title-board-diagram{display:grid;grid-template-columns:repeat(3,24px);gap:4px;width:max-content;margin:0 auto 24px}.title-board-diagram i{width:24px;height:24px;border:1px solid #7e9e78;background:#bad1ac;border-radius:5px}.title-board-diagram i:nth-child(2n){background:#ead8b3}.play-hud{display:flex;justify-content:space-between;gap:12px;border-bottom:1px solid #bfceba;padding:8px 0 16px;margin-bottom:20px}.play-hud span{font-size:.875rem;color:var(--muted)}.play-hud strong{font-size:1.25rem;margin-left:8px;color:var(--ink);font-variant-numeric:tabular-nums}.experience-game{max-width:520px;margin:auto}.play-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;max-width:500px;margin:auto}.play-cell{aspect-ratio:1;min-width:0;min-height:44px;border:1px solid #b6c5ac;border-radius:7px;background:#f8faf3;display:flex;align-items:center;justify-content:center;padding:4px}.play-cell:hover{background:#e0ead6;border-color:var(--teal)}.play-cell.selected{outline:3px solid #a15c34;background:#fff1d2;outline-offset:0}.play-item{position:relative;display:block;width:100%;max-width:38px;color:#79552e}.play-item.tea{color:#386c52}.play-item svg{display:block;width:100%;height:100%}.play-item b{position:absolute;bottom:-2px;right:-2px;font:.75rem var(--mono);background:var(--surface);border-radius:3px;padding:0 3px;color:var(--ink)}.play-controls{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:20px}.play-controls .button{font-size:.875rem}.tutorial-guide{padding:16px;background:#fff3d6;border:1px solid #ddc48e;border-radius:8px;margin-bottom:20px}.tutorial-guide p{font-size:.9375rem;margin-top:8px;color:#72572f}.tutorial-target{outline:3px solid #aa642b;outline-offset:0;background:#fff0ce}.play-order{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:20px;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:12px}.play-order>span{font-size:.8125rem;color:var(--muted)}.play-order strong{font-size:.9375rem}.play-order .button{margin-left:auto}.experience-feedback{padding:20px 0;border-bottom:1px solid var(--line);color:var(--teal);font-size:1rem;min-height:70px}.experience-boundary{font-size:.9375rem;margin-top:24px;color:var(--muted)}.experience-boundary summary{min-height:44px;color:var(--teal);cursor:pointer;padding:8px 0}.experience-boundary p{margin:12px 0;max-width:85ch}.experience-main,.experience-home{max-width:900px;margin:auto}.main-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:24px}.main-loop{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:32px 0 0;font-size:.9375rem;color:var(--muted)}.main-loop svg{width:20px;height:20px}.home-scene{--wall:#dbe6d0;--floor:#c8bba6;position:relative;aspect-ratio:1.4;max-width:640px;width:100%;margin:auto;overflow:hidden;border:1px solid #c1ceb9;border-radius:12px;background:#e2e8d9}.home-scene.style-sand{--wall:#ebdfc5;--floor:#bdb19f}.room-wall{position:absolute;inset:0 0 40%;background:#cdd2c3}.home-level-2 .room-wall,.home-level-3 .room-wall{background:var(--wall)}.room-wall>span{position:absolute;top:12px;left:16px;font-size:.8125rem;color:#53614d}.room-window{position:absolute;width:25%;height:48%;top:32%;left:20%;background:#f8fcf0;border:7px solid #a3b199;border-radius:6px}.room-window:before{content:'';position:absolute;height:100%;left:48%;border-left:3px solid #a3b199}.room-window:after{content:'';position:absolute;width:100%;top:48%;border-top:3px solid #a3b199}.room-floor{position:absolute;inset:60% 0 0;background:#b7baaa}.home-level-1 .room-floor,.home-level-2 .room-floor,.home-level-3 .room-floor{background:var(--floor)}.room-trim{position:absolute;inset:auto 0 0;height:9%;background:#8b9d80}.room-rug{position:absolute;width:54%;height:60%;background:#7e9a71;border-radius:50%;top:12%;left:23%;opacity:.6}.room-table{position:absolute;width:27%;height:30%;left:40%;top:-10%;border-radius:8px;background:#8e7556;border:1px solid #725d43}.room-table:after{content:'';position:absolute;top:100%;left:10%;height:40%;width:4px;background:#725d43}.room-chair{position:absolute;width:14%;height:32%;left:62%;top:20%;background:#b8c7a5;border-radius:8px;border:1px solid #879b74}.room-caption{position:absolute;bottom:10px;left:0;width:100%;text-align:center;font-size:.8125rem;color:#394c34;background:#f6f9efde;padding:4px}.home-compare{display:grid;grid-template-columns:1fr 1fr;gap:20px}.home-compare figure{margin:0}.home-compare figcaption{font-size:.875rem;color:var(--muted);text-align:center;margin-top:12px}.home-progress{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}.home-progress>span{flex:1;min-width:130px;font-size:1rem;padding:12px;border-top:2px solid #acb9a3;color:var(--muted)}.home-progress>span.done{border-color:var(--teal);color:var(--teal)}.home-progress small{display:block;font-size:.8125rem;margin-top:4px}.style-switch{display:flex;gap:8px;justify-content:center;margin-top:24px}.style-switch [aria-pressed=true]{background:var(--teal);color:white}.stage-capture-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.stage-capture-grid article{border:1px solid var(--line);border-radius:12px;overflow:hidden}.stage-capture-grid h3{font-size:1rem;padding:16px}.stage-capture-grid code{font-size:.75rem;display:block;padding:12px;color:var(--muted)}
.media-dialog{max-width:1100px;width:calc(100vw - 32px);max-height:94dvh;border:0;border-radius:12px;padding:0;background:var(--paper);color:var(--ink);box-shadow:0 24px 80px #17342640}.media-dialog::backdrop{background:#152b26dc}.media-dialog .dialog-head{justify-content:flex-end}#media-content{padding:24px}#media-content h2{font-size:1.375rem;margin-bottom:20px}#media-content img,#media-content video{display:block;max-width:100%;max-height:65dvh;margin:auto;object-fit:contain}#media-content p{font-size:.875rem;color:var(--muted);margin:20px 0}#media-content .button{display:flex;margin-left:auto}
@media(min-width:1600px){.motion-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.type-grid,.ui-registry-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1199px){.motion-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.type-grid,.ui-registry-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.research-list{grid-template-columns:1fr}.difficulty-lab{grid-template-columns:1fr}.depth-control{margin-top:24px}.visual-toolbar{grid-template-columns:1fr 1fr}.visual-toolbar label:first-child{grid-column:1/-1}.ui-anatomy{gap:24px;grid-template-columns:minmax(240px,1fr) minmax(0,1fr)}}
@media(max-width:760px){.motion-grid{gap:16px}.motion-info{padding:16px}.type-grid,.ui-registry-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.interaction-comparison{grid-template-columns:1fr}.ui-anatomy{grid-template-columns:1fr}.anatomy-screen{max-width:380px;width:100%;margin:auto}.experience-scene{padding:20px}.layer-chart>div{grid-template-columns:140px minmax(0,1fr) 55px;gap:8px}.pressure-grid{gap:16px}.pressure-grid p{font-size:.9375rem}.home-compare{gap:12px}.capture-coverage .text-link{margin:0}.stage-capture-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.type-card-body{padding:12px}.play-hud{gap:8px}}
@media(max-width:540px){.motion-grid,.pressure-grid,.ui-entry-links{grid-template-columns:1fr}.type-grid,.ui-registry-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.motion-info h3{font-size:1.125rem}.media-wait{min-height:140px;padding:16px}.visual-toolbar{grid-template-columns:1fr}.visual-toolbar label:first-child{grid-column:auto}.visual-toolbar input,.visual-toolbar select{font-size:1rem}.studio-tabs{gap:8px 20px}.studio-tabs a{font-size:.9375rem}.interaction-comparison{padding:16px}.depth-chart{height:260px;gap:4px;overflow:visible}.depth-chart span{font-size:.625rem;writing-mode:vertical-rl}.depth-chart small{font-size:.6875rem}.depth-control{padding:20px}.pressure-grid article{display:grid;grid-template-columns:95px 1fr;gap:8px 20px}.pressure-diagram{grid-row:1/4;padding:12px;margin:0}.pressure-grid p{margin:0}.pressure-grid .source-button{grid-column:2}.pressure-depth i{width:12px}.pressure-space{grid-template-columns:repeat(3,14px);gap:4px}.pressure-space i{width:14px;height:14px}.ui-entry-links{gap:16px}.layer-chart strong{font-size:.75rem}.layer-chart>div{grid-template-columns:115px minmax(0,1fr) 50px}.experience-scene{padding:12px;border-radius:12px}.journey-steps{gap:6px}.journey-steps li{font-size:.8125rem;padding:8px}.play-grid{gap:3px}.play-cell{min-height:36px;padding:3px}.play-item{max-width:30px}.play-item b{font-size:.6875rem}.play-hud strong{font-size:1rem;margin-left:4px}.play-hud span{font-size:.8125rem}.play-order .button{margin-left:0;width:100%}.home-compare{grid-template-columns:1fr}.home-progress>span{min-width:100px}.room-window{border-width:5px}.experience-title h2{font-size:1.75rem}.stage-capture-grid{gap:12px}.media-state{font-size:.6875rem}.research-list span{display:none}.research-list svg{width:20px}.experience-toolbar>span{width:100%}.gallery-pagination span{width:100%}}
.nav-tree:not([open])>.nav-children,.nav-subtree:not([open])>.nav-children{display:none}.studio-tabs a[aria-current=page]{background:transparent}.studio-tabs a[aria-current=page]:hover{background:transparent}.depth-chart span{font-size:.75rem}.type-card code,.ui-registry-card code{font-size:.75rem}.media-state{font-size:.75rem}.experience-scene:focus{outline:3px solid var(--focus);outline-offset:4px}
@media(prefers-reduced-motion:reduce){.playing *{animation:none!important}.playing .scene-item{fill:#e7d5aa}.playing .scene-result{opacity:1}.motion-stage.playing:after{content:'동작 구조 확인 · 모션 줄이기 설정';position:absolute;font-size:.75rem;bottom:8px;background:var(--surface);padding:4px 8px}.motion-stage{position:relative}}

.apk-asset-gallery .media-open{background:#fffdf6;aspect-ratio:1.25;min-height:180px;padding:12px}.apk-asset-gallery .media-open img{max-height:160px;object-fit:contain}.apk-asset-gallery .type-card-body code{font-size:.6875rem;overflow-wrap:anywhere}.bm-gate-list{list-style:none;padding:0;margin:20px 0}.bm-gate-list li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:.9375rem}.bm-gate-list li>span{white-space:nowrap;color:var(--muted)}.bm-gate-list li.pass>span{color:var(--teal);font-weight:700}.bm-time-values{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:.9375rem}.bm-time-values dd{margin:0;text-align:right}