/* ════════════════════════════════════════════════════════════════════════
   theme.css (served as /breakcore.css for backward-compat links)
   Light · monospace · MONOCHROME (black / white / grey accents only).
   Abstract, flat, no glow, minimal motion. Small web monochrome style,
   in the spirit of the otomir23 webring (starkow / senko / cerf / immz).
   Can be loaded after lq.css — overrides --lq-* tokens for admin surfaces.
   ════════════════════════════════════════════════════════════════════════ */

/* admin only (body.lc): lowercase all UI text/buttons;
   keep real case for inputs, code and markdown previews (editable/content) */
@font-face{
  font-family:'UptrixTitle';
  src:url('/uptrix-title.ttf') format('truetype');
  font-display:swap;
}

body.lc, body.lc *{ text-transform: lowercase !important; }
body.lc input, body.lc textarea, body.lc code, body.lc pre,
body.lc .bc-md, body.lc #preview, body.lc .preview-box, body.lc #bio-preview{
  text-transform: none !important;
}

/* ── tokens (names kept stable so admin inline styles keep resolving) ──── */
:root,
[data-theme="light"]{
  --bc-bg:        #f8fafc;
  --bc-bg-2:      #ffffff;
  --bc-panel:     #ffffff;
  --bc-panel-2:   #f1f5f9;
  --bc-line:      #d8e0ea;
  --bc-line-soft: #e7edf4;
  --bc-ink:       #0a0a0a;
  --bc-green:     #0a0a0a;
  --bc-magenta:   #0a0a0a;
  --bc-cyan:      #0a0a0a;
  --bc-amber:     #0a0a0a;
  --bc-text:      #111827;
  --bc-text-dim:  #4b5563;
  --bc-text-faint:#7b8794;
  --bc-title:     'UptrixTitle', 'Arial Narrow', var(--bc-mono);
  --bc-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
  --bc-sans: var(--bc-mono);

  /* liquid-ui overrides */
  --lq-font: var(--bc-mono);
  --lq-accent: #0a0a0a;
  --lq-accent-press: #2a2a2a;
  --lq-on-accent: #ffffff;
  --lq-text: #111827;
  --lq-text-2: #4b5563;
  --lq-text-3: #7b8794;
  --lq-glass-fill:        #ffffff;
  --lq-glass-fill-strong: #ffffff;
  --lq-glass-fill-clear:  rgba(255,255,255,.72);
  --lq-thumb-fill: #f1f5f9;
  --lq-solid: #ffffff;
  --lq-solid-strong: #f8fafc;
  --lq-fill-2: #f1f5f9;
  --lq-fill-3: #e7edf4;
  --lq-sep: #d8e0ea;
  --lq-rim: inset 0 0 0 1px #d8e0ea;
  --lq-rim-strong: inset 0 0 0 1px #171717;
  --lq-blur: 0px; --lq-blur-strong: 0px;
  --lq-r-xs: 4px; --lq-r-sm: 5px; --lq-r-md: 6px;
  --lq-r-lg: 7px; --lq-r-xl: 8px; --lq-r-pill: 999px;
}

/* ── base ────────────────────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html, body{
  margin:0;
  background: #f8fafc !important;
  color: var(--bc-text);
  font-family: var(--bc-mono);
}
body{ background-image: none !important; }

/* shared page shell used by secondary pages and admin */
.bg-stars{ position:fixed; inset:0; z-index:0; pointer-events:none; opacity:1;
  background-repeat:repeat, repeat, repeat, no-repeat;
  background-size:64px 64px, 44px 44px, 44px 44px, 100% 100%;
  background-position:0 0, 0 0, 0 0, 0 0;
  background-image:
    url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2764%27%20height%3D%2764%27%20viewBox%3D%270%200%2064%2064%27%20shape-rendering%3D%27crispEdges%27%3E%3Cg%20fill%3D%27%23475569%27%20opacity%3D%27.12%27%3E%3Cg%20transform%3D%27translate%281.42%201.42%29%20scale%28.027%29%27%3E%3Crect%20x%3D%22510%22%20y%3D%22150%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22180%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22210%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22240%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22270%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22300%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22330%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22570%22%20y%3D%22330%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22420%22%20y%3D%22360%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22570%22%20y%3D%22360%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22420%22%20y%3D%22390%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22600%22%20y%3D%22390%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22360%22%20y%3D%22420%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22600%22%20y%3D%22420%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22300%22%20y%3D%22450%22%20width%3D%22150%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22630%22%20y%3D%22450%22%20width%3D%22150%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22210%22%20y%3D%22480%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22690%22%20y%3D%22480%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22120%22%20y%3D%22510%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22780%22%20y%3D%22510%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22150%22%20y%3D%22540%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22750%22%20y%3D%22540%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22210%22%20y%3D%22570%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22690%22%20y%3D%22570%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22300%22%20y%3D%22600%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22660%22%20y%3D%22600%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22360%22%20y%3D%22630%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22630%22%20y%3D%22630%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22420%22%20y%3D%22660%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22600%22%20y%3D%22660%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22420%22%20y%3D%22690%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22570%22%20y%3D%22690%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22720%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22570%22%20y%3D%22720%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22750%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22780%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22810%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22840%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22870%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22510%22%20y%3D%22900%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3C%2Fg%3E%3Cg%20transform%3D%27translate%2833.42%2033.42%29%20scale%28.027%29%27%3E%3Crect%20x%3D%22510%22%20y%3D%22150%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22180%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22210%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22240%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22270%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22300%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22330%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22570%22%20y%3D%22330%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22420%22%20y%3D%22360%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22570%22%20y%3D%22360%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22420%22%20y%3D%22390%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22600%22%20y%3D%22390%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22360%22%20y%3D%22420%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22600%22%20y%3D%22420%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22300%22%20y%3D%22450%22%20width%3D%22150%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22630%22%20y%3D%22450%22%20width%3D%22150%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22210%22%20y%3D%22480%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22690%22%20y%3D%22480%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22120%22%20y%3D%22510%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22780%22%20y%3D%22510%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22150%22%20y%3D%22540%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22750%22%20y%3D%22540%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22210%22%20y%3D%22570%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22690%22%20y%3D%22570%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22300%22%20y%3D%22600%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22660%22%20y%3D%22600%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22360%22%20y%3D%22630%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22630%22%20y%3D%22630%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22420%22%20y%3D%22660%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22600%22%20y%3D%22660%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22420%22%20y%3D%22690%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22570%22%20y%3D%22690%22%20width%3D%2290%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22720%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22570%22%20y%3D%22720%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22750%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22450%22%20y%3D%22780%22%20width%3D%22180%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22810%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22840%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22480%22%20y%3D%22870%22%20width%3D%22120%22%20height%3D%2230%22%2F%3E%3Crect%20x%3D%22510%22%20y%3D%22900%22%20width%3D%2260%22%20height%3D%2230%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3Cpath%20d%3D%27M0%2063.5H64M63.5%200V64%27%20stroke%3D%27%23475569%27%20stroke-opacity%3D%27.07%27%2F%3E%3C%2Fsvg%3E"),
    linear-gradient(90deg, rgba(71,85,105,.055) 1px, transparent 1px),
    linear-gradient(0deg, rgba(71,85,105,.055) 1px, transparent 1px),
    linear-gradient(135deg, rgba(71,85,105,.06), rgba(248,250,252,0) 38%, rgba(71,85,105,.04) 68%, rgba(248,250,252,0));
  animation:starsDrift 16s linear infinite; will-change:background-position; }
.bg-stars::after{ content:""; position:absolute; inset:0;
  background:repeating-linear-gradient(135deg, transparent 0 46px, rgba(71,85,105,.055) 47px, transparent 48px, transparent 92px);
  opacity:.55; }
@keyframes starsDrift{
  from{ background-position:0 0, 0 0, 0 0, 0 0 }
  to{ background-position:64px 64px, 0 0, 0 0, 0 0 }
}
@media (prefers-reduced-motion: reduce){ .bg-stars{ animation:none } }

.col-frame{ position:fixed; top:0; bottom:0; left:50%; transform:translateX(-50%);
  width:min(680px,100%); pointer-events:none; z-index:0;
  border-left:1px solid var(--bc-line-soft); border-right:1px solid var(--bc-line-soft);
  background:rgba(248,250,252,.8); }
.site-wrap{ width:100%; max-width:640px; position:relative; z-index:1;
  padding-top:calc(28px + env(safe-area-inset-top)); }
.site-page{ min-height:100svh; color:var(--bc-text); font-family:var(--bc-mono);
  display:flex; flex-direction:column; align-items:center;
  padding:0 20px calc(40px + env(safe-area-inset-bottom)); overflow-x:hidden; font-size:14px; }
.site-page a{ color:inherit; }
.page-head{ display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding-bottom:18px; border-bottom:1px solid var(--bc-line); margin-bottom:34px; }
.page-title{ font-family:var(--bc-title); font-size:clamp(34px,8vw,52px); font-weight:700; letter-spacing:0;
  line-height:1; color:#0a0a0a; }
.page-title a{ color:inherit; text-decoration:none; }
.page-title a:hover{ color:#000; }
.page-note{ margin-top:16px; color:var(--bc-text-dim); line-height:1.7; font-size:13px; }
.page-section{ margin-top:40px; }
.page-label{ color:var(--bc-text-faint); font-size:13px; margin-bottom:14px; }
.site-footer{ width:100%; max-width:640px; margin-top:50px; position:relative; z-index:1;
  padding-top:18px; border-top:1px solid var(--bc-line);
  display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
  font-size:12px; color:var(--bc-text-faint); }
.site-footer a:hover{ color:#000; }

/* blog index */
.blog-wrap .page-head{ margin-bottom:32px; }
.blog-wrap .page-label{ margin:0; align-self:flex-end; }
.blog-hero{ margin-bottom:24px; }
.blog-kicker{ color:var(--bc-text-faint); font-size:13px; margin-bottom:12px; }
.blog-title{ font-family:var(--bc-mono); font-size:clamp(24px,5vw,34px); line-height:1.16;
  color:#0a0a0a; letter-spacing:0; font-weight:700; margin:0; }
.blog-note{ margin-top:10px; color:var(--bc-text-dim); line-height:1.7; font-size:13px; max-width:52ch; }
.blog-list{ display:grid; gap:10px; margin-top:0; }
.blog-card{ min-height:92px; display:grid; grid-template-columns:92px 1fr 28px; gap:14px;
  align-items:start; padding:15px 16px; background:#ffffff; border-radius:6px; text-decoration:none;
  box-shadow:inset 0 0 0 1px var(--bc-line); transition:box-shadow .12s, transform .12s; }
.blog-card:hover{ box-shadow:inset 0 0 0 1px #171717; transform:translateY(-1px); }
.blog-card:active{ transform:translateY(0); }
.blog-card-meta{ color:var(--bc-text-faint); font-size:12px; line-height:1.45; padding-top:2px; }
.blog-card-body{ min-width:0; display:grid; gap:7px; }
.blog-card-title{ color:#0a0a0a; font-size:15px; font-weight:700; line-height:1.35;
  overflow-wrap:anywhere; }
.blog-card-excerpt{ color:var(--bc-text-dim); font-size:13px; line-height:1.65;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.blog-card-arrow{ width:28px; height:28px; display:grid; place-items:center; align-self:center;
  color:var(--bc-text-faint); font-size:13px; border-radius:5px; box-shadow:inset 0 0 0 1px var(--bc-line); }
.blog-card:hover .blog-card-arrow{ color:#0a0a0a; box-shadow:inset 0 0 0 1px #171717; }
.blog-empty{ background:#ffffff; border-radius:6px; box-shadow:inset 0 0 0 1px var(--bc-line);
  padding:28px 16px; text-align:center; color:var(--bc-text-faint); font-size:13px; }
.blog-footer{ margin-top:42px; }
@media(max-width:560px){
  .blog-card{ grid-template-columns:1fr 28px; gap:8px 12px; padding:14px; }
  .blog-card-meta{ grid-column:1 / -1; padding-top:0; }
  .blog-card-body{ grid-column:1; }
  .blog-card-arrow{ grid-column:2; grid-row:2; }
}

/* kill decorative glow/gradient backdrops + all entrance motion */
.backdrop, .blob{ display: none !important; }
body::after{ content: none !important; }
#loader, #page-loader{ background: #f8fafc !important; }
.content-fade, .content{
  opacity: 1 !important; filter: none !important;
  transform: none !important; transition: none !important;
}

/* ── liquid-ui reskin (flat, monochrome) ─────────────────────────────── */
.lq-card, .lq-glass, .lq-glass-strong{
  background: #ffffff !important;
  border-radius: 6px !important;
  box-shadow: inset 0 0 0 1px var(--bc-line) !important;
  -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
.lq-card::before, .lq-glass::before, .lq-glass-strong::before,
.lq-refract::before, .lq-refract::after{ display:none !important; }

.lq-btn{
  font-family: var(--bc-mono) !important; font-weight: 500 !important;
  letter-spacing: 0; border-radius: 5px !important; text-transform: none !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
.lq-btn--accent{ background: #0a0a0a !important; color: #ffffff !important; box-shadow: none !important; }
.lq-btn--accent:hover{ background: #2a2a2a !important; }
.lq-btn:not(.lq-btn--accent){
  background: #ffffff !important; color: #171717 !important;
  box-shadow: inset 0 0 0 1px var(--bc-line) !important;
}
.lq-btn:not(.lq-btn--accent):hover{ box-shadow: inset 0 0 0 1px #171717 !important; }

.h-icon, .app-icon{ background: #0a0a0a !important; box-shadow: none !important; border-radius: 5px !important; }
.h-icon svg path, .app-icon svg path{ fill: #ffffff !important; stroke: #ffffff !important; }

.h-badge, .badge{
  font-family: var(--bc-mono) !important; border-radius: 4px !important;
  text-transform: uppercase; letter-spacing:.4px;
  background: #f1f5f9 !important; color: #4b5563 !important;
}
.badge-pub{ background:#ffffff !important; color:#171717 !important; box-shadow:inset 0 0 0 1px var(--bc-line); }

.tabs{ background: #ffffff !important; border-radius: 6px !important; box-shadow: inset 0 0 0 1px var(--bc-line) !important; }
.tab{ font-family: var(--bc-mono) !important; border-radius: 4px !important; text-transform: none !important; }
.tab.active{ background: #0a0a0a !important; color: #ffffff !important; box-shadow:none !important; }

.inp-field, .code-inp, .inp-group, textarea, input[type=text], input[type=url]{
  font-family: var(--bc-mono) !important; border-radius: 5px !important;
  background: #ffffff !important;
  box-shadow: inset 0 0 0 1px var(--bc-line) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
.inp-field:focus, .code-inp:focus, .inp-group:focus-within{ box-shadow: inset 0 0 0 1px #171717 !important; }
.email-addr, .nly-sub-email{ color: #171717 !important; }

::selection{ background:#0a0a0a; color:#ffffff; }

/* strip any former breakcore effects */
.bc-cursor{ display:none !important; }
.bc-glitch::before, .bc-glitch::after{ content:none !important; display:none !important; }
.bc-glitch{ color: var(--bc-text) !important; }

/* ── markdown / bio prose ────────────────────────────────────────────── */
.bc-md{ color: var(--bc-text); font-family: var(--bc-mono); line-height:1.75; font-size:14px; }
.bc-md > *:first-child{ margin-top:0 } .bc-md > *:last-child{ margin-bottom:0 }
.bc-md p{ margin:.6em 0 } .bc-md strong{ color:#000; font-weight:700 } .bc-md em{ color:#000; font-style:italic }
.bc-md a{ color:#000; text-decoration:underline; text-underline-offset:3px; text-decoration-color:#94a3b8 }
.bc-md a:hover{ text-decoration-color:#000 }
.bc-md h1,.bc-md h2,.bc-md h3{ color:#000; margin:1.2em 0 .4em; letter-spacing:0; font-weight:700 }
.bc-md h2::before,.bc-md h3::before{ content:'// '; color:var(--bc-text-faint); font-weight:400 }
.bc-md ul,.bc-md ol{ margin:.5em 0; padding-left:1.4em }
.bc-md li{ margin:.2em 0 } .bc-md ul li::marker{ content:'– '; color:var(--bc-text-faint) }
.bc-md code{ background:#f1f5f9; color:#000; padding:1px 5px; border-radius:4px;
  box-shadow:inset 0 0 0 1px var(--bc-line); font-size:.92em }
.bc-md pre{ background:#ffffff; border-radius:6px; padding:12px 14px; overflow:auto;
  box-shadow:inset 0 0 0 1px var(--bc-line); margin:.7em 0 }
.bc-md pre code{ background:none; box-shadow:none; padding:0 }
.bc-md blockquote{ border-left:2px solid #cbd5e1; padding-left:12px; margin:.6em 0; color:var(--bc-text-dim) }
.bc-md hr{ border:none; border-top:1px solid var(--bc-line); margin:1.1em 0 }

/* ── webring strip (flat, monochrome) ────────────────────────────────── */
.ring{ width:100%; }
.ring-bar{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.ring-title{ font-family:var(--bc-mono); font-size:12px; color:var(--bc-text-faint); }
.ring-title b{ color:var(--bc-text); font-weight:500 }
.ring-nav{ display:flex; gap:6px; }
.ring-nav button, .ring-nav a{
  font-family:var(--bc-mono); font-size:15px; line-height:1; cursor:pointer;
  background:#ffffff; color:var(--bc-text); text-decoration:none;
  border:none; box-shadow:inset 0 0 0 1px var(--bc-line);
  width:30px; height:28px; border-radius:5px; display:grid; place-items:center;
  transition: box-shadow .12s; }
.ring-nav button:hover, .ring-nav a:hover{ box-shadow:inset 0 0 0 1px #171717; }
.ring-track{
  display:flex; gap:8px; overflow-x:auto; scroll-snap-type:x mandatory;
  padding-bottom:8px; scrollbar-width:thin; scrollbar-color:#cbd5e1 transparent; }
.ring-track::-webkit-scrollbar{ height:6px }
.ring-track::-webkit-scrollbar-thumb{ background:#cbd5e1; border-radius:3px }
.ring-card{
  scroll-snap-align:start; flex:0 0 auto; width:148px;
  display:flex; align-items:center; gap:9px; padding:10px 11px;
  background:rgba(255,255,255,.68); border-radius:6px; text-decoration:none;
  box-shadow:inset 0 0 0 1px var(--bc-line);
  transition: box-shadow .12s; }
.ring-card:hover, .ring-card.is-me{ box-shadow:inset 0 0 0 1px #171717; }
.ring-fav{ width:22px; height:22px; border-radius:4px; object-fit:contain; flex-shrink:0;
  background:#f1f5f9; box-shadow:inset 0 0 0 1px var(--bc-line); filter:grayscale(1) contrast(1.08); }
.ring-meta{ min-width:0; display:flex; flex-direction:column; gap:1px; }
.ring-name{ font-family:var(--bc-mono); font-size:12px; color:var(--bc-text);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ring-host{ font-family:var(--bc-mono); font-size:10px; color:var(--bc-text-faint);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* admin and generated blog pages */
body.lc{
  min-height:100svh !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  padding:0 20px calc(40px + env(safe-area-inset-bottom)) !important;
  overflow-x:hidden !important;
}
body.lc .content-fade{
  width:100% !important;
  max-width:640px !important;
  margin:0 auto !important;
  z-index:1 !important;
  display:flex !important;
  flex-direction:column !important;
  flex:1 0 auto !important;
  padding-top:calc(28px + env(safe-area-inset-top)) !important;
}
body.lc header{
  position:relative !important;
  top:auto !important;
  z-index:1 !important;
  width:100% !important;
  height:auto !important;
  padding:0 0 18px !important;
  margin:0 0 24px !important;
  background:transparent !important;
  border:0 !important;
  border-bottom:1px solid var(--bc-line) !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
body.lc main{
  width:100% !important;
  max-width:640px !important;
  margin:0 auto !important;
  padding:0 0 64px !important;
  z-index:1 !important;
}
body.lc .h-left{ gap:10px !important; }
body.lc .h-icon, body.lc .app-icon{
  width:32px !important;
  height:32px !important;
  border-radius:5px !important;
}
body.lc .h-icon svg{ width:18px !important; height:18px !important; }
body.lc .h-sep{ display:none !important; }
body.lc .h-name{
  font-family:var(--bc-mono) !important;
  font-size:16px !important;
  letter-spacing:0 !important;
  color:inherit !important;
  text-decoration:none !important;
}
body.lc .h-page, body.lc .h-badge{
  font-family:var(--bc-mono) !important;
  font-size:12px !important;
  letter-spacing:0 !important;
}
body.lc .login-card{
  max-width:360px !important;
  margin:auto 0 !important;
  padding:28px !important;
}
body.lc.login-page{
  justify-content:center !important;
}
body.lc.login-page .content-fade{
  max-width:none !important;
  min-height:calc(100svh - 40px - env(safe-area-inset-bottom)) !important;
  padding-top:0 !important;
  justify-content:center !important;
  align-items:center !important;
}
body.lc.login-page .login-card{
  margin:0 auto !important;
}
body.lc .section{
  background:#ffffff !important;
  border-radius:6px !important;
  box-shadow:inset 0 0 0 1px var(--bc-line) !important;
}
body.lc .section-head{
  padding:16px 18px !important;
  border-bottom:1px solid var(--bc-line) !important;
}
body.lc .section-title, body.lc .post-t, body.lc .email-addr,
body.lc .metric-count, body.lc .kpi-val{
  font-family:var(--bc-mono) !important;
  letter-spacing:0 !important;
}
body.lc .section-body{ padding:18px !important; }
body.lc .btn-edit{
  background:#ffffff !important;
  color:#171717 !important;
  box-shadow:inset 0 0 0 1px var(--bc-line) !important;
  border-radius:5px !important;
}
body.lc .btn-edit:hover{ box-shadow:inset 0 0 0 1px #171717 !important; }
body.lc .btn-del{
  background:#ffffff !important;
  color:#171717 !important;
  box-shadow:inset 0 0 0 1px var(--bc-line) !important;
  border-radius:5px !important;
}
body.lc .btn-del:hover{ color:#000 !important; box-shadow:inset 0 0 0 1px #171717 !important; }
body.lc .btn-ghost, body.lc .h-back{
  background:#ffffff !important;
  color:#171717 !important;
  box-shadow:inset 0 0 0 1px var(--bc-line) !important;
  border:0 !important;
  border-radius:5px !important;
}
body.lc .btn-ghost:hover, body.lc .h-back:hover{ box-shadow:inset 0 0 0 1px #171717 !important; }
body.lc .meta-card, body.lc .preview-box, body.lc textarea{
  background:#ffffff !important;
  border:0 !important;
  border-radius:6px !important;
  box-shadow:inset 0 0 0 1px var(--bc-line) !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
body.lc .btn{
  background:#0a0a0a !important;
  color:#ffffff !important;
  border-radius:5px !important;
  box-shadow:none !important;
}
body.lc .track{
  border-radius:999px !important;
  background:#f1f5f9 !important;
  border:1px solid var(--bc-line) !important;
}
body.lc input:checked+.track{ background:#0a0a0a !important; border-color:#0a0a0a !important; }

/* admin shell */
body.admin-login,
body.admin-dashboard,
body.admin-editor{
  justify-content:flex-start !important;
}
body.admin-login .col-frame{ width:min(420px,100%) !important; }
body.admin-dashboard .col-frame,
body.admin-editor .col-frame{ width:min(900px,100%) !important; }
body.admin-login main.admin-login-wrap{
  max-width:360px !important;
  min-height:100svh !important;
  padding-top:calc(28px + env(safe-area-inset-top)) !important;
  padding-bottom:calc(40px + env(safe-area-inset-bottom)) !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
}
body.admin-dashboard main.admin-wrap,
body.admin-editor main.admin-editor-wrap{
  max-width:860px !important;
  padding-top:calc(28px + env(safe-area-inset-top)) !important;
  padding-bottom:64px !important;
}
.admin-login-wrap .page-head,
.admin-wrap .page-head,
.admin-editor-wrap .page-head{
  align-items:flex-end;
}
.admin-login-wrap .page-label,
.admin-wrap .page-label,
.admin-editor-wrap .page-label{ margin:0; }
.admin-card{
  background:#ffffff !important;
  border-radius:6px !important;
  box-shadow:inset 0 0 0 1px var(--bc-line) !important;
}
.admin-login .login-card{
  width:100% !important;
  max-width:360px !important;
  margin:0 auto !important;
  padding:28px !important;
}
.admin-login .app-icon{ display:none !important; }
.admin-login .login-title{
  font-family:var(--bc-mono) !important;
  font-size:17px !important;
  letter-spacing:0 !important;
  color:#0a0a0a !important;
  margin:0 0 6px !important;
}
.admin-login .login-sub{
  font-family:var(--bc-mono) !important;
  font-size:12px !important;
  color:var(--bc-text-faint) !important;
  margin:0 0 22px !important;
}
.admin-login .code-section{ margin-top:12px !important; }
.admin-login .hint{ font-family:var(--bc-mono) !important; color:var(--bc-text-faint) !important; }
.admin-login .hint span{ color:#0a0a0a !important; text-decoration:underline; text-underline-offset:3px; }
.admin-dashboard .tabs-wrap{
  margin:0 0 18px !important;
  overflow-x:auto !important;
  scrollbar-width:thin !important;
  scrollbar-color:#cbd5e1 transparent !important;
}
.admin-dashboard .tabs{
  border-radius:6px !important;
  padding:4px !important;
  gap:4px !important;
  background:#ffffff !important;
}
.admin-dashboard .tab{
  min-height:32px !important;
  border-radius:4px !important;
  white-space:nowrap !important;
}
.admin-dashboard .tab-panel{ margin-top:0; }
.admin-dashboard .section{ margin-bottom:16px !important; }
.admin-dashboard .lq-card:not(.section){
  padding:16px !important;
  border-radius:6px !important;
}
.admin-dashboard .kpi-row,
.admin-dashboard .fd-kpi-row{ gap:10px !important; }
.admin-dashboard .two-col{ gap:16px !important; }
.admin-dashboard canvas{ max-width:100% !important; }
.admin-editor .editor-wrap{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:14px !important;
}
.admin-editor .editor-col,
.admin-editor .preview-col{ min-width:0 !important; }
.admin-editor textarea,
.admin-editor .preview-box{ min-height:440px !important; }
.admin-editor .actions{ margin-top:0 !important; }
@media(max-width:760px){
  body.admin-dashboard main.admin-wrap,
  body.admin-editor main.admin-editor-wrap{ max-width:640px !important; }
  .admin-editor .editor-wrap{ grid-template-columns:1fr !important; }
  .admin-editor .preview-col.show{ display:flex !important; }
  .admin-dashboard .kpi-row,
  .admin-dashboard .fd-kpi-row,
  .admin-dashboard .two-col{ grid-template-columns:1fr !important; }
}

body.blog-page, body.post-page, body.not-found-page{
  min-height:100svh !important;
  color:var(--bc-text) !important;
  font-family:var(--bc-mono) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  padding:0 20px calc(40px + env(safe-area-inset-bottom)) !important;
  overflow-x:hidden !important;
}
body.blog-page .content-fade,
body.post-page .content-fade,
body.not-found-page .content-fade{
  width:100% !important;
  max-width:640px !important;
  padding-top:calc(28px + env(safe-area-inset-top)) !important;
  z-index:1 !important;
}
body.blog-page header,
body.post-page header,
body.not-found-page header{
  position:relative !important;
  height:auto !important;
  padding:0 0 18px !important;
  margin:0 0 34px !important;
  background:transparent !important;
  border:0 !important;
  border-bottom:1px solid var(--bc-line) !important;
  box-shadow:none !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
body.blog-page main, body.post-page main, body.not-found-page main{
  max-width:640px !important;
  width:100% !important;
  padding:0 0 64px !important;
}
body.blog-page .h-sep, body.post-page .h-sep, body.not-found-page .h-sep{ display:none !important; }
body.blog-page h1, body.post-page h1.post-title{
  font-family:var(--bc-mono) !important;
  letter-spacing:0 !important;
  color:#0a0a0a !important;
}
body.blog-page .post-card, body.post-page .post-body, body.not-found-page .nf-card{
  background:#ffffff !important;
  border:0 !important;
  border-radius:6px !important;
  box-shadow:inset 0 0 0 1px var(--bc-line) !important;
  -webkit-backdrop-filter:none !important;
  backdrop-filter:none !important;
}
body.post-page .md p, body.post-page .md li{ font-family:var(--bc-mono) !important; color:var(--bc-text-dim) !important; }
body.post-page .md a{ color:#000 !important; text-decoration:underline !important; text-underline-offset:3px !important; }
body.not-found-page .code{ color:#0a0a0a !important; text-shadow:none !important; }