:root{--surface: #101a2b;--surface-raised: rgb(255 255 255 / 6%);--border: rgb(255 255 255 / 12%);--text: #eef2f8;--text-muted: #9fb0c6;--accent: #34d399;--board-line: rgb(74 44 16 / 55%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(1100px 600px at 12% -10%,rgb(52 211 153 / 16%),transparent 60%),radial-gradient(900px 520px at 92% 8%,rgb(96 165 250 / 14%),transparent 62%),var(--surface)}.app{width:min(1040px,100%);margin:0 auto;padding:clamp(24px,5vw,56px) clamp(16px,4vw,32px) 64px}.app__header{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;justify-content:space-between;margin-bottom:clamp(20px,4vw,32px)}.app__headerText{min-width:0}.app__eyebrow{margin:0 0 10px;color:var(--accent);font-size:.75rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase}.app__title{margin:0;font-size:clamp(2rem,5vw,3rem);letter-spacing:.04em;line-height:1.05}.app__subtitle{margin:12px 0 0;color:var(--text-muted);font-size:1rem}.app__layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:clamp(20px,3vw,32px);align-items:start}.app__sidebar{display:flex;flex-direction:column;gap:clamp(16px,2vw,20px);min-width:0}.app__error{margin:20px 0 0;padding:12px 14px;border:1px solid rgb(248 113 113 / 45%);border-radius:10px;background:#f871711f;color:#fecaca;font-size:.86rem}.account{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:flex-end;max-width:320px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-raised)}.account__hint{color:var(--text-muted);font-size:.8rem;line-height:1.5}.account__name{overflow:hidden;max-width:190px;font-size:.88rem;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.account__error{flex-basis:100%;margin:0;color:#fca5a5;font-size:.78rem;line-height:1.5;text-align:right}.board{position:relative;width:100%;max-width:620px;aspect-ratio:1;border:1px solid rgb(90 55 20 / 45%);border-radius:14px;background:linear-gradient(150deg,#f0c288,#e2a862 52%,#d1904a);box-shadow:0 26px 60px #060c1873,inset 0 0 40px #78461438}.board__grid{position:absolute;top:5%;right:5%;bottom:5%;left:5%}.board__line{position:absolute;background:var(--board-line)}.board__line--row{left:0;right:0;height:1px;transform:translateY(-50%)}.board__line--column{top:0;bottom:0;width:1px;transform:translate(-50%)}.board__star{position:absolute;width:8px;height:8px;border-radius:50%;background:#4a2c10cc;transform:translate(-50%,-50%)}.board__point{position:absolute;display:grid;place-items:center;width:7.15%;aspect-ratio:1;padding:0;border:0;border-radius:50%;background:transparent;transform:translate(-50%,-50%);cursor:pointer}.board__point:disabled{cursor:default}.board__point:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.board__ghost{width:82%;height:82%;border-radius:50%;opacity:0;transition:opacity .12s ease}.board__point:hover .board__ghost{opacity:.42}.board__ghost--black{background:#1b1b1f}.board__ghost--white{background:#fdfdfd}.board__stone{width:88%;height:88%;border-radius:50%;animation:stone-drop .14s ease-out;box-shadow:0 2px 5px #28140073}.board__stone--black{background:radial-gradient(circle at 32% 28%,#5d6068,#26282e 45%,#0c0d10)}.board__stone--white{background:radial-gradient(circle at 32% 28%,#fff,#f1f2f4 48%,#c9ccd2)}.board__stone--last{outline:2px solid rgb(52 211 153 / 85%);outline-offset:1px}.board__stone--winning{animation:stone-win 1.1s ease-in-out infinite;outline:2px solid #fbbf24;outline-offset:2px}.panel{display:flex;flex-direction:column;gap:18px;padding:20px;border:1px solid var(--border);border-radius:14px;background:var(--surface-raised);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.panel__modes{display:grid;grid-template-columns:1fr 1fr;gap:8px}.chip{padding:9px 10px;border:1px solid var(--border);border-radius:999px;background:transparent;color:var(--text-muted);font-size:.88rem;cursor:pointer;transition:color .14s ease,background .14s ease}.chip:hover{color:var(--text)}.chip--active{border-color:#34d3998c;background:#34d39929;color:var(--text);font-weight:600}.status{display:flex;align-items:center;gap:10px;padding:14px;border:1px solid var(--border);border-radius:12px;background:#ffffff0a}.status--win{border-color:#fbbf248c;background:#fbbf2424}.status--draw{border-color:#94a3b873}.status__stone{width:20px;height:20px;flex:none;border-radius:50%;box-shadow:0 1px 3px #00000073}.status__stone--black{background:radial-gradient(circle at 32% 28%,#5d6068,#101114)}.status__stone--white{background:radial-gradient(circle at 32% 28%,#fff,#ccd0d6)}.status__text{font-size:1rem;font-weight:600}.panel__meta{display:grid;gap:10px;margin:0}.panel__metaItem{display:flex;justify-content:space-between;font-size:.9rem}.panel__metaItem dt{color:var(--text-muted)}.panel__metaItem dd{margin:0;font-variant-numeric:tabular-nums}.panel__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.button{padding:11px 12px;border:1px solid var(--border);border-radius:10px;background:#ffffff0f;color:var(--text);font-size:.92rem;font-weight:600;cursor:pointer;transition:background .14s ease,opacity .14s ease}.button:hover:not(:disabled){background:#ffffff1f}.button:disabled{cursor:not-allowed;opacity:.42}.button--primary{border-color:transparent;background:var(--accent);color:#06281c}.button--primary:hover:not(:disabled){background:#4ade9f}.panel__hint{margin:0;color:var(--text-muted);font-size:.82rem;line-height:1.6}.leaderboard__header{display:flex;gap:10px;align-items:center;justify-content:space-between}.leaderboard__title{margin:0;font-size:1rem;letter-spacing:.02em}.leaderboard__notice{margin:0;color:var(--text-muted);font-size:.85rem;line-height:1.6}.leaderboard__notice--error{color:#fca5a5}.leaderboard__table{width:100%;border-collapse:collapse;font-size:.85rem}.leaderboard__table th{padding:0 0 8px;border-bottom:1px solid var(--border);color:var(--text-muted);font-size:.74rem;font-weight:600;letter-spacing:.06em;text-align:left}.leaderboard__table th:last-child,.leaderboard__rate{text-align:right}.leaderboard__row td{padding:9px 0;border-bottom:1px solid rgb(255 255 255 / 6%)}.leaderboard__row--self td{color:var(--accent);font-weight:600}.leaderboard__rank{width:28px;color:var(--text-muted);font-variant-numeric:tabular-nums}.leaderboard__row--self .leaderboard__rank{color:var(--accent)}.leaderboard__name{overflow:hidden;max-width:110px;text-overflow:ellipsis;white-space:nowrap}.leaderboard__record,.leaderboard__rate{font-variant-numeric:tabular-nums;white-space:nowrap}@keyframes stone-drop{0%{opacity:.4;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes stone-win{0%,to{box-shadow:0 0 #fbbf2400}50%{box-shadow:0 0 14px #fbbf24d9}}@media(max-width:900px){.app__layout{grid-template-columns:minmax(0,1fr)}.board{max-width:none}.account{justify-content:flex-start;max-width:none}.account__error{text-align:left}}@media(prefers-reduced-motion:reduce){.board__stone,.board__stone--winning{animation:none}}