@refrakt-md/lumina 0.33.0 → 0.34.0

package/styles/runes/expand.css

@@ -1,37 +1,46 @@
 @layer skin {
-/* Expand — skin. The inline-block canonical-link box lives in @refrakt-md/skeleton
+	/* Expand — skin. The inline-block canonical-link box lives in @refrakt-md/skeleton
  * (styles/runes/expand.css). */
-.rf-expand {
-	margin: var(--rf-spacing-md) 0;
-}
-.rf-expand[data-outline-scope] {
-	padding: var(--rf-spacing-md) 0;
-}
-.rf-expand[data-outline-scope] :is(h1, h2, h3, h4, h5, h6):first-child {
-	margin-top: 0;
-}
-.rf-expand[data-outline-scope] h1 { font-size: var(--rf-text-2xl); }
-.rf-expand[data-outline-scope] h2 { font-size: var(--rf-text-xl); }
-.rf-expand[data-outline-scope] h3 { font-size: var(--rf-text-lg); }
-.rf-expand > :first-child { margin-top: 0; }
-.rf-expand > :last-child { margin-bottom: 0; }
-.rf-expand__canonical-link {
-	margin-top: var(--rf-spacing-sm);
-	font-size: var(--rf-text-sm);
-	color: var(--rf-color-primary);
-	text-decoration: none;
-}
-.rf-expand__canonical-link:hover {
-	text-decoration: underline;
-}
-.rf-expand[data-expand-error] {
-	padding: var(--rf-spacing-sm) var(--rf-spacing-md);
-	border-left: 3px solid var(--rf-color-danger);
-	background: var(--rf-color-danger-bg);
-	color: var(--rf-color-danger);
-	font-family: var(--rf-font-mono);
-	font-size: var(--rf-text-sm);
-	border-radius: 0 var(--rf-radius-sm) var(--rf-radius-sm) 0;
-}
-
+	.rf-expand {
+		margin: var(--rf-spacing-md) 0;
+	}
+	.rf-expand[data-outline-scope] {
+		padding: var(--rf-spacing-md) 0;
+	}
+	.rf-expand[data-outline-scope] :is(h1, h2, h3, h4, h5, h6):first-child {
+		margin-top: 0;
+	}
+	.rf-expand[data-outline-scope] h1 {
+		font-size: var(--rf-text-2xl);
+	}
+	.rf-expand[data-outline-scope] h2 {
+		font-size: var(--rf-text-xl);
+	}
+	.rf-expand[data-outline-scope] h3 {
+		font-size: var(--rf-text-lg);
+	}
+	.rf-expand > :first-child {
+		margin-top: 0;
+	}
+	.rf-expand > :last-child {
+		margin-bottom: 0;
+	}
+	.rf-expand__canonical-link {
+		margin-top: var(--rf-spacing-sm);
+		font-size: var(--rf-text-sm);
+		color: var(--rf-color-primary);
+		text-decoration: none;
+	}
+	.rf-expand__canonical-link:hover {
+		text-decoration: underline;
+	}
+	.rf-expand[data-expand-error] {
+		padding: var(--rf-spacing-sm) var(--rf-spacing-md);
+		border-left: 3px solid var(--rf-color-danger);
+		background: var(--rf-color-danger-bg);
+		color: var(--rf-color-danger);
+		font-family: var(--rf-font-mono);
+		font-size: var(--rf-text-sm);
+		border-radius: 0 var(--rf-radius-sm) var(--rf-radius-sm) 0;
+	}
 }

package/styles/runes/faction.css

@@ -1,65 +1,64 @@
 @layer skin {
-/* Faction — split/stacked geometry, the title, and the metadata def-list all
+	/* Faction — split/stacked geometry, the title, and the metadata def-list all
  * come from the shared layers: layouts/split.css ([data-layout] +
  * [data-section="media"]), dimensions/sections.css ([data-section="title"] /
  * "preamble"), and dimensions/metadata.css ([data-zone-layout]). This file
  * only carries faction-specific chrome. */
 
-/* Thin-edge inset model (matches `.rf-card` / `.rf-recipe`): card outer padding
+	/* Thin-edge inset model (matches `.rf-card` / `.rf-recipe`): card outer padding
  * is a thin edge, the content column adds the remaining inset back so text sits
  * at the full `--rune-padding` without negative-margin bleed. Like recipe, no
  * `--split-valign: stretch` — faction content can be long (multiple sections),
  * so we let the scene keep its natural aspect ratio rather than cover-cropping. */
-.rf-faction {
-	--rf-faction-edge: 0.5rem;
-	--rf-faction-media-gap: var(--rf-spacing-lg);
-	--rf-faction-split-gap: var(--rf-spacing-sm);
-	padding: var(--rf-faction-edge);
-}
+	.rf-faction {
+		--rf-faction-edge: 0.5rem;
+		--rf-faction-media-gap: var(--rf-spacing-lg);
+		--rf-faction-split-gap: var(--rf-spacing-sm);
+		padding: var(--rf-faction-edge);
+	}
 
-.rf-faction__content {
-	padding: max(0px, calc(var(--rune-padding, var(--rf-spacing-md)) - var(--rf-faction-edge)));
-}
+	.rf-faction__content {
+		padding: max(0px, calc(var(--rune-padding, var(--rf-spacing-md)) - var(--rf-faction-edge)));
+	}
 
-/* Direct grid properties (column-gap / row-gap) win via selector specificity
+	/* Direct grid properties (column-gap / row-gap) win via selector specificity
  * over the shared media-position layout vars. */
-.rf-faction[data-media-position="start"],
-.rf-faction[data-media-position="end"] {
-	column-gap: var(--rf-faction-split-gap);
-	row-gap: var(--rf-faction-media-gap);
-}
+	.rf-faction[data-media-position="start"],
+	.rf-faction[data-media-position="end"] {
+		column-gap: var(--rf-faction-split-gap);
+		row-gap: var(--rf-faction-media-gap);
+	}
 
-.rf-faction[data-media-position="top"] > .rf-faction__scene {
-	margin-bottom: var(--rf-faction-media-gap);
-}
-.rf-faction[data-media-position="bottom"] > .rf-faction__scene {
-	margin-top: var(--rf-faction-media-gap);
-}
+	.rf-faction[data-media-position="top"] > .rf-faction__scene {
+		margin-bottom: var(--rf-faction-media-gap);
+	}
+	.rf-faction[data-media-position="bottom"] > .rf-faction__scene {
+		margin-top: var(--rf-faction-media-gap);
+	}
 
-/* Content */
-.rf-faction__sections {
-	gap: 1rem;
-}
-.rf-faction__content ul,
-.rf-faction__content ol {
-	padding-left: 1.5rem;
-}
-
-/* Faction Section */
-.rf-faction-section {
-	padding: 0.75rem 0;
-	border-top: 1px solid var(--rf-color-border);
-}
-.rf-faction-section__name {
-	font-size: var(--rf-text-xl);
-	font-weight: var(--rf-weight-bold);
-	line-height: var(--rf-leading-snug);
-	margin-bottom: 0.5rem;
-	color: var(--rf-color-text);
-}
-.rf-faction-section__body ul,
-.rf-faction-section__body ol {
-	padding-left: 1.5rem;
-}
+	/* Content */
+	.rf-faction__sections {
+		gap: 1rem;
+	}
+	.rf-faction__content ul,
+	.rf-faction__content ol {
+		padding-left: 1.5rem;
+	}
 
+	/* Faction Section */
+	.rf-faction-section {
+		padding: 0.75rem 0;
+		border-top: 1px solid var(--rf-color-border);
+	}
+	.rf-faction-section__name {
+		font-size: var(--rf-text-xl);
+		font-weight: var(--rf-weight-bold);
+		line-height: var(--rf-leading-snug);
+		margin-bottom: 0.5rem;
+		color: var(--rf-color-text);
+	}
+	.rf-faction-section__body ul,
+	.rf-faction-section__body ol {
+		padding-left: 1.5rem;
+	}
 }

package/styles/runes/feature.css

@@ -1,119 +1,126 @@
 @layer skin {
-/* Feature — skin. The preamble/eyebrow/content/definitions/icon layout, the
+	/* Feature — skin. The preamble/eyebrow/content/definitions/icon layout, the
  * `[data-layout]` arrangement, and the media-position flip live in
  * @refrakt-md/skeleton (styles/runes/feature.css). */
-.rf-feature {
-	padding: 2.5rem 0 2rem;
-}
-.rf-feature__preamble {
-	gap: 0.25rem;
-	margin-bottom: 1.5rem;
-}
-.rf-feature__eyebrow {
-	font-size: var(--rf-text-sm);
-	font-weight: var(--rf-weight-semibold);
-	letter-spacing: var(--rf-tracking-wider);
-	text-transform: uppercase;
-	color: var(--rf-color-primary);
-	margin: 0 0 0.5rem;
-}
-.rf-feature__eyebrow:has(a) {
-	padding: 0.25rem 0.875rem;
-	border: 1px solid var(--rf-color-border);
-	border-radius: var(--rf-radius-full);
-	color: var(--rf-color-text);
-	font-weight: var(--rf-weight-normal);
-	text-transform: none;
-	letter-spacing: var(--rf-tracking-normal);
-	transition: border-color 150ms ease;
-}
-.rf-feature__eyebrow:has(a):hover { border-color: var(--rf-color-muted); }
-.rf-feature__eyebrow:has(a) a { color: var(--rf-color-primary); font-weight: var(--rf-weight-semibold); text-decoration: none; }
-.rf-feature__eyebrow:has(a) a::before { border-radius: inherit; }
-.rf-feature__headline {
-	margin-top: 0;
-}
-.rf-feature__blurb {
-	color: var(--rf-color-muted);
-	margin-bottom: 0;
-	max-width: 40rem;
-}
-.rf-feature__image {
-	margin-bottom: 1rem;
-}
-.rf-feature h2 {
-	margin-bottom: 2rem;
-}
-.rf-feature[data-align="center"] .rf-feature__preamble,
-.rf-feature[data-align="center"] h2 {
-	text-align: center;
-}
-.rf-feature[data-align="left"] .rf-feature__preamble,
-.rf-feature[data-align="left"] h2 {
-	text-align: left;
-}
-.rf-feature[data-align="right"] .rf-feature__preamble,
-.rf-feature[data-align="right"] h2 {
-	text-align: right;
-}
-/* Definitions skin. Arrangement + item chrome follow the `layout` axis
+	.rf-feature {
+		padding: 2.5rem 0 2rem;
+	}
+	.rf-feature__preamble {
+		gap: 0.25rem;
+		margin-bottom: 1.5rem;
+	}
+	.rf-feature__eyebrow {
+		font-size: var(--rf-text-sm);
+		font-weight: var(--rf-weight-semibold);
+		letter-spacing: var(--rf-tracking-wider);
+		text-transform: uppercase;
+		color: var(--rf-color-primary);
+		margin: 0 0 0.5rem;
+	}
+	.rf-feature__eyebrow:has(a) {
+		padding: 0.25rem 0.875rem;
+		border: 1px solid var(--rf-color-border);
+		border-radius: var(--rf-radius-full);
+		color: var(--rf-color-text);
+		font-weight: var(--rf-weight-normal);
+		text-transform: none;
+		letter-spacing: var(--rf-tracking-normal);
+		transition: border-color 150ms ease;
+	}
+	.rf-feature__eyebrow:has(a):hover {
+		border-color: var(--rf-color-muted);
+	}
+	.rf-feature__eyebrow:has(a) a {
+		color: var(--rf-color-primary);
+		font-weight: var(--rf-weight-semibold);
+		text-decoration: none;
+	}
+	.rf-feature__eyebrow:has(a) a::before {
+		border-radius: inherit;
+	}
+	.rf-feature__headline {
+		margin-top: 0;
+	}
+	.rf-feature__blurb {
+		color: var(--rf-color-muted);
+		margin-bottom: 0;
+		max-width: 40rem;
+	}
+	.rf-feature__image {
+		margin-bottom: 1rem;
+	}
+	.rf-feature h2 {
+		margin-bottom: 2rem;
+	}
+	.rf-feature[data-align="center"] .rf-feature__preamble,
+	.rf-feature[data-align="center"] h2 {
+		text-align: center;
+	}
+	.rf-feature[data-align="left"] .rf-feature__preamble,
+	.rf-feature[data-align="left"] h2 {
+		text-align: left;
+	}
+	.rf-feature[data-align="right"] .rf-feature__preamble,
+	.rf-feature[data-align="right"] h2 {
+		text-align: right;
+	}
+	/* Definitions skin. Arrangement + item chrome follow the `layout` axis
  * (SPEC-099): `grid` tiles carded items; `list` stacks flat rows. */
-.rf-feature__items {
-	margin: 0;
-}
-.rf-feature[data-layout="grid"] .rf-feature__items,
-.rf-feature[data-layout="carousel"] .rf-feature__items {
-	gap: 1.5rem;
-}
-/* Beside layouts (media on start/end): left-align the heading/preamble. */
-.rf-feature[data-media-position="start"] .rf-feature__preamble,
-.rf-feature[data-media-position="end"] .rf-feature__preamble,
-.rf-feature[data-media-position="start"] h2,
-.rf-feature[data-media-position="end"] h2 {
-	text-align: left;
-}
-/* List arrangement: items are flat rows, not carded tiles. */
-.rf-feature[data-layout="list"] .rf-feature__feature-item {
-	background: none;
-	border: none;
-	border-radius: 0;
-	padding: 0.75rem 0;
-}
-.rf-feature__feature-item {
-	padding: 1.75rem;
-	border-radius: var(--rf-radius-container);
-	border: 1px solid var(--rf-color-border);
-	background: var(--rf-color-surface);
-}
-.rf-feature__feature-item dt {
-	font-weight: var(--rf-weight-semibold);
-	font-size: var(--rf-text-lg);
-	margin-bottom: 0.75rem;
-	letter-spacing: var(--rf-tracking-tight);
-	color: var(--rf-color-text);
-}
-.rf-feature__feature-item dt > .rf-icon {
-	margin-bottom: 0.5rem;
-	color: var(--rf-color-primary);
-}
-.rf-feature__feature-item dd {
-	margin: 0;
-	color: var(--rf-color-muted);
-	font-size: var(--rf-text-sm);
-	line-height: var(--rf-leading-relaxed);
-}
+	.rf-feature__items {
+		margin: 0;
+	}
+	.rf-feature[data-layout="grid"] .rf-feature__items,
+	.rf-feature[data-layout="carousel"] .rf-feature__items {
+		gap: 1.5rem;
+	}
+	/* Beside layouts (media on start/end): left-align the heading/preamble. */
+	.rf-feature[data-media-position="start"] .rf-feature__preamble,
+	.rf-feature[data-media-position="end"] .rf-feature__preamble,
+	.rf-feature[data-media-position="start"] h2,
+	.rf-feature[data-media-position="end"] h2 {
+		text-align: left;
+	}
+	/* List arrangement: items are flat rows, not carded tiles. */
+	.rf-feature[data-layout="list"] .rf-feature__feature-item {
+		background: none;
+		border: none;
+		border-radius: 0;
+		padding: 0.75rem 0;
+	}
+	.rf-feature__feature-item {
+		padding: 1.75rem;
+		border-radius: var(--rf-radius-container);
+		border: 1px solid var(--rf-color-border);
+		background: var(--rf-color-surface);
+	}
+	.rf-feature__feature-item dt {
+		font-weight: var(--rf-weight-semibold);
+		font-size: var(--rf-text-lg);
+		margin-bottom: 0.75rem;
+		letter-spacing: var(--rf-tracking-tight);
+		color: var(--rf-color-text);
+	}
+	.rf-feature__feature-item dt > .rf-icon {
+		margin-bottom: 0.5rem;
+		color: var(--rf-color-primary);
+	}
+	.rf-feature__feature-item dd {
+		margin: 0;
+		color: var(--rf-color-muted);
+		font-size: var(--rf-text-sm);
+		line-height: var(--rf-leading-relaxed);
+	}
 
-/* Context-aware: feature inside a hero — no top padding, tighter spacing */
-.rf-feature--in-hero {
-	padding-top: 0;
-}
-.rf-feature--in-hero .rf-feature__feature-item {
-	background: transparent;
-}
-
-/* Context-aware: feature inside a grid — remove outer padding */
-.rf-feature--in-grid {
-	padding: 0;
-}
+	/* Context-aware: feature inside a hero — no top padding, tighter spacing */
+	.rf-feature--in-hero {
+		padding-top: 0;
+	}
+	.rf-feature--in-hero .rf-feature__feature-item {
+		background: transparent;
+	}
 
+	/* Context-aware: feature inside a grid — remove outer padding */
+	.rf-feature--in-grid {
+		padding: 0;
+	}
 }

package/styles/runes/figure.css

@@ -1,15 +1,14 @@
 @layer skin {
-/* Figure — skin. The image box, frame-aspect fill, size max-widths, and alignment
+	/* Figure — skin. The image box, frame-aspect fill, size max-widths, and alignment
  * auto-margins live in @refrakt-md/skeleton (styles/runes/figure.css). */
-.rf-figure :is(img, .rf-placeholder) {
-	border-radius: var(--rf-radius-media);
-}
-.rf-figure figcaption {
-	margin-top: 0.625rem;
-	font-size: var(--rf-text-sm);
-	color: var(--rf-color-muted);
-	text-align: center;
-	font-style: italic;
-}
-
+	.rf-figure :is(img, .rf-placeholder) {
+		border-radius: var(--rf-radius-media);
+	}
+	.rf-figure figcaption {
+		margin-top: 0.625rem;
+		font-size: var(--rf-text-sm);
+		color: var(--rf-color-muted);
+		text-align: center;
+		font-style: italic;
+	}
 }

package/styles/runes/file-ref.css

@@ -1,16 +1,14 @@
 @layer skin {
+	.rf-file-ref > a {
+		color: var(--rf-color-primary);
+		text-decoration: underline;
+		text-decoration-thickness: 1px;
+		text-underline-offset: 2px;
+		font-family: var(--rf-font-mono, ui-monospace, SFMono-Regular, monospace);
+		font-size: 0.9375em;
+	}
 
-.rf-file-ref > a {
-	color: var(--rf-color-primary);
-	text-decoration: underline;
-	text-decoration-thickness: 1px;
-	text-underline-offset: 2px;
-	font-family: var(--rf-font-mono, ui-monospace, SFMono-Regular, monospace);
-	font-size: 0.9375em;
-}
-
-.rf-file-ref > a:hover {
-	text-decoration-thickness: 2px;
-}
-
+	.rf-file-ref > a:hover {
+		text-decoration-thickness: 2px;
+	}
 }