@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@700;800;900&family=DM+Sans:wght@400;600;700&display=swap');
*{box-sizing:border-box}body{margin:0;background:#0c1725;color:white;font-family:'DM Sans',Arial,sans-serif;overflow:hidden}#world,#hud{position:fixed;inset:0}canvas{display:block;width:100%;height:100%}#hud{pointer-events:none;background:linear-gradient(#0b152c66,transparent 27%,transparent 70%,#071323cc)}header{display:flex;align-items:center;gap:30px;padding:24px 34px}.brand{font:900 34px 'Barlow Condensed',Impact,sans-serif;font-style:italic;letter-spacing:-1px}.brand span{color:#d9ff64}.brand sup{font:700 10px Arial;margin-left:6px;color:#d9ff64}.live{font-size:10px;letter-spacing:2px;color:#d9ff64}.live span{margin-left:20px;color:#fff9}button,input,select{font:inherit}button{pointer-events:auto;border:1px solid #ffffff25;color:white;background:#122036e8;border-radius:6px;padding:10px 12px;cursor:pointer;font-size:11px}button:hover,button.selected{background:#d9ff64;color:#152024}header button{margin-left:auto}.title{position:absolute;left:36px;top:110px}.title small{font-size:9px;letter-spacing:3px;color:#e3ffad}.title h1{font:900 clamp(38px,5vw,74px)/.9 'Barlow Condensed',Impact,sans-serif;font-style:italic;margin:14px 0}.title>span{font-size:8px;letter-spacing:1.4px;color:#fff9}.leaderboard{position:absolute;right:34px;top:118px;width:220px;background:#0b1729ce;border:1px solid #ffffff20;border-radius:10px;padding:17px;backdrop-filter:blur(10px)}.leaderboard>small{font-size:9px;letter-spacing:2px;color:#d9ff64}#ranking{margin-top:15px}.rank{display:flex;align-items:center;gap:8px;font-size:12px;padding:9px 0;border-bottom:1px solid #ffffff12}.rank b{color:#d9ff64;width:17px}.rank .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rank em{font-style:normal;font-size:9px;color:#9dabc1}.swatch{width:7px;height:7px;border-radius:50%}.leaderboard footer{font-size:10px;color:#a6b7cc;margin-top:14px}.camera-label{position:absolute;left:36px;bottom:163px;display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:1.5px}.camera-label i{background:#ff5d7f;border-radius:50%;width:6px;height:6px}#center{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);text-align:center;text-shadow:0 3px 25px #000a;width:80%}#center small{font-size:12px;letter-spacing:4px;color:#e1ff9c}#center b{display:block;font:900 clamp(46px,8vw,100px) 'Barlow Condensed',Impact,sans-serif;font-style:italic}#center span{font-size:12px}#arrival{position:absolute;left:36px;bottom:210px;border-left:4px solid #d9ff64;padding:15px 22px;background:#112036e8;max-width:80vw}#arrival small{display:block;font-size:9px;letter-spacing:2px;color:#d9ff64}#arrival b{display:block;font-size:24px;margin-top:5px;overflow-wrap:anywhere}.bottom{position:absolute;bottom:24px;left:34px;right:34px}.join{display:flex;align-items:center;gap:8px;font-size:18px}.join b{font-size:30px;color:#d9ff64}.join span{font-size:11px;color:#ffffffb0}.camera-buttons{position:absolute;right:0;top:0;display:flex;gap:5px}.camera-buttons button{font-size:9px;padding:10px}.progress{height:4px;background:#ffffff20;margin-top:22px;border-radius:5px}.progress div{height:100%;background:#d9ff64;transition:width .2s}.meta{display:flex;justify-content:space-between;margin-top:10px;font-size:8px;letter-spacing:1.3px;color:#fff9}aside{position:fixed;right:24px;top:82px;bottom:24px;width:330px;overflow:auto;padding:23px;background:#101d31f5;border:1px solid #ffffff25;border-radius:12px;z-index:5;box-shadow:0 20px 80px #0008}aside[hidden]{display:none}aside h2{font-size:19px;margin:0;display:flex;justify-content:space-between;align-items:center}aside h2 button{padding:4px 10px}aside p{font-size:11px;color:#aab9cf;line-height:1.8}aside>button{display:block;width:100%;margin:12px 0}.primary{background:#d9ff64;color:#17221a;font-weight:700}aside small{display:block;font-size:10px;color:#d9ff64;line-height:1.7}label{display:flex;justify-content:space-between;align-items:center;margin:20px 0;font-size:12px}select,input{background:#091322;border:1px solid #ffffff30;border-radius:4px;padding:8px;color:white;font-size:11px}form{display:flex;gap:6px}input{min-width:0;flex:1}#podium{position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);text-align:center;background:#0c1a2ee8;padding:30px 60px;border:1px solid #d9ff6466;border-radius:15px;max-width:80vw}#podium b{display:block;font:900 48px 'Barlow Condensed',Impact,sans-serif;color:#d9ff64;overflow-wrap:anywhere}#podium p{font-size:12px;color:#b9cbe0}#podium ol{text-align:left;font-size:14px;line-height:2}#podium small{letter-spacing:3px;color:#d9ff64}@media(max-width:760px){header{padding:18px;gap:12px}.brand{font-size:26px}.live{font-size:8px}.live span{display:none}.title{left:18px;top:95px}.title h1{font-size:40px}.title>span{font-size:6px}.leaderboard{right:18px;top:100px;width:150px;padding:12px}.leaderboard>small{font-size:7px}.rank{font-size:10px;padding:7px 0}.bottom{left:18px;right:18px;bottom:18px}.join{font-size:14px}.join span{max-width:130px;font-size:9px}.camera-buttons{position:static;margin-top:12px}.camera-buttons button{font-size:7px;padding:8px}.camera-label{left:18px;bottom:180px}.meta{font-size:6px}.meta span:last-child{max-width:140px;text-align:right}aside{width:min(330px,calc(100vw - 24px));right:12px}#arrival{left:18px;bottom:220px}}
/* Broadcast: exact portrait frame independent of the operator window. */
.output-link{display:block;text-decoration:none;background:#d9ff64;color:#17221a;padding:13px;border-radius:6px;font-size:12px;font-weight:700;margin:16px 0 5px}.capture-help{font-size:10px!important;color:#d9ff64!important}#volume{width:130px;flex:none}.live-view{background:#060b13}.live-view #world,.live-view #hud{width:min(100vw,56.25vh);height:min(100vh,177.7778vw);inset:0;left:50%;transform:translateX(-50%);overflow:hidden}.live-view #controls,.live-view #controlsToggle,.live-view .camera-buttons{display:none!important}.live-view header{padding:19px 20px;gap:8px}.live-view .brand{font-size:29px}.live-view .live{margin-left:auto;font-size:7px;letter-spacing:1px}.live-view .live span{display:block;margin:4px 0 0;text-align:right}.live-view .title{top:80px;left:20px}.live-view .title h1{display:none}.live-view .title small{font-size:7px;letter-spacing:2px}.live-view .title>span{display:none}.live-view .leaderboard{top:106px;left:20px;right:auto;width:155px;padding:11px;border-radius:8px;background:#0b1729b0}.live-view .leaderboard>small{font-size:7px;letter-spacing:1px}.live-view #ranking{margin-top:8px}.live-view .rank{font-size:10px;padding:6px 0;gap:5px}.live-view .rank b{width:14px}.live-view .rank em{font-size:8px}.live-view .leaderboard footer{font-size:8px;margin-top:8px}.live-view .bottom{left:20px;right:48px;bottom:100px}.live-view .join{display:block;font-size:13px}.live-view .join b{font-size:27px}.live-view .join span{display:block;font-size:10px;max-width:none;line-height:1.6}.live-view .progress{margin-top:10px;height:3px}.live-view .meta{display:block;font-size:7px}.live-view .meta span{display:block;text-align:left!important;max-width:none!important;margin-top:5px}.live-view .camera-label{left:20px;bottom:208px;font-size:7px;letter-spacing:1px}.live-view #arrival{left:20px;bottom:247px;max-width:80%;padding:10px 15px}.live-view #arrival small{font-size:7px}.live-view #arrival b{font-size:19px}.live-view #center{top:44%;width:90%}.live-view #center small{font-size:9px;letter-spacing:2px}.live-view #center b{font-size:50px}.live-view #center span{font-size:10px;display:block;margin:0 auto;max-width:230px}.live-view #podium{top:45%;padding:25px 20px;width:83%}.live-view #podium b{font-size:33px}.live-view #podium small{font-size:8px}.live-view #podium ol{font-size:12px}#hud [hidden]{display:none!important}
/* Keep the operator camera buttons clear of the side panel. */
body:not(.live-view) .camera-buttons{position:static;margin-top:10px;display:flex;flex-wrap:wrap;max-width:560px}body:not(.live-view) .bottom{right:380px}body:not(.live-view) .camera-label{bottom:180px}body:not(.live-view) .meta{gap:14px}body:not(.live-view) .join span{max-width:270px}body:not(.live-view) .title{pointer-events:none}@media(max-width:850px){body:not(.live-view) .bottom{right:18px}body:not(.live-view) .camera-buttons{max-width:360px}}
.live-view .title{display:none}.live-view .leaderboard{top:74px;width:142px}.live-view .rank:nth-child(n+4){display:none}.live-view .leaderboard footer{font-size:7px}.live-view .rank{padding:5px 0}.live-view .leaderboard>small{font-size:6px}
.live-view #hud{width:405px;height:720px;transform:translateX(-50%) scale(var(--live-scale,1));transform-origin:top center}.live-view .leaderboard{left:auto;right:20px}
.avatar-link{display:block;color:#d9ff64;font-size:11px;padding:12px 0;text-decoration:none}
#tapDiagnostics{margin:14px 0;padding:12px;border:1px solid #d9ff6450;border-radius:6px;color:#d9ff64;background:#101827;font-size:11px;line-height:1.8}#speedHud{position:absolute;left:36px;bottom:225px;background:#112036cc;border-left:3px solid #d9ff64;padding:10px 14px;border-radius:4px}#speedHud small{display:block;font-size:8px;letter-spacing:1px;color:#d9ff64}#speedHud b{display:block;font-size:26px;margin:4px 0}#speedHud span{display:block;font-size:10px;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.live-view #speedHud{left:20px;bottom:248px;padding:8px 10px}.live-view #speedHud b{font-size:21px}.live-view #speedHud small{font-size:6px}.live-view #speedHud span{font-size:8px;max-width:180px}.live-view #arrival:not([hidden])~#speedHud{display:none}
/* Live output always fills the browser source, without embedded letterboxing. */
.live-view #world{inset:0;width:100vw;height:100vh;transform:none;left:0}.live-view #hud{width:var(--hud-width,405px);height:var(--hud-height,720px);left:50%;top:0;transform:translateX(-50%) scale(var(--live-scale,1));background:linear-gradient(#112c4659,transparent 20%,transparent 62%,#10273c99)}.live-view .leaderboard{background:linear-gradient(140deg,#173a4bea,#13293cdb);border:1px solid #d1f6e539;box-shadow:0 8px 25px #10233425;border-radius:11px}.live-view .brand{text-shadow:0 3px 10px #17425760}.live-view .bottom{background:linear-gradient(110deg,#102b3eeb,#173849b0);border:1px solid #a3c8d228;border-radius:11px;padding:10px 12px;bottom:95px}.live-view .join{font-size:11px}.live-view .join b{background:#d9ff64;color:#17372e;border-radius:5px;font-size:22px;padding:0 6px;margin:0 3px}.live-view .join span{font-size:8px;margin-top:5px}.live-view .meta{font-size:6px;letter-spacing:.7px}.live-view .progress{background:#c6e6e532}.live-view #speedHud{background:linear-gradient(130deg,#16344be8,#214f5cdd);border-radius:9px;border-left:3px solid #ddff75;box-shadow:0 5px 18px #132b3c33;bottom:248px}.live-view #speedHud b{font-family:'Barlow Condensed',Impact,sans-serif;font-size:28px;font-style:italic}.live-view .camera-label{bottom:225px;opacity:.8}.live-view #podium{background:linear-gradient(130deg,#123746f5,#253e50f5);box-shadow:0 20px 60px #08233166;border-radius:20px}.live-view #arrival{border-radius:0 10px 10px 0;background:#183d50ed}.live-view #center b{color:#f9ffd7;text-shadow:0 4px 0 #20463360,0 8px 30px #173b4770}
.links-card{border:1px solid #d9ff6455;border-radius:10px;padding:14px;margin:18px 0;background:#152d31}.links-card>b{font-size:10px;letter-spacing:1px;color:#d9ff64}.links-card input{width:100%;margin:12px 0 8px;font-size:10px;padding:10px;min-width:0}.links-card button{display:block;width:100%;margin:5px 0 10px;background:#d9ff64;color:#17352b}.links-card>a{display:block;font-size:11px;color:#e8ffd0;margin:8px 0}.links-card small{font-size:9px;line-height:1.7;color:#bdcbb9}.links-card details{font-size:10px;margin-top:12px;color:#c0cdbd}.links-card summary{cursor:pointer}
#tapTest{touch-action:none;user-select:none}#tapTest.holding{background:#d9ff64;color:#143321;box-shadow:0 0 0 3px #d9ff6440}
#minimap{position:absolute;left:36px;top:320px;width:184px;padding:12px;background:linear-gradient(145deg,#163747ed,#102a3ce6);border:1px solid #cde8e030;border-radius:12px;box-shadow:0 8px 30px #081c3025}#minimap>div{display:flex;justify-content:space-between;gap:5px;font-size:8px;align-items:center}#minimap b{color:#d9ff64;letter-spacing:1px}#minimap span{font-size:7px;color:#c1d2d4}#minimapCanvas{width:150px;height:90px;display:block;margin:3px auto}#mapLeader{font-size:9px;color:#e9f5dc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;padding:0}.live-view #minimap{left:20px;top:75px;width:150px;padding:8px;border-radius:10px}.live-view #minimapCanvas{width:134px;height:80px;margin:0 auto}.live-view #minimap>div{font-size:6px}.live-view #minimap span{font-size:6px}.live-view #mapLeader{font-size:7px;margin-top:2px}.live-view #minimap b{letter-spacing:.7px}@media(max-width:760px){body:not(.live-view) #minimap{left:18px;top:265px;width:170px}}
/* Strict portrait output: the game never changes to a landscape camera. */
body.live-view{background:transparent!important}.live-view #world{inset:auto;top:0;left:50%;width:min(100vw,56.25vh);height:min(100vh,177.7777778vw);transform:translateX(-50%);overflow:hidden;aspect-ratio:9/16}.live-view #hud{top:0;left:50%;width:405px!important;height:720px!important;transform:translateX(-50%) scale(var(--live-scale,1));transform-origin:top center;overflow:hidden}
/* TikTok chat covers the lower part of the portrait: keep instructions above it. */
.live-view .bottom{top:65px;bottom:auto;left:20px;right:56px;padding:8px 10px;border-radius:9px}
.live-view .join{display:flex;flex-wrap:wrap;align-items:center;gap:3px;font-size:11px}
.live-view .join b{font-size:19px;margin:0 2px}
.live-view .join span{flex-basis:100%;font-size:9px;line-height:1.35;margin-top:0}
.live-view .progress{margin-top:6px}
.live-view .meta{margin-top:5px;line-height:1.3}
.live-view .meta span{margin-top:0}
.live-view .meta span:last-child{display:none}
.live-view #minimap,.live-view .leaderboard{top:155px}
.live-view .camera-label{top:139px;bottom:auto;left:20px;font-size:6px}
.live-view #speedHud{top:290px;bottom:auto;left:20px}
.live-view .camera-label{top:278px;bottom:auto}
.live-view .title{display:block;top:49px;left:20px;right:56px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.live-view .title small{font-size:7px;letter-spacing:1px;color:#e7ffc6}