-
+
{isAdmin ? (
-
+
{displayTitle}
diff --git a/frontend/src/styles/global.css b/frontend/src/styles/global.css
index 90736b4..383d06a 100644
--- a/frontend/src/styles/global.css
+++ b/frontend/src/styles/global.css
@@ -330,8 +330,9 @@ code, pre, kbd, samp {
font-style: italic;
color: var(--text);
margin: 0 0 1.25rem;
- line-height: 1.05;
+ line-height: 1.15;
letter-spacing: -0.02em;
+ padding-bottom: 0.06em;
}
.prose h2 {
font-family: var(--font-display);
@@ -741,13 +742,18 @@ code, pre, kbd, samp {
font-style: italic;
font-weight: 500;
font-size: 1.18rem;
- line-height: 1.18;
+ line-height: 1.3;
color: var(--text);
letter-spacing: -0.005em;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
+ /* line-clamp's overflow:hidden clips italic-Fraunces descenders (g, y, p).
+ * Pad the clip box and pull the layout back with a matching negative
+ * margin so descenders survive without shifting siblings. */
+ padding-bottom: 0.16em;
+ margin-bottom: -0.16em;
transition: color 0.25s ease;
}
.plate:hover .plate-caption-title {
@@ -757,12 +763,14 @@ code, pre, kbd, samp {
font-family: var(--font-sans);
font-style: italic;
font-size: 0.82rem;
- line-height: 1.4;
+ line-height: 1.45;
color: var(--subtext0);
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
+ padding-bottom: 0.14em;
+ margin-bottom: -0.14em;
}
.plate .plate-caption-meta {
font-family: var(--font-sans);
@@ -823,7 +831,7 @@ code, pre, kbd, samp {
font-size: 1.6rem;
letter-spacing: -0.01em;
color: var(--text);
- line-height: 1;
+ line-height: 1.12;
}
.nameplate-subtitle {
font-family: var(--font-sans);
@@ -1116,9 +1124,6 @@ select.topbar-control.theme-select {
* phones. Written unlayered (not Tailwind utilities) so it reliably wins
* over the `.topbar-control` base in the Tailwind v4 cascade. */
.topbar-control .tc-label { display: inline; }
-@media (max-width: 1023px) {
- .topbar-control .tc-kbd { display: none; }
-}
@media (max-width: 767px) {
.topbar-control.tc-collapse-md { width: 2rem; padding: 0; }
.topbar-control.tc-collapse-md .tc-label { display: none; }
@@ -1368,18 +1373,32 @@ input[type="date"] { color-scheme: light; }
}
.breakcore .section-rule::before,
.breakcore .section-rule::after {
- height: 6px;
- opacity: 0.55;
- background: repeating-linear-gradient(
- 45deg,
- var(--yellow) 0 8px,
- var(--crust) 8px 16px
+ height: 1px;
+ opacity: 0.85;
+ background: linear-gradient(
+ to right,
+ transparent,
+ color-mix(in srgb, var(--mauve) 70%, transparent) 45%,
+ color-mix(in srgb, var(--teal) 70%, transparent) 55%,
+ transparent
);
}
.breakcore .section-rule .ornament {
color: var(--mauve);
}
+/* Readability — `--overlay0` (#5A2D8E) is near-invisible on the breakcore
+ * ground. Lift the spots that use it as actual copy to the readable
+ * subtext ramp. */
+.breakcore .prose h6,
+.breakcore .prose del,
+.breakcore .hljs-comment,
+.breakcore .hljs-quote,
+.breakcore .site-copyright,
+.breakcore .slug-hint {
+ color: var(--subtext0);
+}
+
/* Chips — neon outline, monospace caps. */
.breakcore .chip {
background: transparent;
@@ -1518,22 +1537,17 @@ input[type="date"] { color-scheme: light; }
margin-top: 1.5rem;
}
-/* Breakcore: hard edges + hazard cap + chromatic title. */
+/* Breakcore: hard edges + neon cap + chromatic title. */
.breakcore .cdialog-panel {
border-radius: 0;
- padding-top: 1.9rem;
+ padding-top: 1.85rem;
}
.breakcore .cdialog-panel::before {
content: "";
position: absolute;
inset: 0 0 auto 0;
- height: 5px;
- background: repeating-linear-gradient(
- 45deg,
- var(--yellow) 0 8px,
- var(--crust) 8px 16px
- );
- opacity: 0.6;
+ height: 2px;
+ background: linear-gradient(90deg, var(--mauve), var(--teal));
}
.breakcore .cdialog-title {
text-shadow: -1px 0 0 var(--teal), 1px 0 0 var(--mauve);