/* =====================================================================
   Summit Bridge World — "Midnight Gold"
   Dark, luxe social-entertainment skin. Original stylesheet, no framework.
   Same semantic class system as the editorial build — re-themed to a
   near-black stage with warm gold, jade and ruby accents. Mobile-first,
   CSS Grid + Flexbox.

   00 Tokens · 01 Base · 02 Type · 03 Buttons · 04 Masthead/nav
   05 Overture/opener · 06 Compositions · 07 Home sections
   08 Collection/plate/play-modal · 09 Responsible · 10 About
   11 FAQ · 12 Contact · 13 Legal · 14 Trail/footer/gate/404 · 15 Motion
   ===================================================================== */

/* ---- 00  Tokens --------------------------------------------------- */
:root {
    --void:      #0B0910;
    --void-2:    #0F0C17;
    --panel:     #16121F;
    --panel-2:   #1D1830;
    --panel-3:   #251E3B;
    --cream:     #F5EFE2;
    --muted:     #C6BDD4;
    --faint:     #8F86A6;
    --gold:      #E8C36A;
    --gold-deep: #C79A3A;
    --gold-lo:   #9A742A;
    --jade:      #5FB894;
    --ruby:      #D5566A;
    --line:      rgba(245, 239, 226, .12);
    --line-firm: rgba(245, 239, 226, .22);
    --line-gold: rgba(232, 195, 106, .30);
    --glow-gold: rgba(232, 195, 106, .22);

    --serif: "Fraunces", Georgia, "Times New Roman", serif;
    --sans:  "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    --shell: 1360px;
    --edge:  clamp(1.25rem, 5.5vw, 6rem);
    --stack: clamp(4.5rem, 11vw, 10rem);
    --ease:  cubic-bezier(.22, 1, .36, 1);
    --ease-firm: cubic-bezier(.65, 0, .35, 1);
}

/* ---- 01  Base ----------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }

html.sbw-root {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    scroll-behavior: smooth;
    -webkit-tap-highlight-color: transparent;
    background: var(--void);
}

body.sbw-body {
    margin: 0;
    background-color: var(--void);
    background-image:
        radial-gradient(70% 55% at 82% -8%, rgba(232, 195, 106, .16), transparent 60%),
        radial-gradient(60% 50% at -8% 8%, rgba(95, 184, 148, .10), transparent 55%),
        radial-gradient(80% 60% at 50% 118%, rgba(213, 86, 106, .10), transparent 60%),
        linear-gradient(180deg, var(--void-2), var(--void) 40%);
    background-attachment: fixed;
    color: var(--cream);
    font-family: var(--sans);
    font-size: clamp(1rem, .95rem + .25vw, 1.15rem);
    line-height: 1.62;
    font-weight: 400;
    letter-spacing: .003em;
    overflow-x: hidden;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; }
h1, h2, h3, h4, p, ol, ul, dl, dd, figure, blockquote { margin: 0; }
ol, ul { list-style: none; padding: 0; }
button { font: inherit; color: inherit; }

::selection { background: var(--gold); color: var(--void); }

.sbw-skip {
    position: fixed; top: .75rem; left: .75rem; z-index: 200;
    transform: translateY(-160%);
    background: var(--gold); color: var(--void);
    padding: .7rem 1.1rem; text-decoration: none;
    font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 700;
    transition: transform .3s var(--ease);
}
.sbw-skip:focus { transform: translateY(0); }

.sbw-main { display: block; }

.sbw-overture, .sbw-narrative, .sbw-compositions, .sbw-quote, .sbw-featured,
.sbw-timeline, .sbw-panels, .sbw-responsible-story, .sbw-preface, .sbw-collection,
.sbw-creed, .sbw-clock, .sbw-signals, .sbw-support, .sbw-manifesto, .sbw-values,
.sbw-ledger, .sbw-questions, .sbw-contact, .sbw-legal, .sbw-lost, .sbw-opener {
    max-width: var(--shell);
    margin-inline: auto;
    padding-inline: var(--edge);
}

/* ---- 02  Type helpers -------------------------------------------- */
.sbw-overture__title, .sbw-opener__title, .sbw-composition__heading,
.sbw-narrative__title, .sbw-quote__text, .sbw-featured__title, .sbw-featured__name,
.sbw-timeline__title, .sbw-panels__title, .sbw-responsible-story__heading,
.sbw-preface__title, .sbw-collection__title, .sbw-plate__title, .sbw-reader__title,
.sbw-creed__title, .sbw-creed__head, .sbw-clock__title, .sbw-signals__title,
.sbw-support__title, .sbw-manifesto__title, .sbw-values__title, .sbw-values__name,
.sbw-ledger__title, .sbw-questions__title, .sbw-contact__title, .sbw-legal__h,
.sbw-lost__title, .sbw-gate__title, .sbw-colophon__issue {
    font-family: var(--serif);
    font-weight: 400;
    line-height: 1.02;
    letter-spacing: -.015em;
    font-optical-sizing: auto;
    color: var(--cream);
}

.sbw-overture__eyebrow, .sbw-opener__eyebrow, .sbw-composition__kicker,
.sbw-narrative__hint, .sbw-featured__tag, .sbw-preface__kicker, .sbw-collection__eyebrow,
.sbw-plate__discipline, .sbw-signals__kicker, .sbw-drawer__eyebrow, .sbw-index__head,
.sbw-legal__toc-head, .sbw-responsible-story__eyebrow, .sbw-standing__line,
.sbw-nav__index, .sbw-opener__index, .sbw-plate__tag, .sbw-gate__kicker {
    font-size: .74rem; letter-spacing: .22em; text-transform: uppercase; font-weight: 600;
}

/* ---- 03  Buttons -------------------------------------------------- */
.sbw-btn {
    --btn-fg: var(--cream);
    display: inline-flex; align-items: center; gap: .6rem;
    font-family: var(--sans); font-weight: 700; font-size: .82rem;
    letter-spacing: .1em; text-transform: uppercase; text-decoration: none;
    padding: .95rem 1.7rem; border: 1px solid transparent; cursor: pointer;
    color: var(--btn-fg); background: transparent; position: relative;
    transition: background .35s var(--ease), color .35s var(--ease),
                border-color .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.sbw-btn--solid {
    --btn-fg: #241800;
    background: linear-gradient(135deg, #F3D486, var(--gold) 45%, var(--gold-deep));
    border-color: var(--gold);
    box-shadow: 0 10px 30px -14px var(--glow-gold);
}
.sbw-btn--solid:hover { transform: translateY(-2px); box-shadow: 0 18px 44px -16px var(--glow-gold); filter: brightness(1.05); }
.sbw-btn--ghost { border-color: var(--line-gold); color: var(--cream); }
.sbw-btn--ghost:hover { border-color: var(--gold); background: rgba(232, 195, 106, .08); color: var(--gold); }
.sbw-btn--text { padding: .4rem 0; border: 0; color: var(--gold); }
.sbw-btn--text::after {
    content: ""; position: absolute; left: 0; bottom: .1rem; height: 1px; width: 100%;
    background: currentColor; transform-origin: right; transform: scaleX(.35);
    transition: transform .4s var(--ease);
}
.sbw-btn--text:hover { color: #F3D486; }
.sbw-btn--text:hover::after { transform: scaleX(1); transform-origin: left; }

/* ---- 04  Masthead / nav ------------------------------------------ */
.sbw-masthead {
    position: sticky; top: 0; z-index: 60;
    background: color-mix(in srgb, var(--void) 82%, transparent);
    backdrop-filter: saturate(140%) blur(12px);
    -webkit-backdrop-filter: saturate(140%) blur(12px);
    border-bottom: 1px solid var(--line-gold);
}

.sbw-standing { background: #070510; border-bottom: 1px solid var(--line); }
.sbw-standing__inner {
    max-width: var(--shell); margin-inline: auto; padding: .5rem var(--edge);
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem;
}
.sbw-standing__line { color: var(--muted); display: flex; align-items: center; gap: .6rem; font-weight: 500; letter-spacing: .04em; text-transform: none; font-size: .74rem; }
.sbw-standing__line--muted { color: var(--faint); }
.sbw-standing__flag {
    display: inline-grid; place-items: center; min-width: 2.4rem; padding: .15rem .5rem;
    background: linear-gradient(135deg, #F3D486, var(--gold-deep)); color: #241800; border-radius: 2px;
    font-weight: 800; letter-spacing: .04em;
}

.sbw-masthead__inner {
    max-width: var(--shell); margin-inline: auto; padding: 1.1rem var(--edge);
    display: flex; align-items: center; justify-content: space-between; gap: 1.5rem;
}
.sbw-wordmark { display: inline-flex; align-items: center; gap: .8rem; text-decoration: none; }
.sbw-wordmark__mark { width: 44px; height: 44px; filter: drop-shadow(0 4px 12px var(--glow-gold)); }
.sbw-wordmark__type { display: flex; flex-direction: column; line-height: 1; }
.sbw-wordmark__lead { font-family: var(--serif); font-size: 1.3rem; color: var(--cream); letter-spacing: -.01em; }
.sbw-wordmark__trail { font-size: .68rem; letter-spacing: .44em; text-transform: uppercase; color: var(--gold); font-weight: 700; margin-top: .22rem; }

.sbw-masthead__nav { display: none; }
.sbw-nav__list { display: flex; align-items: center; gap: clamp(1rem, 2.4vw, 2.4rem); }
.sbw-nav__link { display: inline-flex; align-items: baseline; gap: .4rem; text-decoration: none; position: relative; padding: .4rem 0; }
.sbw-nav__index { color: var(--gold); font-size: .62rem; opacity: .85; }
.sbw-nav__label { font-size: .92rem; font-weight: 500; letter-spacing: .01em; color: var(--muted); transition: color .3s var(--ease); }
.sbw-nav__link::after {
    content: ""; position: absolute; left: 0; bottom: .05rem; height: 1px; width: 100%;
    background: linear-gradient(90deg, var(--gold), transparent); transform: scaleX(0); transform-origin: left;
    transition: transform .35s var(--ease);
}
.sbw-nav__link:hover .sbw-nav__label { color: var(--gold); }
.sbw-nav__link:hover::after, .sbw-nav__link.is-current::after { transform: scaleX(1); }
.sbw-nav__link.is-current .sbw-nav__label { color: var(--cream); }

.sbw-burger { display: inline-flex; align-items: center; gap: .55rem; background: none; border: 0; cursor: pointer; padding: .4rem 0; color: var(--cream); }
.sbw-burger__bar { width: 26px; height: 2px; background: var(--gold); display: block; transition: transform .35s var(--ease); transform-origin: center; }
.sbw-burger__bar + .sbw-burger__bar { margin-top: 6px; }
.sbw-burger__label { font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; }
.sbw-burger[aria-expanded="true"] .sbw-burger__bar:first-child { transform: translateY(4px) rotate(45deg); }
.sbw-burger[aria-expanded="true"] .sbw-burger__bar:nth-child(2) { transform: translateY(-4px) rotate(-45deg); }

.sbw-drawer {
    position: fixed; inset: 0; z-index: 90; background: var(--void);
    background-image:
        radial-gradient(60% 40% at 80% 0%, rgba(232,195,106,.16), transparent 60%),
        radial-gradient(70% 50% at 10% 100%, rgba(95,184,148,.10), transparent 60%);
    display: grid; place-items: center; padding: calc(var(--edge) + 1rem) var(--edge);
    overflow-y: auto; animation: sbw-drawer-in .5s var(--ease) both;
}
.sbw-drawer[hidden] { display: none; }
.sbw-drawer__panel { width: min(30rem, 100%); }
.sbw-drawer__eyebrow { color: var(--gold); margin-bottom: 2rem; }
.sbw-drawer .sbw-nav__list { flex-direction: column; align-items: flex-start; gap: 1.1rem; }
.sbw-drawer .sbw-nav__label { font-family: var(--serif); font-size: 1.95rem; color: var(--cream); }
.sbw-drawer .sbw-nav__index { font-size: .8rem; }
.sbw-drawer__cta { display: inline-block; margin-top: 2.5rem; font-weight: 700; text-decoration: none; border-bottom: 2px solid var(--gold); padding-bottom: .3rem; color: var(--gold); }
@keyframes sbw-drawer-in { from { opacity: 0; transform: translateY(-1.2rem); } to { opacity: 1; transform: none; } }

/* ---- 05  Overture / opener --------------------------------------- */
.sbw-overture { padding-top: clamp(3rem, 7vw, 6rem); padding-bottom: var(--stack); position: relative; }
.sbw-overture__frame { display: grid; gap: 1.5rem; }
.sbw-overture__eyebrow { color: var(--gold); }
.sbw-overture__title { font-size: clamp(2.9rem, 12vw, 8.5rem); max-width: 14ch; }
.sbw-overture__title em { font-style: italic; color: var(--gold); text-shadow: 0 0 40px var(--glow-gold); }
.sbw-overture__figure { position: relative; margin: 0; }
.sbw-overture__figure img { width: 100%; border-radius: 4px; box-shadow: 0 50px 90px -50px #000, 0 0 0 1px var(--line-gold); }
.sbw-overture__caption { position: absolute; bottom: -.4rem; left: .8rem; background: var(--gold); color: var(--void); font-size: .66rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; padding: .35rem .7rem; }
.sbw-overture__foot { display: grid; gap: 1.6rem; }
.sbw-overture__lead { font-size: clamp(1.1rem, 1rem + .8vw, 1.45rem); line-height: 1.5; max-width: 42ch; color: var(--muted); }
.sbw-overture__cta { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; }
.sbw-overture__stamp { margin-top: 3rem; font-size: .72rem; letter-spacing: .28em; text-transform: uppercase; color: var(--faint); border-top: 1px solid var(--line); padding-top: 1.2rem; }

.sbw-opener { padding-top: clamp(2.5rem, 6vw, 5rem); padding-bottom: clamp(2rem, 5vw, 4rem); }
.sbw-opener__row { display: flex; align-items: center; gap: 1.2rem; margin-bottom: 1.4rem; }
.sbw-opener__index { color: var(--jade); border: 1px solid var(--line-firm); padding: .25rem .6rem; }
.sbw-opener__eyebrow { color: var(--gold); }
.sbw-opener__title { font-size: clamp(2.4rem, 7vw, 5.2rem); max-width: 18ch; }
.sbw-opener__title em { font-style: italic; color: var(--gold); }
.sbw-opener__lead { margin-top: 1.6rem; font-size: clamp(1.05rem, 1rem + .5vw, 1.3rem); max-width: 52ch; color: var(--muted); }
.sbw-opener__meta { margin-top: 1rem; font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--faint); }
.sbw-opener__rule { display: block; height: 1px; background: linear-gradient(90deg, var(--line-gold), transparent); margin-top: 2.4rem; }

/* ---- 06  Compositions -------------------------------------------- */
.sbw-compositions { padding-block: var(--stack); display: grid; gap: var(--stack); }
.sbw-composition { display: grid; gap: clamp(1.6rem, 4vw, 3rem); align-items: center; }
.sbw-composition__figure { position: relative; margin: 0; }
.sbw-composition__figure img { width: 100%; border-radius: 4px; box-shadow: 0 40px 70px -50px #000, 0 0 0 1px var(--line); }
.sbw-composition__note { position: absolute; top: .8rem; left: .8rem; background: var(--panel-2); color: var(--gold); font-size: .64rem; letter-spacing: .16em; text-transform: uppercase; padding: .3rem .6rem; border: 1px solid var(--line-gold); }
.sbw-composition__text { position: relative; }
.sbw-composition__kicker { color: var(--jade); margin-bottom: 1rem; }
.sbw-composition__heading { font-size: clamp(1.9rem, 4.5vw, 3.4rem); max-width: 16ch; margin-bottom: 1.4rem; }
.sbw-composition__body { display: grid; gap: 1.1rem; max-width: 46ch; color: var(--muted); }
.sbw-composition__folio { display: inline-block; margin-top: 1.8rem; font-family: var(--serif); font-size: 2.6rem; color: var(--panel-3); line-height: 1; }

/* ---- 07  Home sections ------------------------------------------- */
.sbw-narrative { padding-block: var(--stack); }
.sbw-narrative__head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 1rem 1.6rem; margin-bottom: 2.4rem; }
.sbw-narrative__index { font-family: var(--serif); font-size: 1.4rem; color: var(--gold); }
.sbw-narrative__title { font-size: clamp(2rem, 5vw, 3.4rem); }
.sbw-narrative__hint { margin-left: auto; color: var(--faint); }
.sbw-narrative__track {
    display: flex; gap: 1.25rem; overflow-x: auto; scroll-snap-type: x mandatory;
    padding-bottom: 1.5rem; margin-inline: calc(var(--edge) * -1); padding-inline: var(--edge);
    scrollbar-width: thin; cursor: grab;
}
.sbw-narrative__track.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.sbw-narrative__track::-webkit-scrollbar { height: 4px; }
.sbw-narrative__track::-webkit-scrollbar-thumb { background: var(--line-gold); }
.sbw-narrative__panel {
    flex: 0 0 min(80vw, 26rem); scroll-snap-align: start;
    background: linear-gradient(160deg, var(--panel-2), var(--panel));
    border: 1px solid var(--line); padding: 2rem 1.8rem; display: grid; gap: 1.2rem; align-content: start;
    min-height: 15rem; border-radius: 4px;
}
.sbw-narrative__panel--accent { background: linear-gradient(160deg, #2a2038, #1a1326); border-color: var(--line-gold); }
.sbw-narrative__panel-no { font-family: var(--serif); font-style: italic; font-size: 1.5rem; color: var(--gold); }
.sbw-narrative__panel-text { font-size: 1.12rem; line-height: 1.5; color: var(--cream); }

.sbw-quote { padding-block: var(--stack); }
.sbw-quote__block { position: relative; max-width: 30ch; margin-inline: auto; text-align: center; }
.sbw-quote__mark { font-family: var(--serif); font-size: 8rem; line-height: .6; color: var(--gold); opacity: .4; }
.sbw-quote__text { font-family: var(--serif); font-size: clamp(1.7rem, 4.5vw, 3.2rem); line-height: 1.2; letter-spacing: -.01em; margin-top: -1rem; }
.sbw-quote__by { margin-top: 1.8rem; font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; color: var(--faint); }

.sbw-featured { padding-block: var(--stack); }
.sbw-featured__head { max-width: 46ch; margin-bottom: 3rem; }
.sbw-featured__title { font-size: clamp(2rem, 5vw, 3.4rem); }
.sbw-featured__sub { margin-top: 1rem; color: var(--muted); }
.sbw-featured__list { border-top: 1px solid var(--line-gold); }
.sbw-featured__row { display: grid; gap: .6rem 2rem; padding: 2rem 0; border-bottom: 1px solid var(--line); align-items: start; }
.sbw-featured__no { font-family: var(--serif); font-size: 2rem; color: var(--gold); line-height: 1; }
.sbw-featured__name { font-size: clamp(1.6rem, 3.5vw, 2.4rem); margin-bottom: .5rem; }
.sbw-featured__copy { color: var(--muted); max-width: 52ch; }
.sbw-featured__tag { color: var(--jade); align-self: center; }
.sbw-featured__link { display: inline-block; margin-top: 2.4rem; font-weight: 700; text-decoration: none; color: var(--gold); border-bottom: 2px solid currentColor; padding-bottom: .25rem; }

.sbw-timeline { padding-block: var(--stack); }
.sbw-timeline__head { display: flex; align-items: baseline; gap: 1.4rem; margin-bottom: 3rem; }
.sbw-timeline__index { font-family: var(--serif); font-size: 1.4rem; color: var(--gold); }
.sbw-timeline__title { font-size: clamp(2rem, 5vw, 3.4rem); }
.sbw-timeline__track { display: grid; gap: 0; }
.sbw-timeline__stop { position: relative; padding: 1.8rem 0 1.8rem 2.4rem; border-left: 2px solid var(--line-firm); }
.sbw-timeline__stop:last-child { border-left-color: transparent; }
.sbw-timeline__dot { position: absolute; left: -8px; top: 2.1rem; width: 14px; height: 14px; border-radius: 50%; background: var(--void); border: 2px solid var(--gold); box-shadow: 0 0 14px var(--glow-gold); }
.sbw-timeline__stop--end .sbw-timeline__dot { background: var(--gold); }
.sbw-timeline__when { font-family: var(--serif); font-size: 1.35rem; margin-bottom: .5rem; color: var(--cream); }
.sbw-timeline__what { color: var(--muted); max-width: 48ch; }

.sbw-panels { padding-block: var(--stack); }
.sbw-panels__title { font-size: clamp(2rem, 5vw, 3.4rem); margin-bottom: 3rem; max-width: 16ch; }
.sbw-panels__field { display: grid; gap: 1.1rem; }
.sbw-panels__card {
    border: 1px solid var(--line); padding: 1.8rem; border-radius: 6px;
    background: linear-gradient(165deg, var(--panel-2), var(--panel));
    display: grid; gap: .8rem; transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease);
}
.sbw-panels__card:hover { transform: translateY(-6px); border-color: var(--line-gold); box-shadow: 0 30px 60px -34px #000, 0 0 40px -20px var(--glow-gold); }
.sbw-panels__lead { font-family: var(--serif); font-size: clamp(1.5rem, 3.5vw, 2.1rem); line-height: 1; color: var(--cream); }
.sbw-panels__card--a .sbw-panels__lead, .sbw-panels__card--d .sbw-panels__lead { color: var(--gold); }
.sbw-panels__card--b .sbw-panels__lead, .sbw-panels__card--e .sbw-panels__lead { color: var(--jade); }
.sbw-panels__note { color: var(--muted); font-size: .98rem; }

.sbw-responsible-story { padding-block: var(--stack); display: grid; gap: 2rem; }
.sbw-responsible-story__aside { display: grid; gap: 1rem; align-content: start; }
.sbw-responsible-story__eyebrow { color: var(--gold); }
.sbw-responsible-story__rule { height: 1px; background: var(--line-gold); width: 4rem; }
.sbw-responsible-story__heading { font-size: clamp(1.9rem, 4.5vw, 3.2rem); max-width: 20ch; margin-bottom: 1.6rem; }
.sbw-responsible-story__copy { color: var(--muted); max-width: 54ch; margin-bottom: 1.2rem; }
.sbw-responsible-story__body .sbw-btn--text { margin-top: .8rem; }

/* ---- 08  Collection / plate / play modal ------------------------- */
.sbw-preface { padding-block: var(--stack); display: grid; gap: 1.6rem; border-top: 1px solid var(--line); }
.sbw-preface__kicker { color: var(--jade); }
.sbw-preface__title { font-size: clamp(1.7rem, 4vw, 2.8rem); max-width: 20ch; margin-bottom: 1.4rem; }
.sbw-preface__para { color: var(--muted); max-width: 58ch; margin-bottom: 1.1rem; }

.sbw-collection { padding-block: var(--stack); }
.sbw-collection__intro { max-width: 54ch; margin-bottom: 3rem; }
.sbw-collection__eyebrow { color: var(--gold); margin-bottom: 1rem; }
.sbw-collection__title { font-size: clamp(1.8rem, 4.2vw, 3rem); line-height: 1.08; }
.sbw-collection__note { margin-top: 1.2rem; color: var(--muted); }
.sbw-collection__grid { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
.sbw-collection__legend { margin-top: 2.4rem; font-size: .76rem; letter-spacing: .18em; text-transform: uppercase; color: var(--faint); }

.sbw-plate {
    display: grid; grid-template-rows: auto 1fr; border-radius: 8px; overflow: hidden;
    border: 1px solid var(--line);
    background: linear-gradient(180deg, var(--panel-2), var(--panel));
    transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease);
}
.sbw-plate.is-live:hover { transform: translateY(-6px); border-color: var(--line-gold); box-shadow: 0 40px 70px -40px #000, 0 0 50px -22px var(--glow-gold); }
.sbw-plate__frame {
    position: relative; aspect-ratio: 4 / 5; overflow: hidden;
    background:
        radial-gradient(80% 70% at 50% 32%, rgba(232,195,106,.16), transparent 62%),
        linear-gradient(180deg, #221a34, #14101f);
}
.sbw-plate__image { width: 100%; height: 100%; object-fit: contain; padding: 1.6rem 1.4rem 2.2rem; transition: transform .8s var(--ease); filter: drop-shadow(0 20px 30px rgba(0,0,0,.55)); }
.sbw-plate.is-live:hover .sbw-plate__image { transform: scale(1.05) translateY(-4px); }
.sbw-plate.is-reserved .sbw-plate__image { object-fit: cover; padding: 0; filter: grayscale(.4) brightness(.8); }
.sbw-plate__ref { position: absolute; top: .8rem; left: .8rem; background: rgba(7,5,16,.72); color: var(--gold); font-size: .62rem; letter-spacing: .16em; text-transform: uppercase; padding: .3rem .6rem; border: 1px solid var(--line-gold); border-radius: 2px; }
.sbw-plate__live { position: absolute; top: .8rem; right: .8rem; display: inline-flex; align-items: center; gap: .4rem; background: linear-gradient(135deg, #F3D486, var(--gold-deep)); color: #241800; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 800; padding: .28rem .55rem; border-radius: 2px; }
.sbw-plate__live-dot { width: .42rem; height: .42rem; border-radius: 50%; background: #241800; animation: sbw-pulse 1.6s var(--ease) infinite; }
.sbw-plate.is-reserved .sbw-plate__frame::after {
    content: "In preparation"; position: absolute; inset: 0; display: grid; place-items: center;
    font-size: .72rem; letter-spacing: .24em; text-transform: uppercase; color: var(--faint);
    background: repeating-linear-gradient(135deg, transparent 0 14px, rgba(245,239,226,.03) 14px 28px);
}
.sbw-plate__body { padding: 1.6rem; display: grid; gap: .9rem; align-content: start; }
.sbw-plate__discipline { color: var(--jade); }
.sbw-plate__title { font-size: 1.55rem; }
.sbw-plate__meta { display: grid; gap: .5rem; margin: .3rem 0; }
.sbw-plate__pair { display: flex; justify-content: space-between; gap: 1rem; font-size: .84rem; border-bottom: 1px dotted var(--line); padding-bottom: .4rem; }
.sbw-plate__pair dt { color: var(--faint); letter-spacing: .08em; text-transform: uppercase; font-size: .68rem; }
.sbw-plate__pair dd { color: var(--cream); font-weight: 500; }
.sbw-plate__tag { color: var(--gold); }
.sbw-plate__open {
    justify-self: stretch; text-align: center; margin-top: .4rem; cursor: pointer;
    font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 800;
    padding: .85rem 1.2rem; border-radius: 3px; border: 1px solid var(--gold);
    color: #241800; background: linear-gradient(135deg, #F3D486, var(--gold) 45%, var(--gold-deep));
    transition: filter .3s var(--ease), transform .3s var(--ease), box-shadow .3s var(--ease);
}
.sbw-plate__open:hover:not([disabled]) { filter: brightness(1.06); transform: translateY(-1px); box-shadow: 0 14px 30px -14px var(--glow-gold); }
.sbw-plate.is-reserved .sbw-plate__open { background: transparent; color: var(--faint); border-color: var(--line-firm); }
.sbw-plate__open[disabled] { opacity: .55; cursor: not-allowed; }

/* play modal */
.sbw-reader { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: clamp(.75rem, 2.5vw, 2rem); }
.sbw-reader[hidden] { display: none; }
.sbw-reader__scrim { position: absolute; inset: 0; background: rgba(4,3,9,.82); backdrop-filter: blur(6px); animation: sbw-veil .4s var(--ease) both; }
.sbw-reader__stage {
    position: relative; z-index: 1; width: min(60rem, 100%); max-height: 94vh;
    display: grid; grid-template-rows: auto 1fr auto;
    background: linear-gradient(180deg, var(--panel-2), var(--panel));
    border: 1px solid var(--line-gold); border-radius: 10px; overflow: hidden;
    box-shadow: 0 60px 120px -40px #000, 0 0 80px -40px var(--glow-gold);
    animation: sbw-sheet-rise .5s var(--ease) both;
}
.sbw-reader__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.3rem; border-bottom: 1px solid var(--line); background: #0d0a16; }
.sbw-reader__ref { color: var(--jade); font-size: .66rem; letter-spacing: .2em; text-transform: uppercase; }
.sbw-reader__title { font-size: clamp(1.2rem, 3vw, 1.7rem); margin-top: .1rem; }
.sbw-reader__close { display: inline-flex; align-items: center; gap: .5rem; background: none; border: 1px solid var(--line-firm); border-radius: 3px; padding: .5rem .8rem; cursor: pointer; font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 700; color: var(--muted); transition: color .3s var(--ease), border-color .3s var(--ease); }
.sbw-reader__close:hover { color: var(--gold); border-color: var(--gold); }
.sbw-reader__close-x { color: var(--gold); }
.sbw-reader__viewport { position: relative; background: #000; min-height: 60vh; }
.sbw-reader__frame { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; }
.sbw-reader__disclaimer { font-size: .74rem; color: var(--faint); padding: .8rem 1.3rem; border-top: 1px solid var(--line); line-height: 1.5; background: #0d0a16; }

/* ---- 09  Responsible play ---------------------------------------- */
.sbw-creed { padding-block: var(--stack); }
.sbw-creed__title { font-size: clamp(2rem, 5vw, 3.4rem); margin-bottom: 3rem; }
.sbw-creed__rows { display: grid; gap: 0; border-top: 1px solid var(--line-gold); }
.sbw-creed__row { display: grid; gap: .6rem 2rem; padding: 2.2rem 0; border-bottom: 1px solid var(--line); }
.sbw-creed__no { font-family: var(--serif); font-size: 1.8rem; color: var(--gold); line-height: 1; }
.sbw-creed__head { font-size: clamp(1.4rem, 3vw, 2rem); margin-bottom: .6rem; }
.sbw-creed__copy { color: var(--muted); max-width: 58ch; }

.sbw-clock { padding-block: var(--stack); display: grid; gap: 2.6rem; align-items: center; }
.sbw-clock__face { position: relative; width: clamp(9rem, 30vw, 15rem); aspect-ratio: 1; }
.sbw-clock__ring { position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--line-firm); box-shadow: inset 0 0 40px -20px var(--glow-gold); }
.sbw-clock__ring::after { content: ""; position: absolute; inset: 18%; border-radius: 50%; border: 1px solid var(--line); }
.sbw-clock__hand { position: absolute; left: 50%; top: 12%; width: 2px; height: 38%; background: var(--gold); transform-origin: bottom center; animation: sbw-sweep 24s linear infinite; box-shadow: 0 0 12px var(--glow-gold); }
.sbw-clock__note { display: grid; gap: 1rem; }
.sbw-clock__title { font-size: clamp(1.8rem, 4vw, 2.8rem); }
.sbw-clock__list { display: grid; gap: 1rem; max-width: 52ch; }
.sbw-clock__list li { position: relative; padding-left: 1.8rem; color: var(--muted); }
.sbw-clock__list li::before { content: ""; position: absolute; left: 0; top: .62em; width: .7rem; height: .7rem; border: 2px solid var(--jade); border-radius: 50%; }

.sbw-signals { padding-block: var(--stack); border-top: 1px solid var(--line); }
.sbw-signals__intro { max-width: 50ch; margin-bottom: 2.4rem; }
.sbw-signals__kicker { color: var(--gold); margin-bottom: 1rem; }
.sbw-signals__title { font-size: clamp(1.8rem, 4vw, 2.8rem); }
.sbw-signals__lead { margin-top: 1rem; color: var(--muted); }
.sbw-signals__grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }
.sbw-signals__item { border-left: 3px solid var(--gold); padding: 1.2rem 1.4rem; background: linear-gradient(160deg, var(--panel-2), var(--panel)); color: var(--muted); font-size: 1.02rem; border-radius: 0 4px 4px 0; }

.sbw-support { padding-block: var(--stack); }
.sbw-support__title { font-size: clamp(1.8rem, 4vw, 2.8rem); margin-bottom: 1.2rem; }
.sbw-support__note { color: var(--muted); max-width: 60ch; margin-bottom: 2.2rem; }
.sbw-support__list { display: grid; gap: 0; border-top: 1px solid var(--line-gold); }
.sbw-support__row { display: grid; gap: .3rem; padding: 1.4rem 0; border-bottom: 1px solid var(--line); }
.sbw-support__name { font-family: var(--serif); font-size: 1.35rem; color: var(--cream); }
.sbw-support__detail { color: var(--muted); font-size: .95rem; }
.sbw-support__detail a { color: var(--gold); }
.sbw-support__foot { margin-top: 1.6rem; font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--faint); }

/* ---- 10  About --------------------------------------------------- */
.sbw-manifesto { padding-block: var(--stack); display: grid; gap: 2rem; }
.sbw-manifesto__title { font-size: clamp(2rem, 5.5vw, 3.8rem); max-width: 16ch; }
.sbw-manifesto__prose { display: grid; gap: 1.3rem; max-width: 54ch; color: var(--muted); font-size: clamp(1.05rem, 1rem + .4vw, 1.25rem); }

.sbw-values { padding-block: var(--stack); border-top: 1px solid var(--line); }
.sbw-values__title { font-size: clamp(1.8rem, 4vw, 2.8rem); margin-bottom: 2.6rem; }
.sbw-values__set { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
.sbw-values__block { border-top: 2px solid var(--gold); padding-top: 1.4rem; display: grid; gap: .8rem; }
.sbw-values__mark { color: var(--gold); font-size: 1.4rem; }
.sbw-values__name { font-size: 1.5rem; }
.sbw-values__copy { color: var(--muted); }

.sbw-ledger { padding-block: var(--stack); }
.sbw-ledger__title { font-size: clamp(1.8rem, 4vw, 2.8rem); margin-bottom: 2rem; }
.sbw-ledger__list { display: grid; gap: 0; border-top: 1px solid var(--line-gold); }
.sbw-ledger__row { display: grid; gap: .3rem; padding: 1.3rem 0; border-bottom: 1px solid var(--line); }
.sbw-ledger__row dt { font-size: .74rem; letter-spacing: .18em; text-transform: uppercase; color: var(--gold); font-weight: 700; }
.sbw-ledger__row dd { color: var(--cream); font-size: 1.08rem; }
.sbw-ledger__row dd a { color: var(--gold); }

/* ---- 11  FAQ ----------------------------------------------------- */
.sbw-questions { padding-block: var(--stack); }
.sbw-questions__title { font-size: clamp(2rem, 5vw, 3.4rem); margin-bottom: 2.6rem; }
.sbw-questions__column { border-top: 1px solid var(--line-gold); }
.sbw-questions__entry { border-bottom: 1px solid var(--line); }
.sbw-questions__q { display: grid; grid-template-columns: auto 1fr auto; gap: 1rem; align-items: baseline; padding: 1.6rem 0; cursor: pointer; list-style: none; font-family: var(--serif); font-size: clamp(1.2rem, 2.6vw, 1.7rem); line-height: 1.2; color: var(--cream); }
.sbw-questions__q::-webkit-details-marker { display: none; }
.sbw-questions__q::after { content: "+"; font-family: var(--sans); font-size: 1.6rem; color: var(--gold); transition: transform .4s var(--ease); justify-self: end; }
.sbw-questions__entry[open] .sbw-questions__q::after { transform: rotate(45deg); }
.sbw-questions__q-no { color: var(--jade); font-family: var(--sans); font-size: .78rem; letter-spacing: .12em; }
.sbw-questions__a { padding: 0 0 1.8rem; max-width: 60ch; }
.sbw-questions__a p { color: var(--muted); }
.sbw-questions__a a { color: var(--gold); }
.sbw-questions__entry[open] .sbw-questions__a { animation: sbw-unfold .45s var(--ease) both; }
.sbw-questions__foot { margin-top: 2.4rem; color: var(--muted); }
.sbw-questions__foot a { color: var(--gold); }

/* ---- 12  Contact ------------------------------------------------- */
.sbw-contact { padding-block: var(--stack); display: grid; gap: 3rem; }
.sbw-contact__aside { display: grid; gap: 1rem; align-content: start; }
.sbw-contact__title { font-size: clamp(1.8rem, 4vw, 2.8rem); max-width: 16ch; }
.sbw-contact__para { color: var(--muted); }
.sbw-contact__mail { font-family: var(--serif); font-size: clamp(1.2rem, 3vw, 1.7rem); color: var(--gold); text-decoration: none; border-bottom: 1px solid var(--line-gold); width: fit-content; padding-bottom: .2rem; }
.sbw-contact__mail:hover { border-color: var(--gold); }
.sbw-contact__hours { font-size: .88rem; color: var(--faint); }
.sbw-contact__reassure { margin-top: 1.2rem; border-left: 3px solid var(--jade); padding: 1rem 1.2rem; background: linear-gradient(160deg, var(--panel-2), var(--panel)); border-radius: 0 4px 4px 0; }
.sbw-contact__reassure-head { font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--jade); font-weight: 700; margin-bottom: .5rem; }
.sbw-contact__reassure-copy { font-size: .92rem; color: var(--muted); }

.sbw-contact__form { display: grid; gap: 1.5rem; }
.sbw-field { display: grid; gap: .5rem; }
.sbw-field__label { font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; font-weight: 700; color: var(--muted); }
.sbw-field__input { font: inherit; color: var(--cream); background: #100c1a; border: 1px solid var(--line-firm); padding: .9rem 1rem; border-radius: 4px; transition: border-color .3s var(--ease), box-shadow .3s var(--ease); }
.sbw-field__input::placeholder { color: var(--faint); }
.sbw-field__input:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(232,195,106,.16); }
.sbw-field__textarea { resize: vertical; min-height: 8rem; }
.sbw-field__selectwrap { position: relative; }
.sbw-field__selectwrap::after { content: ""; position: absolute; right: 1rem; top: 50%; width: .55rem; height: .55rem; border-right: 2px solid var(--gold); border-bottom: 2px solid var(--gold); transform: translateY(-70%) rotate(45deg); pointer-events: none; }
.sbw-field__select { width: 100%; font: inherit; color: var(--cream); background: #100c1a; border: 1px solid var(--line-firm); padding: .9rem 2.4rem .9rem 1rem; border-radius: 4px; appearance: none; }
.sbw-field__select:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 3px rgba(232,195,106,.16); }
.sbw-field__error { color: var(--ruby); font-size: .82rem; font-weight: 600; }
.sbw-field.is-invalid .sbw-field__input, .sbw-field.is-invalid .sbw-field__select { border-color: var(--ruby); }

.sbw-check { display: flex; align-items: flex-start; gap: .7rem; cursor: pointer; }
.sbw-check__box { margin-top: .2rem; width: 1.15rem; height: 1.15rem; accent-color: var(--gold); }
.sbw-check__text { font-size: .95rem; color: var(--muted); }
.sbw-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.sbw-contact__send { justify-self: start; }
.sbw-contact__status { padding: 1rem 1.2rem; border-radius: 4px; font-weight: 600; }
.sbw-contact__status.is-ok { background: linear-gradient(135deg, var(--jade), #2f7d5c); color: #04140d; }
.sbw-contact__status.is-bad { background: var(--ruby); color: #1a0207; }

/* ---- 13  Legal --------------------------------------------------- */
.sbw-legal { padding-block: var(--stack); display: grid; gap: 3rem; }
.sbw-legal__toc { display: grid; gap: 1rem; align-content: start; }
.sbw-legal__toc-head { color: var(--gold); }
.sbw-legal__toc-list { display: grid; gap: .55rem; counter-reset: toc; }
.sbw-legal__toc-list li { counter-increment: toc; }
.sbw-legal__toc-list a { color: var(--muted); text-decoration: none; display: flex; gap: .7rem; font-size: .95rem; }
.sbw-legal__toc-list a::before { content: counter(toc, decimal-leading-zero); color: var(--jade); font-variant-numeric: tabular-nums; }
.sbw-legal__toc-list a:hover { color: var(--gold); }
.sbw-legal__body { display: grid; gap: 2.6rem; }
.sbw-legal__section { display: grid; gap: 1rem; scroll-margin-top: 6rem; }
.sbw-legal__h { font-size: clamp(1.4rem, 3vw, 2rem); }
.sbw-legal__section p { color: var(--muted); max-width: 66ch; }
.sbw-legal__section a { color: var(--gold); }
.sbw-legal__list { display: grid; gap: .7rem; max-width: 66ch; }
.sbw-legal__list li { position: relative; padding-left: 1.4rem; color: var(--muted); }
.sbw-legal__list li::before { content: "—"; position: absolute; left: 0; color: var(--gold); }
.sbw-legal__aside { font-size: .9rem; color: var(--faint); font-style: italic; }
.sbw-legal__table { width: 100%; border-collapse: collapse; margin-top: .5rem; font-size: .92rem; }
.sbw-legal__table th, .sbw-legal__table td { text-align: left; padding: .8rem; border-bottom: 1px solid var(--line); vertical-align: top; }
.sbw-legal__table th { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.sbw-legal__table td { color: var(--muted); }

/* ---- 14  Trail / footer / gate / 404 ----------------------------- */
.sbw-trail { max-width: var(--shell); margin-inline: auto; padding: 1.4rem var(--edge) 0; }
.sbw-trail__list { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; font-size: .76rem; letter-spacing: .1em; text-transform: uppercase; }
.sbw-trail__link { color: var(--faint); text-decoration: none; }
.sbw-trail__link:hover { color: var(--gold); }
.sbw-trail__sep { color: var(--line-firm); margin-inline: .2rem; }
.sbw-trail__here { color: var(--cream); }

.sbw-colophon {
    margin-top: var(--stack); background: #070510; color: var(--cream);
    border-top: 1px solid var(--line-gold);
    padding: clamp(3.5rem, 8vw, 7rem) var(--edge) 2.5rem;
}
.sbw-colophon > * { max-width: var(--shell); margin-inline: auto; }
.sbw-colophon__masthead { display: grid; gap: 1.4rem; padding-bottom: 3rem; border-bottom: 1px solid var(--line); }
.sbw-colophon__issue { font-size: clamp(1.8rem, 5vw, 3.4rem); color: var(--cream); }
.sbw-colophon__statement { max-width: 50ch; color: var(--muted); }
.sbw-colophon__grid { display: grid; gap: 2.5rem; grid-template-columns: 1fr; padding-block: 3rem; }
.sbw-index__head { color: var(--gold); margin-bottom: 1.2rem; }
.sbw-index__list { display: grid; gap: .7rem; }
.sbw-index__list a { color: var(--muted); text-decoration: none; transition: color .3s var(--ease); }
.sbw-index__list a:hover { color: var(--gold); }
.sbw-index__prose { color: var(--faint); margin-bottom: 1rem; font-size: .95rem; }
.sbw-index__mail { color: var(--cream); text-decoration: none; border-bottom: 1px solid var(--line-gold); padding-bottom: .2rem; word-break: break-word; }
.sbw-index__mail:hover { border-color: var(--gold); color: var(--gold); }
.sbw-colophon__compliance { display: grid; gap: 1.2rem; padding-block: 2.6rem; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.sbw-colophon__badge { justify-self: start; background: linear-gradient(135deg, #F3D486, var(--gold-deep)); color: #241800; padding: .3rem .8rem; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; font-weight: 800; border-radius: 2px; }
.sbw-colophon__fine { color: var(--faint); font-size: .88rem; line-height: 1.7; max-width: 90ch; }
.sbw-colophon__fine strong { color: var(--cream); font-weight: 600; }
.sbw-colophon__baseline { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding-top: 2rem; font-size: .78rem; color: var(--faint); letter-spacing: .04em; }

.sbw-gate { position: fixed; inset: 0; z-index: 160; display: grid; place-items: center; padding: var(--edge); }
.sbw-gate[hidden] { display: none; }
.sbw-gate__scrim { position: absolute; inset: 0; background: rgba(4,3,9,.86); backdrop-filter: blur(6px); animation: sbw-veil .4s var(--ease) both; }
.sbw-gate__card {
    position: relative; z-index: 1; width: 100%; max-width: 34rem; text-align: left;
    padding: clamp(2rem, 5vw, 3.4rem); border-radius: 10px;
    background: linear-gradient(180deg, var(--panel-2), var(--panel));
    border: 1px solid var(--line-gold);
    box-shadow: 0 60px 120px -40px #000, 0 0 90px -44px var(--glow-gold);
    animation: sbw-gate-in .55s var(--ease) both;
}
.sbw-gate__kicker { color: var(--gold); margin-bottom: 1.2rem; }
.sbw-gate__title { font-size: clamp(1.7rem, 4.5vw, 2.6rem); margin-bottom: 1.2rem; }
.sbw-gate__copy { color: var(--muted); margin-bottom: 2rem; }
.sbw-gate__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.6rem; }
.sbw-gate__note { font-size: .8rem; color: var(--faint); line-height: 1.6; }

/* dismissible compliance notice */
.sbw-disclaimer {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 70;
    display: flex; align-items: center; gap: 1rem 1.5rem; flex-wrap: wrap;
    padding: .9rem clamp(1rem, 4vw, 2.5rem);
    background: rgba(7, 5, 16, .94);
    -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
    border-top: 1px solid var(--line-gold);
    box-shadow: 0 -20px 50px -30px #000;
    animation: sbw-disc-rise .5s var(--ease) both;
}
.sbw-disclaimer[hidden] { display: none; }
.sbw-disclaimer__text { flex: 1 1 20rem; font-size: .82rem; line-height: 1.55; color: var(--muted); }
.sbw-disclaimer__text strong { color: var(--cream); font-weight: 600; }
.sbw-disclaimer__flag { display: inline-grid; place-items: center; min-width: 2.2rem; padding: .1rem .45rem; margin-right: .3rem; background: linear-gradient(135deg, #F3D486, var(--gold-deep)); color: #241800; border-radius: 2px; font-weight: 800; font-size: .74rem; vertical-align: middle; }
.sbw-disclaimer__ok {
    flex: 0 0 auto; cursor: pointer; white-space: nowrap;
    font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 800;
    padding: .7rem 1.3rem; border-radius: 3px; border: 1px solid var(--gold);
    color: #241800; background: linear-gradient(135deg, #F3D486, var(--gold) 45%, var(--gold-deep));
    transition: filter .3s var(--ease), transform .3s var(--ease);
}
.sbw-disclaimer__ok:hover { filter: brightness(1.06); transform: translateY(-1px); }
@keyframes sbw-disc-rise { from { opacity: 0; transform: translateY(100%); } to { opacity: 1; transform: none; } }

.sbw-lost { padding-block: clamp(4rem, 12vw, 10rem); display: grid; gap: 2.5rem; }
.sbw-lost__figure { font-family: var(--serif); font-size: clamp(6rem, 30vw, 18rem); line-height: .8; color: var(--panel-3); text-shadow: 0 0 60px var(--glow-gold); }
.sbw-lost__text { display: grid; gap: 1.2rem; }
.sbw-lost__kicker { color: var(--gold); font-size: .76rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 700; }
.sbw-lost__title { font-size: clamp(1.8rem, 5vw, 3.2rem); max-width: 20ch; }
.sbw-lost__copy { color: var(--muted); max-width: 54ch; }
.sbw-lost__actions { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: .6rem; }

/* ---- Keyframes --------------------------------------------------- */
@keyframes sbw-veil { from { opacity: 0; } to { opacity: 1; } }
@keyframes sbw-sheet-rise { from { opacity: 0; transform: translateY(1.4rem) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes sbw-gate-in { from { opacity: 0; transform: translateY(1.6rem) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes sbw-sweep { to { transform: rotate(360deg); } }
@keyframes sbw-unfold { from { opacity: 0; transform: translateY(-.5rem); } to { opacity: 1; transform: none; } }
@keyframes sbw-pulse { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.7); } }

/* ---- 15  Responsive ---------------------------------------------- */
@media (min-width: 40em) {
    .sbw-collection__grid { grid-template-columns: repeat(2, 1fr); }
    .sbw-signals__grid { grid-template-columns: repeat(2, 1fr); }
    .sbw-values__set { grid-template-columns: repeat(3, 1fr); }
    .sbw-panels__field { grid-template-columns: repeat(2, 1fr); }
    .sbw-featured__row { grid-template-columns: auto 1fr auto; }
    .sbw-creed__row { grid-template-columns: auto 1fr; }
    .sbw-lost { grid-template-columns: auto 1fr; align-items: center; }
}

@media (min-width: 64em) {
    .sbw-masthead__nav { display: block; }
    .sbw-burger { display: none; }

    .sbw-overture__frame { grid-template-columns: repeat(12, 1fr); align-items: start; column-gap: 2rem; }
    .sbw-overture__eyebrow { grid-column: 1 / -1; }
    .sbw-overture__title { grid-column: 1 / 9; grid-row: 2; position: relative; z-index: 2; }
    .sbw-overture__figure { grid-column: 7 / 13; grid-row: 2 / span 2; z-index: 1; align-self: start; margin-top: 2rem; }
    .sbw-overture__foot { grid-column: 1 / 8; grid-row: 3; z-index: 2; }

    .sbw-composition { grid-template-columns: repeat(2, 1fr); }
    .sbw-composition--verso .sbw-composition__figure { order: 2; }

    .sbw-collection__grid { grid-template-columns: repeat(3, 1fr); }
    .sbw-signals__grid { grid-template-columns: repeat(2, 1fr); }

    .sbw-timeline__track { grid-template-columns: repeat(4, 1fr); }
    .sbw-timeline__stop { border-left: 0; border-top: 2px solid var(--line-firm); padding: 2.4rem 1.5rem 0 0; }
    .sbw-timeline__stop:last-child { border-top-color: var(--line-firm); }
    .sbw-timeline__dot { left: -1px; top: -8px; }

    .sbw-panels__field { grid-template-columns: repeat(3, 1fr); align-items: start; }
    .sbw-panels__card--b { transform: translateY(2.6rem); }
    .sbw-panels__card--c { transform: translateY(1.2rem); }
    .sbw-panels__card--e { transform: translateY(2.6rem); }
    .sbw-panels__card--f { transform: translateY(1.2rem); }
    .sbw-panels__card--b:hover, .sbw-panels__card--c:hover,
    .sbw-panels__card--e:hover, .sbw-panels__card--f:hover { transform: translateY(-6px); }

    .sbw-responsible-story { grid-template-columns: 1fr 2fr; gap: 3rem; }
    .sbw-clock { grid-template-columns: auto 1fr; }
    .sbw-manifesto { grid-template-columns: 1fr 1fr; align-items: start; }
    .sbw-contact { grid-template-columns: 1fr 1.4fr; gap: 4rem; align-items: start; }
    .sbw-legal { grid-template-columns: 16rem 1fr; gap: 4rem; align-items: start; }
    .sbw-legal__toc { position: sticky; top: 6rem; }
    .sbw-preface { grid-template-columns: 12rem 1fr; }
    .sbw-values__set { grid-template-columns: repeat(3, 1fr); }
}

@media (min-width: 80em) {
    .sbw-signals__grid { grid-template-columns: repeat(4, 1fr); }
}

/* ---- Focus / motion / print -------------------------------------- */
:where(a, button, summary, input, select, textarea):focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 3px;
    border-radius: 2px;
}

.sbw-body.sbw-locked { overflow: hidden; }

[data-sbw-reveal] { opacity: 0; transform: translateY(1.4rem); }
[data-sbw-reveal].is-seen { opacity: 1; transform: none; transition: opacity .8s var(--ease), transform .8s var(--ease); }

@media (prefers-reduced-motion: reduce) {
    html.sbw-root { scroll-behavior: auto; }
    *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
    [data-sbw-reveal] { opacity: 1; transform: none; }
    .sbw-clock__hand { animation: none; transform: rotate(38deg); }
    .sbw-plate__live-dot { animation: none; }
}

@media print {
    .sbw-masthead, .sbw-colophon, .sbw-gate, .sbw-reader, .sbw-skip { display: none !important; }
    body.sbw-body { background: #fff; color: #000; }
}