@refrakt-md/lumina 0.22.0 → 0.23.0

package/base.css

@@ -36,6 +36,7 @@
 @import './styles/dimensions/frame.css';
 @import './styles/dimensions/substrate.css';
 @import './styles/dimensions/cover.css';
-@import './styles/dimensions/guest-posture.css';
+/* guest-posture is wholly structural → @refrakt-md/skeleton (loaded by the theme
+ * loader before base.css), so it has no skin remainder to import here (WORK-438). */
 @import './styles/dimensions/checklist.css';
 @import './styles/dimensions/sequence.css';

package/dist/config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAIA,gFAAgF;AAChF,eAAO,MAAM,YAAY,6CAoFvB,CAAC"}
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAIA,gFAAgF;AAChF,eAAO,MAAM,YAAY,6CA2FvB,CAAC"}

package/dist/config.js

@@ -84,6 +84,13 @@ export const luminaConfig = mergeThemeConfig(baseConfig, {
             caution: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="15" y1="9" x2="9" y2="15"/><line x1="9" y1="9" x2="15" y2="15"/></svg>',
             check: '<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"/><polyline points="22 4 12 14.01 9 11.01"/></svg>',
         },
+        // SPEC-094 §8 / WORK-437 (icon-from-config) — the accordion disclosure
+        // chevron lives in the icon registry, not embedded in accordion.css; the
+        // skeleton's `::before` reads the generated `--rf-icon-accordion-chevron`
+        // mask custom property, so a theme re-glyphs it without touching CSS.
+        accordion: {
+            chevron: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>',
+        },
         global: lucideIcons,
     },
 });

package/dist/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,YAAY,CAAC;AAElD,gFAAgF;AAChF,MAAM,CAAC,MAAM,YAAY,GAAG,gBAAgB,CAAC,UAAU,EAAE;IACxD,KAAK,EAAE;QACN,IAAI,EAAE;YACL,KAAK,EAAE;gBACN,EAAE,EAAE,oBAAoB;gBACxB,OAAO,EAAE,yBAAyB;gBAClC,IAAI,EAAE,sBAAsB;gBAC5B,KAAK,EAAE,uBAAuB;gBAC9B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;YACD,IAAI,EAAE;gBACL,EAAE,EAAE,oBAAoB;gBACxB,OAAO,EAAE,yBAAyB;gBAClC,IAAI,EAAE,sBAAsB;gBAC5B,KAAK,EAAE,uBAAuB;gBAC9B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;SACD;QACD,MAAM,EAAE;YACP,KAAK,EAAE;gBACN,EAAE,EAAE,yBAAyB;gBAC7B,OAAO,EAAE,+BAA+B;gBACxC,IAAI,EAAE,sBAAsB;gBAC5B,KAAK,EAAE,uBAAuB;gBAC9B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;YACD,IAAI,EAAE;gBACL,EAAE,EAAE,yBAAyB;gBAC7B,OAAO,EAAE,+BAA+B;gBACxC,IAAI,EAAE,sBAAsB;gBAC5B,KAAK,EAAE,uBAAuB;gBAC9B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;SACD;QACD,IAAI,EAAE;YACL,KAAK,EAAE;gBACN,EAAE,EAAE,gCAAgC;gBACpC,IAAI,EAAE,sBAAsB;gBAC5B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;YACD,IAAI,EAAE;gBACL,EAAE,EAAE,SAAS;gBACb,IAAI,EAAE,sBAAsB;gBAC5B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,SAAS;aACjB;SACD;QACD,IAAI,EAAE;YACL,KAAK,EAAE;gBACN,EAAE,EAAE,yBAAyB;gBAC7B,IAAI,EAAE,sBAAsB;gBAC5B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,6BAA6B;aACrC;YACD,IAAI,EAAE;gBACL,EAAE,EAAE,SAAS;gBACb,IAAI,EAAE,SAAS;gBACf,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,SAAS;aACjB;SACD;QACD,IAAI,EAAE;YACL,QAAQ,EAAE,MAAM;YAChB,IAAI,EAAE;gBACL,EAAE,EAAE,SAAS;gBACb,IAAI,EAAE,SAAS;gBACf,OAAO,EAAE,wBAAwB;aACjC;SACD;KACD;IACD,KAAK,EAAE;QACN,IAAI,EAAE;YACL,IAAI,EAAE,4SAA4S;YAClT,OAAO,EAAE,iXAAiX;YAC1X,OAAO,EAAE,uSAAuS;YAChT,KAAK,EAAE,qRAAqR;SAC5R;QACD,MAAM,EAAE,WAAW;KACnB;CACD,CAAC,CAAC"}
+{"version":3,"file":"config.js","sourceRoot":"","sources":["../src/config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,EAAE,KAAK,IAAI,WAAW,EAAE,MAAM,YAAY,CAAC;AAElD,gFAAgF;AAChF,MAAM,CAAC,MAAM,YAAY,GAAG,gBAAgB,CAAC,UAAU,EAAE;IACxD,KAAK,EAAE;QACN,IAAI,EAAE;YACL,KAAK,EAAE;gBACN,EAAE,EAAE,oBAAoB;gBACxB,OAAO,EAAE,yBAAyB;gBAClC,IAAI,EAAE,sBAAsB;gBAC5B,KAAK,EAAE,uBAAuB;gBAC9B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;YACD,IAAI,EAAE;gBACL,EAAE,EAAE,oBAAoB;gBACxB,OAAO,EAAE,yBAAyB;gBAClC,IAAI,EAAE,sBAAsB;gBAC5B,KAAK,EAAE,uBAAuB;gBAC9B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;SACD;QACD,MAAM,EAAE;YACP,KAAK,EAAE;gBACN,EAAE,EAAE,yBAAyB;gBAC7B,OAAO,EAAE,+BAA+B;gBACxC,IAAI,EAAE,sBAAsB;gBAC5B,KAAK,EAAE,uBAAuB;gBAC9B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;YACD,IAAI,EAAE;gBACL,EAAE,EAAE,yBAAyB;gBAC7B,OAAO,EAAE,+BAA+B;gBACxC,IAAI,EAAE,sBAAsB;gBAC5B,KAAK,EAAE,uBAAuB;gBAC9B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;SACD;QACD,IAAI,EAAE;YACL,KAAK,EAAE;gBACN,EAAE,EAAE,gCAAgC;gBACpC,IAAI,EAAE,sBAAsB;gBAC5B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,wBAAwB;aAChC;YACD,IAAI,EAAE;gBACL,EAAE,EAAE,SAAS;gBACb,IAAI,EAAE,sBAAsB;gBAC5B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,SAAS;aACjB;SACD;QACD,IAAI,EAAE;YACL,KAAK,EAAE;gBACN,EAAE,EAAE,yBAAyB;gBAC7B,IAAI,EAAE,sBAAsB;gBAC5B,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,6BAA6B;aACrC;YACD,IAAI,EAAE;gBACL,EAAE,EAAE,SAAS;gBACb,IAAI,EAAE,SAAS;gBACf,OAAO,EAAE,yBAAyB;gBAClC,MAAM,EAAE,SAAS;aACjB;SACD;QACD,IAAI,EAAE;YACL,QAAQ,EAAE,MAAM;YAChB,IAAI,EAAE;gBACL,EAAE,EAAE,SAAS;gBACb,IAAI,EAAE,SAAS;gBACf,OAAO,EAAE,wBAAwB;aACjC;SACD;KACD;IACD,KAAK,EAAE;QACN,IAAI,EAAE;YACL,IAAI,EAAE,4SAA4S;YAClT,OAAO,EAAE,iXAAiX;YAC1X,OAAO,EAAE,uSAAuS;YAChT,KAAK,EAAE,qRAAqR;SAC5R;QACD,uEAAuE;QACvE,yEAAyE;QACzE,0EAA0E;QAC1E,sEAAsE;QACtE,SAAS,EAAE;YACV,OAAO,EAAE,2MAA2M;SACpN;QACD,MAAM,EAAE,WAAW;KACnB;CACD,CAAC,CAAC"}

package/dist/tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,YAAY,EAAE,iBAkO1B,CAAC"}
+{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAE3D;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,YAAY,EAAE,iBAoO1B,CAAC"}

package/dist/tokens.js

@@ -114,6 +114,8 @@ export const luminaTokens = {
     spacing: {
         xs: '0.25rem',
         sm: '0.5rem',
+        snug: '0.75rem',
+        cozy: '1rem',
         md: '1.5rem',
         lg: '2rem',
         xl: '3rem',

package/dist/tokens.js.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"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"}

package/index.css

@@ -1,5 +1,12 @@
 /* Lumina Theme Identity — CSS Barrel */
 
+/* Cascade-layer contract — must load first so the `@layer skeleton, skin;` order
+ * declaration is emitted before any layer content (SPEC-094 §3 / WORK-436).
+ * Lumina's own CSS below is currently unlayered, which keeps it winning over the
+ * (empty) skeleton layer — the per-file `@layer skin` re-bucketing lands in
+ * WORK-438. */
+@import '@refrakt-md/skeleton';
+
 /* Design Tokens */
 @import './tokens/base.css';
 @import './tokens/dark.css';
@@ -37,7 +44,9 @@
 @import './styles/dimensions/frame.css';
 @import './styles/dimensions/substrate.css';
 @import './styles/dimensions/cover.css';
-@import './styles/dimensions/guest-posture.css';
+/* guest-posture is wholly structural (pointer-events + a tab-strip display reset)
+ * → @refrakt-md/skeleton (dimensions/guest-posture.css), promoted with the
+ * tabs/codegroup structure it depends on (WORK-438). */
 @import './styles/dimensions/checklist.css';
 @import './styles/dimensions/sequence.css';
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@refrakt-md/lumina",
   "description": "Lumina theme for refrakt.md — design tokens, CSS, identity transform, and layout configs",
-  "version": "0.22.0",
+  "version": "0.23.0",
   "type": "module",
   "license": "MIT",
   "repository": {
@@ -84,9 +84,10 @@
     "generate-tokens": "node scripts/generate-tokens.mjs"
   },
   "dependencies": {
-    "@refrakt-md/runes": "0.22.0",
-    "@refrakt-md/transform": "0.22.0",
-    "@refrakt-md/types": "0.22.0"
+    "@refrakt-md/runes": "0.23.0",
+    "@refrakt-md/skeleton": "0.23.0",
+    "@refrakt-md/transform": "0.23.0",
+    "@refrakt-md/types": "0.23.0"
   },
   "devDependencies": {
     "postcss": "^8.4.0"

package/styles/base/attributes.css

@@ -1,3 +1,4 @@
+@layer skin {
 /* Universal Rune Attributes — spacing & inset
  *
  * Compound attribute selectors [data-rune][data-*] give specificity (0,2,0):
@@ -19,11 +20,9 @@
 [data-rune][data-inset="loose"]   { padding-inline: var(--rf-inset-loose, 4rem); }
 [data-rune][data-inset="breathe"] { padding-inline: var(--rf-inset-breathe, 8rem); }
 
-/* ── Elevation — drop shadow (box-shadow) ──────────────────────────────
- * Universal `elevation` attribute (SPEC-086). Maps to the shared --rf-shadow-*
- * token scale; `none` explicitly flattens a rune's default shadow. */
+/* The `elevation` axis (SPEC-107) — depth-ladder chrome (fill / border / radius
+ * / resting shadow) — is mapped by value in dimensions/surfaces.css. The old
+ * SPEC-086 shadow scale (none/sm/md/lg) is superseded; the engine maps those
+ * deprecated aliases onto the ladder before they reach the DOM. */
 
-[data-rune][data-elevation="none"] { box-shadow: var(--rf-shadow-none); }
-[data-rune][data-elevation="sm"]   { box-shadow: var(--rf-shadow-sm); }
-[data-rune][data-elevation="md"]   { box-shadow: var(--rf-shadow-md); }
-[data-rune][data-elevation="lg"]   { box-shadow: var(--rf-shadow-lg); }
+}

package/styles/dimensions/checklist.css

@@ -1,21 +1,11 @@
-/* === Checklist: universal checkbox item styling === */
+@layer skin {
+/* === Checklist — skin ===
+ * The indicator chrome (fill, border, radius, box-shadow) and the item text
+ * treatment per state. The indicator gutter + box placement/size live in
+ * @refrakt-md/skeleton (dimensions/checklist.css). */
 
-/* All checklist items get left padding for the indicator */
-[data-checked] {
-	position: relative;
-	padding-left: 1.75rem;
-	list-style: none;
-	margin-left: -1.5rem;
-}
-
-/* Indicator base — positioned left of text */
+/* Indicator base chrome. */
 [data-checked]::before {
-	content: '';
-	position: absolute;
-	left: 0.125rem;
-	top: 0.5em;
-	width: 1rem;
-	height: 1rem;
 	border-radius: var(--rf-radius-sm, 0.25rem);
 	border: 2px solid var(--rf-color-border);
 	background: transparent;
@@ -59,23 +49,4 @@
 	background: transparent;
 }
 
-/* === Density interaction === */
-
-/* Compact: tighter spacing */
-[data-density="compact"] [data-checked] {
-	padding-left: 1.5rem;
-}
-
-[data-density="compact"] [data-checked]::before {
-	width: 0.75rem;
-	height: 0.75rem;
-}
-
-/* Minimal: indicators only, no text */
-[data-density="minimal"] [data-checked] {
-	font-size: 0;
-	padding-left: 0;
-	display: inline-block;
-	width: 1rem;
-	height: 1rem;
 }

package/styles/dimensions/cover.css

@@ -1,116 +1,32 @@
-/* Cover layout (SPEC-089) — `media-position="cover"`.
+@layer skin {
+/* Cover layout (SPEC-089) — skin.
  *
- * The media well fills the rune interior and the content overlays it (the poster
- * / cover card). The media stays a media guest — the thin-edge frame and
- * `--rf-radius-media` are preserved — with content floated on top via grid
- * stacking (media + content share one grid cell). No overlay primitive in the
- * layout config; the variant supplies the structure (SPEC-091), CSS positions.
- *
- * Height authority: an external grid track (bento) wins; else the media aspect
- * (`frame-aspect`, default portrait); a card height/aspect knob overrides via the
- * cascade. Cover supersedes the media-vs-content split knobs (content-height /
- * media-ratio), which have no meaning when there is no split. */
+ * The grid-overlay *structure* (media well + content share one grid cell, the
+ * well fills/crops its guest, the overlay positions via content-place) lives in
+ * @refrakt-md/skeleton (dimensions/cover.css). What remains here is skin: the
+ * media radii, the overlay's surface padding, and the legibility scrim
+ * (gradient / frost) painted over the media. */
 
-/* ── full scope — the whole content overlays the media well ──────────── */
-[data-media-position="cover"]:not([data-cover-scope="header"]) {
-	display: grid;
-	grid-template: minmax(0, 1fr) / minmax(0, 1fr);
-	aspect-ratio: var(--frame-aspect, var(--cover-aspect, 3 / 4));
-	container-type: size;
-	overflow: hidden;
-	isolation: isolate;
-}
-[data-media-position="cover"]:not([data-cover-scope="header"]) > [data-section="media"],
-[data-media-position="cover"]:not([data-cover-scope="header"]) > [data-name="content"] {
-	grid-area: 1 / 1;
-	margin: 0;
-	min-width: 0;
-}
-
-/* ── header scope — only the cover-band overlays; body flows below ────── */
 [data-cover-scope="header"] > [data-name="cover-band"] {
-	display: grid;
-	grid-template: minmax(0, 1fr) / minmax(0, 1fr);
-	aspect-ratio: var(--frame-aspect, 16 / 9);
 	border-radius: var(--rf-radius-media);
-	overflow: hidden;
-	isolation: isolate;
-	container-type: size;
-}
-/* On narrow screens a 16/9 band is too short to seat the preamble over the
- * scrim, so default it to a taller (≥1:1) poster shape. An explicit
- * `frame-aspect` still wins. */
-@media (max-width: 40rem) {
-	[data-cover-scope="header"] > [data-name="cover-band"] {
-		aspect-ratio: var(--frame-aspect, 4 / 5);
-	}
-}
-[data-cover-scope="header"] > [data-name="cover-band"] > [data-section="media"],
-[data-cover-scope="header"] > [data-name="cover-band"] > [data-name="preamble"] {
-	grid-area: 1 / 1;
-	margin: 0;
 }
 
-/* ── shared: the media well fills, the overlaid box positions ─────────── */
 [data-media-position="cover"] [data-section="media"] {
-	position: relative;
-	height: 100%;
 	border-radius: var(--rf-radius-media);
-	overflow: hidden;
-}
-[data-media-position="cover"] [data-section="media"] > :is(img, video) {
-	width: 100%;
-	height: 100%;
-	object-fit: cover;
-}
-/* SPEC-101 — non-img/video guests (a sandbox, an embed) fill the well too.
- * They can't be object-fit-cropped, so they get the well's box outright;
- * display:block covers undefined custom elements (inline by default). */
-[data-media-position="cover"] [data-section="media"] > :not(img, video) {
-	display: block;
-	width: 100%;
-	height: 100%;
 }
+
 /* A backdrop sandbox sits flush in the well — the well's own radius/overflow
- * does the clipping. The iframe height is pinned inline by the element in
- * `fill` mode; this carries the fixed-height case visually until then. */
+ * does the clipping. */
 [data-media-position="cover"] [data-section="media"] .rf-sandbox {
-	margin: 0;
 	border-radius: 0;
 }
-[data-media-position="cover"] [data-section="media"] .rf-sandbox iframe {
-	height: 100%;
-}
-/* The overlaid box (full: content; header: preamble) anchors via content-place. */
+
+/* The overlaid box carries the surface padding (density-aware via --rune-padding). */
 [data-media-position="cover"]:not([data-cover-scope="header"]) > [data-name="content"],
 [data-cover-scope="header"] > [data-name="cover-band"] > [data-name="preamble"] {
-	position: relative;
-	z-index: 1;
-	align-self: var(--cover-place-block, end);
-	justify-self: var(--cover-place-inline, stretch);
 	padding: var(--rune-padding, var(--rf-spacing-md));
 }
 
-/* ── auto / unset placement ───────────────────────────────────────────
- * `auto` is the cover default, so an unset content-place behaves the same as an
- * explicit `auto`. A header band is always a caption strip — the preamble sits at
- * the block-end over the scrim regardless of the band's orientation. A full-scope
- * overlay adapts to the cover region's orientation (portrait → block-end caption;
- * landscape → inline-start side panel). An explicit value (e.g. "center center")
- * sets the `--cover-place-*` vars on the base rule above and does NOT match here,
- * so it pins regardless of orientation. */
-[data-media-position="cover"]:not([data-cover-scope="header"]):is([data-content-place="auto"], :not([data-content-place])) > [data-name="content"],
-[data-cover-scope="header"]:is([data-content-place="auto"], :not([data-content-place])) > [data-name="cover-band"] > [data-name="preamble"] {
-	align-self: end;
-	justify-self: stretch;
-}
-@container (min-aspect-ratio: 1 / 1) {
-	[data-media-position="cover"]:not([data-cover-scope="header"]):is([data-content-place="auto"], :not([data-content-place])) > [data-name="content"] {
-		align-self: center;
-		justify-self: start;
-	}
-}
-
 /* ── default cover scrim (SPEC-088 scrim, on the media surface) ────────
  * Overlaying text on an arbitrary image without a scrim is a legibility footgun,
  * so cover applies a default gradient scrim weighted toward the content edge.
@@ -169,3 +85,5 @@
 	 * reads at full foreground strength — the same colour as the headline. */
 	--rf-color-muted: var(--rf-color-text);
 }
+
+}

package/styles/dimensions/density.css

@@ -1,3 +1,4 @@
+@layer skin {
 /* ─── Density Dimension ─────────────────────────────────────────────────
  * Controls spacing, visibility, and detail level across all runes.
  * Three levels: full (dedicated page), compact (grid/card), minimal (list).
@@ -74,3 +75,5 @@
 [data-density="minimal"] [data-density="full"] [data-meta-rank="secondary"] {
 	display: revert;
 }
+
+}

package/styles/dimensions/frame.css

@@ -1,3 +1,4 @@
+@layer skin {
 /* Frame chrome (SPEC-086) — media-surface presentation.
  *
  * The engine lands the frame contract on the frame-target element: a rune's
@@ -102,3 +103,5 @@
  * clipped by the zone's `overflow: hidden` regardless of width, so the peek
  * reads consistently from desktop to mobile. For self-target (showcase) the
  * negative-margin spill stays on too — that's the intended breakout. */
+
+}

package/styles/dimensions/media.css

@@ -1,62 +1,15 @@
-/* ─── Media Slots Dimension ─────────────────────────────────────────────
- * Generic treatment for 5 media slot types: portrait, cover, thumbnail,
- * hero, icon. Applied via data-media attribute on image/media elements.
- *
- * Includes density × media interactions (compact shrinks, minimal hides).
- * ────────────────────────────────────────────────────────────────────── */
-
-/* ─── Portrait: circular crop ─────────────────────────────────────── */
-
-[data-media="portrait"] {
-	border-radius: var(--rf-radius-full);
-	aspect-ratio: 1 / 1;
-	object-fit: cover;
-	width: var(--media-portrait-size, 5rem);
-	height: var(--media-portrait-size, 5rem);
-}
-
-/* ─── Cover: full-width banner image ──────────────────────────────── */
-
-[data-media="cover"] {
-	width: 100%;
-	object-fit: cover;
-	border-radius: var(--rf-radius-md);
-}
-
-/* ─── Thumbnail: small fixed preview ──────────────────────────────── */
-
-[data-media="thumbnail"] {
-	width: var(--media-thumbnail-size, 3rem);
-	height: var(--media-thumbnail-size, 3rem);
-	border-radius: var(--rf-radius-sm);
-	object-fit: cover;
-	flex-shrink: 0;
-}
-
-/* ─── Hero: large responsive image ────────────────────────────────── */
-
-[data-media="hero"] {
-	width: 100%;
-	object-fit: cover;
-}
-
-/* ─── Icon: small square, no crop ─────────────────────────────────── */
-
-[data-media="icon"] {
-	width: var(--media-icon-size, 2rem);
-	height: var(--media-icon-size, 2rem);
-	object-fit: contain;
-	flex-shrink: 0;
-}
-
-/* ─── Density × Media ─────────────────────────────────────────────── */
-
-/* Compact: smaller portraits */
-[data-density="compact"] [data-media="portrait"] {
-	--media-portrait-size: 3rem;
-}
-
-/* Minimal: hide all media */
-[data-density="minimal"] [data-media] {
-	display: none;
+/* ─── Media Slots Dimension — skin ──────────────────────────────────────
+ * The rounded corners of each slot type. Slot sizing/fit (the geometry) is
+ * structure and lives in `@refrakt-md/skeleton` (styles/dimensions/media.css). */
+
+@layer skin {
+	[data-media="portrait"] {
+		border-radius: var(--rf-radius-full);
+	}
+	[data-media="cover"] {
+		border-radius: var(--rf-radius-md);
+	}
+	[data-media="thumbnail"] {
+		border-radius: var(--rf-radius-sm);
+	}
 }

package/styles/dimensions/metadata.css

@@ -1,13 +1,12 @@
-/* ─── Metadata Dimensions ──────────────────────────────────────────────
- * SPEC-080 typography / geometry split:
- *  - `[data-meta-type=…]` selectors carry ONLY typography hints
- *    (monospace, tabular-nums). No padding, no border, no chip geometry.
- *  - Geometry comes from `[data-zone-layout=…]` selectors (`bar`,
- *    `definition-list`) and from the universal `.rf-badge` class, which
- *    is emitted by chip-type fields AND by the standalone `{% badge %}`
- *    rune.
- *  - Sentiment rules drive `--meta-color`, which the chip and any
- *    sentiment-tinted text inherits.
+@layer skin {
+/* ─── Metadata Dimensions — skin ───────────────────────────────────────
+ * SPEC-080 typography / geometry split. The zone-layout *structure* (bar +
+ * definition-list display/grid, the rating flex row, the sr-only label
+ * mechanism) lives in @refrakt-md/skeleton (dimensions/metadata.css). What
+ * remains here is skin: sentiment colours, meta-type typography, the rating
+ * glyph + colours, the chip/def-list spacing + borders + radius, and labels.
+ *  - `[data-meta-type=…]` selectors carry ONLY typography hints.
+ *  - Sentiment rules drive `--meta-color`, inherited by chips + tinted text.
  * ────────────────────────────────────────────────────────────────────── */
 
 /* ─── Sentiment ────────────────────────────────────────────────────── */
@@ -44,9 +43,10 @@
 }
 
 /* Rating — `value` filled marks out of `total`; each mark carries
- * `data-filled`. Stars via colour (filled = primary, empty = border). */
+ * `data-filled`. Stars via colour (filled = primary, empty = border). The
+ * inline-flex row is structure (skeleton); the glyph + spacing + colours are
+ * skin. */
 [data-meta-type="rating"] {
-	display: inline-flex;
 	gap: 0.0625rem;
 	line-height: 1;
 }
@@ -73,50 +73,22 @@
 	text-underline-offset: 0.15em;
 }
 
-/* ─── Layout: bar (SPEC-080) ───────────────────────────────────────── */
-
-/* Horizontal flex row of fields, each in its own intrinsic shape (chip or
- * bare). Wraps by default; `data-wrap="false"` keeps it on one line. A field
- * tagged `data-align="end"` (and everything after it) is pushed to the right
- * edge. */
+/* ─── Layout: bar — spacing ────────────────────────────────────────── */
+/* The flex row + end-push are structure (skeleton); the gap is skin. */
 [data-zone-layout="bar"] {
-	display: flex;
-	flex-wrap: wrap;
 	gap: 0.5rem;
-	align-items: center;
-}
-[data-zone-layout="bar"][data-wrap="false"] {
-	flex-wrap: nowrap;
-}
-[data-zone-layout="bar"] [data-align="end"] {
-	margin-left: auto;
 }
 
-/* ─── Layout: definition-list ──────────────────────────────────────── */
-
-/* Single source of truth for the `definition-list` primitive, shared by
- * both the projected metadata zone (`<dl data-zone="…">`) and the authored
- * `{% deflist %}` rune (`<dl data-rune="deflist">`) — they emit the same
- * `data-zone-layout` so they render identically (geometry, borders, margin).
- *
- * Each row stacks `dt` above `dd`. Rows flow into multiple columns
- * via `auto-fit` — CSS grid naturally collapses to a single column
- * when the container is narrower than the minimum, so the same rule
- * reads fine on mobile and packs dense on wider screens without a
- * media-query step. The 8rem minimum keeps short label / value pairs
- * like "Prep" + "15m" tight while leaving room for the per-item border. */
+/* ─── Layout: definition-list — spacing + chrome ───────────────────── */
+/* The grid + row stacking are structure (skeleton); the gaps, the per-row
+ * border/padding/radius card chrome, and the dt/dd type are skin. */
 [data-zone-layout="definition-list"] {
-	display: grid;
-	grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr));
 	gap: 0.75rem;
 	margin: 1.25rem 0;
 }
 
 [data-zone-layout="definition-list"] > [data-name="row"] {
-	display: flex;
-	flex-direction: column;
 	gap: 0.125rem;
-	min-width: 0;
 	padding: 0.625rem 0.75rem;
 	border: 1px solid var(--rf-color-border);
 	border-radius: var(--rf-radius-sm);
@@ -129,15 +101,10 @@
 }
 
 [data-zone-layout="definition-list"] dd {
-	margin: 0;
 	font-size: var(--rf-text-sm);
 }
 
-/* Multi-value dd (fields with `splitOn`) renders a row of chips
- * inside the cell, flowing naturally. */
 [data-zone-layout="definition-list"] dd[data-multi-value] {
-	display: flex;
-	flex-wrap: wrap;
 	gap: 0.25rem;
 }
 
@@ -149,19 +116,6 @@
 	opacity: 0.65;
 }
 
-/* Visually hidden labels — accessible to screen readers only */
-[data-meta-label-hidden] {
-	position: absolute;
-	width: 1px;
-	height: 1px;
-	padding: 0;
-	margin: -1px;
-	overflow: hidden;
-	clip: rect(0, 0, 0, 0);
-	white-space: nowrap;
-	border: 0;
-}
-
 /* ─── Mobile: compact ──────────────────────────────────────────────── */
 
 @media (max-width: 48rem) {
@@ -169,26 +123,22 @@
 		gap: 0.375rem;
 	}
 
-	/* On narrow screens, fall back to the original label-left / value-right
-	 * list: each row's dt/dd flow directly into a two-column grid via
-	 * `display: contents`, which drops the per-item border (no box to paint).
-	 * The border + padding move to the list itself so the whole group reads
-	 * as one bordered card. */
+	/* The border + padding move to the list itself so the whole group reads as
+	 * one bordered card (the per-row box is dropped by the skeleton's
+	 * `display: contents`). */
 	[data-zone-layout="definition-list"] {
-		grid-template-columns: max-content 1fr;
 		gap: 0.25rem 1rem;
-		align-items: baseline;
 		padding: 0.75rem 1rem;
 		border: 1px solid var(--rf-color-border);
 		border-radius: var(--rf-radius-sm);
 	}
 
-	[data-zone-layout="definition-list"] > [data-name="row"] {
-		display: contents;
-	}
-
+	/* Header rhythm stays skin with sections.css (deferred until the split layout
+	 * + sections promote together). */
 	[data-section="header"] {
 		gap: 0.375rem;
 		margin-bottom: 1.5rem;
 	}
 }
+
+}