:root{--cyan:#38e6ff;--violet:#a78bfa;--amber:#fbbf24;--green:#4ade80;--ice:#7dd3fc;--red:#fb7185;--white:#eaf6ff;--dim:#b4d7f073;--mono:"SF Mono", "Menlo", "DejaVu Sans Mono", "Roboto Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:var(--mono);color:var(--white);-webkit-font-smoothing:antialiased;background:#04060c;overflow:hidden}#app{position:fixed;inset:0}#app canvas{display:block}.hud{pointer-events:none;flex-direction:column;justify-content:space-between;padding:26px 32px;transition:opacity .5s;display:flex;position:fixed;inset:0}.hud--hidden{opacity:0}.hud-top{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.brand{align-items:center;gap:14px;display:flex}.brand-mark{border:2px solid var(--cyan);width:34px;height:34px;animation:3.2s ease-in-out infinite markPulse;transform:rotate(45deg);box-shadow:0 0 18px #38e6ff8c,inset 0 0 12px #38e6ff59}@keyframes markPulse{0%,to{opacity:.75;transform:rotate(45deg)scale(1)}50%{opacity:1;transform:rotate(45deg)scale(1.12)}}.brand-text h1{letter-spacing:.34em;text-shadow:0 0 22px #38e6ff8c;font-size:22px;font-weight:700}.brand-text p{letter-spacing:.26em;color:var(--dim);margin-top:4px;font-size:10px}.metrics{gap:10px;display:flex}.metric{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(#0a1626b8,#060c1680);border:1px solid #5aa0c82e;border-top-color:#78c8f059;min-width:108px;padding:10px 14px}.metric-label{letter-spacing:.2em;color:var(--dim);font-size:9px}.metric-value{font-variant-numeric:tabular-nums;margin-top:3px;font-size:27px;font-weight:700;line-height:1.15}.metric-unit{letter-spacing:.16em;color:var(--dim);font-size:9px}.metric--cyan .metric-value{color:var(--cyan);text-shadow:0 0 18px #38e6ff99}.metric--violet .metric-value{color:var(--violet);text-shadow:0 0 18px #a78bfa99}.metric--amber .metric-value{color:var(--amber);text-shadow:0 0 18px #fbbf248c}.metric--green .metric-value{color:var(--green);text-shadow:0 0 18px #4ade808c}.metric--ice .metric-value{color:var(--ice);text-shadow:0 0 18px #7dd3fc8c}.metric--white .metric-value{color:var(--white);text-shadow:0 0 18px #eaf6ff80}.hud-side{width:330px;position:absolute;top:50%;left:32px;transform:translateY(-50%)}.log-title{letter-spacing:.28em;color:var(--dim);border-bottom:1px solid #5aa0c838;margin-bottom:10px;padding-bottom:8px;font-size:9px}.hud-side ul{list-style:none}.log{letter-spacing:.04em;color:#c8e6fab3;padding:3px 0;font-size:11px;line-height:1.5;animation:.35s logIn}.log b{color:var(--cyan);margin-right:6px}.log--warn,.log--warn b{color:var(--amber)}.log--error,.log--error b{color:var(--red)}.log--ok,.log--ok b{color:var(--green)}@keyframes logIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:none}}.hud-bottom{flex-direction:column;gap:14px;display:flex}.stages{align-items:center;gap:8px;display:flex}.stage{background:linear-gradient(#0a1626a8,#060c166b);border:1px solid #5aa0c829;flex:1;padding:9px 12px;transition:border-color .4s}.stage[data-status=running]{border-color:#38e6ff66}.stage[data-status=busy]{border-color:#fbbf248c}.stage-head{align-items:baseline;gap:8px;margin-bottom:7px;display:flex}.stage-index{color:var(--dim);font-size:9px}.stage-name{letter-spacing:.18em;font-size:12px;font-weight:700}.stage-sub{color:var(--dim);font-size:10px}.stage-count{color:var(--cyan);font-variant-numeric:tabular-nums;margin-left:auto;font-size:13px;font-weight:700}.stage-bar{background:#78b4dc24;height:3px;overflow:hidden}.stage-bar i{background:linear-gradient(90deg, var(--cyan), var(--violet));width:0;height:100%;transition:width .3s;display:block;box-shadow:0 0 12px #38e6ffcc}.stage[data-status=busy] .stage-bar i{background:linear-gradient(90deg, var(--amber), var(--red));box-shadow:0 0 12px #fbbf24cc}.stage-arrow{color:#78bee659;font-size:20px}.hint{letter-spacing:.18em;color:#96c3e159;gap:22px;font-size:9px;display:flex}.hint b{color:#bee6ffb3}.boot{z-index:10;background:#04060c;place-items:center;transition:opacity .8s;display:grid;position:fixed;inset:0}.boot--done{opacity:0;pointer-events:none}.boot-inner{text-align:center;letter-spacing:.3em;color:var(--dim);font-size:10px}.boot-bar{background:#78b4dc26;width:220px;height:2px;margin:0 auto 14px;overflow:hidden}.boot-bar i{background:var(--cyan);width:35%;height:100%;box-shadow:0 0 14px var(--cyan);animation:1.1s ease-in-out infinite bootSlide;display:block}@keyframes bootSlide{0%{transform:translate(-100%)}to{transform:translate(320%)}}@media (max-width:1100px){.hud-side{display:none}.metric{min-width:86px;padding:8px 10px}.metric-value{font-size:21px}}
