:root{
  color-scheme:dark;
  --bg:#02040b;
  --panel:rgba(4,8,22,.76);
  --panel2:rgba(11,17,39,.82);
  --border:rgba(142,197,255,.23);
  --text:#eef6ff;
  --muted:#9fb5ca;
  --accent:#5ce7ff;
  --accent2:#ff59d5;
  --warn:#ffb86b;
  --danger:#ff6f86;
  --ok:#69ffbd;
  --glass: blur(18px) saturate(120%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:#02040b;color:var(--text)}
body{background:radial-gradient(circle at 50% 40%,#0a1436 0%,#030714 38%,#000 100%)}
#renderCanvas{position:fixed;inset:0;width:100vw;height:100vh;display:block;outline:none;touch-action:none;background:#02040b;z-index:1}
#stars2dFallback{position:fixed;inset:0;z-index:0;background:radial-gradient(circle at center,#101d47 0%,#02040b 55%,#000 100%)}
.vignette{position:fixed;inset:0;z-index:3;pointer-events:none;background:radial-gradient(circle at center,transparent 50%,rgba(0,0,0,.52) 100%)}
.scanlines{position:fixed;inset:0;z-index:4;opacity:.08;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(255,255,255,.05),rgba(255,255,255,.05) 1px,transparent 1px,transparent 4px)}
.hud{position:fixed;left:18px;top:14px;right:390px;z-index:10;display:flex;gap:16px;align-items:flex-start;pointer-events:none}
.brand{min-width:270px;padding:14px 16px;border:1px solid var(--border);background:linear-gradient(135deg,rgba(4,8,22,.72),rgba(4,8,22,.38));backdrop-filter:var(--glass);border-radius:18px;box-shadow:0 12px 50px rgba(0,0,0,.38)}
.version{font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:#7fe9ff;margin-bottom:4px}
.brand h1{font-size:20px;margin:0 0 4px;line-height:1.1;text-shadow:0 0 18px rgba(92,231,255,.28)}
.brand p{margin:0;font-size:13px;color:var(--muted);line-height:1.35}
.dot{display:inline-block;width:10px;height:10px;border-radius:999px;margin-right:9px;vertical-align:2px;background:var(--warn);box-shadow:0 0 16px var(--warn)}
.dot.ready{background:var(--ok);box-shadow:0 0 20px var(--ok)}
.dot.failed{background:var(--danger);box-shadow:0 0 20px var(--danger)}
.dot.loading{animation:pulse 1.1s infinite alternate}
.hud-grid{display:grid;grid-template-columns:repeat(4,minmax(92px,1fr));gap:8px;max-width:720px;width:100%}
.hud-grid div{padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:rgba(3,8,22,.58);backdrop-filter:var(--glass);box-shadow:0 12px 40px rgba(0,0,0,.25)}
.hud-grid small{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#89a7c4}
.hud-grid strong{display:block;margin-top:2px;font-size:15px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.panel-button{position:fixed;right:18px;top:16px;z-index:23;width:46px;height:46px;border:1px solid var(--border);border-radius:15px;background:rgba(5,11,29,.76);color:#e8f8ff;font-size:21px;cursor:pointer;box-shadow:0 14px 38px rgba(0,0,0,.35);backdrop-filter:var(--glass)}
.panel{position:fixed;right:16px;top:72px;bottom:18px;width:370px;z-index:20;border:1px solid var(--border);border-radius:22px;background:linear-gradient(180deg,rgba(7,14,35,.88),rgba(2,5,16,.72));backdrop-filter:var(--glass);box-shadow:0 24px 80px rgba(0,0,0,.48);transform:translateX(0);transition:transform .22s ease,opacity .22s ease;overflow:hidden}
.panel:not(.open){transform:translateX(calc(100% + 32px));opacity:.2}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:16px 16px 12px;border-bottom:1px solid rgba(142,197,255,.14)}
.panel-head h2{margin:0;font-size:18px}.panel-head p{margin:4px 0 0;color:var(--muted);font-size:12px;line-height:1.35}
.icon-btn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#fff;border-radius:12px;width:34px;height:34px;font-size:22px;line-height:20px;cursor:pointer}
.panel-body{height:calc(100% - 75px);overflow:auto;padding:14px 14px 22px;scrollbar-width:thin;scrollbar-color:#4a79a5 transparent}
section{padding:13px;border:1px solid rgba(142,197,255,.14);background:rgba(3,8,22,.46);border-radius:18px;margin-bottom:12px}
.section-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:12px;color:#cfe8ff;text-transform:uppercase;letter-spacing:.09em}.section-title b{font-weight:650;color:#7fe9ff;text-transform:none;letter-spacing:0}
.field{display:block;margin:10px 0;color:#dbeeff;font-size:13px}.field span{display:flex;justify-content:space-between;margin-bottom:7px;color:#c7daf0}.field select,.search{width:100%;background:rgba(0,0,0,.38);border:1px solid rgba(142,197,255,.23);border-radius:12px;color:#eef8ff;padding:10px 11px;outline:none}.field input[type=range]{width:100%;accent-color:#5ce7ff}.muted{font-size:12px;color:var(--muted);line-height:1.45;margin:7px 0 0}.switch{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:#dbeeff;padding:7px 0}.switch input{accent-color:#5ce7ff;transform:scale(1.1)}
.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.actions button,.link-btn{min-height:38px;border-radius:12px;border:1px solid rgba(142,197,255,.22);cursor:pointer;font-weight:700;color:#eaf8ff;text-decoration:none;display:flex;align-items:center;justify-content:center;text-align:center;font-size:12px}.primary{background:linear-gradient(135deg,#0f9fff,#a63cff);box-shadow:0 0 28px rgba(92,231,255,.14)}.secondary{background:rgba(255,255,255,.05)}.danger{background:rgba(255,93,120,.15);border-color:rgba(255,111,134,.35)!important}.actions button:hover,.link-btn:hover{filter:brightness(1.18)}
.results{max-height:190px;overflow:auto;margin-top:8px}.result-item{padding:8px 9px;border:1px solid rgba(142,197,255,.12);background:rgba(255,255,255,.035);border-radius:10px;margin-bottom:7px;cursor:pointer}.result-item:hover{background:rgba(92,231,255,.12)}.result-item strong{display:block;font-size:12px}.result-item small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.help{display:grid;grid-template-columns:1fr;gap:6px;color:#c9dced;font-size:12px}.help kbd{display:inline-block;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);border-radius:7px;padding:2px 6px;margin-right:4px;color:#fff}.diag-log{display:none;white-space:pre-wrap;max-height:160px;overflow:auto;border:1px solid rgba(142,197,255,.16);border-radius:12px;background:#02050f;color:#b8ecff;padding:9px;font-size:11px;line-height:1.35}.diag-log.open{display:block}
.info-card{position:fixed;left:18px;bottom:18px;z-index:18;width:min(430px,calc(100vw - 36px));border:1px solid var(--border);border-radius:20px;background:linear-gradient(135deg,rgba(7,14,34,.9),rgba(4,8,18,.72));backdrop-filter:var(--glass);box-shadow:0 22px 70px rgba(0,0,0,.45);padding:14px;transform:translateY(calc(100% + 40px));opacity:0;transition:.24s ease}.info-card.open{transform:translateY(0);opacity:1}.info-head{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid rgba(142,197,255,.15);padding-bottom:10px}.info-head h3{margin:0;font-size:19px}.info-head p{margin:4px 0 0;color:var(--muted);font-size:12px}.info-head button{width:34px;height:34px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:#fff;font-size:22px;cursor:pointer}.info-body{padding-top:9px;font-size:13px;line-height:1.42;color:#dcecff}.info-body table{width:100%;border-collapse:collapse}.info-body td{border-bottom:1px solid rgba(142,197,255,.1);padding:5px 3px}.info-body td:first-child{color:#91abc7;width:40%}
.surface-badge{position:fixed;left:50%;bottom:18px;transform:translate(-50%,110px);z-index:19;display:flex;align-items:center;gap:12px;border:1px solid rgba(112,255,209,.35);border-radius:999px;background:rgba(4,20,18,.82);backdrop-filter:var(--glass);padding:10px 12px;color:#eafffb;box-shadow:0 14px 46px rgba(0,0,0,.44);transition:transform .22s}.surface-badge.open{transform:translate(-50%,0)}.surface-badge span{color:#96ffe8;font-size:12px}.surface-badge button{border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:6px 12px;cursor:pointer}
.reticle{position:fixed;left:50%;top:50%;width:22px;height:22px;z-index:9;pointer-events:none;transform:translate(-50%,-50%);border:1px solid rgba(174,236,255,.42);border-radius:999px}.reticle:before,.reticle:after{content:"";position:absolute;background:rgba(174,236,255,.45)}.reticle:before{left:50%;top:-9px;width:1px;height:7px}.reticle:after{top:50%;left:-9px;width:7px;height:1px}
.toast{position:fixed;left:50%;top:82px;z-index:31;transform:translate(-50%,-20px);opacity:0;max-width:min(720px,calc(100vw - 32px));padding:12px 15px;border:1px solid rgba(92,231,255,.28);border-radius:16px;background:rgba(4,10,25,.88);backdrop-filter:var(--glass);box-shadow:0 16px 52px rgba(0,0,0,.4);color:#eafcff;font-size:13px;transition:.22s}.toast.show{transform:translate(-50%,0);opacity:1}
.loading{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:radial-gradient(circle at 50% 38%,rgba(18,32,82,.88),rgba(0,0,0,.94));transition:opacity .32s,visibility .32s}.loading.hidden{opacity:0;visibility:hidden;pointer-events:none}.loading.failed{background:radial-gradient(circle at 50% 38%,rgba(82,18,32,.88),rgba(0,0,0,.94))}.loading-card{width:min(530px,calc(100vw - 32px));text-align:center;border:1px solid rgba(142,197,255,.22);border-radius:26px;background:rgba(4,9,24,.72);backdrop-filter:var(--glass);box-shadow:0 30px 100px rgba(0,0,0,.58);padding:34px}.loading-card h2{margin:14px 0 8px}.loading-card p{margin:0;color:#cbe5ff;line-height:1.45}.loading-card small{display:block;margin-top:12px;color:#89a6be}.progress{height:9px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden;margin:18px 0 0}.progress span{display:block;width:0;height:100%;background:linear-gradient(90deg,#5ce7ff,#ff59d5,#fff06a);box-shadow:0 0 18px rgba(92,231,255,.55);transition:width .2s}.loader-orbit{position:relative;width:78px;height:78px;margin:0 auto}.loader-orbit i{position:absolute;inset:0;border:1px solid rgba(92,231,255,.35);border-radius:50%;animation:spin 1.8s linear infinite}.loader-orbit i:nth-child(2){inset:10px;border-color:rgba(255,89,213,.45);animation-duration:1.25s;animation-direction:reverse}.loader-orbit i:nth-child(3){inset:24px;border-color:rgba(255,240,106,.5);animation-duration:2.4s}.nojs{position:fixed;inset:0;z-index:99;display:grid;place-items:center;background:#000;color:#fff;font:18px system-ui}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{to{opacity:.45}}
@media(max-width:940px){.hud{right:18px;display:block}.hud-grid{grid-template-columns:repeat(2,1fr);margin-top:8px}.panel{width:min(370px,calc(100vw - 32px))}.brand{min-width:0}.hud-grid div:nth-child(n+5){display:none}}
@media(max-width:620px){.hud{left:10px;top:10px;right:70px}.panel{right:8px;left:8px;width:auto;top:66px}.panel-button{right:10px}.actions{grid-template-columns:1fr}.brand h1{font-size:16px}.hud-grid{display:none}.info-card{left:8px;bottom:8px;width:calc(100vw - 16px)}}