*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 20% 0,#304c2b,#120d08 55%,#050302);color:#fff4df;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}button,select{font:inherit}button{cursor:pointer;border:1px solid rgba(255,255,255,.18);border-radius:14px;background:rgba(255,255,255,.09);color:#fff;padding:10px 13px;font-weight:900}.primary{border:0;background:linear-gradient(135deg,#ffe08a,#bc7a2a);color:#231407}.app{min-height:100vh;padding:14px;display:grid;gap:14px}header{width:min(1220px,100%);margin:auto;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}h1{margin:0;font-size:clamp(32px,5vw,64px);letter-spacing:-.06em}p{color:#dacaa8}.wrap{width:min(1220px,100%);margin:auto;display:grid;grid-template-columns:240px minmax(320px,1fr) 300px;gap:14px;align-items:start}.panel{border:1px solid rgba(255,255,255,.15);border-radius:24px;background:rgba(18,12,7,.76);box-shadow:0 24px 80px rgba(0,0,0,.35);padding:14px}.menu{display:grid;gap:10px}.menu label{display:grid;gap:5px;color:#d8c5a4;font-size:13px;font-weight:900}.menu select{width:100%;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:#24170b;color:#fff;padding:10px}.hint{font-size:13px;line-height:1.55}.boardbox{position:relative;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);border-radius:28px;background:rgba(255,255,255,.06);padding:14px;min-height:76vh}.board{width:min(76vh,100%);aspect-ratio:1/1;display:grid;grid-template-columns:repeat(var(--c),1fr);grid-template-rows:repeat(var(--r),1fr);border:4px solid #38220c;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,#d8a35d,#9c6129);box-shadow:inset 0 0 36px rgba(73,38,11,.5),0 18px 60px rgba(0,0,0,.35)}.board.janggi{aspect-ratio:9/10}.cell{position:relative;display:grid;place-items:center;border:1px solid rgba(70,42,15,.44);background:rgba(255,232,179,.08);min-width:0}.cell.legal{box-shadow:inset 0 0 0 3px rgba(76,164,255,.9)}.cell.legal:after{content:'';width:26%;height:26%;border-radius:50%;background:rgba(39,112,196,.55)}.cell.sel{box-shadow:inset 0 0 0 4px #fff}.cell.last{box-shadow:inset 0 0 0 4px #ffe08a}.pal{background-image:linear-gradient(45deg,transparent 48%,rgba(60,34,12,.32) 49%,rgba(60,34,12,.32) 51%,transparent 52%),linear-gradient(-45deg,transparent 48%,rgba(60,34,12,.32) 49%,rgba(60,34,12,.32) 51%,transparent 52%)}.stone-B,.stone-W{width:72%;height:72%;border-radius:50%;box-shadow:inset -6px -8px 11px rgba(0,0,0,.32),inset 4px 4px 9px rgba(255,255,255,.22),0 4px 10px rgba(0,0,0,.32)}.stone-B{background:#15100b}.stone-W{background:#f7ead0}.jang-B,.jang-W{width:78%;height:78%;border-radius:999px;display:grid;place-items:center;border:2px solid rgba(63,32,10,.55);background:#f5d08c;font-weight:1000;font-size:clamp(16px,3.2vw,34px);box-shadow:inset 0 2px 8px rgba(255,255,255,.32),inset 0 -7px 11px rgba(80,36,7,.22),0 5px 11px rgba(0,0,0,.28)}.jang-B{color:#0f4d93}.jang-W{color:#9d2518}.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0}.stats div{border:1px solid rgba(255,255,255,.14);border-radius:16px;background:rgba(255,255,255,.06);padding:10px}.stats b{display:block;color:#cdbd9d;font-size:12px}.stats span{font-size:17px;font-weight:1000}.log{height:260px;overflow:auto;border-radius:16px;background:rgba(0,0,0,.22);padding:10px;color:#d8c7a5;font-size:12px;line-height:1.45}.modal{position:fixed;inset:0;display:none;place-items:center;background:rgba(5,3,1,.72);backdrop-filter:blur(9px);z-index:5}.modal.show{display:grid}.modal section{width:min(520px,92vw);border:1px solid rgba(255,255,255,.16);border-radius:28px;background:#171008;text-align:center;padding:24px;box-shadow:0 30px 90px rgba(0,0,0,.5)}@media(max-width:980px){.wrap{grid-template-columns:1fr}.boardbox{min-height:auto}.board{width:min(94vw,70vh)}.side{display:grid;grid-template-columns:1fr 1fr}.log{height:140px}}@media(max-width:640px){.app{padding:10px}.panel,.boardbox{border-radius:20px}.side{grid-template-columns:1fr}.board{width:94vw}.log{height:120px}}