@font-face{font-family:Pretendard;src:url('../../supercar-concept/assets/PretendardVariable.woff2') format('woff2');font-display:swap}*{box-sizing:border-box}html,body{margin:0;background:#101b22;color:#e5e9e7;font-family:Pretendard,'Segoe UI','Malgun Gothic',sans-serif}body{min-height:100svh;display:flex;flex-direction:column}button,a,input{-webkit-tap-highlight-color:transparent}button,a{color:inherit}button{font:inherit;cursor:pointer;background:transparent;border:1px solid #3a4a51;border-radius:5px;padding:10px 13px}button:hover,a:hover{color:#ffca93;border-color:#b28f68}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #f4bd82;outline-offset:4px}a{text-underline-offset:4px}.masthead{height:76px;border-bottom:1px solid #2c3a41;display:flex;align-items:center;padding:0 30px;gap:30px}.brand{display:flex;align-items:center;gap:17px;text-decoration:none;font-family:Georgia,serif;font-size:40px}.brand span{font:600 10px/1.9 Pretendard,sans-serif;letter-spacing:2px}.brand small{display:block;font-size:8px;letter-spacing:1px;color:#99a9ab}.edition{margin:auto;font:10px Consolas,monospace;letter-spacing:2px;color:#99a9ab}.masthead nav{display:flex;align-items:center;gap:21px;font-size:12px}.masthead nav a{text-decoration:none}.masthead button{font-size:11px;padding:8px 11px}main{display:grid;grid-template-columns:310px minmax(0,1fr);flex:1;min-height:580px}.story{padding:49px 26px 24px 30px;border-right:1px solid #26363d;position:relative;z-index:2;background:#101b22}.eyebrow{font:10px/1.6 Consolas,monospace;letter-spacing:1.2px;color:#e3b184;margin:0 0 23px}h1{font-size:35px;letter-spacing:-1.6px;line-height:1.25;margin:0 0 24px;font-weight:550;word-break:keep-all}#description{font-size:14px;line-height:1.95;color:#aebbbe;word-break:keep-all;margin:0 0 30px;min-height:108px}.context{display:flex;align-items:center;gap:8px;padding:12px 0;border-top:1px solid #2a3940;border-bottom:1px solid #2a3940}.context svg{width:90px;flex-shrink:0;fill:none;stroke:#667f88;stroke-width:.8}.context .zone{stroke:#edb375;fill:#edb37524;stroke-width:1.5}.context .leader,.context .detail{stroke:#edb375}.context small,.outcome small{display:block;color:#93a6ab;font-size:10px;margin:0 0 8px}.context strong{display:block;font-size:11px;line-height:1.6;word-break:keep-all}.context span{font-size:9px;color:#768c94}.outcome{padding:24px 0 20px}.outcome strong{display:block;color:#edbd8b;font-size:14px}#source-links{display:flex;flex-wrap:wrap;gap:8px}#source-links a{font-size:10px;color:#94b8c2}.note{font-size:10px;line-height:1.8;color:#899da4;margin-top:18px}#continue{display:block;margin-top:22px;border:1px solid #718b7f;border-radius:5px;padding:13px 10px;text-decoration:none;font-size:12px;color:#cfe5cf}#continue[hidden]{display:none}.viewport{position:relative;min-width:0;min-height:580px;background:#14222b;overflow:hidden}#stage{position:absolute;inset:0}#stage canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab}#stage canvas:active{cursor:grabbing}#loading{position:absolute;top:45%;width:100%;text-align:center;font-size:13px;color:#abc1c6}.viewport-top{position:absolute;inset:18px 23px auto;display:flex;align-items:center;justify-content:space-between;pointer-events:none}#view-tag{font:9px Consolas,monospace;letter-spacing:1.3px;color:#a6b7bf}.viewport-top>div{display:flex;gap:6px;pointer-events:auto}.viewport-top button{font-size:12px;min-width:38px;min-height:38px;padding:7px;background:#101b22c9}.viewport-top button[disabled]{opacity:.3;cursor:default}#section[aria-pressed=true]{border-color:#b39573;color:#e9bc8c}.viewport-bottom{position:absolute;inset:auto 23px 22px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}#action{font-size:12px;border-left:2px solid #c9a278;padding-left:10px;color:#c9d8da}.viewport-bottom small{color:#8ca4ad;font-size:10px}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.label{position:absolute;font:10px/1.5 Consolas,'Malgun Gothic',sans-serif;color:#e1eeee;white-space:nowrap;border-left:1px solid #9aa686;padding:4px 7px;background:#10202bdd;transform:translate(9px,-50%)}.label:before{content:'';position:absolute;left:-4px;top:50%;width:5px;height:5px;background:#e8c097;border-radius:50%}#selection{position:absolute;left:22px;bottom:60px;right:22px;max-width:370px;background:#0b171eed;border:1px solid #536971;padding:17px 32px 16px 17px;border-radius:7px;font-size:12px;line-height:1.7}#selection strong{display:block;color:#eabb84;margin-bottom:5px}#selection span{color:#b0c2c7}#selection-close{position:absolute;right:4px;top:4px;border:0;font-size:18px}.transport{padding:17px 29px 16px;border-top:1px solid #34444c;background:#121f27}.player{display:flex;gap:10px;align-items:center}.primary{background:#e4b583;color:#152029;border:0;min-width:110px;font-weight:600}.primary:hover{background:#f7cca0;color:#152029}.scrubber{flex:1;padding:0 10px}.scrubber>div{display:flex;justify-content:space-between;font:10px Consolas,sans-serif;color:#a8b5b9;margin-bottom:5px}input[type=range]{width:100%;height:18px;accent-color:#dfb185;cursor:pointer}.time-note{font-size:10px;color:#7d929b}#step-nav{display:flex;gap:5px;margin-top:17px;overflow-x:auto;scrollbar-width:thin;padding-bottom:2px}#step-nav button{flex:1;min-width:83px;border-color:#31434c;font-size:11px;white-space:nowrap;padding:11px 9px;text-align:left;color:#94a8b0}#step-nav small{font:9px Consolas,monospace;color:#718c96;margin-right:7px}#step-nav button.active{border-color:#d7af85;background:#dfb38611;color:#f0d0ac}#step-nav button.active small{color:#eabd8a}#step-nav button.done{color:#bdc9ca}footer{display:flex;justify-content:space-between;padding:10px 30px;font-size:9px;color:#718791;border-top:1px solid #253840}dialog{width:min(630px,calc(100vw - 28px));max-height:85svh;overflow:auto;background:#182731;color:#cedcdf;border:1px solid #59717b;border-radius:10px;padding:28px}dialog::backdrop{background:#0009;backdrop-filter:blur(5px)}.dialog-head{display:flex;align-items:center;justify-content:space-between;font:10px Consolas;color:#d2ab80}.dialog-head button{font-size:22px;padding:2px 10px}dialog h2{font-size:25px}dialog p{font-size:13px;line-height:1.9;color:#afc0c7}dialog .small{font-size:10px}#all-sources a{display:block;margin:10px 0;color:#d6bb9a;font-size:13px}.fallback-list{padding:40px;color:#bdcdd1;overflow:auto;height:100%}.fallback-list h2{font-size:19px}.fallback-list p{font-size:13px;line-height:1.8}#stage.fallback{position:absolute;inset:65px 10px 60px}body[data-family=package] .context .detail{fill:#9da88177}body[data-family=micro] .context .detail{fill:#edb37555}
@media(min-height:1000px){main{min-height:750px}.story{padding-top:64px}h1{font-size:39px}}
@media(max-width:1050px){main{grid-template-columns:260px minmax(0,1fr)}.story{padding:35px 20px}h1{font-size:30px}.edition{display:none}.masthead nav{margin-left:auto}#step-nav button{min-width:86px}.viewport-bottom small{display:none}.time-note{display:none}}
@media(max-width:720px){.masthead{height:62px;padding:0 15px;gap:8px}.brand{font-size:32px;gap:10px}.brand span{font-size:8px}.brand small{font-size:7px}.masthead nav{gap:10px;font-size:10px}.masthead nav>a:first-child{display:none}main{display:flex;flex-direction:column;min-height:0}.viewport{order:0;height:53svh;min-height:350px}.story{order:1;padding:22px 20px;border-right:0;display:grid;grid-template-columns:1fr 110px;column-gap:20px}.eyebrow{grid-column:1/-1;margin-bottom:10px}h1{font-size:27px;margin:0 0 12px;grid-column:1/-1}#description{font-size:13px;line-height:1.8;min-height:0;margin:0;grid-column:1/-1}.context{grid-column:2;grid-row:4/7;display:block;padding:12px 0 0;border:0}.context svg{width:90px;height:55px}.context small{display:none}.context strong{font-size:9px}.context span{font-size:8px}.outcome{padding:19px 0 13px;grid-column:1}.outcome strong{font-size:12px}#source-links{grid-column:1}.note{grid-column:1;font-size:9px;margin:10px 0 0}#continue{grid-column:1/-1;margin:15px 0 0}.viewport-top{inset:13px 12px auto}.viewport-top button{min-height:40px;min-width:40px}#view-tag{max-width:110px;line-height:1.6;font-size:8px}.viewport-bottom{inset:auto 15px 14px}.transport{padding:13px 15px;position:sticky;bottom:0;z-index:4}.player{gap:5px}.player button{min-height:40px;padding:8px 10px}.primary{min-width:75px;font-size:12px}.scrubber{padding:0 4px}#step-nav{margin-top:10px}#step-nav button{min-height:40px;padding:9px 8px;font-size:10px}footer{padding:12px 18px;line-height:1.7}footer span:last-child{display:none}.label{font-size:8px;padding:3px 4px}.story #source-links a{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Keep the transport visible on laptop displays as well as tall displays. */
@media(min-width:721px){body{height:100svh;min-height:0;overflow:hidden}.masthead,.transport,footer{flex-shrink:0}main{min-height:0;overflow:hidden}.viewport{min-height:0}.story{overflow-y:auto;scrollbar-width:thin}main .viewport{height:100%}}
@media(min-width:721px) and (max-height:800px){.story{padding:26px 23px 20px}.eyebrow{margin-bottom:15px}h1{font-size:29px;margin-bottom:17px}#description{font-size:12px;line-height:1.8;min-height:0;margin-bottom:20px}.context{padding:8px 0}.outcome{padding:17px 0 13px}.note{margin-top:12px}.transport{padding-top:12px;padding-bottom:11px}#step-nav{margin-top:12px}}

/* Material study controls, kept outside the object silhouette. */
.material-note{position:absolute;left:23px;top:68px;font-size:9px;letter-spacing:.25px;color:#91a4ad;pointer-events:none}
#detail[aria-pressed=true],#explain[aria-pressed=true]{border-color:#b39573;color:#e9bc8c}
.viewport-top button[hidden]{display:none}
@media(max-width:1150px){#view-tag{display:none}}
@media(max-width:720px){.viewport-top{justify-content:flex-end}.material-note{left:15px;top:65px;font-size:8px}.viewport-top>div{gap:4px}.viewport-top button{font-size:10px;padding:6px;min-width:34px}#section{min-width:58px}}

#package-inspect{position:absolute;right:22px;bottom:62px;width:195px;background:#111e26e8;border:1px solid #465c65;border-radius:7px;padding:16px;color:#c7d5d9}#package-inspect[hidden]{display:none}#package-inspect>small{display:block;font:8px Consolas,monospace;letter-spacing:1px;color:#8dabae}#joint-focus{width:100%;padding:11px 0;margin:8px 0 15px;font-size:12px;color:#f0c89f;border:0;border-bottom:1px solid #49606a;border-radius:0;text-align:left}#package-inspect label{display:block;font-size:10px}#assembly-value{float:right;color:#e7bc8d}#package-inspect>span{display:block;font-size:9px;color:#889fa7}#package-inspect>span>span{float:right}#assembly{margin:8px 0 6px}
@media(max-width:720px){#package-inspect{width:135px;padding:10px;right:12px;bottom:48px}#joint-focus{margin:3px 0 8px;padding:7px 0;font-size:10px}#package-inspect>small{font-size:7px}#package-inspect label{font-size:8px}}