@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700;800&display=swap');
:root{--bg:#061117;--panel:rgba(6,19,26,.78);--border:rgba(169,218,222,.16);--dim:#859ca2;--text:#f2faf9;--lime:#d4fb67;--cyan:#69d7de;--orange:#ff8e51;--danger:#ff6d60}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--text);font-family:'DM Sans',Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--lime);outline-offset:3px}#app{height:100%;height:100dvh;width:100%;overflow:hidden;position:relative;isolation:isolate}#scene{width:100%;height:100%;display:block;position:absolute;inset:0;background:linear-gradient(#16394e 5%,#426b79 56%,#9baca5 100%)}.noise{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0,transparent 3px,rgba(0,0,0,.012) 4px);z-index:2}.render-error{position:absolute;inset:20%;display:grid;place-items:center;color:white;background:#09202a;z-index:90;padding:40px;text-align:center}.hidden{display:none!important}.topbar{position:absolute;z-index:5;inset:0 0 auto;height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,3vw,52px);border-bottom:1px solid rgba(203,239,237,.13);background:linear-gradient(180deg,rgba(2,12,17,.9),rgba(2,12,17,.2));gap:25px}.brand{display:flex;align-items:center;gap:12px;font-family:'Barlow Condensed',Arial,sans-serif;font-weight:900;font-size:26px;letter-spacing:1px;white-space:nowrap}.brand-icon{font-size:31px;color:var(--lime);display:inline-block;transform:rotate(45deg)}.brand-accent{color:var(--lime)}.brand small{font-size:12px;padding:3px 5px;border:1px solid #70858b;border-radius:3px;vertical-align:middle;letter-spacing:2px}.edition{font:700 10px 'DM Sans',Arial,sans-serif;letter-spacing:2px;color:#7f959a;border-left:1px solid #4e656c;padding-left:14px;margin-left:3px}.top-mid{display:flex;align-items:center;gap:10px;font-size:10px;font-weight:800;letter-spacing:1.7px;color:#d8e8e6}.live-dot{width:7px;height:7px;background:var(--lime);border-radius:50%;box-shadow:0 0 12px rgba(212,251,103,.65);display:inline-block;flex:none}.top-divider{height:16px;width:1px;background:#50636a;margin:0 12px}.header-actions{display:flex;align-items:center;gap:12px}.icon-btn,.action-btn{border:1px solid rgba(197,228,226,.27);color:#e8f4f0;background:rgba(7,23,29,.5);border-radius:4px;font-weight:800}.icon-btn{width:36px;height:36px;display:grid;place-items:center;font-size:16px}.action-btn{height:38px;padding:0 17px;font-size:10px;letter-spacing:1.5px;display:flex;align-items:center;gap:12px}.action-btn .gear{font-size:17px}.icon-btn:hover,.action-btn:hover,.secondary-btn:hover,.outline-btn:hover,.small-outline:hover{background:rgba(150,202,205,.15);border-color:rgba(226,249,243,.6)}.hud{position:absolute;z-index:3;top:106px;width:230px;background:linear-gradient(110deg,rgba(3,15,20,.78),rgba(3,15,20,.45));padding:20px;border:1px solid rgba(174,223,220,.12);border-top:1px solid rgba(174,223,220,.3);backdrop-filter:blur(10px);pointer-events:none}.hud-left{left:clamp(20px,3vw,52px)}.hud-right{right:clamp(20px,3vw,52px);width:236px}.hud-label{font-weight:800;color:#d5e5e3;font-size:10px;letter-spacing:2.25px;margin-bottom:18px;white-space:nowrap}.tiny-lines{float:right;color:var(--lime);opacity:.7}.hud-metric{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid rgba(181,222,220,.13);padding:8px 0 9px}.hud-metric>span{font-size:9px;letter-spacing:1px;font-weight:700;color:#a7bdbe}.hud-metric strong{font-family:'Barlow Condensed',Arial,sans-serif;font-weight:700;font-size:27px;line-height:1;letter-spacing:.3px}.hud-metric strong small{font:700 10px 'DM Sans',Arial,sans-serif;color:#a0b8b7;margin-left:4px}.meter{height:4px;background:#4f6063;margin-top:12px;overflow:hidden}.meter>div{height:100%;width:0;background:var(--lime);box-shadow:0 0 10px var(--lime);transition:width .1s}.control-source{margin-top:20px;display:flex;align-items:center;gap:9px;font-size:10px;letter-spacing:1.5px;color:#b6c7c7;font-weight:800}.source-dot{display:block;width:7px;height:7px;border:1px solid var(--cyan);border-radius:50%}.source-dot.online{background:var(--lime);border-color:var(--lime)}.lap-row{display:flex;justify-content:space-between;align-items:center;font-size:10px;font-weight:700;color:#b0c3c4;letter-spacing:1px}.lap-row strong{font:700 23px 'Barlow Condensed',Arial,sans-serif;color:#eef9f6}.lap-row>span:last-child{font-size:11px;color:#f1f9f6}.race-time{font:800 46px/1.2 'Barlow Condensed',Arial,sans-serif;letter-spacing:1px;color:var(--lime);margin:6px 0 14px;font-variant-numeric:tabular-nums}.race-sep{height:1px;background:rgba(201,231,226,.17);margin:20px 0 18px}.gate-label{margin-bottom:6px}.gate-number{display:flex;align-items:baseline;gap:7px}.gate-number strong{font:800 57px/1 'Barlow Condensed',Arial,sans-serif;color:#effbf7}.gate-number>span{font:700 19px 'Barlow Condensed',Arial,sans-serif;color:#738b90}.gate-number .gate-distance{margin-left:auto;color:var(--lime);font:700 12px 'DM Sans',Arial,sans-serif}.gate-pips{display:flex;gap:4px;margin-top:14px}.gate-pips span{flex:1;height:4px;background:#587078}.gate-pips span.done{background:var(--lime)}.gate-pips span.current{background:#fff}.horizon{position:absolute;left:50%;top:50%;width:240px;height:60px;transform:translate(-50%,-50%);z-index:2;pointer-events:none;opacity:.7}.horizon-line{display:flex;align-items:center;justify-content:center;gap:6px;position:absolute;width:100%;top:50%;font:600 10px 'Barlow Condensed',Arial,sans-serif;color:#e8fcfd}.horizon-line i{height:1px;background:rgba(242,255,249,.66);flex:1}.crosshair{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:40px;height:40px;pointer-events:none;z-index:4}.crosshair-dot{position:absolute;left:18px;top:18px;width:4px;height:4px;border-radius:50%;background:var(--lime)}.crosshair-l,.crosshair-r,.crosshair-t,.crosshair-b{position:absolute;background:rgba(225,255,235,.8)}.crosshair-l,.crosshair-r{height:1px;width:9px;top:19px}.crosshair-l{left:0}.crosshair-r{right:0}.crosshair-t,.crosshair-b{width:1px;height:9px;left:19px}.crosshair-t{top:0}.crosshair-b{bottom:0}.flight-notice{position:absolute;z-index:3;top:25%;left:50%;transform:translateX(-50%);font:800 17px 'Barlow Condensed',Arial,sans-serif;letter-spacing:2px;color:var(--lime);text-shadow:0 2px 12px #102229;pointer-events:none;opacity:0;transition:opacity .3s;white-space:nowrap}.flight-notice.show{opacity:1}.minimap-panel{position:absolute;z-index:4;right:clamp(20px,3vw,52px);bottom:86px;width:212px;padding:10px;background:rgba(3,17,22,.77);border:1px solid rgba(183,230,224,.18);backdrop-filter:blur(10px);pointer-events:none}.map-title{display:flex;justify-content:space-between;font-size:9px;font-weight:800;letter-spacing:1.2px;color:#d9e9e5;padding:2px 2px 8px}.map-title span:last-child{color:var(--lime)}#minimap{display:block;width:190px;height:136px;opacity:.95}.bottom-strip{position:absolute;z-index:4;bottom:0;width:100%;height:65px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,3vw,52px);background:linear-gradient(0deg,rgba(2,11,14,.91),rgba(5,19,24,.58));border-top:1px solid rgba(189,229,220,.15);gap:12px}.bottom-left{display:flex;align-items:center;gap:8px;color:#a6bbba;letter-spacing:1px;font-size:9px;font-weight:800;white-space:nowrap}.kbd-chip{display:inline-block;padding:4px 5px;border:1px solid #526f71;border-radius:3px;font-size:10px;color:#d6e7e2;margin-left:7px}.kbd-chip:first-child{margin-left:0}.bottom-sep{display:inline-block;height:17px;min-width:1px;width:1px;background:#4f686a;margin:0 11px;color:transparent}.bottom-right{display:flex;align-items:center;gap:9px}.text-btn{display:flex;align-items:center;gap:9px;border:0;background:transparent;color:white;padding:4px}.micro-label{font-size:9px;font-weight:800;letter-spacing:1px;color:#799598}.text-btn strong{font:800 16px 'Barlow Condensed',Arial,sans-serif;letter-spacing:1px;color:var(--lime)}.small-arrow{color:#abbebe}.fps-readout{font:800 11px 'Barlow Condensed',Arial,sans-serif;color:#bad0ca;white-space:nowrap}.fps-readout span{color:var(--lime)}
/* Fullscreen overlays */
.overlay{position:absolute;z-index:10;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,rgba(2,14,19,.93) 0%,rgba(2,14,19,.73) 45%,rgba(2,14,19,.20) 100%);backdrop-filter:blur(3px)}.welcome-overlay{justify-content:flex-start;padding:80px clamp(24px,9vw,150px) 65px}.welcome-card{max-width:630px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:2.8px;font-weight:800;color:var(--lime)}.version-chip{margin-left:10px;padding:5px 7px;background:#284049;color:#d9e9e7;font-size:8px;letter-spacing:1px}.welcome-card h1{font:900 clamp(58px,6.3vw,96px)/.88 'Barlow Condensed','Arial Narrow',Arial,sans-serif;letter-spacing:-1.2px;margin:26px 0 24px;color:#f3fcf8}.welcome-card h1 em{color:var(--lime);font-style:normal}.title-period{color:var(--lime)}.welcome-card>p{max-width:520px;color:#b8cbc9;font-size:14px;line-height:1.8;margin-bottom:29px}.intro-highlights{display:flex;gap:0;margin-bottom:30px;border-top:1px solid #3a545a;border-bottom:1px solid #3a545a;max-width:495px;padding:17px 0}.intro-highlights>div{flex:1;display:flex;gap:12px;align-items:center;padding:0 16px;border-right:1px solid #426168}.intro-highlights>div:first-child{padding-left:0}.intro-highlights>div:last-child{border:0}.intro-highlights strong{font:800 37px 'Barlow Condensed',Arial,sans-serif;color:#f0faf5}.intro-highlights span{font-size:9px;font-weight:800;letter-spacing:1.2px;color:#a8c1c0}.intro-actions{display:flex;gap:10px;flex-wrap:wrap}.primary-btn,.secondary-btn,.outline-btn{height:52px;border-radius:4px;padding:0 21px;display:inline-flex;justify-content:center;align-items:center;gap:14px;font-size:11px;font-weight:800;letter-spacing:1.3px}.primary-btn{border:1px solid var(--lime);background:var(--lime);color:#08171a;min-width:207px;box-shadow:0 7px 32px rgba(200,247,95,.12)}.primary-btn:hover{background:#e5ff9a}.primary-btn .arrow,.intro-actions .arrow{font-size:19px;margin-left:14px}.secondary-btn{background:rgba(11,30,35,.6);border:1px solid #789193;color:#e9f8f3}.intro-footnote{margin-top:23px;color:#8facae;font-size:10px;font-weight:600;letter-spacing:.2px}.keyboard-icon{font-size:18px;margin-right:7px}.dot-sep{padding:0 5px}.intro-side{position:absolute;right:3vw;bottom:100px;display:flex;align-items:center;gap:14px;writing-mode:vertical-rl;letter-spacing:3px;font-size:10px;font-weight:800;color:#aac5bf}.vertical-rule{height:110px;width:1px;background:var(--lime)}.modal-overlay{background:rgba(2,12,16,.75);backdrop-filter:blur(12px);padding:25px}.result-card{max-width:440px;width:100%;padding:42px;background:#0b1f27;border:1px solid #537075;text-align:center;box-shadow:0 30px 90px #020f13}.result-card .eyebrow{justify-content:center}.result-card h2{font:900 60px/.93 'Barlow Condensed',Arial,sans-serif;margin:18px 0}.result-card h2 span{color:var(--danger)}.result-card h2 em{font-style:normal;color:var(--lime)}.result-card>p{font-size:13px;line-height:1.7;color:#abc1c0}.result-stat{border-top:1px solid #36535b;margin:20px 0;display:flex;justify-content:space-between;align-items:center;padding-top:14px;font-size:10px;font-weight:800;letter-spacing:1px;color:#b8cacc}.result-stat strong{color:var(--lime);font:800 27px 'Barlow Condensed',Arial,sans-serif}.result-card .primary-btn{width:100%;margin-top:15px}.danger{color:var(--danger)}
/* Settings */
.drawer-backdrop{position:absolute;z-index:14;inset:0;background:rgba(0,7,12,.55)}.settings-drawer{z-index:15;position:absolute;right:0;top:0;bottom:0;width:min(450px,100%);display:flex;flex-direction:column;background:#081c24;border-left:1px solid #45656a;box-shadow:-25px 0 90px #001015}.drawer-top{padding:27px 28px 22px;border-bottom:1px solid #2d4951;display:flex;justify-content:space-between;align-items:start}.drawer-eyebrow{font-size:9px;color:var(--lime);letter-spacing:2px;font-weight:800}.drawer-top h2,.help-card h2{font:800 37px 'Barlow Condensed',Arial,sans-serif;margin:6px 0 0}.settings-scroll{flex:1;overflow-y:auto;padding:0 28px 25px;scrollbar-color:#48636a #081c24;scrollbar-width:thin}.settings-section{padding:26px 0 23px;border-bottom:1px solid #2c424a}.section-heading{display:flex;align-items:center;gap:11px;margin-bottom:16px}.section-heading>span{font:800 15px 'Barlow Condensed',Arial,sans-serif;color:var(--lime)}.section-heading h3{font-size:14px;margin:0}.support-note{font-size:11px;line-height:1.6;color:#99bdc1;background:rgba(44,98,104,.14);border-left:2px solid var(--cyan);padding:11px 12px;margin-bottom:14px}.support-note.warn{border-color:var(--orange)}.controller-card{display:flex;gap:13px;align-items:center;border:1px solid #35535b;padding:13px;background:#0d2831}.controller-symbol{font-size:28px;color:var(--lime)}.controller-card>div:nth-child(2){flex:1;min-width:0}.controller-card strong{font-size:11px;display:block;margin-bottom:4px}.controller-card span:not(.status-pill){font-size:10px;color:#91afb4;display:block}.status-pill{font-size:9px;letter-spacing:.6px;padding:5px 7px;border-radius:2px;background:#24404a;color:#b6c9cb}.status-pill.online{background:#365638;color:var(--lime)}.outline-btn{border:1px solid #70929a;background:transparent;color:#e9f5f1;width:100%;font-size:10px;margin-top:11px}.minor-btn{background:none;border:0;color:#a9c6ca;text-decoration:underline;text-underline-offset:3px;font-size:11px;padding:10px 0}.field-helper{font-size:10px;line-height:1.7;color:#88a6a9;margin:11px 0 0}.sticks{display:flex;gap:16px}.stick-area{flex:1}.stick-label{display:flex;flex-direction:column;gap:3px;font-size:10px;font-weight:800;letter-spacing:.7px;color:#d6e8e7;margin-bottom:8px}.stick-label span{font-size:8px;letter-spacing:.4px;color:#83a1a7}.stick-box{height:112px;position:relative;border:1px solid #44616a;background:radial-gradient(circle at center,#213d43,#0e2630 70%);overflow:hidden}.stick-box:before,.stick-box:after{content:'';position:absolute;background:#3e6268}.stick-box:before{width:1px;height:100%;left:50%;top:0}.stick-box:after{height:1px;width:100%;left:0;top:50%}.stick-h,.stick-v{position:absolute;border:1px solid rgba(91,141,147,.26);border-radius:50%;width:80%;height:80%;top:10%;left:10%}.stick-v{width:50%;height:50%;top:25%;left:25%}.stick-point{position:absolute;z-index:1;left:50%;top:50%;width:13px;height:13px;border-radius:50%;transform:translate(-50%,-50%);background:var(--lime);box-shadow:0 0 14px rgba(212,251,103,.55)}.axis-readings{display:grid;grid-template-columns:repeat(4,1fr);margin:14px 0 5px;gap:7px}.axis-readings>div{font-size:9px;letter-spacing:.6px;color:#8eaaa9;background:#102f36;padding:9px 7px}.axis-readings span{display:block;font-size:14px;font-family:'Barlow Condensed',Arial,sans-serif;font-weight:800;color:#e7f8f5;margin-top:3px}.two-buttons{display:flex;gap:8px;margin-top:14px}.small-outline{flex:1;border:1px solid #57767c;background:#143039;color:#ebf8f6;font-size:10px;padding:10px}.small-outline:disabled{opacity:.35;cursor:default}.setting-row{display:flex;justify-content:space-between;align-items:center;gap:14px;font-size:11px;color:#b8d0d0;font-weight:700;margin-top:19px}.setting-row strong{color:var(--lime);font-size:12px}.field-label{display:block;font-size:11px;font-weight:700;color:#b8d0d0;margin:15px 0 8px}input[type=range]{width:100%;accent-color:var(--lime);margin:12px 0 2px}input[type=checkbox]{width:17px;height:17px;accent-color:var(--lime);cursor:pointer}select{appearance:none;width:100%;border:1px solid #496c74;background:#122f38;color:#e8f4f3;padding:13px;font-size:11px;outline:none;border-radius:3px}.info-row{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #2b4650;padding:10px 0;font-size:10px;color:#95afb3}.info-row strong{color:#e4f0ec;font-size:11px}.drawer-footer{border-top:1px solid #2d4951;padding:15px 28px 21px}.drawer-footer .primary-btn{width:100%;justify-content:space-between}.help-card{max-width:770px;width:100%;background:#0b232c;border:1px solid #55767b;padding:32px;max-height:90vh;overflow:auto;box-shadow:0 30px 90px #001317}.help-head{display:flex;align-items:start;justify-content:space-between}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin:24px 0}.help-grid h3{font-size:11px;letter-spacing:2px;color:var(--lime);margin:0 0 14px}.help-line{display:flex;justify-content:space-between;border-bottom:1px solid #294951;padding:10px 0;gap:10px;font-size:11px;color:#b7cece}.help-line span:first-child{color:#e9f4f3;font-weight:800}.help-grid p{font-size:12px;color:#a9c1c1;line-height:1.85}.help-grid .help-warning{border-left:2px solid var(--orange);padding:10px;background:#102c34}.toast{position:absolute;z-index:30;bottom:83px;left:50%;transform:translate(-50%,15px);background:#d6f86d;color:#0d2526;padding:12px 20px;font-size:11px;font-weight:800;letter-spacing:.4px;border-radius:3px;box-shadow:0 16px 40px #011417;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:min(90%,520px);text-align:center}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:1090px){.edition,.top-mid,.bottom-left{display:none}.hud{top:90px}.hud-left{left:16px}.hud-right{right:16px}.bottom-strip{justify-content:flex-end}.minimap-panel{right:16px}}@media(max-width:670px){.topbar{height:62px;padding:0 14px}.brand{font-size:21px}.brand-icon{font-size:25px}.action-btn{padding:0 10px}.action-btn>span:last-child{display:none}.hud{top:76px;width:149px;padding:11px}.hud-right{width:145px}.hud-label{font-size:8px;letter-spacing:1px;margin-bottom:9px}.hud-metric{padding:6px 0}.hud-metric>span{font-size:8px}.hud-metric strong{font-size:21px}.hud-metric strong small{font-size:8px}.control-source{font-size:8px}.race-time{font-size:29px}.gate-number strong{font-size:36px}.gate-number>span{font-size:14px}.lap-row{font-size:8px}.lap-row strong{font-size:16px}.minimap-panel{width:140px;bottom:62px;right:8px;padding:5px}.minimap-panel canvas{width:128px;height:92px}.map-title{font-size:7px}.bottom-strip{height:53px;padding:0 12px}.micro-label{display:none}.fps-readout{display:none}.bottom-right{gap:2px}.bottom-sep{margin:0 4px}.welcome-overlay{padding:80px 26px 45px;justify-content:center}.welcome-card h1{font-size:clamp(55px,13vw,76px)}.welcome-card>p{font-size:12px}.intro-highlights strong{font-size:26px}.intro-highlights span{font-size:7px}.intro-highlights>div{padding:0 8px;gap:5px}.intro-actions{flex-direction:column}.intro-actions button{width:100%}.intro-side{display:none}.settings-scroll,.drawer-top{padding-left:18px;padding-right:18px}.drawer-footer{padding-left:18px;padding-right:18px}.help-grid{grid-template-columns:1fr;gap:20px}.help-card{padding:20px}.help-card h2{font-size:29px}.horizon{width:155px}.crosshair{transform:translate(-50%,-50%) scale(.75)}}@media(max-height:710px) and (min-width:671px){.welcome-card h1{font-size:74px;margin:14px 0}.welcome-card>p{margin-bottom:15px}.intro-highlights{margin-bottom:18px;padding:10px 0}.intro-footnote{margin-top:12px}.hud{top:85px}.minimap-panel{bottom:74px}}

/* Keep heading on two lines even when hosted Google Fonts are unavailable */
.welcome-card h1{max-width:750px;white-space:nowrap}.welcome-card{max-width:750px}@media(max-width:670px){.welcome-card h1{font-size:clamp(43px,10vw,64px);letter-spacing:-2px;white-space:nowrap}.welcome-card{max-width:100%}}
