:root{--bg:#12151d;--bg-raised:#1b1f2a;--bg-raised-2:#252b3a;--text:#eef1f7;--text-dim:#a3adc2;--border:#333b4d;--light-square:#d8cfc0;--dark-square:#9a8f7d;--square-selected:#ffd54a;--square-target:#4ade80;--square-last:#6ea8ff;--seat-s:#2f7ae5;--seat-w:#e8862a;--seat-n:#2fae6a;--seat-e:#a35bd4;--radius:10px;--font:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;overscroll-behavior:none;overflow-x:hidden}#root{flex-direction:column;min-height:100dvh;display:flex}button{font:inherit;color:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.btn{appearance:none;border:1px solid var(--border);background:var(--bg-raised-2);color:var(--text);border-radius:var(--radius);cursor:pointer;min-height:44px;padding:.85rem 1.25rem;font-size:1rem;font-weight:600}.btn:active{transform:translateY(1px)}.btn--primary{background:var(--seat-s);border-color:#0000}.btn--ghost{background:0 0}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.001ms!important;animation-duration:.001ms!important}}.board{--square-size:min(11vw, 11dvh, 4rem);aspect-ratio:1;border-radius:var(--radius);touch-action:manipulation;-webkit-tap-highlight-color:transparent;grid-template-rows:repeat(8,1fr);grid-template-columns:repeat(8,1fr);width:min(100vw - 1rem,100dvh - 1rem,640px);max-width:100%;margin:0 auto;display:grid;overflow:hidden}.square{appearance:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;cursor:pointer;border:none;justify-content:center;align-items:center;min-width:32px;min-height:32px;margin:0;padding:0;display:flex;position:relative}.square:disabled{cursor:default}.square--light{background:var(--light-square)}.square--dark{background:var(--dark-square)}.square:before{content:"";pointer-events:none;opacity:0;transition:opacity .15s;position:absolute;inset:0}.square[data-edge-seat=S]:before{box-shadow:inset 0 -4px 0 0 var(--seat-s);opacity:.85}.square[data-edge-seat=W]:before{box-shadow:inset 4px 0 0 0 var(--seat-w);opacity:.85}.square[data-edge-seat=N]:before{box-shadow:inset 0 4px 0 0 var(--seat-n);opacity:.85}.square[data-edge-seat=E]:before{box-shadow:inset -4px 0 0 0 var(--seat-e);opacity:.85}.square[data-edge-seat][data-edge-alive=false]:before{opacity:.25}.square[data-edge-seat][data-edge-active=true]:before{opacity:1}.square:after{content:"";pointer-events:none;position:absolute;inset:0}.square--selected:after{outline:3px solid var(--square-selected);outline-offset:-3px}.square--target:after{background:0 0}.square[data-state=last-to]:after{background:color-mix(in srgb, var(--square-last) 38%, transparent)}.square[data-state=last-to][data-marker-seat=S]:after{background:color-mix(in srgb, var(--seat-s) 38%, transparent)}.square[data-state=last-to][data-marker-seat=W]:after{background:color-mix(in srgb, var(--seat-w) 38%, transparent)}.square[data-state=last-to][data-marker-seat=N]:after{background:color-mix(in srgb, var(--seat-n) 38%, transparent)}.square[data-state=last-to][data-marker-seat=E]:after{background:color-mix(in srgb, var(--seat-e) 38%, transparent)}.square__origin{opacity:.85;pointer-events:none;border:2px dashed;border-radius:50%;position:absolute;inset:12%}.square__origin[data-seat=S]{color:var(--seat-s)}.square__origin[data-seat=W]{color:var(--seat-w)}.square__origin[data-seat=N]{color:var(--seat-n)}.square__origin[data-seat=E]{color:var(--seat-e)}.square[data-state=target]:after{background-image:radial-gradient(circle, color-mix(in srgb, var(--square-target) 70%, transparent) 18%, transparent 19%)}.square[data-state=capture-target]:after{outline:4px solid color-mix(in srgb, var(--square-target) 80%, transparent);outline-offset:-4px;border-radius:50%}.square__piece-slot{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.square__piece-slot--sliding{z-index:5;animation:.17s ease-out piece-slide;position:relative}@keyframes piece-slide{0%{transform:translate(calc(var(--slide-dx) * 100%), calc(var(--slide-dy) * 100%))}to{transform:translate(0)}}@media (prefers-reduced-motion:reduce){.square__piece-slot--sliding{animation:none}}.piece{pointer-events:none;-webkit-user-select:none;user-select:none;z-index:1;flex-direction:column;justify-content:center;align-items:center;gap:1px;display:flex}.piece__chip{aspect-ratio:1;border-radius:50%;justify-content:center;align-items:center;width:78%;display:flex;position:relative;box-shadow:0 1px 2px #0006}.piece__chip--S{background:var(--seat-s)}.piece__chip--W{background:var(--seat-w)}.piece__chip--N{background:var(--seat-n)}.piece__chip--E{background:var(--seat-e)}.piece__glyph{color:#fff;filter:drop-shadow(0 1px 1px #00000080);font-size:clamp(.9rem,5.5vw,1.9rem);line-height:1}.piece__promo-marker{color:#fff;background:#0000008c;border-radius:50%;justify-content:center;align-items:center;width:1.1em;height:1.1em;font-size:.7em;line-height:1;display:flex;position:absolute;top:-2px;right:-2px}.piece__card{background:#f4f1ea;border-radius:4px;padding:1px 3px;font-size:clamp(.55rem,2.6vw,.8rem);font-weight:700;line-height:1}.piece__card--black{color:#1a1a1a}.piece__card--red{color:#b3261e}@media (prefers-reduced-motion:reduce){.square:before{transition:none}}.turn-banner{border-radius:var(--radius);background:var(--bg-raised);border:1px solid var(--border);text-align:center;border-left:6px solid var(--border);padding:.75rem 1rem;font-weight:700}.turn-banner--S{border-left-color:var(--seat-s);color:var(--seat-s)}.turn-banner--W{border-left-color:var(--seat-w);color:var(--seat-w)}.turn-banner--N{border-left-color:var(--seat-n);color:var(--seat-n)}.turn-banner--E{border-left-color:var(--seat-e);color:var(--seat-e)}.turn-banner--done{color:var(--text);border-left-color:var(--border)}.event-banner{border-radius:var(--radius);background:var(--bg-raised-2);border:1px solid var(--border);box-sizing:border-box;flex-direction:row;align-items:center;gap:.5rem;width:100%;max-height:2.5rem;padding:.4rem .75rem;font-size:.9rem;display:flex;overflow:hidden}.event-banner__item+.event-banner__item:before{content:"· ";color:var(--text-dim)}.event-banner__item{color:var(--text);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.player-panel{grid-template-columns:repeat(2,1fr);gap:.5rem;display:grid}@media (width>=640px){.player-panel{grid-template-columns:repeat(4,1fr)}}.player-card{border-radius:var(--radius);background:var(--bg-raised);border:1px solid var(--border);flex-direction:column;gap:.35rem;min-width:0;padding:.6rem;display:flex}.player-card--turn{border-color:currentColor;box-shadow:inset 0 0 0 1px}.player-card--S{color:var(--seat-s)}.player-card--W{color:var(--seat-w)}.player-card--N{color:var(--seat-n)}.player-card--E{color:var(--seat-e)}.player-card--eliminated{opacity:.45;filter:grayscale()}.player-card__header{color:var(--text);flex-wrap:wrap;align-items:center;gap:.35rem;font-size:.85rem;font-weight:700;display:flex}.player-card__swatch{border-radius:50%;flex:none;width:.7rem;height:.7rem;display:inline-block}.player-card__swatch--S{background:var(--seat-s)}.player-card__swatch--W{background:var(--seat-w)}.player-card__swatch--N{background:var(--seat-n)}.player-card__swatch--E{background:var(--seat-e)}.player-card__letter{color:var(--text-dim);font-weight:400}.player-card__marker{text-transform:uppercase;background:var(--bg-raised-2);color:var(--text);border-radius:999px;margin-left:auto;padding:.1rem .4rem;font-size:.7rem;font-weight:700}.player-card__marker--out{background:var(--border)}.player-card__pieces{color:var(--text-dim);font-size:.8rem}.player-card__captures{flex-wrap:wrap;gap:.25rem;min-height:1.4rem;display:flex}.player-card__captures-empty{color:var(--text-dim);font-size:.75rem}.player-card__capture{background:var(--bg-raised-2);border:1px solid var(--border);border-radius:4px;padding:.05rem .3rem;font-size:.75rem}.player-card__capture--red{color:#e05a5a}.player-card__capture--black{color:var(--text)}.screen{padding:1.25rem 1rem calc(1.25rem + env(safe-area-inset-bottom));box-sizing:border-box;flex-direction:column;gap:1rem;width:100%;max-width:480px;min-height:100%;margin:0 auto;display:flex}.screen__title{margin:0;font-size:1.6rem}.screen__subtitle{color:var(--text-dim);margin:0}.screen__actions{flex-direction:column;gap:.6rem;margin-top:auto;display:flex}.screen__actions .btn{width:100%}.rules-body{flex-direction:column;flex:1;gap:1.1rem;min-height:0;padding-right:.1rem;display:flex;overflow-y:auto}.rules-section h2{margin:0 0 .35rem;font-size:1rem}.rules-section p,.rules-section li{color:var(--text-dim);font-size:.9rem;line-height:1.4}.rules-section ul{flex-direction:column;gap:.35rem;margin:0;padding-left:1.1rem;display:flex}.rules-table{border-collapse:collapse;width:100%;font-size:.85rem}.rules-table th,.rules-table td{text-align:left;border-bottom:1px solid var(--border);padding:.3rem .4rem}.rules-table th{color:var(--text-dim);font-weight:600}.deal-hands{grid-template-columns:repeat(2,1fr);gap:.5rem;display:grid;overflow-y:auto}.deal-hand{border-radius:var(--radius);background:var(--bg-raised);border:1px solid var(--border);flex-direction:column;gap:.35rem;min-width:0;padding:.6rem;display:flex}.deal-hand__header{align-items:center;gap:.35rem;font-size:.85rem;font-weight:700;display:flex}.deal-hand__swatch{border-radius:50%;flex:none;width:.7rem;height:.7rem;display:inline-block}.deal-hand__swatch--S{background:var(--seat-s)}.deal-hand__swatch--W{background:var(--seat-w)}.deal-hand__swatch--N{background:var(--seat-n)}.deal-hand__swatch--E{background:var(--seat-e)}.deal-hand__cards{flex-wrap:wrap;gap:.25rem;display:flex}.deal-hand__card{background:var(--bg-raised-2);border:1px solid var(--border);border-radius:4px;padding:.1rem .3rem;font-size:.75rem}.deal-hand__card--red{color:#e05a5a}.deal-hand__card--black{color:var(--text)}.deal-hand__total{color:var(--text-dim);font-size:.8rem}.deal-announcement{text-align:center;margin:0;font-weight:600}.seat-setup{background:var(--bg-raised);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:.5rem;padding:.75rem;display:flex}.seat-setup__title{letter-spacing:.08em;text-transform:uppercase;color:var(--text-dim);margin:0;font-size:.8rem}.seat-setup__row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;display:flex}.seat-setup__seat{align-items:center;gap:.4rem;font-size:.95rem;font-weight:600;display:flex}.seat-setup__swatch{border-radius:50%;flex:none;width:.7rem;height:.7rem}.seat-setup__swatch--S{background:var(--seat-s)}.seat-setup__swatch--W{background:var(--seat-w)}.seat-setup__swatch--N{background:var(--seat-n)}.seat-setup__swatch--E{background:var(--seat-e)}.seat-setup__choices{background:var(--bg);border:1px solid var(--border);border-radius:999px;gap:.25rem;padding:.15rem;display:flex}.seat-setup__choice{appearance:none;color:var(--text-dim);cursor:pointer;background:0 0;border:none;border-radius:999px;min-height:36px;padding:.4rem .6rem;font-size:.8rem;font-weight:600}.seat-setup__choice[data-active=true]{background:var(--bg-raised-2);color:var(--text);box-shadow:inset 0 0 0 1px var(--border)}.seat-setup__hint{color:var(--text-dim);margin:0;font-size:.8rem}.ai-thinking{border-radius:var(--radius);background:var(--bg-raised);border:1px solid var(--border);color:var(--text-dim);align-items:center;gap:.5rem;padding:.5rem .75rem;font-size:.9rem;display:flex}.ai-thinking__dot{background:currentColor;border-radius:50%;width:.5rem;height:.5rem;animation:1s ease-in-out infinite ai-pulse}@keyframes ai-pulse{0%,to{opacity:.25}50%{opacity:1}}.player-card__cpu{letter-spacing:.06em;text-transform:uppercase;color:var(--text-dim);border:1px solid var(--border);border-radius:999px;padding:.1rem .4rem;font-size:.7rem;font-weight:700}.app{padding:max(.5rem, env(safe-area-inset-top)) .5rem max(.5rem, env(safe-area-inset-bottom));flex-direction:column;flex:1;gap:.5rem;width:100%;max-width:700px;margin:0 auto;display:flex}.app--screen{justify-content:flex-start;gap:1rem}.app__top{align-items:center;gap:.5rem;display:flex}.app__top>:first-child{flex:1;min-width:0}.app__rules-btn{flex:none;min-height:40px;padding:.5rem .75rem;font-size:.85rem}.app__status{align-items:center;min-height:2.5rem;display:flex}.app__board{justify-content:center;display:flex}@media (orientation:landscape) and (height<=500px){.app{grid-template:"board top""board status""board panel"1fr/auto minmax(0,1fr);align-content:start;column-gap:.75rem;max-width:none;display:grid}.app__top{grid-area:top}.app__board{grid-area:board}.app__status{grid-area:status}.player-panel{grid-area:panel;align-content:start}}