@font-face{font-family:'VagRounded';src:url('fonts/VagRounded.ttf') format('truetype');}
*{margin:0;padding:0;box-sizing:border-box;}
body{overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#0d2a4a 0%,#06111e 55%,#020508 100%);font-family:'VagRounded',sans-serif;touch-action:none;user-select:none;-webkit-user-select:none;}
@keyframes shake{0%{transform:translate(0,0) rotate(0)}15%{transform:translate(-8px,6px) rotate(-1.5deg)}30%{transform:translate(7px,-5px) rotate(1deg)}45%{transform:translate(-6px,4px) rotate(-1deg)}60%{transform:translate(5px,-3px) rotate(.8deg)}75%{transform:translate(-3px,2px) rotate(-.5deg)}100%{transform:translate(0,0) rotate(0)}}
body.shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97);}
#pocket-flash{position:fixed;inset:0;pointer-events:none;z-index:50;opacity:0;}
#pocket-flash.active{animation:flashOut .7s ease-out forwards;}
@keyframes flashOut{0%{opacity:.5}100%{opacity:0}}
#pocket-popup{position:fixed;top:45%;left:50%;transform:translate(-50%,-50%);font-size:clamp(32px,8vw,62px);font-weight:bold;text-shadow:0 0 30px currentColor,0 0 60px currentColor;pointer-events:none;display:none;z-index:55;animation:pocketPop 1.2s ease forwards;}
@keyframes pocketPop{0%{opacity:0;transform:translate(-50%,-50%) scale(.3)}25%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}55%{opacity:1;transform:translate(-50%,-60%) scale(1)}100%{opacity:0;transform:translate(-50%,-90%) scale(.8)}}
#score-pop{position:fixed;top:35%;left:50%;transform:translate(-50%,-50%);font-size:clamp(22px,5vw,40px);color:#FFD700;text-shadow:0 0 20px #FFD700;pointer-events:none;display:none;z-index:55;animation:floatUp 1.4s ease-out forwards;}
@keyframes floatUp{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-200%) scale(.7)}}
.overlay{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;overflow-y:auto;padding:clamp(8px,1.5vh,18px) 0;}
.hidden{display:none!important;}
.box{background:linear-gradient(145deg,#0e2912,#070f07);border:2.5px solid rgba(241,196,15,.4);border-radius:clamp(14px,2.8vw,26px);padding:clamp(14px,2.6vw,30px) clamp(14px,3.5vw,36px);max-width:clamp(280px,88vw,450px);width:92%;display:flex;flex-direction:column;align-items:center;gap:clamp(6px,1.2vh,11px);animation:scaleIn .28s cubic-bezier(.34,1.56,.64,1);}
@keyframes scaleIn{from{transform:scale(.75);opacity:0}to{transform:scale(1);opacity:1}}
.box h2{color:#f1c40f;font-size:clamp(16px,3.5vw,24px);text-align:center;}
.box p{color:rgba(255,255,255,.88);font-size:clamp(11px,1.7vw,14px);line-height:1.7;text-align:center;}
.box strong{color:#f1c40f;}
.btn{background:linear-gradient(135deg,#27ae60,#1a7a42);border:none;padding:clamp(9px,1.5vh,14px) 0;color:#fff;font-family:'VagRounded',sans-serif;font-size:clamp(13px,2.3vw,18px);cursor:pointer;border-radius:50px;width:clamp(200px,50vw,290px);display:block;box-shadow:0 5px 0 #145a30,0 8px 20px rgba(0,0,0,.5);transition:transform .1s,box-shadow .1s;letter-spacing:.5px;margin:2px 0;}
.btn:active{transform:translateY(4px);box-shadow:0 1px 0 #145a30;}
.btn.grey{background:linear-gradient(135deg,#4a4a4a,#252525);box-shadow:0 5px 0 #111;}
.btn.red{background:linear-gradient(135deg,#a00,#600);box-shadow:0 5px 0 #400;}
.btn.blue{background:linear-gradient(135deg,#1a5fa0,#0d3a66);box-shadow:0 5px 0 #082040;}
.btn.gold{background:linear-gradient(135deg,#c8930a,#8a6200);box-shadow:0 5px 0 #5a4000;}

/* SPLASH */
#splash{background:url('images/splash.jpg') center/cover no-repeat,radial-gradient(ellipse,#0d2e14,#030a04);cursor:pointer;}
#splash-loader{position:absolute;bottom:7vh;left:50%;transform:translateX(-50%);width:clamp(180px,48vw,280px);height:6px;background:rgba(255,255,255,.15);border-radius:6px;overflow:hidden;}
#splash-loader-fill{height:100%;width:0%;background:linear-gradient(90deg,#27ae60,#7eff7e);border-radius:6px;transition:width .08s linear;}
#splash-tap{position:absolute;bottom:12vh;font-size:clamp(20px,5vw,36px);color:#fff;letter-spacing:4px;text-shadow:0 0 28px rgba(100,255,160,.9);animation:blink 1.1s ease-in-out infinite;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.05}}

/* MENU */
#menu-screen{background:radial-gradient(ellipse at center,#0a2618,#030d05);}
#menu-logo{font-size:clamp(48px,10vw,88px);animation:bob 2s ease-in-out infinite;display:block;}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.title-wrap{display:flex;justify-content:center;}
.rlt{font-size:clamp(30px,7.5vw,68px);display:inline-block;line-height:.95;font-family:'VagRounded',sans-serif;text-shadow:0 4px 0 rgba(0,0,0,.5);animation:rainbow 3s linear infinite;}
.rlt:nth-child(1){color:#FF4444;animation-delay:0s}
.rlt:nth-child(2){color:#FF8C00;animation-delay:.13s}
.rlt:nth-child(3){color:#FFD700;animation-delay:.26s}
.rlt:nth-child(4){color:#7FFF00;animation-delay:.39s}
.rlt:nth-child(5){color:#00BFFF;animation-delay:.52s}
.rlt:nth-child(6){color:#8A2BE2;animation-delay:.65s}
.rlt:nth-child(7){color:#FF69B4;animation-delay:.78s}
.rlt:nth-child(8){color:#FF4444;animation-delay:.91s}
.rlt:nth-child(9){color:#FF8C00;animation-delay:1.04s}
.rlt2:nth-child(1){color:#00BFFF;animation-delay:.5s}
.rlt2:nth-child(2){color:#8A2BE2;animation-delay:.63s}
@keyframes rainbow{0%,100%{filter:brightness(1) drop-shadow(0 0 5px currentColor)}50%{filter:brightness(1.5) drop-shadow(0 0 18px currentColor)}}
.mapi-brand{color:#ff2222;font-size:clamp(10px,2.2vw,16px);letter-spacing:4px;text-shadow:0 0 12px rgba(255,34,34,.5);}
#menu-btns{display:flex;flex-direction:column;align-items:center;gap:clamp(4px,.7vh,7px);}

/* MODE SELECT */
#mode-screen{background:radial-gradient(ellipse at center,#0a1828,#030810);}
.mode-box{background:linear-gradient(145deg,#0e1c30,#060d18);border:2.5px solid rgba(100,180,255,.3);border-radius:clamp(16px,3vw,28px);padding:clamp(20px,3.5vh,36px) clamp(20px,4vw,40px);max-width:clamp(280px,88vw,440px);width:92%;display:flex;flex-direction:column;align-items:center;gap:clamp(8px,1.5vh,14px);animation:scaleIn .28s cubic-bezier(.34,1.56,.64,1);}
.mode-box h2{color:#00BFFF;font-size:clamp(18px,4vw,28px);text-align:center;text-shadow:0 0 20px rgba(0,191,255,.5);}
.mode-desc{color:rgba(255,255,255,.65);font-size:clamp(10px,1.6vw,13px);text-align:center;margin-top:-4px;}
.btn.mode-classic{background:linear-gradient(135deg,#27ae60,#1a7a42);font-size:clamp(14px,2.5vw,20px);width:clamp(210px,55vw,300px);}
.btn.mode-arcade{background:linear-gradient(135deg,#c8930a,#8a6200);box-shadow:0 5px 0 #5a4000;font-size:clamp(14px,2.5vw,20px);width:clamp(210px,55vw,300px);}

/* LEVEL SELECT */
#level-screen{background:radial-gradient(ellipse at center,#1a0a00,#060200);}
.level-box{background:linear-gradient(145deg,#1e1000,#0a0500);border:2.5px solid rgba(255,165,0,.35);border-radius:clamp(14px,2.8vw,26px);padding:clamp(12px,2.2vh,24px) clamp(12px,2.5vw,28px);max-width:clamp(300px,92vw,480px);width:95%;display:flex;flex-direction:column;align-items:center;gap:clamp(6px,1.2vh,12px);animation:scaleIn .28s cubic-bezier(.34,1.56,.64,1);}
.level-box h2{color:#FFA500;font-size:clamp(16px,3.5vw,24px);text-shadow:0 0 16px rgba(255,165,0,.5);}
#level-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(5px,.9vw,9px);width:100%;max-height:clamp(240px,50vh,360px);overflow-y:auto;padding:2px;}
.lv-btn{background:linear-gradient(145deg,#2a1800,#160c00);border:2px solid rgba(255,140,0,.35);border-radius:clamp(8px,1.4vw,12px);padding:clamp(6px,1vh,10px) 4px;display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;transition:transform .12s,border-color .15s;position:relative;}
.lv-btn:hover{transform:scale(1.06);border-color:rgba(255,165,0,.75);}
.lv-btn:active{transform:scale(.95);}
.lv-btn.locked{cursor:not-allowed;background:linear-gradient(145deg,#110800,#0a0500);border-color:rgba(255,255,255,.1);opacity:.55;}
.lv-btn.locked .lv-num{color:rgba(255,255,255,.25);}
.lv-btn.locked .lv-name{color:rgba(255,255,255,.2);}
.lv-lock{font-size:clamp(14px,2.5vw,20px);}
#custom-dialog{position:fixed;inset:0;display:none;align-items:center;justify-content:center;z-index:999;background:rgba(0,0,0,.78);backdrop-filter:blur(10px);}
#custom-dialog.active{display:flex;}
.dialog-box{background:linear-gradient(145deg,#0e1c0e,#060d06);border:2.5px solid rgba(241,196,15,.55);border-radius:clamp(14px,2.5vw,22px);padding:clamp(20px,3.5vh,34px) clamp(24px,4.5vw,42px);max-width:clamp(280px,82vw,400px);width:90%;display:flex;flex-direction:column;align-items:center;gap:clamp(10px,2vh,16px);box-shadow:0 0 60px rgba(0,0,0,.8),0 0 30px rgba(241,196,15,.2);animation:scaleIn .28s cubic-bezier(.34,1.56,.64,1);}
.dialog-icon{font-size:clamp(34px,6vw,54px);}
.dialog-title{color:#f1c40f;font-size:clamp(15px,3vw,21px);text-align:center;text-shadow:0 0 16px rgba(241,196,15,.4);}
.dialog-msg{color:rgba(255,255,255,.8);font-size:clamp(11px,1.8vw,14px);text-align:center;line-height:1.65;}
.dialog-btns{display:flex;gap:clamp(8px,1.6vw,14px);justify-content:center;width:100%;}
.dialog-btns .btn{width:clamp(110px,26vw,148px);margin:0;}
.lv-num{font-family:'VagRounded',sans-serif;font-size:clamp(13px,2.2vw,18px);color:#FFA500;font-weight:bold;}
.lv-name{font-family:'VagRounded',sans-serif;font-size:clamp(6px,.9vw,8px);color:rgba(255,255,255,.55);text-align:center;line-height:1.2;}
.lv-stars{font-size:clamp(8px,1.2vw,11px);}
.lv-count{font-size:clamp(7px,1vw,9px);color:rgba(255,200,100,.5);}

/* GAME HUD */
#game-hud{position:fixed;top:0;left:0;right:0;display:none;pointer-events:none;z-index:10;padding:clamp(5px,1vw,10px) clamp(7px,1.4vw,12px);flex-direction:row;justify-content:space-between;align-items:center;}
.hud-box{background:rgba(0,0,0,.65);backdrop-filter:blur(8px);border:1.5px solid rgba(241,196,15,.28);border-radius:clamp(8px,1.6vw,14px);padding:clamp(3px,.8vh,7px) clamp(8px,1.6vw,13px);display:flex;flex-direction:column;gap:2px;}
.hud-lbl{font-size:clamp(6px,.85vw,8px);color:rgba(255,255,255,.45);letter-spacing:2px;}
.hud-val{font-size:clamp(12px,2.2vw,18px);color:#f1c40f;}
.hud-sub{font-size:clamp(8px,1.1vw,10px);color:rgba(255,200,0,.55);}
#ball-tracker{display:none;flex-direction:row;gap:clamp(3px,.6vw,6px);align-items:center;pointer-events:none;background:rgba(0,0,0,.55);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.12);border-radius:clamp(10px,1.6vw,15px);padding:clamp(3px,.7vh,6px) clamp(7px,1.4vw,12px);}
.bt-ball{width:clamp(13px,2.2vw,19px);height:clamp(13px,2.2vw,19px);border-radius:50%;border:1.5px solid rgba(255,255,255,.3);display:flex;align-items:center;justify-content:center;font-size:clamp(5px,.85vw,8px);font-weight:bold;color:#fff;transition:opacity .3s,transform .3s;flex-shrink:0;}
.bt-ball.pocketed{opacity:.18;transform:scale(.65);filter:grayscale(.8);}
.bt-sep{color:rgba(255,255,255,.2);font-size:clamp(9px,1.5vw,13px);}

/* ARCADE HUD */
#arcade-hud{position:fixed;top:0;left:0;right:0;display:none;pointer-events:none;z-index:10;padding:clamp(5px,1vw,10px) clamp(7px,1.4vw,12px);flex-direction:row;justify-content:space-between;align-items:center;}
.arc-box{background:rgba(0,0,0,.7);backdrop-filter:blur(8px);border:1.5px solid rgba(255,140,0,.35);border-radius:clamp(8px,1.6vw,14px);padding:clamp(3px,.8vh,7px) clamp(8px,1.6vw,13px);display:flex;flex-direction:column;align-items:center;gap:2px;}
.arc-lbl{font-size:clamp(6px,.85vw,8px);color:rgba(255,255,255,.45);letter-spacing:2px;}
.arc-val{font-size:clamp(12px,2.2vw,18px);color:#FFA500;}
#shots-left{font-size:clamp(18px,3.5vw,28px);color:#00FF88;font-weight:bold;text-shadow:0 0 14px #00FF88;transition:color .2s,text-shadow .2s;line-height:1;}
#shots-left.low{color:#FF4444;text-shadow:0 0 14px #FF4444;animation:pulse .5s ease-in-out infinite;}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.2)}}
.shots-label{font-size:clamp(7px,1vw,9px);color:rgba(255,255,255,.45);letter-spacing:2px;}
#arc-balls-left{font-size:clamp(10px,1.6vw,14px);color:#FFA500;}

/* POWER METER */
#power-meter{position:fixed;bottom:clamp(18px,3.5vh,34px);left:50%;transform:translateX(-50%);width:clamp(160px,36vw,250px);height:clamp(12px,1.8vh,18px);border:2px solid rgba(255,255,255,.55);border-radius:12px;display:none;background:rgba(0,0,0,.6);overflow:hidden;z-index:10;}
#power-fill{width:0%;height:100%;background:linear-gradient(90deg,#00ff00,#ffff00,#ff0000);transition:width .04s;}

/* MESSAGES */
#turn-msg{position:fixed;bottom:clamp(55px,9vh,85px);left:50%;transform:translateX(-50%);background:rgba(0,20,8,.85);color:#7eff7e;font-size:clamp(10px,1.7vw,13px);padding:clamp(4px,.8vh,7px) clamp(10px,2.2vw,18px);border-radius:18px;border:1px solid rgba(100,255,100,.2);pointer-events:none;display:none;z-index:10;white-space:nowrap;}
#foul-msg{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(160,0,0,.95);color:#fff;font-size:clamp(15px,3.2vw,24px);padding:clamp(10px,2vh,16px) clamp(20px,4vw,36px);border-radius:16px;border:3px solid #ff4444;box-shadow:0 0 40px rgba(255,0,0,.6);pointer-events:none;display:none;z-index:60;text-align:center;line-height:1.4;}
@keyframes foulIn{0%{transform:translate(-50%,-50%) scale(.5) rotate(-8deg);opacity:0}60%{transform:translate(-50%,-50%) scale(1.1) rotate(2deg);opacity:1}100%{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}}
#order-bonus{position:fixed;top:38%;left:50%;transform:translate(-50%,-50%);color:#FFD700;font-size:clamp(17px,3.8vw,30px);text-shadow:0 0 20px #FFD700;pointer-events:none;display:none;z-index:55;animation:floatUp 1.4s ease-out forwards;}

/* PAUSE */
#pause-screen{background:rgba(0,0,0,.82);backdrop-filter:blur(16px);}
#btn-pause-float{position:fixed;bottom:clamp(18px,3.5vh,34px);right:clamp(14px,2.8vw,22px);z-index:30;display:none;background:rgba(0,0,0,.55);border:1.5px solid rgba(255,255,255,.2);border-radius:50%;width:clamp(40px,6.5vw,52px);height:clamp(40px,6.5vw,52px);font-size:clamp(15px,2.6vw,21px);color:#fff;cursor:pointer;align-items:center;justify-content:center;backdrop-filter:blur(6px);transition:background .15s;touch-action:none;-webkit-tap-highlight-color:transparent;pointer-events:all;}
#btn-pause-float:hover{background:rgba(0,0,0,.8);}
.pause-box{background:linear-gradient(145deg,#112411,#090f09);border:2px solid rgba(100,255,100,.22);border-radius:clamp(15px,2.8vw,26px);padding:clamp(20px,3.5vh,36px) clamp(22px,4.5vw,44px);display:flex;flex-direction:column;align-items:center;gap:clamp(8px,1.6vh,14px);animation:scaleIn .3s cubic-bezier(.34,1.56,.64,1);}
.pause-box h2{color:#7eff7e;font-size:clamp(20px,4.5vw,36px);letter-spacing:2px;}
.pause-box .btn{width:clamp(185px,46vw,260px);}

/* WIN (classic) */
#win-screen{background:radial-gradient(ellipse at center,#0e3a14,#030d04);}
#win-trophy{font-size:clamp(55px,11vw,100px);animation:spinT 3s ease-in-out infinite;filter:drop-shadow(0 0 28px rgba(255,215,0,.9));z-index:1;}
@keyframes spinT{0%,100%{transform:scale(1) rotate(-5deg)}50%{transform:scale(1.12) rotate(5deg)}}
#win-title{font-size:clamp(24px,6vw,52px);color:#f1c40f;text-shadow:0 0 36px rgba(241,196,15,.7);text-align:center;z-index:1;}
#win-sub{font-size:clamp(12px,2.2vw,18px);color:#7eff7e;z-index:1;}
#win-score-big{font-size:clamp(18px,3.5vw,28px);color:#FFD700;text-shadow:0 0 18px rgba(255,215,0,.6);z-index:1;}
#win-shots{font-size:clamp(10px,1.6vw,13px);color:rgba(255,255,255,.7);background:rgba(0,0,0,.35);border-radius:10px;padding:5px 16px;z-index:1;}
#win-btns{display:flex;flex-direction:column;align-items:center;gap:6px;z-index:1;margin-bottom:20px;}
#win-btns .btn{width:clamp(195px,48vw,275px);}
#win-screen::before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(2px 2px at 10% 20%,#FFD700,transparent),radial-gradient(2px 2px at 30% 60%,#FF4444,transparent),radial-gradient(2px 2px at 55% 15%,#44FF88,transparent),radial-gradient(2px 2px at 72% 42%,#4488FF,transparent),radial-gradient(2px 2px at 88% 78%,#FF88FF,transparent);background-size:200px 200px;animation:fall 4s linear infinite;opacity:.6;z-index:0;}
@keyframes fall{from{background-position:0 -200px}to{background-position:0 200px}}

/* ARCADE RESULT */
#result-screen{background:radial-gradient(ellipse at center,#1a1000,#060300);}
#result-screen::before{content:'';position:fixed;inset:0;pointer-events:none;background:radial-gradient(2px 2px at 20% 30%,#FFA500,transparent),radial-gradient(2px 2px at 60% 70%,#FFD700,transparent),radial-gradient(2px 2px at 80% 20%,#FF8C00,transparent);background-size:180px 180px;animation:fall 5s linear infinite;opacity:.5;z-index:0;}
.result-box{background:linear-gradient(145deg,#1e1000,#0a0500);border:2.5px solid rgba(255,165,0,.5);border-radius:clamp(16px,3vw,28px);padding:clamp(16px,3vh,32px) clamp(18px,3.5vw,38px);max-width:clamp(280px,88vw,420px);width:92%;display:flex;flex-direction:column;align-items:center;gap:clamp(7px,1.3vh,12px);animation:scaleIn .32s cubic-bezier(.34,1.56,.64,1);z-index:1;margin:20px 0;}
#result-icon{font-size:clamp(50px,10vw,88px);animation:spinT 3s ease-in-out infinite;}
#result-title{font-size:clamp(22px,5.5vw,44px);color:#FFD700;text-shadow:0 0 30px rgba(255,215,0,.7);text-align:center;}
#result-stars{font-size:clamp(26px,5.5vw,44px);letter-spacing:4px;filter:drop-shadow(0 0 12px #FFD700);}
#result-info{font-size:clamp(11px,1.8vw,15px);color:rgba(255,255,255,.75);text-align:center;background:rgba(0,0,0,.35);border-radius:10px;padding:6px 16px;}
.result-box .btn{width:clamp(195px,50vw,280px);}

/* FAIL */
#fail-screen{background:radial-gradient(ellipse at center,#1a0000,#060000);}
.fail-box{background:linear-gradient(145deg,#1e0000,#0a0000);border:2.5px solid rgba(255,50,50,.5);border-radius:clamp(16px,3vw,28px);padding:clamp(16px,3vh,32px) clamp(18px,3.5vw,38px);max-width:clamp(280px,88vw,420px);width:92%;display:flex;flex-direction:column;align-items:center;gap:clamp(7px,1.3vh,12px);animation:scaleIn .32s cubic-bezier(.34,1.56,.64,1);margin:20px 0;}
#fail-icon{font-size:clamp(50px,10vw,86px);animation:bob 1.5s ease-in-out infinite;}
#fail-title{font-size:clamp(22px,5.5vw,44px);color:#FF4444;text-shadow:0 0 30px rgba(255,50,50,.7);text-align:center;}
#fail-sub{font-size:clamp(12px,2vw,16px);color:rgba(255,200,200,.8);text-align:center;}
.fail-box .btn{width:clamp(195px,50vw,280px);}

/* LB TABS */
.lb-tabs{display:flex;width:100%;gap:6px;margin-bottom:4px;}
.lb-tab{flex:1;padding:clamp(7px,1.2vh,11px) 0;border:none;border-radius:50px;font-family:'VagRounded',sans-serif;font-size:clamp(11px,1.8vw,14px);cursor:pointer;transition:all .18s;}
.lb-tab.active-classic{background:linear-gradient(135deg,#27ae60,#1a7a42);color:#fff;box-shadow:0 3px 0 #145a30;}
.lb-tab.active-time{background:linear-gradient(135deg,#0d6eaa,#094d7a);color:#fff;box-shadow:0 3px 0 #063450;}
.lb-tab.inactive{background:rgba(255,255,255,.07);color:rgba(255,255,255,.45);border:1.5px solid rgba(255,255,255,.1);}
/* MODE-TIME BUTTON */
.btn.mode-time{background:linear-gradient(135deg,#0d6eaa,#094d7a);box-shadow:0 5px 0 #063450;font-size:clamp(14px,2.5vw,20px);width:clamp(210px,55vw,300px);}
/* TIME ATTACK HUD */
#ta-hud{position:fixed;top:0;left:0;right:0;display:none;pointer-events:none;z-index:10;padding:clamp(5px,1vw,10px) clamp(7px,1.4vw,12px);flex-direction:row;justify-content:space-between;align-items:center;}
.ta-box{background:rgba(0,0,0,.7);backdrop-filter:blur(8px);border:1.5px solid rgba(0,191,255,.3);border-radius:clamp(8px,1.6vw,14px);padding:clamp(3px,.8vh,7px) clamp(8px,1.6vw,13px);display:flex;flex-direction:column;align-items:center;gap:2px;}
.ta-lbl{font-size:clamp(6px,.85vw,8px);color:rgba(255,255,255,.45);letter-spacing:2px;}
.ta-val{font-size:clamp(12px,2.2vw,18px);color:#00BFFF;}
#ta-timer{font-size:clamp(18px,3.5vw,28px);color:#00FF88;font-weight:bold;text-shadow:0 0 14px #00FF88;transition:color .3s;line-height:1;}
#ta-timer.low{color:#FF4444;text-shadow:0 0 14px #FF4444;animation:pulse .5s ease-in-out infinite;}
/* TA WIN SCREEN */
#ta-win-screen{background:radial-gradient(ellipse at center,#051e30,#020810);overflow:hidden;}
#ta-win-screen::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(2px 2px at 15% 25%,#00BFFF,transparent),radial-gradient(2px 2px at 45% 65%,#FFD700,transparent),radial-gradient(2px 2px at 75% 20%,#00FF88,transparent);background-size:200px 200px;animation:fall 4s linear infinite;opacity:.6;}
.ta-result-box{background:linear-gradient(145deg,#051e30,#020c1a);border:2.5px solid rgba(0,191,255,.5);border-radius:clamp(16px,3vw,28px);padding:clamp(16px,3vh,30px) clamp(18px,3.5vw,38px);max-width:clamp(280px,88vw,420px);width:92%;display:flex;flex-direction:column;align-items:center;gap:clamp(7px,1.3vh,12px);animation:scaleIn .32s cubic-bezier(.34,1.56,.64,1);z-index:1;}
#ta-trophy{font-size:clamp(50px,10vw,88px);animation:spinT 3s ease-in-out infinite;filter:drop-shadow(0 0 28px rgba(0,191,255,.9));}
#ta-win-title{font-size:clamp(22px,5.5vw,44px);color:#00BFFF;text-shadow:0 0 30px rgba(0,191,255,.7);text-align:center;}
#ta-score-big{font-size:clamp(18px,3.5vw,28px);color:#FFD700;text-shadow:0 0 18px rgba(255,215,0,.6);}
#ta-info{font-size:clamp(11px,1.8vw,14px);color:rgba(255,255,255,.7);background:rgba(0,0,0,.35);border-radius:10px;padding:5px 16px;text-align:center;}
.ta-result-box .btn{width:clamp(195px,50vw,275px);}
/* LEADERBOARD & ACHIEVEMENTS */
#lb-screen{background:rgba(0,0,0,.90);backdrop-filter:blur(14px);}
#lb-list{width:100%;display:flex;flex-direction:column;gap:5px;max-height:clamp(180px,36vh,300px);overflow-y:auto;}
.lb-row{display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.06);border-radius:9px;padding:clamp(5px,.9vh,8px) clamp(8px,1.6vw,12px);font-size:clamp(10px,1.6vw,13px);color:#fff;}
.lb-row.gold{background:rgba(241,196,15,.18);color:#f1c40f;}
.lb-row.silver{background:rgba(180,180,180,.14);color:#ccc;}
.lb-row.bronze{background:rgba(180,100,20,.18);color:#cd7f32;}
.lb-empty{color:rgba(255,255,255,.4);font-size:clamp(10px,1.6vw,13px);padding:10px 0;text-align:center;}
#ach-screen{background:rgba(0,5,20,.93);backdrop-filter:blur(14px);}
.ach-box{max-width:clamp(290px,90vw,470px);width:95%;}
#ach-list{width:100%;display:flex;flex-direction:column;gap:clamp(4px,.7vh,7px);max-height:clamp(200px,44vh,360px);overflow-y:auto;}
.ach-row{display:flex;align-items:center;gap:clamp(6px,1.2vw,11px);background:rgba(255,255,255,.05);border-radius:clamp(7px,1.2vw,11px);padding:clamp(5px,1vh,9px) clamp(8px,1.6vw,14px);border:1.5px solid rgba(255,255,255,.08);transition:border-color .3s;}
.ach-row.unlocked{border-color:rgba(241,196,15,.45);background:rgba(241,196,15,.07);}
.ach-icon{font-size:clamp(16px,2.8vw,24px);min-width:clamp(24px,3.5vw,32px);text-align:center;}
.ach-info{flex:1;}
.ach-name{font-size:clamp(11px,1.7vw,14px);color:#fff;margin-bottom:2px;}
.ach-desc{font-size:clamp(8px,1.2vw,11px);color:rgba(255,255,255,.5);}
.ach-row.locked .ach-icon{filter:grayscale(1);opacity:.35;}
.ach-row.locked .ach-name{color:rgba(255,255,255,.35);}
.ach-check{font-size:clamp(12px,1.8vw,17px);}
#ach-prog{color:rgba(255,255,255,.5);font-size:clamp(9px,1.4vw,12px);}