:root{--bg:#080a0f;--panel:#11151d;--line:#2a3140;--text:#eef1f7;--muted:#8c96a8;--hot:#ff3e64;--cyan:#39d9ff;--gold:#ffc857;--green:#66e27c;--purple:#a56eff;--blue:#5aa7ff}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -10%,#1d2230 0,#090b10 45%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;min-height:100vh}button{font:inherit;color:inherit;border:1px solid var(--line);background:#171c26;border-radius:10px;padding:10px 14px;cursor:pointer;transition:.15s ease}button:hover:not(:disabled){transform:translateY(-1px);border-color:#4b5870;background:#1d2430}button:disabled{opacity:.4;cursor:not-allowed}.primary{background:linear-gradient(135deg,#e93559,#b9214a);border-color:#ff5c78;font-weight:800}.secondary{background:#202838}.ghost{background:transparent}.icon-btn{padding:2px 9px;font-size:22px;background:transparent}.hidden{display:none!important}.muted{color:var(--muted)}
#app{max-width:1500px;margin:auto;padding:16px}.topbar{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:16px;margin-bottom:10px}.eyebrow{font-size:10px;letter-spacing:.18em;color:var(--cyan);font-weight:800}.topbar h1{margin:3px 0 0;font-size:27px;letter-spacing:.04em}.topbar h1 span{color:var(--hot)}.run-hud{display:flex;gap:12px;padding:7px 10px;border:1px solid var(--line);border-radius:11px;background:#0d1118;font-size:12px}.top-actions{display:flex;gap:7px}.panel{background:linear-gradient(180deg,rgba(22,27,38,.96),rgba(13,17,24,.96));border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.25)}
.arena{display:flex;flex-direction:column;gap:14px}.battle-room{position:relative;overflow:hidden;min-height:800px;padding:14px 18px 18px}.room-backdrop{position:absolute;inset:0;background:radial-gradient(circle at 50% 66%,rgba(94,113,142,.15),transparent 24%),radial-gradient(circle at 17% 22%,rgba(57,217,255,.08),transparent 18%),radial-gradient(circle at 83% 18%,rgba(255,200,87,.08),transparent 18%),linear-gradient(180deg,#1a1f2b 0 20%,#131824 20% 60%,#0d1118 60% 100%)}.wall-glow{position:absolute;top:75px;width:100px;height:190px;border-radius:50px;background:radial-gradient(circle,rgba(255,200,87,.26),rgba(255,200,87,0) 70%);filter:blur(8px);opacity:.65}.wall-glow.left{left:60px}.wall-glow.right{right:60px}.room-floor{position:absolute;left:0;right:0;bottom:0;height:40%;background:radial-gradient(ellipse at 50% 18%,rgba(255,255,255,.04),transparent 50%),linear-gradient(180deg,#12161f,#090b10);border-top:1px solid rgba(255,255,255,.05)}
.player-zone,.enemy-zone,.hand-zone{position:relative;z-index:1}.player-zone{position:absolute;left:18px;top:18px;width:34%;max-width:430px}.enemy-zone{position:absolute;right:18px;top:34px;width:55%;height:390px;display:flex;align-items:flex-start;justify-content:flex-end}.combat-ui-box{background:rgba(10,14,20,.78);border:1px solid rgba(72,84,103,.72);border-radius:14px;padding:10px 12px;backdrop-filter:blur(6px)}.player-ui-box{max-width:390px}.ui-name{font-size:11px;font-weight:900;letter-spacing:.16em;color:var(--cyan);margin-bottom:7px}.stat-line{display:flex;justify-content:space-between;font-size:12px;margin-bottom:4px}.bar{position:relative;height:16px;border-radius:999px;background:#080b10;border:1px solid #2b3444;overflow:hidden}.bar .fill{height:100%;width:0;transition:width .25s ease}.hp-bar .fill{background:linear-gradient(90deg,#b5143a,#ff4168)}.hp-bar.player .fill{background:linear-gradient(90deg,#d32248,#ff5a78)}.bar-inside{position:absolute;inset:0;display:grid;place-items:center;font-size:10px;font-weight:900;text-shadow:0 1px 2px #000;z-index:2}.meters{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin-top:9px}.meter{padding:7px 9px;border:1px solid #30394a;border-radius:9px;background:#0d1118;display:flex;justify-content:space-between;font-size:12px}.player-figure-wrap{margin-top:12px;display:flex;justify-content:center;align-items:flex-end;min-height:250px}.deejay-figure{position:relative;width:230px;height:240px}.dj-head{position:absolute;top:28px;left:81px;width:68px;height:68px;border-radius:50%;background:linear-gradient(180deg,#f4d5ba,#c88b63);box-shadow:0 0 0 6px #101625}.dj-head::before,.dj-head::after{content:"";position:absolute;top:12px;width:22px;height:22px;border-radius:50%;background:#101625}.dj-head::before{left:-11px}.dj-head::after{right:-11px}.dj-body{position:absolute;top:88px;left:54px;width:122px;height:112px;border-radius:24px 24px 14px 14px;background:linear-gradient(180deg,#22314f,#121926);border:1px solid #3c4a68}.dj-arm{position:absolute;top:108px;width:80px;height:20px;border-radius:999px;background:linear-gradient(90deg,#d7ab88,#b3764a)}.dj-arm.left{left:15px;transform:rotate(20deg)}.dj-arm.right{right:15px;transform:rotate(-20deg)}.dj-turntable{position:absolute;bottom:8px;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle at 50% 50%,#1f293b 0 18%,#394969 19% 22%,#0c1017 23% 58%,#4e6287 59% 64%,#101725 65% 100%);border:1px solid #435271;box-shadow:0 10px 30px rgba(0,0,0,.3)}.dj-turntable.left{left:20px}.dj-turntable.right{right:20px}.stance-strip{display:grid;grid-template-columns:auto auto auto 1fr;gap:7px;align-items:center;padding:9px;background:rgba(12,16,23,.78);border:1px solid #293243;border-radius:12px}.stance-pill{padding:7px 9px;font-size:11px}.stance-pill.active[data-stance=metal]{border-color:#ff5a62;background:#43181e}.stance-pill.active[data-stance=dnb]{border-color:#39d9ff;background:#103844}.stance-pill.active[data-stance=blues]{border-color:#6b8cff;background:#17284d}.bpm-wrap{min-width:125px}.bpm-label{display:flex;justify-content:space-between;font-size:10px;margin-bottom:4px}.bpm-bar{height:9px}.bpm-bar .fill{background:linear-gradient(90deg,#39d9ff,#a56eff)}.status-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.status{font-size:11px;border:1px solid #344054;border-radius:999px;padding:4px 8px;background:#121722}
.enemy-stage{display:flex;align-items:flex-start;justify-content:flex-end;gap:20px;width:100%;padding-top:8px}.enemy-unit{position:relative;width:245px;min-height:330px;display:flex;flex-direction:column;align-items:center}.enemy-unit.targeted .enemy-art{outline:2px solid var(--cyan);box-shadow:0 0 0 4px rgba(57,217,255,.12),0 20px 40px rgba(0,0,0,.35)}.intent{position:relative;margin-bottom:8px;background:#0b0e14;border:1px solid #49566e;border-radius:12px;padding:8px 11px;min-width:150px;max-width:220px;text-align:center;font-weight:800;font-size:12px}.intent small{display:block;color:var(--muted);font-size:9px;margin-bottom:2px}.enemy-art{width:215px;height:195px;border-radius:18px;display:grid;place-items:center;background:radial-gradient(circle at 50% 65%,rgba(93,255,142,.15),transparent 55%),rgba(13,17,24,.9);position:relative;overflow:hidden;border:1px solid rgba(85,116,95,.42);box-shadow:0 18px 35px rgba(0,0,0,.24);cursor:pointer}.enemy-silhouette{font-size:74px;filter:drop-shadow(0 12px 10px rgba(0,0,0,.35))}.slime-shape{width:155px;height:120px;background:linear-gradient(180deg,#9cff73,#3fa94f);border-radius:52% 52% 28% 28% / 65% 65% 35% 35%;position:relative;box-shadow:0 0 45px rgba(92,255,110,.25),inset 0 10px 20px rgba(255,255,255,.17)}.slime-shape:after{content:"";position:absolute;left:-22px;right:-22px;bottom:-18px;height:32px;background:#3fa94f;border-radius:50%}.slime-eye{position:absolute;width:13px;height:17px;background:#07110a;border-radius:50%;top:46px}.slime-eye.left{left:43px}.slime-eye.right{right:43px}.enemy-name{font-size:13px;font-weight:900;margin:8px 0 4px}.enemy-hp-wrap{width:210px}.enemy-hp{height:18px}.enemy-statuses{justify-content:center;min-height:24px;margin-top:6px}.enemy-dead{opacity:.25;filter:grayscale(1)}
.hand-zone{position:absolute;left:0;right:0;bottom:0;padding:10px 18px 16px;background:linear-gradient(180deg,rgba(9,11,16,0) 0,rgba(9,11,16,.12) 8%,rgba(9,11,16,.88) 28%,rgba(9,11,16,.97) 100%)}.hand-head{display:flex;justify-content:space-between;align-items:center;margin:12px 0 8px;font-size:12px;padding:0 8px}.deck-stats{display:flex;gap:14px;color:var(--muted)}.hand{display:flex;gap:0;align-items:flex-end;justify-content:center;min-height:250px;padding:16px 24px 6px}.card{width:148px;min-width:148px;height:216px;border:1px solid #354159;border-radius:14px;background:linear-gradient(180deg,#1b2230,#111720);padding:10px;display:flex;flex-direction:column;position:relative;cursor:pointer;user-select:none;transition:.15s ease;box-shadow:0 10px 22px rgba(0,0,0,.30);transform-origin:center 132%}.card:hover{transform:translateY(-8px) scale(1.02)!important;border-color:#7f94bf;z-index:50!important}.card.unplayable{opacity:.43;cursor:not-allowed;filter:saturate(.6)}.card .cost{position:absolute;right:8px;top:8px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#243a5a;border:1px solid #4c76a8;font-weight:900}.card .rarity{font-size:9px;letter-spacing:.11em;color:var(--muted);font-weight:900}.card h4{font-size:14px;margin:20px 0 5px}.card .type{font-size:10px;color:var(--cyan);text-transform:uppercase;font-weight:800}.card p{font-size:11px;line-height:1.38;color:#cbd1dc;margin:9px 0 0}.card .art-mini{height:48px;border-radius:8px;margin-top:auto;background:linear-gradient(135deg,#26172d,#0f2731);border:1px solid #30384a;display:grid;place-items:center;font-size:21px}.combat-actions{display:flex;justify-content:flex-end;padding:6px 8px 0}.fan-hand .card:nth-child(1){transform:translateY(25px) rotate(-18deg)}.fan-hand .card:nth-child(2){transform:translateY(15px) rotate(-11deg);margin-left:-40px}.fan-hand .card:nth-child(3){transform:translateY(8px) rotate(-5deg);margin-left:-40px}.fan-hand .card:nth-child(4){transform:translateY(2px) rotate(0deg);margin-left:-40px}.fan-hand .card:nth-child(5){transform:translateY(8px) rotate(5deg);margin-left:-40px}.fan-hand .card:nth-child(6){transform:translateY(15px) rotate(11deg);margin-left:-40px}.fan-hand .card:nth-child(7){transform:translateY(25px) rotate(18deg);margin-left:-40px}.fan-hand .card:nth-child(n+8){margin-left:-40px}
.side-zone{display:grid;grid-template-columns:300px 300px 1fr;gap:14px}.inventory-panel,.relic-panel,.log-panel{padding:13px}.zone-title{font-size:10px;letter-spacing:.15em;color:var(--muted);font-weight:900;margin-bottom:9px;display:flex;justify-content:space-between}.log-panel{min-height:220px;display:flex;flex-direction:column}.inventory,.relic-list{display:grid;gap:7px}.item,.relic-chip{border:1px solid #30394a;border-radius:10px;background:#0d1118;padding:8px;display:flex;justify-content:space-between;gap:8px;align-items:center}.item b,.relic-chip b{font-size:12px}.item small,.relic-chip small{display:block;color:var(--muted);font-size:10px;margin-top:2px}.item button{padding:5px 8px;font-size:10px}.empty{color:var(--muted);font-size:11px;padding:10px;border:1px dashed #31394a;border-radius:10px;text-align:center}.log{overflow:auto;display:flex;flex-direction:column-reverse;gap:5px;flex:1}.log-entry{font-size:11px;line-height:1.35;padding:6px 7px;border-left:2px solid #374154;background:#0c1017}.log-entry.good{border-color:var(--green)}.log-entry.bad{border-color:var(--hot)}.log-entry.info{border-color:var(--cyan)}
.overlay{position:fixed;inset:0;background:rgba(3,5,8,.84);backdrop-filter:blur(8px);z-index:30;display:grid;place-items:center;padding:20px}.reward-modal,.choice-modal,.room-modal,.map-modal{width:min(960px,95vw);max-height:92vh;overflow:auto;background:#111720;border:1px solid #3a4559;border-radius:18px;padding:22px;box-shadow:0 30px 80px #000}.map-modal{width:min(1050px,96vw)}.map-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.map-head h2,.reward-modal h2{font-size:28px;margin:3px 0}.act-map{display:flex;flex-direction:column;gap:16px;margin-top:20px}.map-row{display:flex;justify-content:center;gap:24px;position:relative}.map-row:not(:last-child)::after{content:"";position:absolute;left:50%;top:100%;height:16px;border-left:1px dashed #46536b}.room-node{min-width:150px;padding:11px 12px;border-radius:14px;border:1px solid #364157;background:#0d121a;text-align:center}.room-node.current{border-color:var(--cyan);box-shadow:0 0 0 2px rgba(57,217,255,.1)}.room-node.locked{opacity:.35;pointer-events:none}.room-node.done{opacity:.45}.room-node .icon{font-size:22px;display:block}.room-node small{display:block;color:var(--muted);font-size:9px;margin-top:4px}.reward-section{margin:18px 0}.reward-cards{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0}.reward-card{width:180px;border:1px solid #384359;border-radius:12px;background:#151b26;padding:12px;cursor:pointer}.reward-card:hover{border-color:#7486a9}.reward-card.selected{border-color:var(--green);box-shadow:0 0 0 1px var(--green)}.reward-card h4{margin:5px 0}.reward-card p{font-size:11px;line-height:1.35;color:#cbd1dc}.reward-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:15px 0}.reward-box{border:1px solid #303a4d;border-radius:12px;padding:12px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;background:#0c1017}.reward-icon{font-size:24px}.reward-box p{margin:3px 0;font-size:11px;color:var(--muted)}.room-actions{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:14px}.room-action{padding:14px;text-align:left}.room-action b{display:block}.room-action span{font-size:11px;color:var(--muted)}.shop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.shop-card{padding:12px;border:1px solid #334056;border-radius:12px;background:#0d121a}.shop-card b{display:block;margin-bottom:4px}.shop-card small{color:var(--muted);font-size:10px}.shop-card button{width:100%;margin-top:8px;font-size:11px;padding:7px}.debug-panel{position:fixed;right:20px;top:80px;width:320px;background:#131925;border:1px solid #46536b;border-radius:14px;z-index:25;padding:14px;box-shadow:0 20px 50px #000}.debug-head{display:flex;justify-content:space-between}.debug-panel p{font-size:11px;color:var(--muted)}.debug-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.debug-grid button,.debug-specials button{font-size:10px;padding:7px}.debug-specials{border-top:1px solid #2c3546;margin-top:12px;padding-top:12px;display:flex;gap:6px;flex-wrap:wrap}.debug-specials .muted{width:100%;font-size:10px}.damage-pop{animation:flash .35s ease}@keyframes flash{0%{filter:brightness(1)}50%{filter:brightness(2.1)}100%{filter:brightness(1)}}
@media(max-width:1200px){.battle-room{min-height:900px}.enemy-zone{width:58%}.side-zone{grid-template-columns:1fr 1fr}.log-panel{grid-column:1/-1}.enemy-unit{width:210px}.enemy-art{width:190px}.enemy-hp-wrap{width:188px}}
@media(max-width:950px){#app{padding:10px}.topbar{grid-template-columns:1fr;align-items:flex-start}.battle-room{min-height:1160px}.player-zone,.enemy-zone{position:relative;left:auto;right:auto;top:auto;width:100%;max-width:none;height:auto}.enemy-zone{margin-top:15px}.enemy-stage{justify-content:center;flex-wrap:wrap}.player-ui-box{max-width:none}.player-figure-wrap{min-height:210px}.hand-zone{position:relative;left:auto;right:auto;bottom:auto;background:none;padding-top:8px}.hand{overflow-x:auto;justify-content:flex-start}.fan-hand .card{margin-left:0!important;transform:none!important}.side-zone{grid-template-columns:1fr}.log-panel{grid-column:auto}.reward-grid,.shop-grid{grid-template-columns:1fr}.stance-strip{grid-template-columns:1fr 1fr 1fr}.bpm-wrap{grid-column:1/-1}}