.token{justify-content:center;align-items:center;line-height:0;display:inline-flex}.token svg{filter:drop-shadow(0 1px 1px #0f172a33);width:100%;height:100%}.token--sm{width:1rem;height:1rem}.token--md{width:1.75rem;height:1.75rem}.token--appear{animation:.22s ease-out token-appear}.token--remove{animation:.22s ease-in forwards token-remove}@keyframes token-appear{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes token-remove{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.4)}}.cell{aspect-ratio:1;cursor:default;--cell-accent:#2563eb;background:#fff;border:1px solid #cbd5e1;border-radius:10px;place-items:center;width:100%;padding:0;transition:background-color .15s,box-shadow .15s,opacity .15s,transform .15s;display:grid;position:relative;box-shadow:inset 0 1px #ffffffb3}.cell:disabled{cursor:default}.cell--dimmed{opacity:.45}.cell--highlighted{background:color-mix(in srgb, var(--cell-accent) 16%, #fff);border-color:color-mix(in srgb, var(--cell-accent) 70%, #94a3b8);box-shadow:0 0 0 2px color-mix(in srgb, var(--cell-accent) 28%, transparent);opacity:1}.cell--highlighted.cell--remove{background:color-mix(in srgb, var(--cell-accent) 12%, #fff7ed);border-color:color-mix(in srgb, var(--cell-accent) 55%, #ea580c)}.cell--selectable{cursor:pointer}.cell--selectable:hover{background:color-mix(in srgb, var(--cell-accent) 26%, #fff);transform:translateY(-1px)}.cell--selectable:hover:after{content:attr(title);white-space:nowrap;color:#f8fafc;pointer-events:none;z-index:2;background:#0f172a;border-radius:6px;padding:.25rem .45rem;font-size:.7rem;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}.cell--winning{opacity:1;background:#fef9c3;border-color:#eab308;animation:1.2s ease-in-out infinite win-pulse;box-shadow:0 0 0 3px #eab30859}.cell--last-move{opacity:1;animation:1.4s ease-in-out infinite last-move-pulse;box-shadow:0 0 0 3px #0ea5e98c}@keyframes last-move-pulse{0%,to{box-shadow:0 0 0 3px #0ea5e973}50%{box-shadow:0 0 0 5px #0ea5e9b3}}@keyframes win-pulse{0%,to{box-shadow:0 0 0 3px #eab30859}50%{box-shadow:0 0 0 5px #eab3088c}}.board-wrap{width:min(100%,420px);margin:0 auto}.board-grid{grid-template-columns:1.6rem repeat(6,1fr);gap:.4rem;display:grid}.board-row-contents{display:contents}.board-corner{width:1.6rem;height:1.4rem}.board-label{color:#64748b;-webkit-user-select:none;user-select:none;place-items:center;font-size:.8rem;font-weight:600;display:grid}.board-label--col{height:1.4rem}.board-label--row{width:1.6rem}@media (width<=640px){.board-wrap{width:100%}.board-grid{gap:.28rem}.board-corner,.board-label--row{width:1.2rem}}.dice-pair{justify-content:center;gap:.75rem;display:flex}.die{background:#fff;border:1px solid #cbd5e1;border-radius:10px;place-items:center;width:3.25rem;height:3.25rem;display:grid;box-shadow:0 2px 6px #0f172a14}.dice-pair--rolling .die{animation:.12s linear infinite dice-shake}.die-empty{color:#94a3b8;font-size:1.25rem;font-weight:700}.die-pips{grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);gap:2px;width:70%;height:70%;display:grid}.die-pip{aspect-ratio:1;background:0 0;border-radius:50%;width:100%}.die-pip--on{background:#0f172a}@keyframes dice-shake{0%{transform:translate(0)rotate(0)}25%{transform:translate(1px,-1px)rotate(-4deg)}50%{transform:translate(-1px,1px)rotate(4deg)}75%{transform:translate(1px,1px)rotate(-2deg)}to{transform:translate(0)rotate(0)}}.game-over{z-index:20;background:#0f172a59;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.game-over__card{text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:18px;gap:1.1rem;width:min(100%,360px);padding:1.75rem 1.35rem;display:grid;box-shadow:0 16px 40px #0f172a2e}.game-over__message{color:#0f172a;margin:0;font-size:clamp(1.4rem,4vw,1.85rem);font-weight:800}.game-over__hint{color:#64748b;margin:0;font-size:.92rem}.game-over__actions{gap:.55rem;display:grid}.game-status{text-align:center}.game-status__turn{color:#0f172a;margin:0;font-size:1.15rem;font-weight:700}.initiative-screen{place-items:center;min-height:100vh;padding:1.5rem;display:grid}.initiative-screen__card{text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:18px;gap:.9rem;width:min(100%,440px);padding:1.75rem 1.4rem;display:grid;box-shadow:0 10px 30px #0f172a0f}.initiative-screen__eyebrow{color:#64748b;letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.8rem}.initiative-screen__title{color:#0f172a;margin:0;font-size:1.7rem}.initiative-screen__desc{color:#475569;margin:0;font-size:.95rem;line-height:1.45}.initiative-screen__list{text-align:left;gap:.45rem;margin:0;padding:0;list-style:none;display:grid}.initiative-screen__row{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;grid-template-columns:auto 1fr auto;align-items:center;gap:.55rem;padding:.55rem .7rem;display:grid}.initiative-screen__dot{border-radius:50%;width:.85rem;height:.85rem}.initiative-screen__name{color:#0f172a;font-size:.92rem;font-weight:600}.initiative-screen__roll{color:#64748b;font-size:.85rem}.initiative-screen__countdown{color:#2563eb;letter-spacing:-.02em;margin:0;font-size:1.65rem;font-weight:800}.initiative-screen__row--winner{background:#eff6ff;border-color:#93c5fd}.color-picker{text-align:left;border:none;gap:.45rem;margin:0;padding:0;display:grid}.color-picker legend{color:#334155;margin-bottom:.35rem;padding:0;font-size:.9rem;font-weight:600}.color-picker__grid{grid-template-columns:repeat(5,1fr);gap:.4rem;display:grid}.color-picker__swatch{aspect-ratio:1;cursor:pointer;border:2px solid #0000;border-radius:10px;padding:0;box-shadow:inset 0 0 0 1px #0f172a1f}.color-picker__swatch--active{border-color:#0f172a;box-shadow:0 0 0 2px #fff,0 0 0 4px #0f172a}.color-picker__swatch:disabled{opacity:.28;cursor:not-allowed}.lobby-screen{place-items:center;min-height:100vh;padding:1.5rem;display:grid}.lobby-screen__card{text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:18px;gap:.9rem;width:min(100%,440px);padding:1.75rem 1.4rem;display:grid;box-shadow:0 10px 30px #0f172a0f}.lobby-screen__eyebrow{color:#64748b;letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.8rem}.lobby-screen__title{color:#0f172a;margin:0;font-size:1.8rem}.lobby-screen__name{text-align:left;color:#334155;gap:.4rem;font-size:.95rem;font-weight:600;display:grid}.lobby-screen__name-row{grid-template-columns:1fr auto;gap:.5rem;display:grid}.lobby-screen__name input{color:#0f172a;background:#f8fafc;border:1px solid #cbd5e1;border-radius:12px;padding:.65rem .75rem;font-size:1rem}.lobby-screen__code-block{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;justify-items:center;gap:.45rem;padding:.85rem;display:grid}.lobby-screen__code-label{color:#64748b;font-size:.8rem}.lobby-screen__code{letter-spacing:.18em;color:#0f172a;font-size:1.8rem}.lobby-screen__seats{text-align:left;gap:.45rem;margin:0;padding:0;list-style:none;display:grid}.lobby-screen__seat{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;grid-template-columns:auto 1fr auto;align-items:center;gap:.5rem;padding:.55rem .7rem;font-size:.92rem;display:grid}.lobby-screen__color{border-radius:50%;width:.85rem;height:.85rem;box-shadow:inset 0 0 0 1px #0f172a26}.lobby-screen__badge{color:#94a3b8;font-size:.75rem}.lobby-screen__badge--on{color:#15803d}.lobby-screen__wait,.lobby-screen__hint{color:#64748b;margin:0;font-size:.9rem}.lobby-screen__error{color:#b91c1c;margin:0;font-size:.9rem}.name-gate{background:radial-gradient(80% 50% at 20% 0,#2563eb24,#0000),radial-gradient(60% 40% at 90% 10%,#0ea5e91a,#0000),#e8eef6;place-items:center;min-height:100vh;padding:1.5rem;display:grid}.name-gate__card{text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:20px;gap:1rem;width:min(100%,400px);padding:2rem 1.5rem;animation:.42s ease-out name-gate-in;display:grid;box-shadow:0 16px 40px #0f172a14}@keyframes name-gate-in{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.name-gate__eyebrow{color:#64748b;letter-spacing:.06em;text-transform:uppercase;margin:0;font-size:.85rem}.name-gate__title{color:#0f172a;letter-spacing:-.03em;margin:0;font-size:clamp(2.2rem,7vw,2.8rem)}.name-gate__desc{color:#475569;margin:0;line-height:1.5}.name-gate__field{text-align:left;color:#334155;gap:.4rem;font-size:.95rem;font-weight:600;display:grid}.name-gate__field input{color:#0f172a;background:#f8fafc;border:1px solid #cbd5e1;border-radius:12px;padding:.75rem .9rem;font-size:1.1rem}.name-gate__field input:focus{border-color:#2563eb;outline:2px solid #2563eb59}.player-list{gap:.45rem;margin:0;padding:0;list-style:none;display:grid}.player-list__item{background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px;grid-template-columns:auto 1fr auto;align-items:center;gap:.55rem;padding:.45rem .6rem;display:grid}.player-list__item--active{background:#eff6ff;border-color:#93c5fd}.player-list__name{color:#0f172a;font-size:.92rem;font-weight:600}.player-list__shape{color:#64748b;font-size:.78rem}.start-screen{place-items:center;min-height:100vh;padding:1.5rem;display:grid}.start-screen__card{text-align:center;background:#fff;border:1px solid #e2e8f0;border-radius:18px;gap:1rem;width:min(100%,420px);padding:2rem 1.5rem;display:grid;box-shadow:0 10px 30px #0f172a0f}.start-screen__eyebrow{color:#64748b;letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.85rem}.start-screen__title{color:#0f172a;letter-spacing:-.03em;margin:0;font-size:clamp(2rem,6vw,2.6rem)}.start-screen__desc{color:#475569;margin:0;line-height:1.5}.start-screen__hello{color:#334155;background:#f1f5f9;border-radius:12px;flex-wrap:wrap;justify-content:center;align-items:center;gap:.35rem .75rem;padding:.55rem .75rem;font-size:.95rem;display:flex}.start-screen__players{border:none;gap:.65rem;margin:.5rem 0 0;padding:0;display:grid}.start-screen__players legend{color:#334155;padding:0;font-size:.95rem;font-weight:600}.start-screen__options{grid-template-columns:repeat(3,1fr);gap:.5rem;display:grid}.start-screen__options--2{grid-template-columns:repeat(2,1fr)}.start-screen__option{cursor:pointer;color:#0f172a;background:#f8fafc;border:1px solid #cbd5e1;border-radius:12px;place-items:center;padding:.7rem .5rem;font-weight:700;display:grid}.start-screen__option span{text-align:center;font-size:.85rem;line-height:1.2}.start-screen__option input{opacity:0;pointer-events:none;position:absolute}.start-screen__option:has(input:checked){background:#eff6ff;border-color:#2563eb;box-shadow:0 0 0 2px #2563eb26}.start-screen__mode-grid{gap:.55rem;display:grid}.start-screen__join{text-align:left;color:#334155;gap:.4rem;font-size:.95rem;font-weight:600;display:grid}.start-screen__join input{letter-spacing:.12em;text-align:center;text-transform:uppercase;color:#0f172a;background:#f8fafc;border:1px solid #cbd5e1;border-radius:12px;padding:.7rem .8rem;font-size:1.1rem}.start-screen__error{color:#b91c1c;margin:0;font-size:.9rem}.start-screen__colors{text-align:left;gap:.75rem;display:grid}.start-screen__hint{color:#64748b;margin:0;font-size:.88rem}:root{color:#0f172a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at 0 0,#2563eb14,#0000 28%),radial-gradient(circle at 100% 0,#0f172a0d,#0000 24%),#eef2f7;font-family:Segoe UI,Trebuchet MS,Avenir Next,sans-serif;font-weight:400;line-height:1.45}*,:before,:after{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-width:320px}button,input,select{font:inherit}.btn{appearance:none;cursor:pointer;border:1px solid #0000;border-radius:12px;padding:.7rem 1rem;font-weight:650;transition:background-color .14s,border-color .14s,opacity .14s,transform .14s}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{color:#fff;background:#2563eb}.btn--primary:not(:disabled):hover{background:#1d4ed8}.btn--secondary{color:#0f172a;background:#fff;border-color:#cbd5e1}.btn--secondary:not(:disabled):hover{background:#f8fafc}.btn--ghost{color:#334155;background:0 0;border-color:#cbd5e1}.btn--ghost:hover{background:#f8fafc}.app-chrome{z-index:40;position:fixed;top:.75rem;right:.75rem}.btn--icon{min-width:2.5rem;padding-inline:.55rem}.app{width:min(1120px,100% - 2rem);margin:0 auto;padding:1.25rem 0 2rem}.app__header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.app__header-actions{flex-wrap:wrap;gap:.5rem;display:flex}.app__banner-error{color:#b91c1c;background:#fef2f2;border:1px solid #fecaca;border-radius:10px;margin:0 0 .75rem;padding:.65rem .8rem}.app__turn-hint{text-align:center;color:#64748b;margin:0;font-size:.9rem}.app__eyebrow{color:#64748b;letter-spacing:.04em;text-transform:uppercase;margin:0;font-size:.8rem}.app__title{letter-spacing:-.02em;margin:.15rem 0 0;font-size:1.45rem}.app__layout{grid-template-columns:220px minmax(0,1fr);align-items:start;gap:1rem;display:grid}.panel{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:1rem;box-shadow:0 8px 24px #0f172a0d}.panel--board{flex-direction:column;align-items:center;padding:1.15rem;display:flex}.board-toolbar{justify-items:center;gap:.75rem;width:100%;margin-bottom:1rem;display:grid}.board-toolbar .btn--primary{min-width:12rem}.panel--side{align-content:start;gap:1rem;display:grid}.panel__title{color:#0f172a;margin:0;font-size:.95rem}@media (width<=960px){.app__layout{grid-template-columns:1fr}.panel--side{order:2}.panel--board{order:1}}@media (width<=640px){.app{width:min(100% - 1rem,1120px);padding-top:.85rem}.app__header{align-items:flex-start}.app__title{font-size:1.25rem}}