:root{--bg: #171310;--bg-elevated: #211b17;--surface: #f0e2c9;--surface-strong: #f6ead6;--text: #221913;--text-muted: #64554a;--line: rgba(34, 25, 19, .14);--line-strong: rgba(34, 25, 19, .22);--accent: #8c5526;--accent-hover: #76461d;--danger: #9b2226;--danger-soft: rgba(155, 34, 38, .12);--shadow: 0 8px 24px rgba(0, 0, 0, .18)}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;min-width:320px;background:radial-gradient(circle at top,rgba(140,85,38,.18),transparent 28%),linear-gradient(180deg,#17120f,#221a14);color:#f7efdf;font-family:Helvetica Neue,Helvetica,sans-serif}button,input{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;padding:24px}.screen,.topbar,.loading-card{width:min(1120px,100%);margin:0 auto}.screen{padding-bottom:24px}.screen-auth{min-height:calc(100vh - 48px);display:grid;place-items:center}.loading-shell,.empty-state{display:grid;place-items:center}.loading-card,.auth-card{max-width:460px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 0 20px;border-bottom:1px solid rgba(255,255,255,.08);margin-bottom:24px}.topbar-title{display:grid;gap:2px}.topbar-title strong{font-size:.95rem;font-weight:600;letter-spacing:.02em}.topbar-title span{color:#f7efdfb8;font-size:.9rem}.surface{background:linear-gradient(180deg,#ffffff4d,#ffffff24),var(--surface);color:var(--text);border:1px solid rgba(255,255,255,.06);border-radius:10px;box-shadow:var(--shadow);padding:24px}.section-header{display:grid;gap:6px}.section-header.compact{gap:4px}.section-header h1,.section-header h2{margin:0;font-size:1.5rem;line-height:1.2;font-weight:600}.muted{margin:0;color:var(--text-muted);line-height:1.55}.stack{display:grid;gap:16px}.field{display:grid;gap:8px}.field-label{color:var(--text-muted);font-size:.88rem;font-weight:600}.field input,.difficulty-slider{width:100%}.field input{min-height:42px;padding:10px 12px;border:1px solid var(--line-strong);border-radius:8px;background:#ffffff85;color:var(--text)}.field input:focus{outline:2px solid rgba(140,85,38,.18);border-color:var(--accent)}.segmented-control{display:inline-grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:4px;gap:4px;border:1px solid var(--line);border-radius:8px;background:#2219130d}.segmented-control button,.chip,.secondary-button,.primary-button{min-height:40px;padding:10px 14px;border-radius:8px;border:1px solid transparent;transition:background-color .14s ease,border-color .14s ease,color .14s ease}.segmented-control button,.chip,.secondary-button{background:#ffffff47;color:var(--text);border-color:var(--line)}.segmented-control .active,.chip.active{background:var(--surface-strong);border-color:var(--line-strong)}.primary-button{background:var(--accent);color:#fff8f0}.primary-button:hover{background:var(--accent-hover)}.secondary-button:hover,.chip:hover,.segmented-control button:hover{background:#ffffff75}.primary-button:disabled,.secondary-button:disabled,.chip:disabled{opacity:.6;cursor:not-allowed}.secondary-button.danger{background:var(--danger-soft);border-color:#9b222633;color:var(--danger)}.auth-note{min-height:1.2rem;font-size:.92rem}.menu-layout,.game-layout{display:grid;gap:20px}.menu-layout{grid-template-columns:minmax(240px,300px) minmax(0,1fr);align-items:start}.game-layout{grid-template-columns:minmax(0,1.45fr) minmax(280px,340px);align-items:start}.section-panel,.board-panel,.side-panel{display:grid;gap:18px}.info-list,.detail-list{display:grid;gap:10px}.info-list div,.detail-list div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}.info-list dt,.detail-list dt,.move-row span:first-child{color:var(--text-muted)}.info-list dt,.detail-list dt,.info-list dd,.detail-list dd{margin:0}.menu-card{align-self:start;gap:18px}.menu-section{display:grid;gap:10px}.menu-divider{height:1px;background:var(--line)}.chip-row,.status-actions,.lobby-actions,.participant-flags{display:flex;flex-wrap:wrap;gap:10px}.mode-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.mode-button{display:grid;gap:6px;padding:16px;border:1px solid var(--line);border-radius:10px;background:#ffffff3d;color:var(--text);text-align:left;transition:background-color .14s ease,border-color .14s ease}.mode-button strong{font-size:1rem;font-weight:600}.mode-button span{color:var(--text-muted);line-height:1.45;font-size:.92rem}.mode-button:hover{background:#fff6}.mode-button.active{background:var(--surface-strong);border-color:#8c552657;box-shadow:inset 0 0 0 1px #8c55261f}.inline-note{color:var(--text-muted);font-size:.88rem}.continue-row,.menu-footer{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:4px}.menu-footer{border-top:1px solid var(--line);padding-top:16px}.range-header,.status-strip,.game-actions,.participant-title,.history-header,.history-title{display:flex;justify-content:space-between;align-items:center;gap:12px}.board-shell{display:grid;grid-template-columns:24px minmax(0,1fr);grid-template-rows:24px minmax(0,1fr);gap:10px;align-items:stretch}.board-corner{grid-column:1;grid-row:1}.board-label-row,.board-label-col{display:grid;color:#22191394;font-size:.8rem;font-weight:600}.board-label-row{grid-column:2;grid-row:1;align-items:center}.board-label-row span,.board-label-col span{display:grid;place-items:center}.board-label-col{grid-column:1;grid-row:2}.go-board{grid-column:2;grid-row:2;position:relative;display:grid;gap:0;aspect-ratio:1;padding:18px;background:linear-gradient(180deg,#d4af73,#c59650);border:1px solid rgba(101,67,29,.5);border-radius:8px}.board-grid-overlay{position:absolute;top:18px;right:18px;bottom:18px;left:18px;width:calc(100% - 36px);height:calc(100% - 36px);pointer-events:none}.board-grid-overlay line{stroke:#482f11c7;stroke-width:1.1;shape-rendering:crispEdges;vector-effect:non-scaling-stroke}.intersection{position:relative;z-index:1;aspect-ratio:1;border:0;padding:0;background:transparent}.intersection.playable:hover:after{content:"";position:absolute;top:24%;right:24%;bottom:24%;left:24%;border-radius:50%;background:#ffffff47}.stone{position:absolute;top:16%;right:16%;bottom:16%;left:16%;border-radius:50%;box-shadow:0 5px 12px #00000047}.stone.black{background:radial-gradient(circle at 30% 30%,#555,#111 64%)}.stone.white{background:radial-gradient(circle at 30% 30%,#fff,#d7d7d7 74%)}.status-copy{display:grid;gap:6px;justify-items:end;text-align:right}.move-list,.history-panel,.history-list,.instruction-list,.lobby-hero{display:grid;gap:12px}.move-list{max-height:420px;overflow:auto}.move-row,.participant-card,.history-card,.room-code-card{border:1px solid var(--line);border-radius:8px;background:#ffffff38}.move-row{display:grid;grid-template-columns:52px 1fr auto;gap:10px;padding:10px 12px;align-items:center}.room-code-card{display:inline-grid;gap:4px;width:fit-content;padding:12px 14px}.room-code-card strong{font-size:1.5rem;letter-spacing:.08em;font-variant-numeric:tabular-nums}.participant-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}.participant-card,.history-card{display:grid;gap:8px;padding:14px}.presence-badge,.flag{display:inline-flex;align-items:center;min-height:26px;padding:0 8px;border:1px solid var(--line);border-radius:999px;background:#ffffff4d;color:var(--text-muted);font-size:.8rem}.presence-badge.online,.flag.active{background:#8c552624;border-color:#8c55263d;color:var(--text)}.instruction-list p{margin:0;line-height:1.55}.history-title span{color:var(--text-muted);font-size:.84rem}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:grid;place-items:center;padding:20px;background:#120e0b8f}.modal-panel{width:min(100%,420px);z-index:1001}.help-panel{width:min(100%,560px)}.error-text{margin:0;color:var(--danger)}@media(max-width:960px){.menu-layout,.game-layout,.mode-grid{grid-template-columns:1fr}.status-strip,.game-actions,.topbar,.continue-row,.menu-footer{align-items:stretch;flex-direction:column}.status-copy{justify-items:start;text-align:left}}@media(max-width:640px){.app-shell{padding:16px}.surface{padding:18px}.board-shell{grid-template-columns:18px minmax(0,1fr);grid-template-rows:18px minmax(0,1fr);gap:8px}.board-label-row,.board-label-col{font-size:.72rem}.move-row{grid-template-columns:44px 1fr auto}}
