/* =========================================================
   Que Venga el Reino — estilos
   Turquesa neón + oro viejo sobre Eldoria
   ========================================================= */
:root{
  --teal:#3ee8d8; --teal-soft:#8af0e8; --teal-ink:#c8f7f2; --teal-rgb:62,232,216;
  --gold:#e8c77e; --gold-deep:#b8913f; --gold-btn:#d9b56a;
  --ink:#e9dcc0; --muted:#a9b8b0; --bg:#020807;
  --red:#ff3b55; --red-rgb:255,42,72;
  --s:1; --cx:0px; --cy:0px;
  /* paisaje pintado de respaldo (se sobrescribe por hora) */
  --sky1:#02060c; --sky2:#06151a; --sky3:#0d2a25; --m1:#0b1e20; --m2:#071514; --m3:#041010; --m4:#020807; --stars:1;
}
body[data-period="dawn"]{--sky1:#1a1633;--sky2:#5a3550;--sky3:#e0915e;--m1:#3b2a44;--m2:#2a1f33;--m3:#1b1724;--m4:#0f0c15;--stars:.25}
body[data-period="day"]{--sky1:#2c5a6a;--sky2:#6f9c95;--sky3:#d9cfa4;--m1:#4d6f68;--m2:#33504a;--m3:#1f3631;--m4:#13231f;--stars:0}
body[data-period="dusk"]{--sky1:#0d1226;--sky2:#3b2142;--sky3:#c0583b;--m1:#2e1f33;--m2:#1f1626;--m3:#140f1a;--m4:#0a080e;--stars:.5}

*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;overflow:hidden;background:var(--bg);color:var(--ink);font-family:'Cormorant Garamond',Georgia,serif;-webkit-font-smoothing:antialiased}
a{color:var(--teal)}a:hover{color:#a6f4ec}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
button{font:inherit}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px}

/* ---------- Fondo ---------- */
.bg{position:fixed;inset:0;z-index:0;overflow:hidden}
.painted{position:absolute;inset:0;width:100%;height:100%}
.painted .s1{stop-color:var(--sky1)}.painted .s2{stop-color:var(--sky2)}.painted .s3{stop-color:var(--sky3)}
.painted .m1{fill:var(--m1)}.painted .m2{fill:var(--m2)}.painted .m3{fill:var(--m3)}.painted .m4{fill:var(--m4)}
.painted .stars{fill:#eafff4;opacity:var(--stars)}
.poster,.bgv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background-size:cover;background-position:center;opacity:0;transition:opacity 1.6s ease}
.poster.show,.bgv.show{opacity:1}
.vignette{position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(ellipse 60% 55% at 0% 100%,rgba(0,0,0,.72),transparent 70%),
    radial-gradient(ellipse 45% 45% at 100% 100%,rgba(0,0,0,.55),transparent 70%),
    radial-gradient(ellipse 50% 30% at 50% 0%,rgba(0,0,0,.35),transparent 70%),
    radial-gradient(circle at 50% 50%,rgba(0,0,0,.18),transparent 45%)}

/* ---------- Marca y reloj ---------- */
.mark{position:fixed;left:max(24px,env(safe-area-inset-left));top:24px;z-index:3;display:flex;flex-direction:column;gap:4px;font-family:Cinzel,serif;text-shadow:0 1px 8px rgba(0,0,0,.8)}
.mark .author{font-weight:600;font-size:15px;letter-spacing:6px;color:var(--gold)}
.mark .saga{font-size:11px;letter-spacing:3px;color:var(--teal-ink)}
.clock{position:fixed;right:max(24px,env(safe-area-inset-right));top:20px;margin:0;z-index:3;display:flex;align-items:center;gap:10px;font-family:Cinzel,serif;font-size:12px;letter-spacing:3px;color:var(--teal-ink);text-transform:uppercase;text-shadow:0 1px 8px rgba(0,0,0,.8)}
/* Reloj de arena de neón */
.hourglass{width:26px;height:26px;overflow:visible;animation:hgFlip 8s cubic-bezier(.6,0,.3,1) infinite;
  filter:drop-shadow(0 0 3px var(--teal)) drop-shadow(0 0 9px rgba(var(--teal-rgb),.7))}
.hourglass .frame{fill:none;stroke:var(--teal);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.hourglass .sand-top,.hourglass .sand-bot{fill:var(--teal-soft);transform-box:fill-box;transform-origin:50% 100%}
.hourglass .sand-top{animation:hgTop 8s linear infinite}
.hourglass .sand-bot{animation:hgBot 8s linear infinite}
.hourglass .stream{stroke:var(--teal-soft);stroke-width:.9;stroke-dasharray:1.2 1.4;animation:hgStream 8s linear infinite}
@keyframes hgTop{0%{transform:scaleY(1)}85%,100%{transform:scaleY(0)}}
@keyframes hgBot{0%{transform:scaleY(0)}85%,100%{transform:scaleY(1)}}
@keyframes hgStream{0%,84%{opacity:1;stroke-dashoffset:0}84.1%,100%{opacity:0}42%{stroke-dashoffset:-12}}
@keyframes hgFlip{0%,86%{transform:rotate(0)}100%{transform:rotate(180deg)}}

/* ---------- Anillo ---------- */
.stage{position:fixed;inset:0;z-index:2;pointer-events:none}
.ring{position:absolute;left:50%;top:50%;width:620px;height:620px;
  transform:translate(-50%,-50%) scale(var(--s));
  transition:transform .95s cubic-bezier(.2,.9,.25,1),opacity .7s ease;pointer-events:auto}
.stage[data-open="false"] .ring{transform:translate(var(--cx),var(--cy)) translate(-50%,-50%) scale(.06);opacity:0;pointer-events:none}
.runes{position:absolute;inset:0;width:620px;height:620px;overflow:visible;filter:drop-shadow(0 0 6px rgba(var(--teal-rgb),.85)) drop-shadow(0 0 18px rgba(var(--teal-rgb),.45))}
.runes .rim{fill:rgba(4,22,24,.18);stroke:var(--teal);stroke-width:1.6}
.runes .rim.thin{fill:none;stroke-width:1}
.runes text{fill:var(--teal-soft);font-family:'Noto Sans Runic',serif;font-size:15px;letter-spacing:7px}
.runes .dash{fill:none;stroke:var(--teal);stroke-width:1;stroke-dasharray:2 10}
.runes .dot{fill:var(--teal)}
.spin{transform-box:view-box;transform-origin:310px 310px;animation:spin 140s linear infinite}
.spin-rev{transform-box:view-box;transform-origin:310px 310px;animation:spin 90s linear infinite reverse}
@keyframes spin{to{transform:rotate(360deg)}}

/* Holograma */
.holo{position:absolute;left:110px;top:110px;width:400px;height:400px;border-radius:50%;overflow:hidden;
  background:radial-gradient(circle at 50% 45%,rgba(12,62,64,.55),rgba(2,14,10,.82) 70%);
  box-shadow:inset 0 0 60px rgba(var(--teal-rgb),.35),0 0 40px rgba(var(--teal-rgb),.25);border:1px solid rgba(var(--teal-rgb),.55);
  animation:flicker 5s infinite}
.holo video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s;mix-blend-mode:screen}
.holo.has-video video{opacity:.85}
.holo.has-video .lines{opacity:0}
.scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(var(--teal-rgb),.07) 0 1px,transparent 1px 4px);animation:scan .6s linear infinite}
@keyframes scan{to{background-position:0 8px}}
@keyframes flicker{0%,47%,49%,84%,100%{opacity:1}48%{opacity:.72}83%{opacity:.88}}
.lines{position:absolute;inset:0;transition:opacity .8s}
.line{position:absolute;left:0;right:0;top:50%;margin:0;padding:0 44px;text-align:center;
  transform:translateY(-50%) scale(1.12);opacity:0;filter:blur(8px);
  transition:opacity .9s ease,transform 1.4s ease,filter .9s ease;
  font-family:Cinzel,serif;font-size:28px;letter-spacing:1.5px;line-height:1.15;color:var(--gold);
  text-shadow:0 0 18px rgba(232,199,126,.55),0 0 2px rgba(255,240,200,.9)}
.line.title{font-family:'Cinzel Decorative',Cinzel,serif;font-size:40px;letter-spacing:5px}
.line.on{opacity:1;filter:none;transform:translateY(-50%) scale(1)}
.holo .sub{position:absolute;left:0;right:0;bottom:66px;margin:0;text-align:center;font-family:Cinzel,serif;font-size:12px;letter-spacing:3px;color:var(--teal-ink)}

/* Idioma */
.lang{position:absolute;left:266px;top:30px;display:flex;border:1px solid var(--teal);border-radius:999px;overflow:hidden;box-shadow:0 0 12px rgba(var(--teal-rgb),.6);background:rgba(2,14,10,.7)}
.lang a{width:44px;height:30px;display:flex;align-items:center;justify-content:center;font-family:Cinzel,serif;font-size:12px;font-weight:600;letter-spacing:1px;color:var(--teal-ink);text-decoration:none}
.lang a[aria-current]{background:var(--teal);color:#04140e}

/* Medallones */
.ic{position:absolute;width:64px;height:64px;padding:0;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;
  border:2px solid var(--gold-deep);color:#e6c77a;
  background:radial-gradient(circle at 50% 35%,#1f3b37 0%,#0c1916 60%,#050b09 100%);
  box-shadow:0 0 0 3px rgba(8,18,16,.9),0 0 0 4px rgba(214,178,98,.5),0 0 16px rgba(var(--teal-rgb),.22),inset 0 0 12px rgba(214,178,98,.22);
  transition:transform .25s ease,box-shadow .25s ease,color .25s ease}
.ic svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 2px rgba(232,199,126,.45))}
.ic:hover,.ic:focus-visible{transform:scale(1.12);color:#fff0c4;outline:none;
  box-shadow:0 0 0 3px rgba(8,18,16,.9),0 0 0 4px rgba(232,199,126,.95),0 0 26px rgba(var(--teal-rgb),.5),0 0 44px rgba(232,199,126,.3)}
.ic:hover svg,.ic:focus-visible svg{filter:drop-shadow(0 0 5px rgba(232,199,126,.9))}
.ic .lbl{position:absolute;top:68px;left:50%;transform:translateX(-50%);white-space:nowrap;font-family:Cinzel,serif;font-size:12px;font-weight:600;letter-spacing:1.5px;color:var(--gold);
  padding:6px 18px;border-radius:999px;
  background:radial-gradient(ellipse at center,rgba(0,0,0,.92) 0%,rgba(0,0,0,.75) 45%,rgba(0,0,0,0) 75%);
  text-shadow:0 0 3px #000,0 0 8px #000,0 0 14px #000;
  opacity:0;transition:opacity .2s;pointer-events:none}
.ic:hover .lbl,.ic:focus-visible .lbl{opacity:1}

/* ---------- Esquina izquierda ---------- */
.corner-left{position:fixed;left:max(24px,env(safe-area-inset-left));bottom:max(24px,env(safe-area-inset-bottom));z-index:3;display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.ambient{display:flex;align-items:center;gap:12px;padding:8px 16px 8px 8px;border-radius:999px;background:rgba(2,14,10,.62);border:1px solid rgba(var(--teal-rgb),.45)}
.ambient button{width:44px;height:44px;border-radius:50%;border:1px solid var(--teal);background:transparent;color:var(--teal-ink);cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}
.ambient svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ambient .on{display:none}
.ambient[data-playing="true"] .on{display:block}.ambient[data-playing="true"] .off{display:none}
.ambient input{width:110px;accent-color:var(--teal)}
.amb-label{font-family:Cinzel,serif;font-size:11px;letter-spacing:2px;color:var(--teal-ink)}
.spicy{display:flex;align-items:center;gap:10px;padding:7px 14px;border-radius:10px;background:rgba(22,2,8,.72);border:1.5px solid var(--red);
  box-shadow:0 0 8px #ff2a48,0 0 22px rgba(var(--red-rgb),.6),inset 0 0 10px rgba(var(--red-rgb),.45);animation:redNeon 5.5s infinite}
.spicy span{font-family:Cinzel,serif;font-weight:800;font-size:13px;letter-spacing:2px;color:#ffe1e6;text-shadow:0 0 4px #ff2a48,0 0 10px #ff2a48,0 0 20px #ff2a48}
.spicy svg{width:16px;height:20px;filter:drop-shadow(0 0 3px #ff2a48)}
@keyframes redNeon{0%,10%,62%,64%,100%{opacity:1}6%{opacity:.55}9%{opacity:.7}63%{opacity:.8}}

/* ---------- Runa de la esquina ---------- */
.rune-btn{position:fixed;right:max(24px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));z-index:4;width:84px;height:84px;border-radius:50%;border:1.5px solid var(--teal);background:rgba(2,14,10,.7);color:var(--teal-soft);cursor:pointer;display:flex;align-items:center;justify-content:center;animation:pulse 2.4s ease-in-out infinite}
.rune-btn::before{content:"";position:absolute;inset:9px;border-radius:50%;border:1px solid rgba(var(--teal-rgb),.6)}
.rune-btn span{font-family:'Noto Sans Runic',serif;font-size:30px;line-height:1;text-shadow:0 0 12px var(--teal)}
@keyframes pulse{0%,100%{box-shadow:0 0 14px rgba(var(--teal-rgb),.55),inset 0 0 12px rgba(var(--teal-rgb),.35)}50%{box-shadow:0 0 34px rgba(var(--teal-rgb),.95),inset 0 0 22px rgba(var(--teal-rgb),.6)}}
.hint{position:fixed;right:132px;bottom:56px;margin:0;z-index:3;font-family:Cinzel,serif;font-size:12px;letter-spacing:3px;color:var(--teal-ink);text-shadow:0 0 10px rgba(var(--teal-rgb),.8),0 1px 6px #000}

/* ---------- Reproductor flotante ---------- */
.now{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:4;display:flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;border-radius:999px;background:rgba(2,14,10,.85);border:1px solid rgba(var(--teal-rgb),.6);box-shadow:0 0 16px rgba(var(--teal-rgb),.3);max-width:calc(100vw - 260px)}
.now button{flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--teal);background:transparent;color:var(--teal-ink);cursor:pointer;display:flex;align-items:center;justify-content:center}
.now svg{width:16px;height:16px;fill:currentColor}
.now[hidden]{display:none}
.now .play{display:none}.now[data-paused="true"] .play{display:block}.now[data-paused="true"] .pause{display:none}
.now .now-close{width:32px;height:32px;margin-left:4px;border-color:rgba(var(--teal-rgb),.4)}
.now .now-close svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.now .now-close:hover{border-color:var(--teal);color:#fff}
.consent{position:fixed;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%);z-index:6;width:min(560px,calc(100vw - 32px));padding:16px 20px;border-radius:14px;background:rgba(4,16,13,.96);border:1px solid var(--teal);box-shadow:0 0 30px rgba(var(--teal-rgb),.3);font-size:16px;line-height:1.45}
.consent[hidden]{display:none}
.consent p{margin:0 0 10px}
.consent-actions{display:flex;justify-content:flex-end;gap:10px;align-items:center}
.consent .cta{margin:0;padding:10px 22px}
.ghost-btn{background:transparent;border:1px solid rgba(var(--teal-rgb),.5);color:var(--teal-ink);border-radius:999px;padding:10px 18px;cursor:pointer;font-family:Cinzel,serif;font-size:13px;letter-spacing:1px}
.now-label{font-family:Cinzel,serif;font-size:12px;letter-spacing:1px;color:var(--teal-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.legal{position:fixed;left:50%;transform:translateX(-50%);bottom:6px;z-index:3;font-size:13px;color:var(--muted);text-shadow:0 1px 4px #000;white-space:nowrap}
.legal a{color:var(--muted);text-decoration:none}.legal a:hover{color:var(--teal)}
.now:not([hidden])~.legal{display:none}

/* ---------- Ventanas ---------- */
.pop{width:min(580px,calc(100vw - 32px));max-height:min(680px,calc(100dvh - 48px));overflow-y:auto;padding:36px 40px;border-radius:18px;
  background:rgba(4,16,13,.95);color:var(--ink);border:1px solid var(--teal);
  box-shadow:0 0 40px rgba(var(--teal-rgb),.35),inset 0 0 40px rgba(var(--teal-rgb),.06);font-size:19px;line-height:1.5}
.pop::backdrop{background:rgba(1,6,5,.72);backdrop-filter:blur(2px)}
.pop[open]{animation:popIn .35s ease}
@keyframes popIn{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}
.pop h2{margin:0 0 12px;font-family:Cinzel,serif;font-weight:600;font-size:28px;color:var(--gold);padding-right:40px}
.pop h3{margin:16px 0 4px;font-family:Cinzel,serif;font-size:15px;letter-spacing:2px;color:var(--teal-soft)}
.pop p{margin:0 0 14px}
.kicker{font-family:Cinzel,serif;font-size:11px!important;letter-spacing:4px;color:var(--teal);margin-bottom:8px!important}
.muted{color:var(--muted);font-size:16px}
.x{position:absolute;right:14px;top:14px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(var(--teal-rgb),.5);background:transparent;color:var(--teal-ink);cursor:pointer;display:flex;align-items:center;justify-content:center}
.x svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.cta{display:inline-block;padding:14px 28px;border-radius:999px;background:var(--gold-btn);color:#120c02;text-decoration:none;border:0;cursor:pointer;font-family:Cinzel,serif;font-weight:800;font-size:14px;letter-spacing:2px;margin:6px 0 10px}
.cta:hover{filter:brightness(1.12);color:#120c02}
.cta[disabled]{opacity:.6;cursor:wait}
.badge img{height:56px;width:auto;display:block;margin:6px 0 10px}
.ghost{display:inline-block;padding:14px 22px;color:var(--muted);text-decoration:none}
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:4px 0 8px}
.chip{padding:6px 14px;border-radius:999px;border:1px solid rgba(232,199,126,.6);font-family:Cinzel,serif;font-size:12px;color:var(--gold)}
.chip.teal{border-color:rgba(var(--teal-rgb),.6);color:var(--teal-soft)}
.cw{font-size:15px;color:#ffb3bd;border-left:2px solid var(--red);padding-left:10px}
.soon{font-family:Cinzel,serif;font-size:14px;letter-spacing:2px;color:var(--teal-soft)}
.pop.audio-pop{width:min(720px,calc(100vw - 32px));max-height:min(760px,calc(100dvh - 48px))}

.pop.wide{width:min(1040px,calc(100vw - 32px));max-height:min(760px,calc(100dvh - 48px))}
.audio-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
.acol h3{margin:4px 0 8px;font-size:14px;letter-spacing:3px}
.tracks{list-style:none;margin:0;padding:0;border-top:1px solid rgba(var(--teal-rgb),.25)}
.tracks li{display:grid;grid-template-columns:44px 24px minmax(0,1fr) auto;align-items:center;column-gap:12px;row-gap:2px;padding:8px 4px;border-bottom:1px solid rgba(var(--teal-rgb),.15)}
.tracks .tl{grid-column:2/-1;display:flex;align-items:center;gap:10px}
.tracks .seek{flex:1;min-width:0;height:4px;accent-color:var(--teal);cursor:pointer}
.tracks .seek:disabled{opacity:.35;cursor:default}
.tracks .tm{font-family:Cinzel,serif;font-size:11px;letter-spacing:.5px;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}
.tracks li.playing .tm{color:var(--teal-ink)}
.tracks li.missing{opacity:.55}
.tracks .ghosted{width:44px;height:44px;border-radius:50%;border:1px dashed rgba(var(--teal-rgb),.3)}
.tracks .soon-tag{color:var(--muted)}
.tracks li:hover{background:rgba(var(--teal-rgb),.06)}
.tracks .play{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid rgba(var(--teal-rgb),.45);background:transparent;color:var(--teal-ink);cursor:pointer;display:flex;align-items:center;justify-content:center}
.tracks .play svg{width:16px;height:16px;fill:currentColor}
.tracks .i-pause{display:none}
.tracks li.playing .play{border-color:var(--teal)}
.tracks li.playing .i-pause{display:block}.tracks li.playing .i-play{display:none}
.tracks .n{font-family:Cinzel,serif;font-size:13px;color:var(--teal-soft)}
.tracks .tt{font-size:17px;line-height:1.3}
.tracks .tag{font-family:Cinzel,serif;font-size:10px;letter-spacing:1.5px}
.tracks .tag.free{color:var(--teal)}.tracks .tag.lock{color:var(--gold-btn)}
body.unlocked .tracks .tag.lock{color:var(--teal)}

.sub-form{display:flex;flex-direction:column;gap:10px}
.sub-form label{font-family:Cinzel,serif;font-size:12px;letter-spacing:2px;color:var(--teal-ink)}
.sub-form input[type=email]{height:48px;padding:0 16px;border-radius:10px;border:1px solid rgba(var(--teal-rgb),.6);background:rgba(0,0,0,.4);color:#f2ead8;font:17px 'Cormorant Garamond',Georgia,serif}
.sub-form .check{display:flex;gap:10px;align-items:flex-start;font:15px/1.4 'Cormorant Garamond',Georgia,serif;letter-spacing:0;color:#c9d4cf}
.sub-form .check input{width:18px;height:18px;margin-top:2px;accent-color:var(--teal);flex:none}
.sub-form .cta{align-self:flex-start}
.sub-form .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.status{min-height:1em;font-size:17px}
.status.ok{padding:14px;border-radius:10px;border:1px solid var(--teal);color:#a6f4ec}
.status.err{color:#ff8a98}
.locked-note{color:var(--gold);font-style:italic}

.map{position:relative;height:300px;border-radius:12px;overflow:hidden;border:1px solid rgba(232,199,126,.5);background:radial-gradient(circle at 45% 50%,#b9a46a,#5e5530 75%,#2c2a16);margin-bottom:12px}
.map svg{position:absolute;inset:0;width:100%;height:100%}
.map-img{display:block;border-radius:12px;overflow:hidden;border:1px solid rgba(232,199,126,.5);margin-bottom:8px;cursor:zoom-in}
.map-img img{display:block;width:100%;height:auto;max-height:60vh;object-fit:contain;background:#0b0f0c}
.map span{position:absolute;font-family:Cinzel,serif;font-weight:600;font-size:13px;color:#1d2410}
.map span.small{font-size:11px;font-weight:400}.map span.big{font-size:26px;font-weight:800;letter-spacing:3px}
.chars dt{font-family:Cinzel,serif;font-weight:600;font-size:16px;color:var(--gold);margin-top:10px}
.chars dd{margin:2px 0 10px;padding-bottom:10px;border-bottom:1px solid rgba(var(--teal-rgb),.15);font-size:17px}
.author-head{display:flex;align-items:center;gap:20px;margin-bottom:12px}
.author-head img{border-radius:50%;object-fit:cover;border:1px solid var(--gold-deep)}
.author-head h2{margin:0;letter-spacing:4px;font-size:32px}
.quote{font-style:italic;color:var(--gold);font-size:20px}
.social{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px}
.social a{padding:16px;border-radius:12px;border:1px solid rgba(var(--teal-rgb),.5);text-decoration:none;font-family:Cinzel,serif;font-size:15px;color:var(--teal-ink)}
.checks{padding-left:22px}.checks li{margin:4px 0}.checks li::marker{color:var(--teal);content:"✦  "}
.age{text-align:center;border-color:var(--red);box-shadow:0 0 40px rgba(var(--red-rgb),.3)}
.age .kicker{color:#ff8a98}
.age h2{padding-right:0}
.age-actions{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap}

/* ---------- Móvil ---------- */
@media (max-width:700px){
  .mark{top:16px}.mark .author{font-size:13px;letter-spacing:4px}.mark .saga{font-size:9px;letter-spacing:2px}
  .clock{top:12px;font-size:10px;letter-spacing:2px;gap:6px}.hourglass{width:20px;height:20px}
  .audio-cols{grid-template-columns:1fr;gap:20px}
  .ic{transform:scale(1.3)}
  .ic:hover,.ic:focus-visible{transform:scale(1.4)}
  .ambient{padding:6px 10px 6px 6px;gap:8px}.ambient input{width:70px}.amb-label{display:none}
  .spicy{padding:5px 10px}.spicy span{font-size:11px}
  .rune-btn{width:68px;height:68px}
  .hint{right:100px;bottom:44px;font-size:10px;max-width:46vw;text-align:right}
  .now{max-width:calc(100vw - 32px);bottom:auto;top:56px}
  .pop{padding:28px 22px;font-size:18px}.pop h2{font-size:23px}
  .legal{font-size:11px}
}
@media (prefers-reduced-motion:reduce){
  .spin,.spin-rev,.holo,.scan,.rune-btn,.spicy,.hourglass,.hourglass *{animation:none}
  .ring,.line{transition:none}
}