:root{color-scheme:dark;--ink:#e9f4ff;--muted:#8294ae;--navy:#080d20;--line:#34445e;--cyan:#54f2dc;--orange:#ffad70}
*{box-sizing:border-box}
html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--navy);color:var(--ink);font:14px/1.35 Arial,Helvetica,sans-serif}
button{font:inherit;color:inherit}
.vs-app{display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;width:100%;height:100%;min-height:0;padding:clamp(7px,1.2vw,14px);gap:7px;background:radial-gradient(ellipse at 50% 38%,#111d3d 0,#080d20 64%)}
.vs-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.vs-title{min-width:0}.vs-title>span{display:block;margin-bottom:4px;color:#8ba2c4;font-size:clamp(7px,.8vw,9px);font-weight:900;letter-spacing:.2em}.vs-title h1{margin:0;font-size:clamp(16px,2vw,24px);line-height:1.05;letter-spacing:-.04em}
.vs-actions{display:flex;flex:none;gap:6px}.vs-actions button,.vs-card button{height:35px;padding:0 12px;border:1px solid #91a9ca;background:rgba(9,16,37,.8);font-size:9px;font-weight:900;letter-spacing:.12em;cursor:pointer}.vs-actions button:hover,.vs-actions button:focus-visible,.vs-card button:hover,.vs-card button:focus-visible{border-color:var(--cyan);background:#142746;color:var(--cyan);outline:2px solid var(--cyan);outline-offset:2px}.vs-actions i{margin-right:5px;color:var(--cyan);font-style:normal;font-size:14px}
.vs-hud{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0;padding:7px 10px;border:1px solid #31415e;background:rgba(8,14,32,.8);box-shadow:inset 0 0 20px rgba(65,119,199,.07)}.vs-hud span{display:flex;align-items:center;gap:7px;white-space:nowrap;color:#92a4bf;font-size:8px;font-weight:900;letter-spacing:.15em}.vs-hud b{color:#eff8ff;font:900 12px/1 'Courier New',monospace;letter-spacing:.02em}.vs-hud #vs-hull{color:var(--orange);letter-spacing:.15em}
.vs-stage{position:relative;display:grid;place-items:center;min-width:0;min-height:0;overflow:hidden;border:1px solid #344c72;background:#080d20;box-shadow:0 0 28px rgba(76,146,239,.12),inset 0 0 40px rgba(21,56,104,.12)}.vs-canvas-mount{width:100%;height:100%;display:grid;place-items:center;flex:none}.vs-canvas-mount canvas{display:block;touch-action:none}
.vs-start,.vs-pause,.vs-result{position:absolute;inset:0;z-index:3;display:grid;place-items:center;padding:14px;background:rgba(3,8,22,.7);backdrop-filter:blur(3px)}.vs-start[hidden],.vs-pause[hidden],.vs-result[hidden],.vs-error[hidden],.vs-announcement[hidden]{display:none!important}.vs-card{width:min(430px,100%);padding:clamp(16px,3vw,30px);border:1px solid #456287;background:linear-gradient(145deg,rgba(13,25,52,.96),rgba(8,13,32,.98));box-shadow:0 0 0 5px rgba(69,98,135,.12),0 18px 55px rgba(0,0,0,.38)}.vs-card-kicker{color:var(--cyan);font-size:8px;font-weight:900;letter-spacing:.2em}.vs-card h2{margin:10px 0 9px;font-size:clamp(26px,4vw,40px);line-height:.96;letter-spacing:-.06em}.vs-card p{max-width:360px;margin:0 0 17px;color:#a7b6ce;font-size:11px}.vs-card button{width:100%;display:flex;align-items:center;justify-content:space-between;height:42px;padding:0 14px;background:#123449;border-color:#54f2dc;color:#dffffa}.vs-card button span{font-size:16px}.vs-card>small{display:block;margin-top:13px;color:#8093b1;font-size:7px;font-weight:800;line-height:1.6;letter-spacing:.1em}
.vs-pause>div{display:grid;gap:9px;min-width:min(270px,90%);padding:22px;border:1px solid #456287;background:#0c1730;box-shadow:0 0 0 5px rgba(69,98,135,.12);text-align:center}.vs-pause small{color:var(--cyan);font-size:8px;font-weight:900;letter-spacing:.18em}.vs-pause strong{font-size:25px;letter-spacing:-.05em}.vs-pause button{height:36px;border:1px solid var(--cyan);background:#123449;color:white;font-size:9px;font-weight:900;letter-spacing:.12em;cursor:pointer}
.vs-final-score{display:flex;align-items:center;justify-content:space-between;margin:12px 0;padding:11px 12px;border:1px solid #31415e;background:rgba(3,9,24,.7)}.vs-final-score span{color:#92a4bf;font-size:8px;font-weight:900;letter-spacing:.15em}.vs-final-score b{color:var(--cyan);font:900 19px/1 'Courier New',monospace}
.vs-coupon{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;margin:10px 0;padding:9px 11px;border:1px dashed #57748c;text-align:left;background:rgba(3,9,24,.55)}.vs-coupon[hidden]{display:none!important}.vs-coupon small{display:block;color:#92a4bf;font-size:8px;font-weight:900;letter-spacing:.14em}.vs-coupon code{display:block;margin-top:4px;color:#f3fbff;font:900 19px/1 'Courier New',monospace;letter-spacing:.08em}.vs-card button.vs-copy-button,.vs-coupon button{width:36px;height:36px;padding:0;border:1px solid var(--cyan);background:#123449;color:var(--cyan);font-size:22px;cursor:pointer}.vs-copy-status{display:block;min-height:12px;margin:5px 0 8px;color:#92a4bf;font-size:9px}
.vs-announcement{position:absolute;z-index:2;left:50%;top:19%;display:grid;gap:5px;min-width:min(240px,80%);padding:13px 20px;transform:translateX(-50%);border:1px solid rgba(84,242,220,.55);background:rgba(6,13,31,.85);text-align:center;pointer-events:none;animation:vs-announcement 1.8s both}.vs-announcement span{color:var(--cyan);font-size:8px;font-weight:900;letter-spacing:.18em}.vs-announcement strong{font-size:19px;letter-spacing:-.04em}.vs-announcement small{color:#98aac5;font-size:9px}@keyframes vs-announcement{0%{opacity:0;transform:translate(-50%,12px)}15%,75%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-8px)}}
.vs-error{position:absolute;inset:auto 12px 12px;z-index:4;padding:10px;border:1px solid #ff9477;background:#241318;color:#ffc4b3;font-size:11px;text-align:center}
.vs-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px}.vs-controls p{margin:0;color:#8fa1bd;font-size:clamp(8px,.85vw,10px);line-height:1.4}.vs-controls b{color:#eaf4ff}.vs-touch{display:none;flex:none;gap:5px}.vs-touch button{min-width:38px;height:32px;padding:0 8px;border:1px solid #60789b;background:#0c1730;color:#eaf4ff;font-size:11px;font-weight:900;touch-action:none;user-select:none}.vs-touch .vs-fire{border-color:#54f2dc;color:#54f2dc}
@media(max-width:620px){.vs-app{padding:6px;gap:5px}.vs-title>span{letter-spacing:.12em}.vs-title h1{max-width:50vw;font-size:16px}.vs-actions{gap:4px}.vs-actions button{height:31px;padding:0 7px;font-size:8px}.vs-actions i{margin-right:2px}.vs-hud{padding:5px 4px;gap:3px}.vs-hud span{gap:3px;font-size:6px;letter-spacing:.05em}.vs-hud b{font-size:10px}.vs-controls p{max-width:54%;font-size:8px}.vs-touch{display:flex}.vs-touch button{min-width:31px;height:30px;padding:0 6px;font-size:9px}}
@media(max-height:500px){.vs-app{padding:4px;gap:4px}.vs-title>span{margin-bottom:2px;font-size:7px}.vs-title h1{font-size:15px}.vs-actions button{height:28px}.vs-hud{padding:4px}.vs-controls{min-height:27px}.vs-touch button{height:26px}.vs-card{padding:12px}.vs-card h2{margin:6px 0}.vs-card p{margin-bottom:10px}.vs-card>small{margin-top:8px}}
.vs-result{background:rgba(3,8,22,.46);backdrop-filter:blur(1px)}
