@refrakt-md/lumina 0.4.0

package/styles/runes/api.css

@@ -0,0 +1,77 @@
+/* Api */
+.rf-api {
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-lg);
+	margin: 1.5rem 0;
+	overflow: hidden;
+}
+.rf-api__header {
+	display: flex;
+	align-items: center;
+	gap: 0.75rem;
+	padding: 1rem 1.25rem;
+	background: var(--rf-color-surface-hover);
+	border-bottom: 1px solid var(--rf-color-border);
+}
+.rf-api__method {
+	font-weight: 700;
+	font-size: 0.75rem;
+	padding: 0.25rem 0.5rem;
+	border-radius: var(--rf-radius-sm);
+	font-family: var(--rf-font-mono);
+}
+.rf-api__path {
+	font-family: var(--rf-font-mono);
+	font-size: 0.9375rem;
+	font-weight: 500;
+	color: var(--rf-color-text);
+}
+.rf-api__auth {
+	margin-left: auto;
+	font-size: 0.75rem;
+	color: var(--rf-color-muted);
+	background: var(--rf-color-surface-active);
+	padding: 0.125rem 0.5rem;
+	border-radius: var(--rf-radius-sm);
+}
+/* Method colors driven by data-method attribute from engine */
+[data-method="GET"] .rf-api__method { color: var(--rf-color-success); background: var(--rf-color-success-bg); }
+[data-method="POST"] .rf-api__method { color: var(--rf-color-info); background: var(--rf-color-info-bg); }
+[data-method="PUT"] .rf-api__method { color: var(--rf-color-warning); background: var(--rf-color-warning-bg); }
+[data-method="PATCH"] .rf-api__method { color: var(--rf-color-warning); background: var(--rf-color-warning-bg); }
+[data-method="DELETE"] .rf-api__method { color: var(--rf-color-danger); background: var(--rf-color-danger-bg); }
+[data-method="HEAD"] .rf-api__method { color: var(--rf-color-muted); background: var(--rf-color-surface); }
+[data-method="OPTIONS"] .rf-api__method { color: var(--rf-color-muted); background: var(--rf-color-surface); }
+.rf-api__body {
+	padding: 1.25rem;
+}
+.rf-api__body table {
+	width: 100%;
+	border-collapse: collapse;
+	margin: 1rem 0;
+}
+.rf-api__body th {
+	text-align: left;
+	padding: 0.5rem 0.75rem;
+	font-size: 0.75rem;
+	font-weight: 600;
+	text-transform: uppercase;
+	color: var(--rf-color-muted);
+	border-bottom: 2px solid var(--rf-color-border);
+}
+.rf-api__body td {
+	padding: 0.5rem 0.75rem;
+	border-bottom: 1px solid var(--rf-color-border);
+	font-size: 0.875rem;
+}
+.rf-api__body pre {
+	border-radius: var(--rf-radius-md);
+	margin: 1rem 0;
+}
+.rf-api__body blockquote {
+	border-left: 3px solid var(--rf-color-warning-border);
+	background: var(--rf-color-warning-bg);
+	padding: 0.75rem 1rem;
+	border-radius: 0 var(--rf-radius-md) var(--rf-radius-md) 0;
+	margin: 1rem 0;
+}

package/styles/runes/bento.css

@@ -0,0 +1,48 @@
+/* Bento */
+.rf-bento {
+	margin: 1.5rem 0;
+}
+.rf-bento__grid {
+	display: grid;
+}
+.rf-bento-cell {
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-md);
+	padding: 1.25rem;
+	background: var(--rf-color-surface);
+	overflow: hidden;
+}
+.rf-bento-cell--large {
+	grid-column: span 2;
+	grid-row: span 2;
+}
+.rf-bento-cell--medium {
+	grid-column: span 2;
+}
+.rf-bento-cell--small {
+	grid-column: span 1;
+}
+.rf-bento-cell__title {
+	font-size: 1rem;
+	font-weight: 600;
+	margin: 0 0 0.5rem;
+}
+.rf-bento-cell__body span[property],
+.rf-bento-cell__body meta { display: none; }
+.rf-bento-cell__body p:last-child { margin-bottom: 0; }
+.rf-bento-cell img {
+	width: 100%;
+	height: auto;
+	border-radius: var(--rf-radius-sm);
+	margin-bottom: 0.75rem;
+}
+@media (max-width: 768px) {
+	.rf-bento__grid { grid-template-columns: repeat(2, 1fr) !important; }
+	.rf-bento-cell--large { grid-column: span 2; grid-row: span 1; }
+	.rf-bento-cell--medium { grid-column: span 2; }
+}
+@media (max-width: 480px) {
+	.rf-bento__grid { grid-template-columns: 1fr !important; }
+	.rf-bento-cell--large,
+	.rf-bento-cell--medium { grid-column: span 1; }
+}

package/styles/runes/breadcrumb.css

@@ -0,0 +1,46 @@
+/* Breadcrumb */
+.rf-breadcrumb {
+	font-size: 0.85rem;
+	margin: 0 0 1.5rem;
+}
+.rf-breadcrumb__items {
+	display: contents;
+}
+.rf-breadcrumb-item {
+	display: contents;
+}
+.rf-breadcrumb ol {
+	display: flex;
+	align-items: center;
+	flex-wrap: wrap;
+	gap: 0.25rem;
+	list-style: none;
+	padding: 0;
+	margin: 0;
+}
+.rf-breadcrumb li {
+	display: flex;
+	align-items: center;
+	gap: 0.25rem;
+	padding: 0;
+	margin: 0;
+}
+.rf-breadcrumb li + li::before {
+	content: var(--separator);
+	color: var(--rf-color-muted);
+	opacity: 0.5;
+	margin-right: 0.125rem;
+}
+.rf-breadcrumb a {
+	color: var(--rf-color-muted);
+	text-decoration: none;
+	transition: color 150ms ease;
+}
+.rf-breadcrumb a:hover {
+	color: var(--rf-color-primary);
+	text-decoration: none;
+}
+.rf-breadcrumb li:last-child span {
+	color: var(--rf-color-text);
+	font-weight: 500;
+}

package/styles/runes/cast.css

@@ -0,0 +1,56 @@
+/* Cast */
+.rf-cast {
+	margin: 1.5rem 0;
+}
+.rf-cast__members {
+	display: contents;
+}
+.rf-cast--grid ul {
+	display: grid;
+	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+	gap: 1rem;
+	list-style: none;
+	padding: 0;
+}
+.rf-cast--list ul {
+	display: flex;
+	flex-direction: column;
+	gap: 0.75rem;
+	list-style: none;
+	padding: 0;
+}
+.rf-cast-member {
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-md);
+	padding: 1.25rem;
+	text-align: center;
+}
+.rf-cast-member__info {
+	display: flex;
+	flex-direction: column;
+	gap: 0.25rem;
+}
+.rf-cast-member__name {
+	font-weight: 600;
+	font-size: 1rem;
+	color: var(--rf-color-text);
+}
+.rf-cast-member__role {
+	font-size: 0.875rem;
+	color: var(--rf-color-muted);
+}
+.rf-cast-member__body {
+	margin-top: 0.75rem;
+	font-size: 0.875rem;
+	color: var(--rf-color-muted);
+}
+.rf-cast-member__body:empty { display: none; }
+.rf-cast-member__body span[property] { display: none; }
+.rf-cast-member img {
+	width: 80px;
+	height: 80px;
+	border-radius: var(--rf-radius-full);
+	object-fit: cover;
+	margin: 0 auto 0.75rem;
+	display: block;
+}

package/styles/runes/changelog.css

@@ -0,0 +1,53 @@
+/* Changelog */
+.rf-changelog {
+	margin: 2rem 0;
+}
+.rf-changelog__releases {
+	display: contents;
+}
+.rf-changelog-release {
+	padding: 1.5rem 0;
+	border-bottom: 1px solid var(--rf-color-border);
+}
+.rf-changelog-release:last-child {
+	border-bottom: none;
+}
+.rf-changelog-release__body {
+	display: contents;
+}
+.rf-changelog-release h3 {
+	font-size: 1.25rem;
+	font-weight: 700;
+	margin: 0 0 0.25rem;
+	color: var(--rf-color-text);
+}
+.rf-changelog-release time {
+	display: block;
+	font-size: 0.8rem;
+	color: var(--rf-color-muted);
+	margin-bottom: 0.75rem;
+}
+.rf-changelog-release ul {
+	padding-left: 1.25rem;
+	margin: 0;
+}
+.rf-changelog-release li {
+	font-size: 0.925rem;
+	line-height: 1.65;
+	margin-bottom: 0.25rem;
+}
+.rf-changelog-release strong {
+	display: inline-block;
+	font-size: 0.7rem;
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	padding: 0.1rem 0.4rem;
+	border-radius: var(--rf-radius-sm);
+	margin-right: 0.375rem;
+	vertical-align: middle;
+}
+.rf-changelog-release li strong:first-child {
+	background: var(--rf-color-success-bg);
+	color: var(--rf-color-success);
+}

package/styles/runes/chart.css

@@ -0,0 +1,33 @@
+/* Chart */
+.rf-chart {
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-lg);
+	padding: 1.5rem;
+	margin: 1.5rem 0;
+}
+.rf-chart__title {
+	font-weight: 600;
+	font-size: 1rem;
+	margin-bottom: 1rem;
+	text-align: center;
+}
+.rf-chart__container { width: 100%; }
+.rf-chart__svg { width: 100%; height: auto; }
+.rf-chart__legend {
+	display: flex;
+	justify-content: center;
+	gap: 1rem;
+	margin-top: 1rem;
+}
+.rf-chart__legend-item {
+	display: flex;
+	align-items: center;
+	gap: 0.375rem;
+	font-size: 0.8125rem;
+	color: var(--rf-color-muted);
+}
+.rf-chart__legend-color {
+	width: 12px;
+	height: 12px;
+	border-radius: 2px;
+}

package/styles/runes/codegroup.css

@@ -0,0 +1,72 @@
+/* Code Group */
+.rf-codegroup {
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-md);
+	overflow: hidden;
+	margin: 1.5rem 0;
+	background: var(--rf-color-code-bg);
+	color: var(--rf-color-code-text);
+	box-shadow: var(--rf-shadow-md);
+}
+.rf-codegroup__topbar {
+	display: flex;
+	align-items: center;
+	gap: 0.375rem;
+	padding: 0.75rem 1rem;
+	background: rgba(255, 255, 255, 0.03);
+	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+}
+.rf-codegroup__dot {
+	width: 10px;
+	height: 10px;
+	border-radius: var(--rf-radius-full);
+	opacity: 0.8;
+}
+.rf-codegroup__dot:nth-child(1) { background: #ef4444; }
+.rf-codegroup__dot:nth-child(2) { background: #f59e0b; }
+.rf-codegroup__dot:nth-child(3) { background: #22c55e; }
+.rf-codegroup__title {
+	margin-left: 0.5rem;
+	font-family: var(--rf-font-mono);
+	font-size: 0.8rem;
+	opacity: 0.7;
+}
+.rf-codegroup__tabs {
+	display: flex;
+	background: rgba(255, 255, 255, 0.03);
+	border-bottom: 1px solid rgba(255, 255, 255, 0.06);
+	overflow-x: auto;
+	overflow-y: hidden;
+}
+.rf-codegroup__tab {
+	flex: 0 0 auto;
+	padding: 0.5rem 1rem;
+	font-size: 0.8rem;
+	font-family: var(--rf-font-mono);
+	color: rgba(255, 255, 255, 0.5);
+	background: none;
+	border: none;
+	border-bottom: 2px solid transparent;
+	cursor: pointer;
+	transition: color 200ms ease, border-color 200ms ease;
+	white-space: nowrap;
+}
+.rf-codegroup__tab:hover {
+	color: rgba(255, 255, 255, 0.8);
+}
+.rf-codegroup__tab--active {
+	color: rgba(255, 255, 255, 0.95);
+	border-bottom-color: var(--rf-color-primary);
+}
+.rf-codegroup__content pre {
+	margin: 0;
+	padding: 1rem 1.25rem;
+	overflow-x: auto;
+	background: none;
+	border: none;
+	border-radius: 0;
+}
+.rf-codegroup__content code {
+	font-family: var(--rf-font-mono);
+	font-size: 0.85rem;
+}

package/styles/runes/compare.css

@@ -0,0 +1,41 @@
+/* Compare */
+.rf-compare {
+	margin: 1.5rem 0;
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-md);
+	overflow: hidden;
+}
+.rf-compare--side-by-side .rf-compare__panels {
+	display: grid;
+	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+}
+.rf-compare--stacked .rf-compare__panels {
+	display: flex;
+	flex-direction: column;
+}
+.rf-compare [data-panel] {
+	min-width: 0;
+	overflow: auto;
+}
+.rf-compare--side-by-side [data-panel] + [data-panel] {
+	border-left: 1px solid var(--rf-color-border);
+}
+.rf-compare--stacked [data-panel] + [data-panel] {
+	border-top: 1px solid var(--rf-color-border);
+}
+.rf-compare [data-label] {
+	display: block;
+	padding: 0.5rem 1rem;
+	font-size: 0.75rem;
+	font-weight: 600;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	color: var(--rf-color-muted);
+	background: var(--rf-color-surface);
+	border-bottom: 1px solid var(--rf-color-border);
+}
+.rf-compare pre {
+	margin: 0;
+	border: none;
+	border-radius: 0;
+}

package/styles/runes/comparison.css

@@ -0,0 +1,211 @@
+/* Comparison */
+.rf-comparison {
+	margin: 2rem 0;
+}
+.rf-comparison__grid {
+	display: contents;
+}
+.rf-comparison-column__body,
+.rf-comparison-row__body {
+	display: contents;
+}
+.rf-comparison__title {
+	text-align: center;
+	margin: 0 0 1.5rem;
+	font-size: 1.5rem;
+	font-weight: 700;
+	color: var(--rf-color-text);
+}
+.rf-comparison meta,
+.rf-comparison span[property] { display: none; }
+/* Table layout */
+.rf-comparison__table-wrapper {
+	overflow-x: auto;
+	-webkit-overflow-scrolling: touch;
+	margin: 0 -1rem;
+	padding: 0 1rem;
+}
+.rf-comparison__table {
+	width: 100%;
+	border-collapse: collapse;
+	font-size: 0.9375rem;
+}
+.rf-comparison__table thead {
+	position: sticky;
+	top: 0;
+	z-index: 1;
+}
+.rf-comparison__table th,
+.rf-comparison__table td {
+	padding: 0.75rem 1rem;
+	text-align: left;
+	border-bottom: 1px solid var(--rf-color-border);
+}
+.rf-comparison__table thead th {
+	background: var(--rf-color-bg);
+	font-weight: 700;
+	font-size: 1rem;
+	color: var(--rf-color-text);
+	border-bottom: 2px solid var(--rf-color-border);
+	vertical-align: bottom;
+}
+.rf-comparison__col-header--highlighted {
+	background: color-mix(in srgb, var(--rf-color-primary) 5%, var(--rf-color-bg));
+	border-bottom-color: var(--rf-color-primary);
+}
+.rf-comparison__recommended-badge {
+	display: block;
+	font-size: 0.6875rem;
+	font-weight: 600;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	color: var(--rf-color-primary);
+	margin-top: 0.25rem;
+}
+.rf-comparison__label-col {
+	width: 1%;
+	white-space: nowrap;
+}
+.rf-comparison__row-label {
+	font-weight: 600;
+	color: var(--rf-color-text);
+	white-space: nowrap;
+	background: var(--rf-color-bg);
+}
+.rf-comparison__cell {
+	color: var(--rf-color-muted);
+	vertical-align: middle;
+}
+.rf-comparison__cell--highlighted {
+	background: color-mix(in srgb, var(--rf-color-primary) 3%, transparent);
+}
+.rf-comparison__cell p { margin: 0; font-size: 0.875rem; }
+.rf-comparison__cell strong { display: none; }
+.rf-comparison__cell em {
+	font-style: italic;
+	color: var(--rf-color-muted);
+}
+.rf-comparison__cell--empty {
+	color: var(--rf-color-muted);
+}
+/* Row icons */
+.rf-comparison__row-icon {
+	font-weight: 700;
+	font-size: 1.125rem;
+}
+.rf-comparison__row-icon--check {
+	color: var(--rf-color-success);
+}
+.rf-comparison__row-icon--cross {
+	color: var(--rf-color-danger);
+}
+/* Negative content */
+.rf-comparison__negative {
+	color: var(--rf-color-danger);
+	opacity: 0.85;
+}
+.rf-comparison__negative del,
+.rf-comparison__negative s {
+	text-decoration: line-through;
+}
+/* Callout badge */
+.rf-comparison__callout-badge {
+	display: inline-block;
+	background: color-mix(in srgb, var(--rf-color-primary) 10%, transparent);
+	color: var(--rf-color-primary);
+	font-size: 0.75rem;
+	font-weight: 600;
+	padding: 0.125rem 0.5rem;
+	border-radius: 999px;
+}
+.rf-comparison__callout-badge p { margin: 0; font-size: inherit; }
+/* Cards layout */
+.rf-comparison__cards {
+	display: grid;
+	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+	gap: 1.5rem;
+	align-items: start;
+}
+.rf-comparison-card {
+	border: 1px solid var(--rf-color-border);
+	border-radius: var(--rf-radius-md);
+	padding: 1.5rem;
+	background: var(--rf-color-bg);
+	position: relative;
+	transition: box-shadow 200ms ease, transform 200ms ease;
+}
+.rf-comparison-card:hover {
+	box-shadow: var(--rf-shadow-md);
+}
+.rf-comparison-card--highlighted {
+	border-color: var(--rf-color-primary);
+	box-shadow: var(--rf-shadow-lg);
+	transform: scale(1.02);
+}
+.rf-comparison-card__badge {
+	position: absolute;
+	top: -0.625rem;
+	left: 50%;
+	transform: translateX(-50%);
+	background: var(--rf-color-primary);
+	color: white;
+	font-size: 0.6875rem;
+	font-weight: 700;
+	text-transform: uppercase;
+	letter-spacing: 0.05em;
+	padding: 0.125rem 0.75rem;
+	border-radius: 999px;
+	white-space: nowrap;
+}
+.rf-comparison-card__name {
+	margin: 0 0 1rem;
+	font-size: 1.125rem;
+	font-weight: 700;
+	color: var(--rf-color-text);
+}
+.rf-comparison-card__rows {
+	list-style: none;
+	padding: 0;
+	margin: 0;
+}
+.rf-comparison-card__row {
+	padding: 0.5rem 0;
+	font-size: 0.875rem;
+	color: var(--rf-color-muted);
+	border-bottom: 1px solid var(--rf-color-border);
+	display: flex;
+	align-items: baseline;
+	gap: 0.5rem;
+}
+.rf-comparison-card__row:last-child { border-bottom: none; }
+.rf-comparison-card__row strong { color: var(--rf-color-text); white-space: nowrap; }
+.rf-comparison-card__row p { margin: 0; display: inline; }
+.rf-comparison-card__row--negative { opacity: 0.7; }
+.rf-comparison-card__row--callout {
+	border-bottom: none;
+	padding: 0.75rem 0 0.25rem;
+}
+/* Verdict */
+.rf-comparison__verdict {
+	text-align: center;
+	font-size: 0.9375rem;
+	color: var(--rf-color-muted);
+	font-style: italic;
+	margin: 1.5rem auto 0;
+	max-width: 48rem;
+}
+/* Fallback column/row */
+.rf-comparison-column { margin-bottom: 1rem; }
+.rf-comparison-column--highlighted {
+	border-left: 3px solid var(--rf-color-primary);
+	padding-left: 1rem;
+}
+.rf-comparison-row { padding: 0.25rem 0; }
+/* Responsive */
+@media (max-width: 640px) {
+	.rf-comparison__cards { grid-template-columns: 1fr; }
+	.rf-comparison-card--highlighted { transform: none; }
+	.rf-comparison__table { font-size: 0.8125rem; }
+	.rf-comparison__table th,
+	.rf-comparison__table td { padding: 0.5rem 0.625rem; }
+}

package/styles/runes/conversation.css

@@ -0,0 +1,54 @@
+/* Conversation */
+.rf-conversation {
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
+	margin: 1.5rem 0;
+	max-width: 40rem;
+}
+.rf-conversation__messages {
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
+}
+.rf-conversation-message {
+	display: flex;
+	flex-direction: column;
+	max-width: 80%;
+}
+.rf-conversation-message--left {
+	align-self: flex-start;
+	align-items: flex-start;
+}
+.rf-conversation-message--right {
+	align-self: flex-end;
+	align-items: flex-end;
+}
+.rf-conversation-message__speaker {
+	font-size: 0.75rem;
+	font-weight: 600;
+	color: var(--rf-color-muted);
+	margin-bottom: 0.25rem;
+	padding: 0 0.75rem;
+}
+.rf-conversation-message__body {
+	padding: 0.75rem 1rem;
+	border-radius: 1rem;
+	font-size: 0.9375rem;
+	line-height: 1.5;
+}
+.rf-conversation-message--left .rf-conversation-message__body {
+	background: var(--rf-color-surface);
+	border-bottom-left-radius: 0.25rem;
+}
+.rf-conversation-message--right .rf-conversation-message__body {
+	background: var(--rf-color-primary);
+	color: white;
+	border-bottom-right-radius: 0.25rem;
+}
+.rf-conversation-message__body p { margin: 0; }
+.rf-conversation-message__body p + p { margin-top: 0.5rem; }
+.rf-conversation-message__body span[property],
+.rf-conversation-message__body meta { display: none; }
+.rf-conversation-message span[property="speaker"],
+.rf-conversation-message meta[property] { display: none; }