@charset "UTF-8";
/* Evenfall99 — dusk to night. Cinzel for the display voice, Inter for everything you read. */
@font-face{font-family:"Cinzel";src:url("/static/fonts/cinzel-var.woff") format("woff");font-weight:400 900;font-display:swap}
@font-face{font-family:"Inter";src:url("/static/fonts/inter-400.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter";src:url("/static/fonts/inter-500.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Inter";src:url("/static/fonts/inter-600.woff2") format("woff2");font-weight:600;font-display:swap}

:root{
  --night:#0c1020;--night-2:#0a0d1a;--dusk:#161c33;--dusk-2:#1c2440;--dusk-3:#232c4f;
  --gold:#e4c27a;--gold-2:#f3dba0;--gold-deep:#b48f3f;--ember:#ff9a4a;
  --ink:#f3eee3;--ash:#a6abbf;--ash-2:#7f859c;
  --line:rgba(228,194,122,.16);--line-strong:rgba(228,194,122,.38);--hair:rgba(243,238,227,.09);
  --ok:#7fd3a1;--error:#ff9c8d;
  --display:"Cinzel","Times New Roman",Georgia,serif;--body:"Inter","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;
  --shell:1180px;--gutter:32px;--radius:14px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--night);color:var(--ink);font:16px/1.65 var(--body);overflow-x:hidden}
img,svg{display:block}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
button:disabled{opacity:.55;cursor:default}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--gold);outline-offset:4px;border-radius:4px}
[hidden]{display:none!important}
.shell{width:min(var(--shell),calc(100% - var(--gutter)*2));margin-inline:auto}
h1,h2,h3,p,ul,ol{margin-top:0}
h1,h2,h3{line-height:1.15;margin-bottom:.5em}
h3{font-family:var(--display);font-weight:600;font-size:21px;letter-spacing:.01em}
.display{font-family:var(--display);font-weight:700;letter-spacing:.01em;line-height:1.04;
  background:linear-gradient(180deg,#f8e8bf 0%,var(--gold) 48%,#c9a455 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
h1.display{font-size:clamp(40px,6.6vw,88px)}
h2.display{font-size:clamp(28px,3.6vw,46px);font-weight:600}
p{margin-bottom:1em}
.fine{font-size:13px;line-height:1.6;color:var(--ash-2)}
.section-lead{font-size:18px;color:var(--ash);max-width:60ch}
.text-link{color:var(--gold);border-bottom:1px solid rgba(228,194,122,.35);padding-bottom:1px;transition:border-color .2s,color .2s}
.text-link:hover{color:var(--gold-2);border-bottom-color:var(--gold-2)}
.skip{position:absolute;left:12px;top:-80px;background:var(--gold);color:#1a1407;padding:10px 14px;z-index:100;border-radius:8px}
.skip:focus{top:12px}

/* buttons */
.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:12px 22px;border-radius:9px;
  font-weight:600;font-size:15px;line-height:1.2;border:1px solid transparent;transition:transform .2s,box-shadow .25s,background .2s,border-color .2s,color .2s;white-space:nowrap}
.button-big{min-height:54px;padding:15px 30px;font-size:16px}
.button-primary{color:#1b1507;background:linear-gradient(180deg,#f6e1aa 0%,#e4c27a 55%,#cfa65a 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.55) inset,0 14px 34px -14px rgba(228,194,122,.75)}
.button-primary:hover{transform:translateY(-1px);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 18px 40px -14px rgba(228,194,122,.9);background:linear-gradient(180deg,#fbe9bb 0%,#ecc985 55%,#d6ad60 100%)}
.button-ghost{border-color:rgba(243,238,227,.28);color:var(--ink);background:rgba(12,16,32,.35);backdrop-filter:blur(6px)}
.button-ghost:hover{border-color:var(--gold);color:var(--gold-2)}
.button-outline{border-color:var(--line-strong);color:var(--gold)}
.button-outline:hover{background:rgba(228,194,122,.1);border-color:var(--gold)}
.button.full{width:100%;margin-top:18px}
.link-button{color:var(--gold);font-size:14px;padding:10px 0;margin-top:8px;border-bottom:1px solid transparent}
.link-button:hover{border-bottom-color:var(--gold)}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(10,13,26,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.header-row{display:flex;align-items:center;gap:36px;min-height:74px}
.brand{display:inline-flex;align-items:center;gap:12px;flex:none}
.brand-emblem{width:52px;height:52px;flex:none;filter:drop-shadow(0 2px 6px rgba(0,0,0,.55)) drop-shadow(0 0 12px rgba(246,182,34,.22))}
.brand-word{font-family:var(--display);font-weight:900;font-size:26px;letter-spacing:.06em;line-height:1;text-transform:uppercase;white-space:nowrap;
  background:linear-gradient(180deg,#fff7d6 0%,#fbe39a 16%,#f7c443 36%,#dc951d 49%,#c47c12 51%,#f2b72e 58%,#fbe08a 78%,#c4841c 92%,#8a560c 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-stroke:.6px rgba(43,22,2,.7);
  filter:drop-shadow(0 1.5px 0 rgba(0,0,0,.75)) drop-shadow(0 0 10px rgba(246,182,34,.18))}
.brand-number{margin-left:.32em}
.footer-brand-block .brand-emblem{width:44px;height:44px}
.footer-brand-block .brand-word{font-size:22px}
@media(max-width:1280px){.header-row .brand-emblem{width:44px;height:44px}.header-row .brand-word{font-size:22px}}
@media(max-width:720px){.header-row .brand-emblem{width:36px;height:36px}.header-row .brand-word{font-size:18px}.header-row .brand{gap:9px}}
.site-nav{display:flex;gap:30px;font-size:14px;font-weight:500;color:var(--ash)}
.site-nav a{padding:6px 0;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}
.site-nav a:hover,.site-nav a.active{color:var(--ink);border-bottom-color:var(--gold)}
.header-tools{margin-left:auto;display:flex;align-items:center;gap:16px}
.lang-switch{font-size:13px;font-weight:500;color:var(--ash);border:1px solid var(--hair);padding:7px 12px;border-radius:999px;transition:color .2s,border-color .2s}
.lang-switch:hover{color:var(--ink);border-color:var(--line-strong)}
#nav-account{min-height:42px;padding:9px 18px;font-size:14px}

/* notices */
.notice{width:min(var(--shell),calc(100% - var(--gutter)*2));margin:18px auto 0;background:rgba(255,156,141,.1);border:1px solid rgba(255,156,141,.35);color:#ffd9d1;padding:14px 18px;border-radius:10px;font-size:14px}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,16px);opacity:0;z-index:70;max-width:min(92vw,560px);
  background:linear-gradient(180deg,#232c4f,#161c33);border:1px solid var(--line-strong);color:var(--ink);padding:14px 20px;border-radius:12px;font-size:14px;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.9);transition:opacity .25s,transform .25s}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* hero */
.hero{position:relative;min-height:clamp(620px,92vh,960px);overflow:hidden;isolation:isolate;border-bottom:1px solid var(--line)}
.hero-art{position:absolute;inset:-4%;background:url("/media/courtyard.jpg") 72% 42%/cover no-repeat;filter:saturate(1.08) contrast(1.04);transform:scale(1.08);
  animation:drift 32s ease-in-out infinite alternate;transition:transform .6s ease-out;will-change:transform}
@keyframes drift{from{transform:scale(1.08) translate(0,0)}to{transform:scale(1.14) translate(-1.5%,1%)}}
.hero-grade{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(12,16,32,.97) 0%,rgba(12,16,32,.9) 28%,rgba(12,16,32,.5) 56%,rgba(12,16,32,.18) 100%),
  linear-gradient(180deg,rgba(10,13,26,.6) 0%,rgba(10,13,26,0) 30%,rgba(10,13,26,0) 58%,#0c1020 100%),
  radial-gradient(55% 45% at 78% 68%,rgba(255,154,74,.22),rgba(255,154,74,0) 70%)}
.hero-embers{position:absolute;inset:0;width:100%;height:100%;mix-blend-mode:screen;pointer-events:none}
.hero-inner{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:end;min-height:inherit;padding:110px 0 70px}
.hero-copy{max-width:640px;align-self:center}
.hero-kicker{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:500;color:var(--ash);margin-bottom:26px;padding:7px 14px 7px 10px;border:1px solid var(--hair);border-radius:999px;background:rgba(12,16,32,.45)}
.live-dot{width:9px;height:9px;border-radius:50%;background:var(--ash-2);flex:none;position:relative}
.live-dot.on{background:var(--ok);box-shadow:0 0 0 0 rgba(127,211,161,.6);animation:pulse 2.4s ease-out infinite}
.live-dot.off{background:var(--error)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(127,211,161,.55)}70%{box-shadow:0 0 0 9px rgba(127,211,161,0)}100%{box-shadow:0 0 0 0 rgba(127,211,161,0)}}
.hero h1{margin-bottom:22px;max-width:11ch;animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.hero-lead{font-size:19px;color:#cfd3e0;max-width:50ch;margin-bottom:34px;animation:rise .9s .12s cubic-bezier(.2,.7,.2,1) both}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;animation:rise .9s .22s cubic-bezier(.2,.7,.2,1) both}
.hero-fine{margin:26px 0 0;font-size:13px;color:var(--ash-2);animation:rise .9s .3s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hour-card{position:relative;padding:22px 24px 20px;border-radius:var(--radius);border:1px solid var(--line);background:rgba(10,13,26,.62);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  box-shadow:0 30px 60px -30px rgba(0,0,0,.9);animation:rise .9s .4s cubic-bezier(.2,.7,.2,1) both}
.hour-card.on{border-color:rgba(255,154,74,.55);box-shadow:0 0 0 1px rgba(255,154,74,.15),0 30px 70px -30px rgba(255,154,74,.55)}
.hour-title{font-family:var(--display);font-weight:600;font-size:17px;color:var(--gold);margin:0 0 4px}
.hour-when{font-size:13px;color:var(--ash);margin:0 0 14px}
.hour-count{font-family:var(--display);font-weight:600;font-size:23px;line-height:1.1;color:var(--ember);margin:0 0 8px;text-shadow:0 0 24px rgba(255,154,74,.35)}
.hour-note{font-size:13px;color:var(--ash);margin:0}
.art-credit{position:absolute;right:20px;bottom:12px;font-size:11px;color:rgba(166,171,191,.6)}

/* lanterns */
.lanterns{background:linear-gradient(180deg,#0e1326,#0c1020);border-bottom:1px solid var(--line)}
.lantern-row{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;padding:36px 0}
.lantern{display:grid;grid-template-columns:26px 1fr;gap:2px 14px;align-items:start}
.lantern svg{grid-row:1/3;width:24px;height:32px;color:var(--gold);filter:drop-shadow(0 0 8px rgba(228,194,122,.55))}
.lantern strong{font-family:var(--display);font-weight:600;font-size:16px;color:var(--ink)}
.lantern span{font-size:14px;color:var(--ash)}

/* sections */
.section{padding:100px 0}
.section-dusk{background:linear-gradient(180deg,#10162b 0%,#0c1020 100%);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{max-width:780px;margin-bottom:52px}
.section-head h2{margin-bottom:18px}
.section-fine{margin:32px 0 0;max-width:80ch}

.scrolls{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.scroll{position:relative;padding:46px 32px 32px;background:linear-gradient(180deg,#181f3a 0%,#121831 100%);border:1px solid var(--line);border-radius:6px 6px var(--radius) var(--radius)}
.scroll::before{content:"";position:absolute;left:-9px;right:-9px;top:-3px;height:7px;border-radius:4px;background:linear-gradient(90deg,#8d6f2f,#f3dba0 50%,#8d6f2f);box-shadow:0 6px 18px -6px rgba(228,194,122,.7)}
.scroll::after{content:"";position:absolute;left:50%;top:4px;width:1px;height:26px;background:linear-gradient(180deg,var(--gold),transparent)}
.scroll h3{font-size:22px;margin-bottom:14px}
.scroll p{color:var(--ash);font-size:15px}
.scroll-end{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--hair);color:var(--gold);font-size:14px;font-weight:500}

.rolls{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.roll-card{padding:30px 28px 24px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(12,16,32,.55)}
.roll-card>p{color:var(--ash);font-size:15px}
.roll-list{list-style:none;padding:0;margin:22px 0 16px;display:grid;gap:12px}
.roll-list li{display:grid;grid-template-columns:1fr auto;grid-template-areas:"label pct" "bar bar";gap:5px 12px;align-items:center;font-size:14px}
.roll-list li span{grid-area:label;color:var(--ink)}
.roll-list li b{grid-area:pct;font-family:var(--display);font-weight:600;color:var(--gold);font-size:15px}
.roll-list li i{grid-area:bar;height:5px;border-radius:3px;background:rgba(228,194,122,.12);position:relative;overflow:hidden}
.roll-list li i::after{content:"";position:absolute;inset:0;width:var(--pct,0%);border-radius:3px;background:linear-gradient(90deg,#b48f3f,#f3dba0)}
.roll-plain li{grid-template-areas:"label pct";border-bottom:1px solid var(--hair);padding-bottom:8px}
.roll-plain li:last-child{border:0}

.timeline{list-style:none;padding:0;margin:0 0 28px;display:grid;gap:40px;position:relative;max-width:860px}
.timeline::before{content:"";position:absolute;left:27px;top:60px;bottom:40px;width:1px;background:linear-gradient(180deg,var(--line-strong),rgba(228,194,122,.05))}
.timeline li{display:grid;grid-template-columns:56px 1fr;gap:28px;align-items:start}
.step-num{width:56px;height:56px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;font-family:var(--display);font-weight:600;font-size:22px;color:var(--gold);
  background:radial-gradient(circle at 50% 28%,#283259,#121831);box-shadow:0 0 28px -8px rgba(228,194,122,.6);flex:none}
.step-when{font-size:13px;font-weight:500;color:var(--gold);margin:14px 0 6px}
.timeline h3{font-size:24px;margin-bottom:10px}
.timeline p{color:var(--ash);max-width:62ch}
.step-note{color:var(--ink);background:rgba(228,194,122,.07);border-left:2px solid var(--gold);padding:12px 16px;border-radius:0 10px 10px 0}

.evenings{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.evening-card{position:relative;padding:30px 28px;border:1px solid var(--line);border-radius:var(--radius);background:#121831;overflow:hidden}
.evening-card h3{font-size:22px;margin-bottom:6px}
.evening-when{font-size:13px;font-weight:500;color:var(--gold);margin-bottom:14px}
.evening-card>p:not(.evening-when):not(.evening-count){color:var(--ash);font-size:15px}
.evening-hour{background:radial-gradient(120% 100% at 0% 0%,rgba(255,154,74,.24),rgba(255,154,74,0) 60%),#121831}
.evening-hour.on{border-color:rgba(255,154,74,.5)}
.evening-count{font-family:var(--display);font-weight:600;font-size:21px;color:var(--ember);margin:18px 0 0}
.evening-rush{background:radial-gradient(120% 100% at 100% 0%,rgba(228,194,122,.16),rgba(228,194,122,0) 60%),#121831}
.evening-coins{background:radial-gradient(120% 100% at 50% 100%,rgba(127,211,161,.14),rgba(127,211,161,0) 60%),#121831}

.teasers{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.teaser{--c:#f2a93b;display:grid;grid-template-rows:auto auto 1fr;gap:14px;padding:30px 28px;border-radius:var(--radius);
  background:linear-gradient(180deg,color-mix(in srgb,var(--c) 16%,#121831),#0f1529);border:1px solid color-mix(in srgb,var(--c) 32%,transparent);transition:transform .25s,box-shadow .25s,border-color .25s}
.teaser:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px var(--c);border-color:color-mix(in srgb,var(--c) 60%,transparent)}
.teaser-mounts{--c:#f2a93b}.teaser-outfits{--c:#e2546f}.teaser-pets{--c:#8bd45c}
.teaser-emblem{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;color:var(--c);background:radial-gradient(circle,color-mix(in srgb,var(--c) 34%,transparent),transparent 72%)}
.teaser-emblem svg{width:48px;height:48px;filter:drop-shadow(0 0 10px color-mix(in srgb,var(--c) 70%,transparent))}
.teaser strong{font-family:var(--display);font-weight:600;font-size:20px;color:var(--ink)}
.teaser span:last-child{font-size:14px;color:var(--ash)}

.closing{padding:120px 0 130px;text-align:center;background:radial-gradient(60% 70% at 50% 110%,rgba(228,194,122,.16),rgba(228,194,122,0) 70%)}
.closing-inner{max-width:720px;margin:0 auto}
.closing p{color:var(--ash);font-size:18px;margin-bottom:34px}
.closing .hero-actions{justify-content:center;animation:none}

/* account */
.account-view{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding:80px 0 120px;align-items:start}
.account-intro h1{font-size:clamp(34px,4.2vw,56px)}
.intro-list{list-style:none;padding:0;margin:30px 0 0;display:grid;gap:14px;color:var(--ash);font-size:15px}
.intro-list li{padding-left:22px;position:relative}
.intro-list li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;transform:rotate(45deg);background:var(--gold)}
.account-card{background:linear-gradient(180deg,#171e38,#111730);border:1px solid var(--line);border-radius:18px;padding:36px 40px 32px;box-shadow:0 40px 90px -45px rgba(0,0,0,.9)}
.account-card h2{font-family:var(--display);font-weight:600;font-size:26px;margin-bottom:6px}
.tabs{display:flex;gap:6px;padding:5px;background:rgba(6,9,20,.55);border-radius:12px;margin-bottom:26px}
.tabs button{flex:1;padding:11px;border-radius:9px;font-weight:500;color:var(--ash);transition:background .2s,color .2s}
.tabs button.active{background:rgba(228,194,122,.14);color:var(--gold)}
.form-lead{color:var(--ash);font-size:14px;margin-bottom:22px}
label{display:block;font-size:13px;font-weight:500;color:var(--ink);margin:16px 0 7px}
input{width:100%;min-height:48px;background:rgba(6,9,20,.65);border:1px solid rgba(243,238,227,.14);border-radius:9px;padding:10px 14px;transition:border-color .2s,box-shadow .2s}
input:focus{outline:0;border-color:var(--gold);box-shadow:0 0 0 3px rgba(228,194,122,.16)}
input+small,.show-password+small{display:block;font-size:12px;color:var(--ash-2);margin-top:6px}
.show-password{display:flex;align-items:center;gap:8px;margin:10px 0 0;font-size:13px;font-weight:400;cursor:pointer;color:var(--ash)}
.show-password input{width:auto;min-height:0;margin:0;accent-color:var(--gold)}
.form-message{font-size:13px;color:var(--error);margin:14px 0 0;min-height:0}
.form-message.success{color:var(--ok)}
.account-card .fine{margin-top:16px}
details{border-top:1px solid var(--hair);padding:14px 0}
details summary{cursor:pointer;font-weight:500;font-size:15px;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px}
details summary::-webkit-details-marker{display:none}
details summary::after{content:"+";font-family:var(--display);color:var(--gold);font-size:20px;line-height:1;transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}
details p{color:var(--ash);font-size:14px;margin-top:12px}
details code{display:block;background:rgba(6,9,20,.7);border:1px solid var(--line);padding:12px 14px;border-radius:9px;overflow-wrap:anywhere;color:var(--gold);font-size:13px}
.dash-hello{color:var(--ash);margin-bottom:0;font-size:14px}
#dashboard h2#username{font-size:34px;margin-bottom:18px;overflow-wrap:anywhere}
.dash-coins{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 16px;border-radius:12px;background:rgba(228,194,122,.08);border:1px solid var(--line);margin-bottom:18px;font-size:14px}
.dash-coins strong{font-family:var(--display);font-size:20px;color:var(--gold);margin-right:4px}
.dash-coins .text-link{margin-left:auto;font-size:13px}
.coin-icon{width:22px;height:22px;border-radius:50%;flex:none;background:radial-gradient(circle at 35% 30%,#fff3cc,#e4c27a 45%,#8f7030 100%);box-shadow:0 0 12px rgba(228,194,122,.55)}
.dash-tip{font-size:14px;color:var(--ash)}
.button.full+.dash-tip{margin-top:16px}
#dashboard details{margin-top:4px}

/* terms (coins and refunds) */
.vote-panel .vote-rule{color:var(--gold);font-weight:500}
.terms-view{padding:72px 0 120px;max-width:820px}
.terms-view h1{font-size:clamp(32px,4.2vw,54px);margin-bottom:18px}
.terms-view .section-lead{margin-bottom:34px}
.terms-view h2{font-family:var(--display);font-weight:600;font-size:22px;margin:38px 0 14px;color:var(--gold)}
.terms-view p{color:var(--ash);font-size:15px;line-height:1.7;margin-bottom:12px}
.terms-view .checklist{font-size:15px;line-height:1.65}

/* play */
.play-view{padding:80px 0 120px}
.play-view .section-head h1{font-size:clamp(34px,4.6vw,62px)}
.steps{list-style:none;padding:0;margin:54px 0 70px;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.step{position:relative;padding:40px 28px 28px;background:linear-gradient(180deg,#171e38,#111730);border:1px solid var(--line);border-radius:var(--radius)}
.step .step-num{position:absolute;top:-24px;left:24px;width:48px;height:48px;font-size:19px}
.step h3{font-size:22px}
.step p{color:var(--ash);font-size:15px}
.step .button{margin:6px 0 12px}
.step-download{border-color:var(--line-strong);background:linear-gradient(180deg,#1d2546,#131a33)}
.play-details{display:grid;grid-template-columns:1.1fr .9fr;gap:70px}
.play-details h2{font-family:var(--display);font-weight:600;font-size:26px;margin-bottom:20px}
.checklist{list-style:none;padding:0;margin:0;display:grid;gap:12px;color:var(--ash);font-size:15px}
.checklist li{padding-left:22px;position:relative}
.checklist li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;transform:rotate(45deg);background:var(--gold)}
.play-details details p{font-size:14px}
.checksum{margin-top:48px;border:1px solid var(--line);border-radius:12px;padding:16px 20px}
.checksum summary{font-size:14px}
.checksum p{font:13px/1.8 ui-monospace,Consolas,monospace;overflow-wrap:anywhere;color:var(--ash)}
.checksum a{font-size:14px;color:var(--gold)}

/* footer */
.site-footer{border-top:1px solid var(--line);background:var(--night-2);padding:52px 0 44px}
.footer-inner{display:grid;grid-template-columns:1fr auto;grid-template-areas:"brand status" "links note";gap:22px 40px;align-items:center}
.footer-brand-block{grid-area:brand}
.footer-brand-block p{margin:12px 0 0;font-size:14px;color:var(--ash)}
.footer-status{grid-area:status;display:inline-flex;align-items:center;gap:10px;margin:0;font-size:14px;color:var(--ash);justify-self:end}
.footer-links{grid-area:links;display:flex;flex-wrap:wrap;gap:10px 26px;font-size:14px;color:var(--ash)}
.footer-links a:hover{color:var(--gold)}
.footer-links img{height:16px;width:auto;opacity:.85}
.footer-note{grid-area:note;margin:0;font-size:13px;color:var(--ash-2);justify-self:end}

/* responsive */
@media(max-width:1060px){
  .hero-inner{grid-template-columns:1fr;align-items:center;padding:90px 0 60px}
  .hour-card{max-width:380px}
  .lantern-row{grid-template-columns:1fr 1fr}
  .scrolls,.rolls,.evenings,.teasers,.steps{grid-template-columns:1fr 1fr}
  .account-view{grid-template-columns:1fr;gap:40px;padding:56px 0 90px}
  .play-details{grid-template-columns:1fr;gap:44px}
}
@media(max-width:720px){
  :root{--gutter:16px}
  .header-row{flex-wrap:wrap;gap:12px 20px;padding:12px 0}
  .site-nav{order:3;width:100%;justify-content:space-between;gap:12px;font-size:13px;padding-top:10px;border-top:1px solid var(--hair)}
  .header-tools{gap:10px}
  #nav-account{padding:8px 14px}
  .hero{min-height:0}
  .hero-inner{padding:70px 0 54px;gap:30px}
  .hero-grade{background:linear-gradient(90deg,rgba(12,16,32,.82) 0%,rgba(12,16,32,.62) 50%,rgba(12,16,32,.5) 100%),linear-gradient(180deg,rgba(10,13,26,.55) 0%,rgba(10,13,26,.1) 30%,rgba(10,13,26,.35) 60%,#0c1020 100%)}
  .hero-art{background-position:62% 40%}
  .hero h1{max-width:none}
  .hero-lead{font-size:17px}
  .hero-actions .button{flex:1 1 auto}
  .hour-card{max-width:none}
  .art-credit{position:static;display:block;padding:0 var(--gutter) 10px;text-align:right}
  .lantern-row{grid-template-columns:1fr;gap:20px;padding:28px 0}
  .section{padding:64px 0}
  .section-head{margin-bottom:34px}
  .scrolls,.rolls,.evenings,.teasers,.steps{grid-template-columns:1fr}
  .scroll{padding:40px 24px 26px}
  .timeline li{grid-template-columns:44px 1fr;gap:18px}
  .step-num{width:44px;height:44px;font-size:18px}
  .timeline::before{left:21px}
  .timeline h3{font-size:21px}
  .closing{padding:80px 0 90px}
  .account-card{padding:26px 20px 24px}
  .steps{margin:44px 0 50px;gap:34px}
  .footer-inner{grid-template-columns:1fr;grid-template-areas:"brand" "status" "links" "note"}
  .footer-status,.footer-note{justify-self:start}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .hero-art{transform:none}
}

/* Discord and voting (8 October 2026): blurple is Discord's colour, used only for those buttons */
:root{--blurple:#5865f2;--blurple-2:#7c86ff;--blurple-deep:#3f49c9}
.button-discord{color:#fff;background:linear-gradient(180deg,#6b76ff 0%,var(--blurple) 55%,#4a55e0 100%);border-color:rgba(255,255,255,.12);
  box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 14px 34px -14px rgba(88,101,242,.9)}
.button-discord:hover{transform:translateY(-1px);background:linear-gradient(180deg,#7f89ff 0%,#6a74ff 55%,#525de8 100%);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 20px 44px -14px rgba(88,101,242,1)}
.button-discord svg{width:20px;height:20px;flex:none}
.header-discord{min-height:42px;padding:9px 16px;font-size:14px;gap:8px}
.discord-float{position:fixed;right:22px;bottom:22px;z-index:60;display:inline-flex;align-items:center;gap:10px;padding:12px 18px 12px 14px;border-radius:999px;color:#fff;font-weight:600;font-size:14px;
  background:linear-gradient(180deg,#6b76ff,#4a55e0);box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 18px 40px -14px rgba(88,101,242,1),0 0 0 0 rgba(88,101,242,.5);
  animation:beacon 3.2s ease-out 1.5s infinite;transition:transform .2s,box-shadow .25s}
.discord-float svg{width:22px;height:22px}
.discord-float:hover{transform:translateY(-2px);animation:none;box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 24px 50px -14px rgba(88,101,242,1)}
@keyframes beacon{0%{box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 18px 40px -14px rgba(88,101,242,1),0 0 0 0 rgba(88,101,242,.55)}60%{box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 18px 40px -14px rgba(88,101,242,1),0 0 0 14px rgba(88,101,242,0)}100%{box-shadow:0 1px 0 rgba(255,255,255,.25) inset,0 18px 40px -14px rgba(88,101,242,1),0 0 0 0 rgba(88,101,242,0)}}
body[data-view="home-view"] .discord-float{opacity:0;pointer-events:none;transform:translateY(12px)}
body[data-view="home-view"].past-hero .discord-float{opacity:1;pointer-events:auto;transform:none}
.community{display:grid;grid-template-columns:1.25fr 1fr;gap:24px}
.discord-panel{position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:8px 22px;align-items:center;padding:34px 34px 30px;border-radius:var(--radius);overflow:hidden;
  border:1px solid rgba(124,134,255,.4);background:linear-gradient(135deg,#1b2050 0%,#141a3a 55%,#11162e 100%);transition:transform .25s,box-shadow .25s,border-color .25s}
.discord-panel:hover{transform:translateY(-4px);border-color:rgba(124,134,255,.8);box-shadow:0 34px 70px -34px rgba(88,101,242,.9)}
.discord-glow{position:absolute;inset:-40% 40% 20% -20%;background:radial-gradient(closest-side,rgba(88,101,242,.5),rgba(88,101,242,0));pointer-events:none}
.discord-icon{grid-row:1/3;width:84px;height:84px;border-radius:24px;display:grid;place-items:center;color:#fff;background:linear-gradient(180deg,#6b76ff,#4a55e0);box-shadow:0 18px 40px -14px rgba(88,101,242,1)}
.discord-icon svg{width:46px;height:46px}
.discord-text{position:relative;display:grid;gap:8px}
.discord-text strong{font-family:var(--display);font-weight:600;font-size:24px;color:var(--ink)}
.discord-text span{color:#c7cbe6;font-size:15px;max-width:52ch}
.discord-cta{position:relative;grid-column:2;justify-self:start;margin-top:6px}
.vote-panel{padding:30px 28px 26px;border-radius:var(--radius);border:1px solid var(--line);background:radial-gradient(120% 100% at 100% 0%,rgba(228,194,122,.16),rgba(228,194,122,0) 60%),#121831}
.vote-panel h3{font-size:22px;margin-bottom:8px}
.vote-panel>p:not(.fine){color:var(--ash);font-size:15px;margin-bottom:18px}
.vote-links{display:grid;gap:10px;margin-bottom:16px}
.vote-link{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 16px;border-radius:10px;border:1px solid var(--line-strong);background:rgba(228,194,122,.08);font-weight:500;transition:background .2s,transform .2s,border-color .2s}
.vote-link:hover{background:rgba(228,194,122,.16);transform:translateY(-1px);border-color:var(--gold)}
.vote-go{font-family:var(--display);font-weight:600;font-size:14px;color:var(--gold)}
.vote-panel .fine{margin:0}
.vote-link.done{opacity:.78;border-color:var(--line)}.vote-link.done .vote-go{color:var(--ok)}.vote-mine{color:var(--ok)}
@media(max-width:1060px){.community{grid-template-columns:1fr}.header-discord{display:none}}
@media(max-width:720px){.discord-panel{grid-template-columns:1fr;padding:26px 22px}.discord-icon{grid-row:auto;width:64px;height:64px;border-radius:18px}.discord-icon svg{width:34px;height:34px}.discord-cta{grid-column:1}.discord-float{right:14px;bottom:14px;padding:11px 15px 11px 12px;font-size:13px}}

/* Rankings (/ranking), 9 October 2026 */
.ranking-view{padding:72px 0 120px;max-width:900px}
.ranking-view h1{font-size:clamp(32px,4.2vw,54px);margin-bottom:18px}
.ranking-view .section-lead{margin-bottom:26px}
.rank-title{font-family:var(--display);font-weight:600;font-size:22px;margin:34px 0 14px;color:var(--gold)}
.rank-note{color:var(--ash);font-size:15px}
.rank-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);background:var(--dusk)}
.rank-table{width:100%;border-collapse:collapse;font-size:15px}
.rank-table th{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ash);font-weight:600;text-align:left;padding:12px 14px;border-bottom:1px solid var(--line-strong);white-space:nowrap}
.rank-table td{padding:11px 14px;border-bottom:1px solid var(--hair);color:var(--ink)}
.rank-table tbody tr:last-child td{border-bottom:0}
.rank-table tbody tr:hover td{background:var(--dusk-2)}
.rank-table .rank-pos{width:48px;color:var(--ash-2);font-variant-numeric:tabular-nums}
.rank-table .rank-num{text-align:right;font-variant-numeric:tabular-nums}
.rank-table .rank-name{font-weight:600;word-break:break-word}
.rank-table .rank-kingdom{white-space:nowrap}
.rank-table .rank-top1{color:var(--gold-2);font-weight:700}
.rank-table .rank-top2{color:#d9dde8;font-weight:700}
.rank-table .rank-top3{color:var(--ember);font-weight:700}
.rank-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:8px}
.rank-dot.k1{background:#e0524a}.rank-dot.k2{background:#e8c547}.rank-dot.k3{background:#4f86e8}
@media (max-width:560px){.rank-table{font-size:14px}.rank-table th,.rank-table td{padding:9px 8px}.rank-table .rank-pos{width:30px}.rank-table .rank-class{display:none}}

/* ==== The painted Evenfall (12 October 2026, owner: "i want the website to look his best with canva art and so on").
   The Canva paintings of the game client (login, select and loading screens) and three new ones (mystery chests,
   the Armoured Horse, the campfire) as the hero, framed pictures and full-bleed scenes; sections fade in as they
   scroll into view (site.js adds .reveal-on only when motion is allowed). */

/* hero: the login painting, the copy centred under the dragon */
.hero-art{background-image:url("/static/art/dusk-1920.jpg");background-position:50% 36%}
.hero-grade{background:
  radial-gradient(44% 24% at 50% 43%,rgba(10,13,26,.42) 0%,rgba(10,13,26,0) 100%),
  radial-gradient(64% 58% at 50% 74%,rgba(10,13,26,.84) 0%,rgba(10,13,26,.55) 48%,rgba(10,13,26,0) 82%),
  linear-gradient(180deg,rgba(10,13,26,.55) 0%,rgba(10,13,26,0) 20%,rgba(10,13,26,0) 46%,rgba(12,16,32,.5) 76%,#0c1020 100%)}
.hero-inner{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;text-align:center;gap:34px;padding:150px 0 64px}
.hero-copy{max-width:800px;align-self:center}
.hero h1{max-width:none;filter:drop-shadow(0 6px 30px rgba(0,0,0,.7))}
.hero-kicker{background:rgba(10,13,26,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.hero-lead{margin-inline:auto;color:#e6e3dc;text-shadow:0 2px 16px rgba(0,0,0,.75)}
.hero-actions{justify-content:center}
.hero-fine{color:#b9bece;text-shadow:0 1px 10px rgba(0,0,0,.85)}
.hour-card{display:grid;grid-template-columns:auto auto auto;align-items:center;gap:6px 26px;padding:15px 28px;text-align:left;max-width:none;border-radius:16px}
.hour-head{display:grid;gap:2px}
.hour-card .hour-title{margin:0}
.hour-card .hour-when{margin:0}
.hour-card .hour-count{margin:0;font-size:21px;padding-left:26px;border-left:1px solid var(--line)}
.hour-card .hour-note{margin:0;max-width:26ch;padding-left:26px;border-left:1px solid var(--line)}

/* small gold label above a heading */
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin:0 0 16px}
.eyebrow::before{content:"";width:28px;height:1px;background:linear-gradient(90deg,rgba(228,194,122,0),var(--gold))}

/* framed paintings */
.art-frame{position:relative;margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--line-strong);background:#0a0d1a;
  box-shadow:0 44px 90px -44px rgba(0,0,0,.95),0 0 0 6px rgba(228,194,122,.05),0 0 70px -24px rgba(228,194,122,.4)}
.art-frame picture,.art-frame img{display:block;width:100%;height:auto}
.art-frame img{transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.art-frame:hover img{transform:scale(1.045)}
.art-frame::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(243,219,160,.14),inset 0 -110px 90px -60px rgba(10,13,26,.92)}
.art-frame figcaption{position:absolute;left:22px;right:22px;bottom:16px;z-index:1;font-family:var(--display);font-size:15px;font-weight:600;letter-spacing:.02em;color:var(--gold-2);text-shadow:0 2px 12px rgba(0,0,0,.95)}

/* picture + text rows */
.feature-row{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:72px;align-items:center}
.feature-flip .feature-art{order:2}
.feature-copy h2{margin-bottom:18px}
.feature-copy .section-lead{margin-bottom:28px}
.kit{list-style:none;padding:0;margin:0 0 24px;display:grid;grid-template-columns:1fr 1fr;gap:18px 28px}
.kit li{position:relative;padding-left:24px;display:grid;gap:3px}
.kit li::before{content:"";position:absolute;left:0;top:.48em;width:9px;height:9px;transform:rotate(45deg);background:linear-gradient(135deg,#f3dba0,#b48f3f);box-shadow:0 0 12px rgba(228,194,122,.65)}
.kit strong{font-weight:600;font-size:15px;color:var(--ink)}
.kit span{font-size:14px;line-height:1.5;color:var(--ash)}
.chest-list{list-style:none;padding:0;margin:0 0 22px;display:grid;grid-template-columns:1fr 1fr;gap:12px}
.chest{--c:#4fd18b;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:2px 14px;align-items:center;padding:14px 16px;border-radius:12px;
  border:1px solid color-mix(in srgb,var(--c) 40%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--c) 15%,#121831),#0f1529);transition:transform .25s,box-shadow .25s}
.chest:hover{transform:translateY(-2px);box-shadow:0 18px 40px -22px var(--c)}
.chest .gem{grid-row:1/3;width:26px;height:26px;margin:0 4px;transform:rotate(45deg);border-radius:6px;
  background:radial-gradient(circle at 32% 28%,#fff 0%,var(--c) 40%,color-mix(in srgb,var(--c) 45%,#000) 100%);box-shadow:0 0 20px color-mix(in srgb,var(--c) 75%,transparent)}
.chest strong{font-family:var(--display);font-weight:600;font-size:17px;color:var(--ink);line-height:1.2}
.chest span:last-child{font-size:13px;line-height:1.4;color:var(--ash)}
.chest-emerald{--c:#4fd18b}.chest-sapphire{--c:#4f8dff}.chest-amethyst{--c:#b46cff}.chest-citrine{--c:#f2b93b}

/* the four quality-of-life scrolls */
.scrolls-4{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.scrolls-4 .scroll{padding:44px 24px 26px}
.scrolls-4 .scroll h3{font-size:20px}

/* full-bleed painted scenes */
.scene{position:relative;isolation:isolate;overflow:hidden;background:#0a0d1a}
.scene-art{position:absolute;inset:0;z-index:-2}
.scene-art img{display:block;width:100%;height:100%;object-fit:cover}
.scene-grade{position:absolute;inset:0;z-index:-1;pointer-events:none}
.scene-inner{position:relative}
.scene-metin .scene-art{left:34%;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 30%);mask-image:linear-gradient(90deg,transparent 0%,#000 30%)}
.scene-metin .scene-art img{object-position:50% 50%}
.scene-metin .scene-grade{background:
  linear-gradient(90deg,rgba(10,13,26,.6) 0%,rgba(10,13,26,.45) 40%,rgba(10,13,26,.06) 70%,rgba(10,13,26,.12) 100%),
  linear-gradient(180deg,#0c1020 0%,rgba(12,16,32,0) 14%,rgba(12,16,32,0) 84%,#0c1020 100%)}
.scene-metin .section-head,.scene-metin .drops,.scene-metin .rate-strip,.scene-metin .section-fine{max-width:640px}
.scene-metin .drops{grid-template-columns:1fr;gap:16px}
.scene-metin .drop-card{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:20px;align-items:start;padding:22px 24px}
.scene-metin .drop-icon{grid-row:1/3;margin:0}
.scene-metin .drop-card h3{margin:2px 0 6px}
.scene-courtyard .scene-art img{object-position:50% 72%}
.scene-courtyard .scene-grade{background:
  radial-gradient(58% 64% at 50% 46%,rgba(10,13,26,.5),rgba(10,13,26,.86) 100%),
  linear-gradient(180deg,#0c1020 0%,rgba(12,16,32,0) 24%,rgba(12,16,32,0) 76%,#0c1020 100%)}
.scene .section-lead{color:#c3c7d6}

/* the new drops */
.drops{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1000px}
.drop-card{padding:28px 26px 26px;border-radius:var(--radius);border:1px solid var(--line);background:rgba(12,16,32,.66);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:transform .25s,border-color .25s,box-shadow .25s}
.drop-card:hover{transform:translateY(-4px);border-color:var(--line-strong);box-shadow:0 30px 60px -30px rgba(255,96,80,.5)}
.drop-icon{display:grid;place-items:center;width:52px;height:52px;border-radius:14px;margin-bottom:16px;color:#ff9384;
  background:radial-gradient(circle at 50% 30%,rgba(255,110,90,.34),rgba(255,110,90,.06));border:1px solid rgba(255,147,132,.36)}
.drop-icon svg{width:30px;height:30px}
.drop-card h3{font-size:21px;margin-bottom:10px}
.drop-card p{margin:0;font-size:15px;color:#c3c7d6}
.rate-strip{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-wrap:wrap;gap:14px;max-width:1000px}
.rate-strip li{display:flex;align-items:baseline;gap:10px;padding:12px 20px;border-radius:999px;border:1px solid var(--line);background:rgba(10,13,26,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.rate-strip b{font-family:var(--display);font-weight:700;font-size:17px;color:var(--gold)}
.rate-strip span{font-size:14px;color:var(--ash)}
.scene-metin .section-fine{max-width:96ch;color:#9ea4b8}

/* journey with its painting */
.journey{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:64px;align-items:center}
.journey .timeline{margin-bottom:0}
.journey-art img{aspect-ratio:960/900;object-fit:cover}

/* the Discord card shows the campfire painting */
.discord-art{align-content:end;min-height:480px;background-color:#11162e;background-size:cover;background-position:center 30%;
  background-image:linear-gradient(180deg,rgba(17,22,46,.04) 0%,rgba(17,22,46,.3) 36%,rgba(17,22,46,.9) 68%,#11162e 100%),url("/static/art/campfire-960.jpg");}
.discord-art .discord-glow{opacity:.5}

/* store teaser colours */
.teaser-comfort{--c:#5aa9ff}.teaser-fun{--c:#ff6fc8}.teaser-coins{--c:#f2b93b}

/* closing over the moonlit courtyard */
.closing.scene{padding:150px 0 160px}
.closing.scene p{color:#c9cdd9}

/* fade-in as sections scroll into view */
.reveal-on .reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal-on .reveal.in{opacity:1;transform:none}

@media(max-width:1060px){
  .hero-inner{padding:130px 0 56px}
  .feature-row,.journey{grid-template-columns:1fr;gap:40px}
  .feature-flip .feature-art{order:0}
  .scrolls-4,.drops{grid-template-columns:1fr 1fr}
  .journey-art{max-width:680px}
  .journey-art img{aspect-ratio:16/9}
  .hero-art{background-image:url("/static/art/dusk-1280.jpg")}
}
@media(max-width:720px){
  .hero{min-height:600px;min-height:clamp(600px,94svh,880px)}
  .hero-art{background-image:url("/static/art/dusk-m.jpg");background-position:50% 12%}
  .hero-grade{background:linear-gradient(180deg,rgba(10,13,26,.4) 0%,rgba(10,13,26,0) 20%,rgba(10,13,26,.3) 40%,rgba(12,16,32,.9) 64%,#0c1020 100%)}
  .hero-inner{padding:120px 0 34px;gap:24px}
  .hero-kicker{margin-bottom:18px}
  .hour-card{grid-template-columns:1fr;text-align:center;gap:4px;padding:14px 18px;width:100%}
  .hour-card .hour-count,.hour-card .hour-note{border-left:0;padding-left:0;max-width:none}
  .kit,.chest-list,.scrolls-4,.drops{grid-template-columns:1fr}
  .rate-strip li{width:100%;border-radius:12px}
  .scene-metin .scene-art{left:0;-webkit-mask-image:none;mask-image:none}
  .scene-metin .scene-art img{object-position:50% 50%}
  .scene-metin .drop-card{grid-template-columns:44px minmax(0,1fr);column-gap:16px;padding:20px 18px}
  .discord-art{min-height:420px}
  .scene-metin .scene-grade{background:linear-gradient(180deg,#0c1020 0%,rgba(12,16,32,.78) 18%,rgba(12,16,32,.88) 100%)}
  .closing.scene{padding:110px 0 120px}
  .art-frame figcaption{font-size:14px;left:16px;right:16px;bottom:12px}
}

/* the store "coming soon" banner on the home page (12 October 2026) */
.soon-banner{display:grid;grid-template-columns:auto minmax(0,1fr);gap:40px;align-items:center;padding:44px 48px;border-radius:20px;
  border:1px solid var(--line-strong);background:radial-gradient(90% 140% at 0% 50%,rgba(228,194,122,.16),rgba(228,194,122,0) 60%),linear-gradient(135deg,#1a1f3d,#11162e);
  box-shadow:0 40px 90px -45px rgba(0,0,0,.9),0 0 70px -30px rgba(228,194,122,.45)}
.soon-emblem{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;color:var(--gold);
  background:radial-gradient(circle,rgba(228,194,122,.22),rgba(228,194,122,0) 70%);filter:drop-shadow(0 0 18px rgba(228,194,122,.45))}
.soon-emblem svg{width:104px;height:104px}
.soon-copy h2{margin-bottom:14px}
.soon-copy .section-lead{margin-bottom:24px}
.soon-actions{display:flex;flex-wrap:wrap;gap:12px}
@media(max-width:720px){.soon-banner{grid-template-columns:1fr;gap:18px;padding:30px 22px;text-align:center}.soon-emblem{margin:0 auto;width:120px;height:120px}.soon-emblem svg{width:84px;height:84px}.soon-actions{justify-content:center}}
