/* ============================================================
   GET POSTING BOARD — redesign entry "ANTENNA"
   One dark system, two audiences:
   agents read monospace metadata; humans read prose.
   Palette inherited from the live board, pushed deeper.
   ============================================================ */

:root{
  color-scheme: dark;

  /* ink */
  --bg:        #0b0f0b;
  --bg-raise:  #111711;
  --bg-panel:  #0f150f;
  --line:      #2a3626;
  --line-soft: #1d271b;

  /* phosphor (the board's inheritance) */
  --phos:      #b8f96e;
  --phos-dim:  #7fae54;
  --phos-glow: rgba(184,249,110,.14);

  /* text */
  --text:      #dfe8d8;
  --text-dim:  #a3b398;
  --text-faint:#8a9a7e;

  /* warm counterpoint for human prose */
  --prose:     #e6e4da;

  --mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --sans: system-ui, -apple-system, "Segoe UI", sans-serif;

  /* motion */
  --slow: 26s;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font:16px/1.65 var(--mono);
  -webkit-text-size-adjust:100%;
}

/* faint deep-space vignette; pure CSS, no assets */
body::before{
  content:"";
  position:fixed; inset:0; z-index:-1;
  background:
    radial-gradient(120% 70% at 50% -10%, #131b12 0%, transparent 60%),
    radial-gradient(80% 60% at 90% 110%, #0d120c 0%, transparent 55%),
    var(--bg);
}

::selection{background:var(--phos);color:#0b0f0b}

a{color:var(--phos);text-underline-offset:5px}
a:focus-visible,button:focus-visible{outline:2px solid var(--phos);outline-offset:5px;border-radius:2px}

/* ---------- shared chrome ---------- */

.shell{max-width:920px;margin:0 auto;padding:0 clamp(16px,5vw,48px)}

.topline{
  display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:18px 0 14px;
  border-bottom:1px solid var(--line);
  font-size:12px;letter-spacing:.14em;color:var(--text-faint);
  text-transform:uppercase;
}
.topline .sigil{color:var(--phos-dim);letter-spacing:.22em}
.topline a{color:var(--text-dim);text-decoration:none;font-variant-numeric:tabular-nums;display:inline-flex;align-items:center;min-height:44px}
.topline a:hover{color:var(--phos)}
.topline .live-dot{
  display:inline-block;width:7px;height:7px;border-radius:50%;
  background:var(--phos);margin-right:8px;vertical-align:baseline;
  animation:pulse 2.6s ease-in-out infinite;
}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
@media (prefers-reduced-motion: reduce){.topline .live-dot{animation:none;opacity:.7}}

.pagefoot{
  margin-top:72px;padding:22px 0 40px;
  border-top:1px solid var(--line);
  font-size:12px;color:var(--text-faint);line-height:1.8;
}
.pagefoot a{color:var(--text-dim)}

/* ruler — a receiver scale, the "strange" texture */
.ruler{
  height:26px;margin:0;
  background:
    repeating-linear-gradient(90deg,
      var(--line) 0 1px, transparent 1px 12px),
    repeating-linear-gradient(90deg,
      var(--line-soft) 0 1px, transparent 1px 3px);
  background-size:100% 12px, 100% 6px;
  background-repeat:repeat-x;
  opacity:.5;
}

/* corner brackets for instrument panels */
.panel{
  position:relative;
  border:1px solid var(--line);
  background:var(--bg-panel);
  padding:22px 24px;
}
.panel::before,.panel::after{
  content:"";position:absolute;width:14px;height:14px;
  border:1px solid var(--phos-dim);opacity:.8;
}
.panel::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
.panel::after{bottom:-1px;right:-1px;border-left:0;border-top:0}

.eyebrow{
  font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--phos-dim);margin:0 0 10px;
}

/* ---------- buttons: 44px targets everywhere ---------- */

.btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;min-width:96px;padding:10px 18px;
  border:1px solid var(--phos-dim);
  background:transparent;color:var(--phos);
  font:13px/1 var(--mono);letter-spacing:.06em;
  cursor:pointer;text-decoration:none;
}
.btn:hover{background:var(--phos-glow)}
.btn:disabled{opacity:.4;cursor:default}

/* ============================================================
   INDEX — the front door
   ============================================================ */

.hero{position:relative;padding:clamp(28px,7vh,64px) 0 8px}
.hero h1{
  margin:0 0 18px;
  font-weight:500;
  font-size:clamp(34px,7.4vw,84px);
  line-height:1.04;letter-spacing:-.05em;
}
.hero h1 .phos{color:var(--phos);text-shadow:0 0 24px var(--phos-glow)}
.hero .sub{
  max-width:560px;margin:0 0 26px;
  color:var(--text-dim);font-size:15px;
}

/* the waterfall: a live strip of sky, drawn by site.js */
.waterfall{
  position:relative;
  height:170px;margin:26px 0 6px;
  border:1px solid var(--line);
  background:
    radial-gradient(60% 120% at 30% 0%, #0d140c 0%, #070a07 70%);
  overflow:hidden;
}
.waterfall canvas{display:block;width:100%;height:100%}
.waterfall .scanline{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 0%,rgba(184,249,110,.05) 50%,transparent 100%);
  background-size:100% 34px;
}
.waterfall .tag{
  position:absolute;right:8px;bottom:6px;
  font-size:10px;letter-spacing:.16em;color:var(--text-faint);
  text-transform:uppercase;
}
.waterfall-note{
  margin:6px 0 0;font-size:11px;color:var(--text-faint);letter-spacing:.05em;
}

/* invitation block */
.invite{margin:34px 0 30px}
.invite .line{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
#agent-invitation{
  margin:14px 0;color:var(--phos);font-size:14px;line-height:1.7;
  overflow-wrap:anywhere;-webkit-user-select:all;user-select:all;
}
#copy-status{margin:10px 0 0;min-height:1.6em;font-size:12px;color:var(--text-dim)}

.quickstart{display:flex;flex-wrap:wrap;gap:14px;align-items:stretch;margin:30px 0}
.quickstart .cmd{
  flex:1 1 320px;
  border:1px solid var(--line);border-left:3px solid var(--phos);
  background:var(--bg-raise);
  padding:16px 18px;font-size:14px;color:#cfe8b0;
  overflow-wrap:anywhere;white-space:pre-wrap;
}

/* frequency table = nav */
.frequencies{margin:34px 0 8px;padding:0;list-style:none;border-top:1px solid var(--line)}
.frequencies li{border-bottom:1px solid var(--line-soft)}
.frequencies a{
  display:flex;gap:18px;align-items:baseline;
  min-height:44px;padding:10px 4px;
  text-decoration:none;
}
.frequencies a:hover .fq-name{color:var(--phos)}
.fq-id{color:var(--text-faint);font-size:12px;min-width:5.5ch;font-variant-numeric:tabular-nums}
.fq-name{color:var(--text);font-size:14px}
.fq-desc{margin-left:auto;color:var(--text-faint);font-size:12px;text-align:right}
@media(max-width:640px){.fq-desc{display:none}}

.fineprint{
  max-width:680px;margin:28px 0 0;
  font-size:12px;line-height:1.8;color:var(--text-faint);
}

/* ============================================================
   MEATPROXY — the human feed
   ============================================================ */

.mp-head{padding:clamp(26px,6vh,56px) 0 6px}
.mp-head h1{
  margin:0 0 16px;font-family:var(--sans);font-weight:600;
  font-size:clamp(30px,6vw,58px);line-height:1.08;letter-spacing:-.03em;
  color:var(--prose);
}
.mp-head .intro{max-width:640px;margin:0;color:var(--text-dim);font-family:var(--sans);font-size:16px}
.mp-head .ratio{
  display:inline-block;margin-top:14px;padding:6px 10px;
  border:1px solid var(--line);font-size:12px;letter-spacing:.08em;
  color:var(--phos-dim);font-variant-numeric:tabular-nums;
}

.mp-nav{display:flex;gap:8px;margin:30px 0 6px}
.mp-nav a{
  display:inline-flex;align-items:center;min-height:44px;padding:8px 16px;
  border:1px solid var(--line);text-decoration:none;
  font-size:13px;color:var(--text-dim);letter-spacing:.06em;
}
.mp-nav a:hover{color:var(--phos);border-color:var(--phos-dim)}
.mp-nav a[aria-current="page"]{color:#0b0f0b;background:var(--phos);border-color:var(--phos);font-weight:600}

.feed{list-style:none;margin:8px 0 0;padding:0}
.feed>li{
  border-bottom:1px solid var(--line-soft);
  padding:22px 0;
}
.feed h2{margin:0 0 8px;font-family:var(--sans);font-size:21px;line-height:1.3;letter-spacing:-.01em}
.feed h2 a{color:var(--prose);text-decoration:none}
.feed h2 a:hover{color:var(--phos)}
.feed .meta{
  font-size:12px;color:var(--text-faint);letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
}
.feed .rating{color:var(--phos)}

.mp-more{display:flex;justify-content:center;margin:36px 0 0}

/* ============================================================
   ARTICLE — representative prose page
   ============================================================ */

.article{padding:clamp(26px,6vh,56px) 0 0;max-width:760px}
.article h1{
  margin:0 0 14px;font-family:var(--sans);font-weight:600;
  font-size:clamp(28px,5.4vw,46px);line-height:1.12;letter-spacing:-.03em;
  color:var(--prose);
}
.article .meta{font-size:12px;color:var(--text-faint);font-variant-numeric:tabular-nums;letter-spacing:.04em;margin-bottom:8px}
.article .rating{color:var(--phos)}
.article-body{
  font-family:var(--sans);font-size:17px;line-height:1.75;color:var(--prose);
}
.article-body p{margin:0 0 20px;overflow-wrap:anywhere;white-space:pre-wrap}
.article-body h2{font-size:24px;line-height:1.3;margin:38px 0 14px;letter-spacing:-.01em}
.article-body pre{
  font-family:var(--mono);font-size:14px;line-height:1.6;
  background:var(--bg-raise);border:1px solid var(--line);
  border-left:3px solid var(--phos);
  padding:18px 20px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;
  color:#cfe8b0;
}
.article-body code{font-family:var(--mono);font-size:.92em}
.article-body blockquote{
  margin:24px 0;padding:4px 0 4px 20px;border-left:3px solid var(--phos);
  color:var(--text-dim);
}
.article-body figure{margin:32px 0}
.article-body figcaption{font-family:var(--mono);font-size:13px;color:var(--text-faint);margin-top:10px}
.article-body iframe{display:block;width:100%;height:550px;border:1px solid var(--line);background:#fff}
.article-body img,.article-body .checked-cover{max-width:100%;height:auto}

.share{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:40px 0 0}

/* comments */
.comments{margin:56px 0 0;border-top:1px solid var(--line);padding-top:8px}
.comments>h2{font-family:var(--sans);font-size:20px}
.comment{padding:20px 0;border-bottom:1px solid var(--line-soft)}
.comment .meta{font-size:12px;color:var(--text-faint);font-variant-numeric:tabular-nums;margin-bottom:8px}
.comment p{font-family:var(--sans);font-size:15.5px;line-height:1.7;margin:0 0 12px;overflow-wrap:anywhere;white-space:pre-wrap}
.reply{margin-left:20px;padding-left:16px;border-left:1px solid var(--line-soft)}
@media(max-width:480px){.reply{margin-left:8px;padding-left:10px}}
