:root{--bg:#f2f0ea;--surface:#fff;--surface-2:#f6f4ee;--text:#23272b;--muted:#71777e;--border:#e2ded3;--accent:#2e6e4e;--good:#1e7a3c;--bad:#c22b3b;--warn:#d69e2e;--card-face:#fff;--card-border:#d9d5c9;--card-back:#2c5d8a;--card-back-stripe:#ffffff29;--slot-dash:#c6c1b4;--suit-0:#1c7a41;--suit-1:#1a63c4;--suit-2:#cf2c3f;--suit-3:#23272b;--shadow:0 1px 2px #00000014, 0 4px 12px #0000000f;--sheet-shadow:0 -8px 30px #0000002e;--card-w:clamp(44px, 12.5vw, 54px);--card-w-lg:clamp(58px, 17vw, 72px);--card-radius:8px;--font-title:1.3rem;--font-subtitle:.88rem;--font-card-rank:1.05rem;--font-card-suit:1.1rem;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}:root[data-theme=dark]{--bg:#14171a;--surface:#1d2125;--surface-2:#23282d;--text:#e8e6e0;--muted:#9aa1a8;--border:#32383e;--accent:#3f9268;--good:#4fae74;--bad:#e0596a;--card-face:#262b31;--card-border:#3a4046;--card-back:#2a5580;--card-back-stripe:#ffffff24;--slot-dash:#4a5057;--suit-0:#4fb878;--suit-1:#5b9cf5;--suit-2:#ee6a79;--suit-3:#e9e7e2;--shadow:0 1px 2px #0006, 0 4px 12px #0000004d;--sheet-shadow:0 -8px 30px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0}body{background:var(--bg);color:var(--text);min-height:100dvh;font-family:system-ui,-apple-system,Segoe UI,sans-serif;transition:background-color .25s,color .25s}body.sheet-open{overflow:hidden}button{font:inherit;color:inherit;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:none;padding:0}.app{max-width:480px;padding:0 16px calc(49px + env(safe-area-inset-bottom));flex-direction:column;min-height:100dvh;margin:0 auto;display:flex}.app-header{justify-content:space-between;align-items:center;padding:14px 0 4px;display:flex}h1{font-size:var(--font-title);letter-spacing:.02em;margin:0;font-weight:650}.header-actions{align-items:center;gap:8px;display:flex}.app-subtitle{font-size:var(--font-subtitle);color:var(--muted);margin:14px 0 44px}.icon-btn,.theme-btn{border:1px solid var(--border);background:var(--surface);width:32px;height:32px;box-shadow:var(--shadow);color:var(--muted);border-radius:50%;place-items:center;font-size:.85rem;font-weight:650;line-height:1;display:grid}.icon-btn:hover,.theme-btn:hover{color:var(--text)}.icon-btn:focus-visible,.theme-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.table{flex-direction:column;flex:1;gap:18px;padding:14px 0 8px;display:flex}.zone{text-align:center}.zone-label{text-transform:uppercase;letter-spacing:.12em;color:var(--muted);-webkit-user-select:none;user-select:none;margin-bottom:8px;font-size:.7rem;font-weight:600}.zone-note{text-transform:none;letter-spacing:.02em;opacity:.85;font-weight:500}.zone-note.req{color:var(--accent);opacity:1}.cards{-webkit-user-select:none;user-select:none;justify-content:center;gap:7px;display:flex}.cards-board .slot:nth-child(4){margin-left:12px}.cards-wrap{flex-wrap:wrap;row-gap:10px}.slot{width:var(--card-w);aspect-ratio:5/7;perspective:600px;flex:none;position:relative}.slot-lg{width:var(--card-w-lg)}.slot:before{content:"+";border:1.5px dashed var(--slot-dash);border-radius:var(--card-radius);color:var(--slot-dash);opacity:0;place-items:center;font-size:1.15rem;font-weight:500;transition:opacity .2s,border-color .2s,color .2s;display:grid;position:absolute;inset:0}.slot.empty:before,.slot.ghost:before{opacity:1}.slot.empty .card-inner{visibility:hidden}.slot-lg.empty:before{border-color:var(--accent);color:var(--accent);opacity:.75}.slot.empty:hover:before,.slot.ghost:hover:before{border-color:var(--accent);color:var(--accent);opacity:1}.slot-btn{border-radius:var(--card-radius);position:absolute;inset:0}.slot-btn:focus-visible,.slot.ghost:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--card-radius)}.slot-x{z-index:2;background:var(--surface);border:1px solid var(--border);width:18px;height:18px;box-shadow:var(--shadow);color:var(--muted);border-radius:50%;place-items:center;font-size:12px;line-height:1;display:none;position:absolute;top:-6px;right:-6px}.slot.filled .slot-x{display:grid}.slot-x:hover{color:var(--bad);border-color:var(--bad)}.slot-x:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.card-inner{transform-style:preserve-3d;transition:transform .45s cubic-bezier(.35,.1,.25,1);position:absolute;inset:0}.slot.filled .card-inner{transform:rotateY(180deg)}.slot.filled:hover .card-inner{transform:rotateY(180deg)translateY(2px)}.card-face{backface-visibility:hidden;border-radius:var(--card-radius);background:var(--card-face);border:1px solid var(--card-border);box-shadow:var(--shadow);flex-direction:column;justify-content:center;align-items:center;transition:background-color .25s,border-color .25s;display:flex;position:absolute;inset:0}.card-back:after{content:"";border-radius:calc(var(--card-radius) - 3px);background:repeating-linear-gradient(45deg, var(--card-back-stripe) 0 3px, transparent 3px 6px) var(--card-back);position:absolute;inset:3px}.card-front{gap:2px;line-height:1;transform:rotateY(180deg)}.card-front .rank{font-weight:700;font-size:calc(var(--card-w) * .4)}.card-front .suit{font-size:calc(var(--card-w) * .34)}.slot-lg .card-front .rank{font-size:calc(var(--card-w-lg) * .4)}.slot-lg .card-front .suit{font-size:calc(var(--card-w-lg) * .34)}.suit-0{color:var(--suit-0)}.suit-1{color:var(--suit-1)}.suit-2{color:var(--suit-2)}.suit-3{color:var(--suit-3)}.panel{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:14px;flex-direction:column;justify-content:center;gap:10px;min-height:76px;margin-top:auto;padding:16px;transition:background-color .25s,border-color .25s;display:flex}.hint{color:var(--muted);text-align:center;font-size:.9rem}.solve-row{color:var(--muted);justify-content:center;align-items:center;gap:12px;font-size:.9rem;display:flex}.btn{border:1px solid var(--border);background:var(--surface-2);border-radius:10px;padding:7px 14px;font-size:.82rem;font-weight:600}.btn:hover{border-color:var(--muted)}.btn-danger{color:var(--bad)}.progress-track{background:var(--surface-2);border:1px solid var(--border);border-radius:3px;height:6px;overflow:hidden}.progress-fill{background:var(--accent);width:0;height:100%;transition:width .15s linear}.progress-text{color:var(--muted);text-align:center;font-variant-numeric:tabular-nums;margin-top:6px;font-size:.75rem}.action{justify-content:center;align-items:baseline;gap:10px;font-size:1.5rem;font-weight:750;display:flex}.action .delta{color:var(--muted);font-size:.95rem;font-weight:600}.tone-good{color:var(--good)}.tone-bad{color:var(--bad)}.tone-neutral{color:var(--text)}.indiff{text-align:center;color:var(--muted);font-size:.8rem}.details{color:var(--muted);flex-direction:column;gap:2px;margin-top:4px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;display:flex}.details .kv{justify-content:space-between;gap:14px;display:flex}.details .v{font-variant-numeric:tabular-nums;text-align:right}.error{color:var(--bad);text-align:center;white-space:pre-wrap;font-size:.85rem}.picker-backdrop{opacity:0;z-index:40;background:#0006;transition:opacity .25s;position:fixed;inset:0}.picker-backdrop.open{opacity:1}.picker-sheet{z-index:50;background:var(--surface);max-width:520px;box-shadow:var(--sheet-shadow);padding:8px 12px calc(14px + env(safe-area-inset-bottom));-webkit-user-select:none;user-select:none;border-radius:18px 18px 0 0;outline:none;margin:0 auto;transition:transform .3s cubic-bezier(.32,.72,.28,1);position:fixed;bottom:0;left:0;right:0;transform:translateY(105%)}.picker-sheet.open{transform:translateY(0)}.picker-grabber{background:var(--border);border-radius:2px;width:36px;height:4px;margin:2px auto 10px}.picker-header{align-items:center;gap:10px;margin-bottom:10px;display:flex}.picker-title{flex:1;font-size:.95rem;font-weight:650}.picker-row{grid-template-columns:20px repeat(13,1fr);gap:4px;margin-bottom:4px;display:grid}.picker-suit{font-size:var(--font-card-suit);place-items:center;display:grid}.pick{background:var(--card-face);border:1px solid var(--card-border);min-height:46px;font-weight:700;font-size:var(--font-card-rank);border-radius:7px;place-items:center;display:grid;position:relative}.pick:disabled{cursor:default;background:color-mix(in srgb, var(--card-face) 40%, var(--surface));color:color-mix(in srgb, currentColor 30%, transparent);border-color:#0000}.pick.current{outline:2px solid var(--accent);outline-offset:-1px}.pick:after{content:"";opacity:0;border-radius:50%;width:5px;height:5px;position:absolute;top:3px;right:3px}.pick.used-hero:after{background:var(--accent);opacity:1}.pick.used-board:after{background:var(--suit-1);opacity:1}.pick.used-dead:after{background:var(--warn);opacity:1}@media (width>=640px){.picker-sheet{border-radius:18px;bottom:20px;left:20px;right:20px}}.help-modal{z-index:50;background:var(--surface);border:1px solid var(--border);width:calc(100% - 32px);max-width:440px;max-height:calc(100% - 32px);box-shadow:var(--sheet-shadow);padding:16px 18px calc(16px + env(safe-area-inset-bottom));opacity:0;border-radius:14px;outline:none;transition:transform .2s cubic-bezier(.32,.72,.28,1),opacity .2s;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)scale(.96)}.help-modal.open{opacity:1;transform:translate(-50%,-50%)scale(1)}.help-header{justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px;display:flex}#helpClose{background:0 0;border:none;position:absolute;top:8px;right:8px}.help-title{font-size:var(--font-title);margin:0;padding-right:24px;font-weight:650}.help-modal p{font-size:var(--font-subtitle);color:var(--muted);margin:0 0 12px;line-height:1.55}.help-modal p:last-of-type{margin-bottom:0}@media (prefers-reduced-motion:reduce){.card-inner,.picker-sheet,.picker-backdrop,.help-modal,.slot:before,.progress-fill{transition:none}}