*{margin:0;padding:0;box-sizing:border-box;}
        html { height: 100%; }
        body{
            font-family:'Space Grotesk',Arial,sans-serif;
            background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#45b7d1,#96ceb4);
            background-size:400% 400%;
            animation:gradientShift 3s ease infinite;
            color:white;overflow-x:hidden;min-height:100vh;height:100%;
            user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;
        }

        /* ─── LOADING ─── */
        #loadingScreen{position:fixed;inset:0;background:#0a0a0a;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:999999;}
        #loadingScreen .logo{font-size:5em;margin-bottom:20px;}
        #loadingScreen h2{font-size:1.8em;margin-bottom:10px;}
        #loadingScreen p{opacity:.6;font-size:.95em;}
        .spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.2);border-top-color:#feca57;border-radius:50%;animation:spin .8s linear infinite;margin:20px auto;}
        @keyframes spin{to{transform:rotate(360deg)}}

        /* ─── AUTH ─── */
        #authScreen{position:fixed;inset:0;background:linear-gradient(135deg,#0f0f1a,#1a0f2e,#0f1a1a);display:none;align-items:center;justify-content:center;z-index:99999;flex-direction:column;}
        .auth-card{background:rgba(255,255,255,0.07);border:1px solid rgba(255,255,255,0.15);border-radius:24px;padding:40px 36px;width:400px;max-width:94vw;box-shadow:0 30px 80px rgba(0,0,0,0.5);backdrop-filter:blur(20px);}
        .auth-logo{text-align:center;font-size:3.5em;margin-bottom:8px;}
        .auth-title{text-align:center;font-size:1.8em;font-weight:700;margin-bottom:4px;}
        .auth-sub{text-align:center;opacity:.55;font-size:.88em;margin-bottom:28px;}
        .auth-switcher{display:flex;background:rgba(0,0,0,.3);border-radius:12px;padding:4px;margin-bottom:24px;}
        .auth-sw-btn{flex:1;padding:9px;border:none;border-radius:9px;background:transparent;color:rgba(255,255,255,.5);font-size:.95em;font-weight:600;cursor:pointer;transition:all .2s;}
        .auth-sw-btn.active{background:rgba(255,255,255,.15);color:white;}
        .auth-field{position:relative;margin-bottom:14px;}
        .auth-field label{display:block;font-size:.8em;opacity:.7;margin-bottom:5px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;}
        .auth-field input{width:100%;padding:13px 16px;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.15);border-radius:12px;color:white;font-size:1em;outline:none;transition:border .2s,background .2s;}
        .auth-field input::placeholder{color:rgba(255,255,255,.3);}
        .auth-field input:focus{border-color:#feca57;background:rgba(255,255,255,.12);}
        .auth-submit{width:100%;padding:14px;border:none;border-radius:13px;background:linear-gradient(135deg,#ff6b6b,#feca57);color:#000;font-size:1.05em;font-weight:700;cursor:pointer;transition:all .2s;margin-top:6px;}
        .auth-submit:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 8px 25px rgba(255,107,107,.4);}
        .auth-submit:disabled{opacity:.6;cursor:not-allowed;transform:none;}
        .auth-guest{text-align:center;margin-top:18px;font-size:.85em;opacity:.55;}
        .auth-guest a{color:#feca57;cursor:pointer;text-decoration:underline;}
        .auth-alert{padding:10px 14px;border-radius:10px;font-size:.88em;margin-bottom:14px;display:none;}
        .auth-alert.error{background:rgba(255,80,80,.2);border:1px solid rgba(255,80,80,.4);color:#ff9999;}
        .auth-alert.success{background:rgba(80,255,150,.15);border:1px solid rgba(80,255,150,.3);color:#80ffaa;}

        /* ─── USER BAR ─── */
        #userBar{position:fixed;top:0;left:0;right:0;background:rgba(0,0,0,.5);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.1);padding:10px 20px;display:none;align-items:center;justify-content:space-between;z-index:9000;font-size:.9em;}
        .user-info{display:flex;align-items:center;gap:8px;opacity:.9;}
        .user-dot{width:8px;height:8px;border-radius:50%;background:#4ecdc4;animation:pulse 2s ease infinite;}
        @keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
        .save-indicator{font-size:.8em;opacity:.5;}
        .logout-btn{background:rgba(255,80,80,.2);border:1px solid rgba(255,80,80,.35);color:white;border-radius:8px;padding:5px 12px;cursor:pointer;font-size:.82em;transition:all .2s;}
        .logout-btn:hover{background:rgba(255,80,80,.4);}

        /* ─── GAME WRAPPER ─── */
        #gameWrapper{display:none;padding-top:48px;}

        /* ─── ANIMATIONS ─── */
        @keyframes gradientShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
        @keyframes bounce{0%,20%,50%,80%,100%{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}
        @keyframes floatUp{0%{opacity:1;transform:translateY(0) scale(1)}20%{transform:translateY(-20px) scale(1.2)}100%{opacity:0;transform:translateY(-130px) scale(.8)}}
        @keyframes goldenPulse{0%,100%{box-shadow:0 0 20px 5px gold}50%{box-shadow:0 0 50px 20px gold}}
        @keyframes dropIn{0%{top:-60px;opacity:0}100%{top:60px;opacity:1}}
        @keyframes slideInRight{from{transform:translateX(110%);opacity:0}to{transform:translateX(0);opacity:1}}
        @keyframes fadeOut{to{opacity:0;transform:translateX(20px)}}
        @keyframes achGlow{0%,100%{box-shadow:0 0 5px gold}50%{box-shadow:0 0 18px gold}}
        @keyframes modalIn{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
        @keyframes hotDealPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,100,0,.6)}50%{box-shadow:0 0 0 6px rgba(255,100,0,0)}}
        @keyframes lockedShimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
        @keyframes dealTimer{from{width:100%}to{width:0%}}

        /* ─── LAYOUT ─── */
        .container{max-width:1400px;margin:0 auto;padding:20px;}
        .header{text-align:center;margin-bottom:28px;animation:bounce 2s infinite;}
        .title{font-size:3.6em;font-weight:700;font-family:'Bebas Neue',Impact,sans-serif;text-shadow:4px 4px 0 #000,0 0 30px var(--skin-accent-2,rgba(255,107,107,.5));margin-bottom:8px;letter-spacing:2px;transition:text-shadow 0.6s ease;}
        .subtitle{font-size:1.1em;opacity:.9;font-family:'Space Grotesk',sans-serif;}
        .header-btns{margin-top:14px;display:flex;gap:10px;justify-content:center;flex-wrap:wrap;}
        .hbtn{background:linear-gradient(135deg,#ffd700,#ff6b6b);color:black;border:none;border-radius:12px;padding:9px 18px;font-weight:700;font-size:.9em;cursor:pointer;transition:all .2s;white-space:nowrap;}
        .hbtn:hover{transform:scale(1.04);box-shadow:0 4px 15px rgba(255,215,0,.3);}
        .hbtn.blue{background:linear-gradient(135deg,#4ecdc4,#45b7d1);}
        .game-area{display:grid;grid-template-columns:1fr 380px;gap:25px;}

        /* ─── MAIN GAME ─── */
        .main-game{background:rgba(0,0,0,.3);border-radius:20px;padding:25px;text-align:center;backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2);}
        .sigma-counter{font-size:2.8em;margin-bottom:6px;text-shadow:2px 2px 0 #000;font-family:'Bebas Neue',sans-serif;letter-spacing:1px;color:var(--skin-accent,#feca57);transition:color 0.6s ease;}
        .total-earned{font-size:.9em;opacity:.7;margin-bottom:12px;}
        .multiplier-bar{background:rgba(0,0,0,.3);border-radius:10px;padding:8px 12px;margin:10px 0;display:flex;justify-content:space-around;flex-wrap:wrap;gap:5px;font-size:.85em;}
        .mult-item{color:#feca57;}
        .click-button{width:200px;height:200px;border-radius:50%;background:linear-gradient(45deg,#ff6b6b,#feca57);border:5px solid white;font-size:4em;cursor:pointer;transition:all .1s;box-shadow:0 10px 20px rgba(0,0,0,.3);margin:18px auto;display:flex;align-items:center;justify-content:center;user-select:none;touch-action:manipulation;}
        .click-button:hover{transform:scale(1.06);}
        .click-button:active{transform:scale(.94);}
        .click-button.golden{animation:goldenPulse .5s ease infinite;border-color:gold;background:linear-gradient(45deg,gold,orange);}
        .stats{margin-top:18px;}
        .stat{margin-bottom:7px;font-size:1em;}

        /* ─── PRESTIGE ─── */
        .prestige-section{margin-top:18px;text-align:center;background:rgba(255,215,0,.2);border-radius:15px;padding:15px;border:2px solid gold;}
        .prestige-btn{background:linear-gradient(45deg,gold,orange);color:black;border:none;padding:11px 22px;border-radius:22px;font-size:1.05em;font-weight:bold;cursor:pointer;transition:all .3s;margin-top:6px;}
        .prestige-btn:hover{transform:scale(1.05);box-shadow:0 5px 15px rgba(255,215,0,.5);}

        /* ─── DISCORD ─── */
        #discordPromo{background:rgba(88,101,242,.3);padding:13px;border-radius:10px;margin:18px 0;text-align:center;border:2px solid #5865f2;}
        #discordPromo a{color:#a8b4ff;text-decoration:none;font-weight:bold;}

        /* ─── ACHIEVEMENTS ─── */
        .achievements-panel{background:rgba(0,0,0,.3);border-radius:20px;padding:18px;margin-top:18px;backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2);}
        .achievements-panel h3{text-align:center;margin-bottom:12px;font-size:1.3em;}
        .achievements-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(68px,1fr));gap:8px;}
        .ach{background:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.2);border-radius:10px;padding:6px;text-align:center;font-size:1.7em;cursor:default;transition:all .3s;position:relative;}
        .ach.unlocked{background:rgba(255,215,0,.2);border-color:gold;animation:achGlow 2s ease infinite;}
        .ach.locked{filter:grayscale(1) opacity(.35);}
        .ach-tip{display:none;position:absolute;bottom:calc(100% + 5px);left:50%;transform:translateX(-50%);background:rgba(0,0,0,.93);color:white;padding:6px 10px;border-radius:8px;font-size:.38em;white-space:nowrap;z-index:200;border:1px solid rgba(255,255,255,.3);pointer-events:none;line-height:1.5;}
        .ach:hover .ach-tip{display:block;}

        /* ═══════════════════════════════════════
           SHOP v0.10 - COMPLETE OVERHAUL
        ═══════════════════════════════════════ */
        .shop{background:rgba(0,0,0,.4);border-radius:20px;padding:18px;backdrop-filter:blur(10px);border:2px solid rgba(255,255,255,.2);max-height:92vh;overflow-y:auto;display:flex;flex-direction:column;gap:10px;}
        .shop-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;}
        .shop-header h2{font-size:1.6em;}
        .shop-level-badge{background:linear-gradient(135deg,#ffd700,#ff8c00);color:black;border-radius:10px;padding:3px 10px;font-size:.8em;font-weight:700;}

        /* Pricing mode */
        .pricing-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
        .pricing-label{font-size:.75em;opacity:.6;white-space:nowrap;}
        .pricing-mode-btn{padding:4px 9px;border-radius:8px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:rgba(255,255,255,.6);font-size:.72em;font-weight:600;cursor:pointer;transition:all .2s;}
        .pricing-mode-btn.active{background:rgba(255,255,255,.22);color:white;border-color:rgba(255,255,255,.5);}
        .pricing-mode-btn.speculative.active{background:rgba(255,80,200,.2);border-color:#ff50c8;color:#ff50c8;}
        .pricing-mode-btn.aggressive.active{background:rgba(255,80,80,.2);border-color:#ff5050;color:#ff5050;}

        /* Bulk buy row */
        .bulk-row{display:flex;gap:5px;flex-wrap:wrap;}
        .bulk-btn{flex:1;min-width:60px;padding:6px 4px;border-radius:9px;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:white;font-size:.72em;font-weight:700;cursor:pointer;transition:all .2s;text-align:center;}
        .bulk-btn:hover{background:rgba(255,255,255,.22);}
        .bulk-btn.active{background:rgba(254,202,87,.2);border-color:#feca57;color:#feca57;}

        /* Shop tabs */
        .shop-tabs{display:flex;gap:4px;flex-wrap:wrap;}
        .shop-tab{flex:1;min-width:44px;padding:7px 4px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.3);border-radius:10px;cursor:pointer;font-size:.72em;font-weight:bold;color:white;transition:all .2s;text-align:center;}
        .shop-tab.active{background:rgba(255,255,255,.3);border-color:white;}

        /* Hot deal banner */
        #hotDealBanner{background:linear-gradient(90deg,rgba(255,100,0,.25),rgba(255,50,50,.15));border:1px solid rgba(255,120,0,.5);border-radius:12px;padding:9px 13px;display:none;position:relative;overflow:hidden;}
        .hd-title{font-size:.82em;font-weight:700;color:#ff9940;margin-bottom:4px;}
        .hd-items{font-size:.78em;opacity:.85;line-height:1.6;}
        .hd-timer-bar{position:absolute;bottom:0;left:0;height:3px;background:linear-gradient(90deg,#ff6b00,#ff3300);border-radius:0 0 12px 12px;}

        /* ── SHOP CARD ── */
        .upg-card{
            background:rgba(255,255,255,.07);
            border:1.5px solid rgba(255,255,255,.15);
            border-radius:14px;padding:12px 14px;
            cursor:pointer;transition:all .2s;user-select:none;
            position:relative;overflow:hidden;
        }
        .upg-card:hover:not(.cant){background:rgba(255,255,255,.14);transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.3);}
        .upg-card.cant{opacity:.4;cursor:not-allowed;}
        .upg-card.cant:hover{transform:none;box-shadow:none;}
        .upg-card.hot-deal{border-color:rgba(255,120,0,.7);animation:hotDealPulse 1.5s ease infinite;background:rgba(255,100,0,.1);}
        .upg-card.hot-deal .upg-name::after{content:'🔥 HOT';font-size:.65em;background:linear-gradient(90deg,#ff6b00,#ff3300);color:white;padding:1px 6px;border-radius:6px;margin-left:6px;vertical-align:middle;}

        /* Card top row */
        .card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:6px;}
        .upg-name{font-weight:700;font-size:.95em;}
        .upg-badges{display:flex;gap:4px;flex-wrap:wrap;align-items:center;}
        .badge{font-size:.65em;padding:2px 7px;border-radius:6px;font-weight:700;white-space:nowrap;}
        .badge.best-val{background:rgba(78,205,196,.3);color:#4ecdc4;border:1px solid rgba(78,205,196,.4);}
        .badge.mod-chip{background:rgba(198,120,221,.25);color:#c678dd;border:1px solid rgba(198,120,221,.4);}
        .badge.deal-badge{background:rgba(255,100,0,.3);color:#ff9940;border:1px solid rgba(255,100,0,.5);}
        .badge.locked-badge{background:rgba(100,100,100,.3);color:#aaa;border:1px solid rgba(100,100,100,.4);}

        /* Card stats row */
        .card-stats{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:6px;}
        .upg-desc{font-size:.78em;opacity:.7;flex:1;}
        .upg-power{font-size:.78em;color:#ff9ff3;}
        .payback-tag{font-size:.72em;color:#4ecdc4;white-space:nowrap;}
        .payback-tag.good{color:#50fa7b;}
        .payback-tag.bad{color:#ff6b6b;}

        /* Card bottom row */
        .card-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:6px;}
        .upg-cost{color:#feca57;font-weight:bold;font-size:.9em;}
        .upg-cost.discounted{color:#ff9940;}
        .upg-cost.original{text-decoration:line-through;opacity:.5;font-size:.75em;color:white;margin-right:4px;}
        .upg-owned{color:#4ecdc4;font-size:.8em;}
        .buy-btn{padding:5px 12px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.3);border-radius:8px;color:white;font-size:.78em;font-weight:600;cursor:pointer;transition:all .2s;white-space:nowrap;}
        .buy-btn:hover{background:rgba(255,255,255,.28);}

        /* Breakthrough bar */
        .breakthrough-bar{margin-top:7px;background:rgba(0,0,0,.3);border-radius:6px;height:5px;overflow:hidden;}
        .breakthrough-fill{height:100%;border-radius:6px;transition:width .5s;background:linear-gradient(90deg,#ff6b6b,#feca57);}
        .breakthrough-text{font-size:.68em;opacity:.6;margin-top:2px;}
        .breakthrough-unlocked{font-size:.72em;color:#ffd700;margin-top:3px;font-weight:600;}

        /* Mystery locked */
        .upg-card.mystery{cursor:default;background:rgba(50,50,80,.3);border-color:rgba(150,150,255,.2);}
        .mystery-inner{text-align:center;padding:8px 0;}
        .mystery-lock{font-size:2em;margin-bottom:4px;}
        .mystery-hint{font-size:.78em;opacity:.5;font-style:italic;}
        .mystery-shimmer{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(200,200,255,.05),transparent);background-size:200% 100%;animation:lockedShimmer 3s infinite;}

        /* Modifier */
        .mod-row{margin-top:7px;display:flex;gap:6px;flex-wrap:wrap;}
        .mod-slot{flex:1;min-width:80px;padding:5px 8px;border-radius:8px;border:1px dashed rgba(255,255,255,.2);font-size:.72em;text-align:center;cursor:pointer;transition:all .2s;background:rgba(0,0,0,.2);}
        .mod-slot.has-mod{border-style:solid;border-color:rgba(198,120,221,.5);background:rgba(198,120,221,.1);color:#c678dd;}
        .mod-slot:hover{border-color:rgba(255,255,255,.4);}

        /* GC SHOP */
        .gc-item{background:rgba(255,215,0,.08);border:1.5px solid rgba(255,215,0,.3);border-radius:14px;padding:12px 14px;margin-bottom:10px;cursor:pointer;transition:all .2s;user-select:none;}
        .gc-item:hover:not(.cant){background:rgba(255,215,0,.18);transform:translateY(-2px);}
        .gc-item.cant{opacity:.4;cursor:not-allowed;}
        .gc-item.cant:hover{transform:none;}
        .gc-badge{font-size:.7em;background:rgba(255,215,0,.3);color:#FFD700;border-radius:6px;padding:1px 6px;display:inline-block;margin-bottom:3px;}

        /* ─── MODIFIER PICKER MODAL ─── */
        .mod-picker{position:fixed;inset:0;background:rgba(0,0,0,.8);backdrop-filter:blur(10px);z-index:70000;display:none;align-items:center;justify-content:center;}
        .mod-picker-box{background:#111;border:2px solid rgba(198,120,221,.4);border-radius:18px;padding:24px;width:420px;max-width:94vw;animation:modalIn .2s ease;}
        .mod-picker-box h3{text-align:center;margin-bottom:16px;font-size:1.4em;}
        .mod-option{background:rgba(198,120,221,.1);border:1.5px solid rgba(198,120,221,.3);border-radius:12px;padding:13px;margin-bottom:10px;cursor:pointer;transition:all .2s;}
        .mod-option:hover{background:rgba(198,120,221,.25);transform:translateX(4px);}
        .mod-option.cant{opacity:.4;cursor:not-allowed;}
        .mod-option.cant:hover{transform:none;background:rgba(198,120,221,.1);}
        .mod-name{font-weight:700;font-size:.95em;margin-bottom:3px;}
        .mod-desc{font-size:.82em;opacity:.75;}
        .mod-cost{color:#c678dd;font-weight:700;font-size:.85em;margin-top:4px;}
        .mod-close{display:block;width:100%;margin-top:10px;padding:10px;border:none;border-radius:10px;background:rgba(255,255,255,.1);color:white;font-size:.95em;cursor:pointer;}

        /* ─── FLOATING TEXT ─── */
        .float-txt{position:fixed;pointer-events:none;font-size:2em;font-weight:bold;animation:floatUp 1.5s ease-out forwards;z-index:9999;text-shadow:2px 2px 4px rgba(0,0,0,.8);}
        .float-txt.crit{font-size:2.8em;animation:floatUp 2s ease-out forwards;}

        /* ─── TOAST ─── */
        .toast{position:fixed;bottom:25px;right:25px;background:rgba(0,0,0,.92);color:white;padding:11px 18px;border-radius:12px;border-left:4px solid gold;font-size:.95em;z-index:10000;pointer-events:none;max-width:300px;animation:slideInRight .3s ease,fadeOut .5s ease 2.7s forwards;}

        /* ─── GOLDEN NOTICE ─── */
        .golden-notice{position:fixed;top:60px;left:50%;transform:translateX(-50%);background:linear-gradient(45deg,gold,orange);color:black;padding:10px 25px;border-radius:25px;font-weight:bold;font-size:1.15em;z-index:10000;animation:dropIn .5s ease;box-shadow:0 5px 25px rgba(255,215,0,.7);}

        /* ─── MODAL ─── */
        .modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(8px);z-index:50000;display:flex;align-items:center;justify-content:center;}
        .modal{background:rgba(10,10,10,.97);border:2px solid rgba(255,255,255,.3);border-radius:20px;padding:32px;width:440px;max-width:92vw;text-align:center;animation:modalIn .25s ease;}
        .modal h2{font-size:1.8em;margin-bottom:8px;}
        .modal p{opacity:.8;margin-bottom:18px;font-size:.95em;line-height:1.6;white-space:pre-line;}
        .modal-btns{display:flex;gap:10px;justify-content:center;}
        .modal-btn{padding:11px 28px;border-radius:12px;border:none;font-size:1em;font-weight:bold;cursor:pointer;transition:all .2s;}
        .modal-btn.ok{background:linear-gradient(45deg,#ff6b6b,#feca57);color:black;}
        .modal-btn.no{background:rgba(255,255,255,.15);color:white;border:2px solid rgba(255,255,255,.3);}
        .modal-btn:hover{transform:scale(1.05);}

        /* ─── CHAOS ─── */
        #bgChaos{position:fixed;inset:0;z-index:-1;opacity:0;transition:opacity .5s;}
        .gif-ov{position:absolute;width:200px;height:200px;background-size:cover;border-radius:15px;opacity:.3;animation:gifFloat 10s linear infinite;}
        @keyframes gifFloat{0%{transform:translateY(100vh) rotate(0)}100%{transform:translateY(-200px) rotate(360deg)}}

        /* ─── HIGHSCORES ─── */
        #hsBg{position:fixed;inset:0;background:rgba(0,0,0,.85);backdrop-filter:blur(12px);z-index:60000;display:none;align-items:center;justify-content:center;}
        .hs-modal{background:rgba(10,10,20,.97);border:2px solid rgba(255,255,255,.2);border-radius:22px;padding:28px;width:600px;max-width:95vw;max-height:90vh;display:flex;flex-direction:column;animation:modalIn .25s ease;}
        .hs-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
        .hs-header h2{font-size:1.7em;}
        .hs-close{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:white;border-radius:10px;padding:6px 14px;cursor:pointer;font-size:.9em;transition:all .2s;}
        .hs-close:hover{background:rgba(255,80,80,.3);}
        .hs-tabs{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:18px;}
        .hs-tab{flex:1 1 auto;min-width:60px;padding:7px 4px;border-radius:11px;border:1.5px solid rgba(255,255,255,.2);background:rgba(255,255,255,.07);color:rgba(255,255,255,.7);cursor:pointer;font-weight:600;font-size:.75em;transition:all .2s;text-align:center;white-space:nowrap;}
        .hs-tab.on{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.5);color:white;}
        .hs-tab.sigma-tab.on{border-color:#feca57;color:#feca57;background:rgba(254,202,87,.1);}
        .hs-tab.clicks-tab.on{border-color:#4ecdc4;color:#4ecdc4;background:rgba(78,205,196,.1);}
        .hs-tab.rebirth-tab.on{border-color:#c678dd;color:#c678dd;background:rgba(198,120,221,.1);}
        .hs-tab.faction-tab.on{border-color:#a29bfe;color:#a29bfe;background:rgba(162,155,254,.1);}
        .hs-table{overflow-y:auto;flex:1;}
        .hs-row{display:grid;grid-template-columns:44px 1fr 1fr;align-items:center;padding:11px 14px;border-radius:12px;margin-bottom:6px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);transition:background .2s;}
        .hs-row:hover{background:rgba(255,255,255,.1);}
        .hs-row.me{background:rgba(254,202,87,.1);border-color:rgba(254,202,87,.3);}
        .hs-row.top1{background:rgba(255,215,0,.15);border-color:rgba(255,215,0,.4);}
        .hs-row.top2{background:rgba(192,192,192,.1);border-color:rgba(192,192,192,.3);}
        .hs-row.top3{background:rgba(205,127,50,.1);border-color:rgba(205,127,50,.3);}
        .hs-rank{font-size:1.4em;text-align:center;}
        .hs-name{font-weight:600;font-size:.95em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
        .hs-name .you-tag{font-size:.7em;color:#feca57;margin-left:5px;opacity:.8;}
        .hs-score{text-align:right;font-weight:700;font-size:1em;}
        .hs-empty{text-align:center;opacity:.5;padding:30px;font-size:1.1em;}
        .hs-loading{text-align:center;padding:30px;}

        .profile-btn{background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.25);color:white;border-radius:50%;width:36px;height:36px;cursor:pointer;font-size:1.2em;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;}
        .profile-btn:hover{background:rgba(255,255,255,.25);transform:scale(1.08);}

        /* ─── PROFILE MODAL ─── */
        #profileBg{position:fixed;inset:0;background:rgba(0,0,0,.82);backdrop-filter:blur(12px);z-index:70000;display:none;align-items:center;justify-content:center;}
        .profile-modal{background:rgba(10,10,20,.97);border:2px solid rgba(78,205,196,.35);border-radius:22px;padding:28px;width:420px;max-width:94vw;animation:modalIn .25s ease;}
        .profile-modal h2{font-size:1.6em;margin-bottom:4px;}
        .profile-modal .sub{opacity:.5;font-size:.85em;margin-bottom:22px;}
        .profile-field{margin-bottom:16px;}
        .profile-field label{display:block;font-size:.78em;opacity:.65;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px;}
        .profile-field input{width:100%;padding:11px 14px;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.15);border-radius:11px;color:white;font-size:.95em;outline:none;transition:border .2s;}
        .profile-field input:focus{border-color:#4ecdc4;}
        .profile-field input::placeholder{color:rgba(255,255,255,.3);}
        .profile-save-btn{width:100%;padding:12px;border:none;border-radius:12px;background:linear-gradient(135deg,#4ecdc4,#45b7d1);color:#000;font-size:1em;font-weight:700;cursor:pointer;transition:all .2s;margin-top:4px;}
        .profile-save-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 20px rgba(78,205,196,.4);}
        .profile-save-btn:disabled{opacity:.5;cursor:not-allowed;}
        .profile-close{display:block;width:100%;margin-top:10px;padding:10px;border:none;border-radius:10px;background:rgba(255,255,255,.08);color:white;font-size:.95em;cursor:pointer;transition:background .2s;}
        .profile-close:hover{background:rgba(255,255,255,.16);}
        .profile-alert{padding:9px 13px;border-radius:9px;font-size:.85em;margin-bottom:14px;display:none;}
        .profile-alert.error{background:rgba(255,80,80,.2);border:1px solid rgba(255,80,80,.4);color:#ff9999;}
        .profile-alert.success{background:rgba(80,255,150,.15);border:1px solid rgba(80,255,150,.3);color:#80ffaa;}
        /* ─── SETTINGS MODAL ─── */
        #settingsBg{position:fixed;inset:0;background:rgba(0,0,0,.82);backdrop-filter:blur(12px);z-index:70000;display:none;align-items:center;justify-content:center;}
        .settings-modal{background:rgba(10,10,20,.97);border:2px solid rgba(254,202,87,.35);border-radius:22px;padding:28px;width:440px;max-width:94vw;animation:modalIn .25s ease;}
        .settings-modal h2{font-size:1.6em;margin-bottom:4px;}
        .settings-wip{background:rgba(255,165,0,.12);border:1px solid rgba(255,165,0,.3);border-radius:12px;padding:14px;margin-bottom:20px;font-size:.88em;line-height:1.6;}
        .settings-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08);}
        .settings-row:last-child{border-bottom:none;}
        .settings-row label{font-size:.95em;font-weight:600;}
        .lang-btns{display:flex;gap:6px;}
        .lang-btn{padding:7px 16px;border:1.5px solid rgba(255,255,255,.2);border-radius:9px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.6);font-size:.88em;font-weight:700;cursor:pointer;transition:all .2s;}
        .lang-btn.active{background:rgba(254,202,87,.2);border-color:#feca57;color:#feca57;}
        .settings-close-btn{display:block;width:100%;margin-top:16px;padding:11px;border:1px solid rgba(255,255,255,.2);border-radius:11px;background:rgba(255,255,255,.08);color:white;font-size:.95em;cursor:pointer;}
        .settings-close-btn:hover{background:rgba(255,255,255,.16);}

        .profile-stats{background:rgba(255,255,255,.05);border-radius:12px;padding:14px;margin-bottom:18px;font-size:.85em;display:grid;grid-template-columns:1fr 1fr;gap:8px;}
        .profile-stat{opacity:.7;}.profile-stat strong{color:white;opacity:1;}

        /* ─── ADMIN PANEL ─── */
        #adminBg{position:fixed;inset:0;background:rgba(0,0,0,.9);backdrop-filter:blur(16px);z-index:99999;display:none;align-items:center;justify-content:center;}
        .admin-modal{background:rgba(5,5,15,.98);border:2px solid rgba(255,50,50,.5);border-radius:22px;padding:28px;width:580px;max-width:95vw;max-height:90vh;overflow-y:auto;animation:modalIn .25s ease;}
        .admin-modal h2{font-size:1.6em;margin-bottom:2px;color:#ff6b6b;}
        .admin-sub{opacity:.45;font-size:.78em;margin-bottom:20px;font-family:monospace;}
        .admin-section{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:16px;margin-bottom:14px;}
        .admin-section h3{opacity:.7;text-transform:uppercase;letter-spacing:.5px;font-size:.78em;margin-bottom:12px;}
        .admin-user-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:10px 12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:10px;margin-bottom:7px;cursor:pointer;transition:background .2s;}
        .admin-user-row:hover{background:rgba(255,255,255,.11);}
        .admin-user-row.selected{background:rgba(255,100,100,.1);border-color:rgba(255,100,100,.4);}
        .admin-user-name{font-weight:600;font-size:.9em;}
        .admin-user-meta{font-size:.73em;opacity:.45;margin-top:2px;}
        .admin-sel-badge{font-size:.7em;background:rgba(255,100,100,.25);color:#ff9999;padding:2px 8px;border-radius:6px;}
        .admin-field{display:flex;gap:8px;align-items:center;margin-bottom:10px;flex-wrap:wrap;}
        .admin-field label{font-size:.78em;opacity:.6;white-space:nowrap;min-width:80px;}
        .admin-field input{flex:1;padding:8px 11px;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.14);border-radius:9px;color:white;font-size:.9em;outline:none;min-width:100px;}
        .admin-field input:focus{border-color:#ff6b6b;}
        .admin-btns{display:flex;gap:7px;flex-wrap:wrap;}
        .admin-btn{padding:8px 15px;border:none;border-radius:9px;font-weight:700;cursor:pointer;font-size:.82em;transition:all .2s;}
        .admin-btn.green{background:rgba(80,250,120,.18);border:1px solid rgba(80,250,120,.4);color:#80ff99;}
        .admin-btn.green:hover{background:rgba(80,250,120,.32);}
        .admin-btn.red{background:rgba(255,80,80,.18);border:1px solid rgba(255,80,80,.4);color:#ff9999;}
        .admin-btn.red:hover{background:rgba(255,80,80,.32);}
        .admin-btn.yellow{background:rgba(255,215,0,.18);border:1px solid rgba(255,215,0,.4);color:#ffd700;}
        .admin-btn.yellow:hover{background:rgba(255,215,0,.32);}
        .admin-btn.purple{background:rgba(198,120,221,.18);border:1px solid rgba(198,120,221,.4);color:#c678dd;}
        .admin-btn.purple:hover{background:rgba(198,120,221,.32);}
        .admin-btn.grey{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:white;}
        .admin-btn.grey:hover{background:rgba(255,255,255,.2);}
        .admin-log{background:rgba(0,0,0,.6);border-radius:10px;padding:11px;font-family:monospace;font-size:.76em;max-height:130px;overflow-y:auto;border:1px solid rgba(255,255,255,.07);}
        .log-ok{color:#80ff99;}.log-err{color:#ff9999;}.log-info{color:#feca57;}
        .admin-close-btn{display:block;width:100%;padding:11px;border:1px solid rgba(255,80,80,.3);border-radius:11px;background:rgba(255,80,80,.1);color:#ff9999;font-size:.95em;cursor:pointer;margin-top:4px;}
        .admin-close-btn:hover{background:rgba(255,80,80,.25);}

        /* ── Stats Modal ── */
        .stats-section-title{font-size:.72em;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.45;margin:18px 0 10px;padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.07);}
        .stats-section-title:first-child{margin-top:0;}
        .stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:4px;}
        @media(max-width:420px){.stats-grid{grid-template-columns:1fr;}}
        .stat-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:11px 14px;display:flex;flex-direction:column;gap:3px;}
        .stat-card-wide{grid-column:1/-1;}
        .stat-label{font-size:.73em;opacity:.5;font-weight:500;text-transform:uppercase;letter-spacing:.06em;}
        .stat-value{font-size:1.15em;font-weight:700;color:#feca57;}
        .stat-sub{font-size:.72em;opacity:.45;margin-top:1px;}
        .stat-bar-wrap{height:4px;background:rgba(255,255,255,.08);border-radius:4px;margin-top:5px;overflow:hidden;}
        .stat-bar-fill{height:100%;border-radius:4px;transition:width .4s;}

        /* ── Titles ── */
        .title-pill{display:inline-flex;align-items:center;gap:5px;padding:5px 12px;border-radius:20px;font-size:.8em;font-weight:700;cursor:pointer;transition:all .18s;border:1.5px solid;user-select:none;}
        .title-pill:hover:not(.locked){filter:brightness(1.2);transform:translateY(-1px);}
        .title-pill.equipped{box-shadow:0 0 10px currentColor,0 0 20px currentColor33;}
        .title-pill.locked{opacity:.28;cursor:default;filter:grayscale(1);}
        .hs-title-badge{display:inline-block;font-size:.68em;font-weight:700;padding:1px 7px;border-radius:10px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);color:rgba(255,255,255,.75);margin-top:2px;letter-spacing:.03em;}
        .hs-name{display:flex;flex-direction:column;align-items:flex-start;gap:1px;}

        /* ── Boss Event ── */
        @keyframes bossShake{from{transform:translate(-2px,-1px) rotate(-1deg);}to{transform:translate(2px,1px) rotate(1deg);}}
        @keyframes bossGlow{0%,100%{filter:drop-shadow(0 0 15px #a29bfe);}50%{filter:drop-shadow(0 0 40px #a29bfe) drop-shadow(0 0 60px #6c5ce7);}}

        /* ══════════════════════════════════════════
           LOOT CRATES — v0.14
        ══════════════════════════════════════════ */

        /* ── Falling crate wrapper (handles the fall translateY) ── */
        .crate-faller {
            position: fixed;
            z-index: 8500;
            pointer-events: none;  /* wrapper non-interactive */
            width: 78px;
        }

        /* ── Inner crate card (handles wobble + is clickable) ── */
        .falling-crate {
            width: 78px;
            min-height: 90px;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            gap: 2px;
            border-radius: 18px;
            border: 2.5px solid;
            padding: 8px 6px 6px;
            cursor: pointer;
            pointer-events: all;
            user-select: none;
            touch-action: manipulation;
            -webkit-tap-highlight-color: transparent;
            position: relative;
            overflow: visible;
            transition: transform .1s;
            animation: crateWobble 2s ease-in-out infinite;
        }
        .falling-crate:hover  { transform: scale(1.18); filter: brightness(1.15); }
        .falling-crate:active { transform: scale(.88); }

        .crate-emoji  { font-size: 2.2em; line-height: 1; display: block; }
        .crate-label  { font-size: .62em; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; text-align: center; }
        .crate-timer  { font-size: .55em; opacity: .6; text-align: center; font-variant-numeric: tabular-nums; }

        /* Glow ring behind crate */
        .crate-glow-ring {
            position: absolute;
            inset: -10px;
            border-radius: 26px;
            pointer-events: none;
            z-index: -1;
            animation: crateGlowPulse 1.6s ease-in-out infinite;
        }

        /* Urgency tint when < 8s left */
        .falling-crate.urgent { animation: crateWobble .5s ease-in-out infinite, crateUrgent .4s ease-in-out infinite; }

        /* ── Keyframes ── */
        @keyframes crateFall {
            0%   { transform: translateY(0)    rotate(-5deg); opacity: 0; }
            3%   { opacity: 1; }
            18%  { transform: translateY(14vh) rotate(4deg); }
            36%  { transform: translateY(30vh) rotate(-4deg); }
            54%  { transform: translateY(47vh) rotate(5deg); }
            72%  { transform: translateY(64vh) rotate(-3deg); }
            88%  { transform: translateY(80vh) rotate(3deg);  opacity: 1; }
            100% { transform: translateY(108vh) rotate(8deg); opacity: 0; }
        }
        @keyframes crateWobble {
            0%,100% { transform: rotate(-3deg) scale(1); }
            50%     { transform: rotate(3deg)  scale(1.04); }
        }
        @keyframes crateGlowPulse {
            0%,100% { opacity: .5; transform: scale(1); }
            50%     { opacity: 1;  transform: scale(1.12); }
        }
        @keyframes crateUrgent {
            0%,100% { border-color: #ff4444 !important; }
            50%     { border-color: #ffaa00 !important; }
        }

        /* ── Crate Open Overlay ── */
        #crateOpenBg {
            position: fixed;
            inset: 0;
            z-index: 95000;
            display: none;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            background: rgba(0,0,0,.93);
            backdrop-filter: blur(20px);
            cursor: default;
            overflow: hidden;
        }
        .crate-open-box {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 14px;
            max-width: 420px;
            width: 90vw;
            text-align: center;
            position: relative;
            z-index: 1;
        }
        .crate-open-crate-emoji {
            font-size: 5.5em;
            line-height: 1;
            display: block;
            will-change: transform;
        }
        .crate-open-rarity-label {
            font-size: 1.2em;
            font-weight: 900;
            letter-spacing: .12em;
            text-transform: uppercase;
        }
        .crate-open-reward-text {
            font-size: 1.65em;
            font-weight: 800;
            color: white;
            line-height: 1.2;
        }
        .crate-open-reward-sub {
            font-size: .85em;
            opacity: .55;
            margin-top: -6px;
        }
        .crate-claim-btn {
            padding: 13px 44px;
            border: none;
            border-radius: 14px;
            font-size: 1.05em;
            font-weight: 800;
            cursor: pointer;
            transition: all .18s;
            color: black;
            margin-top: 4px;
            letter-spacing: .03em;
        }
        .crate-claim-btn:hover  { transform: scale(1.07); box-shadow: 0 8px 24px rgba(0,0,0,.4); }
        .crate-claim-btn:active { transform: scale(.96); }

        /* ── Reveal particles ── */
        .crate-particle {
            position: absolute;
            font-size: 1.3em;
            pointer-events: none;
            animation: crateParticleFloat var(--dur,.9s) var(--delay,0s) ease-out forwards;
        }
        @keyframes crateParticleFloat {
            0%   { transform: translate(0,0) scale(1.2) rotate(0deg); opacity: 1; }
            100% { transform: translate(var(--dx,40px),var(--dy,-120px)) scale(0) rotate(var(--rot,90deg)); opacity: 0; }
        }

        /* ── Rarity flash overlay ── */
        .crate-rarity-flash {
            position: fixed;
            inset: 0;
            pointer-events: none;
            z-index: 96000;
            animation: crateFlash .55s ease forwards;
        }
        @keyframes crateFlash {
            0%   { opacity: .5; }
            40%  { opacity: .25; }
            100% { opacity: 0; }
        }

        /* ── Opening shake & reveal animations ── */
        @keyframes crateShakeOpen {
            0%,100% { transform: translateX(0) rotate(0deg) scale(1); }
            10%     { transform: translateX(-10px) rotate(-6deg) scale(1.05); }
            25%     { transform: translateX(10px)  rotate(6deg)  scale(1.08); }
            40%     { transform: translateX(-8px)  rotate(-4deg) scale(1.06); }
            55%     { transform: translateX(8px)   rotate(4deg)  scale(1.04); }
            70%     { transform: translateX(-5px)  rotate(-2deg) scale(1.02); }
            85%     { transform: translateX(5px)   rotate(2deg)  scale(1.01); }
        }
        @keyframes crateRevealPop {
            0%   { transform: scale(0.2) rotate(-15deg); opacity: 0; }
            65%  { transform: scale(1.18) rotate(4deg);  opacity: 1; }
            82%  { transform: scale(0.95) rotate(-2deg); }
            100% { transform: scale(1) rotate(0deg);     opacity: 1; }
        }
        @keyframes crateRewardPop {
            0%   { transform: scale(0) translateY(16px); opacity: 0; }
            70%  { transform: scale(1.08) translateY(-4px); opacity: 1; }
            100% { transform: scale(1) translateY(0);    opacity: 1; }
        }

        /* ── Active boost indicator ── */
        #crateBoostBar {
            position: fixed;
            top: 52px;
            left: 50%;
            transform: translateX(-50%);
            background: rgba(0,0,0,.8);
            border: 1.5px solid;
            border-radius: 20px;
            padding: 4px 14px;
            font-size: .78em;
            font-weight: 700;
            z-index: 8900;
            display: none;
            white-space: nowrap;
            backdrop-filter: blur(8px);
            animation: dropIn .3s ease;
        }

        /* ══════════════════════════════════════════
           BOSS SYSTEM — v0.15
        ══════════════════════════════════════════ */

        /* ── Boss Summon Modal ── */
        #bossSummonBg {
            position:fixed;inset:0;background:rgba(0,0,0,.82);backdrop-filter:blur(16px);
            z-index:7000;display:none;align-items:center;justify-content:center;padding:14px;
        }
        #bossSummonModal {
            background:linear-gradient(160deg,#0d0d1a,#120a22);
            border:1px solid rgba(255,255,255,.1);border-radius:22px;
            width:min(620px,100%);max-height:88vh;overflow-y:auto;padding:24px 20px;
            animation:modalIn .22s ease;scrollbar-width:thin;
        }
        .boss-card {
            border-radius:16px;border:1.5px solid;padding:18px 16px;margin-bottom:12px;
            cursor:pointer;transition:all .2s;position:relative;overflow:hidden;
        }
        .boss-card:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(0,0,0,.4); }
        .boss-card:active { transform:scale(.98); }
        .boss-card.locked { opacity:.45; cursor:not-allowed; filter:grayscale(.6); }
        .boss-card.locked:hover { transform:none; }
        .boss-card-header { display:flex;align-items:center;gap:12px;margin-bottom:10px; }
        .boss-card-icon { font-size:2.4em;line-height:1;flex-shrink:0; }
        .boss-card-title { flex:1; }
        .boss-card-name { font-size:1.1em;font-weight:800;line-height:1.2; }
        .boss-card-tagline { font-size:.75em;opacity:.55;margin-top:2px;font-style:italic; }
        .boss-diff-badge {
            padding:3px 10px;border-radius:12px;font-size:.72em;font-weight:700;
            border:1px solid;letter-spacing:.04em;flex-shrink:0;
        }
        .boss-card-stats { display:flex;gap:16px;font-size:.78em;opacity:.7;flex-wrap:wrap; }
        .boss-card-stat { display:flex;align-items:center;gap:4px; }
        .boss-card-mechanic { font-size:.75em;margin-top:8px;padding:6px 10px;border-radius:8px;border:1px dashed rgba(255,255,255,.15);opacity:.7; }
        .boss-summon-btn {
            display:block;width:100%;margin-top:12px;padding:11px;border:none;border-radius:12px;
            font-size:.95em;font-weight:800;cursor:pointer;transition:all .2s;letter-spacing:.03em;color:#000;
        }
        .boss-summon-btn:hover { transform:scale(1.03);filter:brightness(1.1); }
        .boss-summon-btn:disabled { opacity:.4;cursor:not-allowed;transform:none; }
        .boss-locked-reason { text-align:center;font-size:.75em;opacity:.5;margin-top:8px; }

        /* ── Boss Arena (fight overlay) ── */
        #bossArena {
            position:fixed;inset:0;z-index:9500;display:none;
            flex-direction:column;align-items:center;justify-content:space-between;
            padding:16px 16px 20px;overflow:hidden;
        }
        #bossArenaBg {
            position:absolute;inset:0;z-index:0;transition:background .5s;
        }
        .boss-arena-top {
            position:relative;z-index:1;width:100%;max-width:520px;
            display:flex;flex-direction:column;align-items:center;gap:12px;
        }
        .boss-arena-meta {
            display:flex;justify-content:space-between;align-items:center;width:100%;
        }
        .boss-arena-timer {
            font-size:1.6em;font-weight:900;font-variant-numeric:tabular-nums;
            text-shadow:0 0 20px currentColor;
        }
        .boss-arena-timer.urgent { animation:bossTimerUrgent .4s ease-in-out infinite; color:#ff4444 !important; }
        @keyframes bossTimerUrgent { 0%,100%{transform:scale(1)} 50%{transform:scale(1.15)} }

        .boss-arena-identity { text-align:center; }
        .boss-arena-icon { font-size:4.5em;line-height:1;display:block;animation:bossIconFloat 2.5s ease-in-out infinite; }
        @keyframes bossIconFloat {
            0%,100%{transform:translateY(0) scale(1);filter:drop-shadow(0 0 20px var(--bc,#fff));}
            50%{transform:translateY(-10px) scale(1.05);filter:drop-shadow(0 0 40px var(--bc,#fff));}
        }
        .boss-arena-name { font-size:1.5em;font-weight:900;letter-spacing:.04em;margin-top:6px; }
        .boss-arena-tagline { font-size:.78em;opacity:.5;font-style:italic;margin-top:2px; }

        .boss-hp-panel { width:100%;background:rgba(0,0,0,.4);border-radius:14px;padding:14px;border:1px solid rgba(255,255,255,.08); }
        .boss-hp-row { display:flex;justify-content:space-between;align-items:center;margin-bottom:8px; }
        .boss-hp-label { font-size:.82em;font-weight:700; }
        .boss-hp-pct { font-size:.82em;opacity:.6; }
        .boss-hp-track {
            height:18px;background:rgba(255,255,255,.07);border-radius:10px;overflow:hidden;position:relative;
        }
        .boss-hp-fill {
            height:100%;border-radius:10px;transition:width .12s ease;position:absolute;top:0;left:0;
        }
        .boss-dmg-row {
            display:flex;gap:14px;justify-content:center;font-size:.78em;opacity:.65;flex-wrap:wrap;
        }
        .boss-mechanic-warn {
            font-size:.75em;text-align:center;padding:5px 12px;border-radius:8px;
            background:rgba(255,100,0,.12);border:1px dashed rgba(255,100,0,.3);color:#ff9940;
            display:none;
        }
        .boss-mechanic-warn.active { display:block; }

        /* ── Click target ── */
        .boss-click-area {
            position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:10px;
            cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;
        }
        .boss-click-zone {
            width:160px;height:160px;border-radius:50%;border:3px solid;
            display:flex;align-items:center;justify-content:center;font-size:4em;
            position:relative;transition:transform .08s;
            box-shadow:0 0 30px var(--bc,#fff),0 0 60px var(--bc,#fff)44;
            animation:bossClickPulse 1.6s ease-in-out infinite;
        }
        @keyframes bossClickPulse {
            0%,100%{box-shadow:0 0 25px var(--bc,#fff),0 0 50px var(--bc,#fff)33;}
            50%{box-shadow:0 0 45px var(--bc,#fff),0 0 90px var(--bc,#fff)66;}
        }
        .boss-click-area:active .boss-click-zone { transform:scale(.88); }
        .boss-click-hint { font-size:.72em;font-weight:700;letter-spacing:.12em;opacity:.55;text-transform:uppercase; }

        .boss-flee-btn {
            position:relative;z-index:1;
            background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);
            color:rgba(255,255,255,.5);border-radius:20px;padding:8px 24px;
            font-size:.8em;cursor:pointer;transition:all .2s;
        }
        .boss-flee-btn:hover { background:rgba(255,80,80,.2);border-color:rgba(255,80,80,.4);color:#ff9999; }

        /* ── Boss Victory Overlay ── */
        #bossVictoryBg {
            position:fixed;inset:0;z-index:99000;display:none;
            flex-direction:column;align-items:center;justify-content:center;gap:16px;
            background:rgba(0,0,0,.9);backdrop-filter:blur(20px);
        }
        .boss-victory-box {
            display:flex;flex-direction:column;align-items:center;gap:14px;
            max-width:440px;width:90vw;text-align:center;position:relative;
        }
        .boss-victory-title {
            font-size:2em;font-weight:900;letter-spacing:.06em;
            animation:crateRevealPop .5s cubic-bezier(.175,.885,.32,1.275) both;
        }
        .boss-victory-rewards {
            background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
            border-radius:14px;padding:14px 18px;width:100%;text-align:left;
            animation:crateRewardPop .45s .1s cubic-bezier(.175,.885,.32,1.275) both;
        }
        .boss-reward-row { display:flex;align-items:center;gap:8px;padding:5px 0;font-size:.9em; }
        .boss-reward-row + .boss-reward-row { border-top:1px solid rgba(255,255,255,.06); }
        .boss-close-btn {
            padding:13px 44px;border:none;border-radius:14px;font-size:1.05em;font-weight:800;
            cursor:pointer;transition:all .18s;color:#000;
            animation:crateRewardPop .4s .2s cubic-bezier(.175,.885,.32,1.275) both;
        }
        .boss-close-btn:hover { transform:scale(1.06); }

        /* ── Boss-specific screen effects ── */
        .brainrot-distort #gameWrapper { animation:brainrotWarp .4s ease-in-out infinite; }
        @keyframes brainrotWarp {
            0%,100%{filter:none;}
            30%{filter:hue-rotate(40deg) saturate(1.8);}
            60%{filter:hue-rotate(-30deg) contrast(1.3);}
        }
        .void-dim #gameWrapper { filter:brightness(.45) saturate(.3);transition:filter .8s; }

        /* ── Boss click damage float ── */
        .boss-dmg-float {
            position:fixed;font-weight:900;font-size:1.4em;pointer-events:none;z-index:9600;
            animation:bossDmgFloat .7s ease-out forwards;
        }
        @keyframes bossDmgFloat {
            0%{opacity:1;transform:translateY(0) scale(1.2);}
            100%{opacity:0;transform:translateY(-80px) scale(.7);}
        }

        /* ── Rotating Tips Bar ── */
        #tipBar {
            text-align:center;
            font-size:.8em;
            opacity:.6;
            font-style:italic;
            margin-top:6px;
            min-height:1.4em;
            transition:opacity .4s ease, transform .4s ease;
            letter-spacing:.01em;
        }
        #tipBar.fading { opacity:0; transform:translateY(4px); }

        /* ══════════════════════════════════════════
           RESEARCH LAB — v0.16
        ══════════════════════════════════════════ */
        #labBg{position:fixed;inset:0;background:rgba(0,0,0,.88);backdrop-filter:blur(18px);z-index:7500;display:none;align-items:center;justify-content:center;padding:12px;}
        #labModal{background:linear-gradient(160deg,#080c14,#0d1220);border:1px solid rgba(255,255,255,.09);border-radius:22px;width:min(820px,100%);max-height:90vh;overflow-y:auto;padding:22px 18px;animation:modalIn .22s ease;scrollbar-width:thin;position:relative;}
        .lab-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px;}
        .lab-title{font-size:1.5em;font-weight:900;background:linear-gradient(90deg,#4ecdc4,#a29bfe,#ffd700);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
        .lab-subtitle{font-size:.78em;opacity:.4;margin-bottom:18px;font-style:italic;}
        .lab-currency-bar{display:flex;gap:14px;flex-wrap:wrap;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:9px 14px;margin-bottom:18px;font-size:.82em;}
        .lab-currency-item{display:flex;align-items:center;gap:5px;}
        .lab-close-btn{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:white;border-radius:50%;width:34px;height:34px;cursor:pointer;font-size:1.1em;flex-shrink:0;}

        /* ── Branch columns ── */
        .lab-tree{display:flex;gap:10px;overflow-x:auto;padding-bottom:10px;scrollbar-width:thin;}
        .lab-branch{flex:0 0 155px;display:flex;flex-direction:column;gap:0;}
        .lab-branch-header{text-align:center;padding:10px 8px 12px;border-radius:12px 12px 0 0;border:1.5px solid var(--bc);border-bottom:none;background:var(--bc)12;margin-bottom:0;}
        .lab-branch-icon{font-size:1.8em;display:block;margin-bottom:3px;}
        .lab-branch-name{font-size:.75em;font-weight:800;color:var(--bc);text-transform:uppercase;letter-spacing:.06em;}
        .lab-branch-desc{font-size:.63em;opacity:.5;margin-top:3px;line-height:1.3;}

        /* ── Connector line between nodes ── */
        .lab-connector{width:2px;height:22px;margin:0 auto;background:var(--bc);opacity:.2;flex-shrink:0;}
        .lab-connector.lit{opacity:.7;animation:labConnectorPulse 1.5s ease-in-out infinite;}
        @keyframes labConnectorPulse{0%,100%{opacity:.5}50%{opacity:1}}

        /* ── Nodes ── */
        .lab-node{border-radius:10px;border:1.5px solid rgba(255,255,255,.1);padding:10px 9px;background:rgba(255,255,255,.03);transition:all .2s;position:relative;overflow:hidden;}
        .lab-node.available{border-color:var(--bc);background:var(--bc)0d;cursor:pointer;animation:nodeAvailPulse 2s ease-in-out infinite;}
        .lab-node.unaffordable{border-color:var(--bc)66;background:var(--bc)06;cursor:pointer;opacity:.7;}
        .lab-node.locked{opacity:.25;filter:grayscale(.8);cursor:not-allowed;}
        .lab-node.unlocked{border-color:var(--bc);background:var(--bc)18;box-shadow:0 0 10px var(--bc)44;}
        .lab-node.available:hover{transform:scale(1.03);box-shadow:0 0 16px var(--bc)66;}
        .lab-node.unaffordable:hover{transform:scale(1.02);}
        .lab-node.node-activating{animation:nodeActivate .5s ease forwards;}
        @keyframes nodeAvailPulse{0%,100%{box-shadow:0 0 6px var(--bc)44}50%{box-shadow:0 0 16px var(--bc)88}}
        @keyframes nodeActivate{0%{transform:scale(1)}40%{transform:scale(1.12)}70%{transform:scale(.97)}100%{transform:scale(1);box-shadow:0 0 24px var(--bc)}}

        .lab-node-icon{font-size:1.4em;line-height:1;margin-bottom:4px;}
        .lab-node-name{font-size:.75em;font-weight:800;color:var(--bc);line-height:1.2;margin-bottom:3px;}
        .lab-node-desc{font-size:.65em;opacity:.6;line-height:1.35;margin-bottom:5px;}
        .lab-node-cost{font-size:.66em;font-weight:700;opacity:.8;}
        .lab-node-req{font-size:.6em;opacity:.35;margin-top:3px;border-top:1px solid rgba(255,255,255,.08);padding-top:3px;}
        .lab-node-check{position:absolute;top:5px;right:7px;color:var(--bc);font-size:.85em;opacity:.8;}
        .lab-node-effect{font-size:.62em;color:var(--bc);opacity:.65;margin-top:2px;font-style:italic;}

        /* ── Research total banner ── */
        .lab-progress-bar{height:4px;background:rgba(255,255,255,.07);border-radius:4px;margin-bottom:16px;overflow:hidden;}
        .lab-progress-fill{height:100%;background:linear-gradient(90deg,#4ecdc4,#a29bfe,#ffd700);border-radius:4px;transition:width .5s ease;}

        @media(max-width:768px){.title{font-size:2em;}.click-button{width:150px;height:150px;font-size:3em;}.hs-modal{padding:18px;}.boss-click-zone{width:130px;height:130px;font-size:3.2em;}.lab-branch{flex:0 0 140px;}}
    
/* ══════════════════════════════════════════════
   CODEX ENHANCED LAYER — Visual & Gameplay Polish
   ══════════════════════════════════════════════ */
:root{
    --codex-bg:#090b12;
    --codex-panel:rgba(9,12,22,.74);
    --codex-panel-2:rgba(255,255,255,.075);
    --codex-line:rgba(255,255,255,.14);
    --codex-gold:#ffd166;
    --codex-mint:#37f2b5;
    --codex-blue:#5cc8ff;
    --codex-pink:#ff5d9e;
    /* Horror deep-stage palette (stage 6+) */
    --horror-void:#050507;
    --horror-blood:#5a0a0a;
    --horror-sick:#a8b83c;
    --horror-bone:#d8d2c8;
    --skin-bg-glow-1: rgba(92,200,255,.26);
    --skin-bg-glow-2: rgba(255,93,158,.18);
    --skin-bg-glow-3: rgba(55,242,181,.20);
    --skin-bg-base-1: #090b12;
    --skin-bg-base-2: #121526;
    --skin-bg-base-3: #0a1617;
    --skin-accent: #feca57;
    --skin-accent-2: #ff6b6b;
    --skin-panel-border: rgba(255,255,255,.13);
}
body.codex-enhanced{
    background:
        radial-gradient(circle at 18% 12%,var(--skin-bg-glow-1),transparent 30%),
        radial-gradient(circle at 82% 8%,var(--skin-bg-glow-2),transparent 26%),
        radial-gradient(circle at 48% 100%,var(--skin-bg-glow-3),transparent 34%),
        linear-gradient(135deg,var(--skin-bg-base-1) 0%,var(--skin-bg-base-2) 48%,var(--skin-bg-base-3) 100%) !important;
    animation:none !important;
    transition:background 0.6s ease;
}
body.codex-enhanced::before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
    background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size:46px 46px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.75),rgba(0,0,0,.08));
}
body.codex-enhanced #gameWrapper{position:relative;z-index:1;padding-top:0;} /* padding-top removed — mobileTopBar handles spacing */
body.codex-enhanced .container{max-width:1540px;padding:18px clamp(12px,2vw,28px);}
body.codex-enhanced .click-button{
    width:min(42vw,260px);height:min(42vw,260px);min-width:190px;min-height:190px;border-radius:50%;font-size:5.2rem;margin:10px auto;
    background:radial-gradient(circle at 35% 28%,#fff6ca 0 10%,#ffd166 24%,#ff6b6b 58%,#9b5cff 100%);
    border:6px solid rgba(255,255,255,.86);box-shadow:0 24px 70px rgba(255,107,107,.34),inset 0 -18px 38px rgba(0,0,0,.18);
    position:relative;isolation:isolate;will-change:transform;
}
body.codex-enhanced .click-button::after{content:"";position:absolute;inset:-18px;border-radius:50%;border:1px solid rgba(255,209,102,.34);animation:codexRing 1.55s ease-out infinite;}
body.codex-enhanced .click-button.combo-hot{box-shadow:0 0 34px rgba(55,242,181,.65),0 0 90px rgba(255,93,158,.38),inset 0 -18px 38px rgba(0,0,0,.18);}
@keyframes codexRing{0%{transform:scale(.92);opacity:.75}100%{transform:scale(1.18);opacity:0}}
.codex-hud{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:10px 0 4px;}
.codex-chip{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:10px 12px;min-height:64px;}
.codex-chip b{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.48);margin-bottom:4px;}
.codex-chip span{font-weight:800;color:#fff;font-size:1.05rem;}
.codex-quest-panel{background:rgba(0,0,0,.22);border:1px solid rgba(255,255,255,.13);border-radius:8px;padding:12px;margin-top:8px;}
.codex-quest-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;}
.codex-quest-head strong{font-size:.92rem;letter-spacing:.04em;text-transform:uppercase;}
.codex-quest-list{display:grid;gap:8px;}
.codex-quest{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:8px 10px;background:rgba(255,255,255,.06);border-radius:8px;overflow:hidden;position:relative;}
.codex-quest::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--p,0%);background:linear-gradient(90deg,rgba(55,242,181,.20),rgba(92,200,255,.13));z-index:0;}
.codex-quest>*{position:relative;z-index:1;}
.codex-quest small{display:block;opacity:.58;margin-top:2px;}
.codex-quest.done{border:1px solid rgba(55,242,181,.42);}
.codex-toast-stack{position:fixed;right:16px;bottom:80px;display:grid;gap:8px;z-index:999999;pointer-events:none;max-width:280px;}
.codex-toast{background:rgba(10,14,24,.92);border:1px solid rgba(255,255,255,.16);border-radius:8px;padding:11px 13px;box-shadow:0 14px 36px rgba(0,0,0,.35);animation:codexToast .35s ease both;color:white;font-weight:700;font-size:.88em;pointer-events:none;}
@keyframes codexToast{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.codex-particle{position:fixed;width:7px;height:7px;border-radius:50%;pointer-events:none;z-index:99998;background:var(--c,#ffd166);box-shadow:0 0 14px var(--c,#ffd166);animation:codexBurst .7s ease-out forwards;}
@keyframes codexBurst{to{transform:translate(var(--x),var(--y)) scale(.15);opacity:0}}
@media(max-width:560px){.codex-hud{grid-template-columns:repeat(2,1fr)}.codex-chip{min-height:auto}}
/* ══════════════════════════════════════════════
   v1.6 — THE VOID UPDATE
   ══════════════════════════════════════════════ */

/* ── Relic Cards ── */
.relic-card {
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 14px;
    padding: 12px 14px;
    transition: border-color .2s, box-shadow .2s, transform .15s;
    cursor: default;
}
.relic-card.owned { cursor: default; }
.relic-card.owned:hover { transform: translateY(-2px); }

/* ── Museum Cards ── */
.museum-card {
    background: rgba(255,255,255,.03);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 14px;
    padding: 14px 16px;
    transition: border-color .2s, box-shadow .2s;
}
.museum-card.achieved {
    border-color: rgba(255,215,0,.3);
    background: rgba(255,215,0,.04);
    box-shadow: 0 0 12px rgba(255,215,0,.07);
}

/* ── Achievement unlock toast ── */
.achievement-unlock-toast {
    display: flex !important;
    gap: 12px;
    align-items: center;
    text-align: left;
    border: 1px solid rgba(255,215,0,.5) !important;
    box-shadow: 0 0 24px rgba(255,215,0,.25) !important;
    transform: translateX(120%);
    transition: transform .35s cubic-bezier(.34,1.56,.64,1);
}
.achievement-unlock-toast.popping { transform: translateX(0); }

/* ── Relic toast ── */
.relic-toast {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 16px 20px !important;
    border: 1.5px solid rgba(255,215,0,.4);
    min-width: 200px;
    gap: 2px;
}

/* ── Hall of Legends ── */
.hall-grid { display: flex; flex-direction: column; gap: 8px; padding: 4px; }
.hall-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 12px;
    padding: 10px 14px;
    transition: border-color .2s;
}
.hall-card.hall-me {
    border-color: rgba(78,205,196,.5);
    background: rgba(78,205,196,.06);
    box-shadow: 0 0 12px rgba(78,205,196,.1);
}
.hall-rank { font-size: 1.2em; min-width: 32px; text-align: center; font-weight: 700; }
.hall-info { flex: 1; min-width: 0; }
.hall-name { font-weight: 600; font-size: .9em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hall-score { font-weight: 700; color: #ffd700; font-size: 1em; white-space: nowrap; }

/* ── Void Modal ── */
.void-modal { animation: voidIn .4s ease; position: relative; overflow: hidden; }
@keyframes voidIn { from { opacity:0; transform: scale(.95); filter: blur(4px); } to { opacity:1; transform:scale(1); filter:none; } }
@keyframes voidPulse { 0%,100%{opacity:1;} 50%{opacity:.7;} }
@keyframes voidBtnReveal { from{opacity:0;transform:scale(0) rotate(-180deg);} to{opacity:1;transform:scale(1) rotate(0);} }

.void-scanlines {
    position: absolute; inset: 0; pointer-events: none; z-index: 1;
    background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,.08) 2px, rgba(0,0,0,.08) 4px);
    border-radius: 22px;
}
.void-modal > *:not(.void-scanlines) { position: relative; z-index: 2; }

.void-section-title {
    font-size: .75em; font-weight: 700; letter-spacing: .1em;
    color: #a29bfe; text-transform: uppercase;
    margin: 20px 0 10px; padding-bottom: 6px;
    border-bottom: 1px solid rgba(162,155,254,.2);
}
.void-header-stat { font-size: .85em; opacity: .7; margin-bottom: 5px; }
.void-lore-card {
    background: rgba(162,155,254,.06);
    border: 1px solid rgba(162,155,254,.18);
    border-radius: 10px;
    padding: 10px 14px;
    cursor: pointer;
    transition: background .2s, border-color .2s;
}
.void-lore-card:hover { background: rgba(162,155,254,.12); border-color: rgba(162,155,254,.35); }
.void-lore-card.read { border-color: rgba(162,155,254,.4); cursor: default; }
.void-lore-card.read:hover { background: rgba(162,155,254,.06); }

/* ── Void active body glitch ── */
.void-active { animation: voidGlitch 8s linear infinite; }
@keyframes voidGlitch {
    0%,95%,100% { filter: none; }
    96% { filter: hue-rotate(15deg) brightness(1.05); }
    97% { filter: hue-rotate(-10deg) brightness(.98) saturate(1.1); }
    98% { filter: none; }
    99% { filter: hue-rotate(20deg); }
}

/* ── Observatory styling ── */
#obsLog::-webkit-scrollbar { width: 4px; }
#obsLog::-webkit-scrollbar-thumb { background: rgba(78,205,196,.3); border-radius: 2px; }

/* ── Void ??? button ── */
#voidBtn:hover {
    box-shadow: 0 0 36px rgba(162,155,254,.6);
    border-color: rgba(162,155,254,.7);
    transform: scale(1.05);
}
#voidBtn { transition: transform .2s, box-shadow .2s, border-color .2s; }

/* ── Relic badge on user bar button ── */
#relicBadge { display: inline-block !important; }

/* ── Patch notes v1.6 entry spacing ── */
.v16-badge {
    background: linear-gradient(135deg, #6c5ce7, #a29bfe);
    color: white;
    font-weight: 700;
    padding: 3px 12px;
    border-radius: 20px;
    font-size: .85em;
}

/* ══════════════════════════════════════════════
   v1.7 — THE ASCENSION
   ══════════════════════════════════════════════ */

/* ── Trial progress bars ── */
.trial-bar-wrap { background:rgba(255,255,255,.07); border-radius:6px; height:8px; overflow:hidden; }
.trial-bar      { height:100%; background:linear-gradient(90deg,#fd7e14,#ffc107); border-radius:6px; transition:width .4s; }

/* ── Corruption mutation card ── */
.corrupt-card {
    background: rgba(232,62,140,.06);
    border: 1px solid rgba(232,62,140,.2);
    border-radius: 12px;
    padding: 12px 14px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ── D. Fragment cards ── */
.dfrag-card {
    background: rgba(255,215,0,.04);
    border: 1px solid rgba(255,215,0,.12);
    border-radius: 14px;
    padding: 14px 16px;
    margin-bottom: 10px;
    transition: border-color .2s;
}
.dfrag-card.found {
    border-color: rgba(255,215,0,.35);
    background: rgba(255,215,0,.07);
}

/* ── Relic Forge slots ── */
.forge-slot {
    flex: 1;
    min-width: 110px;
    border: 2px dashed rgba(255,255,255,.2);
    border-radius: 14px;
    padding: 14px;
    text-align: center;
    cursor: pointer;
    transition: border-color .2s, background .2s;
}
.forge-slot.filled {
    border-style: solid;
}
.forge-slot:hover { border-color: rgba(255,255,255,.4); }

/* ── Observer boss HP bar ── */
.observer-hp-wrap { background:rgba(255,255,255,.06); border-radius:8px; height:16px; overflow:hidden; margin-bottom:6px; }
.observer-hp-bar  { height:100%; border-radius:8px; transition:width .2s; }

/* ── Network banner ── */
#networkProgress {
    display: none;
    background: rgba(78,205,196,.05);
    border-bottom: 1px solid rgba(78,205,196,.12);
    padding: 7px 16px;
    font-size: .78em;
}
#networkBar { transition: width .8s ease; }

/* ── Observer button reveal ── */
#observerBtn { transition: opacity .5s; }

/* ── v1.7 patch notes badge ── */
.v17-badge {
    background: linear-gradient(135deg, #fd7e14, #ffc107);
    color: black;
    font-weight: 700;
    padding: 3px 12px;
    border-radius: 20px;
    font-size: .85em;
}

/* ── Cutscene overlay (D. Fragments) ── */
@keyframes fragReveal {
    from { opacity:0; transform:scale(.94); }
    to   { opacity:1; transform:scale(1); }
}

/* ══════════════════════════════════════════════
   v1.8 — THE FRACTURE
   ══════════════════════════════════════════════ */

/* ── Fracture active body ── */
.fracture-active {
    animation: fracturePulse 0.18s steps(2) infinite;
}
@keyframes fracturePulse {
    0%   { filter: hue-rotate(0deg) brightness(1); }
    33%  { filter: hue-rotate(25deg) brightness(1.06) saturate(1.2); }
    66%  { filter: hue-rotate(-15deg) brightness(.97); }
    100% { filter: hue-rotate(0deg) brightness(1); }
}
@keyframes fractureMsgFade {
    0%   { opacity:0; transform:translateY(-6px) skewX(-3deg); }
    15%  { opacity:1; }
    80%  { opacity:1; }
    100% { opacity:0; transform:translateY(4px); }
}

/* ── Tide HUD ── */
#tideHud { transition: border-color .4s, color .4s; }

/* ── Echo cards ── */
.echo-card {
    background: rgba(99,102,241,.06);
    border: 1px solid rgba(99,102,241,.15);
    border-radius: 10px;
    padding: 8px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* ── Codex entries ── */
.codex-entry { transition: background .15s; }
.codex-entry.unlocked:hover { background: rgba(255,255,255,.08) !important; }

/* ── Alchemy active HUD pills ── */
#alchemyHud > div { transition: opacity .3s; }

/* ── Fracture message positioning ── */
.fracture-msg { animation: fractureMsgFade 4s ease forwards; }

/* ── v1.8 patch notes badge ── */
.v18-badge {
    background: linear-gradient(135deg, #6366f1, #8b5cf6);
    color: white;
    font-weight: 700;
    padding: 3px 12px;
    border-radius: 20px;
    font-size: .85em;
}

/* ── Named echo unlock overlay uses voidIn animation (already defined) ── */

/* ══════════════════════════════════════════════
   v1.9 — COMMAND CENTER UI
   ══════════════════════════════════════════════ */

/* ── Menu container ── */
.cmd-menu {
    position: relative;
    display: inline-block;
}

/* ── Menu trigger button ── */
.cmd-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 10px;
    color: rgba(255,255,255,.85);
    font-size: .82em;
    font-weight: 600;
    padding: 6px 11px;
    cursor: pointer;
    transition: background .15s, border-color .15s;
    white-space: nowrap;
    position: relative;
}
.cmd-btn:hover,
.cmd-menu.open .cmd-btn {
    background: rgba(255,255,255,.13);
    border-color: rgba(255,255,255,.25);
}
.cmd-label {
    font-size: .88em;
}

/* ── Badge on trigger button ── */
.cmd-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #e83e8c;
    color: white;
    border-radius: 9px;
    font-size: .65em;
    font-weight: 700;
    padding: 1px 5px;
    min-width: 16px;
    line-height: 1.4;
}

/* ── Dropdown panel ── */
.cmd-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 7px);
    left: 0;
    min-width: 210px;
    background: #111118;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 14px;
    padding: 8px 6px;
    z-index: 55000;
    box-shadow: 0 8px 32px rgba(0,0,0,.55), 0 2px 8px rgba(0,0,0,.4);
    animation: cmdDropIn .15s ease;
}
.cmd-dropdown-right {
    left: auto;
    right: 0;
}
@keyframes cmdDropIn {
    from { opacity:0; transform:translateY(-6px) scale(.97); }
    to   { opacity:1; transform:translateY(0) scale(1); }
}

/* Show when open */
.cmd-menu.open .cmd-dropdown,
.cmd-menu-global.open .cmd-dropdown {
    display: block;
}

/* ── Section label inside dropdown ── */
.cmd-section-label {
    font-size: .68em;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: rgba(255,255,255,.3);
    padding: 4px 10px 6px;
    border-bottom: 1px solid rgba(255,255,255,.06);
    margin-bottom: 4px;
}

/* ── Dropdown item ── */
.cmd-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    background: none;
    border: none;
    color: rgba(255,255,255,.75);
    font-size: .84em;
    font-weight: 500;
    padding: 8px 10px;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    transition: background .12s, color .12s;
}
.cmd-item:hover {
    background: rgba(255,255,255,.08);
    color: white;
}

/* ── Mobile: smaller labels ── */
@media (max-width: 600px) {
    .cmd-label { display: none; }
    .cmd-btn { padding: 6px 9px; }
    .cmd-dropdown { min-width: 190px; }
}

/* ── Hide legacy void floating btn (now in menu) ── */
#voidBtn { display: none !important; }

/* ══════════════════════════════════════════════
   v1.9 — MOBILE-FIRST LAYOUT OVERHAUL
   ══════════════════════════════════════════════ */

/* ── Reset old two-column layout ── */
.container { display: none !important; } /* replaced by tabContent */
.game-area { display: block !important; }
#userBar { display: none !important; }    /* replaced by mobileTopBar */

/* ── gameWrapper takes full screen ── */
#gameWrapper {
    display: none; /* shown after login */
    flex-direction: column;
    height: 100dvh;
    overflow: hidden;
    padding-top: 0 !important;
}
#gameWrapper.visible {
    display: flex;
}

/* ── Mobile top bar ── */
#mobileTopBar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
    background: rgba(0,0,0,.6);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255,255,255,.1);
    flex-shrink: 0;
    z-index: 100;
    gap: 8px;
    min-height: 48px;
}
.mtb-left { display: flex; flex-direction: column; gap: 1px; }
.mtb-sigma {
    font-size: 1.1em;
    font-weight: 800;
    color: var(--skin-accent, #feca57);
    letter-spacing: -.5px;
    line-height: 1.1;
}
.mtb-sps { font-size: .7em; opacity: .55; }
.mtb-right {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
    overflow-x: auto;
}
.mtb-btn {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    color: white;
    font-size: 1.1em;
    width: 34px;
    height: 34px;
    cursor: pointer;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .15s;
}
.mtb-btn:hover { background: rgba(255,255,255,.16); }
.mtb-admin { background: rgba(255,50,50,.2); border-color: rgba(255,50,50,.4); }

/* ── Tab content area ── */
#tabContent {
    flex: 1;
    overflow: hidden;
    position: relative;
    min-height: 0; /* critical for flex children to shrink */
}
.game-tab {
    display: none;
    height: 100%;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 16px 14px 80px; /* 80px = bottom nav clearance */
    box-sizing: border-box;
}
.game-tab.active { display: block; }

/* ── Click tab layout ── */
.title-area {
    text-align: center;
    margin-bottom: 10px;
}
.title-area .title {
    font-size: clamp(1.3em, 4vw, 2em);
    margin-bottom: 4px;
}
.title-area .subtitle {
    font-size: .78em;
    opacity: .6;
}
.click-core {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: rgba(0,0,0,.3);
    border-radius: 20px;
    padding: 20px 16px;
    border: 1px solid rgba(255,255,255,.12);
    margin-bottom: 14px;
}
.click-core .sigma-counter {
    font-size: clamp(1.8em, 7vw, 2.8em);
    margin-bottom: 4px;
}
.click-core .click-button {
    width: clamp(130px, 36vw, 200px);
    height: clamp(130px, 36vw, 200px);
    font-size: clamp(2.5em, 8vw, 4em);
    margin: 14px auto;
}
.click-core .stats {
    width: 100%;
    max-width: 380px;
    margin-top: 12px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 12px;
    text-align: left;
    font-size: .82em;
}

/* ── Shop tab layout ── */
#tab-shop-panel .shop {
    background: transparent;
    border: none;
    padding: 0;
    max-height: none;
    height: auto;
    overflow-y: visible;
    display: block;
    backdrop-filter: none;
    border-radius: 0;
    gap: 0;
}

/* ── Bottom nav ── */
#bottomNav {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: rgba(10,10,18,.95);
    backdrop-filter: blur(16px);
    border-top: 1px solid rgba(255,255,255,.1);
    display: flex;
    align-items: stretch;
    z-index: 9500;
    padding-bottom: env(safe-area-inset-bottom, 0);
}
.bnav-btn {
    flex: 1;
    background: none;
    border: none;
    color: rgba(255,255,255,.4);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 4px 2px;
    transition: color .15s;
    position: relative;
}
.bnav-btn.active { color: var(--skin-accent, #feca57); }
.bnav-icon { font-size: 1.3em; line-height: 1; }
.bnav-label { font-size: .6em; font-weight: 600; letter-spacing: .03em; }
.bnav-badge {
    position: absolute;
    top: 6px;
    right: calc(50% - 18px);
    background: #e83e8c;
    color: white;
    border-radius: 9px;
    font-size: .55em;
    font-weight: 700;
    padding: 1px 4px;
    min-width: 14px;
    text-align: center;
}

/* ── Dropdowns from top-bar attach below it ── */
.cmd-menu { position: static; }
#mobileTopBar .cmd-menu { position: relative; }

/* ── Override old cmd-btn styles when inside top bar ── */
#mobileTopBar .cmd-btn,
#mobileTopBar .cmd-menu .cmd-btn { display: none; } /* hidden; mtb-btn used instead */

/* Dropdowns triggered from bottom nav / mtb need global position */
/* (positioning handled by JS toggleMenu) */

/* ── Desktop override — side-by-side above 900px ── */
@media (min-width: 900px) {
    #gameWrapper { flex-direction: column; height: 100dvh; }
    #mobileTopBar { display: flex; }
    #bottomNav { display: none; }
    .mtb-right .mtb-btn { display: flex; }
    #tabContent { display: flex; flex-direction: row; overflow: hidden; }
    #tab-click-panel,
    #tab-shop-panel {
        display: block !important;
        height: 100%;
        overflow-y: auto;
    }
    #tab-click-panel { flex: 1; padding: 20px; }
    #tab-shop-panel  { width: 380px; flex-shrink: 0; padding: 20px 16px; border-left: 1px solid rgba(255,255,255,.1); }
    .click-core .stats { grid-template-columns: 1fr; }
    /* menus: positioned by JS */
}

/* ── Show gameWrapper when logged in ── */
/* JS calls document.getElementById('gameWrapper').classList.add('visible') */

/* ── tipBar inside tab ── */
#tipBar { margin: 0 0 12px; font-size: .8em; }

/* ── Patch: hide old header-btns (now in menus) ── */
.header-btns { display: none !important; }

/* ══════════════════════════════════════════════
   v1.9 — GLOBAL DROPDOWN MENUS (fixed position)
   ══════════════════════════════════════════════ */

/* Global menu container — invisible wrapper, no position of its own */
.cmd-menu-global {
    display: none;
}
.cmd-menu-global.open {
    display: block;
}

/* The dropdown itself gets position:fixed set by JS */
.cmd-menu-global .cmd-dropdown {
    display: none;
    border-radius: 14px;
    padding: 10px 8px;
    min-width: 220px;
    max-width: 280px;
    z-index: 9600;
}
.cmd-menu-global.open .cmd-dropdown {
    display: block;
    animation: cmdDropIn .15s ease;
}

/* Desktop: menus drop down from buttons (handled by JS positioning) */
@media (min-width: 900px) {
    .cmd-menu-global .cmd-dropdown {
        max-width: 240px;
    }
}

/* Save indicator — keep accessible */
#saveIndicator {
    display: none; /* hidden, shown by JS if needed */
}

/* ══════════════════════════════════════════════
   v2.0 — SEASONS
   ══════════════════════════════════════════════ */

#seasonBanner { transition: border-color .3s, background .3s; }
#seasonBanner:hover { background: rgba(162,155,254,.12) !important; }

.season-reward-card {
    background: rgba(162,155,254,.06);
    border: 1px solid rgba(162,155,254,.2);
    border-radius: 10px;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
}

/* ══════════════════════════════════════════════
   v2.0 — ASCENSION ENGINE + GOL. D. SIGMA
   ══════════════════════════════════════════════ */

/* Gol. D. boss glow */
#golDBg { animation: voidPulse 4s ease infinite; }

/* Ascension universe cards */
.universe-card {
    background: rgba(255,215,0,.04);
    border: 1px solid rgba(255,215,0,.15);
    border-radius: 10px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 12px;
}

/* ══════════════════════════════════════════════
   v2.0 — UI POLISH (Mobile + Desktop)
   ══════════════════════════════════════════════ */

/* ── Global modal standard ── */
[id$="Bg"]:not(#bossArenaBg):not(#crateOpenBg) {
    padding: 10px;
}
[id$="Bg"] > div {
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.15) transparent;
}
[id$="Bg"] > div::-webkit-scrollbar { width: 4px; }
[id$="Bg"] > div::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 2px; }

/* ── Mobile top bar refinements ── */
#mobileTopBar {
    background: rgba(6,5,14,.85);
    border-bottom: 1px solid rgba(255,255,255,.08);
    padding: 8px 12px 8px 14px;
    gap: 10px;
}
.mtb-sigma {
    font-size: 1.15em;
    color: var(--skin-accent, #feca57);
    font-weight: 800;
}
.mtb-right { gap: 5px; }
.mtb-btn {
    width: 32px;
    height: 32px;
    border-radius: 9px;
    font-size: 1em;
    background: rgba(255,255,255,.07);
    border-color: rgba(255,255,255,.1);
}

/* ── Bottom nav refinements ── */
#bottomNav {
    background: rgba(6,5,14,.95);
    border-top: 1px solid rgba(255,255,255,.08);
    box-shadow: 0 -4px 20px rgba(0,0,0,.5);
}
.bnav-btn {
    gap: 3px;
    font-size: .85em;
    border-top: 2px solid transparent;
    transition: color .15s, border-color .15s;
}
.bnav-btn.active {
    border-top-color: var(--skin-accent, #feca57);
}
.bnav-icon { font-size: 1.2em; }
.bnav-label { font-size: .58em; letter-spacing: .04em; text-transform: uppercase; }

/* ── Click core polish ── */
.click-core {
    background: rgba(0,0,0,.4);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 22px;
    padding: 20px 16px;
    margin-bottom: 12px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 4px 24px rgba(0,0,0,.4);
}
.click-core .sigma-counter {
    font-size: clamp(1.6em, 6.5vw, 2.6em);
    font-weight: 800;
    letter-spacing: -.5px;
    color: var(--skin-accent, #feca57);
    text-align: center;
    margin-bottom: 4px;
}
.click-core .total-earned {
    font-size: .72em;
    opacity: .45;
    margin: 3px 0 8px;
    text-align: center;
    color: white;
}
.click-core .multiplier-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin-bottom: 4px;
}
.click-core .mult-item {
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 7px;
    padding: 3px 9px;
    font-size: .72em;
    font-weight: 600;
    color: white;
}
.click-core .stats {
    grid-template-columns: 1fr 1fr;
    background: rgba(255,255,255,.03);
    border-radius: 12px;
    padding: 12px 14px;
    gap: 8px 20px;
    font-size: .82em;
    width: 100%;
    max-width: 400px;
    border: 1px solid rgba(255,255,255,.06);
    color: white;
}
.click-core .stat {
    padding: 4px 0;
    border-bottom: 1px solid rgba(255,255,255,.04);
    color: white;
    font-weight: 400;
    line-height: 1.5;
}
.click-core .stat strong {
    font-weight: 600;
    color: var(--skin-accent, #feca57);
}

/* ── Shop tab polish ── */
#tab-shop-panel .shop-header {
    position: sticky;
    top: 0;
    background: rgba(6,5,14,.95);
    backdrop-filter: blur(10px);
    padding: 10px 0 8px;
    z-index: 10;
    border-bottom: 1px solid rgba(255,255,255,.07);
    margin-bottom: 10px;
}

/* ── Dropdown refinements ── */
.cmd-dropdown {
    background: rgba(10,9,20,.98);
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 12px 40px rgba(0,0,0,.7), 0 2px 8px rgba(0,0,0,.4);
    border-radius: 16px;
}
.cmd-section-label {
    font-size: .7em;
    padding: 6px 10px 7px;
    color: rgba(255,255,255,.35);
    border-bottom: 1px solid rgba(255,255,255,.07);
}
.cmd-item {
    padding: 9px 12px;
    font-size: .85em;
    border-radius: 9px;
    gap: 9px;
}
.cmd-item:hover {
    background: rgba(255,255,255,.09);
}

/* ── Season banner refinement ── */
#seasonBanner {
    border-radius: 16px;
    background: rgba(162,155,254,.06) !important;
    border: 1px solid rgba(162,155,254,.18) !important;
    padding: 11px 14px !important;
    margin-bottom: 10px !important;
}

/* ── Title area ── */
.title-area { margin-bottom: 8px; }
.title-area .title {
    font-size: clamp(1.1em, 4vw, 1.7em);
    font-weight: 800;
    line-height: 1.2;
    color: var(--skin-accent, #feca57);
}
.title-area .subtitle {
    font-size: .72em;
    opacity: .45;
    margin-top: 3px;
    color: white;
}

/* ── tipBar ── */
#tipBar {
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 9px;
    padding: 6px 12px;
    font-size: .75em;
    opacity: .65;
    text-align: center;
    margin: 0 0 10px;
}

/* ── Discord promo ── */
#discordPromo {
    background: rgba(88,101,242,.1);
    border: 1px solid rgba(88,101,242,.25);
    border-radius: 14px;
    padding: 12px 16px;
    text-align: center;
    margin: 12px 0;
}
#discordPromo h4 { font-size: .85em; margin-bottom: 5px; opacity: .7; }
#discordPromo a {
    color: #7983f5;
    font-weight: 700;
    font-size: .9em;
    text-decoration: none;
}

/* ── Achievements panel ── */
.achievements-panel {
    background: rgba(255,255,255,.03);
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 16px;
    padding: 14px;
    margin-top: 8px;
}
.achievements-panel h3 {
    font-size: .8em;
    font-weight: 700;
    letter-spacing: .08em;
    opacity: .5;
    text-transform: uppercase;
    margin-bottom: 10px;
}

/* ── Desktop: better two-column layout ── */
@media (min-width: 900px) {
    #mobileTopBar { min-height: 52px; padding: 10px 20px; }
    .mtb-sigma { font-size: 1.25em; }
    .mtb-btn { width: 36px; height: 36px; }
    #tab-click-panel { padding: 20px 24px 20px; }
    #tab-shop-panel  { padding: 16px 18px 20px; width: 400px; }
    .click-core { padding: 24px 20px; border-radius: 24px; }
    .click-core .stats { grid-template-columns: 1fr; max-width: 100%; }
    .title-area .title { font-size: clamp(1.3em, 2.5vw, 2em); }
    .title-area .subtitle { font-size: .78em; }
}

/* ── Prestige sections ── */
.prestige-section {
    border-radius: 16px;
    padding: 16px;
    margin-top: 10px;
    border: 1px solid rgba(255,215,0,.25);
    background: rgba(255,215,0,.05);
}
.prestige-section h3 {
    font-size: .95em;
    margin-bottom: 6px;
}
.prestige-section p {
    font-size: .8em;
    opacity: .65;
    margin-bottom: 6px;
    line-height: 1.5;
}
.prestige-btn {
    width: 100%;
    margin-top: 10px;
    padding: 11px;
    border-radius: 12px;
    font-size: .95em;
    font-weight: 800;
    border: none;
    cursor: pointer;
    background: linear-gradient(90deg, #ffd700, #ff9f43);
    color: black;
    transition: opacity .15s;
}
.prestige-btn:hover { opacity: .88; }

/* ── Patch notes: old versions dimmed ── */
#patchModal > div > div[style*="background:rgba"] {
    opacity: .85;
}

/* Ensure white text everywhere in game */
#gameWrapper {
    color: white;
}

/* ── Hide all scrollbars globally ── */
* {
    scrollbar-width: none;
    -ms-overflow-style: none;
}
*::-webkit-scrollbar {
    display: none;
}

/* ══════════════════════════════════════════════
   COMBINED MOBILE MENU (menuAll)
   ══════════════════════════════════════════════ */

#menuAll.cmd-menu-global.open {
    display: block;
    position: fixed;
    bottom: 60px; /* above bottom nav */
    left: 0;
    right: 0;
    z-index: 9600;
    max-height: 75vh;
    overflow-y: auto;
    padding: 0 10px;
}

#menuAll .cmd-dropdown.menu-all-dropdown {
    width: 100%;
    max-width: 100%;
    border-radius: 20px 20px 14px 14px;
    padding: 14px 10px;
    position: static;
}

.menu-all-sections {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 10px;
}

.menu-all-section {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.menu-all-section .cmd-section-label {
    font-size: .68em;
    padding: 4px 6px 6px;
    border-bottom: 1px solid rgba(255,255,255,.07);
    margin-bottom: 3px;
}

.menu-all-section .cmd-item {
    padding: 7px 8px;
    font-size: .8em;
    border-radius: 8px;
}

/* Desktop: menuAll hidden, use the 4 separate menus instead */
@media (min-width: 900px) {
    #menuAll { display: none !important; }
    #bnavMenu { display: none; }
}

/* ── SVG icon sizing in nav buttons ── */
.bnav-icon svg {
    width: 22px;
    height: 22px;
    display: block;
}
.bnav-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}
.mtb-btn svg {
    display: block;
}

/* ── menuAll bottom sheet fix ── */
#menuAll.cmd-menu-global {
    display: none;
}
#menuAll.cmd-menu-global.open {
    display: block;
    position: fixed;
    bottom: 60px;
    left: 0;
    right: 0;
    z-index: 9600;
    max-height: 78vh;
    overflow-y: auto;
    padding: 0 8px 8px;
}
#menuAll .cmd-dropdown {
    position: static !important;
    display: none;
    width: 100%;
    max-width: 100%;
    border-radius: 20px;
    padding: 14px 10px;
}
#menuAll.open .cmd-dropdown {
    display: block !important;
}

/* ── Horror arc: the game changes after the opening ── */
body.horror-arc-active {
    background: #101018 !important;
    color: #ded7d1;
}
body.horror-arc-active::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 99990;
    pointer-events: none;
    opacity: .15;
    background:
        repeating-linear-gradient(0deg, rgba(255,255,255,.028) 0 1px, transparent 1px 4px),
        radial-gradient(ellipse at center, transparent 42%, rgba(0,0,0,.48) 100%);
    mix-blend-mode: screen;
}
body.horror-arc-active #gameWrapper {
    filter: saturate(.72) contrast(1.04) brightness(.92);
    transition: filter 2.4s ease;
}
body.horror-arc-active .click-button {
    position: relative;
    background: radial-gradient(circle at 46% 42%, #f3ded2 0 7%, #311014 9% 19%, #090508 21% 66%, #000 100%) !important;
    border-color: #6c1c25 !important;
    box-shadow: 0 0 0 2px rgba(115,20,31,.38), 0 0 28px rgba(137,9,24,.48), inset 0 0 30px #000 !important;
    animation: horror-eye-breathe 3.8s ease-in-out infinite !important;
}
body.horror-arc-active .click-button::before {
    content: "";
    position: absolute;
    left: 50%; top: 50%; width: 25%; height: 57%;
    transform: translate(-50%,-50%);
    border-radius: 50%;
    background: #050104;
    box-shadow: 0 0 12px rgba(255,55,55,.8);
}
body.horror-arc-active .click-button { font-size: 0 !important; }
body.horror-arc-active .click-button::after {
    content: "CLICK";
    position: absolute; inset: 0; display: grid; place-items: end center;
    padding-bottom: 16%; font: 700 13px/1 monospace; letter-spacing: .42em;
    color: rgba(237,202,196,.62); text-shadow: 0 0 8px #b20018;
    animation: horror-letter-flicker 4s steps(1) infinite;
}
body.horror-arc-deep #gameWrapper { filter: saturate(.05) contrast(1.32) brightness(.54) !important; }
body.horror-arc-deep .sigma-counter, body.horror-arc-deep h1, body.horror-arc-deep h2 {
    color: #b72f38 !important;
    text-shadow: -2px 0 rgba(255,0,0,.36), 2px 0 rgba(0,155,255,.18) !important;
}
.horror-arc-card {
    position: fixed; inset: 0; z-index: 1000000; display: grid; place-items: center;
    background: #000; color: #e8ded9; font-family: monospace; letter-spacing: .18em;
    text-align: center; padding: 24px; opacity: 0; transition: opacity .7s ease;
}
.horror-arc-card.show { opacity: 1; }
.horror-arc-card .horror-arc-word { font-size: clamp(1.25rem, 4vw, 2.7rem); font-weight: 700; }
.horror-arc-card .horror-arc-sub { margin-top: 22px; font-size: .76rem; color: rgba(255,255,255,.43); letter-spacing: .1em; }
.horror-casefile {
    position: fixed; inset: 0; z-index: 1000001; display: grid; place-items: center;
    padding: 20px; background: rgba(0,0,0,.82); backdrop-filter: blur(8px);
    font-family: ui-monospace, Consolas, monospace; color: #ded4ca;
}
.horror-casefile__sheet {
    width: min(620px, 100%); border: 1px solid rgba(166,38,47,.62); border-radius: 3px;
    padding: clamp(22px, 5vw, 46px); background:
      linear-gradient(rgba(21,9,10,.96), rgba(5,4,5,.98)),
      repeating-linear-gradient(0deg, transparent 0 25px, rgba(255,255,255,.025) 26px);
    box-shadow: 0 0 80px rgba(120,0,15,.3), inset 0 0 35px rgba(0,0,0,.9);
    animation: horror-file-in .55s ease both;
}
.horror-casefile__stamp { color: #c53c46; letter-spacing: .27em; font-weight: 800; font-size: .72rem; }
.horror-casefile__name { margin: 26px 0 20px; font: 800 clamp(1.5rem, 5vw, 2.6rem)/1.1 'Bebas Neue', Impact, sans-serif; letter-spacing: .08em; color: #eee2d8; }
.horror-casefile__body { color: rgba(239,227,219,.72); font-size: .88rem; line-height: 1.85; white-space: pre-line; }
.horror-casefile__close { margin-top: 30px; border: 1px solid rgba(255,255,255,.22); background: transparent; color: rgba(255,255,255,.65); padding: 10px 14px; font: 700 .7rem monospace; letter-spacing: .12em; cursor: pointer; }
.horror-casefile__close:hover { color:#fff; border-color:#b62e38; background:rgba(140,8,20,.15); }
@keyframes horror-file-in { from { opacity:0; transform:scale(.96) translateY(12px); } to { opacity:1; transform:none; } }

/* The Witness: a short playable encounter, not a passive popup. */
.horror-witness {
    position: fixed; inset: 0; z-index: 1000020; overflow: hidden;
    background: radial-gradient(ellipse at center, rgba(35,4,8,.18), #000 72%);
    display: grid; place-items: center; font-family: ui-monospace, Consolas, monospace;
}
.horror-witness::before {
    content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .46;
    background: repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0 1px, transparent 1px 4px);
}
.horror-witness__copy { position:absolute; top:11vh; width:min(620px,88vw); text-align:center; color:#d8c8c2; letter-spacing:.11em; font-size:clamp(.72rem,2vw,.95rem); line-height:1.8; z-index:2; }
.horror-witness__copy strong { display:block; color:#b82c36; font-size:clamp(1.05rem,3vw,1.55rem); letter-spacing:.28em; margin-bottom:14px; }
.horror-witness__count { position:absolute; bottom:8vh; z-index:2; color:rgba(255,255,255,.38); font-size:.7rem; letter-spacing:.24em; }
.horror-witness__escape { position:absolute; right:18px; bottom:16px; z-index:6; border:0; background:transparent; color:rgba(255,255,255,.2); font:10px monospace; letter-spacing:.12em; cursor:pointer; }
.horror-witness__escape:hover { color:rgba(255,255,255,.7); }
.horror-witness__eye {
    position:absolute; width:clamp(100px,18vw,165px); aspect-ratio:1; border:0; border-radius:50%; cursor:pointer; z-index:3;
    background:radial-gradient(ellipse at 48% 43%, #f4e7de 0 13%, #9f3338 14% 23%, #120509 24% 53%, #000 57%);
    box-shadow:0 0 0 1px rgba(167,43,50,.8), 0 0 38px rgba(160,0,16,.62), inset 0 0 28px #000;
    transition:left .22s cubic-bezier(.2,.8,.2,1), top .22s cubic-bezier(.2,.8,.2,1), transform .13s ease;
    animation:horror-witness-blink 4.2s steps(1) infinite;
}
.horror-witness__eye::after { content:""; position:absolute; inset:7% 37%; border-radius:50%; background:#020102; box-shadow:0 0 13px #ff2635; }
.horror-witness__eye:hover { transform:scale(1.08); }
.horror-witness__eye:active { transform:scale(.82); }
.horror-witness__end { position:absolute; inset:0; z-index:5; display:grid; place-items:center; background:#000; color:#e6d9d2; text-align:center; font-weight:800; letter-spacing:.3em; font-size:clamp(1rem,4vw,2.5rem); opacity:0; transition:opacity .5s; }
.horror-witness__end.show { opacity:1; }
#horror-witness-shadow { position:fixed; width:85px; height:150px; pointer-events:none; z-index:99988; opacity:0; transition:opacity .8s, left .6s ease, top .6s ease; filter:blur(12px); background:radial-gradient(ellipse at 50% 12%, rgba(179,37,47,.45) 0 7%, rgba(0,0,0,.76) 24%, transparent 70%); }
body.horror-witness-present #horror-witness-shadow { opacity:.42; }
@keyframes horror-witness-blink { 0%,89%,100%{clip-path:inset(0)} 91%,95%{clip-path:inset(47% 0)} }
.horror-arc-whisper {
    position: fixed; z-index: 999999; pointer-events: none; font: 700 11px monospace;
    color: rgba(230,203,199,.54); letter-spacing: .14em; text-transform: uppercase;
    text-shadow: 0 0 10px rgba(180,0,18,.9); animation: horror-whisper 2.8s ease forwards;
}
@keyframes horror-eye-breathe { 0%,100%{ transform:scale(1); } 50%{ transform:scale(1.025); } }
@keyframes horror-letter-flicker { 0%,92%,100%{opacity:.7} 93%{opacity:.1} 94%{opacity:.8} 95%{opacity:.25} }
@keyframes horror-whisper { 0%{opacity:0; transform:translateY(5px)} 15%,75%{opacity:1} 100%{opacity:0;transform:translateY(-9px)} }

/* Lore-led escalation: early unease never sacrifices readability. */
body.horror-arc-stage-1 .title { animation:horror-title-drift 16s ease-in-out infinite; }
body.horror-arc-stage-2::after { content:""; position:fixed; inset:0; z-index:99989; pointer-events:none; opacity:.12; background:repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 5px); }
body.horror-arc-stage-2 .sigma-counter { text-shadow:0 0 9px rgba(150,25,40,.22); }
body.horror-arc-stage-3 .click-button { animation-duration:2.8s !important; }
body.horror-arc-stage-4 { background:#050406 !important; }
@keyframes horror-title-drift { 0%,91%,100%{letter-spacing:normal} 94%{letter-spacing:.08em;transform:translateX(1px)} }

/* ── Collapsible "more stats" reveal (v2.0 — progressive disclosure) ── */
.stats-reveal-toggle{
    display:flex; align-items:center; justify-content:center; gap:6px;
    margin:4px 0 2px; padding:4px 12px;
    font-size:12px; color:rgba(255,255,255,.45);
    cursor:pointer; user-select:none;
    transition:color .2s ease;
}
.stats-reveal-toggle:hover{ color:rgba(255,255,255,.8); }
.stats-reveal-toggle #statsRevealArrow{
    display:inline-block; transition:transform .3s ease;
}
.stats-reveal-toggle.expanded #statsRevealArrow{ transform:rotate(180deg); }

.stats-detail-collapsed{
    max-height:0; overflow:hidden; opacity:0;
    transition:max-height .35s ease, opacity .3s ease;
}
.stats-detail-collapsed.expanded{
    max-height:400px; opacity:1;
}

/* ── Codex widget collapse/expand slide animation ── */
#loreQuest{
    transition: transform .35s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
    transform: translateX(0);
}
#loreQuest.lq-hiding{
    transform: translateX(-260px);
    opacity: 0;
    pointer-events: none;
}
#loreQuestTab{
    transition: transform .3s cubic-bezier(.34,1.56,.64,1), opacity .25s ease;
}
#loreQuestTab.lq-tab-hidden{
    transform: translateX(-40px);
    opacity: 0;
    pointer-events: none;
}


/* ── v2.0 "more alive" animations ── */

/* Idle breathing on the click button — subtle, stops on hover/active so it doesn't fight the squash feedback */
@keyframes clickBtnBreathe {
    0%,100% { transform: scale(1); }
    50%     { transform: scale(1.025); }
}
.click-core .click-button {
    animation: clickBtnBreathe 3.2s ease-in-out infinite;
}
.click-core .click-button:hover {
    animation-play-state: paused;
    transform: scale(1.04);
}
.click-core .click-button:active {
    animation-play-state: paused;
}

/* Sigma counter pop when the value updates */
@keyframes sigmaPop {
    0%   { transform: scale(1); }
    30%  { transform: scale(1.09); }
    100% { transform: scale(1); }
}
.sigma-counter.sigma-pop {
    animation: sigmaPop .28s cubic-bezier(.34,1.56,.64,1);
}

/* Shop card hover-lift */
.upg-card {
    transition: transform .18s ease, box-shadow .18s ease;
}
.upg-card:not(.cant):not(.mystery):hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(0,0,0,.35);
}
.upg-card:not(.cant):not(.mystery):active {
    transform: translateY(-1px) scale(.99);
}

/* Buy button micro-press */
.upg-card button {
    transition: transform .12s ease;
}
.upg-card button:active {
    transform: scale(.92);
}

/* ── v2.0 "everything gets a nice animation" — global modal open animation ── */
/* Covers every modal backdrop in the game (id ends in "Bg": settingsBg, hsBg,
   loreBg, adminBg, bossArenaBg, etc.) with one rule. CSS animations restart
   automatically whenever an element goes from display:none to visible, so
   this "just works" with the existing show/hide logic — no JS changes needed. */
@keyframes modalBgFadeIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
[id$="Bg"] {
    animation: modalBgFadeIn .22s ease;
}
/* Note: most modal cards already animate in via their own .modal/.hs-modal/etc
   class using @keyframes modalIn — left untouched, this only fades the backdrop. */

/* (toast already has its own slide-in + fade-out animation, left untouched) */

/* Generic button press feedback across the whole game, not just shop buttons */
button, .lang-btn, .tab-btn, .nav-btn {
    transition: transform .12s ease;
}
button:active, .lang-btn:active, .tab-btn:active, .nav-btn:active {
    transform: scale(.94);
}

/* Achievement / lore-unlock style badges pop in if they use .badge or .pill */
@keyframes badgePop {
    0%   { transform: scale(0); opacity: 0; }
    60%  { transform: scale(1.15); opacity: 1; }
    100% { transform: scale(1); }
}
.badge, .pill {
    animation: badgePop .3s cubic-bezier(.34,1.56,.64,1);
}