*{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #0a0e27;--bg-secondary: #1a1f3a;--lane-wood: #8b6f47;--lane-wood-light: #a68a5f;--accent-red: #e63946;--accent-blue: #1d3557;--accent-gold: #f4a261;--text-primary: #ffffff;--text-secondary: #b8c1d9;--success: #06d6a0;--warning: #ffd166;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .1);--shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .25);--shadow-xl: 0 12px 40px rgba(0, 0, 0, .35)}html,body{overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:#2a3142;color:var(--text-primary)}.webgl{position:fixed;top:0;left:0;outline:none}.ui-card{background:#1a1f3af2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:16px;box-shadow:var(--shadow-xl)}.ui-text-title{font-family:Impact,Arial Black,sans-serif;letter-spacing:1px;text-transform:uppercase}.ui-text-body{font-weight:500;line-height:1.5}@media (max-width: 768px){body{font-size:12px}}#strike-banner{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);z-index:10000;pointer-events:none;opacity:0}.strike-card{background:linear-gradient(135deg,#f4a261,#e76f51);padding:40px 80px;border-radius:20px;box-shadow:0 0 60px #e76f5199,0 20px 40px #0006;border:3px solid rgba(255,255,255,.3)}.strike-text{font-family:Impact,Arial Black,sans-serif;font-size:80px;font-weight:900;color:#fff;text-shadow:0 4px 8px rgba(0,0,0,.3),0 0 20px rgba(255,255,255,.5);letter-spacing:8px;text-align:center;margin:0}.strike-quality{font-family:Arial,sans-serif;font-size:24px;font-weight:600;color:#ffffffe6;text-align:center;margin-top:10px;letter-spacing:2px;text-transform:uppercase}@keyframes strikeAppear{0%{transform:translate(-50%,-50%) scale(0) rotate(-10deg);opacity:0}50%{transform:translate(-50%,-50%) scale(1.1) rotate(2deg);opacity:1}70%{transform:translate(-50%,-50%) scale(.95) rotate(-1deg)}to{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}}@keyframes strikeFadeOut{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.2);opacity:0}}@keyframes screenShake{0%,to{transform:translate(0)}10%{transform:translate(-2px,-2px)}20%{transform:translate(2px,2px)}30%{transform:translate(-2px,2px)}40%{transform:translate(2px,-2px)}50%{transform:translate(-2px,-2px)}60%{transform:translate(2px,2px)}70%{transform:translate(-2px,2px)}80%{transform:translate(2px,-2px)}90%{transform:translate(-1px,1px)}}.strike-shake{animation:screenShake .5s ease-in-out}@media (max-width: 768px){.strike-card{padding:30px 50px}.strike-text{font-size:60px;letter-spacing:6px}.strike-quality{font-size:18px}}#spare-banner{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);z-index:10000;pointer-events:none;opacity:0}.spare-card{background:linear-gradient(135deg,#06d6a0,#1b9aaa);padding:35px 70px;border-radius:18px;box-shadow:0 0 50px #06d6a080,0 15px 35px #0006;border:3px solid rgba(255,255,255,.3)}.spare-text{font-family:Impact,Arial Black,sans-serif;font-size:70px;font-weight:900;color:#fff;text-shadow:0 4px 8px rgba(0,0,0,.3),0 0 20px rgba(255,255,255,.4);letter-spacing:7px;text-align:center;margin:0}.spare-quality{font-family:Arial,sans-serif;font-size:22px;font-weight:600;color:#ffffffe6;text-align:center;margin-top:8px;letter-spacing:2px;text-transform:uppercase}@keyframes spareAppear{0%{transform:translate(-50%,-50%) scale(0) rotate(-8deg);opacity:0}50%{transform:translate(-50%,-50%) scale(1.08) rotate(1.5deg);opacity:1}70%{transform:translate(-50%,-50%) scale(.96) rotate(-.8deg)}to{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}}@keyframes spareFadeOut{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.15);opacity:0}}@media (max-width: 768px){.spare-card{padding:25px 45px}.spare-text{font-size:55px;letter-spacing:5px}.spare-quality{font-size:16px}}#streak-banner{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);z-index:10001;pointer-events:none;opacity:0}.streak-card{background:linear-gradient(135deg,#a855f7,#ec4899);padding:40px 80px;border-radius:20px;box-shadow:0 0 60px #a855f799,0 20px 40px #0006;border:3px solid rgba(255,255,255,.3)}.streak-text{font-family:Impact,Arial Black,sans-serif;font-size:75px;font-weight:900;color:#fff;text-shadow:0 4px 8px rgba(0,0,0,.3),0 0 25px rgba(255,255,255,.6);letter-spacing:8px;text-align:center;margin:0}.streak-count{font-family:Arial,sans-serif;font-size:26px;font-weight:700;color:#fffffff2;text-align:center;margin-top:10px;letter-spacing:3px;text-transform:uppercase}@keyframes streakAppear{0%{transform:translate(-50%,-50%) scale(0) rotate(-12deg);opacity:0}50%{transform:translate(-50%,-50%) scale(1.15) rotate(3deg);opacity:1}70%{transform:translate(-50%,-50%) scale(.93) rotate(-1.5deg)}to{transform:translate(-50%,-50%) scale(1) rotate(0);opacity:1}}@keyframes streakFadeOut{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.25);opacity:0}}@media (max-width: 768px){.streak-card{padding:30px 55px}.streak-text{font-size:58px;letter-spacing:6px}.streak-count{font-size:19px}}.shot-grade-container{position:fixed;bottom:160px;left:20px;z-index:10002;opacity:0;pointer-events:none;transform:translateY(-10px);transition:opacity .4s ease-out,transform .4s ease-out}.shot-grade-badge{background:#1a1f3af2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:16px 24px;box-shadow:0 8px 24px #0000004d;border:2px solid rgba(255,255,255,.2);text-align:center;min-width:100px}.grade-letter{font-family:Impact,Arial Black,sans-serif;font-size:56px;font-weight:900;line-height:1;margin-bottom:4px;text-shadow:0 2px 8px rgba(0,0,0,.4);transition:color .3s ease}.grade-label{font-family:Arial,sans-serif;font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#ffffffb3;margin-top:2px}.shot-grade-container.grade-a-plus .grade-letter{color:gold;text-shadow:0 0 20px rgba(255,215,0,.6),0 2px 8px rgba(0,0,0,.4)}.shot-grade-container.grade-a-plus .shot-grade-badge{border-color:#ffd70066;box-shadow:0 0 30px #ffd7004d,0 8px 24px #0000004d}.shot-grade-container.grade-a .grade-letter{color:#10b981;text-shadow:0 0 15px rgba(16,185,129,.5),0 2px 8px rgba(0,0,0,.4)}.shot-grade-container.grade-a .shot-grade-badge{border-color:#10b9814d}.shot-grade-container.grade-b .grade-letter{color:#3b82f6}.shot-grade-container.grade-b .shot-grade-badge{border-color:#3b82f64d}.shot-grade-container.grade-c .grade-letter{color:#fbbf24}.shot-grade-container.grade-c .shot-grade-badge{border-color:#fbbf244d}.shot-grade-container.grade-d .grade-letter{color:#f97316}.shot-grade-container.grade-d .shot-grade-badge{border-color:#f973164d}.shot-grade-container.grade-f .grade-letter{color:#ef4444}.shot-grade-container.grade-f .shot-grade-badge{border-color:#ef44444d}.shot-grade-container.visible{opacity:1;transform:translateY(0)}@media (max-width: 768px){.shot-grade-container{top:auto;bottom:110px;left:5px;right:auto}.shot-grade-badge{padding:10px 16px;min-width:75px}.grade-letter{font-size:38px}.grade-label{font-size:8px}}