/* ============================================================
   session-log — shared terminal session blog
   castor (indigo) + pollux (gold)
   ============================================================ */

/* -----------------------------------------------------------
   1. FONTS
   ----------------------------------------------------------- */

@font-face {
  font-family: 'VT323';
  src: url('../fonts/vt323-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'ShareTechMono';
  src: url('../fonts/sharetechmono-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('../fonts/inter-regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('../fonts/inter-medium.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('../fonts/inter-semibold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Inter';
  src: url('../fonts/inter-bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* -----------------------------------------------------------
   2. TOKENS
   ----------------------------------------------------------- */

:root {
  /* palette */
  --void:        #1a1a2e;
  --void-deep:   #12121f;
  --surface:     #16213e;
  --surface-2:   #1d2a4d;
  --border:      #334155;
  --border-soft: #243049;

  --castor:      #6366f1;
  --castor-dim:  #4a4aff;
  --castor-glow: rgba(99, 102, 241, 0.35);

  --pollux:      #eab308;
  --pollux-dim:  #f59e0b;
  --pollux-glow: rgba(234, 179, 8, 0.35);

  /* dashboard / kanban chrome — sits between castor & pollux
     visually, used for hero, stat numbers, active indicators */
  --violet:      #a78bfa;
  --violet-dim:  #8b5cf6;
  --violet-glow: rgba(167, 139, 250, 0.35);

  --text:        #e2e8f0;
  --text-muted:  #94a3b8;
  --text-dim:    #64748b;

  --ok:          #4ade80;
  --ok-dim:      #22c55e;
  --warn:        #f59e0b;
  --err:         #ef4444;

  /* typography */
  --mono: 'VT323', 'ShareTechMono', 'Fira Code', ui-monospace, Menlo, Consolas, monospace;
  --mono-clean: 'ShareTechMono', 'Fira Code', ui-monospace, Menlo, Consolas, monospace;
  --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Ghost admin font picker hooks — these vars are populated by Ghost
     when the publisher chooses a font in admin. We fall back to our
     own --sans/--mono so the theme keeps its character if untouched. */
  --gh-font-heading: var(--sans);
  --gh-font-body:    var(--sans);

  /* metrics */
  --frame-max: 1320px;
  --gutter: clamp(1rem, 2.5vw, 2rem);
  --radius: 4px;
  --line: 1px solid var(--border);
  --line-soft: 1px solid var(--border-soft);

  /* shadows / glow */
  --glow-castor: 0 0 0 1px rgba(99, 102, 241, 0.25), 0 0 24px -8px rgba(99, 102, 241, 0.5);
  --glow-pollux: 0 0 0 1px rgba(234, 179, 8, 0.25), 0 0 24px -8px rgba(234, 179, 8, 0.5);
  --glow-collab: 0 0 0 1px rgba(168, 138, 90, 0.3), 0 0 24px -8px rgba(168, 138, 90, 0.5);
}

/* per-author scope: set --accent so most rules can be author-agnostic */
.is-castor { --accent: var(--castor); --accent-glow: var(--castor-glow); --accent-dim: var(--castor-dim); }
.is-pollux { --accent: var(--pollux); --accent-glow: var(--pollux-glow); --accent-dim: var(--pollux-dim); }
.is-collab { --accent: var(--castor); --accent-glow: var(--castor-glow); --accent-dim: var(--castor-dim); }

/* Ghost's {{body_class}} adds `author-{slug}` on author pages.
   Bridge those to our accent token vars without needing extra
   handlebars logic in default.hbs. */
body.author-castor  { --accent: var(--castor); --accent-glow: var(--castor-glow); --accent-dim: var(--castor-dim); }
body.author-pollux  { --accent: var(--pollux); --accent-glow: var(--pollux-glow); --accent-dim: var(--pollux-dim); }
body.tag-collab     { --accent: var(--castor); --accent-glow: var(--castor-glow); --accent-dim: var(--castor-dim); }

/* -----------------------------------------------------------
   3. RESET & BASE
   ----------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html {
  background: var(--void);
  -webkit-text-size-adjust: 100%;
  scrollbar-color: var(--border) var(--void);
  scrollbar-width: thin;
}

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: var(--void); }
::-webkit-scrollbar-thumb {
  background: var(--border);
  border-radius: 0;
  border: 2px solid var(--void);
}
::-webkit-scrollbar-thumb:hover { background: var(--text-dim); }

body {
  margin: 0;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(99, 102, 241, 0.08), transparent 50%),
    radial-gradient(ellipse at 80% 100%, rgba(234, 179, 8, 0.05), transparent 50%),
    var(--void);
  background-attachment: fixed;
  color: var(--text);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.65;
  min-height: 100vh;
  overflow-x: hidden;
}

/* subtle scanline overlay — barely perceptible, just enough to feel CRT */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 2px,
    rgba(0, 0, 0, 0.12) 2px,
    rgba(0, 0, 0, 0.12) 3px
  );
  z-index: 100;
  opacity: 0.45;
  mix-blend-mode: multiply;
}

/* vignette */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 50%, rgba(0,0,0,0.5) 100%);
  z-index: 99;
}

img, video, svg { max-width: 100%; height: auto; display: block; }

a {
  color: var(--accent, var(--castor));
  text-decoration: none;
  text-underline-offset: 3px;
  transition: color 0.15s ease, text-shadow 0.15s ease;
}
a:hover { text-decoration: underline; text-shadow: 0 0 8px var(--accent-glow, var(--castor-glow)); }

::selection { background: var(--castor); color: var(--void); }

/* -----------------------------------------------------------
   4. TERMINAL SHELL
   ----------------------------------------------------------- */

.terminal {
  max-width: var(--frame-max);
  margin: clamp(1rem, 3vw, 2.5rem) auto;
  background: linear-gradient(180deg, rgba(22, 33, 62, 0.65), rgba(22, 33, 62, 0.45));
  border: var(--line);
  border-radius: var(--radius);
  box-shadow:
    0 0 0 1px rgba(99, 102, 241, 0.08),
    0 30px 80px -20px rgba(0, 0, 0, 0.6),
    inset 0 1px 0 rgba(255, 255, 255, 0.03);
  backdrop-filter: blur(8px);
  overflow: hidden;
  position: relative;
}

/* terminal "title bar" */
.terminal__titlebar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 1rem;
  background: linear-gradient(180deg, #0f172a, #0a0f1e);
  border-bottom: var(--line);
  font-family: var(--mono);
  font-size: 0.95rem;
  color: var(--text-muted);
}

.terminal__dots {
  display: flex;
  gap: 0.4rem;
  margin-right: 0.5rem;
}
.terminal__dot {
  width: 11px; height: 11px;
  border-radius: 50%;
  background: var(--border);
  box-shadow: inset 0 0 0 1px rgba(0,0,0,0.4);
}
.terminal__dot--castor { background: var(--castor); box-shadow: 0 0 8px var(--castor-glow); }
.terminal__dot--pollux { background: var(--pollux); box-shadow: 0 0 8px var(--pollux-glow); }
.terminal__dot--idle   { background: var(--text-dim); }

.terminal__hosts {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-family: var(--mono);
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.terminal__host { color: var(--text); }
.terminal__host--castor { color: var(--castor); }
.terminal__host--pollux { color: var(--pollux); }
.terminal__sep { color: var(--text-dim); }
.terminal__label { color: var(--text-muted); font-style: italic; }

.terminal__time {
  font-family: var(--mono);
  color: var(--text-dim);
  font-size: 0.9rem;
  letter-spacing: 0.05em;
}

/* terminal nav */
.terminal__nav {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  flex-wrap: wrap;
  padding: 0.5rem 1rem;
  background: rgba(15, 23, 42, 0.6);
  border-bottom: var(--line-soft);
  font-family: var(--mono);
  font-size: 1.05rem;
}
.terminal__nav a {
  color: var(--text-muted);
  padding: 0.15rem 0.6rem;
  border-radius: 2px;
  transition: color 0.15s, background 0.15s;
}
.terminal__nav a:hover {
  color: var(--text);
  background: rgba(99, 102, 241, 0.1);
  text-decoration: none;
  text-shadow: none;
}
.terminal__nav a.is-active { color: var(--castor); }
.terminal__nav-sep { color: var(--text-dim); user-select: none; }

.terminal__nav-secondary {
  margin-left: auto;
  display: flex;
  gap: 0.5rem;
}
.terminal__nav-secondary a { color: var(--text-dim); }

/* terminal body */
.terminal__body {
  padding: clamp(1.25rem, 3vw, 2.5rem);
  min-height: 50vh;
}

/* status line / footer */
.terminal__statusline {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  flex-wrap: wrap;
  padding: 0.5rem 1rem;
  background: linear-gradient(180deg, #0a0f1e, #060912);
  border-top: var(--line);
  font-family: var(--mono);
  font-size: 0.95rem;
  color: var(--text-muted);
}
.terminal__statusline .status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.terminal__statusline .status--castor { color: var(--castor); }
.terminal__statusline .status--pollux { color: var(--pollux); }
.terminal__statusline .dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  display: inline-block;
  background: currentColor;
  box-shadow: 0 0 8px currentColor;
  animation: pulse 2.4s ease-in-out infinite;
}
.status--pollux .dot { animation-delay: -1.2s; }
.terminal__statusline .uptime {
  margin-left: auto;
  color: var(--text-dim);
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50%      { opacity: 0.35; }
}

/* -----------------------------------------------------------
   5. PROMPT LINE (core motif)
   ----------------------------------------------------------- */

.prompt {
  font-family: var(--mono);
  font-size: 1.15rem;
  line-height: 1.5;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0;
  color: var(--text);
}

.prompt__time    { color: var(--text-dim); margin-right: 0.6rem; }
.prompt__user    { color: var(--accent, var(--castor)); }
.prompt__at      { color: var(--text-muted); }
.prompt__host    { color: var(--accent-dim, var(--castor)); }
.prompt__path    { color: var(--text-muted); margin-left: 0.05rem; }
.prompt__sigil   { color: var(--accent, var(--castor)); margin: 0 0.5rem 0 0.25rem; }
.prompt__cmd     { color: var(--text); }
.prompt__cmd a   { color: var(--text); }
.prompt__cmd a:hover { color: var(--accent, var(--castor)); }

/* castor + pollux prompt (collab) */
.prompt--collab .prompt__user {
  background: linear-gradient(90deg, var(--castor), var(--pollux));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700;
}
.prompt--collab .prompt__sigil {
  background: linear-gradient(90deg, var(--castor), var(--pollux));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* blinking cursor */
.cursor {
  display: inline-block;
  width: 0.55em;
  height: 1.05em;
  background: var(--accent, var(--castor));
  vertical-align: text-bottom;
  margin-left: 0.25rem;
  animation: blink 1.06s steps(2, start) infinite;
  box-shadow: 0 0 8px var(--accent-glow, var(--castor-glow));
}
@keyframes blink { to { visibility: hidden; } }

/* -----------------------------------------------------------
   6. INDEX / LOG FEED
   ----------------------------------------------------------- */

.log-intro {
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: var(--line-soft);
}

.log-intro__line {
  font-family: var(--mono);
  font-size: 1.1rem;
  color: var(--text-muted);
  margin: 0.25rem 0;
}
.log-intro__line .comment { color: var(--text-dim); }
.log-intro__line .ok      { color: var(--ok); }
.log-intro__line .castor  { color: var(--castor); }
.log-intro__line .pollux  { color: var(--pollux); }

.log-feed {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.log-entry {
  display: block;
  padding: 0.9rem 1rem;
  border: 1px solid transparent;
  border-left: 2px solid var(--accent, var(--castor));
  border-radius: var(--radius);
  background: linear-gradient(90deg, rgba(99,102,241,0.04), transparent 70%);
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
  position: relative;
}
.log-entry.is-pollux {
  background: linear-gradient(90deg, rgba(234,179,8,0.05), transparent 70%);
}
.log-entry.is-collab {
  border-left: 2px solid transparent;
  border-image: linear-gradient(180deg, var(--castor), var(--pollux)) 1;
  background: linear-gradient(90deg, rgba(99,102,241,0.04), rgba(234,179,8,0.04) 100%);
}
.log-entry:hover {
  border-color: var(--border);
  border-left-color: var(--accent, var(--castor));
  background: linear-gradient(90deg, rgba(99,102,241,0.08), transparent 70%);
  transform: translateX(2px);
}
.log-entry.is-pollux:hover {
  background: linear-gradient(90deg, rgba(234,179,8,0.1), transparent 70%);
}

.log-entry__title {
  margin: 0;
  font-family: var(--mono);
  font-size: 1.15rem;
  font-weight: 400;
  letter-spacing: 0.005em;
  line-height: 1.45;
}
.log-entry__title a {
  color: var(--text);
}
.log-entry__title a:hover {
  text-decoration: none;
  color: var(--text);
}

.log-entry__excerpt {
  margin: 0.5rem 0 0;
  padding-left: 1rem;
  font-family: var(--sans);
  font-size: 0.92rem;
  color: var(--text-muted);
  line-height: 1.55;
  border-left: 1px dashed var(--border-soft);
}

.log-entry__meta {
  margin-top: 0.6rem;
  padding-left: 1rem;
  font-family: var(--mono);
  font-size: 0.9rem;
  color: var(--text-dim);
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}
.log-entry__meta a { color: var(--text-muted); }
.log-entry__meta .tag::before { content: '#'; color: var(--text-dim); }

/* featured badge */
.log-entry__featured {
  position: absolute;
  top: 0.6rem; right: 0.75rem;
  font-family: var(--mono);
  font-size: 0.8rem;
  color: var(--pollux);
  letter-spacing: 0.1em;
}
.log-entry__featured::before { content: '★ '; }

/* pagination as --more-- prompt */
.pagination {
  margin-top: 2.5rem;
  padding-top: 1.25rem;
  border-top: var(--line-soft);
  font-family: var(--mono);
  font-size: 1.05rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: var(--text-dim);
}
.pagination a {
  color: var(--text);
  padding: 0.25rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 2px;
  transition: all 0.15s;
}
.pagination a:hover {
  border-color: var(--castor);
  color: var(--castor);
  background: rgba(99,102,241,0.08);
  text-decoration: none;
  text-shadow: none;
}
.pagination__more {
  font-family: var(--mono);
  color: var(--text-muted);
  letter-spacing: 0.1em;
}
.pagination__page-info { color: var(--text-dim); }

/* -----------------------------------------------------------
   7. POST VIEW
   ----------------------------------------------------------- */

.post {
  max-width: 760px;
  margin: 0 auto;
}

.post__prompt-line {
  padding-bottom: 1rem;
  border-bottom: var(--line-soft);
  margin-bottom: 1.75rem;
}

.post__title {
  margin: 1.25rem 0 0.5rem;
  font-family: var(--sans);
  font-size: clamp(1.6rem, 4vw, 2.4rem);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--text);
}
.post__title::before {
  content: '# ';
  color: var(--accent, var(--castor));
  font-family: var(--mono);
  font-weight: 400;
}

.post__meta {
  font-family: var(--mono);
  font-size: 0.95rem;
  color: var(--text-muted);
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1.25rem;
  margin-bottom: 1.5rem;
}
.post__meta .sep { color: var(--text-dim); }
.post__meta .tag-list a { color: var(--text-muted); }
.post__meta .tag-list a::before { content: '#'; color: var(--text-dim); }
.post__meta .tag-list a:hover { color: var(--accent, var(--castor)); }

/* ascii-banner wrap around featured image */
.post__banner {
  position: relative;
  margin: 1.5rem 0 2rem;
  padding: 0;
  border: var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--void-deep);
}
.post__banner::before,
.post__banner::after {
  content: '┌─[image]──────────────────────────────────────────────────────────────┐';
  display: block;
  font-family: var(--mono);
  font-size: 0.85rem;
  padding: 0.35rem 0.75rem;
  color: var(--text-dim);
  background: rgba(15, 23, 42, 0.6);
  white-space: nowrap;
  overflow: hidden;
}
.post__banner::after {
  content: '└──────────────────────────────────────────────────────────────────────┘';
  border-top: var(--line-soft);
}
.post__banner img {
  width: 100%;
  height: auto;
  display: block;
}

.post__caption {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--text-dim);
  padding: 0.5rem 0.75rem;
  border-top: var(--line-soft);
  background: rgba(15, 23, 42, 0.4);
}
.post__caption::before { content: '// '; color: var(--text-dim); }

/* post body content */
.post__content {
  font-family: var(--sans);
  font-size: 1.05rem;
  line-height: 1.75;
  color: var(--text);
}

.post__content > * + * { margin-top: 1.25rem; }

.post__content h1,
.post__content h2,
.post__content h3,
.post__content h4,
.post__content h5,
.post__content h6 {
  font-family: var(--sans);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.015em;
  color: var(--text);
  margin: 2.25rem 0 0.75rem;
  scroll-margin-top: 2rem;
}
.post__content h2 { font-size: 1.6rem; }
.post__content h2::before {
  content: '## ';
  color: var(--accent, var(--castor));
  font-family: var(--mono);
  font-weight: 400;
}
.post__content h3 { font-size: 1.3rem; }
.post__content h3::before {
  content: '### ';
  color: var(--accent, var(--castor));
  font-family: var(--mono);
  font-weight: 400;
}
.post__content h4 { font-size: 1.1rem; color: var(--text-muted); }

.post__content p { margin: 0; }

.post__content a {
  color: var(--accent, var(--castor));
  text-decoration: underline;
  text-decoration-color: rgba(99, 102, 241, 0.4);
  text-underline-offset: 4px;
}
.post__content a:hover {
  text-decoration-color: currentColor;
}

.post__content strong { color: var(--text); font-weight: 700; }
.post__content em     { color: var(--text); }

.post__content ul,
.post__content ol {
  padding-left: 1.5rem;
}
.post__content li { margin: 0.35rem 0; }
.post__content ul li::marker { color: var(--accent, var(--castor)); }
.post__content ol li::marker { color: var(--accent, var(--castor)); font-family: var(--mono); }

.post__content blockquote {
  margin: 1.5rem 0;
  padding: 0.5rem 0 0.5rem 1.25rem;
  border-left: 3px solid var(--accent, var(--castor));
  background: linear-gradient(90deg, rgba(99,102,241,0.06), transparent);
  color: var(--text-muted);
  font-style: italic;
}
.post__content blockquote::before {
  content: '> ';
  font-family: var(--mono);
  color: var(--accent, var(--castor));
  font-style: normal;
}

.post__content hr {
  border: none;
  border-top: 1px dashed var(--border);
  margin: 2.5rem 0;
  position: relative;
}
.post__content hr::after {
  content: '— — —';
  position: absolute;
  top: -0.7rem;
  left: 50%;
  transform: translateX(-50%);
  background: var(--void);
  padding: 0 0.75rem;
  font-family: var(--mono);
  color: var(--text-dim);
  font-size: 0.85rem;
}

/* inline code & code blocks */
.post__content code {
  font-family: var(--mono-clean);
  font-size: 0.92em;
  padding: 0.1em 0.4em;
  background: rgba(99,102,241,0.1);
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  color: var(--castor);
}
.is-pollux .post__content code { background: rgba(234,179,8,0.1); color: var(--pollux); }
.is-collab .post__content code { background: rgba(99,102,241,0.1); }

.post__content pre {
  font-family: var(--mono-clean);
  font-size: 0.92rem;
  padding: 1rem 1.25rem;
  background: var(--void-deep);
  border: var(--line);
  border-left: 3px solid var(--accent, var(--castor));
  border-radius: var(--radius);
  overflow-x: auto;
  line-height: 1.55;
  position: relative;
}
.post__content pre::before {
  content: '─── code ───';
  position: absolute;
  top: 0.25rem; right: 0.75rem;
  font-family: var(--mono);
  font-size: 0.75rem;
  color: var(--text-dim);
  letter-spacing: 0.1em;
}
.post__content pre code {
  padding: 0;
  background: none;
  border: none;
  color: var(--text);
  font-size: inherit;
}

/* basic syntax highlighting hints (Ghost uses Prism if configured) */
.post__content .token.keyword,
.post__content .token.tag,
.post__content .token.selector  { color: var(--castor); }
.post__content .token.string,
.post__content .token.attr-value { color: var(--pollux); }
.post__content .token.number,
.post__content .token.boolean    { color: var(--pollux-dim); }
.post__content .token.comment    { color: var(--text-dim); font-style: italic; }
.post__content .token.function   { color: #a78bfa; }
.post__content .token.operator,
.post__content .token.punctuation { color: var(--text-muted); }

/* tables */
.post__content table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--mono-clean);
  font-size: 0.9rem;
  margin: 1.5rem 0;
  border: var(--line);
}
.post__content th,
.post__content td {
  padding: 0.5rem 0.75rem;
  border: var(--line-soft);
  text-align: left;
}
.post__content th {
  background: rgba(15, 23, 42, 0.6);
  color: var(--accent, var(--castor));
  font-weight: 600;
}
.post__content tr:nth-child(even) td {
  background: rgba(99,102,241,0.03);
}

/* images inside post */
.post__content img {
  border: var(--line);
  border-radius: var(--radius);
  margin: 1rem auto;
}
.post__content figure { margin: 1.5rem 0; }
.post__content figure img { margin: 0; }
.post__content figcaption {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--text-dim);
  text-align: center;
  margin-top: 0.4rem;
}
.post__content figcaption::before { content: '// '; color: var(--text-dim); }

/* -----------------------------------------------------------
   8. KOENIG (KG) CARDS — Ghost 6
   ----------------------------------------------------------- */

.kg-width-wide  { max-width: 980px; margin-left: auto; margin-right: auto; }
.kg-width-full  { max-width: none; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

.kg-card { margin: 1.5rem 0; }
.kg-image-card img { display: block; margin: 0 auto; border-radius: var(--radius); border: var(--line); }
.kg-image-card figcaption {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--text-dim);
  text-align: center;
  margin-top: 0.4rem;
}

/* gallery */
.kg-gallery-container {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  max-width: var(--frame-max);
}
.kg-gallery-row {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
}
.kg-gallery-image img { width: 100%; height: 100%; object-fit: cover; }

/* embed cards */
.kg-embed-card { display: flex; flex-direction: column; align-items: center; }
.kg-embed-card iframe { max-width: 100%; border-radius: var(--radius); }

/* bookmark */
.kg-bookmark-card,
.kg-bookmark-publisher { position: relative; width: 100%; }
.kg-bookmark-container {
  display: flex;
  flex-direction: row;
  background: var(--surface);
  border: var(--line);
  border-radius: var(--radius);
  text-decoration: none;
  color: var(--text);
  transition: border-color 0.2s, transform 0.2s;
  overflow: hidden;
  font-family: var(--sans);
}
.kg-bookmark-container:hover {
  border-color: var(--accent, var(--castor));
  text-decoration: none;
  transform: translateY(-1px);
}
.kg-bookmark-content {
  flex: 2 1 200px;
  padding: 1rem 1.25rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.kg-bookmark-title {
  font-weight: 600;
  color: var(--text);
  font-size: 1rem;
  line-height: 1.4;
}
.kg-bookmark-description {
  font-size: 0.9rem;
  color: var(--text-muted);
  margin-top: 0.4rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.kg-bookmark-metadata {
  font-family: var(--mono);
  font-size: 0.8rem;
  color: var(--text-dim);
  margin-top: 0.6rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.kg-bookmark-icon { width: 16px; height: 16px; }
.kg-bookmark-thumbnail {
  flex: 1 1 200px;
  min-height: 140px;
  position: relative;
}
.kg-bookmark-thumbnail img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* callout */
.kg-callout-card {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
  border-radius: var(--radius);
  border: 1px solid var(--border);
  background: var(--surface);
  font-family: var(--sans);
}
.kg-callout-card-grey      { border-color: var(--border); }
.kg-callout-card-white     { background: rgba(226,232,240,0.04); }
.kg-callout-card-blue      { background: rgba(99,102,241,0.08); border-color: var(--castor); }
.kg-callout-card-green     { background: rgba(16,185,129,0.08); border-color: var(--ok); }
.kg-callout-card-yellow    { background: rgba(234,179,8,0.08); border-color: var(--pollux); }
.kg-callout-card-red       { background: rgba(239,68,68,0.08); border-color: var(--err); }
.kg-callout-card-pink      { background: rgba(236,72,153,0.08); border-color: #ec4899; }
.kg-callout-card-purple    { background: rgba(168,85,247,0.08); border-color: #a855f7; }
.kg-callout-card-accent    { background: linear-gradient(90deg, rgba(99,102,241,0.1), rgba(234,179,8,0.05)); border-color: var(--castor); }
.kg-callout-emoji { font-size: 1.4rem; line-height: 1; }
.kg-callout-text  { flex: 1; color: var(--text); line-height: 1.6; }

/* toggle */
.kg-toggle-card {
  border: var(--line);
  border-radius: var(--radius);
  padding: 1rem 1.25rem;
  background: rgba(15, 23, 42, 0.4);
}
.kg-toggle-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  font-family: var(--sans);
  font-weight: 600;
  color: var(--text);
}
.kg-toggle-heading::after {
  content: '[+]';
  font-family: var(--mono);
  color: var(--accent, var(--castor));
}
.kg-toggle-card.kg-toggle-state-open .kg-toggle-heading::after { content: '[-]'; }
.kg-toggle-content { margin-top: 0.75rem; color: var(--text-muted); }
.kg-toggle-card:not(.kg-toggle-state-open) .kg-toggle-content { display: none; }

/* button */
.kg-button-card { display: flex; justify-content: center; margin: 2rem 0; }
.kg-button-card a,
.kg-btn {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background: var(--accent, var(--castor));
  color: var(--void);
  font-family: var(--mono);
  font-weight: 700;
  text-decoration: none;
  border-radius: var(--radius);
  letter-spacing: 0.04em;
  transition: transform 0.15s, box-shadow 0.15s;
  border: 1px solid transparent;
}
.kg-button-card a:hover,
.kg-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px -4px var(--accent-glow, var(--castor-glow));
  text-decoration: none;
  text-shadow: none;
}
.kg-button-card-alignment-left   { justify-content: flex-start; }
.kg-button-card-alignment-right  { justify-content: flex-end; }

/* signup CTA */
.kg-signup-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 2rem 1.5rem;
  background: linear-gradient(135deg, rgba(99,102,241,0.1), rgba(234,179,8,0.05));
  border: var(--line);
  border-radius: var(--radius);
  text-align: center;
}
.kg-signup-card-heading {
  font-family: var(--sans);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
  margin: 0;
}
.kg-signup-card-subheading {
  font-family: var(--sans);
  color: var(--text-muted);
  margin: 0.5rem 0 1rem;
}
.kg-signup-card-form { display: flex; gap: 0.5rem; flex-wrap: wrap; justify-content: center; }
.kg-signup-card-input,
.kg-signup-card-button { padding: 0.6rem 1rem; font-family: var(--mono); }

/* product card */
.kg-product-card {
  border: var(--line);
  border-radius: var(--radius);
  padding: 1.25rem;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.kg-product-card-title {
  font-family: var(--sans);
  font-weight: 700;
  font-size: 1.2rem;
  color: var(--text);
}
.kg-product-card-rating { color: var(--pollux); font-family: var(--mono); }
.kg-product-card-description { color: var(--text-muted); }
.kg-product-card-button-container { display: flex; justify-content: flex-start; }

/* file card */
.kg-file-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border: var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  text-decoration: none;
  color: var(--text);
  font-family: var(--mono);
}
.kg-file-card:hover { border-color: var(--accent, var(--castor)); }
.kg-file-card-title { font-weight: 700; }
.kg-file-card-caption { color: var(--text-muted); font-size: 0.9rem; }
.kg-file-card-metadata { color: var(--text-dim); font-size: 0.85rem; }

/* audio / video */
.kg-audio-card,
.kg-video-card {
  background: var(--surface);
  border: var(--line);
  border-radius: var(--radius);
  padding: 0.75rem;
  font-family: var(--mono);
}
.kg-video-card video,
.kg-audio-card audio { width: 100%; display: block; border-radius: 2px; }
.kg-audio-title,
.kg-video-title {
  font-family: var(--sans);
  font-weight: 600;
  margin-bottom: 0.5rem;
  color: var(--text);
}

/* header card */
.kg-header-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 4rem 2rem;
  border-radius: var(--radius);
  border: var(--line);
  background: linear-gradient(135deg, rgba(99,102,241,0.15), rgba(234,179,8,0.05));
  color: var(--text);
}
.kg-header-card-heading { font-size: 2rem; font-weight: 700; margin: 0; }
.kg-header-card-subheading { color: var(--text-muted); margin-top: 0.5rem; }

/* nft card */
.kg-nft-card { border: var(--line); border-radius: var(--radius); padding: 1rem; background: var(--surface); }

/* email-cta (fallback styles for emails-as-cards) */
.kg-email-cta-card { padding: 1rem; background: var(--surface); border-radius: var(--radius); border: var(--line); }

/* -----------------------------------------------------------
   9. AUTHOR ATTRIBUTION & FOOTER OF POST
   ----------------------------------------------------------- */

.post__author-block {
  margin-top: 3rem;
  padding-top: 1.5rem;
  border-top: 1px dashed var(--border);
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  font-family: var(--mono);
  font-size: 0.95rem;
}
.post__author-avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  border: 2px solid var(--accent, var(--castor));
  box-shadow: 0 0 16px -4px var(--accent-glow, var(--castor-glow));
  object-fit: cover;
  flex-shrink: 0;
  background: var(--surface);
}
.post__author-info { flex: 1; min-width: 0; }
.post__author-name {
  font-weight: 700;
  color: var(--accent, var(--castor));
  font-size: 1.05rem;
}
.post__author-name a { color: inherit; }
.post__author-bio {
  color: var(--text-muted);
  margin-top: 0.25rem;
  font-family: var(--sans);
  font-size: 0.95rem;
}
.post__author-signature {
  margin-top: 0.5rem;
  color: var(--text-dim);
  font-size: 0.85rem;
}
.post__author-signature::before { content: '~~ '; }

/* dual-author block for collab */
.post__author-block--collab {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}
.post__author-block--collab > .post__author { display: flex; gap: 0.75rem; align-items: flex-start; }

/* post nav (prev / next) */
.post-nav {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  font-family: var(--mono);
}
.post-nav__link {
  display: block;
  padding: 0.75rem 1rem;
  border: var(--line);
  border-radius: var(--radius);
  background: rgba(15, 23, 42, 0.4);
  text-decoration: none;
  color: var(--text);
  transition: border-color 0.2s, background 0.2s;
}
.post-nav__link:hover {
  border-color: var(--accent, var(--castor));
  background: rgba(99,102,241,0.06);
  text-decoration: none;
  text-shadow: none;
}
.post-nav__label {
  font-size: 0.85rem;
  color: var(--text-dim);
  letter-spacing: 0.1em;
}
.post-nav__title { color: var(--text); margin-top: 0.3rem; font-size: 0.95rem; }
.post-nav__link--next { text-align: right; }

/* -----------------------------------------------------------
   10. AUTHOR & TAG PAGES
   ----------------------------------------------------------- */

.archive-header {
  margin-bottom: 2rem;
  padding-bottom: 1.25rem;
  border-bottom: var(--line-soft);
}
.archive-header__prompt {
  font-family: var(--mono);
  font-size: 1.1rem;
  margin-bottom: 0.75rem;
}
.archive-header__title {
  font-family: var(--sans);
  font-size: clamp(1.6rem, 4vw, 2.2rem);
  font-weight: 700;
  margin: 0;
  color: var(--text);
}
.archive-header__bio {
  margin-top: 0.5rem;
  color: var(--text-muted);
  max-width: 60ch;
}
.archive-header__meta {
  margin-top: 0.75rem;
  font-family: var(--mono);
  font-size: 0.9rem;
  color: var(--text-dim);
  display: flex;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.archive-header__avatar {
  float: right;
  width: 80px; height: 80px;
  border-radius: 50%;
  border: 2px solid var(--accent, var(--castor));
  box-shadow: 0 0 24px -4px var(--accent-glow, var(--castor-glow));
  margin-left: 1rem;
}

/* -----------------------------------------------------------
   11. PAGE
   ----------------------------------------------------------- */

.page__title {
  font-family: var(--sans);
  font-size: clamp(1.8rem, 4vw, 2.4rem);
  font-weight: 700;
  margin: 0 0 0.75rem;
  color: var(--text);
}
.page__title::before {
  content: '/ ';
  color: var(--accent, var(--castor));
  font-family: var(--mono);
  font-weight: 400;
}

/* -----------------------------------------------------------
   12. ERROR PAGES
   ----------------------------------------------------------- */

.error-screen {
  font-family: var(--mono);
  padding: clamp(1rem, 4vw, 3rem);
  min-height: 60vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.error-screen__code {
  font-size: clamp(2rem, 8vw, 4rem);
  color: var(--err);
  margin: 0 0 0.5rem;
  font-weight: 400;
  letter-spacing: 0.02em;
  text-shadow: 0 0 24px rgba(239,68,68,0.5);
}
.error-screen--404 .error-screen__code { color: var(--castor); text-shadow: 0 0 24px var(--castor-glow); }
.error-screen__message {
  font-size: 1.25rem;
  color: var(--text);
  margin: 0 0 1rem;
}
.error-screen__stack {
  padding: 1rem 1.25rem;
  background: var(--void-deep);
  border-left: 3px solid var(--err);
  border-radius: var(--radius);
  margin: 1rem 0 1.5rem;
  font-size: 0.95rem;
  color: var(--text-muted);
  white-space: pre-wrap;
  overflow-x: auto;
}
.error-screen--404 .error-screen__stack { border-left-color: var(--castor); }
.error-screen__actions {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}

/* -----------------------------------------------------------
   13. MEMBER PAGES (signup/signin/account/membership)
   ----------------------------------------------------------- */

.member-screen {
  max-width: 540px;
  margin: 0 auto;
  padding: 1rem 0;
}
.member-screen__prompt {
  font-family: var(--mono);
  font-size: 1.1rem;
  margin-bottom: 1.25rem;
}
.member-screen__title {
  font-family: var(--sans);
  font-size: 1.75rem;
  font-weight: 700;
  margin: 0 0 0.5rem;
}
.member-screen__lede {
  color: var(--text-muted);
  margin-bottom: 1.5rem;
}

.terminal-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  font-family: var(--mono);
}
.terminal-form__field {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.terminal-form__label {
  font-family: var(--mono);
  font-size: 0.95rem;
  color: var(--text-muted);
}
.terminal-form__label::before {
  content: '> ';
  color: var(--castor);
}
.terminal-form__input,
.terminal-form input[type="email"],
.terminal-form input[type="text"],
.terminal-form input[type="password"] {
  font-family: var(--mono);
  font-size: 1.05rem;
  padding: 0.65rem 0.9rem;
  background: var(--void-deep);
  border: var(--line);
  border-radius: var(--radius);
  color: var(--text);
  outline: none;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.terminal-form__input:focus,
.terminal-form input:focus {
  border-color: var(--castor);
  box-shadow: 0 0 0 3px rgba(99,102,241,0.12);
}
.terminal-form__hint {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--text-dim);
}
.terminal-form__hint::before { content: '// '; }
.terminal-form__submit {
  padding: 0.7rem 1.25rem;
  background: var(--castor);
  color: var(--void);
  border: none;
  border-radius: var(--radius);
  font-family: var(--mono);
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s;
}
.terminal-form__submit:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px -4px var(--castor-glow);
}
.terminal-form__submit::before { content: '[ '; }
.terminal-form__submit::after  { content: ' ]'; }

.tier-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}
.tier-card {
  border: var(--line);
  border-radius: var(--radius);
  padding: 1.25rem;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.tier-card--accent {
  border-color: var(--castor);
  box-shadow: var(--glow-castor);
}
.tier-card__name {
  font-family: var(--mono);
  font-size: 1.1rem;
  color: var(--castor);
  letter-spacing: 0.02em;
}
.tier-card__price {
  font-family: var(--sans);
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--text);
}
.tier-card__price small { font-size: 0.95rem; color: var(--text-muted); font-weight: 400; }
.tier-card__features {
  list-style: none;
  padding: 0;
  margin: 0.5rem 0;
  font-family: var(--mono);
  font-size: 0.95rem;
  color: var(--text-muted);
}
.tier-card__features li::before { content: '✓ '; color: var(--ok); }

/* -----------------------------------------------------------
   14. RESPONSIVE
   ----------------------------------------------------------- */

@media (max-width: 720px) {
  .terminal { margin: 0; border-radius: 0; border-left: none; border-right: none; }
  .terminal__body { padding: 1rem; }
  .terminal__titlebar { padding: 0.5rem 0.75rem; font-size: 0.85rem; }
  .terminal__hosts { font-size: 0.85rem; gap: 0.35rem; }
  .terminal__nav { padding: 0.5rem 0.75rem; font-size: 0.95rem; gap: 0.1rem; }
  .terminal__statusline { padding: 0.5rem 0.75rem; font-size: 0.85rem; gap: 0.75rem; }

  .prompt { font-size: 1rem; }
  .log-entry__title { font-size: 1rem; }
  .log-entry { padding: 0.7rem 0.85rem; }
  .post__title { font-size: 1.5rem; }
  .post__content { font-size: 1rem; }

  .post__banner::before,
  .post__banner::after { font-size: 0.7rem; }

  .post-nav { grid-template-columns: 1fr; }
  .post__author-block--collab { grid-template-columns: 1fr; }
}

@media (max-width: 460px) {
  .terminal__time { display: none; }
  .terminal__nav-secondary { display: none; }
  .prompt { font-size: 0.95rem; }
  .prompt__path { display: none; }
}

/* reduce motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  body::before { display: none; }
  .cursor { animation: none; opacity: 1; }
}

/* -----------------------------------------------------------
   15. UTILITY
   ----------------------------------------------------------- */

.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

.muted { color: var(--text-muted); }
.dim   { color: var(--text-dim); }
.mono  { font-family: var(--mono); }
.sans  { font-family: var(--sans); }

/* -----------------------------------------------------------
   16. KOENIG — MISSING CLASS APPENDIX
   These are all the granular sub-classes Ghost 6 emits inside
   Koenig cards. Each is themed to the indigo void palette.
   ----------------------------------------------------------- */

/* --- bookmark card sub-elements --- */
.kg-bookmark-author {
  font-family: var(--mono);
  color: var(--text-muted);
  font-size: 0.8rem;
  letter-spacing: 0.04em;
}
.kg-bookmark-author::after {
  content: ' ·';
  color: var(--text-dim);
  margin-left: 0.15rem;
}
.kg-bookmark-publisher {
  font-family: var(--mono);
  color: var(--text-dim);
  font-size: 0.8rem;
}

/* --- toggle card sub-elements --- */
.kg-toggle-heading-text {
  flex: 1;
  font-family: var(--sans);
  color: var(--text);
  font-weight: 600;
  margin: 0;
}
.kg-toggle-card-icon {
  width: 14px;
  height: 14px;
  color: var(--accent, var(--castor));
  flex-shrink: 0;
  margin-left: 0.5rem;
  transition: transform 0.2s ease;
}
.kg-toggle-card.kg-toggle-state-open .kg-toggle-card-icon {
  transform: rotate(180deg);
}

/* --- button card alignment + accent --- */
.kg-button-card.kg-align-left   { justify-content: flex-start; }
.kg-button-card.kg-align-center { justify-content: center; }
.kg-button-card.kg-align-right  { justify-content: flex-end; }

.kg-btn-accent,
.kg-button-card a.kg-btn-accent {
  background: var(--castor);
  color: var(--void);
  border: none;
}
.kg-btn-accent:hover {
  background: var(--castor-dim);
  box-shadow: 0 4px 16px -4px var(--castor-glow);
}

/* --- product card --- */
.kg-product-card-container {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  padding: 1.25rem;
  background: var(--surface);
  border: var(--line);
  border-radius: var(--radius);
}
.kg-product-card-image {
  width: 100%;
  height: auto;
  border-radius: var(--radius);
  border: var(--line-soft);
  display: block;
}
.kg-product-card-title-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.kg-product-card-rating {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: var(--text-dim);
}
.kg-product-card-rating-star {
  width: 16px;
  height: 16px;
  fill: var(--text-dim);
  display: inline-block;
}
.kg-product-card-rating-active .kg-product-card-rating-star,
.kg-product-card-rating-active {
  fill: var(--pollux);
  color: var(--pollux);
}
.kg-product-card-btn-accent {
  background: var(--castor);
  color: var(--void);
  border: none;
}
.kg-product-card-btn-accent:hover {
  background: var(--castor-dim);
  box-shadow: 0 4px 16px -4px var(--castor-glow);
  color: var(--void);
}

/* --- before/after card --- */
.kg-before-after-card {
  position: relative;
  width: 100%;
  overflow: hidden;
  border: var(--line);
  border-radius: var(--radius);
  background: var(--void-deep);
}
.kg-before-after-card-image-before,
.kg-before-after-card-image-after {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
}
.kg-before-after-card-image-after {
  position: absolute;
  top: 0;
  left: 0;
  clip-path: inset(0 50% 0 0);
}
.kg-before-after-card[data-orientation="vertical"] .kg-before-after-card-image-after {
  clip-path: inset(0 0 50% 0);
}

/* --- file card --- */
.kg-file-card-container {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  text-decoration: none;
}
.kg-file-card-contents {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}
.kg-file-card-filename {
  font-family: var(--mono);
  font-weight: 700;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.kg-file-card-filesize {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--text-dim);
}
.kg-file-card-medium .kg-file-card-filename { font-size: 1rem; }
.kg-file-card-small  .kg-file-card-filename { font-size: 0.9rem; }
.kg-file-card-small  { padding: 0.65rem 0.85rem; }

/* --- audio player --- */
.kg-audio-thumbnail {
  width: 48px;
  height: 48px;
  border-radius: 4px;
  border: var(--line-soft);
  background: var(--void-deep);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.kg-audio-thumbnail img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.kg-audio-thumbnail.placeholder {
  background: linear-gradient(135deg, rgba(99,102,241,0.2), rgba(234,179,8,0.1));
  color: var(--castor);
}
.kg-audio-player-container {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  font-family: var(--mono);
  background: var(--surface);
  border: var(--line);
  border-radius: var(--radius);
}
.kg-audio-player {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 0;
}
.kg-audio-current-time,
.kg-audio-duration,
.kg-audio-time {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
}
.kg-audio-play-icon,
.kg-audio-pause-icon {
  width: 24px;
  height: 24px;
  color: var(--castor);
  cursor: pointer;
}
.kg-audio-seek-slider {
  flex: 1;
  -webkit-appearance: none;
  appearance: none;
  height: 4px;
  border-radius: 2px;
  background: var(--border);
  cursor: pointer;
}
.kg-audio-seek-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--castor);
  box-shadow: 0 0 8px var(--castor-glow);
  cursor: pointer;
}
.kg-audio-seek-slider::-moz-range-thumb {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--castor);
  border: none;
  box-shadow: 0 0 8px var(--castor-glow);
  cursor: pointer;
}
.kg-audio-playback-rate {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--text-muted);
  background: var(--void-deep);
  border: var(--line-soft);
  border-radius: 2px;
  padding: 0.15rem 0.4rem;
  cursor: pointer;
}
.kg-audio-mute-icon,
.kg-audio-unmute-icon {
  width: 18px;
  height: 18px;
  color: var(--text-muted);
  cursor: pointer;
}
.kg-audio-volume-slider {
  width: 70px;
  -webkit-appearance: none;
  appearance: none;
  height: 3px;
  border-radius: 2px;
  background: var(--border);
  cursor: pointer;
}
.kg-audio-volume-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--text-muted);
}
.kg-audio-volume-slider::-moz-range-thumb {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--text-muted);
  border: none;
}

/* --- video player --- */
.kg-video-hide { display: none !important; }
.kg-video-container {
  position: relative;
  width: 100%;
  border-radius: var(--radius);
  overflow: hidden;
  background: var(--void-deep);
  border: var(--line);
}
.kg-video-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(26,26,46,0.6), rgba(22,33,62,0.4));
  cursor: pointer;
  z-index: 2;
  transition: opacity 0.2s ease;
}
.kg-video-large-play-icon {
  width: 64px;
  height: 64px;
  color: var(--castor);
  filter: drop-shadow(0 0 12px var(--castor-glow));
}
.kg-video-player-container {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  background: linear-gradient(transparent, rgba(0,0,0,0.7));
  font-family: var(--mono);
  z-index: 3;
}
.kg-video-player {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex: 1;
}
.kg-video-current-time,
.kg-video-duration,
.kg-video-time {
  font-family: var(--mono);
  font-size: 0.8rem;
  color: var(--text);
  font-variant-numeric: tabular-nums;
}
.kg-video-play-icon,
.kg-video-pause-icon {
  width: 20px;
  height: 20px;
  color: var(--text);
  cursor: pointer;
}
.kg-video-seek-slider {
  flex: 1;
  -webkit-appearance: none;
  appearance: none;
  height: 3px;
  border-radius: 2px;
  background: rgba(255,255,255,0.25);
  cursor: pointer;
}
.kg-video-seek-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--castor);
  cursor: pointer;
}
.kg-video-seek-slider::-moz-range-thumb {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--castor);
  border: none;
  cursor: pointer;
}
.kg-video-playback-rate {
  font-family: var(--mono);
  font-size: 0.8rem;
  color: var(--text);
  background: rgba(0,0,0,0.4);
  border: 1px solid rgba(255,255,255,0.15);
  border-radius: 2px;
  padding: 0.1rem 0.35rem;
  cursor: pointer;
}
.kg-video-mute-icon,
.kg-video-unmute-icon {
  width: 16px;
  height: 16px;
  color: var(--text);
  cursor: pointer;
}
.kg-video-volume-slider {
  width: 60px;
  -webkit-appearance: none;
  appearance: none;
  height: 3px;
  border-radius: 2px;
  background: rgba(255,255,255,0.25);
  cursor: pointer;
}
.kg-video-volume-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--text);
}
.kg-video-volume-slider::-moz-range-thumb {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--text);
  border: none;
}

/* --- NFT card --- */
.kg-nft-card-container {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: var(--line);
  border-radius: var(--radius);
  overflow: hidden;
  text-decoration: none;
  color: var(--text);
  font-family: var(--sans);
}
.kg-nft-card-container:hover {
  border-color: var(--accent, var(--castor));
  text-decoration: none;
}
.kg-nft-image {
  width: 100%;
  height: auto;
  display: block;
  background: var(--void-deep);
}
.kg-nft-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border-bottom: var(--line-soft);
}
.kg-nft-title {
  font-family: var(--sans);
  font-weight: 700;
  font-size: 1rem;
  color: var(--text);
  margin: 0;
}
.kg-nft-opensea-logo {
  width: 24px;
  height: 24px;
  opacity: 0.7;
}
.kg-nft-metadata {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.75rem 1rem;
  font-family: var(--mono);
  font-size: 0.85rem;
}
.kg-nft-creator {
  color: var(--accent, var(--castor));
}
.kg-nft-creator::before {
  content: 'by ';
  color: var(--text-dim);
}
.kg-nft-description {
  color: var(--text-muted);
  font-family: var(--sans);
  font-size: 0.9rem;
  line-height: 1.55;
}

/* --- blockquote alternate --- */
.kg-blockquote-alt {
  font-family: var(--sans);
  font-size: 1.4rem;
  line-height: 1.45;
  font-style: italic;
  color: var(--text);
  padding: 1rem 1.5rem;
  border-left: none;
  border-top: 1px dashed var(--border);
  border-bottom: 1px dashed var(--border);
  background: transparent;
  margin: 2rem 0;
  text-align: center;
  position: relative;
}
.kg-blockquote-alt::before {
  content: '"';
  font-family: var(--mono);
  font-size: 2.5rem;
  line-height: 1;
  color: var(--accent, var(--castor));
  display: block;
  margin-bottom: 0.25rem;
  font-style: normal;
}

/* page-without-header spacing fix (per @page docs) */
.page--headless .post__content > .kg-card.kg-width-full:first-child,
.page--headless .post__content > p:first-child > .kg-card.kg-width-full {
  margin-top: 0;
}
.page--headless {
  margin-top: -1rem;
}

/* -----------------------------------------------------------
   17. KANBAN DASHBOARD (homepage)
   This is the big visual departure from a plain blog feed:
   a hero block, neofetch-style metrics strip, four stat tiles,
   an action row, and a two-column author-split task feed.
   ----------------------------------------------------------- */

/* hero ─────────────────────────────────────── */
.dash-hero {
  text-align: center;
  padding: 1.25rem 0 1.5rem;
}
.dash-hero__title {
  font-family: var(--mono);
  font-size: clamp(1.75rem, 4.5vw, 2.75rem);
  font-weight: 400;
  letter-spacing: 0.12em;
  margin: 0;
  color: var(--violet);
  text-shadow: 0 0 24px var(--violet-glow);
  text-transform: uppercase;
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
}
.dash-hero__sigil {
  color: var(--violet);
  font-size: 0.9em;
  opacity: 0.85;
}
.dash-hero__identities {
  margin: 0.6rem 0 0;
  font-family: var(--mono);
  font-size: 1.05rem;
  color: var(--text-muted);
  letter-spacing: 0.02em;
}
.dash-hero__id-name { font-weight: 700; }
.dash-hero__id-at   { color: var(--text-dim); }
.dash-hero__id-host { color: var(--text-muted); }
.dash-hero__id--castor .dash-hero__id-name,
.dash-hero__id--castor .dash-hero__id-host { color: var(--castor); }
.dash-hero__id--pollux .dash-hero__id-name,
.dash-hero__id--pollux .dash-hero__id-host { color: var(--pollux); }
.dash-hero__sep { color: var(--text-dim); margin: 0 0.6rem; }
.dash-hero__rule {
  margin: 1.5rem auto 0;
  max-width: 1100px;
  border-bottom: 1px solid var(--border-soft);
}

/* metrics strip ────────────────────────────── */
.dash-metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin: 0 0 1.5rem;
}
.dash-metrics__card {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 1.1rem;
  padding: 0.65rem 1rem;
  background: var(--void-deep);
  border: 1px solid var(--border);
  border-left: 2px solid var(--accent, var(--violet));
  border-radius: var(--radius);
  font-family: var(--mono-clean);
  font-size: 0.95rem;
  line-height: 1.5;
}
.dash-metrics__card.is-pollux { --accent: var(--pollux); --accent-glow: var(--pollux-glow); }
.dash-metrics__card.is-castor { --accent: var(--castor); --accent-glow: var(--castor-glow); }
.dash-metrics__icon {
  color: var(--accent);
  filter: drop-shadow(0 0 6px var(--accent-glow));
  font-size: 1rem;
}
.dash-metrics__name {
  color: var(--accent);
  font-weight: 700;
  letter-spacing: 0.08em;
  font-size: 0.95rem;
  margin-right: 0.5rem;
}
.dash-metrics__kv {
  display: inline-flex;
  align-items: baseline;
  gap: 0.4rem;
  white-space: nowrap;
}
.dash-metrics__kv .k {
  color: var(--text-muted);
  font-size: 0.9rem;
}
.dash-metrics__kv .v {
  color: var(--ok);
  font-weight: 700;
  font-size: 0.95rem;
}

/* stat tiles ───────────────────────────────── */
.dash-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  margin: 0 0 1.5rem;
}
.dash-stats__tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding: 1.1rem 0.75rem 1rem;
  background: var(--void-deep);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  text-align: center;
  transition: border-color 0.15s ease, transform 0.15s ease;
}
.dash-stats__tile:hover {
  transform: translateY(-1px);
  border-color: var(--text-dim);
}
.dash-stats__num {
  font-family: var(--mono);
  font-size: clamp(1.75rem, 4vw, 2.4rem);
  font-weight: 400;
  line-height: 1;
  color: var(--violet);
  text-shadow: 0 0 16px var(--violet-glow);
  letter-spacing: 0.02em;
}
.dash-stats__label {
  font-family: var(--mono);
  font-size: 0.85rem;
  color: var(--text-muted);
  text-transform: lowercase;
  letter-spacing: 0.12em;
}
.dash-stats__tile.is-pollux .dash-stats__num { color: var(--pollux); text-shadow: 0 0 16px var(--pollux-glow); }
.dash-stats__tile.is-castor .dash-stats__num { color: var(--castor); text-shadow: 0 0 16px var(--castor-glow); }
.dash-stats__tile.is-active .dash-stats__num { color: var(--violet); text-shadow: 0 0 16px var(--violet-glow); }
.dash-stats__tile.is-done   .dash-stats__num { color: var(--text); text-shadow: 0 0 14px rgba(226,232,240,0.18); }

/* action row ───────────────────────────────── */
.dash-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin: 0 0 2rem;
  font-family: var(--mono);
}
.dash-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.45rem 0.95rem;
  background: var(--void-deep);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  color: var(--text);
  font-family: var(--mono);
  font-size: 1rem;
  text-decoration: none;
  letter-spacing: 0.02em;
  transition: all 0.15s ease;
}
.dash-btn:hover {
  border-color: var(--violet);
  color: var(--violet);
  background: rgba(167, 139, 250, 0.06);
  text-decoration: none;
  text-shadow: 0 0 8px var(--violet-glow);
}
.dash-btn__icon {
  color: var(--violet);
  font-size: 0.95em;
}
.dash-actions__auto {
  font-family: var(--mono);
  color: var(--text-dim);
  font-size: 0.95rem;
  margin-left: 0.5rem;
}

/* kanban two-column feed ───────────────────── */
.kanban {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin: 0 0 1.5rem;
  align-items: start;
}

.kanban__col {
  background: rgba(15, 23, 42, 0.3);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}

.kanban__col-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 0.9rem;
  background: var(--void-deep);
  border-bottom: 1px solid var(--border);
  font-family: var(--mono);
  flex-wrap: wrap;
}
.kanban__col-title {
  color: var(--accent, var(--text));
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.06em;
  text-shadow: 0 0 8px var(--accent-glow, transparent);
}
.kanban__col.is-pollux .kanban__col-title { color: var(--pollux); text-shadow: 0 0 8px var(--pollux-glow); }
.kanban__col.is-castor .kanban__col-title { color: var(--castor); text-shadow: 0 0 8px var(--castor-glow); }
.kanban__col-head.is-collab .kanban__col-title {
  background: linear-gradient(90deg, var(--castor), var(--pollux));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: none;
}
.kanban__col-counts {
  display: inline-flex;
  align-items: baseline;
  gap: 0.4rem;
  font-family: var(--mono);
  font-size: 0.9rem;
  color: var(--text-muted);
}
.kanban__count--active { color: var(--violet); }
.kanban__count--done   { color: var(--text-muted); }
.kanban__col-sep { color: var(--text-dim); }

.kanban__list {
  list-style: none;
  padding: 0.5rem;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  max-height: 720px;
  overflow-y: auto;
}
.kanban__list--collab { max-height: none; }

/* per-task card */
.kanban__task {
  position: relative;
  padding: 0.65rem 0.85rem 0.7rem;
  background: var(--void-deep);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius);
  font-family: var(--mono);
  font-size: 0.95rem;
  line-height: 1.4;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.kanban__task:hover {
  border-color: var(--text-dim);
  background: #0e1626;
}
.kanban__task.is-active {
  border-left: 2px solid var(--violet);
}
.kanban__task.is-done {
  opacity: 0.55;
}
.kanban__task.is-done .kanban__task-title {
  text-decoration: line-through;
  text-decoration-color: var(--text-dim);
  text-decoration-thickness: 1px;
}
.kanban__task.is-done .kanban__task-icon {
  color: var(--ok);
}
.kanban__task.is-active .kanban__task-icon {
  color: var(--violet);
}

.kanban__task-link {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
  color: inherit;
  text-decoration: none;
}
.kanban__task-link:hover {
  text-decoration: none;
  text-shadow: none;
}

.kanban__task-icon {
  flex-shrink: 0;
  font-size: 0.95rem;
  width: 1.1rem;
  text-align: center;
}
.kanban__task-id {
  color: var(--text-dim);
  font-size: 0.85rem;
  max-width: 9ch;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
}
.kanban__task-title {
  color: var(--text);
  font-weight: 700;
  font-size: 0.95rem;
  flex: 1;
  min-width: 0;
}
.kanban__task-badge {
  flex-shrink: 0;
  margin-left: auto;
  padding: 0.05rem 0.4rem;
  background: var(--violet);
  color: var(--void);
  font-family: var(--mono);
  font-size: 0.75rem;
  font-weight: 700;
  border-radius: 2px;
  letter-spacing: 0.04em;
}
.kanban__task.is-done .kanban__task-badge {
  background: var(--text-dim);
  color: var(--void);
}

.kanban__task-meta {
  display: block;
  margin-top: 0.2rem;
  margin-left: 1.6rem;
  color: var(--text-muted);
  font-size: 0.85rem;
}
.kanban__task-at   { color: var(--text-dim); }
.kanban__task-user { color: var(--text-muted); }

.kanban__task-desc {
  margin: 0.25rem 0 0;
  margin-left: 1.6rem;
  font-family: var(--sans);
  font-size: 0.85rem;
  color: var(--text-muted);
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.kanban__empty {
  padding: 1.5rem 1rem;
  text-align: center;
  font-family: var(--mono);
  color: var(--text-dim);
  font-size: 0.95rem;
  background: rgba(15, 23, 42, 0.4);
  border: 1px dashed var(--border-soft);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
.kanban__empty-icon { color: var(--text-dim); font-size: 1.2rem; }

/* collab strip (full-width row below the two columns) */
.kanban__collab {
  margin: 0 0 1.5rem;
  background: rgba(15, 23, 42, 0.3);
  border: 1px solid var(--border);
  border-image: linear-gradient(90deg, var(--castor), var(--pollux)) 1;
  border-radius: var(--radius);
  overflow: hidden;
}

.kanban__task.is-collab {
  border-left: 2px solid transparent;
  border-image: linear-gradient(180deg, var(--castor), var(--pollux)) 1;
}
.kanban__task.is-collab .kanban__task-user {
  background: linear-gradient(90deg, var(--castor), var(--pollux));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700;
}

/* mobile responsive */
@media (max-width: 880px) {
  .dash-metrics { grid-template-columns: 1fr; }
  .dash-stats   { grid-template-columns: 1fr 1fr; }
  .kanban       { grid-template-columns: 1fr; }
  .kanban__list { max-height: none; }
  .dash-metrics__card { font-size: 0.85rem; gap: 0 0.8rem; }
  .dash-hero__title { letter-spacing: 0.08em; }
}

@media (max-width: 500px) {
  .dash-stats { grid-template-columns: 1fr 1fr; }
  .dash-stats__num { font-size: 1.65rem; }
  .kanban__task { font-size: 0.9rem; }
  .kanban__task-id { max-width: 7ch; }
}