:root{color-scheme:dark;--ink:#f8f1de;--muted:#ada5ba;--panel:#241c35;--line:#4b3b61;--gold:#ffc65a;--green:#70e095;--red:#ff657d;--blue:#73c7ff;--cell:calc((min(100vw - 32px,430px) - 14px)/6);font-family:Inter,ui-rounded,"SF Pro Rounded",system-ui,sans-serif;background:#0d0a13;color:var(--ink)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;overscroll-behavior:none}body{background:radial-gradient(circle at 50% -10%,#46305f 0,#171225 34rem,#0d0a13 70rem);padding:max(10px,env(safe-area-inset-top)) 12px max(18px,env(safe-area-inset-bottom));touch-action:pan-y}.app-shell{width:min(100%,560px);margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;padding:8px 4px 14px}.brand{display:flex;align-items:center;gap:10px}.brand img{width:48px;height:48px;border-radius:15px;box-shadow:0 7px 22px #0008}.brand h1{font-size:20px;margin:0}.brand p{margin:2px 0 0;color:var(--muted);font-size:12px}.icon-button,.small-button,.primary-button{border:0;color:var(--ink);font:inherit;font-weight:900;cursor:pointer;min-height:44px}.icon-button{min-width:64px;padding:0 10px;border-radius:14px;background:#2c223d;border:1px solid #4b3b61;font-size:10px}.status-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:18px}.status-strip>div{min-width:0;text-align:center;padding:9px 3px;background:#1c1628;border:1px solid #3e3150;border-radius:12px}.status-strip strong{display:block;margin-top:3px;color:var(--gold);font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-label,.eyebrow{font-size:9px;letter-spacing:.14em;font-weight:900;color:var(--muted)}.phase{animation:phaseIn .22s ease}@keyframes phaseIn{from{opacity:0;transform:translateY(5px)}}.section-heading,.pack-toolbar,.subheading,.battle-head{display:flex;align-items:end;justify-content:space-between;gap:8px;margin:0 2px 9px}.section-heading h2,.pack-toolbar h2,.subheading h2,.battle-head h2{font-size:20px;margin:2px 0 0}.subheading>span{color:var(--muted);font-size:10px;font-weight:800}.small-button{padding:0 12px;border-radius:11px;background:#312641;border:1px solid #514064;font-size:10px}.small-button:disabled{opacity:.38}.small-button.danger:not(:disabled){color:#ff9aaa}.instruction,.hint{margin:0 3px 9px;color:#cfc3dd;font-size:12px;line-height:1.45}.shop{display:flex;gap:9px;margin:0 -12px 20px;padding:0 12px 10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin}.shop-card{position:relative;flex:0 0 205px;min-width:0;padding:9px;border:1px solid #514063;border-radius:16px;background:linear-gradient(160deg,#302642,#20192e);box-shadow:0 7px 17px #0005;color:var(--ink);text-align:left;scroll-snap-align:start;touch-action:none;user-select:none}.shop-card:active{transform:scale(.98)}.shop-card.sold{opacity:.25;pointer-events:none}.shop-card.selected{outline:3px solid var(--gold);border-color:transparent}.shop-top{display:grid;grid-template-columns:72px 1fr;gap:8px;align-items:center}.item-image{display:block;width:72px;height:72px;object-fit:contain;border-radius:12px;filter:drop-shadow(0 5px 5px #0008)}.shop-name{display:block;font-size:13px;font-weight:900}.shop-desc{display:block;margin:3px 0 6px;color:var(--muted);font-size:10px}.price{display:inline-block;padding:4px 7px;border-radius:8px;background:#6b4b15;color:#ffe0a1;font-weight:900;font-size:11px}.footprint{display:flex;align-items:center;gap:8px;margin-top:8px;padding:7px;border-radius:10px;background:#171220}.footprint-grid{display:grid;gap:2px}.footprint-grid i{width:10px;height:10px;border-radius:2px;background:#a87948;border:1px solid #e1bb7d}.footprint b{font-size:9px;color:#e7d1a4}.stats{display:grid;grid-template-columns:repeat(5,1fr);gap:3px;margin-top:8px}.stat{min-width:0;padding:5px 2px;border-radius:7px;background:#171220;text-align:center}.stat b,.stat small{display:block}.stat b{font-size:12px}.stat small{margin-top:2px;font-size:6px;letter-spacing:.05em;color:var(--muted)}.stat.attack b{color:#ff8c74}.stat.defence b{color:#a9bdcf}.stat.burn b{color:#ff913b}.stat.poison b{color:#83e660}.stat.frost b{color:#65cfff}.tool-actions{display:flex;gap:5px}.pack-wrap{padding:8px;border-radius:20px;background:linear-gradient(145deg,#6b4b2f,#3e291d);border:3px solid #a37042;box-shadow:inset 0 0 0 2px #2d1b13,0 14px 30px #0008}.pack-grid{position:relative;display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(5,var(--cell));gap:2px;padding:2px;border-radius:12px;background:#1e1613}.grid-cell{border:1px dashed #785638;border-radius:5px;background:#3b2a20;min-width:0}.grid-cell.valid{background:#24663c;border-color:#80ef9f}.grid-cell.invalid{background:#742b3d;border-color:#ff7b90}.pack-item{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;border-radius:10px;border:2px solid #dac28e;background:radial-gradient(circle,#65503c,#34271f);box-shadow:0 5px 11px #000a;overflow:hidden;touch-action:none;user-select:none}.pack-item img{width:94%;height:94%;object-fit:contain;pointer-events:none;border-radius:8px}.pack-item.selected{outline:4px solid var(--gold);z-index:4}.pack-item .level{position:absolute;right:3px;bottom:3px;border-radius:6px;background:#171225e8;padding:2px 5px;font-size:9px;font-weight:900}.selected-details{min-height:53px;margin-top:8px;padding:9px;border-radius:12px;background:#241a17}.selected-empty{color:#bda997;font-size:10px}.selected-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.selected-title strong{font-size:12px}.selected-title span{color:#d7b987;font-size:9px}.recipes-section{margin-top:18px}.recipe-list{display:grid;gap:7px}.recipe{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;padding:9px;border:1px solid #443652;border-radius:13px;background:#1d1728}.recipe.ready{border-color:#8b6a26;background:#2a211d}.recipe-flow{display:flex;align-items:center;gap:5px;min-width:0}.recipe-flow img{width:35px;height:35px;object-fit:contain;border-radius:8px;background:#2c2237}.recipe-operator{font-size:10px;font-weight:1000;color:var(--gold)}.recipe-name{min-width:0;margin-left:3px}.recipe-name strong,.recipe-name small{display:block}.recipe-name strong{font-size:11px}.recipe-name small{color:var(--muted);font-size:8px}.fuse-button{min-height:40px;padding:0 10px;border:1px solid #6e5831;border-radius:9px;background:#3b2e1d;color:#f4c76c;font-size:9px;font-weight:900}.fuse-button:disabled{opacity:.35}.enemy-card{display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:9px;margin:16px 0;padding:11px;border:1px solid #473858;border-radius:18px;background:#20182e}.rival-mark{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:linear-gradient(145deg,#703b53,#281d31)}.rival-mark span{font-size:8px;font-weight:1000;letter-spacing:.12em}.enemy-copy{min-width:0}.enemy-copy strong,.enemy-copy small{display:block}.enemy-copy strong{font-size:14px}.enemy-copy small{margin-top:2px;color:var(--muted);font-size:10px}.enemy-preview{grid-column:1/4;display:flex;gap:4px;overflow:hidden}.enemy-preview img{width:36px;height:36px;object-fit:contain;border:1px solid #564167;border-radius:8px;background:#2b2138}.primary-button{min-height:52px;padding:0 16px;border-radius:14px;background:linear-gradient(#ffd66f,#ef9a37);color:#2d180a;box-shadow:0 5px 0 #a05b21,0 10px 20px #0007;letter-spacing:.04em}.primary-button:active{transform:translateY(3px);box-shadow:0 2px 0 #a05b21}.enemy-card .primary-button{grid-column:1/4;width:100%}.battle-phase{padding-top:12px}.battle-head{align-items:center}.battle-score{font-size:15px}.teams{display:grid;grid-template-columns:1fr 1fr;gap:8px}.team{padding:8px;border:1px solid #5a4731;border-radius:17px;background:linear-gradient(#302419,#1b1512)}.enemy-team{border-color:#51374b;background:linear-gradient(#30202d,#1a131c)}.team h3{margin:2px 0 8px;text-align:center;font-size:10px;letter-spacing:.12em;color:#d7bd91}.unit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;align-content:start}.unit-card{position:relative;min-width:0;padding:5px;border:1px solid #5c4b62;border-radius:11px;background:#21192b;transition:.2s}.unit-card.dead{opacity:.28;filter:grayscale(1)}.unit-card.hit{animation:hit .3s}.unit-card.acting{outline:2px solid var(--gold);transform:translateY(-2px)}@keyframes hit{50%{transform:translateX(5px);filter:brightness(1.8)}}.unit-card img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:8px;background:#15101d}.unit-card strong{display:block;margin:4px 0 3px;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.unit-health{height:7px;border-radius:5px;background:#0e0b12;overflow:hidden}.unit-health i{display:block;height:100%;background:#64dc8d;transition:width .25s}.unit-hp{display:block;margin-top:2px;color:var(--muted);font-size:7px}.unit-status{display:flex;flex-wrap:wrap;gap:2px;min-height:13px;margin-top:3px}.unit-status span{padding:2px 4px;border-radius:4px;font-size:6px;font-weight:900}.unit-status .burn{background:#672d16;color:#ffb06e}.unit-status .poison{background:#234b1f;color:#a9ef83}.unit-status .frost{background:#1d4260;color:#8ed6ff}.combat-legend{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:12px 0 8px;color:var(--muted);font-size:7px;font-weight:900}.combat-legend span{display:flex;align-items:center;gap:3px}.combat-legend i{width:7px;height:7px;border-radius:50%}.combat-legend .attack{background:#ff8c74}.combat-legend .defence{background:#a9bdcf}.combat-legend .burn{background:#ff913b}.combat-legend .poison{background:#83e660}.combat-legend .frost{background:#65cfff}.battle-log{height:150px;overflow:auto;padding:10px 12px;border-radius:14px;background:#15101e;color:#cbbfd8;font-size:11px;line-height:1.55}.battle-log b{color:var(--gold)}.wide{width:100%;margin-top:12px}.game-over{text-align:center;padding:40px 20px 20px}.game-over img{width:110px;height:110px;margin:auto;border-radius:28px}.game-over h2{font-size:26px;margin:8px}.game-over p{color:var(--muted);line-height:1.6}.drag-ghost{position:fixed;z-index:1000;display:flex;align-items:center;justify-content:center;width:78px;height:78px;border:2px solid var(--gold);border-radius:14px;background:#261d32e8;box-shadow:0 12px 30px #000b;pointer-events:none;transform:translate(-50%,-55%)}.drag-ghost img{width:68px;height:68px;object-fit:contain;border-radius:9px}.drag-ghost strong{position:absolute;right:-8px;bottom:-8px;padding:4px 6px;border-radius:7px;background:#f2bd55;color:#29190b;font-size:9px}.toast{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom));z-index:1100;max-width:calc(100% - 32px);padding:11px 16px;border-radius:12px;background:#f6e7be;color:#291c17;font-weight:800;font-size:13px;box-shadow:0 8px 25px #000a;opacity:0;transform:translate(-50%,20px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translate(-50%,0)}[hidden]{display:none!important}
@media(min-width:760px){body{padding-top:24px}.app-shell{width:min(100%,920px)}:root{--cell:76px}.pack-wrap{display:grid;grid-template-columns:456px 1fr;gap:12px}.selected-details{margin-top:0}.recipe-list{grid-template-columns:1fr 1fr}.enemy-card{grid-template-columns:60px 1fr 240px auto}.enemy-preview{grid-column:auto}.enemy-card .primary-button{grid-column:auto;width:auto}.unit-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.unit-card img{max-height:108px}.teams{gap:14px}}
@media(max-width:380px){.status-strip{grid-template-columns:repeat(2,1fr)}.shop-card{flex-basis:190px}.teams{gap:5px}.team{padding:5px}.unit-grid{gap:3px}.brand h1{font-size:18px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
