:root{--bg: #14101a;--panel: #221a2e;--panel-2: #2c2238;--ink: #ece6f5;--muted: #9a8fb0;--accent: #c8402f;--accent-2: #3f7cc8;--good: #4caf6a;--border: #4a3d5e;font-family:ui-monospace,Courier New,monospace}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);-webkit-text-size-adjust:100%}img.sprite,.sprite{image-rendering:auto;border-radius:6px;object-fit:contain}.app{max-width:1100px;margin:0 auto;padding:12px}@media (min-width: 1024px){.app{max-width:1320px}}@media (min-width: 1500px){.app{max-width:1500px}}.app__header{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;padding:8px 0 16px}.app__title{margin:0;letter-spacing:4px;font-size:clamp(22px,6vw,40px);color:var(--ink);text-shadow:2px 2px 0 var(--accent),4px 4px 0 #00000066}.app__title-img{display:block;margin:0 auto;max-width:min(420px,80%);height:auto;image-rendering:pixelated}.app__help-link{position:static;font:inherit;font-size:12px;cursor:pointer;background:var(--panel-2);color:var(--ink);border:2px solid var(--border);border-radius:8px;padding:6px 10px}@media (min-width: 720px){.app__help-link{position:absolute;top:8px;right:0}}.app__help-link:hover{border-color:var(--accent-2)}.help-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0a0710d9;z-index:100;display:flex;justify-content:center;align-items:flex-start;padding:16px;overflow-y:auto}.help{background:var(--panel);border:2px solid var(--border);border-radius:12px;width:100%;max-width:720px;margin:auto}.help__bar{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;background:var(--panel);border-bottom:2px solid var(--border);border-radius:12px 12px 0 0}.help__title{margin:0;letter-spacing:2px}.help__back{width:auto;margin:0;white-space:nowrap}.help__body{padding:4px 18px 8px}.help__section{padding:14px 0;border-bottom:1px solid var(--border)}.help__section:last-child{border-bottom:none}.help__section h3{margin:0 0 8px;color:var(--accent-2)}.help__section p{margin:6px 0;line-height:1.5;color:var(--ink)}.help__note{color:var(--muted);font-size:13px}.help__steps{margin:6px 0;padding-left:20px;line-height:1.5}.help__steps li{margin-bottom:8px}.help__figrow{display:flex;flex-wrap:wrap;gap:14px;margin-top:10px}.help__fig{flex:1 1 180px;margin:0;text-align:center}.help__fig figcaption{margin-top:6px;font-size:12px;color:var(--muted);line-height:1.4}.help__figrow--dice{gap:8px}.help__diechip{cursor:default}.help__cardrow{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;margin-top:10px}.help__democard{flex:0 0 auto}.help__legend{flex:1 1 280px;list-style:none;margin:0;padding:0}.help__legend li{display:flex;align-items:baseline;gap:8px;margin-bottom:10px;font-size:13px;line-height:1.4;color:var(--muted)}.help__legend strong{color:var(--ink)}.help__swatch{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:28px;padding:2px 6px;border-radius:4px;background:var(--panel-2);color:var(--ink);font-size:12px;font-weight:700}.help__swatch--hp{background:var(--accent);color:#fff}.help__footer{padding:12px 18px 18px;text-align:center}.help__footer .btn{width:auto}.panel{background:var(--panel);border:2px solid var(--border);border-radius:10px;padding:16px;margin-bottom:14px}.toast{background:var(--accent);color:#fff;padding:10px 14px;border-radius:8px;margin-bottom:12px;text-align:center}.btn{font:inherit;cursor:pointer;border:2px solid var(--border);background:var(--panel-2);color:var(--ink);padding:12px 16px;border-radius:8px;width:100%;margin-top:8px}.btn:hover:not(:disabled){border-color:var(--accent-2)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn--primary{background:var(--accent);border-color:#e0573f;font-weight:700}.btn--ghost{background:transparent}.field{display:block;margin:10px 0}.field span{display:block;color:var(--muted);font-size:13px;margin-bottom:4px}.field input{font:inherit;width:100%;padding:12px;background:#181321;border:2px solid var(--border);border-radius:8px;color:var(--ink)}.field__code{letter-spacing:8px;text-transform:uppercase;text-align:center;font-size:22px}.home{max-width:420px;margin:0 auto}.home__intro{color:var(--muted);text-align:center}.home__divider{text-align:center;color:var(--muted);margin:16px 0 4px}.lobby{display:grid;gap:14px;grid-template-columns:1fr}@media (min-width: 720px){.lobby{grid-template-columns:1fr 1fr}.lobby__heroes{grid-column:1 / -1}}.lobby__join{text-align:center}.lobby__code-label{display:block;color:var(--muted);font-size:13px}.lobby__code-value{font-size:48px;letter-spacing:10px;font-weight:700;color:var(--accent)}.lobby__qr{margin:12px auto 0;display:block;border-radius:8px}.lobby__hint{color:var(--muted);font-size:13px}.hero-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}.hero-card{font:inherit;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--panel-2);border:2px solid var(--border);border-radius:8px;padding:8px 4px;color:var(--ink)}.hero-card--mine{border-color:var(--good);box-shadow:0 0 0 2px var(--good) inset}.hero-card--taken{opacity:.4;cursor:not-allowed}.hero-card__name{font-size:13px;font-weight:700}.hero-card__crit,.hero-card__owner{font-size:11px;color:var(--muted)}.roster{list-style:none;padding:0;margin:0 0 12px}.roster li{padding:6px 0;border-bottom:1px solid var(--border)}.roster__me{color:var(--good)}.roster__hero{color:var(--muted)}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:8px}.dot--on{background:var(--good)}.dot--off{background:var(--muted)}.checkbox{display:flex;align-items:center;gap:8px;margin:8px 0;color:var(--muted)}.party{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}.party__member{display:flex;gap:8px;align-items:center;background:var(--panel);border:2px solid var(--border);border-radius:8px;padding:6px 10px;flex:1 1 160px}.party__member.is-active{border-color:var(--accent)}.party__member.is-me{background:var(--panel-2)}.party__info{display:flex;flex-direction:column;font-size:13px}.party__hp{color:var(--accent);word-break:break-all}.party__hp em{color:var(--muted);font-style:normal;margin-left:6px}.party__items{color:var(--accent-2);font-size:11px}.turnbar{background:var(--panel-2);border:2px solid var(--border);border-radius:8px;padding:10px;text-align:center;margin-bottom:12px;font-weight:700}.traps-banner{background:#5a2a1a;border:2px solid var(--accent);border-radius:8px;padding:8px 12px;margin-bottom:10px;font-size:13px;color:#ffcaa6}.monstermeter{background:var(--panel-2);border:2px solid var(--border);border-radius:8px;padding:8px 12px;margin-bottom:12px}.monstermeter--boss{border-color:var(--accent);box-shadow:0 0 10px var(--accent)}.monstermeter__row{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px}.monstermeter__label{font-size:13px;font-weight:700}.monstermeter--boss .monstermeter__label{color:#ffcaa6}.monstermeter__count{font-size:11px;color:var(--muted);white-space:nowrap}.monstermeter__track{height:12px;background:#181321;border:1px solid var(--border);border-radius:6px;overflow:hidden}.monstermeter__fill{height:100%;background:linear-gradient(90deg,var(--good),var(--accent-2));transition:width .4s ease}.monstermeter--boss .monstermeter__fill{background:linear-gradient(90deg,var(--accent-2),var(--accent))}.display{display:flex;gap:10px;overflow-x:auto;padding-bottom:8px;margin-bottom:12px}.creature{font:inherit;color:var(--ink);flex:0 0 auto;width:130px;background:var(--panel);border:2px solid var(--border);border-radius:10px;padding:8px;display:flex;flex-direction:column;align-items:center;gap:4px;cursor:default}.creature--target{border-color:var(--good);cursor:pointer;box-shadow:0 0 8px var(--good)}.creature--locked{opacity:.5}.creature__head{display:flex;justify-content:space-between;align-items:center;width:100%;font-weight:700}.creature__hp{color:#fff;background:var(--accent);border-radius:4px;min-width:24px;height:22px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;line-height:1}.creature__dmg{display:inline-flex;align-items:center;line-height:1;color:var(--muted)}.creature__name{font-size:13px;font-weight:700;text-align:center}.creature__badges{display:flex;flex-wrap:wrap;gap:3px;justify-content:center}.badge{font-size:10px;background:var(--panel-2);border:1px solid var(--border);border-radius:4px;padding:1px 4px;color:var(--muted)}.creature__progress{font-size:12px;color:var(--muted)}.creature__dice{display:flex;flex-wrap:wrap;gap:3px;justify-content:center}.minidie{background:var(--accent-2);color:#fff;border-radius:4px;font-size:11px;padding:1px 5px}.minidie--toggle{font:inherit;font-size:13px;cursor:pointer;border:2px solid transparent;padding:2px 8px}.minidie--keep{background:var(--accent-2);color:#fff}.minidie--recover{background:transparent;color:var(--muted, #888);border-color:var(--border);text-decoration:line-through;opacity:.7}.roundend{background:var(--panel);border:2px solid var(--border);border-radius:10px;padding:12px;margin-bottom:12px}.roundend__head{display:flex;flex-direction:column;gap:2px;margin-bottom:10px}.roundend__hint{font-size:12px;color:var(--muted, #888)}.roundend__empty{font-size:13px;color:var(--muted, #888);margin:4px 0}.roundend__creatures{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:12px}.roundend__creature{display:flex;flex-direction:column;align-items:center;gap:4px}.roundend__name{font-size:12px;font-weight:600}.roundend__dice{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}.roundend__actions{display:flex;gap:8px}.tray{background:var(--panel);border:2px solid var(--border);border-radius:10px;padding:12px;margin-bottom:12px}.tray__dice{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:10px}.die{font:inherit;cursor:pointer;width:56px;height:56px;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--panel-2);border:2px solid var(--border);border-radius:8px;color:var(--ink)}.die--selected{border-color:var(--good);box-shadow:0 0 8px var(--good)}.die--spent{opacity:.35;cursor:default}.die__value{font-size:20px;font-weight:700}.die__kind{font-size:10px;color:var(--muted)}.tray__actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.tray__actions .btn{width:auto}.tray__hint{color:var(--good);font-size:13px}.log{background:#181321;border:2px solid var(--border);border-radius:8px;padding:8px 12px;font-size:12px;color:var(--muted)}.log__line{padding:1px 0}.endgame{text-align:center;padding:40px 20px}.endgame--won h2{color:var(--good)}.endgame--lost h2{color:var(--accent)}.endgame__actions{display:flex;flex-direction:column;gap:8px;max-width:280px;margin:18px auto 0}.turnbar__pending{color:var(--good)}.checkbox--inline{margin:0;font-size:13px;color:var(--ink)}.crit{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}.crit__label{color:#ffd84a;font-weight:700}.crit .btn{width:auto}.crit__change{display:flex;gap:6px;align-items:center}.crit__input{width:56px;font:inherit;padding:8px;background:#181321;border:2px solid var(--border);border-radius:6px;color:var(--ink)}.items{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}.items__label{color:var(--accent-2);font-size:13px}.item-btn{width:auto;font-size:12px;padding:8px 10px}.preview{position:fixed;z-index:200;width:290px;pointer-events:none;background:var(--panel);border:2px solid var(--accent-2);border-radius:12px;padding:14px;display:flex;flex-direction:column;align-items:center;gap:8px;box-shadow:0 12px 34px #000a,0 0 0 1px #0006}.preview .sprite{width:200px;height:200px}.preview__title{font-weight:700;font-size:15px;text-align:center}.preview__stats{display:flex;gap:14px;font-size:13px}.preview__hp{color:var(--accent);font-weight:700}.preview__dmg{color:var(--muted)}.preview__badges{display:flex;flex-wrap:wrap;gap:4px;justify-content:center}.preview__text{font-size:12px;color:var(--ink);line-height:1.45;align-self:stretch}.preview__text p{margin:4px 0}.preview__text strong{color:var(--accent-2)}@media (max-width: 720px){.preview{display:none}}@media (min-width: 1024px){.game__board{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start}.game__side{position:sticky;top:12px}.game__side .tray,.game__side .log{margin-bottom:14px}.game__main .display{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;overflow-x:visible;align-content:start}.game__main .creature{width:auto;padding:12px}.game__main .creature .sprite{width:150px!important;height:150px!important}}
