/* ============================================================
   MU ONLINE SERVER FILES — tokens
   ============================================================ */
:root{
  --void:#08070a;
  --obsidian:#0e0c11;
  --slab:#15121a;
  --slab-2:#1b1722;
  --crimson:#b01521;
  --ember:#f0424d;
  --gold:#c8a24a;
  --gilt:#ebd9a4;
  --bone:#e4dccb;
  --ash:#8b8394;
  --rune:rgba(200,162,74,.22);
  --rune-soft:rgba(200,162,74,.10);
  --blood-glow:0 0 24px rgba(176,21,33,.45);

  --f-display:"Cinzel","Trajan Pro",Georgia,serif;
  --f-body:"Spectral",Georgia,"Times New Roman",serif;
  --f-mono:"JetBrains Mono","SFMono-Regular",Consolas,monospace;

  --shell:1240px;
  --ease:cubic-bezier(.22,.8,.28,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--void);
  color:var(--bone);
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* ambient obsidian texture + crimson bleed */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(900px 520px at 78% -8%, rgba(176,21,33,.16), transparent 62%),
    radial-gradient(760px 480px at 6% 12%, rgba(200,162,74,.07), transparent 60%),
    radial-gradient(1000px 700px at 50% 108%, rgba(176,21,33,.09), transparent 65%);
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}
.shell{width:min(var(--shell),100% - 2.5rem);margin-inline:auto;position:relative;z-index:1;}

::selection{background:rgba(176,21,33,.55);color:#fff;}
:focus-visible{outline:2px solid var(--gilt);outline-offset:3px;}
a{color:var(--gilt);}

/* ============================================================
   HEADER
   ============================================================ */
.topbar{
  position:sticky;top:0;z-index:60;
  background:linear-gradient(180deg,rgba(8,7,10,.97),rgba(8,7,10,.88));
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--rune);
  box-shadow:0 12px 40px -24px #000;
}
.topbar-in{display:flex;align-items:center;gap:1.25rem;padding:.85rem 0;}
.mark{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:0 0 auto;}
.mark svg{width:34px;height:34px;filter:drop-shadow(0 0 10px rgba(176,21,33,.6));}
.wordmark{line-height:1.1;}
.wordmark b{
  display:block;font-family:var(--f-display);font-weight:900;
  font-size:.92rem;letter-spacing:.13em;color:var(--gilt);text-transform:uppercase;
  white-space:nowrap;
}
.wordmark span{
  display:block;font-family:var(--f-mono);font-size:.58rem;letter-spacing:.22em;
  color:var(--ash);text-transform:uppercase;white-space:nowrap;
}
.search{position:relative;flex:1 1 auto;max-width:430px;margin-left:auto;}
.search input{
  width:100%;padding:.62rem 2.4rem .62rem 2.3rem;
  background:var(--slab);border:1px solid var(--rune);border-radius:2px;
  color:var(--bone);font-family:var(--f-mono);font-size:.78rem;letter-spacing:.03em;
  transition:border-color .25s,box-shadow .25s,background .25s;
}
.search input::placeholder{color:#6c6478;}
.search input:focus{outline:none;border-color:var(--gold);background:var(--slab-2);box-shadow:0 0 0 1px rgba(200,162,74,.25),0 0 18px -6px rgba(200,162,74,.5);}
.search .ico{position:absolute;left:.72rem;top:50%;transform:translateY(-50%);color:var(--gold);opacity:.65;font-size:.8rem;pointer-events:none;}
.search kbd{
  position:absolute;right:.5rem;top:50%;transform:translateY(-50%);
  font-family:var(--f-mono);font-size:.58rem;color:var(--ash);
  border:1px solid var(--rune);border-radius:2px;padding:.1rem .3rem;pointer-events:none;
}
.btn{
  font-family:var(--f-display);font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  font-size:.72rem;padding:.72rem 1.15rem;border-radius:2px;cursor:pointer;
  border:1px solid var(--crimson);
  background:linear-gradient(180deg,#2a0f14,#160a0d);
  color:var(--gilt);position:relative;transition:.28s var(--ease);white-space:nowrap;
}
.btn:hover{background:linear-gradient(180deg,#3d151c,#210d12);border-color:var(--ember);box-shadow:var(--blood-glow);transform:translateY(-1px);}
.btn:active{transform:translateY(0);}
.btn-ghost{border-color:var(--rune);background:transparent;color:var(--gold);}
.btn-ghost:hover{border-color:var(--gold);background:rgba(200,162,74,.07);box-shadow:none;}

/* ============================================================
   ERA TABS
   ============================================================ */
.tabrail{
  position:sticky;top:63px;z-index:55;
  background:linear-gradient(180deg,rgba(14,12,17,.97),rgba(10,9,13,.92));
  border-bottom:1px solid var(--rune);
}
.tabs{display:flex;gap:0;overflow-x:auto;scrollbar-width:none;}
.tabs::-webkit-scrollbar{display:none;}
.tab{
  flex:1 0 auto;min-width:172px;text-align:left;
  background:none;border:0;border-right:1px solid var(--rune-soft);
  padding:.85rem 1.1rem .8rem;cursor:pointer;color:var(--ash);
  position:relative;transition:.3s var(--ease);
}
.tab:last-child{border-right:0;}
.tab .n{
  font-family:var(--f-display);font-size:.62rem;letter-spacing:.24em;
  color:var(--gold);opacity:.55;display:block;
}
.tab .t{
  font-family:var(--f-display);font-weight:700;font-size:.83rem;letter-spacing:.06em;
  color:inherit;display:block;text-transform:uppercase;transition:color .3s;
}
.tab .r{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.08em;opacity:.7;display:block;margin-top:.15rem;}
.tab::after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:linear-gradient(90deg,transparent,var(--crimson),transparent);
  transform:scaleX(0);transition:transform .35s var(--ease);
}
.tab:hover{color:var(--bone);background:rgba(200,162,74,.04);}
.tab:hover .n{opacity:.9;}
.tab[aria-selected="true"]{color:var(--gilt);background:linear-gradient(180deg,rgba(176,21,33,.16),transparent);}
.tab[aria-selected="true"] .n{opacity:1;}
.tab[aria-selected="true"]::after{transform:scaleX(1);}
.tab.dim{opacity:.25;filter:grayscale(1);}
.tab.dim:hover{opacity:.5;}

/* ============================================================
   RUNE DIVIDER
   ============================================================ */
.runeline{
  display:flex;align-items:center;gap:1rem;margin:0;padding:2.4rem 0 1.4rem;
}
.runeline::before,.runeline::after{
  content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--rune),transparent);
}
.runeline span{
  font-family:var(--f-display);font-size:.66rem;letter-spacing:.34em;text-transform:uppercase;
  color:var(--gold);opacity:.8;white-space:nowrap;
}

/* ============================================================
   HERO
   ============================================================ */
.hero{display:grid;grid-template-columns:1.45fr .85fr;gap:3rem;align-items:center;padding:3.2rem 0 1rem;}
.eyebrow{
  font-family:var(--f-mono);font-size:.66rem;letter-spacing:.32em;text-transform:uppercase;
  color:var(--gold);display:flex;align-items:center;gap:.6rem;margin-bottom:1.1rem;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--gold);}
.hero h1{
  font-family:var(--f-display);font-weight:900;
  font-size:clamp(2.3rem,5.6vw,4.15rem);line-height:1.02;margin:0 0 .7rem;
  letter-spacing:.005em;color:#fff;
  text-shadow:0 0 40px rgba(176,21,33,.45),0 2px 0 #000;
}
.hero h1 em{font-style:normal;display:block;color:var(--gilt);font-size:.44em;letter-spacing:.2em;margin-top:.7rem;text-shadow:none;font-weight:500;}
.patchline{
  font-family:var(--f-mono);font-size:.75rem;color:var(--ash);letter-spacing:.05em;
  border-left:2px solid var(--crimson);padding-left:.8rem;margin:1.3rem 0;
}
.patchline b{color:var(--ember);font-weight:600;}
.hero p.lede{color:#b9b1c0;max-width:56ch;font-size:1.02rem;}
.tags{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1.5rem;}
.tag{
  font-family:var(--f-mono);font-size:.65rem;letter-spacing:.09em;text-transform:uppercase;
  border:1px solid var(--rune);border-radius:2px;padding:.3rem .6rem;color:var(--gilt);
  background:rgba(200,162,74,.045);transition:.25s var(--ease);
}
.tag:hover{border-color:var(--gold);background:rgba(200,162,74,.13);transform:translateY(-2px);}
.tag.hit{border-color:var(--ember);color:#fff;background:rgba(176,21,33,.25);}

/* --- SIGNATURE: the era seal --- */
.seal{display:grid;place-items:center;position:relative;min-height:330px;}
.seal svg{width:min(330px,84vw);height:auto;overflow:visible;}
.seal .ring-o{transform-origin:center;animation:spin 78s linear infinite;}
.seal .ring-i{transform-origin:center;animation:spin 52s linear infinite reverse;}
.seal .glyph{font-family:var(--f-display);font-size:12px;fill:var(--gold);opacity:.75;}
.seal .numeral{
  font-family:var(--f-display);font-weight:900;font-size:62px;fill:#fff;
  text-anchor:middle;dominant-baseline:central;
  filter:drop-shadow(0 0 18px rgba(176,21,33,.9));
}
.seal .sublabel{
  font-family:var(--f-mono);font-size:8.5px;fill:var(--gold);letter-spacing:2.6px;text-anchor:middle;
}
.seal-core{filter:drop-shadow(0 0 26px rgba(176,21,33,.5));}
.seal-pulse{transform-origin:center;animation:breathe 5.5s ease-in-out infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
@keyframes breathe{0%,100%{opacity:.32;transform:scale(1);}50%{opacity:.75;transform:scale(1.045);}}

/* ============================================================
   PANELS
   ============================================================ */
.panel{
  background:linear-gradient(180deg,var(--slab),var(--obsidian));
  border:1px solid var(--rune);border-radius:2px;padding:1.6rem 1.5rem;position:relative;
}
.panel::before,.panel::after{
  content:"";position:absolute;width:12px;height:12px;border:1px solid var(--gold);opacity:.55;
}
.panel::before{top:-1px;left:-1px;border-right:0;border-bottom:0;}
.panel::after{bottom:-1px;right:-1px;border-left:0;border-top:0;}
.panel h3{
  font-family:var(--f-display);font-size:.76rem;font-weight:700;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold);margin:0 0 1.15rem;
}

/* spec ledger with dotted leaders */
.grid-2{display:grid;grid-template-columns:1.25fr .75fr;gap:1.2rem;}
.ledger{list-style:none;margin:0;padding:0;}
.ledger li{display:flex;align-items:baseline;gap:.5rem;padding:.62rem 0;border-bottom:1px dashed rgba(200,162,74,.12);}
.ledger li:last-child{border-bottom:0;}
.ledger .k{
  font-family:var(--f-mono);font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--ash);white-space:nowrap;
}
.ledger .lead{flex:1;height:1px;border-bottom:1px dotted rgba(200,162,74,.32);transform:translateY(-3px);}
.ledger .v{font-size:.94rem;color:var(--bone);text-align:right;}
.ledger .v small{display:block;font-family:var(--f-mono);font-size:.62rem;color:var(--ash);letter-spacing:.05em;}

/* stability */
.stability{text-align:center;display:flex;flex-direction:column;justify-content:center;}
.pips{display:flex;gap:.35rem;justify-content:center;margin:.3rem 0 .9rem;}
.pip{width:26px;height:32px;position:relative;}
.pip svg{width:100%;height:100%;}
.pip path{fill:rgba(255,255,255,.05);stroke:var(--rune);stroke-width:1.5;transition:.45s var(--ease);}
.pip.on path{fill:rgba(176,21,33,.55);stroke:var(--ember);filter:drop-shadow(0 0 8px rgba(240,66,77,.55));}
.pip.half path{fill:url(#halfgrad);stroke:var(--ember);}
.stability .score{font-family:var(--f-display);font-size:2.4rem;font-weight:900;color:#fff;line-height:1;}
.stability .score span{font-size:.9rem;color:var(--ash);font-weight:500;}
.stability .verdict{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gilt);margin-top:.55rem;}
.stability .note{font-size:.82rem;color:var(--ash);margin-top:.5rem;font-style:italic;}

/* ============================================================
   METRICS
   ============================================================ */
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;}
.metric{
  background:linear-gradient(180deg,var(--slab-2),var(--obsidian));
  border:1px solid var(--rune);border-radius:2px;padding:1.15rem 1.1rem;position:relative;overflow:hidden;
  transition:.3s var(--ease);
}
.metric::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 55%,rgba(176,21,33,.10));
  opacity:0;transition:opacity .3s;
}
.metric:hover{transform:translateY(-3px);border-color:var(--gold);}
.metric:hover::after{opacity:1;}
.metric .lbl{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ash);}
.metric .val{font-family:var(--f-mono);font-weight:600;font-size:2rem;color:var(--gilt);line-height:1.15;margin-top:.35rem;letter-spacing:-.02em;}
.metric .val u{text-decoration:none;font-size:.85rem;color:var(--ash);margin-left:.2rem;}
.metric .sub{font-size:.78rem;color:#9a92a8;margin-top:.15rem;}
.metric.crit .val{color:var(--ember);}

.pulsewrap{margin-top:1rem;display:grid;grid-template-columns:1fr 280px;gap:1rem;}
.pulse{padding:1.15rem 1.3rem;}
.pulse .head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem;}
.pulse .head b{font-family:var(--f-display);font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold);font-weight:700;}
.pulse .head i{font-family:var(--f-mono);font-size:.63rem;letter-spacing:.1em;color:var(--ash);font-style:normal;}
.pulse svg{width:100%;height:104px;display:block;}
.pulse .trace{fill:none;stroke:var(--ember);stroke-width:1.6;filter:drop-shadow(0 0 6px rgba(240,66,77,.7));}
.pulse .trace.draw{stroke-dasharray:2200;stroke-dashoffset:2200;animation:draw 1.5s var(--ease) forwards;}
@keyframes draw{to{stroke-dashoffset:0;}}
.pulse .grid-l{stroke:rgba(200,162,74,.13);stroke-width:1;}
.pulse .fillunder{fill:url(#pulseGrad);opacity:.55;}
.hostspecs .ledger li{padding:.44rem 0;}
.hostspecs .v{font-family:var(--f-mono);font-size:.76rem;}

/* ============================================================
   ZONE / RAID GRID
   ============================================================ */
.zonehead{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap;}
.zonehead .count{font-family:var(--f-mono);font-size:.66rem;letter-spacing:.14em;color:var(--ash);text-transform:uppercase;}
.zones{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1rem;margin-top:1.2rem;}
.card{
  position:relative;border:1px solid var(--rune);border-radius:2px;overflow:hidden;
  background:var(--obsidian);cursor:default;transition:.35s var(--ease);
}
.card:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 18px 40px -22px #000,0 0 22px -12px rgba(200,162,74,.5);}
.card .art{
  height:132px;position:relative;overflow:hidden;background:#0b0a0e;
  border-bottom:1px solid var(--rune);
}
.card .art svg{
  position:absolute;inset:0;width:100%;height:100%;display:block;
  transition:transform .7s var(--ease);
}
.card:hover .art svg{transform:scale(1.06);}
.card .art::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(120% 80% at 50% 40%, transparent 40%, rgba(8,7,10,.55)),
    linear-gradient(180deg,transparent 52%,rgba(8,7,10,.9));
}
/* glowing focal elements brighten on hover */
.card .art .gl{opacity:.72;transition:opacity .45s var(--ease);}
.card:hover .art .gl{opacity:1;}
/* ambient motes: embers, bubbles, snow */
@keyframes mote{0%{transform:translateY(0);opacity:0;}18%{opacity:.85;}100%{transform:translateY(-58px);opacity:0;}}
.card .art .mote{animation:mote 5s linear infinite;}
@keyframes fall{0%{transform:translateY(-14px);opacity:0;}20%{opacity:.8;}100%{transform:translateY(60px);opacity:0;}}
.card .art .flake{animation:fall 7s linear infinite;}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(-5px);}}
.card .art .bob{animation:bob 6.5s ease-in-out infinite;}
@keyframes turn{to{transform:rotate(360deg);}}
.card .art .turn{animation:turn 26s linear infinite;transform-box:fill-box;transform-origin:center;}
.card .body{padding:.85rem .9rem 1rem;}
.card h4{font-family:var(--f-display);font-size:.94rem;font-weight:700;margin:0;letter-spacing:.05em;color:var(--bone);}
.card .meta{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ash);margin-top:.2rem;}
.card p{font-size:.82rem;color:#9a92a8;margin:.55rem 0 0;line-height:1.5;}
.badge{
  position:absolute;top:.55rem;right:.55rem;z-index:2;
  font-family:var(--f-mono);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;
  padding:.2rem .45rem;border-radius:2px;border:1px solid;backdrop-filter:blur(4px);
}
.badge.raid{color:#ffd8da;border-color:var(--ember);background:rgba(176,21,33,.4);box-shadow:0 0 14px -4px var(--ember);}
.badge.zone{color:var(--gilt);border-color:var(--rune);background:rgba(8,7,10,.6);}
.badge.event{color:#cfe4ff;border-color:rgba(120,160,220,.5);background:rgba(30,50,90,.4);}
.empty{
  grid-column:1/-1;text-align:center;padding:3rem 1rem;color:var(--ash);
  border:1px dashed var(--rune);border-radius:2px;
}
.empty b{display:block;font-family:var(--f-display);letter-spacing:.18em;text-transform:uppercase;color:var(--gilt);margin-bottom:.4rem;}

/* ============================================================
   MODAL
   ============================================================ */
.scrim{
  position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:1.2rem;
  background:rgba(4,3,6,.86);backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;transition:opacity .3s var(--ease);
}
.scrim.open{opacity:1;pointer-events:auto;}
.modal{
  width:min(760px,100%);max-height:88vh;overflow-y:auto;
  background:linear-gradient(180deg,#191420,#0c0a0f);
  border:1px solid var(--gold);border-radius:2px;padding:1.7rem;
  box-shadow:0 0 0 1px rgba(0,0,0,.8),0 40px 100px -30px #000,0 0 70px -30px rgba(176,21,33,.9);
  transform:translateY(18px) scale(.985);transition:transform .35s var(--ease);
  position:relative;
}
.scrim.open .modal{transform:none;}
.modal::before,.modal::after{
  content:"";position:absolute;width:20px;height:20px;border:1px solid var(--gilt);opacity:.7;
}
.modal::before{top:8px;left:8px;border-right:0;border-bottom:0;}
.modal::after{bottom:8px;right:8px;border-left:0;border-top:0;}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.3rem;}
.modal-head h2{font-family:var(--f-display);font-size:1.35rem;font-weight:900;margin:.15rem 0 0;letter-spacing:.05em;color:#fff;}
.modal-head .sub{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);}
.x{background:none;border:1px solid var(--rune);color:var(--ash);width:32px;height:32px;border-radius:2px;cursor:pointer;font-size:1rem;line-height:1;transition:.25s;}
.x:hover{color:var(--ember);border-color:var(--ember);transform:rotate(90deg);}
.seg{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--rune);border-radius:2px;overflow:hidden;margin-bottom:1.2rem;}
.seg button{
  background:transparent;border:0;padding:.85rem .8rem;cursor:pointer;color:var(--ash);
  font-family:var(--f-display);font-size:.72rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  transition:.28s var(--ease);border-right:1px solid var(--rune);text-align:center;
}
.seg button:last-child{border-right:0;}
.seg button small{display:block;font-family:var(--f-mono);font-size:.56rem;letter-spacing:.08em;text-transform:none;opacity:.75;margin-top:.22rem;font-weight:400;}
.seg button:hover{color:var(--bone);background:rgba(200,162,74,.06);}
.seg button[aria-pressed="true"]{background:linear-gradient(180deg,rgba(176,21,33,.3),rgba(176,21,33,.08));color:var(--gilt);box-shadow:inset 0 -2px 0 var(--crimson);}
.tierinfo{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;}
.code{
  background:#07060a;border:1px solid var(--rune);border-radius:2px;position:relative;
}
.code .bar{
  display:flex;justify-content:space-between;align-items:center;
  padding:.45rem .6rem .45rem .8rem;border-bottom:1px solid var(--rune);background:rgba(200,162,74,.04);
}
.code .bar span{font-family:var(--f-mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);}
.copy{background:none;border:1px solid var(--rune);color:var(--ash);font-family:var(--f-mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;padding:.25rem .5rem;border-radius:2px;cursor:pointer;transition:.25s;}
.copy:hover{color:var(--gilt);border-color:var(--gold);}
.copy.done{color:#8ef0a8;border-color:#8ef0a8;}
.code pre{
  margin:0;padding:1rem .95rem;overflow-x:auto;
  font-family:var(--f-mono);font-size:.74rem;line-height:1.85;color:#cfc7db;
}
.code .cm{color:#6b6379;font-style:italic;}
.code .cmd{color:var(--gilt);}
.code .flag{color:#e0868d;}
.modal .foot{
  margin-top:1.2rem;padding-top:1rem;border-top:1px dashed rgba(200,162,74,.18);
  font-size:.8rem;color:var(--ash);display:flex;justify-content:space-between;gap:1rem;align-items:center;flex-wrap:wrap;
}
.modal .foot em{color:var(--gilt);font-style:normal;font-family:var(--f-mono);font-size:.65rem;letter-spacing:.1em;}

/* ============================================================
   FOOTER + transitions
   ============================================================ */
/* ---- pricing ---- */
.pricing{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.3rem;}
.tierc{
  background:linear-gradient(180deg,var(--slab),var(--obsidian));
  border:1px solid var(--rune);border-radius:2px;padding:1.4rem 1.3rem;
  position:relative;display:flex;flex-direction:column;transition:.35s var(--ease);
}
.tierc:hover{transform:translateY(-4px);border-color:var(--gold);box-shadow:0 20px 44px -26px #000;}
.tierc.featured{border-color:var(--crimson);box-shadow:0 0 40px -22px var(--ember);}
.tierc.featured::before{
  content:"Most requested";position:absolute;top:-1px;right:-1px;
  font-family:var(--f-mono);font-size:.55rem;letter-spacing:.16em;text-transform:uppercase;
  background:var(--crimson);color:#fff;padding:.24rem .5rem;
}
.tierc h4{
  font-family:var(--f-display);font-size:.86rem;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--gilt);margin:0 0 .2rem;
}
.tierc .who{font-size:.79rem;color:var(--ash);font-style:italic;min-height:2.4em;}
.tierc .amt{
  font-family:var(--f-mono);font-weight:600;font-size:2.1rem;color:#fff;
  line-height:1.1;margin:.7rem 0 .1rem;letter-spacing:-.02em;
}
.tierc .amt s{text-decoration:none;font-size:.86rem;color:var(--ash);}
.tierc .dep{font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;color:var(--gold);text-transform:uppercase;}
.tierc ul{list-style:none;margin:1rem 0 0;padding:0;flex:1;}
.tierc li{
  font-size:.83rem;color:#a49cb2;padding:.32rem 0 .32rem 1.1rem;position:relative;line-height:1.45;
}
.tierc li::before{content:"◆";position:absolute;left:0;top:.32rem;color:var(--gold);font-size:.55rem;}
.tierc .eta{
  margin-top:1rem;padding-top:.7rem;border-top:1px dashed rgba(200,162,74,.16);
  font-family:var(--f-mono);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ash);
}

/* ---- purchase CTA on pricing cards ---- */
.tierc .buy{
  display:block;margin-top:1rem;text-align:center;text-decoration:none;
  border-color:var(--rune);background:transparent;color:var(--gold);
}
.tierc .buy:hover{border-color:var(--gold);background:rgba(200,162,74,.1);box-shadow:none;transform:none;}
.tierc.featured .buy{
  border-color:var(--crimson);color:var(--gilt);
  background:linear-gradient(180deg,#2a0f14,#160a0d);
}
.tierc.featured .buy:hover{border-color:var(--ember);box-shadow:var(--blood-glow);background:linear-gradient(180deg,#3d151c,#210d12);}
.paycta{display:flex;flex-direction:column;}
.paycta p{margin:0 0 1.1rem;color:#a49cb2;font-size:.9rem;line-height:1.6;flex:1;}
.paycta .btn{text-align:center;text-decoration:none;display:block;}
.paycta .fine{
  font-family:var(--f-mono);font-size:.58rem;letter-spacing:.12em;color:#6c6478;
  text-transform:uppercase;text-align:center;margin-top:.6rem;
}

/* ---- payment ---- */
.paywrap{display:grid;grid-template-columns:1.05fr .95fr;gap:1rem;margin-top:1rem;}
.addr{
  background:#07060a;border:1px solid var(--rune);border-radius:2px;padding:.9rem;margin-top:.2rem;
}
.addr .who{font-family:var(--f-mono);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);}
.addr code{
  display:block;font-family:var(--f-mono);font-size:.82rem;color:var(--gilt);
  line-height:1.7;word-break:break-all;margin:.45rem 0 .7rem;
}
.addr code i{font-style:normal;opacity:.55;}
.addr .row{display:flex;gap:.5rem;align-items:center;}
.addr .warn{
  font-size:.74rem;color:#c8a24a;margin:.7rem 0 0;padding-top:.6rem;
  border-top:1px dashed rgba(200,162,74,.16);line-height:1.5;
}
.steps{list-style:none;margin:0;padding:0;counter-reset:s;}
.steps li{
  counter-increment:s;position:relative;padding:.55rem 0 .55rem 2.3rem;
  font-size:.85rem;color:#a49cb2;border-bottom:1px dashed rgba(200,162,74,.1);line-height:1.5;
}
.steps li:last-child{border-bottom:0;}
.steps li::before{
  content:counter(s);position:absolute;left:0;top:.5rem;
  width:22px;height:22px;display:grid;place-items:center;
  font-family:var(--f-mono);font-size:.66rem;color:var(--gilt);
  border:1px solid var(--rune);border-radius:50%;background:rgba(200,162,74,.06);
}
.steps li b{color:var(--bone);font-weight:400;}
.steps code{font-family:var(--f-mono);font-size:.78rem;color:var(--ember);}

/* ---- search note ---- */
.searchnote{
  margin:0;padding:0;max-height:0;overflow:hidden;
  font-family:var(--f-mono);font-size:.63rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--gold);transition:max-height .3s var(--ease),padding .3s var(--ease);
}
.searchnote.on{max-height:40px;padding:.5rem 0;}
.searchnote b{color:var(--ember);font-weight:400;}

/* ---- commission band ---- */
.commission{
  margin-top:3.2rem;display:grid;grid-template-columns:1.15fr .85fr;gap:1.6rem;align-items:center;
  padding:1.9rem 1.8rem;
}
.commission h3{margin-bottom:.55rem;}
.commission p{margin:0;color:#a49cb2;font-size:.93rem;max-width:52ch;}
.commission .offers{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem;}
.handle{
  display:flex;align-items:center;gap:.55rem;
  border:1px solid var(--rune);border-radius:2px;padding:.7rem .8rem;
  background:#07060a;
}
.handle .dot{width:8px;height:8px;border-radius:50%;background:#57d78a;box-shadow:0 0 10px #57d78a;flex:0 0 auto;}
.handle code{
  font-family:var(--f-mono);font-size:.86rem;color:var(--gilt);letter-spacing:.02em;
  flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.commission .stack{display:flex;flex-direction:column;gap:.6rem;}
.commission .btn{width:100%;text-align:center;}
.commission .fine{
  font-family:var(--f-mono);font-size:.6rem;letter-spacing:.1em;color:#6c6478;text-transform:uppercase;text-align:center;
}
.handoff{font-size:.78rem;}
.handoff b{color:var(--gilt);font-weight:400;font-family:var(--f-mono);font-size:.72rem;}
@media(max-width:860px){
  .commission{grid-template-columns:1fr;gap:1.2rem;}
  .pricing{grid-template-columns:1fr;}
  .paywrap{grid-template-columns:1fr;}
}

.pagefoot{
  margin-top:3.5rem;padding:2rem 0 3rem;border-top:1px solid var(--rune);
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  font-family:var(--f-mono);font-size:.63rem;letter-spacing:.12em;text-transform:uppercase;color:#6c6478;
}
.pagefoot b{color:var(--gold);font-weight:400;}

.swap{animation:rise .55s var(--ease) both;}
@keyframes rise{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.stagger>*{animation:rise .5s var(--ease) both;}
.stagger>*:nth-child(2){animation-delay:.05s;}
.stagger>*:nth-child(3){animation-delay:.1s;}
.stagger>*:nth-child(4){animation-delay:.15s;}
.stagger>*:nth-child(5){animation-delay:.2s;}
.stagger>*:nth-child(6){animation-delay:.25s;}
.stagger>*:nth-child(7){animation-delay:.3s;}
.stagger>*:nth-child(8){animation-delay:.35s;}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media(max-width:1000px){
  .hero{grid-template-columns:1fr;gap:1.5rem;padding-top:2.2rem;}
  .seal{order:-1;min-height:260px;}
  .seal svg{width:min(240px,68vw);}
  .grid-2{grid-template-columns:1fr;}
  .metrics{grid-template-columns:repeat(2,1fr);}
  .pulsewrap{grid-template-columns:1fr;}
}
@media(max-width:720px){
  .topbar-in{flex-wrap:wrap;gap:.7rem .9rem;}
  .mark svg{width:28px;height:28px;}
  .wordmark b{font-size:.7rem;letter-spacing:.08em;}
  .wordmark span{display:none;}
  .btn{font-size:.64rem;padding:.6rem .8rem;}
  .search{order:3;max-width:none;flex-basis:100%;margin-left:0;}
  .search kbd{display:none;}
  .btn{margin-left:auto;}
  .tabrail{top:112px;}
  .tab{min-width:150px;}
  .hero h1{font-size:2.4rem;}
  .metrics{grid-template-columns:1fr 1fr;}
  .metric .val{font-size:1.6rem;}
  .zones{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));}
  .seg{grid-template-columns:1fr;}
  .seg button{border-right:0;border-bottom:1px solid var(--rune);}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
  html{scroll-behavior:auto;}
}
