/* ============================================================
   ANIMIUM — Idle Mining Clicker  ·  stylesheet
   ============================================================ */

:root{
  --bg:#0c0a18;
  --bg2:#151032;
  --panel:rgba(26,19,58,.72);
  --panel-solid:#1a133a;
  --panel-2:rgba(38,28,82,.55);
  --text:#ece8ff;
  --muted:#a79edb;
  --line:#332a63;
  --accent:#8b5cff;
  --accent2:#ff5c9d;
  --accent3:#33d6ff;
  --gold:#ffb020;
  --good:#37d98a;
  --bad:#ff5c74;
  --r-R:#8b98bf;
  --r-SR:#9a6bff;
  --r-SSR:#ffb020;
  --r-UR:#ff3d6e;
  --r-LR:#00e5d0;
  --r-MR:#ff2fd6;
  --radius:16px;
  --shadow:0 12px 40px -12px rgba(0,0,0,.6);
  --font:"Baloo 2","Trebuchet MS","Segoe UI",system-ui,-apple-system,sans-serif;
  --font-body:"Kiwi Maru","Trebuchet MS","Segoe UI",system-ui,sans-serif;
}
[data-theme="sakura"]{
  --bg:#1b0f1c; --bg2:#2a1330;
  --accent:#ff6fa5; --accent2:#ffab6b; --accent3:#c98bff;
}
[data-theme="matrix"]{
  --bg:#03110a; --bg2:#04231a;
  --accent:#28e070; --accent2:#8affbe; --accent3:#00b7ff;
  --text:#daffe9; --muted:#79c99b;
}
[data-theme="homura"]{
  --bg:#0c0814; --bg2:#1a1030;
  --accent:#9b5cff; --accent2:#c9c9e0; --accent3:#6b3fd1;
}
[data-theme="madoka"]{
  --bg:#1a0c16; --bg2:#2d1226;
  --accent:#ff7ac0; --accent2:#ffd76a; --accent3:#ffb3d9;
}
[data-theme="ember"]{
  --bg:#160a08; --bg2:#2a120c;
  --accent:#ff7a3d; --accent2:#ffd23d; --accent3:#ff4d6d;
}

*{box-sizing:border-box;margin:0;padding:0}
/* v0.0.9-hotfix — was `height:100%`, which made <body> its own scroll container.
   Every render's `window.scrollY` then read 0 and `window.scrollTo(0, sy)` was a
   no-op, so a periodic panel rebuild dropped you to the top on tall pages.
   `min-height` lets the document grow and the WINDOW be the scrollport again. */
html,body{min-height:100%}
html{overflow-x:hidden}   /* v0.0.8 — kill root horizontal scroll on phones (body already clips) */
body{
  font-family:var(--font-body);
  color:var(--text);
  background:
    radial-gradient(1200px 700px at 15% -10%, rgba(139,92,255,.28), transparent 60%),
    radial-gradient(1000px 600px at 100% 0%, rgba(255,92,157,.20), transparent 55%),
    radial-gradient(900px 700px at 50% 120%, rgba(51,214,255,.16), transparent 60%),
    linear-gradient(180deg,var(--bg),var(--bg2));
  background-attachment:fixed;
  overflow-x:hidden;
  -webkit-tap-highlight-color:transparent;
}
h1,h2,h3,h4,.f-display{font-family:var(--font);letter-spacing:.3px}
button{font-family:var(--font);cursor:pointer;border:0;background:none;color:inherit}
small{font-size:.72em}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:var(--line);border-radius:20px}
::-webkit-scrollbar-track{background:transparent}

/* ---------- shell ---------- */
#app{
  max-width:1100px;margin:0 auto;min-height:100vh;
  display:flex;flex-direction:column;
  padding:14px 14px 26px;
}

#hud{
  position:sticky;top:8px;z-index:20;
  display:flex;align-items:center;gap:16px;flex-wrap:wrap;
  padding:12px 16px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  backdrop-filter:blur(12px);
  box-shadow:var(--shadow);
}
.hud-brand{
  font-family:var(--font);font-weight:800;font-size:20px;
  display:flex;align-items:center;gap:8px;
  background:linear-gradient(90deg,var(--accent3),var(--accent2));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 12px rgba(139,92,255,.4));
}
.hud-brand>span{letter-spacing:2px}
.hud-stats{display:flex;gap:10px;flex-wrap:wrap;flex:1}
.hud-stat{
  display:flex;align-items:center;gap:8px;
  padding:7px 12px;border-radius:12px;
  background:var(--panel-2);border:1px solid var(--line);
  min-width:0;
}
.hud-stat[hidden]{display:none}   /* v0.0.8 — the flex above was overriding [hidden] */
.hud-ico{font-size:18px;filter:drop-shadow(0 0 6px rgba(255,255,255,.15))}
.hud-val{display:flex;flex-direction:column;line-height:1.05}
.hud-val b{font-family:var(--font);font-size:16px}
.hud-val small{color:var(--muted)}
.hud-rate{color:var(--good);font-size:12px;font-weight:700}
.hud-bar{position:relative;width:70px;height:6px;border-radius:6px;background:#0006;overflow:hidden}
.hud-bar>i{position:absolute;inset:0 100% 0 0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:right .2s}
#save-flash{
  font-size:12px;color:var(--good);opacity:0;transition:opacity .3s;
  border:1px solid var(--good);border-radius:999px;padding:3px 10px;
}
#save-flash.show{opacity:.9}
#hud-buffs{display:flex;gap:6px;flex-wrap:wrap;flex-basis:100%;margin-top:6px}
#hud-buffs[hidden]{display:none}
.hud-buff{font-family:var(--font);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;
  background:linear-gradient(180deg,rgba(255,214,107,.22),rgba(255,176,32,.10));
  border:1px solid var(--gold);color:var(--gold)}
.hud-buff b{color:#fff;margin-left:2px}

#nav{
  display:flex;gap:8px;margin:12px 0;
}
#nav button[hidden]{display:none}   /* the flex below overrides the UA [hidden] rule */
#nav button{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;
  padding:10px 6px;border-radius:12px;
  background:var(--panel-2);border:1px solid var(--line);
  color:var(--muted);font-weight:700;font-size:13px;
  transition:transform .12s,background .2s,color .2s,border-color .2s;
}
#nav button span{font-size:18px}
#nav button:hover{transform:translateY(-2px);color:var(--text)}
#nav button.active{
  color:#fff;border-color:var(--accent);
  background:linear-gradient(180deg,rgba(139,92,255,.35),rgba(139,92,255,.12));
  box-shadow:0 0 0 1px var(--accent) inset,0 8px 24px -10px var(--accent);
}
#nav button.pip{position:relative}
#nav button.pip::after{
  content:"";position:absolute;top:6px;right:14px;width:8px;height:8px;border-radius:50%;
  background:var(--accent2);box-shadow:0 0 8px var(--accent2);animation:pulse 1.4s infinite;
  will-change:transform,opacity;   /* ⚡ own compositor layer — no repaint of the nav button each frame */
}

#stage{flex:1}
.panel{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  backdrop-filter:blur(10px);
  padding:18px;
  animation:panelIn .25s ease;
}
@keyframes panelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.section-title{
  font-family:var(--font);font-weight:800;font-size:15px;
  text-transform:uppercase;letter-spacing:1.5px;color:var(--muted);
  margin:6px 2px 12px;display:flex;align-items:center;gap:10px;
}
.section-title::after{content:"";flex:1;height:1px;background:var(--line)}

/* ---------- MINE tab ---------- */
.mine-wrap{display:grid;grid-template-columns:1.2fr 1fr;gap:20px;align-items:start}
@media(max-width:760px){.mine-wrap{grid-template-columns:1fr}}

.ore-stage{
  position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-height:360px;padding:20px;
  border-radius:20px;
  background:
    radial-gradient(400px 300px at 50% 40%, rgba(139,92,255,.20), transparent 70%),
    var(--panel-2);
  border:1px solid var(--line);
  overflow:hidden;
}
.ore-stage .speedlines{
  position:absolute;inset:-40%;
  background:repeating-conic-gradient(from 0deg at 50% 50%, transparent 0deg 6deg, rgba(255,255,255,.05) 6deg 7deg);
  opacity:0;pointer-events:none;
}
.ore-stage.hit .speedlines{animation:speed .4s ease-out}
@keyframes speed{0%{opacity:.7;transform:scale(.6) rotate(0)}100%{opacity:0;transform:scale(1.4) rotate(12deg)}}

.ore-btn{
  position:relative;width:230px;height:230px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:96px;line-height:1;
  background:
    radial-gradient(circle at 35% 30%, #fff8, transparent 45%),
    radial-gradient(circle at 65% 75%, rgba(51,214,255,.55), transparent 55%),
    conic-gradient(from 210deg, var(--accent), var(--accent2), var(--accent3), var(--accent));
  box-shadow:
    0 0 0 6px rgba(255,255,255,.06),
    0 0 60px -6px var(--accent),
    inset 0 -20px 50px rgba(0,0,0,.35),
    inset 0 20px 40px rgba(255,255,255,.25);
  animation:orefloat 4s ease-in-out infinite;
  transition:transform .08s ease;
  user-select:none;touch-action:manipulation;
  filter:drop-shadow(0 20px 30px rgba(0,0,0,.4));
}
.ore-btn::after{
  content:"";position:absolute;inset:0;border-radius:50%;
  background:linear-gradient(120deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%);
  transform:translateX(-120%);
}
.ore-btn.hit{transform:scale(.92)}
.ore-btn.hit::after{animation:shine .5s ease-out}
@keyframes shine{to{transform:translateX(120%)}}

/* ⛏️🕸️ DIVINE MINE 2 — the ore circle split into 3 clickable wedges */
.ore-wedge-wrap{
  position:relative;width:230px;height:230px;border-radius:50%;overflow:hidden;
  box-shadow:0 0 0 6px rgba(255,255,255,.06),0 0 60px -6px var(--accent),inset 0 -20px 50px rgba(0,0,0,.35);
  filter:drop-shadow(0 20px 30px rgba(0,0,0,.4));
}
.ore-wedge{
  position:absolute;inset:0;width:100%;height:100%;border:none;cursor:pointer;
  font-size:34px;color:#fff;user-select:none;touch-action:manipulation;
  transition:filter .2s ease,opacity .2s ease;
  display:flex;align-items:flex-start;justify-content:flex-start;
}
/* icon padding places each glyph at its OWN wedge's visual centroid (radius
   ~70px from the 115,115 circle center, along that wedge's bisecting angle)
   rather than flex-aligning to a corner of the full unclipped circle — the
   corner approach put the ember icon right on the ember/whisper clip-path
   boundary, so it got visibly sliced in half (found live 2026-09-17). */
.ore-wedge-ember{clip-path:polygon(50% 50%,50% -50%,136.6% 100%);background:conic-gradient(from 210deg,#ff8a3d,#ffb35c,#ff5c3d);padding:62px 0 0 158px}
.ore-wedge-glass{clip-path:polygon(50% 50%,136.6% 100%,-36.6% 100%);background:conic-gradient(from 90deg,#33d6ff,#8fe9ff,#33a8ff);padding:167px 0 0 97px}
.ore-wedge-whisper{clip-path:polygon(50% 50%,-36.6% 100%,50% -50%);background:conic-gradient(from 330deg,#b478ff,#e6c8ff,#8b5cff);padding:62px 0 0 36px}
.ore-wedge.hit{filter:brightness(1.4)}
.ore-wedge.cooling{filter:grayscale(.7) brightness(.45);cursor:not-allowed}
.md-offer{border:1px solid rgba(180,120,255,.35);background:linear-gradient(180deg,rgba(90,40,140,.14),rgba(20,8,32,.3))}
.md-offer-desc{font-size:11.5px;color:var(--muted);line-height:1.5;margin:4px 0 10px}
@keyframes orefloat{0%,100%{transform:translateY(-6px)}50%{transform:translateY(10px)}}

.ore-hint{margin-top:18px;color:var(--muted);font-size:13px;text-align:center}
.combo-wrap{margin-top:14px;width:230px;max-width:80%}
.combo-bar{height:10px;border-radius:8px;background:#0007;overflow:hidden;border:1px solid var(--line)}
.combo-bar>i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--accent2),var(--bad));transition:width .1s}
.combo-lbl{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);margin-top:4px}
.combo-lbl b{color:var(--gold);font-family:var(--font)}
.berserk-wrap{margin-top:8px}
.berserk-wrap .combo-bar{transition:box-shadow .2s}
.berserk-wrap .combo-bar>i{background:linear-gradient(90deg,var(--bad),#ff2d2d,#ff8a00);background-size:200% 100%}
.berserk-wrap .combo-lbl b{color:#ff8a00}

/* high multiplier — the meter runs hot */
.berserk-wrap.hot .combo-bar{animation:berserkPulse .58s ease-in-out infinite}
.berserk-wrap.hot .combo-bar>i{animation:berserkShift .5s linear infinite}
.berserk-wrap.hot .combo-lbl b{animation:berserkText .42s ease-in-out infinite}
.berserk-wrap.max{animation:berserkShake .11s linear infinite}
.berserk-wrap.max .combo-lbl b::after{content:" 🔥";animation:berserkText .3s ease-in-out infinite}
@keyframes berserkPulse{
  0%,100%{box-shadow:0 0 4px rgba(255,138,0,.35)}
  50%{box-shadow:0 0 16px 2px #ff8a00,0 0 34px rgba(255,45,45,.6)}
}
@keyframes berserkShift{to{background-position:-200% 0}}
@keyframes berserkText{0%,100%{transform:scale(1)}50%{transform:scale(1.22);color:#ffd23d}}
@keyframes berserkShake{0%,100%{transform:translateX(0)}25%{transform:translateX(-1.5px)}75%{transform:translateX(1.5px)}}

/* ore glows red-hot when berserk is maxed */
.ore-btn.berserk-max{animation:orefloat 4s ease-in-out infinite,oreHot 1.3s ease-in-out infinite}
@keyframes oreHot{
  0%,100%{filter:drop-shadow(0 20px 30px rgba(0,0,0,.4))}
  50%{filter:drop-shadow(0 0 40px #ff6a00) drop-shadow(0 0 20px #ff2d2d) drop-shadow(0 20px 30px rgba(0,0,0,.4))}
}

.mine-side{display:flex;flex-direction:column;gap:12px}
.stat-card{
  background:var(--panel-2);border:1px solid var(--line);border-radius:14px;padding:14px;
}
.stat-card-h{font-family:var(--font);font-weight:800;font-size:12px;letter-spacing:.06em;color:var(--muted);margin-bottom:8px}
.mine-status .mstat-crises{display:flex;flex-direction:column;gap:5px;margin-bottom:8px}
.mine-status .mstat-crisis{font-size:11.5px;line-height:1.35;padding:6px 9px;border-radius:9px;
  color:#ffd9b8;background:linear-gradient(180deg,rgba(255,110,80,.15),rgba(255,110,80,.05));border:1px solid rgba(255,140,90,.4)}
.mine-status .mstat-ok{font-size:11.5px;color:var(--good);margin-bottom:8px}
.mine-status .mstat-rates{display:flex;flex-wrap:wrap;gap:6px}
.mine-status .mstat-rate{font-family:var(--font);font-weight:700;font-size:11px;padding:4px 8px;border-radius:8px;
  background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--text);white-space:nowrap;font-variant-numeric:tabular-nums}
.stat-row{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;border-bottom:1px dashed var(--line)}
.stat-row:last-child{border-bottom:0}
.stat-row .k{color:var(--muted);font-size:13px}
.stat-row .v{font-family:var(--font);font-weight:700}
.toggle{
  display:flex;align-items:center;gap:10px;justify-content:space-between;
  background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;
}
.toggle .sw{width:46px;height:26px;border-radius:999px;background:#0007;position:relative;border:1px solid var(--line);flex:none;transition:background .2s}
.toggle .sw::after{content:"";position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:50%;background:#fff;transition:left .18s}
.toggle.on .sw{background:linear-gradient(90deg,var(--accent),var(--accent2))}
.toggle.on .sw::after{left:22px}
.toggle.locked{opacity:.5}

/* ---------- shop rows ---------- */
.shop-buy-modes{display:flex;gap:6px;margin:0 2px 12px}
.shop-buy-modes button{
  padding:6px 12px;border-radius:10px;font-size:12px;font-weight:700;
  background:var(--panel-2);border:1px solid var(--line);color:var(--muted);
}
.shop-buy-modes button.active{color:#fff;border-color:var(--accent);background:rgba(139,92,255,.25)}
.shop-buy-modes button:disabled{opacity:.35;cursor:not-allowed}

.shop-list{display:flex;flex-direction:column;gap:10px}

/* Refinery — manual Animium → Crystal converter */
.refinery{background:var(--panel-2);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-bottom:6px}
.ref-desc{font-size:12px;color:var(--muted);line-height:1.5;margin-bottom:10px}
.ref-desc b{color:var(--text);font-family:var(--font)}
.ref-row{display:flex;gap:8px;flex-wrap:wrap}
.ref-btn{font-family:var(--font);font-weight:800;font-size:12px;padding:9px 16px;border-radius:10px;cursor:pointer;
  color:#0b1220;background:linear-gradient(180deg,#7bd8ff,#3aa0e0);border:1px solid #7bd8ff}
.ref-btn.alt{background:linear-gradient(180deg,#ffd66b,#e0a63a);border-color:#ffd66b}
.ref-btn.warn{color:#fff;background:linear-gradient(180deg,#ff8a7b,#c23a3a);border-color:#ff8a7b}
.ref-btn.sm{padding:6px 12px;font-size:11px}
.ref-btn:disabled{filter:grayscale(.6) brightness(.7);cursor:not-allowed}
.shop-item{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
  padding:12px 14px;border-radius:14px;
  background:var(--panel-2);border:1px solid var(--line);
  transition:transform .1s,border-color .2s,background .2s;
}
.shop-item.affordable{border-color:rgba(139,92,255,.55)}
.shop-item.affordable:hover{transform:translateX(3px)}
.shop-item.locked{opacity:.55;filter:grayscale(.4)}
.shop-item.maxed{opacity:.7}
.si-ico{
  width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:24px;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(0,0,0,.20));border:1px solid var(--line);
  flex:none;
}
.si-body{min-width:0}
.si-name{font-family:var(--font);font-weight:700;font-size:14px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.si-lvl{font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:1px 8px}
.si-info{font-size:12px;line-height:1;color:var(--muted);background:none;border:1px solid var(--line);border-radius:50%;width:18px;height:18px;cursor:pointer;flex:0 0 auto}
.si-info:hover{color:var(--text);border-color:var(--accent)}
.si-echo.owned{color:var(--gold);border-color:var(--gold);cursor:default}
.si-desc{color:var(--muted);font-size:12px;margin-top:2px}
.si-prod{color:var(--good);font-size:11px;margin-top:3px}
.si-prod.gold{color:var(--gold)}
.si-tier{color:#e8c877;font-size:11px;margin-top:3px}
.si-tier b{color:#ffe08a}
.si-req{color:var(--bad);font-size:11px;margin-top:3px}
.si-buy{
  flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:2px;
  padding:8px 14px;border-radius:12px;min-width:110px;text-align:right;
  background:linear-gradient(180deg,rgba(139,92,255,.30),rgba(139,92,255,.08));
  border:1px solid var(--accent);color:#fff;font-family:var(--font);
  transition:transform .1s,filter .15s;
}
.si-buy:disabled{filter:grayscale(1) brightness(.7);border-color:var(--line);cursor:not-allowed}
.si-buy:not(:disabled):active{transform:scale(.96)}
.si-buy .cost{font-weight:800;font-size:13px}
.si-buy .cost.crystal{color:var(--gold)}
.si-buy small{color:#ffffffcc}

/* ---------- CARDS tab ---------- */
.cards-head{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.cards-tabs{display:flex;gap:6px}
.cards-tabs button{
  padding:8px 16px;border-radius:10px;font-weight:700;font-size:13px;
  background:var(--panel-2);border:1px solid var(--line);color:var(--muted);
}
.cards-tabs button.active{color:#fff;border-color:var(--accent);background:rgba(139,92,255,.25)}
.cards-spacer{flex:1}
.pity-pill{font-size:11px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:4px 10px}
.pity-pill b{color:var(--gold);font-family:var(--font)}

.summon-panel{
  display:flex;flex-direction:column;align-items:center;gap:16px;
  padding:24px;border-radius:18px;
  background:
    radial-gradient(500px 260px at 50% 0%, rgba(255,92,157,.18), transparent 65%),
    var(--panel-2);
  border:1px solid var(--line);
}
.banner-art{
  width:100%;max-width:520px;height:170px;border-radius:14px;
  background:
    radial-gradient(circle at 20% 30%, rgba(255,255,255,.20), transparent 40%),
    conic-gradient(from 120deg,var(--accent),var(--accent2),var(--accent3),var(--accent));
  display:flex;align-items:center;justify-content:center;gap:12px;font-size:56px;
  box-shadow:inset 0 0 60px rgba(0,0,0,.35);
  position:relative;overflow:hidden;
}
.banner-art::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 45%,rgba(255,255,255,.35) 50%,transparent 55%);transform:translateX(-100%);animation:shine 3.5s ease-in-out infinite}
.banner-title{font-family:var(--font);font-weight:800;font-size:20px;text-align:center}
.banner-sub{color:var(--muted);font-size:13px;text-align:center;max-width:460px}

.summon-buttons{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.summon-btn{
  padding:14px 26px;border-radius:14px;font-family:var(--font);font-weight:800;font-size:15px;
  background:linear-gradient(180deg,rgba(255,176,32,.35),rgba(255,176,32,.10));
  border:1px solid var(--gold);color:#fff;
  display:flex;flex-direction:column;align-items:center;gap:2px;
  transition:transform .1s,filter .15s;min-width:150px;
}
.summon-btn.alt{
  background:linear-gradient(180deg,rgba(139,92,255,.35),rgba(139,92,255,.10));
  border-color:var(--accent);
}
.summon-btn small{font-weight:700;color:#ffe9bd}
.summon-btn.alt small{color:#d8ccff}
.summon-btn:disabled{filter:grayscale(1) brightness(.7);cursor:not-allowed}
/* 💸 inflation rationing — looks disabled but stays clickable so the tap can explain why */
.summon-btn.rationed{filter:grayscale(1) brightness(.7);cursor:not-allowed}
.summon-btn:not(:disabled):hover{transform:translateY(-2px)}
.summon-btn:not(:disabled):active{transform:scale(.97)}

.rates-note{font-size:11px;color:var(--muted);text-align:center;line-height:1.7}
.rates-note b{color:var(--text)}

/* booster packs */
.pack-list{display:flex;flex-direction:column;gap:10px}
.pack-item{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
  padding:12px 14px;border-radius:14px;
  background:var(--panel-2);border:1px solid var(--line);
  transition:transform .1s,border-color .2s;
}
.pack-item.affordable{border-color:rgba(255,176,32,.5)}
.pack-item.affordable:hover{transform:translateX(3px)}
.pack-item.owned{opacity:.7}
.pack-ico{
  width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;
  font-size:26px;flex:none;
  background:linear-gradient(160deg,rgba(255,176,32,.16),rgba(0,0,0,.25));border:1px solid var(--line);
}
.pack-name{font-family:var(--font);font-weight:800;font-size:14px}
.pack-desc{color:var(--muted);font-size:12px;margin-top:2px;line-height:1.4}
.pack-contents{color:var(--gold);font-size:11px;margin-top:4px;font-family:var(--font)}
.pack-welcome{color:#8ef5d0;font-size:11px;margin-top:4px;line-height:1.35}
.pack-buy{
  flex:none;min-width:104px;padding:9px 14px;border-radius:12px;
  font-family:var(--font);font-weight:800;font-size:13px;color:#fff;
  background:linear-gradient(180deg,rgba(255,176,32,.32),rgba(255,176,32,.08));
  border:1px solid var(--gold);
  transition:transform .1s,filter .15s;
}
.pack-buy:disabled{filter:grayscale(1) brightness(.7);border-color:var(--line);cursor:not-allowed}
.pack-buy:not(:disabled):active{transform:scale(.96)}
.pack-item.grace{border-color:rgba(255,158,207,.4)}
.pack-item.grace .pack-ico{background:linear-gradient(160deg,rgba(255,158,207,.18),rgba(0,0,0,.25))}
.pack-item.grace .pack-buy{background:linear-gradient(180deg,rgba(255,158,207,.28),rgba(255,158,207,.06));border-color:#ff9ecf}
.ac.pack-locked .ac-flavor{color:var(--gold);font-style:normal}
/* 🕸️ Etap 2 — pack Ulepszone (Echo) upgrade row */
.pack-item.echo-upgrade{border-color:rgba(180,120,255,.4);background:linear-gradient(90deg,rgba(180,120,255,.06),var(--panel-2))}
.pack-item.echo-upgrade .pack-ico{background:linear-gradient(160deg,rgba(180,120,255,.22),rgba(0,0,0,.25))}
.pack-item.echo-upgrade .pack-buy{background:linear-gradient(180deg,rgba(180,120,255,.3),rgba(180,120,255,.08));border-color:#b478ff}
.pack-item.echo-upgrade.owned{opacity:.7}

/* ---------- version badge ---------- */
#version-badge{
  position:fixed;right:9px;bottom:7px;z-index:50;pointer-events:none;
  font:700 11px/1 var(--font);color:var(--muted);opacity:.55;letter-spacing:.6px;
  text-shadow:0 1px 3px rgba(0,0,0,.6);
}
#neglect-banner{
  position:fixed;left:50%;top:6px;transform:translateX(-50%);z-index:70;
  max-width:92vw;padding:7px 16px;border-radius:999px;
  background:linear-gradient(90deg,rgba(255,45,45,.92),rgba(255,138,0,.92));
  color:#fff;font:700 12px/1.4 var(--font);text-align:center;
  box-shadow:0 8px 24px -8px #000;animation:bannerPulse 2s infinite}
#neglect-banner b{color:#ffe08a}

/* ---------- Ascension tab ---------- */
.asc-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:12px}
.asc-title{font-family:var(--font);font-weight:800;font-size:20px;
  background:linear-gradient(90deg,#ff9ecf,#c9a3ff,var(--accent3));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.asc-stats{font-size:12px;color:var(--muted)}
.asc-stats b{color:var(--text);font-family:var(--font)}
.asc-locked{
  background:var(--panel-2);border:1px dashed var(--line);border-radius:12px;
  padding:14px;color:var(--muted);font-size:13px;line-height:1.6;
}
.asc-locked b{color:var(--text)}
.asc-warn{
  background:rgba(255,92,116,.10);border:1px solid var(--bad);border-radius:12px;
  padding:11px 14px;color:#ffc9d1;font-size:12px;line-height:1.6;margin-bottom:12px;
}
.asc-warn b{color:#fff}
.asc-list{display:flex;flex-direction:column;gap:10px}
.asc-item{
  display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;
  padding:12px 14px;border-radius:14px;background:var(--panel-2);border:1px solid var(--line);
  transition:transform .1s,border-color .2s;
}
.asc-item.affordable{border-color:var(--accent)}
.asc-item.affordable:hover{transform:translateX(3px)}
.asc-item.owned{opacity:.7}
.asc-item.gated{opacity:.6;filter:grayscale(.35)}
.asc-item.strat.affordable{border-color:var(--accent2)}
.asc-ico{
  width:46px;height:46px;border-radius:12px;flex:none;display:flex;align-items:center;justify-content:center;
  font-size:24px;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(0,0,0,.25));border:1px solid var(--line);
}
.asc-name{font-family:var(--font);font-weight:800;font-size:14px}
.asc-desc{color:var(--muted);font-size:12px;margin-top:2px;line-height:1.45}
.asc-req{color:var(--gold);font-size:11px;margin-top:4px}
.asc-live{color:var(--accent3);font-size:11px;font-weight:700;margin-top:4px}
.asc-buy{
  flex:none;min-width:104px;padding:9px 14px;border-radius:12px;
  font-family:var(--font);font-weight:800;font-size:13px;color:#fff;
  background:linear-gradient(180deg,rgba(139,92,255,.32),rgba(139,92,255,.08));
  border:1px solid var(--accent);transition:transform .1s,filter .15s;
}
.asc-item.strat .asc-buy{background:linear-gradient(180deg,rgba(255,92,157,.30),rgba(255,92,157,.07));border-color:var(--accent2)}
.asc-buy:disabled{filter:grayscale(1) brightness(.7);border-color:var(--line);cursor:not-allowed}
.asc-buy:not(:disabled):active{transform:scale(.96)}
.madoka-box{
  background:
    radial-gradient(400px 200px at 50% 0%, rgba(255,158,207,.16), transparent 65%),
    var(--panel-2);
  border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:14px;
}
.madoka-box p{color:var(--muted);font-size:13px;line-height:1.6;margin-bottom:8px}
.madoka-box p b{color:var(--text)}
.madoka-grace{
  font-family:var(--font);font-weight:800;font-size:16px;color:#ff9ecf;
  margin:10px 0;text-shadow:0 0 16px rgba(255,158,207,.4);
}

/* ---------- Dungeon tab ---------- */
.dg-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:12px}
.dg-title{font-family:var(--font);font-weight:800;font-size:20px;
  background:linear-gradient(90deg,#ff6b6b,#ffb020,var(--accent3));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.dg-stat{font-size:12px;color:var(--muted)}
.dg-stat b{color:var(--text);font-family:var(--font)}
.dg-plvl{flex-basis:100%;margin-top:2px}
.dg-plvl-lbl{font-size:12px;color:var(--muted)}
.dg-plvl-lbl b{color:var(--text);font-family:var(--font)}
.dg-plvl .dg-sp{color:var(--gold)}
.dg-plvl-xp{float:right;font-size:11px;color:var(--muted);font-family:var(--font)}
.dg-bar.xp>i{background:linear-gradient(90deg,#ffb020,#ffe08a)}
.dg-sp-hint{font-size:11px;color:var(--muted);margin:-4px 0 10px;max-width:640px}
.dg-controls{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:12px}
.dg-diff{flex:1;min-width:220px;background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.dg-diff-lbl{display:block;font-size:11px;color:var(--muted);margin-bottom:6px}
.dg-slider{width:100%;accent-color:var(--accent2)}
.dg-rally{
  padding:12px 22px;border-radius:12px;font-family:var(--font);font-weight:800;font-size:15px;color:#fff;
  background:linear-gradient(180deg,rgba(255,176,32,.4),rgba(255,92,116,.15));border:1px solid var(--gold);
  box-shadow:0 0 18px -6px var(--gold);
}
.dg-rally:disabled{filter:grayscale(.7) brightness(.75);box-shadow:none;cursor:not-allowed}
.dg-rewind{padding:12px 18px;border-radius:12px;font-family:var(--font);font-weight:800;font-size:13px;
  color:#e8ffe8;background:linear-gradient(180deg,rgba(63,191,106,.35),rgba(31,122,63,.15));
  border:1px solid #3fbf6a;box-shadow:0 0 16px -6px #3fbf6a;cursor:pointer}
.dg-rewind.off,.dg-rewind:disabled{filter:grayscale(.7) brightness(.7);box-shadow:none;cursor:not-allowed}
.dg-echo{color:#7bd88f}
.dg-bar{height:9px;border-radius:6px;background:#0007;overflow:hidden;border:1px solid var(--line);margin:3px 0}
.dg-bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--good),var(--accent3));transition:width .2s}
.dg-bar.mon>i{background:linear-gradient(90deg,#ff5c6c,#ff8a00)}
.dg-bar.hp.low>i{background:linear-gradient(90deg,#ff2d2d,#ff8a00)}
.dg-bar.boss>i{background:linear-gradient(90deg,#ffb020,#ff3b6b,#a94fff)}
.dg-star{color:#ffd66b}
.dg-combat{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
@media(max-width:640px){.dg-combat{grid-template-columns:1fr}}
.dg-monster{display:flex;gap:12px;align-items:center;background:var(--panel-2);border:1px solid var(--line);border-radius:14px;padding:12px}
.dg-monster.boss{border-color:#ffb020;background:linear-gradient(180deg,rgba(255,176,32,.14),rgba(169,79,255,.10));
  box-shadow:0 0 22px -8px #ffb020}
.dg-monster.boss .dg-mon-emoji{font-size:48px;animation:dg-boss-pulse 1.6s ease-in-out infinite}
.dg-monster.boss .dg-mon-name{color:#ffd66b}
@keyframes dg-boss-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.09)}}
.dg-mon-emoji{font-size:40px;flex:none;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.dg-mon-info{flex:1;min-width:0}
.dg-mon-name{font-family:var(--font);font-weight:700;font-size:13px}
.dg-mon-sub{color:var(--muted);font-size:11px}
.dg-log{background:#0006;border:1px solid var(--line);border-radius:14px;padding:10px 12px;font-size:12px;line-height:1.7;color:var(--muted);overflow:hidden}
.dg-log-line{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dg-slots{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:10px}
.dg-slot{
  position:relative;width:150px;min-height:110px;border-radius:14px;padding:12px 10px;
  background:var(--panel-2);border:1px solid var(--line);display:flex;flex-direction:column;align-items:center;gap:4px;
}
.dg-slot.empty{border-style:dashed;cursor:pointer;justify-content:center;color:var(--muted)}
.dg-slot.empty:hover{border-color:var(--accent);color:var(--text)}
.dg-slot.filled{border-color:rgba(139,92,255,.5)}
.dg-slot.locked{border-color:var(--bad);color:var(--bad);justify-content:center;text-align:center}
.dg-slot-emoji{font-size:30px}
.dg-slot-name{font-family:var(--font);font-weight:700;font-size:12px}
.dg-slot-nums{font-size:10.5px;color:var(--muted);text-align:center}
.dg-slot .dg-bar{width:100%}
.dg-slot-x{position:absolute;top:4px;right:6px;font-size:11px;color:var(--muted);background:none;border:0}
.dg-slot-x:hover{color:var(--bad)}
.dg-slot-plus,.dg-slot-lock{font-size:22px;line-height:1.3}
.dg-revive{margin:10px 0 4px;text-align:center}
.dg-revive-btn{font-family:var(--font);font-weight:800;font-size:13px;padding:9px 18px;border-radius:10px;
  color:#1a0d0d;background:linear-gradient(180deg,#ff9a6b,#e5533d);border:1px solid #ff9a6b;
  box-shadow:0 3px 14px rgba(229,83,61,.4);cursor:pointer}
.dg-revive-btn:disabled{filter:grayscale(.7) brightness(.75);box-shadow:none;cursor:not-allowed}
.dg-trios-active{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.dg-trio-tag{font-family:var(--font);font-weight:800;font-size:11px;padding:3px 10px;border-radius:999px;
  background:rgba(255,176,32,.18);border:1px solid var(--gold);color:var(--gold)}
.dg-roster{display:flex;flex-direction:column;gap:8px}
.dg-r-item{--rar:var(--r-R);display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;
  background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--rar);border-radius:12px;padding:10px 12px}
.dg-r-item.r-SR{--rar:var(--r-SR)} .dg-r-item.r-SSR{--rar:var(--r-SSR)} .dg-r-item.r-UR{--rar:var(--r-UR)}
.dg-r-emoji{font-size:24px}
.dg-r-name{font-family:var(--font);font-weight:700;font-size:13px}
.dg-r-stats{font-size:11px;color:var(--muted);margin-top:2px;line-height:1.4}
.dg-r-evo{margin-top:4px;display:flex;align-items:center;gap:7px;font-size:10.5px;color:var(--muted)}
.dg-r-evo.done{color:var(--gold);font-weight:700}
.dg-r-evo-bar{flex:0 0 60px;height:5px;border-radius:999px;background:rgba(255,255,255,.09);overflow:hidden}
.dg-r-evo-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--gold))}
.dg-r-evo.done .dg-r-evo-bar i{background:var(--gold)}
.dg-r-acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.dg-mini{padding:6px 10px;border-radius:9px;font-family:var(--font);font-weight:700;font-size:11px;color:#fff;
  background:linear-gradient(180deg,rgba(139,92,255,.3),rgba(139,92,255,.08));border:1px solid var(--accent);white-space:nowrap}
.dg-mini.awk{background:linear-gradient(180deg,rgba(255,176,32,.3),rgba(255,176,32,.07));border-color:var(--gold)}
.dg-mini:disabled{filter:grayscale(1) brightness(.7);border-color:var(--line);cursor:not-allowed}
.dg-skill-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.dg-skill{width:180px;background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:10px;
  display:flex;flex-direction:column;gap:4px}
.dg-skill.owned{border-color:var(--good);opacity:.75}
.dg-skill.avail{border-color:var(--accent)}
.dg-skill.locked{opacity:.55}
.dg-skill-row.astral{margin-top:2px}
.dg-skill.astral{background:linear-gradient(180deg,rgba(169,79,255,.16),rgba(255,176,32,.08));border-color:#a94fff}
.dg-skill.astral.avail{border-color:#ffd66b;box-shadow:0 0 16px -6px #ffd66b}
.dg-skill.astral .dg-skill-cost{color:#ffd66b}
.dg-skill-ico{font-size:20px}
.dg-skill-name{font-family:var(--font);font-weight:800;font-size:12px}
.dg-skill-desc{font-size:11px;color:var(--muted);line-height:1.4;flex:1}
.dg-skill-cost{font-size:11px;color:var(--good);font-family:var(--font)}
.dg-trio-list{display:flex;flex-direction:column;gap:8px}
.dg-trio-item{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:center;
  background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.dg-trio-item.active{border-color:var(--gold);box-shadow:0 0 14px -6px var(--gold)}
.dg-trio-ico{font-size:22px}
.dg-trio-name{font-family:var(--font);font-weight:800;font-size:13px}
.dg-trio-cards{font-size:11px;color:var(--muted);margin-top:2px}
.dg-trio-boost{font-size:11px;color:var(--gold);font-family:var(--font);margin-top:2px}
.dg-picker{display:flex;flex-direction:column;gap:8px;max-height:56vh;overflow:auto}
.dg-picker-card{--rar:var(--r-R);display:flex;align-items:center;gap:10px;text-align:left;
  padding:10px;border-radius:10px;background:var(--panel-2);border:1px solid var(--rar);color:var(--text)}
.dg-picker-card.r-SR{--rar:var(--r-SR)} .dg-picker-card.r-SSR{--rar:var(--r-SSR)} .dg-picker-card.r-UR{--rar:var(--r-UR)}
.dg-picker-card:hover{filter:brightness(1.15)}
.dg-picker-card small{color:var(--muted);margin-left:auto}

/* ===== ⚔/🌳 Dungeon sub-tabs (Combat / Skill Tree) ===== */
.dg-subtabs{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 14px}   /* wraps: on a phone the Dungeon's 7 sub-tabs overflowed off-screen and were unreachable */
.dg-subtabs button{position:relative;padding:8px 16px;border-radius:10px;font-family:var(--font);
  font-weight:800;font-size:13px;background:var(--panel-2);border:1px solid var(--line);color:var(--muted);cursor:pointer}
.dg-subtabs button.active{color:#fff;border-color:var(--accent);background:rgba(139,92,255,.25)}
.dg-subtabs button.pip::after{content:"";position:absolute;top:6px;right:8px;width:7px;height:7px;
  border-radius:50%;background:var(--gold);box-shadow:0 0 8px var(--gold)}

/* ===== 🌳 Skill Tree sub-view ===== */
.st-stat{font-size:12px;color:var(--muted);margin-bottom:4px}
.st-stat b{font-family:var(--font)}
.st-legend{font-size:11px;color:var(--muted);max-width:720px;margin-bottom:14px;line-height:1.5}
.st-wrap{position:relative;display:flex;flex-direction:column;gap:44px;padding:0;margin:6px 0 24px}
.st-lines{position:absolute;left:0;top:0;pointer-events:none;overflow:visible;z-index:0}
.st-link{fill:none;stroke:var(--line);stroke-width:2}
.st-link.open{stroke:var(--accent);stroke-width:2.5;stroke-dasharray:6 5;
  animation:st-flow 1s linear infinite}
.st-link.done{stroke:var(--gold);stroke-width:3}
@keyframes st-flow{to{stroke-dashoffset:-22}}
.st-row{position:relative;z-index:1;display:flex;align-items:flex-start;gap:14px}
.st-row-tag{flex:none;width:56px;padding-top:24px;font-family:var(--font);font-weight:800;
  font-size:10px;letter-spacing:.08em;color:var(--muted);text-align:right}
.st-row.astral .st-row-tag{color:#c79bff}
.st-row-nodes{flex:1;display:flex;justify-content:center;flex-wrap:wrap;gap:18px}
/* 🌳 compact trees (BD tower mini-trees + Field Research) — up to ~5 narrower nodes per row on desktop */
@media(min-width:561px){.st-compact .st-row-nodes{flex-wrap:nowrap;gap:10px}.st-compact .st-node{width:auto;flex:0 1 200px;min-width:0}}
.st-node{width:210px;background:var(--panel-2);border:1px solid var(--line);border-radius:14px;
  padding:12px 12px 10px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;
  transition:border-color .15s,box-shadow .15s,transform .1s}
.st-node-ico{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:24px;
  background:#0006;border:2px solid var(--line)}
.st-node-name{font-family:var(--font);font-weight:800;font-size:12px}
.st-node-desc{font-size:11px;color:var(--muted);line-height:1.4;min-height:30px}
.st-node-foot{font-size:11px;color:var(--muted);font-family:var(--font);min-height:24px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.st-node-foot.ok{color:var(--good)}
.st-node.owned{border-color:var(--good);box-shadow:0 0 16px -8px var(--good)}
.st-node.owned .st-node-ico{border-color:var(--good);background:rgba(123,216,143,.14)}
.st-node.avail{border-color:var(--accent);box-shadow:0 0 18px -6px var(--accent);cursor:default}
.st-node.avail .st-node-ico{border-color:var(--accent)}
.st-node.short{opacity:.9}
.st-node.locked{opacity:.5}
.st-node.astral{background:linear-gradient(180deg,rgba(169,79,255,.16),rgba(255,176,32,.06));border-color:#7b3fbf}
.st-node.astral .st-node-ico{border-color:#a94fff}
.st-node.astral.avail{border-color:#ffd66b;box-shadow:0 0 20px -6px #ffd66b}
.st-node.astral.owned{border-color:#ffd66b;box-shadow:0 0 18px -8px #ffd66b}
.st-buy{font-family:var(--font);font-weight:800;font-size:11px;padding:6px 12px;border-radius:9px;
  color:#0b1220;background:linear-gradient(180deg,#7bd8ff,#3aa0e0);border:1px solid #7bd8ff;cursor:pointer}
.st-buy.astral{background:linear-gradient(180deg,#ffd66b,#e0a63a);border-color:#ffd66b}
.st-buy.warn{color:#fff;background:linear-gradient(180deg,#ff8a7b,#c23a3a);border-color:#ff8a7b}
.st-buy:disabled{filter:grayscale(.6) brightness(.7);cursor:not-allowed;box-shadow:none}
@media(max-width:560px){.st-row{flex-direction:column}.st-row-tag{width:auto;text-align:left;padding-top:0}}

/* card grid + card visual */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}

/* 🗂️ Collection binder — the Cards → Collection page reskinned as a physical
   trading-card binder: a ring-punched spine + plastic sleeve pockets. Pure CSS,
   no new art assets; wraps the existing .card-grid / .ac nodes untouched. */
.card-binder{
  position:relative;
  margin:14px 2px 4px 2px;
  padding:22px 18px 26px 44px;
  border-radius:6px 18px 18px 6px;
  background-image:
    radial-gradient(circle 5px, rgba(0,0,0,.95) 60%, transparent 64%),
    radial-gradient(circle 7px, rgba(255,255,255,.07) 60%, transparent 66%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 2px, transparent 2px 40px),
    linear-gradient(160deg,#2b2233,#18111d 55%,#100b14);
  background-position: 8px 22px, 8px 22px, 0 0, 0 0;
  background-size: 26px 42px, 26px 42px, auto 100%, auto 100%;
  background-repeat: repeat-y, repeat-y, repeat, no-repeat;
  border:1px solid #0009;
  box-shadow:0 22px 50px -22px #000d, inset 0 0 0 1px rgba(255,255,255,.05), inset 0 3px 12px rgba(0,0,0,.5);
}
.card-binder .card-grid{gap:16px}
.binder-pocket{
  position:relative;border-radius:16px;padding:6px;
  background:linear-gradient(160deg, rgba(255,255,255,.05), rgba(255,255,255,.01) 40%, rgba(0,0,0,.18));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 2px rgba(255,255,255,.08), inset 0 -8px 16px rgba(0,0,0,.4), 0 6px 16px -10px #000;
}
/* plain alpha-over, NOT mix-blend-mode:screen (removed 2026-09-17) — a real
   collection can have 100+ pockets on screen at once, and mix-blend-mode
   forces its own compositing layer per element; that many at once was
   reported stuttering on tablets. Visual difference is negligible since the
   overlay is already near-white-on-dark. */
.binder-pocket::after{
  content:"";position:absolute;inset:0;border-radius:16px;pointer-events:none;z-index:2;
  background:linear-gradient(115deg, rgba(255,255,255,.18) 0%, transparent 28%, transparent 72%, rgba(255,255,255,.07) 100%);
}
.binder-pocket{display:flex}
.binder-pocket .ac{margin:0;width:100%}
:root[data-mobile] .card-binder{padding:16px 10px 20px 30px}
:root[data-mobile] .card-binder{background-position: 5px 16px, 5px 16px, 0 0, 0 0; background-size: 18px 30px, 18px 30px, auto 100%, auto 100%}
.ac{
  --rar:var(--r-R);
  position:relative;border-radius:14px;overflow:hidden;
  border:1px solid var(--rar);
  background:var(--panel-solid);
  box-shadow:0 8px 24px -12px #000, 0 0 0 1px rgba(255,255,255,.03) inset;
  display:flex;flex-direction:column;
  transition:transform .15s;
}
.ac.r-R{--rar:var(--r-R)} .ac.r-SR{--rar:var(--r-SR)}
.ac.r-SSR{--rar:var(--r-SSR)} .ac.r-UR{--rar:var(--r-UR)}
.ac:hover{transform:translateY(-4px)}
.ac-top{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;font-size:11px;background:linear-gradient(90deg,var(--rar),transparent)}
.ac-rar{font-family:var(--font);font-weight:800;letter-spacing:1px;color:#fff;text-shadow:0 1px 3px #0008}
.ac-stars{letter-spacing:1px;color:#fff;text-shadow:0 0 8px var(--gold)}
.ac-portrait{
  position:relative;height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  background:linear-gradient(160deg,var(--c1,#333),var(--c2,#111));
}
.ac-emoji{font-size:52px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.5))}
.ac-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;
  transform:scale(var(--art-scale,1));transform-origin:center top;display:block}
.ac-kao{font-size:13px;color:#fff;opacity:.85;font-family:var(--font-body)}
.ac-name{font-family:var(--font);font-weight:700;font-size:12.5px;padding:8px 10px 4px;line-height:1.2;position:relative;z-index:3}
.ac-eff{color:var(--accent3);font-size:11px;padding:0 10px 6px;line-height:1.35;min-height:14px;position:relative;z-index:3}
.ac-flavor{color:var(--muted);font-size:10.5px;font-style:italic;padding:0 10px 10px;line-height:1.35;position:relative;z-index:3}
.tower-roster{margin:10px 0}
.ac-flavor.tower-stat{color:var(--accent3);font-style:normal;font-weight:700}
.ac-flavor.tower-lock{color:var(--bad);font-style:normal}

/* 🏙️ City — Mine sub-tab visualization (js/city.js) */
.city-scene{position:relative;border-radius:16px;padding:28px 16px 20px;overflow:hidden;
  background:linear-gradient(180deg,#0d0a1a 0%,#171029 55%,#241832 100%);
  border:1px solid var(--line);margin:10px 0}
.city-sky{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 20% 15%,rgba(255,255,255,.08),transparent 40%)}
.city-scene.bg-tier-1 .city-sky{background:
  radial-gradient(circle at 20% 15%,rgba(180,120,255,.20),transparent 45%),
  repeating-linear-gradient(45deg,rgba(150,100,255,.06) 0 2px,transparent 2px 14px)}
.city-scene.bg-tier-2 .city-sky{background:
  radial-gradient(circle at 25% 20%,rgba(255,180,230,.28),transparent 50%),
  radial-gradient(circle at 75% 12%,rgba(255,220,140,.22),transparent 45%)}
.city-ground{position:absolute;left:0;right:0;bottom:0;height:36%;pointer-events:none;
  background:linear-gradient(180deg,rgba(20,15,35,0),rgba(10,8,20,.9))}
.city-row{position:relative;z-index:2;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.city-building{width:126px;padding:16px 10px 12px;border-radius:14px;text-align:center;
  background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(0,0,0,.28));
  border:1px solid rgba(255,255,255,.12);transition:box-shadow .3s,transform .2s}
.city-building.locked{opacity:.4;filter:grayscale(1)}
.cb-icon{font-size:36px;line-height:1;filter:drop-shadow(0 4px 8px rgba(0,0,0,.5))}
.cb-name{font-family:var(--font);font-weight:700;font-size:12px;margin-top:6px;color:var(--text)}
.cb-tier{font-size:10px;color:var(--muted);margin-top:2px}
.cb-next{font-size:9.5px;color:var(--muted);margin-top:4px;font-style:italic}
.city-building.tier-1{border-color:var(--cb-color);box-shadow:0 0 14px -3px var(--cb-color)}
.city-building.tier-2{border-color:var(--cb-color);box-shadow:0 0 22px -2px var(--cb-color),0 0 0 1px var(--cb-color) inset}
.city-building.tier-3{border-color:#ffd66b;box-shadow:0 0 30px -2px var(--cb-color),0 0 0 2px #ffd66b inset}
.city-building.tier-3 .cb-icon{filter:drop-shadow(0 4px 8px rgba(0,0,0,.5)) drop-shadow(0 0 10px #ffd66b)}
/* 🧬 evolution hint on a Collectible tile — folded into its source card's
   pack in the Collection grid (2026-09-18), this makes the relationship
   visible at a glance */
.ac-evo-hint{color:var(--gold);font-size:9.5px;font-weight:700;letter-spacing:.2px;padding:3px 10px 0;position:relative;z-index:3}
/* v0.0.8 — the portrait must never spill over the name / text rows below it */
.ac{isolation:isolate}
.ac-portrait{flex:0 0 auto;overflow:hidden}
.reveal-card .rc-back .ac-portrait{max-height:58%}
.card-detail .cd-card .ac-name{position:relative;z-index:3;background:inherit}
.ac-count{position:absolute;top:32px;right:8px;background:#000a;border:1px solid var(--rar);border-radius:999px;font-size:10px;font-weight:700;padding:1px 7px;font-family:var(--font)}
.ac-holo{display:none;position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.28) 48%,rgba(120,220,255,.20) 52%,transparent 60%);
  mix-blend-mode:screen;transform:translateX(-100%);}
.ac.r-SSR .ac-holo,.ac.r-UR .ac-holo{display:block;animation:shine 3s ease-in-out infinite}
.ac.r-UR{box-shadow:0 0 26px -4px var(--r-UR),0 8px 24px -12px #000}
.ac.locked{filter:grayscale(1) brightness(.5);border-color:var(--line)}
.ac.locked .ac-emoji{filter:blur(3px)}
.ac.locked .ac-name{color:var(--muted)}

/* ---------- SETTINGS ---------- */
.set-grid{display:flex;flex-direction:column;gap:12px;max-width:640px}
.set-row{background:var(--panel-2);border:1px solid var(--line);border-radius:12px;padding:14px}
.set-row h4{font-size:13px;margin-bottom:6px}
.set-row p{color:var(--muted);font-size:12px;line-height:1.5}
.theme-swatches{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.theme-swatches button{
  width:44px;height:32px;border-radius:8px;border:2px solid var(--line);
}
.theme-swatches button.active{border-color:#fff;box-shadow:0 0 0 2px var(--accent)}
.skin-picker{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.skin-opt{
  display:flex;flex-direction:column;align-items:flex-start;gap:2px;
  padding:10px 16px;border-radius:12px;min-width:130px;
  background:var(--panel-2);border:1px solid var(--line);color:var(--muted);
  transition:transform .1s,border-color .15s,color .15s;
}
.skin-opt b{font-family:var(--font);font-size:14px}
.skin-opt small{font-size:11px}
.skin-opt:hover{transform:translateY(-2px);color:var(--text)}
.skin-opt.active{
  color:#fff;border-color:var(--accent);
  background:linear-gradient(180deg,rgba(139,92,255,.28),rgba(139,92,255,.06));
  box-shadow:0 0 0 1px var(--accent) inset;
}
.btn{
  padding:9px 16px;border-radius:10px;font-weight:700;font-size:13px;
  background:var(--panel-2);border:1px solid var(--line);color:var(--text);
  transition:transform .1s,filter .15s;
}
.btn:hover{filter:brightness(1.15)}
.btn:active{transform:scale(.97)}
.btn.primary{background:linear-gradient(180deg,rgba(139,92,255,.4),rgba(139,92,255,.12));border-color:var(--accent);color:#fff}
.btn.danger{border-color:var(--bad);color:var(--bad)}
.btn-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
textarea.save-box{
  width:100%;min-height:80px;margin-top:8px;border-radius:10px;padding:10px;
  background:#0007;border:1px solid var(--line);color:var(--text);font-size:11px;font-family:monospace;resize:vertical;
}

/* ---------- comic ---------- */
#comic-root{position:fixed;inset:0;z-index:200;background:#05030f;display:flex;align-items:center;justify-content:center;padding:20px}
#comic-root[hidden]{display:none}
.panel[hidden]{display:none}
.comic-wrap{width:min(680px,100%);display:flex;flex-direction:column;gap:16px}
.comic-panel{
  position:relative;border-radius:20px;padding:34px 28px;min-height:340px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 30px 80px -20px #000, inset 0 0 80px rgba(0,0,0,.25);
  overflow:hidden;
}
.comic-panel.in{animation:comicIn .5s cubic-bezier(.2,.8,.2,1)}
@keyframes comicIn{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}
.comic-panel::before{
  content:"";position:absolute;inset:-40%;
  background:repeating-linear-gradient(115deg,transparent 0 18px,rgba(255,255,255,.05) 18px 20px);
  pointer-events:none;
}
.comic-art{font-size:74px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.5));letter-spacing:8px;z-index:1}
.comic-title{font-family:var(--font);font-weight:800;font-size:24px;letter-spacing:2px;text-transform:uppercase;z-index:1;
  background:linear-gradient(90deg,#fff,var(--accent3));-webkit-background-clip:text;background-clip:text;color:transparent}
.comic-text{font-size:16px;line-height:1.7;max-width:520px;min-height:88px;z-index:1;color:#f4f1ff}
.comic-text .cursor{display:inline-block;width:9px;background:var(--accent2);animation:blink 1s steps(1) infinite;margin-left:2px}
@keyframes blink{50%{opacity:0}}
.comic-nav{display:flex;align-items:center;justify-content:space-between;gap:16px}
.comic-dots{display:flex;gap:7px;flex:1;justify-content:center}
.comic-dots i{width:8px;height:8px;border-radius:50%;background:var(--line)}
.comic-dots i.on{background:var(--accent2);box-shadow:0 0 10px var(--accent2)}
.comic-skip{color:var(--muted);font-size:13px;font-weight:700}
.comic-skip:hover{color:var(--text)}
.comic-next{
  padding:11px 22px;border-radius:12px;font-weight:800;font-size:14px;
  background:linear-gradient(180deg,var(--accent),var(--accent2));color:#fff;
  box-shadow:0 10px 24px -10px var(--accent);
}
.comic-next:active{transform:scale(.96)}

/* ---------- summon overlay ---------- */
.summon-ov{
  position:fixed;inset:0;z-index:180;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 50%, rgba(20,8,40,.86), rgba(2,1,8,.96));
  backdrop-filter:blur(6px);opacity:0;transition:opacity .3s;
  pointer-events:auto;
}
.summon-ov.show{opacity:1}
.summon-ov .stage{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.summon-circle{
  position:absolute;width:280px;height:280px;border-radius:50%;
  background:
    radial-gradient(circle,transparent 55%,rgba(139,92,255,.25) 60%,transparent 72%),
    conic-gradient(from 0deg,var(--accent),var(--accent3),var(--accent2),var(--accent));
  -webkit-mask:radial-gradient(circle,transparent 52%,#000 54%,#000 74%,transparent 76%);
          mask:radial-gradient(circle,transparent 52%,#000 54%,#000 74%,transparent 76%);
  filter:drop-shadow(0 0 40px var(--accent));
  transform:scale(.15);opacity:0;
}
.summon-circle.c2{width:190px;height:190px;animation-direction:reverse}
.summon-circle.charge{animation:charge 1.15s ease-in forwards}
.summon-circle.c2.charge{animation:charge2 1.15s ease-in forwards}
@keyframes charge{0%{transform:scale(.15) rotate(0);opacity:0}20%{opacity:1}80%{transform:scale(1) rotate(320deg);opacity:1}100%{transform:scale(2.6) rotate(400deg);opacity:0}}
@keyframes charge2{0%{transform:scale(.1) rotate(0);opacity:0}25%{opacity:1}80%{transform:scale(.8) rotate(-300deg);opacity:1}100%{transform:scale(2.2) rotate(-380deg);opacity:0}}
.summon-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.summon-flash.go{animation:flash .5s ease-out}
@keyframes flash{0%{opacity:0}12%{opacity:.95}100%{opacity:0}}

.reveal-row{display:flex;gap:12px;row-gap:48px;flex-wrap:wrap;align-items:flex-start;align-content:flex-start;justify-content:center;max-width:min(960px,94vw);max-height:82vh;max-height:82dvh;overflow-y:auto;overscroll-behavior:contain;padding:8px 6px 44px;z-index:2}
.reveal-row.single{gap:0}
.reveal-card .rc-back .ac-flavor{display:none}
.reveal-card .rc-back .ac-eff{font-size:10px;line-height:1.3;padding-bottom:8px}
.reveal-card .rc-back .ac-name{font-size:11px}
.reveal-row.single .reveal-card .rc-back .ac-flavor{display:block}
.reveal-row.single .reveal-card .rc-back .ac-eff{font-size:11px}
.reveal-card{
  width:122px;height:210px;perspective:900px;flex:none;
}
.reveal-row.single .reveal-card{width:230px;height:360px}
/* the card face fills the whole reveal card — no dead space under the flavor */
.reveal-card .rc-back{display:flex}
.reveal-card .rc-back .ac{flex:1;height:auto;min-height:0}
.reveal-card .rc-back .ac-portrait{flex:1 1 auto;min-height:64px;height:auto}
.reveal-row.single .reveal-card .rc-back .ac-portrait{min-height:150px}
.reveal-card .rc-back .ac-emoji{font-size:42px}
.reveal-card .rc-back .ac-eff{
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.rc-inner{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.3,1.4,.4,1);transform:rotateY(180deg)}
.reveal-card.flipped .rc-inner{transform:rotateY(0)}
.rc-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:12px;overflow:hidden}
.rc-front{transform:rotateY(180deg);
  background:
    radial-gradient(circle at 50% 35%, rgba(255,255,255,.15), transparent 55%),
    conic-gradient(from 45deg,var(--accent),var(--accent2),var(--accent3),var(--accent));
  display:flex;align-items:center;justify-content:center;font-size:44px;border:1px solid rgba(255,255,255,.25)}
.rc-back{background:var(--panel-solid)}
.reveal-card.pop{animation:pop .4s ease-out}
@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.12)}100%{transform:scale(1)}}
.reveal-card.rare-glow{box-shadow:0 0 30px 4px var(--rar,#fff);border-radius:12px}
.rc-badges{position:absolute;left:0;right:0;bottom:-22px;display:flex;gap:6px;justify-content:center;z-index:3}
.rc-badge{font-family:var(--font);font-weight:800;font-size:10px;padding:2px 8px;border-radius:999px;white-space:nowrap}
.rc-badge.new{background:var(--accent2);color:#fff}
.rc-badge.up{background:var(--gold);color:#3a2500}
.rc-badge.dupe{background:#000a;border:1px solid var(--gold);color:var(--gold)}
.rc-badge.bonus{background:linear-gradient(180deg,#3fbf6a,#1f7a44);color:#fff}
.c4{display:grid;grid-template-columns:repeat(7,34px);gap:4px;justify-content:center;background:#2b1f5c;padding:6px;border-radius:12px;margin:8px auto 0;width:max-content}
.c4-col{display:flex;flex-direction:column;gap:4px;background:none;border:0;padding:0;cursor:pointer;border-radius:8px}
.c4-col:disabled{cursor:default}
.c4-col:not(:disabled):hover{background:rgba(255,255,255,.08)}
.c4-cell{width:34px;height:34px;border-radius:50%;background:#140d2a;box-shadow:inset 0 2px 4px rgba(0,0,0,.6)}
.c4-cell.p1{background:radial-gradient(circle at 35% 35%,#ff9ab5,#e0305f)}
.c4-cell.p2{background:radial-gradient(circle at 35% 35%,#fff1a0,#e0a800)}
@media(max-width:520px){.c4{grid-template-columns:repeat(7,30px)}.c4-cell{width:30px;height:30px}}
/* 📋 First Steps (Mine tab side column) */
/* slide-out drawer on the left edge — the handle always sticks out, on every tab */
.fs-drawer{--fsw:min(340px,84vw);position:fixed;left:0;top:50%;z-index:66;display:flex;align-items:center;
  transform:translate(calc(-1 * var(--fsw)),-50%);transition:transform .25s ease;pointer-events:none}
.fs-drawer.open{transform:translate(0,-50%)}
.fs-drawer[hidden]{display:none}
.fs-panel{pointer-events:auto;width:var(--fsw);max-height:min(76vh,76dvh);overflow-y:auto;overscroll-behavior:contain;box-sizing:border-box;
  padding:12px 12px 10px;background:var(--panel-solid,#1a1330);border:1px solid var(--line);border-left:0;border-radius:0 14px 14px 0;
  box-shadow:8px 0 30px -6px rgba(0,0,0,.7)}
.fs-handle{pointer-events:auto;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:40px;padding:10px 6px;margin-left:-1px;
  border:1px solid var(--line);border-left:0;border-radius:0 12px 12px 0;cursor:pointer;color:#fff;
  background:linear-gradient(180deg,#5b3fc4,#2e1f6b);box-shadow:4px 0 16px -4px rgba(0,0,0,.7);font:800 11px/1.1 var(--font)}
.fs-handle .fs-h-ico{font-size:18px}
.fs-handle .fs-h-gift{background:#ffd45c;color:#3a2500;border-radius:999px;padding:1px 5px}
.fs-handle .fs-h-arrow{opacity:.7;font-size:10px}
.fs-handle.ready{background:linear-gradient(180deg,#e0a800,#8a5a00);box-shadow:4px 0 16px -4px rgba(0,0,0,.7);position:relative}
/* ⚡ perf pass — the glow used to animate box-shadow (full repaint every frame);
   now a pre-drawn glow layer only fades its opacity (compositor-only) */
.fs-handle.ready::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:4px 0 22px 2px rgba(255,212,92,.75);opacity:0;will-change:opacity;animation:fsPulse 1.8s ease-in-out infinite}
@keyframes fsPulse{0%,100%{opacity:0}50%{opacity:1}}
:root[data-reduced-fx] .fs-handle.ready,:root[data-reduced-fx] .fs-handle.ready::before{animation:none}
.fs-panel .fs-head{display:flex;align-items:center;justify-content:space-between;gap:8px;font:800 13px/1.3 var(--font);padding:0 0 6px}
.fs-close{background:none;border:0;color:var(--muted);font-size:16px;cursor:pointer;padding:2px 6px;min-width:32px;min-height:32px}
.fs-panel .bd-rs-bar{margin-bottom:8px}
@media(max-width:520px){.fs-handle{min-width:24px;padding:6px 2px;gap:2px;font-size:9px;opacity:.92}.fs-handle .fs-h-ico{font-size:13px}.fs-handle .fs-h-arrow{display:none}.fs-handle .fs-h-gift{padding:0 3px}.fs-claim{padding:6px 8px}.fs-drawer{--fsw:min(320px,86vw)}}
.fs-row{display:flex;align-items:center;gap:8px;padding:6px 4px;border-top:1px solid rgba(255,255,255,.06)}
.fs-row.ready{background:linear-gradient(90deg,rgba(255,214,107,.14),transparent);border-radius:8px}
.fs-row.done{opacity:.5}
.fs-ico{font-size:18px;width:24px;text-align:center;flex:none}
.fs-body{flex:1;min-width:0}
.fs-name{font-weight:700;font-size:12px}
.fs-where{font-size:11px;color:var(--muted);line-height:1.3}
.fs-claim{flex:none;font-size:11px;padding:4px 8px}
.set-diag{list-style:none;margin:6px 0;padding:0;font-size:12px;line-height:1.5}
.set-diag li.bad{color:#ffb3b3}
.set-how{font-size:12px}
.cz-cell.rld{box-shadow:inset 0 0 0 2px rgba(255,60,90,.85),0 0 14px rgba(255,40,80,.7);background:radial-gradient(circle,rgba(255,60,100,.35),transparent 70%)}
/* 💬 in-page tooltip (js/tooltip.js) — replaces the browser's title box */
#tt{position:fixed;left:0;top:0;z-index:10000;pointer-events:none;max-width:min(300px,86vw);
  padding:7px 10px;border-radius:10px;background:rgba(18,13,36,.97);border:1px solid rgba(180,150,255,.45);
  color:#efe9ff;font:600 12px/1.4 var(--font,system-ui);white-space:pre-line;
  box-shadow:0 8px 24px -6px rgba(0,0,0,.8);opacity:0;transition:opacity .12s ease}
#tt.on{opacity:1}
:root[data-reduced-fx] #tt{transition:none}
.rm-scene-roll{font-size:12px;color:var(--muted);margin-top:6px}
.rm-scene-choices{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.rm-scene-choices .btn{white-space:normal;text-align:left;line-height:1.3}
.rc-badge.boost{background:linear-gradient(180deg,rgba(255,214,107,.9),rgba(255,176,32,.8));color:#3a2500;white-space:normal;max-width:118px;text-align:center}
.rc-badge.drop{background:#000a;border:1px solid var(--accent2);color:#cbb8ff;white-space:normal;max-width:118px;text-align:center}
.reveal-row.single .rc-badge.boost,.reveal-row.single .rc-badge.drop{max-width:220px}
/* x10 / x100 grid: one-line badges that never outgrow the card, names & effects clamped to 2 lines
   (serif pack skins like Drzewogród used to push the effect text off the card) */
.reveal-row:not(.single) .rc-badges{left:-4px;right:-4px;gap:4px}
.reveal-row:not(.single) .rc-badge,.reveal-row:not(.single) .rc-badge.boost,.reveal-row:not(.single) .rc-badge.drop{
  font-size:9px;padding:2px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;min-width:0}
.reveal-row:not(.single) .reveal-card .rc-back .ac-name{font-size:10.5px;line-height:1.15;padding:6px 7px 2px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:none}
.reveal-row:not(.single) .reveal-card .rc-back .ac-eff{font-size:9.5px;line-height:1.25;-webkit-line-clamp:2;flex:none;padding-bottom:0;margin-bottom:6px;max-height:2.5em}
.reveal-row:not(.single) .loot-text{font-size:10.5px;line-height:1.25}
.reveal-row:not(.single) .loot-tile{gap:5px;padding:8px 6px}

/* loot tiles (non-card draws) */
.loot-tile{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  padding:10px;text-align:center;background:
    radial-gradient(circle at 50% 30%,rgba(255,255,255,.10),transparent 60%),var(--panel-solid)}
.loot-boost{border:1px solid var(--gold)}
.loot-drop.res-kartanium{border:1px solid var(--accent2)}
.loot-ico{font-size:40px;filter:drop-shadow(0 3px 8px rgba(0,0,0,.5))}
.loot-kind{font-family:var(--font);font-weight:800;font-size:9px;letter-spacing:.1em;color:var(--muted)}
.loot-text{font-size:11px;line-height:1.35;color:var(--text)}
.reveal-row.single .loot-ico{font-size:64px}
.reveal-row.single .loot-text{font-size:14px}

.summon-actions{position:absolute;left:0;right:0;bottom:38px;display:flex;gap:12px;justify-content:center;z-index:5}
.summon-actions button{
  padding:11px 26px;border-radius:12px;font-family:var(--font);font-weight:800;font-size:14px;
  background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.35);color:#fff;backdrop-filter:blur(4px);
}
.summon-actions button.primary{background:linear-gradient(180deg,var(--accent),var(--accent2));border-color:transparent}
.summon-hint{position:absolute;left:0;right:0;top:44px;text-align:center;color:#fff9;font-size:13px;z-index:5;letter-spacing:1px}

/* ---------- toasts + modal ---------- */
#overlay-root{position:fixed;inset:0;z-index:190;pointer-events:none}
.toast-stack{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{
  pointer-events:auto;background:var(--panel-solid);border:1px solid var(--accent);
  border-radius:12px;padding:10px 18px;font-weight:700;font-size:13px;box-shadow:var(--shadow);
  animation:toastIn .3s ease, toastOut .3s ease 2.7s forwards;
}
.toast.milestone{border-color:var(--gold);color:var(--gold)}
.toast.error{border-color:var(--bad);color:var(--bad)}
@keyframes toastIn{from{opacity:0;transform:translateY(12px)}to{opacity:1}}
@keyframes toastOut{to{opacity:0;transform:translateY(-8px)}}

.update-banner{
  pointer-events:auto;position:absolute;left:50%;top:12px;transform:translateX(-50%);
  display:flex;align-items:center;gap:12px;background:var(--panel-solid);border:1px solid var(--accent);
  border-radius:12px;padding:8px 10px 8px 16px;font-weight:700;font-size:13px;box-shadow:var(--shadow);
  animation:toastIn .3s ease;z-index:1;
}
.update-banner .btn{padding:6px 14px}

.modal-ov{position:absolute;inset:0;pointer-events:auto;display:flex;align-items:center;justify-content:center;
  background:rgba(3,1,10,.7);backdrop-filter:blur(4px);padding:16px;animation:toastIn .25s ease;
  overflow-y:auto;overscroll-behavior:contain}
.modal{
  width:min(440px,calc(100vw - 32px));max-height:88vh;max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;
  background:var(--panel-solid);border:1px solid var(--accent);border-radius:18px;
  padding:24px;text-align:center;box-shadow:var(--shadow)}
@media(max-width:480px){.modal{padding:18px 16px}}
.modal h3{font-size:20px;margin-bottom:10px;background:linear-gradient(90deg,var(--accent3),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}
.modal p{color:var(--muted);font-size:14px;line-height:1.6;margin-bottom:8px}
.modal .big{font-family:var(--font);font-weight:800;font-size:24px;color:var(--good);margin:8px 0}
.modal .btn-row{justify-content:center}

/* ---------- card detail overlay ---------- */
.card-grid .ac.clickable{cursor:pointer}
.card-grid .ac.clickable:hover{transform:translateY(-5px) scale(1.02)}
.reveal-card.inspectable{cursor:pointer}
.reveal-card.inspectable:hover .rc-inner{filter:brightness(1.08)}
.card-detail-ov{
  position:absolute;inset:0;z-index:200;pointer-events:auto;display:flex;align-items:center;justify-content:center;
  padding:16px;background:rgba(3,1,10,.78);backdrop-filter:blur(6px);
  opacity:0;transition:opacity .2s;overflow-y:auto;overscroll-behavior:contain;
}
.card-detail-ov.show{opacity:1}
.card-detail{
  --rar:var(--r-R);
  position:relative;display:flex;gap:24px;align-items:stretch;
  width:min(620px,calc(100vw - 32px));max-height:88vh;max-height:calc(100dvh - 32px);overflow:auto;overscroll-behavior:contain;
  background:var(--panel-solid);border:1px solid var(--rar);border-radius:20px;
  padding:22px;box-shadow:0 30px 80px -20px #000,0 0 40px -10px var(--rar);
  transform:translateY(10px) scale(.98);transition:transform .2s;
}
.card-detail-ov.show .card-detail{transform:none}
.card-detail.r-R{--rar:var(--r-R)} .card-detail.r-SR{--rar:var(--r-SR)}
.card-detail.r-SSR{--rar:var(--r-SSR)} .card-detail.r-UR{--rar:var(--r-UR)}

/* ===== pack-themed card-preview overlay ===== */
/* DDLand — a weathered wood D&D adventure window */
.card-detail.pack-ddland,.card-detail.pack-project_A,.card-detail.pack-goddesses{padding-top:34px}
.card-detail.pack-ddland{
  background:
    repeating-linear-gradient(90deg, rgba(60,38,20,.35) 0 3px, rgba(42,26,12,.35) 3px 7px),
    linear-gradient(180deg,#3a2718,#241407);
  border:3px solid #6b4a28;
  border-radius:10px;
  box-shadow:0 30px 80px -20px #000, inset 0 0 40px rgba(0,0,0,.55), 0 0 0 6px #1c1108;
  color:#e8d8bf;
}
.card-detail.pack-ddland::before{
  content:"⚔  ✦  a Drzewogrodowy Dogland encounter  ✦  ⚔";
  position:absolute;top:8px;left:0;right:0;text-align:center;
  font-family:var(--font);font-weight:800;font-size:10px;letter-spacing:.12em;color:#c79b5c;opacity:.85;
}
.card-detail.pack-ddland .cd-name{color:#f2e4c8;text-shadow:0 2px 0 #1c1108}
.card-detail.pack-ddland .cd-flavor{color:#c7ac86}
.card-detail.pack-ddland .cd-close{background:#1c1108;border-color:#6b4a28;color:#e8d8bf}

/* Project A — a green-on-black terminal frame */
.card-detail.pack-project_A{
  background:#050a06;
  border:1px solid #2f7a3f;
  border-radius:4px;
  box-shadow:0 30px 80px -20px #000, 0 0 0 1px #0c3, inset 0 0 60px rgba(0,255,90,.06),
             0 0 30px -6px rgba(0,255,90,.35);
  color:#8affab;
  font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
.card-detail.pack-project_A::before{
  content:"root@project-a:~$ cat card.dat";
  position:absolute;top:7px;left:14px;right:14px;
  font-size:10px;letter-spacing:.05em;color:#3f9a52;
}
.card-detail.pack-project_A::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:4px;
  background:repeating-linear-gradient(0deg, rgba(0,255,90,.05) 0 1px, transparent 1px 3px);
}
.card-detail.pack-project_A .cd-name{color:#b6ffc7;text-shadow:0 0 8px rgba(0,255,90,.5)}
.card-detail.pack-project_A .cd-rarity,
.card-detail.pack-project_A .cd-sub{color:#3f9a52}
.card-detail.pack-project_A .cd-eff-line{color:#8affab}
.card-detail.pack-project_A .cd-flavor{color:#5fbf77}
.card-detail.pack-project_A .cd-close{background:#050a06;border-color:#2f7a3f;color:#8affab}

/* 🗼 Paryżowanie — dusk over the Seine, the tower rising behind the card */
.card-detail.pack-paris{
  padding-top:34px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 160'%3E%3Cpath fill='%23f2dca3' fill-opacity='0.22' d='M40 2 L42 4 L43 40 L49 55 L43 52 L44 52 L45 95 L56 112 L46 106 L47 106 L48 150 L74 160 L52 160 L48 124 L40 116 L32 124 L28 160 L6 160 L32 150 L33 106 L34 106 L24 112 L35 95 L36 52 L37 52 L31 55 L37 40 L38 4 Z'/%3E%3C/svg%3E") center bottom / auto 90% no-repeat,
    radial-gradient(130% 70% at 50% 6%, rgba(120,150,225,.20), transparent 62%),
    linear-gradient(180deg,#12112e 0%,#1b1838 45%,#2a2350 100%);
  border:3px solid #b98f45;
  border-radius:12px;
  box-shadow:0 30px 80px -20px #000, inset 0 0 46px rgba(8,6,26,.6), 0 0 0 5px #221a2f;
  color:#efe6d4;
}
.card-detail.pack-paris::before{
  content:"✦  un souvenir de Paris  ✦";
  position:absolute;top:9px;left:0;right:0;text-align:center;
  font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:11px;letter-spacing:.14em;color:#e6cf92;opacity:.9;
}
.card-detail.pack-paris .cd-name{font-family:Georgia,"Times New Roman",serif;letter-spacing:.5px;color:#f6ecd2;text-shadow:0 2px 0 #000}
.card-detail.pack-paris .cd-rarity,.card-detail.pack-paris .cd-sub{color:#c9b48a}
.card-detail.pack-paris .cd-eff-line{color:#e9dcc0}
.card-detail.pack-paris .cd-flavor{color:#c7b8e0;font-family:Georgia,serif;font-style:italic}
.card-detail.pack-paris .cd-close{background:#221a2f;border-color:#b98f45;color:#efe6d4}
.cd-close{
  position:absolute;top:10px;right:12px;z-index:2;
  width:30px;height:30px;border-radius:50%;font-size:14px;color:var(--text);
  background:rgba(255,255,255,.08);border:1px solid var(--line);
}
.cd-close:hover{background:rgba(255,255,255,.16)}
.cd-lore-btn{
  position:absolute;top:10px;right:50px;z-index:2;
  width:30px;height:30px;border-radius:50%;font-size:14px;
  background:rgba(255,255,255,.08);border:1px solid var(--line);
  transition:background .15s,transform .1s}
.cd-lore-btn:hover{background:rgba(255,255,255,.16)}
.cd-lore-btn:active{transform:scale(.92)}
.card-detail.showing-lore .cd-lore-btn{background:var(--accent);box-shadow:0 0 12px -2px var(--accent)}
.cd-lore{display:none;flex:1;min-width:0;flex-direction:column;gap:8px;padding-top:6px}
.card-detail.showing-lore .cd-info-main{display:none}
.card-detail.showing-lore .cd-lore{display:flex}
.cd-lore-row{font-size:13px;color:var(--text);line-height:1.6}
.cd-lore-desc{color:var(--muted);font-style:italic;font-size:12.5px;line-height:1.5;margin-top:2px}
.card-detail .cd-card{width:210px;flex:none;align-self:flex-start}
.card-detail .cd-card .ac-portrait{height:240px}
.card-detail .cd-card .ac-emoji{font-size:88px}
.card-detail .cd-card .ac-flavor{display:none}
.cd-info{flex:1;min-width:0;padding-top:6px}
.cd-info-main{display:flex;flex-direction:column;gap:8px}
.cd-rarity{font-family:var(--font);font-weight:800;font-size:12px;letter-spacing:1.5px;
  text-transform:uppercase;color:var(--rar)}
.cd-name{font-family:var(--font);font-weight:800;font-size:20px;line-height:1.2}
.cd-stars{letter-spacing:2px;color:var(--gold);font-size:15px;text-shadow:0 0 10px var(--gold)}
.cd-sub{font-family:var(--font);font-weight:700;font-size:11px;letter-spacing:1px;
  text-transform:uppercase;color:var(--muted);margin-top:6px}
.cd-eff-line{font-size:13px;color:var(--accent3);line-height:1.5}
.cd-eff-line.dim{color:var(--muted)}
.cd-effects,.cd-next{white-space:pre-line}
.cd-next{font-size:13px;color:var(--muted)}
.cd-flavor{margin-top:auto;padding-top:10px;color:var(--muted);font-style:italic;font-size:12.5px;line-height:1.5}
.cd-locked{font-size:13px;color:var(--gold);line-height:1.6}
@media(max-width:560px){
  .card-detail{flex-direction:column;align-items:center;gap:16px}
  .card-detail .cd-card{width:170px}
  .card-detail .cd-card .ac-portrait{height:190px}
}

/* ---------- fx layer ---------- */
#fx-root{position:fixed;inset:0;pointer-events:none;z-index:120;overflow:hidden}
.float-num{position:fixed;font:800 20px/1 var(--font);color:#fff;
  text-shadow:0 2px 8px rgba(0,0,0,.7),0 0 16px var(--accent3);
  transform:translate(-50%,-50%);animation:floatUp .9s ease-out forwards}
.float-num.crit{font-size:26px;color:var(--gold);text-shadow:0 2px 10px #000,0 0 20px var(--gold)}
@keyframes floatUp{0%{opacity:0;transform:translate(-50%,-50%) scale(.6)}
15%{opacity:1;transform:translate(-50%,-64%) scale(1.1)}
100%{opacity:0;transform:translate(-50%,-170%) scale(1)}}
.pfx{position:fixed;width:10px;height:10px;border-radius:2px;will-change:transform,opacity;animation:pfx 1s ease-out forwards}
@keyframes pfx{0%{transform:translate(0,0) scale(1) rotate(0);opacity:1}
100%{transform:translate(var(--dx),var(--dy)) scale(.2) rotate(var(--rot));opacity:0}}

body.shake #app{animation:shake .4s}
@keyframes shake{0%,100%{transform:none}20%{transform:translate(-6px,3px)}40%{transform:translate(5px,-4px)}60%{transform:translate(-4px,-2px)}80%{transform:translate(3px,4px)}}
@keyframes pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.4}}

@media(max-width:520px){
  .hud-brand>span{display:none}
  .panel{padding:14px}
  .reveal-card{width:92px;height:150px}
  .reveal-row.single .reveal-card{width:190px;height:300px}
  .reveal-row:not(.single) .rc-badge{font-size:8px;padding:1px 5px}
  .reveal-row:not(.single) .reveal-card .rc-back .ac-name{font-size:9px}
  .reveal-row:not(.single) .reveal-card .rc-back .ac-eff{font-size:8.5px}
  .reveal-row:not(.single) .loot-ico{font-size:30px}
  .reveal-row:not(.single) .loot-text{font-size:9px}
}
/* short viewports (landscape phones) — keep the summon reveal fully on screen */
@media(max-height:560px){
  .reveal-row{row-gap:36px;max-height:74dvh;padding-bottom:34px}
  .reveal-card{width:82px;height:134px}
  .reveal-row.single .reveal-card{width:150px;height:236px}
  .summon-circle{width:180px;height:180px}
  .summon-circle.c2{width:120px;height:120px}
  .summon-actions{bottom:14px}
  .summon-hint{top:14px}
}

/* ============ Reactor tab ============ */
#panel-reactor .asc-item.rx-empty{opacity:.55;border-style:dashed}
.rx-btns{display:flex;flex-direction:column;gap:6px;align-items:stretch}
.rx-btns .asc-buy{min-width:96px}
.rx-mini{
  padding:6px 10px;border-radius:9px;font-family:var(--font);font-weight:800;font-size:11px;
  color:var(--text);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,0,0,.22));
  border:1px solid var(--line);cursor:pointer;transition:transform .1s,filter .15s;white-space:nowrap;
}
.rx-mini:hover:not(:disabled){filter:brightness(1.15)}
.rx-mini:disabled{filter:grayscale(.7) brightness(.65);cursor:not-allowed}
.rs-tile-btns{display:flex;flex-direction:column;gap:5px;align-items:stretch}
.rxm-box{margin:10px 0;padding:14px 16px;border-radius:14px;border:1px solid rgba(160,120,255,.4);
  background:linear-gradient(160deg,rgba(120,80,220,.12),rgba(0,0,0,.18))}
.rxm-sac-lbl{font-family:var(--font);font-weight:800;font-size:13px;color:#e0cbff;margin-bottom:8px}
.rxm-slider{width:100%;accent-color:#a970ff;cursor:pointer}

/* 🌳 Dogland Knowledge Guild (sub-view of the Dungeon tab) — evolving backdrop:
   cobwebbed & abandoned (tier 0) → wood showing through (1) → warm hall (2) →
   flourishing canopy (3), driven by total Guild upgrade levels bought. */
#dg-guild-host{position:relative;display:block;border-radius:14px;padding:14px;margin:0 0 10px;overflow:hidden;
  border:1px solid rgba(120,90,50,.35);
  transition:background 1s ease,border-color 1s ease,box-shadow 1s ease;
  background:
    linear-gradient(165deg,rgba(35,28,20,.6),rgba(18,14,10,.78)),
    repeating-linear-gradient(115deg,rgba(255,255,255,.025) 0 2px,transparent 2px 16px)}
#dg-guild-host::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.85;z-index:0;
  transition:opacity 1.2s ease;
  background:
    radial-gradient(circle at 0 0,transparent 0 28px,rgba(220,228,235,.11) 29px,transparent 30px),
    radial-gradient(circle at 0 0,transparent 0 44px,rgba(220,228,235,.09) 45px,transparent 46px),
    radial-gradient(circle at 0 0,transparent 0 62px,rgba(220,228,235,.07) 63px,transparent 64px),
    radial-gradient(circle at 100% 0,transparent 0 24px,rgba(220,228,235,.08) 25px,transparent 26px),
    repeating-conic-gradient(from 0deg at 0 0,rgba(220,228,235,.10) 0deg 1px,transparent 1px 14deg)}
#dg-guild-host > *{position:relative;z-index:1}
#dg-guild-host.gd-tier-0::before{opacity:.85}
#dg-guild-host.gd-tier-1{border-color:rgba(160,120,60,.4);
  background:
    linear-gradient(165deg,rgba(58,42,22,.56),rgba(28,20,12,.74)),
    repeating-linear-gradient(115deg,rgba(255,200,120,.035) 0 2px,transparent 2px 16px)}
#dg-guild-host.gd-tier-1::before{opacity:.4}
#dg-guild-host.gd-tier-2{border-color:rgba(196,152,72,.5);
  box-shadow:0 0 26px -10px rgba(200,150,60,.4) inset;
  background:
    linear-gradient(165deg,rgba(74,52,24,.56),rgba(34,24,12,.74)),
    repeating-linear-gradient(115deg,rgba(255,210,130,.05) 0 2px,transparent 2px 16px)}
#dg-guild-host.gd-tier-2::before{opacity:.12}
#dg-guild-host.gd-tier-3{border-color:rgba(140,220,140,.5);
  box-shadow:0 0 32px -8px rgba(120,220,140,.4) inset;
  background:
    linear-gradient(165deg,rgba(28,56,28,.56),rgba(15,30,16,.74)),
    repeating-linear-gradient(115deg,rgba(165,255,175,.055) 0 2px,transparent 2px 16px)}
#dg-guild-host.gd-tier-3::before{opacity:0}
#dg-guild-host.gd-tier-3::after{content:"🌿";position:absolute;top:8px;right:12px;font-size:17px;opacity:.65;
  z-index:1;animation:gdLeafSway 3.4s ease-in-out infinite}
@keyframes gdLeafSway{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
.gd-rate-badge{display:inline-block;font-family:var(--font);font-weight:800;font-size:12.5px;color:#c9f0b0;
  padding:5px 11px;border-radius:9px;margin:2px 0 8px;
  background:rgba(140,220,110,.12);border:1px solid rgba(140,220,110,.35)}
.gd-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px;margin:10px 0}
.gd-slots.gd-grid{grid-template-columns:repeat(var(--gd-cols,3),minmax(88px,1fr));max-width:340px}

/* 🏢 Departament NOPE — same structural backdrop language as the Guild above,
   an anomalous purple tint instead of the Dogland wood/canopy palette. */
.nope-bg{position:relative;display:block;border-radius:14px;padding:14px;margin:0 0 10px;overflow:hidden;
  border:1px solid rgba(150,110,220,.4);
  box-shadow:0 0 26px -10px rgba(150,110,220,.35) inset;
  background:
    linear-gradient(165deg,rgba(46,30,62,.56),rgba(18,12,26,.76)),
    repeating-linear-gradient(115deg,rgba(200,160,255,.04) 0 2px,transparent 2px 16px)}
.nope-bg::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;z-index:0;
  background:
    radial-gradient(circle at 100% 0,transparent 0 28px,rgba(212,190,255,.09) 29px,transparent 30px),
    radial-gradient(circle at 100% 0,transparent 0 46px,rgba(212,190,255,.07) 47px,transparent 48px),
    repeating-conic-gradient(from 180deg at 100% 0,rgba(212,190,255,.09) 0deg 1px,transparent 1px 14deg)}
.nope-bg > *{position:relative;z-index:1}

/* 🏢🕸️ BIURO — Departament NOPE's Etap 2 board */
.biuro-resources{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:6px 0 12px}
.biuro-res{font-family:var(--font);font-weight:700;font-size:12.5px;color:var(--text);
  background:rgba(255,255,255,.05);border:1px solid var(--line);border-radius:999px;padding:4px 10px}
.biuro-res.warn{border-color:var(--bad);color:var(--bad)}
.biuro-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;max-width:520px;margin:8px 0}
.biuro-cell{position:relative;border-radius:12px;padding:10px;min-height:96px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-align:center;
  transition:transform .1s,filter .15s}
.biuro-cell.built{background:linear-gradient(160deg,var(--panel-2),rgba(20,15,45,.6));border:1px solid var(--accent)}
.biuro-cell.empty{cursor:pointer;
  background:repeating-linear-gradient(135deg,rgba(0,0,0,.35) 0 10px,rgba(60,45,20,.25) 10px 20px),
    linear-gradient(160deg,#2a2118,#1a140f);
  border:1px dashed #5a4a35}
.biuro-cell.empty:hover{filter:brightness(1.25)}
.biuro-cell.sel{box-shadow:0 0 0 2px var(--gold) inset}
.biuro-cell.demolishing{opacity:.55;background:repeating-linear-gradient(135deg,rgba(120,20,20,.25) 0 10px,rgba(30,10,10,.35) 10px 20px)}
.biuro-cell-ico{font-size:22px;line-height:1}
.biuro-cell-ico.dim{opacity:.5}
.biuro-cell-name{font-family:var(--font);font-weight:700;font-size:11px}
.biuro-cell-out{font-size:11px;color:var(--accent3)}
.biuro-cell-out.gold{color:var(--gold)}
.biuro-cell-out.dim{color:var(--muted)}
.biuro-resonance{font-size:10px;font-weight:700;color:var(--gold)}
.biuro-starved{font-size:9.5px;color:var(--bad);font-weight:700}
.biuro-picker{margin:10px 0}
.biuro-picker-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.biuro-room-btn{font-family:var(--font);font-weight:700;font-size:11.5px;color:var(--text);cursor:pointer;
  padding:8px 12px;border-radius:10px;background:rgba(139,92,255,.14);border:1px solid var(--accent);
  display:flex;flex-direction:column;align-items:center;gap:2px;transition:filter .15s,transform .1s}
.biuro-room-btn:hover{filter:brightness(1.2)}
.biuro-room-btn:active{transform:scale(.96)}
.biuro-room-btn:disabled{opacity:.4;cursor:not-allowed;filter:none}
.biuro-room-btn small{color:var(--muted);font-weight:600}

/* 🌸 Pachinko Gardens */
.pg-palette{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.pg-grid{display:grid;grid-template-columns:repeat(var(--pg-cols,5),1fr);gap:5px;max-width:300px;margin:8px 0}
.pg-cell{aspect-ratio:1;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.03);
  font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--ink)}
.pg-cell.filled{background:rgba(255,120,200,.14);border-color:rgba(255,120,200,.4)}
.pg-cell.target{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc) inset}
.pg-cell{position:relative}
.pg-cell.rowset{box-shadow:0 0 0 2px rgba(255,196,64,.5) inset}
.pg-cell .pg-emoji{font-size:20px;line-height:1}
.pg-cell .pg-lv{position:absolute;top:-3px;right:-3px;font-style:normal;font-family:var(--font);font-weight:900;
  font-size:8px;background:var(--gold);color:#1a1206;border-radius:999px;padding:1px 3px}
.pg-cell .pg-seed{position:absolute;bottom:-4px;left:50%;transform:translateX(-50%);font-style:normal;
  font-family:var(--font);font-weight:800;font-size:7.5px;color:#8fd3a0;white-space:nowrap}
.pg-cell-pop{grid-column:1 / -1;display:flex;gap:5px;flex-wrap:wrap;justify-content:center;margin:2px 0 4px}
.pg-bloom{font-family:var(--font);font-weight:700}
.pg-lucky-wrap{margin:8px 0;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#0c1220}
.pg-lucky-canvas{display:block;width:100%}
.pg-aim{width:100%;max-width:460px;margin:6px 0}
.gd-slot{min-height:84px;border-radius:12px;border:1px dashed rgba(120,180,90,.4);
  background:linear-gradient(160deg,rgba(90,150,60,.10),rgba(0,0,0,.16));
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;
  transition:transform .1s,filter .15s,border-color .15s}
.gd-slot:hover{filter:brightness(1.2)}
.gd-slot:active{transform:scale(.96)}
.gd-slot.filled{border-style:solid;border-color:rgba(120,200,90,.55)}
.gd-slot-emoji{font-size:20px;line-height:1}
.gd-slot-name{font-family:var(--font);font-weight:800;font-size:11px;text-align:center}
.gd-slot small{font-size:9.5px;color:var(--muted)}
.gd-slot-plus{font-size:22px;color:var(--muted)}
/* ⚪ Eternal (Echo) seats — own row, echo-violet, a little ghostly */
.gd-eternal-box{margin:4px 0 12px;padding:8px 10px 2px;border-radius:14px;border:1px solid rgba(190,150,255,.35);
  background:linear-gradient(180deg,rgba(150,100,255,.10),rgba(90,200,255,.05))}
.gd-eternal-title{font-family:var(--font);font-weight:800;font-size:13px;letter-spacing:.4px;color:#d9c4ff}
.gd-eternal-row{margin:6px 0 8px}
.gd-slot.eternal{border-color:rgba(190,150,255,.55);background:radial-gradient(circle at 50% 30%,rgba(170,120,255,.18),rgba(40,20,70,.25));box-shadow:inset 0 0 12px rgba(160,120,255,.18)}
.gd-slot.eternal.filled{border-color:#b48cff;box-shadow:0 0 10px rgba(170,120,255,.35),inset 0 0 12px rgba(160,120,255,.2)}
.gd-slot.eternal .gd-slot-plus{color:#c9a8ff;font-size:20px}
.gd-slot.eternal small{color:#cdb8ff}
/* 🍵 tea time + 🎓 scholars */
.gd-tea{display:flex;gap:12px;align-items:center;margin:8px 0;padding:10px 12px;border-radius:14px;border:1px dashed rgba(230,190,120,.55);background:rgba(120,80,30,.16)}
.gd-tea.on{border-style:solid;border-color:#e8c27a;box-shadow:0 0 12px rgba(232,194,122,.3)}
.gd-tea-pair{font-size:26px;white-space:nowrap}
.gd-tea-txt{display:flex;flex-direction:column;gap:4px;min-width:0}
.gd-tea-bubble{font-style:italic;font-size:13px;padding:6px 10px;border-radius:12px;background:rgba(255,245,220,.08);border:1px solid rgba(255,230,180,.2)}
.gd-tea-sub{font-size:12px;color:var(--muted)}
.gd-tea-btn{align-self:flex-start}
.gd-slot.tea{border-color:#e8c27a;box-shadow:0 0 10px rgba(232,194,122,.45)}
.gd-slot.tea::after{content:"🍵";position:absolute;top:2px;right:4px;font-size:13px}
.gd-slot.scholar::before{content:"🎓";position:absolute;top:2px;left:4px;font-size:12px}
.gd-slot{position:relative}
.gd-rush{margin:8px 0}
.gd-picker{display:flex;flex-direction:column;gap:6px;max-height:52vh;overflow:auto}
.gd-pick{text-align:left;padding:9px 12px;border-radius:10px;font-family:var(--font);font-weight:700;font-size:12px;
  color:var(--text);background:rgba(255,255,255,.05);border:1px solid var(--line);cursor:pointer}
.gd-pick:hover:not(:disabled){filter:brightness(1.2)}
.gd-pick.busy,.gd-pick:disabled{filter:grayscale(.7) brightness(.6);cursor:not-allowed}
.gd-pick small{color:var(--muted);font-weight:800}
.gd-pick.picked{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,180,32,.25)}
/* 🗼 Paris Investigations */
.inv-active{margin:10px 0;padding:12px 14px;border-radius:12px;
  border:1px solid rgba(160,140,220,.4);background:linear-gradient(160deg,rgba(120,90,200,.12),rgba(0,0,0,.16))}
.inv-active-h{font-family:var(--font);font-weight:800;font-size:13px;color:#e0d0f0;margin-bottom:6px}

/* 🛡️ Base Defense minigame */
.bd-strip{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
/* 🔬 Field Research battery */
.bd-rs-bar{flex:1 1 100%;height:6px;border-radius:4px;background:rgba(255,255,255,.08);overflow:hidden}
.bd-rs-fill{height:100%;background:linear-gradient(90deg,#7c5cff,#3ee0c8);transition:width .3s}
.bd-rs-num{flex:1 1 100%;font-size:10px}
.bd-stat{font-family:var(--font);font-weight:800;font-size:12px;padding:5px 10px;border-radius:9px;
  background:rgba(255,255,255,.05);border:1px solid var(--line)}
.bd-stat.mun{color:#ffe0a0;border-color:rgba(255,200,120,.35)}
.bd-stat.hp{color:#ffc9d1;border-color:rgba(255,120,140,.35)}
.bd-stat.wave{color:#bcd6ff;border-color:rgba(140,180,255,.35)}
.bd-stat.best{color:#d8c4ff}
.bd-canvas-wrap{margin:8px 0;border-radius:12px;overflow:hidden;border:1px solid var(--line);background:#0e1524}
.bd-canvas{display:block;width:100%;image-rendering:optimizeSpeed;cursor:crosshair}
.bd-toolbar{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
/* 2026-09-29 — canvas + collapsible tower panel on the right */
.bd-play{display:grid;grid-template-columns:minmax(0,var(--bdw,510px)) 210px;justify-content:start;gap:10px;align-items:start;margin:8px 0}
.bd-play:has(> .bd-build:not([open])){grid-template-columns:minmax(0,var(--bdw,510px)) auto}
.bd-play > .bd-canvas-wrap{margin:0}
.bd-build{border:1px solid var(--line);border-radius:12px;background:rgba(0,0,0,.22);padding:6px 8px;position:sticky;top:8px;max-height:calc(100vh - 16px);overflow:auto}
.bd-build summary{cursor:pointer;font-family:var(--font);font-weight:800;font-size:12.5px;padding:3px 2px;white-space:nowrap}
.bd-build-list{display:flex;flex-direction:column;gap:5px;margin-top:6px}
.bd-build-item{display:flex;flex-direction:column;align-items:stretch;gap:2px;text-align:left;width:100%}
.bd-build-top{display:flex;justify-content:space-between;gap:6px}
.bd-build-cost{opacity:.85;white-space:nowrap}
.bd-build-stat{font-size:10px;font-weight:600;opacity:.7}
.bd-build-item.poor{opacity:.55}
@media (max-width:760px){
  .bd-play,.bd-play:has(> .bd-build:not([open])){grid-template-columns:1fr}
  .bd-build{position:static;max-height:none}
  .bd-build-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
}
.bd-toolbar-modes{padding-top:6px;border-top:1px dashed var(--line)}
.bd-toolbar-util{padding-top:6px;border-top:1px dashed var(--line)}
.bd-tool{font-family:var(--font);font-weight:700;font-size:11.5px;padding:6px 10px;border-radius:9px;
  border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--ink);cursor:pointer}
.bd-tool.on{border-color:var(--acc);background:rgba(139,92,255,.18);color:#fff}
.bd-tool.alt{opacity:.9}
.bd-start{width:100%;margin:6px 0 2px;padding:11px;border-radius:11px;font-family:var(--font);font-weight:800;
  font-size:13px;border:1px solid var(--acc);background:linear-gradient(160deg,rgba(139,92,255,.28),rgba(139,92,255,.12));
  color:#fff;cursor:pointer}
.bd-start:disabled{filter:grayscale(.6) brightness(.75);cursor:default}
.bd-cmd-select{width:100%;max-width:340px;margin:4px 0 2px;padding:8px 10px;border-radius:9px;
  font-family:var(--font);font-weight:700;font-size:12px;background:var(--panel-2);color:var(--text);border:1px solid var(--line)}

/* 🔄 Base Defense — rewind (secret prestige) */
.bd-stat.rewind{color:#bfe8ff;border-color:rgba(120,210,255,.4);background:rgba(90,190,255,.08)}
.bd-rewind-btn{border-color:rgba(120,210,255,.5);background:rgba(90,190,255,.10);color:#cdeeff}
.bd-rewind-btn:disabled{filter:grayscale(.6) brightness(.7);cursor:default}
.bd-rewind-btn.nudge{animation:bdRewindNudge 1.4s ease-in-out infinite;border-color:#8fdcff}
@keyframes bdRewindNudge{0%,100%{box-shadow:0 0 0 0 rgba(120,210,255,0)}50%{box-shadow:0 0 0 4px rgba(120,210,255,.45),0 0 14px rgba(120,210,255,.6)}}
:root[data-reduced-fx] .bd-rewind-btn.nudge{animation:none;box-shadow:0 0 0 2px rgba(120,210,255,.6)}
.bd-rewind-panel{position:relative;margin:8px 0;padding:14px 34px 14px 16px;border-radius:13px;overflow:hidden;
  border:1px solid rgba(120,210,255,.5);
  background:linear-gradient(160deg,rgba(90,190,255,.16),rgba(20,20,40,.35));
  box-shadow:0 0 0 rgba(120,210,255,0);
  opacity:0;transform:translateY(-6px) scale(.98)}
.bd-rewind-panel.show{animation:bdRewindPanelIn .5s cubic-bezier(.2,.9,.25,1.2) forwards,
  bdRewindGlow 2.6s ease-in-out .5s infinite}
@keyframes bdRewindPanelIn{
  0%{opacity:0;transform:translateY(-10px) scale(.96)}
  60%{opacity:1;transform:translateY(2px) scale(1.015)}
  100%{opacity:1;transform:translateY(0) scale(1)}
}
@keyframes bdRewindGlow{
  0%,100%{box-shadow:0 0 14px -6px rgba(120,210,255,.45)}
  50%{box-shadow:0 0 26px -2px rgba(120,210,255,.85)}
}
.bd-rewind-head{font-family:var(--font);font-weight:900;font-size:13.5px;color:#dff4ff;letter-spacing:.02em;margin-bottom:6px}
.bd-rewind-body{display:flex;flex-direction:column;gap:3px}
.bd-rewind-line{font-family:var(--font);font-weight:700;font-size:12px;color:#cdeeff}
.bd-rewind-line.record{color:#ffe08a}
.bd-rewind-line.holy{color:#e6d6ff}
.bd-rewind-close{position:absolute;top:8px;right:8px;width:22px;height:22px;line-height:20px;padding:0;
  border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(0,0,0,.25);color:#dff4ff;
  font-size:11px;cursor:pointer}

/* full-screen time-reverse flash on rewind — mirrors .unmake-fx */
.bd-rewind-fx{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:0;
  display:flex;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 50%,rgba(180,230,255,.9),rgba(90,190,255,.5) 32%,rgba(30,40,90,.3) 58%,transparent 75%);
  transform:scale(1.6);transition:opacity .18s ease-out}
.bd-rewind-fx.go{opacity:1;transform:scale(1);animation:bdRewindCollapse 1.3s cubic-bezier(.4,0,.2,1) forwards}
.bd-rewind-fx-clock{font-size:64px;opacity:0;filter:drop-shadow(0 0 18px rgba(180,230,255,.8))}
.bd-rewind-fx.go .bd-rewind-fx-clock{animation:bdRewindClock 1.3s cubic-bezier(.3,0,.2,1) forwards}
@keyframes bdRewindCollapse{
  0%{opacity:0;transform:scale(1.6)}
  25%{opacity:1;transform:scale(1)}
  75%{opacity:1;transform:scale(.55)}
  100%{opacity:0;transform:scale(.15)}
}
@keyframes bdRewindClock{
  0%{opacity:0;transform:rotate(0deg) scale(.5)}
  20%{opacity:1;transform:rotate(0deg) scale(1)}
  85%{opacity:1;transform:rotate(-360deg) scale(1)}
  100%{opacity:0;transform:rotate(-400deg) scale(.7)}
}

/* 🔥 Base Defense — Scorched Earth (2nd-tier reset above Rewind) */
.bd-stat.scorch{color:#ffcfa8;border-color:rgba(255,140,70,.4);background:rgba(255,110,40,.08)}
.bd-rewind-btn.scorch{border-color:rgba(255,140,70,.5);background:rgba(255,110,40,.10);color:#ffe0c2}
.bd-rewind-panel.scorch{border-color:rgba(255,140,70,.5);
  background:linear-gradient(160deg,rgba(255,110,40,.16),rgba(40,15,10,.35))}
.bd-rewind-panel.scorch.show{animation:bdRewindPanelIn .5s cubic-bezier(.2,.9,.25,1.2) forwards,
  bdScorchGlow 2.6s ease-in-out .5s infinite}
@keyframes bdScorchGlow{
  0%,100%{box-shadow:0 0 14px -6px rgba(255,140,70,.45)}
  50%{box-shadow:0 0 26px -2px rgba(255,140,70,.85)}
}
.bd-rewind-fx.scorch{background:radial-gradient(circle at 50% 50%,rgba(255,210,150,.9),rgba(255,110,40,.5) 32%,rgba(90,30,10,.3) 58%,transparent 75%)}

/* 💥 War Merit / 💀 War Trophies — 3rd/4th Base Defense HUD currencies */
.bd-stat.merit{color:#e6d6ff;border-color:rgba(180,140,255,.4);background:rgba(150,100,255,.08)}
.bd-stat.trophy{color:#ffe6b0;border-color:rgba(255,200,90,.4);background:rgba(255,190,60,.08)}
.pk-attacked{margin:10px 0;padding:14px 16px;border-radius:12px;line-height:1.45;font-size:12.5px;
  border:1px solid rgba(255,120,90,.45);background:linear-gradient(160deg,rgba(255,90,50,.14),rgba(0,0,0,.2));color:#ffd8c9}

/* ✨ "Unmake the World" prestige wipe */
.unmake-fx{position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:0;
  background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.95),rgba(255,180,240,.6) 30%,rgba(150,90,255,.35) 55%,transparent 72%);
  transform:scale(.2);transition:opacity .18s ease-out}
.unmake-fx.go{opacity:1;transform:scale(1);
  animation:unmakeCollapse 1.4s cubic-bezier(.4,0,.2,1) forwards}
@keyframes unmakeCollapse{
  0%{opacity:0;transform:scale(.15)}
  18%{opacity:1;transform:scale(1.05)}
  40%{opacity:.9;transform:scale(1)}
  100%{opacity:0;transform:scale(1.9)}
}
.rx-mini:not(:disabled):active{transform:scale(.95)}
.rx-mini:disabled{filter:grayscale(1) brightness(.7);cursor:not-allowed}
.rx-mini.danger{border-color:var(--bad);color:#ffc9d1}

/* Card Attunement block in the card-detail overlay */
.cd-attune{
  margin-top:10px;padding:10px 12px;border-radius:12px;
  background:linear-gradient(160deg,rgba(139,92,255,.14),rgba(0,0,0,.18));
  border:1px solid var(--line);display:flex;flex-direction:column;gap:6px;
}
.cd-att-btn{
  align-self:flex-start;margin-top:2px;padding:8px 16px;border-radius:10px;
  font-family:var(--font);font-weight:800;font-size:12.5px;color:#fff;cursor:pointer;
  background:linear-gradient(180deg,rgba(139,92,255,.34),rgba(139,92,255,.08));border:1px solid var(--accent);
  transition:transform .1s,filter .15s;
}
.cd-att-btn:hover:not(:disabled){filter:brightness(1.15)}
.cd-att-btn:not(:disabled):active{transform:scale(.96)}
.cd-att-btn:disabled{filter:grayscale(1) brightness(.7);border-color:var(--line);cursor:not-allowed}

/* ============ Dungeon INVASION banner ============ */
#neglect-banner.invasion{
  background:linear-gradient(180deg,rgba(255,60,60,.20),rgba(255,60,60,.06));
  border-color:#ff5c5c;color:#ffd0d0;animation:bannerPulse 1.6s ease-in-out infinite;
}
#neglect-banner.invasion b{color:#fff}

/* ============ Pachinko tab ============ */
.pk-wrap{display:flex;gap:18px;flex-wrap:wrap;align-items:flex-start}
.pk-board{flex:1 1 300px;max-width:400px;border-radius:16px;overflow:hidden;
  border:1px solid rgba(255,212,94,.22);position:relative;
  box-shadow:0 10px 40px rgba(0,0,0,.55),inset 0 0 46px rgba(139,92,255,.16),0 0 0 4px rgba(0,0,0,.35)}
.pk-board::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:16px;
  background:radial-gradient(circle at 50% 0%,rgba(255,255,255,.10),transparent 45%)}
.pk-canvas{display:block;width:100%;height:auto;aspect-ratio:380/486;background:#0c0819}
.pk-side{flex:1 1 260px;min-width:240px;display:flex;flex-direction:column;gap:12px}

.pk-wallet{display:flex;gap:8px;flex-wrap:wrap}
.pk-coin{font-family:var(--font);font-weight:800;font-size:12px;padding:6px 12px;border-radius:999px;
  border:1px solid var(--line);background:rgba(255,255,255,.05);white-space:nowrap}
.pk-coin.cry{border-color:rgba(127,178,255,.5);color:#bcd6ff}
.pk-coin.chip{border-color:rgba(79,214,201,.55);color:#9ff0e7;
  background:linear-gradient(160deg,rgba(79,214,201,.14),rgba(0,0,0,.15))}

.pk-heat{padding:10px 12px;border-radius:12px;border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(255,120,60,.08),rgba(0,0,0,.18));transition:box-shadow .3s}
.pk-heat.maxed{border-color:rgba(255,120,60,.6);box-shadow:0 0 20px -4px rgba(255,90,60,.5)}
.pk-heat-top{font-family:var(--font);font-weight:800;font-size:12px;letter-spacing:.06em;color:#ffb98a}
.pk-heat.maxed .pk-heat-top{color:#ff8a5c}
.pk-heat-bar{margin:6px 0 5px;height:7px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08)}
.pk-heat-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#ffd45e,#ff5a3c);transition:width .3s ease}
.pk-heat-hint{font-size:10.5px;color:var(--muted);line-height:1.35}
.pk-surcharge{font-size:11.5px;line-height:1.4;padding:8px 11px;border-radius:10px;
  color:#ffe0b0;background:linear-gradient(180deg,rgba(255,120,60,.16),rgba(255,120,60,.05));
  border:1px solid rgba(255,150,90,.4)}
.pk-surcharge b{color:#ff9d5c}

.pk-drop{
  padding:14px 18px;border-radius:14px;font-family:var(--font);font-weight:800;font-size:15px;color:#3a2500;cursor:pointer;
  background:linear-gradient(180deg,#ffe58c,#e0a63a);border:1px solid #ffe08a;letter-spacing:.03em;
  box-shadow:0 6px 20px rgba(224,166,58,.35),inset 0 1px 0 rgba(255,255,255,.5);transition:transform .1s,filter .15s;
}
.pk-drop:hover:not(:disabled){filter:brightness(1.08)}
.pk-drop:not(:disabled):active{transform:scale(.97)}
.pk-drop:disabled{filter:grayscale(.8) brightness(.65);cursor:not-allowed;box-shadow:none}

.pk-auto{
  padding:9px 14px;border-radius:11px;font-family:var(--font);font-weight:800;font-size:12px;cursor:pointer;
  color:var(--muted);background:rgba(255,255,255,.05);border:1px solid var(--line);transition:filter .15s,transform .1s;
}
.pk-auto.on{color:#9ff0e7;border-color:rgba(79,214,201,.55);
  background:linear-gradient(160deg,rgba(79,214,201,.16),rgba(0,0,0,.12))}
.pk-auto:hover{filter:brightness(1.15)}
.pk-auto:active{transform:scale(.97)}

.pk-ticker{display:flex;flex-wrap:wrap;gap:6px}
.pk-xlist .asc-item.pk-x{--rar:#4fd6c9}
.pk-xlist .asc-item.pk-x .asc-buy{border-color:rgba(79,214,201,.5);color:#9ff0e7}
.pk-xlist .asc-item.pk-x.affordable{border-color:rgba(79,214,201,.5)}
.pk-xlist .asc-item.pk-x.owned{opacity:.6}

/* ============ Gacha banner switch + Rarity Dial ============ */
.banner-switch{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:4px}
.banner-arrow{
  width:40px;height:40px;border-radius:50%;font-size:22px;font-weight:800;line-height:1;color:var(--text);
  background:rgba(255,255,255,.06);border:1px solid var(--line);cursor:pointer;transition:transform .1s,filter .15s;
}
.banner-arrow:hover{filter:brightness(1.25)}
.banner-arrow:active{transform:scale(.9)}
.banner-dots{display:flex;justify-content:center;gap:7px;margin-top:8px}
.banner-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.18);cursor:pointer;transition:background .2s,transform .2s}
.banner-dot.on{background:var(--accent);transform:scale(1.3)}
.rarity-dial{margin:12px 0 4px;padding:10px 14px;border-radius:12px;
  background:linear-gradient(160deg,rgba(255,180,32,.12),rgba(0,0,0,.18));border:1px solid var(--line)}
.rd-label{font-family:var(--font);font-weight:700;font-size:12px;color:var(--gold);margin-bottom:6px}
.rd-slider{width:100%;accent-color:var(--gold);cursor:pointer}

/* ============ HUD — show-all-resources chips ============ */
#hud-extra{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;width:100%;margin-top:6px}
#hud-extra[hidden]{display:none}
.hud-xchip{font-family:var(--font);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;
  background:rgba(255,255,255,.06);border:1px solid var(--line);white-space:nowrap}
.hud-xchip small{color:var(--muted);font-weight:600;margin-left:3px}

/* ============ Research tab — 8×8 lab grid ============ */
.rs-gridwrap{display:flex;justify-content:center;margin:6px 0 4px}
.rs-grid{display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(8,1fr);gap:4px;
  width:min(520px,92vw);aspect-ratio:1/1;padding:8px;border-radius:14px;
  background:linear-gradient(160deg,#0e0b1c,#151026);border:1px solid var(--line)}
.rs-cell{position:relative;border-radius:8px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);
  display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;
  aspect-ratio:1/1;min-width:0;min-height:0;
  transition:transform .08s,background .15s,border-color .15s;overflow:hidden}
.rs-cell:hover{border-color:var(--accent)}
.rs-cell.rs-hint{background:rgba(139,92,255,.10);border-style:dashed}
.rs-cell.filled{background:
  linear-gradient(0deg, rgba(255,180,32,calc(.06 + .5 * var(--heat,0))), rgba(255,180,32,.03));
  border-color:rgba(255,200,90,calc(.2 + .6 * var(--heat,0)))}
.rs-cell.filled:hover{transform:scale(1.06)}
.rs-emoji{font-size:min(4.5vw,20px);line-height:1}
.rs-out{font-family:var(--font);font-weight:800;font-size:9px;color:#f4f1ff;margin-top:1px;line-height:1.1}
.rs-out.anom{color:#c58bff;text-shadow:0 0 6px rgba(170,90,255,.55)}

/* Research grid view: grid left (sticky), compact tile palette right */
.rs-lab{display:grid;grid-template-columns:auto minmax(260px,1fr);gap:14px;align-items:start}
.rs-lab .rs-gridwrap{position:sticky;top:8px;margin:0}
.rs-lab .rs-grid{width:min(520px,52vw)}
.rs-side{max-height:min(560px,calc(100vh - 150px));overflow:auto;padding-right:4px;min-width:0}
.rs-side .section-title{margin-top:0}
.rs-side .rates-note{font-size:11px}
.rs-pal{gap:5px}
.rs-pal .asc-item{gap:8px;padding:6px 8px;border-radius:10px}
.rs-pal .asc-ico{width:28px;height:28px;border-radius:8px;font-size:17px}
.rs-pal .asc-name{font-size:12px;line-height:1.25}
.rs-pal .asc-desc{font-size:11px;line-height:1.35}
.rs-pal .asc-buy{min-width:0;padding:5px 9px;font-size:11.5px;border-radius:9px}
.rs-pal .rs-tile-btns{gap:3px}
/* 📱 phones: Research rows put their buttons on a full-width row under the
   text instead of a column that squeezes the description (2026-09-29) */
@media (max-width:600px){
  #panel-research .rs-mega,
  #panel-research .asc-item{grid-template-columns:auto minmax(0,1fr);gap:8px 10px;padding:10px}
  #panel-research .rs-mega > .rs-tile-btns,
  #panel-research .rs-mega > .asc-buy,
  #panel-research .rs-mega > .rx-mini,
  #panel-research .asc-item > .asc-buy,
  #panel-research .asc-item > .rs-tile-btns{grid-column:1 / -1}
  #panel-research .rs-tile-btns{flex-direction:row;flex-wrap:wrap;justify-content:flex-end}
  #panel-research .rs-tile-btns > *{flex:1 1 auto}
  #panel-research .asc-item > .asc-buy{width:100%;min-width:0}
  #panel-research .asc-ico{width:34px;height:34px;font-size:19px}
  #panel-research .rs-mega-ico{font-size:22px;width:28px}
  /* the tile palette: one line per tile, buttons stay beside it */
  #panel-research .rs-pal .asc-item{grid-template-columns:auto minmax(0,1fr) auto;padding:6px 8px}
  #panel-research .rs-pal .asc-item > .asc-buy,
  #panel-research .rs-pal .asc-item > .rs-tile-btns{grid-column:auto;width:auto}
  #panel-research .rs-pal .rs-tile-btns{flex-direction:row;flex-wrap:nowrap}
  #panel-research .rs-pal .rs-tile-btns > *{flex:none}
  #panel-research .rs-pal .asc-ico{width:26px;height:26px;font-size:15px}
}
@media (max-width:700px){   /* phones only — tablets (≥700) keep grid + palette side by side */
  .rs-lab{grid-template-columns:1fr}
  .rs-lab .rs-gridwrap{position:static}
  .rs-lab .rs-grid{width:min(520px,92vw)}
  .rs-side{max-height:none;overflow:visible}
}

/* ============ Collection sort control ============ */
.coll-sort{display:flex;align-items:center;gap:8px;margin:2px 0 12px}
.coll-sort-lbl{font-family:var(--font);font-weight:700;font-size:11px;letter-spacing:1px;color:var(--muted);text-transform:uppercase}
.coll-sort-btn{font-family:var(--font);font-weight:800;font-size:12px;color:var(--text);cursor:pointer;
  padding:7px 14px;border-radius:10px;background:rgba(139,92,255,.16);border:1px solid var(--accent);
  transition:transform .1s,filter .15s}
.coll-sort-btn:hover{filter:brightness(1.2)}
.coll-sort-btn:active{transform:scale(.96)}
.pack-filter-row{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.pack-filter-chip{
  --chip-c:var(--muted);
  font-family:var(--font);font-weight:700;font-size:11.5px;color:var(--text);cursor:pointer;
  padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.04);
  border:1px solid var(--chip-c);box-shadow:0 0 0 0 var(--chip-c);
  transition:transform .1s,filter .15s,box-shadow .15s}
.pack-filter-chip small{color:var(--muted);margin-left:4px;font-weight:600}
.pack-filter-chip:hover{filter:brightness(1.25)}
.pack-filter-chip:active{transform:scale(.96)}
.pack-filter-chip.active{background:var(--chip-c);color:#0c0a18;box-shadow:0 0 14px -2px var(--chip-c)}
.pack-filter-chip.active small{color:#0c0a18cc}
.pk-chip{font-family:var(--font);font-weight:700;font-size:11px;padding:4px 9px;border-radius:999px;
  background:rgba(255,255,255,.05);border:1px solid var(--line)}
@media(max-width:640px){ .pk-wrap{gap:12px} .pk-board{flex-basis:100%;max-width:none} .pk-side{flex-basis:100%} }

/* ============ Menagerie (połącz dwa / merge) ============ */
.mg-board{flex:none;max-width:100%;min-width:0;display:flex;flex-direction:column;gap:10px;align-items:center}
.mg-grid{display:grid;grid-template-columns:repeat(var(--cols,4),1fr);gap:6px;
  padding:10px;border-radius:14px;background:linear-gradient(160deg,#0e0b1c,#151026);
  border:1px solid var(--line);box-shadow:inset 0 0 40px rgba(139,92,255,.12);touch-action:none}
.mg-cell{width:min(calc((100vw - 112px) / var(--cols,4) - 6px),58px);height:auto;aspect-ratio:1;   /* scales with the column count so an 8-wide board fits a phone */
  border-radius:10px;padding:0;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:var(--text);
  cursor:grab;transition:transform .08s,filter .12s,border-color .12s;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;touch-action:none}
.mg-cell:not(.empty){background:hsl(var(--h,260) 45% 22% / .9);border-color:hsl(var(--h,260) 70% 55% / .55)}
.mg-cell:not(.empty):hover{filter:brightness(1.15)}
.mg-cell:not(.empty):active{cursor:grabbing}
.mg-cell.empty{cursor:default}
.mg-cell.shiny{box-shadow:0 0 0 2px #ffd36a inset,0 0 14px rgba(255,211,106,.55);animation:mgShiny 2.4s ease-in-out infinite}
@keyframes mgShiny{50%{box-shadow:0 0 0 2px #fff3c4 inset,0 0 22px rgba(255,211,106,.9)}}
:root[data-reduced-fx] .mg-cell.shiny{animation:none}
.mg-combo{font-family:var(--font);font-weight:800;font-size:13px;color:#ff9b5c;text-align:center;margin-top:6px;text-shadow:0 0 10px rgba(255,120,60,.5)}
.mg-prod b{color:var(--accent3)}
.mg-herd{border-color:#ffd36a}
.mg-cell.anom{box-shadow:0 0 0 2px #b478ff inset,0 0 12px rgba(180,120,255,.5)}
.mg-ayame{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:12px;border:1px solid #8a6a4a;background:rgba(107,74,47,.18)}
.mg-ayame.evolved{border-color:#b478ff;background:linear-gradient(160deg,rgba(120,70,200,.22),rgba(0,0,0,.15))}
.mg-ayame-ico{font-size:30px;line-height:1}
.mg-ayame-body{min-width:0;flex:1;display:flex;flex-direction:column;gap:4px}
.mg-ayame-name{font-family:var(--font);font-weight:800;font-size:13px}
.mg-herd.armed,.mg-release.armed{background:linear-gradient(180deg,rgba(255,90,90,.45),rgba(255,90,90,.15));border-color:#ff7a7a;color:#fff}
.mg-best{align-self:stretch;box-sizing:border-box;min-width:0;max-width:100%;margin-top:10px;border:1px solid var(--line);border-radius:12px;padding:6px 10px;background:rgba(0,0,0,.18)}
.mg-best summary{cursor:pointer;font-family:var(--font);font-weight:800;font-size:12.5px;padding:4px 0}
.mg-best-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px;margin:6px 0}
.mg-best-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;aspect-ratio:1;border-radius:7px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);min-width:0}
.mg-best-cell.unseen .mg-best-emoji{filter:brightness(0) opacity(.45)}
.mg-best-cell.shiny{border-color:#ffd36a;box-shadow:0 0 8px rgba(255,211,106,.45)}
.mg-best-emoji{font-size:min(4.2vw,17px);line-height:1}
.mg-best-t{font-size:8.5px;color:var(--muted);font-weight:700;margin-top:1px}
.mg-cell.sel{outline:2px solid var(--gold);outline-offset:-2px;box-shadow:0 0 12px rgba(255,180,32,.5)}
.mg-cell.dragging{opacity:.35}
.mg-cell.drop-ok{outline:2px solid #8ef5d0;outline-offset:-2px;filter:brightness(1.3)}
.mg-emoji{font-size:min(8vw,26px);line-height:1;pointer-events:none}
.mg-tier{font-family:var(--font);font-weight:800;font-size:9px;color:rgba(255,255,255,.8);pointer-events:none}
.mg-ghost{position:fixed;transform:translate(-50%,-50%);pointer-events:none;z-index:300;
  font-size:30px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.6))}
.mg-note{max-width:360px;text-align:center;font-size:11px;line-height:1.6;color:var(--muted)}
.mg-note b{color:var(--text)}
/* shared mini-game result box + secondary button (also used by Calibration) */
.r2-won,.cal-fail{width:100%;text-align:center;font-size:12px;line-height:1.7;padding:10px 12px;border-radius:12px;
  background:linear-gradient(160deg,rgba(120,255,180,.14),rgba(0,0,0,.18));border:1px solid rgba(120,255,180,.35)}
.r2-won b{color:var(--gold)}
.cal-fail{background:linear-gradient(160deg,rgba(255,90,120,.14),rgba(0,0,0,.18));border-color:rgba(255,90,120,.35)}
.r2-act{width:100%;font-family:var(--font);font-weight:800;font-size:12px;padding:9px 10px;border-radius:10px;cursor:pointer;
  color:var(--text);background:rgba(139,92,255,.16);border:1px solid var(--accent);transition:transform .1s,filter .15s}
.r2-act:hover:not(:disabled){filter:brightness(1.2)}
.r2-act:active:not(:disabled){transform:scale(.96)}
.r2-act:disabled{filter:grayscale(.8) brightness(.6);cursor:not-allowed}
.cal-canvas{background:#0d0a1a}
.cal-fire{background:linear-gradient(180deg,#8ef5d0,#3ec9a0);border-color:#b7ffe8;box-shadow:0 6px 20px rgba(62,201,160,.35);color:#062a20}

/* ============ Reactor Calibration: Harmonic Array (v0.0.9) ============ */
.cb-tunebar-wrap{height:10px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08);margin:2px 0 6px}
.cb-tunebar{height:100%;border-radius:999px;background:linear-gradient(90deg,#8b5cff,#4fd6c9,#ffb420);transition:width .4s ease}
.cb-ring{position:relative;width:100%;max-width:340px;margin:14px auto;aspect-ratio:1/1}
.cb-ring-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.cb-link{stroke:rgba(255,255,255,.14);stroke-width:1.4}
.cb-link.ok{stroke:rgba(120,255,180,.75);stroke-width:2.2}
.cb-link.bad{stroke:rgba(255,110,90,.7);stroke-width:2.2;stroke-dasharray:3 3}
.cb-slot{position:absolute;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:14px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer;
  background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--text);transition:transform .1s,filter .15s,border-color .15s}
.cb-slot:hover{filter:brightness(1.25)}
.cb-slot:active{transform:translate(-50%,-50%) scale(.94)}
.cb-slot.target{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,180,32,.25)}
.cb-slot .cb-slot-emoji{font-size:20px;line-height:1}
.cb-slot small{font-family:var(--font);font-weight:800;font-size:9px;color:var(--muted)}
.cb-slot .cb-slot-plus{font-size:20px;color:var(--muted)}
.cb-slot.filled.b1{border-color:#ffb420;background:rgba(255,180,32,.13)}
.cb-slot.filled.b2{border-color:#4fd6c9;background:rgba(79,214,201,.13)}
.cb-slot.filled.b3{border-color:#8b5cff;background:rgba(139,92,255,.15)}
.cb-palette{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin:6px 0}
.cb-rodbtn{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;padding:8px 10px;border-radius:12px;
  cursor:pointer;color:var(--text);background:rgba(255,255,255,.04);border:1px solid var(--line);transition:transform .1s,filter .15s,border-color .15s}
.cb-rodbtn:hover:not(:disabled){filter:brightness(1.2)}
.cb-rodbtn:active:not(:disabled){transform:scale(.97)}
.cb-rodbtn:disabled{filter:grayscale(.7) brightness(.6);cursor:not-allowed}
.cb-rodbtn.sel{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,180,32,.25)}
.cb-rodbtn.locked{border-style:dashed}
.cb-rodbtn.b1{border-left:3px solid #ffb420}
.cb-rodbtn.b2{border-left:3px solid #4fd6c9}
.cb-rodbtn.b3{border-left:3px solid #8b5cff}
.cb-rodbtn-emoji{font-size:16px}
.cb-rodbtn-name{font-family:var(--font);font-weight:800;font-size:12px}
.cb-rodbtn small{font-size:10.5px;color:var(--muted);line-height:1.4}
.cb-rodbtn-cost{font-family:var(--font);font-weight:800;font-size:10px;color:var(--gold);margin-top:2px}
.cb-link.overtone{stroke-width:1;opacity:.5;stroke-dasharray:1.5 2.5}
.cb-link.spoke{stroke-width:1;opacity:.35}
.cb-slot.chained{box-shadow:0 0 0 2px rgba(255,220,120,.4),0 0 10px rgba(255,200,90,.3)}
.cb-slot .cb-slot-lv{position:absolute;top:-4px;right:-4px;font-style:normal;font-family:var(--font);font-weight:900;
  font-size:8.5px;background:var(--gold);color:#1a1206;border-radius:999px;padding:1px 4px}
.cb-slot{position:absolute}
.cb-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:60px;height:60px;border-radius:50%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;cursor:pointer;
  background:radial-gradient(circle,rgba(255,255,255,.09),rgba(255,255,255,.03));border:1px dashed var(--line);
  color:var(--text);transition:transform .1s,filter .15s,border-color .15s}
.cb-core:hover{filter:brightness(1.25)}
.cb-core.target{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,180,32,.25)}
.cb-core .cb-slot-emoji{font-size:22px;line-height:1}
.cb-core small{font-family:var(--font);font-weight:800;font-size:8px;color:var(--muted);letter-spacing:.05em}
.cb-core .cb-slot-plus{font-size:22px;color:var(--muted)}
.cb-core.filled.b1{border-style:solid;border-color:#ffb420;background:radial-gradient(circle,rgba(255,180,32,.22),rgba(255,180,32,.05))}
.cb-core.filled.b2{border-style:solid;border-color:#4fd6c9;background:radial-gradient(circle,rgba(79,214,201,.22),rgba(79,214,201,.05))}
.cb-core.filled.b3{border-style:solid;border-color:#8b5cff;background:radial-gradient(circle,rgba(139,92,255,.24),rgba(139,92,255,.05))}
.cb-core .cb-slot-lv{position:absolute;top:-2px;right:-2px}
.cb-slot-pop{position:absolute;transform:translate(-50%,calc(-50% + 46px));z-index:6;display:flex;flex-direction:column;gap:4px;
  background:var(--panel-2);border:1px solid var(--line);border-radius:10px;padding:6px;box-shadow:0 6px 20px rgba(0,0,0,.4)}
.cb-pop-btn{padding:5px 9px;border-radius:8px;font-family:var(--font);font-weight:800;font-size:10.5px;white-space:nowrap;
  color:#fff;background:linear-gradient(180deg,rgba(139,92,255,.3),rgba(139,92,255,.08));border:1px solid var(--accent)}
.cb-pop-btn.danger{background:linear-gradient(180deg,rgba(255,110,90,.28),rgba(255,110,90,.06));border-color:var(--bad)}
.cb-pop-btn:disabled{filter:grayscale(1) brightness(.7);cursor:not-allowed}
.cb-contract{margin:10px 0;padding:10px 12px;border:1px solid var(--line);border-left:3px solid var(--gold);border-radius:12px;background:var(--panel-2)}
@media(max-width:640px){ .cb-ring{max-width:280px} .cb-slot{width:48px;height:48px} .cb-core{width:52px;height:52px} }

/* ============ Dungeon: pause + monster strategy ============ */
.dg-pause{font-family:var(--font);font-weight:800;font-size:12px;padding:8px 14px;border-radius:10px;cursor:pointer;
  color:var(--text);background:rgba(255,255,255,.06);border:1px solid var(--line);transition:transform .1s,filter .15s}
.dg-pause:hover{filter:brightness(1.2)}
.dg-pause.on{background:linear-gradient(180deg,rgba(255,180,32,.28),rgba(255,180,32,.08));border-color:var(--gold);color:#fff}
.dg-mon-strat{font-family:var(--font);font-weight:700;font-size:11px;color:var(--accent2);margin-top:3px}
.dg-monster.paused{filter:grayscale(.7) brightness(.75)}
.dg-monster.paused::after{content:"⏸ PAUSED";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:var(--font);font-weight:900;font-size:15px;letter-spacing:2px;color:#fff;background:rgba(0,0,0,.35);border-radius:inherit}
.dg-monster{position:relative}

/* ============ Dungeon: boss abilities ============ */
.dg-mon-boss{font-family:var(--font);font-weight:800;font-size:11px;color:var(--gold);margin-top:3px}
.dg-mon-warn{font-family:var(--font);font-weight:800;font-size:11px;color:#ff6b6b;margin-top:2px}
.dg-monster.telegraph{animation:pulse 0.8s ease-in-out infinite;box-shadow:0 0 0 2px rgba(255,60,60,.5)}

/* ============ Expeditions ============ */
.exp-warn{
  background:linear-gradient(90deg,rgba(255,120,60,.18),rgba(255,60,60,.10));
  border:1px solid #ff7a3d;border-radius:12px;padding:10px 12px;margin:8px 0;
  font-family:var(--font);font-weight:700;font-size:12px;color:var(--text)}

.exp-map{
  position:relative;width:100%;aspect-ratio:16/9;max-height:360px;margin:8px 0 4px;
  border:1px solid var(--line);border-radius:14px;overflow:hidden;
  background:
    radial-gradient(120% 90% at 15% 100%, rgba(60,120,180,.30), transparent 60%),
    radial-gradient(120% 120% at 90% 0%, rgba(120,90,200,.22), transparent 55%),
    linear-gradient(160deg,#0c1830,#0a1024)}
.exp-map-svg{position:absolute;inset:0;width:100%;height:100%}
.exp-land{
  fill:rgba(40,54,40,.55);stroke:rgba(150,200,150,.35);stroke-width:.6;
  filter:drop-shadow(0 4px 12px rgba(0,0,0,.4))}
.exp-route{stroke:var(--accent3);stroke-width:.7;stroke-dasharray:2 2;opacity:.55}

.exp-home{
  position:absolute;transform:translate(-50%,-50%);text-align:center;
  font-family:var(--font);color:var(--muted);pointer-events:none}
.exp-home span{font-size:20px;display:block}
.exp-home small{font-size:9px;letter-spacing:.5px}

.exp-waystation{
  position:absolute;transform:translate(-50%,-50%);width:22px;height:22px;border-radius:50%;
  display:grid;place-items:center;font-size:12px;z-index:1;cursor:help;
  background:radial-gradient(circle at 35% 30%,rgba(20,16,10,.85),rgba(10,8,4,.9));
  border:1.5px dashed var(--accent3);opacity:.65;transition:opacity .15s,transform .15s}
.exp-waystation:hover{opacity:1;transform:translate(-50%,-50%) scale(1.15)}
.exp-waystation.ready{opacity:1;border-style:solid;border-color:var(--good);animation:pulse 1.2s infinite}

.exp-pin{
  position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;
  align-items:center;gap:3px;padding:0;background:none;z-index:2}
.exp-pin-dot{
  width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-size:18px;
  background:radial-gradient(circle at 35% 30%,var(--panel-solid),#0b0820);
  border:2px solid var(--accent3);box-shadow:0 4px 12px rgba(0,0,0,.5);transition:transform .15s}
.exp-pin:hover .exp-pin-dot{transform:scale(1.12)}
.exp-pin-lbl{
  background:var(--panel-solid);border:1px solid var(--line);border-radius:8px;
  padding:3px 7px;text-align:center;font-family:var(--font);white-space:nowrap;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.exp-pin-lbl b{display:block;font-size:11px;color:var(--text)}
.exp-pin-lbl small{font-size:9px;color:var(--muted)}
/* 👥 parties out on the map (2026-09-30) */
.exp-party{
  position:absolute;transform:translate(-50%,-135%);z-index:3;pointer-events:auto;cursor:help;
  background:var(--panel-solid);border:1.5px solid var(--accent3);border-radius:10px;
  padding:1px 5px;font-size:13px;line-height:1.3;box-shadow:0 2px 6px rgba(0,0,0,.45);
  animation:expBob 1.6s ease-in-out infinite;animation-delay:var(--bob,0s);will-change:transform}
.exp-party::after{content:"";position:absolute;left:50%;bottom:-6px;margin-left:-5px;
  border:5px solid transparent;border-top-color:var(--accent3);border-bottom:0}
.exp-party.back .exp-party-ic{display:inline-block;transform:scaleX(-1)}
.exp-party.site{border-color:var(--accent2)}
.exp-party.done{border-color:var(--good);animation:none}
@keyframes expBob{0%,100%{transform:translate(-50%,-135%)}50%{transform:translate(-50%,-160%)}}
:root[data-reduced-fx] .exp-party{animation:none}
.exp-pin-bar{width:52px;height:4px;border-radius:3px;background:rgba(255,255,255,.12);overflow:hidden}
.exp-pin-bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2))}
.exp-pin.running .exp-pin-dot{border-color:var(--accent2)}
.exp-pin.ready .exp-pin-dot{border-color:var(--good);animation:pulse 1.2s infinite}
/* v0.0.8 — uncharted region: fogged, unclickable.
   v0.0.10 — --fog (1 = untouched, 0 = about to be charted) thins the fog as
   Cartography Corps / runsDone close in on the discovery threshold. */
.exp-pin.fogged{
  --fog:1;pointer-events:none;z-index:1;transition:opacity .3s,filter .3s;
  opacity:calc(.35 + .5*(1 - var(--fog)));
  filter:grayscale(calc(.85*var(--fog))) blur(calc(.6px*var(--fog)))}
.exp-pin.fogged .exp-pin-dot{border-color:var(--line);border-style:dashed;background:#0b0820}
.exp-pin.fogged .exp-pin-lbl{font-size:9px;color:var(--muted);white-space:normal;max-width:120px}
.exp-pin.fogged.scanning::before{
  content:"";position:absolute;inset:-8px;border-radius:50%;
  border:1.5px solid var(--accent3);opacity:.6;pointer-events:none;
  animation:radarPing 2.4s ease-out infinite}
@keyframes radarPing{
  0%{transform:scale(.55);opacity:.55}
  100%{transform:scale(1.9);opacity:0}}
.exp-mbtn.fogged{opacity:.55;filter:grayscale(.7);cursor:not-allowed}

.exp-slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:6px 0}
.exp-slot{
  border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--panel-2);
  display:flex;flex-direction:column;gap:8px;min-height:120px}
.exp-slot.empty{align-items:center;justify-content:center;text-align:center;cursor:pointer;border-style:dashed;color:var(--muted)}
.exp-slot.empty:hover{border-color:var(--accent3);color:var(--text)}
.exp-slot.ready{border-color:var(--good);box-shadow:0 0 0 1px var(--good) inset}
.exp-slot-plus{font-size:26px;line-height:1}
.exp-slot-hint{font-family:var(--font);font-size:12px}
.exp-slot-top{display:flex;align-items:center;gap:6px;font-family:var(--font);font-weight:800}
.exp-slot-emoji{font-size:16px}
.exp-slot-name{font-size:13px;color:var(--text)}
.exp-slot-party{display:flex;flex-wrap:wrap;gap:4px}
.exp-pill{
  background:var(--panel-solid);border:1px solid var(--line);border-radius:20px;
  padding:2px 8px;font-size:10px;font-family:var(--font);color:var(--muted)}
.exp-bar{height:6px;border-radius:4px;background:rgba(255,255,255,.10);overflow:hidden}
.exp-bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .3s}
.exp-slot-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto}
.exp-left{font-family:var(--font);font-size:11px;color:var(--muted)}
.exp-back{font-family:var(--font);font-weight:800;font-size:12px;color:var(--good)}

.exp-power{
  background:var(--panel-2);border:1px solid var(--line);border-radius:10px;
  padding:8px 10px;margin:6px 0;font-family:var(--font);font-size:12px;color:var(--text)}
.exp-power small{color:var(--muted)}
.exp-mpick{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:6px}
.exp-mbtn{
  border:1px solid var(--line);border-radius:10px;padding:8px;text-align:left;background:var(--panel-2)}
.exp-mbtn b{display:block;font-size:12px}
.exp-mbtn small{font-size:10px;color:var(--muted)}
.exp-mbtn.active{border-color:var(--accent3);background:var(--panel-solid);box-shadow:0 0 0 1px var(--accent3) inset}
.exp-roster{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px;max-height:260px;overflow-y:auto;padding:2px}
.exp-card{
  border:1px solid var(--line);border-radius:10px;padding:6px 4px;text-align:center;background:var(--panel-2);
  display:flex;flex-direction:column;gap:2px;align-items:center}
.exp-card-emoji{font-size:18px}
.exp-card-name{font-size:10px;font-family:var(--font);color:var(--text);line-height:1.1}
.exp-card small{font-size:9px;color:var(--muted)}
.exp-card.picked{border-color:var(--good);box-shadow:0 0 0 1px var(--good) inset}
.exp-card.busy{opacity:.4}
.exp-launch-btn{width:100%;margin-top:10px}
.exp-result{text-align:center}
.exp-result-emoji{font-size:40px;margin-bottom:6px}
.exp-result-list{display:flex;flex-direction:column;gap:4px}
.exp-result-line{
  background:var(--panel-2);border:1px solid var(--line);border-radius:8px;padding:6px 10px;
  font-family:var(--font);font-size:12px}

/* trio discovery */
.dg-trio-item.mystery{border-style:dashed;opacity:.75}
.dg-trio-item.mystery .dg-trio-name{color:var(--muted)}

/* sandbox + changelog (Settings) */
.sandbox-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:6px;margin-top:10px}
.sandbox-grid .btn{padding:8px 6px;font-size:12px}
.changelog{display:flex;flex-direction:column;gap:12px;margin-top:8px}
.cl-rel.cl-latest{border:1px solid var(--accent3);border-radius:14px;padding:12px 14px;background:linear-gradient(160deg,rgba(51,214,255,.07),rgba(0,0,0,.15))}
.cl-rel.cl-latest .cl-items li{font-size:13px}
.cl-toggle{margin:14px 0 4px}
.bd-rs-fill.nr{background:linear-gradient(90deg,#8a1c2a,#ff5a6a)}
.madoka-cost{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:center;margin:8px 0}
.madoka-cost-lbl{font-weight:700;font-size:12px;opacity:.8}
.madoka-cost-item{font:700 12px var(--font);padding:3px 8px;border-radius:999px;border:1px solid var(--line)}
.madoka-cost-item.ok{border-color:var(--good);color:var(--good)}
.madoka-cost-item.miss{border-color:#ff7a7a;color:#ff9a9a}
.madoka-concordat{display:flex;gap:8px;align-items:flex-start;margin-top:10px;padding:8px 10px;border:1px solid var(--accent3);border-radius:10px;cursor:pointer}
.madoka-concordat input{margin-top:3px}
.cl-older .cl-rel{border-top:1px solid var(--line);padding-top:10px}
.cl-rel .cl-ver{font-family:var(--font);font-weight:800;font-size:13px;color:var(--accent3);margin-bottom:4px}
.cl-items{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.cl-items li{font-size:12px;color:var(--text);line-height:1.35}

/* ============ v0.0.4 follow-ups: vent / party bonus / loadout presets / partial synergy ============ */
.rx-oc-head{flex-wrap:wrap;gap:6px}
.rx-oc-vent{
  font-family:var(--font);font-weight:700;font-size:11px;padding:5px 9px;border-radius:9px;
  border:1px solid var(--line);background:var(--panel-2);color:var(--text)}
.rx-oc-vent:disabled{opacity:.4;cursor:default}
.rx-oc-vent:not(:disabled):hover{border-color:var(--accent3)}

/* v0.0.8 — the big red OVERCLOCK switch, sits under the reactor core + mounts */
.rx-oc-redbtn{display:block;width:100%;margin-top:10px;padding:12px 14px;border-radius:12px;
  font-family:var(--font);font-weight:900;font-size:14px;letter-spacing:.06em;text-transform:uppercase;
  color:#fff;cursor:pointer;
  background:radial-gradient(circle at 50% 30%,#ff5a4d,#b3140a);
  border:2px solid #7a0d06;box-shadow:0 4px 0 #6a0b05,0 0 22px rgba(255,70,50,.45);
  transition:transform .08s,box-shadow .15s,filter .15s}
.rx-oc-redbtn:not(:disabled):hover{filter:brightness(1.08)}
.rx-oc-redbtn:not(:disabled):active{transform:translateY(3px);box-shadow:0 1px 0 #6a0b05,0 0 14px rgba(255,70,50,.4)}
.rx-oc-redbtn.armed{background:radial-gradient(circle at 50% 30%,#ffd23d,#e0890a);border-color:#8a5406;
  box-shadow:0 4px 0 #7a4a05,0 0 26px rgba(255,180,40,.6);animation:rxOcPulse 1.3s ease-in-out infinite}
@keyframes rxOcPulse{0%,100%{box-shadow:0 4px 0 #7a4a05,0 0 20px rgba(255,180,40,.45)}
  50%{box-shadow:0 4px 0 #7a4a05,0 0 34px rgba(255,180,40,.8)}}
.rx-oc-redbtn.cooling,.rx-oc-redbtn:disabled{filter:grayscale(.6);opacity:.6;cursor:default;box-shadow:0 4px 0 #444}

/* v0.0.10b — heat gauge under the switch; colour band mirrors the toggle-shock thresholds */
.rx-oc-bar{position:relative;height:10px;border-radius:6px;margin-top:10px;overflow:hidden;
  background:linear-gradient(90deg,
    rgba(255,255,255,.07) 0%, rgba(255,255,255,.07) 80%,
    rgba(255,180,40,.20) 80%, rgba(255,180,40,.20) 90%,
    rgba(255,70,50,.24) 90%, rgba(255,70,50,.24) 100%);
  border:1px solid var(--line)}
.rx-oc-bar>i{display:block;height:100%;border-radius:5px 0 0 5px;transition:width .25s,background .25s}
.rx-oc-bar>i.ok{background:linear-gradient(90deg,var(--accent),var(--accent2))}
.rx-oc-bar>i.warn{background:linear-gradient(90deg,#ffb020,#ff8a00)}
.rx-oc-bar>i.crit{background:linear-gradient(90deg,#ff5a4d,#c2140a);animation:rxHeatCrit .8s ease-in-out infinite}
@keyframes rxHeatCrit{0%,100%{filter:brightness(1)}50%{filter:brightness(1.35)}}

/* 🔥🕸️ Paradox Zone marker on the heat bar + entrance pulse */
.rx-oc-pxzone{
  position:absolute;top:0;bottom:0;pointer-events:none;
  background:repeating-linear-gradient(135deg,rgba(180,120,255,.35) 0 4px,rgba(180,120,255,.1) 4px 8px);
  border-left:2px solid #b478ff;
}
.rx-oc.px-zone-active{animation:pxPulse 1.1s ease-in-out infinite}
@keyframes pxPulse{0%,100%{box-shadow:0 0 0 0 rgba(180,120,255,.5)}50%{box-shadow:0 0 22px 4px rgba(180,120,255,.5)}}
.rx-px-note{font-family:var(--font);font-weight:800;font-size:12px;color:#e6c8ff;text-align:center;margin-top:8px}

/* 🌈🕸️ Ring 2 "Paradox Resonance" shard dots + Critical Resonance pulse */
.asc-ico.shard-green{color:#37d98a;text-shadow:0 0 10px #37d98a}
.asc-ico.shard-red{color:#ff5c4d;text-shadow:0 0 10px #ff5c4d}
.asc-ico.shard-silver{color:#dfe6ee;text-shadow:0 0 10px #dfe6ee}
.ref-btn.crit-pulse{animation:critPulse 1s ease-in-out infinite;background:linear-gradient(180deg,#ffe27a,#ffb020);border-color:#ffe27a}
@keyframes critPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}

/* 🎴🕸️ Echo Shift — violet spectral overlay + badge, no new art needed */
.ac.ac-echo-shift{box-shadow:0 0 0 2px #b478ff,0 0 14px 2px rgba(180,120,255,.5)}
.ac.ac-echo-shift .ac-portrait{position:relative}
.ac.ac-echo-shift .ac-portrait::after{
  content:"⏳";position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;
  padding:4px;font-size:14px;background:linear-gradient(160deg,rgba(180,120,255,.28),rgba(20,8,32,.15));
  pointer-events:none;
}
.cd-echo-shift-box{border-top:1px dashed rgba(180,120,255,.3);padding-top:8px;margin-top:6px}

/* v0.0.10b — 🔧 Damaged Parts crisis banner */
.rx-dmg{margin:10px 0 6px;padding:12px 14px;border-radius:12px;
  border:1px dashed rgba(255,140,60,.4);background:linear-gradient(160deg,rgba(255,120,40,.07),rgba(0,0,0,.14))}
.rx-dmg.active{border-style:solid;border-color:rgba(255,70,50,.75);
  background:linear-gradient(160deg,rgba(255,70,50,.18),rgba(0,0,0,.18));
  box-shadow:0 0 20px -4px rgba(255,70,50,.55);animation:rxDmgPulse 1.6s ease-in-out infinite}
@keyframes rxDmgPulse{0%,100%{box-shadow:0 0 14px -4px rgba(255,70,50,.4)}50%{box-shadow:0 0 26px -2px rgba(255,70,50,.75)}}
.rx-dmg-h{font-family:var(--font);font-weight:800;font-size:13px;color:#ffb199}
.rx-dmg-note{font-size:11px;color:var(--muted);line-height:1.4;margin:4px 0 8px}
.rx-dmg.active .rx-dmg-note{color:#ffcfc4}

.exp-bonus{
  font-family:var(--font);font-weight:700;font-size:11px;color:var(--good);
  background:rgba(55,217,138,.12);border:1px solid rgba(55,217,138,.3);border-radius:8px;
  padding:3px 8px;margin:4px 0;display:inline-block}

.dg-presets{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 4px}
.dg-preset{
  flex:1 1 130px;min-width:120px;border:1px solid var(--line);border-radius:10px;padding:8px;
  background:var(--panel-2);display:flex;flex-direction:column;gap:6px}
.dg-preset.empty{border-style:dashed;opacity:.8}
.dg-preset-lbl{font-family:var(--font);font-size:15px;letter-spacing:1px;min-height:20px}
.dg-preset.empty .dg-preset-lbl{font-size:11px;letter-spacing:0;color:var(--muted)}
.dg-preset-acts{display:flex;gap:4px;flex-wrap:wrap}
.dg-mini.ghost{background:transparent;border-color:var(--line);color:var(--muted);padding:4px 7px}
.dg-mini.ghost:hover{color:var(--text);border-color:var(--accent3)}

.asc-item.syn-half{border-color:var(--accent2)}
.asc-item.syn-half .asc-buy{color:var(--accent2)}
.cd-synset{
  font-family:var(--font);font-size:11px;font-weight:700;color:var(--muted);
  border:1px solid var(--line);border-radius:8px;padding:4px 8px;margin:6px 0}
.cd-synset.on{color:var(--good);border-color:rgba(55,217,138,.4)}
.cd-synset.half{color:var(--accent2);border-color:rgba(255,92,157,.35)}

/* ============ v0.0.10b — 🌙 Nocny Klub (Night Club) ============ */
.nc-risk{margin:8px 0 4px}
.nc-crisis{margin:8px 0;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,70,50,.75);
  background:linear-gradient(160deg,rgba(255,70,50,.18),rgba(0,0,0,.18));
  box-shadow:0 0 20px -4px rgba(255,70,50,.55);animation:rxDmgPulse 1.6s ease-in-out infinite}
.nc-crisis-h{font-family:var(--font);font-weight:800;font-size:13px;color:#ffb199}
.nc-crisis-note{font-size:11px;color:#ffcfc4;line-height:1.4;margin:4px 0 8px}

.nc-door{min-height:120px;display:flex;align-items:center;justify-content:center;
  border:1px dashed rgba(255,95,174,.35);border-radius:12px;padding:16px;margin:8px 0}
.nc-guest{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;max-width:240px}
.nc-guest-ico{font-size:32px}
.nc-guest-lbl{font-family:var(--font);font-weight:800;font-size:13px}
.nc-guest.hunter .nc-guest-lbl{color:#ff5a4d}
.nc-guest-ico{position:relative}
.nc-guest-item{position:absolute;right:-16px;bottom:-4px;font-size:18px;filter:drop-shadow(0 0 3px rgba(0,0,0,.8))}
.nc-guest.vip .nc-guest-lbl{color:#ffd36a}
.nc-guest.vip{filter:drop-shadow(0 0 10px rgba(255,211,106,.45))}
.nc-guest.patron .nc-guest-lbl{color:#ff8ab8}
.nc-combo{font-family:var(--font);font-weight:800;font-size:13px;text-align:center;margin:4px 0;color:#ffb0d6}
.nc-combo.hot{color:#ff9b5c;text-shadow:0 0 10px rgba(255,120,60,.6)}
.nc-fb{font-weight:800;font-size:12px;text-align:center;margin-bottom:4px}
.nc-fb.good{color:#50e696}
.nc-fb.bad{color:#ff7a7a}
.nc-hh{text-align:center;font:800 12px var(--font);padding:6px;border-radius:10px;border:1px dashed var(--line);margin:6px 0;opacity:.8}
.nc-hh.on{opacity:1;border:1px solid #ffd36a;color:#ffd36a;background:linear-gradient(90deg,rgba(255,95,174,.18),rgba(255,211,106,.18));animation:ncHH 1s ease-in-out infinite alternate}
@keyframes ncHH{to{box-shadow:0 0 16px rgba(255,211,106,.55)}}
:root[data-reduced-fx] .nc-hh.on{animation:none}
.nc-renown{margin:6px 0}
.nc-guest-pay{font-family:var(--font);font-weight:800;font-size:12px;color:#ffb0d6;
  padding:2px 9px;border-radius:8px;background:rgba(255,95,174,.14);border:1px solid rgba(255,95,174,.35)}
.nc-guest.hunter .nc-guest-pay{color:#ffcaa0;background:rgba(255,138,92,.14);border-color:rgba(255,138,92,.35)}
.nc-guest-bar{width:100%;height:6px;border-radius:4px;background:rgba(255,255,255,.1);overflow:hidden}
.nc-guest-bar>i{display:block;height:100%;background:linear-gradient(90deg,#ff5fae,#a970ff)}
.nc-guest.hunter .nc-guest-bar>i{background:linear-gradient(90deg,#ff8a5c,#ff5a4d)}

.nc-floor-wrap{margin:8px 0}
.nc-floor-canvas{border-radius:12px;border:1px solid var(--line);cursor:pointer;display:block}

/* ============ reduced animations (Settings → 🔋) ============ */
:root[data-reduced-fx] *,
:root[data-reduced-fx] *::before,
:root[data-reduced-fx] *::after{
  animation-duration:.001s !important;animation-iteration-count:1 !important;
  transition-duration:.001s !important;scroll-behavior:auto !important}
:root[data-reduced-fx] .speedlines,
:root[data-reduced-fx] .pfx,
:root[data-reduced-fx] #fx-root,
:root[data-reduced-fx] .comic-art,
:root[data-reduced-fx] .cursor{display:none !important}
:root[data-reduced-fx] .shake{animation:none !important}
:root[data-reduced-fx] .ore-btn.berserk-max,
:root[data-reduced-fx] .dg-monster.telegraph{animation:none !important;box-shadow:none !important}

/* v0.0.8 — "Low render mode": strip the GPU-expensive decoration so weak phones
   stay smooth. Kills blur/backdrop filters, glow shadows, gradients-on-gradients,
   the reactor core pulse, the parallax ring, holo shine, etc. */
:root[data-reduced-fx] *{
  backdrop-filter:none !important;-webkit-backdrop-filter:none !important;
  filter:none !important;text-shadow:none !important;
  box-shadow:none !important;will-change:auto !important}
:root[data-reduced-fx] .ac-holo,
:root[data-reduced-fx] .rx-core,
:root[data-reduced-fx] .rx-oc-redbtn.armed,
:root[data-reduced-fx] .rs-cell.filled,
:root[data-reduced-fx] .pfx,
:root[data-reduced-fx] .float-num,
:root[data-reduced-fx] .banner-art,
:root[data-reduced-fx] .ac.r-UR,
:root[data-reduced-fx] .ac.r-LR,
:root[data-reduced-fx] .ac.r-MR,
:root[data-reduced-fx] .speedlines{animation:none !important}
/* v0.0.8 — kill the UR/LR/MR live foil in Low render mode */
:root[data-reduced-fx] .ac.r-UR::before,
:root[data-reduced-fx] .ac.r-LR::before,
:root[data-reduced-fx] .ac.r-MR::before,
:root[data-reduced-fx] .card-detail .cd-card::before{display:none !important}
/* 🗂️ Collection binder — 100+ pockets on screen at once; the shine layer is
   pure decoration, so drop it entirely on weak devices */
:root[data-reduced-fx] .binder-pocket::after{display:none !important}
:root[data-reduced-fx] .ac:hover,
:root[data-reduced-fx] .rx-node:hover,
:root[data-reduced-fx] .st-node:hover{transform:none !important}
:root[data-reduced-fx] .card-detail.tag-vampire::before,
:root[data-reduced-fx] .card-detail.tag-vampire::after,
:root[data-reduced-fx] .card-detail.pack-project_A::before,
:root[data-reduced-fx] .card-detail.pack-project_A::after,
:root[data-reduced-fx] .ac.pack-project_A::after,
:root[data-reduced-fx] .ac.pack-danmei_pack::after,
:root[data-reduced-fx] .ac.pack-paris::after,
:root[data-reduced-fx] .ac.pack-goddesses::after,
:root[data-reduced-fx] .ac.pack-goddesses.tag-goddess .ac-portrait::after,
:root[data-reduced-fx] .card-detail.pack-goddesses::after{display:none !important}
:root[data-reduced-fx] .card-detail.pack-goddesses.tag-goddess .cd-card{animation:none !important}
:root[data-reduced-fx] .rx-core{background:#123c28 !important;border-color:#3a7a52 !important}

/* ============ mobile layout (Settings → 📱) ============ */
/* v0.0.8 — 10 nav tabs won't fit one row on a phone: wrap to 2 rows of 5.
   This kicks in on ANY narrow viewport (not just the Settings toggle) so a
   phone user who never found the toggle still gets a usable nav. */
@media (max-width:600px){
  #nav{flex-wrap:wrap;gap:5px;margin:8px 0}
  #nav button{flex:1 1 calc(20% - 5px);min-width:0;font-size:10px;padding:7px 2px;min-height:46px;gap:1px;border-radius:10px}
  #nav button span{font-size:17px}
  #nav button:hover{transform:none}
  #app{padding:10px 8px 22px}
}
:root[data-mobile] #nav{flex-wrap:wrap;gap:5px;margin:8px 0}
:root[data-mobile] #nav button{flex:1 1 calc(20% - 5px);min-width:0;font-size:10px;padding:7px 2px;min-height:46px;gap:1px;border-radius:10px}
:root[data-mobile] #nav button span{font-size:17px}
:root[data-mobile] #nav button:hover{transform:none}
:root[data-mobile] .btn,
:root[data-mobile] .asc-buy,
:root[data-mobile] .dg-mini,
:root[data-mobile] .exp-pin-dot{min-height:40px}
:root[data-mobile] .card-grid{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}
:root[data-mobile] .exp-roster{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}
:root[data-mobile] #hud .hud-stat small{display:none}
:root[data-mobile] .exp-map{aspect-ratio:4/3}
:root[data-mobile] body{font-size:15px}

/* ============ v0.0.6 additions ============ */
/* 100× summon button */
.summon-btn.hundred{
  background:linear-gradient(180deg,rgba(55,217,138,.32),rgba(55,217,138,.10));
  border-color:var(--good);
}
.summon-btn.hundred small{color:#c6f4dd}
/* 1000× summon button */
.summon-btn.thousand{
  background:linear-gradient(180deg,rgba(255,61,110,.34),rgba(255,176,32,.14));
  border-color:var(--r-UR);
  box-shadow:0 8px 24px -10px rgba(255,61,110,.5);
}
.summon-btn.thousand small{color:#ffd0dc}

/* bulk-pull summary grid */
.summary-grid{margin-top:10px}
.summary-grid .ac{transform:scale(.94)}
.summary-new{outline:2px solid var(--good);outline-offset:2px;border-radius:12px}

/* roster search box (Dungeon + Expeditions) */
.roster-search{margin:6px 0 8px}
.roster-search-in{
  width:100%;box-sizing:border-box;padding:9px 12px;border-radius:10px;
  background:var(--panel2,rgba(255,255,255,.04));border:1px solid var(--line);
  color:var(--fg,#fff);font-family:var(--font);font-size:13px;
}
.roster-search-in:focus{outline:none;border-color:var(--accent)}
.dg-r-empty,.exp-roster .exp-left{grid-column:1/-1;text-align:center;color:var(--muted);font-size:12px;padding:8px}

/* Dungeon combat sim-speed toggle */
.dg-speed{
  padding:8px 12px;border-radius:10px;border:1px solid var(--line);
  background:rgba(255,255,255,.04);color:var(--fg,#fff);font-weight:700;font-size:12px;cursor:pointer;
}
.dg-speed:hover{border-color:var(--accent)}

/* Dungeon combat hit feedback */
.dg-combat{will-change:transform}
.dg-combat.dg-hit{animation:dgHit .16s ease-out}
.dg-combat.dg-crit{animation:dgCrit .28s ease-out}
.dg-combat.dg-kill{animation:dgKill .3s ease-out}
@keyframes dgHit{0%,100%{transform:none}35%{transform:translate(-4px,2px)}70%{transform:translate(3px,-1px)}}
@keyframes dgCrit{0%,100%{transform:none}20%{transform:translate(7px,-3px) rotate(.4deg)}45%{transform:translate(-6px,3px) rotate(-.4deg)}75%{transform:translate(3px,-2px)}}
@keyframes dgKill{0%{transform:none;filter:none}30%{transform:scale(1.015);filter:brightness(1.25)}100%{transform:none;filter:none}}
:root[data-reduced-fx] .dg-combat.dg-hit,
:root[data-reduced-fx] .dg-combat.dg-crit,
:root[data-reduced-fx] .dg-combat.dg-kill{animation:none !important}

/* Expedition hurry button */
.exp-hurry{font-weight:800}
.exp-hurry:disabled{opacity:.45;cursor:not-allowed}
.exp-card small{opacity:.85}

/* Menagerie: Genome + Coax */
.mg-genes{font-size:12px;color:var(--muted);text-align:center;margin:4px 0}
.mg-coax{
  background:linear-gradient(180deg,rgba(120,200,255,.30),rgba(120,200,255,.08)) !important;
  border-color:#78c8ff !important;
}
.mg-coax:disabled{opacity:.5;cursor:not-allowed}
.mg-anom{
  background:linear-gradient(180deg,rgba(190,120,255,.30),rgba(190,120,255,.08)) !important;
  border-color:#be78ff !important;
}
.mg-anom:disabled{opacity:.5;cursor:not-allowed}

.section-title.dim{opacity:.7;font-size:12px}

/* v0.0.6 — Menagerie folded into Expeditions, Calibration into Reactor */
.dg-subtabs.section-switch{margin-bottom:10px}
.dg-subtabs.section-switch button{font-weight:800}
.dg-subtabs.section-switch button.active{
  background:linear-gradient(180deg,rgba(139,92,255,.30),rgba(139,92,255,.08));
  border-color:var(--accent);
}

/* v0.0.6 — roster filter chips + sort (Dungeon + Expeditions) */
.roster-filter{margin:6px 0 8px}
.roster-filter .roster-search{margin:0 0 6px;display:flex;gap:6px}
.roster-sort{
  flex:0 0 auto;padding:9px 12px;border-radius:10px;border:1px solid var(--line);
  background:rgba(255,255,255,.04);color:var(--fg,#fff);font-weight:700;font-size:12px;cursor:pointer;white-space:nowrap;
}
.roster-sort:hover{border-color:var(--accent)}
.roster-chips{display:flex;flex-wrap:wrap;gap:6px}
.roster-chip{
  padding:5px 10px;border-radius:999px;border:1px solid var(--line);
  background:rgba(255,255,255,.03);color:var(--muted);font-weight:800;font-size:11px;cursor:pointer;
  transition:transform .08s,border-color .12s,color .12s,background .12s;
}
.roster-chip:hover{transform:translateY(-1px)}
.roster-chip.on{color:#fff;background:rgba(139,92,255,.22);border-color:var(--accent)}
.roster-chip.r-R.on{border-color:var(--r-R,#8b98bf);background:rgba(139,152,191,.20)}
.roster-chip.r-SR.on{border-color:var(--r-SR,#9a6bff);background:rgba(154,107,255,.20)}
.roster-chip.r-SSR.on{border-color:var(--r-SSR,#ffb020);background:rgba(255,176,32,.18)}
.roster-chip.r-UR.on{border-color:var(--r-UR,#ff3d6e);background:rgba(255,61,110,.18)}
.roster-chip.clear{color:var(--accent2,#ff5c9d)}

/* v0.0.6 — ULTRA Ascension (Pray to Homura) */
.homura-box{
  border:1px solid rgba(180,120,255,.35);
  background:linear-gradient(180deg,rgba(90,40,140,.18),rgba(20,8,32,.35));
}
.homura-box .madoka-grace{color:#e6c8ff}
.asc-item.homura{border-left:3px solid #b478ff}
.asc-item.homura.owned{border-left-color:var(--good)}
.asc-item.homura.affordable{box-shadow:0 0 0 1px rgba(180,120,255,.4) inset}

/* ============ 🕸️ Loop Council (Etap 2) ============ */
.lc-balance{
  font-family:var(--font);font-weight:800;font-size:13px;text-align:center;
  color:#e6c8ff;margin:6px 0 14px;
}
.lc-goal{
  max-width:460px;margin:0 auto 18px;padding:14px 16px;border-radius:14px;
  border:1px solid rgba(180,120,255,.3);background:linear-gradient(160deg,rgba(90,40,140,.14),rgba(20,8,32,.3));
}
.lc-goal-head{font-family:var(--font);font-weight:800;font-size:13px;color:#e6c8ff;margin-bottom:8px;text-align:center}
.lc-goalbar{height:10px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08)}
.lc-goalfill{height:100%;border-radius:999px;background:linear-gradient(90deg,#b478ff,#e6c8ff);transition:width .4s ease}
.lc-goal-num{font-family:var(--font);font-weight:700;font-size:11px;color:var(--muted);margin-top:7px;text-align:center}
.lc-alt-bonus{font-size:11px;color:#c9a3ff;margin-top:2px}
.lc-anchor-list{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0}
.lc-anchor{
  min-width:140px;flex:1 1 140px;padding:10px 12px;border-radius:12px;
  border:1px dashed rgba(180,120,255,.35);background:rgba(255,255,255,.03);text-align:center;
}
.lc-anchor.on{border-style:solid;box-shadow:0 0 0 1px rgba(180,120,255,.4) inset}
.lc-anchor-h{font-family:var(--font);font-weight:700;font-size:11px;color:var(--muted);margin-bottom:6px}
.lc-anchor-select{width:100%;font-family:var(--font);font-size:12px;padding:6px 8px;border-radius:8px;
  background:rgba(0,0,0,.25);color:var(--text);border:1px solid rgba(180,120,255,.3)}

/* ============ v0.0.7 — themed card CSS ============ */

/* -------- 🩸 VAMPIRE cards — Dracula / VtM bloodwork -------- */
/* applies in the grid, the summon reveal, and the detail overlay's mini card */
.ac.ac-vampire{
  --rar:#a41220;
  border-color:#5c0b13;
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(150,10,30,.30), transparent 60%),
    linear-gradient(180deg,#1c0508,#120306);
  box-shadow:0 0 24px -6px rgba(150,10,30,.55), 0 10px 26px -14px #000;
}
.ac.ac-vampire .ac-top{
  background:linear-gradient(90deg,#7a0b16,#2a0308 70%,transparent);
}
.ac.ac-vampire .ac-rar{
  font-family:Georgia,"Times New Roman",serif;font-weight:700;letter-spacing:2px;
  color:#e9c6a0;text-shadow:0 1px 2px #000;
}
.ac.ac-vampire .ac-stars{color:#ffdca0;text-shadow:0 0 8px #a41220}
.ac.ac-vampire .ac-name{
  font-family:Georgia,"Times New Roman",serif;font-weight:700;letter-spacing:.4px;
  color:#eccfa8;text-shadow:0 0 10px rgba(164,18,32,.7),0 1px 0 #000;
}
.ac.ac-vampire .ac-eff{color:#e6a9a9}
.ac.ac-vampire .ac-flavor{color:#b07a7a;font-family:Georgia,"Times New Roman",serif}
.ac.ac-vampire .ac-count{border-color:#a41220;color:#eccfa8}
.ac.ac-vampire .ac-holo{
  display:block;animation:shine 3.4s ease-in-out infinite;
  background:linear-gradient(115deg,transparent 30%,rgba(255,60,80,.28) 48%,rgba(255,210,170,.18) 52%,transparent 70%);
}
/* blood pooling along the bottom edge */
.ac.ac-vampire::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:16px;pointer-events:none;
  background:
    radial-gradient(8px 12px at 22% -2px,#7a0b16 60%,transparent 62%),
    radial-gradient(6px 9px at 46% -3px,#7a0b16 60%,transparent 62%),
    radial-gradient(10px 14px at 72% -1px,#7a0b16 60%,transparent 62%),
    linear-gradient(180deg,transparent,rgba(122,11,22,.5));
}
.ac.ac-vampire.locked::after{display:none}

/* ===== v0.0.8 — per-pack GRID-card skins (so packs stand out like the Night pack does) ===== */
/* 🏵️ Danmei — flowering silk */
.ac.pack-danmei_pack{--rar:#d98cae;border-color:#7a3d5c;
  background:radial-gradient(120% 60% at 50% 0%,rgba(217,140,174,.28),transparent 62%),linear-gradient(180deg,#241019,#160810)}
.ac.pack-danmei_pack .ac-top{background:linear-gradient(90deg,#a44f78,#3a1b2b 70%,transparent)}
.ac.pack-danmei_pack .ac-name{font-family:Georgia,"Times New Roman",serif;color:#ffd9ea;text-shadow:0 0 8px rgba(217,140,174,.6)}
.ac.pack-danmei_pack .ac-eff{color:#e9b8cd}.ac.pack-danmei_pack .ac-flavor{color:#c58fa6;font-family:Georgia,serif}
.ac.pack-danmei_pack::after{content:"❀ ❁ ❀";position:absolute;left:0;right:0;bottom:2px;text-align:center;font-size:10px;
  color:rgba(255,200,224,.5);pointer-events:none;letter-spacing:6px}

/* 🗼 Paryżowanie — dusk over the Seine, the tower on the skyline */
.ac.pack-paris{--rar:#c9a24a;border-color:#b98f45;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 160'%3E%3Cpath fill='%23f0d79a' fill-opacity='0.16' d='M40 2 L42 4 L43 40 L49 55 L43 52 L44 52 L45 95 L56 112 L46 106 L47 106 L48 150 L74 160 L52 160 L48 124 L40 116 L32 124 L28 160 L6 160 L32 150 L33 106 L34 106 L24 112 L35 95 L36 52 L37 52 L31 55 L37 40 L38 4 Z'/%3E%3C/svg%3E") right 4px bottom -2px / auto 74% no-repeat,
    radial-gradient(120% 70% at 50% 0%,rgba(120,150,225,.18),transparent 60%),
    linear-gradient(180deg,#15122f,#1c1a3a 55%,#2a2350);
  box-shadow:inset 0 0 0 1px rgba(230,207,146,.28)}
.ac.pack-paris .ac-top{background:linear-gradient(90deg,#6b5aa6,#2a2140 70%,transparent)}
.ac.pack-paris .ac-name{font-family:Georgia,"Times New Roman",serif;letter-spacing:.5px;color:#f6ecd2;text-shadow:0 1px 0 #000}
.ac.pack-paris .ac-eff{color:#dcc99a}.ac.pack-paris .ac-flavor{color:#c3b4de;font-family:Georgia,serif;font-style:italic}
.ac.pack-paris .ac-count{border-color:#b98f45;color:#f6ecd2}
.ac.pack-paris::after{content:"⚜";position:absolute;right:7px;top:4px;font-size:11px;color:rgba(230,207,146,.55);pointer-events:none}

/* 💞 Useless Goddesses — sky-blue from afar; up close an adventurer's-guild card:
   gold filigree, clouds, a tiny halo-and-wings crest (a fantasy parody, KonoSuba-style) */
.ac.pack-goddesses{--rar:#7cc8ff;border-color:#d9b35a;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40'%3E%3Cellipse cx='30' cy='9' rx='11' ry='4' fill='none' stroke='%23ffe39a' stroke-opacity='.55' stroke-width='2'/%3E%3Cpath d='M28 22 C18 10 6 14 2 22 C10 20 16 24 20 30 C22 26 26 24 28 22Z M32 22 C42 10 54 14 58 22 C50 20 44 24 40 30 C38 26 34 24 32 22Z' fill='%23ffffff' fill-opacity='.22'/%3E%3C/svg%3E") right 6px top 30px / 46px auto no-repeat,
    radial-gradient(40% 18% at 22% 78%,rgba(255,255,255,.22),transparent 70%),
    radial-gradient(35% 14% at 76% 62%,rgba(255,255,255,.16),transparent 70%),
    radial-gradient(120% 60% at 50% 0%,rgba(255,244,200,.28),transparent 55%),
    linear-gradient(180deg,#63b9ff 0%,#3a8fe0 45%,#1f5fb8 100%);
  box-shadow:inset 0 0 0 2px rgba(255,226,140,.55),inset 0 0 0 4px rgba(40,90,170,.55)}
.ac.pack-goddesses .ac-top{background:linear-gradient(90deg,#f6d67c,#d3a64a 55%,transparent);color:#3a2600}
.ac.pack-goddesses .ac-name{font-family:Georgia,"Times New Roman",serif;color:#fffaf0;letter-spacing:.3px;
  text-shadow:0 1px 0 #17427f,0 0 10px rgba(255,226,140,.65)}
.ac.pack-goddesses .ac-eff{color:#eaf7ff}
.ac.pack-goddesses .ac-flavor{color:#fff1c2;font-family:Georgia,serif;font-style:italic}
.ac.pack-goddesses .ac-count{border-color:#d9b35a;color:#fff6d8}
.ac.pack-goddesses::after{content:"✧ ✦ ✧";position:absolute;left:0;right:0;bottom:2px;text-align:center;font-size:10px;
  letter-spacing:5px;color:rgba(255,232,160,.75);pointer-events:none}
.ac.pack-goddesses.tag-goddess{box-shadow:inset 0 0 0 2px rgba(255,226,140,.8),inset 0 0 0 4px rgba(40,90,170,.55),0 0 14px rgba(140,210,255,.55)}

/* 🌲 Drzewogród — carved wood / quest board */
.ac.pack-ddland{--rar:#9a6b1e;border-color:#6b4a28;
  background:repeating-linear-gradient(180deg,#3a2a17,#3a2a17 6px,#33260f 6px,#33260f 12px)}
.ac.pack-ddland .ac-top{background:linear-gradient(90deg,#6b4a28,#2c1e0e 70%,transparent)}
.ac.pack-ddland .ac-name{font-family:Georgia,"Times New Roman",serif;color:#f2e4c8;text-shadow:0 2px 0 #1c1108}
.ac.pack-ddland .ac-eff{color:#d8c09a}.ac.pack-ddland .ac-flavor{color:#c7ac86;font-family:Georgia,serif}
.ac.pack-ddland .ac-count{border-color:#6b4a28;color:#f2e4c8}

/* 🖥️ Project A — green terminal */
.ac.pack-project_A{--rar:#2f7a3f;border-color:#2f7a3f;
  background:linear-gradient(180deg,#03110a,#061c0f)}
.ac.pack-project_A .ac-top{background:linear-gradient(90deg,#0f5a2a,#04140a 70%,transparent)}
.ac.pack-project_A .ac-rar,.ac.pack-project_A .ac-name{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace}
.ac.pack-project_A .ac-name{color:#b6ffc7;text-shadow:0 0 8px rgba(0,255,90,.5)}
.ac.pack-project_A .ac-eff{color:#8affab}.ac.pack-project_A .ac-flavor{color:#5fbf77;font-family:Consolas,monospace}
.ac.pack-project_A::after{content:"> _";position:absolute;left:8px;bottom:5px;font-family:Consolas,monospace;font-size:10px;
  color:rgba(140,255,171,.55);pointer-events:none;animation:blink 1.1s step-end infinite}
@keyframes blink{50%{opacity:0}}

/* -------- 🌲 DRZEWOGRÓD — a carved-wood D&D quest board -------- */
.card-detail.pack-ddland{
  padding-top:42px;border-radius:8px;
  border:10px ridge #5a3d22;
  background:
    radial-gradient(60% 40% at 18% 22%, rgba(120,86,44,.18), transparent 60%),
    radial-gradient(50% 45% at 82% 78%, rgba(90,60,28,.20), transparent 60%),
    repeating-linear-gradient(93deg, rgba(120,92,52,.10) 0 2px, transparent 2px 6px),
    linear-gradient(160deg,#ded0a8,#cdbb8e 55%,#c3ac7c);
  box-shadow:0 30px 80px -20px #000, 0 0 0 4px #2a1a0c, inset 0 0 60px rgba(74,48,20,.45);
  color:#3a2a17;
}
.card-detail.pack-ddland::before{
  content:"⚔   ❧   a Drzewogrodowy Dogland encounter   ❧   ⚔";
  position:absolute;top:12px;left:0;right:0;text-align:center;
  font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:#6b4a28;opacity:.9;
}
.card-detail.pack-ddland::after{
  content:"✦   ❧   ✦";
  position:absolute;left:0;right:0;bottom:9px;text-align:center;
  font-size:12px;letter-spacing:.3em;color:#7a5a34;opacity:.75;pointer-events:none;
}
.card-detail.pack-ddland .cd-name{
  font-family:Georgia,"Times New Roman",serif;font-weight:700;
  color:#2e1e0e;text-shadow:0 1px 0 #f0e2c0;
}
.card-detail.pack-ddland .cd-rarity,
.card-detail.pack-ddland .cd-sub{color:#6b4a28}
.card-detail.pack-ddland .cd-eff-line{color:#3a2a17}
.card-detail.pack-ddland .cd-eff-line.dim,
.card-detail.pack-ddland .cd-next{color:#6f5638}
.card-detail.pack-ddland .cd-flavor{color:#5b4326;font-family:Georgia,"Times New Roman",serif}
.card-detail.pack-ddland .cd-stars{color:#9a6b1e;text-shadow:none}
.card-detail.pack-ddland .cd-locked{color:#7a4a12}
.card-detail.pack-ddland .cd-synset{border-color:rgba(107,74,40,.45);color:#5b4326}
.card-detail.pack-ddland .cd-close{
  background:radial-gradient(circle at 35% 30%,#a3242b,#6b0f14);border-color:#3a0a0c;color:#f0d9b5;
  box-shadow:0 2px 6px rgba(0,0,0,.5);
}
.card-detail.pack-ddland .cd-attune{
  background:linear-gradient(160deg,rgba(107,74,40,.22),rgba(0,0,0,.10));border-color:#6b4a28;
}
.card-detail.pack-ddland .cd-att-btn{
  background:linear-gradient(180deg,rgba(107,74,40,.4),rgba(107,74,40,.12));border-color:#6b4a28;color:#2e1e0e;
}

/* -------- 💞 USELESS GODDESSES — an Adventurers' Guild registry card --------
   Sky-blue parchment with gold filigree; the lore side turns into a guild
   request slip. Goddesses (tag-goddess) get a slowly turning halo + divine
   registry header, their mortals (tag-romance) a party-member header. */
.card-detail.pack-goddesses{
  --rar:#7cc8ff;
  padding-top:40px;padding-bottom:30px;border-radius:14px;
  border:3px solid #d9b35a;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40'%3E%3Cellipse cx='30' cy='9' rx='11' ry='4' fill='none' stroke='%23ffe39a' stroke-opacity='.6' stroke-width='2'/%3E%3Cpath d='M28 22 C18 10 6 14 2 22 C10 20 16 24 20 30 C22 26 26 24 28 22Z M32 22 C42 10 54 14 58 22 C50 20 44 24 40 30 C38 26 34 24 32 22Z' fill='%23ffffff' fill-opacity='.22'/%3E%3C/svg%3E") right 22px bottom 30px / 92px auto no-repeat,
    radial-gradient(34% 9% at 16% 84%,rgba(255,255,255,.22),transparent 70%),
    radial-gradient(28% 8% at 82% 72%,rgba(255,255,255,.16),transparent 70%),
    radial-gradient(40% 8% at 58% 94%,rgba(255,255,255,.14),transparent 70%),
    radial-gradient(120% 50% at 50% 0%,rgba(255,244,200,.32),transparent 55%),
    linear-gradient(180deg,#5db4ff 0%,#3a8fe0 40%,#1d57ad 100%);
  box-shadow:0 30px 80px -20px #000,0 0 0 4px #17427f,inset 0 0 0 3px rgba(40,90,170,.6),
             inset 0 0 0 7px rgba(255,226,140,.45),0 0 34px rgba(140,210,255,.45);
  color:#f4faff;
}
.card-detail.pack-goddesses::before{
  content:"✧   ADVENTURERS' GUILD   ·   USELESS GODDESSES   ✧";
  position:absolute;top:12px;left:0;right:0;text-align:center;
  font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:10px;letter-spacing:.16em;
  color:#fff1c2;text-shadow:0 1px 0 #17427f,0 0 8px rgba(255,226,140,.5);
}
.card-detail.pack-goddesses.tag-goddess::before{content:"✧   ADVENTURERS' GUILD   ·   DIVINE REGISTRY   ✧"}
.card-detail.pack-goddesses.tag-romance::before{content:"♡   ADVENTURERS' GUILD   ·   PARTY MEMBER   ♡";color:#ffd9ec}
.card-detail.pack-goddesses::after{
  content:"❦   ✦   ❦";
  position:absolute;left:0;right:0;bottom:9px;text-align:center;
  font-size:12px;letter-spacing:.3em;color:#ffe39a;opacity:.8;pointer-events:none;
}
.card-detail.pack-goddesses .cd-card{box-shadow:0 0 0 2px #d9b35a,0 0 0 5px #17427f,0 10px 30px -8px #000}
.card-detail.pack-goddesses.tag-goddess .cd-card{animation:gdHalo 4s ease-in-out infinite}
@keyframes gdHalo{
  0%,100%{box-shadow:0 0 0 2px #d9b35a,0 0 0 5px #17427f,0 0 18px 2px rgba(255,236,160,.45)}
  50%{box-shadow:0 0 0 2px #ffe9a8,0 0 0 5px #17427f,0 0 34px 8px rgba(255,236,160,.75)}
}
.card-detail.pack-goddesses .cd-name{
  font-family:Georgia,"Times New Roman",serif;font-weight:700;letter-spacing:.4px;
  color:#fffaf0;text-shadow:0 2px 0 #17427f,0 0 14px rgba(255,226,140,.7);
}
.card-detail.pack-goddesses .cd-rarity,
.card-detail.pack-goddesses .cd-sub{color:#ffe7a6;text-shadow:0 1px 0 #17427f}
.card-detail.pack-goddesses .cd-eff-line{color:#eaf7ff}
.card-detail.pack-goddesses .cd-eff-line.dim,
.card-detail.pack-goddesses .cd-next{color:#bcdcff}
.card-detail.pack-goddesses .cd-flavor{color:#fff1c2;font-family:Georgia,"Times New Roman",serif}
.card-detail.pack-goddesses .cd-stars{color:#ffe39a;text-shadow:0 0 10px rgba(255,226,140,.9)}
.card-detail.pack-goddesses .cd-locked{color:#ffe39a}
.card-detail.pack-goddesses .cd-synset{border-color:rgba(255,226,140,.45);color:#fff1c2}
.card-detail.pack-goddesses .cd-close,
.card-detail.pack-goddesses .cd-lore-btn{
  background:radial-gradient(circle at 35% 30%,#4f9ff0,#17427f);border-color:#d9b35a;color:#fff6d8;
  box-shadow:0 2px 6px rgba(0,0,0,.45);
}
.card-detail.pack-goddesses.showing-lore .cd-lore-btn{background:radial-gradient(circle at 35% 30%,#ffe39a,#d3a64a);color:#3a2600}
.card-detail.pack-goddesses .cd-attune{
  background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(23,66,127,.35));border-color:rgba(255,226,140,.55);
}
.card-detail.pack-goddesses .cd-att-btn{
  background:linear-gradient(180deg,#f6d67c,#d3a64a);border-color:#fff1c2;color:#3a2600;
}
/* 📜 the lore side = a guild request slip pinned to the board */
.card-detail.pack-goddesses .cd-lore{
  background:linear-gradient(170deg,#fbf3dc,#efe1b8);color:#3a2a17;
  border:1px solid #c9a95c;border-radius:6px;padding:14px 16px 16px;
  box-shadow:inset 0 0 22px rgba(160,120,40,.25),0 6px 18px -6px #000;transform:rotate(-.6deg);
}
.card-detail.pack-goddesses .cd-lore .cd-sub,
.card-detail.pack-goddesses .cd-lore .cd-name{color:#3a2a17;text-shadow:none}
.card-detail.pack-goddesses .cd-lore .cd-flavor,
.card-detail.pack-goddesses .cd-lore .cd-eff-line{color:#4a3a22}
.card-detail.pack-goddesses .cd-lore .cd-lore-row{color:#3a2a17}
.card-detail.pack-goddesses .cd-lore .cd-lore-desc{color:#5b4326;font-family:Georgia,"Times New Roman",serif}

/* the small collection card: goddesses glow, mortals carry a heart */
.ac.pack-goddesses.tag-goddess .ac-portrait::after{
  content:"";position:absolute;left:50%;top:10px;width:54px;height:14px;margin-left:-27px;border-radius:50%;
  border:2px solid rgba(255,227,154,.85);box-shadow:0 0 10px rgba(255,227,154,.8);pointer-events:none;z-index:2;
}
.ac.pack-goddesses.tag-romance .ac-top::after{content:"♡";margin-left:auto;padding-left:6px;color:#ffd9ec;font-weight:800}

/* -------- 🩸 VAMPIRE detail overlay (after pack-ddland so a card that is both
   a Drzewogród card AND a vampire gets the bloodwork skin) -------- */
.card-detail.tag-vampire{
  --rar:#a41220;
  padding-top:38px;border-radius:6px;
  border:2px solid #6e0f1a;
  background:
    repeating-linear-gradient(58deg, rgba(255,255,255,.015) 0 2px, transparent 2px 9px),
    radial-gradient(130% 80% at 50% 0%, rgba(150,10,30,.28), transparent 62%),
    linear-gradient(180deg,#1a0508,#2a0a10 55%,#160406);
  box-shadow:0 30px 80px -20px #000, 0 0 0 6px #120406, inset 0 0 70px rgba(120,0,20,.4);
  color:#e9cbb0;
}
.card-detail.tag-vampire::before{
  content:"⚜   †   V A M P I R E   †   ⚜";
  position:absolute;top:10px;left:0;right:0;text-align:center;
  font-family:Georgia,"Times New Roman",serif;font-weight:700;font-size:11px;letter-spacing:.34em;
  color:#c9a24a;text-shadow:0 1px 2px #000;
}
.card-detail.tag-vampire::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:6px;
  background:
    radial-gradient(14px 20px at 12% 100%,rgba(122,11,22,.65) 55%,transparent 58%),
    radial-gradient(10px 15px at 30% 100%,rgba(122,11,22,.5) 55%,transparent 58%),
    radial-gradient(120% 60% at 50% 100%, rgba(90,0,15,.4), transparent 60%);
}
.card-detail.tag-vampire .cd-name{
  font-family:Georgia,"Times New Roman",serif;font-weight:700;letter-spacing:.6px;
  color:#f1d9bd;text-shadow:0 0 12px rgba(164,18,32,.8),0 1px 0 #000;
}
.card-detail.tag-vampire .cd-rarity{color:#c9a24a}
.card-detail.tag-vampire .cd-sub{color:#b06a4a}
.card-detail.tag-vampire .cd-eff-line{color:#ecc0c0}
.card-detail.tag-vampire .cd-eff-line.dim,
.card-detail.tag-vampire .cd-next{color:#a98a8a}
.card-detail.tag-vampire .cd-flavor{color:#c99;font-family:Georgia,"Times New Roman",serif}
.card-detail.tag-vampire .cd-stars{color:#ffdca0;text-shadow:0 0 10px #a41220}
.card-detail.tag-vampire .cd-close{
  background:radial-gradient(circle at 35% 30%,#b3242b,#5c0b13);border-color:#3a0a0c;color:#f1d9bd;
}
.card-detail.tag-vampire .cd-synset{border-color:rgba(164,18,32,.4);color:#c99}
.card-detail.tag-vampire .cd-attune{
  background:linear-gradient(160deg,rgba(164,18,32,.16),rgba(0,0,0,.28));border-color:#5c0b13;
}
.card-detail.tag-vampire .cd-att-btn{
  background:linear-gradient(180deg,rgba(164,18,32,.4),rgba(164,18,32,.1));border-color:#8e1520;
}

/* ============ v0.0.8 — Research MEGA Projects ============ */
.rs-mega-list{display:flex;flex-direction:column;gap:10px;margin:6px 0 4px}
.rs-mega{
  display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;
  padding:12px 14px;border-radius:14px;border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(51,214,255,.06),rgba(0,0,0,.18));
}
.rs-mega.active{border-color:var(--accent3);box-shadow:0 0 0 1px var(--accent3) inset,0 0 22px -8px var(--accent3)}
.rs-mega.done{border-color:var(--good);opacity:.9;background:linear-gradient(160deg,rgba(55,217,138,.10),rgba(0,0,0,.14))}
.rs-mega-ico{font-size:26px;width:34px;text-align:center}
.rs-mega.done .rs-mega-ico{color:var(--good)}
.rs-mega-body{min-width:0}
.rs-mega-name{font-family:var(--font);font-weight:800;font-size:13px;color:var(--text)}
.rs-mega-desc{font-size:11.5px;color:var(--muted);line-height:1.4;margin:2px 0 6px}
.rs-mega-bar{height:8px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.09)}
.rs-mega-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#33d6ff,#8b5cff);transition:width .35s ease}
.rs-mega.done .rs-mega-fill{background:linear-gradient(90deg,#37d98a,#8ef5d0)}
.rs-mega-lbl{font-family:var(--font);font-weight:700;font-size:10px;color:var(--accent3);margin-top:4px;letter-spacing:.02em}
.rs-mega.done .rs-mega-lbl{color:var(--good)}
.rs-mega .asc-buy{white-space:nowrap}
.rs-mega.leveled{border-color:rgba(55,217,138,.55)}
/* ⚡ perf pass — long lists skip layout/paint for rows that are off screen
   (content-visibility = a CSS-level virtual list; intrinsic size keeps the scrollbar honest) */
.asc-list > .asc-item, .rs-mega-list > .rs-mega, .changelog > .cl-rel, .shop-list > * {
  content-visibility:auto; contain-intrinsic-size:auto 90px;
}
.rs-mega-cat{font-family:var(--font);font-weight:800;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--muted);margin:8px 2px -2px;padding-bottom:4px;border-bottom:1px solid var(--line)}
.rs-mega-cat:first-child{margin-top:0}
.rs-head-row{display:flex;align-items:flex-start;gap:8px}
.rs-head-row .rates-note{flex:1;min-width:0}
.rs-info{flex:none;display:inline-grid;place-items:center;width:20px;height:20px;margin-top:2px;border-radius:50%;
  border:1px solid var(--accent3);color:var(--accent3);font:italic 800 12px/1 Georgia,serif;cursor:help;user-select:none}
.rs-info:hover{background:var(--accent3);color:#000}
.rs-mega-fx{font-size:11px;color:var(--text);opacity:.85;line-height:1.35;margin:-2px 0 6px}
.rates-note.dim{opacity:.6}
.rates-note.warn{color:var(--bad)}

/* Expeditions — Waystations "bank half" button */
.exp-half{font-weight:800;border-color:var(--accent3)!important;color:#bfe9ff!important}

/* ============ v0.0.8 — UR slow-reveal suspense ============ */
.reveal-row.ur-hush .reveal-card:not(.ur-suspense){filter:brightness(.35) saturate(.6);transition:filter .4s}
.reveal-card.ur-suspense{z-index:5;animation:urSuspense 1.7s ease-in-out both}
.reveal-card.ur-suspense::after{
  content:"";position:absolute;inset:-40px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(255,61,110,.35),transparent 70%);
  animation:urPulse 1.7s ease-in-out both;
}
@keyframes urSuspense{
  0%{filter:brightness(.5);transform:scale(1)}
  35%{filter:brightness(.75) drop-shadow(0 0 16px var(--r-UR));transform:scale(1.05) rotate(-1.5deg)}
  50%{transform:scale(1.03) rotate(1.5deg)}
  65%{transform:scale(1.07) rotate(-1.5deg)}
  80%{transform:scale(1.04) rotate(1deg)}
  100%{filter:brightness(1.25) drop-shadow(0 0 44px var(--r-UR));transform:scale(1.1)}
}
@keyframes urPulse{
  0%,100%{opacity:.15;transform:scale(.6)}
  60%{opacity:.5;transform:scale(1.1)}
}
:root[data-reduced-fx] .reveal-card.ur-suspense{animation:none!important}
:root[data-reduced-fx] .reveal-card.ur-suspense::after{display:none}
:root[data-reduced-fx] .reveal-row.ur-hush .reveal-card:not(.ur-suspense){filter:none}

/* ============ v0.0.8 — Dungeon "Train card" upgrade popup ============ */
.dg-up{text-align:left;display:flex;flex-direction:column;gap:12px}
.dg-up-title{font-family:var(--font);font-weight:800;font-size:16px;text-align:center;color:var(--text)}
.dg-up-sec,.dg-up-trait{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:rgba(255,255,255,.03)}
.dg-up-sec.awk{background:linear-gradient(160deg,rgba(255,180,32,.08),rgba(0,0,0,.14));border-color:rgba(255,200,90,.3)}
.dg-up-trait.on{background:linear-gradient(160deg,rgba(139,92,255,.14),rgba(0,0,0,.14));border-color:var(--accent)}
.dg-up-h{font-family:var(--font);font-weight:800;font-size:13px;color:var(--text);margin-bottom:4px}
.dg-up-note{font-size:11.5px;color:var(--muted);line-height:1.45}
.dg-up-max{font-family:var(--font);font-weight:800;font-size:12px;color:var(--good);margin-top:6px}
.dg-up-prev{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.dg-up-opt{flex:1 1 120px;min-width:120px;border:1px solid var(--line);border-radius:10px;padding:8px;background:rgba(0,0,0,.18);display:flex;flex-direction:column;gap:3px}
.dg-up-optn{font-family:var(--font);font-weight:800;font-size:12px;color:var(--accent3)}
.dg-up-stat{display:flex;align-items:baseline;gap:4px;font-size:11.5px;white-space:nowrap}
.dg-up-slbl{font-family:var(--font);font-weight:700;color:var(--muted);min-width:34px}
.dg-up-from{color:var(--muted)}
.dg-up-to{font-weight:800;color:var(--text)}
.dg-up-to.up{color:var(--good)}
.dg-up-opt .asc-buy{margin-top:4px;width:100%;font-size:11px}

/* ============ v0.0.8 — Reactor locked teaser ============ */
#nav button.locked-tab{opacity:.55;filter:grayscale(.6)}
#nav button.locked-tab::after{content:"🔒";position:absolute;top:3px;right:5px;font-size:9px}
#nav button{position:relative}
.rx-locked{
  max-width:420px;margin:24px auto;text-align:center;padding:26px 22px;border-radius:18px;
  border:1px dashed var(--line);background:linear-gradient(160deg,rgba(255,180,32,.06),rgba(0,0,0,.2));
}
.rx-locked-ico{font-size:40px;filter:grayscale(.3);margin-bottom:10px}
.rx-locked-h{font-family:var(--font);font-weight:900;font-size:16px;letter-spacing:.08em;color:var(--gold)}
.rx-locked-sub{font-size:12.5px;color:var(--muted);line-height:1.6;margin:8px 0 14px}
.rx-locked-bar{height:10px;border-radius:999px;overflow:hidden;background:rgba(255,255,255,.08)}
.rx-locked-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent3),var(--gold));transition:width .4s ease}
.rx-locked-num{font-family:var(--font);font-weight:700;font-size:11px;color:var(--muted);margin-top:7px}

/* ============ v0.0.8 — popup polish + mobile scaling ============ */
.modal{scrollbar-width:thin}
.modal h3{line-height:1.25}
.modal .btn-row{flex-wrap:wrap;gap:8px}
.modal img,.modal canvas,.modal svg{max-width:100%;height:auto}
.modal .card-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.summary-pull{max-width:100%}
@media(max-width:520px){
  .modal{padding:16px 13px;border-radius:14px}
  .modal h3{font-size:17px}
  .modal .card-grid{grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:7px}
  .modal .big{font-size:20px}
  .dg-up-opt{flex:1 1 100%;min-width:0}
  .dg-up-prev{gap:6px}
  .dg-up-stat{font-size:11px;white-space:normal}
}
@media(max-width:380px){
  .modal-ov,.card-detail-ov{padding:10px}
  .modal .btn-row button{flex:1 1 100%}
}

/* v0.0.8 — SUPER trait (max Awaken) */
.dg-up-trait.super{
  border-color:var(--gold);
  background:linear-gradient(160deg,rgba(255,180,32,.16),rgba(139,92,255,.10));
  box-shadow:0 0 18px -6px rgba(255,180,32,.5);
}
.dg-up-trait.super .dg-up-h{color:var(--gold)}

/* v0.0.8 — Pachinko ball-type selector */
.pk-balls{display:flex;gap:6px;flex-wrap:wrap}
.pk-ball{
  flex:1 1 auto;padding:7px 10px;border-radius:10px;font-family:var(--font);font-weight:800;font-size:11px;cursor:pointer;
  color:var(--muted);background:rgba(255,255,255,.05);border:1px solid var(--line);transition:filter .15s,transform .1s;white-space:nowrap;
}
.pk-ball:hover:not(:disabled){filter:brightness(1.15)}
.pk-ball:active:not(:disabled){transform:scale(.97)}
.pk-ball:disabled{opacity:.4;cursor:not-allowed}
.pk-ball.on.pk-ball-normal{color:#ffe9bd;border-color:#ffe08a;background:linear-gradient(160deg,rgba(255,212,94,.16),rgba(0,0,0,.12))}
.pk-ball.on.pk-ball-bouncy{color:#9dffc7;border-color:#4dff9a;background:linear-gradient(160deg,rgba(77,255,154,.16),rgba(0,0,0,.12))}
.pk-ball.on.pk-ball-gold{color:#ffe07a;border-color:#ffc21f;background:linear-gradient(160deg,rgba(255,194,31,.22),rgba(0,0,0,.12));box-shadow:0 0 16px -6px rgba(255,194,31,.6)}

/* v0.0.8 — Dungeon: elite affixes, depth milestones, Roster tab */
.dg-monster.elite{box-shadow:0 0 0 2px rgba(180,120,255,.5) inset}
.dg-mon-affix{font-family:var(--font);font-weight:800;font-size:11px;color:#c9a2ff;margin-top:3px}
.dg-depth{margin:6px 0;padding:7px 12px;border-radius:10px;font-family:var(--font);font-weight:700;font-size:11.5px;
  color:#ffd98a;background:linear-gradient(160deg,rgba(255,180,32,.10),rgba(0,0,0,.16));border:1px solid rgba(255,200,90,.3)}
.dg-roster-sum{margin:2px 0 8px;padding:8px 12px;border-radius:10px;font-size:12px;color:var(--muted);
  background:var(--panel-2,rgba(255,255,255,.04));border:1px solid var(--line)}
.dg-roster-sum b{color:var(--text)}

/* v0.0.8 — Pachinko sub-tabs + Condensed Crystals */
.pk-coin.cx{border-color:rgba(120,255,180,.6);color:#8ef5d0;background:linear-gradient(160deg,rgba(120,255,180,.14),rgba(0,0,0,.14))}
.pk-condense-row{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 10px}
.pk-condense-row .asc-buy{flex:1 1 auto}

/* ============ v0.0.8 — LR / MR rarities (above UR) ============ */
.ac.r-LR{--rar:var(--r-LR)} .ac.r-MR{--rar:var(--r-MR)}
.ac.r-LR .ac-holo,.ac.r-MR .ac-holo{display:block;animation:shine 2.6s ease-in-out infinite}
.ac.r-LR{box-shadow:0 0 28px -3px var(--r-LR),0 8px 24px -12px #000}
.ac.r-MR{box-shadow:0 0 34px -2px var(--r-MR),0 0 60px -10px #ffd23f,0 8px 24px -12px #000;
  animation:mrPulse 3s ease-in-out infinite}
@keyframes mrPulse{0%,100%{box-shadow:0 0 30px -4px var(--r-MR),0 8px 24px -12px #000}
  50%{box-shadow:0 0 44px 0 var(--r-MR),0 0 70px -6px #ffd23f,0 8px 24px -12px #000}}

/* ===== v0.0.8 — LIVE premium treatment for UR / LR / MR cards ===== */
/* a slow rotating holo "foil" sweep tinted to the rarity, over the whole card */
.ac.r-UR::before,.ac.r-LR::before,.ac.r-MR::before{
  content:"";position:absolute;inset:-45%;z-index:4;pointer-events:none;
  background:conic-gradient(from 0deg,
    transparent 0 16%, var(--rar) 28%, #ffffffcc 33%, var(--rar) 38%,
    transparent 52% 68%, var(--rar) 82%, #ffffff99 86%, transparent);
  mix-blend-mode:screen;opacity:.32;
  animation:acFoilSpin 6.5s linear infinite;
}
.ac.r-LR::before{opacity:.4}
.ac.r-MR::before{opacity:.55;animation-duration:5s}
@keyframes acFoilSpin{to{transform:rotate(1turn)}}
/* a gentle glow "breath" so the card reads as alive even while idle */
.ac.r-UR{animation:acRareBreath 4.6s ease-in-out infinite}
.ac.r-LR{animation:acRareBreath 4.2s ease-in-out infinite}
@keyframes acRareBreath{0%,100%{box-shadow:0 0 20px -6px var(--rar),0 8px 24px -12px #000}
  50%{box-shadow:0 0 44px -2px var(--rar),0 0 74px -14px var(--rar),0 8px 24px -12px #000}}
/* the big detail popup gets the foil too */
.card-detail.r-UR .cd-card,.card-detail.r-LR .cd-card,.card-detail.r-MR .cd-card{position:relative;overflow:hidden}
.card-detail.r-UR .cd-card::before,.card-detail.r-LR .cd-card::before,.card-detail.r-MR .cd-card::before{
  content:"";position:absolute;inset:-45%;z-index:4;pointer-events:none;
  background:conic-gradient(from 0deg,transparent 0 16%,var(--rar) 28%,#ffffffcc 33%,var(--rar) 38%,transparent 52% 68%,var(--rar) 82%,transparent);
  mix-blend-mode:screen;opacity:.3;animation:acFoilSpin 7s linear infinite}
.card-detail.r-LR{--rar:var(--r-LR)} .card-detail.r-MR{--rar:var(--r-MR)}
.dg-r-item.r-LR{--rar:var(--r-LR)} .dg-r-item.r-MR{--rar:var(--r-MR)}
.dg-picker-card.r-LR{--rar:var(--r-LR)} .dg-picker-card.r-MR{--rar:var(--r-MR)}
.card-detail.r-LR,.card-detail.r-MR{--rar:var(--r-MR)}
.card-detail.r-LR{--rar:var(--r-LR)}
.roster-chip.r-LR.on{border-color:var(--r-LR);background:rgba(0,229,208,.18)}
.roster-chip.r-MR.on{border-color:var(--r-MR);background:rgba(255,47,214,.18)}
.summon-btn.thousand{border-color:var(--r-MR)}

/* v0.0.8 — Dungeon front/back formation + per-floor enrage */
.dg-slots.formation{display:flex;flex-wrap:wrap;gap:8px;align-items:stretch}
.dg-row-lbl{flex:1 1 100%;font-family:var(--font);font-weight:800;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;margin:4px 0 -2px;opacity:.85}
.dg-row-lbl.front{color:#ff9d5c}
.dg-row-lbl.back{color:#7bd0ff}
.dg-slot.front{box-shadow:inset 0 0 0 1px rgba(255,140,80,.35);
  background:linear-gradient(160deg,rgba(255,140,80,.07),rgba(0,0,0,.14))}
.dg-slot.back{box-shadow:inset 0 0 0 1px rgba(90,180,255,.35);
  background:linear-gradient(160deg,rgba(90,180,255,.07),rgba(0,0,0,.14))}
.dg-slot.front::after{content:"+30% dmg";position:absolute;top:3px;right:5px;font-size:8px;font-weight:800;color:#ff9d5c;opacity:.75}
.dg-slot.back::after{content:"−40% dmg";position:absolute;top:3px;right:5px;font-size:8px;font-weight:800;color:#7bd0ff;opacity:.75}
.dg-slot{position:relative}
.dg-mon-enrage{font-family:var(--font);font-weight:800;font-size:11px;color:#ff6b6b;margin-top:3px;
  animation:pulse 1.1s ease-in-out infinite}

/* v0.0.9 — Settings: Statistics + Achievements sub-tabs */
.stats-box{display:flex;flex-direction:column;gap:6px;max-width:560px;margin:0 auto}
.stats-grid{display:flex;flex-direction:column;gap:2px;margin-bottom:6px}
.stats-box .stat-row{display:flex;justify-content:space-between;gap:12px;align-items:baseline;
  padding:6px 10px;border-radius:8px;background:var(--panel2,rgba(255,255,255,.03));
  border:1px solid var(--line)}
.stats-box .stat-row .stat-k{color:var(--muted);font-size:12px}
.stats-box .stat-row .stat-v{color:var(--text);font-weight:700;font-size:12px;text-align:right;font-variant-numeric:tabular-nums}

.achv-list{display:flex;flex-direction:column;gap:8px;max-width:560px;margin:10px auto 0}
.achv-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;
  border:1px solid var(--line);background:var(--panel2,rgba(255,255,255,.03));opacity:.62}
.achv-item.got{opacity:1;border-color:var(--r-SSR,#ffc14d);
  background:linear-gradient(150deg,rgba(255,193,77,.12),rgba(0,0,0,.12))}
.achv-ico{font-size:22px;flex:0 0 auto;width:28px;text-align:center}
.achv-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.achv-name{font-family:var(--font);font-weight:800;font-size:13px;color:var(--text)}
.achv-desc{font-size:11px;color:var(--muted);line-height:1.4}
.achv-bar{height:5px;border-radius:3px;background:rgba(255,255,255,.09);overflow:hidden;margin-top:2px}
.achv-fill{height:100%;background:linear-gradient(90deg,var(--r-SR,#5ac8fa),var(--r-SSR,#ffc14d));border-radius:3px;transition:width .3s}
.achv-prog{font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums}
.achv-reward{flex:0 0 auto;font-weight:800;font-size:12px;color:var(--r-SSR,#ffc14d);white-space:nowrap}
.achv-item.got .achv-reward{color:#7dd65a}

.cd-att-row{display:flex;gap:6px;align-items:stretch;flex-wrap:wrap}
.cd-att-row .cd-att-btn{flex:1 1 auto}
.cd-att-btn.sm{flex:0 0 auto;min-width:44px;padding-left:8px;padding-right:8px;opacity:.9}

/* v0.0.9 — Card Actives (Seeker · Milchfrau) */
.ca-wrap{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 14px}
.ca-card{flex:1 1 240px;min-width:0;display:flex;flex-direction:column;gap:6px;
  padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--panel2,rgba(255,255,255,.03))}
.ca-card.seeker{border-color:rgba(176,96,255,.4);background:linear-gradient(155deg,rgba(176,96,255,.1),rgba(0,0,0,.14))}
.ca-card.milk{border-color:rgba(120,200,255,.4);background:linear-gradient(155deg,rgba(180,225,255,.1),rgba(0,0,0,.12))}
.ca-name{font-family:var(--font);font-weight:800;font-size:13px;color:var(--text)}
.ca-desc{font-size:11px;color:var(--muted);line-height:1.45}
.ca-stat{font-size:11px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}
.ca-stat.hot{color:#ffb14d}
.ca-btn{padding:8px 10px;border-radius:9px;border:1px solid var(--line);background:var(--btn,rgba(255,255,255,.06));
  color:var(--text);font-family:var(--font);font-weight:800;font-size:12px;cursor:pointer}
.ca-btn.sm{padding:6px 9px;font-size:11px}
.ca-btn:disabled{opacity:.45;cursor:not-allowed}
.ca-btn:not(:disabled):hover{border-color:var(--accent,#8ab4ff)}
.ca-milk-picker{display:flex;gap:6px}
.ca-milk-sel{flex:1;min-width:0;padding:6px 8px;border-radius:8px;border:1px solid var(--line);
  background:var(--panel,#1a1a22);color:var(--text);font-size:11px}

/* v0.0.9 — Parts banner (Cards tab) */
.parts-banner-wrap{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0 12px}
.parts-banner{flex:1 1 200px;display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:12px;
  border:1px solid var(--line);background:var(--panel2,rgba(255,255,255,.03))}
.parts-banner.crystal{border-color:rgba(120,200,255,.4)}
.parts-banner.scrap{border-color:rgba(200,170,120,.4)}
.pb-title{font-family:var(--font);font-weight:800;font-size:13px}
.pb-bal{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
.pb-btn{padding:9px 12px;border-radius:9px;border:1px solid var(--line);background:var(--btn,rgba(255,255,255,.06));
  color:var(--text);font-family:var(--font);font-weight:800;font-size:12px;cursor:pointer}
.pb-btn:disabled{opacity:.45;cursor:not-allowed}
.pb-btn:not(:disabled):hover{border-color:var(--accent,#8ab4ff)}
.parts-mini-grid{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.parts-mini{font-size:10px;padding:4px 8px;border-radius:7px;border:1px solid var(--line);
  background:var(--panel2,rgba(255,255,255,.03));color:var(--text)}
.parts-mini.r-SSR{border-color:var(--r-SSR,#ffc14d)}
.parts-mini.r-UR{border-color:var(--r-UR,#ff6ad5)}

/* v0.0.9 — Reactor core ring */
.rx-ring{position:relative;width:min(320px,86vw);height:min(320px,86vw);margin:6px auto 16px}
.rx-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:34%;height:34%;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(circle at 40% 35%,rgba(120,230,160,.5),rgba(20,60,40,.5) 70%);
  border:2px solid rgba(120,230,160,.55);box-shadow:0 0 26px rgba(90,220,150,.4),inset 0 0 20px rgba(0,0,0,.4);
  animation:rxCorePulse 3.4s ease-in-out infinite}
@keyframes rxCorePulse{0%,100%{box-shadow:0 0 22px rgba(90,220,150,.32),inset 0 0 20px rgba(0,0,0,.4)}
  50%{box-shadow:0 0 34px rgba(90,220,150,.55),inset 0 0 20px rgba(0,0,0,.4)}}
.rx-core-glyph{font-size:26px;line-height:1}
.rx-core-sub{font-family:var(--font);font-weight:800;font-size:11px;color:#bff3d2;margin-top:2px}
.rx-node{position:absolute;transform:translate(-50%,-50%);width:52px;min-height:52px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  border-radius:12px;border:1px solid var(--line);background:var(--panel2,rgba(255,255,255,.05));
  cursor:pointer;transition:border-color .15s,transform .15s}
.rx-node:hover{transform:translate(-50%,-50%) scale(1.08);border-color:var(--accent,#8ab4ff)}
.rx-node.filled{background:var(--panel,#1b1b24)}
.rx-node.filled.r-SSR{border-color:var(--r-SSR,#ffc14d)}
.rx-node.filled.r-UR{border-color:var(--r-UR,#ff6ad5);box-shadow:0 0 12px rgba(255,106,213,.4)}
.rx-node-ico{font-size:18px;line-height:1}
.rx-node-mult{font-family:var(--font);font-weight:800;font-size:9px;color:var(--muted);font-variant-numeric:tabular-nums}
.asc-item.rx-flash{animation:rxFlash .9s ease}
@keyframes rxFlash{0%,100%{background:transparent}30%{background:rgba(138,180,255,.22)}}

/* v0.0.8 — 🔷 Crystal Condenser fixture in the Reactor Assembly view */
.rx-condenser{margin:10px 0 6px;padding:12px 14px;border-radius:12px;
  border:1px dashed rgba(90,180,255,.45);background:linear-gradient(160deg,rgba(60,130,220,.10),rgba(0,0,0,.14))}
.rx-condenser.on{border-style:solid;border-color:rgba(90,180,255,.6);box-shadow:0 0 20px -6px rgba(90,180,255,.5)}
.rx-cd-h{font-family:var(--font);font-weight:800;font-size:13px;color:#bfe4ff}
.rx-cd-note{font-size:11px;color:var(--muted);line-height:1.4;margin:4px 0 8px}

/* v0.0.9 — 💸 Inflation Stabilizer fixture (hidden until the Research MEGA discovers it) */
.rx-stabilizer{margin:10px 0 6px;padding:12px 14px;border-radius:12px;
  border:1px dashed rgba(169,112,255,.5);background:linear-gradient(160deg,rgba(120,70,220,.12),rgba(0,0,0,.16))}
.rx-stabilizer.on{border-style:solid;border-color:rgba(169,112,255,.7);box-shadow:0 0 20px -6px rgba(169,112,255,.6)}
.rx-stabilizer .rx-cd-h{color:#e0cbff}
/* stabilised reactor core — green → violet */
.rx-core.stabilized{
  background:radial-gradient(circle at 40% 35%,rgba(180,130,255,.55),rgba(45,20,80,.5) 70%);
  border-color:rgba(180,130,255,.6);
  box-shadow:0 0 26px rgba(150,90,240,.45),inset 0 0 20px rgba(0,0,0,.4);
  animation:rxCorePulseV 3.4s ease-in-out infinite}
@keyframes rxCorePulseV{0%,100%{box-shadow:0 0 22px rgba(150,90,240,.34),inset 0 0 20px rgba(0,0,0,.4)}
  50%{box-shadow:0 0 36px rgba(150,90,240,.6),inset 0 0 20px rgba(0,0,0,.4)}}
.rx-core.stabilized .rx-core-sub{color:#e0cbff}
:root[data-reduced-fx] .rx-core.stabilized{background:#2a1550 !important;border-color:#7a52c0 !important;animation:none}

/* 💸 Inflation notice on the summon screen */
.gacha-inflation{margin:8px auto 0;max-width:520px;font-size:12px;line-height:1.45;padding:9px 12px;border-radius:10px;
  color:#ffd9b8;background:linear-gradient(180deg,rgba(255,120,50,.16),rgba(255,120,50,.05));border:1px solid rgba(255,150,80,.45)}
.gacha-inflation b{color:#ff9d5c}

/* 💞 Romance (js/romance.js) */
.rm-mortal{border:1px solid rgba(255,120,180,.25);border-radius:12px;padding:10px;margin:10px 0;background:rgba(255,120,180,.04)}
.rm-head{display:flex;gap:10px;align-items:center}
.rm-face{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px;background:rgba(255,255,255,.06);flex:0 0 auto}
.rm-face.missing{opacity:.35;filter:grayscale(1)}
.rm-pair{margin-top:10px;padding:8px;border-radius:10px;background:rgba(0,0,0,.18)}
.rm-pair.locked{opacity:.6}
.rm-pair-top{display:flex;gap:10px;align-items:flex-start}
.rm-pair-info{flex:1;min-width:0}
.rm-hearts{font-size:12px;letter-spacing:1px;margin:2px 0}
.rm-line{font-style:italic;font-size:12px;margin:6px 0;color:var(--muted)}
.rm-acts{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.rm-talk{margin:6px 0;padding:6px 8px;border-left:3px solid rgba(255,120,180,.5);background:rgba(255,120,180,.05);border-radius:6px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.rm-q{flex:1 1 100%;font-size:12px}
.rm-ans{text-transform:none}
.rm-mood{font-size:11px;color:var(--muted);margin:4px 0}
.rm-want{box-shadow:0 0 0 2px rgba(255,200,90,.8)}
.rm-jealous{font-size:11px;color:#ff8a8a}
.rm-event{margin:6px 0;padding:8px 10px;border:1px solid #ff7eb6;border-radius:10px;background:rgba(255,126,182,.10);animation:rmEvPulse 2.4s ease-in-out infinite}
.rm-event .rm-event-go{margin-top:6px;width:100%}
.rm-replay{font-size:.75em;padding:2px 8px;margin:4px 0;opacity:.8}
.rm-replay:hover{opacity:1}
@keyframes rmEvPulse{0%,100%{box-shadow:0 0 0 rgba(255,126,182,0)}50%{box-shadow:0 0 12px rgba(255,126,182,.45)}}
.rm-streak{margin:8px 0;padding:6px 10px;border-radius:8px;background:rgba(255,140,60,.10);font-size:12px;font-weight:700}
.rm-inbox{margin:8px 0}
.rm-msg{margin:6px 0;padding:8px 10px;border-radius:12px 12px 12px 3px;background:rgba(120,160,255,.10);max-width:560px}
.rm-msg-from{font-size:11px;color:var(--muted)}
.rm-msg-text{margin:4px 0;font-size:13px}
.rm-album{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 12px}
.rm-mem{font-size:11px;padding:6px 8px;border-radius:8px;border:1px dashed rgba(255,255,255,.2);background:transparent;color:var(--muted);cursor:default}
.rm-mem.got{border-style:solid;border-color:rgba(255,120,180,.5);color:inherit;cursor:pointer;background:rgba(255,120,180,.08)}
.rm-mem-scene{text-align:center}
.rm-mem-faces{font-size:40px;margin:6px 0 10px}
/* 📱 mobile mode — bigger tap targets for the tree / sub-tab / Romance buttons (2026-09-24) */
:root[data-mobile] .st-buy,:root[data-mobile] .dg-subtabs button,:root[data-mobile] .rm-ans{min-height:38px}
:root[data-mobile] .dg-subtabs button{padding:8px 11px}
:root[data-mobile] .st-node{min-width:0}
/* 📱 the crisis banner floated over the HUD numbers on a phone — pin it to the bottom edge instead (it lives at the end of <body>) */
@media(max-width:600px){#neglect-banner{position:fixed;left:8px;right:8px;top:auto;bottom:8px;transform:none;max-width:none;border-radius:12px;font-size:11px}}
:root[data-mobile] #neglect-banner{position:fixed;left:8px;right:8px;top:auto;bottom:8px;transform:none;max-width:none;border-radius:12px;font-size:11px}
/* the banner used the generic `pulse` (scale ×1.5 + 40% opacity, meant for tiny pips) —
   it ballooned, faded and slid off-centre every beat. Its own gentle glow instead. */
@keyframes bannerPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.25)}}
.perf-live{font:600 12px/1.5 var(--font);color:var(--good);margin-top:6px;font-variant-numeric:tabular-nums}
/* ============ 🏝️ City island (js/city.js, 2026-09-24 rebuild) ============ */
.cz-tools{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 4px}
.cz-tool{padding:7px 10px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);font:700 12px var(--font);cursor:pointer}
.cz-tool.active{border-color:var(--accent);background:rgba(139,92,255,.25);color:#fff}
.cz-tool.danger{border-color:rgba(255,110,80,.45)}
.cz-tool.poor{opacity:.5}
.cz-hint{margin-bottom:8px}
.cz-sea{position:relative;border-radius:18px;padding:14px;overflow:hidden;border:1px solid var(--line);
  background:radial-gradient(120% 90% at 15% 100%,rgba(60,140,200,.35),transparent 60%),radial-gradient(120% 120% at 90% 0%,rgba(90,110,220,.25),transparent 55%),linear-gradient(160deg,#0d2a4a,#0a1830)}
.cz-sea.bg-1{background:radial-gradient(120% 90% at 15% 100%,rgba(60,200,180,.30),transparent 60%),radial-gradient(120% 120% at 90% 0%,rgba(170,90,255,.30),transparent 55%),linear-gradient(160deg,#0c2440,#140f30)}
.cz-sea.bg-2{background:radial-gradient(120% 90% at 15% 100%,rgba(255,200,90,.25),transparent 60%),radial-gradient(120% 120% at 90% 0%,rgba(255,120,200,.28),transparent 55%),linear-gradient(160deg,#1c2250,#2a1432)}
.cz-waves{position:absolute;inset:-40px;pointer-events:none;opacity:.35;
  background:repeating-radial-gradient(circle at 30% 40%,transparent 0 14px,rgba(160,210,255,.10) 15px 16px,transparent 17px 30px);animation:czWaves 14s linear infinite}
@keyframes czWaves{from{transform:translate(0,0)}to{transform:translate(30px,18px)}}
.cz-grid{position:relative;display:grid;grid-template-columns:repeat(var(--cols,11),1fr);gap:3px;aspect-ratio:11/7;max-width:720px;margin:0 auto}
.cz-cell{position:relative;border:0;padding:0;border-radius:7px;display:grid;place-items:center;font-size:min(22px,5vw);line-height:1;color:inherit}
.cz-cell.water{background:transparent}
.cz-cell.land{cursor:pointer;background:linear-gradient(160deg,#4f9a4a,#2f6a31);box-shadow:inset 0 -3px 0 rgba(0,0,0,.25);transition:transform .1s,filter .1s}
.cz-cell.land.shore{box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 2px rgba(236,214,150,.55)}
.cz-cell.land.empty:hover{filter:brightness(1.25);transform:translateY(-1px)}
.cz-cell.b-house{background:linear-gradient(160deg,#6db36a,#3f7f40)}
.cz-cell.b-park{background:linear-gradient(160deg,#3f9e5a,#1f5e34)}
.cz-cell.b-factory{background:linear-gradient(160deg,#77716c,#44403d)}
.cz-cell.b-dump{background:linear-gradient(160deg,#7d7a2c,#3f3d14)}
.cz-cell.estate{box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 2px rgba(150,255,170,.65);background:linear-gradient(160deg,#7cc978,#4a9448)}
.cz-cell.slum{background:linear-gradient(160deg,#6b5238,#3a2a1c);box-shadow:inset 0 -3px 0 rgba(0,0,0,.35),0 0 0 2px rgba(255,90,70,.55)}
.cz-res{position:absolute;top:1px;right:2px;font:800 8px var(--font);font-style:normal;color:#eaffd0;text-shadow:0 1px 2px #000}
.cz-tag{position:absolute;bottom:-7px;left:50%;transform:translateX(-50%);font:800 8px var(--font);padding:1px 4px;border-radius:5px;white-space:nowrap;z-index:2}
.cz-tag.estate{background:#1f6a36;color:#d8ffe0}
.cz-tag.slum{background:#6a2a1f;color:#ffd8cc}
.cz-lm{position:relative;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1;
  background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--lm-color) 35%,transparent),rgba(20,30,20,.85) 70%);
  border:2px solid color-mix(in srgb,var(--lm-color) 60%,transparent)}
.cz-lm.t1{box-shadow:0 0 10px color-mix(in srgb,var(--lm-color) 45%,transparent)}
.cz-lm.t2{box-shadow:0 0 18px color-mix(in srgb,var(--lm-color) 65%,transparent)}
.cz-lm.t3{box-shadow:0 0 28px var(--lm-color),inset 0 0 14px color-mix(in srgb,var(--lm-color) 50%,transparent)}
.cz-lm.locked{background:repeating-linear-gradient(45deg,rgba(40,40,40,.85) 0 8px,rgba(70,60,20,.85) 8px 16px);border-style:dashed;border-color:rgba(255,210,90,.5)}
.cz-lm-art{position:relative;font-size:min(40px,9vw);line-height:1}
.cz-deco{position:absolute;font-size:.45em}
.cz-deco1{left:-.55em;bottom:-.1em}
.cz-deco2{right:-.55em;bottom:-.1em}
.cz-deco3{left:50%;top:-.6em;transform:translateX(-50%);animation:czFloat 2.4s ease-in-out infinite}
@keyframes czFloat{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-4px)}}
.cz-lm-name{font:800 9px var(--font);color:#fff;text-shadow:0 1px 2px #000;margin-top:3px;text-align:center}
.cz-smoke{position:absolute;left:30%;top:-.3em;width:.35em;height:.35em;border-radius:50%;background:rgba(220,220,220,.55);animation:czSmoke 2.6s ease-out infinite}
@keyframes czSmoke{0%{transform:translate(0,0) scale(.6);opacity:.8}100%{transform:translate(.4em,-1.4em) scale(1.8);opacity:0}}
.cz-neon{position:absolute;inset:-.15em;border-radius:.3em;border:2px solid rgba(255,120,240,.8);animation:czNeon 1.4s steps(2) infinite}
@keyframes czNeon{0%,100%{opacity:1}50%{opacity:.35}}
.cz-sparkle{position:absolute;right:-.1em;top:-.1em;width:.25em;height:.25em;background:#bff3ff;border-radius:50%;box-shadow:0 0 8px #bff3ff;animation:czNeon 1.1s ease-in-out infinite}
.cz-sum{margin-top:10px;padding:8px 12px;border-radius:10px;background:rgba(0,0,0,.25);border:1px solid var(--line);font:700 12px/1.5 var(--font)}
/* 🏝️ beach + streets: every land plot spreads a sand halo, so the gaps between plots
   read as sandy lanes and the outer ring as a continuous coastline with foam */
.cz-grid{gap:4px}
.cz-cell.land{box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 4px rgba(226,204,150,.55)}
.cz-cell.land.shore{box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 4px rgba(226,204,150,.6),0 0 0 8px rgba(255,255,255,.07)}
.cz-cell.estate{box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 2px rgba(150,255,170,.8),0 0 0 4px rgba(226,204,150,.55)}
.cz-cell.slum{box-shadow:inset 0 -3px 0 rgba(0,0,0,.35),0 0 0 2px rgba(255,90,70,.7),0 0 0 4px rgba(170,140,100,.55)}
.cz-lm{box-shadow:0 0 0 4px rgba(226,204,150,.55)}
.cz-lm.t1{box-shadow:0 0 0 4px rgba(226,204,150,.55),0 0 12px color-mix(in srgb,var(--lm-color) 45%,transparent)}
.cz-lm.t2{box-shadow:0 0 0 4px rgba(226,204,150,.55),0 0 20px color-mix(in srgb,var(--lm-color) 65%,transparent)}
.cz-lm.t3{box-shadow:0 0 0 4px rgba(226,204,150,.55),0 0 30px var(--lm-color),inset 0 0 14px color-mix(in srgb,var(--lm-color) 50%,transparent)}
.cz-boat{position:absolute;font-size:min(22px,5vw);z-index:0;pointer-events:none;animation:czBob 3.2s ease-in-out infinite}
.cz-boat.b2{animation-duration:4.1s;animation-delay:-1.3s}
.cz-boat.b3{animation-duration:3.6s;animation-delay:-2.1s}
@keyframes czBob{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-4px) rotate(4deg)}}
/* 🏝️ merged structures (estate / factory / landfill) */
.cz-struct{position:relative;border:0;padding:0;border-radius:10px;z-index:1;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;
  box-shadow:0 0 0 4px rgba(226,204,150,.55),inset 0 -4px 0 rgba(0,0,0,.25)}
.cz-struct-art{position:relative;font-size:min(46px,10vw);line-height:1}
.cz-struct-name{font:800 10px var(--font);text-shadow:0 1px 2px #000;margin-top:4px;text-align:center}
.cz-estate{background:linear-gradient(160deg,#7cc978,#3f8a3f)}
.cz-safe{background:linear-gradient(160deg,#7cc978,#3f8a3f);box-shadow:0 0 0 3px rgba(120,200,255,.85),0 0 0 6px rgba(226,204,150,.55)}
.cz-eco{background:linear-gradient(160deg,#93e08a,#2f8a4a);box-shadow:0 0 0 3px rgba(140,255,160,.9),0 0 18px rgba(140,255,160,.5)}
.cz-slum{background:linear-gradient(160deg,#6b5238,#3a2a1c);box-shadow:0 0 0 3px rgba(255,90,70,.75),0 0 0 6px rgba(170,140,100,.5)}
.cz-factory{background:linear-gradient(160deg,#7d7873,#3e3a37);box-shadow:0 0 0 3px rgba(255,150,80,.6),0 0 0 6px rgba(226,204,150,.5)}
.cz-landfill{background:linear-gradient(160deg,#6d6a2a,#35331a);box-shadow:0 0 0 3px rgba(200,190,60,.7),0 0 0 6px rgba(170,140,100,.5)}
.cz-cell.b-business{background:linear-gradient(160deg,#9aa6c8,#5b6690)}
.cz-cell.stinky{background:linear-gradient(160deg,#6d6a3a,#44421f);filter:saturate(.6)}
.cz-flies{position:absolute;right:-.3em;top:-.2em;font-size:.4em;animation:czFloat 1.2s ease-in-out infinite}
.cz-leaf{position:absolute;left:-.3em;top:-.2em;font-size:.4em;animation:czFloat 2s ease-in-out infinite}
.cz-cell.b-monument{background:linear-gradient(160deg,#f3d27a,#b98a2e);box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 4px rgba(226,204,150,.55),0 0 14px rgba(255,220,120,.6)}
.cz-cell.b-club{background:linear-gradient(160deg,#8a3a6a,#4a1a3a)}
.cz-cell.b-sublab{background:linear-gradient(160deg,#5fd6b0,#2a7a66)}
.cz-cell.b-sublab.cut{filter:grayscale(.8) brightness(.7)}
.cz-cell.b-power{background:linear-gradient(160deg,#6d7a8a,#34404e);box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 3px rgba(255,220,80,.6),0 0 0 6px rgba(226,204,150,.5)}
/* 🏝️ 2026-09-24 fix: rows were auto-sized, so the 2×2 landmarks stretched the top
   rows and squashed the bottom ones — every row is now an equal share and no
   plot/landmark content may push its track taller (plots stay ~square). */
.cz-grid{grid-template-rows:repeat(7,minmax(0,1fr));grid-template-columns:repeat(var(--cols,11),minmax(0,1fr))}
.cz-cell,.cz-lm,.cz-struct{min-width:0;min-height:0;overflow:hidden}
.cz-lm,.cz-struct{overflow:visible}
.cz-lm-art{font-size:min(34px,7vw)}
.cz-struct-art{font-size:min(40px,9vw)}
.cz-lm-name,.cz-struct-name{font-size:9px;line-height:1.1;white-space:nowrap}
.cz-cell.building{background:repeating-linear-gradient(45deg,#4a4632 0 6px,#6b5f2a 6px 12px);box-shadow:inset 0 -3px 0 rgba(0,0,0,.3),0 0 0 4px rgba(226,204,150,.55)}
.cz-bld-what{position:absolute;top:1px;left:3px;font-size:.5em;font-style:normal;opacity:.85}
.cz-timer{position:absolute;bottom:1px;left:0;right:0;text-align:center;font:800 8px var(--font);color:#fff;text-shadow:0 1px 2px #000}
.cz-cell.park-market{background:linear-gradient(160deg,#b8a24a,#6f5e22)}
.cz-cell.park-barren{background:linear-gradient(160deg,#8a7a4a,#4f4526);filter:saturate(.5)}
.cz-cell.b-warehouse{background:linear-gradient(160deg,#9a7a55,#5a4228)}
.cz-cell.wh-logistics{box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 3px rgba(120,200,255,.8),0 0 0 6px rgba(226,204,150,.5)}
.cz-cell.wh-forgotten{filter:grayscale(.8) brightness(.75)}
.cz-cell.wh-dumpc{background:linear-gradient(160deg,#7d7a2c,#3f3d14)}
.cz-cell.wh-silo{background:linear-gradient(160deg,#6fb8d8,#2c5f7a);box-shadow:inset 0 -3px 0 rgba(0,0,0,.25),0 0 0 3px rgba(160,230,255,.8),0 0 0 6px rgba(226,204,150,.5)}
.cz-pk{position:absolute;top:1px;left:2px;font-size:.55em;font-style:normal;filter:drop-shadow(0 1px 1px rgba(0,0,0,.7));z-index:3}
.cz-cell.demolishing{background:repeating-linear-gradient(45deg,#5a3a32 0 6px,#7a4a2a 6px 12px)}
/* 📖 Settings → Guide */
.guide-list{display:flex;flex-direction:column;gap:8px;margin:8px 0 16px}
.guide-row{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.03);border:1px solid var(--line)}
.guide-ico{font-size:22px;line-height:1;flex:0 0 28px;text-align:center}
.guide-name{font:800 13px var(--font);margin-bottom:2px}
.guide-desc{font-size:12px;color:var(--muted);line-height:1.45}
.pk-bonus-box{margin-top:14px;padding:8px 12px;border-radius:10px;border:1px solid var(--line);background:rgba(0,0,0,.2)}
/* 🏝️ 13×9 frame (2026-09-24) */
.cz-grid{aspect-ratio:13/9;max-width:780px;grid-template-rows:repeat(var(--rows,9),minmax(0,1fr))}
.cz-grid.cz-colony{aspect-ratio:9/6;max-width:560px}
.cz-view-tabs{justify-content:center;margin:8px 0}
.cz-cell{font-size:min(20px,4.2vw)}
/* ✨ Grace shop — tabs by mechanic + card grid (2026-09-24) */
.grace-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 12px}
.grace-tab{padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--text);font:700 12px var(--font);cursor:pointer;position:relative}
.grace-tab.active{background:linear-gradient(135deg,rgba(255,200,120,.35),rgba(255,120,200,.3));border-color:rgba(255,210,140,.8);color:#fff}
.grace-tab.can::after{content:"";position:absolute;top:4px;right:6px;width:7px;height:7px;border-radius:50%;background:#ffd36a;box-shadow:0 0 6px #ffd36a}
.grace-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;margin-bottom:14px}
.grace-card{flex-direction:column;align-items:stretch;gap:8px;border-radius:14px;padding:12px;position:relative;overflow:hidden;min-height:120px}
.grace-card .asc-ico{font-size:26px}
.grace-card .asc-buy{align-self:flex-end;margin-top:auto}
.grace-card::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:var(--gc,#ffd36a)}
.grace-card.cat-core{--gc:#5ad1ff}.grace-card.cat-research{--gc:#7dffd0}.grace-card.cat-city{--gc:#8fe38a}
.grace-card.cat-dungeon{--gc:#ff7a7a}.grace-card.cat-systems{--gc:#c98bff}.grace-card.cat-crises{--gc:#ffb020}
.grace-card.cat-basedef{--gc:#ffa36b}.grace-card.cat-cosmetic{--gc:#ff9ad5}.grace-card.cat-timeline{--gc:#b9a6ff}.grace-card.cat-power{--gc:#ffd36a}
.grace-card.owned{opacity:.7}
@media(max-width:600px){.grace-grid{grid-template-columns:1fr}}
/* grace cards: icon + text side by side, buy button full-width underneath */
.asc-item.grace-card{display:grid;grid-template-columns:40px minmax(0,1fr);grid-template-rows:1fr auto;column-gap:10px;row-gap:10px;align-items:start}
.asc-item.grace-card .asc-ico{grid-column:1;grid-row:1;width:40px;height:40px;display:grid;place-items:center}
.asc-item.grace-card .asc-body{grid-column:2;grid-row:1;min-width:0}
.asc-item.grace-card .asc-name{white-space:normal;line-height:1.25}
.asc-item.grace-card .asc-desc{white-space:normal;line-height:1.4}
.asc-item.grace-card .asc-buy{grid-column:1 / -1;grid-row:2;width:100%;margin:0}
/* 🌲 City materials */
.cz-mats{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.cz-mat{padding:5px 10px;border-radius:9px;background:rgba(0,0,0,.25);border:1px solid var(--line);font:700 12px var(--font)}
.cz-mat small{color:var(--muted);font-weight:600}
.cz-cell.b-sawmill{background:linear-gradient(160deg,#a07a4a,#5e4424)}
.cz-cell.prod-idle{filter:grayscale(.6) brightness(.8)}
.cz-cell.prod-treefarm{background:linear-gradient(160deg,#3f8a3a,#1f4f22)}
.cz-cell.b-quarry{background:linear-gradient(160deg,#9a9690,#5e5a55)}
.cz-cell.prod-deep{background:linear-gradient(160deg,#6a6560,#2e2b28)}
.cz-cell.b-foundry{background:linear-gradient(160deg,#c8602a,#6a2a10)}
.cz-district{background:linear-gradient(160deg,#9fb6d8,#3d4f78);box-shadow:0 0 0 3px rgba(120,200,255,.9),0 0 22px rgba(120,190,255,.6)}
.cz-progressive{background:linear-gradient(160deg,#8ea3a8,#3f5057);box-shadow:0 0 0 3px rgba(120,220,255,.8),0 0 0 6px rgba(190,210,220,.5)}
.cz-strategic{background:linear-gradient(160deg,#5aa6a8,#1f4a55);box-shadow:0 0 0 3px rgba(110,240,255,.85),0 0 0 6px rgba(120,160,200,.5)}
/* 🧩 combos v3 */
.cz-struct.cz-cross{clip-path:polygon(33.3% 0,66.7% 0,66.7% 33.3%,100% 33.3%,100% 66.7%,66.7% 66.7%,66.7% 100%,33.3% 100%,33.3% 66.7%,0 66.7%,0 33.3%,33.3% 33.3%)}
.cz-pantheon{background:radial-gradient(circle at 50% 50%,#fff6d0,#e8c46a 40%,#8a5ad6 100%);box-shadow:0 0 30px rgba(255,220,120,.9)}
.cz-cell.combo{box-shadow:inset 0 0 0 2px rgba(255,214,107,.85),0 0 10px rgba(255,214,107,.45)}
.cz-cell.smog{filter:saturate(.5) brightness(.85);box-shadow:inset 0 0 0 2px rgba(140,140,140,.9)}
.cz-cell.park-funfair{background:linear-gradient(160deg,#ffb3d9,#c86bd6);box-shadow:inset 0 0 0 2px rgba(255,255,255,.6)}
.cz-cell.park-trampled{background:linear-gradient(160deg,#b8a27a,#7a6848);filter:saturate(.6)}
.cz-itreefarm{background:linear-gradient(160deg,#6fd08a,#2f7a45);box-shadow:0 0 0 3px rgba(190,255,170,.8),0 0 18px rgba(120,230,140,.55)}
.cz-cell.park-stump{background:linear-gradient(160deg,#9a7b52,#5a4127);filter:saturate(.6)}
.cz-cell.prod-industrial{box-shadow:inset 0 0 0 2px rgba(255,170,90,.8)}
.cz-future{background:linear-gradient(160deg,#9af0c8,#3aa6a0);box-shadow:0 0 0 3px rgba(255,240,150,.95),0 0 26px rgba(160,255,220,.7)}
.cz-cell.eco-biz{background:linear-gradient(160deg,#7fc99a,#3f7a5a)}
/* 💞 romance v2 — energy, requests, rivalry, bond, date minigames (js/romance-games.js) */
.rm-energy{font-size:11px;color:#ffd166;margin-top:2px}
.rm-req{margin:6px 0;padding:8px 10px;border:1px dashed #9ad0ff;border-radius:10px;background:rgba(120,190,255,.08)}
.rm-req p{margin:4px 0;font-size:12px}
.rm-rival{margin:8px 0;padding:10px;border:1px solid #ffb35c;border-radius:10px;background:rgba(255,160,60,.10)}
.rm-rival p{margin:6px 0;font-size:12px}
.rm-bond-fill{background:linear-gradient(90deg,#ff7eb6,#c77dff)}
.rmg{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.rmg-mem{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.rmg-card{font-size:24px;height:54px;border-radius:10px;border:1px solid var(--line,#444);background:rgba(255,255,255,.06);cursor:pointer}
.rmg-card.up{background:rgba(255,220,150,.18)}
.rmg-card.done{background:rgba(120,230,150,.22);border-color:#6fdc8c}
.rmg-wave{position:relative;height:44px;border-radius:22px;background:linear-gradient(90deg,#1b4f8a,#2a7fc9,#1b4f8a);overflow:hidden;cursor:pointer}
.rmg-zone{position:absolute;top:0;bottom:0;background:rgba(120,255,150,.35);border-left:2px solid #7dffa0;border-right:2px solid #7dffa0}
.rmg-zone.hit{background:rgba(120,255,150,.7)}
.rmg-zone.miss{background:rgba(255,90,90,.5)}
.rmg-surf{position:absolute;top:6px;font-size:26px;transform:translateX(-50%);pointer-events:none}
.rmg-books{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.rmg-book{font-size:30px;height:64px;border-radius:10px;border:1px solid var(--line,#444);background:rgba(255,255,255,.05);cursor:pointer;transition:transform .1s,background .1s}
.rmg-book.lit{background:rgba(255,230,120,.55);transform:scale(1.08)}
.rmg-field{position:relative;height:230px;border-radius:12px;background:radial-gradient(ellipse at 50% 120%,#1d2b4f,#070b18);overflow:hidden}
.rmg-fly{position:absolute;font-size:22px;background:none;border:0;cursor:pointer;animation:rmgFly 1.1s ease-in-out infinite alternate;filter:drop-shadow(0 0 6px #ffe98a)}
.rmg-fly.got{transform:scale(1.8);opacity:0;transition:all .15s}
@keyframes rmgFly{from{margin-top:0}to{margin-top:-8px}}
/* 📸 Memory Gallery (Expeditions → 📸) — memories as Useless-Goddesses cards */
.rm-gal-link{display:block;width:100%;margin:8px 0;text-align:left}
.mem-progress{margin:6px 0 2px}
.mem-couple{margin:16px 0 6px}
.mem-couple-title{font-family:var(--font);font-weight:800;font-size:13px;margin-bottom:8px;letter-spacing:.3px}
.mem-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
.mem-card .mem-portrait{height:110px}
.mem-card .mem-faces{font-size:38px;position:relative;z-index:2;filter:drop-shadow(0 4px 8px rgba(0,0,0,.55))}
.mem-card .ac-img{opacity:.55}
.mem-card .ac-flavor{min-height:40px}
.mem-card.r-SR{--rar:#6fb6ff}.mem-card.r-SSR{--rar:#c77dff}.mem-card.r-UR{--rar:#ffcf5a}
.mem-card.r-UR{box-shadow:inset 0 0 0 2px rgba(255,226,140,.9),inset 0 0 0 4px rgba(40,90,170,.55),0 0 18px rgba(255,210,110,.55)}
.mem-card.locked{filter:grayscale(.85) brightness(.55);cursor:default}
.mem-card.locked:hover{transform:none}
.mem-card.locked .mem-faces{font-size:44px;opacity:.6}
.mem-big-wrap{display:flex;justify-content:center;padding:4px 0}
.mem-card.big{width:min(300px,100%)}
.mem-card.big .mem-portrait{height:180px}
.mem-card.big .mem-faces{font-size:60px}
.mem-card.big .ac-name{font-size:16px}
.mem-card.big .ac-flavor{font-size:13px;line-height:1.5;padding-bottom:22px}
.mem-card.big .mem-date{font-size:10px;opacity:.75;padding-top:0;min-height:0}
.mem-new .mem-card{animation:memIn .6s cubic-bezier(.2,1.4,.4,1) both}
@keyframes memIn{from{transform:scale(.6) rotate(-6deg);opacity:0}to{transform:none;opacity:1}}
.mem-card .ac-rar{color:#3a2600;text-shadow:0 1px 0 rgba(255,255,255,.5)}
.mem-card .ac-flavor{padding-bottom:20px}

/* 📊 City — build buttons with their bonus, generation tiles, per-plot numbers (2026-09-25) */
.cz-tool{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;min-width:128px;padding:7px 10px 8px}
.cz-tool-name{display:flex;align-items:center;gap:6px;width:100%}
.cz-tool-n{margin-left:auto;font-style:normal;font-size:10px;padding:1px 6px;border-radius:8px;background:rgba(255,255,255,.12);color:var(--muted)}
.cz-tool-eff{font:600 10.5px/1.25 var(--font-body,var(--font));color:#9fe7b4}
.cz-tool-cost{font:600 10px var(--font);color:var(--muted)}
.cz-tool.active .cz-tool-eff{color:#d7ffe2}
.cz-nums-toggle{margin:2px 0 6px;padding:4px 10px;border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--muted);font:700 11px var(--font);cursor:pointer}
.cz-nums-toggle.on{color:#9fe7b4;border-color:rgba(110,220,150,.5)}
.cz-val{position:absolute;left:50%;bottom:1px;transform:translateX(-50%);font:800 min(9px,2.2vw)/1 var(--font);font-style:normal;
  padding:1px 3px;border-radius:5px;background:rgba(0,0,0,.62);color:#b9ffcb;white-space:nowrap;pointer-events:none;z-index:2}
.cz-val.neg{color:#ff9b9b}
.cz-gen{margin-top:10px;padding:10px 12px;border-radius:12px;background:rgba(0,0,0,.25);border:1px solid var(--line)}
.cz-gen-title{font:800 12px var(--font);letter-spacing:.5px;margin-bottom:8px}
.cz-gen-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:6px}
.cz-gen-tile{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:8px;align-items:center;
  padding:6px 9px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.cz-gen-ico{grid-row:1 / span 2;font-size:20px}
.cz-gen-val{font:800 14px var(--font);color:#b9ffcb}
.cz-gen-lbl{font:600 10px var(--font);color:var(--muted)}
.cz-gen-tile.neg .cz-gen-val{color:#ff9b9b}

/* 👁️ City build preview */
.cz-preview{margin:0 0 6px;padding:6px 10px;border-radius:9px;border:1px dashed var(--line);background:rgba(0,0,0,.2);
  font:600 11.5px/1.45 var(--font);color:var(--muted);min-height:20px}
.cz-preview.on{border-style:solid;border-color:rgba(120,210,255,.55);color:#dff4ff;background:rgba(40,110,170,.18)}
.cz-cell.pv-here{outline:2px dashed #9fe0ff;outline-offset:-2px;filter:brightness(1.2)}
.cz-cell.pv-here::after{content:attr(data-ghost);position:absolute;inset:0;display:grid;place-items:center;opacity:.55;pointer-events:none}
.cz-cell.pv-up{box-shadow:inset 0 0 0 2px #6dff9a,0 0 10px rgba(109,255,154,.55) !important}
.cz-cell.pv-down{box-shadow:inset 0 0 0 2px #ff6d6d,0 0 10px rgba(255,109,109,.55) !important}

/* 📜 City synergy cheat-sheet */
.cz-sheet-btn{margin-left:6px;color:#ffe39a;border-color:rgba(255,210,110,.45)}
.cz-sheet{display:flex;flex-direction:column;gap:8px;max-height:65vh;overflow:auto;padding-right:4px}
.cz-cell.cz-guildr{box-shadow:inset 0 0 0 2px rgba(120,220,140,.45)}
.cz-inspect{display:flex;flex-direction:column;gap:4px;max-height:65vh;overflow:auto;padding-right:4px}
.cz-insp-desc{white-space:pre-line}
.cz-insp-h{font:800 13px var(--font);margin-top:8px}
.cz-insp-row{font:700 13px var(--font);padding:3px 8px;border-radius:8px;background:rgba(255,255,255,.04)}
.cz-insp-row.gives{color:var(--good,#7dff9a)}
.cz-insp-row.takes{color:#ff8a8a}
.cz-f-row{padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)}
.cz-f-row.locked{opacity:.4}
.cz-f-eq{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.cz-f-chip{display:flex;flex-direction:column;align-items:center;min-width:64px;max-width:120px;padding:5px 8px;border-radius:10px;
  background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.1);text-align:center}
.cz-f-chip.res{background:linear-gradient(160deg,rgba(120,230,160,.22),rgba(40,110,80,.25));border-color:rgba(120,230,160,.55)}
.cz-f-emo{font-size:22px;line-height:1.1}
.cz-f-name{font:700 10px/1.2 var(--font);color:var(--muted);margin-top:2px}
.cz-f-chip.res .cz-f-name{color:#c9ffd9}
.cz-f-op{font:900 18px var(--font);color:#ffe39a}
.cz-f-eff{margin-top:6px;font:600 11px/1.4 var(--font);color:#9fe7b4}

/* 🥫 City trash chip */
.cz-trash.warn{border-color:rgba(255,190,80,.7);color:#ffd27a}
.cz-trash.crisis{border-color:#ff6d6d;color:#ffb3b3;background:rgba(255,60,60,.15);animation:czTrash 1.6s ease-in-out infinite}
@keyframes czTrash{50%{box-shadow:0 0 12px rgba(255,80,80,.55)}}

/* 🍎 City food chip */
.cz-food.warn{border-color:rgba(255,190,80,.7);color:#ffd27a}
.cz-food.crisis{border-color:#ff6d6d;color:#ffb3b3;background:rgba(255,60,60,.15);animation:czTrash 1.6s ease-in-out infinite}
/* ⬆️ "something affordable here" dot on a section-switch tab (Menagerie Upgrades) */
.section-switch button.can{position:relative}
.section-switch button.can::after{content:"";position:absolute;top:4px;right:6px;width:7px;height:7px;border-radius:50%;background:#ffd36a;box-shadow:0 0 6px #ffd36a}
.mg-upgrades{max-width:760px;margin:0 auto}
/* 🗂️ grouped bulk-summon summary (100× / 1000× / 10 000×) — one tile per card with a ×N badge,
   tiles slide in one after another (2026-09-30) */
.summary-grouped{gap:14px}
.summary-tile{position:relative;animation:sumTileIn .45s cubic-bezier(.2,.9,.3,1.2) both;animation-delay:calc(var(--i,0) * 45ms)}
.summary-tile.rare{filter:drop-shadow(0 0 10px var(--rar))}
.summary-count{position:absolute;right:-6px;top:-8px;padding:3px 9px;border-radius:999px;font:800 13px var(--font);
  color:#fff;background:linear-gradient(135deg,var(--rar,#8b98bf),rgba(0,0,0,.55));border:1px solid rgba(255,255,255,.35);
  box-shadow:0 2px 8px rgba(0,0,0,.45);z-index:2}
.summary-flag{position:absolute;left:-4px;top:-6px;padding:2px 7px;border-radius:999px;font:800 10px var(--font);z-index:2}
.summary-flag.new{background:var(--good);color:#06210f}
.summary-flag.star{background:#ffd36a;color:#3a2600}
@keyframes sumTileIn{from{opacity:0;transform:translateY(18px) scale(.85)}to{opacity:1;transform:none}}
.bulk-intro .stage{--rar:#8b98bf}
.bulk-intro .summon-circle{border-color:var(--rar)}
.bulk-intro .bulk-count{position:absolute;font:900 44px var(--font);color:#fff;text-shadow:0 0 18px var(--rar);letter-spacing:.04em;z-index:3}
:root[data-reduced-fx] .summary-tile{animation:none}
.modal:has(.summary-grouped){width:min(940px,94vw);max-width:min(940px,94vw)}
.summary-grouped{justify-content:center}
/* 2026-09-30 (user: "opisy w tysiącach są krzywe") — every tile in a row is the same height, long texts clamped */
.summary-grouped{align-items:stretch}
.summary-tile{display:flex;flex-direction:column}
.summary-tile>.ac{flex:1 1 auto;display:flex;flex-direction:column;transform:none;margin:0}
/* padding moved OUT of the clamped box (as margin) — inside it, a half 4th/5th line peeked through */
.summary-tile>.ac .ac-flavor{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:auto 10px 10px;padding:0;max-height:calc(3 * 1.35em)}
.summary-tile>.ac .ac-eff{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;margin:0 10px 6px;padding:0;max-height:calc(4 * 1.35em);flex:0 0 auto}
/* 🔐 reactor part lock + ⏸ inactive slot (2026-09-30) */
.rx-lock.on{background:rgba(255,211,106,.18);border-color:#ffd36a}
.asc-item.rx-off{opacity:.55;filter:saturate(.4)}
/* 👤 save profiles (2026-09-30) */
.prof-input{width:100%;box-sizing:border-box;margin:8px 0 4px;padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.06);color:var(--text);font:600 14px var(--font)}
/* 💰 Economy tab + ⓘ badges (2026-09-30) */
.econ-i{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;margin-left:4px;border-radius:50%;font:700 11px var(--font);color:#fff;background:rgba(255,255,255,.14);cursor:help;vertical-align:middle;flex:none}
.hud-stat .econ-i{position:absolute;top:3px;right:3px;width:13px;height:13px;font-size:9px;opacity:.7}
.hud-stat{position:relative}
.econ-grid{display:flex;flex-direction:column;gap:6px;margin:10px 0}
.econ-row{display:grid;grid-template-columns:32px 1fr auto 110px 20px;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);cursor:help}
.econ-row:hover{background:rgba(255,255,255,.08)}
.econ-ico{font-size:20px;text-align:center}
.econ-name{font:700 13px var(--font)}
.econ-amt{font:800 14px var(--font);text-align:right}
.econ-rate{font:700 12px var(--font);color:var(--good);text-align:right}
.econ-rate.dim{color:var(--muted,#888)}
/* 🏆 trophy cabinet (2026-09-30) — wooden shelves, platinum on top; empty spots are dark silhouettes */
.tr-cabinet{max-width:620px;margin:12px auto 18px;padding:14px 14px 6px;border-radius:14px;
  background:linear-gradient(180deg,#3b2415,#26160c);border:3px solid #5a381f;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.35),inset 0 18px 30px rgba(0,0,0,.45),0 10px 24px rgba(0,0,0,.4)}
.tr-shelf{position:relative;margin-bottom:12px}
.tr-shelf-h{font:800 12px var(--font);letter-spacing:.06em;text-transform:uppercase;margin:0 0 4px 4px}
.tr-platinum .tr-shelf-h,.tr-sec.tr-platinum{color:#bfe8ff}
.tr-gold .tr-shelf-h,.tr-sec.tr-gold{color:#ffd36a}
.tr-silver .tr-shelf-h,.tr-sec.tr-silver{color:#d8dde6}
.tr-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:4px 6px;min-height:44px;padding:4px 6px 2px;
  background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.12))}
.tr-plank{height:12px;border-radius:3px;background:linear-gradient(180deg,#a0703f,#6b4424 60%,#4a2e17);
  box-shadow:0 4px 6px rgba(0,0,0,.5)}
.tr-cup{border:0;background:none;padding:0 1px;font-size:28px;line-height:1;cursor:pointer;
  filter:brightness(0) opacity(.28);transition:transform .15s}
.tr-cup:hover{transform:translateY(-3px) scale(1.12)}
.tr-silver .tr-cup.got{filter:grayscale(1) brightness(1.25) contrast(1.1) drop-shadow(0 0 4px rgba(220,230,245,.55))}
.tr-gold .tr-cup.got{filter:saturate(1.3) drop-shadow(0 0 6px rgba(255,200,80,.7))}
.tr-platinum .tr-cup{font-size:34px}
.tr-platinum .tr-cup.got{filter:grayscale(1) brightness(1.5) sepia(.25) hue-rotate(160deg) saturate(2.2) drop-shadow(0 0 8px rgba(160,225,255,.9));
  animation:trShine 2.6s ease-in-out infinite}
@keyframes trShine{50%{filter:grayscale(1) brightness(1.85) sepia(.25) hue-rotate(160deg) saturate(2.2) drop-shadow(0 0 14px rgba(190,240,255,1))}}
:root[data-reduced-fx] .tr-platinum .tr-cup.got{animation:none}
.tr-sec{margin-top:16px}
.achv-item.tr-platinum.got{border-color:#9fdcff;background:linear-gradient(150deg,rgba(160,220,255,.16),rgba(0,0,0,.12))}
.achv-item.tr-silver.got{border-color:#c9d1dc;background:linear-gradient(150deg,rgba(210,220,235,.12),rgba(0,0,0,.12))}
.achv-item.flash{animation:trFlash 1.2s ease}
@keyframes trFlash{0%,60%{box-shadow:0 0 0 3px #ffd36a,0 0 18px rgba(255,211,106,.7)}100%{box-shadow:none}}
/* every wrapped row of cups stands on its own board (row height 46px, 6px plank at its foot) */
.tr-row{row-gap:0;padding:0 6px;background:repeating-linear-gradient(180deg,rgba(0,0,0,.28) 0 40px,#7a5230 40px 44px,#3e2612 44px 46px)}
.tr-cup{height:46px;display:inline-flex;align-items:flex-end;padding-bottom:5px}
.tr-platinum .tr-cup{padding-bottom:4px}
.tr-plank{height:8px;margin-top:-2px}
/* tell platinum from silver at a glance: silver = cool grey metal, platinum = icy blue with a glow */
.tr-silver .tr-cup.got{filter:grayscale(1) brightness(.92) contrast(1.15) drop-shadow(0 0 3px rgba(200,210,225,.45))}
.tr-platinum .tr-cup.got{filter:grayscale(1) sepia(.6) hue-rotate(165deg) saturate(3.2) brightness(1.3) drop-shadow(0 0 9px rgba(140,215,255,.95))}
@keyframes trShine{50%{filter:grayscale(1) sepia(.6) hue-rotate(165deg) saturate(3.2) brightness(1.6) drop-shadow(0 0 16px rgba(170,230,255,1))}}
.tr-switch{justify-content:center}
.rc-badge.x2{background:linear-gradient(90deg,#b86bff,#ff7ad9);color:#fff}
/* ⛵🔁 trade route + 🎪 festival (2026-09-30) */
.cz-trade{max-width:720px;margin:6px auto 10px;padding:8px 12px;border-radius:12px;border:1px solid rgba(120,200,255,.35);background:linear-gradient(150deg,rgba(60,140,220,.12),rgba(0,0,0,.15))}
.cz-trade-h{font:800 13px var(--font);margin-bottom:6px}
.cz-trade-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.cz-trade-sel{font-size:18px;padding:2px 6px;border-radius:8px;background:var(--panel2,#1d1830);color:var(--text);border:1px solid var(--line)}
.cz-trade-sl{flex:1 1 120px;min-width:100px}
.cz-trade-stall{color:#ff9d6a}
.cz-fest-btn.on{border-color:#ffd36a;color:#ffd36a;box-shadow:0 0 10px rgba(255,211,106,.4)}
/* ⛏️ EXCAVATION (2026-09-30) — 6 columns × 7 visible rows */
.exc-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:center;margin:6px 0}
.exc-stat{font:800 16px var(--font);padding:4px 10px;border-radius:10px;background:rgba(255,255,255,.06)}
.exc-tool{font:800 13px var(--font);padding:6px 10px;border-radius:10px;border:1px solid var(--line);background:var(--panel2,#1d1830);color:var(--text);cursor:pointer}
.exc-tool.on{border-color:#ffd36a;box-shadow:0 0 10px rgba(255,211,106,.5);color:#ffd36a}
.exc-tool.fin{border-color:rgba(125,255,154,.5);color:#7dff9a}
.exc-haul{text-align:center}
.exc-grid{display:grid;grid-template-columns:28px repeat(6,1fr);gap:4px;max-width:440px;margin:8px auto;padding:10px;border-radius:14px;
  background:linear-gradient(180deg,#3b2a1a,#1c130b);box-shadow:inset 0 0 0 2px rgba(0,0,0,.4),inset 0 10px 24px rgba(0,0,0,.5)}
.exc-depth{font:700 10px var(--font);color:rgba(255,255,255,.35);display:flex;align-items:center;justify-content:flex-end;padding-right:4px}
.exc-cell{position:relative;aspect-ratio:1;border:0;border-radius:7px;padding:0;cursor:pointer;font-size:20px;display:grid;place-items:center;color:#fff}
.exc-cell.dirt.hp1{background:linear-gradient(160deg,#9a6b3f,#7a5230)}
.exc-cell.dirt.hp2{background:linear-gradient(160deg,#7a5230,#5a3a20)}
.exc-cell.dirt.hp3{background:linear-gradient(160deg,#5a3a20,#3e2612)}
.exc-cell.rock{background:linear-gradient(160deg,#6d6f78,#3f4149);box-shadow:inset 0 0 0 2px rgba(255,255,255,.08)}
.exc-cell.dug{background:rgba(0,0,0,.35);cursor:default}
.exc-cell.air{background:rgba(0,0,0,.55);cursor:default}
.exc-cell:disabled{cursor:default;filter:brightness(.72)}
.exc-cell.can{outline:2px solid rgba(255,211,106,.55);outline-offset:-2px;filter:none}
.exc-cell.can:hover{transform:scale(1.06)}
.exc-hp{position:absolute;right:4px;bottom:2px;font:800 10px var(--font);color:rgba(255,255,255,.75)}
.exc-glint{font-style:normal;font-size:16px;opacity:.55;filter:drop-shadow(0 0 4px rgba(255,255,255,.6));animation:excGlint 1.8s ease-in-out infinite}
@keyframes excGlint{50%{opacity:.9}}
:root[data-reduced-fx] .exc-glint{animation:none}
.exc-log{text-align:center}
.exc-relics{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:6px 0}
.exc-relic{width:52px;height:52px;border-radius:12px;display:grid;place-items:center;font-size:28px;background:rgba(255,255,255,.05);border:1px dashed var(--line);filter:grayscale(1) opacity(.5)}
.exc-relic.got{filter:none;border:1px solid #ffd36a;box-shadow:0 0 10px rgba(255,211,106,.35)}
/* 💞 Romance — ✈️ airplane · ❔ guide · 💝 anniversaries · 🎬 cinematic entrance (2026-09-30) */
.rm-plane{margin:6px 0}
.rm-plane.on{border-color:#7fd3ff;color:#7fd3ff;box-shadow:0 0 10px rgba(127,211,255,.35)}
.rm-guide{margin:8px 0;padding:8px 12px;border-radius:12px;border:1px solid rgba(255,140,200,.35);background:linear-gradient(150deg,rgba(255,120,190,.1),rgba(0,0,0,.15))}
.rm-guide summary{cursor:pointer;font:800 13px var(--font);color:#ffc2e0}
.rm-guide-steps{margin:8px 0 2px 18px;padding:0;display:flex;flex-direction:column;gap:5px;font-size:12px;line-height:1.45;color:var(--text)}
.rm-anniv{margin:8px 0}
.rm-cine-cover{position:fixed;inset:0;z-index:10050;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;opacity:0;transition:opacity .45s ease;pointer-events:all}
.rm-cine-cover.on{opacity:1}
.rm-cine-cover.out{opacity:0;transition:opacity 1.1s ease}
.rm-cine-emoji{font-size:72px;animation:rmBeat 1.1s ease-in-out infinite}
.rm-cine-line{font:700 18px var(--font);color:#ffd6ea;letter-spacing:.04em;opacity:0;animation:rmLine 1s .25s ease forwards}
@keyframes rmBeat{0%,100%{transform:scale(1)}15%{transform:scale(1.18)}30%{transform:scale(1)}45%{transform:scale(1.1)}}
@keyframes rmLine{to{opacity:1}}
.modal-ov.rm-cine-in .modal{animation:rmIn 1.4s .9s ease both}
.modal-ov.rm-cine-soft .modal{animation:rmIn .6s ease both}
@keyframes rmIn{from{opacity:0;transform:translateY(14px) scale(.98);filter:blur(3px)}to{opacity:1;transform:none;filter:none}}
:root[data-reduced-fx] .modal-ov.rm-cine-in .modal{animation:rmIn .5s ease both}
/* 💕📣 Investigations — Jessy × Charlie discipline mini-game (2026-09-30) */
.inv-lovers-art{font-size:46px;text-align:center;margin:4px 0 8px}
.inv-discipline{margin-top:10px;padding:10px;border-radius:12px;border:1px solid rgba(255,90,90,.45);background:rgba(255,60,60,.08);display:flex;flex-direction:column;align-items:center;gap:8px}
.inv-disc-h{font:800 13px var(--font);text-align:center}
.inv-disc-count{font:900 44px var(--font);color:#ff8a8a;font-variant-numeric:tabular-nums}
.inv-disc-count.t1{color:#ffd36a}.inv-disc-count.t2{color:#9fe870}.inv-disc-count.t3{color:#7fd3ff;text-shadow:0 0 12px rgba(127,211,255,.7)}
.inv-disc-timer{font:700 14px var(--font)}.inv-disc-timer.good{color:#9fe870}.inv-disc-timer.bad{color:#ff8a8a}
.inv-disc-btn{font-size:18px;padding:14px 22px;touch-action:manipulation;user-select:none}
.inv-disc-btn:active{transform:scale(.96)}

/* ⚙️✨ Reactor parts reveal (2026-09-30) */
.pr-ov{position:fixed;inset:0;z-index:9000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
  background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--rc) 22%,transparent),rgba(5,3,12,.92) 60%);opacity:0;transition:opacity .25s;cursor:pointer;
  pointer-events:auto}   /* #overlay-root is pointer-events:none — without this every tap fell through to the page (no skip, no close) */
.pr-card.pr-many{padding:14px;max-width:min(94vw,520px);max-height:86vh;overflow-y:auto}
.pr-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;width:100%}
@media (max-width:480px){.pr-grid{grid-template-columns:repeat(3,1fr)}}
.pr-cell{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:10px;border:2px solid var(--rc);
  background:color-mix(in srgb,var(--rc) 14%,rgba(10,8,20,.9));text-align:center;animation:prCellIn .35s ease-out both}
.pr-cell-emoji{font-size:24px}
.pr-cell-name{font-size:10px;line-height:1.2}
.pr-cell-rar{font-size:10px;font-weight:700;color:var(--rc)}
@keyframes prCellIn{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
:root[data-reduced-fx] .pr-cell{animation:none}
.pb-btn10{margin-top:6px}
.pr-ov.on{opacity:1}.pr-ov.off{opacity:0}
.pr-capsule{position:relative;width:170px;height:170px;display:grid;place-items:center}
.pr-ring{position:absolute;inset:calc(var(--i) * 14px);border-radius:50%;border:3px solid var(--rc);border-top-color:transparent;border-left-color:transparent;
  animation:prSpin calc(1.4s - var(--i) * .25s) linear infinite;filter:drop-shadow(0 0 8px var(--rc));opacity:.9}
.pr-ring:nth-child(even){animation-direction:reverse}
.pr-core{font-size:54px;animation:prPulse .6s ease-in-out infinite alternate;filter:drop-shadow(0 0 14px var(--rc))}
.pr-ov.r3 .pr-capsule,.pr-ov.r4 .pr-capsule,.pr-ov.r5 .pr-capsule{animation:prShake .12s linear infinite}
.pr-hint{font-size:20px;color:var(--rc);letter-spacing:.3em;animation:prPulse .4s ease-in-out infinite alternate}
.pr-ov.burst .pr-capsule{animation:prBurst .45s ease-out forwards}
.pr-ov.burst .pr-hint{display:none}
.pr-ov.burst::after{content:"";position:absolute;inset:0;background:radial-gradient(circle,#fff 0,var(--rc) 25%,transparent 60%);animation:prFlash .55s ease-out forwards;pointer-events:none}
.pr-card{position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 26px;border-radius:18px;border:2px solid var(--rc);
  background:linear-gradient(160deg,rgba(40,30,70,.95),rgba(14,10,28,.95));box-shadow:0 0 30px color-mix(in srgb,var(--rc) 60%,transparent);animation:prRise .6s .15s cubic-bezier(.2,.9,.3,1.3) both;max-width:88vw;text-align:center}
.pr-emoji{font-size:64px;filter:drop-shadow(0 0 12px var(--rc))}
.pr-name{font:900 20px var(--font)}
.pr-rar{font:800 14px var(--font);color:var(--rc);letter-spacing:.1em}
.pr-eff{font-size:13px;color:var(--text)}
.pr-tap{font-size:11px;color:var(--muted);margin-top:4px}
@keyframes prSpin{to{transform:rotate(360deg)}}
@keyframes prPulse{from{transform:scale(.94)}to{transform:scale(1.08)}}
@keyframes prShake{25%{transform:translate(2px,-1px)}50%{transform:translate(-2px,1px)}75%{transform:translate(1px,2px)}}
@keyframes prBurst{to{transform:scale(1.8);opacity:0}}
@keyframes prFlash{from{opacity:1}to{opacity:0}}
@keyframes prRise{from{opacity:0;transform:translateY(30px) scale(.8)}to{opacity:1;transform:none}}
:root[data-reduced-fx] .pr-ring,:root[data-reduced-fx] .pr-capsule{animation:none}
.rs-biuro-info{margin:6px 0 10px;padding:8px 12px;border-radius:12px;border:1px solid rgba(160,120,255,.35);background:rgba(120,80,220,.08)}.rs-biuro-info summary{cursor:pointer;font:800 13px var(--font)}.rs-biuro-links{margin:8px 0 2px 18px;padding:0;display:flex;flex-direction:column;gap:5px;font-size:12px;line-height:1.45}
/* 🕵️ Investigations — noir case board (2026-09-30) */
.inv-noir{--noir-paper:#e9dfc8;--noir-ink:#2a2118;--noir-red:#b3261e;position:relative;padding:12px;border-radius:16px;
  background:radial-gradient(circle at 20% 0%,rgba(255,220,150,.08),transparent 55%),repeating-linear-gradient(45deg,#3a2c20 0 6px,#35281d 6px 12px);
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.4),inset 0 20px 40px rgba(0,0,0,.45)}
.inv-noir .inv-banner{margin:0 0 10px;padding:12px 14px;border-radius:6px;background:var(--noir-paper);color:var(--noir-ink);transform:rotate(-.6deg);
  box-shadow:0 6px 14px rgba(0,0,0,.45);position:relative;font-family:"Courier New",Courier,monospace}
.inv-noir .inv-banner::before{content:"";position:absolute;top:-6px;left:50%;width:14px;height:14px;border-radius:50%;background:var(--noir-red);box-shadow:0 2px 3px rgba(0,0,0,.5)}
.inv-banner-t{font-weight:900;font-size:17px;letter-spacing:.12em}
.inv-banner-s{font-size:12px;opacity:.75;margin-top:2px}
.inv-noir .section-title{font-family:"Courier New",Courier,monospace;letter-spacing:.14em;color:#f1e3c2}
.inv-noir .rates-note{color:#e6d8bb}
.inv-noir .asc-item{background:var(--noir-paper);color:var(--noir-ink);border:1px solid #c9b995;border-radius:4px;box-shadow:0 4px 10px rgba(0,0,0,.35);position:relative}
.inv-noir .asc-item:nth-child(odd){transform:rotate(-.35deg)}.inv-noir .asc-item:nth-child(even){transform:rotate(.35deg)}
.inv-noir .asc-item::after{content:"";position:absolute;top:-5px;right:18px;width:10px;height:10px;border-radius:50%;background:var(--noir-red);box-shadow:0 1px 2px rgba(0,0,0,.5)}
.inv-noir .asc-item .asc-name{color:var(--noir-ink);font-family:"Courier New",Courier,monospace;font-weight:900}
.inv-noir .asc-item .asc-desc{color:#4a3d2e}
.inv-noir .inv-active{background:#f3e7c9;color:var(--noir-ink);border-radius:4px;padding:10px 12px;margin:8px 0;box-shadow:0 5px 12px rgba(0,0,0,.4);position:relative;overflow:hidden}
.inv-noir .inv-active::before{content:"IN PROGRESS";position:absolute;top:10px;right:-28px;transform:rotate(18deg);font:900 11px "Courier New",monospace;letter-spacing:.2em;color:var(--noir-red);border:2px solid var(--noir-red);padding:2px 26px;opacity:.55}
.inv-noir .inv-active .rates-note,.inv-noir .inv-active .exp-left{color:#4a3d2e}
.inv-noir .inv-active-h{font:900 14px "Courier New",monospace}
:root[data-lang="pl"] .inv-noir .inv-active::before{content:"W TOKU"}

/* 🍶 softcap bottles (0.0.23) — Madoka pink, Homura violet */
.sc-bottle-wrap{display:flex;gap:14px;align-items:center;margin:10px 0;padding:8px 10px;border-radius:12px;background:rgba(255,255,255,.04)}
.sc-bottle{width:76px;height:108px;flex:0 0 auto;overflow:visible}
.sc-glass{fill:none;stroke:rgba(255,255,255,.75);stroke-width:2.2}
.sc-glass-bg{fill:rgba(255,255,255,.06)}
.sc-shine{fill:none;stroke:rgba(255,255,255,.35);stroke-width:2.5;stroke-linecap:round}
.sc-capline{stroke:#ffd76a;stroke-width:1.6;stroke-dasharray:4 3}
.sc-liquid{transition:transform 1.2s cubic-bezier(.3,.8,.3,1)}
.sc-wave{animation:scWave 3.2s linear infinite}
@keyframes scWave{from{transform:translateX(0)}to{transform:translateX(50px)}}
.sc-bub{fill:rgba(255,255,255,.55);animation:scBub 3.6s ease-in infinite;opacity:0}
.sc-bub.b2{animation-delay:1.2s}.sc-bub.b3{animation-delay:2.3s}
@keyframes scBub{0%{transform:translateY(0);opacity:0}15%{opacity:.8}100%{transform:translateY(-70px);opacity:0}}
.sc-madoka .sc-liq-a{stop-color:#ffb3d9}.sc-madoka .sc-liq-b{stop-color:#e2468f}
.sc-homura .sc-liq-a{stop-color:#c59bff}.sc-homura .sc-liq-b{stop-color:#5b1f9e}
.sc-madoka .sc-bottle{filter:drop-shadow(0 0 8px rgba(255,120,190,.35))}
.sc-homura .sc-bottle{filter:drop-shadow(0 0 8px rgba(160,90,255,.4))}
.sc-bottle-txt{min-width:0;font-size:.85em;line-height:1.35}
.sc-bottle-title{font-weight:700;margin-bottom:2px}
.sc-bottle-line.dim{opacity:.7}
.sc-bottle-line.warn{color:#ffd76a}
.sc-bottle-line.ok{color:#9fe6b0}
:root[data-reduced-fx] .sc-wave,:root[data-reduced-fx] .sc-bub{animation:none}
:root[data-reduced-fx] .sc-bottle{filter:none}
@media (prefers-reduced-motion:reduce){.sc-wave,.sc-bub{animation:none}}
/* 🏠 one welcome-back panel (0.0.23) */
.away-sum-h{margin:12px 0 4px;font-weight:700;font-size:.95rem;opacity:.9}
.away-sum-list{display:flex;flex-direction:column;gap:3px;max-height:40vh;overflow:auto}
.away-sum-row{font-size:.92em;padding:2px 0}
/* ⏱️ BIURO live hunt timer */
.biuro-hunt-live{display:flex;gap:12px;align-items:center;padding:10px 12px;margin:6px 0;border-radius:12px;background:rgba(255,215,106,.08);border:1px solid rgba(255,215,106,.35)}
.biuro-hunt-ico{font-size:1.8em;animation:biuroSneak 1.6s ease-in-out infinite}
@keyframes biuroSneak{0%,100%{transform:translateX(0)}50%{transform:translateX(5px)}}
:root[data-reduced-fx] .biuro-hunt-ico{animation:none}
.biuro-hunt-mid{flex:1;min-width:0}
.biuro-hunt-line b{color:#ffd76a;font-variant-numeric:tabular-nums}
.biuro-hunt-fill{transition:width .3s linear;background:linear-gradient(90deg,#ffd76a,#ff9f43)}
.biuro-tab-timer{font-variant-numeric:tabular-nums;margin-left:2px;color:#ffd76a}

/* 🎀 Homura cosmetics */
.ac.ac-ribbon{box-shadow:0 0 0 2px #9b5cff,0 0 14px rgba(155,92,255,.55)}
.ac-ribbon-badge{position:absolute;top:-6px;right:-4px;font-size:1.05em;z-index:3;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6));pointer-events:none}
#version-badge .loop-badge{margin-right:6px;opacity:.9}
.cos-row{display:flex;flex-wrap:wrap;gap:6px 14px}
.cos-row label{display:flex;gap:6px;align-items:center;cursor:pointer}

/* 👥🪞 Dungeon spectres (Echo Split / Lustro) */
.dg-spectre{margin:6px 0 4px;padding:6px 8px;border-radius:10px;border:1px dashed rgba(170,140,255,.6);background:rgba(120,90,255,.08)}
.dg-spectre.lustro{border-color:rgba(160,220,255,.6);background:rgba(120,200,255,.08)}
.dg-spectre-name{font-size:.88em;font-weight:700}
.dg-bar.spectre i{background:linear-gradient(90deg,#b49cff,#e0d6ff);opacity:.9}
.dg-spectre.lustro .dg-bar.spectre i{background:linear-gradient(90deg,#8fd8ff,#e6f7ff)}
/* 🖼️ memory with its own picture (Romance Editor) — full opacity, taller in the big view */
.mem-card .mem-portrait.has-img .ac-img.mem-img{opacity:1;object-position:center}
.mem-card.big .mem-portrait.has-img{height:min(52vh,340px)}

/* 🦍 Night Club bouncer */
.nc-bouncer{flex:1 1 100%;width:100%;box-sizing:border-box;margin:8px 0;padding:8px 10px;border-radius:10px;border:1px dashed rgba(255,255,255,.18);background:rgba(0,0,0,.18)}
.nc-bouncer.on{border-style:solid;border-color:rgba(255,92,120,.55);background:rgba(120,20,40,.18)}
.nc-bouncer-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.nc-bouncer-row b{flex:1}
.nc-bouncer-ico{font-size:1.6em}
.nc-bouncer.on .nc-bouncer-ico{animation:ncBouncer 2.4s ease-in-out infinite}
@keyframes ncBouncer{0%,100%{transform:translateX(0)}50%{transform:translateX(3px)}}
:root[data-reduced-fx] .nc-bouncer-ico{animation:none}
.nc-door.has-bouncer{flex-wrap:wrap;gap:6px 12px}

/* 🔁 Caravan on Autopilot */
.exp-slot.auto{box-shadow:0 0 0 2px rgba(120,220,160,.55) inset}
.exp-auto-badge{margin-left:auto;font-size:14px;animation:expAutoSpin 4s linear infinite;display:inline-block}
@keyframes expAutoSpin{to{transform:rotate(360deg)}}
:root[data-reduced-fx] .exp-auto-badge{animation:none}
.exp-auto-box{margin:10px 0;padding:10px 12px;border-radius:12px;border:1px dashed rgba(255,255,255,.18);background:rgba(0,0,0,.18)}
.exp-auto-box.on{border-style:solid;border-color:rgba(120,220,160,.5);background:rgba(40,110,70,.15)}
.exp-auto-title{font-weight:800;margin-bottom:4px}
.exp-auto-line{font-size:13px;margin-bottom:4px}

/* 🎖️ Standing Orders — the self-redeploying loadout */
.dg-preset.auto{box-shadow:0 0 0 2px rgba(255,207,90,.6) inset}
.dg-mini.on{border-color:#ffcf5a;color:#ffcf5a}

/* 🎬 World Eater duel (js/world-eater.js) — replaces the Dungeon panel while it runs */
.we-arena{position:relative;overflow:hidden;border-radius:14px;border:1px solid #3a1d3e;background:radial-gradient(ellipse at 50% 30%,#2a0f2e,#09030c 70%);
  padding:30px 12px 30px;opacity:0;transition:opacity .6s;min-height:520px}
.we-arena.on{opacity:1}
.we-arena.dg-hit{animation:dgHit .16s ease-out}.we-arena.dg-crit{animation:dgCrit .28s ease-out}.we-arena.dg-kill{animation:dgKill .3s ease-out}
.we-bar{position:absolute;left:0;right:0;height:26px;background:#000;z-index:5;transition:height .8s ease}
.we-bar.top{top:0}.we-bar.bottom{bottom:0}
.we-arena.on .we-bar{height:22px}
.we-stage{position:relative;min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;cursor:pointer}
.we-foe{position:relative;width:190px;height:190px;display:grid;place-items:center;margin-top:8px}
.we-foe-emoji{font-size:118px;line-height:1;filter:drop-shadow(0 0 22px #b03cff);animation:weBreathe 3.2s ease-in-out infinite}
.we-foe-eyes{position:absolute;top:44%;font-size:22px;letter-spacing:10px;animation:weBlink 4.5s infinite}
.we-cultists{position:absolute;inset:0;animation:weOrbit 14s linear infinite}
.we-cultist{position:absolute;left:50%;top:50%;font-size:22px;transform:rotate(calc(var(--i) * 90deg)) translate(104px) rotate(calc(var(--i) * -90deg));transition:opacity .5s,filter .5s}
.we-cultist.down{opacity:.12;filter:grayscale(1)}
.we-foe-info{width:min(100%,420px);text-align:center}
.we-foe-name{font-weight:800;letter-spacing:.04em;color:#f1d3ff;font-size:13px}
.we-foe-sub{font-size:11px;color:var(--muted);min-height:14px}
.we-foe-bar{height:12px}
.we-arena.final .we-foe-emoji{font-size:140px;filter:drop-shadow(0 0 30px #ff3c6e)}
.we-arena.enraged .we-foe-emoji{animation:weBreathe .9s ease-in-out infinite;filter:drop-shadow(0 0 34px #ff2020) saturate(1.6)}
.we-arena.warded .we-foe::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:3px solid #8fd3ff;box-shadow:0 0 24px #8fd3ff inset,0 0 18px #8fd3ff;animation:wePulse .5s ease-in-out infinite alternate}
.we-arena.rallying .we-hero{box-shadow:0 0 0 2px var(--gold),0 0 22px var(--gold)}
.we-arena.slowmo .we-stage{filter:contrast(1.25) saturate(1.3)}
.we-arena.telling .we-foe-emoji{transform:scale(1.12)}
.we-tell{position:absolute;top:22%;font-size:64px;opacity:0;pointer-events:none;transition:opacity .15s;filter:drop-shadow(0 0 16px #ff3030)}
.we-tell.on{opacity:1;animation:wePulse .25s ease-in-out infinite alternate}
.we-tell.braced{filter:drop-shadow(0 0 16px #8fd3ff);opacity:.5}
.we-title{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;
  background:#0009;opacity:0;pointer-events:none;transition:opacity .4s;z-index:3;padding:0 16px}
.we-title.on{opacity:1}
.we-title b{font-size:26px;letter-spacing:.08em;color:#ffe3ff;text-shadow:0 0 18px #b03cff}
.we-title small{font-size:12px;letter-spacing:.3em;color:var(--muted)}
.we-title.small b{font-size:18px}
.we-caption{position:absolute;bottom:4px;left:6px;right:6px;text-align:center;font-style:italic;font-size:13px;color:#f3e6ff;text-shadow:0 1px 3px #000;
  opacity:0;transition:opacity .35s;z-index:4;pointer-events:none}
.we-caption.on{opacity:1}
.we-caption.warn{color:#ffb3b3;font-style:normal;font-weight:800}
.we-floats{position:absolute;inset:0;pointer-events:none;z-index:2}
.we-float{position:absolute;left:50%;top:40%;transform:translateX(-50%);font-weight:900;font-size:18px;color:#fff;text-shadow:0 0 8px #000;white-space:nowrap;animation:weFloat 1.4s ease-out forwards}
.we-float.crit{color:#ff6b6b;font-size:24px}.we-float.brace{color:#8fd3ff}.we-float.rally{color:var(--gold)}.we-float.ward{color:#8fd3ff}.we-float.enrage{color:#ff3b3b;font-size:22px}
.we-slots{justify-content:center;margin-top:10px}
.we-hero{max-width:260px;margin:0 auto;position:relative;transition:box-shadow .3s}
.we-hero-img{width:64px;height:64px;object-fit:cover;border-radius:10px;display:block;margin:0 auto 4px}
.we-ctl{justify-content:center;margin-top:8px}
.we-brace.hot{animation:wePulse .25s ease-in-out infinite alternate;border-color:#ff5050;color:#fff;background:#5a1010}
.we-end{position:absolute;inset:0;z-index:6;display:none;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:24px;background:#000c}
.we-end.on{display:flex;animation:weFade .8s ease-out}
.we-end-title{font-size:26px;font-weight:900;letter-spacing:.06em}
.we-end.won .we-end-title{color:var(--gold);text-shadow:0 0 20px var(--gold)}
.we-end.lost .we-end-title{color:#ff8080}
.we-end-text{max-width:420px;font-size:13px;color:#ddd}
@keyframes weBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes weBlink{0%,92%,100%{opacity:1}95%{opacity:0}}
@keyframes weOrbit{to{transform:rotate(360deg)}}
@keyframes wePulse{from{opacity:.65}to{opacity:1}}
@keyframes weFloat{from{opacity:1;transform:translate(-50%,0)}to{opacity:0;transform:translate(-50%,-70px)}}
@keyframes weFade{from{opacity:0}to{opacity:1}}
:root[data-reduced-fx] .we-arena *,:root[data-reduced-fx] .we-arena{animation:none !important}

/* 🗺️ Dungeon Crawl — roguelite panels, skill bar, boon cards (2026-10-04) */
.dc-panel{margin:8px 0;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(120,140,220,.07)}
.dc-panel.good{border-color:rgba(255,215,110,.55);background:rgba(255,200,80,.08)}
.dc-panel.bad{border-color:rgba(255,90,90,.45);background:rgba(255,60,60,.08)}
.dc-panel.dc-mod{font-size:12.5px;line-height:1.5}
.dc-panel .dim{opacity:.7}
.dc-panel-title{font-family:var(--font);font-weight:800;font-size:14px;margin-bottom:6px}
.dc-panel-sub{font-weight:700;font-size:12px;margin:8px 0 4px}
.dc-boons{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin:6px 0 10px}
.dc-boon{display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 8px;border-radius:10px;cursor:pointer;
  border:1px solid rgba(190,160,255,.45);background:linear-gradient(180deg,rgba(139,92,255,.18),rgba(20,24,40,.6));color:inherit;font:inherit;
  transition:transform .12s,border-color .12s}
.dc-boon:hover{transform:translateY(-2px);border-color:var(--accent)}
.dc-boon-ico{font-size:24px}
.dc-boon-name{font-weight:800;font-size:12.5px;text-align:center}
.dc-boon-desc{font-size:11px;opacity:.8;text-align:center;line-height:1.3}
.dc-skills{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.dc-skill{position:relative;display:flex;align-items:center;gap:6px;min-width:0;flex:1 1 110px;padding:6px 8px;border-radius:10px;
  border:1px solid rgba(140,190,255,.4);background:rgba(60,90,160,.18);color:inherit;font:inherit;cursor:pointer;text-align:left}
.dc-skill:disabled{opacity:.45;cursor:default}
.dc-skill.potion{flex:0 0 auto;justify-content:center;font-weight:800;font-size:12px}
.dc-skill-ico{font-size:20px}
.dc-skill-lab{display:flex;flex-direction:column;line-height:1.15;min-width:0;overflow:hidden}
.dc-skill-lab b{font-size:12px}
.dc-skill-lab small{font-size:10px;opacity:.7;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dc-skill-cd{margin-left:auto;font-weight:800;font-size:11px;opacity:.8;padding-left:4px}
/* 🗺️ Dungeon Crawl — feel pass (2026-10-04) */
.dc-hpbar{height:6px;border-radius:4px;background:rgba(255,80,100,.15);overflow:hidden;margin:-2px 0 6px}
.dc-hpbar-fill{height:100%;background:linear-gradient(90deg,#ff5a78,#ffb36a);transition:width .15s linear}
.dc-skill{overflow:hidden}
.dc-skill-fill{position:absolute;left:0;right:0;bottom:0;height:0;background:rgba(0,0,0,.35);pointer-events:none}
.dc-skill > *:not(.dc-skill-fill){position:relative}
.dc-boon{position:relative;animation:dcFlip .5s cubic-bezier(.2,.8,.3,1.2) both;perspective:600px}
@keyframes dcFlip{from{transform:rotateY(90deg) scale(.85);opacity:0}to{transform:none;opacity:1}}
.dc-boon-rar{font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;opacity:.75}
.dc-boon.r-r{border-color:rgba(110,180,255,.8);background:linear-gradient(180deg,rgba(80,150,255,.22),rgba(20,24,40,.6))}
.dc-boon.r-r .dc-boon-rar{color:#9fd0ff;opacity:1}
.dc-boon.r-e{border-color:rgba(255,200,90,.9);background:linear-gradient(180deg,rgba(255,170,60,.25),rgba(60,20,80,.6));box-shadow:0 0 14px rgba(255,190,80,.35)}
.dc-boon.r-e .dc-boon-rar{color:#ffd76a;opacity:1}
.dc-boon-syn{font-size:10.5px;font-weight:800;color:#ffd76a;margin-top:2px;text-align:center}
.dc-panel.cursed{border-color:rgba(176,112,255,.6);background:rgba(120,60,200,.12)}
.dc-panel.summary{position:relative;overflow:hidden}
.dc-sum-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}
.dc-sum-cell{padding:6px;border-radius:8px;background:rgba(255,255,255,.04);text-align:center}
.dc-sum-v{font-weight:800;font-size:13px}
.dc-sum-k{font-size:10px;opacity:.7}
.dc-confetti{position:absolute;top:-10px;width:6px;height:10px;border-radius:2px;pointer-events:none;animation:dcConf 2s ease-in forwards}
@keyframes dcConf{0%{transform:translateY(0) rotate(0);opacity:1}100%{transform:translateY(260px) rotate(540deg);opacity:0}}
.dc-codex{margin:8px 0;border:1px solid var(--line);border-radius:10px;padding:6px 10px;background:rgba(255,255,255,.02)}
.dc-codex > summary{cursor:pointer;font-weight:800;font-size:13px}
.dc-codex-list{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.dc-codex-row{display:flex;align-items:center;gap:8px;font-size:12px}
.dc-codex-row.unknown{opacity:.5}
.dc-codex-ico{font-size:20px;width:28px;text-align:center}
.dc-codex-body{flex:1;min-width:0}
.dc-codex-body .dim{opacity:.75;font-size:11px}
.dc-codex-kills{font-size:11px;opacity:.8;white-space:nowrap}
@media (prefers-reduced-motion: reduce){.dc-boon{animation:none}.dc-confetti{display:none}}

/* 🛡️ Base Defense — tempo / freshness / juice pass (2026-10-04) */
.bd-speed{display:inline-flex;align-items:center;gap:3px;padding:2px 4px;border-radius:10px;border:1px solid var(--line)}
.bd-speed-lab{font-size:12px;padding:0 3px}
.bd-speed-btn{min-width:34px;padding:5px 6px}
.bd-abilities{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.bd-ab{position:relative;overflow:hidden;display:flex;align-items:center;gap:6px;flex:1 1 120px;padding:6px 8px;border-radius:10px;
  border:1px solid rgba(255,190,120,.4);background:rgba(160,90,40,.16);color:inherit;font:inherit;cursor:pointer;text-align:left}
.bd-ab.on{border-color:#ffb347;box-shadow:0 0 0 2px rgba(255,179,71,.35) inset}
.bd-ab:disabled{opacity:.45;cursor:default}
.bd-ab-fill{position:absolute;left:0;right:0;bottom:0;height:0;background:rgba(0,0,0,.35);pointer-events:none}
.bd-ab > *:not(.bd-ab-fill){position:relative}
.bd-ab-ico{font-size:20px}
.bd-ab-lab{display:flex;flex-direction:column;line-height:1.15}
.bd-ab-lab b{font-size:12px}.bd-ab-lab small{font-size:10px;opacity:.75}
.bd-preview{margin:8px 0;padding:8px 10px;border-radius:12px;border:1px solid var(--line);background:rgba(120,150,230,.06)}
.bd-preview-head{font-weight:800;font-size:13px;margin-bottom:5px}
.bd-boss-tag{color:#ff9a9a}
.bd-preview-chips{display:flex;flex-wrap:wrap;gap:5px}
.bd-chip{font-size:12px;padding:3px 7px;border-radius:8px;background:rgba(255,255,255,.06);border:1px solid var(--line)}
.bd-chip.mod{border-color:rgba(255,190,90,.5);color:#ffd9a0}
.bd-preview-sub{font-weight:700;font-size:12px;margin:8px 0 4px}
.bd-contracts{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:6px}
.bd-contract{padding:7px 8px;border-radius:10px;border:1px solid rgba(190,160,255,.35);background:rgba(120,80,220,.12);color:inherit;font:inherit;cursor:pointer;text-align:left}
.bd-contract.on{border-color:#ffd76a;background:rgba(255,200,80,.16);box-shadow:0 0 10px rgba(255,200,80,.25)}
.bd-contract-name{font-weight:800;font-size:12px}
.bd-contract-desc{font-size:11px;opacity:.8;margin-top:2px}
.bd-rapid,.bd-early{display:block;width:100%;margin:6px 0}
.bd-rapid{border-color:rgba(140,220,160,.5)}
.bd-relic-panel{margin:8px 0;padding:10px;border-radius:12px;border:1px solid rgba(255,215,110,.55);background:rgba(255,200,80,.08)}
.bd-relic-head{font-weight:800;font-size:13px;margin-bottom:6px}
.bd-relic-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px}
.bd-relic{display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 7px;border-radius:10px;cursor:pointer;color:inherit;font:inherit;
  border:1px solid rgba(255,215,110,.5);background:linear-gradient(180deg,rgba(255,190,80,.18),rgba(20,24,40,.6));animation:dcFlip .5s cubic-bezier(.2,.8,.3,1.2) both}
.bd-relic:hover{border-color:#ffd76a}
.bd-relic-ico{font-size:22px}.bd-relic-name{font-weight:800;font-size:12px;text-align:center}.bd-relic-desc{font-size:11px;opacity:.8;text-align:center}
.bd-summary{margin:8px 0;padding:8px 10px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.03)}
.bd-summary-head{font-weight:800;font-size:13px;margin-bottom:6px}
.bd-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:6px}
.bd-summary-cell{padding:5px;border-radius:8px;background:rgba(255,255,255,.04);text-align:center}
.bd-summary-v{font-weight:800;font-size:12px}.bd-summary-k{font-size:10px;opacity:.7}
@media (prefers-reduced-motion: reduce){.bd-relic{animation:none}}

/* 🏴‍☠️ BD raid countdown (2026-10-06) */
#hud-raid-box.raid-soon{animation:raidPulse 1s ease-in-out infinite}#hud-raid-box.raid-soon b{color:#ff6b6b}
@keyframes raidPulse{50%{background:rgba(255,60,60,.18)}}
.bd-raid-note{border-left:3px solid #ff6b6b;color:#ffb3b3}

/* 🌙 Night Club look climbs with Renown (2026-10-06): tier 1 neon · 2 velvet · 3 disco · 4 gold · 5 legend */
.nc-club{border-radius:14px;transition:background .6s,box-shadow .6s}
.nc-club.nc-tier-1{background:linear-gradient(180deg,rgba(120,40,160,.10),transparent 60%)}
.nc-club.nc-tier-1 .section-title{text-shadow:0 0 8px rgba(255,90,200,.55)}
.nc-club.nc-tier-2{background:linear-gradient(180deg,rgba(150,20,60,.16),rgba(60,0,40,.06) 70%)}
.nc-club.nc-tier-2 .section-title{color:#ff9ad5;text-shadow:0 0 10px rgba(255,60,160,.7)}
.nc-club.nc-tier-3{background:radial-gradient(circle at 20% 0,rgba(255,80,200,.18),transparent 45%),radial-gradient(circle at 80% 0,rgba(80,200,255,.16),transparent 45%),linear-gradient(180deg,rgba(60,0,80,.2),transparent 75%);animation:ncDisco 6s linear infinite}
.nc-club.nc-tier-3 .section-title{color:#ffc4f0;text-shadow:0 0 12px rgba(255,80,220,.85),0 0 22px rgba(80,200,255,.45)}
.nc-club.nc-tier-4{background:radial-gradient(circle at 50% 0,rgba(255,210,110,.20),transparent 50%),linear-gradient(180deg,rgba(80,20,10,.25),transparent 75%);box-shadow:inset 0 0 0 1px rgba(255,211,106,.35)}
.nc-club.nc-tier-4 .section-title{color:#ffe08a;text-shadow:0 0 12px rgba(255,200,80,.85)}
.nc-club.nc-tier-5{background:radial-gradient(circle at 20% 0,rgba(255,80,200,.22),transparent 45%),radial-gradient(circle at 80% 0,rgba(255,210,110,.22),transparent 45%),linear-gradient(180deg,rgba(40,0,60,.3),transparent 80%);box-shadow:inset 0 0 0 1px rgba(255,211,106,.5),0 0 24px rgba(255,80,200,.25);animation:ncDisco 4s linear infinite}
.nc-club.nc-tier-5 .section-title{color:#fff0b3;text-shadow:0 0 14px rgba(255,210,110,.95),0 0 26px rgba(255,80,220,.6)}
@keyframes ncDisco{50%{filter:hue-rotate(25deg)}}
.nc-perk.locked{opacity:.55}
@media (prefers-reduced-motion:reduce){.nc-club{animation:none!important}}

/* ✨ Riri (Useless Goddesses) — gold frame, a little see-through (2026-10-06, user) */
.ac.card-riri{border-color:#ffd56a;
  background:linear-gradient(160deg,rgba(255,240,200,.16),rgba(255,120,190,.10) 45%,rgba(40,20,60,.35)),rgba(30,20,50,.35);
  -webkit-backdrop-filter:blur(3px) saturate(1.2);backdrop-filter:blur(3px) saturate(1.2);
  box-shadow:inset 0 0 0 2px rgba(255,215,110,.95),inset 0 0 0 4px rgba(255,240,190,.25),0 0 12px rgba(255,205,90,.45)}
.ac.card-riri .ac-portrait,.ac.card-riri img{opacity:.88}
.ac.card-riri .ac-top{background:linear-gradient(90deg,#ffe596,#e0b44a 55%,transparent);color:#3a2600}
.ac.card-riri.riri-slayer{box-shadow:inset 0 0 0 3px #ffd56a,inset 0 0 0 5px rgba(255,240,190,.35),0 0 18px rgba(255,200,80,.7);animation:ririGlint 3.5s ease-in-out infinite}
.card-detail.card-riri .cd-card{box-shadow:0 0 0 3px #ffd56a,0 0 0 6px rgba(255,240,190,.3),0 0 26px rgba(255,205,90,.55);background-color:rgba(30,20,50,.55)}
.card-detail.card-riri .cd-card img{opacity:.9}
@keyframes ririGlint{50%{box-shadow:inset 0 0 0 3px #fff0b0,inset 0 0 0 5px rgba(255,240,190,.5),0 0 26px rgba(255,215,110,.9)}}
:root[data-reduced-fx] .ac.card-riri{-webkit-backdrop-filter:none;backdrop-filter:none;animation:none}

/* 💾 Expedition loadouts (2026-10-06) */
.exp-loadouts{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 8px}
.exp-lo{display:flex;align-items:stretch;border:1px solid rgba(255,255,255,.15);border-radius:10px;overflow:hidden;background:rgba(255,255,255,.04)}
.exp-lo.empty{opacity:.6}
.exp-lo-load{background:none;border:0;color:inherit;padding:6px 8px;font-size:12px;cursor:pointer;max-width:170px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.exp-lo-load:disabled{cursor:default}
.exp-lo-save{background:rgba(255,255,255,.08);border:0;border-left:1px solid rgba(255,255,255,.12);color:inherit;padding:0 8px;cursor:pointer}
.exp-lo-save:disabled{opacity:.35;cursor:default}

/* 🎬 Dungeon arena (2026-10-06) — biomes every 10 floors, living monster, depth meter, ticker, Rally ring, FX canvas */
.dg-fx-canvas{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:150}
.dg-arena{position:relative;border-radius:16px;padding:10px;overflow:hidden;
  background:linear-gradient(180deg,rgba(255,255,255,.04),transparent 60%),var(--dg-biome,#141a2a)}
.dg-arena::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;background:var(--dg-biome-fx,none)}
.dg-arena > *{position:relative}
.dg-biome-crypt{--dg-biome:linear-gradient(180deg,#1b1a2c,#0d0c16);--dg-biome-fx:radial-gradient(60% 40% at 50% 100%,rgba(120,110,170,.25),transparent 70%)}
.dg-biome-forest{--dg-biome:linear-gradient(180deg,#123222,#08160f);--dg-biome-fx:radial-gradient(40% 30% at 20% 0,rgba(140,255,150,.18),transparent 70%),radial-gradient(40% 30% at 80% 10%,rgba(220,255,140,.14),transparent 70%)}
.dg-biome-lava{--dg-biome:linear-gradient(180deg,#2a120c,#130605);--dg-biome-fx:radial-gradient(70% 45% at 50% 110%,rgba(255,110,40,.35),transparent 70%)}
.dg-biome-ice{--dg-biome:linear-gradient(180deg,#14283a,#0a1420);--dg-biome-fx:radial-gradient(50% 35% at 30% 0,rgba(180,230,255,.22),transparent 70%)}
.dg-biome-void{--dg-biome:linear-gradient(180deg,#1a0d2a,#05030a);--dg-biome-fx:radial-gradient(45% 35% at 70% 20%,rgba(190,90,255,.25),transparent 70%),radial-gradient(30% 25% at 20% 80%,rgba(80,200,255,.15),transparent 70%)}
.dg-combat.dg-arena{grid-template-columns:1fr}
.dg-arena .dg-monster{background:rgba(0,0,0,.28);flex-direction:column;align-items:center;text-align:center;min-height:170px;padding-top:16px}
.dg-arena .dg-mon-info{width:100%}
.dg-arena .dg-mon-emoji{font-size:72px;animation:dgBob 2.4s ease-in-out infinite;transform-origin:50% 90%}
.dg-arena .dg-monster.boss .dg-mon-emoji{font-size:86px;animation:dgBob 2.4s ease-in-out infinite,dg-boss-pulse 1.6s ease-in-out infinite}
.dg-arena .dg-mon-emoji.fx-hit{filter:brightness(2.2) drop-shadow(0 0 12px #fff)}
@keyframes dgBob{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-6px) rotate(1.5deg)}}
.dg-mon-hpbar{flex-basis:100%;height:8px;border-radius:6px;background:rgba(0,0,0,.5);overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.dg-mon-hpbar i{display:block;height:100%;background:linear-gradient(90deg,#ff4d4d,#ff9a4d);transition:width .35s ease}
.dg-arena.rally-on{box-shadow:inset 0 0 0 2px rgba(255,207,90,.7),0 0 18px rgba(255,190,60,.35)}
.dg-depth{grid-column:1/-1;font-size:11px;color:var(--muted)}
.dg-depth-track{display:flex;gap:3px;margin-top:4px}
.dg-depth-track i{flex:1;height:6px;border-radius:3px;background:rgba(255,255,255,.12)}
.dg-depth-track i.done{background:#7cc8ff}
.dg-depth-track i.here{background:#fff;box-shadow:0 0 6px #fff}
.dg-depth-track i.boss{background:#ffb020}
.dg-ticker .dg-log-line{opacity:.55;transition:opacity .3s}
.dg-ticker .dg-log-line.latest{opacity:1;color:var(--text,#fff);font-weight:700}
.dg-slot-status{font-size:11px;letter-spacing:2px;margin-top:2px}
.dg-slot.rallied{box-shadow:0 0 0 2px rgba(255,207,90,.8),0 0 12px rgba(255,190,60,.45)}
.dg-rally{position:relative;background-image:conic-gradient(rgba(255,207,90,.55) calc(var(--rp,1)*360deg),transparent 0)}
.dg-rally.ready{animation:dgRallyGlow 1.6s ease-in-out infinite}
.dg-rally.active{box-shadow:0 0 0 2px #ffcf5a,0 0 22px rgba(255,190,60,.8)}
@keyframes dgRallyGlow{0%,100%{box-shadow:0 0 0 2px rgba(255,207,90,.6),0 0 8px rgba(255,190,60,.4)}50%{box-shadow:0 0 0 3px #ffcf5a,0 0 24px rgba(255,190,60,.9)}}
:root[data-reduced-fx] .dg-arena .dg-mon-emoji,:root[data-reduced-fx] .dg-rally.ready{animation:none}
:root[data-reduced-fx] .dg-fx-canvas{display:none}

/* 🌸 Madoka's Blessing offer (2026-10-06) */
.bless-wrap{margin:8px 0 14px;padding:10px;border-radius:14px;background:linear-gradient(180deg,rgba(255,154,213,.12),transparent);border:1px solid rgba(255,154,213,.35)}
.bless-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-top:6px}
.bless-card{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;border-radius:12px;border:1px solid rgba(255,214,240,.5);background:rgba(40,10,40,.45);color:inherit;cursor:pointer;text-align:center}
.bless-card:hover{box-shadow:0 0 0 2px #ff9ad5,0 0 18px rgba(255,154,213,.5)}
.bless-emo{font-size:30px}.bless-name{font-weight:800}.bless-desc{font-size:12px;opacity:.85}

/* ⚙️ Overtime button on building rows */
.si-over.can{box-shadow:0 0 0 1px #ffd36a;color:#ffd36a}
.si-over.owned{opacity:.6}

/* 🌳 Guild currency cards, guest of the day, contracts (2026-10-06) */
.gd-cur-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px;margin:8px 0}
.gd-cur{border-radius:14px;padding:10px 12px;border:1px solid rgba(255,255,255,.12)}
.gd-cur.power{background:linear-gradient(160deg,rgba(90,200,120,.18),rgba(20,50,30,.35))}
.gd-cur.know{background:linear-gradient(160deg,rgba(110,170,255,.18),rgba(20,30,60,.35))}
.gd-cur-top{display:flex;align-items:center;gap:10px}
.gd-cur-emo{font-size:30px}
.gd-cur-txt{flex:1}
.gd-cur-lbl{font-size:11px;text-transform:uppercase;letter-spacing:.06em;opacity:.8}
.gd-cur-amt{font-size:22px;font-weight:800}
.gd-cur-rate{font-weight:800;color:#9cf09c}
.gd-cur.know .gd-cur-rate{color:#9cc8ff}
.gd-cur-bk{margin-top:8px;font-size:12px;border-top:1px dashed rgba(255,255,255,.15);padding-top:6px}
.gd-bk-line{display:flex;justify-content:space-between;gap:8px;opacity:.85}
.gd-bk-line.good b{color:#ffd36a}
.gd-bk-line.total{opacity:1;border-top:1px solid rgba(255,255,255,.12);margin-top:3px;padding-top:3px}
.gd-ms{margin-top:8px}.gd-ms-lbl{font-size:11px;opacity:.85;margin-top:6px}
.gd-guest{margin:6px 0 10px;padding:8px 12px;border-radius:12px;background:rgba(255,211,106,.10);border:1px dashed rgba(255,211,106,.5)}
.gd-guest.seated{border-style:solid;box-shadow:0 0 12px rgba(255,211,106,.35)}
.gd-ct-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;margin-bottom:12px}
.gd-ct{display:flex;flex-direction:column;gap:6px;padding:10px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12)}
.gd-ct.done{border-color:#9cf09c;box-shadow:0 0 10px rgba(120,230,120,.35)}
.gd-ct.empty{opacity:.6}
.gd-ct-txt{font-weight:700;font-size:13px}.gd-ct-rw{font-size:12px;opacity:.9}

/* 🔒 busy cards in every picker — clearly greyed (2026-10-06) */
.dg-picker-card.busy,.exp-card.busy,.gd-pick.busy{filter:grayscale(1);opacity:.42}
.dg-picker-card.busy small,.exp-card.busy small,.gd-pick.busy small{color:#ffb3b3;opacity:1}
.bd-cmd-select option.busy{color:#888}

/* 🖋️🧪 I.N.K. Foundation — summary + creatures grouped by kind (2026-10-06) */
.im-summary{padding:10px 12px;border-radius:14px;background:linear-gradient(160deg,rgba(60,40,90,.35),rgba(10,10,20,.4));border:1px solid rgba(180,140,255,.3);margin:6px 0 10px}
.im-cages{display:flex;flex-wrap:wrap;gap:4px;font-size:20px;margin-bottom:4px}
.im-cage{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:rgba(0,0,0,.35)}
.im-cage.full{border-color:#b98cff;box-shadow:0 0 8px rgba(185,140,255,.45)}
.im-cage.none{opacity:.25}
.im-outs{font-size:12px;opacity:.9;margin-top:6px;white-space:pre-wrap}
.im-kinds{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px;margin-bottom:12px}
.im-kind{border-radius:12px;padding:10px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12)}
.im-kind.empty{opacity:.55}
.im-kind-head{display:flex;gap:10px;align-items:center}
.im-kind-emo{font-size:28px}
.im-kind-name{font-weight:800}
.im-kind-eff{font-size:12px;opacity:.85}
.im-specimens{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.im-spec{display:flex;align-items:center;gap:4px;padding:3px 6px;border-radius:9px;background:rgba(0,0,0,.3)}
.im-spec-stars{color:#ffd36a;letter-spacing:1px;font-size:12px}

/* 🔮 Aspect research notes (2026-10-06) */
.asp-inv{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0}
.asp-chip{padding:2px 7px;border-radius:9px;background:rgba(160,120,255,.16);border:1px solid rgba(180,140,255,.35);font-size:12px}
.asp-chip.zero{opacity:.4}
.asp-note{display:flex;flex-direction:column;align-items:center;gap:8px}
.asp-canvas{max-width:100%;cursor:pointer;touch-action:manipulation;border-radius:14px;background:radial-gradient(circle at 50% 40%,rgba(80,50,140,.35),rgba(10,8,20,.6))}
.asp-info{min-height:18px;font-size:13px;font-weight:700;text-align:center}
.asp-pal{display:flex;flex-wrap:wrap;justify-content:center;gap:5px;max-width:460px}
.asp-pick{display:flex;flex-direction:column;align-items:center;min-width:42px;padding:4px 6px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);color:inherit;font-size:20px;cursor:pointer}
.asp-pick small{font-size:10px;opacity:.85}
.asp-pick.on{border-color:#9cf09c;box-shadow:0 0 10px rgba(120,255,150,.5)}
.asp-pick.zero{opacity:.35}
.asp-info-links{font-size:11.5px;font-weight:500;opacity:.8;margin-top:2px}
.asp-help-btn{cursor:pointer;color:inherit;font:inherit;font-size:12px}
.asp-help-toggle{font-size:12.5px;padding:4px 10px}
.asp-help-toggle.on{border-color:#ffd36a}
.asp-help{width:100%;max-width:460px;font-size:12.5px;text-align:left}
.asp-help-steps{margin:4px 0 8px;padding-left:18px;line-height:1.45}
.asp-help-steps li{margin:3px 0}
.asp-help-h{font-weight:800;margin:6px 0 4px}
.asp-help-tbl{display:grid;gap:3px}
.asp-help-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1.2fr);gap:6px;align-items:center;padding:3px 7px;border-radius:8px;background:rgba(160,120,255,.08)}
.asp-help-row.primal{background:rgba(255,211,106,.08)}
.asp-help-name{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.asp-help-made{opacity:.8}
.asp-help-links{letter-spacing:1px}
/* 📖 Dogland Tome — Thaumonomicon-style research map (guild.js GD.renderTome) */
.tome{--ink:#3b2a14;--ink2:#6b4f2a;--gold:#b8860b;margin:8px 0 14px;padding:12px;border-radius:14px;color:var(--ink);
  background:radial-gradient(ellipse at 50% 40%,#f3e6c4 0%,#e6d2a2 62%,#cfb57c 100%);border:3px double #8a6a3a;box-shadow:inset 0 0 40px rgba(110,70,20,.35),0 4px 18px rgba(0,0,0,.35);font-family:Georgia,"Times New Roman",serif}
.tome-title{text-align:center;font-weight:800;font-size:17px;letter-spacing:.5px;margin-bottom:6px;color:var(--ink)}
.tome-map{position:relative;width:100%;aspect-ratio:16/8;min-height:230px;border-radius:10px;border:1px solid rgba(120,80,30,.35);
  background:repeating-linear-gradient(0deg,rgba(120,80,30,.05) 0 1px,transparent 1px 22px),repeating-linear-gradient(90deg,rgba(120,80,30,.05) 0 1px,transparent 1px 22px),rgba(255,248,225,.35)}
.tome-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.tome-line{stroke:rgba(107,79,42,.35);stroke-width:2;stroke-dasharray:5 5}
.tome-line.lit{stroke:var(--gold);stroke-width:3;stroke-dasharray:none}
.tome-line.next{stroke:#7a4fb0;stroke-width:2.5;stroke-dasharray:7 4}
.tome-node{position:absolute;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;padding:0;cursor:pointer;font-size:26px;line-height:1;display:grid;place-items:center;
  background:radial-gradient(circle at 40% 35%,#fffaf0,#e9d7a8 70%,#cdb27a);border:3px solid #8a6a3a;box-shadow:0 2px 6px rgba(60,35,10,.35);transition:transform .12s}
.tome-node:hover{transform:translate(-50%,-50%) scale(1.08)}
.tome-node.note{border-radius:12px;width:58px;height:58px}
.tome-node.archives{width:62px;height:62px}
.tome-node.st-done{border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,215,90,.55),0 2px 8px rgba(120,80,0,.45)}
.tome-node.st-open{border-color:#4f8a3a;box-shadow:0 0 0 2px rgba(110,190,90,.45)}
.tome-node.st-avail,.tome-node.st-pending{border-color:#7a4fb0;animation:tomeGlow 1.6s ease-in-out infinite}
.tome-node.st-short{border-color:#9a7a4a}
.tome-node.st-locked{filter:grayscale(1) opacity(.55)}
.tome-node.st-hidden{filter:grayscale(1) opacity(.35);font-size:20px;border-style:dashed}
.tome-node.sel{outline:3px solid #2f6fd0;outline-offset:3px}
@keyframes tomeGlow{0%,100%{box-shadow:0 0 0 0 rgba(150,90,230,0)}50%{box-shadow:0 0 0 5px rgba(150,90,230,.35),0 0 16px rgba(150,90,230,.55)}}
:root[data-reduced-fx] .tome-node{animation:none!important;transition:none}
.tome-badge{position:absolute;right:-6px;top:-6px;font-size:13px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:#f6ecd0;border:1px solid #8a6a3a}
.tome-badge.ok{background:#f3d66b;color:#3b2a14;font-weight:900}
.tome-label{position:absolute;transform:translate(-50%,36px);font-size:11px;font-weight:700;white-space:nowrap;color:var(--ink2);pointer-events:none;text-shadow:0 1px 0 rgba(255,250,235,.8)}
.tome-page{margin-top:10px;padding:10px 12px;border-radius:10px;background:rgba(255,250,232,.6);border:1px solid rgba(120,80,30,.35)}
.tome-page p{margin:6px 0;line-height:1.45;font-size:13.5px}
.tome-page-head{display:flex;gap:10px;align-items:center}
.tome-page-ico{font-size:30px;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 40% 35%,#fffaf0,#e3cd98);border:2px solid #8a6a3a;flex:none}
.tome-page-ico.st-done{border-color:var(--gold)}
.tome-page-name{font-weight:800;font-size:16px}
.tome-page-st{font-size:12px;color:var(--ink2)}
.tome-page-st.st-avail,.tome-page-st.st-pending{color:#6a3fa0;font-weight:700}
.tome-unlocks{font-style:italic;color:var(--ink2)}
.tome-sub{font-size:12px;color:var(--ink2);margin:4px 0}
.tome .asp-chip{color:var(--ink);background:rgba(150,110,230,.14);border-color:rgba(110,70,170,.4)}
.tome-btn{margin-top:6px;padding:7px 14px;border-radius:9px;border:2px solid #8a6a3a;background:linear-gradient(180deg,#f8eccb,#e2c98f);color:var(--ink);font:inherit;font-weight:800;cursor:pointer}
.tome-btn:disabled{opacity:.55;cursor:default}
@media (max-width:520px){
  .tome{padding:8px}
  .tome-map{aspect-ratio:4/3}
  .tome-node{width:42px;height:42px;font-size:20px}
  .tome-node.note{width:46px;height:46px}
  .tome-node.archives{width:48px;height:48px}
  .tome-label{font-size:9.5px;transform:translate(-50%,28px)}
}
.im-aspects{margin:4px 0 10px}

/* 🏴‍☠️ raid forecast (2026-10-06) */
.bd-raid-fc{margin:6px 0;padding:8px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.15);background:rgba(0,0,0,.25)}
.bd-raid-fc.safe{border-color:rgba(120,230,120,.6)}.bd-raid-fc.risky{border-color:rgba(255,200,80,.7)}.bd-raid-fc.lose{border-color:rgba(255,90,90,.8);box-shadow:0 0 10px rgba(255,80,80,.25)}
.bd-raid-fc-h{font-weight:800;margin-bottom:4px}
.bd-raid-fc-line{display:grid;grid-template-columns:minmax(150px,auto) 1fr;gap:8px;align-items:center;font-size:12px;margin:2px 0}
.bd-raid-fc-bar{height:8px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden}
.bd-raid-fc-bar i{display:block;height:100%}
.bd-raid-fc-bar.you i{background:linear-gradient(90deg,#5ad1ff,#9cf09c)}
.bd-raid-fc-bar.them i{background:linear-gradient(90deg,#ff9a4d,#ff4d4d)}
.bd-raid-fc-kinds{font-size:12px;opacity:.85;margin-top:3px}
.bd-raid-fc-verdict{font-weight:700;margin-top:3px}

/* 🗂️ Guild sub-tabs */
.gd-tabs{margin:10px 0 6px}
.gd-tab-body{animation:none}

/* ⚑ Rally upgrades as gold nodes in the Skill Tree (2026-10-06) */
.st-node.rally-node{border-color:#ffcf5a;background:linear-gradient(180deg,rgba(255,207,90,.14),rgba(60,40,10,.25))}
.st-node.rally-node.locked{opacity:.5}

/* 🌳 Guild study trees — currency tint */
.st-node.gd-pow{border-color:rgba(120,220,140,.55)}
.st-node.gd-know{border-color:rgba(120,170,255,.6)}

/* 🏅 Guild Rank (2026-10-06) — badge, tier-4 royal look, the City Guild Hall grows with it */
.gd-rank{display:flex;gap:12px;align-items:center;margin:8px 0;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.22)}
.gd-rank-badge{flex:none;width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:18px;
  background:radial-gradient(circle at 35% 30%,#fff3c4,#d9a441 60%,#7a5216);color:#3a2400;box-shadow:0 0 0 3px rgba(255,220,140,.35)}
.gd-rank-t0 .gd-rank-badge{filter:grayscale(.8) brightness(.8)}
.gd-rank-t3 .gd-rank-badge,.gd-rank-t4 .gd-rank-badge{box-shadow:0 0 0 3px #ffd36a,0 0 16px rgba(255,211,106,.7)}
.gd-rank-t4 .gd-rank-badge{background:radial-gradient(circle at 35% 30%,#ffe6ff,#b06aff 60%,#3a1470);color:#fff}
.gd-rank-txt{flex:1}.gd-rank-name{font-weight:800;margin-bottom:4px}
#dg-guild-host.gd-tier-4{border-color:rgba(200,140,255,.6);box-shadow:0 0 36px -8px rgba(190,120,255,.45) inset;
  background:linear-gradient(165deg,rgba(54,28,76,.6),rgba(22,12,36,.78)),repeating-linear-gradient(115deg,rgba(255,215,140,.06) 0 2px,transparent 2px 16px)}
#dg-guild-host.gd-tier-4::before{opacity:0}
#dg-guild-host.gd-tier-4::after{content:"👑";position:absolute;top:8px;right:12px;font-size:18px;opacity:.8;z-index:1;animation:gdLeafSway 3.4s ease-in-out infinite}
/* 📚 the Chronicle shelf */
.gd-shelf{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:8px;margin-bottom:10px}
.gd-book{padding:8px 10px;border-radius:10px;background:linear-gradient(180deg,rgba(120,80,40,.25),rgba(40,25,10,.35));border:1px solid rgba(200,150,90,.4)}
.gd-book.maxed{border-color:#ffd36a;box-shadow:0 0 10px rgba(255,211,106,.35)}
.gd-book-spine{font-size:16px;letter-spacing:-2px;min-height:20px}
.gd-book-name{font-weight:800;font-size:13px}.gd-book-sub{font-size:11px;opacity:.85}.gd-book-sub.dim{opacity:.6}
/* 🏰 City: the Guild Hall by rank */
.cz-cell.b-guild.gh-tier-1{box-shadow:inset 0 0 0 2px rgba(200,160,90,.6)}
.cz-cell.b-guild.gh-tier-2{box-shadow:inset 0 0 0 2px #d9a441,0 0 8px rgba(217,164,65,.5)}
.cz-cell.b-guild.gh-tier-3{box-shadow:inset 0 0 0 2px #ffd36a,0 0 12px rgba(255,211,106,.7);background-image:radial-gradient(circle,rgba(255,220,140,.25),transparent 70%)}
.cz-cell.b-guild.gh-tier-4{box-shadow:inset 0 0 0 2px #c58cff,0 0 16px rgba(197,140,255,.8);background-image:radial-gradient(circle,rgba(220,170,255,.35),transparent 70%);animation:ghGlow 2.6s ease-in-out infinite}
.cz-cell.b-guild[class*="gh-tier-"]:not(.gh-tier-0)::after{content:attr(data-rank);position:absolute;right:2px;bottom:1px;font-size:9px;color:#ffd36a;text-shadow:0 1px 2px #000}
@keyframes ghGlow{50%{box-shadow:inset 0 0 0 2px #ffd36a,0 0 22px rgba(255,211,106,.9)}}
:root[data-reduced-fx] .cz-cell.b-guild.gh-tier-4{animation:none}

/* 🗺️ expedition slot footer: Collect + Collect & dig must stay inside the card (2026-10-06 fix) */
.exp-slot{min-width:0}
.exp-slot-foot{flex-wrap:wrap}
.exp-slot-foot.has-dig .exp-back{flex-basis:100%}
.exp-slot-foot.has-dig .asc-buy{flex:1 1 0;min-width:0;white-space:normal;line-height:1.15;padding-left:8px;padding-right:8px}

/* 💥 Mining Mastery — Critical Strike / Mother Lode */
.float-num.mega{font-size:34px;color:#ffe25a;text-shadow:0 2px 10px #000,0 0 26px #ff8a2a,0 0 6px #fff;z-index:2}
#ore-stage.crit-flash{filter:brightness(1.7) saturate(1.3);transition:filter .05s}

/* 📱 2026-10-06 — narrow phones: the price button moves under the text, so long upgrade
   descriptions (Mining Mastery, buildings with ⚙️/⏳) use the full card width */
@media (max-width:420px){
  .shop-item{grid-template-columns:auto 1fr;gap:6px 12px;padding:10px 12px}
  .shop-item .si-ico{width:40px;height:40px;font-size:20px;align-self:start}
  .shop-item .si-buy{grid-column:1 / -1;flex-direction:row;justify-content:space-between;align-items:center;min-width:0;padding:7px 12px}
}

/* ⏳ BD Lookouts card in Upgrades */
.bd-lookout-wrap{display:flex;justify-content:center;margin:4px 0 10px}
.bd-lookout-wrap .st-node{max-width:210px;width:100%}

/* 🏭 Foundry node factory (js/huta-factory.js) */
.hf-root{margin-top:10px}
.hf-bar{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 8px}
.hf-build{font-size:12px;padding:5px 9px;border-radius:8px;border:1px solid rgba(255,140,80,.45);
  background:linear-gradient(180deg,#3a2117,#24150f);color:#f3e2d6;cursor:pointer}
.hf-build:hover:not(:disabled){border-color:#ff9a5a;box-shadow:0 0 10px -3px #ff7a33}
.hf-build:disabled{opacity:.45;cursor:default}
.hf-wrap{position:relative;border-radius:12px;overflow:hidden;border:1px solid rgba(255,120,60,.35);
  box-shadow:inset 0 0 30px rgba(0,0,0,.6),0 0 22px -10px rgba(255,110,40,.6)}
.hf-canvas{display:block;width:100%;cursor:grab;user-select:none;-webkit-user-select:none}
.hf-canvas:active{cursor:grabbing}
.hf-tools{position:absolute;right:8px;top:8px;display:flex;gap:4px}
.hf-tool{width:30px;height:30px;border-radius:8px;border:1px solid rgba(255,255,255,.2);
  background:rgba(20,12,10,.8);color:#eee;font-size:15px;cursor:pointer;padding:0}
.hf-panel{margin:8px 0;padding:10px 12px;border-radius:10px;background:rgba(40,24,18,.55);border:1px solid rgba(255,140,80,.25)}
.hf-p-h{font-weight:700;margin-bottom:4px}
.hf-p-d{font-size:13px;margin-bottom:4px}
.hf-p-d.dim{opacity:.75}
.hf-techs{margin-top:8px}
.hf-tech{margin:6px 0;padding:8px 10px;border-radius:10px;background:rgba(30,20,16,.6);border:1px solid rgba(255,140,80,.22)}
.hf-research{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px}
.hf-research .hf-tech{margin:0}
.hf-rs.done{border-color:rgba(91,227,122,.45);opacity:.8}
.hf-rs.locked{opacity:.55}
.hf-build.tap{border-color:rgba(224,48,74,.45)}
.hf-variants{display:flex;flex-wrap:wrap;gap:5px;margin:6px 0 2px}
.hf-var{font-size:12px;padding:4px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.18);background:rgba(20,12,10,.7);color:#eee;cursor:pointer}
.hf-var.on{border-color:#ffb36b;background:rgba(255,140,60,.25);box-shadow:0 0 8px -2px #ff8a3a}
.hf-var:disabled{opacity:.45;cursor:default}

/* 🔷 Condensed perks (js/condensed-perks.js) */
.cx-strip{margin:14px 0 6px;padding:10px 12px;border-radius:12px;border:1px solid rgba(90,170,255,.4);
  background:linear-gradient(180deg,rgba(30,60,110,.35),rgba(15,25,50,.35));box-shadow:0 0 18px -8px rgba(80,160,255,.6)}
.cx-h{font-weight:700;font-size:13px;color:#9fd0ff;margin-bottom:6px}
.cx-row{display:flex;align-items:center;gap:10px;padding:5px 0;border-top:1px solid rgba(255,255,255,.06)}
.cx-row:first-of-type{border-top:0}
.cx-txt{flex:1;min-width:0}
.cx-name{font-weight:600;font-size:13px}
.cx-eff{font-size:12px;opacity:.8}
.cx-buy{white-space:nowrap}
.cx-max{font-weight:700;color:#7cc4ff}

/* 🧰 Foundry drawer + 🔍 inspector overlay */
.hf-drawer{position:absolute;top:0;right:0;bottom:0;width:min(250px,72%);z-index:3;display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(38,22,16,.96),rgba(22,13,10,.96));border-left:1px solid rgba(255,140,80,.45);
  box-shadow:-10px 0 24px -8px rgba(0,0,0,.7);transform:translateX(103%);transition:transform .28s cubic-bezier(.2,.8,.2,1)}
.hf-wrap.drawer-open .hf-drawer{transform:none}
.hf-dhead{display:flex;align-items:center;justify-content:space-between;padding:8px 10px 4px;font-weight:700;color:#ffd2b0}
.hf-dhint{font-size:11px;opacity:.6;padding:0 10px 6px}
.hf-dclose{background:none;border:0;color:#ccc;font-size:15px;cursor:pointer;padding:0 4px;margin-left:auto}
.hf-dlist{overflow-y:auto;padding:0 8px 10px;flex:1;overscroll-behavior:contain}
.hf-dgroup{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#ffb37a;opacity:.8;margin:10px 2px 4px}
.hf-card{display:flex;gap:8px;align-items:flex-start;padding:7px 8px;margin:4px 0;border-radius:10px;cursor:grab;touch-action:none;user-select:none;
  background:rgba(255,255,255,.04);border:1px solid color-mix(in srgb,var(--hc) 55%,transparent);border-left:3px solid var(--hc);transition:background .15s,transform .15s}
.hf-card:hover:not(.off){background:rgba(255,255,255,.09);transform:translateX(-2px)}
.hf-card.off{opacity:.5;cursor:default}
.hf-card.poor{opacity:.7}
.hf-c-ico{font-size:22px;line-height:1;width:26px;text-align:center}
.hf-c-body{min-width:0;flex:1}
.hf-c-name{font-weight:700;font-size:12.5px}
.hf-c-cost{font-size:11.5px;color:#ffd27a}
.hf-card.locked .hf-c-cost{color:#aaa}
.hf-c-desc{font-size:10.5px;opacity:.65;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hf-dhandle{position:absolute;right:8px;bottom:8px;z-index:2;width:42px;height:42px;border-radius:12px;font-size:20px;cursor:pointer;
  border:1px solid rgba(255,140,80,.6);background:rgba(40,22,14,.9);box-shadow:0 0 14px -4px #ff7a33}
.hf-wrap.drawer-open .hf-dhandle{opacity:0;pointer-events:none}
.hf-tools{z-index:2}
.hf-wrap.drawer-open .hf-tools{right:calc(min(250px,72%) + 8px)}
.hf-insp{position:absolute;left:8px;bottom:8px;z-index:2;width:min(330px,calc(100% - 70px));max-height:calc(100% - 16px);overflow-y:auto;
  padding:10px 12px;border-radius:12px;background:rgba(26,16,12,.93);border:1px solid rgba(255,140,80,.45);box-shadow:0 6px 24px -6px rgba(0,0,0,.8);
  backdrop-filter:blur(3px)}
.hf-insp .hf-p-h{display:flex;align-items:center;gap:6px}
.hf-insp .ref-row{flex-wrap:wrap}
.hf-wrap.drawer-open .hf-insp{width:min(330px,calc(100% - min(250px,72%) - 24px))}
.hf-ghost{position:fixed;z-index:9999;pointer-events:none;font-size:30px;transform:translate(-50%,-50%);filter:drop-shadow(0 0 8px #ff8a3a)}
@media (max-width:520px){
  .hf-insp{font-size:12px;padding:8px 10px;left:6px;bottom:6px}
  .hf-insp > .hf-p-d:not(.dim){display:none}
  .hf-insp .ref-btn{padding:6px 10px;font-size:12px}
}

/* 🚪 Backrooms easter egg (js/backrooms.js) */
#nav button.br-gone{animation:brGone .35s steps(3) forwards}
@keyframes brGone{0%{opacity:1;filter:none}40%{opacity:.2;transform:translateX(3px);filter:hue-rotate(60deg)}70%{opacity:.8;transform:translateX(-2px)}100%{opacity:0;transform:scale(.9);visibility:hidden}}
body.br-on #nav{pointer-events:none}
.br-ov{position:fixed;inset:0;z-index:9000;background:#c9b458;overflow:hidden;animation:brIn .9s ease-out;user-select:none}
.br-ov.out{animation:brOut .9s ease-in forwards}
@keyframes brIn{from{opacity:0;filter:blur(6px) brightness(2)}to{opacity:1;filter:none}}
@keyframes brOut{to{opacity:0;filter:blur(8px) brightness(2.5)}}
.br-room{position:absolute;inset:0;filter:hue-rotate(var(--tint,0deg)) brightness(var(--wall,1));transition:transform .38s ease-in,filter .38s}
.br-room.walk{transform:scale(2.4);filter:brightness(.4) blur(2px)}
.br-room.arrive{animation:brArrive .26s ease-out}
@keyframes brArrive{from{transform:scale(.85);opacity:.4}to{transform:none;opacity:1}}
.br-ceiling{position:absolute;left:0;right:0;top:0;height:22%;background:
  repeating-linear-gradient(90deg,rgba(0,0,0,.08) 0 2px,transparent 2px 90px),
  repeating-linear-gradient(0deg,rgba(0,0,0,.08) 0 2px,transparent 2px 46px),#d8cfa0}
.br-ceiling::after{content:"";position:absolute;left:18%;right:18%;top:38%;height:14%;background:repeating-linear-gradient(90deg,#fffbe0 0 22%,transparent 22% 39%);
  box-shadow:0 0 40px 14px rgba(255,250,210,.55);animation:brHum 3.7s infinite}
@keyframes brHum{0%,93%,100%{opacity:1}94%{opacity:.4}96%{opacity:.9}97%{opacity:.3}}
.br-wall{position:absolute;left:0;right:0;top:22%;bottom:24%;background:
  repeating-linear-gradient(90deg,rgba(120,100,30,.18) 0 3px,transparent 3px 26px),
  radial-gradient(circle at 13px 13px,rgba(140,115,40,.25) 3px,transparent 4px) 0 0/26px 26px,#d9c56a}
.br-floor{position:absolute;left:0;right:0;bottom:0;height:24%;background:
  radial-gradient(rgba(90,75,30,.18) 1px,transparent 1.5px) 0 0/7px 7px,linear-gradient(#a8964e,#8e7e3e)}
.br-doors{position:absolute;left:0;right:0;top:22%;bottom:24%}
.br-door{position:absolute;bottom:0;border:0;padding:0;cursor:pointer;background:linear-gradient(#1c1808,#2f2810);
  box-shadow:inset 0 0 0 4px #b9a650,inset 0 -30px 40px rgba(0,0,0,.6);transition:filter .15s}
.br-door:hover{filter:brightness(1.6)}
.br-pillar{position:absolute;bottom:0;top:0;width:6%;background:linear-gradient(90deg,#c4b25c,#e3d27c,#bba955);box-shadow:4px 0 10px rgba(0,0,0,.25)}
.br-art{position:absolute;bottom:4%;font-size:34px;background:none;border:0;cursor:pointer;
  filter:drop-shadow(0 0 10px #fff) drop-shadow(0 0 22px #7fd8ff);animation:brArt 1.4s ease-in-out infinite}
@keyframes brArt{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-10px) rotate(4deg)}}
.br-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at center,transparent 45%,rgba(40,30,0,.55));
  mix-blend-mode:multiply}
.br-ov.flicker .br-room{filter:brightness(.55)}
.br-hud{position:absolute;left:50%;top:14px;transform:translateX(-50%);text-align:center;color:#3a3110;font-family:monospace;pointer-events:none;
  text-shadow:0 1px 0 rgba(255,255,255,.4)}
.br-title{font-weight:700;font-size:15px;letter-spacing:.04em}
.br-sub{font-size:12px;opacity:.75;margin:2px 0 6px}
.br-bar{width:220px;height:4px;background:rgba(0,0,0,.18);border-radius:2px;margin:0 auto;overflow:hidden}
.br-bar i{display:block;height:100%;background:#3a3110;width:100%}
.br-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.br-flash.go{animation:brFlash .7s ease-out}
@keyframes brFlash{0%{opacity:.9}100%{opacity:0}}

/* 🚪 Backrooms room presets */
.br-room.p-pool .br-ceiling{background:repeating-linear-gradient(90deg,rgba(0,60,90,.08) 0 2px,transparent 2px 34px),repeating-linear-gradient(0deg,rgba(0,60,90,.08) 0 2px,transparent 2px 34px),#f2f6f7}
.br-room.p-pool .br-wall{background:repeating-linear-gradient(90deg,rgba(0,70,100,.14) 0 2px,transparent 2px 30px),repeating-linear-gradient(0deg,rgba(0,70,100,.14) 0 2px,transparent 2px 30px),#eaf3f5}
.br-room.p-pool .br-floor{background:linear-gradient(#7fd3e6,#3aa3c4)}
.br-room.p-pool .br-door{background:linear-gradient(#18343c,#0d1d22);border-radius:50% 50% 0 0/22% 22% 0 0;box-shadow:inset 0 0 0 4px #d9ecef}
.br-water{position:absolute;left:0;right:0;bottom:-48%;height:48%;background:repeating-linear-gradient(100deg,rgba(255,255,255,.18) 0 6px,transparent 6px 40px);
  animation:brWater 3s linear infinite;mix-blend-mode:screen}
@keyframes brWater{to{background-position:120px 0}}
.br-room.p-bath .br-wall{background:repeating-conic-gradient(#e7efe8 0 25%,#9fc4a8 0 50%) 0 0/36px 36px}
.br-room.p-bath .br-ceiling{background:#dfe5df}
.br-room.p-bath .br-floor{background:repeating-conic-gradient(#f2f2ee 0 25%,#2b2f2c 0 50%) 0 0/28px 28px}
.br-room.p-bath .br-door{background:linear-gradient(#6f8a96,#53707d);box-shadow:inset 0 0 0 3px #3e5560;border-radius:3px}
.br-room.p-bath .br-door::after{content:"";position:absolute;right:12%;top:48%;width:10%;height:4%;background:#c94040;border-radius:2px}
.br-sink{position:absolute;bottom:22%;width:10%;height:9%;background:#f4f6f4;border-radius:0 0 40% 40%;box-shadow:0 3px 6px rgba(0,0,0,.25)}
.br-sink::before{content:"";position:absolute;left:10%;right:10%;bottom:170%;height:180%;background:linear-gradient(135deg,#cfe0e6,#9ab4bd 60%,#e6f2f5);border:3px solid #b8c4c0}
.br-room.p-meadow .br-ceiling{background:linear-gradient(#6fb6ff,#b9e0ff)}
.br-room.p-meadow .br-ceiling::after{display:none}
.br-room.p-meadow .br-wall{background:linear-gradient(#b9e0ff 0 55%,#8fbf63 55% 62%,#6fa548 62%)}
.br-room.p-meadow .br-floor{background:repeating-linear-gradient(95deg,rgba(40,90,20,.25) 0 2px,transparent 2px 9px),linear-gradient(#6fa548,#4f8a31)}
.br-room.p-meadow .br-door{background:linear-gradient(#0e0e12,#1d1d26);box-shadow:inset 0 0 0 5px #8a5a2b,6px 8px 0 -2px rgba(0,0,0,.18)}
.br-room.p-meadow ~ .br-vignette{background:radial-gradient(ellipse at center,transparent 55%,rgba(0,40,0,.25))}
.br-sun{position:absolute;right:12%;top:-22%;width:70px;height:70px;border-radius:50%;background:#fff6c8;box-shadow:0 0 60px 20px rgba(255,246,200,.8)}
.br-cloud{position:absolute;margin-top:0;width:120px;height:30px;border-radius:30px;background:rgba(255,255,255,.85);box-shadow:30px -12px 0 6px rgba(255,255,255,.85)}
.br-room.p-hotel .br-ceiling{background:#3a2418}
.br-room.p-hotel .br-ceiling::after{background:none;box-shadow:none}
.br-room.p-hotel .br-wall{background:radial-gradient(circle at 15px 15px,rgba(200,160,80,.35) 3px,transparent 4px) 0 0/30px 30px,linear-gradient(#5a1f1f,#3e1414)}
.br-room.p-hotel .br-floor{background:repeating-linear-gradient(90deg,rgba(0,0,0,.15) 0 30px,transparent 30px 60px),linear-gradient(#8e1c22,#5e1015)}
.br-room.p-hotel .br-door{background:linear-gradient(#4a2c16,#2d1a0c);box-shadow:inset 0 0 0 4px #c9a25a}
.br-sconce{position:absolute;top:18%;width:14px;height:24px;background:#ffd98a;border-radius:6px 6px 2px 2px;box-shadow:0 0 30px 12px rgba(255,200,110,.5)}
.br-room.p-garage .br-ceiling{background:#6f6f6b}
.br-room.p-garage .br-ceiling::after{background:repeating-linear-gradient(90deg,#f4f4e8 0 10%,transparent 10% 33%)}
.br-room.p-garage .br-wall{background:repeating-linear-gradient(0deg,rgba(0,0,0,.08) 0 2px,transparent 2px 40px),#9a9a94}
.br-room.p-garage .br-floor{background:repeating-linear-gradient(90deg,transparent 0 18%,#e8d24a 18% 19%),#5d5d59}
.br-room.p-garage .br-door{background:linear-gradient(#111,#222);box-shadow:inset 0 0 0 4px #e8d24a}
.br-room.p-garage .br-pillar{background:linear-gradient(90deg,#8a8a84,#b4b4ae,#7f7f79)}
.br-room.p-office .br-wall{background:linear-gradient(#c7cdd2,#aeb6bd)}
.br-room.p-office .br-ceiling{background:repeating-linear-gradient(90deg,rgba(0,0,0,.07) 0 2px,transparent 2px 70px),#e1e4e6}
.br-room.p-office .br-floor{background:radial-gradient(rgba(0,0,40,.25) 1px,transparent 1.5px) 0 0/6px 6px,#5a6a80}
.br-room.p-office .br-door{background:linear-gradient(#20262c,#323a42);box-shadow:inset 0 0 0 4px #8e98a2}
.br-cubicle{position:absolute;bottom:0;width:20%;height:26%;background:linear-gradient(#7d8b99,#68757f);border-top:4px solid #4f5962;box-shadow:0 -2px 0 rgba(255,255,255,.2) inset}
/* 👁️ the entity + darkness */
.br-entity{position:absolute;bottom:0;background:radial-gradient(ellipse at 50% 30%,#000 40%,rgba(0,0,0,.92) 70%);border-radius:40% 40% 6% 6%;z-index:3;pointer-events:none;
  animation:brEnt .6s ease-out}
.br-entity::before,.br-entity::after{content:"";position:absolute;top:22%;width:14%;height:3.5%;min-height:4px;background:#fff;border-radius:50%;box-shadow:0 0 8px 2px #fff}
.br-entity::before{left:28%}.br-entity::after{right:28%}
@keyframes brEnt{from{opacity:0}to{opacity:1}}
.br-entity.lunge{animation:brLunge .55s cubic-bezier(.6,0,1,1) forwards}
@keyframes brLunge{to{transform:scale(9) translateY(-8%);opacity:1}}
.br-dark{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;transition:opacity .25s;display:flex;align-items:center;justify-content:center}
.br-ov.dark .br-dark{opacity:1;pointer-events:auto}
.br-dark-t{color:#5a5a5a;font-family:monospace;font-size:13px;letter-spacing:.08em;animation:brHum 2.3s infinite}
.br-ov.dark .br-hud{z-index:2;color:#444;text-shadow:none}
.br-ov.dark .br-bar i{background:#444}

/* 👾 pixelated / 🙃 upside-down Backrooms rooms */
.br-room.px{filter:hue-rotate(var(--tint,0deg)) brightness(var(--wall,1)) url(#br-pix)}
.br-room.flip{transform:rotate(180deg)}
.br-room.flip.walk{transform:rotate(180deg) scale(2.4)}
.br-room.flip.arrive{animation:brArriveFlip .26s ease-out}
@keyframes brArriveFlip{from{transform:rotate(180deg) scale(.85);opacity:.4}to{transform:rotate(180deg);opacity:1}}

/* 📢 Crystal Compressor ads */
.cx-ad{position:fixed;inset:0;z-index:8000;pointer-events:auto;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.55);animation:cxAdIn .35s ease-out}
@keyframes cxAdIn{from{opacity:0}to{opacity:1}}
.cx-ad-box{width:min(360px,90vw);padding:18px 18px 14px;border-radius:18px;text-align:center;color:#eaf4ff;
  background:radial-gradient(circle at 50% 0%,#2a5ca8,#14284d 70%);border:2px solid #6fb6ff;box-shadow:0 0 40px -6px #4da3ff;animation:cxAdPop .45s cubic-bezier(.2,1.4,.4,1)}
@keyframes cxAdPop{from{transform:scale(.7) rotate(-3deg)}to{transform:none}}
.cx-ad.promo .cx-ad-box{background:radial-gradient(circle at 50% 0%,#b8322a,#4a1210 70%);border-color:#ffb36b;box-shadow:0 0 44px -4px #ff7a33}
.cx-ad-tag{display:inline-block;padding:3px 12px;border-radius:999px;background:#ffd23f;color:#3a1d00;font-weight:900;letter-spacing:.06em;animation:cxAdTag 1s ease-in-out infinite}
@keyframes cxAdTag{50%{transform:scale(1.08) rotate(-2deg)}}
.cx-ad-ico{font-size:44px;margin:8px 0 2px}
.cx-ad-h{font-weight:900;font-size:20px;letter-spacing:.05em}
.cx-ad-sub{font-size:13px;opacity:.9;margin:6px 0 10px}
.cx-ad-price{font-size:18px;margin-bottom:10px}
.cx-ad-price s{opacity:.6}
.cx-ad-price b{color:#ffd23f}
.cx-ad-go{background:#ffd23f;color:#3a1d00;font-weight:800}
.pk-comp-badge{margin:6px 0;padding:6px 10px;border-radius:10px;font-weight:700;background:rgba(90,170,255,.18);border:1px solid #6fb6ff;animation:cxAdTag 1.6s ease-in-out infinite}
.pk-comp-badge.promo{background:rgba(255,120,60,.2);border-color:#ffb36b}
.hf-syn{font-size:12px;color:#ffd65a}

/* 🚪 Backrooms relic shelf (under the achievement trophies) */
.tr-backrooms .tr-shelf-h,.tr-sec.tr-backrooms{color:#e8d470}
.tr-backrooms .tr-row{background:linear-gradient(180deg,rgba(120,100,20,.35),rgba(60,50,10,.15))}
.tr-plank-br{background:linear-gradient(180deg,#d9c56a,#a8964e 60%,#6e6230)}
.tr-relic{font-size:30px;cursor:default}
.tr-relic.got{filter:drop-shadow(0 0 8px rgba(255,240,150,.9)) drop-shadow(0 0 16px rgba(127,216,255,.5))}
.tr-br-stats{margin:4px 0 0 4px;font-size:12px}
.achv-item.tr-backrooms.got{border-color:rgba(232,212,112,.6)}
.hud-rate.neg,.econ-rate.neg{color:#ff8a8a}
.hf-drainbtn{width:auto;height:auto;padding:4px 10px;font-size:12px;margin:2px 0 6px;display:inline-block}