frontend/src/styles/partials/70-cybersigil.css

@@ -794,24 +794,61 @@ html.cybersigil body::after {
   color: var(--mauve);
   font-weight: 700;
 }
+/* Section break — corrupted-terminal sigil rule. A thin ice→magenta scan
+ * that tears open at center for a glowing barb-sigil glyph, doubled by the
+ * hard cold offset echo the buttons/plates carry. */
 .cybersigil .prose hr {
-  height: 3px;
+  height: 1px;
-  opacity: 0.9;
+  margin: 3.75rem auto;
-  background: repeating-linear-gradient(
+  opacity: 1;
+  overflow: visible;
+  background: linear-gradient(
     90deg,
-    var(--sky) 0 12px,
+    transparent 0,
-    var(--mauve) 12px 24px
+    color-mix(in srgb, var(--sky) 12%, transparent) 5%,
+    color-mix(in srgb, var(--sky) 72%, transparent) 24%,
+    color-mix(in srgb, var(--sky) 72%, transparent) 42%,
+    transparent 46%,
+    transparent 54%,
+    color-mix(in srgb, var(--mauve) 72%, transparent) 58%,
+    color-mix(in srgb, var(--mauve) 72%, transparent) 76%,
+    color-mix(in srgb, var(--mauve) 12%, transparent) 95%,
+    transparent 100%
   );
-  box-shadow: 0 0 12px color-mix(in srgb, var(--sky) 42%, transparent);
+  box-shadow: 0 0 16px -3px color-mix(in srgb, var(--sky) 32%, transparent);
 }
+/* Hard cold offset echo — the signature drop the rest of the theme carries. */
+.cybersigil .prose hr::after {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: calc(50% + 3px);
+  height: 1px;
+  background: inherit;
+  opacity: 0.3;
+  transform: none;
+}
+/* Center glyph — the barb sigil, glowing, seated over the gap. Overrides
+ * the base rotated-diamond pip entirely. */
 .cybersigil .prose hr::before {
+  width: 3.4em;
+  height: 1.5em;
+  transform: translate(-50%, -50%);
   background: var(--sky);
-  box-shadow: 0 0 8px var(--sky);
+  border-radius: 0;
+  -webkit-mask: var(--cs-barb) center / contain no-repeat;
+  mask: var(--cs-barb) center / contain no-repeat;
+  filter:
+    drop-shadow(0 0 5px color-mix(in srgb, var(--sky) 55%, transparent))
+    drop-shadow(0 0 2px color-mix(in srgb, var(--mauve) 50%, transparent));
 }
 .cybersigil .prose h3,
 .cybersigil .prose h4,
-.cybersigil .prose h5 {
+.cybersigil .prose h5,
+.cybersigil .prose h6 {
   font-family: var(--font-sans);
+  font-style: normal;
   text-transform: uppercase;
   letter-spacing: 0.06em;
 }
@@ -821,6 +858,7 @@ html.cybersigil body::after {
 .cybersigil .prose h4::before { content: "### "; color: var(--sky); opacity: 0.6; }
 .cybersigil .prose h5 { color: var(--green); }
 .cybersigil .prose h5::before { content: "#### "; color: var(--sky); opacity: 0.55; }
+.cybersigil .prose h6::before { content: "##### "; color: var(--sky); opacity: 0.5; }
 .cybersigil .prose a {
   text-decoration-style: dotted;
   text-decoration-color: color-mix(in srgb, var(--sky) 60%, transparent);
@@ -831,6 +869,82 @@ html.cybersigil body::after {
   text-shadow: -1px 0 0 var(--sky), 1px 0 0 var(--mauve);
 }
 
+/* Emphasis — VT323 has no real italic, so the base font-display em renders
+ * as mangled bitmap. Drop to the terminal body and re-encode emphasis as
+ * colour: magenta em, ice strong with a faint bloom, red-struck del. */
+.cybersigil .prose em {
+  font-family: var(--font-sans);
+  font-style: normal;
+  color: var(--mauve);
+}
+.cybersigil .prose strong {
+  color: var(--sky);
+  text-shadow: 0 0 6px color-mix(in srgb, var(--sky) 30%, transparent);
+}
+.cybersigil .prose del {
+  text-decoration-color: color-mix(in srgb, var(--red) 80%, transparent);
+}
+
+/* Lists — terminal nodes. The salon diamond becomes a square ice cell with
+ * the hard magenta offset; ordered markers go cold mono, no faux-italic. */
+.cybersigil .prose ul > li::before {
+  width: 0.4em;
+  height: 0.4em;
+  top: 0.66em;
+  transform: none;
+  background: var(--sky);
+  box-shadow: 2px 2px 0 0 color-mix(in srgb, var(--mauve) 70%, transparent);
+}
+.cybersigil .prose ol > li::marker {
+  color: var(--sky);
+  font-family: var(--font-sans);
+  font-style: normal;
+}
+.cybersigil .prose li > input[type="checkbox"] { accent-color: var(--mauve); }
+
+/* Figure caption — a `// ` log comment, not a salon plaque dash. */
+.cybersigil .prose figure figcaption {
+  font-family: var(--font-sans);
+  font-style: normal;
+  letter-spacing: 0.04em;
+  color: var(--subtext0);
+}
+.cybersigil .prose figure figcaption::before {
+  content: "// ";
+  color: var(--sky);
+  opacity: 0.85;
+}
+
+/* Tables — a sector readout: square ice grid, scanline header, hard offset,
+ * magenta hover sweep. */
+.cybersigil .prose table {
+  font-family: var(--font-sans);
+  border-color: color-mix(in srgb, var(--sky) 40%, var(--surface2));
+  box-shadow:
+    0 0 0 1px color-mix(in srgb, var(--sky) 14%, transparent),
+    4px 4px 0 0 color-mix(in srgb, var(--mauve) 22%, var(--crust));
+}
+.cybersigil .prose thead {
+  background:
+    repeating-linear-gradient(
+      0deg,
+      rgba(0, 0, 0, 0) 0 2px,
+      color-mix(in srgb, var(--sky) 8%, transparent) 2px 3px,
+      rgba(0, 0, 0, 0) 3px 4px
+    ),
+    color-mix(in srgb, var(--crust) 80%, transparent);
+}
+.cybersigil .prose th {
+  color: var(--sky);
+  border-bottom-color: color-mix(in srgb, var(--mauve) 50%, transparent);
+}
+.cybersigil .prose td {
+  border-bottom-color: color-mix(in srgb, var(--sky) 20%, transparent);
+}
+.cybersigil .prose tbody tr:hover {
+  background: color-mix(in srgb, var(--sky) 7%, transparent);
+}
+
 /* Scrollbar + caret — hard cold chrome. */
 .cybersigil {
   scrollbar-color: var(--sky) var(--crust);