/* ===========================================================
   Infernote site - shared stylesheet
   Tokens -> base -> nav/footer -> components -> flame logo
   Edit once here; every page picks it up.
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Chakra+Petch:wght@400;500;600&family=Cinzel:wght@500;600&family=Sora:wght@400;500;600&display=swap');
@import url('https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@3/dist/tabler-icons.min.css');

:root{
  --ember:#ffd361;   /* gold highlight */
  --flare:#fe9b22;   /* hearth orange */
  --blaze:#d62713;   /* deep ember red */
  --noct:#25111c;    /* darkest */
  --txt:#f6e9df;     /* body text */
  --mut:#c9a98f;     /* muted text */
  --line:rgba(255,200,120,.16);
  --glass:rgba(74,30,46,.42);
  --maxw:1120px;
  --gutter:max(28px, calc((100% - var(--maxw)) / 2));
}

*{box-sizing:border-box;}

body{
  margin:0;
  font-family:'Sora',sans-serif;
  color:var(--txt);
  background:
    radial-gradient(900px 460px at 80% -6%, rgba(255,138,61,.20), transparent 60%),
    radial-gradient(760px 420px at 6% 10%, rgba(198,61,27,.16), transparent 62%),
    #120710;
  background-attachment:fixed;
  min-height:100vh;
}

a{color:inherit;}

/* ---------- Nav ---------- */
.es-nav{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:18px;padding:12px var(--gutter);background:rgba(18,7,16,.82);backdrop-filter:blur(8px);border-bottom:1px solid var(--line);}
.es-brand{display:flex;align-items:center;gap:9px;font-family:'Cinzel',serif;font-size:18px;font-weight:600;letter-spacing:.5px;color:var(--ember);text-decoration:none;}
.es-links{display:flex;gap:4px;margin-left:auto;flex-wrap:wrap;}
.es-links a{font-size:13px;color:var(--mut);text-decoration:none;padding:6px 11px;border-radius:8px;}
.es-links a:hover{color:var(--ember);background:rgba(255,211,97,.08);}
.es-links a.on{color:var(--noct);background:var(--ember);font-weight:500;}
.es-cta{font-family:'Sora',sans-serif;font-size:13px;font-weight:600;color:var(--noct);background:linear-gradient(180deg,var(--ember),var(--flare));border:none;border-radius:9px;padding:8px 16px;cursor:pointer;text-decoration:none;display:inline-block;}
.es-cta.ghost{color:var(--ember);background:transparent;border:1px solid var(--ember);}

/* ---------- Generic sections ---------- */
.es-section{padding:46px var(--gutter);}
.es-sec{padding:26px var(--gutter);}
.es-pill{display:inline-block;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ember);border:1px solid var(--line);background:rgba(255,211,97,.06);border-radius:20px;padding:5px 13px;margin-bottom:16px;}
.es-eyebrow{font-family:'Cinzel',serif;color:var(--ember);font-size:22px;font-weight:600;margin:0 0 6px;}
.es-lead{font-size:13px;color:var(--mut);margin:0 0 26px;max-width:520px;}
.es-h2{font-family:'Cinzel',serif;font-size:23px;color:#fff;font-weight:600;text-align:center;margin:0 0 22px;}

/* ---------- Hero (home) ---------- */
.es-h1{font-family:'Cinzel',serif;font-size:clamp(34px,5vw,46px);line-height:1.12;font-weight:600;margin:0 0 8px;color:#fff;}
.es-h1 span{color:var(--ember);}
.es-hero-sub{font-family:'Cinzel',serif;color:var(--ember);font-size:16px;margin:0 0 14px;}
.es-sub{font-size:15px;line-height:1.7;color:var(--mut);max-width:560px;margin:0 0 24px;}
.es-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;}
.es-trailer{margin:32px auto 0;max-width:880px;aspect-ratio:16/9;border:1px solid var(--line);border-radius:14px;background:radial-gradient(560px 300px at 50% 40%, rgba(255,138,61,.22), transparent 65%),linear-gradient(180deg,#1a0c14,#0e0509);display:flex;align-items:center;justify-content:center;position:relative;}
.es-play{width:62px;height:62px;border-radius:50%;background:rgba(255,211,97,.92);display:flex;align-items:center;justify-content:center;color:var(--noct);font-size:26px;}
.es-trailer small{position:absolute;bottom:12px;color:var(--mut);font-size:12px;}

/* ---------- Feature grid (home) ---------- */
.es-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px;}
.es-card{background:var(--glass);border:1px solid var(--line);border-radius:13px;padding:18px;}
.es-card i{font-size:22px;color:var(--ember);}
.es-card h4{font-size:14px;font-weight:600;margin:10px 0 6px;color:#fff;}
.es-card p{font-size:12.5px;line-height:1.6;color:var(--mut);margin:0;}
.es-card.more{text-decoration:none;border-color:var(--ember);background:rgba(255,211,97,.08);display:flex;flex-direction:column;justify-content:center;}
.es-card.more:hover{background:rgba(255,211,97,.15);}
.es-card.more h4{color:var(--ember);display:flex;align-items:center;gap:6px;}

/* ---------- Price cards ---------- */
.es-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;max-width:740px;margin:0 auto;align-items:stretch;}
.es-price{display:flex;flex-direction:column;text-align:center;background:var(--glass);border:1px solid var(--ember);border-radius:18px;padding:28px 26px;}
.es-saletag{display:inline-block;font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--noct);background:var(--ember);border-radius:20px;padding:4px 12px;margin:0 auto 14px;font-weight:600;}
.es-saletag.alt{color:var(--ember);background:transparent;border:1px solid var(--ember);}
.es-pname{font-family:'Cinzel',serif;font-size:18px;color:#fff;font-weight:600;margin:0 0 4px;}
.es-amt{font-family:'Cinzel',serif;font-size:44px;color:#fff;font-weight:600;line-height:1;}
.es-amt small{font-size:14px;color:var(--mut);font-family:'Sora',sans-serif;}
.es-was{font-size:16px;color:var(--mut);text-decoration:line-through;}
.es-once{font-size:11px;color:var(--ember);letter-spacing:1px;text-transform:uppercase;margin:8px 0 0;}
.es-tick{font-size:12.5px;color:var(--txt);text-align:left;margin:18px auto 20px;width:100%;max-width:230px;line-height:1.95;}
.es-tick div{display:flex;gap:9px;align-items:flex-start;}
.es-tick i{color:var(--ember);margin-top:3px;flex:0 0 auto;}
.es-buy{font-family:'Sora',sans-serif;font-size:14.5px;font-weight:600;color:var(--noct);background:linear-gradient(180deg,var(--ember),var(--flare));border:none;border-radius:11px;padding:12px;cursor:pointer;width:100%;margin-top:auto;text-decoration:none;display:block;}
.es-buy.ghost{color:var(--ember);background:transparent;border:1px solid var(--ember);}
.es-sub-note{font-size:11px;color:var(--mut);margin:11px 0 0;}

/* ---------- Subscription comparison (pricing) ---------- */
.es-vs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;max-width:680px;margin:0 auto;}
.es-vscard{border:1px solid var(--line);border-radius:14px;padding:20px;background:var(--glass);}
.es-vscard.win{border-color:var(--ember);background:rgba(255,211,97,.08);}
.es-vslabel{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--mut);margin:0 0 8px;}
.es-vscard.win .es-vslabel{color:var(--ember);}
.es-vsamt{font-family:'Cinzel',serif;font-size:28px;color:#fff;font-weight:600;margin:0 0 4px;}
.es-vsamt .es-was{font-size:18px;}
.es-vssub{font-size:12.5px;color:var(--mut);margin:0;line-height:1.55;}
.es-save{text-align:center;font-size:13px;color:var(--ember);margin:18px auto 0;max-width:680px;}

/* ---------- Included list + FAQ (pricing) ---------- */
.es-incl{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:8px 22px;max-width:620px;margin:0 auto;}
.es-incl div{font-size:13px;color:var(--txt);display:flex;gap:9px;align-items:flex-start;line-height:1.5;}
.es-incl i{color:var(--ember);font-size:15px;margin-top:1px;flex:0 0 auto;}
.es-faqwrap{max-width:640px;margin:0 auto;}
.es-faq{background:var(--glass);border:1px solid var(--line);border-radius:12px;padding:15px 18px;margin-bottom:11px;}
.es-faq p.q{font-size:13.5px;font-weight:600;color:#fff;margin:0 0 5px;display:flex;gap:8px;align-items:center;}
.es-faq p.q i{color:var(--ember);font-size:16px;}
.es-faq p.a{font-size:12.5px;line-height:1.6;color:var(--mut);margin:0;}

/* ---------- Features page ---------- */
.es-head{padding:44px var(--gutter) 14px;text-align:center;}
.es-title{font-family:'Cinzel',serif;font-size:clamp(30px,4.4vw,36px);font-weight:600;margin:0 0 8px;color:#fff;}
.es-title span{color:var(--ember);}
.es-subhead{font-family:'Cinzel',serif;color:var(--ember);font-size:15px;margin:0 0 12px;}
.es-headsub{font-size:14px;line-height:1.7;color:var(--mut);max-width:520px;margin:0 auto;}
.es-chips{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin:22px 0 6px;}
.es-chip{font-size:12px;color:var(--mut);border:1px solid var(--line);border-radius:20px;padding:5px 12px;}
.es-chip.on{color:var(--noct);background:var(--ember);border-color:var(--ember);font-weight:500;}
.es-spot{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center;padding:34px var(--gutter);border-top:1px solid var(--line);max-width:none;}
.es-spot .shot{order:2;}
.es-spot.rev .txt{order:2;}
.es-spot.rev .shot{order:1;}
.es-kick{font-family:'Cinzel',serif;color:var(--ember);font-size:13px;letter-spacing:1px;text-transform:uppercase;margin:0 0 8px;}
.es-spot h3{font-family:'Cinzel',serif;font-size:23px;font-weight:600;color:#fff;margin:0 0 10px;}
.es-spot p{font-size:13px;line-height:1.7;color:var(--mut);margin:0 0 14px;}
.es-blist{list-style:none;padding:0;margin:0;}
.es-blist li{font-size:12.5px;color:var(--txt);line-height:1.55;margin-bottom:7px;display:flex;gap:8px;}
.es-blist i{color:var(--ember);font-size:14px;margin-top:1px;}
.shot{border:1px solid var(--line);border-radius:14px;height:240px;background:radial-gradient(420px 240px at 50% 40%, rgba(255,138,61,.18), transparent 65%),linear-gradient(180deg,#1a0c14,#0e0509);display:flex;align-items:center;justify-content:center;color:var(--mut);font-size:12px;}
.es-more{padding:40px var(--gutter) 30px;border-top:1px solid var(--line);text-align:center;}
.es-more h2{font-family:'Cinzel',serif;font-size:24px;color:#fff;font-weight:600;margin:0 0 6px;}
.es-more p{font-size:13px;color:var(--mut);margin:0 0 26px;}
.es-more .es-grid{text-align:left;}

/* ---------- Free trial page ---------- */
.es-hero{text-align:center;padding:48px var(--gutter) 18px;}
.es-dl{font-family:'Sora',sans-serif;font-size:17px;font-weight:600;color:var(--noct);background:linear-gradient(180deg,var(--ember),var(--flare));border:none;border-radius:12px;padding:15px 30px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;box-shadow:0 0 26px color-mix(in srgb,var(--flare) 35%,transparent);text-decoration:none;}
.es-dl i{font-size:22px;}
.es-meta{font-size:12px;color:var(--mut);margin:14px 0 0;}
.es-meta b{color:var(--txt);font-weight:500;}
.es-note{display:flex;gap:14px;align-items:flex-start;max-width:620px;margin:0 auto;background:rgba(255,211,97,.07);border:1px solid var(--line);border-radius:13px;padding:16px 18px;}
.es-note i{font-size:22px;color:var(--ember);flex:0 0 auto;margin-top:1px;}
.es-note h4{font-size:13.5px;font-weight:600;color:#fff;margin:0 0 5px;}
.es-note p{font-size:12.5px;line-height:1.65;color:var(--mut);margin:0;}
.es-note code{font-family:ui-monospace,Menlo,Consolas,monospace;color:var(--ember);background:rgba(255,211,97,.1);padding:1px 6px;border-radius:5px;font-size:12px;}
.es-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;max-width:760px;margin:0 auto;}
.es-step{background:var(--glass);border:1px solid var(--line);border-radius:13px;padding:18px;}
.es-num{width:30px;height:30px;border-radius:50%;background:var(--ember);color:var(--noct);font-weight:600;font-size:14px;display:flex;align-items:center;justify-content:center;margin-bottom:11px;}
.es-step h4{font-size:14px;font-weight:600;color:#fff;margin:0 0 6px;}
.es-step p{font-size:12.5px;line-height:1.6;color:var(--mut);margin:0;}
.es-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;max-width:760px;margin:0 auto;}
.es-panel{background:var(--glass);border:1px solid var(--line);border-radius:13px;padding:18px 20px;}
.es-panel h4{font-family:'Cinzel',serif;font-size:15px;color:var(--ember);margin:0 0 12px;}
.es-reqs{list-style:none;padding:0;margin:0;}
.es-reqs li{font-size:12.5px;color:var(--txt);line-height:1.55;margin-bottom:9px;display:flex;gap:9px;}
.es-reqs i{color:var(--ember);font-size:15px;margin-top:1px;flex:0 0 auto;}

/* ---------- CTA band ---------- */
.es-band{text-align:center;padding:42px var(--gutter);background:linear-gradient(180deg,rgba(255,138,61,.14),rgba(255,138,61,.04));border-top:1px solid var(--line);}
.es-band h2{font-family:'Cinzel',serif;font-size:25px;color:#fff;margin:0 0 10px;font-weight:600;}
.es-band p{font-size:13px;color:var(--mut);margin:0 0 20px;}
.es-band .es-row{justify-content:center;}

/* ---------- Footer ---------- */
.es-foot{padding:26px var(--gutter);font-size:12px;color:var(--mut);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid var(--line);}
.es-foot .es-brand{font-size:15px;}
.es-foot nav a{color:var(--mut);text-decoration:none;margin-right:14px;}
.es-foot nav a:hover{color:var(--ember);}

/* ---------- Mobile hamburger (hidden on desktop) ---------- */
.es-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:38px;padding:9px 8px;background:transparent;border:1px solid var(--line);border-radius:9px;cursor:pointer;flex:0 0 auto;}
.es-burger span{display:block;height:2px;width:100%;background:var(--ember);border-radius:2px;transition:transform .22s ease,opacity .15s ease;}
.es-nav.nav-open .es-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.es-nav.nav-open .es-burger span:nth-child(2){opacity:0;}
.es-nav.nav-open .es-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.es-links-cta{display:none;}

/* ---------- Responsive ---------- */
/* Nav -> hamburger below 900px (7 links wrap the desktop bar before then).
   The in-bar CTA moves into the dropdown so the bar never overflows. */
@media (max-width:900px){
  .es-brand{margin-right:auto;}
  .es-burger{display:flex;}
  .es-nav-cta{display:none;}
  .es-links{position:absolute;top:100%;left:0;right:0;margin:0;flex-direction:column;gap:0;background:#180810;border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(0,0,0,.4);padding:6px 0 12px;display:none;}
  .es-nav.nav-open .es-links{display:flex;}
  .es-links a{font-size:15px;padding:13px var(--gutter);border-radius:0;}
  .es-links a:hover{background:rgba(255,211,97,.08);}
  .es-links a.on{background:rgba(255,211,97,.14);color:var(--ember);}
  /* override .es-links a's muted color so the gradient button keeps its dark, readable text */
  .es-links a.es-links-cta{display:block;color:var(--noct);margin:10px var(--gutter) 2px;text-align:center;}
  .es-links a.es-links-cta:hover{background:linear-gradient(180deg,var(--ember),var(--flare));}

  .es-foot{justify-content:center;text-align:center;}
  .es-foot nav{display:flex;flex-wrap:wrap;justify-content:center;}
  .es-foot nav a{margin:0 7px 6px;}
}

@media (max-width:720px){
  .es-spot{grid-template-columns:1fr;}
  .es-spot .shot,.es-spot.rev .shot,.es-spot.rev .txt{order:0;}
}

/* ===========================================================
   Flame logo - the ONE place the icon + animation lives.
   Markup is injected by site.js into every [data-flame].
   =========================================================== */
.flame-logo{position:relative;display:inline-flex;align-items:center;justify-content:center;width:30px;height:32px;flex:0 0 auto;cursor:pointer;-webkit-tap-highlight-color:transparent;}
.es-foot .flame-logo,.es-foot .flame-svg{width:22px;height:24px;}
.flame-svg{width:30px;height:32px;display:block;overflow:visible;transform-origin:50% 92%;filter:drop-shadow(0 0 7px color-mix(in srgb, var(--flare) 65%, transparent));animation:flame-wiggle 3.4s ease-in-out infinite;}
.flame-outer{transform-box:fill-box;transform-origin:50% 100%;animation:flame-flicker 1.5s ease-in-out infinite;}
.flame-inner{transform-box:fill-box;transform-origin:50% 100%;transform:scale(0.6) translateY(4px);animation:flame-flicker-inner 0.95s ease-in-out infinite;}
.flame-logo .ember{position:absolute;border-radius:50%;background:var(--ember);box-shadow:0 0 4px color-mix(in srgb,var(--ember) 80%,transparent);}
.flame-logo .e1{width:3px;height:3px;left:8px;bottom:21px;animation:ember-rise 2.1s ease-in infinite .1s;}
.flame-logo .e2{width:2px;height:2px;left:18px;bottom:18px;animation:ember-rise 1.8s ease-in infinite .7s;}
.flame-logo .e3{width:2px;height:2px;left:13px;bottom:23px;animation:ember-rise 2.6s ease-in infinite 1.3s;}
.flame-logo .smoke{position:absolute;left:50%;bottom:16px;width:5px;height:5px;border-radius:50%;background:color-mix(in srgb,#d9cbb8 55%,transparent);filter:blur(2.5px);opacity:0;transform:translate(-50%,0);}
.flame-logo .spark{position:absolute;left:50%;bottom:15px;width:2.5px;height:2.5px;border-radius:50%;background:var(--ember);box-shadow:0 0 5px var(--flare);opacity:0;transform:translate(-50%,0);}
.flame-logo .sp1{--dx:-8px;--dy:-11px}
.flame-logo .sp2{--dx:-2px;--dy:-16px}
.flame-logo .sp3{--dx:5px;--dy:-13px}
.flame-logo .sp4{--dx:9px;--dy:-8px}
@keyframes flame-flicker{0%,100%{transform:scaleX(1) scaleY(1) skewX(0)}20%{transform:scaleX(.92) scaleY(1.08) skewX(-2.5deg)}45%{transform:scaleX(1.07) scaleY(.94) skewX(2.5deg)}70%{transform:scaleX(.97) scaleY(1.05) skewX(-1.5deg)}}
@keyframes flame-flicker-inner{0%,100%{transform:scale(.6) translateY(4px) scaleY(1) skewX(0)}30%{transform:scale(.6) translateY(4px) scaleY(1.14) skewX(3deg)}60%{transform:scale(.6) translateY(4px) scaleY(.88) skewX(-3deg)}}
@keyframes flame-wiggle{0%,100%{transform:rotate(0) translateX(0)}25%{transform:rotate(-3.5deg) translateX(-.5px)}75%{transform:rotate(3.5deg) translateX(.5px)}}
@keyframes ember-rise{0%{transform:translateY(0) translateX(0);opacity:.95}60%{transform:translateY(-12px) translateX(1.5px);opacity:.5}100%{transform:translateY(-19px) translateX(-1.5px);opacity:0}}
@keyframes smoke-rise{0%{transform:translate(-50%,0) scale(.5);opacity:0}20%{opacity:.55}100%{transform:translate(-50%,-22px) scale(2);opacity:0}}
@keyframes flame-ignite{0%{transform:scaleX(.5) scaleY(.35);filter:brightness(2.2) drop-shadow(0 0 13px var(--flare));opacity:.5}35%{transform:scaleX(1.12) scaleY(1.22);filter:brightness(1.7) drop-shadow(0 0 12px var(--ember));opacity:1}65%{transform:scaleX(.96) scaleY(.97);filter:brightness(1.2)}100%{transform:scaleX(1) scaleY(1);filter:brightness(1) drop-shadow(0 0 7px color-mix(in srgb,var(--flare) 65%,transparent))}}
@keyframes spark-burst{0%{opacity:1;transform:translate(-50%,0) scale(1.2)}100%{opacity:0;transform:translate(calc(-50% + var(--dx,0px)),var(--dy,-12px)) scale(.2)}}
.flame-logo.igniting .flame-svg{animation:flame-ignite .48s ease-out;transform-origin:50% 100%}
.flame-logo.igniting .spark{animation:spark-burst .46s ease-out forwards}
.flame-logo.igniting .sp2{animation-delay:.03s}
.flame-logo.igniting .sp3{animation-delay:.06s}
.flame-logo.igniting .sp4{animation-delay:.02s}
.flame-logo.snuffed .flame-svg{animation:none!important;transform:scaleY(.22)!important;opacity:.06;transition:transform .2s ease,opacity .2s ease;transform-origin:50% 100%}
.flame-logo.snuffed .flame-outer,.flame-logo.snuffed .flame-inner{animation:none!important}
.flame-logo.snuffed .ember{animation:none!important;opacity:0!important}
.flame-logo.snuffed .smoke{animation:smoke-rise 1.1s ease-out forwards}
.flame-logo.snuffed .s2{animation-delay:.32s;left:44%}
.flame-logo.snuffed .s3{animation-delay:.6s;left:56%}

@media (prefers-reduced-motion: reduce){
  .flame-svg,.flame-outer,.flame-inner{animation:none!important;}
  .flame-logo .ember{animation:none!important;opacity:0!important;}
}

/* ===========================================================
   Sci-Fi toggle (home, top-left under the nav)
   =========================================================== */
.scifi-bar{padding:16px var(--gutter) 0;}
.scifi-toggle{display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none;}
.scifi-toggle .sw{position:relative;width:42px;height:23px;flex:0 0 auto;}
.scifi-toggle .sw input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer;z-index:2;}
.scifi-toggle .track{position:absolute;inset:0;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid var(--line);transition:background .25s;}
.scifi-toggle .knob{position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;background:var(--ember);transition:left .25s;box-shadow:0 0 6px color-mix(in srgb,var(--ember) 60%,transparent);}
.scifi-toggle .sw input:checked ~ .track{background:color-mix(in srgb,var(--ember) 45%,transparent);}
.scifi-toggle .sw input:checked ~ .knob{left:22px;}
.scifi-toggle .lbl{font-size:13px;color:var(--mut);}
body.scifi .scifi-toggle .lbl{color:var(--ember);}

/* ===========================================================
   Sci-Fi mode - Cyber palette, Chakra Petch, crisp digital look.
   Toggled on the home page via body.scifi.
   =========================================================== */
body.scifi{
  --ember:#8dffb0;
  --flare:#2ff07a;
  --blaze:#14c25a;
  --noct:#04190f;
  --txt:#d7f5e2;
  --mut:#7faf92;
  --line:rgba(60,240,130,.20);
  --glass:rgba(10,60,35,.42);
  background:
    radial-gradient(900px 460px at 80% -6%, rgba(47,240,122,.16), transparent 60%),
    radial-gradient(760px 420px at 6% 10%, rgba(20,194,90,.14), transparent 62%),
    #04190f;
  font-family:'Chakra Petch',sans-serif;
}
/* faint CRT scanlines */
body.scifi::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:60;background:repeating-linear-gradient(180deg, rgba(120,255,170,.05) 0 1px, transparent 1px 3px);}
/* sci-fi face on headings + chrome */
body.scifi .es-h1,
body.scifi .es-hero-sub,
body.scifi .es-eyebrow,
body.scifi .es-brand,
body.scifi .es-pname,
body.scifi .es-amt,
body.scifi .es-band h2,
body.scifi .es-pill,
body.scifi .es-saletag,
body.scifi .es-once,
body.scifi .es-cta,
body.scifi .es-buy{font-family:'Chakra Petch',sans-serif;}
body.scifi .es-h1{letter-spacing:1px;text-transform:uppercase;}
body.scifi .es-eyebrow{letter-spacing:.5px;text-transform:uppercase;}
/* crisp corners */
body.scifi .es-card,
body.scifi .es-price,
body.scifi .es-trailer,
body.scifi .es-cta,
body.scifi .es-buy{border-radius:4px;}
body.scifi .es-pill,
body.scifi .es-saletag{border-radius:3px;}
/* green flame via gradient swap - no filter, so the reignite animation
   (which sets its own filter) can't flash the original orange. */
body.scifi .flame-outer{fill:url(#fgo-sci);}
body.scifi .flame-inner{fill:url(#fgi-sci);}
/* recolor the hardcoded-ember accents to match the cyber palette */
body.scifi .es-trailer{background:radial-gradient(560px 300px at 50% 40%, rgba(47,240,122,.16), transparent 65%),linear-gradient(180deg,#072414,#04140b);}
body.scifi .es-play{background:var(--ember);box-shadow:0 0 20px color-mix(in srgb,var(--ember) 55%,transparent);}
body.scifi .es-band{background:linear-gradient(180deg,rgba(47,240,122,.13),rgba(47,240,122,.04));}
body.scifi .es-card.more{background:color-mix(in srgb,var(--ember) 8%,transparent);}
body.scifi .es-card.more:hover{background:color-mix(in srgb,var(--ember) 15%,transparent);}
body.scifi .es-pill{background:color-mix(in srgb,var(--ember) 7%,transparent);}
/* hero word swap: ember-lit -> neon-lit in sci-fi mode */
.w-neon{display:none;}
body.scifi .w-ember{display:none;}
body.scifi .w-neon{display:inline;}

/* ===========================================================
   License portal
   =========================================================== */
.lp-card{max-width:580px;margin:0 auto;background:var(--glass);border:1px solid var(--line);border-radius:16px;padding:26px;}
.lp-label{display:block;font-size:13px;color:var(--txt);font-weight:500;margin:0 0 10px;}
.lp-row{display:flex;gap:10px;align-items:stretch;flex-wrap:wrap;}
.lp-input{flex:1;min-width:240px;background:rgba(10,4,8,.55);border:1px solid var(--line);border-radius:10px;padding:12px 14px;color:var(--txt);font-family:'Sora',sans-serif;font-size:14px;letter-spacing:.4px;}
.lp-input::placeholder{color:color-mix(in srgb,var(--mut) 65%,transparent);letter-spacing:1px;}
.lp-input:focus{outline:none;border-color:var(--ember);box-shadow:0 0 0 3px color-mix(in srgb,var(--ember) 18%,transparent);}
.lp-btn{font-family:'Sora',sans-serif;font-weight:600;font-size:14px;color:var(--noct);background:linear-gradient(180deg,var(--ember),var(--flare));border:none;border-radius:10px;padding:0 22px;cursor:pointer;white-space:nowrap;}
.lp-hint{font-size:12px;color:var(--mut);margin:12px 0 0;}
.lp-hint a{color:var(--ember);text-decoration:none;}
.lp-details{max-width:620px;margin:0 auto;background:var(--glass);border:1px solid var(--line);border-radius:16px;padding:24px 26px;}
.lp-dhead{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;border-bottom:1px solid var(--line);padding-bottom:16px;}
.lp-dname{font-family:'Cinzel',serif;font-size:18px;color:#fff;font-weight:600;margin:0 0 3px;}
.lp-dkey{font-size:12.5px;color:var(--mut);margin:0;}
.lp-badge{font-size:11px;letter-spacing:1px;text-transform:uppercase;font-weight:600;color:var(--noct);background:var(--ember);border-radius:20px;padding:5px 12px;flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;}
.lp-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin:18px 0 6px;}
.lp-meta div{display:flex;flex-direction:column;gap:3px;}
.lp-meta span{font-size:11px;letter-spacing:.5px;text-transform:uppercase;color:var(--mut);}
.lp-meta b{font-size:14px;color:var(--txt);font-weight:500;}
.lp-sub{font-family:'Cinzel',serif;font-size:14px;color:var(--ember);margin:20px 0 12px;}
.lp-device{display:flex;justify-content:space-between;align-items:center;gap:12px;background:rgba(10,4,8,.4);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-bottom:10px;}
.lp-device > div{display:flex;align-items:center;gap:12px;}
.lp-device i{font-size:24px;color:var(--ember);}
.lp-devn{font-size:13.5px;color:#fff;font-weight:500;margin:0;}
.lp-devd{font-size:12px;color:var(--mut);margin:0;}
.lp-deact{padding:7px 14px;font-size:12.5px;}
.lp-empty{font-size:12.5px;color:var(--mut);margin:6px 0 0;}

/* ===========================================================
   Content shop
   =========================================================== */
.shop-promo{max-width:880px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;background:linear-gradient(180deg,rgba(255,138,61,.14),rgba(255,138,61,.04));border:1px solid var(--line);border-radius:14px;padding:14px 20px;}
.shop-promo > div{display:flex;align-items:center;gap:11px;font-size:13.5px;line-height:1.5;color:var(--mut);}
.shop-promo > div b{color:#fff;font-weight:600;}
.shop-promo i{font-size:24px;color:var(--ember);flex:0 0 auto;}
.shop-promo .es-cta{white-space:nowrap;}

.shop-toolbar{max-width:980px;margin:0 auto 24px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;}
.shop-search{position:relative;flex:1;min-width:220px;}
.shop-search i{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--mut);font-size:18px;pointer-events:none;}
.shop-search input{width:100%;box-sizing:border-box;padding:11px 14px 11px 39px;border-radius:10px;border:1px solid var(--line);background:var(--glass);color:var(--txt);font-family:'Sora',sans-serif;font-size:13.5px;}
.shop-search input:focus{outline:none;border-color:var(--ember);box-shadow:0 0 0 3px color-mix(in srgb,var(--ember) 16%,transparent);}
.shop-search input::placeholder{color:var(--mut);}

.shop-tags{display:flex;gap:8px;flex-wrap:wrap;}
.shop-tag{font-family:'Sora',sans-serif;font-size:12.5px;color:var(--mut);background:rgba(255,211,97,.06);border:1px solid var(--line);border-radius:20px;padding:6px 13px;cursor:pointer;}
.shop-tag:hover{color:var(--ember);border-color:var(--ember);}
.shop-tag.on{color:var(--noct);background:var(--ember);border-color:var(--ember);font-weight:600;}

.shop-grid{max-width:980px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media (max-width:860px){.shop-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.shop-grid{grid-template-columns:1fr;}}

.shop-card{background:var(--glass);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;}
.shop-card:hover{border-color:color-mix(in srgb,var(--ember) 50%,var(--line));}
.shop-thumb{aspect-ratio:8.5 / 11;background:#1a0d18;overflow:hidden;}
.shop-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.shop-thumb-ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:18px;background:linear-gradient(160deg,color-mix(in srgb,var(--ember) 14%,#1a0d18),#150a13);}
.shop-thumb-ph i{font-size:42px;color:var(--ember);opacity:.85;}
.shop-thumb-ph span{font-family:'Cinzel',serif;font-size:15px;color:#fff;line-height:1.3;}

.shop-body{padding:14px 15px 15px;display:flex;flex-direction:column;flex:1;}
.shop-title{font-family:'Cinzel',serif;font-size:16px;color:#fff;font-weight:600;margin:0 0 6px;}
.shop-desc{font-size:12.5px;line-height:1.55;color:var(--mut);margin:0 0 11px;}
.shop-card-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px;}
.shop-card-tag{font-size:10px;letter-spacing:.5px;text-transform:uppercase;color:var(--ember);border:1px solid var(--line);border-radius:12px;padding:3px 8px;}
.shop-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;}
.shop-price{font-family:'Cinzel',serif;font-size:18px;color:#fff;font-weight:600;}
.shop-buy{font-family:'Sora',sans-serif;font-size:13px;font-weight:600;color:var(--noct);background:linear-gradient(180deg,var(--ember),var(--flare));border:none;border-radius:9px;padding:9px 16px;text-decoration:none;cursor:pointer;white-space:nowrap;}
.shop-buy:hover{filter:brightness(1.06);}

.shop-empty{max-width:980px;margin:12px auto 0;text-align:center;color:var(--mut);font-size:13.5px;}
.shop-soon{grid-column:1/-1;text-align:center;font-family:'Cinzel',serif;font-size:20px;color:var(--ember);padding:60px 20px;margin:0;}
.shop-card{cursor:pointer;}
.shop-pager{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;max-width:980px;margin:28px auto 0;}
.shop-page-btn{font-family:'Sora',sans-serif;font-size:13px;font-weight:600;color:var(--mut);background:rgba(255,211,97,.06);
  border:1px solid var(--line);border-radius:9px;padding:8px 13px;cursor:pointer;min-width:40px;}
.shop-page-btn:hover:not(:disabled){color:var(--ember);border-color:var(--ember);}
.shop-page-btn.on{color:var(--noct);background:var(--ember);border-color:var(--ember);}
.shop-page-btn:disabled{opacity:.4;cursor:default;}

/* ---------- Pack lightbox ---------- */
.pack-modal{position:fixed;inset:0;z-index:1100;background:rgba(8,3,7,.78);backdrop-filter:blur(5px);
  display:flex;align-items:center;justify-content:center;padding:24px;overflow:auto;}
.pack-modal[hidden]{display:none;}
.pack-modal-card{position:relative;width:100%;max-width:720px;background:#160a13;border:1px solid var(--line);
  border-radius:18px;padding:24px;display:flex;gap:24px;align-items:flex-start;}
.pack-modal-close{position:absolute;top:10px;right:14px;font-family:inherit;font-size:26px;line-height:1;color:var(--mut);
  background:none;border:none;cursor:pointer;padding:4px;}
.pack-modal-close:hover{color:var(--ember);}
.pack-modal-img{flex:0 0 220px;aspect-ratio:8.5/11;background:#1a0d18;border:1px solid var(--line);border-radius:12px;
  overflow:hidden;display:flex;align-items:center;justify-content:center;}
.pack-modal-img img{width:100%;height:100%;object-fit:cover;}
.pack-modal-img .shop-thumb-ph{width:100%;height:100%;}
.pack-modal-body{flex:1;min-width:0;}
.pack-modal-title{font-family:'Cinzel',serif;font-size:24px;color:#fff;font-weight:600;margin:0 0 12px;padding-right:28px;}
.pack-modal-tags{margin:0 0 16px;}
.pack-modal-desc{font-size:13.5px;line-height:1.7;color:var(--mut);margin:0 0 22px;white-space:pre-wrap;}
.pack-modal-foot{display:flex;align-items:center;gap:16px;}
.pack-modal-foot .shop-price{font-size:22px;}
@media (max-width:560px){
  .pack-modal-card{flex-direction:column;align-items:center;}
  .pack-modal-img{flex:0 0 auto;width:180px;}
  .pack-modal-body{width:100%;}
}

/* ===========================================================
   Legal pages (privacy / terms / refund)
   =========================================================== */
.legal{max-width:760px;margin:0 auto;padding:6px var(--gutter) 24px;}
.legal h2{font-family:'Cinzel',serif;font-size:19px;color:#fff;font-weight:600;margin:30px 0 10px;}
.legal p,.legal li{font-size:13.5px;line-height:1.75;color:var(--mut);}
.legal p{margin:0 0 12px;}
.legal ul{margin:0 0 14px;padding-left:20px;}
.legal li{margin-bottom:6px;}
.legal a{color:var(--ember);text-decoration:none;}
.legal a:hover{text-decoration:underline;}
.legal strong{color:var(--txt);font-weight:600;}
.legal-meta{font-size:12px;color:var(--mut);margin:0 0 18px;}
.legal-note{font-size:12.5px;line-height:1.6;color:var(--ember);background:rgba(255,211,97,.07);border:1px solid var(--line);border-radius:10px;padding:12px 15px;margin:0 0 22px;}

/* ---------- Table Bundle invite codes ---------- */
.bc-code{display:flex;align-items:center;flex-wrap:wrap;gap:10px;background:rgba(10,4,8,.4);border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-bottom:10px;}
.bc-num{flex:0 0 auto;width:22px;height:22px;border-radius:50%;background:var(--ember);color:var(--noct);font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;}
.bc-val{flex:1;min-width:0;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:14px;letter-spacing:.5px;color:#fff;overflow-wrap:anywhere;}
.bc-copy{flex:0 0 auto;font-family:'Sora',sans-serif;font-size:12.5px;font-weight:600;color:var(--ember);background:transparent;border:1px solid var(--ember);border-radius:8px;padding:6px 14px;cursor:pointer;}
.bc-copy:hover{background:color-mix(in srgb,var(--ember) 14%,transparent);}
.bc-copy.done{color:var(--noct);background:var(--ember);}
.bc-code.is-used{opacity:.5;}
.bc-code.is-used .bc-val{text-decoration:line-through;}
.bc-used{flex:0 0 auto;font-family:'Sora',sans-serif;font-size:12px;font-weight:600;color:var(--mut);border:1px solid var(--line);border-radius:8px;padding:6px 12px;}
.bc-expired{font-size:13px;line-height:1.5;color:#ffb27a;background:rgba(255,138,61,.1);border:1px solid var(--line);border-radius:10px;padding:11px 14px;margin:0 0 14px;}
.bc-invite{color:var(--noct);background:var(--ember);}
.bc-invite:hover{background:color-mix(in srgb,var(--ember) 88%,#fff);}
.bc-invite-wrap{margin-top:22px;border-top:1px solid var(--line);padding-top:18px;}
.bc-invite-box{font-family:'Sora',sans-serif;font-size:12.5px;line-height:1.65;color:var(--mut);background:rgba(10,4,8,.4);border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin-top:10px;white-space:pre-wrap;}