/* ============================================================
   ASTRAL FOUNDRY
   Art-deco celestial incremental game
   ============================================================ */

:root{
  /* Void / surfaces */
  --void-0:#05060f;
  --void-1:#080b18;
  --void-2:#0d1124;
  --panel:rgba(16,21,42,.72);
  --panel-2:rgba(22,28,54,.55);
  --edge:rgba(232,196,122,.22);
  --edge-soft:rgba(232,196,122,.12);

  /* Metals & light */
  --gold:#e8c47a;
  --gold-bright:#f8e3ac;
  --gold-deep:#b88f44;
  --gold-glow:rgba(232,196,122,.55);

  --astral:#6fe3d2;
  --astral-deep:#2c8f86;

  --violet:#b69cff;
  --violet-deep:#6b54c4;

  /* Ink */
  --ink:#f3ead6;
  --ink-dim:#b3a888;
  --ink-faint:#766c56;

  --ok:#94dca6;
  --danger:#e88a8a;

  --font-display:'Cinzel',Georgia,serif;
  --font-ui:'Jost','Century Gothic',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,monospace;

  --r:14px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:var(--font-ui);
  color:var(--ink);
  background:
    radial-gradient(120% 90% at 50% -10%, #16203f 0%, var(--void-1) 42%, var(--void-0) 100%);
  background-attachment:fixed;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  letter-spacing:.01em;
}
button{font-family:inherit;color:inherit;cursor:pointer;border:none;background:none}
::selection{background:var(--gold);color:var(--void-0)}

/* Scrollbars */
*{scrollbar-width:thin;scrollbar-color:var(--gold-deep) transparent}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-thumb{background:linear-gradient(var(--gold-deep),var(--gold-deep));border-radius:9px;border:2px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-track{background:transparent}

/* ---------- Atmosphere ---------- */
#starfield{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.atmos-vignette{
  position:fixed;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(120% 100% at 50% 38%, transparent 52%, rgba(3,4,10,.72) 100%);
}
.atmos-grain{
  position:fixed;inset:-50%;z-index:2;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 6s steps(6) infinite;
}
@keyframes grain{
  0%,100%{transform:translate(0,0)} 20%{transform:translate(-4%,2%)}
  40%{transform:translate(3%,-3%)} 60%{transform:translate(-2%,4%)} 80%{transform:translate(4%,1%)}
}

/* ---------- Deco frame ---------- */
.deco-frame{position:relative}
.deco-frame::before,.deco-frame::after{
  content:"";position:absolute;width:26px;height:26px;pointer-events:none;z-index:3;
}
.deco-frame::before{top:9px;left:9px;border-top:1px solid var(--gold);border-left:1px solid var(--gold)}
.deco-frame::after{bottom:9px;right:9px;border-bottom:1px solid var(--gold);border-right:1px solid var(--gold)}

/* ---------- Top bar ---------- */
.topbar{
  position:relative;z-index:5;
  display:flex;align-items:center;gap:18px;
  padding:14px clamp(14px,3vw,34px);
  border-bottom:1px solid var(--edge-soft);
  background:linear-gradient(180deg, rgba(7,9,18,.85), rgba(7,9,18,.25));
  backdrop-filter:blur(6px);
}
.brand{display:flex;align-items:center;gap:11px}
.brand-mark svg{width:26px;height:26px;fill:var(--gold);filter:drop-shadow(0 0 8px var(--gold-glow));animation:spin 36s linear infinite}
.brand-name{
  font-family:var(--font-display);font-weight:600;letter-spacing:.32em;
  text-transform:uppercase;font-size:.92rem;
  color:var(--gold-bright);text-shadow:0 0 18px var(--gold-glow);
}
.topbar-stats{margin-left:auto}
.tb-stat{display:flex;align-items:center;gap:8px;
  padding:6px 14px;border:1px solid var(--edge);border-radius:40px;
  background:var(--panel-2)}
.tb-icon svg{width:16px;height:16px;display:block}
.tb-icon.dm svg{fill:var(--violet);filter:drop-shadow(0 0 6px rgba(182,156,255,.6))}
.tb-val{font-family:var(--font-mono);font-weight:700;color:var(--violet);font-size:.95rem}
.tb-label{font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-faint)}
.topbar-actions{display:flex;gap:9px}
.icon-btn{
  width:38px;height:38px;border-radius:50%;
  border:1px solid var(--edge);background:var(--panel-2);
  color:var(--gold);font-size:1rem;font-family:var(--font-display);
  display:grid;place-items:center;transition:.2s var(--ease)}
.icon-btn svg{fill:var(--gold)}
.icon-btn:hover{border-color:var(--gold);box-shadow:0 0 16px var(--gold-glow);transform:translateY(-1px)}

/* ---------- Stage ---------- */
.stage{
  position:relative;z-index:4;
  display:grid;grid-template-columns:minmax(360px,1.05fr) minmax(420px,1.25fr);
  gap:clamp(16px,2.4vw,34px);
  align-items:start;
  padding:clamp(16px,2.6vw,38px);
  max-width:1480px;margin:0 auto;
}

/* ---------- Forge panel ---------- */
.forge-panel{
  position:sticky;top:22px;
  display:flex;flex-direction:column;align-items:center;
  padding:30px 26px 26px;
  border:1px solid var(--edge);border-radius:var(--r);
  background:
    radial-gradient(120% 70% at 50% 0%, rgba(232,196,122,.06), transparent 60%),
    var(--panel);
  backdrop-filter:blur(10px);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.03);
}
.forge-title{text-align:center;margin-bottom:6px}
.forge-title h1{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.5rem,2.6vw,2.15rem);letter-spacing:.12em;
  text-transform:uppercase;line-height:1;
  background:linear-gradient(180deg,var(--gold-bright),var(--gold-deep));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 2px 14px var(--gold-glow));
}
.tagline{margin-top:9px;font-size:.72rem;letter-spacing:.34em;text-transform:uppercase;color:var(--ink-faint)}

/* readout */
.readout{text-align:center;margin:20px 0 6px}
.aether-amount{display:flex;align-items:center;justify-content:center;gap:10px}
.aether-glyph svg{width:24px;height:24px;fill:var(--gold);filter:drop-shadow(0 0 10px var(--gold-glow));animation:spin 14s linear infinite}
.aether-value{
  font-family:var(--font-mono);font-weight:700;
  font-size:clamp(2.1rem,4.6vw,3.1rem);line-height:1;
  color:var(--gold-bright);
  text-shadow:0 0 26px rgba(232,196,122,.35);
  font-variant-numeric:tabular-nums}
.aether-unit{font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-faint);align-self:flex-end;margin-bottom:6px}
.rate-line{margin-top:10px;font-size:.82rem;color:var(--ink-dim);font-family:var(--font-mono)}
.rate-line span{color:var(--astral)}
.rate-sep{color:var(--ink-faint)!important;margin:0 8px}

/* forge emblem */
.forge-wrap{position:relative;margin:18px 0 6px;width:min(340px,72vw);aspect-ratio:1}
.forge{
  position:absolute;inset:0;width:100%;height:100%;border-radius:50%;
  display:grid;place-items:center;background:transparent;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.forge>span{position:absolute;border-radius:50%;pointer-events:none}
.forge-burst{
  inset:-6%;
  background:repeating-conic-gradient(from 0deg, var(--gold-glow) 0deg .5deg, transparent .5deg 7.5deg);
  -webkit-mask:radial-gradient(closest-side, transparent 56%, #000 60%, #000 86%, transparent 92%);
          mask:radial-gradient(closest-side, transparent 56%, #000 60%, #000 86%, transparent 92%);
  opacity:.5;animation:spin 60s linear infinite;
}
.forge-ring{border:1px solid var(--edge)}
.ring-1{inset:12%;box-shadow:inset 0 0 30px rgba(232,196,122,.07)}
.ring-2{inset:6%;border-color:var(--edge-soft);animation:spin 24s linear infinite}
.orbiter{position:absolute;top:-4px;left:50%;width:8px;height:8px;border-radius:50%;
  background:var(--astral);box-shadow:0 0 12px var(--astral);transform:translateX(-50%)}
.forge-rose{inset:18%;display:grid;place-items:center}
.forge-rose svg{width:100%;height:100%}
.rose-lines circle,.rose-lines path{fill:none;stroke:var(--gold);stroke-width:1.1;opacity:.5;
  vector-effect:non-scaling-stroke}
.forge-rose{animation:spin 90s linear infinite reverse}
.forge-core{
  inset:34%;
  background:
    radial-gradient(circle at 50% 42%, #fff 0%, var(--gold-bright) 20%, var(--gold) 42%, var(--gold-deep) 70%, #5a4118 100%);
  box-shadow:
    0 0 40px var(--gold-glow), 0 0 90px rgba(232,196,122,.35),
    inset 0 0 30px rgba(255,240,200,.5);
  animation:pulse 3.4s var(--ease) infinite;
}
.forge:hover .forge-core{box-shadow:0 0 60px var(--gold-glow),0 0 130px rgba(232,196,122,.5),inset 0 0 30px rgba(255,240,200,.6)}
.forge:active .forge-core{transform:scale(.92)}
@keyframes pulse{0%,100%{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.04);filter:brightness(1.12)}}
@keyframes spin{to{transform:rotate(360deg)}}

.fx-layer{position:absolute;inset:0;overflow:visible;pointer-events:none}
.float-num{
  position:absolute;font-family:var(--font-mono);font-weight:700;font-size:1.05rem;
  color:var(--gold-bright);text-shadow:0 0 12px var(--gold-glow);will-change:transform,opacity;white-space:nowrap}
.spark{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--gold-bright);
  box-shadow:0 0 8px var(--gold-glow);will-change:transform,opacity}

.forge-hint{margin-top:14px;font-size:.74rem;color:var(--ink-faint);letter-spacing:.04em;text-align:center;min-height:1.1em}

/* collapse */
.collapse-block{margin-top:18px;width:100%;text-align:center;
  padding-top:18px;border-top:1px solid var(--edge-soft)}
.collapse-info{font-size:.8rem;color:var(--ink-dim);margin-bottom:12px}
.collapse-info strong{color:var(--violet);font-family:var(--font-mono)}
.btn-collapse{
  padding:11px 26px;border-radius:40px;font-family:var(--font-display);
  letter-spacing:.18em;text-transform:uppercase;font-size:.78rem;font-weight:600;
  color:var(--violet);border:1px solid var(--violet-deep);
  background:radial-gradient(120% 120% at 50% 0%, rgba(182,156,255,.22), rgba(107,84,196,.08));
  box-shadow:0 0 24px rgba(107,84,196,.3);transition:.2s var(--ease)}
.btn-collapse:hover{color:#fff;box-shadow:0 0 36px rgba(182,156,255,.55);transform:translateY(-1px)}

/* ---------- Ops panel ---------- */
.ops-panel{min-width:0}
.tabs{display:flex;gap:4px;margin-bottom:16px;flex-wrap:wrap}
.tab{
  position:relative;padding:10px 18px;border-radius:8px 8px 0 0;
  font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  color:var(--ink-faint);border-bottom:1px solid transparent;transition:.2s var(--ease)}
.tab:hover{color:var(--ink-dim)}
.tab.is-active{color:var(--gold-bright);border-bottom-color:var(--gold)}
.tab.is-active::after{content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:1px;background:var(--gold);box-shadow:0 0 12px var(--gold-glow)}
.tab-badge{display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:9px;
  background:var(--astral);color:var(--void-0);font-family:var(--font-mono);font-size:.62rem;font-weight:700;margin-left:6px;vertical-align:middle}

.tab-pane{display:none;animation:fadein .35s var(--ease)}
.tab-pane.is-active{display:block}
@keyframes fadein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.pane-intro{font-size:.78rem;color:var(--ink-faint);margin-bottom:14px;letter-spacing:.02em}

/* buy controls */
.buy-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.buy-label{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint)}
.seg{display:flex;border:1px solid var(--edge);border-radius:8px;overflow:hidden;background:var(--panel-2)}
.seg-btn{padding:7px 13px;font-family:var(--font-mono);font-size:.74rem;color:var(--ink-dim);
  border-right:1px solid var(--edge-soft);transition:.15s var(--ease)}
.seg-btn:last-child{border-right:none}
.seg-btn:hover{color:var(--ink);background:rgba(232,196,122,.06)}
.seg-btn.is-active{background:var(--gold);color:var(--void-0);font-weight:700}

/* ---------- Building rows ---------- */
.building-list{display:flex;flex-direction:column;gap:10px}
.building{
  position:relative;display:grid;grid-template-columns:54px 1fr auto;align-items:center;gap:14px;
  padding:13px 16px;border:1px solid var(--edge-soft);border-radius:12px;
  background:linear-gradient(100deg,var(--panel),var(--panel-2));
  text-align:left;width:100%;overflow:hidden;transition:.18s var(--ease)}
.building::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:transparent;transition:.2s}
.building.affordable{border-color:var(--edge);box-shadow:0 0 0 1px var(--edge-soft),0 8px 26px -16px var(--gold-glow)}
.building.affordable::before{background:var(--gold);box-shadow:0 0 14px var(--gold-glow)}
.building.affordable:hover{transform:translateY(-2px);border-color:var(--gold)}
.building:disabled,.building.locked{cursor:default}
.building.maxed{opacity:.85}
.b-icon{width:54px;height:54px;display:grid;place-items:center;border-radius:10px;
  border:1px solid var(--edge-soft);background:radial-gradient(circle at 50% 30%,rgba(232,196,122,.1),transparent 70%)}
.b-icon svg{width:30px;height:30px;fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.b-icon .fill{fill:var(--gold);stroke:none}
.affordable .b-icon{border-color:var(--edge)}
.b-main{min-width:0}
.b-name{font-family:var(--font-display);font-weight:600;font-size:.98rem;letter-spacing:.03em;color:var(--ink);
  display:flex;align-items:baseline;gap:8px}
.b-count{font-family:var(--font-mono);font-size:.74rem;color:var(--gold-deep);font-weight:700}
.b-blurb{font-size:.72rem;color:var(--ink-faint);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.b-each{font-size:.68rem;color:var(--astral-deep);margin-top:4px;font-family:var(--font-mono)}
.b-each b{color:var(--astral)}
.b-buy{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.b-cost{font-family:var(--font-mono);font-weight:700;font-size:.92rem;color:var(--gold);display:flex;align-items:center;gap:5px}
.b-cost.cant{color:var(--ink-faint)}
.b-cost svg{width:13px;height:13px;fill:currentColor}
.b-qty-tag{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-faint)}

/* locked building teaser */
.building.locked{border-style:dashed;opacity:.6}
.building.locked .b-name{color:var(--ink-faint)}
.building.locked .b-icon svg{stroke:var(--ink-faint);opacity:.5}

/* ---------- Upgrades ---------- */
.upgrade-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(86px,1fr));gap:11px}
.upgrade{
  position:relative;aspect-ratio:1;border-radius:12px;
  border:1px solid var(--edge-soft);background:linear-gradient(160deg,var(--panel),var(--panel-2));
  display:grid;place-items:center;padding:8px;transition:.16s var(--ease);overflow:visible}
.upgrade .u-glyph{width:34px;height:34px;fill:none;stroke:var(--gold);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.upgrade.affordable{border-color:var(--gold);box-shadow:0 0 20px -6px var(--gold-glow)}
.upgrade.affordable:hover{transform:translateY(-3px) scale(1.03);box-shadow:0 0 26px -2px var(--gold-glow)}
.upgrade:not(.affordable){opacity:.55;filter:saturate(.6)}
.upgrade .u-cost{position:absolute;bottom:5px;left:0;right:0;text-align:center;
  font-family:var(--font-mono);font-size:.6rem;color:var(--gold);font-weight:700}
.upgrade[data-kind="click"] .u-glyph{stroke:var(--astral)}
.upgrade[data-kind="global"] .u-glyph{stroke:var(--violet)}
/* tooltip */
.upgrade .u-tip{
  position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(6px);
  width:200px;padding:11px 13px;border-radius:10px;border:1px solid var(--edge);
  background:rgba(8,11,24,.97);box-shadow:0 16px 40px -10px #000;
  opacity:0;visibility:hidden;transition:.16s var(--ease);z-index:20;pointer-events:none}
.upgrade:hover .u-tip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.u-tip h4{font-family:var(--font-display);font-size:.82rem;color:var(--gold-bright);margin-bottom:4px;letter-spacing:.03em}
.u-tip p{font-size:.72rem;color:var(--ink-dim);line-height:1.45}
.u-tip .u-tip-cost{margin-top:7px;font-family:var(--font-mono);font-size:.72rem;color:var(--gold);font-weight:700}
.u-tip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);
  border:6px solid transparent;border-top-color:var(--edge)}
.empty-note{font-size:.78rem;color:var(--ink-faint);text-align:center;padding:30px 0}

/* ---------- Ascension ---------- */
.ascend-head{display:flex;gap:14px;margin-bottom:18px}
.ascend-stat{flex:1;padding:14px;border:1px solid var(--edge-soft);border-radius:12px;text-align:center;
  background:radial-gradient(120% 120% at 50% 0%,rgba(182,156,255,.08),transparent)}
.ascend-num{display:block;font-family:var(--font-mono);font-weight:700;font-size:1.5rem;color:var(--violet)}
.ascend-cap{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint)}
.ascend-grid{display:flex;flex-direction:column;gap:11px}
.ascend-card{
  display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;
  padding:15px 17px;border:1px solid var(--edge-soft);border-radius:12px;
  background:linear-gradient(100deg,var(--panel),var(--panel-2));transition:.16s var(--ease)}
.ascend-card.affordable{border-color:var(--violet-deep);box-shadow:0 0 22px -8px rgba(182,156,255,.5)}
.ascend-card.owned{border-color:var(--violet-deep);background:linear-gradient(100deg,rgba(107,84,196,.14),rgba(107,84,196,.04))}
.ascend-card h4{font-family:var(--font-display);font-size:.96rem;color:var(--ink);letter-spacing:.03em;margin-bottom:4px}
.ascend-card.owned h4{color:var(--violet)}
.ascend-card p{font-size:.74rem;color:var(--ink-dim);line-height:1.4}
.ascend-buy{padding:9px 16px;border-radius:8px;font-family:var(--font-mono);font-weight:700;font-size:.82rem;
  white-space:nowrap;border:1px solid var(--violet-deep);color:var(--violet);
  background:rgba(107,84,196,.12);transition:.16s var(--ease)}
.ascend-card.affordable .ascend-buy:hover{background:var(--violet-deep);color:#fff}
.ascend-buy:disabled{opacity:.4;cursor:default}
.ascend-owned-tag{font-family:var(--font-display);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--violet)}

/* ---------- Codex ---------- */
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:11px;margin-bottom:26px}
.stat-cell{padding:13px 15px;border:1px solid var(--edge-soft);border-radius:10px;background:var(--panel-2)}
.stat-cell .s-val{display:block;font-family:var(--font-mono);font-weight:700;font-size:1.18rem;color:var(--gold-bright)}
.stat-cell .s-lab{font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);margin-top:3px}
.codex-h{font-family:var(--font-display);font-size:1rem;letter-spacing:.06em;color:var(--gold-bright);
  margin-bottom:13px;display:flex;align-items:baseline;gap:10px}
.codex-count{font-family:var(--font-mono);font-size:.74rem;color:var(--ink-faint);font-weight:400}
.ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:9px}
.ach{position:relative;aspect-ratio:1;border-radius:10px;border:1px solid var(--edge-soft);
  display:grid;place-items:center;background:var(--panel-2);transition:.16s var(--ease)}
.ach svg{width:26px;height:26px;fill:none;stroke:var(--ink-faint);stroke-width:1.4;opacity:.4}
.ach.unlocked{border-color:var(--gold);background:radial-gradient(circle at 50% 35%,rgba(232,196,122,.16),var(--panel-2))}
.ach.unlocked svg{stroke:var(--gold);opacity:1;filter:drop-shadow(0 0 6px var(--gold-glow))}
.ach:hover{transform:translateY(-2px);z-index:5}
.ach .a-tip{position:absolute;bottom:calc(100% + 9px);left:50%;transform:translateX(-50%) translateY(6px);
  width:170px;padding:10px;border-radius:9px;border:1px solid var(--edge);background:rgba(8,11,24,.97);
  opacity:0;visibility:hidden;transition:.15s var(--ease);z-index:30;text-align:center;pointer-events:none;box-shadow:0 14px 36px -10px #000}
.ach:hover .a-tip{opacity:1;visibility:visible;transform:translateX(-50%)}
.a-tip h5{font-family:var(--font-display);font-size:.78rem;color:var(--gold-bright);margin-bottom:3px}
.a-tip p{font-size:.68rem;color:var(--ink-dim);line-height:1.4}

/* ---------- Toasts ---------- */
.toast-stack{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:60;
  display:flex;flex-direction:column;gap:9px;align-items:center;pointer-events:none;width:min(92vw,420px)}
.toast{
  display:flex;align-items:center;gap:12px;width:100%;
  padding:12px 18px;border-radius:12px;border:1px solid var(--edge);
  background:linear-gradient(100deg,rgba(13,17,36,.97),rgba(20,26,52,.97));
  box-shadow:0 16px 44px -12px #000,0 0 24px -8px var(--gold-glow);
  animation:toastIn .4s var(--ease)}
.toast.out{animation:toastOut .4s var(--ease) forwards}
@keyframes toastIn{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateY(10px) scale(.97)}}
.toast .t-ico{width:30px;height:30px;flex:none;display:grid;place-items:center;border-radius:8px;border:1px solid var(--edge-soft)}
.toast .t-ico svg{width:18px;height:18px;fill:var(--gold);stroke:var(--gold)}
.toast.dm .t-ico svg{fill:var(--violet);stroke:var(--violet)}
.toast .t-body{min-width:0}
.toast .t-title{font-family:var(--font-display);font-size:.82rem;color:var(--gold-bright);letter-spacing:.04em}
.toast.dm .t-title{color:var(--violet)}
.toast .t-sub{font-size:.7rem;color:var(--ink-dim);margin-top:1px}

/* ---------- Modal ---------- */
.modal-host{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:20px}
.modal-host[hidden]{display:none}
.modal-backdrop{position:absolute;inset:0;background:rgba(3,4,10,.78);backdrop-filter:blur(4px);animation:fadein .25s}
.modal{position:relative;width:min(560px,94vw);max-height:88vh;overflow:auto;
  padding:30px clamp(20px,4vw,40px);border:1px solid var(--edge);border-radius:16px;
  background:var(--panel);backdrop-filter:blur(16px);box-shadow:0 40px 100px -20px #000;
  animation:modalIn .3s var(--ease)}
@keyframes modalIn{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}
.modal-x{position:absolute;top:14px;right:16px;width:32px;height:32px;border-radius:50%;
  border:1px solid var(--edge-soft);color:var(--ink-dim);font-size:.85rem;display:grid;place-items:center;transition:.15s}
.modal-x:hover{border-color:var(--gold);color:var(--gold)}
.modal-content h2{font-family:var(--font-display);font-size:1.4rem;letter-spacing:.06em;color:var(--gold-bright);
  text-transform:uppercase;margin-bottom:4px}
.modal-content h2.dm{color:var(--violet)}
.modal-content .sub{color:var(--ink-faint);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:20px}
.modal-content p{color:var(--ink-dim);font-size:.9rem;line-height:1.6;margin-bottom:13px}
.modal-content p strong{color:var(--gold);font-family:var(--font-mono)}
.modal-content ul{list-style:none;margin:0 0 16px}
.modal-content li{position:relative;padding-left:22px;color:var(--ink-dim);font-size:.86rem;line-height:1.55;margin-bottom:8px}
.modal-content li::before{content:"✦";position:absolute;left:0;color:var(--gold);font-size:.8rem}
.modal-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:8px}
.m-btn{padding:11px 22px;border-radius:10px;font-family:var(--font-display);letter-spacing:.12em;text-transform:uppercase;
  font-size:.74rem;font-weight:600;border:1px solid var(--edge);color:var(--gold);background:var(--panel-2);transition:.16s var(--ease)}
.m-btn:hover{border-color:var(--gold);box-shadow:0 0 18px -4px var(--gold-glow)}
.m-btn.primary{background:var(--gold);color:var(--void-0)}
.m-btn.danger{color:var(--danger);border-color:rgba(232,138,138,.4)}
.m-btn.danger:hover{background:rgba(232,138,138,.12);box-shadow:0 0 18px -4px rgba(232,138,138,.5)}
.modal textarea{width:100%;height:120px;margin:6px 0 14px;padding:12px;border-radius:10px;resize:vertical;
  border:1px solid var(--edge-soft);background:var(--void-1);color:var(--ink);font-family:var(--font-mono);font-size:.74rem}
.set-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 0;border-bottom:1px solid var(--edge-soft)}
.set-row:last-child{border-bottom:none}
.set-row .set-label{font-size:.86rem;color:var(--ink)}
.set-row .set-desc{font-size:.72rem;color:var(--ink-faint);margin-top:2px}
.switch{position:relative;width:46px;height:25px;border-radius:25px;border:1px solid var(--edge);background:var(--void-1);flex:none;transition:.2s}
.switch::after{content:"";position:absolute;top:2px;left:2px;width:19px;height:19px;border-radius:50%;background:var(--ink-faint);transition:.2s var(--ease)}
.switch.on{background:rgba(232,196,122,.2);border-color:var(--gold)}
.switch.on::after{left:23px;background:var(--gold);box-shadow:0 0 10px var(--gold-glow)}

/* number ticking flash */
.flash{animation:flash .4s var(--ease)}
@keyframes flash{0%{color:#fff;text-shadow:0 0 30px var(--gold-bright)}100%{}}

/* ---------- Responsive ---------- */
@media (max-width:880px){
  .stage{grid-template-columns:1fr;padding:14px}
  .forge-panel{position:static;top:auto}
  .topbar{flex-wrap:wrap;gap:10px}
  .brand-name{font-size:.8rem;letter-spacing:.24em}
  .forge-wrap{width:min(300px,76vw)}
}
@media (max-width:520px){
  .building{grid-template-columns:46px 1fr;gap:11px}
  .b-buy{grid-column:2;flex-direction:row;justify-content:space-between;align-items:center;width:100%;margin-top:6px}
  .b-icon{width:46px;height:46px}
  .tab{padding:9px 12px;letter-spacing:.1em}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important}
  .forge-core{animation:none}
}