/* 99BForever · el Reino: cuenta, Aurum, mercado y la crónica en vivo.
   Va encima de /estilos.css (la landing): mismos tokens de hierro y oro, más cuero, pergamino y lacre. */
:root{
  --leather:#17110c;
  --leather-2:#1f1711;
  --leather-hi:#2a2017;
  --ink:#2b1d10;
  --parch-1:#efe2c2;
  --parch-2:#dcc79a;
  --wax:#8e1d1d;
  --wax-hi:#c2423a;
  --emerald:#5fbf7a;
  --ancient:#5ab4ff;
  --exc:#7cd67c;
  --danger:#e0705f;
  --display:"Cinzel", "Cormorant Garamond", "Times New Roman", serif;
  --tome-line:rgba(217,162,90,.34);
  --shadow:0 18px 50px rgba(0,0,0,.55);
}

/* ───────── página ───────── */
body.reino{
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(141,91,34,.22), transparent 70%),
    radial-gradient(900px 500px at 100% 100%, rgba(94,28,20,.18), transparent 70%),
    var(--iron);
  min-height:100vh;
}
body.reino main{padding:112px 0 72px}
.reino h1,.reino h2,.reino h3{font-family:var(--display);font-weight:700;letter-spacing:.04em;margin:0}
.reino .flavor{font:italic 500 1.15rem/1.5 var(--serif);color:var(--muted);margin:.4rem 0 0}
.reino-head{text-align:center;margin:0 auto 2.4rem;max-width:760px}
.reino-head .kicker{font:700 .78rem/1 var(--sans);letter-spacing:.32em;text-transform:uppercase;color:var(--gold);margin:0 0 .9rem}
.reino-head h1{font-size:clamp(2rem,5vw,3.1rem);line-height:1.1}
.ornament{display:flex;align-items:center;gap:.8rem;justify-content:center;margin:1rem auto 0;max-width:420px}
.ornament::before,.ornament::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--gold))}
.ornament::after{transform:scaleX(-1)}
.ornament i{width:9px;height:9px;transform:rotate(45deg);border:1px solid var(--gold);background:var(--iron)}

/* ───────── el tomo: panel con esquinas forjadas ───────── */
.tome{
  position:relative;background:linear-gradient(180deg,var(--leather-2),var(--leather));
  border:1px solid var(--tome-line);box-shadow:var(--shadow), inset 0 1px 0 rgba(255,231,180,.05);
  padding:clamp(1.2rem,3vw,2rem);
}
.tome::before,.tome::after{
  content:"";position:absolute;width:26px;height:26px;pointer-events:none;
  background:
    linear-gradient(var(--gold),var(--gold)) 0 0/100% 2px no-repeat,
    linear-gradient(var(--gold),var(--gold)) 0 0/2px 100% no-repeat;
  opacity:.8;
}
.tome::before{top:-1px;left:-1px}
.tome::after{bottom:-1px;right:-1px;transform:rotate(180deg)}
.tome > h2,.tome-title{font-size:1.15rem;color:var(--gold-hi);display:flex;align-items:center;gap:.6rem;margin-bottom:1rem}
.tome-title small{font:500 .85rem var(--sans);color:var(--muted);letter-spacing:0;margin-left:auto}

/* pergamino: fichas y recibos */
.parchment{
  color:var(--ink);
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(80% 60% at 0% 100%, rgba(120,80,30,.25), transparent 70%),
    radial-gradient(80% 60% at 100% 100%, rgba(120,80,30,.22), transparent 70%),
    linear-gradient(180deg,var(--parch-1),var(--parch-2));
  box-shadow:var(--shadow), inset 0 0 40px rgba(110,70,25,.35);
  border:1px solid #b89a63;
}
.parchment h2,.parchment h3{color:#3a2412}
.parchment .muted{color:#6b5236}

/* ───────── botones ───────── */
.r-btn{
  --c1:#f7cf8e;--c2:#d9a25a;--c3:#8d5b22;
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;cursor:pointer;
  font:700 .86rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
  color:#1b120a;padding:.95rem 1.4rem;border:0;
  background:linear-gradient(180deg,var(--c1),var(--c2) 55%,var(--c3));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), inset 0 -2px 0 rgba(0,0,0,.25), 0 6px 18px rgba(0,0,0,.4);
  clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);
  transition:filter .2s var(--ease), transform .2s var(--ease);
}
.r-btn:hover{filter:brightness(1.08)}
.r-btn:active{transform:translateY(1px)}
.r-btn[disabled],.r-btn.is-busy{filter:grayscale(.6) brightness(.7);cursor:not-allowed}
.r-btn.ghost{background:transparent;color:var(--gold-hi);box-shadow:inset 0 0 0 1px var(--gold);clip-path:none}
.r-btn.ghost:hover{background:rgba(217,162,90,.1)}
.r-btn.wax{--c1:#d4574c;--c2:#a52a24;--c3:#5e1212;color:#fbe9d6}
.r-btn.small{padding:.62rem .95rem;font-size:.74rem}
.r-btn.block{width:100%}
.r-link{background:none;border:0;color:var(--gold-hi);font:600 .95rem var(--sans);cursor:pointer;text-decoration:underline;text-underline-offset:3px;padding:0}

/* ───────── formularios ───────── */
.field{display:grid;gap:.4rem;margin-bottom:1rem}
.field label{font:700 .74rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.field input,.field select,.field textarea{
  font:500 1.05rem var(--sans);color:var(--parch);background:rgba(0,0,0,.35);
  border:1px solid rgba(217,162,90,.3);padding:.8rem .9rem;width:100%;outline:none;border-radius:0;
  transition:border-color .2s, box-shadow .2s;
}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--gold-hi);box-shadow:0 0 0 3px rgba(217,162,90,.15)}
.field .hint{font-size:.85rem;color:var(--muted)}
.trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-msg{min-height:1.4em;font-size:.95rem;margin:.2rem 0 .8rem}
.form-msg.err{color:var(--danger)}
.form-msg.ok{color:var(--emerald)}

/* ───────── cabecera: botón de cuenta ───────── */
.acct-btn{
  display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;flex:none;
  font:700 .76rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold-hi);
  padding:.58rem .85rem;border:1px solid var(--gold);background:rgba(14,20,24,.6);
}
.acct-btn:hover{background:rgba(217,162,90,.12)}
.acct-btn .seal-mini{width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,var(--wax-hi),var(--wax) 60%,#4a0f0f);box-shadow:0 0 0 1px rgba(0,0,0,.4)}
.nav a[aria-current="page"]{color:var(--gold-hi)}

/* ───────── la puerta (login / registro) ───────── */
.gate{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem;max-width:980px;margin:0 auto}
.gate .tome{display:flex;flex-direction:column}
.gate .tome h2{font-size:1.35rem}
.gate .tome .flavor{margin-bottom:1.3rem}
.gate .actions{margin-top:auto;display:grid;gap:.9rem}
.gate .side-note{font-size:.92rem;color:var(--muted);text-align:center}

/* ───────── el libro de la cuenta ───────── */
.ledger-top{display:grid;grid-template-columns:auto 1fr auto;gap:1.4rem;align-items:center;margin-bottom:1.4rem}
.sigil{width:84px;height:84px;display:grid;place-items:center;position:relative}
.sigil svg{width:100%;height:100%}
.sigil b{position:absolute;font:700 1.9rem var(--display);color:var(--gold-hi);text-shadow:0 2px 6px rgba(0,0,0,.6)}
.ledger-top h1{font-size:clamp(1.6rem,4vw,2.3rem)}
.ledger-top .meta{color:var(--muted);font-size:.95rem;margin-top:.3rem;display:flex;flex-wrap:wrap;gap:.3rem 1.2rem}
.purse{display:flex;gap:1rem;align-items:stretch}
.purse .coin-box{display:grid;gap:.15rem;justify-items:end;padding:.6rem 1rem;border:1px solid var(--tome-line);background:rgba(0,0,0,.25);min-width:140px}
.purse .coin-box span{font:700 .7rem/1 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.purse .coin-box b{font:700 1.5rem/1.1 var(--display);color:var(--gold-hi);display:flex;align-items:center;gap:.4rem}
.au{display:inline-block;width:1.05em;height:1.05em;border-radius:50%;flex:none;vertical-align:-.15em;
  background:radial-gradient(circle at 35% 30%,#fff3c4,#f2c25c 35%,#b97a1f 75%,#6e4510);box-shadow:inset 0 0 0 1px rgba(80,45,5,.6)}

/* sello VIP de lacre */
.vip-seal{position:relative;width:84px;height:84px;flex:none;display:grid;place-items:center;text-align:center}
.vip-seal::before{content:"";position:absolute;inset:0;border-radius:46% 54% 50% 50% / 52% 46% 54% 48%;
  background:radial-gradient(circle at 38% 32%,var(--wax-hi),var(--wax) 58%,#4a0f0f);
  box-shadow:0 6px 16px rgba(0,0,0,.5), inset 0 -4px 8px rgba(0,0,0,.35), inset 0 3px 6px rgba(255,180,160,.25)}
.vip-seal::after{content:"";position:absolute;inset:12px;border-radius:50%;border:1px dashed rgba(255,215,190,.45)}
.vip-seal span{position:relative;font:700 .62rem/1.15 var(--display);letter-spacing:.12em;color:#ffe2d0;text-transform:uppercase}
.vip-seal span b{display:block;font-size:1.5rem;letter-spacing:.02em}
.vip-seal.off::before{background:radial-gradient(circle at 38% 32%,#5b5048,#3a332e 60%,#1e1a17)}

/* estado: en el reino / fuera */
.presence{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;justify-content:space-between;padding:1rem 1.2rem;margin-bottom:1.6rem;
  border:1px solid var(--tome-line);background:linear-gradient(90deg,rgba(95,191,122,.08),transparent 60%)}
.presence.away{background:linear-gradient(90deg,rgba(163,170,168,.06),transparent 60%)}
.presence .who{display:flex;align-items:center;gap:.8rem}
.presence .dot{width:10px;height:10px;border-radius:50%;background:var(--emerald);box-shadow:0 0 0 4px rgba(95,191,122,.18);animation:pulse 2.4s infinite}
.presence.away .dot{background:#6b7377;box-shadow:none;animation:none}
@keyframes pulse{50%{box-shadow:0 0 0 8px rgba(95,191,122,0)}}

/* pestañas tipo marcador de libro */
.tabs{display:flex;gap:.3rem;border-bottom:1px solid var(--tome-line);margin-bottom:1.6rem;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{
  flex:none;cursor:pointer;background:none;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;
  font:700 .8rem/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:.95rem 1.05rem;
}
.tabs button[aria-selected="true"]{color:var(--gold-hi);border-bottom-color:var(--gold)}
.tabs button:hover{color:var(--parch)}
.panel[hidden]{display:none}

/* héroes: retratos */
.heroes{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1.2rem}
.hero-card{
  position:relative;cursor:pointer;text-align:left;padding:0;border:1px solid var(--tome-line);background:var(--leather);
  color:inherit;font:inherit;overflow:hidden;transition:transform .25s var(--ease), border-color .25s;
}
.hero-card:hover,.hero-card:focus-visible{transform:translateY(-3px);border-color:var(--gold)}
.hero-card .portrait{aspect-ratio:590/371;background:#0b0b0b center/cover no-repeat;position:relative}
.hero-card .portrait::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(23,17,12,.95))}
.hero-card .lvl{position:absolute;top:.6rem;left:.6rem;z-index:1;font:700 .72rem/1 var(--sans);letter-spacing:.16em;color:var(--gold-hi);background:rgba(0,0,0,.6);padding:.35rem .5rem;border:1px solid rgba(217,162,90,.35)}
.hero-card .live{position:absolute;top:.6rem;right:.6rem;z-index:1;font:700 .66rem/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:#d8ffe4;background:rgba(30,90,50,.75);padding:.35rem .5rem}
.hero-card .body{padding:.2rem 1rem 1rem;margin-top:-2.2rem;position:relative;z-index:1}
.hero-card h3{font-size:1.25rem;color:var(--parch)}
.hero-card .cls{font:italic 500 1rem var(--serif);color:var(--gold)}
.hero-card .facts{display:flex;gap:1rem;margin-top:.6rem;font-size:.88rem;color:var(--muted)}
.hero-card .facts b{color:var(--parch);font-weight:700}

/* ficha del personaje (pergamino) */
.sheet{display:grid;grid-template-columns:240px 1fr;gap:1.6rem}
.sheet .portrait{aspect-ratio:3/4;background:#0b0b0b center/cover no-repeat;border:3px double #8d5b22;box-shadow:inset 0 0 30px rgba(0,0,0,.6)}
.sheet h2{font-size:1.9rem}
.sheet .cls{font:italic 600 1.15rem var(--serif);color:#7a4a1a}
.attrs{display:grid;gap:.55rem;margin:1.1rem 0}
.attr{display:grid;grid-template-columns:110px 1fr 64px;gap:.7rem;align-items:center;font-weight:700;font-size:.92rem}
.attr .bar{height:8px;background:rgba(60,35,10,.18);border:1px solid rgba(60,35,10,.35)}
.attr .bar i{display:block;height:100%;background:linear-gradient(90deg,#8d5b22,#c88a3a)}
.attr .v{text-align:right;font-variant-numeric:tabular-nums}
.sheet-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.6rem;margin:.6rem 0 1rem}
.sheet-facts div{border:1px solid rgba(60,35,10,.3);padding:.5rem .7rem;background:rgba(255,255,255,.18)}
.sheet-facts span{display:block;font:700 .66rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#7a5a36;margin-bottom:.3rem}
.sheet-facts b{font:700 1.05rem var(--display)}
.gear{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.5rem}
.gear .it{display:flex;gap:.55rem;align-items:center;border:1px solid rgba(60,35,10,.3);background:rgba(20,12,4,.82);color:var(--parch);padding:.45rem .55rem;min-height:56px}
.gear .it img{width:36px;height:36px;object-fit:contain;image-rendering:auto;flex:none}
.gear .it small{display:block;font-size:.72rem;color:var(--muted)}
.gear .it .n{font-size:.84rem;font-weight:700;line-height:1.2}

/* nombres de ítems como en el juego */
.iname{font-weight:700}
.iname.exc{color:var(--exc)}
.iname.anc{color:var(--ancient)}
.iname.lv{color:#f2d27a}

/* ───────── tesoro: Aurum y VIP ───────── */
.packs{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1rem}
.pack{position:relative;text-align:center;padding:1.4rem 1rem 1.2rem;border:1px solid var(--tome-line);background:linear-gradient(180deg,var(--leather-hi),var(--leather));display:grid;gap:.5rem;justify-items:center}
.pack.best{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold), 0 12px 40px rgba(217,162,90,.12)}
.pack .ribbon{position:absolute;top:-.7rem;left:50%;transform:translateX(-50%);font:700 .64rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;background:var(--wax);color:#ffe7da;padding:.4rem .7rem;white-space:nowrap}
.pack .coins{display:grid;place-items:center;width:84px;height:84px}
.pack .amount{font:700 2rem/1 var(--display);color:var(--gold-hi)}
.pack .bonus{font-size:.85rem;color:var(--emerald);min-height:1.2em}
.pack .price{font:700 1.05rem var(--sans);color:var(--parch)}
.pack .price small{display:block;font-weight:500;font-size:.8rem;color:var(--muted)}
.gateways{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin:0 0 1.4rem}
.gateways button{cursor:pointer;font:700 .8rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:rgba(0,0,0,.3);border:1px solid rgba(217,162,90,.25);padding:.75rem 1.1rem}
.gateways button[aria-pressed="true"]{color:#1b120a;background:var(--gold);border-color:var(--gold)}
.gateways .test{font-size:.62rem;color:var(--wax-hi);margin-left:.4rem}

.pacts{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.pact{position:relative;padding:1.8rem 1.3rem 1.4rem;border:1px solid var(--tome-line);background:linear-gradient(180deg,var(--leather-hi),var(--leather));display:flex;flex-direction:column;gap:.8rem}
.pact .vip-seal{margin:-3.2rem auto .2rem;width:78px;height:78px}
.pact h3{text-align:center;font-size:1.2rem;color:var(--gold-hi)}
.pact .exp{text-align:center;font:700 2.1rem/1 var(--display);color:var(--parch)}
.pact .exp small{display:block;font:500 .8rem var(--sans);color:var(--muted);letter-spacing:.1em;margin-top:.3rem}
.pact .plans{display:grid;gap:.5rem;margin-top:auto}
.pact .plan{display:flex;justify-content:space-between;align-items:center;gap:.6rem;border:1px solid rgba(217,162,90,.22);padding:.55rem .7rem;background:rgba(0,0,0,.2)}
.pact .plan b{font-family:var(--display)}
.boons{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.8rem;margin-top:1.4rem}
.boon{display:flex;gap:.7rem;align-items:flex-start;padding:.8rem .9rem;border:1px solid rgba(217,162,90,.18);background:rgba(0,0,0,.18)}
.boon i{flex:none;width:30px;height:30px;display:grid;place-items:center;color:var(--gold);border:1px solid rgba(217,162,90,.4);transform:rotate(45deg)}
.boon i svg{transform:rotate(-45deg);width:16px;height:16px}
.boon b{display:block;color:var(--parch)}
.boon span{font-size:.88rem;color:var(--muted)}

/* historial */
.chronicle{list-style:none;margin:0;padding:0;display:grid}
.chronicle li{display:grid;grid-template-columns:120px 1fr auto;gap:1rem;align-items:center;padding:.75rem .2rem;border-bottom:1px dashed rgba(217,162,90,.18)}
.chronicle time{font-size:.85rem;color:var(--muted)}
.chronicle .d{font-family:var(--display);font-weight:700}
.chronicle .d.up{color:var(--emerald)}
.chronicle .d.down{color:var(--danger)}
.pill{display:inline-block;font:700 .66rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;padding:.32rem .5rem;border:1px solid currentColor}
.pill.ok{color:var(--emerald)}
.pill.wait{color:var(--gold)}
.pill.bad{color:var(--danger)}

/* mensajes al staff */
.letters{display:grid;gap:.6rem}
.letter{display:flex;justify-content:space-between;gap:1rem;align-items:center;padding:.85rem 1rem;border:1px solid rgba(217,162,90,.2);background:rgba(0,0,0,.2);cursor:pointer;text-align:left;color:inherit;font:inherit;width:100%}
.letter:hover{border-color:var(--gold)}
.letter.unread{border-left:3px solid var(--wax-hi)}
.thread{display:grid;gap:.8rem;margin:1rem 0}
.msg{padding:.9rem 1rem;border:1px solid rgba(217,162,90,.2);background:rgba(0,0,0,.25)}
.msg.staff{border-color:rgba(217,162,90,.55);background:rgba(217,162,90,.07)}
.msg header{font-size:.8rem;color:var(--muted);margin-bottom:.35rem}
.msg p{margin:0;white-space:pre-wrap}

/* ───────── mercado ───────── */
.bazaar-filters{display:grid;grid-template-columns:2fr repeat(3,1fr) auto;gap:.8rem;align-items:end;margin-bottom:1.4rem}
.bazaar-filters .field{margin:0}
.bazaar{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem}
.ware{display:flex;flex-direction:column;border:1px solid var(--tome-line);background:linear-gradient(180deg,var(--leather-hi),var(--leather));padding:1rem;gap:.7rem;transition:border-color .2s, transform .2s var(--ease)}
.ware:hover{border-color:var(--gold);transform:translateY(-2px)}
.ware .whead{display:flex;gap:.8rem;align-items:center}
.ware .icon{width:64px;height:64px;flex:none;display:grid;place-items:center;background:radial-gradient(circle,rgba(217,162,90,.12),transparent 70%);border:1px solid rgba(217,162,90,.2)}
.ware .icon img{max-width:56px;max-height:56px;object-fit:contain}
.ware .opts{font-size:.85rem;color:#a8c8ff;line-height:1.45;margin:0;padding:0;list-style:none;flex:1}
.ware .opts li.exc{color:var(--exc)}
.ware .opts li.base{color:var(--muted)}
.ware .foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem;border-top:1px dashed rgba(217,162,90,.2);padding-top:.7rem}
.ware .foot .acts{display:flex;gap:.4rem;margin-left:auto}
.ware .price{display:flex;align-items:center;gap:.4rem;font:700 1.15rem var(--display);color:var(--gold-hi)}
.ware .price img{width:28px;height:28px;object-fit:contain}
.ware .seller{font-size:.78rem;color:var(--muted)}
.pager{display:flex;gap:.6rem;justify-content:center;align-items:center;margin-top:1.6rem;color:var(--muted)}

/* ───────── el reino ahora (landing y cuenta) ───────── */
.realm-now{display:grid;grid-template-columns:1fr 2fr;gap:1.4rem;align-items:stretch}
.realm-pulse{display:grid;place-items:center;text-align:center;gap:.4rem;padding:1.6rem}
.realm-pulse .big{font:700 clamp(2.6rem,7vw,4rem)/1 var(--display);color:var(--gold-hi)}
.realm-pulse .lbl{font:700 .74rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.realm-pulse .worlds{font-size:.9rem;color:var(--muted)}
.omens{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.omens li{display:grid;grid-template-columns:42px 1fr auto;gap:.9rem;align-items:center;padding:.7rem .8rem;border:1px solid rgba(217,162,90,.16);background:rgba(0,0,0,.2)}
.omens .glyph{width:42px;height:42px;display:grid;place-items:center;border:1px solid rgba(217,162,90,.4);color:var(--gold)}
.omens .glyph svg{width:22px;height:22px}
.omens b{display:block}
.omens small{color:var(--muted)}
.omens .when{font:700 1.05rem var(--display);color:var(--gold-hi);font-variant-numeric:tabular-nums}
.omens li.soon{border-color:rgba(194,66,58,.6);background:rgba(142,29,29,.12)}
.omens li.soon .when{color:#ff9c8c}

/* ───────── modal y avisos ───────── */
.veil{position:fixed;inset:0;z-index:90;background:rgba(5,7,9,.78);backdrop-filter:blur(4px);display:grid;place-items:center;padding:16px;overflow-y:auto}
.veil[hidden]{display:none}
.dialog{width:min(860px,100%);max-height:calc(100vh - 32px);overflow-y:auto;position:relative;padding:clamp(1.2rem,4vw,2.2rem)}
.dialog.narrow{width:min(480px,100%)}
.dialog .close{position:absolute;top:.6rem;right:.7rem;background:none;border:0;font-size:1.6rem;line-height:1;cursor:pointer;color:inherit;opacity:.7}
.dialog .close:hover{opacity:1}
.toasts{position:fixed;z-index:100;right:16px;bottom:16px;display:grid;gap:.6rem;max-width:min(380px,calc(100vw - 32px))}
.toast{padding:.9rem 1.1rem;background:var(--leather-2);border:1px solid var(--gold);box-shadow:var(--shadow);font-size:.95rem;animation:rise .35s var(--ease)}
.toast.err{border-color:var(--danger)}
@keyframes rise{from{opacity:0;transform:translateY(10px)}}

.empty{text-align:center;color:var(--muted);padding:2.4rem 1rem;font:italic 500 1.15rem var(--serif)}
.skeleton{background:linear-gradient(90deg,rgba(255,255,255,.03),rgba(255,255,255,.08),rgba(255,255,255,.03));background-size:200% 100%;animation:shine 1.4s infinite;min-height:120px}
@keyframes shine{to{background-position:-200% 0}}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
.stack{display:grid;gap:1.4rem}
.center{text-align:center}
.muted{color:var(--muted)}
.mt{margin-top:1.4rem}

/* ───────── responsive ───────── */
@media (max-width: 900px){
  .gate,.grid-2,.realm-now{grid-template-columns:1fr}
  .pacts{grid-template-columns:1fr;gap:2.6rem}
  .ledger-top{grid-template-columns:auto 1fr}
  .ledger-top .purse{grid-column:1/-1}
  .sheet{grid-template-columns:1fr}
  .sheet .portrait{aspect-ratio:590/371}
  .bazaar-filters{grid-template-columns:1fr 1fr}
  .bazaar-filters .field:first-child{grid-column:1/-1}
}
@media (max-width: 560px){
  .top .brand span{display:none}
  .top-end{gap:.6rem}
  body.reino main{padding-top:96px}
  .purse{flex-direction:column}
  .purse .coin-box{justify-items:start}
  .chronicle li{grid-template-columns:1fr auto}
  .chronicle time{grid-column:1/-1}
  .attr{grid-template-columns:90px 1fr 54px}
  .acct-btn .lbl{display:none}
}
@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important}
}

/* ───────── landing: cuenta regresiva del Oficial ───────── */
.launch{display:inline-flex;flex-direction:column;align-items:center;gap:.35rem;margin:1.2rem auto .4rem;padding:.9rem 1.6rem;
  border:1px solid var(--gold);background:linear-gradient(180deg,rgba(142,29,29,.28),rgba(14,20,24,.7));box-shadow:0 0 30px rgba(217,162,90,.12)}
.launch-lbl{font:700 .74rem/1 var(--sans);letter-spacing:.26em;text-transform:uppercase;color:var(--gold)}
.launch-left{font:700 clamp(1.4rem,4vw,2rem)/1.1 var(--display);color:var(--gold-hi);font-variant-numeric:tabular-nums}
.launch.abierto .launch-lbl{font-size:1rem;color:var(--gold-hi)}
