.header .nav{gap:48px;left:56%}.nav a[aria-current="page"]{color:rgba(255,255,255,.75)}
.case-diagram{position:relative;flex:none;width:min(100%,var(--square));aspect-ratio:1;margin-top:auto;color:rgba(255,255,255,.5)}
.case-diagram svg{display:block;width:100%;height:100%;fill:none;stroke:#3c4540;stroke-width:1.5}
.case-route{stroke:#3be781;stroke-dasharray:1400;stroke-dashoffset:1400;transition:stroke-dashoffset 1.5s ease-in-out}
.case-dot{fill:#3be781;stroke:none}.case-diagram.resolved .case-route,.mapping-module.resolved .case-route{stroke-dashoffset:0}
.case-diagram span{position:absolute;font-size:20px;line-height:1.5;transform:translate(-50%,-50%);white-space:nowrap;background:#161616;padding:4px}
.core-center{left:50%;top:50%}.core-north{left:50%;top:11%}.core-east{left:89%;top:50%}.core-south{left:50%;top:89%}.core-west{left:11%;top:50%}
.route-name{left:17%}.route-room{top:15%}.route-music{top:50%}.route-search{top:85%}.case-diagram .route-end{left:82%;top:43%;background:none}
.mapping-module{margin:auto 0 0;max-width:600px;min-height:380px;display:flex;flex-direction:column;justify-content:center;gap:32px}
.mapping-options{display:flex;gap:24px}.mapping-options button{border:0;background:none;color:rgba(255,255,255,.25);padding:12px 0;font:400 20px/1.5 Onest,Arial,sans-serif;cursor:pointer}.mapping-options button[aria-selected="true"]{color:rgba(255,255,255,.75)}
.mapping-pair{display:flex;align-items:center;justify-content:space-between;gap:24px;color:rgba(255,255,255,.5);font-size:20px}.mapping-arrow{color:#3be781}.mapping-vector{width:100%;height:auto;display:block;fill:none;stroke:#3c4540;stroke-width:1.5}.mapping-module p{font:400 20px/1.5 Onest,Arial,sans-serif;color:rgba(255,255,255,.5);margin:0}
.case-demo-section .wrap{display:flex;flex-direction:column;gap:32px}.demo-case-heading{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:24px;align-items:start}.demo-case-heading p{grid-column:1/span 5;color:rgba(255,255,255,.5)}.demo-case-heading h2{grid-column:8/span 5;font:300 var(--heading-size)/1.2 Onest,Arial,sans-serif;color:var(--heading-color);letter-spacing:-.035em}
.demo-launch{min-height:480px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:32px;border-top:1px solid #2e2e2e;border-bottom:1px solid #2e2e2e}.demo-launch p{max-width:600px;color:rgba(255,255,255,.5)}.demo-launch[hidden]{display:none}.case-demo-frame{display:block;width:100%;height:860px;border:1px solid #2e2e2e;background:#161616}.case-demo-frame[hidden]{display:none}.case-demo-actions{display:flex;justify-content:flex-end;gap:24px;padding-bottom:24px}.portfolio-exit{display:none}.horizontal-mode[data-scene="case-result"] .portfolio-exit{display:block;position:fixed;bottom:12px;left:var(--grid-margin);z-index:25}.portfolio-exit .btn{font-size:20px}
.horizontal-mode[data-scene="case-result"] .case-section{padding-bottom:110px}.horizontal-mode[data-scene="case-result"] .narrative-grid{height:calc(var(--grid-height) - 80px);min-height:0}
@media(max-width:1150px){.header .nav{gap:24px;left:63%}.case-demo-frame{height:1080px}}
@media(max-width:800px){.header .nav{position:static;transform:none;gap:16px;overflow-x:auto;max-width:58vw}.header .signature{max-width:38vw;overflow:hidden;text-overflow:ellipsis}.case-diagram{width:min(100%,440px);margin-top:32px;align-self:center}.case-diagram span{font-size:20px}.mapping-module{margin-top:32px;min-height:0}.demo-case-heading{display:flex;flex-direction:column;gap:32px}.demo-case-heading h2{font-size:38px}.case-demo-frame{height:1800px}.demo-launch{min-height:360px}.portfolio-exit{max-width:calc(100vw - 40px)}.portfolio-exit .btn{font-size:16px}.horizontal-mode[data-scene="case-result"] .narrative-grid{height:auto}.case-demo-actions{justify-content:flex-start}.route-end{white-space:normal!important;max-width:120px}.mapping-options{gap:24px}}
@media(prefers-reduced-motion:reduce){.case-route{stroke-dashoffset:0;transition:none}}
@media(max-width:520px){.header .nav a[href="portfolio.html"],.header .nav a[href="#portfolio"]{display:block}.header .signature{max-width:29vw}.header .nav{max-width:62vw;gap:12px}}