/* ============================================================
   Dissect — site components & layout
   Links the design-system tokens (../styles.css) and builds the
   "one shell, many pages" portfolio on top of them.
   ============================================================ */

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  background:var(--paper); color:var(--text);
  font-family:var(--font-body); -webkit-font-smoothing:antialiased;
  line-height:var(--leading-body);
}
a{ color:inherit; }
/* Full-bleed: the shell IS the window — flush to the viewport top, no
   floating margins, so the chrome reads as intentional, not nested. */
.wrap{ margin:0; padding:0; }
.bloom{ font-family:var(--font-serif); font-style:italic; font-weight:var(--w-med); color:var(--accent); }
.mono{ font-family:var(--font-mono); }
.label{ font-family:var(--font-mono); font-size:var(--t-label); letter-spacing:var(--tracking-label); text-transform:uppercase; color:var(--text-soft); }

/* ---------- buttons / pills / badges ---------- */
.btn{ font-family:var(--font-mono); font-size:12.5px; border:var(--border-w) solid var(--border); background:var(--surface); color:var(--text); padding:9px 16px; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:7px; box-shadow:var(--shadow-sm); transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.btn:hover{ transform:translate(-1px,-1px); box-shadow:4px 4px 0 var(--pop-blue); }
.btn:active{ transform:translate(2px,2px); box-shadow:1px 1px 0 var(--ink); }
.btn--solid{ background:var(--ink); color:var(--paper); }
.btn--solid:hover{ box-shadow:4px 4px 0 var(--accent); }
.btn--accent{ background:var(--accent); color:#fff; }
.btn--pill{ border-radius:var(--radius-pill); }
.btn--sm{ font-size:11px; padding:6px 13px; }
.pill{ display:inline-flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:var(--t-label); letter-spacing:var(--tracking-label); text-transform:uppercase; border:var(--hair-w) solid var(--border); border-radius:var(--radius-pill); padding:5px 13px; background:var(--surface); }
.pill__dot{ width:7px; height:7px; border-radius:50%; background:var(--accent); }
.badge{ font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; background:var(--ink); color:var(--paper); padding:3px 8px; }
.tag{ display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono); font-size:10.5px; border:var(--hair-w) solid var(--border); padding:3px 9px; background:var(--surface); }
.tag i{ width:7px; height:7px; }

/* ---------- BROWSER SHELL (the site frame) ---------- */
.browser{ background:var(--surface); overflow:clip; min-height:100vh; } /* clip, not hidden: hidden kills position:sticky inside */
/* app-window titlebar: traffic-lights + centered title + fullscreen toggle.
   No URL bar or back/forward — so it reads as an app, not a second browser. */
.titlebar{ display:flex; align-items:center; gap:13px; padding:11px 16px; background:var(--ink); }
.titlebar .lights{ display:flex; gap:7px; }
.titlebar .lights i{ width:11px; height:11px; border-radius:50%; display:block; }
.titlebar__t{ font-family:var(--font-mono); font-size:12px; color:#cfc7b4; margin:0 auto; }
.titlebar__fs{ font-size:14px; color:#cfc7b4; background:none; border:0; padding:0; cursor:pointer; }
.titlebar__fs:hover{ color:#fff; }

/* ---------- INLINE WORD ANNOTATIONS ---------- */
/* marked words carry a colored underline (--mk set per word in JS) that
   thickens on hover; hovering draws a leader line to an explanation box. */
.mark{ cursor:help; background-image:linear-gradient(var(--mk,currentColor),var(--mk,currentColor)); background-repeat:no-repeat; background-position:0 100%; background-size:100% .05em; transition:background-size var(--dur) var(--ease-out); }
.mark:hover{ background-size:100% .09em; }
/* focus backdrop: dims + desaturates + blurs everything behind the popup */
.ann-backdrop{ position:fixed; inset:0; z-index:50; opacity:0; pointer-events:none; transition:opacity .2s var(--ease-out); background:rgba(244,240,230,.5); -webkit-backdrop-filter:grayscale(.9) blur(3px); backdrop-filter:grayscale(.9) blur(3px); }
.ann-backdrop.on{ opacity:1; }
.ann-wire{ position:fixed; inset:0; width:100vw; height:100vh; pointer-events:none; z-index:60; }
.ann-wire path{ transition:stroke-dashoffset .4s var(--ease-out); }
.abox{ position:fixed; width:360px; border:var(--border-w) solid var(--border); background:#fff; box-shadow:var(--shadow-lg); z-index:61; pointer-events:none; opacity:0; transform:translateY(8px); transition:opacity .18s, transform .22s var(--ease-pop); }
.abox.on{ opacity:1; transform:none; }
.abox__h{ padding:15px 20px; border-bottom:var(--hair-w) solid var(--hair); }
.abox__pin{ font-family:var(--font-mono); font-weight:var(--w-semi); font-size:10.5px; letter-spacing:.05em; color:#fff; padding:3px 9px; }
.abox__n{ padding:19px 20px; font-size:15.5px; color:var(--ink); line-height:1.62; }
.marks{ display:flex; align-items:center; gap:3px; padding:8px 14px; border-bottom:var(--border-w) solid var(--border); background:var(--paper); flex-wrap:wrap; }
.marks a{ font-family:var(--font-mono); font-size:11.5px; padding:5px 11px; color:var(--text-soft); text-decoration:none; }
.marks a.on{ background:var(--ink); color:var(--paper); }
.marks a:hover:not(.on){ color:var(--ink); }
.marks .sep{ width:1.5px; height:16px; background:var(--hair); margin:0 5px; }

/* ---------- page chrome ---------- */
.viewport{ min-height:540px; }
.page{ padding:60px 44px 64px; background:var(--surface); }
.page--dot{ background-image:var(--tex-dot); background-size:var(--tex-dot-size); }
.page--alt{ background:var(--paper); }
.sechd{ display:flex; align-items:baseline; gap:14px; border-bottom:var(--hair-w) solid var(--border); padding-bottom:12px; margin-bottom:26px; }
.sechd .n{ font-family:var(--font-deco); font-size:16px; }
.sechd h2{ font-family:var(--font-display); font-weight:var(--w-bold); font-size:var(--t-h2); letter-spacing:-.01em; }
.sechd .more{ margin-left:auto; font-family:var(--font-mono); font-size:12px; color:var(--text-soft); }

/* ---------- HOME (speed dial) ---------- */
/* the headline is the page's top line — oversized, with room to breathe */
/* the hero is a sentence of skills; underlined words are hover-to-explain.
   constrained left so annotation boxes have a clear right margin to dock in. */
.home__name{ font-family:var(--font-display); font-weight:var(--w-black); font-size:clamp(52px, 8.5vw, 118px); line-height:1.0; letter-spacing:-.035em; margin:0 0 10px; }
.home__role{ font-family:var(--font-display); font-weight:var(--w-semi); font-size:clamp(20px, 2.4vw, 30px); letter-spacing:-.01em; color:var(--text); margin:0 0 30px; }
/* skills / specialties — squared neobrutalist pills, hover to explain */
.pills{ display:flex; flex-wrap:wrap; gap:12px; max-width:60%; margin:0 0 52px; }
.skill-pill{ font-family:var(--font-mono); font-size:12px; letter-spacing:.05em; text-transform:uppercase; color:#fff; border:var(--border-w) solid var(--border); border-radius:0; padding:9px 15px; box-shadow:var(--shadow-sm); cursor:help; transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.skill-pill:hover{ transform:translate(-2px,-2px); box-shadow:var(--shadow); }
.skill-pill.is-active{ position:relative; z-index:55; } /* stay crisp above the backdrop */
.home__hi{ font-family:var(--font-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-soft); margin-bottom:28px; }
.dial{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.tile{ aspect-ratio:1.4; border:var(--border-w) solid var(--border); box-shadow:var(--shadow-sm); display:flex; flex-direction:column; justify-content:space-between; padding:14px; cursor:pointer; color:#fff; text-decoration:none; transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.tile:hover{ transform:translate(-2px,-2px); box-shadow:var(--shadow); }
.tile__k{ font-family:var(--font-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; opacity:.9; }
.tile__n{ font-family:var(--font-display); font-weight:var(--w-bold); font-size:19px; letter-spacing:-.01em; line-height:1; }
.tile--lite{ background:var(--paper); color:var(--ink); } .tile--lite .tile__k{ opacity:.6; }

/* ---------- PROJECTS (featured + grid) ---------- */
.feat{ border:var(--border-w) solid var(--border); box-shadow:var(--shadow); background:var(--accent-2); color:#fff; display:grid; grid-template-columns:1.25fr 1fr; margin-bottom:22px; }
.feat__l{ padding:28px 30px; display:flex; flex-direction:column; }
.feat__k{ font-family:var(--font-mono); font-size:10px; letter-spacing:.14em; text-transform:uppercase; opacity:.85; }
.feat h3{ font-family:var(--font-display); font-weight:var(--w-black); font-size:34px; line-height:.98; letter-spacing:-.02em; margin:12px 0 6px; }
.feat h3 em{ font-style:italic; color:#fff; font-family:var(--font-serif); }
.feat p{ font-size:13.5px; opacity:.92; max-width:38ch; margin-bottom:16px; }
.feat__get{ margin-top:auto; display:flex; align-items:center; gap:12px; }
.feat__r{ border-left:var(--border-w) solid var(--border); background:#ffffff14; display:flex; align-items:center; justify-content:center; padding:24px; }
.feat__shot{ width:100%; border:var(--border-w) solid var(--border); background:var(--paper); box-shadow:5px 5px 0 #00000040; padding:14px 16px; }
.feat__shot .st{ font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-soft); margin-bottom:10px; }
.feat__shot .cl{ display:block; width:max-content; max-width:100%; font-family:var(--font-display); font-weight:var(--w-bold); font-size:14px; color:var(--ink); border-bottom:2.5px solid; padding-bottom:1px; margin-bottom:8px; }

/* ---------- FEATURE CAROUSEL (themed case studies) ---------- */
.carousel{ margin-bottom:24px; }
.carousel__view{ overflow:hidden; border:var(--border-w) solid var(--border); box-shadow:var(--shadow-lg); }
.carousel__track{ display:flex; align-items:stretch; transition:transform .42s var(--ease-out); }
.carousel__track > .feat{ flex:0 0 100%; border:0; box-shadow:none; margin:0; min-height:430px; }
.carousel__bar{ display:flex; align-items:center; gap:14px; margin-top:16px; }
.carousel__dots{ display:flex; gap:8px; }
.cdot{ width:11px; height:11px; border:var(--hair-w) solid var(--border); background:transparent; padding:0; cursor:pointer; }
.cdot.is-on{ background:var(--ink); }
.cnav{ font-family:var(--font-mono); font-size:14px; width:36px; height:32px; border:var(--hair-w) solid var(--border); background:#fff; cursor:pointer; box-shadow:var(--shadow-sm); transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.cnav:hover{ transform:translate(-1px,-1px); box-shadow:3px 3px 0 var(--ink); }

/* bigger slide layout (overrides base .feat sizing) */
.feat__l{ padding:46px 50px; }
.feat__r{ padding:38px; }
.feat__cta{ font-family:var(--font-mono); font-size:13px; padding:11px 18px; text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition:transform var(--dur-fast) var(--ease-pop); }
.feat__cta:hover{ transform:translate(-2px,-2px); } .feat__cta:active{ transform:translate(2px,2px); }
.feat__stack{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; }
.feat__tag{ font-size:19px; margin:2px 0 16px; }

/* theme: RoleCall — faithful VAUDEVILLE: neobrutalist on a dark stage.
   Tokens mirror the product's colors_and_type.css (Cinzel/Inter/Cormorant/
   JetBrains Mono, #e11d48 rose, #8b5cf6 violet, hard black borders + offset
   shadows, in-panel radial stage-wash — never a soft glow). */
.feat--rolecall{ background:#150a0f; color:#f4f4f5;
  background-image:
    radial-gradient(ellipse 85% 64% at 50% -18%, rgba(225,29,72,.40), transparent 66%),
    radial-gradient(ellipse 55% 52% at 16% 6%, rgba(225,29,72,.18), transparent 60%),
    radial-gradient(ellipse 62% 55% at 96% 116%, rgba(120,20,45,.32), transparent 62%); }
.feat--rolecall .feat__k{ font-family:"Inter",system-ui,sans-serif; font-weight:700; font-size:.72rem; letter-spacing:.22em; text-transform:uppercase; color:#e11d48; opacity:1; }
.feat--rolecall h3{ font-family:"Cinzel",Georgia,serif; font-weight:900; font-size:clamp(46px,5.6vw,80px); text-transform:uppercase; letter-spacing:.1em; line-height:1; color:#f4f4f5; text-shadow:none; }
.feat--rolecall h3 .bloom{ font-family:"Cinzel",Georgia,serif; font-style:normal; color:#e11d48; text-shadow:0 0 12px rgba(251,113,133,.55), 0 0 30px rgba(225,29,72,.6), 0 0 64px rgba(225,29,72,.4), 0 0 104px rgba(225,29,72,.22); }
.feat--rolecall .feat__tag{ font-family:"Inter",system-ui,sans-serif; font-style:italic; font-weight:500; font-size:20px; line-height:1.35; color:#e4e4e7; }
.feat--rolecall p{ font-family:"Inter",system-ui,sans-serif; color:#d4d4d8; }
.feat--rolecall .feat__r{ border-left:var(--border-w) solid #000; background:#100a0d; }
.feat--rolecall .feat__cta{ font-family:"Inter",system-ui,sans-serif; font-weight:600; font-size:13px; letter-spacing:.04em; text-transform:uppercase; background:#e11d48; color:#fafaf9; border:3px solid #000; box-shadow:3px 3px 0 #000; transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.feat--rolecall .feat__cta:hover{ transform:translate(-2px,-2px); box-shadow:6px 6px 0 #000; }
.feat--rolecall .feat__cta:active{ transform:translate(2px,2px); box-shadow:0 0 0 #000; }
.feat--rolecall .feat__stack{ font-family:"JetBrains Mono",ui-monospace,monospace; color:#a1a1aa; }
.feat--rolecall .feat__shot{ width:100%; background:#000; border:3px solid #000; box-shadow:6px 6px 0 #8b5cf6; padding:20px 22px; }
/* RoleCall feature carousel (right panel) */
.rcf{ width:100%; }
.rcf__bar{ display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.rcf__name{ font-family:"JetBrains Mono",ui-monospace,monospace; font-size:10.5px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#a78bfa; }
.rcf__count{ font-family:"JetBrains Mono",ui-monospace,monospace; font-size:10px; color:#71717a; margin-left:auto; }
.rcf__nav{ display:flex; gap:6px; }
.rcf__btn{ width:26px; height:26px; display:grid; place-items:center; background:#26232d; border:2px solid #000; box-shadow:2px 2px 0 #000; color:#e4e4e7; font-size:13px; line-height:1; cursor:pointer; transition:background var(--dur-fast), color var(--dur-fast), transform var(--dur-fast), box-shadow var(--dur-fast); }
.rcf__btn:hover{ background:#8b5cf6; color:#fff; transform:translate(-1px,-1px); box-shadow:3px 3px 0 #000; }
.rcf__btn:active{ transform:translate(1px,1px); box-shadow:0 0 0 #000; }
.rcf .feat__shot.is-in{ animation:ppmIn .4s var(--ease-pop) both; }
@media (prefers-reduced-motion: reduce){ .rcf .feat__shot.is-in{ animation:none; } }
/* syntax-highlighted code spec inside the shot */
.rcf__code{ margin:0; font-family:"JetBrains Mono",ui-monospace,monospace; font-size:13px; line-height:1.62; color:#d4d4d8; white-space:pre; overflow-x:auto; }
.rcf__code .c-com{ color:#6b7280; }
.rcf__code .c-kw{ color:#c4b5fd; }
.rcf__code .c-type{ color:#67e8f9; }
.rcf__code .c-str{ color:#6ee7b7; }
.rcf__code .c-num{ color:#fcd34d; }
.rcf__code .c-arrow{ color:#f472b6; }

/* theme: PlotPoints — faithful Plotlight: editorial cream proscenium. Tokens
   copied from the live plotpoints surface (computed styles): paper #faf8f3,
   ink #0a0a0b, rose #e11d48; Cinzel 900 display, Cinzel 700 rose eyebrow,
   Cormorant Garamond italic tagline + body, mono data labels, black CTA with a
   rose offset shadow. Same neobrut type system as RoleCall, inverted to cream. */
.feat--plotpoints{ background:#faf8f3; color:#0a0a0b; grid-template-columns:1fr 1.05fr; }
.feat--plotpoints .feat__k{ font-family:"Cinzel",Georgia,serif; font-weight:700; font-size:.78rem; letter-spacing:.28em; text-transform:uppercase; color:#e11d48; opacity:1; }
.feat--plotpoints h3{ font-family:"Cinzel",Georgia,serif; font-weight:900; font-size:clamp(44px,5vw,72px); text-transform:uppercase; letter-spacing:-.01em; line-height:.98; color:#000; }
.feat--plotpoints .feat__tag{ font-family:"Cormorant Garamond",Garamond,Georgia,serif; font-style:italic; font-weight:600; font-size:26px; line-height:1.2; color:#e11d48; }
.feat--plotpoints p{ font-family:"Cormorant Garamond",Garamond,Georgia,serif; font-weight:500; font-size:18px; line-height:1.5; color:#1a1a1a; }
.feat--plotpoints .feat__r{ border-left:var(--border-w) solid #0a0a0b; background:#f3efe6; flex-direction:column; align-items:stretch; justify-content:center; gap:24px; }
.feat--plotpoints .feat__cta{ font-family:"Cinzel",Georgia,serif; font-weight:800; font-size:14px; letter-spacing:.16em; text-transform:uppercase; background:#000; color:#faf8f3; border:3px solid #000; box-shadow:5px 5px 0 #e11d48; transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.feat--plotpoints .feat__cta:hover{ transform:translate(-2px,-2px); box-shadow:7px 7px 0 #e11d48; }
.feat--plotpoints .feat__cta:active{ transform:translate(2px,2px); box-shadow:1px 1px 0 #e11d48; }
.feat--plotpoints .feat__stack{ font-family:var(--font-mono); color:#6b6456; }
.pp-live{ display:flex; flex-direction:column; gap:24px; width:100%; }
.pp-axes{ width:100%; }
.pp-axes__h{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:#e11d48; margin-bottom:18px; }
.pp-row{ display:grid; grid-template-columns:minmax(0,1fr) auto 40px; align-items:center; gap:14px; padding:12px 0; border-bottom:1px solid rgba(10,10,11,.16); transition:opacity var(--dur-fast); }
.pp-row__l{ font-family:var(--font-mono); font-size:11.5px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:#1f1f24; }
.pp-badge{ justify-self:end; font-family:var(--font-mono); font-size:10px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; border:1.5px solid #9a9280; color:#9a9280; padding:3px 9px; text-align:center; white-space:nowrap; transition:color var(--dur-fast), border-color var(--dur-fast); }
.pp-row.is-na .pp-badge{ border-color:#cfc7b4; }
.pp-row.is-na .pp-row__l, .pp-row.is-na .pp-rank, .pp-row.is-na .pp-badge{ color:#9a9280; }
.pp-rank{ font-family:var(--font-mono); font-size:13px; font-weight:600; color:#0a0a0b; text-align:right; white-space:nowrap; }
.pp-axes__f{ font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:#8a8270; margin-top:18px; }

/* PlotPoints live model selector — neobrut card on cream: rose offset shadow,
   Cinzel model name + score, mono data labels. Pulled from the leaderboard API. */
.ppm-row{ display:flex; align-items:center; gap:12px; }
.ppm{ flex:1; min-width:0; background:#fff; border:3px solid #0a0a0b; box-shadow:5px 5px 0 #e11d48; cursor:pointer; user-select:none; transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.ppm:hover{ transform:translate(-2px,-2px); box-shadow:7px 7px 0 #e11d48; }
.ppm:focus-visible{ outline:none; box-shadow:7px 7px 0 #e11d48, 0 0 0 3px rgba(225,29,72,.35); }
.ppm__bar{ display:flex; align-items:center; gap:10px; padding:8px 11px; border-bottom:1px solid rgba(10,10,11,.16); }
.ppm__tag{ display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; background:#e11d48; color:#fff; padding:3px 8px; }
.ppm__tag i{ width:5px; height:5px; border-radius:50%; background:#fff; animation:pulse 1.4s ease-in-out infinite; }
.ppm__count{ font-family:var(--font-mono); font-size:10px; color:#8a8270; margin-left:auto; }
.ppm__btn{ flex:none; width:30px; height:34px; display:grid; place-items:center; background:#fff; border:2px solid #0a0a0b; box-shadow:2px 2px 0 #0a0a0b; color:#0a0a0b; font-size:14px; line-height:1; cursor:pointer; transition:background var(--dur-fast), color var(--dur-fast), transform var(--dur-fast), box-shadow var(--dur-fast); }
.ppm__btn:hover{ background:#e11d48; border-color:#0a0a0b; color:#fff; transform:translate(-1px,-1px); box-shadow:3px 3px 0 #0a0a0b; }
.ppm__btn:active{ transform:translate(1px,1px); box-shadow:0 0 0 #0a0a0b; }
.ppm__slot{ padding:14px 14px 16px; opacity:0; }
.ppm__slot.is-in{ animation:ppmIn .4s var(--ease-pop) both; }
.ppm__top{ display:flex; align-items:baseline; gap:10px; }
.ppm__rk{ flex:none; font-family:var(--font-mono); font-size:14px; font-weight:700; color:#e11d48; }
.ppm__name{ font-family:"Cinzel",Georgia,serif; font-weight:700; font-size:19px; line-height:1.08; letter-spacing:.01em; text-transform:uppercase; color:#0a0a0b; }
.ppm__score{ margin-left:auto; font-family:"Cinzel",Georgia,serif; font-weight:900; font-size:23px; line-height:1; color:#000; white-space:nowrap; }
.ppm__score em{ font-style:normal; font-family:var(--font-mono); font-size:10px; font-weight:500; color:#8a8270; }
.ppm__vendor{ display:block; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.06em; text-transform:uppercase; color:#8a8270; margin-top:6px; }
@keyframes ppmIn{ from{ opacity:0; transform:translateY(-6px); } to{ opacity:1; transform:translateY(0); } }
@keyframes pulse{ 50%{ opacity:.3; } }
@media (prefers-reduced-motion: reduce){ .ppm__slot.is-in{ animation:none; opacity:1; } .ppm__tag i{ animation:none; } .ppm{ transition:none; } }

/* ---------- EVAL WORK ---------- */
.ev{ max-width:920px; }
.ev__intro{ font-family:var(--font-body); font-size:15px; line-height:1.65; color:var(--ink); max-width:64ch; margin:2px 0 26px; }
.ev__intro em{ font-style:italic; }
.ev__lead, .ev__hk{ font-family:var(--font-mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-soft); margin:0 0 12px; }

/* PlotPoints board — the cream Plotlight skin, as a full block */
.ppb{ display:block; background:#faf8f3; color:#0a0a0b; border:var(--border-w) solid #0a0a0b; box-shadow:6px 6px 0 #e11d48; padding:26px 26px 20px; }
.ppb__k{ font-family:"Cinzel",Georgia,serif; font-weight:700; font-size:.72rem; letter-spacing:.26em; text-transform:uppercase; color:#e11d48; }
.ppb__head h3{ font-family:"Cinzel",Georgia,serif; font-weight:900; font-size:clamp(30px,4vw,46px); text-transform:uppercase; letter-spacing:-.01em; line-height:1; color:#000; margin:8px 0 12px; }
.ppb__tag{ font-family:"Cormorant Garamond",Garamond,Georgia,serif; font-weight:500; font-size:17px; line-height:1.4; color:#3a352c; max-width:62ch; }
.ppb__cov{ display:flex; flex-wrap:wrap; gap:26px; margin:20px 0; padding:16px 0; border-top:1px solid rgba(10,10,11,.18); border-bottom:1px solid rgba(10,10,11,.18); }
.ppb__stat b{ display:block; font-family:"Cinzel",Georgia,serif; font-weight:900; font-size:24px; color:#000; line-height:1; }
.ppb__stat span{ font-family:var(--font-mono); font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; color:#8a8270; margin-top:5px; display:block; }
.ppb__weights{ margin:18px 0; }
.ppb__wlbl{ font-family:var(--font-mono); font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:#e11d48; margin-bottom:12px; }
.ppb__wrow{ display:grid; grid-template-columns:180px 1fr 42px; align-items:center; gap:12px; padding:5px 0; }
.ppb__wname{ font-family:var(--font-mono); font-size:11px; color:#1f1f24; }
.ppb__wbar{ display:block; height:8px; background:rgba(10,10,11,.08); }
.ppb__wbar i{ display:block; height:100%; background:#e11d48; }
.ppb__wpct{ font-family:var(--font-mono); font-size:11px; font-weight:600; color:#0a0a0b; text-align:right; }
.ppb__movers{ display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:16px 0 22px; }
.ppb__mv{ border:1.5px solid #0a0a0b; padding:9px 11px; background:#fff; }
.ppb__mv b{ display:block; font-family:var(--font-mono); font-size:11px; font-weight:700; margin-bottom:4px; }
.ppb__mv span{ font-family:"Cormorant Garamond",Garamond,Georgia,serif; font-size:14px; line-height:1.3; color:#3a352c; }
.ppb__mv--up b{ color:#15803d; } .ppb__mv--down b{ color:#e11d48; } .ppb__mv--flat b{ color:#8a8270; }
.ppb__tabhd, .ppb__row{ display:grid; grid-template-columns:34px minmax(0,1fr) 128px 74px 56px 48px 52px; align-items:center; gap:10px; }
.ppb__tabhd{ font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:#8a8270; padding:0 0 8px; border-bottom:2px solid #0a0a0b; }
.ppb__row{ padding:9px 0; border-bottom:1px solid rgba(10,10,11,.14); font-family:var(--font-mono); font-size:12px; color:#1f1f24; }
.ppb__row:hover{ background:rgba(225,29,72,.05); }
.ppb__rank{ font-weight:700; color:#e11d48; }
.ppb__mdl b{ font-family:"Cinzel",Georgia,serif; font-weight:700; font-size:13.5px; letter-spacing:.01em; color:#0a0a0b; display:block; }
.ppb__vendor{ display:flex; align-items:center; gap:7px; font-size:9.5px; letter-spacing:.05em; text-transform:uppercase; color:#8a8270; margin-top:3px; }
.ppb__open{ font-style:normal; border:1px solid #9a9280; color:#6b6456; padding:1px 5px; font-size:8.5px; }
.ppb__pill{ font-style:normal; padding:1px 6px; font-size:8.5px; font-weight:700; color:#fff; }
.ppb__pill--rose{ background:#e11d48; } .ppb__pill--green{ background:#15803d; } .ppb__pill--amber{ background:#b45309; } .ppb__pill--teal{ background:#0f766e; } .ppb__pill--plum{ background:#7c3aed; }
.ppb__score{ position:relative; display:flex; align-items:center; height:20px; }
.ppb__scorebar{ position:absolute; left:0; top:0; bottom:0; background:rgba(225,29,72,.16); }
.ppb__score u{ position:relative; text-decoration:none; font-weight:700; color:#000; padding-left:6px; }
.ppb__foot{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:16px; flex-wrap:wrap; }
.ppb__stamp{ font-family:var(--font-mono); font-size:10px; color:#8a8270; }
.ppb__stamp--live::before{ content:"● "; color:#15803d; }
.ppb__flinks{ display:flex; gap:16px; }
.ppb__flinks a{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:#e11d48; text-decoration:none; border-bottom:1px solid transparent; }
.ppb__flinks a:hover{ border-bottom-color:#e11d48; }

/* the private-half harness block */
.ev__harness{ margin:36px 0 8px; border:var(--border-w) solid var(--ink); background:#fff; padding:24px 26px; box-shadow:var(--shadow-sm); }
.ev__ht{ font-family:var(--font-display); font-weight:800; font-size:24px; letter-spacing:-.01em; margin:6px 0 12px; color:var(--ink); }
.ev__harness p{ font-family:var(--font-body); font-size:14px; line-height:1.6; color:var(--ink); max-width:64ch; }
.ev__harness em{ font-style:italic; }
.ev__hgrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:20px 0; }
.ev__hcell{ border:1px solid var(--hair); padding:12px 14px; }
.ev__hcell b{ display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--ink); margin-bottom:5px; }
.ev__hcell span{ font-family:var(--font-body); font-size:12.5px; line-height:1.45; color:var(--text-soft); }
.ev__hnote{ color:var(--text-soft) !important; font-size:13px !important; }
.ev__hlink{ display:inline-block; margin-top:8px; font-family:var(--font-mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; color:var(--clay); text-decoration:none; border-bottom:1px solid var(--clay); }
@media (max-width:640px){ .ppb__tabhd, .ppb__row{ grid-template-columns:26px minmax(0,1fr) 82px 46px; } .ppb__tabhd span:nth-child(n+5), .ppb__row span:nth-child(n+5){ display:none; } .ppb__wrow{ grid-template-columns:120px 1fr 36px; } .ev__hgrid{ grid-template-columns:1fr; } }

/* ---------- AGENT WORK ---------- */
.ag-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:8px; }
.ag-card{ border:var(--border-w) solid var(--ink); background:#fff; box-shadow:var(--shadow-sm); }
.ag-card[open]{ box-shadow:5px 5px 0 var(--accent, var(--clay)); }
.ag-sum{ list-style:none; cursor:pointer; display:flex; align-items:flex-start; gap:12px; padding:16px 18px; }
.ag-sum::-webkit-details-marker{ display:none; }
.ag-sum__main{ flex:1; min-width:0; }
.ag-sum__top{ display:flex; align-items:center; gap:10px; margin-bottom:4px; }
.ag-name{ font-family:var(--font-display); font-weight:800; font-size:18px; letter-spacing:-.01em; color:var(--ink); }
.ag-role{ font-family:var(--font-body); font-size:13px; color:var(--text-soft); line-height:1.35; }
.ag-tag{ font-family:var(--font-mono); font-size:8.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#fff; background:color-mix(in srgb, var(--t, var(--accent, var(--clay))) 78%, #1a1712); padding:2px 7px; white-space:nowrap; }
.ag-open{ font-family:var(--font-mono); font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-soft); border:1px solid var(--hair); padding:3px 8px; white-space:nowrap; align-self:center; }
.ag-card[open] .ag-open{ color:var(--accent, var(--clay)); border-color:var(--accent, var(--clay)); }
.ag-detail{ padding:0 18px 18px; border-top:1px solid var(--hair); }
.ag-brief{ font-family:var(--font-body); font-size:13.5px; line-height:1.6; color:var(--ink); margin:14px 0 4px; }
.ag-spec{ margin-top:16px; }
.ag-spec__l{ font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent, var(--clay)); margin-bottom:7px; }
.ag-aud{ font-family:var(--font-body); font-size:13px; color:var(--ink); }
.ag-prompt{ background:#faf9f6; border:1px solid var(--hair); border-left:3px solid var(--accent, var(--clay)); padding:12px 14px; }
.ag-bp{ font-family:var(--font-mono); font-size:12px; line-height:1.7; color:#2a2620; margin:0; }
.ag-bp + .ag-bp{ margin-top:10px; }
.ag-ul{ margin:0; padding-left:16px; }
.ag-ul li{ font-family:var(--font-body); font-size:13px; line-height:1.55; color:var(--ink); margin:3px 0; }
.ag-tone > div{ font-family:var(--font-body); font-size:13px; line-height:1.5; color:var(--ink); margin:2px 0; }
.ag-tone b{ font-family:var(--font-mono); font-size:10px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-soft); }
.ag-eval{ font-family:var(--font-body); font-size:13px; line-height:1.55; color:var(--text-soft); margin:0; font-style:italic; }

/* dialog flows */
.ag-flows{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:8px; }
.ag-flow{ border:var(--border-w) solid var(--ink); background:#fff; box-shadow:var(--shadow-sm); padding:18px; }
.ag-flow__top{ display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.ag-flow__top b{ font-family:var(--font-display); font-weight:800; font-size:17px; color:var(--ink); }
.ag-flow__goal, .ag-flow__win{ font-family:var(--font-body); font-size:12.5px; line-height:1.45; color:var(--ink); margin:2px 0; }
.ag-flow__win{ color:var(--text-soft); }
.ag-flow__goal b, .ag-flow__win b{ font-family:var(--font-mono); font-size:9.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--accent, var(--clay)); }
.ag-steps{ list-style:none; margin:14px 0 0; padding:0; }
.ag-step{ display:flex; gap:11px; padding:9px 0; border-top:1px solid var(--hair); }
.ag-step__k{ flex:none; width:62px; font-family:var(--font-mono); font-size:8.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:3px 0; text-align:center; height:max-content; color:#fff; background:var(--sk, var(--text-soft)); }
.ag-step--entry{ --sk:#2a9d8f; } .ag-step--exit{ --sk:#2a9d8f; }
.ag-step--agent{ --sk:#6b6456; } .ag-step--capture{ --sk:#b8860b; }
.ag-step--branch{ --sk:#7c3aed; } .ag-step--repair{ --sk:#c25a3c; }
.ag-step--handoff{ --sk:#e11d48; } .ag-step--action{ --sk:#15803d; }
.ag-step__b{ flex:1; min-width:0; }
.ag-step__t{ font-family:var(--font-body); font-size:13px; line-height:1.5; color:var(--ink); }
.ag-step__n{ font-family:var(--font-body); font-size:11.5px; line-height:1.45; color:var(--text-soft); font-style:italic; margin-top:4px; }
.ag-branches{ display:flex; flex-direction:column; gap:5px; margin:7px 0 2px; }
.ag-branch{ font-family:var(--font-mono); font-size:11px; line-height:1.35; color:#2a2620; background:#faf9f6; border-left:2px solid #7c3aed; padding:4px 9px; }

/* skills */
.ag-skills{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:8px; }
.ag-skill{ border:var(--border-w) solid var(--ink); background:#fff; box-shadow:var(--shadow-sm); }
.ag-skill[open]{ box-shadow:5px 5px 0 var(--accent, var(--clay)); }
.ag-skill__sum{ list-style:none; cursor:pointer; padding:15px 17px; position:relative; }
.ag-skill__sum::-webkit-details-marker{ display:none; }
.ag-skill__top{ display:flex; align-items:center; gap:10px; margin-bottom:7px; }
.ag-skill__name{ font-family:var(--font-mono); font-weight:700; font-size:15px; color:var(--ink); background:color-mix(in srgb, var(--accent, var(--clay)) 12%, #fff); padding:2px 8px; }
.ag-skill__purpose{ font-family:var(--font-body); font-size:12.5px; line-height:1.5; color:var(--text-soft); margin:0; }
.ag-skill__sum .ag-open{ position:absolute; top:15px; right:17px; }
.ag-skill__d{ padding:0 17px 17px; border-top:1px solid var(--hair); }
.ag-io{ margin:13px 0 14px; }
.ag-io > div{ font-family:var(--font-body); font-size:12.5px; line-height:1.5; color:var(--ink); }
.ag-io b{ font-family:var(--font-mono); font-size:10px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-soft); }

/* soul document */
.ag-soul{ border:var(--border-w) solid var(--ink); background:#fff; box-shadow:6px 6px 0 var(--accent, var(--teal)); padding:26px 28px; margin-bottom:12px; }
.ag-soul__top{ display:flex; align-items:center; gap:11px; }
.ag-soul__top b{ font-family:var(--font-display); font-weight:800; font-size:24px; letter-spacing:-.01em; color:var(--ink); }
.ag-soul__role{ display:block; font-family:var(--font-body); font-size:13.5px; color:var(--text-soft); margin-top:4px; }
.ag-soul__one{ font-family:var(--font-body); font-size:15px; line-height:1.55; color:var(--ink); font-style:italic; margin:12px 0 0; max-width:60ch; }
.ag-soul__intro{ font-family:var(--font-body); font-size:14px; line-height:1.65; color:var(--ink); margin:16px 0 6px; max-width:64ch; padding-bottom:16px; border-bottom:1px solid var(--hair); }
.ag-soul__s{ margin-top:20px; }
.ag-soul__s h4{ font-family:var(--font-display); font-weight:800; font-size:15px; letter-spacing:.01em; color:var(--accent, var(--teal)); margin:0 0 7px; }
.ag-soul__s .ag-bp{ font-family:var(--font-body); font-size:13.5px; line-height:1.65; color:var(--ink); }
.ag-soul__s .ag-body{ max-width:64ch; }
.ag-soul__fig{ font-family:var(--font-mono); font-size:11.5px; line-height:1.6; color:#2a2620; background:#faf9f6; border:1px solid var(--hair); border-left:3px solid var(--accent, var(--teal)); padding:14px 16px; margin:12px 0; overflow-x:auto; max-width:64ch; }

@media (max-width:760px){ .ag-grid, .ag-flows, .ag-skills{ grid-template-columns:1fr; } }

/* ---------- COLOPHON ---------- */
.co-stats{ display:flex; flex-wrap:wrap; border:var(--border-w) solid var(--ink); background:#fff; box-shadow:var(--shadow-sm); margin:22px 0 26px; }
.co-stat{ flex:1 1 auto; min-width:104px; padding:14px 18px; border-right:1px solid var(--hair); }
.co-stat:last-child{ border-right:0; }
.co-stat b{ display:block; font-family:var(--font-display); font-weight:800; font-size:24px; letter-spacing:-.01em; color:var(--ink); line-height:1; }
.co-stat span{ display:block; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-soft); margin-top:6px; }
/* glass-skin source browser: the whole repo, inspectable in place */
.gs-lead{ margin:34px 0 14px; }
.gs-leadp{ font-family:var(--font-body); font-size:14px; line-height:1.6; color:var(--ink); max-width:64ch; margin:0; }
.gs{ display:grid; grid-template-columns:250px minmax(0,1fr); border:var(--border-w) solid var(--ink); background:#fff; box-shadow:var(--shadow); height:74vh; min-height:480px; }
.gs-tree{ border-right:var(--border-w) solid var(--ink); background:#faf9f6; overflow:auto; padding:12px 10px 18px; }
.gs-th{ font-family:var(--font-mono); font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft); padding:2px 6px 10px; border-bottom:1px solid var(--hair); margin-bottom:8px; }
.gs-d{ margin:0; }
.gs-ds{ list-style:none; cursor:pointer; font-family:var(--font-mono); font-size:12px; font-weight:700; color:#0f766e; padding:3px 6px; user-select:none; }
.gs-ds::-webkit-details-marker{ display:none; }
.gs-ds::before{ content:'▸ '; font-size:9px; color:var(--text-soft); }
.gs-d[open] > .gs-ds::before{ content:'▾ '; }
.gs-ds:hover{ background:color-mix(in srgb, var(--teal) 8%, transparent); }
.gs-di{ padding-left:14px; border-left:1px solid var(--hair); margin-left:9px; }
.gs-f{ display:flex; align-items:baseline; gap:8px; padding:2.5px 6px; cursor:pointer; text-decoration:none; color:inherit; }
.gs-f:hover{ background:color-mix(in srgb, var(--clay) 8%, transparent); }
.gs-f.on{ background:var(--ink); }
.gs-f.on .gs-fn{ color:#fff; } .gs-f.on .gs-fb{ color:#b8a288; }
.gs-fn{ font-family:var(--font-mono); font-size:12px; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gs-fb{ font-family:var(--font-mono); font-size:9.5px; color:var(--text-soft); margin-left:auto; flex:none; }
.gs-view{ overflow:auto; background:#fff; }
.gs-file{ position:sticky; top:0; z-index:2; display:flex; align-items:baseline; gap:14px; background:#1a1712; color:#e8e0d2; padding:10px 16px; }
.gs-crumb{ font-family:var(--font-mono); font-size:12px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.gs-crumb i{ font-style:normal; color:#8a8270; padding:0 4px; }
.gs-meta{ font-family:var(--font-mono); font-size:10px; color:#b8a288; flex:none; margin-left:auto; }
.gs-raw{ font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:#8fc7bd; text-decoration:none; flex:none; }
.gs-raw:hover{ text-decoration:underline; }
.gs-cut{ font-family:var(--font-mono); font-size:10.5px; color:#b45309; background:#fdf3e3; border-bottom:1px solid var(--hair); padding:7px 16px; }
.gs-loading{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); padding:24px 18px; }
.gs-code{ padding:12px 0 26px; }
.gs-ln{ display:flex; }
.gs-ln:hover{ background:#faf6ee; }
.gs-n{ flex:none; width:52px; text-align:right; padding-right:14px; font-family:var(--font-mono); font-size:11px; line-height:1.6; color:#c4bba9; user-select:none; }
.gs-l{ flex:1; min-width:0; font-family:var(--font-mono); font-size:12px; line-height:1.6; color:#2a2620; white-space:pre-wrap; word-break:break-word; padding-right:16px; }
.gs-t-com{ color:#8a8270; font-style:italic; }
.gs-t-str{ color:#0f766e; }
.gs-t-num{ color:#b45309; }
.gs-t-kw{ color:#7c3aed; }
.gs-t-tag{ color:#c2410c; }
@media (max-width:760px){ .gs{ grid-template-columns:1fr; height:auto; } .gs-tree{ max-height:260px; border-right:0; border-bottom:var(--border-w) solid var(--ink); } .gs-view{ max-height:70vh; } }

/* ---------- RÉSUMÉ ---------- */
.rz{ max-width:760px; margin:0 auto; }
.rz__actions{ display:flex; gap:10px; justify-content:flex-end; margin-bottom:14px; }
.rz__btn{ font-family:var(--font-mono); font-size:11px; letter-spacing:.06em; text-transform:uppercase; padding:8px 14px; border:var(--border-w) solid var(--ink); background:#fff; color:var(--ink); cursor:pointer; text-decoration:none; box-shadow:var(--shadow-sm); transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.rz__btn:hover{ transform:translate(-2px,-2px); box-shadow:var(--shadow); }
.rz__btn--accent{ background:var(--ink); color:#fff; }
.rz__sheet{ background:#fff; border:var(--border-w) solid var(--ink); box-shadow:var(--shadow); padding:44px 48px; }
.rz__hd{ border-bottom:2px solid var(--ink); padding-bottom:16px; margin-bottom:6px; }
.rz__name{ font-family:var(--font-display); font-weight:800; font-size:34px; letter-spacing:-.02em; line-height:1; color:var(--ink); }
.rz__title{ font-family:var(--font-body); font-size:15px; color:var(--ink); margin-top:6px; }
.rz__loc{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); margin-top:6px; }
.rz__contact{ display:flex; flex-wrap:wrap; gap:8px; align-items:baseline; margin-top:10px; font-family:var(--font-mono); font-size:11.5px; }
.rz__contact a{ color:var(--clay); text-decoration:none; }
.rz__contact a:hover{ text-decoration:underline; }
.rz__dot{ color:var(--text-soft); }
.rz__sec{ margin-top:22px; }
.rz__h{ font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--clay); border-bottom:1px solid var(--hair); padding-bottom:5px; margin-bottom:10px; }
.rz__sum{ font-family:var(--font-body); font-size:13.5px; line-height:1.6; color:var(--ink); margin:0; }
.rz__skills{ display:flex; flex-direction:column; gap:7px; }
.rz__skgrp{ display:grid; grid-template-columns:150px 1fr; gap:12px; align-items:baseline; }
.rz__skgrp b{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-soft); }
.rz__skgrp span{ font-family:var(--font-body); font-size:13px; line-height:1.5; color:var(--ink); }
.rz__job{ margin-bottom:14px; }
.rz__jobhd{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.rz__role{ font-family:var(--font-display); font-weight:800; font-size:15px; color:var(--ink); }
.rz__org{ font-family:var(--font-body); font-size:13.5px; color:var(--ink); }
.rz__when{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); margin-left:auto; }
.rz__ul{ margin:6px 0 0; padding-left:17px; }
.rz__ul li{ font-family:var(--font-body); font-size:13px; line-height:1.55; color:var(--ink); margin:3px 0; }
.rz__ossline{ font-family:var(--font-body); font-size:13.5px; font-weight:600; color:var(--ink); margin:0 0 6px; }
.rz__stars{ font-family:var(--font-mono); font-size:11px; color:var(--ochre); }

/* print / PDF: drop all the shell chrome, compact to a single page */
@media print {
  @page { margin:11mm; }
  .titlebar, .marks, .foot, .rz__actions { display:none !important; }
  body, .wrap, .browser, .viewport, .page { margin:0 !important; padding:0 !important; background:#fff !important; border:0 !important; box-shadow:none !important; max-width:none !important; }
  .browser { border:0 !important; }
  .rz, .rz__sheet { max-width:none !important; border:0 !important; box-shadow:none !important; padding:0 !important; margin:0 !important; }
  .rz__job, .rz__sec { page-break-inside:avoid; }
  a { color:#1a1712 !important; }
  /* compaction so a short résumé lands on one page */
  .rz__hd { padding-bottom:11px; margin-bottom:2px; }
  .rz__name { font-size:25px; }
  .rz__title { font-size:13px; margin-top:4px; }
  .rz__loc, .rz__contact { margin-top:5px; }
  .rz__sec { margin-top:13px; }
  .rz__h { padding-bottom:3px; margin-bottom:7px; }
  .rz__sum, .rz__skgrp span, .rz__ul li { font-size:11.5px; line-height:1.42; }
  .rz__skills { gap:4px; }
  .rz__job { margin-bottom:9px; }
  .rz__ul { margin-top:3px; }
  .rz__ul li { margin:1.5px 0; }
  .rz__role { font-size:14px; }
}
.appgrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.app{ border:var(--border-w) solid var(--border); background:#fff; padding:15px; display:flex; align-items:center; gap:13px; box-shadow:var(--shadow-sm); cursor:pointer; text-decoration:none; transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.app:hover{ transform:translate(-2px,-2px); box-shadow:var(--shadow); }
.app__ic{ width:56px; height:56px; border:var(--border-w) solid var(--border); display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:15px; font-weight:var(--w-bold); color:#fff; flex:none; background:color-mix(in srgb, var(--ic, #1a1712) 68%, #1a1712); }
.app__i{ flex:1; min-width:0; }
.app__n{ font-family:var(--font-display); font-weight:var(--w-bold); font-size:16px; letter-spacing:-.01em; margin-bottom:3px; }
.app__c{ font-family:var(--font-mono); font-size:12px; color:var(--ink); }

/* ---------- DISSECTION (prompts) ---------- */
/* prompt manager: a preset shown as its real module list, full width */
.pm-wrap{ max-width:none; }
.pm-list{ margin-top:10px; border-top:var(--border-w) solid var(--ink); }
.pm{ border-bottom:1px solid var(--hair); }
.pm__sum{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:14px; padding:11px 8px; }
.pm__sum::-webkit-details-marker{ display:none; }
.pm__sum:hover{ background:color-mix(in srgb, var(--accent, var(--clay)) 5%, transparent); }
.pm__n{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); width:26px; text-align:right; flex:none; }
.pm__mid{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.pm__top{ display:flex; align-items:center; gap:12px; }
.pm__name{ font-family:var(--font-display); font-weight:700; font-size:15.5px; color:var(--ink); }
.pm--off .pm__name{ color:var(--text-soft); font-weight:500; }
.pm__intent{ width:max-content; max-width:100%; font-family:var(--font-body); font-size:11.5px; line-height:1.4; color:var(--text-soft); border-bottom:1px dotted color-mix(in srgb, var(--accent, var(--clay)) 45%, var(--hair)); }
.pm__badges{ display:flex; gap:6px; }
.pm__b{ font-family:var(--font-mono); font-size:8.5px; font-weight:700; letter-spacing:.07em; padding:2px 6px; color:#fff; background:color-mix(in srgb, var(--c) 74%, #1a1712); }
.pm__b--note{ background:transparent; color:var(--text-soft); border:1px solid var(--hair); }
.pm__tok{ margin-left:auto; font-family:var(--font-mono); font-size:10px; letter-spacing:.03em; color:var(--text-soft); flex:none; }
/* README is a comment, not a sent prompt: set clearly apart */
.pm--note{ border-left:3px dashed var(--hair); background:color-mix(in srgb, var(--ink) 3%, transparent); margin-bottom:8px; }
.pm--note .pm__name{ color:var(--text-soft); font-weight:600; }
.pm--note .pm__n{ color:var(--hair); }
.pm__chev{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); flex:none; transition:transform .15s var(--ease-out); }
.pm[open] .pm__chev{ transform:rotate(90deg); }
.pm--off{ opacity:.6; }
.pm--pivot{ border-left:3px solid var(--accent, var(--clay)); }
.pm--pivot .pm__sum{ background:color-mix(in srgb, var(--accent, var(--clay)) 6%, transparent); }
/* THE GAME as a power-on init sequence */
.boot{ font-family:var(--font-mono); padding:0 8px 28px 48px; }
.boot__bar{ height:0; border-top:2px dashed var(--ink); margin:0 0 18px; } /* the hard line break */
.boot__title{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--ink); margin-bottom:14px; }
.boot__seq{ display:flex; flex-direction:column; gap:6px; max-width:56ch; }
.boot__ln{ display:flex; align-items:baseline; gap:8px; font-size:12.5px; color:var(--ink-soft); opacity:0; animation:bootln .28s var(--ease-out, ease) forwards; }
.boot__k{ white-space:nowrap; }
.boot__dots{ flex:1; border-bottom:1px dotted var(--hair); transform:translateY(-3px); }
.boot__v{ color:var(--accent, var(--clay)); text-transform:uppercase; letter-spacing:.07em; white-space:nowrap; }
.boot__tail{ margin-top:18px; font-family:var(--font-mono); font-size:12.5px; letter-spacing:.02em; line-height:1.6; color:var(--ink); max-width:78ch; opacity:0; animation:bootln .3s var(--ease-out, ease) forwards; }
.boot__macro{ color:var(--accent, var(--clay)); }
.boot__cursor{ display:inline-block; width:7px; height:14px; background:var(--accent, var(--clay)); margin-left:5px; vertical-align:-2px; animation:blink 1s step-end infinite; }
/* README, rendered as the doc's front matter */
.rdme{ padding:6px 8px 26px 48px; max-width:80ch; }
.rdme__t{ font-family:var(--font-mono); font-size:10px; letter-spacing:.13em; text-transform:uppercase; color:var(--text-soft); margin-bottom:10px; }
.rdme__p{ font-family:var(--font-body); font-size:14.5px; line-height:1.7; color:var(--ink-soft); margin:0 0 13px; }
.rdme__p:first-of-type{ color:var(--ink); }
.rdme__src{ margin-top:18px; padding-top:14px; border-top:1px solid var(--hair); display:flex; flex-direction:column; gap:6px; }
.rdme__srch{ font-family:var(--font-mono); font-size:9px; letter-spacing:.13em; text-transform:uppercase; color:var(--text-soft); margin-bottom:2px; }
.rdme__a{ font-family:var(--font-mono); font-size:12px; color:var(--accent, var(--clay)); text-decoration:none; border-bottom:1px solid transparent; width:max-content; }
.rdme__a:hover{ border-bottom-color:var(--accent, var(--clay)); }
@keyframes bootln{ from{ opacity:0; transform:translateY(3px); } to{ opacity:1; transform:none; } }
@keyframes blink{ 50%{ opacity:0; } }
.pm__body{ font-family:var(--font-body); font-size:14.5px; line-height:1.66; color:var(--ink-soft); white-space:pre-wrap; padding:4px 8px 24px 48px; max-width:92ch; }
/* inline macro chip */
.mac{ font-family:var(--font-mono); font-size:.86em; padding:1px 5px; background:color-mix(in srgb, var(--accent, var(--clay)) 10%, #fff); color:color-mix(in srgb, var(--accent, var(--clay)) 70%, var(--ink)); border:1px solid color-mix(in srgb, var(--accent, var(--clay)) 22%, var(--hair)); white-space:nowrap; }
/* read-the-code pointers in case articles */
.art__srcrow{ display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; margin:6px 0 4px; }
.art__srclbl{ font-family:var(--font-mono); font-size:8.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-soft); }
.art__src{ font-family:var(--font-mono); font-size:10.5px; color:var(--accent, var(--clay)); text-decoration:none; border:1px solid color-mix(in srgb, var(--accent, var(--clay)) 35%, var(--hair)); padding:2px 8px; background:#fff; }
.art__src:hover{ background:color-mix(in srgb, var(--accent, var(--clay)) 9%, #fff); }
/* rendered markdown inside module bodies */
.mdh{ display:block; font-family:var(--font-display); font-weight:800; font-size:13px; letter-spacing:.04em; color:var(--ink); margin:12px 0 2px; }
.mdc{ font-family:var(--font-mono); font-size:.88em; background:color-mix(in srgb, var(--ink) 6%, transparent); padding:0 4px; }
/* a long macro (comment block / big payload) rendered as a readable block */
.macblock{ display:block; font-family:var(--font-mono); font-size:11.5px; line-height:1.55; white-space:pre-wrap; color:var(--ink-soft); background:color-mix(in srgb, var(--ink) 4%, transparent); border-left:3px solid color-mix(in srgb, var(--accent, var(--clay)) 35%, var(--hair)); padding:10px 13px; margin:6px 0; }
/* filler: what the macros resolve to */
.filler{ margin:0 8px 24px 48px; max-width:80ch; border-left:2px solid color-mix(in srgb, var(--accent, var(--clay)) 35%, var(--hair)); padding:10px 0 4px 14px; }
.filler__h{ font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-soft); margin-bottom:11px; }
.filler__row{ display:flex; gap:10px; align-items:baseline; margin-bottom:9px; font-family:var(--font-body); font-size:13px; line-height:1.5; }
.filler__k{ font-family:var(--font-mono); font-size:11px; color:var(--ink); background:color-mix(in srgb, var(--ink) 7%, transparent); padding:1px 7px; white-space:nowrap; flex:none; }
.filler__arrow{ color:var(--text-soft); flex:none; }
.filler__v{ color:var(--ink-soft); }
/* the collapsed tense/POV/length picker */
.picker{ display:flex; flex-direction:column; gap:18px; padding:6px 8px 24px 48px; }
.picker__g{ display:flex; flex-direction:column; gap:7px; }
.picker__row{ display:flex; align-items:center; gap:16px; }
.picker__prompt{ font-family:var(--font-body); font-size:13px; line-height:1.55; color:var(--ink-soft); padding-left:78px; max-width:80ch; }
.picker__lbl{ font-family:var(--font-mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft); width:62px; flex:none; }
.picker__opts{ display:flex; gap:8px; flex-wrap:wrap; }
.picker__o{ font-family:var(--font-mono); font-size:12px; padding:5px 13px; border:1.5px solid var(--hair); background:#fff; color:var(--ink-soft); cursor:pointer; transition:border-color .12s, background .12s; }
.picker__o:hover{ border-color:var(--accent, var(--clay)); }
.picker__o.on{ border-color:var(--accent, var(--clay)); background:color-mix(in srgb, var(--accent, var(--clay)) 12%, #fff); color:var(--ink); font-weight:600; }
/* macro placeholder inside a condensed framing block */
.pm__macro{ display:inline-block; font-family:var(--font-mono); font-size:12.5px; color:var(--accent, var(--clay)); background:color-mix(in srgb, var(--accent, var(--clay)) 9%, #fff); border:1px dashed color-mix(in srgb, var(--accent, var(--clay)) 50%, var(--hair)); padding:3px 9px; margin:3px 0; }
/* BunnyMo: two-pane docs layout — nav holds the system, main shows one view */
.bn{ display:grid; grid-template-columns:240px 1fr; gap:0; align-items:start; }
.bn-nav{ position:sticky; top:76px; max-height:calc(100vh - 96px); overflow-y:auto; background:#fff; border:var(--border-w) solid var(--ink); box-shadow:var(--shadow-sm); padding:20px 0 26px; }
.bn-nt{ font-family:var(--font-display); font-weight:800; font-size:16px; color:var(--ink); padding:0 18px 2px; }
.bn-ns{ font-family:var(--font-mono); font-size:9.5px; color:var(--text-soft); padding:0 18px 14px; }
.bn-nh{ font-family:var(--font-mono); font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:var(--text-soft); padding:15px 18px 5px; }
.bn-a{ display:flex; justify-content:space-between; align-items:baseline; gap:10px; padding:5px 18px; cursor:pointer; font:inherit; text-align:left; background:none; border:0; border-left:3px solid transparent; }
.bn-a b{ font-family:var(--font-body); font-weight:600; font-size:12.5px; color:var(--ink-soft); }
.bn-a span{ font-family:var(--font-mono); font-size:9px; color:var(--hair); }
.bn-a:hover b{ color:var(--ink); }
.bn-a.on{ border-left-color:var(--accent, var(--clay)); background:color-mix(in srgb, var(--accent, var(--clay)) 6%, transparent); }
.bn-a.on b{ color:var(--accent, var(--clay)); }
.bn-main{ padding:6px 0 80px 52px; min-width:0; }
.bn-view{ display:none; max-width:760px; }
.bn-view.on{ display:block; }
.bn-crumb{ font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-soft); margin-bottom:12px; }
.bn-title{ font-family:var(--font-display); font-weight:800; font-size:34px; letter-spacing:-.02em; color:var(--ink); margin:0 0 6px; }
.bn-sub{ display:flex; gap:14px; align-items:baseline; margin-bottom:14px; }
.bn-lede{ font-family:var(--font-body); font-size:14.5px; line-height:1.7; color:var(--ink-soft); max-width:64ch; margin:0 0 26px; }
/* the loop diagram on the landing view */
.bn-h2{ font-family:var(--font-mono); font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--text-soft); margin:36px 0 14px; }
.bn-pipe{ display:grid; grid-template-columns:1fr 30px 1fr 30px 1fr 30px 1fr; align-items:stretch; }
.bn-stage{ background:#fff; border:var(--border-w) solid var(--ink); box-shadow:4px 4px 0 var(--ink); padding:13px 14px; }
.bn-stage b{ display:block; font-family:var(--font-display); font-weight:800; font-size:14px; color:var(--ink); }
.bn-stage span{ font-family:var(--font-mono); font-size:8.5px; letter-spacing:.05em; color:var(--accent, var(--clay)); }
.bn-stage p{ font-family:var(--font-body); font-size:11px; line-height:1.5; color:var(--ink-soft); margin:6px 0 0; }
.bn-arr{ display:flex; align-items:center; justify-content:center; font-family:var(--font-mono); font-size:14px; color:var(--text-soft); }
.bn-plugrow{ border-left:2px dashed var(--hair); margin:14px 0 0 16px; padding:12px 0 0 20px; }
.bn-plugh{ font-family:var(--font-mono); font-size:9px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-soft); margin-bottom:9px; }
.bn-plugs{ display:flex; flex-wrap:wrap; gap:7px; }
.bn-plug{ display:flex; align-items:baseline; gap:7px; background:#fff; border:1.5px solid var(--ink); padding:6px 11px; cursor:pointer; }
.bn-plug:hover{ background:color-mix(in srgb, var(--accent, var(--clay)) 8%, #fff); }
.bn-plug b{ font-family:var(--font-display); font-weight:700; font-size:12px; color:var(--ink); }
.bn-plug span{ font-family:var(--font-mono); font-size:8.5px; color:var(--text-soft); }
@media(max-width:980px){ .bn{ grid-template-columns:1fr; } .bn-nav{ position:static; max-height:none; display:flex; flex-wrap:wrap; gap:2px 0; padding-bottom:12px; } .bn-main{ padding-left:0; padding-top:26px; } .bn-pipe{ grid-template-columns:1fr; } .bn-arr{ transform:rotate(90deg); padding:4px 0; } }
/* pack view pieces */
.pk__theme{ font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--accent, var(--clay)); }
.pk__count{ font-family:var(--font-mono); font-size:10px; color:var(--text-soft); }
.pk__show{ border-left:3px solid color-mix(in srgb, var(--accent, var(--clay)) 45%, var(--hair)); padding:10px 0 4px 14px; margin-bottom:24px; }
.pk__showh{ font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-soft); margin-bottom:10px; }
.pk__entry{ font-family:var(--font-body); font-size:14px; line-height:1.66; color:var(--ink-soft); white-space:pre-wrap; max-width:78ch; }
/* pack footer: download + browse-all */
.pk__foot{ margin-top:16px; padding-top:12px; border-top:1px solid var(--hair); }
.pk__dl{ display:inline-block; font-family:var(--font-mono); font-size:11px; color:var(--accent, var(--clay)); text-decoration:none; border:1.5px solid color-mix(in srgb, var(--accent, var(--clay)) 45%, var(--hair)); padding:4px 11px; margin-bottom:10px; }
.pk__dl:hover{ background:color-mix(in srgb, var(--accent, var(--clay)) 9%, #fff); }
.pk__links{ display:flex; gap:10px; margin-top:14px; }
.pk__repo{ font-family:var(--font-mono); font-size:11.5px; color:var(--ink); text-decoration:none; border:1.5px solid var(--ink); padding:5px 12px; box-shadow:var(--shadow-sm); background:#fff; }
.pk__repo:hover{ background:color-mix(in srgb, var(--accent, var(--clay)) 9%, #fff); }
/* browse-all: every raw entry, lazy-loaded */
.brw__sum{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:8px; font-family:var(--font-mono); font-size:11px; letter-spacing:.05em; text-transform:uppercase; color:var(--text-soft); padding:4px 0; }
.brw__sum::-webkit-details-marker{ display:none; }
.brw__sum:hover{ color:var(--ink); }
.brw[open] .brw__sum .pm__chev{ transform:rotate(90deg); }
.brw__list{ margin-top:8px; border-top:1px solid var(--hair); max-height:520px; overflow-y:auto; }
.brw__loading{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); padding:10px 4px; }
.brw__e{ border-bottom:1px solid var(--hair); }
.brw__eh{ list-style:none; cursor:pointer; display:flex; align-items:baseline; gap:12px; padding:8px 4px; }
.brw__eh::-webkit-details-marker{ display:none; }
.brw__eh:hover{ background:color-mix(in srgb, var(--accent, var(--clay)) 4%, transparent); }
.brw__en{ font-family:var(--font-body); font-weight:600; font-size:12.5px; color:var(--ink); }
.brw__keys{ font-family:var(--font-mono); font-size:9.5px; color:var(--text-soft); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.brw__raw{ font-family:var(--font-mono); font-size:11px; line-height:1.5; color:var(--ink-soft); white-space:pre-wrap; background:color-mix(in srgb, var(--ink) 4%, transparent); padding:10px 12px; margin:0 4px 10px; }
/* restrained theme accents — same tokens, ~10% theme */
.pk--linguistics .pk__entry{ font-family:var(--font-mono); font-size:12px; background:#211f19; color:#D6CFBC; padding:16px 18px; border-left:4px solid var(--teal); }
.pk--linguistics .pk__entry .ann{ color:#F3EEE1; }
.pk--species .pk__show--entry{ border:2.5px double var(--ink); padding:14px 16px; background:color-mix(in srgb, var(--sage) 6%, #fff); }
.pk--bsm5 .pk__show--entry{ border-top:3px solid var(--ink); padding-top:12px; border-left:none; }
.pk--bsm5 .pk__show--entry .pk__showh{ font-size:10px; letter-spacing:.2em; }
/* label -> note breakdown rows */
.parts{ display:flex; flex-direction:column; gap:8px; }
.parts__row{ display:flex; gap:12px; align-items:baseline; font-size:13px; line-height:1.5; max-width:82ch; }
.parts__k{ font-family:var(--font-mono); font-size:10.5px; color:var(--ink); background:color-mix(in srgb, var(--ink) 7%, transparent); padding:1px 7px; white-space:nowrap; flex:none; min-width:108px; }
.parts__v{ color:var(--ink-soft); }
/* genre switcher: tabs over a single prompt panel */
.sw{ padding:6px 8px 24px 48px; }
.sw__tabs{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:16px; }
.sw__tab{ display:flex; flex-direction:column; align-items:flex-start; gap:1px; padding:6px 11px; border:1.5px solid var(--hair); background:#fff; cursor:pointer; text-align:left; transition:border-color .12s, background .12s; }
.sw__tab:hover{ border-color:var(--accent, var(--clay)); }
.sw__tab.on{ border-color:var(--accent, var(--clay)); background:color-mix(in srgb, var(--accent, var(--clay)) 12%, #fff); }
.sw__g{ font-family:var(--font-display); font-weight:700; font-size:12.5px; color:var(--ink); }
.sw__h{ font-family:var(--font-mono); font-size:8px; letter-spacing:.09em; color:var(--text-soft); }
.sw__panel{ font-family:var(--font-body); font-size:14.5px; line-height:1.66; color:var(--ink-soft); white-space:pre-wrap; max-width:92ch; }
/* a roulette entry rendered as readable craft, not macros */
.dcard{ display:flex; flex-direction:column; gap:11px; white-space:normal; }
.dcard__rule{ font-family:var(--font-body); font-size:14.5px; line-height:1.6; color:var(--ink); margin:0; max-width:82ch; }
.dcard__row{ display:flex; gap:12px; align-items:baseline; font-size:12.5px; line-height:1.55; max-width:82ch; }
.dcard__k{ font-family:var(--font-mono); font-size:9px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-soft); width:58px; flex:none; }
.dcard__v{ color:var(--ink-soft); }
.dissect{ position:relative; display:grid; grid-template-columns:1.1fr .9fr; gap:48px; align-items:start; margin-bottom:30px; }
.specimen{ display:flex; flex-direction:column; gap:10px; }
.clause{ position:relative; width:max-content; max-width:100%; font-family:var(--font-display); font-weight:var(--w-bold); font-size:clamp(18px,2vw,23px); line-height:1.15; padding:6px 3px; border-bottom:2.5px solid; }
.clause .cx{ font-family:var(--font-mono); font-size:11px; font-weight:var(--w-semi); color:#fff; padding:1px 6px; margin-right:10px; vertical-align:3px; }
.inspector{ border:var(--border-w) solid var(--border); background:#fff; box-shadow:var(--shadow); }
.inspector__h{ display:flex; justify-content:space-between; font-family:var(--font-mono); font-size:10.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--text-soft); padding:12px 16px; border-bottom:var(--hair-w) solid var(--hair); }
.irow{ padding:14px 16px; border-bottom:1px solid var(--hair); }
.irow:last-child{ border-bottom:none; }
.irow .rt{ display:flex; align-items:center; gap:9px; margin-bottom:6px; }
.irow .pin{ font-family:var(--font-mono); font-weight:var(--w-semi); font-size:10px; color:#fff; padding:2px 7px; }
.irow .rx{ font-family:var(--font-deco); font-size:11px; color:#a99f88; margin-left:auto; }
.irow .rn{ font-size:13px; color:var(--text-soft); line-height:1.45; }
svg.wire{ position:absolute; inset:0; pointer-events:none; z-index:5; }

/* ---------- PROMPTS gallery ---------- */
.promptgrid{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-top:34px; }
.pcard{ border:var(--border-w) solid var(--border); background:#fff; box-shadow:var(--shadow-sm); padding:16px 18px; transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.pcard:hover{ transform:translate(-2px,-2px); box-shadow:var(--shadow); }
.pcard__h{ display:flex; align-items:center; gap:9px; margin-bottom:11px; }
.pcard__h .pin{ font-family:var(--font-mono); font-weight:var(--w-semi); font-size:10px; color:#fff; padding:2px 7px; }
.pcard__h .fx{ font-family:var(--font-deco); font-size:11px; color:#a99f88; margin-left:auto; }
.pcard__code{ font-family:var(--font-mono); font-size:12px; line-height:1.7; color:var(--ink); }
.pcard__code .k{ font-weight:var(--w-semi); } .pcard__code .c{ color:#a59c87; }

/* ---------- MODEL RANKINGS (leaderboard) ---------- */
.lb{ border:var(--border-w) solid var(--border); background:#fff; }
.lb__row{ display:grid; grid-template-columns:54px 1.5fr 1.3fr 1.6fr; gap:16px; align-items:center; padding:14px 18px; border-bottom:1px solid var(--hair); }
.lb__row:last-child{ border-bottom:none; }
.lb__row--h{ background:var(--paper); border-bottom:var(--border-w) solid var(--border); }
.lb__row--h span{ font-family:var(--font-mono); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-soft); }
.lb .rk{ font-family:var(--font-deco); font-size:22px; color:var(--text-soft); }
.lb .rk.top{ color:var(--accent); }
.lb .m .mn{ font-family:var(--font-display); font-weight:var(--w-bold); font-size:16px; letter-spacing:-.01em; }
.lb .m .mk{ font-family:var(--font-mono); font-size:10px; color:var(--text-soft); }
.lb .score{ display:flex; align-items:center; gap:10px; }
.lb .bar{ flex:1; height:9px; border:var(--hair-w) solid var(--ink); background:var(--paper); position:relative; }
.lb .bar i{ position:absolute; left:0; top:0; bottom:0; }
.lb .score .num{ font-family:var(--font-mono); font-size:12px; font-weight:var(--w-semi); width:34px; text-align:right; }
.lb .verdict{ font-size:13px; color:var(--text-soft); line-height:1.4; }
.lb .verdict em{ font-family:var(--font-serif); font-style:italic; color:var(--ink); }
.lb__note{ display:flex; gap:18px; flex-wrap:wrap; margin-top:16px; font-family:var(--font-mono); font-size:11px; color:var(--text-soft); }
.lb__note b{ color:var(--ink); }

/* ---------- shared: stat row + langbar + codeblock ---------- */
.statrow{ display:flex; border:var(--border-w) solid var(--border); margin-bottom:22px; }
.statrow .stat{ flex:1; padding:14px 18px; border-right:1px solid var(--hair); }
.statrow .stat:last-child{ border-right:none; }
.statrow .stat b{ font-family:var(--font-display); font-weight:var(--w-black); font-size:26px; letter-spacing:-.02em; display:block; }
.statrow .stat span{ font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-soft); }
.codeblock{ border:var(--hair-w) solid var(--border); background:#FBFAF4; font-family:var(--font-mono); font-size:12.5px; line-height:1.95; padding:14px 16px; margin:14px 0; }
.codeblock .c{ color:#a59c87; } .codeblock .k{ font-weight:var(--w-semi); }
.langbar{ display:flex; height:9px; border:1px solid var(--ink); margin:8px 0 9px; }
.langbar i{ height:100%; }
.leg{ display:flex; flex-direction:column; gap:5px; }
.leg span{ font-family:var(--font-mono); font-size:11px; display:flex; align-items:center; gap:7px; color:var(--text-soft); }
.leg span i{ width:9px; height:9px; }

/* ---------- PROJECT DETAIL (README + graph) ---------- */
.doc{ display:grid; grid-template-columns:1fr 264px; gap:30px; align-items:start; }
.doc h1{ font-family:var(--font-display); font-weight:var(--w-black); font-size:var(--t-h1); line-height:.98; letter-spacing:-.025em; margin-bottom:6px; }
.doc h1 em{ font-style:italic; color:var(--accent); font-family:var(--font-serif); }
.doc__sub{ font-family:var(--font-serif); font-size:16px; color:var(--text-soft); margin-bottom:18px; }
.doc__prose h3{ font-family:var(--font-display); font-weight:var(--w-bold); font-size:17px; margin:24px 0 8px; }
.doc__prose p{ font-size:14.5px; color:var(--ink-soft); margin-bottom:10px; max-width:62ch; }
.doc__prose p em{ font-family:var(--font-serif); font-style:italic; color:var(--ink); }
.doc__side .box{ border:var(--border-w) solid var(--border); background:#fff; padding:15px 16px; margin-bottom:16px; }
.doc__side .st{ font-family:var(--font-mono); font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-soft); margin-bottom:9px; }
.doc__side .box p{ font-size:12.5px; color:var(--ink-soft); margin-bottom:6px; }
.doc__side .tags{ display:flex; flex-wrap:wrap; gap:6px; }
.doc__side a.lnk{ display:flex; justify-content:space-between; font-family:var(--font-mono); font-size:11.5px; color:var(--ink); text-decoration:none; padding:6px 0; border-bottom:1px solid var(--hair); }
.doc__side a.lnk:last-child{ border-bottom:none; }
.nodegraph{ display:flex; align-items:center; flex-wrap:wrap; gap:14px 0; border:var(--hair-w) solid var(--border); background-color:var(--paper); background-image:var(--tex-grid); background-size:var(--tex-grid-size); padding:24px 22px; margin:14px 0; }
.node{ border:var(--border-w) solid var(--border); background:#fff; padding:9px 13px; font-family:var(--font-mono); font-size:11px; position:relative; box-shadow:var(--shadow-sm); display:flex; align-items:center; gap:7px; }
.node i{ width:8px; height:8px; flex:none; }
.node + .node{ margin-left:40px; }
.node + .node::before{ content:"\203A"; position:absolute; left:-26px; top:50%; transform:translateY(-50%); color:var(--ink); font-size:15px; }
.node + .node::after{ content:""; position:absolute; left:-40px; top:50%; width:34px; height:2px; background:var(--ink); }

/* ---------- BLOG ---------- */
.postfeat{ border:var(--border-w) solid var(--border); box-shadow:var(--shadow); background:var(--paper); padding:26px 28px; margin-bottom:24px; }
.postfeat .k{ font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); }
.postfeat h3{ font-family:var(--font-serif); font-weight:var(--w-med); font-size:34px; line-height:1.05; margin:8px 0 10px; } .postfeat h3 em{ font-style:italic; }
.postfeat p{ font-family:var(--font-serif); font-size:16px; color:var(--ink-soft); max-width:60ch; margin-bottom:16px; }
.postfeat .meta{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); }
.postrow{ display:grid; grid-template-columns:86px 1fr 96px; gap:20px; align-items:baseline; padding:17px 0; border-top:1px solid var(--hair); }
.postrow .pd{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); }
.postrow .pt{ font-family:var(--font-serif); font-size:21px; line-height:1.2; } .postrow .pt em{ font-style:italic; color:var(--accent); }
.postrow .px{ font-size:12.5px; color:var(--text-soft); margin-top:3px; }
.postrow .pr{ font-family:var(--font-mono); font-size:10px; color:var(--text-soft); text-align:right; }

/* ---------- ABOUT ---------- */
.about{ display:grid; grid-template-columns:240px 1fr; gap:36px; align-items:start; }
.about__portrait{ border:var(--border-w) solid var(--border); box-shadow:var(--shadow); aspect-ratio:3/4; background-color:var(--news); background-image:var(--tex-grid); background-size:var(--tex-grid-size); display:flex; align-items:flex-end; padding:12px; }
.about__portrait span{ font-family:var(--font-mono); font-size:10px; color:var(--text-soft); background:#fff; border:1px solid var(--ink); padding:2px 7px; }
.about h1{ font-family:var(--font-display); font-weight:var(--w-black); font-size:var(--t-h1); line-height:1.1; letter-spacing:-.025em; margin-bottom:26px; }
.about h1 em{ line-height:1; display:inline-block; }
.about h1 em{ font-style:italic; color:var(--accent); font-family:var(--font-serif); }
.about__bio p{ font-family:var(--font-serif); font-size:16px; color:var(--ink-soft); max-width:60ch; margin-bottom:12px; }
.about__bio p em{ font-style:italic; color:var(--ink); }
.nowlist{ margin:18px 0; }
.nowlist .nl{ display:flex; gap:12px; padding:9px 0; border-top:1px solid var(--hair); font-size:13.5px; color:var(--ink-soft); }
.nowlist .nl b{ font-family:var(--font-mono); font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:var(--text-soft); width:84px; flex:none; padding-top:3px; }
.about__cta{ display:flex; gap:11px; margin-top:20px; flex-wrap:wrap; }

/* ---------- footer ---------- */
.foot{ display:flex; justify-content:space-between; align-items:center; padding:20px 44px 30px; font-family:var(--font-mono); font-size:11.5px; color:var(--text-soft); flex-wrap:wrap; gap:12px; }
.foot .mm{ font-family:var(--font-deco); font-size:13px; color:var(--ink); }

/* ---------- case-study article ---------- */
.art{ max-width:880px; margin:0 auto; }
.art__hd{ border-bottom:var(--border-w) solid var(--ink); padding-bottom:24px; margin-bottom:34px; }

/* RoleCall overview: stats strip under the masthead */
.doc__stats{ display:flex; flex-wrap:wrap; gap:14px 30px; padding:0 0 24px; margin-bottom:30px; border-bottom:1px solid rgba(26,23,18,.12); }
.doc__stat{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.02em; color:var(--text-soft); display:flex; align-items:baseline; gap:7px; }
.doc__stat b{ font-family:var(--font-display); font-weight:800; font-size:24px; letter-spacing:-.01em; color:var(--ink); }

/* RoleCall overview: call-to-action linking the deep-dive */
.bd-cta{ display:flex; align-items:center; gap:4px 16px; flex-wrap:wrap; max-width:880px; margin:40px auto 0; padding:22px 24px; border:var(--border-w) solid var(--ink); background:#fff; box-shadow:var(--shadow-sm); text-decoration:none; transition:transform var(--dur-fast) var(--ease-pop), box-shadow var(--dur-fast); }
.bd-cta:hover{ transform:translate(-2px,-2px); box-shadow:var(--shadow); }
.bd-cta__t{ font-family:var(--font-display); font-weight:800; font-size:19px; letter-spacing:-.01em; color:var(--ink); }
.bd-cta__h{ font-family:var(--font-mono); font-size:11px; color:var(--text-soft); }
.bd-cta__arr{ margin-left:auto; font-family:var(--font-mono); font-size:20px; color:var(--clay); }

/* RoleCall deep-dive: TOC rail (left) + article + sidenote gutter (right) */
.deep{ position:relative; max-width:1000px; margin:0 auto; }
.deep .art{ max-width:640px; margin:0; }
/* figures breach right past the prose column into the gutter */
.deep .fig{ width:calc(100% + 320px); max-width:none; }
.toc{ position:fixed; top:104px; left:32px; width:186px; max-height:calc(100vh - 150px); overflow:auto; z-index:5; font-family:var(--font-mono); }
.toc__lbl{ font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-soft); margin-bottom:11px; }
.toc__a{ display:block; font-size:11.5px; line-height:1.45; padding:5px 0 5px 11px; border-left:2px solid var(--hair); color:var(--text-soft); text-decoration:none; transition:color .15s, border-color .15s; }
.toc__a:hover{ color:var(--ink); }
.toc__a.on{ color:var(--clay); border-left-color:var(--clay); font-weight:600; }
@media(max-width:1180px){ .toc{ display:none; } }
@media(max-width:1080px){ .deep{ max-width:680px; } .deep .art{ max-width:none; } .deep .fig{ width:100%; } }
.art__back{ font-family:var(--font-mono); font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft); text-decoration:none; }
.art__back:hover{ color:var(--accent); }
.art__k{ display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); margin:18px 0 8px; }
.art__t{ font-family:var(--font-display); font-weight:900; font-size:clamp(40px,6vw,66px); line-height:1; letter-spacing:-.02em; color:var(--ink); margin:0; }
.art__dek{ font-family:var(--font-display); font-weight:500; font-size:20px; line-height:1.45; color:var(--ink-soft); margin:12px 0 18px; max-width:54ch; }
.art__meta{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.art__chip{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--text-soft); border:1px solid var(--hair); padding:4px 9px; }
.art__repo{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:#fff; background:var(--accent); padding:5px 11px; text-decoration:none; }
.art__repo:hover{ filter:brightness(1.08); }
.art__sec{ margin:0 0 36px; }
.art__h{ font-family:var(--font-display); font-weight:800; font-size:23px; letter-spacing:-.01em; color:var(--ink); margin:0 0 14px; }
.art__h3{ font-family:var(--font-display); font-weight:700; font-size:16px; letter-spacing:-.005em; color:var(--ink-soft); margin:26px 0 8px; }
.art__p{ font-family:var(--font-body); font-size:16px; line-height:1.7; color:var(--ink-soft); max-width:68ch; margin:0 0 15px; }
.art__ul{ max-width:68ch; margin:0 0 15px; padding-left:20px; }
.art__ul li{ font-family:var(--font-body); font-size:16px; line-height:1.7; color:var(--ink-soft); margin-bottom:6px; }
.art__q{ max-width:68ch; margin:24px 0; padding:6px 0 6px 20px; border-left:3px solid var(--accent); font-family:"Cormorant Garamond",Georgia,serif; font-style:italic; font-weight:600; font-size:25px; line-height:1.4; color:var(--ink); }
.md-code{ font-family:var(--font-mono); font-size:13.5px; background:rgba(26,23,18,.06); padding:1px 6px; color:var(--ink); }
/* inline side-annotations ([[term|note]]) */
.ann{ cursor:help; font-weight:500; color:var(--ink); border-bottom:2px solid var(--mk, currentColor); padding:0 1px; transition:background var(--dur-fast); }
.ann:hover, .ann.is-active{ background:color-mix(in srgb, var(--mk) 18%, transparent); }
.ann.is-active{ position:relative; z-index:55; }
.ann:focus-visible{ outline:2px solid var(--mk); outline-offset:2px; }
.annpop{ position:fixed; z-index:62; background:#fff; border:var(--border-w) solid var(--ink); box-shadow:var(--shadow); padding:14px 16px 16px; opacity:0; transform:translateY(5px); transition:opacity .18s var(--ease-out), transform .18s var(--ease-out); pointer-events:none; }
.annpop.on{ opacity:1; transform:none; }
.annpop__h{ display:flex; align-items:center; gap:8px; margin-bottom:9px; }
.annpop__kind{ font-family:var(--font-mono); font-size:8.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; padding:2px 6px; border:1.5px solid currentColor; border-radius:3px; }
.annpop__pin{ font-family:var(--font-mono); font-size:10px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:#fff; padding:3px 8px; }
.annpop__n{ font-family:var(--font-body); font-size:14px; line-height:1.6; color:var(--ink-soft); }
.annpop__lead{ font-family:var(--font-body); font-size:13.5px; line-height:1.55; color:var(--ink-soft); margin:0 0 9px; }
.annpop__list{ margin:0; padding-left:16px; display:flex; flex-direction:column; gap:7px; }
.annpop__list li{ font-family:var(--font-body); font-size:13px; line-height:1.5; color:var(--ink-soft); }
.annpop__list li b{ color:var(--ink); font-weight:600; }
/* article inline accent (*word*) — Cormorant Garamond italic */
.art .bloom{ font-family:"Cormorant Garamond",Georgia,serif; font-style:italic; font-weight:600; font-size:1.18em; color:var(--ink); }

/* figures */
.fig{ margin:26px 0 30px; border:var(--border-w) solid var(--ink); background:#fff; box-shadow:var(--shadow); }
.fig__cap{ display:flex; align-items:baseline; gap:10px; padding:11px 16px; border-bottom:1px solid var(--hair); }
.fig__n{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--accent); }
.fig__t{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink); }
.fig__body{ padding:20px 18px; }
.fig__note{ font-family:var(--font-body); font-size:13px; line-height:1.55; color:var(--text-soft); margin:0; padding:0 16px 16px; }
.fig__svg{ width:100%; height:auto; display:block; }
.fig__tick{ font-family:var(--font-mono); font-size:11px; fill:var(--text-soft); }
.fig__axis{ font-family:var(--font-mono); font-size:11px; fill:var(--text-soft); letter-spacing:.04em; }
.fig__legend{ display:flex; flex-wrap:wrap; gap:16px; margin-top:12px; padding-left:8px; }
.fig__key{ display:flex; align-items:center; gap:7px; font-family:var(--font-mono); font-size:11px; color:var(--ink-soft); }
.fig__key i{ width:16px; height:3px; border-radius:2px; }

/* funnel */
.fnl{ display:flex; flex-direction:column; gap:10px; }
.fnl__row{ display:grid; grid-template-columns:150px 1fr; align-items:center; gap:14px; }
.fnl__l{ font-family:var(--font-mono); font-size:11.5px; letter-spacing:.03em; text-transform:uppercase; color:var(--ink-soft); text-align:right; }
.fnl__track{ height:26px; background:rgba(26,23,18,.05); border:1px solid var(--hair); display:flex; }
.fnl__track i{ display:flex; align-items:center; justify-content:flex-end; padding:0 9px; color:#fff; font-family:var(--font-mono); font-size:12px; font-weight:600; min-width:26px; transition:width .5s var(--ease-pop); }

/* matrix */
.mx{ width:100%; border-collapse:collapse; font-family:var(--font-mono); font-size:12.5px; }
.mx th, .mx td{ padding:9px 12px; text-align:left; border-bottom:1px solid var(--hair); color:var(--ink-soft); }
.mx thead th{ font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--text-soft); }
.mx tbody th{ color:var(--ink); font-weight:600; }
.mx__yes{ color:#167a45; font-weight:700; }
.mx__no{ color:#c0392b; }
.mx__hi{ color:var(--accent); font-weight:700; }

/* flow */
.flw{ display:flex; flex-wrap:wrap; align-items:stretch; gap:8px; }
.flw__box{ flex:1; min-width:96px; border:2px solid var(--ink); border-left:5px solid var(--c); background:#fff; padding:12px 13px; }
.flw__l{ font-family:var(--font-display); font-weight:700; font-size:14px; color:var(--ink); }
.flw__s{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.03em; color:var(--text-soft); margin-top:4px; }
.flw__arr{ display:flex; align-items:center; color:var(--text-soft); font-size:16px; }
/* complex figures: tree / loop / venn / pyramid */
.tv-tree__t{ font-family:var(--font-mono); font-size:11px; fill:var(--ink); }
.tv-tree__pick{ font-family:var(--font-mono); font-size:9px; font-weight:700; fill:#fff; }
/* tree: example-query pill + per-node hover summary card */
.tv-q{ display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 10px; margin-bottom:16px; padding:10px 13px; background:color-mix(in srgb, var(--accent, #c75d52) 7%, transparent); border-left:3px solid var(--accent, #c75d52); }
.tv-q__k{ font-family:var(--font-mono); font-size:9px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--text-soft); }
.tv-q__t{ font-family:var(--font-body); font-style:italic; font-size:14px; color:var(--ink); }
.tv-q__n{ flex-basis:100%; font-family:var(--font-mono); font-size:10px; color:var(--text-soft); }
.treetip{ position:fixed; z-index:70; background:#fff; border:1.5px solid var(--ink); box-shadow:var(--shadow); padding:9px 12px; opacity:0; transform:translateY(4px); transition:opacity .14s var(--ease-out), transform .14s var(--ease-out); pointer-events:none; }
.treetip.on{ opacity:1; transform:none; }
.treetip__h{ font-family:var(--font-mono); font-size:10px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; margin-bottom:5px; }
.treetip__b{ font-family:var(--font-body); font-size:12.5px; line-height:1.5; color:var(--ink-soft); }
.tv-box__l{ font-family:var(--font-display); font-weight:700; font-size:13px; fill:var(--ink); }
.tv-box__s{ font-family:var(--font-mono); font-size:10.5px; fill:var(--text-soft); }
.tv-loop__l{ font-family:var(--font-mono); font-size:10.5px; fill:var(--text-soft); }
.tv-venn__n{ font-family:var(--font-display); font-weight:700; font-size:18px; fill:var(--ink); }
.tv-venn__i{ font-family:var(--font-display); font-weight:800; font-size:20px; }
.tv-venn__c{ font-family:var(--font-mono); font-size:12px; }
.tv-venn__f{ font-family:var(--font-mono); font-size:13px; fill:var(--ink); }
.tv-venn__b{ font-family:var(--font-mono); font-size:9.5px; }
.tv-pyr__l{ font-family:var(--font-display); font-weight:700; font-size:14px; fill:var(--ink); }
.tv-pyr__n{ font-family:var(--font-mono); font-size:10.5px; fill:var(--text-soft); }
.mx__lvl{ font-family:var(--font-mono); font-weight:600; }
.modes{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.modes__h{ font-family:var(--font-mono); font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-soft); margin-bottom:10px; }
.modes__h b{ color:var(--ink); }
.tv-modes__t{ font-family:var(--font-mono); font-size:10px; fill:var(--ink); }
.tv-modes__b{ font-family:var(--font-mono); font-size:9px; font-weight:700; fill:#fff; }
@media(max-width:820px){ .modes{ grid-template-columns:1fr; } }

/* Retrieval — three-panel "how each system finds a memory" figure */
.r3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.r3__hd{ display:flex; flex-direction:column; gap:1px; border-left:3px solid var(--c); padding-left:9px; margin-bottom:10px; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--text-soft); }
.r3__hd b{ color:var(--ink); font-size:11px; }
.r3__t{ font-family:var(--font-mono); font-size:10px; fill:var(--ink); }
.r3__cap{ font-family:var(--font-mono); font-size:9px; fill:var(--text-soft); }
.r3__ok{ font-family:var(--font-mono); font-size:14px; font-weight:700; fill:#167a45; text-anchor:middle; }
.r3__no{ font-family:var(--font-mono); font-size:14px; font-weight:700; fill:#c0392b; text-anchor:middle; }
@media(max-width:820px){ .r3{ grid-template-columns:1fr; } }

/* Chunks — worked-example sheet split into chunk cards with keywords */
.chk{ display:grid; gap:12px; }
.chk__card{ border:1px solid rgba(26,23,18,.16); border-left:4px solid var(--c); padding:11px 14px; background:#fff; }
.chk__card.is-hit{ background:color-mix(in srgb, var(--c) 8%, #fff); box-shadow:0 0 0 1px var(--c) inset; }
.chk__h{ display:flex; align-items:baseline; gap:10px; margin-bottom:6px; }
.chk__sec{ font-family:var(--font-mono); font-size:10px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--ink); }
.chk__hit{ margin-left:auto; font-family:var(--font-mono); font-size:9px; font-weight:700; letter-spacing:.04em; color:var(--c); }
.chk__snip{ font-family:var(--font-body); font-size:12.5px; line-height:1.5; color:var(--ink-soft); margin-bottom:8px; }
.chk__kw{ display:flex; flex-wrap:wrap; gap:5px; }
.chk__chip{ font-family:var(--font-mono); font-size:9.5px; letter-spacing:.02em; padding:2px 7px; border-radius:3px; background:color-mix(in srgb, var(--c) 14%, #fff); color:var(--ink); }

@media(max-width:820px){
  .flw{ flex-direction:column; }
  .flw__arr{ transform:rotate(90deg); justify-content:center; }
  .fnl__row{ grid-template-columns:104px 1fr; }
  .art__p{ max-width:none; }
}

@media(max-width:820px){
  .dial{ grid-template-columns:repeat(2,1fr); }
  .feat,.dissect{ grid-template-columns:1fr; gap:24px; }
  .appgrid,.promptgrid{ grid-template-columns:1fr; }
  .doc,.about{ grid-template-columns:1fr; }
  svg.wire{ display:none; }
  .pills{ max-width:none; }
  .page{ padding:24px 20px 30px; }
  .lb__row{ grid-template-columns:40px 1.3fr 1fr; }
  .lb__row .verdict, .lb__row--h span:nth-child(4){ display:none; }
}

/* ---------- LOAD FALLBACK (components/load-error.js) ---------- */
.loaderr{ padding:90px 0; font-family:var(--font-mono); font-size:13px; color:var(--text-soft); }
.loaderr p{ margin:0 0 6px; }

/* ---------- REDUCED MOTION (blanket) ---------- */
/* the doctrine: every animation dies under prefers-reduced-motion, no
   exceptions. This catch-all enforces it for anything without a local
   guard (boot lines, carousel slide, leader-wire draw-on, hover lifts). */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
    scroll-behavior:auto !important;
  }
}