:root{--bg: #14121c;--bg2: #1d1a28;--panel: #242033;--panel2: #2d2840;--text: #ece8f6;--muted: #a39cb8;--accent: #e8b44c;--accent2: #7ec8e3;--danger: #ef5b5b;--ok: #5bd18a;--team-a: #6fb3ff;--team-b: #ff8a6a;--board-1: #2a2540;--board-2: #17141f;--edge: #6b6385;--radius: 12px;--card-w: 128px;--card-h: 178px;color-scheme:dark;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;height:100%;background:var(--bg);color:var(--text)}body{overscroll-behavior:none}button,select,input{font:inherit;color:inherit}button{background:var(--panel2);border:1px solid #443d5c;border-radius:10px;padding:8px 14px;cursor:pointer;min-height:40px;transition:background .15s,transform .1s}button:hover:not(:disabled){background:#3a3352}button:active:not(:disabled){transform:scale(.97)}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:linear-gradient(180deg,#f0c25e,#c98f25);color:#1b1408;border-color:#f3cf7c;font-weight:700}button.primary:hover:not(:disabled){background:linear-gradient(180deg,#f6cd72,#d79c2f)}button.big{font-size:1.1rem;padding:12px 24px}button.ghost{background:transparent;border-color:transparent}button.small,.small{font-size:.85rem;min-height:30px;padding:4px 10px}button.on{background:#4b3f78;border-color:var(--accent)}button.linkish{background:none;border:none;padding:2px 4px;min-height:0;color:var(--accent2);text-align:left}input,select{background:var(--bg2);border:1px solid #443d5c;border-radius:8px;padding:8px 10px;min-height:40px}.muted{color:var(--muted)}.error{color:#ffd6d6;background:#5a2330;border:1px solid var(--danger);padding:6px 10px;border-radius:8px;margin:6px 0;cursor:pointer}.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.row.end{justify-content:flex-end;margin-top:12px}.pill{border:1px solid #4a4266;border-radius:999px;padding:3px 10px;font-size:.85rem;white-space:nowrap}.pill.yours{background:var(--accent);color:#1b1408;border-color:var(--accent);font-weight:700;animation:glow 1.6s infinite}.team-a{color:var(--team-a)}.team-b{color:var(--team-b)}.badge{background:var(--danger);color:#fff;border-radius:999px;padding:0 6px;font-size:.75rem;margin-left:4px}.conn{font-size:.85rem;white-space:nowrap}.conn-open{color:var(--ok)}.conn-connecting{color:var(--accent)}.conn-closed{color:var(--danger)}.screen{max-width:1100px;margin:0 auto;padding:16px;display:flex;flex-direction:column;gap:12px;min-height:100%}.screen h2{margin:0}.menu{align-items:center;justify-content:center;text-align:center}.menu h1{font-size:clamp(2rem,7vw,3.4rem);margin:0;letter-spacing:.02em;background:linear-gradient(90deg,#f3cf7c,#e8b44c,#7ec8e3);-webkit-background-clip:text;background-clip:text;color:transparent}.logo{font-size:2.6rem;display:flex;gap:18px}.logo span{animation:float 3s ease-in-out infinite}.logo span:nth-child(2){animation-delay:.4s}.logo span:nth-child(3){animation-delay:.8s}.logo span:nth-child(4){animation-delay:1.2s}.menu-buttons{display:grid;gap:10px;width:min(360px,100%)}.legal{max-width:520px}label{font-weight:600;margin-top:6px}.seg{display:flex;flex-wrap:wrap;gap:6px}.setup-grid,.lobby-cols{display:grid;grid-template-columns:1fr 1.4fr;gap:16px}.lobby-cols{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.setup-grid section,.lobby-cols section{display:flex;flex-direction:column;gap:8px;background:var(--panel);padding:12px;border-radius:var(--radius)}.slot{border-left:6px solid var(--hero);background:var(--panel2);border-radius:10px;padding:10px;display:flex;flex-direction:column;gap:8px}.slot.ready{box-shadow:0 0 0 1px var(--ok) inset}.slot.empty{opacity:.5;text-align:center;border-left-color:#555}.slot input{flex:1;min-width:120px}.hero-pick,.hero-tabs{display:flex;flex-wrap:wrap;gap:6px}.hero-chip{border-left:4px solid var(--hero);display:inline-flex;gap:6px;align-items:center}.hero-chip.on{background:color-mix(in srgb,var(--hero) 35%,var(--panel2));border-color:var(--hero)}.emblem{font-size:1.2em}.minimap{width:100%;max-height:220px}.room-row{display:flex;justify-content:space-between;gap:8px;align-items:center}.code{font-family:ui-monospace,monospace;letter-spacing:.15em;color:var(--accent);-webkit-user-select:all;user-select:all}.hero-sheet{display:grid;grid-template-columns:140px 1fr;gap:16px;background:var(--panel);border-radius:var(--radius);padding:16px;border-top:4px solid var(--hero)}.hero-portrait{width:140px;height:140px;border-radius:50%;display:grid;place-items:center;font-size:5rem;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--hero) 80%,white),var(--hero) 55%,#000 120%)}.stats{border-collapse:collapse}.stats th,.stats td{padding:3px 8px;text-align:left}.stats th{color:var(--muted);font-weight:500}.rules section{background:var(--panel);border-radius:var(--radius);padding:4px 14px}.settings input[type=range]{width:min(320px,100%)}.dim-sec{opacity:.7}.game{max-width:100vw;overflow-x:hidden;height:100dvh;display:grid;grid-template-rows:auto 1fr auto auto;overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 10px;background:var(--bg2);border-bottom:1px solid #2f2a42}.turninfo{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}.game-main>*,.promptbar>*{min-width:0}.hit{fill:transparent}.game-main{display:grid;grid-template-columns:240px 1fr 260px;min-height:0}.side{overflow:auto;padding:8px;display:flex;flex-direction:column;gap:8px;min-height:0}.center{position:relative;min-height:0;display:flex;flex-direction:column;padding:6px}.board-wrap{flex:1;min-height:0;display:flex;flex-direction:column}.board{width:100%;height:100%;min-height:0;flex:1;touch-action:manipulation;-webkit-user-select:none;user-select:none}.edge{stroke:var(--edge);stroke-width:6;stroke-linecap:round}.space-ring{fill:none;stroke:#0000008c;stroke-width:2.5}.space{transition:opacity .2s}.space.dim{opacity:.28}.space.dest{cursor:pointer}.dest-ring{fill:#e8b44c26;stroke:var(--accent);stroke-width:3;stroke-dasharray:6 4;animation:dash 1.2s linear infinite}.start-num{fill:#fff;font-size:13px;font-weight:800;paint-order:stroke;stroke:#000;stroke-width:3px;text-anchor:middle;pointer-events:none}.token{cursor:pointer}.token-body{stroke:#00000080;stroke-width:2;transition:r .3s}.token-team{fill:none;stroke-width:4}.token-label{fill:#fff;text-anchor:middle;font-weight:800;pointer-events:none;paint-order:stroke;stroke:#0009;stroke-width:2px}.hp-badge{fill:#111;stroke:#fff;stroke-width:1.5}.hp-text{fill:#fff;font-size:11px;font-weight:800;text-anchor:middle;pointer-events:none}.token.selectable .token-team{stroke:var(--accent)!important;animation:blink 1.1s infinite}.token.target .token-team{stroke:var(--danger)!important;stroke-width:6;animation:blink .8s infinite}.token.selected .token-team{stroke:#fff!important;stroke-width:6}.token.petrified .token-body{stroke:#ccc;stroke-dasharray:3 2}.stone-mark{fill:#ddd;font-size:14px}.pulse{fill:none;stroke-width:4;animation:pulse .9s ease-out forwards}.pulse-damage{stroke:var(--danger)}.pulse-heal{stroke:var(--ok)}.pulse-petrify{stroke:#bbb}.pulse-size{stroke:#b48cff}.pulse-voyage{stroke:#4fc3f7}.pulse-magic{stroke:#ffe082}.float{font-weight:900;font-size:26px;text-anchor:middle;paint-order:stroke;stroke:#000;stroke-width:4px;animation:floatUp 1.3s ease-out forwards;pointer-events:none}.float-damage{fill:var(--danger)}.float-heal{fill:var(--ok)}.float-petrify{fill:#ddd}.float-voyage{fill:#4fc3f7;font-size:18px}.zone-legend{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;padding:2px}.zone-chip{font-size:.78rem;min-height:26px;padding:2px 8px;display:inline-flex;gap:5px;align-items:center}.zone-swatch{width:12px;height:12px;border-radius:50%;background:var(--zc);display:inline-block}.zone-swatch.pat-stripes{background:repeating-linear-gradient(45deg,var(--zc) 0 3px,rgba(255,255,255,.5) 3px 5px)}.zone-swatch.pat-dots{background:radial-gradient(rgba(255,255,255,.7) 25%,var(--zc) 30%);background-size:5px 5px}.zone-swatch.pat-cross{background:linear-gradient(var(--zc),var(--zc));box-shadow:inset 0 0 0 2px #ffffff59}.ppanel{background:var(--panel);border-radius:var(--radius);padding:8px;border-left:5px solid var(--hero);display:flex;flex-direction:column;gap:4px}.ppanel.active{box-shadow:0 0 0 2px var(--accent)}.ppanel.out{opacity:.5}.ppanel-head{display:flex;gap:8px;align-items:center}.ppanel-head .emblem{font-size:1.6rem;color:var(--hero)}.pname{font-weight:700}.psub{font-size:.8rem;color:var(--muted)}.fighter-row{display:grid;grid-template-columns:1fr 70px 42px;gap:6px;align-items:center;background:none;border:none;padding:2px 0;min-height:26px;font-size:.85rem;text-align:left}.fighter-row.dead{opacity:.35;text-decoration:line-through}.hpbar{height:8px;background:#111;border-radius:4px;overflow:hidden}.hpbar span{display:block;height:100%;background:linear-gradient(90deg,#e05050,#5bd18a);transition:width .4s}.fr-hp{text-align:right;font-variant-numeric:tabular-nums}.pstats{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:.85rem}.state-badge{border-radius:6px;padding:1px 6px;font-size:.78rem;font-weight:700}.size-giant{background:#6a3fb5}.size-tiny{background:#2f7b8f}.voyage{background:#1f5f7a}.ability-text{font-size:.8rem;color:var(--muted);margin:2px 0}.tabs{display:flex;gap:4px}.tabs button{flex:1;min-height:32px;padding:4px}.tabs button.on{background:var(--panel);border-color:var(--accent)}.log,.chat-msgs{flex:1;overflow:auto;background:var(--bg2);border-radius:10px;padding:6px 8px;font-size:.8rem;display:flex;flex-direction:column;gap:3px;min-height:120px}.log-turn{color:var(--accent);font-weight:700;margin-top:4px}.log-damage{color:#ff9c9c}.log-heal{color:#9dffbf}.log-defeat{color:var(--danger);font-weight:700}.log-victory{color:var(--accent);font-weight:800;font-size:1rem}.log-combat{color:#ffd98a}.log-state{color:#c9b6ff}.chat{display:flex;flex-direction:column;gap:6px;flex:1;min-height:0}.chat-form{display:flex;gap:4px}.chat-form input{flex:1;min-width:0}.chat-msgs .me{color:var(--accent2)}.promptbar{display:grid;grid-template-columns:1fr auto;gap:6px 12px;align-items:center;padding:8px 12px;background:var(--panel);border-top:1px solid #3a3352}.promptbar.mine{background:linear-gradient(90deg,#3b2f17,var(--panel) 60%);border-top-color:var(--accent)}.prompt-text{font-weight:600}.prompt-buttons,.options{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.options{grid-column:1 / -1;justify-content:flex-start}.hint{grid-column:1 / -1;font-size:.82rem;color:var(--muted)}.hand{display:flex;gap:8px;overflow-x:auto;padding:8px 12px 12px;background:var(--bg2);min-height:calc(var(--card-h) * .72 + 20px);scroll-snap-type:x proximity}.hand .card{scroll-snap-align:start}.card{position:relative;width:var(--card-w);min-width:var(--card-w);height:var(--card-h);border-radius:12px;padding:6px 7px;display:flex;flex-direction:column;gap:3px;background:linear-gradient(160deg,color-mix(in srgb,var(--hero, #555) 45%,#1d1a28),#15131d 70%);border:2px solid color-mix(in srgb,var(--hero, #555) 70%,#000);box-shadow:0 4px 10px #0006;cursor:pointer;transition:transform .15s,box-shadow .15s;animation:deal .45s backwards;animation-delay:calc(var(--deal, 0) * 60ms);-webkit-user-select:none;user-select:none}.hand .card{height:var(--card-h)}.hand .card-art{font-size:1.3rem;line-height:1}.card:hover{transform:translateY(-4px)}.card.selected{transform:translateY(-10px);box-shadow:0 0 0 3px var(--accent),0 10px 18px #00000080}.card.highlight{box-shadow:0 0 0 2px var(--ok),0 4px 10px #0006}.card.highlight.selected{box-shadow:0 0 0 3px var(--accent),0 10px 18px #00000080}.card.disabled{filter:grayscale(.7) brightness(.65)}.card-top{display:flex;align-items:center;gap:5px}.card-value{min-width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:900;font-size:1.05rem;background:#111;border:2px solid #fff}.card-attack .card-value{background:#b8322f}.card-defense .card-value{background:#2f61b8}.card-versatile .card-value{background:linear-gradient(135deg,#b8322f 50%,#2f61b8 50%)}.card-scheme .card-value{background:#8a6a1f}.card-name{font-weight:800;font-size:.78rem;line-height:1.05;flex:1}.card-zoom{min-height:0;padding:0 4px;font-size:.8rem;background:#00000059;border:none}.card-art{font-size:1.9rem;text-align:center;opacity:.9;line-height:1.2}.card-type{font-size:.62rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}.card-text{font-size:.64rem;line-height:1.2;overflow:hidden;flex:1}.card-boost{position:absolute;right:6px;bottom:6px;width:24px;height:24px;border-radius:6px;background:#e8b44c;color:#1b1408;font-weight:900;display:grid;place-items:center;transform:rotate(45deg);font-size:.8rem}.card-boost:after{content:""}.card-boost{text-indent:0}.card-count{position:absolute;left:6px;bottom:6px;font-weight:800;font-size:.8rem;background:#000a;border-radius:6px;padding:0 5px}.card-sm{--card-w: 96px;--card-h: 120px}.card-sm .card-art{font-size:1.3rem}.card-lg{--card-w: 260px;--card-h: 360px;padding:14px}.card-lg .card-name{font-size:1.2rem}.card-lg .card-text{font-size:.95rem}.card-lg .card-art{font-size:4rem}.card-lg .card-value{width:46px;height:46px;font-size:1.6rem}.card-lg .card-boost{width:38px;height:38px;font-size:1.2rem}.card-lg .card-type{font-size:.8rem}.card-back{background:repeating-linear-gradient(45deg,#3a2f5c 0,#3a2f5c 8px,#2a2244 8px,#2a2244 16px);border-color:#6b5aa6;align-items:center;justify-content:center}.card-back-mark{font-size:2rem;color:#c8b6ff}.card-back-label{font-size:.7rem;text-align:center}.card-grid{display:flex;flex-wrap:wrap;gap:10px}.zoomed{display:grid;place-items:center}.zoomed .card{animation:none;cursor:default}.combat-box{position:absolute;top:10px;left:50%;transform:translate(-50%);display:flex;gap:12px;align-items:center;background:#14121ceb;border:1px solid var(--accent);border-radius:var(--radius);padding:8px 12px;z-index:5;animation:pop .25s;pointer-events:none;opacity:.93}.combat-side{display:flex;flex-direction:column;align-items:center;gap:4px}.cb-name{font-size:.8rem;font-weight:700}.cb-val{font-size:1.4rem;font-weight:900;color:var(--accent)}.vs{font-size:1.4rem;font-weight:900;color:var(--danger)}.combat-box .card{animation:none}.flip{animation:flip .5s}.fighter-info{position:absolute;bottom:10px;left:10px;background:#14121ceb;border:1px solid #4a4266;padding:8px 30px 8px 10px;border-radius:10px;font-size:.85rem;z-index:4}.fighter-info .close{position:absolute;top:2px;right:2px;min-height:0;padding:0 6px;background:none;border:none}.modal-bg,.curtain{position:fixed;top:0;right:0;bottom:0;left:0;background:#05040ab8;display:grid;place-items:center;z-index:50;padding:16px}.modal{background:var(--panel);border-radius:var(--radius);padding:16px;max-width:min(900px,100%);max-height:90dvh;overflow:auto;animation:pop .2s}.modal h3{margin-top:0}.curtain{background:radial-gradient(circle,#2a2440,#07060c);z-index:60}.curtain-box{text-align:center;max-width:460px;display:flex;flex-direction:column;gap:12px;align-items:center}.victory h1{font-size:3rem;margin:0;color:var(--accent);animation:pop .5s}.victory{background:#05040ad1}@keyframes deal{0%{transform:translateY(40px) rotate(-6deg);opacity:0}}@keyframes pop{0%{transform:translate(var(--tx, 0)) scale(.85);opacity:0}}.combat-box{--tx: -50%}@keyframes flip{0%{transform:rotateY(90deg)}}@keyframes floatUp{0%{transform:translateY(0);opacity:1}to{transform:translateY(-36px);opacity:0}}@keyframes pulse{0%{opacity:1;stroke-width:6}to{opacity:0;transform:scale(1.8);stroke-width:1}}.pulse{transform-box:fill-box;transform-origin:center}@keyframes blink{50%{opacity:.45}}@keyframes glow{50%{box-shadow:0 0 12px var(--accent)}}@keyframes dash{to{stroke-dashoffset:-20}}@keyframes float{50%{transform:translateY(-8px)}}.anim-reduced *,.anim-reduced *:before{animation-duration:.12s!important;animation-iteration-count:1!important;transition-duration:.08s!important}.anim-off *,.anim-off *:before{animation:none!important;transition:none!important}.anim-off .float{opacity:1}@media (prefers-reduced-motion: reduce){.dest-ring,.logo span,.token.selectable .token-team,.token.target .token-team{animation:none}}.hide-sm{display:inline}@media (max-width: 980px){.game{grid-template-rows:auto auto minmax(0,1fr) auto auto;height:auto;min-height:100dvh;overflow:visible}.game-main{grid-template-columns:1fr;display:flex;flex-direction:column}.side.players{flex-direction:row;overflow-x:auto;order:2;padding:6px}.side.players .ppanel{min-width:220px}.center{order:1;height:min(70vw,62dvh);min-height:260px}.side.right{order:3;max-height:240px}.center,.side{max-width:100vw}.setup-grid{grid-template-columns:1fr}.hero-sheet{grid-template-columns:1fr;justify-items:center}.promptbar{grid-template-columns:1fr;position:sticky;bottom:calc(var(--card-h) + 20px);z-index:6}.prompt-buttons{justify-content:flex-start}.hand{position:sticky;bottom:0;z-index:6}}@media (max-width: 600px){:root{--card-w: 108px;--card-h: 156px}.hide-sm{display:none}.card-text{font-size:.58rem}.combat-box{top:4px;padding:4px 8px;gap:6px}.screen{padding:12px}}
