:root {
            --bg:#05050f; --panel:rgba(8,8,20,0.96);
            --green:#4ade80; --blue:#38bdf8; --orange:#ff7820;
            --text:#f1f5f9; --muted:#475569; --border:#1e1b4b;
        }
        *{box-sizing:border-box;}
        body{margin:0;background:var(--bg);color:var(--text);font-family:'Inter','Segoe UI',sans-serif;overflow:hidden;user-select:none;touch-action:none;}
        canvas{display:block;}

        #hud{position:fixed;top:16px;left:16px;z-index:100;width:232px;pointer-events:none;}
        .panel{background:var(--panel);padding:12px 14px;border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 40px rgba(0,0,0,.85);backdrop-filter:blur(16px);margin-bottom:8px;}
        .label{font-size:9px;color:var(--green);text-transform:uppercase;letter-spacing:2px;margin-bottom:8px;font-weight:700;}
        .scoreboard{display:flex;justify-content:space-between;align-items:center;font-size:30px;font-weight:900;font-family:monospace;}
        .sg{color:var(--green);text-shadow:0 0 12px rgba(74,222,128,.6);}
        .sb{color:var(--blue);text-shadow:0 0 12px rgba(56,189,248,.6);}
        .ss{color:#1e1b4b;font-size:18px;}
        .stat-row{display:flex;gap:5px;margin-top:7px;flex-wrap:wrap;}
        .pill{font-size:9px;padding:2px 7px;border-radius:10px;border:1px solid var(--border);color:var(--muted);font-family:monospace;letter-spacing:1px;transition:color .2s,border-color .2s;}
        .pill.hot{color:var(--orange);border-color:var(--orange);}
        .pill.ok{color:var(--green);border-color:var(--green);}
        .mtrack{position:relative;width:100%;height:10px;background:#0a0a18;border-radius:5px;overflow:hidden;border:1px solid #1e1b4b;}
        #mfill{position:relative;z-index:1;height:100%;width:0%;border-radius:5px;transition:width .04s linear;background:linear-gradient(90deg,#ef4444 0%,#facc15 50%,#4ade80 100%);}
        .mzone{position:absolute;z-index:2;left:68%;width:14%;top:0;bottom:0;background:rgba(74,222,128,.24);border-inline:1px solid rgba(74,222,128,.8);pointer-events:none;}
        #mlabel{font-size:9px;color:var(--muted);text-align:right;margin-top:4px;letter-spacing:1px;}
        #mlabel span{color:var(--green);font-weight:700;}

        #overlay{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:600;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;}
        #ov-main{font-size:clamp(42px,9vw,82px);font-weight:900;color:#fff;letter-spacing:6px;text-shadow:0 0 40px var(--orange);animation:ovbeat .3s infinite alternate;}
        #ov-sub{font-size:14px;color:var(--muted);letter-spacing:3px;text-transform:uppercase;}
        @keyframes ovbeat{to{transform:scale(1.06);}}

        /* ── START / GAME-OVER MODAL ── */
        #street-modal{position:fixed;inset:0;z-index:900;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;background:linear-gradient(160deg,#020208 60%,#0a0518 100%);overflow:hidden;}
        #street-modal .sm-bg{position:absolute;inset:0;pointer-events:none;}
        #street-modal .sm-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(74,222,128,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(74,222,128,.04) 1px,transparent 1px);background-size:48px 48px;}
        #street-modal .sm-glow{position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(255,120,32,.13) 0%,transparent 70%);top:50%;left:50%;transform:translate(-50%,-55%);}
        #street-modal .sm-tag{font-size:10px;letter-spacing:4px;color:var(--green);text-transform:uppercase;margin-bottom:18px;opacity:.7;}
        #street-modal .sm-title{font-size:clamp(52px,12vw,110px);font-weight:900;font-family:monospace;line-height:.9;text-align:center;color:#fff;text-shadow:0 0 60px rgba(255,120,32,.5),0 0 120px rgba(255,120,32,.2);letter-spacing:2px;}
        #street-modal .sm-title span{color:var(--orange);}
        #street-modal .sm-sub{font-size:13px;color:var(--muted);letter-spacing:3px;text-transform:uppercase;margin-top:14px;margin-bottom:40px;}
        #street-modal .sm-score{font-size:clamp(32px,7vw,64px);font-weight:900;font-family:monospace;letter-spacing:8px;margin-bottom:12px;display:none;}
        #street-modal .sm-score .sg{color:var(--green);text-shadow:0 0 20px #4ade80;}
        #street-modal .sm-score .sb{color:var(--blue);text-shadow:0 0 20px #38bdf8;}
        #street-modal .sm-result{font-size:18px;font-weight:800;letter-spacing:4px;text-transform:uppercase;color:var(--orange);margin-bottom:32px;display:none;}
        #street-modal .sm-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 48px;border-radius:14px;border:2px solid var(--orange);background:rgba(255,120,32,.12);color:var(--orange);font-size:18px;font-weight:900;letter-spacing:3px;text-transform:uppercase;cursor:pointer;transition:background .15s,transform .1s,box-shadow .15s;font-family:monospace;-webkit-tap-highlight-color:transparent;}
        #street-modal .sm-btn:hover{background:var(--orange);color:#000;box-shadow:0 0 40px rgba(255,120,32,.5);}
        #street-modal .sm-btn:active{transform:scale(.95);}
        #street-modal .sm-btn:focus-visible{outline:3px solid #fff;outline-offset:4px;}
        #street-modal .sm-hint{font-size:9px;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-top:20px;opacity:.5;}
        #street-modal .sm-lines{position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--green),var(--orange),var(--blue),transparent);}
        #street-modal .sm-kobe{font-size:10px;letter-spacing:2px;color:#a78bfa;text-transform:uppercase;margin-bottom:28px;opacity:.65;font-family:monospace;}
        @keyframes modalIn{from{opacity:0;transform:scale(.96);}to{opacity:1;transform:scale(1);}}
        #street-modal.show{animation:modalIn .3s ease-out forwards;}

        /* KOBE float */
        #kobe-float{position:fixed;z-index:501;pointer-events:none;display:none;font-size:38px;font-weight:900;font-family:monospace;color:#a78bfa;text-shadow:0 0 28px #a78bfa,0 0 60px rgba(167,139,250,.4);letter-spacing:3px;}
        @keyframes kobeFly{0%{opacity:1;transform:translateY(0) scale(1.2) rotate(-4deg);}100%{opacity:0;transform:translateY(-100px) scale(.75) rotate(4deg);}}

        #pts-float{position:fixed;z-index:500;pointer-events:none;display:none;font-size:46px;font-weight:900;font-family:monospace;}
        @keyframes ptsFly{0%{opacity:1;transform:translateY(0) scale(1.15);}100%{opacity:0;transform:translateY(-90px) scale(.8);}}

        #status{position:fixed;bottom:16px;left:50%;transform:translateX(-50%);font-family:monospace;font-size:11px;color:var(--muted);background:rgba(0,0,0,.82);padding:5px 18px;border-radius:20px;border:1px solid var(--border);z-index:50;white-space:nowrap;}
        #ctrl{position:fixed;bottom:16px;right:16px;z-index:50;font-family:monospace;font-size:11px;color:var(--muted);line-height:2;text-align:right;pointer-events:none;}
        #ctrl span{color:var(--green);font-weight:bold;}

        /* MOBILE */
        #mob-score{display:none;position:fixed;top:0;left:0;right:0;padding:10px 20px;padding-top:max(10px,env(safe-area-inset-top));z-index:200;background:linear-gradient(rgba(0,0,0,.7),transparent);align-items:center;justify-content:center;pointer-events:none;}
        .mobs{font-size:28px;font-weight:900;font-family:monospace;padding:0 12px;}
        #mob-mwrap{display:none;position:fixed;z-index:200;pointer-events:none;left:50%;transform:translateX(-50%);bottom:max(195px,calc(env(safe-area-inset-bottom)+185px));width:160px;}
        #mob-mfill{height:8px;width:0%;border-radius:4px;background:linear-gradient(90deg,#ef4444,#facc15,#4ade80);transition:width .04s linear;}
        #mob-mtrack{position:relative;width:100%;height:8px;background:rgba(0,0,0,.6);border-radius:4px;overflow:hidden;}
        #mob-mfill{position:relative;z-index:1;}
        #mob-mtrack .mzone{height:8px;}
        #mob-ctrl{display:none;position:fixed;bottom:0;left:0;right:0;padding:12px 20px;padding-bottom:max(20px,env(safe-area-inset-bottom));align-items:flex-end;justify-content:space-between;z-index:400;background:linear-gradient(transparent,rgba(0,0,0,.5));pointer-events:none;}
        .dpad{display:grid;grid-template-columns:52px 52px 52px;grid-template-rows:52px 52px 52px;gap:4px;pointer-events:auto;}
        .db{border-radius:10px;background:rgba(8,8,20,.88);border:1.5px solid rgba(74,222,128,.22);color:#c8e6c9;font-size:18px;font-weight:900;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;}
        .db:active,.db.on{background:rgba(74,222,128,.2);border-color:var(--green);color:var(--green);}
        .de{background:transparent!important;border:none!important;pointer-events:none;}
        .btns{display:flex;flex-direction:column;align-items:center;gap:10px;pointer-events:auto;}
        .ab{border-radius:50%;font-size:12px;font-weight:900;letter-spacing:1px;display:flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;transition:transform .08s;}
        .ab:active,.ab.on{transform:scale(.91);}
        #btn-sh{width:76px;height:76px;background:rgba(255,120,32,.15);border:2px solid var(--orange);color:var(--orange);}
        #btn-sh:active,#btn-sh.on{background:var(--orange);color:#000;}
        #btn-st{width:56px;height:56px;background:rgba(56,189,248,.12);border:2px solid var(--blue);color:var(--blue);}
        #btn-st:active,#btn-st.on{background:var(--blue);color:#000;}

        @media(hover:none)and(pointer:coarse),(max-width:820px){
            #ctrl,#status,#hud{display:none!important;}
            #mob-score,#mob-mwrap,#mob-ctrl{display:flex!important;}
        }