@font-face{font-family:Pretendard;src:url('./vendor/fonts/Pretendard-Regular.woff2') format('woff2');font-weight:400;font-display:swap}@font-face{font-family:Pretendard;src:url('./vendor/fonts/Pretendard-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}@font-face{font-family:Pretendard;src:url('./vendor/fonts/Pretendard-Bold.woff2') format('woff2');font-weight:700;font-display:swap}@font-face{font-family:Pretendard;src:url('./vendor/fonts/Pretendard-ExtraBold.woff2') format('woff2');font-weight:800 900;font-display:swap}
*{box-sizing:border-box}body{margin:0;overflow:hidden;background:linear-gradient(180deg,#0b1026 0%,#1a1f4a 55%,#0e3a4a 100%);color:#eaf2ff;font:12px Pretendard,sans-serif;font-variant-numeric:tabular-nums}body::before{content:'';position:absolute;inset:-100px;pointer-events:none;background:radial-gradient(circle at 12% 10%,#4d6bff33,transparent 90px),radial-gradient(circle at 85% 25%,#ff6b8a22,transparent 100px),radial-gradient(circle at 30% 65%,#5cf2c422,transparent 90px),radial-gradient(circle at 90% 90%,#8c5bff33,transparent 100px);filter:blur(30px);transform:translateY(var(--parallax,0px));transition:scale .5s}body.sprint::before{scale:1.1}body.sprint::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 100px #0b102688;pointer-events:none}canvas{display:block;width:100vw;height:100vh;position:relative}header{position:absolute;top:12px;left:12px;right:12px;height:48px;padding:0 16px;display:flex;align-items:center;gap:12px;background:rgba(10,18,40,.62);border:1px solid #eaf2ff40;border-radius:24px;backdrop-filter:blur(12px);pointer-events:none}h1{font-size:18px;font-weight:800;letter-spacing:-.7px;margin:0;order:-1;white-space:nowrap}h1 span{color:#5cf2c4;margin-left:6px}.eyebrow{margin-left:auto;color:#9db0d0;font-size:12px}.eyebrow span{color:#5cf2c4}.race-info{position:absolute;top:72px;left:16px;right:16px;display:flex;justify-content:space-between;color:#c5ff57;text-shadow:0 1px 5px #0b1026}#timer{font-size:16px;color:#eaf2ff}aside{position:absolute;left:8px;top:108px;width:120px;padding:10px 7px;background:rgba(10,18,40,.62);border:1px solid #eaf2ff40;border-radius:16px;backdrop-filter:blur(12px);pointer-events:none}.rank-title{font-weight:700;margin-bottom:9px}.rank-title small{display:none}#ranks{position:relative}.rank{position:absolute;top:0;left:0;right:0;display:flex;align-items:center;gap:5px;font-size:13px;height:30px;white-space:nowrap;background:#eaf2ff0d;border:1px solid #eaf2ff1c;border-radius:9px;padding:0 5px;transition:transform .25s ease}.rank[hidden]{display:none}.rank em{min-width:14px;color:#9db0d0;font-style:normal;font-size:12px}.swatch{flex-shrink:0;width:9px;height:9px;border-radius:50%;box-shadow:inset -2px -2px 3px #0005,inset 2px 2px 3px #ffffff80}.rank.mine{color:#c5ff57}#me{display:none}#countdown{position:absolute;left:0;right:0;top:35%;text-align:center;font-size:96px;font-weight:800;color:#c5ff57;text-shadow:0 4px 24px #0b1026;pointer-events:none}#countdown.pulse{animation:pulse .35s ease-out}@keyframes pulse{from{scale:1.4}to{scale:1}}footer{position:absolute;bottom:max(15px,env(safe-area-inset-bottom));left:16px;right:16px;text-shadow:0 1px 4px #0b1026;pointer-events:none}footer>div:first-child{display:flex;align-items:center;gap:6px}.dot{width:6px;height:6px;background:#c5ff57;border-radius:50%}#quality{margin-left:auto;color:#9db0d0}.progress{height:4px;background:#eaf2ff30;border-radius:5px;margin-top:10px;overflow:hidden}.progress i{display:block;background:#c5ff57;height:100%;width:0}footer p{display:none}#tags{position:absolute;inset:0;pointer-events:none;overflow:hidden}.tag{position:absolute;font-size:12px;line-height:16px;font-weight:700;padding:3px 8px;background:rgba(10,18,40,.72);border:1px solid #eaf2ff55;border-left:3px solid var(--marble-color);border-radius:20px;white-space:nowrap;box-shadow:0 2px 5px #0b102655;pointer-events:none}.tag.mine{color:white}.tag.leading{border-color:var(--marble-color)}.tag.leading::before{content:none}.tag-tick{position:absolute;height:1px;background:#eaf2ff80;transform-origin:0 50%;pointer-events:none;z-index:1}#result{position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%,-50%);width:min(340px,calc(100vw - 32px));background:linear-gradient(#0a1228ed,#0a1228ed) padding-box,linear-gradient(135deg,var(--winner-color),#ffd166,#5cf2c4) border-box;border:2px solid transparent;border-radius:24px;padding:24px 18px;text-align:center;box-shadow:0 16px 60px #0b102680;backdrop-filter:blur(12px);animation:reveal .35s cubic-bezier(.2,1.4,.4,1)}#result[hidden]{display:none}@keyframes reveal{from{opacity:0;transform:translate(-50%,-50%) scale(.8)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}#result small{color:#ffd166;letter-spacing:2px;font-size:12px}#result h2{font-size:32px;font-weight:800;margin:12px 0}#result p{color:#9db0d0;font-size:13px;margin:10px 0}.winner-marble{width:64px;height:64px;border-radius:50%;margin:18px auto;background:radial-gradient(circle at 30% 25%,#fff 0%,#ffffff66 10%,transparent 32%),radial-gradient(circle at 60% 65%,var(--winner-color),#ffffff55);border:2px solid var(--winner-color);box-shadow:inset -8px -8px 12px #0b102655,0 0 24px var(--winner-color)}#result button{font:700 16px Pretendard,sans-serif;border:0;border-radius:24px;background:#c5ff57;color:#0b1026;padding:12px 36px;margin-top:8px;cursor:pointer}#fps{position:absolute;bottom:0;left:10px;font-size:12px;color:#9db0d0}@media(min-width:700px){aside{left:20px;width:150px;padding:12px}.rank{gap:8px}header{left:24px;right:24px}footer{left:24px;right:24px}}@media(max-width:360px){header{padding:0 10px;gap:5px}.eyebrow{font-size:12px}.eyebrow span{display:none}}

.watermark{position:absolute;right:16px;bottom:calc(max(15px,env(safe-area-inset-bottom)) + 42px);width:52px;height:52px;object-fit:contain;opacity:.22;z-index:4;pointer-events:none}@media(max-width:220px),(max-height:300px){.watermark{display:none}}

/* Compact result leaves the ranking panel and finish action readable. */
#result{left:16px;right:16px;width:auto;top:370px;transform:none;padding:14px 16px;border-radius:22px;animation:result-in .35s cubic-bezier(.2,1.4,.4,1)}
#result .winner-marble{float:left;width:48px;height:48px;margin:12px 10px 0 0}#result h2{font-size:28px;margin:8px 0}#result p{margin:6px 0}#result button{padding:9px 30px;margin-top:6px}#result small{letter-spacing:1px}
@keyframes result-in{from{opacity:0;scale:.85}to{opacity:1;scale:1}}
.watermark{opacity:.2;background:none;border:0;box-shadow:none}
@media(min-width:700px){#result{left:calc(50% - 170px);right:auto;width:340px}}

/* Mode control and last-survivor finale. */
#mode{pointer-events:auto;max-width:112px;font:600 11px Pretendard,sans-serif;color:#eaf2ff;background:#22304f;border:1px solid #eaf2ff66;border-radius:12px;padding:5px 6px}
.rank.safe,.rank.safe.mine{color:#9aa4b5;opacity:.5}.rank.safe .swatch{filter:grayscale(1)}.rank.safe em{color:#adb9c9}
#final-two{position:absolute;z-index:4;top:96px;left:50%;transform:translateX(-50%);text-align:center;white-space:nowrap;pointer-events:none;color:#ffd166;text-shadow:0 3px 12px #0b1026,0 0 24px #ff8c42}
#final-two[hidden]{display:none}#final-two strong{display:block;font-size:30px;font-weight:900;animation:final-pulse 1.4s ease-in-out infinite}#final-two span{display:block;margin-top:4px;font-size:12px;color:#fff4dc}
@keyframes final-pulse{50%{scale:1.08;filter:brightness(1.25)}}
body.final-two::after{box-shadow:inset 0 0 95px #ff8c4238}
@media(prefers-reduced-motion:reduce){#final-two strong{animation:none}}

/* Palette dots remain literal swatches, including arrived racers. */
.swatch{box-shadow:none}.rank.safe .swatch{filter:none}.rank.safe{opacity:1}.rank.safe .swatch{opacity:1}
.tag.winner{z-index:6!important}
body.closeup>header,body.closeup>aside,body.closeup .race-info,body.closeup footer,body.closeup #countdown,body.closeup #result,body.closeup #tags,body.closeup .watermark,body.closeup #fps,body.closeup #final-two{display:none!important}

/* Graphics overhaul: navy, compact broadcast UI, shorts-safe right/bottom. */
body{background:radial-gradient(ellipse at 45% 25%,#192b43,#080f1e 85%)}
body::before{inset:0;background:radial-gradient(ellipse at center,transparent 35%,#030914aa);filter:none;transform:none}
header{left:12px;right:calc(15% + 8px);top:12px;height:48px;padding:0 12px;gap:8px;border-radius:14px;background:#101d32dc;border-color:#47618266;box-shadow:none;justify-content:space-between}
header::before,header::after{display:none}h1{font-size:17px;white-space:nowrap}#mode{font-size:10px;max-width:100px}
header .progress{position:absolute;left:12px;right:12px;bottom:4px;height:2px;margin:0;background:#45607a66}header .progress i{background:#65edcb}
.race-info{top:70px;left:16px;right:calc(15% + 12px);font-size:10px}#timer{font-size:12px}
aside{top:96px;left:12px;width:108px;padding:7px;background:#101d32d9;border:1px solid #47618266;border-radius:12px;box-shadow:none;max-height:calc(80vh - 110px);overflow:hidden}
.rank-title{font-size:10px;margin-bottom:5px}#ranks{display:flex;flex-direction:column;gap:3px;height:auto!important;isolation:isolate}
.rank{position:relative;inset:auto;flex:0 0 25px;height:25px;min-height:25px;gap:4px;font-size:11px;padding:0 4px;transition:none;border-radius:6px;background:#1d2d45;overflow:hidden;will-change:transform}
.rank em{font-size:10px;min-width:12px}.rank[hidden]{display:none}
footer{top:82px;left:16px;right:calc(15% + 12px);bottom:auto;font-size:8px}footer .dot{width:4px;height:4px}#quality{font-size:8px}footer p{display:none}
.watermark{top:96px;right:calc(15% + 12px);bottom:auto;width:26px;height:26px;opacity:.23}
.tag{font-size:10px;line-height:14px;padding:2px 5px;border-radius:7px;background:#101d32e8;color:#f2f7ff;border:1px solid var(--marble-color);box-shadow:none}.tag::after{display:none}.tag.compact{font-size:9px;padding:1px 4px;line-height:12px}
#result{left:calc(15px + 5%);right:calc(15% + 12px);width:auto;max-width:340px;padding:10px 12px;background:#14223af2;border:1px solid var(--winner-color);box-shadow:0 8px 35px #0007;transform:none;max-height:calc(80vh - 110px);overflow:auto}
#result::before{display:none}#result small{color:#ffc96b}#result p{color:#b2c5dd}#result h2{font-size:23px}#result .winner-marble{width:38px;height:38px;margin:8px 10px 0 0}#result button{font-size:12px;padding:7px 22px;background:#2e766b;border:1px solid #80e6cc;box-shadow:none}
#final-two{top:95px;left:52%;max-width:50%;white-space:normal}#final-two strong{font-size:20px}#final-two span{font-size:10px}
#countdown{left:0;right:15%;top:32%;font-size:72px}#fps{top:65px;bottom:auto;left:16px;font-size:9px}
@media(min-width:700px){aside{width:130px}header{left:20px;right:calc(15% + 12px)}#result{left:calc(42.5% - 170px);right:auto;width:340px}}
@media(prefers-reduced-motion:reduce){.rank{will-change:auto}#result,#countdown.pulse{animation:none}}

/* Screen-space placement is computed from the projected track bounds. */
#result{right:auto;max-width:none;max-height:none;padding:8px 10px;border-radius:12px;animation:none;overflow:hidden}
#result h2{font-size:18px;margin:4px 0}#result p{font-size:10px;margin:4px 0}
#result .winner-marble{width:28px;height:28px;margin:4px 8px 0 0}
#result small{font-size:10px}#result button{font-size:11px;padding:5px 12px;margin:3px 0 0}
#result.slim{height:34px;padding:4px 7px;display:flex;align-items:center;justify-content:space-between;gap:6px;white-space:nowrap}
#result.slim small,#result.slim .winner-marble,#result.slim p{display:none}
#result.slim h2{font-size:13px;margin:0;overflow:hidden;text-overflow:ellipsis}
#result.slim button{flex-shrink:0;font-size:10px;padding:4px 7px;margin:0}

/* Keep controls and rankings inside both Fold viewports. */
header{left:8px;right:8px;padding:0 10px;gap:7px}header .eyebrow{display:none}header h1{font-size:16px;margin-right:auto}
#mute{pointer-events:auto;cursor:pointer;background:#22304f;color:#fff;border:1px solid #637d99;border-radius:9px;padding:4px 7px;font-size:15px;line-height:20px}
aside{left:8px;top:101px;width:104px;max-width:calc(100vw - 16px);padding:6px;max-height:calc(100dvh - 130px);overflow:auto;pointer-events:auto}
.rank-title{font-size:10px;margin-bottom:4px}.rank{font-size:10px;height:24px;min-height:24px;flex-basis:24px;gap:3px}.rank em{font-size:9px}.rank span:last-child{overflow:hidden;text-overflow:ellipsis}.swatch{width:8px;height:8px}
#rank-toggle{display:block;width:100%;text-align:left;margin:0 0 4px;padding:3px 0;color:#c3d6ef;border:0;background:transparent;font:600 10px Pretendard,sans-serif;cursor:pointer}
aside.collapsed{width:62px}aside.collapsed .rank-title,aside.collapsed #ranks,aside.collapsed #me{display:none}aside.collapsed #rank-toggle{margin:0}
#fps{display:block!important;position:fixed;left:auto;right:8px;top:67px;bottom:auto;z-index:8;padding:3px 6px;border:1px solid #47618299;border-radius:7px;background:#101d32ec;font-size:10px;pointer-events:none}
.race-info{right:115px}footer{right:115px}
#result,#result.slim{position:absolute;left:8px;right:8px;top:96px;width:calc(100vw - 16px);max-width:none;height:34px;min-height:34px;transform:none;padding:4px 7px;display:flex;align-items:center;justify-content:space-between;gap:6px;white-space:nowrap}
#result[hidden]{display:none}#result small,#result .winner-marble,#result p{display:none}#result h2{font-size:13px;margin:0;overflow:hidden;text-overflow:ellipsis}#result button{flex-shrink:0;font-size:10px;padding:4px 7px;margin:0}
body:has(#result:not([hidden])) aside{top:138px}
@media(min-width:700px){aside{left:8px;width:126px}.rank{font-size:11px}header{left:8px;right:8px}}
@media(max-width:430px){header h1{font-size:15px}#mode{max-width:96px;font-size:10px}.rank{gap:3px}}

/* One-device picks stay compact so the course remains visible. */
#pick-sheet{position:fixed;z-index:12;bottom:12px;left:12px;width:calc(100% - 24px);max-height:58dvh;overflow:auto;padding:14px;background:#101d32f5;border:1px solid #65edcb80;border-radius:16px;box-shadow:0 8px 28px #0005}
#pick-sheet[hidden]{display:none}#pick-sheet h2{font-size:18px;margin:0 0 2px}#pick-sheet p,#pick-sheet .pick-lead{color:#afbdd2;margin:0 0 10px;font-size:12px}.pick-note{color:#8fa0b8!important}
#pick-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;max-height:110px;overflow:auto;margin-bottom:10px}
.pick-slot{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid #476182;border-left:3px solid var(--look);border-radius:7px;background:#1c2a40;color:#eaf2ff;padding:7px 4px;font:600 11px Pretendard,sans-serif;cursor:pointer}.pick-slot[aria-pressed=true]{border-color:#65edcb;background:#2b4054}
.name-edit{display:flex;gap:10px;align-items:center;margin:8px 0;color:#afbdd2}.name-edit input{min-width:0;width:140px;background:#1c2a40;border:1px solid #476182;border-radius:6px;color:#fff;padding:6px;font:12px Pretendard,sans-serif}
#pick-options{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:5px;max-height:158px;overflow:auto;padding:3px}
.look-option{aspect-ratio:1;border-radius:50%;border:1px solid #ffffff40;background:var(--look);cursor:pointer;position:relative;min-width:0;max-height:30px}.look-option[aria-pressed=true]{outline:2px solid #fff;outline-offset:1px}.look-option:disabled{opacity:.18;cursor:default}.look-option.skin-1{background:linear-gradient(90deg,transparent 35%,#17233e88 35% 55%,transparent 55%),var(--look)}.look-option.skin-3{background:repeating-linear-gradient(90deg,transparent 0 5px,#17233e88 5px 7px),var(--look)}.look-option.skin-2{background:radial-gradient(circle,#17233e88 2px,transparent 3px) 0 0/9px 9px,var(--look)}.look-option.skin-4{background:radial-gradient(circle,#17233e88 1px,transparent 2px) 0 0/6px 6px,var(--look)}
.pick-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:10px;gap:8px}.pick-bottom small{color:#afbdd2;font-size:10px}#pick-start{flex:1;border:0;background:#65edcb;color:#101d32;border-radius:12px;padding:14px 20px;font:800 16px Pretendard,sans-serif;cursor:pointer;letter-spacing:.02em;box-shadow:0 6px 18px #65edcb44}#pick-start:active{transform:translateY(1px)}
#guide-toggle{position:fixed;right:8px;top:96px;z-index:9;background:#101d32ed;color:#c3d6ef;border:1px solid #476182;border-radius:8px;padding:6px 10px;font:11px Pretendard,sans-serif;cursor:pointer}#guide-toggle[hidden]{display:none}#guide-toggle[aria-pressed=true]{border-color:#65edcb}
#guides{position:fixed;inset:0;pointer-events:none;z-index:7;opacity:0;transition:opacity .25s}#guides.visible{opacity:1}.guide-pill{position:absolute;white-space:nowrap;border:1px solid #71938c80;border-radius:10px;background:#101d32ed;color:#d3e9e5;font:600 10px/16px Pretendard,sans-serif;padding:2px 6px}.guide-pill[hidden]{display:none}
.picking #countdown,.picking #tags{visibility:hidden}.picking aside{display:none}
@media(min-width:700px){#pick-sheet{width:350px;left:12px;bottom:12px;max-height:calc(100dvh - 110px)}#pick-slots{max-height:96px}}
@media(prefers-reduced-motion:reduce){#guides{transition:none}}

/* A result occupies its own UI row; the camera reserves the space below it. */
body:has(#result:not([hidden])) #guide-toggle,body:has(#result:not([hidden])) #fps{display:none!important}
#result,#result.slim{box-sizing:border-box;left:8px;right:8px;width:auto!important;max-width:calc(100vw - 16px);min-width:0}
#result h2{min-width:0;flex:1;text-align:left}
#result button{max-width:40%;white-space:nowrap}
#guides.whole-course .guide-pill{font-size:9px;line-height:13px;padding:2px 4px;max-width:calc(28vw - 6px);overflow:hidden;text-overflow:ellipsis}
.picking #pick-sheet{max-height:44dvh}
.picking #pick-slots{max-height:65px}
.picking #pick-options{max-height:108px}

/* Roster setup inside the pick sheet; every participant slot is reachable by scrolling. */
#roster{margin:0 0 10px;padding:8px;border:1px solid #476182;border-radius:10px;background:#16243a}#roster summary{cursor:pointer;font:600 14px Pretendard,sans-serif;color:#eaf2ff}
.roster-row{display:flex;gap:8px;align-items:center;margin:8px 0;color:#c3d0e2;font-size:14px}#roster-n{width:70px;background:#1c2a40;border:1px solid #476182;border-radius:6px;color:#fff;padding:6px;font:14px Pretendard,sans-serif}
#roster-names{width:100%;resize:vertical;background:#1c2a40;border:1px solid #476182;border-radius:6px;color:#fff;padding:6px;font:14px Pretendard,sans-serif}
#roster-apply{margin-top:6px;border:1px solid #80e6cc;background:#2e766b;color:#fff;border-radius:8px;padding:6px 16px;font:600 14px Pretendard,sans-serif;cursor:pointer}
.picking #pick-slots{max-height:96px}

/* Full-screen result card. */
#result.full{position:fixed!important;inset:0!important;width:auto!important;height:auto!important;max-width:none;min-height:0;top:0!important;left:0!important;z-index:20;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px!important;border:0;border-radius:0;background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--winner-color) 30%,#14223a),#070d1af2 70%);white-space:normal;text-align:center;animation:result-in .4s cubic-bezier(.2,1.4,.4,1)}
#result.full small{display:block!important;font-size:16px;color:#ffd27a}
#result.full .winner-marble{display:block!important;width:120px;height:120px;margin:0;border-radius:50%;box-shadow:0 0 50px var(--winner-color),inset -10px -14px 24px #0005}
#result.full h2{flex:none;font-size:44px;margin:0;text-align:center;overflow:visible;color:#fff}
#result.full .verdict{display:block!important;font-size:18px;margin:0;color:#ffe7b0}
#result.full ol{list-style:none;padding:0;margin:4px 0;font-size:16px;color:#d6e2f2}#result.full li{display:flex;gap:8px;align-items:center;justify-content:center;margin:4px 0}#result.full li span{width:14px;height:14px;border-radius:50%}
.result-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:8px}
#result.full button{max-width:none;font:700 16px Pretendard,sans-serif;padding:12px 20px;border-radius:12px;background:#65edcb;color:#101d32;border:0}#result.full button.ghost{background:transparent;color:#eaf2ff;border:1px solid #9fb4cf}
.burst{position:absolute;left:50%;top:38%;width:0;height:0;pointer-events:none}.burst i{position:absolute;width:8px;height:16px;border-radius:2px;background:var(--c);transform:rotate(var(--a)) translateY(0);animation:burst 1.4s ease-out forwards;opacity:0}
@keyframes burst{0%{opacity:1;transform:rotate(var(--a)) translateY(0)}100%{opacity:0;transform:rotate(var(--a)) translateY(-190px) rotate(180deg)}}
body:has(#result.full:not([hidden])) #guide-toggle,body:has(#result.full:not([hidden])) aside{display:none!important}
@media(prefers-reduced-motion:reduce){.burst{display:none}#result.full{animation:none}}

/* Start button always reachable; 안내 never covers course labels. */
#pick-sheet .pick-bottom{position:sticky;bottom:-14px;margin:10px -14px -14px;padding:10px 14px;background:#101d32fa;border-top:1px solid #47618266}

/* Desktop: readable 14px minimum and wider panels. */
@media(min-width:900px) and (min-height:600px){
 body{font-size:14px}header{height:56px}header h1{font-size:20px}#mode,#guide-toggle,#rank-toggle,.rank-title,.rank,.rank em,.race-info,#timer,footer,#quality,#fps,.guide-pill,#guides.whole-course .guide-pill,.tag,.tag.compact,#pick-sheet p,.pick-bottom small,.pick-slot,.name-edit,.name-edit input{font-size:14px!important;line-height:1.35!important}
 #mode{max-width:140px}aside{width:190px!important;top:110px}.rank{height:32px!important;min-height:32px!important;flex-basis:32px!important}.swatch{width:11px;height:11px}
 .race-info{top:76px}footer{top:92px}#fps{top:76px}#guide-toggle{top:110px}#guides.whole-course .guide-pill{max-width:24vw}
 #pick-sheet{width:420px}#pick-sheet h2{font-size:20px}#result:not(.full){height:44px;min-height:44px}#result:not(.full) h2{font-size:16px}#result:not(.full) button{font-size:14px}
}

#rules{position:fixed;z-index:15;left:12px;right:12px;top:72px;padding:12px 14px;border:1px solid #ffd27a;border-radius:14px;background:#14223afa;color:#f2f7ff;font:14px/1.5 Pretendard,sans-serif;box-shadow:0 8px 28px #0007}#rules[hidden]{display:none}#rules span{display:block;color:#d6e2f2;margin-top:4px}#rules button{display:block;margin:8px 0 0 auto;border:0;background:#65edcb;color:#101d32;border-radius:8px;padding:6px 14px;font:700 14px Pretendard,sans-serif;cursor:pointer}
@media(min-width:700px){#rules{left:auto;width:420px}}

.credit-mark{position:fixed;z-index:5;right:10px;bottom:max(8px,env(safe-area-inset-bottom));font:600 11px Pretendard,sans-serif;color:#c6d2e3;opacity:.75;text-decoration:none}body:has(#result.full:not([hidden])) .credit-mark{z-index:21;opacity:1}
/* Contrast: secondary text lifted to >=4.5:1 on navy panels. */
#pick-sheet p,.pick-bottom small,.name-edit,footer,#quality,.race-info,#result p{color:#c6d2e3}
@media(prefers-reduced-motion:reduce){.rank,.rank .swatch{animation:none!important}#countdown{animation:none!important}}
.picking .credit-mark{display:none}

#cam-bar{position:absolute;z-index:6;left:50%;transform:translateX(-50%);bottom:calc(max(15px,env(safe-area-inset-bottom)) + 30px);display:flex;gap:6px}#cam-bar button{font:700 12px Pretendard,sans-serif;color:#eaf2ff;background:#101d32d9;border:1px solid #47618299;border-radius:14px;padding:6px 11px;cursor:pointer}#cam-bar button[aria-pressed=true]{background:#c5ff57;color:#0b1026;border-color:#c5ff57}aside .rank{pointer-events:auto;cursor:pointer}aside{pointer-events:auto}.rank.watching{outline:1px solid #c5ff57}body.picking #cam-bar,body.closeup #cam-bar{display:none}

#result.mini{top:84px!important;bottom:auto;left:auto!important;right:12px!important;width:auto!important;max-height:none;padding:6px 12px!important;animation:none;text-align:left}#result.mini .burst,#result.mini #podium,#result.mini .result-actions,#result.mini p{display:none!important}#result.mini .winner-marble{width:26px;height:26px;margin:2px 8px 0 0}#result.mini h2{font-size:18px;margin:2px 0}#result.mini small{font-size:11px}#result.all-ranks #podium{max-height:38vh;overflow:auto;text-align:left;columns:2;column-gap:12px}#result.all-ranks #podium li{break-inside:avoid;font-size:13px}

#roster-list{display:flex;flex-direction:column;gap:6px;margin:6px 0}.roster-person{display:flex;align-items:center;gap:6px}.roster-person input{flex:1;min-width:0;padding:6px 8px;border-radius:8px;border:1px solid #ffffff30;background:#0e1830;color:#fff4e8;font:inherit}.roster-person b{min-width:22px;text-align:center}.roster-person .step,.roster-person .del{width:32px;height:32px;padding:0;border-radius:8px}.roster-person .del{opacity:.7}.roster-help{font-size:12px;opacity:.8;margin:4px 0}#roster-total{display:block;font-size:12px;opacity:.8;margin:4px 0}.winner-sub{margin:-4px 0 4px;font-size:13px;opacity:.85}.marble-list{opacity:.75;font-size:.85em}


/* Prep screen: keep only essentials (header mode + pick sheet). */
.picking aside,.picking .race-info,.picking footer,.picking #fps,.picking #countdown,.picking #final-two,.picking #guides,.picking #guide-toggle,.picking .credit-mark{display:none!important}
.picking header .progress{display:none}
.picking #pick-sheet{border-color:#65edcb;box-shadow:0 10px 32px #0007}
.pick-bottom{gap:12px}
.pick-bottom .pick-note{flex:0 1 auto;max-width:42%}



/* Count-only setup: name + stepper rows, auto color swatch. */
.roster-person .swatch{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff8,var(--look) 45%,#0006);border:1px solid #ffffff40;flex:0 0 auto}
.roster-actions{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:4px 0 8px}
#roster-names{margin-top:4px}
.picking #pick-sheet{max-height:70dvh}
#pick-sheet #roster-list{max-height:min(46dvh,360px);overflow:auto;margin:8px 0}

