1 files changed, 91 insertions, 0 deletions
diff --git a/css/starsector-dark.frame-font.css b/css/starsector-dark.frame-font.css
new file mode 100644
index 0000000..9fc5968
--- /dev/null
+++ b/css/starsector-dark.frame-font.css
@@ -0,0 +1,91 @@
+/*
+  Conservative Starsector baseline for cross-project reuse.
+  Scope: frame primitives + typography only.
+*/
+
+@font-face {
+  font-family: "Remnant UI";
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url("../assets/fonts/oxanium-400.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Remnant UI";
+  font-style: normal;
+  font-weight: 600;
+  font-display: swap;
+  src: url("../assets/fonts/oxanium-600.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: "Remnant Mono";
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url("../assets/fonts/share-tech-mono-400.woff2") format("woff2");
+}
+
+:root {
+  --swarm-font-ui: "Remnant UI", system-ui, -apple-system, "Segoe UI", sans-serif;
+  --swarm-font-mono: "Remnant Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
+
+  --swarm-frame-radius: 0px;
+  --swarm-frame-stroke: 1px;
+
+  --swarm-frame-page-bg: #04080d;
+  --swarm-frame-bg: rgba(6, 10, 16, 0.64);
+  --swarm-frame-bg-elevated: #0f2430;
+
+  --swarm-frame-edge: rgba(0, 104, 128, 0.62);
+  --swarm-frame-edge-strong: rgba(68, 152, 176, 0.86);
+  --swarm-frame-edge-inset: rgba(0, 0, 0, 0.86);
+
+  --swarm-frame-glow-soft: 0 0 18px rgba(28, 152, 252, 0.16);
+  --swarm-frame-glow-strong: 0 0 30px rgba(28, 152, 252, 0.24);
+
+  --swarm-frame-shadow: 0 0 0 1px var(--swarm-frame-edge-inset) inset;
+  --swarm-frame-shadow-elevated: var(--swarm-frame-shadow), var(--swarm-frame-glow-soft);
+}
+
+html,
+body {
+  background: var(--swarm-frame-page-bg);
+  font-family: var(--swarm-font-ui);
+}
+
+.swarm-font-ui {
+  font-family: var(--swarm-font-ui);
+}
+
+.swarm-font-mono,
+code,
+pre,
+kbd,
+samp,
+tt {
+  font-family: var(--swarm-font-mono);
+}
+
+.swarm-frame,
+.swarm-surface {
+  border-radius: var(--swarm-frame-radius);
+  border: var(--swarm-frame-stroke) solid var(--swarm-frame-edge);
+  background: var(--swarm-frame-bg);
+  box-shadow: var(--swarm-frame-shadow);
+}
+
+.swarm-surface-elevated {
+  border-radius: var(--swarm-frame-radius);
+  border: var(--swarm-frame-stroke) solid var(--swarm-frame-edge-strong);
+  background: var(--swarm-frame-bg-elevated);
+  box-shadow: var(--swarm-frame-shadow-elevated);
+}
+
+.swarm-frame-header {
+  border-radius: var(--swarm-frame-radius);
+  border: var(--swarm-frame-stroke) solid var(--swarm-frame-edge);
+  background: linear-gradient(180deg, rgba(0, 104, 128, 0.12), rgba(0, 104, 128, 0.02));
+  box-shadow: var(--swarm-frame-shadow-elevated);
+}