:root{--bg:#f5f1e8;--surface:#fffdf8;--fg:#2b2620;--muted:#6f665a;--border:#ddd4c4;--accent:#7a4e2d;--accent-fg:#fffdf8;--error:#b3261e;--success:#2e7d32;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#1d1b18;--surface:#282520;--fg:#ece6da;--muted:#a59c8e;--border:#3d3830;--accent:#d9a877;--accent-fg:#1d1b18;--error:#f28b82;--success:#81c995}}*,:before,:after{box-sizing:border-box}body{background:var(--bg);min-height:100dvh;margin:0}h1{margin:0;font-size:1.6rem}p{margin:0}a{color:var(--accent)}input,button{font:inherit;border-radius:8px;min-height:44px}input{border:1px solid var(--border);background:var(--surface);width:100%;color:var(--fg);padding:8px 12px}button{background:var(--accent);color:var(--accent-fg);cursor:pointer;border:none;padding:8px 16px;font-weight:600}button:disabled{opacity:.6;cursor:default}button.secondary{color:var(--fg);border:1px solid var(--border);background:0 0}button.link{color:var(--accent);background:0 0;font-weight:400;text-decoration:underline}.muted{color:var(--muted)}.error{color:var(--error)}.success{color:var(--success)}.center{text-align:center;padding:32px 16px}.stack{flex-direction:column;gap:12px;display:flex}.card{border:1px solid var(--border);background:var(--surface);border-radius:12px;padding:16px}.list{border:1px solid var(--border);background:var(--surface);border-radius:12px;margin:0;padding:0;list-style:none}.list li{border-top:1px solid var(--border);padding:12px 16px}.list li:first-child{border-top:none}.topbar{padding:8px 16px;padding-top:max(8px, env(safe-area-inset-top));border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex;position:sticky;top:0}.topbar a{color:var(--fg);text-decoration:none}.topbar .brand{color:var(--accent);font-weight:700}.topbar nav{gap:4px;display:flex}.topbar nav a{border-radius:8px;padding:6px 10px}.topbar nav a.active{background:var(--bg);font-weight:600}.content{max-width:640px;margin:0 auto;padding:16px}.login{flex-direction:column;gap:16px;max-width:400px;margin:0 auto;padding:48px 16px;display:flex}.login h1{text-align:center;color:var(--accent);font-size:2rem}h2{margin:8px 0 0;font-size:1.15rem}.row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.row.spread{justify-content:space-between}button.small{min-height:36px;padding:4px 12px;font-size:.9rem}.choices{border:none;flex-direction:column;gap:4px;margin:0;padding:0;display:flex}.choices legend{margin-bottom:4px;font-weight:600}.choices label{align-items:center;gap:8px;min-height:40px;display:flex}.choices input{width:auto;min-height:0;accent-color:var(--accent)}.list li.my-turn{border-left:4px solid var(--accent);background:color-mix(in srgb, var(--accent) 10%, var(--surface))}.badge{background:var(--accent);color:var(--accent-fg);border-radius:999px;margin-left:8px;padding:1px 8px;font-size:.8rem;font-weight:600;display:inline-block}.list li.linked{padding:0}.list li.linked>a{color:inherit;padding:12px 16px;text-decoration:none;display:block}.status{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:8px 12px;font-weight:600}.status.my-turn{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 12%, var(--surface))}.status.end{border-color:var(--accent);background:var(--accent);color:var(--accent-fg)}.board{touch-action:none;width:100%;max-width:560px;margin:0 auto}button.promo{min-width:56px;font-size:2rem;line-height:1}.moves{font-variant-numeric:tabular-nums;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:2px 16px;margin:0;padding:0;list-style:none;display:grid}.moves li{grid-template-columns:2.5em 1fr 1fr;display:grid}.move-no{color:var(--muted)}button.danger{background:var(--error);color:#fff}.toggle{align-items:center;gap:10px;min-height:44px;display:flex}.toggle input{width:22px;height:22px;min-height:0;accent-color:var(--accent)}.small{font-size:.875rem}
