/* Almanac — runtime CSS for 14-layout 1:1 spec E reconstruction
 *
 * Source of truth: ~/Downloads/almanac-design-spec.html, sections E1-E14.
 * Production-notes drive all positions, fonts, sizes, colors, content limits.
 * Spec uses Outline Text vectorized to <path> so text x/y come from layout
 * conventions + image positions, not from <text x= y=>.
 *
 * Class naming: alm-<KEY>-<slot>
 *   cpr = E1  cover-photo-right
 *   cpf = E2  cover-photo-fullright
 *   ctb = E3  chapter-title-brown
 *   ctc = E4  chapter-title-cream
 *   hbi = E5  headline-bottom-image
 *   smg = E6  six-metric-grid
 *   tct = E7  three-col-text
 *   lil = E8  left-image-list
 *   qa  = E9  quote-attribution
 *   cfi = E10 cream-full-image
 *   tih = E11 top-image-headline
 *   sm  = E12 single-mockup
 *   tmg = E13 three-mockup-grid
 *   cpl = E14 cover-photo-left
 *
 * All rules force !important to survive saved-deck markup gaps. Selectors
 * scoped to [data-template="almanac"] so this file is inert on other tpls.
 *
 * Loaded by editor.html / viewer.html / dashboard.html.
 * (Rainy 2026-06-12 — full 1:1 spec E reconstruction.)
 */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:wght@400;500;600;700;800&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Sans+Condensed:wght@400;500;600;700&display=swap');

/* ─── Design tokens ─────────────────────────────────────────────────── */
[data-template="almanac"] {
  --alm-brown:        #3D1919 !important;
  --alm-cream:        #FFF4E8 !important;
  --alm-pink:         #F4CECD !important;
  --alm-blush:        #F2C9E3 !important;
  --alm-mauve:        #BF6FA0 !important;
  --alm-sky:          #C9D3E5 !important;
  --alm-rose:         #A26362 !important;
  --alm-image-grey:   transparent !important; /* was #D9D9D9 — placeholder rect should be invisible in production, only the dev design-spec used the gray to mark image slots (Rainy 2026-06-25) */

  --alm-font-serif:   'IBM Plex Serif', Georgia, serif !important;
  --alm-font-sans:    'IBM Plex Sans', system-ui, sans-serif !important;
  --alm-font-cond:    'IBM Plex Sans Condensed', 'IBM Plex Sans', system-ui, sans-serif !important;
}

/* ─── Slide chrome ─────────────────────────────────────────────────────
   Two render contexts with different design-canvas placements:
   - Main editor canvas: design canvas = `.slide-scale-inner` (1920×1080 +
     transform-scaled). Slide section is responsive 100% × 100%.
   - Sidebar thumbnails / viewer: NO .slide-scale-inner wrapper. The
     section.slide IS the 1920×1080 design canvas (transformed at the
     slide level for thumb scaling).
   So bg + sizing apply to whichever wrapper exists. (Rainy 2026-06-15.) */
[data-template="almanac"].slide,
[data-template="almanac"] .slide {
  font-family: var(--alm-font-serif) !important; color: var(--alm-brown) !important;
  position: relative !important; overflow: hidden !important;
}

/* Default cream bg + 1920×1080 sizing + card silhouette on whichever
   wrapper IS the design canvas in this context. */
[data-template="almanac"].slide:not(:has(> .slide-scale-inner)),
[data-template="almanac"] .slide:not(:has(> .slide-scale-inner)) {
  background: var(--alm-cream) !important;
  border-radius: 12px !important;
  box-shadow: 0 20px 80px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,0,0,0.06) !important;
}
[data-template="almanac"] .slide > .slide-scale-inner,
[data-template="almanac"].slide > .slide-scale-inner {
  width: 1920px !important; height: 1080px !important;
  position: relative !important; overflow: hidden !important;
  background: var(--alm-cream) !important;
  border-radius: 12px !important;
  box-shadow: 0 20px 80px rgba(0,0,0,0.25), 0 0 0 1px rgba(0,0,0,0.06) !important;
}

/* Brown-bg layouts (E1 E2 E3 E5 E7 E8 E9 E11 E12 E14) — apply to
   .slide-scale-inner if present, else direct on .slide. */
[data-template="almanac"][data-layout="cover-photo-right"] > .slide-scale-inner,
[data-template="almanac"][data-layout="cover-photo-fullright"] > .slide-scale-inner,
[data-template="almanac"][data-layout="chapter-title-brown"] > .slide-scale-inner,
[data-template="almanac"][data-layout="headline-bottom-image"] > .slide-scale-inner,
[data-template="almanac"][data-layout="three-col-text"] > .slide-scale-inner,
[data-template="almanac"][data-layout="left-image-list"] > .slide-scale-inner,
[data-template="almanac"][data-layout="quote-attribution"] > .slide-scale-inner,
[data-template="almanac"][data-layout="top-image-headline"] > .slide-scale-inner,
[data-template="almanac"][data-layout="single-mockup"] > .slide-scale-inner,
[data-template="almanac"][data-layout="cover-photo-left"] > .slide-scale-inner { background: var(--alm-brown) !important; }
[data-template="almanac"][data-layout="cover-photo-right"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="cover-photo-fullright"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="chapter-title-brown"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="headline-bottom-image"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="three-col-text"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="left-image-list"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="quote-attribution"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="top-image-headline"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="single-mockup"]:not(:has(> .slide-scale-inner)),
[data-template="almanac"][data-layout="cover-photo-left"]:not(:has(> .slide-scale-inner)) { background: var(--alm-brown) !important; }

/* Pink-bg layout (E6 only) */
[data-template="almanac"][data-layout="six-metric-grid"] > .slide-scale-inner { background: var(--alm-pink) !important; }
[data-template="almanac"][data-layout="six-metric-grid"]:not(:has(> .slide-scale-inner)) { background: var(--alm-pink) !important; }

/* Cream-bg layouts default already cream — E4 / E10 / E13 implicit */

[data-template="almanac"] h1, [data-template="almanac"] h2, [data-template="almanac"] h3, [data-template="almanac"] h4 { margin: 0 !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; letter-spacing: -0.04em !important; line-height: 1.0 !important; }
[data-template="almanac"] p, [data-template="almanac"] li { margin: 0 !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; letter-spacing: -0.01em !important; line-height: 1.35 !important; }

/* ─── Corner chrome (TOPIC · DATE · page #) — every layout ───────────
   Width auto + inline-block + padding so corners size to their text
   (typically 6-10 chars) instead of grabbing the full 480px. Earlier
   fixed-width caused AI-generated layout text to render BEHIND a
   transparent 480px corner box, looking like text overlap when in fact
   the corner just wasn't blocking. (Rainy 2026-06-12 — agenda slide.)
   z-index 5 keeps corners above layout content (z-index 3). */
[data-template="almanac"] .alm-corner-tl { position: absolute !important; left: 64px !important; top: 64px !important; width: auto !important; max-width: 480px !important; padding: 4px 8px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.08em !important; color: #3D1919; text-transform: uppercase !important; z-index: 5 !important; }
[data-template="almanac"] .alm-corner-tr { position: absolute !important; right: 64px !important; top: 64px !important; left: auto !important; width: auto !important; max-width: 480px !important; padding: 4px 8px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.08em !important; color: #3D1919; text-transform: uppercase !important; text-align: right !important; z-index: 5 !important; }
[data-template="almanac"] .alm-corner-bl { position: absolute !important; left: 64px !important; bottom: 64px !important; top: auto !important; width: auto !important; max-width: 480px !important; padding: 4px 8px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.08em !important; color: #3D1919; text-transform: uppercase !important; z-index: 5 !important; }
[data-template="almanac"] .alm-corner-br { position: absolute !important; right: 64px !important; bottom: 64px !important; left: auto !important; top: auto !important; width: auto !important; max-width: 480px !important; padding: 4px 8px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.08em !important; color: #3D1919; text-transform: uppercase !important; text-align: right !important; z-index: 5 !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E1  cover-photo-right  (brown bg + photo right 856×952 at 1000,64)  */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-cpr-sub { position: absolute !important; left: 120px !important; top: 280px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 32px !important; letter-spacing: 0.01em !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpr-title { position: absolute !important; left: 120px !important; top: 340px !important; width: 760px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 120px !important; letter-spacing: -0.04em !important; line-height: 1.0 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpr-body { position: absolute !important; left: 120px !important; top: 850px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpr-body-2 { position: absolute !important; left: 120px !important; top: 900px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpr-photo { position: absolute !important; left: 1000px !important; top: 64px !important; width: 856px !important; height: 952px !important; background: transparent !important; overflow: hidden !important; border-radius: 8px !important; z-index: 3 !important; }
[data-template="almanac"][data-layout="cover-photo-right"] .alm-cpr-photo img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E2  cover-photo-fullright  (brown bg + photo 936×1080 full-height)  */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-cpf-body { position: absolute !important; left: 64px !important; top: 200px !important; width: 880px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpf-body-2 { position: absolute !important; left: 64px !important; top: 240px !important; width: 880px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpf-title { position: absolute !important; left: 64px !important; top: 320px !important; width: 880px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 100px !important; letter-spacing: -0.04em !important; line-height: 1.05 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpf-body-3 { position: absolute !important; left: 64px !important; top: 920px !important; width: 880px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpf-body-4 { position: absolute !important; left: 64px !important; top: 960px !important; width: 880px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpf-photo { position: absolute !important; left: 984px !important; top: 0 !important; width: 936px !important; height: 1080px !important; background: transparent !important; overflow: hidden !important; z-index: 3 !important; }
[data-template="almanac"][data-layout="cover-photo-fullright"] .alm-cpf-photo img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E3  chapter-title-brown  (brown bg, no image, centred white serif)  */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-ctb-body { position: absolute !important; left: 120px !important; top: 200px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctb-body-2 { position: absolute !important; left: 120px !important; top: 240px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctb-sub { position: absolute !important; left: 120px !important; top: 320px !important; width: 1680px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 32px !important; letter-spacing: 0.01em !important; color: #BF6FA0 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctb-title { position: absolute !important; left: 120px !important; top: 400px !important; width: 1680px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 140px !important; letter-spacing: -0.04em !important; line-height: 1.05 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctb-body-3 { position: absolute !important; left: 120px !important; top: 920px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctb-body-4 { position: absolute !important; left: 120px !important; top: 960px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E4  chapter-title-cream  (cream bg, all brown ink, no image)        */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-ctc-body { position: absolute !important; left: 120px !important; top: 200px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctc-body-2 { position: absolute !important; left: 120px !important; top: 240px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctc-title { position: absolute !important; left: 120px !important; top: 400px !important; width: 1680px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 140px !important; letter-spacing: -0.04em !important; line-height: 1.05 !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctc-body-3 { position: absolute !important; left: 120px !important; top: 920px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctc-body-4 { position: absolute !important; left: 120px !important; top: 960px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #3D1919 !important; z-index: 3 !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E5  headline-bottom-image  (brown top + image 1920×452 at (0,628))  */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-hbi-sub { position: absolute !important; left: 120px !important; top: 200px !important; width: 1680px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 32px !important; letter-spacing: 0.01em !important; color: #BF6FA0 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-hbi-title { position: absolute !important; left: 120px !important; top: 270px !important; width: 1680px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 80px !important; letter-spacing: -0.04em !important; line-height: 1.05 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-hbi-body { position: absolute !important; left: 120px !important; top: 530px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 24px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-hbi-body-2 { position: absolute !important; left: 1040px !important; top: 530px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-hbi-image { position: absolute !important; left: 0 !important; top: 628px !important; width: 1920px !important; height: 452px !important; background: transparent !important; overflow: hidden !important; z-index: 3 !important; }
[data-template="almanac"][data-layout="headline-bottom-image"] .alm-hbi-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E6  six-metric-grid  (PINK bg + top banner 1920×300 + 6-cell grid)  */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-smg-banner { position: absolute !important; left: 0 !important; top: 0 !important; width: 1920px !important; height: 300px !important; background: transparent !important; overflow: hidden !important; z-index: 2 !important; }
[data-template="almanac"][data-layout="six-metric-grid"] .alm-smg-banner img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
[data-template="almanac"] .alm-smg-headline { position: absolute !important; left: 64px !important; top: 350px !important; width: 1792px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 64px !important; letter-spacing: -0.02em !important; line-height: 1.0 !important; color: #3D1919 !important; z-index: 3 !important; }
/* 6 cells: 2 rows × 3 cols, cell w=520, x=120/720/1320, y=460/760 */
[data-template="almanac"] .alm-smg-label-1   { position: absolute !important; left: 120px !important;  top: 460px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 96px !important; letter-spacing: -0.04em !important; line-height: 1.0 !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-body-1    { position: absolute !important; left: 120px !important;  top: 620px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-label-2   { position: absolute !important; left: 720px !important;  top: 460px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 96px !important; letter-spacing: -0.04em !important; line-height: 1.0 !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-body-2    { position: absolute !important; left: 720px !important;  top: 620px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-label-3   { position: absolute !important; left: 1320px !important; top: 460px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 96px !important; letter-spacing: -0.04em !important; line-height: 1.0 !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-body-3    { position: absolute !important; left: 1320px !important; top: 620px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-label-4   { position: absolute !important; left: 120px !important;  top: 760px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 96px !important; letter-spacing: -0.04em !important; line-height: 1.0 !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-body-4    { position: absolute !important; left: 120px !important;  top: 920px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-label-5   { position: absolute !important; left: 720px !important;  top: 760px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 96px !important; letter-spacing: -0.04em !important; line-height: 1.0 !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-body-5    { position: absolute !important; left: 720px !important;  top: 920px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-label-6   { position: absolute !important; left: 1320px !important; top: 760px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 96px !important; letter-spacing: -0.04em !important; line-height: 1.0 !important; color: #3D1919 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-smg-body-6    { position: absolute !important; left: 1320px !important; top: 920px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; color: #3D1919 !important; z-index: 3 !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E7  three-col-text  (brown bg, 3 col headline+body, no image)       */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-tct-headline-1 { position: absolute !important; left: 120px !important;  top: 280px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 64px !important; letter-spacing: -0.02em !important; line-height: 1.1 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tct-body-1     { position: absolute !important; left: 120px !important;  top: 460px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; line-height: 1.35 !important; color: #FFFFFF !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tct-headline-2 { position: absolute !important; left: 720px !important;  top: 280px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 64px !important; letter-spacing: -0.02em !important; line-height: 1.1 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tct-body-2     { position: absolute !important; left: 720px !important;  top: 460px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; line-height: 1.35 !important; color: #FFFFFF !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tct-headline-3 { position: absolute !important; left: 1320px !important; top: 280px !important; width: 520px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 64px !important; letter-spacing: -0.02em !important; line-height: 1.1 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tct-body-3     { position: absolute !important; left: 1320px !important; top: 460px !important; width: 520px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; line-height: 1.35 !important; color: #FFFFFF !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tct-foot-1     { position: absolute !important; left: 120px !important;  top: 920px !important; width: 520px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tct-foot-2     { position: absolute !important; left: 720px !important;  top: 920px !important; width: 520px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E8  left-image-list  (brown bg + narrow 240×1080 left image + list) */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-lil-image { position: absolute !important; left: 0 !important; top: 0 !important; width: 240px !important; height: 1080px !important; background: transparent !important; overflow: hidden !important; z-index: 3 !important; }
[data-template="almanac"][data-layout="left-image-list"] .alm-lil-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
[data-template="almanac"] .alm-lil-title { position: absolute !important; left: 1091px !important; top: 64px !important; width: 765px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 100px !important; letter-spacing: -0.04em !important; line-height: 1.05 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-lil-headline-1 { position: absolute !important; left: 320px !important; top: 424px !important; width: 1536px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 30px !important; letter-spacing: -0.01em !important; line-height: 1.3 !important; color: #FFFFFF !important; z-index: 3 !important; }
[data-template="almanac"] .alm-lil-headline-2 { position: absolute !important; left: 320px !important; top: 524px !important; width: 1536px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 30px !important; letter-spacing: -0.01em !important; line-height: 1.3 !important; color: #FFFFFF !important; z-index: 3 !important; }
[data-template="almanac"] .alm-lil-headline-3 { position: absolute !important; left: 320px !important; top: 624px !important; width: 1536px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 30px !important; letter-spacing: -0.01em !important; line-height: 1.3 !important; color: #FFFFFF !important; z-index: 3 !important; }
[data-template="almanac"] .alm-lil-headline-4 { position: absolute !important; left: 320px !important; top: 724px !important; width: 1536px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 30px !important; letter-spacing: -0.01em !important; line-height: 1.3 !important; color: #FFFFFF !important; z-index: 3 !important; }
[data-template="almanac"] .alm-lil-headline-5 { position: absolute !important; left: 320px !important; top: 824px !important; width: 1536px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 30px !important; letter-spacing: -0.01em !important; line-height: 1.3 !important; color: #FFFFFF !important; z-index: 3 !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E9  quote-attribution  (brown bg, centered quote + attribution)     */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-qa-body { position: absolute !important; left: 120px !important; top: 200px !important; width: 1680px !important; text-align: center !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-qa-body-2 { position: absolute !important; left: 120px !important; top: 240px !important; width: 1680px !important; text-align: center !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-qa-quote { position: absolute !important; left: 120px !important; top: 380px !important; width: 1680px !important; text-align: center !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 100px !important; letter-spacing: -0.04em !important; line-height: 1.15 !important; color: #F2C9E3 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-qa-attr { position: absolute !important; left: 0 !important; top: 800px !important; width: 1920px !important; text-align: center !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 32px !important; letter-spacing: 0.01em !important; color: #BF6FA0 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-qa-cherries { position: absolute !important; left: 840px !important; top: 880px !important; width: 240px !important; height: 32px !important; z-index: 3 !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E10 cream-full-image  (cream bg + single 1793×952 image at (64,64)) */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-cfi-image { position: absolute !important; left: 64px !important; top: 64px !important; width: 1793px !important; height: 952px !important; background: transparent !important; overflow: hidden !important; border-radius: 8px !important; z-index: 3 !important; }
[data-template="almanac"][data-layout="cream-full-image"] .alm-cfi-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E11 top-image-headline  (brown bg + top image 1920×536 + headline)  */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-tih-image { position: absolute !important; left: 0 !important; top: 0 !important; width: 1920px !important; height: 536px !important; background: transparent !important; overflow: hidden !important; z-index: 3 !important; }
[data-template="almanac"][data-layout="top-image-headline"] .alm-tih-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
[data-template="almanac"] .alm-tih-body { position: absolute !important; left: 120px !important; top: 600px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tih-body-2 { position: absolute !important; left: 120px !important; top: 640px !important; width: 760px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tih-headline { position: absolute !important; left: 120px !important; top: 720px !important; width: 1680px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 64px !important; letter-spacing: -0.02em !important; line-height: 1.1 !important; color: #F4CECD !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tih-copy { position: absolute !important; left: 120px !important; top: 870px !important; width: 1680px !important; font-family: var(--alm-font-sans) !important; font-weight: 400 !important; font-size: 32px !important; letter-spacing: -0.01em !important; line-height: 1.35 !important; color: #FFFFFF !important; z-index: 3 !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E12 single-mockup  (brown bg + Macbook 1446×876 + Screen 1154×750)  */
/* ═══════════════════════════════════════════════════════════════════ */
/* E12 frame = pure CSS Macbook silhouette (gradient + corners + shadow).
   No AI-generated image — Macbook chassis is decoration, not content.
   The inner alm-sm-screen is the ACTUAL data-viz image slot. (Rainy
   2026-06-12 — "don't stack images".) */
[data-template="almanac"] .alm-sm-frame {
  position: absolute !important; left: 237px !important; top: 102px !important;
  width: 1446px !important; height: 876px !important;
  background: linear-gradient(180deg, #d8dadc 0%, #b8babd 50%, #989a9d 100%) !important;
  overflow: visible !important;
  border-radius: 20px 20px 8px 8px !important;
  box-shadow: 0 30px 60px rgba(0,0,0,0.35),
              inset 0 -28px 40px rgba(0,0,0,0.18),
              inset 0 2px 0 rgba(255,255,255,0.4) !important;
  z-index: 3 !important;
}
/* Macbook bottom-edge "trackpad slot" + slight bezel highlight. */
[data-template="almanac"] .alm-sm-frame::after {
  content: '';
  position: absolute !important;
  left: 50% !important; bottom: -8px !important;
  transform: translateX(-50%) !important;
  width: 320px !important; height: 14px !important;
  background: linear-gradient(180deg, #8a8c8f 0%, #5e6063 100%) !important;
  border-radius: 0 0 14px 14px !important;
  box-shadow: 0 6px 12px rgba(0,0,0,0.25) !important;
  z-index: 2 !important;
}
/* Hide any AI-emitted img inside frame — frame is decoration. The user's
   chart goes in alm-sm-screen, not alm-sm-frame. */
[data-template="almanac"][data-layout="single-mockup"] .alm-sm-frame > img {
  display: none !important;
}
[data-template="almanac"] .alm-sm-screen {
  position: absolute !important; left: 384px !important; top: 132px !important;
  width: 1154px !important; height: 750px !important;
  background: #ffffff !important; overflow: hidden !important;
  border-radius: 4px !important; z-index: 4 !important;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.08) !important;
}
/* Chart.js canvas inside macbook screen — fill the screen. Chart.js sets
   width/height via JS so override to fill container. */
[data-template="almanac"] .alm-sm-screen > canvas {
  width: 100% !important; height: 100% !important;
  display: block !important;
}
[data-template="almanac"][data-layout="single-mockup"] .alm-sm-screen > img {
  width: 100% !important; height: 100% !important;
  object-fit: cover !important; display: block !important;
}

/* ═══════════════════════════════════════════════════════════════════ */
/* E13 three-mockup-grid  (cream bg + 3 mockups at x=233/744/1256)      */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-tmg-frame-1  { position: absolute !important; left: 233px !important;  top: 97px !important;  width: 431px !important; height: 885px !important; background: transparent !important; overflow: hidden !important; border-radius: 12px !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tmg-screen-1 { position: absolute !important; left: 252px !important;  top: 114px !important; width: 393px !important; height: 852px !important; background: transparent !important; overflow: hidden !important; border-radius: 4px !important; z-index: 4 !important; }
[data-template="almanac"] .alm-tmg-frame-2  { position: absolute !important; left: 744px !important;  top: 97px !important;  width: 431px !important; height: 885px !important; background: transparent !important; overflow: hidden !important; border-radius: 12px !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tmg-screen-2 { position: absolute !important; left: 763px !important;  top: 114px !important; width: 393px !important; height: 852px !important; background: transparent !important; overflow: hidden !important; border-radius: 4px !important; z-index: 4 !important; }
[data-template="almanac"] .alm-tmg-frame-3  { position: absolute !important; left: 1256px !important; top: 97px !important;  width: 431px !important; height: 885px !important; background: transparent !important; overflow: hidden !important; border-radius: 12px !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tmg-screen-3 { position: absolute !important; left: 1275px !important; top: 114px !important; width: 393px !important; height: 852px !important; background: transparent !important; overflow: hidden !important; border-radius: 4px !important; z-index: 4 !important; }
[data-template="almanac"][data-layout="three-mockup-grid"] .alm-tmg-frame-1 img,
[data-template="almanac"][data-layout="three-mockup-grid"] .alm-tmg-screen-1 img,
[data-template="almanac"][data-layout="three-mockup-grid"] .alm-tmg-frame-2 img,
[data-template="almanac"][data-layout="three-mockup-grid"] .alm-tmg-screen-2 img,
[data-template="almanac"][data-layout="three-mockup-grid"] .alm-tmg-frame-3 img,
[data-template="almanac"][data-layout="three-mockup-grid"] .alm-tmg-screen-3 img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }

/* ═══════════════════════════════════════════════════════════════════ */
/* E14 cover-photo-left  (brown bg + photo 856×952 at (64,64) LEFT)    */
/* ═══════════════════════════════════════════════════════════════════ */
[data-template="almanac"] .alm-cpl-photo { position: absolute !important; left: 64px !important; top: 64px !important; width: 856px !important; height: 952px !important; background: transparent !important; overflow: hidden !important; border-radius: 8px !important; z-index: 3 !important; }
[data-template="almanac"][data-layout="cover-photo-left"] .alm-cpl-photo img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
[data-template="almanac"] .alm-cpl-sub { position: absolute !important; left: 1000px !important; top: 280px !important; width: 800px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 32px !important; letter-spacing: 0.01em !important; color: #BF6FA0 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpl-headline { position: absolute !important; left: 1000px !important; top: 340px !important; width: 800px !important; font-family: var(--alm-font-serif) !important; font-weight: 400 !important; font-size: 100px !important; letter-spacing: -0.04em !important; line-height: 1.05 !important; color: #F2C9E3 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpl-body { position: absolute !important; left: 1000px !important; top: 750px !important; width: 800px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpl-body-2 { position: absolute !important; left: 1000px !important; top: 790px !important; width: 800px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpl-body-3 { position: absolute !important; left: 1000px !important; top: 830px !important; width: 800px !important; font-family: var(--alm-font-cond) !important; font-weight: 600 !important; font-size: 20px !important; letter-spacing: 0.01em !important; color: #C9D3E5 !important; z-index: 3 !important; }

/* ─── Cherry-blossom strips ─────────────────────────────────────────
   Per Rainy 2026-06-12: E1 / E2 / E3 / E4 / E7 / E9 / E12 / E13 / E14
   all have cherry strips in spec. Each is a 240×32 SVG band emitted via
   _normalizeHeroAlmanac.cherryStrip(). E9 alm-qa-cherries already
   defined above; the other 8 layouts get layout-specific positions. */
[data-template="almanac"] .alm-cpr-cherries { position: absolute !important; left: 120px !important; top: 950px !important; width: 240px !important; height: 32px !important; z-index: 3 !important; }
[data-template="almanac"] .alm-cpf-cherries { position: absolute !important; left: 64px !important; top: 800px !important; width: 240px !important; height: 32px !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctb-cherries { position: absolute !important; left: 840px !important; top: 700px !important; width: 240px !important; height: 32px !important; z-index: 3 !important; }
[data-template="almanac"] .alm-ctc-cherries { position: absolute !important; left: 840px !important; top: 700px !important; width: 240px !important; height: 32px !important; z-index: 3 !important; }
[data-template="almanac"] .alm-tct-cherries { position: absolute !important; left: 840px !important; top: 860px !important; width: 240px !important; height: 32px !important; z-index: 3 !important; }
[data-template="almanac"] .alm-sm-cherries  { position: absolute !important; left: 840px !important; top: 1010px !important; width: 240px !important; height: 32px !important; z-index: 5 !important; }
[data-template="almanac"] .alm-tmg-cherries { position: absolute !important; left: 840px !important; top: 1010px !important; width: 240px !important; height: 32px !important; z-index: 5 !important; }
[data-template="almanac"] .alm-cpl-cherries { position: absolute !important; left: 1000px !important; top: 950px !important; width: 240px !important; height: 32px !important; z-index: 3 !important; }


/* ═══════════════════════════════════════════════════════════════════════════
   D-form fallback — section-level bg
   ───────────────────────────────────────────────────────────────────────────
   Layout bg rules above target `> .slide-scale-inner`, but D-form decks
   (AI-gen via generate-modal → JsonRenderer.renderSlide) render slide
   section's direct child as `.obj-html` instead of `.slide-scale-inner`,
   so the bg selector misses and falls back to thumbWrap's inline white.
   Mirror each layout bg directly to the section element so D-form preview
   renders correct bg. Editor path (section > .slide-scale-inner) is
   unaffected because inner has inset:0 fully covering section bg paint.
   (Rainy 2026-06-22: batch fix after retro-modern proof-of-fix.)
   ═══════════════════════════════════════════════════════════════════════════ */
[data-template="almanac"][data-layout="chapter-title-brown"],
[data-template="almanac"][data-layout="cover-photo-fullright"],
[data-template="almanac"][data-layout="cover-photo-left"],
[data-template="almanac"][data-layout="cover-photo-right"],
[data-template="almanac"][data-layout="headline-bottom-image"],
[data-template="almanac"][data-layout="left-image-list"],
[data-template="almanac"][data-layout="quote-attribution"],
[data-template="almanac"][data-layout="single-mockup"],
[data-template="almanac"][data-layout="three-col-text"],
[data-template="almanac"][data-layout="top-image-headline"] {
  background: var(--alm-brown) !important;
}
[data-template="almanac"][data-layout="six-metric-grid"] {
  background: var(--alm-pink) !important;
}

/* ── Every text slot declares the room it actually has ────────────────────
 *
 * These slots set `top` and `font-size` but no height, so the box grows with
 * the copy and runs over whatever sits below. It showed up twice on one deck:
 * a 39-character cover title at 140px wrapping to 560px into the 510px above
 * the body, and .alm-ctb-body-3 / -body-4, which sit 40px apart because the
 * design puts a single line in each (the prompt's own example is literally
 * "Footer text line one") — three sentences of generated copy printed straight
 * through the slot below. (Rainy 2026-07-28.)
 *
 * Each height is the distance from that slot's own `top` to the top of the
 * next positioned element in the same layout — text, photo or ornament alike.
 * Measuring against text slots only was a first mistake: .alm-hbi-body then
 * "ended" at the slide bottom and overran the photo band by 392px.
 *
 * Writing the room down is what makes it enforceable. json-renderer's
 * _autoFitHtmlSlots shrinks any absolutely-positioned slot that overflows its
 * box, but with no height there was nothing to overflow — scrollHeight equalled
 * clientHeight and every slot measured as fine. Now the same existing pass fits
 * the real text, including on decks generated before this.
 *
 * Corner marks are deliberately excluded: they are fixed chrome, never long,
 * and must not be shrunk.
 */
[data-template="almanac"] .alm-cpf-body { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpf-body-2 { max-height: 80px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpf-body-3 { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpf-body-4 { max-height: 60px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpf-title { max-height: 480px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpl-body { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpl-body-2 { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpl-body-3 { max-height: 120px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpl-headline { max-height: 410px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpl-sub { max-height: 60px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpr-body { max-height: 50px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpr-body-2 { max-height: 50px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpr-sub { max-height: 60px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-cpr-title { max-height: 510px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctb-body { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctb-body-2 { max-height: 80px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctb-body-3 { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctb-body-4 { max-height: 60px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctb-sub { max-height: 80px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctb-title { max-height: 300px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctc-body { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctc-body-2 { max-height: 160px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctc-body-3 { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctc-body-4 { max-height: 60px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-ctc-title { max-height: 300px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-hbi-body { max-height: 98px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-hbi-body-2 { max-height: 98px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-hbi-sub { max-height: 70px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-hbi-title { max-height: 260px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-lil-headline-1 { max-height: 100px !important; overflow: visible !important; }
[data-template="almanac"] .alm-lil-headline-2 { max-height: 100px !important; overflow: visible !important; }
[data-template="almanac"] .alm-lil-headline-3 { max-height: 100px !important; overflow: visible !important; }
[data-template="almanac"] .alm-lil-headline-4 { max-height: 100px !important; overflow: visible !important; }
[data-template="almanac"] .alm-lil-headline-5 { max-height: 220px !important; overflow: visible !important; }

/* Neutralise the OLDER injected <style> that existing decks still carry.
 * A saved deck ships the prompt CSS from the day it was generated, forever.
 * Those older copies put the divider on the slot itself:
 *     border-top: 1px solid ...; padding-top: 24px;   (and padding: 24px 0 on #5)
 * The current runtime simply stopped declaring those, and "not declaring" does
 * not override anything — so on every reload the old rules applied again and the
 * padding band and doubled line came straight back. A runtime that supersedes
 * older markup has to say what it wants to be zero, not stay silent about it.
 * (Rainy 2026-07-28 — "刷新了一下就恢复到之前了".) */
[data-template="almanac"] .alm-lil-headline-1,
[data-template="almanac"] .alm-lil-headline-2,
[data-template="almanac"] .alm-lil-headline-3,
[data-template="almanac"] .alm-lil-headline-4,
[data-template="almanac"] .alm-lil-headline-5 {
  box-sizing: content-box !important;
  border-top: 0 !important; border-bottom: 0 !important;
  border-left: 0 !important; border-right: 0 !important;
  padding: 0 !important;
}

/* The list dividers live OUTSIDE the text box, on ::before/::after.
 * They cannot be a border or padding on the slot itself: the editor draws
 * its selection handles around the element box, so a 24px padding-top put
 * a band of dead space above every line the user clicked. And they cannot
 * be clipped away either, which is why these slots run overflow:visible —
 * max-height still bounds the box so the auto-fitter can see an overflow
 * and shrink the type, it just no longer deletes what does not fit.
 * (Rainy 2026-07-28 — "选中不是纯文本,怎么还是有这个padding".) */
[data-template="almanac"] .alm-lil-headline-1::before, [data-template="almanac"] .alm-lil-headline-2::before, [data-template="almanac"] .alm-lil-headline-3::before, [data-template="almanac"] .alm-lil-headline-4::before, [data-template="almanac"] .alm-lil-headline-5::before {
  content: '' !important; position: absolute !important; left: 0 !important; right: 0 !important; top: -24px !important;
  border-top: 1px solid rgba(255,244,232,0.25) !important; pointer-events: none !important;}
/* The closing line under item 5 is a box-shadow on the SAME ::before, not a
   second pseudo below the box: an ::after positioned past the bottom edge
   enlarges scrollHeight, and the auto-fitter read that as the text
   overflowing and shrank item 5 to the 22px floor every time. A shadow
   never participates in layout. 100px down from the divider puts it on the
   next row of the 100px grid, where the figma has it. */
[data-template="almanac"] .alm-lil-headline-5::before {
  box-shadow: 0 100px 0 0 rgba(255,244,232,0.25) !important;
}
[data-template="almanac"] .alm-lil-title { max-height: 336px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-qa-attr { max-height: 80px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-qa-body { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-qa-body-2 { max-height: 140px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-qa-quote { max-height: 420px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-body-1 { max-height: 140px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-body-2 { max-height: 140px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-body-3 { max-height: 140px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-body-4 { max-height: 100px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-body-5 { max-height: 100px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-body-6 { max-height: 100px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-headline { max-height: 110px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-label-1 { max-height: 160px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-label-2 { max-height: 160px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-label-3 { max-height: 160px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-label-4 { max-height: 160px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-label-5 { max-height: 160px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-smg-label-6 { max-height: 160px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tct-body-1 { max-height: 400px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tct-body-2 { max-height: 400px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tct-body-3 { max-height: 400px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tct-foot-1 { max-height: 100px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tct-foot-2 { max-height: 100px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tct-headline-1 { max-height: 180px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tct-headline-2 { max-height: 180px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tct-headline-3 { max-height: 180px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tih-body { max-height: 40px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tih-body-2 { max-height: 80px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tih-copy { max-height: 150px !important; overflow: hidden !important; }
[data-template="almanac"] .alm-tih-headline { max-height: 150px !important; overflow: hidden !important; }

/* Nothing in this template drops below 22px.
 *
 * The shared auto-fit floors at 42% of the design size, which for 20px body
 * copy is 8px — legible in a spec, not on a slide. A slot that cannot fit its
 * copy at 22px should clip, not shrink into unreadability; the real remedy is
 * the per-slot character budget in the prompt. Corner marks opt out above by
 * never being fitted at all. (Rainy 2026-07-28: "其他字体最小不小于22px".)
 */
.alm-cpf-body , .alm-cpf-body-2 , .alm-cpf-body-3 , .alm-cpf-body-4 , .alm-cpf-title , .alm-cpl-body , .alm-cpl-body-2 , .alm-cpl-body-3 , .alm-cpl-headline , .alm-cpl-sub , .alm-cpr-body , .alm-cpr-body-2 , .alm-cpr-sub , .alm-cpr-title , .alm-ctb-body , .alm-ctb-body-2 , .alm-ctb-body-3 , .alm-ctb-body-4 , .alm-ctb-sub , .alm-ctb-title , .alm-ctc-body , .alm-ctc-body-2 , .alm-ctc-body-3 , .alm-ctc-body-4 , .alm-ctc-title , .alm-hbi-body , .alm-hbi-body-2 , .alm-hbi-sub , .alm-hbi-title , .alm-lil-headline-1 , .alm-lil-headline-2 , .alm-lil-headline-3 , .alm-lil-headline-4 , .alm-lil-headline-5 , .alm-lil-title , .alm-qa-attr , .alm-qa-body , .alm-qa-body-2 , .alm-qa-quote , .alm-smg-body-1 , .alm-smg-body-2 , .alm-smg-body-3 , .alm-smg-body-4 , .alm-smg-body-5 , .alm-smg-body-6 , .alm-smg-headline , .alm-smg-label-1 , .alm-smg-label-2 , .alm-smg-label-3 , .alm-smg-label-4 , .alm-smg-label-5 , .alm-smg-label-6 , .alm-tct-body-1 , .alm-tct-body-2 , .alm-tct-body-3 , .alm-tct-foot-1 , .alm-tct-foot-2 , .alm-tct-headline-1 , .alm-tct-headline-2 , .alm-tct-headline-3 , .alm-tih-body , .alm-tih-body-2 , .alm-tih-copy , .alm-tih-headline { --ocu-min-font: 22px; }

/* The rule above each list item is drawn by a pseudo-element now, not by
 * border-top + padding-top on the slot itself.
 *
 * Same pixels: the line still sits where it did and the text still sits 24px
 * under it. What changes is the element's own box. With the border and padding
 * on the slot, selecting the text drew a handle box 25px taller than the words
 * — the user selected a single line of copy and got a rectangle with a stripe
 * floating above it. (Rainy 2026-07-28: "用户选中的这个文本内容就是单文本啊".)
 *
 * It also stops the padding inflating clientHeight, which the auto-fit reads
 * when deciding whether a slot overflows.
 */
