.chessboard{width:min(92vw,720px);max-width:100%;aspect-ratio:1/1;display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);border:2px solid #d7b45a;border-radius:18px;overflow:hidden;touch-action:none;user-select:none;background:#222}.square{display:flex;align-items:center;justify-content:center;position:relative;font-size:clamp(1.9rem,8.5vw,4.2rem);cursor:pointer}.square.light{background:#e7d6ad;color:#111}.square.dark{background:#6b4a2f;color:#111}.square.selected{outline:4px solid #5aa7ff;outline-offset:-4px}.square.legal::after{content:"";width:28%;height:28%;border-radius:50%;background:rgba(52,180,92,.75);position:absolute}.square.capture::after{content:"";width:74%;height:74%;border-radius:50%;border:5px solid rgba(240,93,94,.85);position:absolute}.square.last{box-shadow:inset 0 0 0 999px rgba(215,180,90,.22)}.piece{z-index:1;text-shadow:0 2px 6px rgba(255,255,255,.22);line-height:1}.piece.dragging{opacity:.5}.promotion{position:fixed;inset:0;background:rgba(0,0,0,.55);display:flex;align-items:center;justify-content:center;z-index:100}.promotion-box{background:#171b24;border:1px solid #30384a;border-radius:20px;padding:1rem;display:flex;gap:.5rem}.promotion-box button{font-size:2rem;border-radius:14px;border:1px solid #30384a;background:#202636;color:#f3f5f7;padding:.5rem .8rem}@media(max-width:600px){.chessboard{width:calc(100vw - 1.5rem);border-radius:14px}.square{font-size:clamp(2rem,10.5vw,3.5rem)}}