/* sun.css - Sun Theme: all [data-theme="sun"] selectors
   Extracted from main.css during Sun/Moon decoupling. */

        /* Sun identity tokens - serif-editorial "published document" vision (design.md §3 TARGET).
           Additive: overrides the global :root font tokens ONLY under [data-theme="sun"],
           leaving Moon and the shared :root untouched. The four families are already
           @font-face-declared in index.html. */
        [data-theme="sun"] {
            --font-display: 'Fraunces', Georgia, serif;
            --font-sans: 'Newsreader', Georgia, serif;
            --font-mono: 'Departure Mono', 'JetBrains Mono', monospace;
            --font-kicker: 'Archivo', 'Inter', sans-serif;
            /* Editorial display wants tighter optical spacing than the grotesque default */
            --ls-tight: -0.02em;

            /* Sun analog palette (design.md §4 TARGET) - warm matte drafting paper.
               Drives the page surface the drawer + evidence board sit on (the legacy
               --bg/--fg Moon values are overridden here so Sun reads as paper, not void). */
            --paper:   #F0E4D2;
            --bone:    #F4ECDB;
            --ink:     #241F1A;
            --ink-soft:#4A4138;
            --zinc:    #3A7080;
            --zinc-dim:#6E8A8E;
            --border:  #7C6E5C;
            --border-dim:#C7B79F;
            --pigment: #B5443B;
            --bg:      #F0E4D2;
            --fg:      #241F1A;
            --muted:   #4A4138;
            --accent:  #B5443B;
            --accent-aa:#8F342C;

            /* The whole page is the warm paper the Shaper drafts on */
            background: var(--paper);
            color: var(--ink);
        }

        [data-theme="sun"] .mz-glyph {
            stroke-width: 1;
        }
        [data-theme="sun"] .nav-corner-group { display: none; }
        [data-theme="sun"] .mz-glow { filter: none; }
        /* Differentiation gate: Moon's reticle must not render in Sun - show the
           Shaper drafting pen instead. Moon nav-links are a separate set
           (no [data-sun-only]); hide them entirely under Sun so only the
           decoupled Sun nav-links show. */
        [data-theme="sun"] .mz-glyph-moon { display: none; }
        [data-theme="sun"] .mz-nav-item:not([data-sun-only]) { display: none; }
        [data-theme="sun"] .sun-icon {
            opacity: 1;
            transform: scale(1) rotate(0deg);
            filter: blur(0px);
        }
        [data-theme="sun"] .moon-icon {
            opacity: 0;
            transform: scale(0.25) rotate(-90deg);
            filter: blur(4px);
        }
    [data-theme="sun"] .title-block {
        display: flex; flex-wrap: wrap; gap: 4px 24px;
        padding: 10px 16px; margin-top: 2rem;
        border-top: 1px solid var(--border);
        font-family: "JetBrains Mono", monospace;
        font-size: 8px; letter-spacing: 0.06em;
        color: var(--muted); opacity: 0.6;
        text-transform: uppercase;
    }
    [data-theme="sun"] .title-block .tb-label { color: var(--accent-aa); opacity: 0.8; }
    [data-theme="sun"] .title-block .tb-value { color: var(--fg); }
    [data-theme="sun"] .clause-num {
        font-size: 9px;
        letter-spacing: 0.08em;
        color: var(--accent);
        opacity: 0.4;
        margin-left: 0.75rem;
        flex: none;
    }
    [data-theme="sun"] .sec-head .clause-num {
        color: var(--muted);
        opacity: 0.3;
    }
    [data-theme="sun"] .section-title-prompt::after {
        content: '';
        display: block;
        width: 40px;
        height: 3px;
        background: var(--accent);
        margin-top: 0.3em;
    }
    [data-theme="sun"] .section-divider .sd-line::after {
        background: var(--accent);
        width: 20px;
        height: 1px;
        clip-path: none;
        border-radius: 0;
        right: auto;
        left: 0;
    }
    [data-theme="sun"] .section-divider .sd-line:last-child::after {
        left: auto;
        right: 0;
    }
    [data-theme="sun"] [data-panel="projects"] .group::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 2px;
        background: var(--accent);
        opacity: 0;
        transform: scaleX(0);
        transform-origin: left;
        transition: opacity 0.3s, transform 0.3s;
        pointer-events: none;
        z-index: 1;
    }
    [data-theme="sun"] [data-panel="projects"] .group:hover::before {
        opacity: 1;
        transform: scaleX(1);
    }
    [data-theme="sun"] .tl-item::before {
        content: '';
        position: absolute;
        left: -33px;
        top: 6px;
        width: 8px;
        height: 1px;
        background: var(--accent);
        opacity: 0;
        transition: opacity 0.3s;
    }
    [data-theme="sun"] .tl-item:hover::before {
        opacity: 0.5;
    }
    [data-theme="sun"] #workTimeline {
        position: relative;
    }
    [data-theme="sun"] [data-panel="registry"] .group {
        position: relative; overflow: hidden;
    }
    [data-theme="sun"] [data-panel="registry"] .group::after {
        content: "VERIFIED";
        position: absolute; top: 6px; right: -28px;
        font-family: "JetBrains Mono", monospace;
        font-size: 7px; letter-spacing: 0.06em; font-weight: 700;
        color: var(--accent); opacity: 0;
        border: 1px solid var(--accent);
        padding: 1px 20px; line-height: 1.4;
        transform: rotate(45deg);
        transform-origin: center;
        transition: opacity 0.3s cubic-bezier(0.19,1,0.22,1);
        pointer-events: none; z-index: 5;
    }
    [data-theme="sun"] [data-panel="registry"] .group:hover::after {
        opacity: 0.65;
    }
    [data-theme="sun"] [data-panel="registry"] .group:hover .status-badge { display: none; }
    [data-theme="sun"] [data-panel="registry"] .group:hover {
        box-shadow: inset 0 -2px 0 var(--accent);
    }
    [data-theme="sun"] #modalOverlay.open .modal-card {
        border-top: 2px solid var(--accent);
    }
    [data-theme="sun"] .panel-nav-item.active {
        border-left-width: 4px;
    }
    [data-theme="sun"] .site-footer {
        border-top-color: var(--accent);
        border-top-width: 2px;
        /* Sun uses its own self-documenting colophon (#sun-colophon); the global
           grey footer is the Moon/neutral edition and is suppressed under Sun. */
        display: none !important;
    }

    /* ===== Sun self-documenting colophon (Backlog #15) =====
       Printed signature strip that closes the Shaper's edition. Fixed running-
       foot above the docked drawer folders (z above the drawer's z30). Collapses
       when a folder opens (body.reading) so it never sits behind the dossier. */
    #sun-colophon{
      position:fixed; left:12px; right:12px; bottom:12px; z-index:31;
      display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:22px;
      padding:9px 22px; background:var(--paper);
      border-top:1px solid var(--border); box-shadow:0 -8px 20px -12px rgba(36,31,26,.4);
      font-family:var(--mono); transition:transform .5s cubic-bezier(.25,1,.5,1), opacity .4s ease;
      pointer-events:none;
    }
    #sun-colophon.sc-collapsed{ transform:translateY(140%); opacity:0; }
    #sun-colophon .sc-tenets{
      display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center;
      font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--zinc-dim);
    }
    #sun-colophon .sc-tenet{ color:var(--ink-soft); }
    #sun-colophon .sc-dot{ color:var(--pigment); opacity:.6; }
    #sun-colophon .sc-mid{ overflow:hidden; }
    #sun-colophon .sc-index{
      display:flex; gap:14px; justify-content:center; flex-wrap:nowrap; white-space:nowrap;
      font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--zinc-dim);
    }
    #sun-colophon .sc-idx{ color:var(--ink-soft); }
    #sun-colophon .sc-idx b{ color:var(--pigment); font-weight:400; }
    #sun-colophon .sc-idx-sep{ opacity:.4; }
    #sun-colophon .sc-mark{ display:flex; align-items:center; gap:12px; justify-content:flex-end; }
    #sun-colophon .sc-bar{ height:18px; width:96px; }
    #sun-colophon .sc-bar rect{ fill:var(--ink); }
    #sun-colophon .sc-folio{ font-size:9px; letter-spacing:.14em; color:var(--ink-soft); text-transform:uppercase; }
    #sun-colophon .sc-sig{
      font-family:var(--serif); font-style:italic; font-weight:600; font-size:15px;
      color:var(--accent-aa); filter:url(#ink-bleed);
    }
    @media (max-width:820px){
      #sun-colophon{ grid-template-columns:1fr; gap:6px; padding:8px 14px; }
      #sun-colophon .sc-tenets, #sun-colophon .sc-bar, #sun-colophon .sc-folio{ display:none; }
      #sun-colophon .sc-index{ justify-content:flex-start; overflow-x:auto; scrollbar-width:none; }
    }
    @media (prefers-reduced-motion: reduce){
      #sun-colophon{ transition:opacity .3s ease; }
      #sun-colophon.sc-collapsed{ transform:none; }
    }
    [data-theme="sun"] .title-block { display: none; }
    [data-theme="sun"] .title-block.active { display: flex; }
    [data-theme="sun"] .panel-content {
        background-image:
            repeating-linear-gradient(to right, rgba(200,200,200,0.04) 0 1px, transparent 1px 8px),
            repeating-linear-gradient(to bottom, rgba(200,200,200,0.04) 0 1px, transparent 1px 8px),
            repeating-linear-gradient(to right, rgba(200,200,200,0.06) 0 1px, transparent 1px 40px),
            repeating-linear-gradient(to bottom, rgba(200,200,200,0.06) 0 1px, transparent 1px 40px);
        background-position: -1px -1px;
    }
    [data-theme="sun"] [data-panel="focus"] .xl\\:flex-row { background-image: none; }
    [data-theme="sun"] [data-panel="projects"] .project-card-sun {
        transition: transform 0.4s cubic-bezier(0.19, 1, 0.22, 1), border-color 0.3s ease;
        position: relative;
        padding-top: 24px !important;
        padding-bottom: 24px !important;
    }
    [data-theme="sun"] [data-panel="projects"] .project-card-sun::before {
        content: attr(data-stack);
        position: absolute; top: 8px; left: 16px;
        font-family: 'JetBrains Mono', monospace;
        font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase;
        color: var(--muted); opacity: 0.55;
    }
    [data-theme="sun"] [data-panel="projects"] .project-card-sun::after {
        content: attr(data-detail);
        position: absolute; bottom: 8px; right: 16px;
        font-family: 'JetBrains Mono', monospace;
        font-size: 9px; letter-spacing: 0.08em;
        color: var(--muted); opacity: 0.4;
        font-style: italic;
    }
    [data-theme="sun"] [data-panel="projects"] .project-card-sun:nth-child(even) {
        transform: translateY(32px);
    }
    [data-theme="sun"] [data-panel="projects"] .project-card-sun:nth-child(3n) {
        transform: translateY(16px);
    }
    [data-theme="sun"] [data-panel="projects"] .project-card-sun:nth-child(4n) {
        transform: translateY(-8px);
    }
    [data-theme="sun"] .leader-line-svg {
        position: absolute;
        top: 0; left: 0;
        width: 100%; height: 100%;
        pointer-events: none;
        z-index: 25;
        overflow: visible;
        opacity: 0;
        transition: opacity 0.3s cubic-bezier(0.19, 1, 0.22, 1);
    }
    [data-theme="sun"] .leader-line-svg.active {
        opacity: 1;
    }
    [data-theme="sun"] .leader-line-callout {
        position: absolute;
        pointer-events: none;
        font-family: 'JetBrains Mono', monospace;
        font-size: var(--fs-2xs);
        color: var(--accent);
        letter-spacing: 0.06em;
        text-transform: uppercase;
        white-space: nowrap;
        opacity: 0;
        transition: opacity 0.25s cubic-bezier(0.19, 1, 0.22, 1);
        z-index: 26;
        line-height: 1.4;
        text-shadow: 0 0 6px var(--bg), 0 0 12px var(--bg);
    }
    [data-theme="sun"] .leader-line-callout.visible {
        opacity: 1;
    }
    [data-theme="sun"] .ll-tip {
        position: absolute; top: -28px; left: 50%;
        transform: translateX(-50%);
        font-size: 9px; font-family: "JetBrains Mono", monospace;
        color: var(--accent); white-space: nowrap;
        opacity: 0; pointer-events: none; z-index: 10;
    }
    [data-theme="sun"] .panel-content.sheet-flip-enter {
        opacity: 0;
        transform: translateX(40px) scale(0.97);
    }
    [data-theme="sun"] .panel-content.sheet-flip-exit {
        opacity: 0;
        transform: translateX(-30px) scale(0.97);
    }
    [data-theme="sun"] .moon-browser { display: none !important; }
    [data-theme="sun"] .hero-reticle .ret-inner { animation: none !important; }
    [data-theme="sun"] .draft-guide.active { opacity: 0.08; }
    [data-theme="sun"] .spec-sheet-container {
      position: relative; padding: 2rem;
      border: 0.5px solid var(--fg);
      background: var(--bg);
      font-family: 'JetBrains Mono', monospace;
    }
    [data-theme="sun"] .spec-grid-overlay {
      position: absolute; inset: 4px; pointer-events: none;
      background-image:
        linear-gradient(to right, var(--border) 1px, transparent 1px),
        linear-gradient(to bottom, var(--border) 1px, transparent 1px);
      background-size: 20px 20px; opacity: 0.4;
    }
    [data-theme="sun"] .spec-schematic { position: relative; z-index: 1; margin-bottom: 1rem; }
    [data-theme="sun"] .schematic-edge { stroke: var(--fg); stroke-width: 0.5; fill: none; }
    [data-theme="sun"] .schematic-node { stroke: var(--fg); stroke-width: 0.5; fill: transparent; }
    [data-theme="sun"] .schematic-label { font-family: 'JetBrains Mono', monospace; font-size: 7px; fill: var(--fg); }
    [data-theme="sun"] .spec-meta { display: grid; grid-template-columns: 1fr; gap: 0.25rem; }
    [data-theme="sun"] .spec-row { display: flex; gap: 0.5rem; font-size: 8px; }
    [data-theme="sun"] .spec-key { opacity: 0.5; min-width: 8rem; text-transform: uppercase; letter-spacing: 0.1em; }
    [data-theme="sun"] .spec-val { opacity: 0.85; }
    [data-theme="sun"] .stamp-palette {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 2px 6px;
      border-left: 0.5px solid var(--fg);
      margin-left: 6px;
    }
    [data-theme="sun"] .stamp-tool {
      width: 20px; height: 20px;
      display: flex; align-items: center; justify-content: center;
      background: transparent;
      border: 0.5px solid transparent;
      cursor: pointer; padding: 0;
      color: var(--fg);
      border-radius: 0;
      transition: border-color 0.15s ease;
    }
    [data-theme="sun"] .stamp-tool:hover { border-color: var(--fg); }
    [data-theme="sun"] .stamp-tool.active { background: var(--fg); color: var(--bg); }
    [data-theme="sun"] body.stamp-active { cursor: crosshair; }
    [data-theme="sun"] .stamp-counter {
      font-family: 'JetBrains Mono', monospace;
      font-size: 7px;
      color: var(--fg);
      letter-spacing: 0.1em;
      margin-left: 4px;
      opacity: 0.7;
      transition: color 0.2s ease, transform 0.2s ease;
    }
    [data-theme="sun"] .stamp-clear {
      font-family: 'JetBrains Mono', monospace;
      font-size: 7px;
      color: var(--fg);
      background: transparent;
      border: 0.5px solid transparent;
      cursor: pointer;
      padding: 2px 4px;
      letter-spacing: 0.08em;
      opacity: 0.5;
    }
    [data-theme="sun"] .stamp-clear:hover { opacity: 1; border-color: var(--fg); }

    /* ── Sun Shaper toolkit toggles (nav capsule) ── */
    [data-sun-only] { display: none; }
    /* Reveal non-panel Sun-only elements (nav-links, toolkit, tabs, palette)
       under Sun. Panels keep their own .panel-content rules (.active -> block),
       so we exclude them here. */
    [data-theme="sun"] [data-sun-only]:not(.panel-content) { display: flex; }
    /* Sun-only panels: hidden unless active (mirrors .panel-content rules).
       Scoped + higher specificity so they never show stacked in Sun. */
    [data-theme="sun"] .panel-content[data-sun-only]:not(.active) { display: none !important; }
    [data-theme="sun"] .panel-content[data-sun-only].active { display: block; }
    [data-theme="sun"] .sun-toolkit {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 2px 6px;
      border-left: 0.5px solid var(--fg);
      margin-left: 6px;
    }
    [data-theme="sun"] .sun-tool-btn {
      display: inline-flex;
      align-items: center;
      gap: 3px;
      font-family: 'JetBrains Mono', monospace;
      font-size: 7px;
      color: var(--fg);
      background: transparent;
      border: 0.5px solid transparent;
      cursor: pointer;
      padding: 2px 4px;
      letter-spacing: 0.08em;
      opacity: 0.6;
      transition: opacity 0.15s ease, border-color 0.15s ease, background 0.15s ease;
    }
    [data-theme="sun"] .sun-tool-btn:hover { opacity: 1; border-color: var(--fg); }
    [data-theme="sun"] .sun-tool-btn.active { background: var(--fg); color: var(--bg); opacity: 1; }
    [data-theme="sun"] .sun-tool-btn[data-tool="annot"].active { opacity: 1; }
    [data-theme="sun"] .sun-tool-label { text-transform: uppercase; }
    [data-theme="sun"] .sun-tool-val { min-width: 1ch; text-align: right; }
    [data-theme="sun"] .sun-tool-counter {
      font-family: 'JetBrains Mono', monospace;
      font-size: 7px;
      color: var(--fg);
      letter-spacing: 0.1em;
      margin-left: 4px;
      opacity: 0.7;
    }
    [data-theme="sun"] #scroll-rail{background:repeating-linear-gradient(
      to bottom,var(--border) 0 1px,transparent 1px 24px);width:5px}
    [data-theme="sun"] #scroll-rail .rail-fill{width:2px;left:auto;right:0}

/* ── Pen stroke (SVG replaces div) ── */
[data-theme="moon"] #hero-pen-stroke { display: none; }

/* ── Reticle CSS gate: prevent Moon's continuous rotation in Sun ── */
[data-theme="sun"] #moon-gl { display: none !important; }
[data-theme="sun"] .hero-reticle {
  display: none !important;
}

/* ============================================================
   SUN NAV REMOVED - the top drafting-border bar is gone in Sun.
   Panel navigation lives in the desktop sidebar (.panel-nav-list)
   and the mobile tab bar (.panel-tab-bar), both of which already
   list all 8 Sun panels. Only the theme toggle is retained and
   floated into the top-right corner so users can return to Moon.
   All rules gated [data-theme="sun"] - Moon is untouched.
   ============================================================ */
/* Collapse the bar itself: no chrome, no layout footprint, and it
   must not intercept pointer events over the hero beneath it. */
[data-theme="sun"] .nav {
  left: auto; right: 0;
  top: max(16px, env(safe-area-inset-top));
  transform: none;
  max-width: none; width: auto;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  padding: 0 16px 0 0;
  pointer-events: none;
}
[data-theme="sun"] .nav-plane { display: contents; }
[data-theme="sun"] .nav-inner { padding: 0; }
/* Remove every nav element except the theme toggle. Descendant
   selectors under .nav (specificity 0,3,0) so the stamp palette and
   toolkit - which carry [data-sun-only] and are forced visible by the
   generic rule above - stay hidden here via later source order. */
[data-theme="sun"] .nav .nav-brand,
[data-theme="sun"] .nav .nav-links,
[data-theme="sun"] .nav .nav-slider,
[data-theme="sun"] .nav .stamp-palette,
[data-theme="sun"] .nav .sun-toolkit { display: none; }
/* Retain only the theme toggle as a floating corner control */
[data-theme="sun"] .nav-toggles {
  pointer-events: auto;
  border-left: none;
  padding: 0;
}
[data-theme="sun"] .tog { border-radius: 0; }

/* ── Marginalia: graphite pencil notes ── */
[data-theme="sun"] .marginalia {
  position: absolute;
  font-family: 'JetBrains Mono', monospace;
  font-size: 7px;
  line-height: 1.5;
  color: var(--pencil-mark);
  letter-spacing: 0.02em;
  opacity: 0;
  pointer-events: none;
  z-index: 15;
  max-width: 180px;
  transform-origin: top left;
  transition: opacity 1.2s cubic-bezier(0.19, 1, 0.22, 1);
}
[data-theme="sun"] .marginalia.visible {
  opacity: 0.5;
}
[data-theme="sun"] .marginalia:hover {
  opacity: 0.85;
  transition-duration: 0.3s;
}
[data-theme="sun"] .marginalia::before {
  content: '⌐ ';
  font-size: 8px;
  opacity: 0.6;
}
[data-theme="sun"] .marginalia.m-right {
  right: 24px;
  text-align: right;
}
[data-theme="sun"] .marginalia.m-right::before {
  content: ' ⌐';
  float: right;
}
[data-theme="sun"] .marginalia.m-left {
  left: 24px;
  text-align: left;
}
[data-theme="sun"] .marginalia.m-top {
  top: 40px;
}
[data-theme="sun"] .marginalia.m-bottom {
  bottom: 80px;
}
[data-theme="sun"] .marginalia.m-mid {
  top: 50%;
  transform: translateY(-50%);
}

/* ── Reading Trace: right-edge scroll tracker ── */
[data-theme="sun"] .reading-trace {
  position: fixed;
  right: 0;
  top: 0;
  height: 100vh;
  width: 5px;
  z-index: 1001;
  pointer-events: none;
}
[data-theme="sun"] .reading-trace .reading-fill {
  position: absolute;
  top: 0;
  right: 0;
  width: 2px;
  height: 100%;
  background: var(--accent);
  transform: scaleY(0);
  transform-origin: top center;
  opacity: 0.85;
}
[data-theme="sun"] .reading-trace .reading-current {
  position: absolute;
  right: 0;
  width: 3px;
  height: 3px;
  background: var(--accent);
  border-radius: 50%;
  transition: top 0.1s linear;
  box-shadow: 0 0 6px var(--accent);
}
[data-theme="sun"] .reading-trace .reading-furthest {
  position: absolute;
  right: 0;
  width: 2px;
  height: 2px;
  background: var(--pencil-mark);
  opacity: 0.3;
  transition: top 0.3s ease;
}
[data-theme="sun"] .reading-trace .reading-label {
  position: fixed;
  right: 14px;
  bottom: 40px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 7px;
  line-height: 1.5;
  color: var(--muted);
  letter-spacing: 0.06em;
  text-align: right;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  z-index: 1002;
}
[data-theme="sun"] .reading-trace .reading-label.visible {
  opacity: 0.6;
}
[data-theme="sun"] .reading-trace .reading-label .rl-accent {
  color: var(--accent);
}
/* Moon-theme caliper tick bar - not used in Sun; keep it out of the Shaper frame */
[data-theme="sun"] .caliper { display: none; }

/* ── APPROVED stamp ── */
[data-theme="sun"] .approved-stamp {
  position: fixed;
  right: 60px;
  bottom: 80px;
  z-index: 1003;
  pointer-events: none;
  opacity: 0;
  transform: rotate(-8deg) scale(0.5);
  transform-origin: center;
  transition: opacity 0.8s cubic-bezier(0.19, 1, 0.22, 1),
              transform 0.8s cubic-bezier(0.19, 1, 0.22, 1);
}
[data-theme="sun"] .approved-stamp.visible {
  opacity: 0.65;
  transform: rotate(-8deg) scale(1);
}
[data-theme="sun"] .approved-stamp .stamp-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  border: 2px solid var(--pigment);
  padding: 6px 14px 4px;
  font-family: 'JetBrains Mono', monospace;
  text-transform: uppercase;
  color: var(--pigment);
}
[data-theme="sun"] .approved-stamp .stamp-inner .stamp-title {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.18em;
  line-height: 1.3;
}
[data-theme="sun"] .approved-stamp .stamp-inner .stamp-sub {
  font-size: 6px;
  letter-spacing: 0.08em;
  opacity: 0.7;
  line-height: 1.3;
  border-top: 0.5px solid var(--pigment);
  padding-top: 2px;
  margin-top: 2px;
}
[data-theme="sun"] .approved-stamp .stamp-inner .stamp-date {
  font-size: 6px;
  letter-spacing: 0.06em;
  opacity: 0.5;
}

/* ── Provenance: DRAWN BY / CHECKED BY footer bars ── */
[data-theme="sun"] .provenance-bar {
  display: flex;
  gap: 24px;
  padding: 8px 0 0;
  margin-top: 16px;
  border-top: 0.5px solid var(--warm-border);
  font-family: 'JetBrains Mono', monospace;
  font-size: 6px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--sepia);
  opacity: 0.5;
}
[data-theme="sun"] .provenance-bar .pv-label {
  opacity: 0.6;
}
[data-theme="sun"] .provenance-bar .pv-value {
  color: var(--fg);
  opacity: 0.7;
  margin-left: 4px;
}
[data-theme="sun"] .provenance-bar .pv-spacer {
  margin-left: auto;
}

/* ── Sun palette refinements ── */
[data-theme="sun"] {
  --vellum: #f5f3ee;
  --ink: #1a1210;
  --pigment: #c94b32;
  --pigment-bright: #f06a3a;
  --pencil-mark: #e8a640;
  --sepia: #6b5a4a;
  --warm-border: rgba(70, 50, 30, 0.12);
  --warm-shadow: rgba(60, 40, 20, 0.08);
  --sheet-bg: #efebe3;
  --guide-opacity: 0.08;
  --guide-active-opacity: 0.30;
  /* Architected Design: hierarchy via opacity */
  --op-primary: 1;
  --op-secondary: 0.87;
  --op-body: 0.78;
  --op-soft: 0.74;
  --op-tertiary: 0.62;
  --op-muted: 0.55;
  --op-pencil: 0.45;
  --op-faint: 0.10;
}

/* ── Architected Design: tangible vellum depth ── */
[data-theme="sun"] .sun-paper-grain {
  position: fixed;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: 0.045;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ── Architected Design: Seed Concept - every sheet is signed ── */
[data-theme="sun"] .sheet-sign {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 24px 0 0;
  padding: 12px 20px 0;
  border-top: 0.5px dashed var(--warm-border);
}
[data-theme="sun"] .sheet-sign svg {
  width: 92px;
  height: 30px;
  overflow: visible;
}
[data-theme="sun"] .sheet-sign path {
  fill: none;
  stroke: var(--accent);
  stroke-width: 2.4;
  stroke-linecap: round;
}
[data-theme="sun"] .sheet-sign span {
  font-family: var(--font-display);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--fg);
}

/* ── Capabilities / Provenance / References ──
   Shared content panels present in BOTH themes. Styling is theme-agnostic
   (no [data-theme] gating) so they render correctly in Moon too. Uses only
   tokens defined in both themes: --fg/--bg/--accent/--muted/--border/
   --font-display. (The Sun-only --warm-border / --op-soft tokens are NOT
   defined for Moon, so they're swapped for --border / literal 0.74 here.) */
.sun-capgrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  margin-top: 24px;
  border: 0.5px solid var(--border);
}
.sun-cap {
  padding: 22px 18px;
  border-left: 0.5px solid var(--border);
  border-top: 0.5px solid var(--border);
  position: relative;
}
.sun-cap:nth-child(3n+1) { border-left: 0; }
.sun-cap:nth-child(-n+3) { border-top: 0; }
.sc-tick {
  position: absolute;
  right: 14px;
  top: 14px;
  width: 14px;
  height: 14px;
  border: 0.5px solid var(--fg);
  opacity: 0.3;
}
.sc-tick::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 5px;
  width: 5px;
  height: 2px;
  background: var(--accent);
  transform: rotate(-45deg);
}
.sc-tick::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 3px;
  width: 8px;
  height: 2px;
  background: var(--accent);
  transform: rotate(45deg);
}
.sc-idx {
  font-family: "JetBrains Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.18em;
  color: var(--accent);
}
.sc-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  margin: 8px 0 6px;
  color: var(--fg);
}
.sc-desc {
  font-family: Inter, system-ui, sans-serif;
  font-size: 12.5px;
  line-height: 1.6;
  opacity: 0.74;
  color: var(--fg);
}

/* ── Provenance: eco rings ── */
.sun-eco {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 30px;
}
.sun-e { text-align: center; }
.sun-ring {
  width: 120px;
  height: 120px;
  margin: 0 auto 14px;
  position: relative;
}
.sun-ring svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
.se-track { fill: none; stroke: var(--border); stroke-width: 6; }
.se-fill { fill: none; stroke: var(--accent); stroke-width: 6; stroke-linecap: round; }
.se-num {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 26px;
  color: var(--fg);
}
.se-title {
  font-family: Archia, Inter, system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
}
.se-desc {
  font-family: Inter, system-ui, sans-serif;
  font-size: 12.5px;
  opacity: 0.74;
  line-height: 1.6;
  margin-top: 8px;
}

/* ── References: filed records ── */
.sun-refs {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
}
.sun-ref {
  display: flex;
  gap: 18px;
  padding: 18px 0;
  border-top: 0.5px dashed var(--border);
  align-items: flex-start;
}
.sun-ref:first-child { border-top: 0; }
.sr-qr {
  width: 46px;
  height: 46px;
  border: 0.5px solid var(--fg);
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "JetBrains Mono", monospace;
  font-size: 8px;
  color: var(--muted);
  letter-spacing: 0.04em;
  opacity: 0.6;
}
.sr-quote {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.35;
  font-style: italic;
  color: var(--fg);
}
.sr-quote::before { content: "\201C"; }
.sr-quote::after { content: "\201D"; }
.sr-who {
  font-family: "JetBrains Mono", monospace;
  font-size: 9px;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-top: 6px;
}
.sr-who b { color: var(--fg); }

@media (max-width: 680px) {
  .sun-capgrid { grid-template-columns: 1fr 1fr; }
  .sun-cap:nth-child(3n+1) { border-left: 0.5px solid var(--border); }
  .sun-cap:nth-child(2n+1) { border-left: 0; }
  .sun-eco { grid-template-columns: 1fr 1fr; }
}
[data-theme="sun"] .sun-cap {
  padding: 22px 18px;
  border-left: 0.5px solid var(--warm-border);
  border-top: 0.5px solid var(--warm-border);
  position: relative;
}
[data-theme="sun"] .sun-cap:nth-child(3n+1) { border-left: 0; }
[data-theme="sun"] .sun-cap:nth-child(-n+3) { border-top: 0; }
[data-theme="sun"] .sc-tick {
  position: absolute;
  right: 14px;
  top: 14px;
  width: 14px;
  height: 14px;
  border: 0.5px solid var(--fg);
  opacity: 0.3;
}
[data-theme="sun"] .sc-tick::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 5px;
  width: 5px;
  height: 2px;
  background: var(--accent);
  transform: rotate(-45deg);
}
[data-theme="sun"] .sc-tick::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 3px;
  width: 8px;
  height: 2px;
  background: var(--accent);
  transform: rotate(45deg);
}
[data-theme="sun"] .sc-idx {
  font-family: "JetBrains Mono", monospace;
  font-size: 8px;
  letter-spacing: 0.18em;
  color: var(--accent);
}
[data-theme="sun"] .sc-title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 20px;
  margin: 8px 0 6px;
  color: var(--fg);
}
[data-theme="sun"] .sc-desc {
  font-family: Inter, system-ui, sans-serif;
  font-size: 12.5px;
  line-height: 1.6;
  opacity: var(--op-soft);
  color: var(--fg);
}

/* ── Provenance: eco rings ── */
[data-theme="sun"] .sun-eco {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 30px;
}
[data-theme="sun"] .sun-e { text-align: center; }
[data-theme="sun"] .sun-ring {
  width: 120px;
  height: 120px;
  margin: 0 auto 14px;
  position: relative;
}
[data-theme="sun"] .sun-ring svg {
  width: 100%;
  height: 100%;
  transform: rotate(-90deg);
}
[data-theme="sun"] .se-track { fill: none; stroke: var(--warm-border); stroke-width: 6; }
[data-theme="sun"] .se-fill { fill: none; stroke: var(--accent); stroke-width: 6; stroke-linecap: round; }
[data-theme="sun"] .se-num {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 26px;
  color: var(--fg);
}
[data-theme="sun"] .se-title {
  font-family: Archia, Inter, system-ui, sans-serif;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--accent);
}
[data-theme="sun"] .se-desc {
  font-family: Inter, system-ui, sans-serif;
  font-size: 12.5px;
  opacity: var(--op-soft);
  line-height: 1.6;
  margin-top: 8px;
}

/* ── References: filed records ── */
[data-theme="sun"] .sun-refs {
  margin-top: 24px;
  display: flex;
  flex-direction: column;
}
[data-theme="sun"] .sun-ref {
  display: flex;
  gap: 18px;
  padding: 18px 0;
  border-top: 0.5px dashed var(--warm-border);
  align-items: flex-start;
}
[data-theme="sun"] .sun-ref:first-child { border-top: 0; }
[data-theme="sun"] .sr-qr {
  width: 46px;
  height: 46px;
  border: 0.5px solid var(--fg);
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "JetBrains Mono", monospace;
  font-size: 8px;
  color: var(--muted);
  letter-spacing: 0.04em;
  opacity: 0.6;
}
[data-theme="sun"] .sr-quote {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16px;
  line-height: 1.35;
  font-style: italic;
  color: var(--fg);
}
[data-theme="sun"] .sr-quote::before { content: "\201C"; }
[data-theme="sun"] .sr-quote::after { content: "\201D"; }
[data-theme="sun"] .sr-who {
  font-family: "JetBrains Mono", monospace;
  font-size: 9px;
  letter-spacing: 0.08em;
  color: var(--muted);
  margin-top: 6px;
}
[data-theme="sun"] .sr-who b { color: var(--fg); }

@media (max-width: 680px) {
  [data-theme="sun"] .sun-capgrid { grid-template-columns: 1fr 1fr; }
  [data-theme="sun"] .sun-cap:nth-child(3n+1) { border-left: 0.5px solid var(--warm-border); }
  [data-theme="sun"] .sun-cap:nth-child(2n+1) { border-left: 0; }
  [data-theme="sun"] .sun-eco { grid-template-columns: 1fr 1fr; }
}

/* ── Sun pen-nib cursor (the Shaper's hand) ───────────────────────────
   Replaces the OS arrow in Sun only. Moon keeps its own #mz-cursor.
   Ink-layer is a fixed full-viewport SVG overlay (user units = px) where
   tap splats + hold-to-draw annotation strokes render. */
[data-theme="sun"] { cursor: none; }
[data-theme="sun"] input,
[data-theme="sun"] textarea,
[data-theme="sun"] .monozen-chassis { cursor: text; }
[data-theme="sun"] a,
[data-theme="sun"] button,
[data-theme="sun"] [role="button"],
[data-theme="sun"] .stamp-tool,
[data-theme="sun"] .tl-item,
[data-theme="sun"] .project-card-sun { cursor: none; }

#sun-cursor {
  display: none;
  position: fixed; left: 0; top: 0;
  width: 30px; height: 30px;
  margin-left: -15px; margin-top: -29px;   /* tip anchored at pointer */
  pointer-events: none; z-index: 999990;
  opacity: 0; will-change: transform;
}
[data-theme="sun"] #sun-cursor { display: block; }
#sun-cursor svg { display: block; width: 100%; height: 100%; overflow: visible; transform-origin: 15px 29px; }
#sun-cursor .nib-body { fill: var(--ink); stroke: var(--ink); stroke-width: 1.2; }
#sun-cursor .nib-slit { stroke: var(--bg); stroke-width: 1.1; }
#sun-cursor .nib-hole { fill: var(--bg); }
#sun-cursor .tip { fill: var(--pigment); }
#sun-cursor.ink .nib-body { fill: var(--pigment); stroke: var(--pigment); }
#sun-cursor.drawing .nib-body { fill: var(--pigment); stroke: var(--pigment); }

#sun-ink-layer {
  display: none;
  position: fixed; inset: 0;
  pointer-events: none; z-index: 999980;
}
[data-theme="sun"] #sun-ink-layer { display: block; }
#sun-ink-layer path { fill: none; stroke: var(--pigment); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
#sun-ink-layer circle { fill: var(--pigment); }

/* ── Sun grid overlay (visible drafting grid; snaps via data-grid) ─── */
#sun-grid-overlay {
  display: none;
  position: fixed; inset: 0;
  pointer-events: none; z-index: 1;
  background-image:
    linear-gradient(to right, color-mix(in srgb, var(--ink) 9%, transparent) 1px, transparent 1px),
    linear-gradient(to bottom, color-mix(in srgb, var(--ink) 9%, transparent) 1px, transparent 1px);
  background-size: 8px 8px;
}
[data-theme="sun"] #sun-grid-overlay { display: block; }
[data-theme="sun"] body.grid-off #sun-grid-overlay { display: none; }

/* ── S-06 Layer panel (CAD toggles) ─────────────────────────── */
.sun-layer-panel {
  display: none;
  position: fixed; z-index: 1000000;
  top: 64px; right: 18px; width: 210px;
  background: var(--bg);
  border: 1px solid var(--warm-border);
  padding: 10px 12px 12px;
  font-family: 'Departure Mono', 'JetBrains Mono', monospace;
  box-shadow: 0 14px 34px rgba(36,31,26,.22);
}
.sun-layer-panel[hidden] { display: none; }
[data-theme="sun"] .sun-layer-panel { display: block; }
.sun-layer-panel .slp-title { font-size: 9px; letter-spacing: 0.18em; color: var(--muted); margin-bottom: 8px; }
.sun-layer-panel .slp-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 11px; color: var(--fg); padding: 4px 0; cursor: pointer;
}
.sun-layer-panel .slp-row input { accent-color: var(--pigment); margin: 0; }
.sun-layer-panel .slp-sub { margin-left: auto; color: var(--muted); font-size: 9px; }

/* Layer visibility - driven by body classes set in sun-layers.js */
[data-theme="sun"] body.guides-off .draft-guide { display: none !important; }
[data-theme="sun"] body.annotations-off #sun-ink-layer,
[data-theme="sun"] body.annotations-off #sun-dim-layer,
[data-theme="sun"] body.annotations-off .stamp-mark { opacity: 0 !important; pointer-events: none !important; }
[data-theme="sun"] body.grain-off .sun-paper-grain { display: none !important; }
[data-theme="sun"] body.trace-off .reading-trace { display: none !important; }
[data-theme="sun"] body.marginalia-off .marginalia { display: none !important; }

/* ── Sun dimension lines (S-03 CAD measure) ───────────────────────
   Fixed full-viewport SVG overlay; lines/ticks/labels render while the
   dimension tool is active. Groups are clickable for right-click removal. */
#sun-dim-layer {
  display: none;
  position: fixed; inset: 0;
  pointer-events: none; z-index: 999970;
}
[data-theme="sun"] #sun-dim-layer { display: block; }
#sun-dim-layer .dim-group { pointer-events: auto; cursor: pointer; }
#sun-dim-layer .dim-line { stroke: var(--pigment); stroke-width: 1.25; }
#sun-dim-layer .dim-tick { stroke: var(--pigment); stroke-width: 1.25; }
#sun-dim-layer .dim-label {
  fill: var(--pigment);
  font-family: 'Departure Mono', 'JetBrains Mono', monospace;
  font-size: 10px; letter-spacing: 0.06em;
  paint-order: stroke; stroke: var(--bg); stroke-width: 3px;
}

@media (prefers-reduced-motion: reduce) {
  #sun-dim-layer { display: none; }
}

@media (pointer: coarse) {
  #sun-cursor, #sun-ink-layer { display: none !important; }
  [data-theme="sun"] { cursor: auto; }
}
@media (prefers-reduced-motion: reduce) {
  #sun-cursor { display: none !important; }
  [data-theme="sun"] { cursor: auto; }
  [data-theme="sun"] a, [data-theme="sun"] button, [data-theme="sun"] [role="button"],
  [data-theme="sun"] .stamp-tool, [data-theme="sun"] .tl-item, [data-theme="sun"] .project-card-sun { cursor: pointer; }
}