anentrypoint-design 0.0.470 → 0.0.471

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "anentrypoint-design",
-  "version": "0.0.470",
+  "version": "0.0.471",
   "description": "247420 design system SDK — webjsx + modified ripple-ui, single-file ESM bundle for reproducible use of the AnEntrypoint design.",
   "type": "module",
   "main": "./dist/247420.js",

package/src/css/app-shell/base.css

@@ -1,47 +1,23 @@
-/* ============================================================
-   247420 design system — component sheet
-   shadcn-neutral: system-font display + body + mono, no custom web fonts.
-   Confident hierarchy, centered editorial stack, neutral grayscale accent.
-   Indicator rails over hairlines.
-   ============================================================ */
-
-/* ============================================================
-   Base
-   ============================================================ */
 * { box-sizing: border-box; }
 html, body { margin: 0; padding: 0; }
 button, input, select, textarea { font: inherit; }
 
-/* ============================================================
-   Accessibility — Skip Link
-   ============================================================ */
 .skip-link {
+  --skip-link-preflight-translate-clear: -100%;
   position: absolute;
-  /* -40px alone left the 44px-tall pill (padding + min-height floor below)
-     poking ~4px into every page pre-focus -- measured live via
-     getBoundingClientRect(). The offset must clear the full rendered height,
-     not a guessed constant, so translateY pushes it out by its own box. */
   top: 0;
   left: 0;
-  transform: translateY(-100%);
+  transform: translateY(var(--skip-link-preflight-translate-clear));
   background: var(--accent);
   color: var(--accent-fg);
   padding: var(--space-2) var(--space-3);
   text-decoration: none;
-  /* Must outrank every layer of chrome once focused, or the first Tab press
-     lands on a control hidden behind the sticky header (was z-index:100,
-     which the header alone now matches). */
   z-index: var(--z-top);
   border-radius: var(--r-pill);
   font-weight: 600;
   font-size: var(--fs-sm);
-  /* The skip link is the first thing a keyboard or switch user reaches, so it
-     is the last control that should be hard to hit. Its padding alone rendered
-     it 39px tall -- measured live under coarse-pointer emulation on every kit.
-     Floored unconditionally rather than under a pointer:coarse query, because
-     switch and head-pointer users are not detected as coarse pointers and need
-     the larger target just as much. */
-  min-height: 44px;
+  --skip-link-min-touch-target: 44px;
+  min-height: var(--skip-link-min-touch-target);
   display: inline-flex;
   align-items: center;
 }
@@ -51,23 +27,6 @@ button, input, select, textarea { font: inherit; }
   outline: var(--focus-w) solid var(--focus-color);
   outline-offset: var(--focus-offset);
 }
-/* Visually-hidden but still in the accessibility tree. Emitted by Row() (the
-   rail status word), FilterBar()/FileGrid() (aria-live result counts) and
-   form-primitives' required marker — all of which shipped BEFORE this rule
-   existed anywhere the app shell loads. The only other definitions live in
-   app-surfaces.css (pre-scoped to `.ds-247420`, so it never reaches a kit that
-   does not mount that root) and editor-primitives.css (a separate opt-in
-   <link>), which left every app-shell consumer rendering screen-reader-only
-   text VISIBLY the moment it passed `rail`/`resultCount`.
-   Deliberately NOT `display:none` / `visibility:hidden` / `width:0`: those
-   remove the node from the accessibility tree too, which defeats the entire
-   purpose — the text exists only for AT. The clip + 1px box is what keeps it
-   announced while occupying no visible area.
-   `margin: -1px` is OFF-SCALE ON PURPOSE — it is not rhythm, it is one half of
-   the canonical visually-hidden idiom: the negative margin cancels the 1px box
-   so the clipped element contributes zero layout. Snapping it to a --space-*
-   rung would reintroduce a measurable gap. `clip` is deprecated but retained
-   alongside `clip-path` for older AT/browser pairs that ignore the latter. */
 .sr-only {
   position: absolute;
   width: 1px;
@@ -81,11 +40,6 @@ button, input, select, textarea { font: inherit; }
   border: 0;
 }
 
-/* .ds-aspect — generic aspect-ratio utility. Native `aspect-ratio` property
-   (broadly supported for years) rather than the padding-bottom hack: no
-   extra wrapper markup, no absolutely-positioned inner layer needed just to
-   fill the box. `--aspect` defaults to 16/9; a caller overrides it inline
-   (e.g. style="--aspect:1/1") or via a ratio-named modifier class below. */
 .ds-aspect {
   aspect-ratio: var(--aspect, 16 / 9);
   width: 100%;
@@ -105,14 +59,11 @@ body {
   -webkit-font-smoothing: antialiased;
   text-rendering: optimizeLegibility;
 }
-/* Light (paper, the default theme) needs a stronger accent share than dark to
-   clear a visible selection tint against --bg-2 -- the dark-theme value (24%)
-   read too weak on paper. Dark/ink keeps its existing 24% mix, restored below
-   in the ink/dark + auto-dark blocks (mirrors the --danger/--flame pattern of
-   scoping a value per theme rather than sharing one across both). */
-::selection { background: color-mix(in oklab, var(--accent) 46%, var(--bg-2)); color: var(--fg); }
+:root {
+  --selection-tint-paper-share: 46%;
+}
+::selection { background: color-mix(in oklab, var(--accent) var(--selection-tint-paper-share), var(--bg-2)); color: var(--fg); }
 
-/* Every root has a CQ container so fluid type can resolve to a meaningful inline-size. */
 .app, .ds-stage {
   container-type: inline-size;
   overflow-x: clip;
@@ -120,29 +71,16 @@ body {
 }
 .app * { min-width: 0; }
 
-/* Scrollbar treatment, applied once at the root rather than per-component.
-   chat.css already styled its own thread and code blocks this way, but every
-   other scroll container (.app-side-shell, .app-main, .ds-scroll-x,
-   .ds-table-wrap, .ds-live-log) fell back to the UA default -- measured live,
-   4 of 4 containers on dashboard and 7 of 7 on gm_inspector were unstyled while
-   chat's two were not. A default scrollbar reads as a bright seam against a
-   near-black panel in the ink and dark themes, and inconsistently between two
-   panels on the same page. Tokens mean the thumb follows the active theme.
-   Inheriting from the container also covers scrollers added later. */
 .app, .ds-stage, .app *, .ds-stage * {
   scrollbar-width: thin;
   scrollbar-color: var(--bg-3) transparent;
 }
 
-/* ============================================================
-   Typography
-   ============================================================ */
 h1, .t-h1 { font-family: var(--ff-display); font-size: var(--fs-h1); line-height: var(--lh-snug); letter-spacing: var(--tr-tight); font-weight: 600; margin: 0; }
 h2, .t-h2 { font-family: var(--ff-display); font-size: var(--fs-h2); line-height: var(--lh-snug); letter-spacing: var(--tr-tight); font-weight: 600; margin: 0; }
 h3, .t-h3 { font-family: var(--ff-display); font-size: var(--fs-h3); line-height: var(--lh-snug); letter-spacing: -0.01em;          font-weight: 600; margin: 0; }
 h4, .t-h4 { font-family: var(--ff-display); font-size: var(--fs-h4); line-height: var(--lh-snug);                                  font-weight: 600; margin: 0; }
 
-/* App/chrome typescale opt-in: compact heading ceiling for application UIs. */
 [data-typescale="app"] h1, [data-typescale="app"] .t-h1 { font-size: var(--fs-h1-app); line-height: 1.15; }
 [data-typescale="app"] h2, [data-typescale="app"] .t-h2 { font-size: var(--fs-h2-app); }
 [data-typescale="app"] h3, [data-typescale="app"] .t-h3 { font-size: var(--fs-h3-app); }
@@ -152,21 +90,9 @@ h4, .t-h4 { font-family: var(--ff-display); font-size: var(--fs-h4); line-height
 .t-mega    { font-family: var(--ff-display); font-size: var(--fs-mega); line-height: 0.92;            letter-spacing: var(--tr-tighter); font-weight: 700; margin: 0; }
 
 .t-display { font-family: var(--ff-display); font-weight: 600; letter-spacing: var(--tr-tight); }
-/* Explicit weight, not relying on inherited normal: --ff-mono's stack (Menlo,
-   Consolas, ui-monospace) can resolve to a variable-font fallback on some
-   platforms whose default instance isn't the 400 weight, rendering "body ·
-   16px regular" visibly bold despite its own label -- pin the weight so the
-   sample matches what it claims regardless of which font in the stack loads. */
 .t-mono    { font-family: var(--ff-mono); font-weight: 400; }
 .t-body    { font-family: var(--ff-body); }
 
-/* House small-label voice, in two sizes. Every declaration here is sourced
-   from a token, so a sheet that cannot join these selector lists (community.css
-   and gm-prose.css ship as separate <link>-able exports and must not depend on
-   app-shell.css being present) still composes the same voice by referencing the
-   same four tokens — --ff-mono / --fs-* / uppercase / --tr-label. That token
-   set, not this rule, is the single source of truth; a selector that restates a
-   literal instead of the token is the drift this pairing exists to prevent. */
 .t-label   { font-family: var(--ff-mono); font-size: var(--fs-tiny); text-transform: uppercase; letter-spacing: var(--tr-label); font-weight: 500; }
 .t-micro   { font-family: var(--ff-mono); font-size: var(--fs-micro); text-transform: uppercase; letter-spacing: var(--tr-label); color: var(--fg-3); }
 .t-meta    { font-family: var(--ff-body); font-size: var(--fs-sm); color: var(--fg-3); }
@@ -177,13 +103,6 @@ h4, .t-h4 { font-family: var(--ff-display); font-size: var(--fs-h4); line-height
   margin: 0;
 }
 
-/* h1/h2/h3/h4 and .lede/.t-lede are both margin:0 primitives by design (a
-   heading used standalone must not force space its context doesn't want).
-   But a heading immediately followed by a lede is a named pairing, not two
-   independent primitives that happen to be adjacent -- it needs its own gap
-   regardless of whether the surrounding shell opts into .ds-app-surface
-   (which only adds this spacing on landing/marketing surfaces, leaving every
-   Operate-mode kit that skips that class with a zero-gap heading+subtitle). */
 h1 + .lede, h1 + .t-lede,
 h2 + .lede, h2 + .t-lede,
 h3 + .lede, h3 + .t-lede,
@@ -191,25 +110,11 @@ h3 + .lede, h3 + .t-lede,
   margin-top: var(--space-2);
 }
 
-/* A lede immediately followed by the article body is a named pairing too --
-   same rationale as the heading+lede gap above. Without this, .lede's
-   margin:0 leaves zero space above the first paragraph while every
-   paragraph-to-paragraph gap below it uses --space-4 (.ds-prose p), so the
-   dek reads as glued to the body it introduces. */
 .lede + .post-body, .t-lede + .post-body,
 .lede + .ds-prose, .t-lede + .ds-prose {
   margin-top: var(--space-4);
 }
 
-/* Same gap-ownership problem again for .ds-section (hero-content.css):
-   `* + .ds-section { margin-top: 0 }` deliberately relies on the PRECEDING
-   sibling supplying the lead-in space, so two spacing primitives can
-   coordinate into one gap instead of stacking. .lede supplies none (margin:0
-   by design), so a lede-then-section pairing (e.g. project_page's h1 -> lede
-   -> "install" section) collapses to a flush 0px gap instead of inheriting
-   .ds-section's own --space-8 lead. Measured live on project_page: the
-   "install" h3 sat ~4px from the lede above it (padding only) vs the
-   intended --space-8/2 gap other section-adjacent siblings get. */
 .lede + .ds-section, .t-lede + .ds-section {
   margin-top: var(--space-8);
 }
@@ -223,7 +128,6 @@ h3 + .lede, h3 + .t-lede,
   color: var(--accent-ink);
   display: inline-flex; align-items: center; gap: 12px;
 }
-/* Editorial kicker mark — a short solid ink rule, the print-byline tell. */
 .eyebrow::before {
   content: '';
   width: 28px; height: 3px; background: currentColor;
@@ -252,21 +156,6 @@ h3 + .lede, h3 + .t-lede,
   font-family: var(--ff-body);
 }
 .ds-prose blockquote p:last-child { margin-bottom: 0; }
-/* Closing line of an article ("end. reply by opening a pr."), set off from the
-   body it terminates. Quieter and smaller than the prose around it: it takes
-   the mono face and the --fg-3 tone the house uses for ancillary voices
-   (.t-micro, .dim), so the endnote reads as chrome around the article rather
-   than a final paragraph of it. The --space-5 lead does the "set off" — it
-   breaks the paragraph rhythm so the eye registers the piece has ended before
-   reading the words; margin-bottom:0 overrides .ds-prose p's --space-4 so the
-   article does not end on dead space.
-   Lives here, beside the rest of the .ds-prose family, NOT in gm-prose.css:
-   the blog kit that uses this class links only colors_and_type.css +
-   app-shell.css, so a rule in that separately-<link>-ed export would be exactly
-   as undefined as the class was before. Sized at --fs-xs, not the --fs-micro
-   label rung: this is a readable sentence with a link in it, not a micro-label.
-   The link inherits .ds-prose a's --accent-ink treatment (a readable TEXT tone;
-   the bare --accent fill is ~1.07:1 on paper) — deliberately not re-stated. */
 .ds-prose .ds-prose-endnote,
 .ds-prose-endnote {
   margin-top: var(--space-5);
@@ -279,7 +168,6 @@ h3 + .lede, h3 + .t-lede,
 
 .dim { color: var(--fg-3); }
 
-/* Links */
 a { color: inherit; text-decoration: none; }
 a.ds-link-accent, .ds-prose a {
   color: var(--accent-ink);
@@ -296,15 +184,10 @@ kbd {
   background: var(--bg-2); padding: 2px 6px; border-radius: var(--r-1);
 }
 
-/* --bg-3 (not --bg-2): an inline code pill needs to read as a distinct
-   surface against the page background, not just against adjacent text — at
-   --bg-2 the pill measured 1.39:1 background-to-background contrast in dark
-   theme (barely distinguishable from the page itself). --bg-3 is the same
-   tier-3 surface step .chip.tone-dim already uses for the same reason,
-   bringing the pill to 2.07:1, consistent with the rest of the tier-3 ramp. */
 code {
+  --code-pill-tier3-surface: var(--bg-3);
   font-family: var(--ff-mono); font-size: 0.92em;
-  background: var(--bg-3); padding: 0.15em 0.5em; border-radius: var(--r-1);
+  background: var(--code-pill-tier3-surface); padding: 0.15em 0.5em; border-radius: var(--r-1);
 }
 
 pre {

package/src/css/app-shell/primitives.css

@@ -1,12 +1,5 @@
-/* ============================================================
-   Primitives
-   ============================================================ */
 .btn, .btn-primary, .btn-ghost {
   display: inline-flex; align-items: center; justify-content: center; gap: 6px;
-  /* Fixed height + horizontal-only padding: the control height is exact and
-     alignable (flex centres the label vertically), the way webgeist snaps every
-     control to a height ladder. Default is the --ctl-md rung; --btn-sm/--btn-lg
-     retune height + h-padding + font per size. Density scales the ladder. */
   height: var(--ctl-md); min-height: var(--ctl-md);
   padding: 0 var(--space-2-75);
   font-family: var(--ff-body);
@@ -14,30 +7,15 @@
   text-decoration: none;
   white-space: nowrap;
   cursor: pointer;
-  /* Rounded-rect app chrome, not a marketing-page stadium CTA.
-     Shape vocabulary: r-1/r-2 = actionable buttons, icon-buttons, and
-     containers; r-pill = reserved for status/input/chip/badge/progress
-     surfaces (composer input, chips, badges, progress bars, theme-toggle
-     segments) - never for actions. */
   border-radius: var(--r-1);
   border: var(--bw-hair) solid transparent;
   box-shadow: none;
-  /* Restrained hover-lift: a 1px rise + hairline shadow reads as a crisp,
-     confident affordance rather than a soft glow-card float. */
   transition: transform var(--dur-base) var(--ease-spring), background var(--dur-snap) var(--ease),
     color var(--dur-snap) var(--ease), box-shadow var(--dur-base) var(--ease-spring),
     border-color var(--dur-snap) var(--ease);
 }
 .btn { background: var(--bg-2); color: var(--fg); border-color: var(--rule); }
 .btn:hover { background: var(--bg-3); color: var(--fg); transform: translateY(-1px); box-shadow: var(--shadow-1); }
-/* Primary CTA — the brand green as a solid editorial block; hover inverts to
-   an ink block with green text, a confident two-tone flip. Uses --green
-   (the site's own #247420 identity color, dark-mode-retuned to --green's
-   ink-safe #5CBF52 rather than --accent/--acid, which a prior contrast-driven
-   restyle deliberately flattened to a neutral gray for --accent's OTHER
-   consumers (nav active state, focus rings, etc) -- .btn-primary needed the
-   brand color back for click-hierarchy without undoing that restyle
-   elsewhere. --on-color (#fff) clears AA on both light and dark --green. */
 .btn-primary {
   background: var(--green); color: var(--on-color);
   font-weight: 700;
@@ -51,10 +29,6 @@
   outline-offset: var(--focus-offset);
 }
 
-/* Button size ladder — the size prop on Btn() (sm | md | lg). md is the base
-   rule above; sm/lg retune height (off the --ctl-* ladder), horizontal padding,
-   and font-size so a size swap is one class, never inline padding overrides
-   (the old preview faked sizes with style=). Applies to every variant. */
 .btn-sm, .btn-sm.btn-primary, .btn-sm.btn-ghost {
   height: var(--ctl-sm); min-height: var(--ctl-sm);
   padding: 0 var(--space-2); font-size: var(--fs-tiny); gap: var(--space-1);
@@ -64,10 +38,6 @@
   padding: 0 var(--space-4); font-size: var(--fs-body); gap: var(--space-2);
 }
 
-/* App-mode quiet interactions — the marketing hover-lift (translateY + shadow)
-   and the .row .meta slide read as decorative float on a dense working surface.
-   Under [data-typescale="app"], state changes are background/border-only: crisp,
-   no motion, no elevation. Marketing surfaces (no data-typescale) keep the lift. */
 [data-typescale="app"] .btn:hover,
 [data-typescale="app"] .btn-primary:hover,
 [data-typescale="app"] .btn-ghost:hover { transform: none; box-shadow: none; }
@@ -78,9 +48,6 @@
 [data-typescale="app"] a.row:hover .meta,
 [data-typescale="app"] .row[role="button"]:hover .meta { transform: none; }
 
-/* ============================================================
-   IconButton — square icon-only button
-   ============================================================ */
 .ds-icon-btn {
   display: inline-flex; align-items: center; justify-content: center;
   padding: 0; border: none; cursor: pointer;
@@ -97,7 +64,6 @@
 .ds-icon-btn-ghost:hover { background: var(--fg); color: var(--bg); }
 .ds-icon-btn-primary { background: var(--accent); color: var(--accent-fg); }
 .ds-icon-btn-primary:hover { background: var(--fg); color: var(--accent-ink); }
-/* warn = destructive ACTION tone; flame stays exclusively error STATUS. */
 .ds-icon-btn-danger { background: var(--warn); color: var(--on-color); }
 .ds-icon-btn-danger:hover { filter: brightness(0.92); }
 .ds-icon-btn:active { transform: translateY(1px); }
@@ -105,9 +71,6 @@
   opacity: 0.5; cursor: not-allowed; pointer-events: none;
 }
 
-/* ============================================================
-   Badge — small inline count/status pill
-   ============================================================ */
 .ds-badge {
   display: inline-flex; align-items: center; justify-content: center;
   min-width: 18px; height: 18px; padding: 0 6px;
@@ -115,15 +78,8 @@
   border-radius: var(--r-pill);
   background: var(--bg-3); color: var(--fg-2);
 }
-/* Badge size ladder — sm for dense inline counts, lg for prominent markers.
-   Base (above) stays the 18px default. */
 .ds-badge.ds-badge--sm { min-width: 14px; height: 14px; padding: 0 var(--space-1); font-size: 10px; }
 .ds-badge.ds-badge--lg { min-width: 22px; height: 22px; padding: 0 var(--space-2); font-size: var(--fs-tiny); }
-/* Canonical tone names are tone-success / tone-error / tone-neutral. Every
-   other tone name grouped into the same rule below (tone-green/tone-live,
-   tone-flame, tone-wip, tone-sun/tone-yellow, tone-ok/tone-miss) is a
-   true-synonym legacy alias, kept working but sharing one declaration so the
-   tone-family colors can't drift apart across names. */
 .ds-badge.tone-green, .ds-badge.tone-live, .ds-badge.tone-success {
   background: var(--green-tint); color: var(--green-deep);
 }
@@ -150,18 +106,12 @@
   letter-spacing: var(--tr-caps); text-transform: uppercase;
   border-radius: var(--r-pill);
 }
-/* Chip size ladder — sm for dense toolbars/table cells, lg for prominent
-   status. tone-* colouring (below) is orthogonal to size. */
 .chip.chip--sm { padding: var(--space-half) var(--space-2); font-size: var(--fs-micro); gap: var(--space-1); }
 .chip.chip--lg { padding: var(--space-1-75) var(--space-2-75); font-size: var(--fs-xs); }
-/* Tag variant — a rectangular, sentence-case chip for dense data (table cells,
-   inline labels) where the all-caps pill reads too shouty and space-hungry.
-   Keeps the tone-* palette; drops the caps + pill for a tight --r-0 corner. */
 .chip.chip--tag {
   text-transform: none; letter-spacing: 0; font-weight: 500;
   border-radius: var(--r-0); padding: var(--space-half) var(--space-2);
 }
-/* Same canonical/legacy-alias grouping as .ds-badge above. */
 .chip.tone-green, .chip.tone-live, .chip.tone-success, .chip.tone-ok {
   background: var(--green-tint); color: var(--green-deep);
 }
@@ -171,21 +121,9 @@
 .chip.tone-wip, .chip.tone-neutral {
   background: var(--bg-3); color: var(--fg-2);
 }
-/* `.chip.accent` is the bare-adjective spelling of tone-accent (ui_kits/blog
-   uses it for a "draft" chip). It had no rule anywhere, so an accented chip
-   rendered byte-identical to a plain one. Folded into the alias grouping rather
-   than given its own block, so the two spellings cannot drift apart. --accent
-   is the FILL and --accent-ink the readable text tone (AGENTS.md) — the bare
-   lead is ~1.07:1 on paper and unreadable as text. */
 .chip.accent, .chip.tone-accent {
   background: var(--accent-tint); color: var(--accent-ink);
 }
-/* tone-dim was applied by five kits (aicat, project_page, signin, system_primer,
-   terminal) with no rule anywhere, so a "dim" chip rendered byte-identical to a
-   plain one — measured at rgb(234,230,218) on rgb(31,31,38), same opacity. It is
-   the recede-into-the-row tone: the tier-3 foreground on the same recessed
-   surface tone-wip uses, which is quieter than the default --fg-2 without
-   dropping to an opacity fade that would take the border and background with it. */
 .chip.tone-dim {
   background: var(--bg-3); color: var(--fg-3);
 }
@@ -199,10 +137,6 @@
 .chip.tone-orange   { background: color-mix(in oklab, var(--flame) 30%, var(--sun) 70%); color: var(--ink); }
 .chip.tone-yellow   { background: var(--sun);         color: var(--ink); }
 
-/* Removable chip — a trailing dismiss (x) button for editable tag/filter
-   chip lists (session tags, saved-search chips). Reuses the chip's own
-   tone/size; the button itself stays neutral-at-rest, per the standing
-   color-reserved-for-meaning convention, tinting only on hover/focus. */
 .chip.ds-chip-removable { padding-right: var(--space-1); }
 .ds-chip-remove-btn {
   display: inline-flex; align-items: center; justify-content: center;
@@ -218,8 +152,6 @@
   .ds-chip-remove-btn svg { width: 12px; height: 12px; }
 }
 
-/* ds-pill — plain neutral chip, distinct from the toned .ds-badge/.chip family
-   (gmsniff's .pill: a bare rounded label with no semantic tone). */
 .ds-pill {
   display: inline-block;
   padding: 1px 7px;
@@ -237,16 +169,6 @@
   font-family: var(--ff-mono); font-size: var(--fs-tiny);
   opacity: 0.8;
 }
-/* Glyph() (src/components/shell/atoms.js) emits `glyph glyph-{size}` and an
-   inline `font-size: var(--glyph-size-{size}, <literal>)`. The custom property
-   is the documented theming hook — it is what lets a theme retune glyph scale
-   without touching the component — but nothing declared it, so every glyph fell
-   through to the hard-coded inline literal and the hook was inert. Declaring
-   the three rungs on the scale makes the hook real; the sm/lg classes also give
-   the box a matching footprint instead of the one-size 18px square. */
-/* Values mirror Glyph()'s own inline fallbacks exactly (11 / 13 / 16px), so
-   declaring the hook changes nothing visually — it only makes the property
-   themeable, which is what it always claimed to be. */
 .glyph { --glyph-size-sm: var(--fs-nano); --glyph-size-base: var(--fs-tiny); --glyph-size-lg: var(--fs-body); }
 .glyph-sm { width: 14px; height: 14px; }
 .glyph-lg { width: 22px; height: 22px; }

package/src/kits/flatspace-theme/index.js

@@ -1,20 +1,8 @@
-// Public entry point for the flatspace-theme kit. Re-exports the shared
-// escaping + opt-in article-extraction utilities every known flatspace
-// theme.mjs (rs-codeinsight, rs-plugkit, gm) needs. Each site's own
-// page-composition logic (component layout, data contract) stays local to
-// its own site/theme.mjs -- that part legitimately differs per site (single-
-// page Hero/Features/Quickstart vs gm's multi-page article/landing split)
-// and is not force-unified here.
 export { escapeHtml, escapeJson, extractArticle, rewriteLegacyLinks } from './html-utils.js';
 
 import { createRequire } from 'node:module';
 const require = createRequire(import.meta.url);
 const { version } = require('../../../package.json');
 
-// Canonical unpkg URLs every theme.mjs's importmap/<link> points at, kept in
-// one place so a future SDK CDN path change is a single-file edit instead of
-// a 3-repo grep-and-replace. Pinned to the exact installed package version
-// (not @latest) so a consumer site's build serves what it actually built
-// against, immune to unpkg's alias-level cache TTL.
 export const SDK_CSS_URL = `https://unpkg.com/anentrypoint-design@${version}/dist/247420.css`;
 export const SDK_JS_URL = `https://unpkg.com/anentrypoint-design@${version}/dist/247420.js`;