:root{color-scheme:dark;--ink:#f3f7f4;--muted:#9ea9a1;--night:#08100c;--panel:#111b16;--line:#304238;--lime:#c9f45b;--mint:#6cddb0;--coral:#ff746d;--gold:#f6c95e;--display:"Arial Black","Helvetica Neue",Arial,sans-serif;--body:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}*{box-sizing:border-box}html{min-width:280px;background:var(--night)}body{min-height:100vh;margin:0;color:var(--ink);background:radial-gradient(circle at 82% 5%,rgba(108,221,176,.1),transparent 30rem),var(--night);font-family:var(--body);line-height:1.5}a{color:inherit}button{color:inherit;font:inherit}.site-header,main,footer{width:min(1060px,calc(100% - 40px));margin-inline:auto}.site-header{display:flex;align-items:center;justify-content:space-between;min-height:78px;border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:11px;font-weight:850;text-decoration:none}.brand-mark{display:grid;width:34px;height:34px;place-items:center;color:var(--night);background:var(--lime);border-radius:9px;font-family:var(--display)}.site-header p{margin:0;color:var(--muted);font-size:.7rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.site-header p span,.eyebrow{color:var(--mint)}.intro{display:grid;grid-template-columns:1fr minmax(260px,400px);gap:60px;align-items:end;padding:58px 0 36px}.intro>p{margin-bottom:3px;color:var(--muted)}.eyebrow{margin:0 0 10px;font-size:.72rem;font-weight:850;letter-spacing:.18em;text-transform:uppercase}h1,h2,p{margin-top:0}h1{margin-bottom:0;font-family:var(--display);font-size:clamp(3.25rem,8vw,6.2rem);line-height:.86;letter-spacing:-.07em}.game-shell{max-width:720px;margin-inline:auto;overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:17px}.mode{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border-bottom:1px solid var(--line)}.mode button{display:grid;gap:1px;min-height:58px;padding:10px 16px;text-align:left;background:var(--panel);border:0;cursor:pointer}.mode button[aria-pressed="true"]{color:var(--night);background:var(--mint)}.mode strong{font-size:.82rem}.mode span{color:var(--muted);font-size:.66rem}.mode button[aria-pressed="true"] span{color:#184838}.game-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 18px}.turn{display:flex;align-items:center;gap:10px;min-width:0}.turn p{margin:0;color:var(--muted);font-size:.78rem}.piece{display:block;flex:0 0 auto;width:22px;aspect-ratio:1;border:2px solid var(--line);border-radius:50%}.piece--1{background:var(--coral);border-color:#ffaaa5}.piece--2{background:var(--gold);border-color:#ffe29f}.game-bar>button{min-height:40px;padding:0 14px;background:transparent;border:1px solid #506359;border-radius:8px;font-size:.75rem;font-weight:800;cursor:pointer}.game-bar>button:hover,.game-bar>button:focus-visible{color:var(--night);background:var(--lime);border-color:var(--lime)}.board-wrap{position:relative;padding:28px 22px 24px;background:#09120e}.column-marker{position:absolute;top:1px;left:calc(22px + (100% - 44px)/7*(var(--column) + .5));color:var(--lime);font-size:1rem;transform:translateX(-50%);transition:left 120ms ease}.board{display:grid;grid-template-columns:repeat(7,1fr);gap:clamp(5px,1vw,10px);padding:clamp(8px,1.5vw,14px);background:#315f4e;border:1px solid #5c8b77;border-radius:16px;box-shadow:inset 0 0 30px rgba(0,0,0,.28);touch-action:manipulation}.cell{position:relative;aspect-ratio:1;padding:0;background:#08100c;border:2px solid rgba(255,255,255,.08);border-radius:50%;box-shadow:inset 0 4px 8px rgba(0,0,0,.65);cursor:pointer}.cell:hover,.cell:focus-visible{outline:3px solid var(--lime);outline-offset:2px}.cell--player-1{background:radial-gradient(circle at 35% 30%,#ffaea8 0 8%,var(--coral) 10% 62%,#ae332e 65%);box-shadow:inset 0 4px 8px rgba(255,255,255,.22)}.cell--player-2{background:radial-gradient(circle at 35% 30%,#fff0b8 0 8%,var(--gold) 10% 62%,#aa7721 65%);box-shadow:inset 0 4px 8px rgba(255,255,255,.22)}.cell--winner{animation:winner 720ms ease-in-out infinite alternate}.board--locked .cell{cursor:wait}.rules{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,9vw,110px);padding:90px 0}.rules h2{margin:0;font-family:var(--display);font-size:clamp(2rem,4vw,3.8rem);line-height:.98;letter-spacing:-.05em}.rules>p{margin:0;color:var(--muted)}footer{display:flex;justify-content:space-between;padding:28px 0 42px;color:var(--muted);border-top:1px solid var(--line);font-size:.8rem}footer a{color:var(--ink);font-weight:750;text-decoration:none}footer p{margin:0}@keyframes winner{to{filter:brightness(1.35);transform:scale(.88)}}@media(max-width:680px){.site-header,main,footer{width:min(100% - 24px,620px)}.site-header{min-height:66px}.intro{grid-template-columns:1fr;gap:18px;padding:42px 0 30px}.game-shell{border-radius:12px}.board-wrap{padding:25px 9px 12px}.column-marker{left:calc(9px + (100% - 18px)/7*(var(--column) + .5))}.board{gap:4px;padding:7px;border-radius:11px}.rules{grid-template-columns:1fr;gap:22px;padding:72px 0 82px}}@media(max-width:430px){.intro h1{font-size:clamp(2.8rem,15vw,4rem)}.mode button{padding:9px 10px}.game-bar{align-items:flex-start;padding:11px}.turn p{font-size:.7rem}.game-bar>button{padding-inline:9px}.cell{border-width:1px}.rules{padding-top:68px}footer{display:block}footer p{margin-top:6px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}