increase font sizes across all templates for readability

This commit is contained in:
2026-04-15 07:59:17 +02:00
parent 1f0939e27c
commit 7b884f50e8
32 changed files with 652 additions and 652 deletions

View File

@@ -28,7 +28,7 @@
} }
html { html {
font-size: 17px; font-size: 26px;
} }
body { body {
@@ -59,7 +59,7 @@
} }
.journal-name { .journal-name {
font-size: 11px; font-size: 16px;
letter-spacing: 0.25em; letter-spacing: 0.25em;
text-transform: uppercase; text-transform: uppercase;
color: var(--text-lighter); color: var(--text-lighter);
@@ -68,7 +68,7 @@
} }
.doc-title { .doc-title {
font-size: 1.9rem; font-size: 2.56rem;
font-weight: 500; font-weight: 500;
line-height: 1.2; line-height: 1.2;
color: var(--text); color: var(--text);
@@ -77,7 +77,7 @@
} }
.author-line { .author-line {
font-size: 1.05rem; font-size: 1.42rem;
color: var(--text-light); color: var(--text-light);
margin-bottom: 6px; margin-bottom: 6px;
font-style: italic; font-style: italic;
@@ -95,7 +95,7 @@
gap: 0; gap: 0;
margin-top: 24px; margin-top: 24px;
border: 1px solid var(--rule); border: 1px solid var(--rule);
font-size: 0.82rem; font-size: 1.11rem;
} }
.meta-cell { .meta-cell {
@@ -112,7 +112,7 @@
} }
.meta-label { .meta-label {
font-size: 0.7rem; font-size: 0.94rem;
letter-spacing: 0.12em; letter-spacing: 0.12em;
text-transform: uppercase; text-transform: uppercase;
color: var(--text-lighter); color: var(--text-lighter);
@@ -126,7 +126,7 @@
/* Tags / keywords */ /* Tags / keywords */
.keywords { .keywords {
margin-top: 20px; margin-top: 20px;
font-size: 0.85rem; font-size: 1.15rem;
color: var(--text-light); color: var(--text-light);
} }
@@ -141,13 +141,13 @@
padding: 20px 24px; padding: 20px 24px;
background: var(--paper-dark); background: var(--paper-dark);
border-left: 3px solid var(--accent); border-left: 3px solid var(--accent);
font-size: 0.95rem; font-size: 1.28rem;
line-height: 1.7; line-height: 1.7;
color: var(--text-light); color: var(--text-light);
} }
.abstract-label { .abstract-label {
font-size: 0.72rem; font-size: 0.97rem;
letter-spacing: 0.18em; letter-spacing: 0.18em;
text-transform: uppercase; text-transform: uppercase;
color: var(--text-lighter); color: var(--text-lighter);
@@ -158,13 +158,13 @@
/* Content — CSS counters for section numbering */ /* Content — CSS counters for section numbering */
.doc-body { .doc-body {
counter-reset: h2-counter; counter-reset: h2-counter;
font-size: 1rem; font-size: 1.35rem;
} }
.doc-body h1 { .doc-body h1 {
counter-reset: h3-counter; counter-reset: h3-counter;
counter-increment: h2-counter; counter-increment: h2-counter;
font-size: 1.25rem; font-size: 1.69rem;
font-weight: 500; font-weight: 500;
margin-top: 40px; margin-top: 40px;
margin-bottom: 14px; margin-bottom: 14px;
@@ -180,7 +180,7 @@
.doc-body h2 { .doc-body h2 {
counter-increment: h3-counter; counter-increment: h3-counter;
font-size: 1.1rem; font-size: 1.49rem;
font-weight: 500; font-weight: 500;
font-style: italic; font-style: italic;
margin-top: 28px; margin-top: 28px;
@@ -195,7 +195,7 @@
} }
.doc-body h3 { .doc-body h3 {
font-size: 1rem; font-size: 1.35rem;
font-weight: 600; font-weight: 600;
margin-top: 20px; margin-top: 20px;
margin-bottom: 8px; margin-bottom: 8px;
@@ -230,7 +230,7 @@
.doc-body code { .doc-body code {
font-family: "Source Code Pro", monospace; font-family: "Source Code Pro", monospace;
font-size: 0.85em; font-size: 1.15em;
background: var(--paper-dark); background: var(--paper-dark);
padding: 0 4px; padding: 0 4px;
border: 1px solid var(--rule); border: 1px solid var(--rule);
@@ -243,7 +243,7 @@
margin: 20px 0; margin: 20px 0;
overflow-x: auto; overflow-x: auto;
font-family: "Source Code Pro", monospace; font-family: "Source Code Pro", monospace;
font-size: 0.83em; font-size: 1.12em;
line-height: 1.6; line-height: 1.6;
} }
@@ -274,12 +274,12 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 20px 0; margin: 20px 0;
font-size: 0.9rem; font-size: 1.22rem;
} }
.doc-body caption { .doc-body caption {
caption-side: top; caption-side: top;
font-size: 0.8rem; font-size: 1.08rem;
color: var(--text-lighter); color: var(--text-lighter);
text-align: left; text-align: left;
padding-bottom: 6px; padding-bottom: 6px;
@@ -292,7 +292,7 @@
padding: 6px 10px; padding: 6px 10px;
text-align: left; text-align: left;
font-weight: 500; font-weight: 500;
font-size: 0.85rem; font-size: 1.15rem;
} }
.doc-body td { .doc-body td {
@@ -321,7 +321,7 @@
margin-top: 48px; margin-top: 48px;
padding-top: 16px; padding-top: 16px;
border-top: 2px solid var(--text); border-top: 2px solid var(--text);
font-size: 0.8rem; font-size: 1.08rem;
color: var(--text-lighter); color: var(--text-lighter);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -352,7 +352,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<article class="paper"> <article class="paper">
<header class="doc-header"> <header class="doc-header">

View File

@@ -32,7 +32,7 @@
background: var(--bg); background: var(--bg);
color: var(--text); color: var(--text);
font-family: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, sans-serif; font-family: "Inter", -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, sans-serif;
font-size: 15px; font-size: 22px;
line-height: 1.55; line-height: 1.55;
min-height: 100vh; min-height: 100vh;
} }
@@ -65,20 +65,20 @@
} }
.sidebar-logo-name { .sidebar-logo-name {
font-size: 13px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: var(--text); color: var(--text);
letter-spacing: -0.01em; letter-spacing: -0.01em;
} }
.sidebar-logo-sub { .sidebar-logo-sub {
font-size: 11px; font-size: 16px;
color: var(--tertiary); color: var(--tertiary);
margin-top: 2px; margin-top: 2px;
} }
.sidebar-section-label { .sidebar-section-label {
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
@@ -89,7 +89,7 @@
.sidebar-item { .sidebar-item {
display: block; display: block;
padding: 7px 20px; padding: 7px 20px;
font-size: 14px; font-size: 21px;
font-weight: 400; font-weight: 400;
color: var(--secondary); color: var(--secondary);
text-decoration: none; text-decoration: none;
@@ -115,7 +115,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 6px; gap: 6px;
font-size: 12px; font-size: 18px;
color: var(--tertiary); color: var(--tertiary);
margin-bottom: 24px; margin-bottom: 24px;
} }
@@ -135,7 +135,7 @@
} }
.page-title { .page-title {
font-size: 34px; font-size: 51px;
font-weight: 700; font-weight: 700;
letter-spacing: -0.02em; letter-spacing: -0.02em;
color: var(--text); color: var(--text);
@@ -154,7 +154,7 @@
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-size: 12px; font-size: 18px;
font-weight: 500; font-weight: 500;
color: var(--blue); color: var(--blue);
background: var(--blue-light); background: var(--blue-light);
@@ -163,7 +163,7 @@
} }
.meta-plain { .meta-plain {
font-size: 12px; font-size: 18px;
color: var(--tertiary); color: var(--tertiary);
} }
@@ -178,7 +178,7 @@
/* Content styles */ /* Content styles */
.content-area h1 { .content-area h1 {
font-size: 26px; font-size: 39px;
font-weight: 700; font-weight: 700;
letter-spacing: -0.02em; letter-spacing: -0.02em;
color: var(--text); color: var(--text);
@@ -188,7 +188,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 20px; font-size: 30px;
font-weight: 600; font-weight: 600;
letter-spacing: -0.01em; letter-spacing: -0.01em;
color: var(--text); color: var(--text);
@@ -197,7 +197,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 16px; font-size: 24px;
font-weight: 600; font-weight: 600;
color: var(--text); color: var(--text);
margin-top: 20px; margin-top: 20px;
@@ -205,7 +205,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 14px; font-size: 21px;
font-weight: 600; font-weight: 600;
color: var(--secondary); color: var(--secondary);
margin-top: 16px; margin-top: 16px;
@@ -229,7 +229,7 @@
.content-area code { .content-area code {
font-family: "SF Mono", "Menlo", "Monaco", monospace; font-family: "SF Mono", "Menlo", "Monaco", monospace;
font-size: 12.5px; font-size: 19px;
background: var(--bg); background: var(--bg);
color: #c0392b; color: #c0392b;
padding: 2px 6px; padding: 2px 6px;
@@ -248,7 +248,7 @@
background: none; background: none;
color: #e5e5ea; color: #e5e5ea;
padding: 0; padding: 0;
font-size: 13px; font-size: 20px;
} }
.content-area blockquote { .content-area blockquote {
@@ -284,7 +284,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 16px 0; margin: 16px 0;
font-size: 14px; font-size: 21px;
border-radius: 10px; border-radius: 10px;
overflow: hidden; overflow: hidden;
} }
@@ -293,7 +293,7 @@
background: var(--bg); background: var(--bg);
padding: 10px 14px; padding: 10px 14px;
text-align: left; text-align: left;
font-size: 12px; font-size: 18px;
font-weight: 600; font-weight: 600;
color: var(--tertiary); color: var(--tertiary);
text-transform: uppercase; text-transform: uppercase;
@@ -331,7 +331,7 @@
} }
.tags-label { .tags-label {
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
@@ -339,7 +339,7 @@
} }
.tag { .tag {
font-size: 12px; font-size: 18px;
font-weight: 500; font-weight: 500;
color: var(--blue); color: var(--blue);
background: var(--blue-light); background: var(--blue-light);
@@ -350,12 +350,12 @@
@media (max-width: 700px) { @media (max-width: 700px) {
.sidebar { display: none; } .sidebar { display: none; }
.main { padding: 20px 16px 40px; } .main { padding: 20px 16px 40px; }
.page-title { font-size: 26px; } .page-title { font-size: 39px; }
} }
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="layout"> <div class="layout">

View File

@@ -20,7 +20,7 @@
background: #000000; background: #000000;
color: #aaaaaa; color: #aaaaaa;
font-family: "Share Tech Mono", "VT323", "Courier New", monospace; font-family: "Share Tech Mono", "VT323", "Courier New", monospace;
font-size: 14px; font-size: 21px;
line-height: 1.45; line-height: 1.45;
min-height: 100vh; min-height: 100vh;
overflow-x: hidden; overflow-x: hidden;
@@ -44,12 +44,12 @@
.bios-header-title { .bios-header-title {
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 18px; font-size: 27px;
letter-spacing: 0.05em; letter-spacing: 0.05em;
} }
.bios-header-version { .bios-header-version {
font-size: 13px; font-size: 20px;
color: #ffff55; color: #ffff55;
} }
@@ -82,7 +82,7 @@
} }
.bios-memory-label { .bios-memory-label {
font-size: 12px; font-size: 18px;
color: #aaa; color: #aaa;
} }
@@ -109,7 +109,7 @@
display: flex; display: flex;
gap: 8px; gap: 8px;
margin-bottom: 2px; margin-bottom: 2px;
font-size: 13px; font-size: 20px;
} }
.boot-timestamp { .boot-timestamp {
@@ -135,7 +135,7 @@
/* Separator */ /* Separator */
.separator { .separator {
color: #333; color: #333;
font-size: 13px; font-size: 20px;
margin: 6px 0; margin: 6px 0;
letter-spacing: 0.02em; letter-spacing: 0.02em;
} }
@@ -152,11 +152,11 @@
.article-header-title { .article-header-title {
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 18px; font-size: 27px;
} }
.article-header-meta { .article-header-meta {
font-size: 12px; font-size: 18px;
color: #55ffff; color: #55ffff;
} }
@@ -164,7 +164,7 @@
background: #000080; background: #000080;
color: #ffff55; color: #ffff55;
padding: 4px 12px; padding: 4px 12px;
font-size: 12px; font-size: 18px;
display: flex; display: flex;
gap: 24px; gap: 24px;
flex-wrap: wrap; flex-wrap: wrap;
@@ -178,7 +178,7 @@
.content-area h1 { .content-area h1 {
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 22px; font-size: 33px;
color: #ffff55; color: #ffff55;
margin-top: 20px; margin-top: 20px;
margin-bottom: 8px; margin-bottom: 8px;
@@ -193,7 +193,7 @@
.content-area h2 { .content-area h2 {
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 18px; font-size: 27px;
color: #55ffff; color: #55ffff;
margin-top: 16px; margin-top: 16px;
margin-bottom: 6px; margin-bottom: 6px;
@@ -206,14 +206,14 @@
} }
.content-area h3 { .content-area h3 {
font-size: 14px; font-size: 21px;
color: #ff5555; color: #ff5555;
margin-top: 14px; margin-top: 14px;
margin-bottom: 5px; margin-bottom: 5px;
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 13px; font-size: 20px;
color: #aaaaaa; color: #aaaaaa;
margin-top: 10px; margin-top: 10px;
margin-bottom: 4px; margin-bottom: 4px;
@@ -310,7 +310,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 10px 0; margin: 10px 0;
font-size: 12px; font-size: 18px;
} }
.content-area th { .content-area th {
@@ -318,7 +318,7 @@
color: #fff; color: #fff;
padding: 5px 10px; padding: 5px 10px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
text-transform: uppercase; text-transform: uppercase;
} }
@@ -346,7 +346,7 @@
background: #001100; background: #001100;
border: 1px solid #333; border: 1px solid #333;
padding: 6px 12px; padding: 6px 12px;
font-size: 12px; font-size: 18px;
color: #55ff55; color: #55ff55;
margin-bottom: 8px; margin-bottom: 8px;
} }
@@ -358,7 +358,7 @@
padding: 5px 12px; padding: 5px 12px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-size: 12px; font-size: 18px;
flex-wrap: wrap; flex-wrap: wrap;
gap: 8px; gap: 8px;
} }
@@ -367,7 +367,7 @@
background: #aaa; background: #aaa;
color: #000; color: #000;
padding: 1px 5px; padding: 1px 5px;
font-size: 11px; font-size: 16px;
margin-right: 4px; margin-right: 4px;
} }
@@ -388,7 +388,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="screen"> <div class="screen">

View File

@@ -35,7 +35,7 @@
radial-gradient(ellipse at 70% 80%, rgba(60,30,10,0.5) 0%, transparent 60%); radial-gradient(ellipse at 70% 80%, rgba(60,30,10,0.5) 0%, transparent 60%);
color: var(--ink); color: var(--ink);
font-family: "Caveat", cursive; font-family: "Caveat", cursive;
font-size: 18px; font-size: 27px;
line-height: 1.65; line-height: 1.65;
min-height: 100vh; min-height: 100vh;
padding: 32px 16px 48px; padding: 32px 16px 48px;
@@ -73,7 +73,7 @@
position: absolute; position: absolute;
width: 40px; width: 40px;
height: 40px; height: 40px;
font-size: 28px; font-size: 42px;
color: var(--brown-light); color: var(--brown-light);
display: flex; display: flex;
align-items: center; align-items: center;
@@ -103,7 +103,7 @@
} }
.cafe-subtitle { .cafe-subtitle {
font-size: 15px; font-size: 22px;
color: var(--brown-mid); color: var(--brown-mid);
letter-spacing: 0.12em; letter-spacing: 0.12em;
font-family: "Special Elite", cursive; font-family: "Special Elite", cursive;
@@ -111,7 +111,7 @@
.ornamental-divider { .ornamental-divider {
text-align: center; text-align: center;
font-size: 20px; font-size: 30px;
color: var(--brown-light); color: var(--brown-light);
margin: 16px 0; margin: 16px 0;
letter-spacing: 0.2em; letter-spacing: 0.2em;
@@ -119,7 +119,7 @@
.ornamental-divider-sm { .ornamental-divider-sm {
text-align: center; text-align: center;
font-size: 16px; font-size: 24px;
color: var(--brown-light); color: var(--brown-light);
margin: 12px 0; margin: 12px 0;
letter-spacing: 0.15em; letter-spacing: 0.15em;
@@ -142,7 +142,7 @@
position: absolute; position: absolute;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
font-size: 24px; font-size: 36px;
color: var(--brown-light); color: var(--brown-light);
} }
@@ -163,7 +163,7 @@
justify-content: center; justify-content: center;
flex-wrap: wrap; flex-wrap: wrap;
gap: 16px 32px; gap: 16px 32px;
font-size: 15px; font-size: 22px;
color: var(--brown-mid); color: var(--brown-mid);
padding: 10px 0 16px; padding: 10px 0 16px;
font-family: "Special Elite", cursive; font-family: "Special Elite", cursive;
@@ -183,7 +183,7 @@
} }
.tag { .tag {
font-size: 14px; font-size: 21px;
color: var(--brown); color: var(--brown);
padding: 2px 12px; padding: 2px 12px;
border: 1px solid var(--brown-light); border: 1px solid var(--brown-light);
@@ -199,7 +199,7 @@
.content-area h1 { .content-area h1 {
font-family: "Shadows Into Light", cursive; font-family: "Shadows Into Light", cursive;
font-size: 32px; font-size: 48px;
color: var(--brown-dark); color: var(--brown-dark);
margin-top: 32px; margin-top: 32px;
margin-bottom: 12px; margin-bottom: 12px;
@@ -209,7 +209,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 26px; font-size: 39px;
color: var(--brown); color: var(--brown);
margin-top: 28px; margin-top: 28px;
margin-bottom: 10px; margin-bottom: 10px;
@@ -217,7 +217,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 22px; font-size: 33px;
color: var(--brown-mid); color: var(--brown-mid);
margin-top: 20px; margin-top: 20px;
margin-bottom: 8px; margin-bottom: 8px;
@@ -236,7 +236,7 @@
.content-area code { .content-area code {
font-family: "Special Elite", cursive; font-family: "Special Elite", cursive;
font-size: 16px; font-size: 24px;
background: var(--parchment); background: var(--parchment);
padding: 0 5px; padding: 0 5px;
border: 1px dashed var(--brown-light); border: 1px dashed var(--brown-light);
@@ -251,7 +251,7 @@
margin: 16px 0; margin: 16px 0;
overflow-x: auto; overflow-x: auto;
font-family: "Special Elite", cursive; font-family: "Special Elite", cursive;
font-size: 14px; font-size: 21px;
line-height: 1.7; line-height: 1.7;
} }
@@ -268,7 +268,7 @@
padding: 12px 8px; padding: 12px 8px;
margin: 18px 0; margin: 18px 0;
text-align: center; text-align: center;
font-size: 20px; font-size: 30px;
font-style: italic; font-style: italic;
color: var(--brown-mid); color: var(--brown-mid);
} }
@@ -307,7 +307,7 @@
padding: 7px 10px; padding: 7px 10px;
text-align: left; text-align: left;
color: var(--brown-dark); color: var(--brown-dark);
font-size: 16px; font-size: 24px;
} }
.content-area td { .content-area td {
@@ -327,7 +327,7 @@
text-align: center; text-align: center;
margin: 24px 0; margin: 24px 0;
color: var(--brown-light); color: var(--brown-light);
font-size: 20px; font-size: 30px;
letter-spacing: 0.3em; letter-spacing: 0.3em;
} }
@@ -342,7 +342,7 @@
border-top: 1px solid var(--brown-light); border-top: 1px solid var(--brown-light);
text-align: center; text-align: center;
font-family: "Special Elite", cursive; font-family: "Special Elite", cursive;
font-size: 13px; font-size: 20px;
color: var(--brown-mid); color: var(--brown-mid);
letter-spacing: 0.08em; letter-spacing: 0.08em;
line-height: 2; line-height: 2;
@@ -350,7 +350,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="menu-card"> <div class="menu-card">
<div class="corner-ornament tl">*</div> <div class="corner-ornament tl">*</div>

View File

@@ -33,7 +33,7 @@
background: var(--board-dark); background: var(--board-dark);
color: var(--chalk-white); color: var(--chalk-white);
font-family: "Caveat", cursive; font-family: "Caveat", cursive;
font-size: 20px; font-size: 30px;
line-height: 1.7; line-height: 1.7;
min-height: 100vh; min-height: 100vh;
position: relative; position: relative;
@@ -130,7 +130,7 @@
} }
.course-label { .course-label {
font-size: 15px; font-size: 22px;
color: var(--chalk-dim); color: var(--chalk-dim);
letter-spacing: 0.15em; letter-spacing: 0.15em;
text-transform: uppercase; text-transform: uppercase;
@@ -154,7 +154,7 @@
justify-content: center; justify-content: center;
gap: 32px; gap: 32px;
margin-top: 16px; margin-top: 16px;
font-size: 16px; font-size: 24px;
color: var(--chalk-dim); color: var(--chalk-dim);
} }
@@ -184,7 +184,7 @@
.content-area h1 { .content-area h1 {
font-family: "Caveat Brush", cursive; font-family: "Caveat Brush", cursive;
font-size: 36px; font-size: 54px;
color: var(--chalk-yellow); color: var(--chalk-yellow);
text-shadow: 0 0 12px rgba(245,230,66,0.3), 1px 1px 2px rgba(0,0,0,0.5); text-shadow: 0 0 12px rgba(245,230,66,0.3), 1px 1px 2px rgba(0,0,0,0.5);
margin-top: 40px; margin-top: 40px;
@@ -195,7 +195,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 28px; font-size: 42px;
color: var(--chalk-blue); color: var(--chalk-blue);
text-shadow: 0 0 10px rgba(126,200,227,0.3), 1px 1px 2px rgba(0,0,0,0.5); text-shadow: 0 0 10px rgba(126,200,227,0.3), 1px 1px 2px rgba(0,0,0,0.5);
margin-top: 32px; margin-top: 32px;
@@ -203,7 +203,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 24px; font-size: 36px;
color: var(--chalk-pink); color: var(--chalk-pink);
text-shadow: 0 0 8px rgba(245,160,176,0.3); text-shadow: 0 0 8px rgba(245,160,176,0.3);
margin-top: 24px; margin-top: 24px;
@@ -224,7 +224,7 @@
.content-area code { .content-area code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 16px; font-size: 24px;
color: var(--chalk-orange); color: var(--chalk-orange);
background: rgba(245,176,66,0.08); background: rgba(245,176,66,0.08);
padding: 1px 6px; padding: 1px 6px;
@@ -240,7 +240,7 @@
margin: 20px 0; margin: 20px 0;
overflow-x: auto; overflow-x: auto;
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 15px; font-size: 22px;
line-height: 1.7; line-height: 1.7;
} }
@@ -302,7 +302,7 @@
padding: 8px 12px; padding: 8px 12px;
text-align: left; text-align: left;
color: var(--chalk-yellow); color: var(--chalk-yellow);
font-size: 18px; font-size: 27px;
} }
.content-area td { .content-area td {
@@ -327,7 +327,7 @@
/* KaTeX math — make it readable on dark board */ /* KaTeX math — make it readable on dark board */
.content-area .katex { .content-area .katex {
color: var(--chalk-white); color: var(--chalk-white);
font-size: 1.1em; font-size: 1.49em;
} }
.content-area .katex-display { .content-area .katex-display {
@@ -341,13 +341,13 @@
border-top: 1px solid var(--chalk-faint); border-top: 1px solid var(--chalk-faint);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-size: 16px; font-size: 24px;
color: var(--chalk-dim); color: var(--chalk-dim);
} }
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="eraser-marks"> <div class="eraser-marks">
<div class="eraser-mark" style="width:300px;height:200px;top:15%;left:5%;"></div> <div class="eraser-mark" style="width:300px;height:200px;top:15%;left:5%;"></div>

View File

@@ -94,7 +94,7 @@
{% if description %} {% if description %}
.hero p { .hero p {
font-size: 1.1rem; font-size: 1.49rem;
color: rgba(240, 236, 228, 0.7); color: rgba(240, 236, 228, 0.7);
margin-top: 1rem; margin-top: 1rem;
font-weight: 300; font-weight: 300;
@@ -110,7 +110,7 @@
color: #fbbf24; color: #fbbf24;
padding: 0.3em 0.8em; padding: 0.3em 0.8em;
border-radius: 4px; border-radius: 4px;
font-size: 0.8rem; font-size: 1.08rem;
margin-top: 1rem; margin-top: 1rem;
backdrop-filter: blur(8px); backdrop-filter: blur(8px);
} }
@@ -160,14 +160,14 @@
.post-title { .post-title {
font-family: 'Iosevka', monospace; font-family: 'Iosevka', monospace;
font-size: 1.2rem; font-size: 1.62rem;
font-weight: 500; font-weight: 500;
color: #ffffff; color: #ffffff;
line-height: 1.3; line-height: 1.3;
} }
.draft-tag { .draft-tag {
font-size: 0.65rem; font-size: 0.88rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
color: #fbbf24; color: #fbbf24;
@@ -180,7 +180,7 @@
} }
.post-date { .post-date {
font-size: 0.8rem; font-size: 1.08rem;
color: rgba(240, 236, 228, 0.4); color: rgba(240, 236, 228, 0.4);
margin-top: 0.3rem; margin-top: 0.3rem;
font-weight: 300; font-weight: 300;
@@ -188,7 +188,7 @@
} }
.post-description { .post-description {
font-size: 0.9rem; font-size: 1.22rem;
color: rgba(240, 236, 228, 0.6); color: rgba(240, 236, 228, 0.6);
margin-top: 0.4rem; margin-top: 0.4rem;
line-height: 1.5; line-height: 1.5;
@@ -207,7 +207,7 @@
z-index: 1; z-index: 1;
text-align: center; text-align: center;
padding: 2rem 2rem calc(2rem + env(safe-area-inset-bottom, 0px)); padding: 2rem 2rem calc(2rem + env(safe-area-inset-bottom, 0px));
font-size: 0.75rem; font-size: 1.01rem;
color: rgba(240, 236, 228, 0.25); color: rgba(240, 236, 228, 0.25);
} }
@@ -233,7 +233,7 @@
.hero { padding: calc(3rem + env(safe-area-inset-top, 0px)) 1.5rem 2rem; } .hero { padding: calc(3rem + env(safe-area-inset-top, 0px)) 1.5rem 2rem; }
.posts-container { padding-left: calc(1rem + env(safe-area-inset-left, 0px)); padding-right: calc(1rem + env(safe-area-inset-right, 0px)); } .posts-container { padding-left: calc(1rem + env(safe-area-inset-left, 0px)); padding-right: calc(1rem + env(safe-area-inset-right, 0px)); }
.post-item { padding: 1rem 1.25rem; } .post-item { padding: 1rem 1.25rem; }
.post-title { font-size: 1.05rem; } .post-title { font-size: 1.42rem; }
} }
</style> </style>
</head> </head>

View File

@@ -29,7 +29,7 @@
background: var(--bg); background: var(--bg);
color: var(--text); color: var(--text);
font-family: "DM Sans", system-ui, sans-serif; font-family: "DM Sans", system-ui, sans-serif;
font-size: 14px; font-size: 21px;
line-height: 1.5; line-height: 1.5;
min-height: 100vh; min-height: 100vh;
} }
@@ -53,7 +53,7 @@
.topbar-brand { .topbar-brand {
font-weight: 700; font-weight: 700;
font-size: 15px; font-size: 22px;
color: var(--text); color: var(--text);
letter-spacing: -0.02em; letter-spacing: -0.02em;
} }
@@ -64,7 +64,7 @@
} }
.topbar-nav-item { .topbar-nav-item {
font-size: 13px; font-size: 20px;
font-weight: 500; font-weight: 500;
color: var(--dim); color: var(--dim);
padding: 4px 10px; padding: 4px 10px;
@@ -77,7 +77,7 @@
} }
.topbar-right { .topbar-right {
font-size: 12px; font-size: 18px;
color: var(--dim); color: var(--dim);
} }
@@ -104,7 +104,7 @@
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
font-family: "DM Mono", monospace; font-family: "DM Mono", monospace;
font-size: 9px; font-size: 14px;
font-weight: 500; font-weight: 500;
background: rgba(0,0,0,0.4); background: rgba(0,0,0,0.4);
color: #fff; color: #fff;
@@ -132,7 +132,7 @@
} }
.page-title { .page-title {
font-size: 28px; font-size: 42px;
font-weight: 700; font-weight: 700;
letter-spacing: -0.03em; letter-spacing: -0.03em;
color: var(--text); color: var(--text);
@@ -150,7 +150,7 @@
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
gap: 5px; gap: 5px;
font-size: 12px; font-size: 18px;
font-weight: 500; font-weight: 500;
color: var(--muted); color: var(--muted);
background: var(--border); background: var(--border);
@@ -189,7 +189,7 @@
} }
.swatch-name { .swatch-name {
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
color: var(--text); color: var(--text);
margin-bottom: 2px; margin-bottom: 2px;
@@ -197,13 +197,13 @@
.swatch-hex { .swatch-hex {
font-family: "DM Mono", monospace; font-family: "DM Mono", monospace;
font-size: 10px; font-size: 15px;
color: var(--dim); color: var(--dim);
} }
/* Content */ /* Content */
.content-section-label { .content-section-label {
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -222,7 +222,7 @@
} }
.content-area h1 { .content-area h1 {
font-size: 22px; font-size: 33px;
font-weight: 700; font-weight: 700;
letter-spacing: -0.02em; letter-spacing: -0.02em;
color: var(--text); color: var(--text);
@@ -231,7 +231,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 17px; font-size: 26px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin-top: 22px; margin-top: 22px;
@@ -239,7 +239,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin-top: 18px; margin-top: 18px;
@@ -247,7 +247,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 13px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: var(--muted); color: var(--muted);
margin-top: 14px; margin-top: 14px;
@@ -255,7 +255,7 @@
} }
.content-area p { .content-area p {
font-size: 14px; font-size: 21px;
color: var(--muted); color: var(--muted);
margin-bottom: 12px; margin-bottom: 12px;
line-height: 1.65; line-height: 1.65;
@@ -273,7 +273,7 @@
.content-area code { .content-area code {
font-family: "DM Mono", monospace; font-family: "DM Mono", monospace;
font-size: 12px; font-size: 18px;
background: #f3f3f8; background: #f3f3f8;
color: #5b4fcf; color: #5b4fcf;
padding: 2px 6px; padding: 2px 6px;
@@ -292,7 +292,7 @@
background: none; background: none;
color: #e0e0f0; color: #e0e0f0;
padding: 0; padding: 0;
font-size: 13px; font-size: 20px;
} }
.content-area blockquote { .content-area blockquote {
@@ -346,7 +346,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 13px; font-size: 20px;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
} }
@@ -355,7 +355,7 @@
background: #f3f3f8; background: #f3f3f8;
padding: 9px 13px; padding: 9px 13px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: var(--dim); color: var(--dim);
text-transform: uppercase; text-transform: uppercase;
@@ -389,7 +389,7 @@
} }
.tag { .tag {
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
color: #5b4fcf; color: #5b4fcf;
background: rgba(91,79,207,0.08); background: rgba(91,79,207,0.08);
@@ -399,7 +399,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="topbar"> <div class="topbar">
<div class="topbar-left"> <div class="topbar-left">

View File

@@ -20,7 +20,7 @@
background: #000000; background: #000000;
color: #00ff00; color: #00ff00;
font-family: "Comic Sans MS", "Chalkboard SE", "Fredoka One", cursive; font-family: "Comic Sans MS", "Chalkboard SE", "Fredoka One", cursive;
font-size: 15px; font-size: 22px;
line-height: 1.6; line-height: 1.6;
min-height: 100vh; min-height: 100vh;
overflow-x: hidden; overflow-x: hidden;
@@ -67,7 +67,7 @@
color: #000; color: #000;
font-family: "Comic Sans MS", cursive; font-family: "Comic Sans MS", cursive;
font-weight: 700; font-weight: 700;
font-size: 14px; font-size: 21px;
text-align: center; text-align: center;
padding: 8px; padding: 8px;
letter-spacing: 0.2em; letter-spacing: 0.2em;
@@ -95,7 +95,7 @@
display: inline-block; display: inline-block;
white-space: nowrap; white-space: nowrap;
color: #ffff00; color: #ffff00;
font-size: 13px; font-size: 20px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.05em; letter-spacing: 0.05em;
animation: scroll-left 20s linear infinite; animation: scroll-left 20s linear infinite;
@@ -116,7 +116,7 @@
.site-title { .site-title {
font-family: "Creepster", "Abril Fatface", cursive; font-family: "Creepster", "Abril Fatface", cursive;
font-size: 42px; font-size: 63px;
color: #ff00ff; color: #ff00ff;
text-shadow: text-shadow:
0 0 10px #ff00ff, 0 0 10px #ff00ff,
@@ -133,7 +133,7 @@
.site-subtitle { .site-subtitle {
color: #00ffff; color: #00ffff;
font-size: 13px; font-size: 20px;
margin-top: 8px; margin-top: 8px;
letter-spacing: 0.1em; letter-spacing: 0.1em;
animation: glow-cyan 1.5s ease-in-out infinite alternate; animation: glow-cyan 1.5s ease-in-out infinite alternate;
@@ -155,7 +155,7 @@
.post-meta-title { .post-meta-title {
font-family: "Creepster", cursive; font-family: "Creepster", cursive;
font-size: 28px; font-size: 42px;
color: #ffff00; color: #ffff00;
text-shadow: 0 0 8px #ffff00; text-shadow: 0 0 8px #ffff00;
line-height: 1.2; line-height: 1.2;
@@ -170,14 +170,14 @@
.post-meta-info { .post-meta-info {
color: #ff9900; color: #ff9900;
font-size: 13px; font-size: 20px;
letter-spacing: 0.06em; letter-spacing: 0.06em;
} }
/* Rainbow colors cycle through content elements */ /* Rainbow colors cycle through content elements */
.content-area h1 { .content-area h1 {
font-family: "Creepster", cursive; font-family: "Creepster", cursive;
font-size: 26px; font-size: 39px;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
color: #ff0000; color: #ff0000;
@@ -198,7 +198,7 @@
.content-area h2 { .content-area h2 {
font-family: "Creepster", cursive; font-family: "Creepster", cursive;
font-size: 22px; font-size: 33px;
color: #00ffff; color: #00ffff;
text-shadow: 0 0 6px #00ffff; text-shadow: 0 0 6px #00ffff;
margin: 20px 0 10px; margin: 20px 0 10px;
@@ -206,14 +206,14 @@
} }
.content-area h3 { .content-area h3 {
font-size: 16px; font-size: 24px;
color: #ff9900; color: #ff9900;
text-shadow: 0 0 4px #ff9900; text-shadow: 0 0 4px #ff9900;
margin: 16px 0 8px; margin: 16px 0 8px;
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 14px; font-size: 21px;
color: #ff00ff; color: #ff00ff;
margin: 12px 0 6px; margin: 12px 0 6px;
} }
@@ -242,7 +242,7 @@
padding: 1px 5px; padding: 1px 5px;
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
border: 1px solid #00ff00; border: 1px solid #00ff00;
font-size: 13px; font-size: 20px;
} }
.content-area pre { .content-area pre {
@@ -289,7 +289,7 @@
left: 0; left: 0;
color: #ff0000; color: #ff0000;
font-weight: 700; font-weight: 700;
font-size: 10px; font-size: 15px;
top: 2px; top: 2px;
} }
@@ -320,7 +320,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 13px; font-size: 20px;
} }
.content-area th { .content-area th {
@@ -330,7 +330,7 @@
border: 1px solid #ff0000; border: 1px solid #ff0000;
text-align: left; text-align: left;
text-transform: uppercase; text-transform: uppercase;
font-size: 11px; font-size: 16px;
} }
.content-area td { .content-area td {
@@ -363,7 +363,7 @@
} }
.visitor-label { .visitor-label {
font-size: 11px; font-size: 16px;
color: #ffff00; color: #ffff00;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -371,7 +371,7 @@
.visitor-number { .visitor-number {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 28px; font-size: 42px;
color: #ff0000; color: #ff0000;
font-weight: 700; font-weight: 700;
text-shadow: 0 0 10px #ff0000; text-shadow: 0 0 10px #ff0000;
@@ -390,7 +390,7 @@
color: #ffff00; color: #ffff00;
border: 1px solid #ff00ff; border: 1px solid #ff00ff;
padding: 3px 10px; padding: 3px 10px;
font-size: 11px; font-size: 16px;
margin: 3px; margin: 3px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -402,14 +402,14 @@
margin-top: 32px; margin-top: 32px;
padding-top: 16px; padding-top: 16px;
border-top: 2px dashed #00ff00; border-top: 2px dashed #00ff00;
font-size: 11px; font-size: 16px;
color: #00ff00; color: #00ff00;
letter-spacing: 0.08em; letter-spacing: 0.08em;
} }
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="page"> <div class="page">

View File

@@ -30,7 +30,7 @@
background: var(--bg); background: var(--bg);
color: var(--cyber-green); color: var(--cyber-green);
font-family: "Share Tech Mono", "Courier New", monospace; font-family: "Share Tech Mono", "Courier New", monospace;
font-size: 14px; font-size: 21px;
line-height: 1.7; line-height: 1.7;
min-height: 100vh; min-height: 100vh;
overflow-x: hidden; overflow-x: hidden;
@@ -135,7 +135,7 @@
} }
.site-label { .site-label {
font-size: 11px; font-size: 16px;
letter-spacing: 0.3em; letter-spacing: 0.3em;
color: var(--dim-green); color: var(--dim-green);
text-transform: uppercase; text-transform: uppercase;
@@ -208,7 +208,7 @@
padding: 12px 0; padding: 12px 0;
border-bottom: 1px solid rgba(0,255,136,0.15); border-bottom: 1px solid rgba(0,255,136,0.15);
margin-bottom: 32px; margin-bottom: 32px;
font-size: 12px; font-size: 18px;
color: var(--dim-green); color: var(--dim-green);
} }
@@ -220,7 +220,7 @@
.meta-row .meta-key { .meta-row .meta-key {
color: var(--cyber-magenta); color: var(--cyber-magenta);
font-size: 10px; font-size: 15px;
letter-spacing: 0.2em; letter-spacing: 0.2em;
text-transform: uppercase; text-transform: uppercase;
} }
@@ -237,7 +237,7 @@
} }
.tag { .tag {
font-size: 11px; font-size: 16px;
padding: 2px 10px; padding: 2px 10px;
border: 1px solid var(--dim-green); border: 1px solid var(--dim-green);
color: var(--cyber-green); color: var(--cyber-green);
@@ -268,7 +268,7 @@
.post-content h1 { .post-content h1 {
font-family: "Orbitron", sans-serif; font-family: "Orbitron", sans-serif;
font-size: 22px; font-size: 33px;
font-weight: 700; font-weight: 700;
color: var(--cyber-magenta); color: var(--cyber-magenta);
text-shadow: 0 0 10px var(--cyber-magenta); text-shadow: 0 0 10px var(--cyber-magenta);
@@ -281,7 +281,7 @@
.post-content h2 { .post-content h2 {
font-family: "Orbitron", sans-serif; font-family: "Orbitron", sans-serif;
font-size: 17px; font-size: 26px;
font-weight: 700; font-weight: 700;
color: var(--cyber-blue); color: var(--cyber-blue);
text-shadow: 0 0 8px var(--cyber-blue); text-shadow: 0 0 8px var(--cyber-blue);
@@ -291,7 +291,7 @@
} }
.post-content h3 { .post-content h3 {
font-size: 15px; font-size: 22px;
color: var(--cyber-green); color: var(--cyber-green);
text-shadow: 0 0 6px var(--cyber-green); text-shadow: 0 0 6px var(--cyber-green);
margin-top: 24px; margin-top: 24px;
@@ -319,7 +319,7 @@
.post-content code { .post-content code {
font-family: "Share Tech Mono", monospace; font-family: "Share Tech Mono", monospace;
font-size: 13px; font-size: 20px;
color: var(--cyber-blue); color: var(--cyber-blue);
background: rgba(0,255,255,0.06); background: rgba(0,255,255,0.06);
border: 1px solid rgba(0,255,255,0.2); border: 1px solid rgba(0,255,255,0.2);
@@ -341,7 +341,7 @@
position: absolute; position: absolute;
top: 6px; top: 6px;
right: 10px; right: 10px;
font-size: 10px; font-size: 15px;
color: var(--dim-green); color: var(--dim-green);
letter-spacing: 0.1em; letter-spacing: 0.1em;
} }
@@ -384,7 +384,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 20px 0; margin: 20px 0;
font-size: 13px; font-size: 20px;
} }
.post-content th { .post-content th {
@@ -393,7 +393,7 @@
padding: 8px 12px; padding: 8px 12px;
color: var(--cyber-green); color: var(--cyber-green);
text-transform: uppercase; text-transform: uppercase;
font-size: 11px; font-size: 16px;
letter-spacing: 0.1em; letter-spacing: 0.1em;
} }
@@ -424,7 +424,7 @@
border-top: 1px solid var(--dim-green); border-top: 1px solid var(--dim-green);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-size: 11px; font-size: 16px;
color: var(--dim-green); color: var(--dim-green);
letter-spacing: 0.1em; letter-spacing: 0.1em;
} }
@@ -435,7 +435,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<canvas id="matrix-canvas"></canvas> <canvas id="matrix-canvas"></canvas>

View File

@@ -36,7 +36,7 @@
background-color: var(--bg-darker); background-color: var(--bg-darker);
color: var(--fg); color: var(--fg);
font-family: "Inter", system-ui, sans-serif; font-family: "Inter", system-ui, sans-serif;
font-size: 16px; font-size: 24px;
line-height: 1.7; line-height: 1.7;
min-height: 100vh; min-height: 100vh;
} }
@@ -65,7 +65,7 @@
.site-name { .site-name {
font-family: "Fira Code", monospace; font-family: "Fira Code", monospace;
font-size: 13px; font-size: 20px;
color: var(--purple); color: var(--purple);
letter-spacing: 0.05em; letter-spacing: 0.05em;
} }
@@ -78,7 +78,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 20px; gap: 20px;
font-size: 13px; font-size: 20px;
color: var(--comment); color: var(--comment);
font-family: "Fira Code", monospace; font-family: "Fira Code", monospace;
} }
@@ -109,7 +109,7 @@
.sidebar-label { .sidebar-label {
font-family: "Fira Code", monospace; font-family: "Fira Code", monospace;
font-size: 10px; font-size: 15px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.15em; letter-spacing: 0.15em;
color: var(--comment); color: var(--comment);
@@ -124,7 +124,7 @@
.tag { .tag {
font-family: "Fira Code", monospace; font-family: "Fira Code", monospace;
font-size: 11px; font-size: 16px;
padding: 2px 10px; padding: 2px 10px;
border-radius: 999px; border-radius: 999px;
letter-spacing: 0.02em; letter-spacing: 0.02em;
@@ -139,7 +139,7 @@
.sidebar-info { .sidebar-info {
font-family: "Fira Code", monospace; font-family: "Fira Code", monospace;
font-size: 12px; font-size: 18px;
color: var(--fg); color: var(--fg);
line-height: 1.9; line-height: 1.9;
} }
@@ -169,7 +169,7 @@
} }
.post-title { .post-title {
font-size: 36px; font-size: 54px;
font-weight: 600; font-weight: 600;
color: var(--fg); color: var(--fg);
line-height: 1.2; line-height: 1.2;
@@ -188,7 +188,7 @@
} }
.post-content h1 { .post-content h1 {
font-size: 28px; font-size: 42px;
font-weight: 600; font-weight: 600;
color: var(--purple); color: var(--purple);
margin-top: 40px; margin-top: 40px;
@@ -198,7 +198,7 @@
} }
.post-content h2 { .post-content h2 {
font-size: 22px; font-size: 33px;
font-weight: 600; font-weight: 600;
color: var(--pink); color: var(--pink);
margin-top: 36px; margin-top: 36px;
@@ -206,7 +206,7 @@
} }
.post-content h3 { .post-content h3 {
font-size: 18px; font-size: 27px;
font-weight: 500; font-weight: 500;
color: var(--cyan); color: var(--cyan);
margin-top: 28px; margin-top: 28px;
@@ -214,7 +214,7 @@
} }
.post-content h4 { .post-content h4 {
font-size: 16px; font-size: 24px;
font-weight: 500; font-weight: 500;
color: var(--orange); color: var(--orange);
margin-top: 20px; margin-top: 20px;
@@ -239,7 +239,7 @@
.post-content code { .post-content code {
font-family: "Fira Code", monospace; font-family: "Fira Code", monospace;
font-size: 14px; font-size: 21px;
background: var(--bg); background: var(--bg);
color: var(--green); color: var(--green);
padding: 1px 6px; padding: 1px 6px;
@@ -262,7 +262,7 @@
border: none; border: none;
padding: 0; padding: 0;
color: var(--fg); color: var(--fg);
font-size: 14px; font-size: 21px;
} }
.post-content blockquote { .post-content blockquote {
@@ -297,7 +297,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 24px 0; margin: 24px 0;
font-size: 14px; font-size: 21px;
} }
.post-content th { .post-content th {
@@ -306,7 +306,7 @@
padding: 10px 14px; padding: 10px 14px;
text-align: left; text-align: left;
font-family: "Fira Code", monospace; font-family: "Fira Code", monospace;
font-size: 12px; font-size: 18px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.05em; letter-spacing: 0.05em;
} }
@@ -341,7 +341,7 @@
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
font-family: "Fira Code", monospace; font-family: "Fira Code", monospace;
font-size: 12px; font-size: 18px;
color: var(--comment); color: var(--comment);
} }
@@ -373,7 +373,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="layout"> <div class="layout">
<header> <header>

View File

@@ -86,14 +86,14 @@
.postmark-top { .postmark-top {
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
font-size: 9px; font-size: 14px;
letter-spacing: 0.18em; letter-spacing: 0.18em;
text-transform: uppercase; text-transform: uppercase;
color: var(--ink); color: var(--ink);
} }
.postmark-date { .postmark-date {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
color: var(--ink); color: var(--ink);
line-height: 1.2; line-height: 1.2;
@@ -103,7 +103,7 @@
.postmark-bottom { .postmark-bottom {
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
font-size: 8px; font-size: 12px;
letter-spacing: 0.15em; letter-spacing: 0.15em;
text-transform: uppercase; text-transform: uppercase;
color: var(--ink); color: var(--ink);
@@ -143,7 +143,7 @@
} }
.stamp-flag { .stamp-flag {
font-size: 24px; font-size: 36px;
color: #fff; color: #fff;
line-height: 1; line-height: 1;
margin-bottom: 3px; margin-bottom: 3px;
@@ -151,13 +151,13 @@
.stamp-value { .stamp-value {
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
font-size: 10px; font-size: 15px;
color: rgba(255,255,255,0.9); color: rgba(255,255,255,0.9);
letter-spacing: 0.08em; letter-spacing: 0.08em;
} }
.stamp-name { .stamp-name {
font-size: 8px; font-size: 12px;
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
text-align: center; text-align: center;
color: rgba(255,255,255,0.7); color: rgba(255,255,255,0.7);
@@ -176,13 +176,13 @@
} }
.address-block { .address-block {
font-size: 14px; font-size: 21px;
color: var(--ink-dim); color: var(--ink-dim);
line-height: 1.8; line-height: 1.8;
} }
.address-label { .address-label {
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.14em; letter-spacing: 0.14em;
@@ -191,7 +191,7 @@
} }
.address-name { .address-name {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--ink); color: var(--ink);
margin-bottom: 2px; margin-bottom: 2px;
@@ -216,20 +216,20 @@
.letter-date { .letter-date {
text-align: right; text-align: right;
font-size: 14px; font-size: 21px;
font-style: italic; font-style: italic;
color: var(--ink-dim); color: var(--ink-dim);
margin-bottom: 20px; margin-bottom: 20px;
} }
.letter-salutation { .letter-salutation {
font-size: 17px; font-size: 26px;
color: var(--ink); color: var(--ink);
margin-bottom: 16px; margin-bottom: 16px;
} }
.letter-title { .letter-title {
font-size: 26px; font-size: 39px;
font-weight: 700; font-weight: 700;
color: var(--ink); color: var(--ink);
line-height: 1.2; line-height: 1.2;
@@ -239,7 +239,7 @@
/* Content styles */ /* Content styles */
.content-area h1 { .content-area h1 {
font-size: 22px; font-size: 33px;
font-weight: 700; font-weight: 700;
font-style: italic; font-style: italic;
color: var(--ink); color: var(--ink);
@@ -248,7 +248,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 18px; font-size: 27px;
font-weight: 700; font-weight: 700;
color: var(--ink); color: var(--ink);
margin-top: 24px; margin-top: 24px;
@@ -258,7 +258,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--ink-dim); color: var(--ink-dim);
margin-top: 20px; margin-top: 20px;
@@ -266,7 +266,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--ink-dim); color: var(--ink-dim);
margin-top: 16px; margin-top: 16px;
@@ -274,7 +274,7 @@
} }
.content-area p { .content-area p {
font-size: 17px; font-size: 26px;
margin-bottom: 16px; margin-bottom: 16px;
color: var(--ink); color: var(--ink);
text-align: justify; text-align: justify;
@@ -289,7 +289,7 @@
.content-area code { .content-area code {
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
font-size: 14px; font-size: 21px;
background: rgba(0,0,0,0.05); background: rgba(0,0,0,0.05);
padding: 1px 4px; padding: 1px 4px;
} }
@@ -300,7 +300,7 @@
padding: 12px 16px; padding: 12px 16px;
margin: 14px 0; margin: 14px 0;
overflow-x: auto; overflow-x: auto;
font-size: 14px; font-size: 21px;
} }
.content-area pre code { .content-area pre code {
@@ -328,7 +328,7 @@
.content-area li { .content-area li {
margin-bottom: 6px; margin-bottom: 6px;
font-size: 16px; font-size: 24px;
line-height: 1.6; line-height: 1.6;
} }
@@ -336,7 +336,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 15px; font-size: 22px;
} }
.content-area th { .content-area th {
@@ -361,7 +361,7 @@
text-align: center; text-align: center;
margin: 24px 0; margin: 24px 0;
color: var(--ink-dim); color: var(--ink-dim);
font-size: 20px; font-size: 30px;
letter-spacing: 0.4em; letter-spacing: 0.4em;
} }
@@ -376,20 +376,20 @@
} }
.signoff-farewell { .signoff-farewell {
font-size: 17px; font-size: 26px;
color: var(--ink); color: var(--ink);
margin-bottom: 24px; margin-bottom: 24px;
font-style: italic; font-style: italic;
} }
.signoff-signature { .signoff-signature {
font-size: 22px; font-size: 33px;
color: var(--ink); color: var(--ink);
font-style: italic; font-style: italic;
} }
.signoff-site { .signoff-site {
font-size: 13px; font-size: 20px;
color: var(--ink-dim); color: var(--ink-dim);
margin-top: 4px; margin-top: 4px;
} }
@@ -399,7 +399,7 @@
margin-top: 20px; margin-top: 20px;
padding-top: 16px; padding-top: 16px;
border-top: 1px dashed var(--border); border-top: 1px dashed var(--border);
font-size: 12px; font-size: 18px;
color: var(--ink-dim); color: var(--ink-dim);
} }
@@ -428,7 +428,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="envelope"> <div class="envelope">
<div class="airmail-border-top"></div> <div class="airmail-border-top"></div>

View File

@@ -37,7 +37,7 @@
background: var(--bg); background: var(--bg);
color: var(--text); color: var(--text);
font-family: "Roboto", system-ui, sans-serif; font-family: "Roboto", system-ui, sans-serif;
font-size: 14px; font-size: 21px;
line-height: 1.45; line-height: 1.45;
min-height: 100vh; min-height: 100vh;
} }
@@ -66,20 +66,20 @@
} }
.nav-logo-icon { .nav-logo-icon {
font-size: 28px; font-size: 42px;
color: var(--purple); color: var(--purple);
line-height: 1; line-height: 1;
margin-bottom: 2px; margin-bottom: 2px;
} }
.nav-logo-name { .nav-logo-name {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
} }
.nav-logo-handle { .nav-logo-handle {
font-size: 12px; font-size: 18px;
color: var(--text-muted); color: var(--text-muted);
} }
@@ -89,7 +89,7 @@
gap: 12px; gap: 12px;
padding: 10px 12px; padding: 10px 12px;
border-radius: 8px; border-radius: 8px;
font-size: 15px; font-size: 22px;
font-weight: 500; font-weight: 500;
color: var(--text-secondary); color: var(--text-secondary);
cursor: default; cursor: default;
@@ -100,7 +100,7 @@
} }
.nav-item-icon { .nav-item-icon {
font-size: 20px; font-size: 30px;
width: 24px; width: 24px;
text-align: center; text-align: center;
flex-shrink: 0; flex-shrink: 0;
@@ -114,7 +114,7 @@
border-radius: 999px; border-radius: 999px;
text-align: center; text-align: center;
padding: 12px; padding: 12px;
font-size: 14px; font-size: 21px;
} }
/* Main content column */ /* Main content column */
@@ -139,12 +139,12 @@
} }
.column-header-back { .column-header-back {
font-size: 18px; font-size: 27px;
color: var(--text-secondary); color: var(--text-secondary);
} }
.column-header-title { .column-header-title {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
} }
@@ -157,7 +157,7 @@
} }
.status-pinned { .status-pinned {
font-size: 12px; font-size: 18px;
font-weight: 500; font-weight: 500;
color: var(--text-muted); color: var(--text-muted);
margin-bottom: 8px; margin-bottom: 8px;
@@ -181,7 +181,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 20px; font-size: 30px;
font-weight: 700; font-weight: 700;
color: #fff; color: #fff;
} }
@@ -195,7 +195,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
color: #fff; color: #fff;
} }
@@ -213,29 +213,29 @@
} }
.status-name { .status-name {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
} }
.status-handle { .status-handle {
font-size: 13px; font-size: 20px;
color: var(--text-muted); color: var(--text-muted);
} }
.status-dot { .status-dot {
color: var(--text-muted); color: var(--text-muted);
font-size: 12px; font-size: 18px;
} }
.status-time { .status-time {
font-size: 13px; font-size: 20px;
color: var(--text-muted); color: var(--text-muted);
} }
/* Toot title as a subtitle */ /* Toot title as a subtitle */
.toot-subject { .toot-subject {
font-size: 13px; font-size: 20px;
font-weight: 500; font-weight: 500;
color: var(--text-secondary); color: var(--text-secondary);
background: rgba(99,100,255,0.1); background: rgba(99,100,255,0.1);
@@ -248,41 +248,41 @@
/* Content */ /* Content */
.status-body { .status-body {
color: var(--text-secondary); color: var(--text-secondary);
font-size: 15px; font-size: 22px;
line-height: 1.5; line-height: 1.5;
margin-bottom: 12px; margin-bottom: 12px;
} }
.content-area h1 { .content-area h1 {
font-size: 18px; font-size: 27px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin: 16px 0 8px; margin: 16px 0 8px;
} }
.content-area h2 { .content-area h2 {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin: 14px 0 6px; margin: 14px 0 6px;
} }
.content-area h3 { .content-area h3 {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
color: var(--text-secondary); color: var(--text-secondary);
margin: 12px 0 5px; margin: 12px 0 5px;
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 13px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: var(--text-muted); color: var(--text-muted);
margin: 10px 0 4px; margin: 10px 0 4px;
} }
.content-area p { .content-area p {
font-size: 15px; font-size: 22px;
margin-bottom: 10px; margin-bottom: 10px;
color: var(--text-secondary); color: var(--text-secondary);
line-height: 1.55; line-height: 1.55;
@@ -299,7 +299,7 @@
.content-area code { .content-area code {
font-family: "Roboto Mono", monospace; font-family: "Roboto Mono", monospace;
font-size: 13px; font-size: 20px;
background: rgba(255,255,255,0.08); background: rgba(255,255,255,0.08);
color: #e6e6ff; color: #e6e6ff;
padding: 2px 6px; padding: 2px 6px;
@@ -319,7 +319,7 @@
background: none; background: none;
color: #d4d8f0; color: #d4d8f0;
padding: 0; padding: 0;
font-size: 13px; font-size: 20px;
} }
.content-area blockquote { .content-area blockquote {
@@ -369,14 +369,14 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 12px 0; margin: 12px 0;
font-size: 13px; font-size: 20px;
} }
.content-area th { .content-area th {
background: rgba(255,255,255,0.05); background: rgba(255,255,255,0.05);
padding: 7px 12px; padding: 7px 12px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: var(--text-muted); color: var(--text-muted);
border-bottom: 1px solid var(--border); border-bottom: 1px solid var(--border);
@@ -410,13 +410,13 @@
.hashtag { .hashtag {
color: var(--blue-accent); color: var(--blue-accent);
font-size: 15px; font-size: 22px;
font-weight: 500; font-weight: 500;
} }
/* Status timestamp detail */ /* Status timestamp detail */
.status-timestamp { .status-timestamp {
font-size: 13px; font-size: 20px;
color: var(--text-muted); color: var(--text-muted);
margin-bottom: 12px; margin-bottom: 12px;
padding-bottom: 12px; padding-bottom: 12px;
@@ -435,7 +435,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 6px; gap: 6px;
font-size: 13px; font-size: 20px;
font-weight: 500; font-weight: 500;
color: var(--text-muted); color: var(--text-muted);
padding: 6px 12px; padding: 6px 12px;
@@ -444,7 +444,7 @@
} }
.action-btn-icon { .action-btn-icon {
font-size: 16px; font-size: 24px;
} }
.action-btn.boost { color: var(--boost); } .action-btn.boost { color: var(--boost); }
@@ -461,7 +461,7 @@
} }
.engagement-item { .engagement-item {
font-size: 14px; font-size: 21px;
color: var(--text-secondary); color: var(--text-secondary);
} }
@@ -488,7 +488,7 @@
} }
.sidebar-card-header { .sidebar-card-header {
font-size: 13px; font-size: 20px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
padding: 14px 16px 10px; padding: 14px 16px 10px;
@@ -506,12 +506,12 @@
.sidebar-card-item:last-child { border-bottom: none; } .sidebar-card-item:last-child { border-bottom: none; }
.sidebar-item-text { .sidebar-item-text {
font-size: 13px; font-size: 20px;
color: var(--text-secondary); color: var(--text-secondary);
} }
.sidebar-item-label { .sidebar-item-label {
font-size: 11px; font-size: 16px;
color: var(--text-muted); color: var(--text-muted);
} }
@@ -522,7 +522,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="app"> <div class="app">

View File

@@ -48,7 +48,7 @@
); );
color: var(--ink); color: var(--ink);
font-family: "EB Garamond", "Georgia", serif; font-family: "EB Garamond", "Georgia", serif;
font-size: 17px; font-size: 26px;
line-height: 1.7; line-height: 1.7;
min-height: 100vh; min-height: 100vh;
display: flex; display: flex;
@@ -85,7 +85,7 @@
text-orientation: mixed; text-orientation: mixed;
transform: rotate(180deg); transform: rotate(180deg);
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 10px; font-size: 15px;
font-weight: 600; font-weight: 600;
letter-spacing: 0.3em; letter-spacing: 0.3em;
text-transform: uppercase; text-transform: uppercase;
@@ -132,14 +132,14 @@
.flap-ornament-inner { .flap-ornament-inner {
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 28px; font-size: 42px;
font-weight: 700; font-weight: 700;
color: var(--gold-dim); color: var(--gold-dim);
} }
.flap-site { .flap-site {
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 12px; font-size: 18px;
font-weight: 400; font-weight: 400;
letter-spacing: 0.12em; letter-spacing: 0.12em;
text-transform: uppercase; text-transform: uppercase;
@@ -157,7 +157,7 @@
.flap-year { .flap-year {
font-family: "EB Garamond", serif; font-family: "EB Garamond", serif;
font-size: 13px; font-size: 20px;
color: var(--gold-dim); color: var(--gold-dim);
font-style: italic; font-style: italic;
} }
@@ -194,7 +194,7 @@
.page-ornament-top { .page-ornament-top {
text-align: center; text-align: center;
color: var(--gold); color: var(--gold);
font-size: 20px; font-size: 30px;
letter-spacing: 0.3em; letter-spacing: 0.3em;
margin-bottom: 32px; margin-bottom: 32px;
} }
@@ -203,7 +203,7 @@
.chapter-label { .chapter-label {
text-align: center; text-align: center;
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 11px; font-size: 16px;
font-weight: 400; font-weight: 400;
letter-spacing: 0.3em; letter-spacing: 0.3em;
text-transform: uppercase; text-transform: uppercase;
@@ -213,7 +213,7 @@
.chapter-title { .chapter-title {
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 32px; font-size: 48px;
font-weight: 700; font-weight: 700;
color: var(--ink); color: var(--ink);
text-align: center; text-align: center;
@@ -224,7 +224,7 @@
.chapter-subtitle { .chapter-subtitle {
text-align: center; text-align: center;
font-style: italic; font-style: italic;
font-size: 16px; font-size: 24px;
color: var(--ink-dim); color: var(--ink-dim);
margin-bottom: 16px; margin-bottom: 16px;
} }
@@ -233,14 +233,14 @@
.ornament-divider { .ornament-divider {
text-align: center; text-align: center;
color: var(--gold); color: var(--gold);
font-size: 16px; font-size: 24px;
letter-spacing: 0.4em; letter-spacing: 0.4em;
margin: 20px 0 28px; margin: 20px 0 28px;
} }
/* Meta */ /* Meta */
.page-meta { .page-meta {
font-size: 13px; font-size: 20px;
color: var(--ink-light); color: var(--ink-light);
text-align: center; text-align: center;
font-style: italic; font-style: italic;
@@ -252,7 +252,7 @@
/* Tags */ /* Tags */
.tags-line { .tags-line {
text-align: center; text-align: center;
font-size: 12px; font-size: 18px;
color: var(--ink-light); color: var(--ink-light);
margin-top: -10px; margin-top: -10px;
margin-bottom: 32px; margin-bottom: 32px;
@@ -266,7 +266,7 @@
.content-area > p:first-of-type::first-letter { .content-area > p:first-of-type::first-letter {
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 4.5em; font-size: 6.08em;
font-weight: 700; font-weight: 700;
float: left; float: left;
line-height: 0.75; line-height: 0.75;
@@ -277,7 +277,7 @@
.content-area h1 { .content-area h1 {
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 24px; font-size: 36px;
font-weight: 700; font-weight: 700;
color: var(--ink); color: var(--ink);
margin-top: 40px; margin-top: 40px;
@@ -288,7 +288,7 @@
.content-area h2 { .content-area h2 {
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 19px; font-size: 28px;
font-weight: 700; font-weight: 700;
font-style: italic; font-style: italic;
color: var(--ink-dim); color: var(--ink-dim);
@@ -297,7 +297,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 16px; font-size: 24px;
font-weight: 600; font-weight: 600;
color: var(--ink-dim); color: var(--ink-dim);
margin-top: 24px; margin-top: 24px;
@@ -306,7 +306,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 15px; font-size: 22px;
font-weight: 600; font-weight: 600;
color: var(--ink-light); color: var(--ink-light);
margin-top: 18px; margin-top: 18px;
@@ -314,7 +314,7 @@
} }
.content-area p { .content-area p {
font-size: 17px; font-size: 26px;
margin-bottom: 14px; margin-bottom: 14px;
color: var(--ink); color: var(--ink);
text-align: justify; text-align: justify;
@@ -330,7 +330,7 @@
.content-area code { .content-area code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 14px; font-size: 21px;
background: var(--paper-dark); background: var(--paper-dark);
color: var(--ink-dim); color: var(--ink-dim);
padding: 1px 4px; padding: 1px 4px;
@@ -343,7 +343,7 @@
padding: 14px 18px; padding: 14px 18px;
margin: 16px 0; margin: 16px 0;
overflow-x: auto; overflow-x: auto;
font-size: 14px; font-size: 21px;
} }
.content-area pre code { .content-area pre code {
@@ -355,7 +355,7 @@
padding: 12px 24px; padding: 12px 24px;
margin: 20px 0; margin: 20px 0;
font-style: italic; font-style: italic;
font-size: 18px; font-size: 27px;
color: var(--ink-dim); color: var(--ink-dim);
border-left: 3px solid var(--gold-dim); border-left: 3px solid var(--gold-dim);
} }
@@ -372,7 +372,7 @@
.content-area li { .content-area li {
margin-bottom: 6px; margin-bottom: 6px;
font-size: 17px; font-size: 26px;
line-height: 1.6; line-height: 1.6;
} }
@@ -380,7 +380,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 16px auto; margin: 16px auto;
font-size: 15px; font-size: 22px;
} }
.content-area th { .content-area th {
@@ -389,7 +389,7 @@
font-weight: 700; font-weight: 700;
text-align: left; text-align: left;
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 14px; font-size: 21px;
} }
.content-area td { .content-area td {
@@ -407,7 +407,7 @@
border: none; border: none;
text-align: center; text-align: center;
margin: 28px 0; margin: 28px 0;
font-size: 18px; font-size: 27px;
color: var(--gold-dim); color: var(--gold-dim);
letter-spacing: 0.4em; letter-spacing: 0.4em;
} }
@@ -424,14 +424,14 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
font-size: 12px; font-size: 18px;
color: var(--ink-light); color: var(--ink-light);
font-style: italic; font-style: italic;
} }
.page-number { .page-number {
font-family: "EB Garamond", serif; font-family: "EB Garamond", serif;
font-size: 14px; font-size: 21px;
} }
@media (max-width: 800px) { @media (max-width: 800px) {
@@ -442,7 +442,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="book"> <div class="book">

View File

@@ -28,7 +28,7 @@
background: var(--bg); background: var(--bg);
color: var(--text); color: var(--text);
font-family: Arial, Helvetica, "Neue Haas Grotesk", sans-serif; font-family: Arial, Helvetica, "Neue Haas Grotesk", sans-serif;
font-size: 12px; font-size: 18px;
line-height: 1.4; line-height: 1.4;
min-height: 100vh; min-height: 100vh;
padding: 32px 16px 48px; padding: 32px 16px 48px;
@@ -57,7 +57,7 @@
} }
.sender-name { .sender-name {
font-size: 18px; font-size: 27px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
letter-spacing: -0.01em; letter-spacing: -0.01em;
@@ -65,7 +65,7 @@
} }
.sender-details { .sender-details {
font-size: 11px; font-size: 16px;
color: var(--muted); color: var(--muted);
line-height: 1.6; line-height: 1.6;
} }
@@ -75,7 +75,7 @@
} }
.rechnung-title { .rechnung-title {
font-size: 36px; font-size: 54px;
font-weight: 700; font-weight: 700;
letter-spacing: -0.02em; letter-spacing: -0.02em;
color: var(--text); color: var(--text);
@@ -85,13 +85,13 @@
} }
.invoice-number { .invoice-number {
font-size: 11px; font-size: 16px;
color: var(--muted); color: var(--muted);
margin-bottom: 2px; margin-bottom: 2px;
} }
.invoice-date { .invoice-date {
font-size: 11px; font-size: 16px;
color: var(--muted); color: var(--muted);
} }
@@ -110,7 +110,7 @@
} }
.field-label { .field-label {
font-size: 9px; font-size: 14px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.12em; letter-spacing: 0.12em;
@@ -121,7 +121,7 @@
} }
.field-value { .field-value {
font-size: 12px; font-size: 18px;
color: var(--text); color: var(--text);
line-height: 1.6; line-height: 1.6;
} }
@@ -135,7 +135,7 @@
} }
.content-subject-label { .content-subject-label {
font-size: 9px; font-size: 14px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.12em; letter-spacing: 0.12em;
@@ -144,14 +144,14 @@
} }
.content-subject-value { .content-subject-value {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
} }
/* Main content area */ /* Main content area */
.content-section-label { .content-section-label {
font-size: 9px; font-size: 14px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.12em; letter-spacing: 0.12em;
@@ -166,7 +166,7 @@
} }
.content-area h1 { .content-area h1 {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin-top: 24px; margin-top: 24px;
@@ -174,7 +174,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin-top: 20px; margin-top: 20px;
@@ -182,7 +182,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 12px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: var(--muted); color: var(--muted);
margin-top: 16px; margin-top: 16px;
@@ -192,7 +192,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 12px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: var(--muted); color: var(--muted);
margin-top: 12px; margin-top: 12px;
@@ -200,7 +200,7 @@
} }
.content-area p { .content-area p {
font-size: 12px; font-size: 18px;
margin-bottom: 10px; margin-bottom: 10px;
color: var(--muted); color: var(--muted);
line-height: 1.55; line-height: 1.55;
@@ -213,7 +213,7 @@
.content-area code { .content-area code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 11px; font-size: 16px;
background: #f4f4f4; background: #f4f4f4;
border: 1px solid var(--border); border: 1px solid var(--border);
padding: 1px 4px; padding: 1px 4px;
@@ -225,7 +225,7 @@
padding: 12px 14px; padding: 12px 14px;
overflow-x: auto; overflow-x: auto;
margin: 10px 0; margin: 10px 0;
font-size: 11px; font-size: 16px;
} }
.content-area pre code { .content-area pre code {
@@ -259,14 +259,14 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 12px 0; margin: 12px 0;
font-size: 11px; font-size: 16px;
} }
.content-area th { .content-area th {
background: #f0f0f0; background: #f0f0f0;
padding: 7px 10px; padding: 7px 10px;
text-align: left; text-align: left;
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
@@ -309,7 +309,7 @@
} }
.summary-tag { .summary-tag {
font-size: 9px; font-size: 14px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
@@ -319,7 +319,7 @@
} }
.summary-reading { .summary-reading {
font-size: 11px; font-size: 16px;
color: var(--light); color: var(--light);
} }
@@ -330,12 +330,12 @@
display: grid; display: grid;
grid-template-columns: 1fr 1fr 1fr; grid-template-columns: 1fr 1fr 1fr;
gap: 16px; gap: 16px;
font-size: 10px; font-size: 15px;
color: var(--light); color: var(--light);
} }
.footer-block-label { .footer-block-label {
font-size: 8px; font-size: 12px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -357,7 +357,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="page"> <div class="page">

View File

@@ -33,7 +33,7 @@
radial-gradient(at 80% 80%, rgba(52,199,89,0.06) 0%, transparent 50%); radial-gradient(at 80% 80%, rgba(52,199,89,0.06) 0%, transparent 50%);
color: var(--text); color: var(--text);
font-family: "Nunito", -apple-system, "SF Pro Rounded", system-ui, sans-serif; font-family: "Nunito", -apple-system, "SF Pro Rounded", system-ui, sans-serif;
font-size: 16px; font-size: 24px;
line-height: 1.6; line-height: 1.6;
min-height: 100vh; min-height: 100vh;
display: flex; display: flex;
@@ -48,7 +48,7 @@
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
padding: 0 24px; padding: 0 24px;
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
color: var(--secondary); color: var(--secondary);
} }
@@ -66,7 +66,7 @@
} }
.nav-back { .nav-back {
font-size: 15px; font-size: 22px;
font-weight: 600; font-weight: 600;
color: var(--blue); color: var(--blue);
display: flex; display: flex;
@@ -80,13 +80,13 @@
} }
.nav-title { .nav-title {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
} }
.nav-right { .nav-right {
font-size: 14px; font-size: 21px;
font-weight: 600; font-weight: 600;
color: var(--blue); color: var(--blue);
} }
@@ -122,7 +122,7 @@
} }
.reading-label { .reading-label {
font-size: 11px; font-size: 16px;
font-weight: 800; font-weight: 800;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -131,7 +131,7 @@
} }
.card-title { .card-title {
font-size: 28px; font-size: 42px;
font-weight: 800; font-weight: 800;
letter-spacing: -0.02em; letter-spacing: -0.02em;
color: var(--text); color: var(--text);
@@ -152,7 +152,7 @@
gap: 6px; gap: 6px;
background: var(--blue); background: var(--blue);
color: #fff; color: #fff;
font-size: 12px; font-size: 18px;
font-weight: 700; font-weight: 700;
padding: 4px 10px 4px 6px; padding: 4px 10px 4px 6px;
border-radius: 999px; border-radius: 999px;
@@ -166,12 +166,12 @@
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 10px; font-size: 15px;
font-weight: 800; font-weight: 800;
} }
.meta-pill { .meta-pill {
font-size: 12px; font-size: 18px;
font-weight: 600; font-weight: 600;
color: var(--tertiary); color: var(--tertiary);
background: rgba(142,142,147,0.12); background: rgba(142,142,147,0.12);
@@ -188,7 +188,7 @@
} }
.tag { .tag {
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: var(--blue); color: var(--blue);
background: rgba(0,122,255,0.1); background: rgba(0,122,255,0.1);
@@ -203,7 +203,7 @@
/* Content */ /* Content */
.content-area h1 { .content-area h1 {
font-size: 24px; font-size: 36px;
font-weight: 800; font-weight: 800;
letter-spacing: -0.02em; letter-spacing: -0.02em;
color: var(--text); color: var(--text);
@@ -212,7 +212,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 20px; font-size: 30px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin-top: 28px; margin-top: 28px;
@@ -220,7 +220,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 17px; font-size: 26px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin-top: 22px; margin-top: 22px;
@@ -228,7 +228,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--secondary); color: var(--secondary);
margin-top: 16px; margin-top: 16px;
@@ -238,7 +238,7 @@
.content-area p { .content-area p {
margin-bottom: 14px; margin-bottom: 14px;
color: var(--secondary); color: var(--secondary);
font-size: 16px; font-size: 24px;
line-height: 1.7; line-height: 1.7;
font-weight: 400; font-weight: 400;
} }
@@ -255,7 +255,7 @@
.content-area code { .content-area code {
font-family: "SF Mono", "Menlo", monospace; font-family: "SF Mono", "Menlo", monospace;
font-size: 13px; font-size: 20px;
background: rgba(142,142,147,0.14); background: rgba(142,142,147,0.14);
color: #c0392b; color: #c0392b;
padding: 2px 6px; padding: 2px 6px;
@@ -274,7 +274,7 @@
background: none; background: none;
color: #e5e5ea; color: #e5e5ea;
padding: 0; padding: 0;
font-size: 13px; font-size: 20px;
} }
.content-area blockquote { .content-area blockquote {
@@ -330,14 +330,14 @@
margin: 16px 0; margin: 16px 0;
border-radius: 12px; border-radius: 12px;
overflow: hidden; overflow: hidden;
font-size: 14px; font-size: 21px;
} }
.content-area th { .content-area th {
background: rgba(142,142,147,0.12); background: rgba(142,142,147,0.12);
padding: 10px 14px; padding: 10px 14px;
text-align: left; text-align: left;
font-size: 12px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: var(--tertiary); color: var(--tertiary);
text-transform: uppercase; text-transform: uppercase;
@@ -382,12 +382,12 @@
padding-left: 20px; padding-left: 20px;
padding-right: 20px; padding-right: 20px;
} }
.card-title { font-size: 22px; } .card-title { font-size: 33px; }
} }
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="status-bar"> <div class="status-bar">
{{ published_date }} · {{ reading_time }} {{ published_date }} · {{ reading_time }}

View File

@@ -30,7 +30,7 @@
background: #dcdccc; background: #dcdccc;
color: var(--text); color: var(--text);
font-family: "Libre Caslon Text", "Computer Modern", "Latin Modern Math", "Times New Roman", serif; font-family: "Libre Caslon Text", "Computer Modern", "Latin Modern Math", "Times New Roman", serif;
font-size: 16px; font-size: 24px;
line-height: 1.65; line-height: 1.65;
min-height: 100vh; min-height: 100vh;
padding: 40px 16px; padding: 40px 16px;
@@ -55,7 +55,7 @@
.paper-maintitle { .paper-maintitle {
font-family: "Libre Caslon Display", "Libre Caslon Text", serif; font-family: "Libre Caslon Display", "Libre Caslon Text", serif;
font-size: 26px; font-size: 39px;
font-weight: 400; font-weight: 400;
color: var(--text); color: var(--text);
line-height: 1.25; line-height: 1.25;
@@ -63,13 +63,13 @@
} }
.paper-author { .paper-author {
font-size: 14px; font-size: 21px;
color: var(--muted); color: var(--muted);
margin-bottom: 6px; margin-bottom: 6px;
} }
.paper-date { .paper-date {
font-size: 13px; font-size: 20px;
color: var(--dim); color: var(--dim);
font-style: italic; font-style: italic;
} }
@@ -83,7 +83,7 @@
.abstract-label { .abstract-label {
font-weight: 700; font-weight: 700;
font-size: 13px; font-size: 20px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
text-align: center; text-align: center;
@@ -92,7 +92,7 @@
} }
.abstract-text { .abstract-text {
font-size: 14px; font-size: 21px;
font-style: italic; font-style: italic;
color: var(--muted); color: var(--muted);
text-align: justify; text-align: justify;
@@ -105,7 +105,7 @@
} }
.content-area h1 { .content-area h1 {
font-size: 18px; font-size: 27px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin-top: 40px; margin-top: 40px;
@@ -119,7 +119,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
font-style: italic; font-style: italic;
color: var(--text); color: var(--text);
@@ -128,7 +128,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--muted); color: var(--muted);
margin-top: 22px; margin-top: 22px;
@@ -136,7 +136,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
color: var(--dim); color: var(--dim);
margin-top: 16px; margin-top: 16px;
@@ -161,7 +161,7 @@
.content-area code { .content-area code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 14px; font-size: 21px;
color: #444; color: #444;
background: #f0f0e8; background: #f0f0e8;
padding: 1px 4px; padding: 1px 4px;
@@ -174,7 +174,7 @@
padding: 14px 18px; padding: 14px 18px;
margin: 16px 0; margin: 16px 0;
overflow-x: auto; overflow-x: auto;
font-size: 13px; font-size: 20px;
} }
.content-area pre code { .content-area pre code {
@@ -197,7 +197,7 @@
content: "Theorem " counter(theorem) "."; content: "Theorem " counter(theorem) ".";
font-style: normal; font-style: normal;
font-weight: 700; font-weight: 700;
font-size: 13px; font-size: 20px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
color: var(--accent); color: var(--accent);
@@ -227,7 +227,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 16px auto; margin: 16px auto;
font-size: 14px; font-size: 21px;
} }
.content-area th { .content-area th {
@@ -235,7 +235,7 @@
padding: 8px 14px; padding: 8px 14px;
border-bottom: 2px solid var(--text); border-bottom: 2px solid var(--text);
text-align: center; text-align: center;
font-size: 13px; font-size: 20px;
} }
.content-area td { .content-area td {
@@ -265,7 +265,7 @@
.proof-label { .proof-label {
font-style: italic; font-style: italic;
font-size: 14px; font-size: 21px;
color: var(--muted); color: var(--muted);
margin-bottom: 6px; margin-bottom: 6px;
} }
@@ -273,7 +273,7 @@
.qed { .qed {
display: block; display: block;
text-align: right; text-align: right;
font-size: 18px; font-size: 27px;
color: var(--text); color: var(--text);
margin-top: 8px; margin-top: 8px;
} }
@@ -283,7 +283,7 @@
margin-top: 40px; margin-top: 40px;
padding-top: 20px; padding-top: 20px;
border-top: 1px solid var(--border); border-top: 1px solid var(--border);
font-size: 13px; font-size: 20px;
color: var(--muted); color: var(--muted);
} }
@@ -291,7 +291,7 @@
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
font-size: 12px; font-size: 18px;
margin-bottom: 6px; margin-bottom: 6px;
color: var(--text); color: var(--text);
} }
@@ -301,7 +301,7 @@
margin-top: 40px; margin-top: 40px;
padding-top: 16px; padding-top: 16px;
border-top: 1px solid var(--border); border-top: 1px solid var(--border);
font-size: 12px; font-size: 18px;
color: var(--dim); color: var(--dim);
text-align: center; text-align: center;
font-style: italic; font-style: italic;
@@ -314,7 +314,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="paper"> <div class="paper">
@@ -342,7 +342,7 @@
<div class="proof-block"> <div class="proof-block">
<div class="proof-label">Proof.</div> <div class="proof-label">Proof.</div>
<p style="font-size: 14px; color: var(--muted);">The assertions above follow directly from the preceding definitions and observations. The reader may verify each claim by inspection.</p> <p style="font-size: 21px; color: var(--muted);">The assertions above follow directly from the preceding definitions and observations. The reader may verify each claim by inspection.</p>
<span class="qed">&#9632;</span> <span class="qed">&#9632;</span>
</div> </div>

View File

@@ -27,7 +27,7 @@
} }
html { html {
font-size: 18px; font-size: 27px;
} }
body { body {
@@ -79,7 +79,7 @@
} }
.post-title { .post-title {
font-size: 2.2rem; font-size: 2.97rem;
font-weight: 300; font-weight: 300;
letter-spacing: 0.02em; letter-spacing: 0.02em;
line-height: 1.25; line-height: 1.25;
@@ -89,12 +89,12 @@
/* Content */ /* Content */
.post-content { .post-content {
font-size: 1.05rem; font-size: 1.42rem;
line-height: 1.9; line-height: 1.9;
} }
.post-content h1 { .post-content h1 {
font-size: 1.7rem; font-size: 2.29rem;
font-weight: 400; font-weight: 400;
letter-spacing: 0.01em; letter-spacing: 0.01em;
margin-top: 64px; margin-top: 64px;
@@ -104,7 +104,7 @@
} }
.post-content h2 { .post-content h2 {
font-size: 1.35rem; font-size: 1.82rem;
font-weight: 400; font-weight: 400;
font-style: italic; font-style: italic;
margin-top: 52px; margin-top: 52px;
@@ -114,14 +114,14 @@
} }
.post-content h3 { .post-content h3 {
font-size: 1.1rem; font-size: 1.49rem;
font-weight: 500; font-weight: 500;
margin-top: 40px; margin-top: 40px;
margin-bottom: 16px; margin-bottom: 16px;
color: var(--text); color: var(--text);
letter-spacing: 0.05em; letter-spacing: 0.05em;
text-transform: uppercase; text-transform: uppercase;
font-size: 0.85rem; font-size: 1.15rem;
} }
.post-content p { .post-content p {
@@ -129,7 +129,7 @@
} }
.post-content p:first-child::first-letter { .post-content p:first-child::first-letter {
font-size: 3.5rem; font-size: 4.73rem;
font-weight: 300; font-weight: 300;
line-height: 0.8; line-height: 0.8;
float: left; float: left;
@@ -159,7 +159,7 @@
.post-content code { .post-content code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 0.85em; font-size: 1.15em;
background: var(--warm-white); background: var(--warm-white);
padding: 1px 6px; padding: 1px 6px;
border-radius: 2px; border-radius: 2px;
@@ -172,7 +172,7 @@
margin: 32px 0; margin: 32px 0;
overflow-x: auto; overflow-x: auto;
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 0.82em; font-size: 1.11em;
line-height: 1.7; line-height: 1.7;
border-left: 2px solid var(--circle); border-left: 2px solid var(--circle);
} }
@@ -189,7 +189,7 @@
margin: 40px 0; margin: 40px 0;
border-top: 1px solid var(--circle); border-top: 1px solid var(--circle);
border-bottom: 1px solid var(--circle); border-bottom: 1px solid var(--circle);
font-size: 1.2rem; font-size: 1.62rem;
font-style: italic; font-style: italic;
color: var(--text-light); color: var(--text-light);
font-weight: 300; font-weight: 300;
@@ -213,7 +213,7 @@
position: absolute; position: absolute;
left: 6px; left: 6px;
color: var(--circle); color: var(--circle);
font-size: 1.2em; font-size: 1.62em;
} }
.post-content ol { .post-content ol {
@@ -239,7 +239,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 32px 0; margin: 32px 0;
font-size: 0.95rem; font-size: 1.28rem;
} }
.post-content th { .post-content th {
@@ -249,7 +249,7 @@
font-weight: 500; font-weight: 500;
letter-spacing: 0.05em; letter-spacing: 0.05em;
color: var(--text-light); color: var(--text-light);
font-size: 0.8rem; font-size: 1.08rem;
text-transform: uppercase; text-transform: uppercase;
} }
@@ -269,7 +269,7 @@
text-align: center; text-align: center;
margin: 48px 0; margin: 48px 0;
color: var(--text-lighter); color: var(--text-lighter);
font-size: 1.2rem; font-size: 1.62rem;
letter-spacing: 0.5em; letter-spacing: 0.5em;
} }
@@ -283,7 +283,7 @@
padding-top: 32px; padding-top: 32px;
border-top: 1px solid var(--warm-white); border-top: 1px solid var(--warm-white);
text-align: center; text-align: center;
font-size: 0.8rem; font-size: 1.08rem;
color: var(--text-lighter); color: var(--text-lighter);
letter-spacing: 0.08em; letter-spacing: 0.08em;
line-height: 2; line-height: 2;
@@ -295,7 +295,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="page"> <div class="page">
<div class="circle-motif"> <div class="circle-motif">

View File

@@ -29,7 +29,7 @@
background: #8a7a60; background: #8a7a60;
color: var(--ink); color: var(--ink);
font-family: "Old Standard TT", Georgia, serif; font-family: "Old Standard TT", Georgia, serif;
font-size: 15px; font-size: 22px;
line-height: 1.6; line-height: 1.6;
} }
@@ -52,7 +52,7 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
font-size: 11px; font-size: 16px;
color: var(--ink-lighter); color: var(--ink-lighter);
padding-bottom: 8px; padding-bottom: 8px;
border-bottom: 1px solid var(--rule-color); border-bottom: 1px solid var(--rule-color);
@@ -70,7 +70,7 @@
} }
.masthead-tagline { .masthead-tagline {
font-size: 11px; font-size: 16px;
letter-spacing: 0.25em; letter-spacing: 0.25em;
text-transform: uppercase; text-transform: uppercase;
color: var(--ink-lighter); color: var(--ink-lighter);
@@ -103,7 +103,7 @@
} }
.kicker { .kicker {
font-size: 11px; font-size: 16px;
letter-spacing: 0.2em; letter-spacing: 0.2em;
text-transform: uppercase; text-transform: uppercase;
color: var(--ink-lighter); color: var(--ink-lighter);
@@ -123,7 +123,7 @@
.deck { .deck {
font-family: "Playfair Display", Georgia, serif; font-family: "Playfair Display", Georgia, serif;
font-size: 17px; font-size: 26px;
font-style: italic; font-style: italic;
color: var(--ink-light); color: var(--ink-light);
line-height: 1.4; line-height: 1.4;
@@ -138,7 +138,7 @@
border-top: 1px solid var(--rule-color); border-top: 1px solid var(--rule-color);
border-bottom: 1px solid var(--rule-color); border-bottom: 1px solid var(--rule-color);
margin-bottom: 20px; margin-bottom: 20px;
font-size: 11px; font-size: 16px;
color: var(--ink-lighter); color: var(--ink-lighter);
letter-spacing: 0.05em; letter-spacing: 0.05em;
text-transform: uppercase; text-transform: uppercase;
@@ -158,7 +158,7 @@
columns: 2; columns: 2;
column-gap: 32px; column-gap: 32px;
column-rule: 1px solid var(--rule-color); column-rule: 1px solid var(--rule-color);
font-size: 14px; font-size: 21px;
line-height: 1.65; line-height: 1.65;
text-align: justify; text-align: justify;
hyphens: auto; hyphens: auto;
@@ -167,7 +167,7 @@
/* Drop cap on first paragraph */ /* Drop cap on first paragraph */
.columns-body p:first-child::first-letter { .columns-body p:first-child::first-letter {
font-family: "Playfair Display", Georgia, serif; font-family: "Playfair Display", Georgia, serif;
font-size: 5rem; font-size: 6.75rem;
font-weight: 900; font-weight: 900;
line-height: 0.8; line-height: 0.8;
float: left; float: left;
@@ -179,7 +179,7 @@
.columns-body h1 { .columns-body h1 {
column-span: all; column-span: all;
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 22px; font-size: 33px;
font-weight: 700; font-weight: 700;
margin-top: 24px; margin-top: 24px;
margin-bottom: 12px; margin-bottom: 12px;
@@ -190,7 +190,7 @@
.columns-body h2 { .columns-body h2 {
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 17px; font-size: 26px;
font-weight: 700; font-weight: 700;
font-style: italic; font-style: italic;
margin-top: 20px; margin-top: 20px;
@@ -199,7 +199,7 @@
} }
.columns-body h3 { .columns-body h3 {
font-size: 13px; font-size: 20px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -219,7 +219,7 @@
.columns-body code { .columns-body code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 12px; font-size: 18px;
background: var(--newsprint-dark); background: var(--newsprint-dark);
padding: 0 3px; padding: 0 3px;
border: 1px solid rgba(0,0,0,0.1); border: 1px solid rgba(0,0,0,0.1);
@@ -232,7 +232,7 @@
margin: 12px 0; margin: 12px 0;
overflow-x: auto; overflow-x: auto;
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 11px; font-size: 16px;
line-height: 1.5; line-height: 1.5;
column-span: all; column-span: all;
} }
@@ -249,7 +249,7 @@
padding: 12px 0; padding: 12px 0;
margin: 16px 0; margin: 16px 0;
font-family: "Playfair Display", serif; font-family: "Playfair Display", serif;
font-size: 15px; font-size: 22px;
font-style: italic; font-style: italic;
color: var(--ink-light); color: var(--ink-light);
text-align: center; text-align: center;
@@ -269,7 +269,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 12px; font-size: 18px;
column-span: all; column-span: all;
} }
@@ -279,7 +279,7 @@
padding: 5px 8px; padding: 5px 8px;
text-align: left; text-align: left;
font-weight: 700; font-weight: 700;
font-size: 11px; font-size: 16px;
letter-spacing: 0.05em; letter-spacing: 0.05em;
} }
@@ -310,7 +310,7 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
font-size: 11px; font-size: 16px;
color: var(--ink-lighter); color: var(--ink-lighter);
background: var(--newsprint-dark); background: var(--newsprint-dark);
} }
@@ -321,7 +321,7 @@
} }
.tags-footer { .tags-footer {
font-size: 11px; font-size: 16px;
letter-spacing: 0.1em; letter-spacing: 0.1em;
text-transform: uppercase; text-transform: uppercase;
} }
@@ -344,7 +344,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="broadsheet"> <div class="broadsheet">
<header class="masthead"> <header class="masthead">

View File

@@ -10,7 +10,7 @@
html, body { html, body {
background: #3d3d3d; background: #3d3d3d;
font-family: "Verdana", "Tahoma", Arial, sans-serif; font-family: "Verdana", "Tahoma", Arial, sans-serif;
font-size: 12px; font-size: 18px;
color: #dadada; color: #dadada;
min-height: 100vh; min-height: 100vh;
} }
@@ -42,7 +42,7 @@
justify-content: space-between; justify-content: space-between;
border-bottom: 1px solid #1e2e40; border-bottom: 1px solid #1e2e40;
text-shadow: 0 -1px 0 rgba(0,0,0,0.5); text-shadow: 0 -1px 0 rgba(0,0,0,0.5);
font-size: 11px; font-size: 16px;
font-weight: bold; font-weight: bold;
} }
@@ -64,7 +64,7 @@
font-weight: bold; font-weight: bold;
text-align: center; text-align: center;
line-height: 12px; line-height: 12px;
font-size: 10px; font-size: 15px;
} }
.titlebar-btns { display: flex; gap: 2px; } .titlebar-btns { display: flex; gap: 2px; }
@@ -73,7 +73,7 @@
background: linear-gradient(to bottom, #6d7d90, #394756); background: linear-gradient(to bottom, #6d7d90, #394756);
border: 1px solid #1e2e40; border: 1px solid #1e2e40;
color: #fff; color: #fff;
font-size: 9px; font-size: 14px;
display: flex; align-items: center; justify-content: center; display: flex; align-items: center; justify-content: center;
} }
@@ -90,7 +90,7 @@
color: #c0c8d2; color: #c0c8d2;
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
font-size: 11px; font-size: 16px;
letter-spacing: 0.06em; letter-spacing: 0.06em;
border-right: 1px solid #111; border-right: 1px solid #111;
cursor: default; cursor: default;
@@ -111,7 +111,7 @@
background: #1e1e1e; background: #1e1e1e;
border-bottom: 1px solid #000; border-bottom: 1px solid #000;
padding: 4px 12px; padding: 4px 12px;
font-size: 10px; font-size: 15px;
color: #8a9ab0; color: #8a9ab0;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -137,7 +137,7 @@
.side-section-title { .side-section-title {
padding: 4px 14px; padding: 4px 14px;
font-size: 10px; font-size: 15px;
font-weight: bold; font-weight: bold;
text-transform: uppercase; text-transform: uppercase;
color: #ffcc66; color: #ffcc66;
@@ -149,7 +149,7 @@
.side-item { .side-item {
padding: 4px 14px 4px 26px; padding: 4px 14px 4px 26px;
font-size: 11px; font-size: 16px;
position: relative; position: relative;
} }
@@ -170,7 +170,7 @@
.side-meta { .side-meta {
margin-top: 14px; margin-top: 14px;
padding: 10px 14px; padding: 10px 14px;
font-size: 10px; font-size: 15px;
color: #8a9ab0; color: #8a9ab0;
border-top: 1px solid rgba(0,0,0,0.4); border-top: 1px solid rgba(0,0,0,0.4);
} }
@@ -194,7 +194,7 @@
.hero h1 { .hero h1 {
font-family: "Verdana", "Tahoma", sans-serif; font-family: "Verdana", "Tahoma", sans-serif;
font-size: 22px; font-size: 33px;
color: #ffcc66; color: #ffcc66;
font-weight: bold; font-weight: bold;
text-shadow: 0 -1px 0 rgba(0,0,0,0.6); text-shadow: 0 -1px 0 rgba(0,0,0,0.6);
@@ -205,7 +205,7 @@
.hero .byline { .hero .byline {
color: #99c266; color: #99c266;
font-size: 11px; font-size: 16px;
font-weight: bold; font-weight: bold;
} }
@@ -214,13 +214,13 @@
.article { .article {
padding: 24px 28px; padding: 24px 28px;
color: #dadada; color: #dadada;
font-size: 12px; font-size: 18px;
line-height: 1.7; line-height: 1.7;
} }
.article h2 { .article h2 {
font-family: "Verdana", sans-serif; font-family: "Verdana", sans-serif;
font-size: 14px; font-size: 21px;
color: #ffcc66; color: #ffcc66;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
@@ -230,7 +230,7 @@
} }
.article h3 { .article h3 {
font-size: 12px; font-size: 18px;
color: #a7c6e8; color: #a7c6e8;
font-weight: bold; font-weight: bold;
margin: 18px 0 6px; margin: 18px 0 6px;
@@ -266,7 +266,7 @@
color: #ffcc66; color: #ffcc66;
border: 1px solid #000; border: 1px solid #000;
padding: 0 4px; padding: 0 4px;
font-size: 11px; font-size: 16px;
} }
.article pre { .article pre {
@@ -277,7 +277,7 @@
margin: 14px 0; margin: 14px 0;
overflow-x: auto; overflow-x: auto;
font-family: "Consolas", "Courier New", monospace; font-family: "Consolas", "Courier New", monospace;
font-size: 11px; font-size: 16px;
color: #c0c8d2; color: #c0c8d2;
line-height: 1.5; line-height: 1.5;
} }
@@ -302,7 +302,7 @@
border-collapse: collapse; border-collapse: collapse;
width: 100%; width: 100%;
margin: 14px 0; margin: 14px 0;
font-size: 11px; font-size: 16px;
} }
.article th { .article th {
@@ -311,7 +311,7 @@
padding: 6px 10px; padding: 6px 10px;
text-align: left; text-align: left;
text-transform: uppercase; text-transform: uppercase;
font-size: 10px; font-size: 15px;
letter-spacing: 0.05em; letter-spacing: 0.05em;
border-bottom: 1px solid #000; border-bottom: 1px solid #000;
} }
@@ -337,7 +337,7 @@
padding: 4px 10px; padding: 4px 10px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-size: 10px; font-size: 15px;
color: #8a9ab0; color: #8a9ab0;
} }
@@ -350,7 +350,7 @@
left: calc(1rem + env(safe-area-inset-left, 0px)); left: calc(1rem + env(safe-area-inset-left, 0px));
z-index: 9999; z-index: 9999;
font-family: "Verdana", sans-serif; font-family: "Verdana", sans-serif;
font-size: 11px; font-size: 16px;
padding: 5px 11px; padding: 5px 11px;
background: linear-gradient(to bottom, #5d7a9a, #2e4560); background: linear-gradient(to bottom, #5d7a9a, #2e4560);
color: #fff; color: #fff;

View File

@@ -82,7 +82,7 @@
} }
.cover-emblem-inner { .cover-emblem-inner {
font-size: 28px; font-size: 42px;
color: var(--gold); color: var(--gold);
font-weight: 700; font-weight: 700;
letter-spacing: -0.02em; letter-spacing: -0.02em;
@@ -90,7 +90,7 @@
.cover-country { .cover-country {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.3em; letter-spacing: 0.3em;
text-transform: uppercase; text-transform: uppercase;
@@ -99,7 +99,7 @@
} }
.cover-type { .cover-type {
font-size: 24px; font-size: 36px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.12em; letter-spacing: 0.12em;
text-transform: uppercase; text-transform: uppercase;
@@ -108,7 +108,7 @@
} }
.cover-type-de { .cover-type-de {
font-size: 14px; font-size: 21px;
letter-spacing: 0.08em; letter-spacing: 0.08em;
color: rgba(201,168,76,0.6); color: rgba(201,168,76,0.6);
} }
@@ -116,7 +116,7 @@
/* Security watermark pattern */ /* Security watermark pattern */
.cover-watermark { .cover-watermark {
margin-top: 20px; margin-top: 20px;
font-size: 9px; font-size: 14px;
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
color: rgba(201,168,76,0.2); color: rgba(201,168,76,0.2);
letter-spacing: 0.3em; letter-spacing: 0.3em;
@@ -152,7 +152,7 @@
} }
.photo-placeholder { .photo-placeholder {
font-size: 40px; font-size: 60px;
color: var(--ink-light); color: var(--ink-light);
line-height: 1; line-height: 1;
} }
@@ -164,7 +164,7 @@
right: 0; right: 0;
text-align: center; text-align: center;
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 8px; font-size: 12px;
letter-spacing: 0.12em; letter-spacing: 0.12em;
color: var(--ink-light); color: var(--ink-light);
text-transform: uppercase; text-transform: uppercase;
@@ -185,7 +185,7 @@
.field-label { .field-label {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 8px; font-size: 12px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.2em; letter-spacing: 0.2em;
text-transform: uppercase; text-transform: uppercase;
@@ -193,7 +193,7 @@
} }
.field-value { .field-value {
font-size: 14px; font-size: 21px;
color: var(--ink); color: var(--ink);
font-weight: 700; font-weight: 700;
border-bottom: 1px solid var(--ink-light); border-bottom: 1px solid var(--ink-light);
@@ -201,7 +201,7 @@
} }
.field-value-sm { .field-value-sm {
font-size: 12px; font-size: 18px;
font-weight: 400; font-weight: 400;
} }
@@ -210,7 +210,7 @@
background: var(--navy-mid); background: var(--navy-mid);
color: var(--gold); color: var(--gold);
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 11px; font-size: 16px;
letter-spacing: 0.3em; letter-spacing: 0.3em;
padding: 6px 32px; padding: 6px 32px;
display: flex; display: flex;
@@ -226,7 +226,7 @@
.stamps-label { .stamps-label {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 9px; font-size: 14px;
letter-spacing: 0.2em; letter-spacing: 0.2em;
text-transform: uppercase; text-transform: uppercase;
color: var(--ink-light); color: var(--ink-light);
@@ -244,7 +244,7 @@
padding: 6px 12px; padding: 6px 12px;
transform: rotate(-2deg); transform: rotate(-2deg);
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -263,7 +263,7 @@
.observations-header { .observations-header {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 9px; font-size: 14px;
letter-spacing: 0.2em; letter-spacing: 0.2em;
text-transform: uppercase; text-transform: uppercase;
color: var(--ink-light); color: var(--ink-light);
@@ -274,7 +274,7 @@
.content-area h1 { .content-area h1 {
font-family: "Libre Caslon Text", serif; font-family: "Libre Caslon Text", serif;
font-size: 22px; font-size: 33px;
font-weight: 700; font-weight: 700;
color: var(--ink); color: var(--ink);
margin-top: 28px; margin-top: 28px;
@@ -282,7 +282,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 18px; font-size: 27px;
font-weight: 700; font-weight: 700;
color: var(--ink-dim); color: var(--ink-dim);
margin-top: 22px; margin-top: 22px;
@@ -290,7 +290,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--ink-dim); color: var(--ink-dim);
margin-top: 18px; margin-top: 18px;
@@ -298,7 +298,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 13px; font-size: 20px;
font-weight: 700; font-weight: 700;
color: var(--ink-light); color: var(--ink-light);
margin-top: 14px; margin-top: 14px;
@@ -306,7 +306,7 @@
} }
.content-area p { .content-area p {
font-size: 15px; font-size: 22px;
margin-bottom: 12px; margin-bottom: 12px;
color: var(--ink); color: var(--ink);
line-height: 1.7; line-height: 1.7;
@@ -321,7 +321,7 @@
.content-area code { .content-area code {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 13px; font-size: 20px;
background: var(--paper-dark); background: var(--paper-dark);
color: var(--ink-dim); color: var(--ink-dim);
padding: 1px 5px; padding: 1px 5px;
@@ -333,7 +333,7 @@
padding: 12px 16px; padding: 12px 16px;
margin: 12px 0; margin: 12px 0;
overflow-x: auto; overflow-x: auto;
font-size: 13px; font-size: 20px;
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
} }
@@ -363,14 +363,14 @@
.content-area li { .content-area li {
margin-bottom: 5px; margin-bottom: 5px;
font-size: 15px; font-size: 22px;
} }
.content-area table { .content-area table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 12px 0; margin: 12px 0;
font-size: 14px; font-size: 21px;
} }
.content-area th { .content-area th {
@@ -379,7 +379,7 @@
padding: 7px 12px; padding: 7px 12px;
text-align: left; text-align: left;
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 11px; font-size: 16px;
letter-spacing: 0.08em; letter-spacing: 0.08em;
text-transform: uppercase; text-transform: uppercase;
} }
@@ -406,7 +406,7 @@
background: var(--navy); background: var(--navy);
padding: 12px 20px; padding: 12px 20px;
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 12px; font-size: 18px;
color: var(--gold-light); color: var(--gold-light);
letter-spacing: 0.15em; letter-spacing: 0.15em;
overflow-x: auto; overflow-x: auto;
@@ -426,7 +426,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="document"> <div class="document">

View File

@@ -34,7 +34,7 @@
background: linear-gradient(160deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%); background: linear-gradient(160deg, var(--bg-gradient-start) 0%, var(--bg-gradient-end) 100%);
min-height: 100vh; min-height: 100vh;
font-family: "Inter", -apple-system, system-ui, sans-serif; font-family: "Inter", -apple-system, system-ui, sans-serif;
font-size: 15px; font-size: 22px;
line-height: 1.55; line-height: 1.55;
padding: 24px 16px 60px; padding: 24px 16px 60px;
} }
@@ -54,19 +54,19 @@
} }
.nav-back { .nav-back {
font-size: 14px; font-size: 21px;
font-weight: 600; font-weight: 600;
color: rgba(255,255,255,0.7); color: rgba(255,255,255,0.7);
} }
.nav-title { .nav-title {
font-size: 14px; font-size: 21px;
font-weight: 600; font-weight: 600;
color: rgba(255,255,255,0.9); color: rgba(255,255,255,0.9);
} }
.nav-action { .nav-action {
font-size: 14px; font-size: 21px;
font-weight: 600; font-weight: 600;
color: #c39bd3; color: #c39bd3;
} }
@@ -97,7 +97,7 @@
} }
.artwork-letter { .artwork-letter {
font-size: 36px; font-size: 54px;
font-weight: 800; font-weight: 800;
color: rgba(255,255,255,0.9); color: rgba(255,255,255,0.9);
letter-spacing: -0.03em; letter-spacing: -0.03em;
@@ -109,7 +109,7 @@
} }
.episode-show { .episode-show {
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -118,7 +118,7 @@
} }
.episode-title { .episode-title {
font-size: 17px; font-size: 26px;
font-weight: 700; font-weight: 700;
color: #fff; color: #fff;
line-height: 1.25; line-height: 1.25;
@@ -133,13 +133,13 @@
} }
.episode-meta-item { .episode-meta-item {
font-size: 12px; font-size: 18px;
font-weight: 500; font-weight: 500;
color: rgba(255,255,255,0.5); color: rgba(255,255,255,0.5);
} }
.episode-label { .episode-label {
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.12em; letter-spacing: 0.12em;
@@ -207,7 +207,7 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-top: 6px; margin-top: 6px;
font-size: 10px; font-size: 15px;
font-weight: 500; font-weight: 500;
color: rgba(255,255,255,0.35); color: rgba(255,255,255,0.35);
} }
@@ -222,7 +222,7 @@
} }
.ctrl-btn { .ctrl-btn {
font-size: 20px; font-size: 30px;
color: rgba(255,255,255,0.6); color: rgba(255,255,255,0.6);
} }
@@ -234,7 +234,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 20px; font-size: 30px;
color: var(--purple-dark); color: var(--purple-dark);
box-shadow: 0 4px 16px rgba(0,0,0,0.3); box-shadow: 0 4px 16px rgba(0,0,0,0.3);
} }
@@ -252,7 +252,7 @@
} }
.notes-label { .notes-label {
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -261,7 +261,7 @@
} }
.notes-title { .notes-title {
font-size: 20px; font-size: 30px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
line-height: 1.3; line-height: 1.3;
@@ -275,7 +275,7 @@
} }
.notes-meta-chip { .notes-meta-chip {
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
color: var(--purple-mid); color: var(--purple-mid);
background: rgba(100,65,165,0.08); background: rgba(100,65,165,0.08);
@@ -293,7 +293,7 @@
} }
.tag { .tag {
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
color: var(--purple-mid); color: var(--purple-mid);
background: rgba(100,65,165,0.08); background: rgba(100,65,165,0.08);
@@ -307,7 +307,7 @@
/* Content */ /* Content */
.content-area h1 { .content-area h1 {
font-size: 20px; font-size: 30px;
font-weight: 700; font-weight: 700;
color: var(--text); color: var(--text);
margin-top: 28px; margin-top: 28px;
@@ -315,18 +315,18 @@
} }
.content-area h2 { .content-area h2 {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--purple-mid); color: var(--purple-mid);
margin-top: 22px; margin-top: 22px;
margin-bottom: 8px; margin-bottom: 8px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
font-size: 12px; font-size: 18px;
} }
.content-area h3 { .content-area h3 {
font-size: 15px; font-size: 22px;
font-weight: 600; font-weight: 600;
color: var(--text); color: var(--text);
margin-top: 18px; margin-top: 18px;
@@ -334,7 +334,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 14px; font-size: 21px;
font-weight: 600; font-weight: 600;
color: var(--muted); color: var(--muted);
margin-top: 14px; margin-top: 14px;
@@ -342,7 +342,7 @@
} }
.content-area p { .content-area p {
font-size: 15px; font-size: 22px;
margin-bottom: 12px; margin-bottom: 12px;
color: var(--muted); color: var(--muted);
line-height: 1.65; line-height: 1.65;
@@ -360,7 +360,7 @@
.content-area code { .content-area code {
font-family: "SF Mono", "Menlo", monospace; font-family: "SF Mono", "Menlo", monospace;
font-size: 12.5px; font-size: 19px;
background: rgba(100,65,165,0.08); background: rgba(100,65,165,0.08);
color: var(--purple-dark); color: var(--purple-dark);
padding: 2px 6px; padding: 2px 6px;
@@ -379,7 +379,7 @@
background: none; background: none;
color: #e8e4f0; color: #e8e4f0;
padding: 0; padding: 0;
font-size: 13px; font-size: 20px;
} }
.content-area blockquote { .content-area blockquote {
@@ -433,7 +433,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 14px; font-size: 21px;
border-radius: 10px; border-radius: 10px;
overflow: hidden; overflow: hidden;
} }
@@ -442,7 +442,7 @@
background: rgba(100,65,165,0.08); background: rgba(100,65,165,0.08);
padding: 9px 13px; padding: 9px 13px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: var(--purple-mid); color: var(--purple-mid);
text-transform: uppercase; text-transform: uppercase;
@@ -479,13 +479,13 @@
} }
.subscribe-text { .subscribe-text {
font-size: 13px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: rgba(255,255,255,0.8); color: rgba(255,255,255,0.8);
} }
.subscribe-btn { .subscribe-btn {
font-size: 12px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: var(--purple-dark); color: var(--purple-dark);
background: #fff; background: #fff;
@@ -497,7 +497,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="app"> <div class="app">

View File

@@ -26,7 +26,7 @@
background: var(--bg); background: var(--bg);
color: var(--green); color: var(--green);
font-family: "IBM Plex Mono", "Courier New", monospace; font-family: "IBM Plex Mono", "Courier New", monospace;
font-size: 14px; font-size: 21px;
line-height: 1.5; line-height: 1.5;
min-height: 100vh; min-height: 100vh;
} }
@@ -60,7 +60,7 @@
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
font-weight: 700; font-weight: 700;
font-size: 14px; font-size: 21px;
color: var(--green); color: var(--green);
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.05em; letter-spacing: 0.05em;
@@ -89,7 +89,7 @@
color: var(--green); color: var(--green);
margin-top: 24px; margin-top: 24px;
margin-bottom: 8px; margin-bottom: 8px;
font-size: 14px; font-size: 21px;
letter-spacing: 0.08em; letter-spacing: 0.08em;
} }
@@ -118,7 +118,7 @@
.content-area h1 { .content-area h1 {
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
font-size: 14px; font-size: 21px;
letter-spacing: 0.08em; letter-spacing: 0.08em;
color: var(--green); color: var(--green);
padding-left: -7ch; padding-left: -7ch;
@@ -129,7 +129,7 @@
.content-area h2 { .content-area h2 {
font-weight: 700; font-weight: 700;
font-size: 14px; font-size: 21px;
color: var(--green); color: var(--green);
margin-top: 20px; margin-top: 20px;
margin-bottom: 6px; margin-bottom: 6px;
@@ -138,7 +138,7 @@
.content-area h3 { .content-area h3 {
font-weight: 700; font-weight: 700;
font-size: 14px; font-size: 21px;
color: var(--green-dim); color: var(--green-dim);
margin-top: 16px; margin-top: 16px;
margin-bottom: 4px; margin-bottom: 4px;
@@ -214,7 +214,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 12px 0; margin: 12px 0;
font-size: 13px; font-size: 20px;
} }
.content-area th { .content-area th {
@@ -244,7 +244,7 @@
} }
.meta-section { .meta-section {
font-size: 13px; font-size: 20px;
color: var(--green-dim); color: var(--green-dim);
padding-left: 7ch; padding-left: 7ch;
margin-bottom: 16px; margin-bottom: 16px;
@@ -252,7 +252,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="page"> <div class="page">

View File

@@ -29,7 +29,7 @@
min-height: 100vh; min-height: 100vh;
padding: 40px 16px 80px; padding: 40px 16px 80px;
font-family: "Courier Prime", "Courier New", monospace; font-family: "Courier Prime", "Courier New", monospace;
font-size: 14px; font-size: 21px;
line-height: 1.6; line-height: 1.6;
color: var(--ink); color: var(--ink);
} }
@@ -52,7 +52,7 @@
} }
.title-label { .title-label {
font-size: 12px; font-size: 18px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.2em; letter-spacing: 0.2em;
@@ -61,7 +61,7 @@
} }
.title-main { .title-main {
font-size: 28px; font-size: 42px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
@@ -71,14 +71,14 @@
} }
.title-subtitle { .title-subtitle {
font-size: 14px; font-size: 21px;
font-style: italic; font-style: italic;
color: var(--ink-dim); color: var(--ink-dim);
margin-bottom: 40px; margin-bottom: 40px;
} }
.title-byline { .title-byline {
font-size: 14px; font-size: 21px;
color: var(--ink-dim); color: var(--ink-dim);
line-height: 2; line-height: 2;
} }
@@ -86,7 +86,7 @@
/* ACT heading */ /* ACT heading */
.act-heading { .act-heading {
text-align: center; text-align: center;
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.2em; letter-spacing: 0.2em;
@@ -96,7 +96,7 @@
/* Scene heading */ /* Scene heading */
.scene-heading { .scene-heading {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
@@ -109,7 +109,7 @@
font-style: italic; font-style: italic;
color: var(--ink-dim); color: var(--ink-dim);
margin: 12px 64px; margin: 12px 64px;
font-size: 13px; font-size: 20px;
line-height: 1.55; line-height: 1.55;
} }
@@ -121,13 +121,13 @@
letter-spacing: 0.1em; letter-spacing: 0.1em;
margin-top: 20px; margin-top: 20px;
margin-bottom: 4px; margin-bottom: 4px;
font-size: 14px; font-size: 21px;
} }
/* Dialogue */ /* Dialogue */
.dialogue { .dialogue {
margin: 0 80px 16px; margin: 0 80px 16px;
font-size: 14px; font-size: 21px;
line-height: 1.65; line-height: 1.65;
} }
@@ -137,7 +137,7 @@
font-style: italic; font-style: italic;
color: var(--ink-dim); color: var(--ink-dim);
margin-bottom: 4px; margin-bottom: 4px;
font-size: 13px; font-size: 20px;
} }
/* Content area — rendered markdown */ /* Content area — rendered markdown */
@@ -147,7 +147,7 @@
.content-area h1 { .content-area h1 {
text-align: center; text-align: center;
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.2em; letter-spacing: 0.2em;
@@ -157,7 +157,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
@@ -170,7 +170,7 @@
text-align: center; text-align: center;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
font-size: 13px; font-size: 20px;
color: var(--ink-dim); color: var(--ink-dim);
margin-top: 24px; margin-top: 24px;
margin-bottom: 4px; margin-bottom: 4px;
@@ -178,20 +178,20 @@
.content-area h4 { .content-area h4 {
font-style: italic; font-style: italic;
font-size: 13px; font-size: 20px;
color: var(--ink-dim); color: var(--ink-dim);
margin: 8px 64px; margin: 8px 64px;
} }
.content-area h5, .content-area h6 { .content-area h5, .content-area h6 {
font-size: 13px; font-size: 20px;
color: var(--ink-light); color: var(--ink-light);
margin: 8px 0; margin: 8px 0;
} }
.content-area p { .content-area p {
margin: 0 80px 16px; margin: 0 80px 16px;
font-size: 14px; font-size: 21px;
line-height: 1.65; line-height: 1.65;
} }
@@ -202,7 +202,7 @@
.content-area code { .content-area code {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 13px; font-size: 20px;
background: rgba(0,0,0,0.06); background: rgba(0,0,0,0.06);
padding: 1px 4px; padding: 1px 4px;
} }
@@ -225,7 +225,7 @@
font-style: italic; font-style: italic;
color: var(--ink-dim); color: var(--ink-dim);
margin: 12px 64px; margin: 12px 64px;
font-size: 13px; font-size: 20px;
} }
.content-area blockquote::before { .content-area blockquote::before {
@@ -272,7 +272,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 13px; font-size: 20px;
} }
.content-area th { .content-area th {
@@ -280,7 +280,7 @@
padding: 6px 12px; padding: 6px 12px;
border-bottom: 2px solid var(--ink); border-bottom: 2px solid var(--ink);
text-align: left; text-align: left;
font-size: 12px; font-size: 18px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
} }
@@ -299,7 +299,7 @@
border: none; border: none;
margin: 28px 0; margin: 28px 0;
text-align: center; text-align: center;
font-size: 12px; font-size: 18px;
color: var(--ink-light); color: var(--ink-light);
letter-spacing: 0.4em; letter-spacing: 0.4em;
} }
@@ -315,7 +315,7 @@
border-top: 1px solid var(--border); border-top: 1px solid var(--border);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-size: 12px; font-size: 18px;
color: var(--ink-light); color: var(--ink-light);
} }
@@ -328,7 +328,7 @@
} }
.cast-label { .cast-label {
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.2em; letter-spacing: 0.2em;
@@ -345,7 +345,7 @@
} }
.cast-item { .cast-item {
font-size: 12px; font-size: 18px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
color: var(--ink-dim); color: var(--ink-dim);
@@ -363,7 +363,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="script"> <div class="script">

View File

@@ -29,7 +29,7 @@
background: var(--bg); background: var(--bg);
color: var(--text); color: var(--text);
font-family: "Space Grotesk", system-ui, sans-serif; font-family: "Space Grotesk", system-ui, sans-serif;
font-size: 16px; font-size: 24px;
line-height: 1.6; line-height: 1.6;
min-height: 100vh; min-height: 100vh;
} }
@@ -51,7 +51,7 @@
.topbar-logo { .topbar-logo {
font-weight: 700; font-weight: 700;
font-size: 14px; font-size: 21px;
background: linear-gradient(90deg, var(--blue), var(--purple)); background: linear-gradient(90deg, var(--blue), var(--purple));
-webkit-background-clip: text; -webkit-background-clip: text;
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
@@ -60,7 +60,7 @@
} }
.topbar-meta { .topbar-meta {
font-size: 12px; font-size: 18px;
color: var(--muted); color: var(--muted);
font-weight: 500; font-weight: 500;
} }
@@ -74,7 +74,7 @@
.hero-badge { .hero-badge {
display: inline-block; display: inline-block;
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.12em; letter-spacing: 0.12em;
@@ -109,7 +109,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 6px; gap: 6px;
font-size: 13px; font-size: 20px;
color: var(--muted); color: var(--muted);
font-weight: 500; font-weight: 500;
} }
@@ -152,7 +152,7 @@
} }
.metric-value { .metric-value {
font-size: 28px; font-size: 42px;
font-weight: 700; font-weight: 700;
letter-spacing: -0.03em; letter-spacing: -0.03em;
background: linear-gradient(90deg, var(--blue), var(--purple)); background: linear-gradient(90deg, var(--blue), var(--purple));
@@ -162,7 +162,7 @@
} }
.metric-label { .metric-label {
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -178,7 +178,7 @@
/* Section dividers */ /* Section dividers */
.content-area h2 { .content-area h2 {
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.14em; letter-spacing: 0.14em;
@@ -190,7 +190,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 22px; font-size: 33px;
font-weight: 700; font-weight: 700;
letter-spacing: -0.03em; letter-spacing: -0.03em;
color: var(--text); color: var(--text);
@@ -199,7 +199,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 15px; font-size: 22px;
font-weight: 600; font-weight: 600;
color: var(--text); color: var(--text);
margin-top: 20px; margin-top: 20px;
@@ -207,7 +207,7 @@
} }
.content-area h1 { .content-area h1 {
font-size: 32px; font-size: 48px;
font-weight: 700; font-weight: 700;
letter-spacing: -0.03em; letter-spacing: -0.03em;
margin-top: 40px; margin-top: 40px;
@@ -215,7 +215,7 @@
} }
.content-area p { .content-area p {
font-size: 16px; font-size: 24px;
color: #334155; color: #334155;
margin-bottom: 16px; margin-bottom: 16px;
line-height: 1.7; line-height: 1.7;
@@ -233,7 +233,7 @@
.content-area code { .content-area code {
font-family: "Space Mono", monospace; font-family: "Space Mono", monospace;
font-size: 13px; font-size: 20px;
background: #f1f5f9; background: #f1f5f9;
color: var(--purple); color: var(--purple);
padding: 2px 6px; padding: 2px 6px;
@@ -253,7 +253,7 @@
background: none; background: none;
color: inherit; color: inherit;
padding: 0; padding: 0;
font-size: 14px; font-size: 21px;
} }
.content-area blockquote { .content-area blockquote {
@@ -266,7 +266,7 @@
} }
.content-area blockquote p { .content-area blockquote p {
font-size: 18px; font-size: 27px;
font-weight: 500; font-weight: 500;
color: var(--text); color: var(--text);
font-style: italic; font-style: italic;
@@ -310,14 +310,14 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 20px 0; margin: 20px 0;
font-size: 14px; font-size: 21px;
} }
.content-area th { .content-area th {
background: #f8fafc; background: #f8fafc;
padding: 10px 16px; padding: 10px 16px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -351,7 +351,7 @@
} }
.tag { .tag {
font-size: 11px; font-size: 16px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -371,13 +371,13 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
font-size: 12px; font-size: 18px;
color: var(--muted); color: var(--muted);
} }
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<nav class="topbar"> <nav class="topbar">
<div class="topbar-logo">{{ config.site.name }}</div> <div class="topbar-logo">{{ config.site.name }}</div>

View File

@@ -38,7 +38,7 @@
background-size: 32px 32px; background-size: 32px 32px;
color: #1a1a1a; color: #1a1a1a;
font-family: "Kalam", "Caveat", cursive; font-family: "Kalam", "Caveat", cursive;
font-size: 16px; font-size: 24px;
line-height: 1.5; line-height: 1.5;
min-height: 100vh; min-height: 100vh;
padding: 40px 16px 80px; padding: 40px 16px 80px;
@@ -84,7 +84,7 @@
.note-title .note-heading { .note-title .note-heading {
font-family: "Caveat", cursive; font-family: "Caveat", cursive;
font-size: 32px; font-size: 48px;
font-weight: 700; font-weight: 700;
color: #78350f; color: #78350f;
text-align: center; text-align: center;
@@ -93,7 +93,7 @@
} }
.note-title .note-meta { .note-title .note-meta {
font-size: 15px; font-size: 22px;
color: #92400e; color: #92400e;
text-align: center; text-align: center;
} }
@@ -111,7 +111,7 @@
background: var(--blue); background: var(--blue);
padding: 10px 18px; padding: 10px 18px;
transform: rotate(1.2deg); transform: rotate(1.2deg);
font-size: 14px; font-size: 21px;
font-weight: 600; font-weight: 600;
color: #1e40af; color: #1e40af;
box-shadow: 2px 2px 6px rgba(0,0,0,0.1); box-shadow: 2px 2px 6px rgba(0,0,0,0.1);
@@ -141,7 +141,7 @@
.tag-note { .tag-note {
background: var(--pink); background: var(--pink);
padding: 7px 14px; padding: 7px 14px;
font-size: 13px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: var(--pink-dark); color: var(--pink-dark);
box-shadow: 1px 2px 6px rgba(0,0,0,0.1); box-shadow: 1px 2px 6px rgba(0,0,0,0.1);
@@ -218,13 +218,13 @@
line-height: 1.2; line-height: 1.2;
} }
.sticky-block h1 { font-size: 24px; } .sticky-block h1 { font-size: 36px; }
.sticky-block h2 { font-size: 20px; } .sticky-block h2 { font-size: 30px; }
.sticky-block h3 { font-size: 18px; } .sticky-block h3 { font-size: 27px; }
.sticky-block h4, .sticky-block h5, .sticky-block h6 { font-size: 16px; } .sticky-block h4, .sticky-block h5, .sticky-block h6 { font-size: 24px; }
.sticky-block p { .sticky-block p {
font-size: 15px; font-size: 22px;
margin-bottom: 8px; margin-bottom: 8px;
line-height: 1.55; line-height: 1.55;
} }
@@ -236,7 +236,7 @@
.sticky-block code { .sticky-block code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 13px; font-size: 20px;
background: rgba(0,0,0,0.08); background: rgba(0,0,0,0.08);
padding: 1px 4px; padding: 1px 4px;
border-radius: 3px; border-radius: 3px;
@@ -248,7 +248,7 @@
margin: 8px 0; margin: 8px 0;
overflow-x: auto; overflow-x: auto;
border-radius: 4px; border-radius: 4px;
font-size: 12px; font-size: 18px;
} }
.sticky-block pre code { .sticky-block pre code {
@@ -274,14 +274,14 @@
.sticky-block li { .sticky-block li {
margin-bottom: 4px; margin-bottom: 4px;
font-size: 15px; font-size: 22px;
} }
.sticky-block table { .sticky-block table {
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 8px 0; margin: 8px 0;
font-size: 13px; font-size: 20px;
} }
.sticky-block th { .sticky-block th {
@@ -310,7 +310,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="board"> <div class="board">

View File

@@ -31,7 +31,7 @@
background: var(--bg); background: var(--bg);
color: var(--black); color: var(--black);
font-family: "Jost", "Futura", "Century Gothic", "Gill Sans", sans-serif; font-family: "Jost", "Futura", "Century Gothic", "Gill Sans", sans-serif;
font-size: 13px; font-size: 20px;
line-height: 1.45; line-height: 1.45;
min-height: 100vh; min-height: 100vh;
} }
@@ -51,7 +51,7 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.16em; letter-spacing: 0.16em;
text-transform: uppercase; text-transform: uppercase;
@@ -65,7 +65,7 @@
} }
.catalog-brand { .catalog-brand {
font-size: 36px; font-size: 54px;
font-weight: 900; font-weight: 900;
letter-spacing: -0.02em; letter-spacing: -0.02em;
text-transform: uppercase; text-transform: uppercase;
@@ -73,7 +73,7 @@
} }
.catalog-brand-sub { .catalog-brand-sub {
font-size: 11px; font-size: 16px;
font-weight: 500; font-weight: 500;
letter-spacing: 0.2em; letter-spacing: 0.2em;
text-transform: uppercase; text-transform: uppercase;
@@ -87,13 +87,13 @@
.catalog-num-value { .catalog-num-value {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 24px; font-size: 36px;
color: var(--red); color: var(--red);
line-height: 1; line-height: 1;
} }
.catalog-num-label { .catalog-num-label {
font-size: 9px; font-size: 14px;
letter-spacing: 0.16em; letter-spacing: 0.16em;
text-transform: uppercase; text-transform: uppercase;
color: rgba(255,255,255,0.4); color: rgba(255,255,255,0.4);
@@ -108,7 +108,7 @@
} }
.cat-tab { .cat-tab {
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.12em; letter-spacing: 0.12em;
text-transform: uppercase; text-transform: uppercase;
@@ -143,7 +143,7 @@
.product-hero-num { .product-hero-num {
background: var(--red); background: var(--red);
color: #fff; color: #fff;
font-size: 56px; font-size: 84px;
font-weight: 900; font-weight: 900;
letter-spacing: -0.04em; letter-spacing: -0.04em;
writing-mode: vertical-rl; writing-mode: vertical-rl;
@@ -161,7 +161,7 @@
} }
.product-label { .product-label {
font-size: 9px; font-size: 14px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.2em; letter-spacing: 0.2em;
text-transform: uppercase; text-transform: uppercase;
@@ -170,7 +170,7 @@
} }
.product-name { .product-name {
font-size: 28px; font-size: 42px;
font-weight: 900; font-weight: 900;
letter-spacing: -0.02em; letter-spacing: -0.02em;
text-transform: uppercase; text-transform: uppercase;
@@ -193,7 +193,7 @@
} }
.spec-label { .spec-label {
font-size: 8px; font-size: 12px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.14em; letter-spacing: 0.14em;
text-transform: uppercase; text-transform: uppercase;
@@ -201,7 +201,7 @@
} }
.spec-value { .spec-value {
font-size: 13px; font-size: 20px;
font-weight: 700; font-weight: 700;
color: var(--dark-gray); color: var(--dark-gray);
} }
@@ -213,7 +213,7 @@
} }
.tag { .tag {
font-size: 9px; font-size: 14px;
font-weight: 700; font-weight: 700;
letter-spacing: 0.1em; letter-spacing: 0.1em;
text-transform: uppercase; text-transform: uppercase;
@@ -232,7 +232,7 @@
} }
.section-divider-label { .section-divider-label {
font-size: 9px; font-size: 14px;
font-weight: 900; font-weight: 900;
letter-spacing: 0.22em; letter-spacing: 0.22em;
text-transform: uppercase; text-transform: uppercase;
@@ -249,7 +249,7 @@
/* Content area */ /* Content area */
.content-area h1 { .content-area h1 {
font-size: 22px; font-size: 33px;
font-weight: 900; font-weight: 900;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: -0.01em; letter-spacing: -0.01em;
@@ -261,7 +261,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.04em; letter-spacing: 0.04em;
@@ -271,7 +271,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 13px; font-size: 20px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.06em; letter-spacing: 0.06em;
@@ -281,7 +281,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 12px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: var(--mid-gray); color: var(--mid-gray);
margin-top: 14px; margin-top: 14px;
@@ -289,7 +289,7 @@
} }
.content-area p { .content-area p {
font-size: 13px; font-size: 20px;
margin-bottom: 12px; margin-bottom: 12px;
color: var(--dark-gray); color: var(--dark-gray);
line-height: 1.6; line-height: 1.6;
@@ -307,7 +307,7 @@
.content-area code { .content-area code {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 12px; font-size: 18px;
background: var(--cream); background: var(--cream);
color: var(--dark-gray); color: var(--dark-gray);
padding: 1px 5px; padding: 1px 5px;
@@ -321,7 +321,7 @@
margin: 12px 0; margin: 12px 0;
overflow-x: auto; overflow-x: auto;
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 12px; font-size: 18px;
} }
.content-area pre code { .content-area pre code {
@@ -353,7 +353,7 @@
margin-bottom: 5px; margin-bottom: 5px;
color: var(--dark-gray); color: var(--dark-gray);
position: relative; position: relative;
font-size: 13px; font-size: 20px;
} }
.content-area ul li::before { .content-area ul li::before {
@@ -367,7 +367,7 @@
.content-area ol { .content-area ol {
margin: 8px 0 14px 22px; margin: 8px 0 14px 22px;
color: var(--dark-gray); color: var(--dark-gray);
font-size: 13px; font-size: 20px;
} }
.content-area li { .content-area li {
@@ -378,7 +378,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 12px; font-size: 18px;
} }
.content-area th { .content-area th {
@@ -386,7 +386,7 @@
color: #fff; color: #fff;
padding: 8px 12px; padding: 8px 12px;
text-align: left; text-align: left;
font-size: 9px; font-size: 14px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.12em; letter-spacing: 0.12em;
@@ -420,19 +420,19 @@
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
font-size: 10px; font-size: 15px;
letter-spacing: 0.12em; letter-spacing: 0.12em;
text-transform: uppercase; text-transform: uppercase;
} }
@media (max-width: 600px) { @media (max-width: 600px) {
.product-hero { grid-template-columns: 1fr; } .product-hero { grid-template-columns: 1fr; }
.product-hero-num { writing-mode: horizontal-tb; transform: none; padding: 12px 20px; font-size: 36px; } .product-hero-num { writing-mode: horizontal-tb; transform: none; padding: 12px 20px; font-size: 54px; }
} }
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="catalog-header"> <div class="catalog-header">
<div class="catalog-header-top"> <div class="catalog-header-top">

View File

@@ -28,7 +28,7 @@
background: var(--bg); background: var(--bg);
color: var(--green); color: var(--green);
font-family: "IBM Plex Mono", "Courier New", monospace; font-family: "IBM Plex Mono", "Courier New", monospace;
font-size: 14px; font-size: 21px;
line-height: 1.6; line-height: 1.6;
min-height: 100vh; min-height: 100vh;
overflow-x: hidden; overflow-x: hidden;
@@ -99,7 +99,7 @@
.window-title { .window-title {
flex: 1; flex: 1;
text-align: center; text-align: center;
font-size: 12px; font-size: 18px;
color: var(--green-dim); color: var(--green-dim);
letter-spacing: 0.1em; letter-spacing: 0.1em;
} }
@@ -117,7 +117,7 @@
gap: 0; gap: 0;
margin-bottom: 4px; margin-bottom: 4px;
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 20px; font-size: 30px;
text-shadow: 0 0 8px var(--green); text-shadow: 0 0 8px var(--green);
} }
@@ -131,7 +131,7 @@
.ascii-divider { .ascii-divider {
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 16px; font-size: 24px;
color: var(--green-dim); color: var(--green-dim);
margin: 16px 0; margin: 16px 0;
letter-spacing: 0.05em; letter-spacing: 0.05em;
@@ -140,7 +140,7 @@
} }
.output-meta { .output-meta {
font-size: 12px; font-size: 18px;
color: var(--green-dim); color: var(--green-dim);
margin-bottom: 20px; margin-bottom: 20px;
padding-left: 2px; padding-left: 2px;
@@ -168,7 +168,7 @@
.post-title-line { .post-title-line {
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 36px; font-size: 54px;
color: var(--green); color: var(--green);
text-shadow: 0 0 12px var(--green), 0 0 24px rgba(0,255,65,0.4); text-shadow: 0 0 12px var(--green), 0 0 24px rgba(0,255,65,0.4);
line-height: 1.1; line-height: 1.1;
@@ -182,7 +182,7 @@
.content-area h1 { .content-area h1 {
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 30px; font-size: 45px;
color: var(--green); color: var(--green);
text-shadow: 0 0 8px var(--green); text-shadow: 0 0 8px var(--green);
margin-top: 28px; margin-top: 28px;
@@ -195,7 +195,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 16px; font-size: 24px;
color: #00dd44; color: #00dd44;
text-shadow: 0 0 6px #00dd44; text-shadow: 0 0 6px #00dd44;
margin-top: 24px; margin-top: 24px;
@@ -210,7 +210,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 14px; font-size: 21px;
color: var(--green); color: var(--green);
margin-top: 20px; margin-top: 20px;
margin-bottom: 8px; margin-bottom: 8px;
@@ -238,7 +238,7 @@
.content-area code { .content-area code {
font-family: "IBM Plex Mono", monospace; font-family: "IBM Plex Mono", monospace;
font-size: 13px; font-size: 20px;
color: #ffff00; color: #ffff00;
text-shadow: 0 0 4px #ffff00; text-shadow: 0 0 4px #ffff00;
background: rgba(255,255,0,0.07); background: rgba(255,255,0,0.07);
@@ -279,7 +279,7 @@
display: block; display: block;
content: "/* OUTPUT:"; content: "/* OUTPUT:";
color: var(--green-dim); color: var(--green-dim);
font-size: 12px; font-size: 18px;
margin-bottom: 4px; margin-bottom: 4px;
} }
@@ -287,7 +287,7 @@
display: block; display: block;
content: "*/"; content: "*/";
color: var(--green-dim); color: var(--green-dim);
font-size: 12px; font-size: 18px;
margin-top: 4px; margin-top: 4px;
} }
@@ -324,7 +324,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 16px 0; margin: 16px 0;
font-size: 13px; font-size: 20px;
} }
.content-area th { .content-area th {
@@ -332,7 +332,7 @@
padding: 6px 12px; padding: 6px 12px;
color: var(--green); color: var(--green);
text-transform: uppercase; text-transform: uppercase;
font-size: 11px; font-size: 16px;
letter-spacing: 0.1em; letter-spacing: 0.1em;
background: rgba(0,255,65,0.05); background: rgba(0,255,65,0.05);
} }
@@ -359,14 +359,14 @@
display: flex; display: flex;
align-items: center; align-items: center;
font-family: "VT323", monospace; font-family: "VT323", monospace;
font-size: 20px; font-size: 30px;
color: var(--green-dim); color: var(--green-dim);
text-shadow: 0 0 4px var(--green-dim); text-shadow: 0 0 4px var(--green-dim);
} }
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="terminal"> <div class="terminal">
<div class="window-bar"> <div class="window-bar">

View File

@@ -29,7 +29,7 @@
background: #c8b99a; background: #c8b99a;
color: var(--ink); color: var(--ink);
font-family: "Courier Prime", "Courier New", monospace; font-family: "Courier Prime", "Courier New", monospace;
font-size: 15px; font-size: 22px;
line-height: 1.7; line-height: 1.7;
min-height: 100vh; min-height: 100vh;
padding: 40px 20px; padding: 40px 20px;
@@ -92,7 +92,7 @@
} }
.memo-top-line { .memo-top-line {
font-size: 22px; font-size: 33px;
font-weight: 400; font-weight: 400;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.18em; letter-spacing: 0.18em;
@@ -108,7 +108,7 @@
display: grid; display: grid;
grid-template-columns: max-content 1fr; grid-template-columns: max-content 1fr;
gap: 6px 12px; gap: 6px 12px;
font-size: 14px; font-size: 21px;
} }
.memo-field-label { .memo-field-label {
@@ -127,7 +127,7 @@
/* Title typed on a line */ /* Title typed on a line */
.memo-title { .memo-title {
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
font-size: 28px; font-size: 42px;
text-align: center; text-align: center;
color: var(--ink); color: var(--ink);
margin: 32px 0 8px; margin: 32px 0 8px;
@@ -148,7 +148,7 @@
border: 3px solid var(--red-stamp); border: 3px solid var(--red-stamp);
color: var(--red-stamp); color: var(--red-stamp);
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.14em; letter-spacing: 0.14em;
@@ -164,7 +164,7 @@
.content-area h1 { .content-area h1 {
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
font-size: 20px; font-size: 30px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
color: var(--ink); color: var(--ink);
@@ -176,7 +176,7 @@
.content-area h2 { .content-area h2 {
font-family: "Special Elite", monospace; font-family: "Special Elite", monospace;
font-size: 16px; font-size: 24px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
color: var(--ink); color: var(--ink);
@@ -186,7 +186,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--ink-faint); color: var(--ink-faint);
margin-top: 20px; margin-top: 20px;
@@ -194,7 +194,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
color: var(--ink-dim); color: var(--ink-dim);
margin-top: 16px; margin-top: 16px;
@@ -225,7 +225,7 @@
.content-area code { .content-area code {
font-family: "Courier Prime", monospace; font-family: "Courier Prime", monospace;
font-size: 13px; font-size: 20px;
background: rgba(0,0,0,0.06); background: rgba(0,0,0,0.06);
padding: 1px 4px; padding: 1px 4px;
border-bottom: 1px solid var(--ink-dim); border-bottom: 1px solid var(--ink-dim);
@@ -237,7 +237,7 @@
padding: 12px 16px; padding: 12px 16px;
margin: 16px 0; margin: 16px 0;
overflow-x: auto; overflow-x: auto;
font-size: 13px; font-size: 20px;
} }
.content-area pre code { .content-area pre code {
@@ -300,7 +300,7 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 16px 0; margin: 16px 0;
font-size: 13px; font-size: 20px;
} }
.content-area th { .content-area th {
@@ -309,7 +309,7 @@
padding: 6px 12px; padding: 6px 12px;
border: 1px solid var(--ink); border: 1px solid var(--ink);
text-align: left; text-align: left;
font-size: 12px; font-size: 18px;
letter-spacing: 0.06em; letter-spacing: 0.06em;
} }
@@ -329,7 +329,7 @@
text-align: center; text-align: center;
color: var(--ink-dim); color: var(--ink-dim);
margin: 24px 0; margin: 24px 0;
font-size: 18px; font-size: 27px;
letter-spacing: 0.5em; letter-spacing: 0.5em;
} }
@@ -341,7 +341,7 @@
margin-top: 40px; margin-top: 40px;
padding-top: 16px; padding-top: 16px;
border-top: 1px solid var(--ink-dim); border-top: 1px solid var(--ink-dim);
font-size: 12px; font-size: 18px;
color: var(--ink-dim); color: var(--ink-dim);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
@@ -358,7 +358,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="page-wrapper"> <div class="page-wrapper">
<div class="paper"> <div class="paper">
@@ -382,7 +382,7 @@
</div> </div>
{% if taxonomy.tags %} {% if taxonomy.tags %}
<div style="font-size: 12px; color: var(--ink-dim); margin-bottom: 8px; text-align: center; letter-spacing: 0.08em; text-transform: uppercase;"> <div style="font-size: 18px; color: var(--ink-dim); margin-bottom: 8px; text-align: center; letter-spacing: 0.08em; text-transform: uppercase;">
[ {% for tag in taxonomy.tags %}{{ tag }}{% if not loop.last %} / {% endif %}{% endfor %} ] [ {% for tag in taxonomy.tags %}{{ tag }}{% if not loop.last %} / {% endif %}{% endfor %} ]
</div> </div>
{% endif %} {% endif %}

View File

@@ -52,7 +52,7 @@
radial-gradient(ellipse at 80% 50%, rgba(90,61,42,0.5) 0%, transparent 60%); radial-gradient(ellipse at 80% 50%, rgba(90,61,42,0.5) 0%, transparent 60%);
color: var(--text-dark); color: var(--text-dark);
font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 15px; font-size: 22px;
line-height: 1.55; line-height: 1.55;
min-height: 100vh; min-height: 100vh;
} }
@@ -156,7 +156,7 @@
} }
.label-title { .label-title {
font-size: 8px; font-size: 12px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -167,14 +167,14 @@
} }
.label-side { .label-side {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--label-text); color: var(--label-text);
line-height: 1; line-height: 1;
} }
.label-site { .label-site {
font-size: 6px; font-size: 9px;
color: rgba(26,18,8,0.6); color: rgba(26,18,8,0.6);
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -230,7 +230,7 @@
} }
.ctrl { .ctrl {
font-size: 18px; font-size: 27px;
color: rgba(200,180,140,0.7); color: rgba(200,180,140,0.7);
cursor: default; cursor: default;
} }
@@ -243,7 +243,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 14px; font-size: 21px;
color: #fff; color: #fff;
box-shadow: 0 2px 8px rgba(0,0,0,0.4); box-shadow: 0 2px 8px rgba(0,0,0,0.4);
} }
@@ -255,7 +255,7 @@
} }
.track-side-label { .track-side-label {
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.2em; letter-spacing: 0.2em;
@@ -264,7 +264,7 @@
} }
.track-title { .track-title {
font-size: 28px; font-size: 42px;
font-weight: 700; font-weight: 700;
color: var(--cream); color: var(--cream);
letter-spacing: -0.02em; letter-spacing: -0.02em;
@@ -285,7 +285,7 @@
} }
.track-meta-label { .track-meta-label {
font-size: 9px; font-size: 14px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.14em; letter-spacing: 0.14em;
@@ -293,7 +293,7 @@
} }
.track-meta-value { .track-meta-value {
font-size: 14px; font-size: 21px;
font-weight: 500; font-weight: 500;
color: var(--cream); color: var(--cream);
} }
@@ -306,7 +306,7 @@
} }
.track-tag { .track-tag {
font-size: 10px; font-size: 15px;
font-weight: 600; font-weight: 600;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -333,7 +333,7 @@
} }
.liner-label { .liner-label {
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.2em; letter-spacing: 0.2em;
@@ -341,13 +341,13 @@
} }
.liner-catalog { .liner-catalog {
font-size: 11px; font-size: 16px;
color: var(--text-dim); color: var(--text-dim);
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
} }
.content-area h1 { .content-area h1 {
font-size: 22px; font-size: 33px;
font-weight: 700; font-weight: 700;
color: var(--text-dark); color: var(--text-dark);
margin-top: 32px; margin-top: 32px;
@@ -356,18 +356,18 @@
} }
.content-area h2 { .content-area h2 {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--amber); color: var(--amber);
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.08em; letter-spacing: 0.08em;
font-size: 11px; font-size: 16px;
margin-top: 28px; margin-top: 28px;
margin-bottom: 8px; margin-bottom: 8px;
} }
.content-area h3 { .content-area h3 {
font-size: 15px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: var(--text-dark); color: var(--text-dark);
margin-top: 22px; margin-top: 22px;
@@ -375,7 +375,7 @@
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 13px; font-size: 20px;
font-weight: 600; font-weight: 600;
color: var(--text-mid); color: var(--text-mid);
margin-top: 16px; margin-top: 16px;
@@ -383,7 +383,7 @@
} }
.content-area p { .content-area p {
font-size: 15px; font-size: 22px;
margin-bottom: 14px; margin-bottom: 14px;
color: var(--text-mid); color: var(--text-mid);
line-height: 1.7; line-height: 1.7;
@@ -401,7 +401,7 @@
.content-area code { .content-area code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 13px; font-size: 20px;
background: rgba(0,0,0,0.06); background: rgba(0,0,0,0.06);
color: var(--text-dark); color: var(--text-dark);
padding: 2px 6px; padding: 2px 6px;
@@ -415,7 +415,7 @@
padding: 16px 18px; padding: 16px 18px;
margin: 14px 0; margin: 14px 0;
overflow-x: auto; overflow-x: auto;
font-size: 13px; font-size: 20px;
} }
.content-area pre code { .content-area pre code {
@@ -475,14 +475,14 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 14px; font-size: 21px;
} }
.content-area th { .content-area th {
background: rgba(0,0,0,0.06); background: rgba(0,0,0,0.06);
padding: 8px 12px; padding: 8px 12px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: var(--text-dim); color: var(--text-dim);
text-transform: uppercase; text-transform: uppercase;
@@ -514,7 +514,7 @@
border-top: 1px solid var(--border); border-top: 1px solid var(--border);
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
font-size: 11px; font-size: 16px;
color: var(--text-dim); color: var(--text-dim);
} }
@@ -527,7 +527,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="player-layout"> <div class="player-layout">

View File

@@ -31,7 +31,7 @@
background: var(--void); background: var(--void);
color: var(--white); color: var(--white);
font-family: "Space Mono", "Courier New", monospace; font-family: "Space Mono", "Courier New", monospace;
font-size: 14px; font-size: 21px;
line-height: 1.75; line-height: 1.75;
min-height: 100vh; min-height: 100vh;
position: relative; position: relative;
@@ -65,7 +65,7 @@
} }
.site-whisper { .site-whisper {
font-size: 11px; font-size: 16px;
color: var(--dim); color: var(--dim);
letter-spacing: 0.3em; letter-spacing: 0.3em;
text-transform: uppercase; text-transform: uppercase;
@@ -97,7 +97,7 @@
} }
.title-meta span { .title-meta span {
font-size: 11px; font-size: 16px;
color: var(--dim); color: var(--dim);
letter-spacing: 0.15em; letter-spacing: 0.15em;
text-transform: uppercase; text-transform: uppercase;
@@ -110,12 +110,12 @@
} }
.content-area { .content-area {
font-size: 14px; font-size: 21px;
line-height: 1.8; line-height: 1.8;
} }
.content-area h1 { .content-area h1 {
font-size: 22px; font-size: 33px;
font-weight: 700; font-weight: 700;
margin-top: 64px; margin-top: 64px;
margin-bottom: 20px; margin-bottom: 20px;
@@ -123,7 +123,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
margin-top: 48px; margin-top: 48px;
margin-bottom: 16px; margin-bottom: 16px;
@@ -133,7 +133,7 @@
} }
.content-area h3 { .content-area h3 {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
margin-top: 36px; margin-top: 36px;
margin-bottom: 12px; margin-bottom: 12px;
@@ -157,7 +157,7 @@
.content-area code { .content-area code {
font-family: "Space Mono", monospace; font-family: "Space Mono", monospace;
font-size: 12px; font-size: 18px;
background: rgba(255,255,255,0.06); background: rgba(255,255,255,0.06);
padding: 1px 6px; padding: 1px 6px;
border: 1px solid var(--faint); border: 1px solid var(--faint);
@@ -207,14 +207,14 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 24px 0; margin: 24px 0;
font-size: 13px; font-size: 20px;
} }
.content-area th { .content-area th {
border-bottom: 1px solid var(--white); border-bottom: 1px solid var(--white);
padding: 8px 12px; padding: 8px 12px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
color: var(--dim); color: var(--dim);
@@ -247,7 +247,7 @@
} }
.page-footer span { .page-footer span {
font-size: 11px; font-size: 16px;
color: var(--faint); color: var(--faint);
letter-spacing: 0.15em; letter-spacing: 0.15em;
text-transform: uppercase; text-transform: uppercase;
@@ -268,7 +268,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="vertical-line"></div> <div class="vertical-line"></div>

View File

@@ -23,7 +23,7 @@
rgba(0,0,0,0.03) 4px rgba(0,0,0,0.03) 4px
); );
font-family: "Tahoma", "MS Sans Serif", Arial, sans-serif; font-family: "Tahoma", "MS Sans Serif", Arial, sans-serif;
font-size: 11px; font-size: 16px;
min-height: 100vh; min-height: 100vh;
padding: 20px; padding: 20px;
display: flex; display: flex;
@@ -66,7 +66,7 @@
align-items: center; align-items: center;
gap: 6px; gap: 6px;
font-weight: bold; font-weight: bold;
font-size: 11px; font-size: 16px;
} }
.title-bar-icon { .title-bar-icon {
@@ -77,7 +77,7 @@
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 9px; font-size: 14px;
color: #000080; color: #000080;
font-weight: bold; font-weight: bold;
flex-shrink: 0; flex-shrink: 0;
@@ -99,7 +99,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 9px; font-size: 14px;
color: #000000; color: #000000;
cursor: pointer; cursor: pointer;
font-family: "Marlett", "Webdings", sans-serif; font-family: "Marlett", "Webdings", sans-serif;
@@ -115,7 +115,7 @@
.menu-item { .menu-item {
padding: 2px 8px; padding: 2px 8px;
font-size: 11px; font-size: 16px;
cursor: pointer; cursor: pointer;
} }
@@ -144,7 +144,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 10px; font-size: 15px;
cursor: pointer; cursor: pointer;
} }
@@ -163,11 +163,11 @@
display: flex; display: flex;
align-items: center; align-items: center;
gap: 6px; gap: 6px;
font-size: 11px; font-size: 16px;
} }
.address-label { .address-label {
font-size: 11px; font-size: 16px;
color: #000000; color: #000000;
} }
@@ -179,7 +179,7 @@
border-right: 1px solid #ffffff; border-right: 1px solid #ffffff;
border-bottom: 1px solid #ffffff; border-bottom: 1px solid #ffffff;
padding: 1px 4px; padding: 1px 4px;
font-size: 11px; font-size: 16px;
font-family: "Tahoma", Arial, sans-serif; font-family: "Tahoma", Arial, sans-serif;
} }
@@ -204,14 +204,14 @@
background: #000080; background: #000080;
color: #ffffff; color: #ffffff;
padding: 2px 6px; padding: 2px 6px;
font-size: 10px; font-size: 15px;
font-weight: bold; font-weight: bold;
margin-bottom: 4px; margin-bottom: 4px;
} }
.sidebar-item { .sidebar-item {
padding: 2px 6px; padding: 2px 6px;
font-size: 11px; font-size: 16px;
cursor: pointer; cursor: pointer;
display: flex; display: flex;
align-items: center; align-items: center;
@@ -229,7 +229,7 @@
background: #ffff00; background: #ffff00;
border: 1px solid #808080; border: 1px solid #808080;
display: inline-block; display: inline-block;
font-size: 8px; font-size: 12px;
text-align: center; text-align: center;
line-height: 16px; line-height: 16px;
} }
@@ -248,19 +248,19 @@
padding: 6px 12px; padding: 6px 12px;
display: flex; display: flex;
gap: 20px; gap: 20px;
font-size: 10px; font-size: 15px;
color: #444444; color: #444444;
} }
.content-scroll { .content-scroll {
padding: 16px 20px; padding: 16px 20px;
font-size: 12px; font-size: 18px;
line-height: 1.6; line-height: 1.6;
color: #000000; color: #000000;
} }
.content-scroll h1 { .content-scroll h1 {
font-size: 18px; font-size: 27px;
font-weight: bold; font-weight: bold;
margin-bottom: 16px; margin-bottom: 16px;
padding-bottom: 6px; padding-bottom: 6px;
@@ -269,7 +269,7 @@
} }
.content-scroll h2 { .content-scroll h2 {
font-size: 15px; font-size: 22px;
font-weight: bold; font-weight: bold;
margin-top: 20px; margin-top: 20px;
margin-bottom: 8px; margin-bottom: 8px;
@@ -277,7 +277,7 @@
} }
.content-scroll h3 { .content-scroll h3 {
font-size: 13px; font-size: 20px;
font-weight: bold; font-weight: bold;
margin-top: 16px; margin-top: 16px;
margin-bottom: 6px; margin-bottom: 6px;
@@ -298,7 +298,7 @@
.content-scroll code { .content-scroll code {
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 11px; font-size: 16px;
background: #f0f0f0; background: #f0f0f0;
border: 1px solid #c0c0c0; border: 1px solid #c0c0c0;
padding: 0 3px; padding: 0 3px;
@@ -314,7 +314,7 @@
margin: 10px 0; margin: 10px 0;
overflow-x: auto; overflow-x: auto;
font-family: "Courier New", monospace; font-family: "Courier New", monospace;
font-size: 11px; font-size: 16px;
} }
.content-scroll pre code { .content-scroll pre code {
@@ -342,13 +342,13 @@
color: #ffffff; color: #ffffff;
padding: 4px 8px; padding: 4px 8px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
} }
.content-scroll td { .content-scroll td {
border: 1px solid #c0c0c0; border: 1px solid #c0c0c0;
padding: 4px 8px; padding: 4px 8px;
font-size: 11px; font-size: 16px;
} }
.content-scroll tr:nth-child(even) td { .content-scroll tr:nth-child(even) td {
@@ -371,7 +371,7 @@
padding: 2px 6px; padding: 2px 6px;
display: flex; display: flex;
gap: 1px; gap: 1px;
font-size: 10px; font-size: 15px;
} }
.status-pane { .status-pane {
@@ -409,7 +409,7 @@
border-bottom: 2px solid #808080; border-bottom: 2px solid #808080;
padding: 2px 8px; padding: 2px 8px;
font-weight: bold; font-weight: bold;
font-size: 11px; font-size: 16px;
cursor: pointer; cursor: pointer;
height: 24px; height: 24px;
} }
@@ -438,7 +438,7 @@
border-right: 2px solid #ffffff; border-right: 2px solid #ffffff;
border-bottom: 2px solid #ffffff; border-bottom: 2px solid #ffffff;
padding: 0 8px; padding: 0 8px;
font-size: 11px; font-size: 16px;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 4px; gap: 4px;
@@ -452,7 +452,7 @@
border-right: 1px solid #ffffff; border-right: 1px solid #ffffff;
border-bottom: 1px solid #ffffff; border-bottom: 1px solid #ffffff;
padding: 2px 6px; padding: 2px 6px;
font-size: 11px; font-size: 16px;
} }
body { body {
@@ -461,7 +461,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="window"> <div class="window">
<div class="title-bar"> <div class="title-bar">

View File

@@ -39,7 +39,7 @@
background: var(--bg); background: var(--bg);
color: var(--text); color: var(--text);
font-family: "JetBrains Mono", "SF Mono", "Menlo", "Monaco", monospace; font-family: "JetBrains Mono", "SF Mono", "Menlo", "Monaco", monospace;
font-size: 13px; font-size: 20px;
line-height: 1.5; line-height: 1.5;
min-height: 100vh; min-height: 100vh;
overflow-x: hidden; overflow-x: hidden;
@@ -83,7 +83,7 @@
.titlebar-title { .titlebar-title {
flex: 1; flex: 1;
text-align: center; text-align: center;
font-size: 12px; font-size: 18px;
color: var(--muted); color: var(--muted);
} }
@@ -101,7 +101,7 @@
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 10px; font-size: 15px;
color: var(--muted); color: var(--muted);
border: 1px solid rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.08);
} }
@@ -128,7 +128,7 @@
} }
.sidebar-section-header { .sidebar-section-header {
font-size: 10px; font-size: 15px;
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.1em; letter-spacing: 0.1em;
@@ -141,7 +141,7 @@
align-items: center; align-items: center;
gap: 6px; gap: 6px;
padding: 3px 12px; padding: 3px 12px;
font-size: 12px; font-size: 18px;
color: var(--text); color: var(--text);
cursor: default; cursor: default;
} }
@@ -152,7 +152,7 @@
} }
.sidebar-item-icon { .sidebar-item-icon {
font-size: 10px; font-size: 15px;
width: 14px; width: 14px;
text-align: center; text-align: center;
color: var(--blue); color: var(--blue);
@@ -187,7 +187,7 @@
align-items: center; align-items: center;
gap: 7px; gap: 7px;
padding: 0 14px; padding: 0 14px;
font-size: 12px; font-size: 18px;
color: var(--muted); color: var(--muted);
border-right: 1px solid var(--border); border-right: 1px solid var(--border);
white-space: nowrap; white-space: nowrap;
@@ -233,7 +233,7 @@
padding: 16px 12px 16px 8px; padding: 16px 12px 16px 8px;
text-align: right; text-align: right;
color: #4a4a4a; color: #4a4a4a;
font-size: 11px; font-size: 16px;
line-height: 1.8; line-height: 1.8;
user-select: none; user-select: none;
flex-shrink: 0; flex-shrink: 0;
@@ -274,7 +274,7 @@
} }
.content-area h1 { .content-area h1 {
font-size: 16px; font-size: 24px;
font-weight: 700; font-weight: 700;
color: var(--blue); color: var(--blue);
margin-top: 28px; margin-top: 28px;
@@ -288,7 +288,7 @@
} }
.content-area h2 { .content-area h2 {
font-size: 14px; font-size: 21px;
font-weight: 700; font-weight: 700;
color: var(--cyan); color: var(--cyan);
margin-top: 22px; margin-top: 22px;
@@ -302,14 +302,14 @@
} }
.content-area h3 { .content-area h3 {
font-size: 13px; font-size: 20px;
color: var(--yellow); color: var(--yellow);
margin-top: 18px; margin-top: 18px;
margin-bottom: 6px; margin-bottom: 6px;
} }
.content-area h4, .content-area h5, .content-area h6 { .content-area h4, .content-area h5, .content-area h6 {
font-size: 13px; font-size: 20px;
color: var(--muted); color: var(--muted);
margin-top: 14px; margin-top: 14px;
margin-bottom: 4px; margin-bottom: 4px;
@@ -328,7 +328,7 @@
.content-area code { .content-area code {
font-family: "JetBrains Mono", monospace; font-family: "JetBrains Mono", monospace;
font-size: 12px; font-size: 18px;
background: rgba(255,255,255,0.06); background: rgba(255,255,255,0.06);
color: var(--orange); color: var(--orange);
padding: 1px 5px; padding: 1px 5px;
@@ -394,14 +394,14 @@
width: 100%; width: 100%;
border-collapse: collapse; border-collapse: collapse;
margin: 14px 0; margin: 14px 0;
font-size: 12px; font-size: 18px;
} }
.content-area th { .content-area th {
background: rgba(255,255,255,0.05); background: rgba(255,255,255,0.05);
padding: 7px 12px; padding: 7px 12px;
text-align: left; text-align: left;
font-size: 11px; font-size: 16px;
font-weight: 700; font-weight: 700;
color: var(--cyan); color: var(--cyan);
border-bottom: 1px solid var(--border); border-bottom: 1px solid var(--border);
@@ -435,7 +435,7 @@
align-items: center; align-items: center;
padding: 0 12px; padding: 0 12px;
gap: 16px; gap: 16px;
font-size: 11px; font-size: 16px;
color: rgba(255,255,255,0.9); color: rgba(255,255,255,0.9);
flex-shrink: 0; flex-shrink: 0;
} }
@@ -447,7 +447,7 @@
</style> </style>
</head> </head>
<body> <body>
<a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size:0.8rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a> <a href="/{{ preview_query }}" style="position:fixed;top:calc(1rem + env(safe-area-inset-top, 0px));left:calc(1rem + env(safe-area-inset-left, 0px));z-index:9999;font-family:system-ui,-apple-system,sans-serif;font-size: 1.08rem;padding:0.5rem 0.9rem;background:rgba(255,255,255,0.95);color:#000;text-decoration:none;border-radius:999px;box-shadow:0 2px 8px rgba(0,0,0,0.15);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(0,0,0,0.1);transition:transform 0.2s">&larr; back</a>
<div class="xcode-app"> <div class="xcode-app">