/* Shared paper style across registered design families and topics. Imagery comes only from the shared registry. */
@layer themes {
  html[data-page-style="paper"] {
    --brand: #0b2c56;
    --brand-deep: #071e3b;
    --accent: #0b2c56;
    --accent-2: #234c76;
    --gold: #e7bf62;
    --paper: #fff6e2;
    --paper-2: #fffbf0;
    --ink: #10263f;
    --ink-soft: #31455a;
    --muted: #4a5867;
    --line: #dacaa6;
    --cta: #0b2c56;
    --cta-ink: #fffaf0;
    --brand-glow: none;
    --foot-bg: #0b2c56;
    --foot-veil-image: none;
    --foot-veil-opacity: 0;
    --body-wash-cool: transparent;
    --body-wash-warm: transparent;
    --form-field-surface: #fff;
    /* Gap under the full-bleed kit title bar, before the Email address field.
       This was referenced by .form-title but never defined. An undefined var() with no
       fallback voids the whole declaration, which silently dropped the negative side
       margins too and left the heading inset. Keep it equal to the base
       `.form-title { margin: 0 0 1.5rem }` spacing it overrides. */
    --form-input-space: 1.5rem;
    --preview-surface: #fff;
    --preview-backdrop: rgb(7 30 59 / .7);
  }
}
/* One continuous paper field lets the masked hero dissolve into the page without a seam. */
html[data-page-style="paper"] body {
  background: #ffedac url("/assets/shared/paper-tile_codex.png") left top / 960px 960px repeat;
}
html[data-page-style="paper"] .player-note { background:var(--brand); color:var(--cta-ink); padding:.65rem 1.2rem; font-size:.8rem; }
html[data-page-style="paper"] .hero { min-height:clamp(39rem,56.28vw,68rem); padding:0; background:transparent; }
html[data-page-style="paper"] .hero::before { background:var(--img-hero) center / 100% 100% no-repeat; opacity:1; mask-image:url("/assets/shared/xf/hero-transition-mask.svg"); -webkit-mask-image:url("/assets/shared/xf/hero-transition-mask.svg"); mask-size:100% 100%; -webkit-mask-size:100% 100%; mask-repeat:no-repeat; -webkit-mask-repeat:no-repeat; }
html[data-page-style="paper"] .hero > .wrap { width:100%; min-height:inherit; display:grid; align-items:center; }
html[data-page-style="paper"] .hero-top { width:min(66%,56rem); margin:0 auto; gap:1.1rem; padding-block:4.5rem 0; }
html[data-page-style="paper"] .hero-top > .brand { position:absolute; top:1.25rem; left:50%; transform:translateX(-50%); zoom:1; }
html[data-page-style="paper"] .brand .wordmark { font-size:clamp(1.65rem,3.3vw,2.5rem); color:var(--cta-ink); text-shadow:none; }
html[data-page-style="paper"] .brand-rule { color:var(--gold); }
html[data-page-style="paper"] .hero-top > .brand > .hero-kicker { zoom:1; color:var(--cta-ink); font-size:.7rem; letter-spacing:.14em; }
html[data-page-style="paper"] .hero-headline { width:100%; margin:0 0 1.3rem; padding:0; font-size:clamp(2.7rem,5.45vw,5.1rem); line-height:1.04; color:var(--brand); }
html[data-page-style="paper"] .hero-question { width:min(39rem,96%); margin:.2rem 0; font-size:clamp(1.05rem,1.55vw,1.4rem); font-weight:500; line-height:1.35; }
html[data-page-style="paper"] .hero-actions { gap:clamp(2rem,4vw,4rem); margin:.55rem 0; width:100%; }
html[data-page-style="paper"] .hero-actions > :is(a,button) { min-height:3.5rem; display:inline-flex; align-items:center; justify-content:center; padding:.7rem 1.6rem; border-radius:999px; border:2px solid var(--brand); font-family:var(--font-body); font-size:.92rem; font-weight:750; letter-spacing:.09em; text-transform:uppercase; text-decoration:none; }
html[data-page-style="paper"] .hero-actions .video-link { min-width:min(100%,17.5rem); background:var(--brand); color:var(--cta-ink); }
html[data-page-style="paper"] .hero-actions .video-link::after { content:none; }
html[data-page-style="paper"] .hero-actions .kit-cta { background:transparent; color:var(--brand); }
html[data-page-style="paper"] .cta-supporting-note { width:100%; margin:.15rem 0 0; text-align:center; font-size:.85rem; font-weight:750; letter-spacing:.15em; text-transform:uppercase; color:var(--ink); }
html[data-page-style="paper"] a.cta-supporting-note { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.35rem; min-height:2.75rem; text-decoration:none; }
html[data-page-style="paper"] a.cta-supporting-note::after { content:"↓"; display:block; line-height:1; }
html[data-page-style="paper"] a.cta-supporting-note:focus-visible { outline:3px solid var(--brand); outline-offset:3px; border-radius:.25rem; }
html[data-page-style="paper"] .hero-actions a:focus-visible { outline:3px solid var(--brand); outline-offset:5px; }
html[data-page-style="paper"] .topic-section { padding-block:3rem; }
html[data-page-style="paper"] #topic-heading { font-family:var(--font-body); font-size:clamp(2rem,3.4vw,3rem); }
html[data-page-style="paper"] .topic-list a { border-radius:.35rem; background:var(--paper-2); box-shadow:0 8px 18px #071e3b12; }
html[data-page-style="paper"] .topic-list a[aria-current="true"] { border-color:var(--brand); background:#f6df9e; }
html[data-page-style="paper"] .study,
html[data-page-style="paper"] .form-card { border-radius:.45rem; background:var(--paper-2); border:1px solid var(--line); }
/* Full-bleed kit title bar. The base card padding is a fluid cqi clamp, and it cannot be handed to the bar through a custom property: cqi resolves at the use site, so on the child it measures .form-card instead of the wrap and the bleed still missed by 1.4px. Paper therefore pins the inline inset to 1.6rem and drops the block-start inset, and the bleed is that inset plus the border, so the bar lands exactly on the card edge at every width. The block-end inset stays the base clamp, leaving the vertical rhythm unchanged. */
html[data-page-style="paper"] .form-card { --form-card-line:1px; --form-card-radius:.45rem; --form-card-bleed:calc(1.6rem + var(--form-card-line)); padding:0 1.6rem clamp(1.2rem,3.2cqi,1.75rem); border-width:var(--form-card-line); border-radius:var(--form-card-radius); }
html[data-page-style="paper"] .form-title { background:var(--brand); padding:1.2rem 1.6rem; margin:calc(-1 * var(--form-card-line)) calc(-1 * var(--form-card-bleed)) var(--form-input-space); border-radius:var(--form-card-radius) var(--form-card-radius) 0 0; }
html[data-page-style="paper"] .form-title h2 { color:var(--cta-ink); }
html[data-page-style="paper"] .sample-sheet { background:#f7e7bd; border-color:var(--gold); }
html[data-page-style="paper"] .site-foot { background:var(--brand); border-top:var(--footer-divider-width) solid var(--gold); }
html[data-page-style="paper"] .site-foot .foot-brand h2,
html[data-page-style="paper"] .site-foot .foot-brand p,
html[data-page-style="paper"] .site-foot .foot-transcript-link,
html[data-page-style="paper"] .site-foot .foot-verse,
html[data-page-style="paper"] .site-foot cite { color:var(--cta-ink); }
html[data-page-style="paper"] .site-foot .mini-rule,
html[data-page-style="paper"] .site-foot a { color:var(--gold); }
@media(max-width:680px) {
  html[data-page-style="paper"] .hero { min-height:max(43rem,160vw); }
  html[data-page-style="paper"] .hero-top { width:72%; gap:.85rem; padding-block-start:3.3rem; }
  html[data-page-style="paper"] .hero-headline { margin-bottom:1.05rem; font-size:clamp(2.05rem,8.4vw,3.5rem); line-height:1.04; }
  html[data-page-style="paper"] .hero-question { width:100%; font-size:1.04rem; line-height:1.35; }
  html[data-page-style="paper"] .hero-actions { flex-direction:column; gap:.9rem; margin:.3rem 0; }
  html[data-page-style="paper"] .hero-actions > :is(a,button) { width:100%; padding:.65rem .5rem; font-size:.76rem; min-height:3.2rem; letter-spacing:.055em; }
  html[data-page-style="paper"] .cta-supporting-note { font-size:.75rem; letter-spacing:.1em; }
  html[data-page-style="paper"] .hero-top > .brand { top:1.1rem; }
  /* No form-title override needed here: the bleed is a fixed inset, so it holds at every width. */
}

@media(max-width:680px) {
  html[data-page-style="paper"] .hero-top > .brand { top:.35rem; }
  html[data-page-style="paper"] .brand .wordmark { font-size:1.5rem; }
  html[data-page-style="paper"] .brand-rule { margin-block:.08rem; }
  html[data-page-style="paper"] .brand-rule svg { width:.5rem; height:.5rem; }
  html[data-page-style="paper"] .hero-top > .brand > .hero-kicker { margin-top:.1rem; font-size:.6rem; }
}
@media(min-width:681px) and (max-width:1040px) {
  html[data-page-style="paper"] .hero-top { padding-block-start:6rem; gap:.85rem; }
  html[data-page-style="paper"] .hero-top > .brand { top:.35rem; }
  html[data-page-style="paper"] .brand .wordmark { font-size:1.5rem; }
  html[data-page-style="paper"] .brand-rule { margin-block:.08rem; }
  html[data-page-style="paper"] .brand-rule svg { width:.5rem; height:.5rem; }
  html[data-page-style="paper"] .hero-top > .brand > .hero-kicker { margin-top:.1rem; font-size:.6rem; }
}

@media(min-width:681px) and (max-width:900px) { html[data-page-style="paper"] .hero-actions { flex-direction:column; gap:1rem; } html[data-page-style="paper"] .hero-actions > :is(a,button) { width:min(100%,24rem); } }

/* Local graphic/layout pass. Topic, chapter and delivery purposes stay separate. */
.topic-stamp, .kit-thumbnails, .kit-trust, .kit-inline-cta, .kit-sticky { display:none; }
.kit-sticky[hidden] { display:none!important; }
html.has-kit-sticky body { padding-bottom:var(--kit-sticky-height,5rem); }
/* The pale sheet fills the content-sized card; text stays inside its torn edges. */
html[data-page-style="paper"] {
  --card-paper:url("/assets/shared/xf/parchment-card.svg");
}
html[data-page-style="paper"] .topic-list { padding:.7rem .3rem; gap:1.8rem; }
html[data-page-style="paper"] .topic-list a {
  display:flex; flex-direction:column; gap:.8rem; grid-row:auto; position:relative;
  isolation:isolate; padding:2rem 2rem 2.15rem; min-height:17rem; min-width:0;
  border:0; border-radius:0; background-color:transparent;
  box-shadow:none; filter:drop-shadow(0 7px 8px rgb(7 30 59 / .13));
  transform:rotate(var(--card-rotation)); transition:transform .2s ease,filter .2s ease;
}
html[data-page-style="paper"] .topic-list a::before {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:var(--card-paper) center / 100% 100% no-repeat;
}
html[data-page-style="paper"] .topic-list a::after { content:none; }
html[data-page-style="paper"] .topic-list a:nth-child(1) { --card-rotation:-1.2deg; }
html[data-page-style="paper"] .topic-list a:nth-child(2) { --card-rotation:.9deg; }
html[data-page-style="paper"] .topic-list a:nth-child(3) { --card-rotation:-.6deg; }
html[data-page-style="paper"] .topic-list a[aria-current="true"] { background:transparent; box-shadow:none; filter:drop-shadow(0 7px 9px rgb(7 30 59 / .2)); }
html[data-page-style="paper"] .topic-list a[aria-current="true"] .topic-stamp { background:var(--brand); color:var(--cta-ink); }
html[data-page-style="paper"] .topic-list a:is(:hover,:focus-visible) { transform:rotate(0) translateY(-4px); filter:drop-shadow(0 11px 12px rgb(7 30 59 / .19)); }
html[data-page-style="paper"] .topic-list a:focus-visible { outline:3px solid var(--brand); outline-offset:5px; }
html[data-page-style="paper"] .topic-stamp { display:block; align-self:flex-start; border:1px solid var(--brand); border-radius:.2rem; padding:.3rem .6rem; font:700 .67rem/1.2 var(--font-body); letter-spacing:.08em; text-transform:uppercase; }
html[data-page-style="paper"] .topic-list .topic-title { min-block-size:0; min-width:0; width:100%; line-height:1.12; text-wrap:pretty; }
html[data-page-style="paper"] .topic-list .topic-description { max-width:28ch; margin-top:0; }
html[data-page-style="paper"] #study-form input:is([name="email"],[name="name"]) { border-color:color-mix(in srgb,var(--brand) 25%,transparent); }
html[data-page-style="paper"] #study-form input:is([name="email"],[name="name"]):focus { border-color:DodgerBlue; outline:2px solid color-mix(in srgb,DodgerBlue 25%,transparent); outline-offset:1px; }
.field-prompt { display:none; }
html[data-page-style="paper"] .field:has(input[name="email"]) { position:relative; }
html[data-page-style="paper"] .field input[name="email"]::placeholder { color:transparent; }
html[data-page-style="paper"] .field:has(input[name="email"]:placeholder-shown) .field-prompt { display:block; position:absolute; left:.75rem; right:.75rem; font:inherit; font-weight:700; color:var(--muted); pointer-events:none; }
html[data-page-style="paper"] .field-required { font-weight:300; }
html[data-page-style="paper"] .kit-thumbnails { display:block; margin-block:.65rem .5rem; min-width:0; }
.kit-thumbnails__label { margin:0; text-align:center; font:700 .9rem/1.3 var(--font-body); color:var(--brand); }
.kit-fan { position:relative; width:min(100%,24rem); aspect-ratio:1.6; margin:.5rem auto; isolation:isolate; }
.kit-fan__sheet { position:absolute; top:8%; left:50%; width:40%; height:auto; aspect-ratio:17/22; object-fit:contain; background:var(--preview-surface,#fff); border:1px solid var(--line); box-shadow:0 4px 10px rgb(7 30 59 / .15); pointer-events:none; user-select:none; }
.kit-fan__sheet--front { z-index:3; transform:translateX(-50%); }
.kit-fan__sheet--left { z-index:2; transform:translateX(-95%) rotate(-13deg); }
.kit-fan__sheet--right { z-index:1; transform:translateX(-5%) rotate(13deg); }
.kit-sheet-labels { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.4rem; color:var(--ink-soft); font:.68rem/1.35 var(--font-body); text-align:center; }
.kit-sheet-labels strong,.kit-sheet-labels span span { display:block; }
.kit-sheet-labels strong { margin-bottom:.2rem; color:var(--brand); font-size:.78rem; }
html[data-page-style="paper"] .kit-trust { display:flex; flex-wrap:wrap; justify-content:center; gap:.4rem .9rem; margin:.35rem 0 0; padding:0; list-style:none; color:var(--ink-soft); font:.75rem/1.4 var(--font-body); }
.kit-trust li::before { content:"\2713"; margin-right:.3rem; color:var(--brand); font-weight:700; }
html[data-page-style="paper"] .player .play { inset:66.6667% auto auto 50%; translate:-50% -50%; }
html[data-page-style="paper"] .player::after { display:none; }
html[data-page-style="paper"] .video-chapter-link { display:inline-block; padding:.4rem .8rem; margin-top:.5rem; border:1px solid var(--line); border-radius:var(--radius-pill); background:var(--paper-2); transition:transform .25s var(--ease); }
html[data-page-style="paper"] .video-chapter-link::after { content:""; inset:-2px; height:auto; padding:2px; border-radius:inherit; background:var(--rotating-border-gradient); background-size:100% 100%; transform:none; opacity:0; mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask-composite:exclude; animation:player-border-rotate var(--pill-border-rotation) linear infinite; animation-play-state:paused; transition:opacity .25s var(--ease); }
html[data-page-style="paper"] .video-chapter:is(:hover,:focus-visible) .video-chapter-link { color:var(--brand); transform:scale(1.15); }
html[data-page-style="paper"] .video-chapter:is(:hover,:focus-visible) .video-chapter-link::after { transform:none; opacity:1; animation-play-state:running; }
html[data-page-style="paper"] .kit-inline-cta { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.6rem 1rem; padding:1.2rem .5rem 0; color:var(--ink-soft); font:.95rem/1.4 var(--font-body); }
html[data-page-style="paper"] .share-section { padding-block-start:var(--share-section-space); padding-block-end:max(16rem,var(--share-section-space)); }
.kit-scroll-action { display:inline-flex; justify-content:center; align-items:center; gap:.5rem; min-height:2.8rem; padding:.55rem 1rem; border:1px solid var(--brand); border-radius:var(--radius-pill); background:var(--brand); color:var(--cta-ink); font:700 .9rem/1.3 var(--font-body); cursor:pointer; }
.kit-scroll-action:focus-visible { outline:3px solid DodgerBlue; outline-offset:4px; }
html[data-page-style="paper"] .kit-sticky { display:flex; align-items:center; justify-content:center; gap:.7rem 1.2rem; position:fixed; z-index:40; bottom:0; inset-inline:0; padding:.75rem max(1rem,env(safe-area-inset-right)) calc(.75rem + env(safe-area-inset-bottom)); border-top:1px solid var(--gold); background:var(--paper-2); box-shadow:0 -4px 18px rgb(7 30 59 / .12); color:var(--brand); font:600 .95rem/1.3 var(--font-body); }
.kit-sticky__close { flex-shrink:0; border:0; color:var(--brand); background:transparent; width:2.75rem; height:2.75rem; cursor:pointer; font:1.6rem/1 var(--font-body); }
@media(max-width:1040px) { html[data-page-style="paper"] .topic-list { gap:1.15rem; } html[data-page-style="paper"] .topic-list a { min-height:0; padding:1.85rem 2rem 2rem; } html[data-page-style="paper"] .topic-list .topic-description { max-width:38ch; } }
@media(max-width:680px) {
  html[data-page-style="paper"] .topic-section { width:calc(100% - var(--gutter)*2); }
  html[data-page-style="paper"] .topic-list a { padding:1.75rem 1.6rem 1.9rem; }
  html[data-page-style="paper"] .topic-list .topic-title { font-size:clamp(1.6rem,5.8vw,1.95rem); }
  html[data-page-style="paper"] .player .play { width:3rem; height:3rem; }
  html[data-page-style="paper"] .kit-sticky { gap:.4rem .6rem; justify-content:space-between; }
  .kit-sticky__intro { display:none; }
  .kit-sticky .kit-scroll-action { flex:1; font-size:.82rem; }
}
@media(prefers-reduced-motion:reduce) {
  html[data-page-style="paper"] .topic-list a { transform:none!important; transition:none; }
  html[data-page-style="paper"] .video-chapter-link { transition:none; }
  html[data-page-style="paper"] .video-chapter-link::after { animation:none!important; transition:none; }
  html[data-page-style="paper"] .video-chapter:is(:hover,:focus-visible) .video-chapter-link { transform:none; }
}






/* Agent: Codex | Model: GPT-6 | Thinking: not exposed | Date: 2026-1005 */