:root{color-scheme:light;font-family:Avenir Next,Trebuchet MS,Segoe UI,sans-serif;line-height:1.45;font-weight:400;--page-bg: #f5f1e8;--page-bg-deep: #eee6d8;--surface: rgba(255, 253, 248, .96);--surface-muted: #f7f2e9;--surface-raised: #fffdfa;--border: #ddd2c0;--border-strong: #cab9a2;--text: #20303d;--text-soft: #5f707b;--accent: #5e7a89;--accent-strong: #476270;--accent-soft: #dbe5eb;--warm: #b76c49;--warm-soft: #f1e2d8;--success: #5f8569;--success-soft: #e6efe8;--safe-top: env(safe-area-inset-top, 0px);--safe-right: env(safe-area-inset-right, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--red-disc: #c76856;--red-disc-deep: #ab5646;--gold-disc: #e6bf63;--gold-disc-deep: #cfab55;--draw-chip: #d9d4ca;--board-surface: #5f7988;--board-surface-deep: #4d6674;--board-hole: rgba(33, 49, 60, .2);--board-shadow: 0 18px 42px rgba(32, 48, 61, .14);background:radial-gradient(circle at top,rgba(255,255,255,.82),transparent 28rem),linear-gradient(180deg,var(--page-bg) 0%,var(--page-bg-deep) 100%);color:var(--text)}*{box-sizing:border-box}html{min-height:100%;max-width:100%;overflow-x:clip}body{margin:0;min-width:320px;max-width:100%;min-height:100dvh;overflow-x:clip;color:var(--text);background:radial-gradient(circle at top,rgba(255,255,255,.82),transparent 28rem),linear-gradient(180deg,var(--page-bg) 0%,var(--page-bg-deep) 100%);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{font:inherit;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid rgba(95,121,136,.28);outline-offset:3px}#app{min-height:100dvh}.page-shell{width:min(1100px,calc(100% - 16px));max-width:100%;margin:0 auto;padding:max(8px,var(--safe-top)) max(8px,var(--safe-right)) max(8px,var(--safe-bottom)) max(8px,var(--safe-left))}.game-panel{display:flex;flex-direction:column;gap:12px;width:100%;max-width:100%;border:1px solid var(--border);border-radius:28px;background:var(--surface);box-shadow:0 18px 40px #20303d14;min-height:calc(100dvh - 16px - var(--safe-top) - var(--safe-bottom));padding:16px;overflow-x:clip}.toolbar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px}.game-title{margin:0;color:var(--text);font-size:clamp(1.5rem,2.8vw,2.2rem);line-height:.94;letter-spacing:-.05em;white-space:nowrap}.player-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.player-pill,.restart-button,.ghost-button{border-radius:999px;font-weight:700}.player-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:1px solid var(--border);background:var(--surface-muted);color:var(--text)}.player-pill-disc,.status-badge-disc,.column-button-disc{width:14px;aspect-ratio:1 / 1;border-radius:999px;background:var(--surface-raised);box-shadow:inset 0 1px #ffffffd6}.player-pill.is-red .player-pill-disc,.status-badge.is-red .status-badge-disc,.column-button.is-red .column-button-disc,.board-disc.is-red{background:radial-gradient(circle at 32% 30%,#f5cbc0 0%,var(--red-disc) 46%,var(--red-disc-deep) 100%)}.player-pill.is-gold .player-pill-disc,.status-badge.is-gold .status-badge-disc,.column-button.is-gold .column-button-disc,.board-disc.is-gold{background:radial-gradient(circle at 32% 30%,#fff3ca 0%,var(--gold-disc) 48%,var(--gold-disc-deep) 100%)}.toolbar-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.restart-button,.ghost-button,.column-button{cursor:pointer;transition:transform .14s ease,background-color .14s ease,border-color .14s ease,box-shadow .14s ease,opacity .14s ease}.restart-button,.ghost-button{padding:11px 16px;border:1px solid transparent}.restart-button{background:var(--accent);color:#f9fbfd;box-shadow:0 10px 24px #5f79882e}.ghost-button{border-color:var(--border);background:var(--surface-muted);color:var(--accent-strong)}.restart-button:hover,.ghost-button:hover,.column-button:hover:not(:disabled){transform:translateY(-1px)}.restart-button:hover{background:var(--accent-strong)}.ghost-button:hover{border-color:var(--border-strong)}.restart-button:active,.ghost-button:active,.column-button:active:not(:disabled){transform:translateY(0) scale(.98)}.play-layout{display:flex;flex:1;flex-direction:column;gap:12px;min-height:0}.info-column{display:flex;flex-direction:column;gap:10px}.board-column{display:flex;justify-content:center;min-width:0;min-height:0}.stats-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.stat-card{display:flex;flex-direction:column;align-items:center;gap:2px;padding:10px 8px;border:1px solid var(--border);border-radius:16px;background:var(--surface-muted);transition:background-color .18s ease,border-color .18s ease,box-shadow .18s ease}.stat-card.is-red{border-color:#c768564d;background:#f8ebe7}.stat-card.is-gold{border-color:#cfab5557;background:#faf3dd}.stat-card.is-draw{border-color:var(--border-strong);background:#f0ede7}.stat-label{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-soft)}.stat-card strong{font-size:clamp(1.08rem,2.5vw,1.32rem);letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--text)}.message{margin:0;min-height:1.4em;text-align:center;color:var(--accent-strong);font-size:clamp(.98rem,2vw,1.08rem);font-weight:700}.status-badge{display:inline-flex;align-self:center;align-items:center;gap:10px;min-height:48px;padding:10px 16px;border-radius:999px;border:1px solid var(--border);background:var(--surface-muted);color:var(--accent-strong);box-shadow:inset 0 1px #ffffffdb}.status-badge.is-red{border-color:#c768564d;background:#f8ebe7;color:var(--red-disc-deep)}.status-badge.is-gold{border-color:#cfab5557;background:#faf3dd;color:#8e7528}.status-badge.is-draw{border-color:var(--border-strong);background:#f0ede7;color:var(--text-soft)}.status-badge.is-draw .status-badge-disc{background:var(--draw-chip)}.board-stage{width:min(100%,calc((100dvh - 320px) * 7 / 6),860px);max-width:100%;margin:0 auto;display:flex;flex-direction:column;gap:10px;flex:0 1 auto;min-height:0}.column-controls{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(6px,1.2vw,10px)}.column-button{display:grid;justify-items:center;align-content:center;gap:6px;min-height:66px;padding:8px 0 10px;border:1px solid var(--border);border-radius:20px;background:var(--surface-muted);color:var(--accent-strong);box-shadow:inset 0 -1px #ffffffd1}.column-button-label{font-size:.92rem;font-weight:700;line-height:1}.column-button:disabled{cursor:default}.column-button.is-full{opacity:.5}.column-button:not(.is-full):hover{border-color:var(--border-strong)}.board{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:clamp(6px,1.2vw,10px);width:100%;aspect-ratio:7 / 6;padding:clamp(10px,1.8vw,14px);border-radius:28px;background:linear-gradient(180deg,var(--board-surface) 0%,var(--board-surface-deep) 100%);box-shadow:var(--board-shadow)}.board-slot{display:grid;place-items:center;border-radius:999px;background:var(--board-hole);box-shadow:inset 0 4px 10px #17232b2e}.board-disc{width:84%;aspect-ratio:1 / 1;border-radius:999px;background:radial-gradient(circle at 32% 30%,#ffffffeb,#faf5ea 34%,#efe5d1);box-shadow:inset 0 1px 1px #ffffffdb,0 6px 10px #17232b29;transition:transform .18s ease,box-shadow .18s ease}.board-disc.is-winning{box-shadow:inset 0 1px 1px #ffffffdb,0 0 0 4px #ffffff52,0 10px 20px #17232b3d}.board-disc.is-last-move{animation:disc-pop .24s ease}.hint-text{margin:0;text-align:center;color:var(--text-soft);font-size:.94rem;max-width:34ch;align-self:center}@keyframes disc-pop{0%{transform:scale(.82)}70%{transform:scale(1.04)}to{transform:scale(1)}}@media(orientation:landscape)and (min-width:900px){.game-panel{gap:10px}.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;grid-template-areas:"board info";align-items:start;gap:16px}.info-column{grid-area:info;gap:12px}.board-column{grid-area:board;align-items:flex-start}.stats-row{grid-template-columns:repeat(2,minmax(0,1fr))}.message,.hint-text{text-align:left}.status-badge{align-self:flex-start}.hint-text{align-self:flex-start;max-width:none}.board-stage{width:min(100%,calc((100dvh - 188px) * 7 / 6),760px)}.column-button{min-height:58px}}@media(max-width:900px){.game-panel{border-radius:24px;padding:14px}.toolbar{grid-template-columns:1fr;justify-items:center}.toolbar-actions{justify-content:center}.board-stage{width:min(100%,calc((100dvh - 360px) * 7 / 6),760px)}}@media(max-width:720px){.page-shell{width:min(100%,calc(100% - 12px));padding:max(6px,var(--safe-top)) max(6px,var(--safe-right)) max(6px,var(--safe-bottom)) max(6px,var(--safe-left))}.game-panel{min-height:calc(100dvh - 12px - var(--safe-top) - var(--safe-bottom));padding:12px}.stats-row{grid-template-columns:repeat(2,minmax(0,1fr))}.board-stage{width:min(100%,calc((100dvh - 430px) * 7 / 6),560px)}.column-button{min-height:60px;border-radius:18px}.board{border-radius:24px}}@media(max-width:520px){.game-title{font-size:1.45rem}.player-strip,.toolbar-actions{width:100%}.toolbar-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.restart-button,.ghost-button{width:100%;padding-inline:10px}.board-stage{width:100%}.column-controls{gap:6px}.column-button{min-height:56px;padding:8px 0}.column-button-label{font-size:.84rem}.hint-text{font-size:.88rem}}