@refrakt-md/lumina 0.32.0 → 0.34.0

package/styles/runes/map.css

@@ -1,63 +1,71 @@
 @layer skin {
-/* ── Map Rune ── */
-
-.rf-map {
-	margin: 2rem 0;
-	border-radius: var(--rf-radius-lg, 0.75rem);
-}
-
-/* Spacing variants */
-.rf-map--spacing-flush { margin: 0; }
-.rf-map--spacing-tight { margin: 0.5rem 0; }
-.rf-map--spacing-loose { margin: 3rem 0; }
-.rf-map--spacing-breathe { margin: 4rem 0; }
-
-.rf-map__container {
-	background: var(--rf-color-surface, #f8f9fa);
-	/* Establish a stacking context so Leaflet's internal pane z-indices
+	/* ── Map Rune ── */
+
+	.rf-map {
+		margin: 2rem 0;
+		border-radius: var(--rf-radius-lg, 0.75rem);
+	}
+
+	/* Spacing variants */
+	.rf-map--spacing-flush {
+		margin: 0;
+	}
+	.rf-map--spacing-tight {
+		margin: 0.5rem 0;
+	}
+	.rf-map--spacing-loose {
+		margin: 3rem 0;
+	}
+	.rf-map--spacing-breathe {
+		margin: 4rem 0;
+	}
+
+	.rf-map__container {
+		background: var(--rf-color-surface, #f8f9fa);
+		/* Establish a stacking context so Leaflet's internal pane z-indices
 	 * (tile-pane 200, overlay-pane 400, marker-pane 600, popup-pane 700,
 	 * etc.) stay contained instead of escaping past siblings — otherwise
 	 * a map dropped into a cover card's media slot punches through the
 	 * cover scrim (z-index auto) and overlaid content (z-index 1).
 	 * `position: relative` alone is not enough; `isolation: isolate` is. */
-}
-
-/* Fallback list shown while Leaflet loads */
-.rf-map__fallback {
-	padding: 1.5rem;
-	margin: 0;
-	font-size: var(--rf-text-sm);
-	color: var(--rf-color-muted);
-}
-
-.rf-map__fallback li {
-	padding: 0.25rem 0;
-}
-
-.rf-map__fallback strong {
-	color: var(--rf-color-text);
-}
-
-/* MapPin in fallback / a11y list */
-.rf-map-pin {
-	padding: 0.25rem 0;
-}
-
-.rf-map-pin__description {
-	color: var(--rf-color-muted);
-	font-style: italic;
-}
-
-.rf-map-pin__group {
-	font-size: var(--rf-text-xs);
-	padding: 0.1rem 0.5rem;
-	border-radius: var(--rf-radius-sm, 0.25rem);
-	background: var(--rf-color-surface, #f0f0f0);
-	color: var(--rf-color-muted);
-	margin-left: 0.5rem;
-}
-
-/* ── Map as a media guest ──
+	}
+
+	/* Fallback list shown while Leaflet loads */
+	.rf-map__fallback {
+		padding: 1.5rem;
+		margin: 0;
+		font-size: var(--rf-text-sm);
+		color: var(--rf-color-muted);
+	}
+
+	.rf-map__fallback li {
+		padding: 0.25rem 0;
+	}
+
+	.rf-map__fallback strong {
+		color: var(--rf-color-text);
+	}
+
+	/* MapPin in fallback / a11y list */
+	.rf-map-pin {
+		padding: 0.25rem 0;
+	}
+
+	.rf-map-pin__description {
+		color: var(--rf-color-muted);
+		font-style: italic;
+	}
+
+	.rf-map-pin__group {
+		font-size: var(--rf-text-xs);
+		padding: 0.1rem 0.5rem;
+		border-radius: var(--rf-radius-sm, 0.25rem);
+		background: var(--rf-color-surface, #f0f0f0);
+		color: var(--rf-color-muted);
+		margin-left: 0.5rem;
+	}
+
+	/* ── Map as a media guest ──
  * When dropped into a `[data-section="media"]` slot (e.g. a card or
  * bento-cell in cover mode), the map yields its standalone presentation to
  * the slot: no outer margin or padding (map is in the Banner surface group
@@ -66,49 +74,48 @@
  * slot height instead of capping at the per-size pixel height. The fallback
  * list (rendered before Leaflet hydrates) drops its outer padding too so it
  * doesn't bleed past the slot edge during the brief flash before tiles load. */
-[data-section="media"] > .rf-map {
-	margin: 0;
-	padding: 0;
-	border-radius: inherit;
-}
-[data-section="media"] .rf-map__fallback {
-	padding: 0.75rem 1rem;
-}
-
-/* Leaflet popup overrides to match theme */
-.rf-map .leaflet-popup-content-wrapper {
-	border-radius: var(--rf-radius-md, 0.5rem);
-	font-family: var(--rf-font-sans, inherit);
-	font-size: var(--rf-text-sm);
-	color: var(--rf-color-text);
-}
-
-.rf-map .leaflet-popup-content {
-	margin: 0.75rem 1rem;
-	line-height: var(--rf-leading-normal);
-}
-
-.rf-map .leaflet-popup-content strong {
-	font-size: var(--rf-text);
-	margin-bottom: 0.25rem;
-}
-
-.rf-map .leaflet-popup-content em {
-	color: var(--rf-color-muted);
-}
-
-.rf-map .leaflet-popup-content small {
-	color: var(--rf-color-muted);
-	font-size: var(--rf-text-xs);
-}
-
-.rf-map .leaflet-popup-content a {
-	color: var(--rf-color-primary);
-	text-decoration: none;
-}
-
-.rf-map .leaflet-popup-content a:hover {
-	text-decoration: underline;
-}
-
+	[data-section="media"] > .rf-map {
+		margin: 0;
+		padding: 0;
+		border-radius: inherit;
+	}
+	[data-section="media"] .rf-map__fallback {
+		padding: 0.75rem 1rem;
+	}
+
+	/* Leaflet popup overrides to match theme */
+	.rf-map .leaflet-popup-content-wrapper {
+		border-radius: var(--rf-radius-md, 0.5rem);
+		font-family: var(--rf-font-sans, inherit);
+		font-size: var(--rf-text-sm);
+		color: var(--rf-color-text);
+	}
+
+	.rf-map .leaflet-popup-content {
+		margin: 0.75rem 1rem;
+		line-height: var(--rf-leading-normal);
+	}
+
+	.rf-map .leaflet-popup-content strong {
+		font-size: var(--rf-text);
+		margin-bottom: 0.25rem;
+	}
+
+	.rf-map .leaflet-popup-content em {
+		color: var(--rf-color-muted);
+	}
+
+	.rf-map .leaflet-popup-content small {
+		color: var(--rf-color-muted);
+		font-size: var(--rf-text-xs);
+	}
+
+	.rf-map .leaflet-popup-content a {
+		color: var(--rf-color-primary);
+		text-decoration: none;
+	}
+
+	.rf-map .leaflet-popup-content a:hover {
+		text-decoration: underline;
+	}
 }

package/styles/runes/mediatext.css

@@ -1,36 +1,39 @@
 @layer skin {
-/* MediaText */
+	/* MediaText */
 
-/* Grid mode (default — no wrap) */
-.rf-mediatext:not([data-wrap="true"]) {
-	gap: 2rem;
-}
-
-/* Media container */
-.rf-mediatext__media :is(img, .rf-placeholder) {
-	border-radius: var(--rf-radius-md);
-}
+	/* Grid mode (default — no wrap) */
+	.rf-mediatext:not([data-wrap="true"]) {
+		gap: 2rem;
+	}
 
-/* Body */
-.rf-mediatext__body p:first-child { margin-top: 0; }
-.rf-mediatext__body p:last-child { margin-bottom: 0; }
+	/* Media container */
+	.rf-mediatext__media :is(img, .rf-placeholder) {
+		border-radius: var(--rf-radius-md);
+	}
 
-/* Wrap mode — float-based text wrapping */
-.rf-mediatext[data-wrap="true"] .rf-mediatext__media {
-	margin-bottom: 1rem;
-}
-.rf-mediatext--left[data-wrap="true"] .rf-mediatext__media {
-	margin-right: 2rem;
-}
-.rf-mediatext--right[data-wrap="true"] .rf-mediatext__media {
-	margin-left: 2rem;
-}
+	/* Body */
+	.rf-mediatext__body p:first-child {
+		margin-top: 0;
+	}
+	.rf-mediatext__body p:last-child {
+		margin-bottom: 0;
+	}
 
-/* Responsive — stack on mobile */
-@media (max-width: 768px) {
+	/* Wrap mode — float-based text wrapping */
 	.rf-mediatext[data-wrap="true"] .rf-mediatext__media {
-		margin: 0 0 1rem 0;
+		margin-bottom: 1rem;
+	}
+	.rf-mediatext--left[data-wrap="true"] .rf-mediatext__media {
+		margin-right: 2rem;
+	}
+	.rf-mediatext--right[data-wrap="true"] .rf-mediatext__media {
+		margin-left: 2rem;
 	}
-}
 
+	/* Responsive — stack on mobile */
+	@media (max-width: 768px) {
+		.rf-mediatext[data-wrap="true"] .rf-mediatext__media {
+			margin: 0 0 1rem 0;
+		}
+	}
 }

package/styles/runes/milestone.css

@@ -1,106 +1,107 @@
 @layer skin {
-/* Milestone */
+	/* Milestone */
 
-/* SPEC-079: eyebrow + metadata zone names replace header-primary /
+	/* SPEC-079: eyebrow + metadata zone names replace header-primary /
  * header-secondary. */
 
-.rf-milestone__eyebrow {
-	margin-bottom: 0.75rem;
-}
-.rf-milestone__title h1,
-.rf-milestone__title h2,
-.rf-milestone__title h3 {
-	margin-top: 0;
-}
+	.rf-milestone__eyebrow {
+		margin-bottom: 0.75rem;
+	}
+	.rf-milestone__title h1,
+	.rf-milestone__title h2,
+	.rf-milestone__title h3 {
+		margin-top: 0;
+	}
 
-.rf-milestone__metadata {
-	margin-bottom: 1.5rem;
-}
-.rf-milestone__body {
-	font-size: var(--rf-text-sm);
-	line-height: var(--rf-leading-relaxed);
-}
-.rf-milestone__body ul {
-	padding-left: 1.5rem;
-}
+	.rf-milestone__metadata {
+		margin-bottom: 1.5rem;
+	}
+	.rf-milestone__body {
+		font-size: var(--rf-text-sm);
+		line-height: var(--rf-leading-relaxed);
+	}
+	.rf-milestone__body ul {
+		padding-left: 1.5rem;
+	}
 
-/* Auto-backlog */
-.rf-milestone__backlog {
-	margin-top: 1.25rem;
-	padding-top: 1rem;
-	border-top: 1px solid var(--rf-color-border);
-}
-.rf-milestone__backlog-group {
-	margin-bottom: 1rem;
-}
-.rf-milestone__backlog-group-label {
-	font-size: var(--rf-text-xs);
-	font-weight: var(--rf-weight-bold);
-	text-transform: uppercase;
-	letter-spacing: var(--rf-tracking-wider);
-	color: var(--rf-color-muted);
-	margin: 0 0 0.375rem;
-}
+	/* Auto-backlog */
+	.rf-milestone__backlog {
+		margin-top: 1.25rem;
+		padding-top: 1rem;
+		border-top: 1px solid var(--rf-color-border);
+	}
+	.rf-milestone__backlog-group {
+		margin-bottom: 1rem;
+	}
+	.rf-milestone__backlog-group-label {
+		font-size: var(--rf-text-xs);
+		font-weight: var(--rf-weight-bold);
+		text-transform: uppercase;
+		letter-spacing: var(--rf-tracking-wider);
+		color: var(--rf-color-muted);
+		margin: 0 0 0.375rem;
+	}
 
-/* Backlog tabs */
-.rf-milestone__tabs {
-	border-bottom: 1px solid var(--rf-color-border);
-	margin-bottom: 0;
-}
-.rf-milestone__tab {
-	padding: 0.5rem 1rem;
-	font-size: var(--rf-text-sm);
-	font-weight: var(--rf-weight-medium);
-	color: var(--rf-color-muted);
-	background: none;
-	border: none;
-	border-bottom: 2px solid transparent;
-	cursor: pointer;
-	transition: color 200ms ease, border-color 200ms ease;
-	white-space: nowrap;
-	font-family: inherit;
-}
-.rf-milestone__tab:hover {
-	color: var(--rf-color-text);
-}
-.rf-milestone__tab--active {
-	color: var(--rf-color-primary);
-	border-bottom-color: var(--rf-color-primary);
-	font-weight: var(--rf-weight-semibold);
-}
-.rf-milestone__panels {
-	padding: 0;
-	margin: 0;
-}
-.rf-milestone__panel {
-	padding-top: 0.75rem;
-}
-
-/* Aggregate progress */
-.rf-milestone__progress {
-	margin-bottom: 1rem;
-}
-.rf-milestone__progress-header {
-	margin-bottom: 0.375rem;
-}
-.rf-milestone__progress-label {
-	font-size: var(--rf-text-xs);
-	font-weight: var(--rf-weight-semibold);
-	color: var(--rf-color-muted);
-}
-.rf-milestone__progress-count {
-	font-size: var(--rf-text-xs);
-	font-weight: var(--rf-weight-semibold);
-	color: var(--rf-color-muted);
-}
-.rf-milestone__progress-bar {
-	border-radius: var(--rf-radius-sm);
-	background: var(--rf-color-surface-active);
-}
-.rf-milestone__progress-bar::after {
-	background: var(--rf-color-primary);
-	border-radius: var(--rf-radius-sm);
-	transition: width 0.3s ease;
-}
+	/* Backlog tabs */
+	.rf-milestone__tabs {
+		border-bottom: 1px solid var(--rf-color-border);
+		margin-bottom: 0;
+	}
+	.rf-milestone__tab {
+		padding: 0.5rem 1rem;
+		font-size: var(--rf-text-sm);
+		font-weight: var(--rf-weight-medium);
+		color: var(--rf-color-muted);
+		background: none;
+		border: none;
+		border-bottom: 2px solid transparent;
+		cursor: pointer;
+		transition:
+			color 200ms ease,
+			border-color 200ms ease;
+		white-space: nowrap;
+		font-family: inherit;
+	}
+	.rf-milestone__tab:hover {
+		color: var(--rf-color-text);
+	}
+	.rf-milestone__tab--active {
+		color: var(--rf-color-primary);
+		border-bottom-color: var(--rf-color-primary);
+		font-weight: var(--rf-weight-semibold);
+	}
+	.rf-milestone__panels {
+		padding: 0;
+		margin: 0;
+	}
+	.rf-milestone__panel {
+		padding-top: 0.75rem;
+	}
 
+	/* Aggregate progress */
+	.rf-milestone__progress {
+		margin-bottom: 1rem;
+	}
+	.rf-milestone__progress-header {
+		margin-bottom: 0.375rem;
+	}
+	.rf-milestone__progress-label {
+		font-size: var(--rf-text-xs);
+		font-weight: var(--rf-weight-semibold);
+		color: var(--rf-color-muted);
+	}
+	.rf-milestone__progress-count {
+		font-size: var(--rf-text-xs);
+		font-weight: var(--rf-weight-semibold);
+		color: var(--rf-color-muted);
+	}
+	.rf-milestone__progress-bar {
+		border-radius: var(--rf-radius-sm);
+		background: var(--rf-color-surface-active);
+	}
+	.rf-milestone__progress-bar::after {
+		background: var(--rf-color-primary);
+		border-radius: var(--rf-radius-sm);
+		transition: width 0.3s ease;
+	}
 }