:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;color:#f3f5f9;background:#080e17;font-synthesis:none}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}body{margin:0;overscroll-behavior:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:3px solid #ffbc66;outline-offset:3px}#game{width:100%;max-width:480px;height:100svh;height:100dvh;min-height:580px;margin:auto;background:#172132;display:flex;flex-direction:column;overflow:hidden;padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);box-shadow:0 0 90px #0008;user-select:none;-webkit-user-select:none}header{height:57px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:#111a29;border-bottom:1px solid #ffffff0c}.wordmark{font-weight:900;letter-spacing:1.2px;font-size:16px}.wordmark>span{color:#ffad57}.wordmark small{display:block;font-size:9px;letter-spacing:2.5px;color:#8d9cad;margin-top:3px}.header-actions{display:flex;align-items:center;gap:12px}.header-actions button{background:none;border:0;padding:8px 0;font-size:10px;letter-spacing:1px;color:#a5b3c8}#pause{font-size:24px;color:#fff;min-width:32px}.scoreboard{height:65px;flex-shrink:0;background:#0e1623;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:3px solid #fca252}.team{display:flex;align-items:center;gap:8px}.team i{width:4px;height:30px;background:#ff9956}.team span,.drive>span{font-size:11px;font-weight:800;letter-spacing:1px;color:#a9b4c4}.team strong{font-size:32px;letter-spacing:-1px;margin-left:3px;font-variant-numeric:tabular-nums}.situation{text-align:center;display:grid;gap:4px}.situation b{font-size:14px;letter-spacing:1px}.situation>span{font-size:11px;letter-spacing:1.4px;color:#8fa1b6}.drive{display:grid;gap:2px}.drive strong{font-size:19px}.drive small{font-size:13px;font-weight:400;color:#8fa1b6}#field-wrap{position:relative;flex:1;min-height:220px;background:#286748;overflow:hidden}#field{width:100%;height:100%;display:block;touch-action:none}.field-tag{position:absolute;bottom:8px;left:10px;font-size:9px;font-weight:700;letter-spacing:2px;color:#c1d5c382;pointer-events:none}#banner{position:absolute;top:15px;left:50%;transform:translateX(-50%);padding:8px 13px;border:1px solid #ffffff26;background:#111b29df;color:white;font-size:12px;font-weight:800;letter-spacing:1px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s}#banner.show{opacity:1}#overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:14px;pointer-events:none}#overlay.active{pointer-events:auto;background:#05140d70;backdrop-filter:blur(2px)}.panel{width:100%;max-width:370px;padding:21px;background:#111c2a;border:1px solid #536074;border-radius:8px;box-shadow:0 15px 30px #0005}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:#ffad57;margin-bottom:8px}.panel h1,.panel h2{font-size:28px;line-height:1.05;margin:0 0 10px;font-weight:900;letter-spacing:-.8px}.panel p{font-size:14px;color:#bdc8d6;line-height:1.5;margin:8px 0 16px}.primary{background:#ffad57;border:0;border-bottom:3px solid #c9762e;color:#131b26;min-height:44px;width:100%;border-radius:5px;font-size:14px;font-weight:800;padding:10px}.secondary{margin-top:8px;background:#253348;border:1px solid #405169;min-height:40px;border-radius:5px;width:100%;font-size:14px;font-weight:700}.tutorial{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:15px 0 20px}.tutorial div{font-size:12px;color:#a2b3c7;line-height:1.5}.tutorial b{display:block;color:#fff;font-size:14px}.play-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}.play-card{background:#1c2b3d;text-align:left;border:1px solid #3d5066;border-radius:5px;padding:11px}.play-card:active{background:#34465c}.play-card b{display:block;font-size:14px;margin-top:5px}.play-card small{display:block;font-size:11px;color:#a8bacd;margin-top:4px}.play-card svg{height:36px;width:100%;display:block}.panel .result{font-size:38px;color:#ffb264;font-weight:900;margin:10px 0}.status{height:29px;padding:0 17px;background:#111c2b;display:flex;align-items:center;justify-content:space-between;gap:8px;flex-shrink:0;border-top:1px solid #ffffff15}#hint{font-size:11px;color:#c0ccda}#stamina{width:40px;height:4px;background:#354054;border-radius:3px;overflow:hidden;flex-shrink:0}#stamina i{display:block;width:100%;height:100%;background:#ffb263}.controller{height:213px;flex-shrink:0;padding:13px 18px 8px;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(#202c40,#172132);box-shadow:inset 0 2px 0 #ffffff0a;touch-action:none}.stick-area{width:145px;text-align:center;align-self:center}#joystick{position:relative;width:132px;height:132px;border-radius:50%;background:radial-gradient(circle,#0c1422 0 52%,#29384d 53% 54%,#121c2b 55% 66%,#39465b 67% 68%,#192537 69%);touch-action:none;margin:auto}#stick{position:absolute;width:69px;height:69px;left:31.5px;top:31.5px;border-radius:50%;background:radial-gradient(circle at 42% 35%,#4a596e,#2d3c50 57%,#213043 58%,#44526a 64%,#233045 67%);box-shadow:0 6px 10px #0007,inset 0 1px 2px #ffffff3f;pointer-events:none;will-change:transform}.stick-rings{position:absolute;inset:49px;border:1px solid #ffffff18;border-radius:50%;pointer-events:none}.control-caption{display:block;font-size:9px;letter-spacing:2px;color:#8293ab;margin-top:12px}.middle{width:32px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px;align-self:flex-end;margin-bottom:19px}.grip{font-size:9px;letter-spacing:4px;line-height:7px;color:#0d1523}#mode{font-size:8px;letter-spacing:1px;white-space:nowrap;color:#899bb5}.face{width:160px;height:174px;position:relative;flex-shrink:0}.pad{width:55px;height:55px;border-radius:50%;position:absolute;border:1px solid #4d5b70;background:linear-gradient(135deg,#3c4960,#202c3e);box-shadow:0 4px 0 #0e1726,0 7px 10px #0006;display:flex;align-items:center;justify-content:center;padding:0;touch-action:none}.pad span{font-size:34px;line-height:1;font-weight:400;pointer-events:none}.pad small{position:absolute;bottom:-14px;left:50%;transform:translateX(-50%);font-size:8px;font-weight:700;letter-spacing:.5px;white-space:nowrap;color:#a4b3c8;pointer-events:none}.pad.pressed{transform:translateY(3px);box-shadow:0 1px 0 #0e1726;background:#465775}.triangle{top:0;left:53px;color:#70dec4}.square{top:55px;left:0;color:#e5a3db}.circle{top:55px;right:0;color:#ff948d}.cross{top:109px;left:53px;color:#9dbdff}footer{display:none;font-size:9px;color:#8497af;padding:9px 18px;text-align:center;background:#111b2b;letter-spacing:.4px}footer span{margin-left:9px}@media(min-width:650px){body{display:grid;place-items:center;min-height:100svh}#game{height:min(950px,100dvh);border-left:1px solid #354157;border-right:1px solid #354157}footer{display:block}}@media(max-width:360px){.controller{padding-inline:10px}.stick-area{width:127px}#joystick{width:122px;height:122px}#stick{left:26.5px;top:26.5px}.face{transform:scale(.91);transform-origin:right center}.middle{display:none}}@media(max-height:690px){.controller{height:180px;padding-block:0}.face{transform:scale(.88);transform-origin:right center}header{height:44px}.scoreboard{height:55px}.panel{padding:15px}.panel h1,.panel h2{font-size:24px}.tutorial{margin:10px 0}.play-card{padding:8px}.play-card svg{height:25px}}@media(orientation:landscape) and (max-height:560px){#game{min-height:560px}body{overflow:auto}}
