/* White studio presentation, using the shared Neo site's type and palette. */
.system-page{--ink:var(--text-dark);--blue:var(--secondary);--muted:var(--text-gray);background:#fff;color:var(--ink)}
.system-page .system-stage{background:#fff}
.system-page .story-topline{top:22px;color:var(--text-gray)}
.system-page .experience-label i{background:var(--secondary);box-shadow:none}
.system-page .story-copy{top:61px;left:var(--side);right:var(--side);width:auto;max-width:1050px;margin-inline:auto;text-align:center}
.system-page .story-kicker{font-size:9px;letter-spacing:.19em;color:var(--text-gray);margin:0 0 12px}
.system-page .story-copy h1{font-size:clamp(32px,3.3vw,48px);font-weight:450;line-height:1.09;letter-spacing:-.05em;max-width:none;margin:0 0 13px;color:var(--text-dark)}
.system-page .story-copy h1 br{display:none}
.system-page .story-copy h1 em{color:var(--secondary)}
.system-page .story-copy h1 em:before{content:' '}
.system-page .story-description{font-size:14px;line-height:1.7;font-weight:350;color:var(--text-gray);max-width:660px;margin:0 auto}
.system-page .story-description br{display:none}
.system-page .story-detail{display:none}
.system-page .story-bottom{bottom:24px}
.system-page .scroll-invitation{color:var(--text-gray)}
.system-page .scroll-track{border-color:var(--brand-line)}
.system-page .scroll-track i{background:var(--primary-dark)}
.system-page .chapter-nav{border-color:var(--brand-line);background:#ffffffed;box-shadow:0 6px 25px color-mix(in srgb, var(--primary-dark) 2.745%, transparent)}
.system-page .chapter-nav button{color:var(--text-gray)}
.system-page .chapter-nav button:hover{color:var(--primary-dark)}
.system-page .chapter-nav button[aria-current=step]{color:var(--primary-dark)}
.system-page .chapter-nav span{background:var(--brand-line)}
.system-page .step-controls>span{color:var(--primary-dark)}
.system-page .step-controls i{color:var(--text-muted)}
.system-page .step-controls button{border-color:var(--brand-line);background:#fff;color:var(--primary-dark)}
.system-page .step-controls button:hover{background:var(--brand-tint)}
.system-page .total-progress{background:var(--bg-gray)}
.system-page .total-progress span{background:var(--secondary);box-shadow:none}
.system-page .scene-tag{border-color:var(--brand-line);background:#fffffff2;color:var(--text-dark);box-shadow:0 10px 35px color-mix(in srgb, var(--primary-dark) 4.706%, transparent)}
.system-page .scene-tag svg{stroke:var(--secondary)}
.system-page .scene-tag small{color:var(--text-gray)}
.system-page .scene-tag small i{background:var(--success)}
.system-page .scene-tag b{font-weight:450}
.system-page .utilities-status{left:50%;right:auto;bottom:auto;transform:translateX(-50%);display:flex;justify-content:center;gap:25px;white-space:nowrap}
.system-page .utilities-status span{color:var(--text-muted);font-size:9px}
.system-page .utilities-status .active{color:var(--primary-dark)}
.system-page .utilities-status .done{color:var(--text-gray)}
.system-page .utilities-status .active i{box-shadow:0 0 8px color-mix(in srgb, var(--secondary) 14.510%, transparent)}
.system-page .pos-caption{left:50%;bottom:98px;background:#ffffffed;border-color:var(--brand-line);color:var(--primary-dark);font-size:10px;box-shadow:0 4px 18px color-mix(in srgb, var(--primary-dark) 1.961%, transparent)}
.system-page .pos-caption small{color:var(--text-muted)}
.system-page .pulse-dot{background:var(--secondary);box-shadow:none}
.system-page .pos-surface{border-radius:0;box-shadow:none}
.system-page .story-loading{left:50%;top:58%;background:#fff;border-color:var(--brand-line);color:var(--text-gray);box-shadow:0 8px 30px color-mix(in srgb, var(--primary-dark) 3.529%, transparent)}
.system-page .loading-ring{border-color:var(--brand-line);border-top-color:var(--secondary)}
.system-page .sequence-buffer{top:48px;color:var(--text-muted)}
.system-page .scene-error{left:50%;background:#fff;border-color:var(--brand-line);color:var(--text-gray);box-shadow:0 15px 45px color-mix(in srgb, var(--primary-dark) 7.059%, transparent)}
.system-page .scene-error button{background:var(--primary-dark);border-color:var(--primary-dark)}
.system-page .end-actions{margin-top:16px}
.system-page .end-actions button{border-color:var(--brand-line);background:var(--bg-gray);color:var(--primary-dark);padding:10px 17px}
.system-page .end-actions button span{color:var(--secondary)}
.system-page .system-noscript{background:var(--bg-gray);color:var(--primary-dark)}
.system-page #wifi-effects{color:var(--primary-dark)}
.system-page #wifi-rings{stroke:var(--secondary)}
.system-page #wifi-effects>g:last-child{stroke:var(--primary-dark)}
.system-page #payment-success circle{fill:#f1fbf8;stroke:var(--success)}
.system-page #payment-success path{stroke:#168b70}
@media(max-width:900px){
 .system-page .story-topline{top:21px}
 .system-page .story-copy{top:64px;left:22px;right:22px}
 .system-page .story-copy h1{font-size:clamp(31px,4.7vw,42px);line-height:1.07;max-width:680px;margin:0 auto 12px}
 .system-page .story-kicker{font-size:7px;margin-bottom:12px}
 .system-page .story-description{font-size:12px;line-height:1.6;max-width:530px}
 .system-page .story-bottom{bottom:20px}
 .system-page .utilities-status{gap:19px}
 .system-page .utilities-status span{font-size:8px}
 .system-page .pos-caption{bottom:120px;font-size:8px;padding:8px 13px}
 .system-page .pos-caption small{font-size:7px}
 .system-page .end-actions button{padding:9px 15px}
}
@media(max-width:360px){
 .system-page .story-copy{top:59px;left:19px;right:19px}
 .system-page .story-copy h1{font-size:28px}
 .system-page .story-description{font-size:11px}
 .system-page .utilities-status{gap:14px}
}
@media(max-height:650px) and (min-width:701px){
 .system-page .story-topline{top:15px}
 .system-page .story-copy{top:44px}
 .system-page .story-copy h1{font-size:30px;margin-bottom:7px}
 .system-page .story-kicker{margin-bottom:8px;font-size:7px}
 .system-page .story-description{font-size:11px;line-height:1.5}
 .system-page .story-bottom{bottom:14px}
 .system-page .pos-caption{bottom:86px}
}
@media(max-height:530px) and (min-width:601px){
 .system-page .story-topline{top:12px;font-size:7px}
 .system-page .story-copy{top:34px}
 .system-page .story-copy h1{font-size:26px;margin-bottom:7px}
 .system-page .story-kicker{font-size:6px;margin-bottom:7px}
 .system-page .story-description{font-size:10px;line-height:1.4;max-width:600px}
 .system-page .story-bottom{display:flex;bottom:12px;gap:12px}
 .system-page .scroll-invitation{display:none}
 .system-page .chapter-nav{padding:7px 16px}
 .system-page .chapter-nav button{font-size:8px}
 .system-page .pos-caption{bottom:60px;padding:5px 12px;font-size:7px}
 .system-page .pos-caption small{font-size:6px}
 .system-page .end-actions{margin-top:9px}
 .system-page .end-actions button{padding:6px 12px;font-size:9px}
 .system-page .utilities-status span{font-size:7px}
}
