*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%}body{background:#07030f;color:var(--c-text, #f5f0ff);font-family:-apple-system,Segoe UI,Sarabun,Thonburi,sans-serif;overscroll-behavior:none;user-select:none;-webkit-user-select:none}.app{max-width:480px;height:100dvh;margin:0 auto;position:relative;overflow:hidden;background:radial-gradient(120% 55% at 50% -10%,color-mix(in srgb,var(--c-accent, #ff2e88) 18%,transparent),transparent 60%),radial-gradient(90% 45% at 85% 110%,color-mix(in srgb,var(--c-secondary, #29e6ff) 10%,transparent),transparent 60%),linear-gradient(180deg,var(--c-bg, #12081f),var(--c-bg2, #1e0f38))}.screen{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px 20px;text-align:center;position:relative}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}.menu-lights{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.menu-lights i{position:absolute;bottom:-30px;width:7px;height:9px;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 50% 35%,#ffe9b0,#f5c542 65%,#f5c54200);filter:blur(.4px);opacity:0;animation:lantern-float 9s linear infinite}.menu-lights i:nth-child(1){left:12%;animation-delay:0s}.menu-lights i:nth-child(2){left:30%;animation-delay:2.5s;width:5px;height:7px}.menu-lights i:nth-child(3){left:52%;animation-delay:5s}.menu-lights i:nth-child(4){left:68%;animation-delay:1.2s;width:5px;height:7px}.menu-lights i:nth-child(5){left:82%;animation-delay:3.8s}.menu-lights i:nth-child(6){left:44%;animation-delay:7s;width:4px;height:6px}@keyframes lantern-float{0%{transform:translateY(0) translate(0);opacity:0}12%{opacity:.9}85%{opacity:.7}to{transform:translateY(-105dvh) translate(14px);opacity:0}}.menu-emblem{width:148px;height:148px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;background:radial-gradient(circle at 50% 38%,#f5c54238,#12081f99 70%);animation:float 3.2s ease-in-out infinite}.menu-emblem:before{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;background:conic-gradient(from 0deg,var(--c-primary, #f5c542),transparent 25%,var(--c-accent, #ff2e88) 50%,transparent 75%,var(--c-primary, #f5c542));animation:ring-spin 6s linear infinite;-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px))}.menu-emblem:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;box-shadow:0 0 44px #f5c54259,inset 0 0 30px #ff2e881f}.menu-emblem span{font-size:72px;filter:drop-shadow(0 0 18px rgba(245,197,66,.8))}@keyframes ring-spin{to{transform:rotate(360deg)}}@keyframes float{50%{transform:translateY(-10px)}}.menu-title{font-size:32px;font-weight:800;letter-spacing:3px;background:linear-gradient(160deg,#ffe9b0 10%,var(--c-primary, #f5c542) 45%,#d98f1f 90%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 16px rgba(245,197,66,.35))}.menu-tagline{color:var(--c-text-dim, #a89cc8);font-size:13px;letter-spacing:1px;margin-bottom:10px}.menu-stats{display:flex;gap:10px;width:100%;margin:8px 0 14px}.stat{flex:1;background:#ffffff0d;border:1px solid rgba(245,197,66,.22);border-radius:18px;padding:13px 6px;display:flex;flex-direction:column;gap:4px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:inset 0 1px #ffffff14,0 6px 18px #00000059}.stat-value{font-size:18px;font-weight:800;color:var(--c-primary, #f5c542);text-shadow:0 0 12px rgba(245,197,66,.4)}.stat-label{font-size:11px;color:var(--c-text-dim, #a89cc8)}.menu-hint{font-size:12px;color:var(--c-text-dim, #a89cc8);margin-top:14px}.btn{width:100%;max-width:300px;padding:15px;border-radius:18px;font-size:17px;font-weight:800;letter-spacing:.5px;cursor:pointer;transition:transform .12s ease,box-shadow .12s ease}.btn:active{transform:scale(.95)}.btn-primary{background:linear-gradient(135deg,#ffe9b0,var(--c-primary, #f5c542) 45%,#d98f1f);color:#2a1503;border:1px solid rgba(255,233,176,.7);box-shadow:0 0 26px #f5c54273,inset 0 1px #ffffff80}.btn-primary:active{box-shadow:0 0 12px #f5c5424d}.btn-ghost{background:#ffffff0a;color:var(--c-text, #f5f0ff);border:1px solid rgba(169,156,200,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.screen.game{padding:0;gap:0}.game-canvas{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;touch-action:none}.hud{position:absolute;top:max(12px,env(safe-area-inset-top));left:12px;right:12px;display:flex;align-items:center;gap:10px;z-index:5}.hud-spacer{flex:1}.hud-item{background:#0a05168c;border:1px solid rgba(245,197,66,.3);border-radius:999px;padding:8px 16px;display:flex;align-items:baseline;gap:8px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 4px 14px #00000059}.hud-label{font-size:10px;color:var(--c-text-dim, #a89cc8);text-transform:uppercase;letter-spacing:1px}.hud-value{font-size:18px;font-weight:800;color:var(--c-primary, #f5c542);text-shadow:0 0 10px rgba(245,197,66,.5);font-variant-numeric:tabular-nums}.hud-coin{color:var(--c-primary, #f5c542);margin-right:3px}.hud-pause{width:40px;height:40px;border-radius:50%;border:1px solid rgba(169,156,200,.4);background:#0a05168c;color:var(--c-text, #f5f0ff);font-size:15px;cursor:pointer;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#07030fb8;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.countdown{font-size:120px;font-weight:900;background:linear-gradient(160deg,#ffe9b0 15%,var(--c-primary, #f5c542) 55%,#d98f1f);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 34px rgba(245,197,66,.55));animation:pop .8s ease infinite}@keyframes pop{0%{transform:scale(1.4);opacity:0}25%{transform:scale(1);opacity:1}}.overlay-box{display:flex;flex-direction:column;gap:12px;align-items:center;width:100%;padding:0 32px}.overlay-box h3{font-size:22px;letter-spacing:2px;color:var(--c-primary, #f5c542)}.screen.over{justify-content:center}.over-card{width:100%;max-width:360px;display:flex;flex-direction:column;align-items:center;gap:14px;padding:28px 22px;border-radius:22px;background:#ffffff0d;border:1px solid rgba(245,197,66,.25);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:inset 0 1px #ffffff14,0 18px 50px #00000080}.over-score{font-size:66px;font-weight:900;line-height:1;background:linear-gradient(160deg,#ffe9b0 15%,var(--c-primary, #f5c542) 55%,#d98f1f);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 22px rgba(245,197,66,.45));font-variant-numeric:tabular-nums}.over-label{color:var(--c-text-dim, #a89cc8);text-transform:uppercase;font-size:12px;letter-spacing:2px}.new-best{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--c-primary, #f5c542),var(--c-accent, #ff2e88));color:#2a1503;font-weight:800;padding:8px 20px;border-radius:999px;box-shadow:0 0 22px #f5c54280;animation:pop .6s ease}.new-best:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);transform:translate(-120%);animation:shimmer 2.2s ease-in-out infinite}@keyframes shimmer{55%,to{transform:translate(120%)}}.screen-title{font-size:24px;font-weight:800;letter-spacing:1px;background:linear-gradient(160deg,#ffe9b0 15%,var(--c-primary, #f5c542) 55%,#d98f1f);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(245,197,66,.35))}.board-list{list-style:none;width:100%;max-height:60dvh;overflow-y:auto;display:flex;flex-direction:column;gap:8px}.board-row{display:flex;align-items:center;gap:12px;background:#ffffff0a;border:1px solid rgba(169,156,200,.18);border-radius:14px;padding:11px 15px;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.board-row:nth-child(1){border-color:#f5c542a6;box-shadow:0 0 18px #f5c54240}.board-row:nth-child(2){border-color:#c8cddc80}.board-row:nth-child(3){border-color:#cd7f328c}.board-rank{font-weight:800;width:26px;color:var(--c-accent, #ff2e88)}.board-row:nth-child(1) .board-rank{color:#f5c542;text-shadow:0 0 10px rgba(245,197,66,.6)}.board-row:nth-child(2) .board-rank{color:#c8cddc}.board-row:nth-child(3) .board-rank{color:#cd7f32}.board-name{flex:1;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-username{color:var(--c-text-dim, #a89cc8);font-size:12px}.board-score{font-weight:800;color:var(--c-primary, #f5c542);font-variant-numeric:tabular-nums}.board-empty{color:var(--c-text-dim, #a89cc8)}.quiz-emblem:before{background:conic-gradient(from 0deg,var(--c-primary, #f5c542),transparent 25%,var(--c-accent, #22c55e) 50%,transparent 75%,var(--c-primary, #f5c542))}.quiz-stats{display:grid;grid-template-columns:1fr 1fr}.quiz-cats{width:100%;max-width:340px}.quiz-cats-label{display:block;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--c-text-dim, #8fa3bf);margin-bottom:8px}.quiz-cats-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.chip{font-size:13px;font-weight:600;padding:7px 14px;border-radius:999px;color:var(--c-text, #f0f6ff);background:#ffffff0d;border:1px solid rgba(143,163,191,.35);cursor:pointer;transition:transform .1s ease}.chip:active{transform:scale(.95)}.chip-active{background:linear-gradient(135deg,var(--c-accent, #22c55e),#15803d);border-color:#fff6;box-shadow:0 0 16px color-mix(in srgb,var(--c-accent, #22c55e) 45%,transparent)}.quiz-error{color:#ff7a7a;font-size:13px}.quiz-game{justify-content:flex-start;padding-top:max(20px,env(safe-area-inset-top));gap:16px}.q-topbar{width:100%;display:flex;justify-content:space-between;align-items:center}.q-progress{font-size:13px;font-weight:700;letter-spacing:1px;color:var(--c-text-dim, #8fa3bf);text-transform:uppercase}.q-score{position:relative;font-size:20px;font-weight:800;color:var(--c-primary, #f5c542);text-shadow:0 0 12px rgba(245,197,66,.4);font-variant-numeric:tabular-nums}.q-pop{position:absolute;right:0;top:-6px;font-size:16px;font-weight:900;color:var(--c-accent, #22c55e);animation:pop-rise 1s ease-out forwards;pointer-events:none}@keyframes pop-rise{0%{transform:translateY(0);opacity:0}15%{opacity:1}to{transform:translateY(-38px);opacity:0}}.q-timer{width:100%;height:8px;border-radius:999px;background:#ffffff14;overflow:hidden}.q-timer-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--c-accent, #22c55e),var(--c-primary, #f5c542));transition:width .1s linear}.q-timer.low .q-timer-fill{background:linear-gradient(90deg,#ef4444,#ff7a1a);box-shadow:0 0 12px #ef444499}.q-card{width:100%;background:#ffffff0d;border:1px solid rgba(245,197,66,.2);border-radius:20px;padding:22px 18px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:inset 0 1px #ffffff12,0 12px 32px #0006;animation:q-in .35s ease}@keyframes q-in{0%{transform:translateY(18px);opacity:0}to{transform:translateY(0);opacity:1}}.q-text{font-size:19px;line-height:1.4;font-weight:700;margin-bottom:18px}.q-options{display:flex;flex-direction:column;gap:10px}.q-option{width:100%;text-align:left;font-size:15px;font-weight:600;padding:14px 16px;border-radius:14px;color:var(--c-text, #f0f6ff);background:#ffffff0d;border:1px solid rgba(143,163,191,.3);cursor:pointer;transition:transform .1s ease,border-color .15s ease,background .15s ease}.q-option:active{transform:scale(.98)}.q-option.picked{border-color:var(--c-primary, #f5c542)}.q-option.correct{background:color-mix(in srgb,var(--c-accent, #22c55e) 30%,transparent);border-color:var(--c-accent, #22c55e);box-shadow:0 0 18px color-mix(in srgb,var(--c-accent, #22c55e) 55%,transparent)}.q-option.wrong{background:#ef444440;border-color:#ef4444;box-shadow:0 0 18px #ef444466}.q-option.dim{opacity:.45}.q-option-hidden{min-height:50px;border-radius:14px;border:1px dashed rgba(143,163,191,.25);opacity:.4}.q-footer{margin-top:16px;display:flex;align-items:center;justify-content:space-between;min-height:34px}.q-lifeline{font-size:14px;font-weight:800;letter-spacing:1px;padding:8px 18px;border-radius:999px;color:var(--c-primary, #f5c542);border:1px solid rgba(245,197,66,.5);background:#f5c54214;cursor:pointer}.q-lifeline:disabled{opacity:.3;cursor:default}.q-verdict{font-size:14px;font-weight:700;color:var(--c-text-dim, #8fa3bf)}.confetti{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;overflow:hidden}.confetti i{position:absolute;top:-12px;width:8px;height:12px;border-radius:2px;background:var(--c-primary, #f5c542);animation:confetti-fall 2.6s ease-in forwards}.confetti i:nth-child(3n){background:var(--c-accent, #22c55e)}.confetti i:nth-child(4n){background:var(--c-secondary, #7dd3fc)}.confetti i:nth-child(1){left:6%;animation-delay:0s}.confetti i:nth-child(2){left:16%;animation-delay:.3s}.confetti i:nth-child(3){left:26%;animation-delay:.1s}.confetti i:nth-child(4){left:36%;animation-delay:.5s}.confetti i:nth-child(5){left:46%;animation-delay:.2s}.confetti i:nth-child(6){left:56%;animation-delay:.45s}.confetti i:nth-child(7){left:66%;animation-delay:.15s}.confetti i:nth-child(8){left:76%;animation-delay:.35s}.confetti i:nth-child(9){left:86%;animation-delay:.05s}.confetti i:nth-child(10){left:12%;animation-delay:.6s}.confetti i:nth-child(11){left:32%;animation-delay:.7s}.confetti i:nth-child(12){left:52%;animation-delay:.55s}.confetti i:nth-child(13){left:72%;animation-delay:.75s}.confetti i:nth-child(14){left:92%;animation-delay:.4s}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(105dvh) rotate(560deg);opacity:0}}.idle-app{display:flex;flex-direction:column}.idle-content{flex:1;overflow-y:auto;position:relative}.idle-toast{position:absolute;top:max(14px,env(safe-area-inset-top));left:50%;transform:translate(-50%);z-index:20;padding:10px 18px;border-radius:999px;font-size:13px;font-weight:700;color:#2a1c05;background:linear-gradient(135deg,#ffe9b0,var(--c-primary, #f5c542));box-shadow:0 6px 24px #f5c54266;animation:q-in .4s ease;white-space:nowrap}.idle-sea{height:100%;display:flex;flex-direction:column;align-items:center;position:relative;overflow:hidden;padding-top:max(18px,env(safe-area-inset-top))}.idle-topline{display:flex;flex-direction:column;align-items:center;gap:8px;z-index:2}.idle-balance{font-size:44px;font-weight:900;font-variant-numeric:tabular-nums;background:linear-gradient(160deg,#ffe9b0 15%,var(--c-primary, #f5c542) 55%,#d98f1f);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 18px rgba(245,197,66,.35))}.idle-income-chip{font-size:13px;font-weight:700;color:var(--c-accent, #e8d5b5);padding:6px 14px;border-radius:999px;background:#ffffff0f;border:1px solid color-mix(in srgb,var(--c-accent, #e8d5b5) 35%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.ship-tap{position:relative;z-index:2;margin-top:auto;margin-bottom:96px;background:none;border:none;cursor:pointer;animation:ship-bob 3.4s ease-in-out infinite;transition:transform .1s ease}.ship-tap.pressed{transform:scale(.94)}.ship-svg{width:min(62vw,260px);height:auto;filter:drop-shadow(0 0 26px rgba(245,197,66,.25))}@keyframes ship-bob{0%,to{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-9px) rotate(1.2deg)}}.ship-tap-hint{display:block;margin-top:10px;font-size:13px;letter-spacing:1.5px;text-transform:uppercase;color:var(--c-text-dim, #8fa8ad)}.tap-floater{position:absolute;font-size:20px;font-weight:900;color:var(--c-primary, #f5c542);text-shadow:0 0 12px rgba(245,197,66,.6);pointer-events:none;animation:pop-rise .9s ease-out forwards}.sea-waves{position:absolute;left:0;right:0;bottom:0;height:34%;z-index:1;pointer-events:none}.wave{position:absolute;left:-50%;bottom:0;width:200%;height:100%;background:radial-gradient(60% 90% at 50% 100%,rgba(127,212,230,.14),transparent 70%);animation:wave-drift 7s ease-in-out infinite}.wave-b{animation-duration:11s;animation-delay:-3s;opacity:.6}@keyframes wave-drift{0%,to{transform:translate(-3%) translateY(0)}50%{transform:translate(3%) translateY(-8px)}}.idle-list{display:flex;flex-direction:column;gap:10px;padding:16px 14px 24px}.ship-row{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:#ffffff0d;border:1px solid color-mix(in srgb,var(--c-accent, #e8d5b5) 20%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:inset 0 1px #ffffff0f,0 6px 18px #0000004d}.mapa-row{border-color:color-mix(in srgb,var(--c-primary, #f5c542) 45%,transparent);box-shadow:0 0 18px #f5c54226}.ship-icon{flex:0 0 auto;width:46px;height:46px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#ffffff0d}.ship-info{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0;text-align:left}.ship-name{font-size:15px;font-weight:700}.ship-sub{font-size:12px;color:var(--c-text-dim, #8fa8ad)}.ship-buy{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 14px;border:none;border-radius:12px;font-size:12px;font-weight:800;cursor:pointer;color:#2a1c05;background:linear-gradient(135deg,#ffe9b0,var(--c-primary, #f5c542) 50%,#d98f1f);box-shadow:0 0 14px #f5c5424d;transition:transform .1s ease}.ship-buy:active{transform:scale(.95)}.ship-buy:disabled{background:#ffffff14;color:var(--c-text-dim, #8fa8ad);box-shadow:none;cursor:default}.ship-cost{font-size:11px;font-weight:700;opacity:.85;font-variant-numeric:tabular-nums}.route-list{display:flex;flex-direction:column;padding:16px 14px 24px;position:relative}.route-list:before{content:"";position:absolute;left:27px;top:30px;bottom:30px;border-left:2px dashed color-mix(in srgb,var(--c-accent, #e8d5b5) 30%,transparent)}.route-port{display:flex;align-items:center;gap:12px;padding:12px 0 12px 6px;position:relative;opacity:.55}.route-port.unlocked,.route-port.ready{opacity:1}.route-dot{flex:0 0 auto;width:14px;height:14px;border-radius:50%;background:var(--c-text-dim, #8fa8ad);border:2px solid var(--c-bg, #062a33);z-index:1}.route-port.unlocked .route-dot{background:var(--c-primary, #f5c542);box-shadow:0 0 12px #f5c542b3}.route-port.ready .route-dot{background:var(--c-secondary, #f59e0b);box-shadow:0 0 14px #f59e0bcc;animation:route-pulse 1.4s ease-in-out infinite}@keyframes route-pulse{50%{transform:scale(1.35)}}.route-info{flex:1;display:flex;flex-direction:column;gap:3px;text-align:left;min-width:0}.route-name{font-size:16px;font-weight:800}.route-sub{font-size:12px;color:var(--c-text-dim, #8fa8ad)}.route-progress{position:relative;height:16px;border-radius:999px;background:#ffffff12;overflow:hidden;margin-top:4px}.route-progress-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--c-secondary, #f59e0b),var(--c-primary, #f5c542));transition:width .4s ease}.route-progress-text{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:800;letter-spacing:.5px;color:var(--c-text, #f2ead8);font-variant-numeric:tabular-nums}.route-badge{flex:0 0 auto;font-size:11px;font-weight:800;padding:5px 12px;border-radius:999px;color:#2a1c05;background:linear-gradient(135deg,#ffe9b0,var(--c-primary, #f5c542))}.route-unlock{flex:0 0 auto;font-size:12px;font-weight:800;padding:9px 14px;border:none;border-radius:12px;cursor:pointer;color:#2a1c05;background:linear-gradient(135deg,#ffe9b0,var(--c-primary, #f5c542) 50%,#d98f1f);box-shadow:0 0 16px #f5c54259}.route-unlock:disabled{background:#ffffff14;color:var(--c-text-dim, #8fa8ad);box-shadow:none;cursor:default}.idle-tabs{display:flex;gap:6px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:#061a21d9;border-top:1px solid color-mix(in srgb,var(--c-accent, #e8d5b5) 18%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.idle-tab{flex:1;padding:10px 4px;border-radius:12px;border:1px solid transparent;font-size:13px;font-weight:700;color:var(--c-text-dim, #8fa8ad);cursor:pointer}.idle-tab.active{color:var(--c-primary, #f5c542);background:#f5c5421a;border-color:#f5c54259}.bar-game{justify-content:flex-start;padding-top:max(14px,env(safe-area-inset-top));gap:10px}.bar-timer{font-size:15px;font-weight:800;padding:7px 16px;border-radius:999px;color:var(--c-primary, #f5c542);background:#140a048c;border:1px solid rgba(245,197,66,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-variant-numeric:tabular-nums}.bar-rush-banner{font-size:15px;font-weight:900;letter-spacing:2px;text-transform:uppercase;color:#fff;padding:6px 18px;border-radius:999px;background:linear-gradient(135deg,var(--c-secondary, #ff4d4d),#c0392b);box-shadow:0 0 22px #ff4d4d99;animation:route-pulse .8s ease-in-out infinite}.bar-combo{position:absolute;top:64px;right:16px;font-size:14px;font-weight:900;color:#2a1c05;padding:5px 14px;border-radius:999px;background:linear-gradient(135deg,#ffe9b0,var(--c-primary, #f5c542));box-shadow:0 0 16px #f5c54280;animation:pop .3s ease}.bar-game.rush:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;box-shadow:inset 0 0 60px #ff4d4d40}.bar-awning{width:calc(100% + 40px);height:26px;margin:0 -20px;background:repeating-linear-gradient(90deg,var(--c-accent, #1f7a4d) 0 34px,color-mix(in srgb,var(--c-accent, #1f7a4d) 55%,#fff) 34px 68px);border-radius:0 0 14px 14px;box-shadow:0 4px 14px #00000059}.bar-counter{width:100%;min-height:168px;display:flex;gap:10px;align-items:flex-end;padding:12px;border-radius:18px;background:#ffffff0d;border:1px solid rgba(243,233,210,.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.bar-customer{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 8px;border-radius:14px;background:#ffffff0f;border:1px solid rgba(243,233,210,.18);animation:customer-in .35s ease}.bar-customer.empty{background:transparent;border-style:dashed;opacity:.25;min-height:130px}.bar-customer.served{animation:customer-out .5s ease forwards;border-color:#22c55e}.bar-customer.missed{animation:customer-out .5s ease forwards;filter:grayscale(1);opacity:.5}@keyframes customer-in{0%{transform:translate(60px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes customer-out{to{transform:translateY(-24px);opacity:0}}.bar-avatar{width:38px;height:38px;border-radius:50%;box-shadow:inset 0 -6px 12px #00000059,0 0 10px #0000004d}.bar-order{display:flex;gap:4px;min-height:26px}.bar-patience{width:100%;height:6px;border-radius:999px;background:#00000059;overflow:hidden}.bar-patience-fill{height:100%;border-radius:999px;transition:width .1s linear}.bar-hint{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--c-text-dim, #b09a7e)}.bar-items{width:100%;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:auto;padding-bottom:calc(8px + env(safe-area-inset-bottom))}.bar-item{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;border-radius:16px;font-size:11px;font-weight:700;color:var(--c-text, #f3e9d2);background:#ffffff12;border:1px solid rgba(245,197,66,.3);cursor:pointer;transition:transform .08s ease}.bar-item:active{transform:scale(.92)}.bar-item.wrong{border-color:var(--c-secondary, #ff4d4d);background:#ff4d4d40;animation:wrong-shake .3s ease}@keyframes wrong-shake{25%{transform:translate(-5px)}75%{transform:translate(5px)}}.bar-shop{justify-content:flex-start;padding-top:max(28px,env(safe-area-inset-top))}.bar-coins-line{color:var(--c-text-dim, #b09a7e);font-size:14px}.bar-coins-line strong{color:var(--c-primary, #f5c542)}.shop-list{width:100%;display:flex;flex-direction:column;gap:12px}.shop-card{display:flex;align-items:center;gap:12px;padding:16px;border-radius:18px;background:#ffffff0d;border:1px solid rgba(245,197,66,.22);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);text-align:left}.shop-info{flex:1;display:flex;flex-direction:column;gap:4px}.shop-name{font-size:16px;font-weight:800}.shop-desc{font-size:12px;color:var(--c-text-dim, #b09a7e)}.shop-pips{display:flex;align-items:center;gap:5px;margin-top:4px}.pip{width:10px;height:10px;border-radius:50%;background:#ffffff1f}.pip.on{background:var(--c-primary, #f5c542);box-shadow:0 0 8px #f5c54299}.shop-pips em{font-size:11px;font-style:normal;color:var(--c-text-dim, #b09a7e);margin-left:6px}.shop-max{font-size:12px;font-weight:900;color:var(--c-primary, #f5c542);letter-spacing:1px}.bar-rank{font-size:14px;color:var(--c-text-dim, #b09a7e)}.bar-rank strong{color:var(--c-primary, #f5c542)}