:root{font-family:Inter,Arial,sans-serif;color:#dce4df;background:#0c1417;font-synthesis:none;-webkit-font-smoothing:antialiased;--panel:rgba(11,21,24,.93);--line:rgba(195,219,211,.13);--muted:#829792;--accent:#e7aa71;--teal:#93c6b5}
*{box-sizing:border-box}html,body,#app,#ui-root{width:100%;height:100%;margin:0;overflow:hidden}body{background:#0c1417}#app{position:fixed;inset:0}#app canvas{display:block;width:100%;height:100%;outline:0}button,input{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible{outline:2px solid #f6c18b;outline-offset:3px}.is-hidden{display:none!important}#ui-root{position:fixed;inset:0;pointer-events:none;z-index:3}#ui-root button,#ui-root input,#ui-root .panel-scroller,#ui-root .mini-map{pointer-events:auto}
.topbar{position:absolute;top:0;left:0;right:0;height:81px;padding:0 34px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(to bottom,rgba(5,13,15,.88),rgba(5,13,15,.31) 75%,transparent);pointer-events:none;z-index:6}.logo-lockup{display:flex;align-items:center;gap:12px}.logo-symbol{position:relative;border:1px solid #c1dfd6;width:31px;height:31px;display:flex;align-items:center;justify-content:center;transform:rotate(45deg)}.logo-symbol span{width:18px;height:1.5px;background:#e4f0e9;position:absolute;transform:rotate(-45deg)}.logo-symbol span:nth-child(2){width:11px;transform:translate(0,6px) rotate(-45deg)}.logo-symbol span:nth-child(3){width:8px;transform:translate(0,-6px) rotate(-45deg)}.logo-word{font-family:'Barlow Condensed',Impact,sans-serif;font-size:25px;font-weight:800;letter-spacing:2.5px;line-height:1;color:#fff}.logo-word>span:first-child{color:#e5a774}.logo-ver{font:500 9px 'DM Mono',monospace;color:#859d98;margin-left:9px;letter-spacing:0}.logo-sub{font:10px 'DM Mono',monospace;letter-spacing:2px;color:#8da6a0;margin-top:6px}.top-right{display:flex;align-items:center;gap:22px;pointer-events:auto}.top-seed{color:#728e87;font:10px 'DM Mono',monospace;letter-spacing:1px}.top-seed b{font-weight:500;color:#c0d0c6;margin-left:8px}.hide-button{border:1px solid #486160;color:#b4c7be;background:rgba(9,19,23,.72);padding:10px 14px;font:10px 'DM Mono',monospace;letter-spacing:1.1px}.hide-button:hover{background:#273e3b;color:#f3f7f1}
.control-panel{position:absolute;top:97px;left:18px;bottom:81px;width:337px;background:var(--panel);border:1px solid rgba(201,229,215,.13);box-shadow:0 18px 65px rgba(0,0,0,.31);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);pointer-events:auto}.control-panel:before{content:"";position:absolute;top:-1px;left:-1px;width:62px;height:2px;background:var(--accent)}.panel-scroller{height:100%;overflow:auto;overscroll-behavior:contain;padding:26px 24px 18px;scrollbar-width:thin;scrollbar-color:#344943 transparent}.eyebrow{font:10px 'DM Mono',monospace;color:#b6baac;letter-spacing:1.6px}.small-line{display:inline-block;width:16px;height:1px;background:var(--accent);vertical-align:middle;margin-right:7px}.control-panel h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:49px;line-height:.88;font-weight:800;letter-spacing:.8px;margin:18px 0 16px;color:#f1f3eb}.control-panel h1 em{font-style:normal;color:#d7a16f}.location{font:9px 'DM Mono',monospace;color:#8caaa1;letter-spacing:.8px;white-space:nowrap}.location span{color:#d8ad84}.profile-divider,.section-divider{height:1px;background:var(--line);margin:23px 0 19px}.status-strip{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.live-dot{width:6px;height:6px;background:#a0e5bb;border-radius:50%;box-shadow:0 0 8px #8ae4b8;animation:breathe 2s ease-in-out infinite}.live-dot.paused{background:#debb87;box-shadow:none;animation:none}.status-strip b{font:500 9px 'DM Mono',monospace;letter-spacing:.65px;color:#c8d9ce}.storm-status{margin-left:auto;font:9px 'DM Mono',monospace;color:#6e918b}.intensity-head{display:flex;align-items:end;justify-content:space-between;margin:22px 0 8px}.intensity-head>span,.section-title,.stat-label,.phase-head{font:10px 'DM Mono',monospace;color:#8aa29d;letter-spacing:1px}.intensity-head strong{font:700 36px 'Barlow Condensed',Impact,sans-serif;line-height:1;color:#edb37e}.ef-options{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.ef-chip{height:35px;border:1px solid rgba(151,175,167,.24);background:rgba(39,56,58,.37);color:#93aaa3;font:500 11px 'DM Mono',monospace;transition:background .15s,border .15s}.ef-chip.active{color:#12191b;background:#e6a66f;border-color:#e6a66f;font-weight:700}.ef-chip:hover:not(.active){color:#f1d9c2;background:#283d3d;border-color:#b1a38c}.ef-caption{margin-top:11px;display:flex;justify-content:space-between;gap:5px;font:9px 'DM Mono',monospace;color:#b6b09b;letter-spacing:.5px}.ef-caption span:last-child{color:#e5af7c}.play-actions{display:flex;gap:7px;margin-top:19px}.primary-button{flex:1;height:43px;background:#d5a170;border:1px solid #e1b186;color:#1c2626;display:flex;align-items:center;justify-content:center;gap:11px;font:700 11px 'DM Mono',monospace;letter-spacing:1px}.primary-button:hover{background:#f0b884}.primary-button span:first-child{font:800 19px Inter,sans-serif;line-height:0}.reset-button{height:43px;min-width:90px;border:1px solid rgba(159,184,178,.29);background:#203235;color:#d1dcd4;font:10px 'DM Mono',monospace;letter-spacing:1px}.reset-button:first-letter{font-size:22px}.reset-button:hover{background:#304746}.section-title{display:flex;justify-content:space-between;font-weight:500;color:#c5d5cd}.section-title small{font:9px 'DM Mono',monospace;color:#749e92}.sliders{display:flex;flex-direction:column;gap:17px;margin-top:20px}.slider-top{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-bottom:10px}.slider-top label{font-size:11px;color:#c8d7d0}.slider-top output{font:10px 'DM Mono',monospace;color:#e8b07c}.control-slider input[type=range]{appearance:none;width:100%;height:2px;background:#52605b;vertical-align:middle;cursor:pointer;outline-offset:6px}.control-slider input[type=range]::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:#e3af7d;box-shadow:0 0 0 4px rgba(226,165,107,.12);border:1px solid #eec7a3}.control-slider input[type=range]::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#e3af7d;border:0}.camera-options{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:15px}.camera-btn{border:1px solid #3b4d4c;height:37px;background:#1b2c2e;color:#97ada7;font:10px 'DM Mono',monospace;letter-spacing:.5px}.camera-btn.active{border-color:#96b7aa;background:#324844;color:#e0f0e5}.camera-btn:hover:not(.active){color:#e0f0e5;background:#2c3d3d}.toggles{margin-top:17px;display:flex;flex-direction:column;gap:12px}.toggle-line{padding:0;display:flex;align-items:center;justify-content:space-between;background:transparent;border:0;color:#c4d0c8;text-align:left;font:10px 'DM Mono',monospace;letter-spacing:.45px}.toggle-line small{font-size:9px;color:#718c84;margin-left:7px}.toggle-dot{color:#e0ac79;font-size:17px;vertical-align:middle;margin-right:5px}.switch-track{display:inline-flex;width:29px;height:16px;border:1px solid #5a736d;border-radius:20px;background:#233234;align-items:center;padding:2px;transition:background .15s}.switch-track span{width:10px;height:10px;border-radius:50%;background:#8da7a0;transition:transform .2s}.toggle-line.enabled .switch-track{background:#d09c6e;border-color:#d09c6e}.toggle-line.enabled .switch-track span{background:#222c29;transform:translateX(12px)}.instruction-copy{font:10px/1.8 'DM Mono',monospace;color:#8ea49e;margin:0}.keyboard-copy{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:#77958e;font:9px 'DM Mono',monospace;margin-top:14px}kbd{border:1px solid #4f635e;padding:3px 5px;color:#c3d0c7;background:#253331;font:9px 'DM Mono',monospace}
.telemetry-panel{position:absolute;right:24px;top:106px;width:326px;background:rgba(10,22,26,.83);border:1px solid rgba(184,218,209,.15);padding:20px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 12px 56px rgba(0,0,0,.20)}.right-heading{display:flex;align-items:center;justify-content:space-between}.right-heading .eyebrow{font-size:9px;color:#94b1a8;letter-spacing:1.4px}.right-heading h2{font:800 24px 'Barlow Condensed',Impact,sans-serif;letter-spacing:1.3px;margin:6px 0 14px;color:#e6eae4}.right-heading h2 small{font:9px 'DM Mono',monospace;color:#9ab4aa;margin-left:4px}.radar-pulse{height:7px;width:7px;border-radius:50%;background:#dba46f;box-shadow:0 0 0 5px rgba(218,164,110,.13)}.mini-map{position:relative;overflow:hidden;border:1px solid #394d4c}.mini-map canvas{display:block;width:100%;height:auto;opacity:.94}.map-north,.map-scale{position:absolute;font:9px 'DM Mono',monospace;color:#a7c8bc;background:rgba(10,28,29,.67);padding:4px}.map-north{top:7px;right:7px}.map-scale{bottom:5px;right:6px}.radar-bottom{display:flex;justify-content:space-between;margin:10px 0 18px;font:9px 'DM Mono',monospace;color:#8daaa0}.radar-bottom i{height:5px;width:5px;border-radius:50%;display:inline-block;background:#efad72;vertical-align:middle;margin-right:5px}.stats-grid{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0}.stats-grid>div:nth-child(2){padding-left:17px;border-left:1px solid var(--line)}.stat-label{font-size:8px;letter-spacing:.7px}.stat-value{margin-top:7px;display:flex;align-items:baseline;gap:5px;font:700 32px 'Barlow Condensed',Impact,sans-serif;letter-spacing:.3px;line-height:1;color:#f0eee3}.stat-value small{font:9px 'DM Mono',monospace;color:#d0ab88}.phase-meter{padding-top:16px}.phase-head{display:flex;justify-content:space-between;font-size:8px;color:#a9c0b7}.phase-head span:last-child{color:#dba677}.phase-track{height:4px;background:#3c4f4c;margin-top:10px;overflow:hidden}.phase-track>div{height:100%;width:0;background:linear-gradient(90deg,#9cc7b4,#e9ac75);transition:width .15s}
.bottom-info{position:absolute;bottom:29px;left:50%;transform:translateX(-50%);background:rgba(9,20,23,.85);border:1px solid rgba(195,219,211,.16);padding:14px 22px;display:flex;align-items:center;gap:22px;backdrop-filter:blur(15px);white-space:nowrap}.crosshair-icon{font:31px 'DM Mono',monospace;color:#d8ae82}.bottom-col{display:flex;flex-direction:column;gap:6px}.bottom-label{font:8px 'DM Mono',monospace;color:#78988f;letter-spacing:1px}.bottom-col b{font:500 16px 'DM Mono',monospace;color:#e8ece4}.bottom-col b small{font:9px 'DM Mono',monospace;color:#9daea5}.event-col b{font:10px 'DM Mono',monospace;color:#d4b18b}.bottom-sep{height:29px;width:1px;background:var(--line)}.simulation-note{position:absolute;bottom:13px;right:18px;font:9px 'DM Mono',monospace;color:rgba(209,224,219,.7);text-shadow:0 1px 5px #1c2826}.simulation-note span{color:#cdad8c}.show-button{position:absolute;top:20px;right:20px;pointer-events:auto;background:#132628;border:1px solid #6c9288;color:#cfe5dd;padding:12px 18px;font:11px 'DM Mono',monospace;letter-spacing:.5px}.show-button kbd{margin-left:8px}
@keyframes breathe{50%{box-shadow:0 0 0 5px rgba(138,228,184,.09),0 0 10px #8ae4b8}}
@media(max-width:1100px){.telemetry-panel{width:253px;right:12px;top:94px;padding:14px}.control-panel{width:300px;left:11px;top:92px;bottom:70px}.panel-scroller{padding:20px 17px}.control-panel h1{font-size:42px}.bottom-info{bottom:18px}.simulation-note{bottom:6px;font-size:8px}}
@media(max-width:810px){.topbar{height:62px;padding:0 12px}.logo-word{font-size:19px}.logo-sub{font-size:8px;letter-spacing:1px}.top-seed{display:none}.hide-button{padding:9px}.control-panel{top:73px;left:9px;width:260px;bottom:72px;background:rgba(10,21,24,.93)}.control-panel h1{font-size:35px}.panel-scroller{padding:17px 14px}.location{font-size:8px;white-space:normal;line-height:1.5}.ef-chip{font-size:9px}.storm-status{display:none}.telemetry-panel{top:73px;right:9px;width:213px;padding:10px}.right-heading h2{font-size:20px}.stats-grid{padding:12px 0}.stat-value{font-size:25px}.bottom-info{padding:11px 14px;gap:10px}.bottom-col b{font-size:12px}.bottom-col.event-col{display:none}.bottom-sep:has(+ .event-col){display:none}}
@media(max-width:570px){.topbar{background:linear-gradient(to bottom,rgba(5,13,15,.96),transparent)}.logo-symbol{width:23px;height:23px}.logo-word{font-size:18px}.logo-sub{font-size:7px}.hide-button span{display:none}.control-panel{top:66px;bottom:85px;left:7px;width:min(280px,76vw);background:rgba(10,21,24,.93)}.telemetry-panel{width:161px;right:8px;top:76px;padding:8px;background:rgba(10,21,24,.72)}.right-heading h2{font-size:16px;margin:4px 0 7px}.right-heading .eyebrow{font-size:7px}.mini-map{display:block}.radar-bottom{font-size:7px;gap:4px;flex-wrap:wrap;margin:7px 0}.stats-grid{grid-template-columns:1fr 1fr;padding:7px 0}.stats-grid>div:nth-child(2){padding-left:7px}.stat-label{font-size:7px}.stat-value{font-size:21px}.stat-value small{font-size:7px}.phase-meter{padding-top:8px}.phase-head{font-size:7px}.bottom-info{left:8px;bottom:11px;transform:none;padding:8px 11px;gap:11px}.bottom-col b{font-size:12px}.crosshair-icon{font-size:22px}.bottom-label{font-size:7px}.simulation-note{display:none}}
@media(max-height:620px){.control-panel{top:73px;bottom:51px}.topbar{height:60px}.bottom-info{bottom:10px}.simulation-note{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
