:root{color:#f6f0de;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--panel:#071813d1;--panel-soft:#123d2fb8;--line:#f5e1b538;--accent:#ffd166;--accent-strong:#ffb703;--text-soft:#d9d0bf;--grass-a:#2b7a46;--grass-b:#22663b;--goal:#f8f5ef;background:radial-gradient(circle at top,#ffe4a333,#0000 30%),linear-gradient(#0f3d2e 0%,#0a241c 100%);font-family:Georgia,Times New Roman,serif}*{box-sizing:border-box}body{min-height:100vh;margin:0}button,kbd{font:inherit}#app{min-height:100vh}.game-shell{width:min(1180px,100% - 24px);margin:0 auto;padding:28px 0 40px}.hero-panel,.stadium-card,.history-card,.insight-card{border:1px solid var(--line);background:var(--panel);box-shadow:0 24px 60px #00000038}.hero-panel{border-radius:28px 28px 18px 18px;grid-template-columns:1.5fr .8fr;gap:20px;padding:28px;display:grid}.eyebrow,.label{text-transform:uppercase;letter-spacing:.12em;color:var(--accent);margin:0 0 8px;font-size:.76rem}h1,h2,h3,p{margin:0}h1{max-width:11ch;font-size:clamp(2.3rem,5vw,4.7rem);line-height:.95}.intro{max-width:58ch;color:var(--text-soft);margin-top:14px;line-height:1.6}.score-card{grid-template-columns:repeat(3,1fr);align-self:end;gap:12px;display:grid}.score-card div,.control-box{border:1px solid var(--line);background:var(--panel-soft);border-radius:18px;padding:16px}.score-card span{color:var(--text-soft);margin-bottom:8px;font-size:.9rem;display:block}.score-card strong{font-size:clamp(1.8rem,4vw,2.8rem)}.stadium-card{border-radius:18px 18px 28px 28px;margin-top:18px;padding:24px}.stadium-head{grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:20px;display:grid}.stadium-head h2{font-size:clamp(1.2rem,2.2vw,2rem)}.pitch{background:linear-gradient(180deg, #b7e6ffe6 0%, #b7e6ff52 24%, transparent 25%), repeating-linear-gradient(90deg, var(--grass-a) 0, var(--grass-a) 80px, var(--grass-b) 80px, var(--grass-b) 160px);border-radius:28px;min-height:580px;position:relative;overflow:hidden}.pitch:before{content:"";border:3px solid #ffffffbf;border-radius:0 0 26px 26px;position:absolute;inset:18% 12% 8%}.goal{border:7px solid var(--goal);background:#f4f7fa14;border-bottom-width:4px;width:min(82%,720px);height:260px;position:absolute;top:9%;left:50%;transform:translate(-50%)}.goal:before,.goal:after{content:"";background:linear-gradient(#ffffff52,#ffffff0f);width:24px;height:100%;position:absolute;top:0}.goal:before{left:-18px;transform:skewY(30deg)}.goal:after{right:-18px;transform:skewY(-30deg)}.net-lines{opacity:.65;background:repeating-linear-gradient(90deg,#0000 0 58px,#ffffff5c 58px 60px),repeating-linear-gradient(#0000 0 38px,#ffffff42 38px 40px);position:absolute;inset:0}.zone-grid{grid-template-rows:repeat(2,1fr);grid-template-columns:repeat(3,1fr);gap:10px;padding:14px;display:grid;position:absolute;inset:0}.zone-button{color:#fffaf0b3;cursor:pointer;background:#0c231c2e;border:1px dashed #ffffff2e;border-radius:12px;transition:transform .18s,background .18s,border-color .18s}.zone-button:hover,.zone-button.active{background:#ffd16638;border-color:#ffd166b3;transform:translateY(-2px)}.keeper{width:84px;height:112px;transition:left .52s cubic-bezier(.22,1,.36,1),top .52s cubic-bezier(.22,1,.36,1),transform .52s;position:absolute;top:56%;left:50%;transform:translate(-50%,-50%)}.keeper:before,.keeper:after{content:"";position:absolute}.keeper:before{background:linear-gradient(#ff6b6b,#b31c34);border-radius:20px 20px 18px 18px;inset:24px 18px 0;box-shadow:inset 0 -10px #21070a38}.keeper:after{background:#f3d4b2;border-radius:50%;width:34px;height:34px;top:0;left:50%;transform:translate(-50%)}.keeper.dive-left{transform:translate(-50%,-50%)rotate(-24deg)scale(1.02)}.keeper.dive-right{transform:translate(-50%,-50%)rotate(24deg)scale(1.02)}.ball{background:radial-gradient(circle at 35% 35%,#fff 0 28%,#111 29% 36%,#fff 37% 64%,#111 65% 72%,#fff 73% 100%);border-radius:50%;width:22px;height:22px;transition:left .76s cubic-bezier(.2,.8,.2,1),top .76s cubic-bezier(.2,.8,.2,1),width .76s,height .76s;position:absolute;top:92%;left:50%;transform:translate(-50%,-50%);box-shadow:0 8px 16px #00000047}.ball.shot{box-shadow:0 4px 8px #0000002e}.penalty-spot{background:#fffffff2;border-radius:50%;width:14px;height:14px;position:absolute;bottom:10%;left:50%;transform:translate(-50%)}.control-row,.insight-grid{gap:16px;margin-top:18px;display:grid}.control-row{grid-template-columns:1fr 1fr}.control-box p:last-child,.insight-card p:last-child,.history-list li{color:var(--text-soft);line-height:1.6}kbd{color:#fff7e8;background:#ffd16624;border:1px solid #ffd1668c;border-radius:999px;justify-content:center;align-items:center;min-width:2em;padding:.16em .5em;display:inline-flex}.insight-grid{grid-template-columns:repeat(3,1fr)}.insight-card{border-radius:22px;padding:22px}.coach-card{background:linear-gradient(135deg, #ffb70329, #ffd1660d), var(--panel)}.detail{margin-top:12px}.history-card{border-radius:24px;margin-top:18px;padding:22px}.history-head{justify-content:space-between;align-items:center;gap:12px;display:flex}.reset-button{color:#fff5de;cursor:pointer;background:#ffd1661f;border:1px solid #ffd16699;border-radius:999px;padding:10px 16px;transition:transform .18s,background .18s}.reset-button:hover{background:#ffd1663d;transform:translateY(-1px)}.history-list{gap:10px;margin:16px 0 0;padding-left:20px;display:grid}@media (width<=920px){.hero-panel,.stadium-head,.control-row,.insight-grid{grid-template-columns:1fr}.pitch{min-height:500px}.goal{width:calc(100% - 36px);height:220px}}@media (width<=640px){.game-shell{width:min(100%,100% - 14px);padding-top:10px}.hero-panel,.stadium-card,.history-card,.insight-card{border-radius:20px}.hero-panel,.stadium-card,.history-card{padding:18px}h1{max-width:none}.pitch{min-height:420px}.goal{height:180px;top:12%}.zone-grid{gap:6px;padding:10px}.zone-button{font-size:.82rem}}