:root{color-scheme:light;--bg: #f7f4ee;--bg-accent: #f2e8d8;--ink: #1f1d1a;--accent: #d4553f;--accent-soft: rgba(212, 85, 63, .2);--board: #d8c5a5;--board-dark: #bba27a;--camp: #9b9a84;--throne: #6b4f3d;--white: #fefcf8;--black: #2b2b2b;--king: #f2d27a;font-family:Lucida Console,Courier New,monospace,-apple-system,Segoe UI,sans-serif}body{margin:0;background:radial-gradient(circle at top,#fff5e1,var(--bg));color:var(--ink);min-height:100vh}#root{min-height:100vh}.page{display:flex;flex-direction:column;gap:1.5rem;padding:1.5rem 5vw .5rem;min-height:100vh}.hero{display:flex;flex-wrap:wrap;gap:2rem;align-items:center;justify-content:space-between}.eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:.75rem;margin:0 0 .5rem}h1{font-size:clamp(2rem,3.5vw,3.4rem);margin:0}.subtitle{max-width:36rem;margin:0;font-size:1rem;color:#1f1d1abf}.hero-meta{display:flex;flex-wrap:wrap;gap:.5rem .8rem;align-items:baseline;margin-top:.5rem}.rules-link{color:#1f1d1abf;text-decoration:none}.rules-link:hover{color:var(--accent);text-decoration:underline;text-underline-offset:3px}.status-card{background:var(--bg-accent);padding:1.25rem 1.5rem;border-radius:18px;min-width:220px;box-shadow:0 10px 24px #1f1d1a1f}.status-inline{min-width:unset;margin-bottom:.75rem}.status-label{font-size:.8rem;text-transform:uppercase;letter-spacing:.15em;color:#1f1d1a80}.status-value{font-size:1.3rem;font-weight:700;margin-top:.35rem}.status-sub{margin-top:.5rem;font-size:.95rem;color:#1f1d1ab3}.metrics-card{background:var(--bg-accent);padding:0;border-radius:18px;margin-bottom:.75rem;box-shadow:0 10px 24px #1f1d1a1f;overflow:hidden}.metrics-toggle{background:transparent;border:none;cursor:pointer;width:100%;padding:1.25rem 1.5rem;display:flex;justify-content:space-between;align-items:center;font-size:1rem;font-weight:600;color:var(--ink);text-align:left;transition:background-color .2s ease}.metrics-toggle:hover{background-color:#1f1d1a0d}.metrics-label{font-size:.95rem;text-transform:uppercase;letter-spacing:.1em;color:#1f1d1ad9}.metrics-arrow{font-size:.8rem;color:#1f1d1a80;transition:transform .2s ease;display:inline-block}.metrics-content{background:#1f1d1a08;padding:0 1.5rem 1.25rem;border-top:1px solid rgba(31,29,26,.1)}.metric-item{font-size:.9rem;color:#1f1d1acc;padding:.5rem 0;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;word-break:break-word}.controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.control{background:#fff;border-radius:16px;padding:.85rem 1.1rem;box-shadow:0 12px 18px #1f1d1a14}.control label{display:block;font-weight:600;margin-bottom:.6rem}.control-row{display:flex;gap:.75rem;align-items:center}input[type=range]{flex:1}input[type=number]{width:80px;border-radius:8px;border:1px solid rgba(0,0,0,.2);padding:.35rem .5rem;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.button-group{display:flex;gap:.5rem}.play-as{align-items:center;flex-wrap:wrap}button{border:none;background:var(--ink);color:#fff;padding:1vmin 2vmin;border-radius:.5rem;font-weight:600;font-family:Lucida Console,Courier New,monospace,-apple-system,Segoe UI,sans-serif;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}button:hover{transform:translateY(-.25vmin);box-shadow:0 1vmin 2vmin #1f1d1a26}button.active,.primary-action{background:var(--accent)}.primary-action:disabled{opacity:.6;cursor:default;box-shadow:none;transform:none}.play-button{display:inline-flex;align-items:center;gap:.5rem;border:2px solid transparent;background:#f2efe8;color:var(--ink)}.play-button.white.active{background:var(--white);color:var(--ink);border-color:#1f1d1a33}.play-button.black.active{background:var(--black);color:#fff;border-color:#1f1d1a66}.play-button.active{box-shadow:0 0 0 2px #d4553f59}.play-chip{width:14px;height:14px;border-radius:999px;display:inline-block;border:2px solid rgba(31,29,26,.2)}.play-chip.white{background:var(--white)}.play-chip.black{background:var(--black);border-color:#ffffff4d}.play-selected{margin-top:.6rem;display:flex;align-items:center;gap:.5rem;font-size:.9rem;color:#1f1d1ab3}.board-wrap{display:grid;grid-template-columns:1fr auto;gap:3%;align-items:start}.board-paused .board{opacity:.75;filter:grayscale(.1) saturate(.85)}.board-paused .legend{opacity:.8}.board{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:.5vmin;background:var(--board-dark);padding:1vmin;border-radius:3vmin;box-shadow:0 1vmin 2vmin #1f1d1a33;width:min(100%,90vmin)}@media (max-width: 900px){.board-wrap{grid-template-columns:1fr}}.cell{aspect-ratio:1;background:var(--board);border-radius:2vmin;display:flex;align-items:center;justify-content:center;position:relative;padding:2vmin}.cell.camp{background:linear-gradient(135deg,#b5b196,var(--camp))}.cell.throne{background:linear-gradient(135deg,#7b5f4a,var(--throne))}.cell.selected{border-color:var(--accent);box-shadow:0 0 0 .3vmin var(--accent-soft)}.cell.move:after{content:"";width:40%;height:40%;border-radius:999px;background:var(--accent);opacity:.75}.piece{width:90%;height:90%;border-radius:999px;display:grid;place-items:center;font-size:4vmin;padding:none}.piece.white{background:var(--white);color:#1f1d1a}.piece.black{background:var(--black);color:#fff}.piece.king{background:var(--king);color:#553c1f}.legend{background:#fff;border-radius:16px;padding:1.25rem;box-shadow:0 12px 18px #1f1d1a14;display:grid;gap:.75rem}.legend h3{margin:0 0 .5rem}.legend-item{display:flex;align-items:center;gap:.6rem}.legend-item .piece{width:22px;height:22px;font-size:.75rem}.camp-chip,.throne-chip{font-size:.9rem;font-weight:600}.camp-chip:before,.throne-chip:before{content:"";display:inline-block;width:14px;height:14px;border-radius:4px;margin-right:.5rem}.camp-chip:before{background:var(--camp)}.throne-chip:before{background:var(--throne)}.footer{font-size:.5rem;color:#1f1d1a99;display:flex;align-items:center;justify-content:space-between;padding:1rem .5rem 0rem;gap:.5rem;flex-wrap:wrap}.footer-link{color:inherit}.footer-link:hover{color:var(--accent);text-decoration:underline}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#110e0a8c;display:grid;place-items:center;z-index:10;padding:1.5rem}.modal{background:#fff;border-radius:18px;padding:1.5rem 1.75rem;max-width:420px;width:100%;box-shadow:0 20px 40px #110e0a40;display:grid;gap:.75rem;text-align:left}.modal-eyebrow{text-transform:uppercase;letter-spacing:.2em;font-size:.7rem;margin:0;color:#1f1d1a80}.modal h2{margin:0;font-size:1.6rem}.modal-actions{display:flex;gap:.75rem;flex-wrap:wrap}