/* ============================================================
   Editorial pages — carries the homepage's ivory art direction
   (warm paper, ink, antique bronze, hairline rules) across the
   primary-nav pages. Base ivory tokens come from refinements.css;
   reusable unscoped pieces (concierge links, artist arrow, date
   stamp) come from editorial.css.
   ============================================================ */

.editorial-page {
    --accent: #82613b; --gold: #82613b; --gold-light: #82613b; --gold-dark: #674820; --premium: #82613b;
    --gradient-gold: linear-gradient(120deg, #25272b, #383a3f);
    --gradient-bg: none;
    --success: #3f7d58; --warning: #a8692a; --danger: #a8434a; --info: #3f6a9a;
    --shadow-sm: 0 6px 18px rgba(37,39,43,.06);
    --shadow: 0 18px 40px rgba(37,39,43,.08);
    --shadow-lg: 0 30px 60px rgba(37,39,43,.12);
    --rule: #d8d1c4;
    --rule-soft: #e6e0d4;
    --paper-alt: #eee9e0;
    --ink: #25282c;
    --type-meet_greet: #9a7130; --type-in_person: #3f7d58; --type-performance: #9b4a7e; --type-signing: #2f7d93; --type-virtual: #6f5a86;
    background: #f7f4ed;
}
/* Dark "ink" band — the homepage's membership / CTA treatment. */
.editorial-page .ink, .editorial-page .cta-banner {
    --cream: #faf5e9; --text: #faf5e9; --text-soft: #d5d2cb; --text-muted: #c6c3bc;
    --gold: #dcc49a; --gold-light: #dcc49a; --accent: #dcc49a; --border: #3d3f44; --rule: #3d3f44;
    background: radial-gradient(ellipse at 20% 50%, #39362f, transparent 55%), var(--ink);
    color: #faf5e9;
}
.editorial-page .ink .btn-primary, .editorial-page .cta-banner .btn-primary { background: #dcc49a; color: #25282c; }
.editorial-page .ink .btn-primary:hover, .editorial-page .cta-banner .btn-primary:hover { background: #f0dfbe; color: #25282c; }
.editorial-page .ink .btn-secondary, .editorial-page .cta-banner .btn-secondary { color: #faf5e9; border-color: #777064; }

/* ---- Chrome parity with the homepage ---- */
.editorial-page .hero-header { background: rgba(247,244,237,.96); }
.editorial-page .brand-name { font-size: 1.25rem; }
.editorial-page .nav-links a { font-size: .79rem; background: none; }
.editorial-page .nav-links a::after { content: ''; position: absolute; height: 1px; left: 14px; right: 14px; bottom: 5px; background: #95713f; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.editorial-page .nav-links a:hover::after, .editorial-page .nav-links a[aria-current]::after { transform: scaleX(1); }
.editorial-page .btn-primary { background: linear-gradient(120deg, #25272b, #383a3f); box-shadow: 0 6px 16px rgba(37,39,43,.1); }
.editorial-page .btn-primary:hover { background: #82613b; }
.editorial-page .btn-secondary:hover { background: #eee9df; transform: translateY(-2px); }
.editorial-page .btn-ghost { color: #25272b; text-decoration: underline; text-underline-offset: 4px; }
.editorial-page .btn-ghost:hover { color: #82613b; }
.editorial-page .btn-small { min-height: 40px; padding: 9px 18px; font-size: .8rem; }
.editorial-page .site-footer { --premium: #dcc49a; --gold: #dcc49a; --gold-light: #dcc49a; margin-top: 0; }

/* ---- Shared type & surfaces ---- */
.editorial-page .section-panel { padding: clamp(48px, 6vw, 88px) 0; }
.editorial-page .section-panel h2 { font-size: clamp(2rem, 3.2vw, 3rem); line-height: 1.1; letter-spacing: -.035em; }
.editorial-page h1 em, .editorial-page h2 em { color: var(--gold); font-weight: 500; }
.editorial-page .eyebrow { font-size: .64rem; letter-spacing: .15em; }
.editorial-page .section-panel p.lead, .editorial-page .lead { color: #666760; font-size: 1rem; line-height: 1.75; }
.editorial-page .section-head { align-items: flex-end; margin-bottom: 40px; }
.editorial-page .card { border-radius: 4px; backdrop-filter: none; -webkit-backdrop-filter: none; }
.editorial-page .card::before { display: none; }
.editorial-page .card:hover { transform: translateY(-3px); border-color: #cfc7b8; box-shadow: 0 16px 36px rgba(37,39,43,.08); }
.editorial-page .alert { border-radius: 4px; }
.editorial-page .note-box { border-radius: 4px; background: #fffdf8; border-color: var(--rule); }
.editorial-page .cta-banner { border-radius: 4px; border: 0; box-shadow: none; padding: clamp(32px, 5vw, 56px); }
.editorial-page .cta-banner::before { background: radial-gradient(circle at 100% 0%, rgba(220,196,154,.12), transparent 50%); }
.editorial-page .cta-banner h2 { color: #faf5e9; }
.editorial-page .badge { border-radius: 3px; font-size: .62rem; letter-spacing: .1em; }
.editorial-page .badge-secondary { background: #ebe6dc; color: #50514f; border-color: #ded9ce; }
.editorial-page .badge-success { background: #e3eee5; color: #2f6b47; border-color: #c4dccb; }
.editorial-page .badge-warning { background: #f5ead9; color: #85531f; border-color: #e5cfae; }
.editorial-page .badge-danger { background: #f5e1e1; color: #8a3439; border-color: #e6c3c4; }
.editorial-page input[type='text'], .editorial-page input[type='number'], .editorial-page input[type='email'], .editorial-page select, .editorial-page textarea {
    background: #fffdf8; border-color: #cfc7b8; border-radius: 6px; color: #25272b;
}
.editorial-page input:focus, .editorial-page select:focus, .editorial-page textarea:focus { background: #fff; border-color: #82613b; box-shadow: 0 0 0 4px rgba(130,97,59,.12); }
.editorial-page .verified-badge path:last-child { stroke: #fffdf8; }

/* ============================================================
   MASTHEAD — the page-level hero shared by every nav page
   ============================================================ */
.page-masthead { padding: clamp(32px, 5vw, 64px) 0 0; background: radial-gradient(ellipse at 5% 15%, rgba(218,196,155,.17), transparent 50%); }
.masthead-grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(250px, .75fr); gap: clamp(32px, 6vw, 96px); align-items: end; padding-bottom: clamp(28px, 4vw, 44px); border-bottom: 1px solid var(--rule); }
.masthead-copy .eyebrow { margin-bottom: 22px; }
.masthead-copy h1 { font-size: clamp(2.7rem, 4.6vw, 4.4rem); line-height: 1.05; letter-spacing: -.05em; margin: 0 0 22px; max-width: 15ch; }
.masthead-copy > p { max-width: 520px; font-size: 1rem; line-height: 1.75; color: #666760; margin: 0; }
.masthead-copy .btn-group { margin-top: 28px; gap: 12px; }
.masthead-aside { min-width: 0; }
.masthead-topline { display: flex; justify-content: space-between; gap: 16px; font-size: .56rem; letter-spacing: .13em; text-transform: uppercase; color: #66645c; padding-bottom: 12px; }
.masthead-topline > span:first-child { color: #25272b; font-weight: 600; }
.masthead-meta { margin: 0; border-top: 1px solid #25272b; }
.masthead-meta > div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 13px 0; border-bottom: 1px solid var(--rule); }
.masthead-meta dt { font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: #66645c; }
.masthead-meta dd { margin: 0; font: italic 500 1.45rem/1 'Playfair Display', serif; color: #25272b; letter-spacing: -.02em; text-align: right; font-variant-numeric: tabular-nums; }
.masthead-meta dd small { font: 400 .72rem 'Inter', sans-serif; font-style: normal; color: #66645c; letter-spacing: 0; }

/* Underline tab row (sub-navigation, filters, leaderboard boards) */
.ed-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 28px; padding: 16px 0; border-bottom: 1px solid var(--rule); font-size: .8rem; }
.ed-tabs > span { color: #66645c; font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; }
.ed-tabs a { position: relative; padding: 6px 0; color: #66645c; font-weight: 500; }
.ed-tabs a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #25272b; transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.ed-tabs a:hover { color: #25272b; }
.ed-tabs a.is-active, .ed-tabs a.active { color: #25272b; font-weight: 600; }
.ed-tabs a.is-active::after, .ed-tabs a.active::after, .ed-tabs a:hover::after { transform: scaleX(1); }
.ed-tabs .ed-tabs-note { margin-left: auto; font-size: .74rem; letter-spacing: 0; text-transform: none; color: #66645c; }
.ed-tabs .ed-tabs-note a { color: #82613b; text-decoration: underline; text-underline-offset: 3px; padding: 0; }
.ed-tabs .ed-tabs-note a::after { display: none; }

/* Ruled step grid — the homepage's "How it works" treatment */
.ed-steps { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); border-top: 1px solid var(--rule); }
.ed-step { padding: 28px 26px 30px; }
.ed-step:first-child { padding-left: 0; }
.ed-step + .ed-step { border-left: 1px solid var(--rule); }
.ed-steps.wrap .ed-step { border-bottom: 1px solid var(--rule); }
.ed-steps.wrap .ed-step:nth-child(3n+1) { border-left: 0; padding-left: 0; }
.ed-step-num { display: block; font: italic 1.8rem/1 'Playfair Display', serif; color: var(--gold); letter-spacing: -.03em; margin-bottom: 16px; }
.ed-step-icon { color: var(--gold); margin-bottom: 18px; }
.ed-step h3 { font-size: 1.25rem; margin: 0 0 10px; }
.ed-step p { font-size: .84rem; line-height: 1.8; color: #666760; margin: 0; }

/* Ruled key/value list */
.ed-facts { list-style: none; margin: 0; padding: 0; border-top: 1px solid #25272b; }
.ed-facts li { display: flex; justify-content: space-between; align-items: baseline; gap: 24px; padding: 15px 0; border-bottom: 1px solid var(--rule); }
.ed-facts span:first-child { font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: #66645c; }
.ed-facts span:last-child { font: 500 1.05rem 'Playfair Display', serif; color: #25272b; text-align: right; }

/* Concierge contact list (classes from editorial.css) */
.editorial-page .concierge-section { background: #eae4d8; }
.editorial-page .concierge-links strong { color: #25272b; }

/* ============================================================
   ROSTER
   ============================================================ */
.ed-roster { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px 28px; }
.ed-artist { display: block; position: relative; color: inherit; }
.ed-artist .artist-media { aspect-ratio: 4/5; border-radius: 3px; overflow: hidden; background: #e9e3d7; }
.ed-artist .artist-media > .ed-artist-photo { position: absolute; inset: 0; background-size: cover; background-position: center 22%; transition: transform .65s cubic-bezier(.22,1,.36,1); }
.ed-artist .artist-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 60%, rgba(23,25,29,.28)); pointer-events: none; }
.ed-artist:hover .ed-artist-photo { transform: scale(1.035); }
.ed-artist .artist-badge { border-radius: 2px; font-size: .56rem; letter-spacing: .1em; background: rgba(37,39,43,.82) !important; color: #f5f2eb !important; z-index: 2; }
.ed-artist .artist-open { z-index: 2; }
.ed-artist .fav-heart { z-index: 3; }
.ed-artist-details { display: grid; grid-template-columns: auto 1fr; gap: 4px 16px; padding: 20px 0 18px; border-bottom: 1px solid var(--rule); }
.ed-artist-index { grid-row: span 3; font: italic 1rem/1.6 'Playfair Display', serif; color: var(--gold); font-variant-numeric: tabular-nums; }
.ed-artist-details h3 { display: inline-flex; align-items: center; gap: 8px; font-size: 1.45rem; margin: 0; }
.ed-artist-meta { font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: #66645c; margin: 0; }
.ed-artist-bio { font-size: .86rem; line-height: 1.7; color: #50514f; margin: 8px 0 0; }

/* ============================================================
   NEWS
   ============================================================ */
.news-lead { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(28px, 5vw, 64px); align-items: center; padding: clamp(32px, 4vw, 48px) 0; border-bottom: 1px solid var(--rule); color: inherit; }
.news-lead-media { aspect-ratio: 16/11; border-radius: 3px; background: #e9e3d7 center/cover no-repeat; box-shadow: 16px 16px 0 #e9e3d7; transition: transform .6s cubic-bezier(.22,1,.36,1); }
.news-lead:hover .news-lead-media { transform: translateY(-4px); }
.news-kicker { display: flex; gap: 10px; align-items: center; font-size: .62rem; letter-spacing: .15em; text-transform: uppercase; color: var(--gold); font-weight: 600; margin-bottom: 18px; }
.news-kicker i { font-style: normal; color: #b7afa0; }
.news-lead h2 { font-size: clamp(1.9rem, 3vw, 2.7rem); line-height: 1.12; letter-spacing: -.03em; margin: 0 0 16px; }
.news-lead p { color: #50514f; line-height: 1.75; margin: 0 0 24px; }
.news-byline { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; font-size: .74rem; color: #66645c; }
.news-read { margin-left: auto; color: #25272b; font-weight: 600; display: inline-flex; gap: 8px; }
.news-read b { font-weight: 400; transition: transform .2s; }
.news-lead:hover .news-read b, .news-item:hover .news-read b { transform: translate(3px,-3px); }
.news-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px 28px; padding-top: clamp(32px, 4vw, 48px); }
.news-item { position: relative; display: flex; flex-direction: column; color: inherit; padding-bottom: 20px; border-bottom: 1px solid var(--rule); }
.news-item-media { aspect-ratio: 16/10; border-radius: 3px; background: #e9e3d7 center/cover no-repeat; margin-bottom: 20px; overflow: hidden; }
.news-item h3 { font-size: 1.25rem; line-height: 1.3; margin: 0 0 10px; transition: color .2s; }
.news-item:hover h3 { color: #82613b; }
.news-item p { font-size: .86rem; line-height: 1.7; color: #666760; margin: 0 0 18px; flex: 1; }
.news-item .news-kicker { margin-bottom: 12px; }

/* ============================================================
   ABOUT
   ============================================================ */
.about-mission { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(36px, 6vw, 96px); align-items: start; }
.about-mission p { font-size: 1.02rem; line-height: 1.85; color: #50514f; }
.about-mission .dropcap::first-letter { float: left; font: 500 4.2rem/.82 'Playfair Display', serif; color: #82613b; padding: 8px 12px 0 0; }
.about-philosophy { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 6vw, 96px); align-items: center; }
.ed-figures { list-style: none; margin: 0; padding: 0; border-top: 1px solid #25272b; }
.ed-figures li { display: grid; grid-template-columns: 96px 1fr; gap: 20px; align-items: baseline; padding: 20px 0; border-bottom: 1px solid var(--rule); }
.ed-figures b { font: italic 500 2.4rem/1 'Playfair Display', serif; color: var(--gold); letter-spacing: -.03em; }
.ed-figures strong { display: block; font-weight: 600; color: #25272b; font-size: .95rem; }
.ed-figures p { margin: 4px 0 0; font-size: .84rem; color: #666760; }
.about-founding { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 6vw, 90px); align-items: center; }
.about-founding h2 { color: #faf5e9; }
.about-founding p { color: #c6c3bc; line-height: 1.85; max-width: 470px; }
.about-portrait { aspect-ratio: 4/5; max-height: 560px; border-radius: 3px; background: #35302b center 20%/cover no-repeat; box-shadow: 16px 16px 0 rgba(220,196,154,.12); display: grid; place-items: center; font: italic 5rem 'Playfair Display', serif; color: #dcc49a; }
.about-note { display: grid; grid-template-columns: auto 1fr; gap: 18px; margin-top: 40px; padding: 22px 0; border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule); font-size: .88rem; color: #50514f; }
.about-note strong { color: #25272b; }
.about-note > span { font: italic 1.6rem/1 'Playfair Display', serif; color: var(--gold); }

/* ============================================================
   FAN CARD / MEMBERSHIP  (membership.css is shared with dark
   account pages, so overrides stay scoped here)
   ============================================================ */
.editorial-page .mcard-rail { gap: 48px 28px; }
.editorial-page .mcard { box-shadow: 0 24px 44px -24px rgba(37,39,43,.45), inset 0 1px 0 rgba(255,255,255,.18); }
.editorial-page .mcard-cell:hover .mcard { box-shadow: 0 40px 70px -30px rgba(37,39,43,.5), inset 0 1px 0 rgba(255,255,255,.25); }
.editorial-page .mcard-tier { color: inherit; }
.editorial-page .mcard-ribbon { background: #25272b; color: #f5f2eb; box-shadow: none; border-radius: 2px; font-size: .58rem; }
.editorial-page .mcard-info { padding: 22px 0 0; }
.editorial-page .mcard-price { padding-bottom: 14px; border-bottom: 1px solid var(--rule); }
.editorial-page .mcard-price .amt { color: #25272b; }
.editorial-page .mcard-unlock .lab { color: var(--gold); font-size: .6rem; }
.editorial-page .mcard-unlock li { color: #50514f; }
.editorial-page .mcard-unlock li b { color: #25272b; font-weight: 500; }
.editorial-page .mcard-unlock li .plus { color: var(--gold); font-weight: 400; }
.editorial-page .mcard-cta .btn { border-radius: 8px; }
.editorial-page .belong { border-radius: 4px; border-color: var(--rule); background: #fffdf8; margin-top: 24px; }
.editorial-page .compare-wrap { border-radius: 4px; border-color: var(--rule); background: #fffdf8; backdrop-filter: none; }
.editorial-page .ctable th, .editorial-page .ctable td { border-bottom-color: #ece6da; }
.editorial-page .ctable thead th { background: #fffdf8; border-bottom: 1px solid #25272b; }
.editorial-page .ctable .feat { background: #fffdf8; color: #50514f; }
.editorial-page .cth-name { color: #25272b; }
.editorial-page .cth-price { color: #82613b; }
.editorial-page .ctable thead th.col-popular { background: #f4eee3; }
.editorial-page .ctable td.col-popular { background: rgba(130,97,59,.05); }
.editorial-page .col-popular-tag { color: #82613b; }
.editorial-page .crow-group td { background: #f4f0e8; color: #82613b; }
.editorial-page .cyes { color: #3f7d58; }
.editorial-page .cno { color: #cfc7b8; }
.editorial-page .cval { color: #25272b; }
.editorial-page .ctable tbody tr:hover td { background: #faf6ee; }
.editorial-page .ctable tbody tr:hover td.feat { background: #f6f1e7; }

/* ============================================================
   GAMES — Trivia + Spin  (games.css tokens re-pointed to paper)
   ============================================================ */
.editorial-page {
    --g-glass: #fffdf8;
    --g-glass-strong: #fffdf8;
    --g-hairline: #ded9ce;
    --g-glow-emerald: 0 16px 36px rgba(37,39,43,.08);
    --g-glow-gold: 0 16px 36px rgba(130,97,59,.14);
}
.editorial-page .quiz-card, .editorial-page .wheel-panel, .editorial-page .leaderboard, .editorial-page .season-prize,
.editorial-page .badge-tile, .editorial-page .unlock-card, .editorial-page .artist-ctx, .editorial-page .mg-pass, .editorial-page .challenge-banner {
    backdrop-filter: none; -webkit-backdrop-filter: none; box-shadow: none; border-radius: 4px;
}
.editorial-page .quiz-card { border-color: var(--rule); }
.editorial-page .quiz-progress-track { background: #ebe6dc; box-shadow: none; height: 3px; }
.editorial-page .quiz-progress-fill { background: #25272b; box-shadow: none; }
.editorial-page .quiz-q-num { color: #82613b; }
.editorial-page .quiz-difficulty { background: transparent; border-radius: 2px; }
.editorial-page .quiz-difficulty.easy { color: #3f7d58; border-color: #b9d4c1; }
.editorial-page .quiz-difficulty.medium { color: #a8692a; border-color: #e5cfae; }
.editorial-page .quiz-difficulty.hard { color: #a8434a; border-color: #e6c3c4; }
.editorial-page .quiz-opt { background: #fffdf8; border-color: #ded9ce; border-radius: 6px; color: #25272b; }
.editorial-page .quiz-opt:hover:not(:disabled) { border-color: #25272b; color: #25272b; box-shadow: 0 10px 24px rgba(37,39,43,.07); }
.editorial-page .quiz-opt .letter { border-radius: 50%; background: transparent; color: #82613b; border-color: #cfc7b8; font: italic 600 .95rem 'Playfair Display', serif; }
.editorial-page .quiz-opt:hover:not(:disabled) .letter { background: #25272b; color: #fffdf8; border-color: #25272b; }
.editorial-page .quiz-opt.correct { background: #e9f2eb; border-color: #3f7d58; color: #24533a; }
.editorial-page .quiz-opt.correct .letter { background: #3f7d58; color: #fff; }
.editorial-page .quiz-opt.wrong { background: #f7e7e7; border-color: #a8434a; color: #7a2c31; }
.editorial-page .quiz-opt.wrong .letter { background: #a8434a; color: #fff; }
.editorial-page .quiz-score-ring { background: conic-gradient(from -90deg, #82613b var(--pct, 0%), #ebe6dc 0); filter: none; }
.editorial-page .quiz-score-ring::before { background: #fffdf8; }
.editorial-page .reward-pill { background: #f4eee3; border-color: #e3d7c2; color: #82613b; border-radius: 3px; }
.editorial-page .reward-pill b { color: #25272b; }

.editorial-page .lb-tabs { background: none; border: 0; border-radius: 0; padding: 0; gap: 4px 24px; border-bottom: 1px solid var(--rule); width: 100%; }
.editorial-page .lb-tabs button { padding: 10px 0; border-radius: 0; color: #66645c; position: relative; font-weight: 500; }
.editorial-page .lb-tabs button.active { background: none; color: #25272b; font-weight: 600; box-shadow: inset 0 -1px 0 #25272b; }
.editorial-page .lb-tabs button:not(.active):hover { color: #25272b; }
.editorial-page .leaderboard { border: 0; border-top: 1px solid #25272b; border-radius: 0; background: transparent; }
.editorial-page .lb-row { border-bottom-color: var(--rule); padding: 16px 4px; }
.editorial-page .lb-row:last-child { border-bottom: 1px solid var(--rule); }
.editorial-page .lb-row:hover { background: #f1ece3; }
.editorial-page .lb-row.me { background: #f4eee3; box-shadow: inset 2px 0 0 #82613b; }
.editorial-page .lb-rank { font-style: italic; }
.editorial-page .lb-row.top .lb-rank, .editorial-page .lb-pts { color: #82613b; }
.editorial-page .lb-avatar { background: #25272b; color: #f5f2eb; border: 0; box-shadow: none; }
.editorial-page .lb-row.top .lb-avatar { background: #82613b; color: #fffdf8; box-shadow: none; }
.editorial-page .season-prize { border-color: var(--rule); }
.editorial-page .season-prize.gold { background: #25282c; border-color: #25282c; --cream: #faf5e9; --text-muted: #c6c3bc; --gold-light: #dcc49a; }
.editorial-page .season-prize:hover, .editorial-page .season-prize.gold:hover { box-shadow: 0 16px 36px rgba(37,39,43,.1); }
.editorial-page .badge-tile.earned { background: #f4eee3; border-color: #e3d7c2; }
.editorial-page .badge-tile .bi { filter: grayscale(1) opacity(.45); }
.editorial-page .badge-tile.earned .bi { filter: none; }
.editorial-page .unlock-card .ui { background: #f4f0e8; border-color: var(--rule); border-radius: 50%; }
.editorial-page .unlock-card.unlocked { background: #f4eee3; border-color: #e3d7c2; }
.editorial-page .unlock-card.unlocked .ui { background: #fffdf8; border-color: #e3d7c2; }
.editorial-page .unlock-ring { background: conic-gradient(#82613b calc(var(--p,0) * 1%), #ebe6dc 0); }
.editorial-page .unlock-ring span { background: #fffdf8; color: #50514f; }
.editorial-page .unlock-foot { border-top-color: var(--rule); }
.editorial-page .artist-ctx { border-color: var(--rule); }
.editorial-page .artist-ctx:hover { border-color: #cfc7b8; box-shadow: 0 16px 36px rgba(37,39,43,.08); }
.editorial-page .artist-ctx-photo { background-color: #e9e3d7; }
.editorial-page .artist-ctx-photo::after { background: linear-gradient(180deg, transparent 60%, rgba(23,25,29,.25)); }
.editorial-page .artist-ctx-photo .ver { background: rgba(255,253,248,.92); color: #82613b; border-color: #e3d7c2; border-radius: 2px; }
.editorial-page .challenge-banner { background: #f4eee3; border-color: #e3d7c2; }
.editorial-page .mg-pass { background: #fffdf8; border: 1px dashed #b89a6a; }
.editorial-page .mg-pass .code { color: #82613b; }
.editorial-page .game-toast { background: #25282c; border: 0; color: #faf5e9; border-radius: 4px; box-shadow: 0 20px 40px -18px rgba(37,39,43,.6); }
.editorial-page .wheel-panel { border-color: var(--rule); }
.editorial-page .wheel-wrap::before { opacity: .22; }
.editorial-page #wheelCanvas { box-shadow: 0 34px 70px -34px rgba(37,39,43,.55), inset 0 0 0 9px rgba(37,39,43,.85), inset 0 0 0 12px rgba(220,196,154,.6); }
.editorial-page .wheel-pointer { border-top-color: #25272b; filter: drop-shadow(0 4px 6px rgba(37,39,43,.35)); }
.editorial-page .spin-btn { background: linear-gradient(120deg, #25272b, #383a3f); color: #fffdf8; border-radius: 8px; box-shadow: 0 10px 24px -12px rgba(37,39,43,.6); }
.editorial-page .spin-btn:hover:not(:disabled) { background: #82613b; filter: none; }
.editorial-page .prize-legend .sw { border-radius: 50%; box-shadow: none; }
.editorial-page .prize-legend li { padding-bottom: 9px; border-bottom: 1px solid #ece6da; }
.editorial-page .fair-box { background: #f4f0e8; border-color: var(--rule); border-radius: 4px; }
.editorial-page .fair-box summary { color: #82613b; }
.editorial-page .fair-body code { background: #fffdf8; color: #50514f; border: 1px solid var(--rule); }
.editorial-page .prize-modal { background: rgba(37,39,43,.55); }
.editorial-page .prize-modal-card { background: #fffdf8; border-color: var(--rule); border-radius: 6px; box-shadow: 0 40px 90px -30px rgba(37,39,43,.5); }
.editorial-page .prize-modal-card .pcode { background: #f4eee3; border-color: #b89a6a; color: #82613b; }
.reel-row { display: flex; gap: 18px; flex-wrap: wrap; justify-content: center; }
.reel { text-align: center; }
.reel > span { display: block; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: #66645c; margin-bottom: 8px; }
.reel > div { min-width: 200px; padding: 18px 24px; border: 1px solid var(--rule); border-top: 1px solid #25272b; background: #f7f4ed; font: italic 500 1.8rem 'Playfair Display', serif; color: #25272b; }
.reel.accent > div { color: #82613b; }
.redeem-input { flex: 1; min-width: 160px; }
.game-section + .game-section { margin-top: clamp(56px, 7vw, 88px); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1000px) {
    .ed-roster, .news-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ed-steps { --cols: 2 !important; }
    .ed-steps .ed-step { border-left: 0 !important; padding-left: 0; border-bottom: 1px solid var(--rule); }
    .ed-steps .ed-step:nth-child(even) { border-left: 1px solid var(--rule) !important; padding-left: 26px; }
}
@media (max-width: 760px) {
    .masthead-grid, .news-lead, .about-mission, .about-philosophy, .about-founding { grid-template-columns: minmax(0, 1fr); }
    .masthead-copy h1 { font-size: clamp(2.4rem, 9vw, 3.4rem); max-width: none; }
    .masthead-grid { align-items: start; gap: 28px; }
    .ed-roster, .news-list { grid-template-columns: minmax(0, 1fr); gap: 40px; }
    .ed-steps { --cols: 1 !important; }
    .ed-steps .ed-step, .ed-steps .ed-step:nth-child(even) { border-left: 0 !important; padding: 22px 0; }
    .ed-tabs .ed-tabs-note { margin-left: 0; width: 100%; }
    .news-lead-media { box-shadow: 8px 8px 0 #e9e3d7; }
    .reel > div { min-width: 0; }
    .reel-row .reel { flex: 1; }
    .ed-figures li { grid-template-columns: 72px 1fr; }
}
/* Keep the wheel's blurred halo and the fixed toast inside narrow viewports. */
.editorial-page .wheel-stage { overflow-x: clip; }
.editorial-page .game-toast { max-width: calc(100vw - 32px); }

/* ============================================================
   MORE GAMES (games.php) — arcade.css is shared with wordhub.php,
   so the paper treatment stays scoped here.
   ============================================================ */
.editorial-page .arcade-catalog { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0; border-bottom: 1px solid var(--rule); }
.editorial-page .arcade-catalog a { gap: 10px; padding: 24px 26px; background: none; border: 0; border-radius: 0; transition: background .2s; }
.editorial-page .arcade-catalog a:first-child { padding-left: 0; }
.editorial-page .arcade-catalog a + a { border-left: 1px solid var(--rule); }
.editorial-page .arcade-catalog a:hover { background: #eee9df; transform: none; }
.editorial-page .arcade-catalog span { font-size: .57rem; color: var(--gold); }
.editorial-page .arcade-catalog strong { font-size: .95rem; color: #25272b; }
.editorial-page .arcade-catalog small { font-size: .72rem; color: #66645c; }
.editorial-page .wordhub-banner { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 6px 32px; margin-top: 32px; padding: clamp(24px, 3vw, 32px) clamp(24px, 4vw, 40px); border-radius: 4px; color: #faf5e9; background: radial-gradient(ellipse at 20% 50%, #39362f, transparent 55%), #25282c; transition: transform .2s; }
.editorial-page .wordhub-banner:hover { transform: translateY(-3px); }
.editorial-page .wordhub-banner .eyebrow { grid-column: 1 / -1; color: #dcc49a; margin-bottom: 6px; --gold: #dcc49a; }
.editorial-page .wordhub-banner strong { font: 500 clamp(1.8rem, 3vw, 2.4rem)/1 'Playfair Display', serif; letter-spacing: -.03em; }
.editorial-page .wordhub-banner > span:last-child { color: #c6c3bc; font-size: .88rem; max-width: 520px; }
.editorial-page .arcade-disclaimer { margin: 18px 0 0; font-size: .74rem; color: #66645c; }
.editorial-page .arcade-layout { gap: clamp(36px, 6vw, 96px); }
.editorial-page .arcade-layout h2 { margin-top: 0; }
.editorial-page .arcade-layout > div > p { color: #50514f; line-height: 1.75; }
.editorial-page .arcade-layout .btn { margin-top: 12px; }
.editorial-page .arcade-panel { background: #fffdf8; border: 1px solid var(--rule); border-top: 1px solid #25272b; border-radius: 0; padding: clamp(20px, 3vw, 32px); }
.editorial-page .arcade-stats { padding-bottom: 18px; border-bottom-color: var(--rule); font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: #66645c; }
.editorial-page .arcade-stats strong { margin-top: 6px; font: italic 500 1.5rem/1 'Playfair Display', serif; letter-spacing: -.02em; text-transform: none; color: #25272b; }
.editorial-page .memory-card { border-radius: 4px; border: 1px solid #25282c; background: radial-gradient(ellipse at 30% 20%, #3a3731, #25282c 70%); color: #dcc49a; font: italic 500 1.6rem 'Playfair Display', serif; }
.editorial-page .memory-card:not(:disabled):hover { border-color: #82613b; box-shadow: 0 10px 22px -12px rgba(37,39,43,.6); }
.editorial-page .memory-card.is-open { background: #f4eee3; border-color: #cfc7b8; color: #25272b; font: 600 .72rem 'Inter', sans-serif; }
.editorial-page .memory-card.is-matched { background: #e9f2eb; border-color: #b9d4c1; color: #24533a; font: 600 .72rem 'Inter', sans-serif; }
.editorial-page .arcade-status { color: #50514f; padding-top: 16px; border-top: 1px solid var(--rule); }
.editorial-page .scramble-letters { font: italic 500 clamp(1.8rem, 3.4vw, 2.8rem)/1.2 'Playfair Display', serif; letter-spacing: .18em; color: #82613b; }
.editorial-page #scramble-hint { color: #66645c; font-size: .86rem; }
@media (max-width: 900px) {
    .editorial-page .arcade-catalog { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .editorial-page .arcade-catalog a:nth-child(3) { border-left: 0; padding-left: 0; }
    .editorial-page .arcade-catalog a:nth-child(n+3) { border-top: 1px solid var(--rule); }
    .editorial-page .wordhub-banner { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
    .editorial-page .arcade-catalog { grid-template-columns: minmax(0, 1fr); }
    .editorial-page .arcade-catalog a, .editorial-page .arcade-catalog a:first-child { padding: 16px 0; border-left: 0; }
    .editorial-page .arcade-catalog a + a { border-top: 1px solid var(--rule); }
    .editorial-page .memory-card.is-open, .editorial-page .memory-card.is-matched { font-size: .58rem; }
}
.editorial-page .arcade-panel > .arcade-status { max-width: none; }

/* ============================================================
   TRIVIA — simplified layout: quiz, then leaderboard | progress
   ============================================================ */
.quiz-start { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 24px 48px; padding: clamp(8px, 2vw, 20px) 0; }
.quiz-start .eyebrow { grid-column: 1 / -1; margin-bottom: 0; }
.quiz-start h2 { font-size: clamp(1.9rem, 3.4vw, 2.8rem); line-height: 1.08; letter-spacing: -.035em; margin: 0; }
.quiz-start p { grid-column: 1; margin: 0; color: #50514f; }
.quiz-start .btn-group { grid-column: 2; grid-row: 2 / span 2; margin: 0; flex-direction: column; align-items: stretch; }
.quiz-sub { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; font-size: .64rem; letter-spacing: .15em; text-transform: uppercase; color: #82613b; }
.quiz-timer { font: italic 500 1.3rem 'Playfair Display', serif; letter-spacing: 0; text-transform: none; color: #25272b; }
.quiz-timer-track { margin-bottom: 22px; height: 2px !important; }
.editorial-page #qTimerFill { background: #82613b; }
.quiz-running { margin: 22px 0 0; text-align: right; font-size: .82rem; color: #66645c; }
.quiz-running b { color: #25272b; }

.trivia-split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(40px, 6vw, 88px); align-items: start; }
.trivia-split h2 { margin-bottom: 24px; }
.editorial-page .trivia-split .lb-tabs { margin-bottom: 0; }
.lb-note { margin: 16px 0 0; font-size: .78rem; color: #66645c; }

/* Section titles in the split stay one line so the quiz remains the hero */
.trivia-split .split-title { font-size: clamp(1.6rem, 2.4vw, 2.1rem); margin-bottom: 22px; }

/* Leaderboard: podium for the top three, slim ranked rows after */
.lb-podium { display: grid; grid-template-columns: 1fr 1.12fr 1fr; align-items: end; gap: 10px; padding: 26px 0 0; }
.lb-podium-step { display: grid; justify-items: center; gap: 6px; padding: 18px 10px 16px; text-align: center; background: #fffdf8; border: 1px solid var(--rule); border-top: 2px solid #b89a6a; min-width: 0; }
.lb-podium-step.is-1 { order: 2; padding-top: 26px; border-top-color: #82613b; box-shadow: 0 16px 30px -22px rgba(37,39,43,.45); }
.lb-podium-step.is-2 { order: 1; }
.lb-podium-step.is-3 { order: 3; }
.lb-podium-step.me { background: #f4eee3; }
.lb-place { font: italic 500 1rem 'Playfair Display', serif; color: #82613b; }
.lb-podium-step .lb-avatar { width: 52px; height: 52px; }
.lb-podium-step.is-1 .lb-avatar { width: 62px; height: 62px; box-shadow: 0 0 0 3px #fffdf8, 0 0 0 4px #b89a6a; }
.lb-podium-step strong { font-size: .9rem; color: #25272b; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lb-podium-step .lb-score { font: italic 500 1.35rem/1 'Playfair Display', serif; color: #25272b; font-variant-numeric: tabular-nums; }
.lb-podium-step .lb-score small { font: 500 .56rem 'Inter', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #66645c; margin-left: 4px; }
.editorial-page .leaderboard.has-podium { border-top: 0; }
.editorial-page .lb-row { grid-template-columns: 30px 36px minmax(0, 1fr) auto; gap: 14px; padding: 11px 2px; }
.editorial-page .lb-row .lb-rank { font: italic 500 1rem 'Playfair Display', serif; color: #8d877c; text-align: left; font-variant-numeric: tabular-nums; }
.editorial-page .lb-row .lb-avatar { width: 36px; height: 36px; font-size: .72rem; }
.editorial-page .lb-row .lb-name { font-size: .9rem; font-weight: 600; }
.editorial-page .lb-row .lb-name small { font-size: .7rem; }
.editorial-page .lb-badges { gap: 2px; margin-left: 6px; opacity: .75; }
.editorial-page .lb-badges span { font-size: .78rem; }
.editorial-page .lb-row .lb-pts { font-size: 1.05rem; }
.editorial-page .lb-row .lb-pts span { display: inline; margin-left: 4px; font-size: .56rem; }
.lb-rows-head { margin-top: 18px; border-top: 1px solid #25272b; }

/* Next unlock summary */
.next-unlock { padding: 18px 20px; margin-bottom: 8px; background: #fffdf8; border: 1px solid var(--rule); border-left: 2px solid #82613b; }
.next-unlock span { display: block; font-size: .58rem; letter-spacing: .15em; text-transform: uppercase; color: #82613b; }
.next-unlock strong { display: block; margin: 6px 0 2px; font: 500 1.15rem 'Playfair Display', serif; color: #25272b; }
.next-unlock p { margin: 0 0 12px; font-size: .78rem; color: #66645c; }
.next-unlock .ladder-bar { height: 3px; }
.next-unlock:empty { display: none; }

/* Milestone timeline (replaces the unlock card grid) */
.ladder { list-style: none; margin: 0; padding: 6px 0 0; position: relative; }
.ladder-step { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 18px; align-items: baseline; padding: 16px 0 16px 34px; border-bottom: 1px solid var(--rule); }
.ladder-step::before { content: ''; position: absolute; left: 7px; top: 0; bottom: 0; width: 1px; background: var(--rule); }
.ladder-step:first-child::before { top: 24px; }
.ladder-step:last-child::before { bottom: auto; height: 24px; }
.ladder-step::after { content: ''; position: absolute; left: 1px; top: 19px; width: 13px; height: 13px; border-radius: 50%; background: #f7f4ed; border: 1px solid #cfc7b8; }
.ladder-step.is-next::after { border: 2px solid #82613b; background: #fffdf8; box-shadow: 0 0 0 4px rgba(130,97,59,.12); }
.ladder-step.is-unlocked::after { background: #82613b; border-color: #82613b; }
.ladder-step.is-unlocked::before { background: #b89a6a; }
.ladder-body strong { display: block; font: 500 1.02rem 'Playfair Display', serif; color: #25272b; }
.ladder-body p { margin: 3px 0 0; font-size: .78rem; line-height: 1.55; color: #66645c; }
.ladder-pts { font: italic 500 1.2rem/1 'Playfair Display', serif; color: #25272b; letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; text-align: right; }
.ladder-pts small { font: 500 .54rem 'Inter', sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #66645c; margin-left: 3px; }
.ladder-state { grid-column: 2; font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; color: #66645c; text-align: right; font-variant-numeric: tabular-nums; }
.ladder-step:not(.is-unlocked):not(.is-next) .ladder-body strong { color: #50514f; }
.ladder-step.is-unlocked .ladder-pts { color: #82613b; }
.ladder-step.is-unlocked a.ladder-state { color: #25272b; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.ladder-bar { height: 2px; background: #e6e0d4; }
.ladder-bar i { display: block; height: 100%; background: #82613b; transition: width .8s cubic-bezier(.22,1,.36,1); }

/* Badge medallions (replaces the badge tile grid) */
.medals-head { display: flex; justify-content: space-between; margin: 36px 0 14px; padding-bottom: 10px; border-bottom: 1px solid var(--rule); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: #66645c; }
.medals-head span { color: #25272b; font-variant-numeric: tabular-nums; }
.medals { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 18px 10px; }
.medal { display: grid; justify-items: center; gap: 8px; text-align: center; cursor: help; }
.medal-ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; border: 1px dashed #cfc7b8; font-size: 1.4rem; filter: grayscale(1); opacity: .4; }
.medal small { font-size: .66rem; line-height: 1.3; color: #8d877c; }
.medal.earned .medal-ic { border: 1px solid #b89a6a; background: #f4eee3; filter: none; opacity: 1; box-shadow: 0 0 0 4px #faf6ee; }
.medal.earned small { color: #25272b; font-weight: 600; }

@media (max-width: 900px) {
    .trivia-split { grid-template-columns: minmax(0, 1fr); }
    .quiz-start { grid-template-columns: minmax(0, 1fr); }
    .quiz-start .btn-group { grid-column: 1; grid-row: auto; flex-direction: row; flex-wrap: wrap; }
}
@media (max-width: 480px) {
    .lb-podium { gap: 6px; } .lb-podium-step { padding-left: 6px; padding-right: 6px; } .lb-podium-step .lb-score { font-size: 1.1rem; }
    .ladder-step { grid-template-columns: minmax(0, 1fr); } .ladder-pts, .ladder-state { grid-column: 1; text-align: left; }
}

/* ============================================================
   SPIN & WIN — realistic wheel (layers drawn by assets/js/wheel.js)
   ============================================================ */
.editorial-page .wheel-stage { gap: clamp(36px, 5vw, 72px); }
.editorial-page .wheel-wrap { position: relative; width: min(580px, 100%); aspect-ratio: 1; margin: 0 auto; isolation: isolate; }
.editorial-page .wheel-wrap::before { content: ''; position: absolute; inset: 10% 8% -4%; border-radius: 50%; background: radial-gradient(closest-side, rgba(37,39,43,.38), rgba(37,39,43,0)); filter: blur(16px); transform: translateY(5%); opacity: 1; animation: none; z-index: -1; }
.editorial-page .wheel-face, .editorial-page .wheel-rim, .editorial-page .wheel-fx { position: absolute; inset: 0; width: 100%; height: 100%; }
.editorial-page #wheelCanvas { z-index: 1; border-radius: 50%; box-shadow: none; transition: none; will-change: transform; cursor: pointer; }
.editorial-page .wheel-rim { z-index: 2; pointer-events: none; filter: drop-shadow(0 18px 26px rgba(37,39,43,.28)); }
.editorial-page .wheel-gloss { position: absolute; inset: 9.5%; z-index: 3; border-radius: 50%; pointer-events: none; background: radial-gradient(120% 80% at 30% 12%, rgba(255,255,255,.22), rgba(255,255,255,0) 46%), radial-gradient(90% 60% at 70% 95%, rgba(0,0,0,.10), rgba(0,0,0,0) 60%); }
.editorial-page .wheel-flapper { position: absolute; z-index: 4; top: -1.5%; left: 50%; width: 7.4%; transform: translateX(-50%); transform-origin: 50% 23%; filter: drop-shadow(0 4px 4px rgba(37,39,43,.45)); }
.editorial-page .wheel-flapper svg { display: block; width: 100%; height: auto; }
.editorial-page .wheel-pointer { display: none; }
.editorial-page .wheel-hub {
    position: absolute; z-index: 5; top: 50%; left: 50%; width: 20%; height: 20%; transform: translate(-50%, -50%);
    display: grid; place-content: center; gap: 2px; padding: 0; border-radius: 50%; cursor: pointer;
    border: 4px solid transparent;
    background: radial-gradient(circle at 35% 28%, #4a463e, #25282c 58%, #121315) padding-box, linear-gradient(135deg, #f3e2b4, #9c742f 45%, #e2c27f 70%, #6b4d22) border-box;
    box-shadow: 0 10px 22px rgba(18,19,21,.45), inset 0 2px 3px rgba(255,255,255,.12), inset 0 -6px 12px rgba(0,0,0,.45);
    transition: transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s;
    font-family: inherit;
}
.editorial-page .wheel-hub span { font: italic 600 clamp(1.4rem, 3.6vw, 2.2rem)/1 'Playfair Display', serif; color: #e3c88e; text-shadow: 0 1px 0 rgba(0,0,0,.5); }
.editorial-page .wheel-hub small { font-size: clamp(.48rem, 1.1vw, .6rem); letter-spacing: .26em; text-transform: uppercase; color: #f3ede2; padding-left: .26em; }
.editorial-page .wheel-hub:hover { transform: translate(-50%, -50%) scale(1.05); box-shadow: 0 14px 30px rgba(18,19,21,.5), 0 0 0 6px rgba(201,160,82,.18), inset 0 2px 3px rgba(255,255,255,.12), inset 0 -6px 12px rgba(0,0,0,.45); }
.editorial-page .wheel-hub:active { transform: translate(-50%, -50%) scale(.97); }
.editorial-page .wheel-hub:focus-visible { outline: 2px solid #82613b; outline-offset: 4px; }
.editorial-page .wheel-wrap.is-spinning .wheel-hub { cursor: default; transform: translate(-50%, -50%); }
.editorial-page .wheel-fx { z-index: 6; pointer-events: none; }
@media (prefers-reduced-motion: no-preference) {
    .editorial-page .wheel-wrap:not(.is-spinning) .wheel-hub span { animation: hub-breathe 3.2s ease-in-out infinite; }
}
@keyframes hub-breathe { 0%, 100% { opacity: .85; } 50% { opacity: 1; text-shadow: 0 0 14px rgba(227,200,142,.55); } }

/* ---- Spin result dialog ---- */
.editorial-page .prize-modal { background: rgba(23,25,29,.42); backdrop-filter: none; -webkit-backdrop-filter: none; padding: 20px; }
.editorial-page .prize-modal[hidden] { display: none; }
.editorial-page .prize-modal-card { position: relative; max-width: 440px; padding: clamp(32px, 5vw, 48px) clamp(24px, 4vw, 44px) clamp(28px, 4vw, 40px); border: 0; border-top: 2px solid #25272b; border-radius: 4px; background: #fffdf8; box-shadow: 0 40px 90px -30px rgba(23,25,29,.55); text-align: center; }
.pm-x { position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border: 0; border-radius: 50%; background: none; color: #66645c; font-size: 1.5rem; line-height: 1; cursor: pointer; }
.pm-x:hover { background: #f1ece3; color: #25272b; }
.pm-eyebrow { justify-content: center; margin: 22px 0 10px; }
.editorial-page .prize-modal-card h2 { margin: 0 0 12px; font-size: clamp(1.9rem, 4vw, 2.5rem); line-height: 1.08; letter-spacing: -.035em; }
.pm-desc { margin: 0 auto; max-width: 330px; color: #50514f; line-height: 1.65; }
.pm-odds { margin: 18px 0 0; padding-top: 14px; border-top: 1px solid var(--rule); font-size: .72rem; letter-spacing: .04em; color: #66645c; }
.pm-code { margin-top: 18px; display: grid; gap: 8px; justify-items: center; }
.pm-code > span { font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: #66645c; }
.pm-code small { font-size: .74rem; color: #66645c; }
.pm-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 22px; }
.pm-actions .btn { min-width: 150px; }

/* The medal: a struck coin whose finish follows the prize kind */
.pm-medal { width: 124px; height: 124px; margin: 0 auto; border-radius: 50%; padding: 7px; perspective: 600px;
    background: conic-gradient(from 210deg, #f3e2b4, #9c742f, #e2c27f, #6b4d22, #f3e2b4); box-shadow: 0 16px 30px -12px rgba(37,39,43,.5); }
.pm-medal-face { display: grid; place-content: center; width: 100%; height: 100%; border-radius: 50%; position: relative; overflow: hidden;
    background: radial-gradient(circle at 34% 28%, #b78c4c, #8a6639 55%, #5e4520); color: #fbf4e4; box-shadow: inset 0 0 0 2px rgba(255,240,200,.35), inset 0 -8px 16px rgba(0,0,0,.25); }
.pm-medal-face::before { content: ''; position: absolute; inset: 9px; border-radius: 50%; border: 1px dashed rgba(255,240,200,.45); }
.pm-medal-face::after { content: ''; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 35%, rgba(255,255,255,.35) 50%, transparent 65%); transform: translateX(-120%); }
.pm-medal b { position: relative; font: italic 600 1.9rem/1 'Playfair Display', serif; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.pm-medal small { position: relative; margin-top: 4px; font-size: .52rem; letter-spacing: .2em; text-transform: uppercase; opacity: .85; }
[data-kind="jackpot"] .pm-medal-face { background: radial-gradient(circle at 34% 28%, #fbe7ad, #d6ad5c 55%, #9c742f); color: #2a1d05; }
[data-kind="jackpot"] .pm-medal b { font-size: 1.6rem; }
[data-kind="tokens"] .pm-medal-face { background: radial-gradient(circle at 34% 28%, #4a463e, #25282c 60%, #121315); color: #e3c88e; }
[data-kind="meet_greet"] .pm-medal-face { background: radial-gradient(circle at 34% 28%, #8d3e4b, #6b2c36 60%, #45181f); color: #f1dca0; }
[data-kind="meet_greet"] .pm-medal b { font-size: 1.5rem; }
[data-kind="nothing"] .pm-medal { background: #e6e0d4; box-shadow: none; }
[data-kind="nothing"] .pm-medal-face { background: #f4f0e8; color: #8d877c; box-shadow: none; }
[data-kind="nothing"] .pm-medal-face::before { border-color: #cfc7b8; }
@media (prefers-reduced-motion: no-preference) {
    .editorial-page .prize-modal.show { animation: pm-fade .3s ease both; }
    .editorial-page .prize-modal.show .prize-modal-card { animation: pm-rise .5s cubic-bezier(.22,1,.36,1) both; }
    .prize-modal.show .pm-medal { animation: pm-strike .9s .12s cubic-bezier(.22,1,.36,1) both; }
    .prize-modal.show .pm-medal-face::after { animation: metallic-pass 1.1s .7s ease both; }
    .prize-modal.show [data-kind="nothing"] .pm-medal, .prize-modal.show .prize-modal-card[data-kind="nothing"] .pm-medal { animation: pm-rise .5s .1s ease both; }
}
@keyframes pm-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes pm-rise { from { opacity: 0; transform: translateY(18px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes pm-strike { 0% { opacity: 0; transform: rotateY(-180deg) scale(.6); } 60% { opacity: 1; } 100% { transform: rotateY(0) scale(1); } }
@keyframes metallic-pass { from { transform: translateX(-130%); } to { transform: translateX(130%); } }

/* Hub monogram */
.editorial-page .wheel-hub .hub-mark { width: 46%; height: auto; margin: 0 auto; filter: drop-shadow(0 1px 1px rgba(0,0,0,.5)); }
@media (prefers-reduced-motion: no-preference) {
    .editorial-page .wheel-wrap:not(.is-spinning) .wheel-hub .hub-mark { animation: hub-breathe 3.2s ease-in-out infinite; }
}
.pm-code[hidden] { display: none; }

/* ============================================================
   GAMES HUB — one shelf, live previews, daily pick, rewards ad
   ============================================================ */
.hub-mast { align-items: center; }
.hub-mast .masthead-copy .btn-group { margin-top: 26px; }
.gtag { display: inline-flex; align-items: center; gap: 6px; padding: 4px 9px; border-radius: 2px; border: 1px solid #d2ccbf; font-size: .56rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: #66645c; white-space: nowrap; }
.gtag.is-reward { border-color: #82613b; background: #82613b; color: #fffdf8; }
.gtag.is-reward::before { content: '\2726'; font-size: .6rem; }

/* Today's pick: a promo card with a large live preview */
.hub-pick { display: grid; grid-template-columns: 1fr 1fr; background: #fffdf8; border: 1px solid var(--rule); border-top: 2px solid #25272b; color: inherit; overflow: hidden; transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s; }
.hub-pick:hover { transform: translateY(-4px); box-shadow: 0 24px 50px -28px rgba(37,39,43,.45); }
.hub-pick-top { grid-column: 1 / -1; display: flex; justify-content: space-between; padding: 12px 18px; border-bottom: 1px solid var(--rule); font-size: .56rem; letter-spacing: .14em; text-transform: uppercase; color: #66645c; }
.hub-pick-top span:first-child { color: #82613b; font-weight: 600; }
.hub-pick-art { display: grid; place-items: center; min-height: 230px; background: radial-gradient(ellipse at 50% 40%, #3a3731, #25282c 70%); }
.hub-pick-art .ga { transform: scale(1.35); }
.hub-pick-body { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 22px 22px 24px; }
.hub-pick-body strong { font: 500 1.7rem/1.1 'Playfair Display', serif; letter-spacing: -.03em; color: #25272b; }
.hub-pick-body p { margin: 0; font-size: .86rem; line-height: 1.6; color: #50514f; }
.hub-pick-body .btn { margin-top: auto; }

/* The shelf: every game in the same format */
.hub-legend { margin: 0; max-width: 430px; font-size: .78rem; line-height: 2; color: #66645c; }
.hub-shelf { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; }
.gcard { display: flex; flex-direction: column; background: #fffdf8; border: 1px solid var(--rule); color: inherit; transition: transform .35s cubic-bezier(.22,1,.36,1), box-shadow .35s, border-color .35s; }
.gcard:hover, .gcard:focus-visible { transform: translateY(-6px); border-color: #cfc7b8; box-shadow: 0 26px 46px -30px rgba(37,39,43,.5); }
.gcard-art { display: grid; place-items: center; aspect-ratio: 4/3; background: radial-gradient(ellipse at 50% 40%, #3a3731, #25282c 70%); overflow: hidden; }
.gcard-body { display: flex; flex-direction: column; flex: 1; padding: 16px 16px 18px; }
.gcard-meta { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .66rem; color: #66645c; }
.gcard h3 { margin: 14px 0 6px; font-size: 1.2rem; }
.gcard p { margin: 0 0 16px; font-size: .78rem; line-height: 1.55; color: #66645c; flex: 1; }
.gcard-cta { display: inline-flex; gap: 8px; font-size: .78rem; font-weight: 600; color: #25272b; }
.gcard-cta b { font-weight: 400; transition: transform .25s; }
.gcard:hover .gcard-cta b { transform: translateX(4px); }

/* ---- Live previews (pure CSS; animate only while .is-live) ---- */
.ga { position: relative; width: 120px; height: 90px; }
.ga-trivia { display: grid; align-content: center; gap: 7px; padding: 0 6px; }
.ga-trivia .ga-q { font: italic 500 .8rem 'Playfair Display', serif; color: #e3c88e; }
.ga-trivia i { display: block; height: 11px; border-radius: 2px; background: rgba(243,237,226,.18); }
.ga-trivia i:nth-of-type(2) { width: 82%; } .ga-trivia i:nth-of-type(3) { width: 64%; }
.ga-ring { position: absolute; top: 2px; right: 6px; width: 26px; height: 26px; border-radius: 50%; background: conic-gradient(#e3c88e var(--t, 70%), rgba(243,237,226,.15) 0); -webkit-mask: radial-gradient(circle 9px, transparent 98%, #000); mask: radial-gradient(circle 9px, transparent 98%, #000); }
.ga-spin { display: grid; place-items: center; }
.ga-wheel { width: 84px; height: 84px; border-radius: 50%; border: 4px solid #c9a052; background: conic-gradient(#25282c 0 45deg, #f3ede2 0 90deg, #8a6639 0 135deg, #f3ede2 0 180deg, #25282c 0 225deg, #e9cf8f 0 270deg, #6b2c36 0 315deg, #f3ede2 0); box-shadow: 0 8px 18px rgba(0,0,0,.35); }
.ga-pin { position: absolute; top: 0; left: 50%; transform: translateX(-50%); border: 6px solid transparent; border-top: 10px solid #f3ede2; }
.ga-hub { position: absolute; top: 50%; left: 50%; width: 18px; height: 18px; transform: translate(-50%, -50%); border-radius: 50%; background: #25282c; border: 2px solid #c9a052; }
.ga-word { display: grid; grid-template-columns: repeat(5, 1fr); gap: 2px; width: 110px; height: auto; }
.ga-word b { display: grid; place-items: center; height: 18px; font: 600 .62rem 'Inter', sans-serif; color: rgba(243,237,226,.75); position: relative; z-index: 1; }
.ga-mark { position: absolute; left: 0; top: 0; height: 18px; width: 100%; border-radius: 9px; background: rgba(201,160,82,.7); transform-origin: left; transform: scaleX(1); }
.ga-memory { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; width: 108px; height: auto; perspective: 300px; }
.ga-memory i { display: block; aspect-ratio: 3/4; border-radius: 3px; background: linear-gradient(135deg, #3d3a33, #25282c); border: 1px solid #8a6639; }
.ga-memory i:nth-child(2), .ga-memory i:nth-child(6) { background: #f3ede2; border-color: #e3c88e; }
.ga-scramble { display: flex; justify-content: center; align-items: center; gap: 4px; }
.ga-scramble b { display: grid; place-items: center; width: 20px; height: 26px; border-radius: 2px; background: #f3ede2; color: #25282c; font: italic 600 .9rem 'Playfair Display', serif; }

@media (prefers-reduced-motion: no-preference) {
    .is-live .ga-wheel { animation: ga-turn 7s cubic-bezier(.3,.1,.2,1) infinite; }
    .is-live .ga-ring { animation: ga-timer 4s linear infinite; }
    .is-live .ga-trivia i.is-right { animation: ga-answer 4s ease infinite; }
    .is-live .ga-mark { animation: ga-sweep 3.6s cubic-bezier(.22,1,.36,1) infinite; }
    .is-live .ga-memory i { animation: ga-flip 4.8s ease infinite; }
    .is-live .ga-memory i:nth-child(2) { animation-delay: .4s; } .is-live .ga-memory i:nth-child(3) { animation-delay: .8s; }
    .is-live .ga-memory i:nth-child(4) { animation-delay: 1.2s; } .is-live .ga-memory i:nth-child(5) { animation-delay: 1.6s; } .is-live .ga-memory i:nth-child(6) { animation-delay: 2s; }
    .is-live .ga-scramble b:nth-child(1) { animation: ga-s1 3.6s cubic-bezier(.22,1,.36,1) infinite; }
    .is-live .ga-scramble b:nth-child(2) { animation: ga-s2 3.6s cubic-bezier(.22,1,.36,1) infinite; }
    .is-live .ga-scramble b:nth-child(4) { animation: ga-s4 3.6s cubic-bezier(.22,1,.36,1) infinite; }
    .is-live .ga-scramble b:nth-child(5) { animation: ga-s5 3.6s cubic-bezier(.22,1,.36,1) infinite; }
    .gcard:hover .ga-wheel { animation-duration: 2.4s; }
}
@property --t { syntax: '<percentage>'; inherits: false; initial-value: 100%; }
@keyframes ga-turn { 0% { transform: rotate(0); } 70%, 100% { transform: rotate(1080deg); } }
@keyframes ga-timer { from { --t: 100%; } to { --t: 0%; } }
@keyframes ga-answer { 0%, 45% { background: rgba(243,237,226,.18); } 55%, 90% { background: #c9a052; } 100% { background: rgba(243,237,226,.18); } }
@keyframes ga-sweep { 0% { transform: scaleX(0); opacity: 1; } 45%, 80% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(1); opacity: 0; } }
@keyframes ga-flip { 0%, 30% { transform: rotateY(0); } 40%, 70% { transform: rotateY(180deg); background: #f3ede2; } 80%, 100% { transform: rotateY(0); } }
@keyframes ga-s1 { 0%, 15% { transform: translateX(72px); } 45%, 100% { transform: none; } }
@keyframes ga-s2 { 0%, 15% { transform: translateX(24px); } 45%, 100% { transform: none; } }
@keyframes ga-s4 { 0%, 15% { transform: translateX(-72px); } 45%, 100% { transform: none; } }
@keyframes ga-s5 { 0%, 15% { transform: translateX(-24px); } 45%, 100% { transform: none; } }

/* Rewards loop band (marketing) */
.hub-loop-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 6vw, 88px); align-items: center; }
.hub-loop h2 { color: #faf5e9; }
.hub-loop p { color: #c6c3bc; max-width: 440px; line-height: 1.75; }
.hub-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); position: relative; }
.hub-steps::before { content: ''; position: absolute; left: 0; right: 0; top: 20px; height: 1px; background: rgba(220,196,154,.25); }
.hub-steps::after { content: ''; position: absolute; left: 0; top: 20px; height: 1px; width: 100%; background: #dcc49a; transform-origin: left; transform: scaleX(0); }
.hub-steps li { position: relative; display: grid; gap: 6px; padding: 0 16px 0 0; }
.hub-steps span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #25282c; border: 1px solid #dcc49a; font: italic 500 .95rem 'Playfair Display', serif; color: #dcc49a; position: relative; z-index: 1; margin-bottom: 10px; }
.hub-steps strong { font: 500 1.3rem 'Playfair Display', serif; color: #faf5e9; }
.hub-steps small { font-size: .78rem; line-height: 1.55; color: #c6c3bc; }
@media (prefers-reduced-motion: no-preference) {
    .hub-steps.is-live::after { animation: hub-draw 3.6s cubic-bezier(.22,1,.36,1) infinite; }
    .hub-steps.is-live li span { animation: hub-pulse 3.6s ease infinite; }
    .hub-steps.is-live li:nth-child(2) span { animation-delay: 1s; } .hub-steps.is-live li:nth-child(3) span { animation-delay: 2s; }
}
@keyframes hub-draw { 0% { transform: scaleX(0); opacity: 1; } 70% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(1); opacity: 0; } }
@keyframes hub-pulse { 0%, 20% { background: #25282c; color: #dcc49a; } 30%, 60% { background: #dcc49a; color: #25282c; box-shadow: 0 0 0 6px rgba(220,196,154,.15); } 75%, 100% { background: #25282c; color: #dcc49a; } }

.hub-quick-head { padding-bottom: clamp(24px, 3vw, 36px) !important; }

@media (max-width: 1100px) { .hub-shelf { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) {
    .hub-loop-grid { grid-template-columns: minmax(0, 1fr); }
    .hub-pick { grid-template-columns: minmax(0, 1fr); }
    .hub-pick-art { min-height: 180px; }
}
@media (max-width: 640px) {
    .hub-shelf { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .gcard-body { padding: 12px; } .gcard h3 { font-size: 1.05rem; } .gcard p { font-size: .74rem; }
    .gcard-meta { flex-direction: column; align-items: flex-start; gap: 6px; }
    .hub-steps { grid-template-columns: minmax(0, 1fr); gap: 18px; }
    .hub-steps::before, .hub-steps::after { display: none; }
}
.hub-mast { grid-template-columns: minmax(0, 1.15fr) minmax(360px, 1fr); }
.hub-pick { grid-template-columns: 1.1fr 1fr; }
.hub-pick-art .ga { transform: scale(1.2); }
@media (max-width: 900px) { .hub-mast { grid-template-columns: minmax(0, 1fr); } .hub-pick { grid-template-columns: minmax(0, 1fr); } }

/* ============================================================
   ACCOUNT FORMS — sign-up layout, strength meter, match check
   ============================================================ */
.auth-section { background: radial-gradient(ellipse at 5% 10%, rgba(218,196,155,.17), transparent 50%); }
.auth-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(36px, 7vw, 110px); align-items: start; }
.auth-intro h1 { font-size: clamp(2.6rem, 4.4vw, 4rem); line-height: 1.05; letter-spacing: -.05em; margin: 0 0 20px; }
.auth-intro > p { max-width: 420px; color: #50514f; line-height: 1.75; margin: 0 0 32px; }
.auth-perks { list-style: none; margin: 0; padding: 0; border-top: 1px solid #25272b; max-width: 440px; }
.auth-perks li { display: grid; grid-template-columns: 44px 1fr; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--rule); }
.auth-perks span { font: italic 500 1.3rem/1 'Playfair Display', serif; color: #82613b; }
.auth-perks strong { display: block; font: 500 1.05rem 'Playfair Display', serif; color: #25272b; }
.auth-perks small { font-size: .8rem; color: #66645c; }
.auth-card { background: #fffdf8; border: 1px solid var(--rule); border-top: 2px solid #25272b; padding: clamp(24px, 4vw, 40px); box-shadow: 0 30px 60px -45px rgba(37,39,43,.45); }
.auth-form { display: grid; gap: 18px; max-width: none; }
.auth-field { display: grid; gap: 8px; }
.auth-field label { margin: 0; font-size: .74rem; font-weight: 600; letter-spacing: .04em; color: #25272b; }
.auth-field > small, .pw-match { font-size: .74rem; color: #66645c; min-height: 1em; }
.auth-optional { font-weight: 400; color: #8d877c; margin-left: 6px; }
.editorial-page .auth-field input { padding: 13px 14px; }
.pw-meter { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.pw-meter i { height: 3px; background: #e6e0d4; transition: background .25s; }
.pw-meter small { grid-column: 1 / -1; font-size: .74rem; color: #66645c; margin-top: 2px; }
.pw-meter[data-score="1"] i:nth-child(-n+1) { background: #a8434a; }
.pw-meter[data-score="2"] i:nth-child(-n+2) { background: #a8692a; }
.pw-meter[data-score="3"] i:nth-child(-n+3) { background: #82613b; }
.pw-meter[data-score="4"] i { background: #3f7d58; }
.pw-meter[data-score="0"] small { color: #a8434a; }
.pw-match.is-ok { color: #3f7d58; }
.pw-match:not(.is-ok):not(:empty) { color: #a8434a; }
.auth-check { display: flex; gap: 12px; align-items: flex-start; margin: 4px 0 0; padding: 14px 16px; background: #f7f4ed; border: 1px solid var(--rule); font-size: .82rem; line-height: 1.55; color: #50514f; cursor: pointer; }
.auth-check input { margin: 3px 0 0; flex-shrink: 0; accent-color: #25272b; }
.auth-submit { width: 100%; justify-content: center; margin-top: 4px; }
.auth-switch { text-align: center; margin: 4px 0 0; font-size: .86rem; color: #66645c; }
.auth-switch a { color: #25272b; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 860px) { .auth-grid { grid-template-columns: minmax(0, 1fr); } .auth-perks { display: none; } }
.auth-card-narrow { max-width: 480px; justify-self: end; width: 100%; }
.auth-forgot { justify-self: end; font-size: .78rem; color: #82613b; text-decoration: underline; text-underline-offset: 3px; }
.auth-divider { display: flex; align-items: center; gap: 14px; margin: 6px 0 -4px; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: #8d877c; }
.auth-divider::before, .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--rule); }
@media (max-width: 860px) { .auth-card-narrow { justify-self: stretch; max-width: none; } }