/*
Theme Name: NV0J Beacon
Theme URI: https://www.qrz.com/db/NV0J
Author: Nova Joe (NV0J)
Author URI: https://www.qrz.com/db/NV0J
Description: A single-page station landing theme for amateur radio operators. Presents a callsign, Maidenhead grid, QTH, and station profile as a dark operating-console readout with an SDR spectrum-scope signature. Built to sit alongside self-hosted POTA trackers.
Version: 1.1.2
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: nv0j-beacon
*/

/* ------------------------------------------------------------------ *
 *  Tokens
 * ------------------------------------------------------------------ */
:root{
  --ink:      #0a0e14;   /* night shack / deep console */
  --panel:    #10161f;   /* lifted panel */
  --panel-2:  #0c1219;   /* recessed field */
  --line:     #1e2a3a;   /* hairline grid */
  --line-2:   #2b3a4f;   /* brighter divider */
  --text:     #dbe3ee;   /* cool off-white */
  --muted:    #64789a;   /* slate labels */
  --muted-2:  #47576f;   /* dim captions */
  --phosphor: #ffb454;   /* amber dial glow — the readout color */
  --signal:   #5bd6c0;   /* teal scope trace — one sparing accent */
  --signal-dim:#1d4d47;

  --shell: 68rem;

  --f-display:"Chakra Petch", "IBM Plex Mono", ui-monospace, monospace;
  --f-mono:   "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace;
}

/* ------------------------------------------------------------------ *
 *  Reset-ish
 * ------------------------------------------------------------------ */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  min-height:100vh;
  background:var(--ink);
  color:var(--text);
  font-family:var(--f-mono);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  /* faint carrier: two crossing gridlines like a scope graticule */
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:46px 46px, 46px 46px;
  background-position:center top;
}
body.nv0j-front::before{
  /* vignette so the grid fades at the edges — landing only, never over articles */
  content:"";
  position:fixed; inset:0; pointer-events:none;
  background:radial-gradient(120% 90% at 50% 0%, transparent 40%, var(--ink) 92%);
}
a{ color:var(--signal); text-decoration:none; }
a:hover{ text-decoration:underline; text-underline-offset:3px; }
:focus-visible{
  outline:2px solid var(--phosphor);
  outline-offset:3px;
  border-radius:2px;
}

/* ------------------------------------------------------------------ *
 *  Shell
 * ------------------------------------------------------------------ */
.station{
  position:relative;
  max-width:var(--shell);
  margin:0 auto;
  padding:clamp(2rem,6vw,5rem) clamp(1.15rem,4vw,2.5rem) 3rem;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

/* eyebrow ------------------------------------------------------------ */
.eyebrow{
  display:flex; align-items:center; gap:.85rem;
  font-size:.72rem; letter-spacing:.42em; text-transform:uppercase;
  color:var(--muted);
  margin:0 0 clamp(1.5rem,5vw,3rem);
}
.eyebrow .tick{
  width:.5rem; height:.5rem; border-radius:50%;
  background:var(--signal);
  box-shadow:0 0 0 0 var(--signal);
  animation:pulse 2.6s ease-out infinite;
}
.eyebrow .rule{ flex:1; height:1px; background:var(--line-2); }
@keyframes pulse{
  0%{ box-shadow:0 0 0 0 rgba(91,214,192,.5); }
  70%{ box-shadow:0 0 0 .5rem rgba(91,214,192,0); }
  100%{ box-shadow:0 0 0 0 rgba(91,214,192,0); }
}

/* hero --------------------------------------------------------------- */
.hero{ margin-bottom:clamp(1.5rem,4vw,2.5rem); }
.callsign{
  font-family:var(--f-display);
  font-weight:700;
  font-size:clamp(4.2rem,20vw,13rem);
  line-height:.86;
  letter-spacing:.02em;
  margin:0;
  color:var(--text);
  text-shadow:0 0 42px rgba(255,180,84,.14);
}
.callsign .z{ color:var(--phosphor); }   /* the 0 glows like a lit segment */
.phonetic{
  font-size:clamp(.8rem,2.4vw,1.05rem);
  letter-spacing:.34em;
  text-transform:uppercase;
  color:var(--muted);
  margin:1.15rem 0 0;
}
.phonetic b{ color:var(--signal); font-weight:500; }

/* scope -------------------------------------------------------------- */
.scope{
  position:relative;
  margin:clamp(1.5rem,4vw,2.5rem) 0 clamp(2rem,5vw,3rem);
  border:1px solid var(--line-2);
  border-radius:6px;
  background:
    linear-gradient(180deg, rgba(91,214,192,.03), transparent 60%),
    var(--panel-2);
  overflow:hidden;
}
.scope svg{ display:block; width:100%; height:auto; }
.scope .band-tag{
  position:absolute; top:.6rem; left:.75rem;
  font-size:.62rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--muted-2);
}
.scope .band-tag b{ color:var(--phosphor); font-weight:500; }
.sweep{
  transform-box:fill-box;
  transform-origin:left center;
  animation:sweep 6.5s linear infinite;
}
@keyframes sweep{
  0%{ transform:translateX(-4%); opacity:0; }
  8%{ opacity:1; }
  92%{ opacity:1; }
  100%{ transform:translateX(1004px); opacity:0; }
}

/* readout ------------------------------------------------------------ */
.readout{
  border:1px solid var(--line-2);
  border-radius:6px;
  background:var(--panel);
  display:grid;
  grid-template-columns:1fr 1fr;
}
.readout .row{
  display:grid;
  grid-template-columns:7.5rem 1fr;
  gap:1rem;
  align-items:baseline;
  padding:.9rem 1.15rem;
  border-bottom:1px solid var(--line);
  border-right:1px solid var(--line);
}
.readout .row .k{
  font-size:.66rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--muted);
}
.readout .row .v{ color:var(--text); font-weight:500; }
.readout .row .v.hot{ color:var(--phosphor); }
/* strip trailing borders on the outer edges */
.readout .row:nth-child(odd){ border-right:1px solid var(--line); }
.readout .row:nth-child(even){ border-right:0; }

.status-chip{
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.1rem .5rem; border-radius:3px;
  font-size:.78rem; letter-spacing:.08em;
  border:1px solid var(--signal-dim);
  background:rgba(91,214,192,.08);
  color:var(--signal);
}
.status-chip.off{
  border-color:var(--line-2);
  background:transparent;
  color:var(--muted);
}
.status-chip .dot{ width:.42rem; height:.42rem; border-radius:50%; background:currentColor; }

/* blog notice -------------------------------------------------------- */
.notice{
  margin-top:clamp(2rem,5vw,3rem);
  padding-top:clamp(1.5rem,4vw,2.25rem);
  border-top:1px solid var(--line);
}
.notice h2{
  font-family:var(--f-display);
  font-weight:600;
  font-size:clamp(1.35rem,4vw,2rem);
  letter-spacing:.01em;
  margin:0 0 .75rem;
  color:var(--text);
}
.notice h2 .qrt,
.notice h2 .qrv-state{ color:var(--phosphor); }
.notice p{
  max-width:52ch;
  color:var(--muted);
  margin:0;
  font-size:.98rem;
}
.notice p b{ color:var(--text); font-weight:500; }

/* footer ------------------------------------------------------------- */
.sig{
  margin-top:auto;
  padding-top:clamp(2.5rem,6vw,4rem);
  display:flex; flex-wrap:wrap; gap:1rem 1.5rem;
  align-items:center; justify-content:space-between;
  font-size:.8rem; color:var(--muted-2);
}
.sig .seventythree{
  font-family:var(--f-display);
  letter-spacing:.16em;
  color:var(--muted);
}
.sig .seventythree b{ color:var(--phosphor); font-weight:600; }
.sig .links{ display:flex; gap:1.25rem; }
.sig .links a{ color:var(--muted); letter-spacing:.06em; }
.sig .links a:hover{ color:var(--signal); }
.sig .links a .arr{ color:var(--muted-2); }

/* ------------------------------------------------------------------ *
 *  Responsive
 * ------------------------------------------------------------------ */
@media (max-width:640px){
  .readout{ grid-template-columns:1fr; }
  .readout .row{ border-right:0 !important; grid-template-columns:6.5rem 1fr; }
  .readout .row:last-child{ border-bottom:0; }
}
@media (min-width:641px){
  .readout .row:nth-last-child(-n+2){ border-bottom:0; }
}

/* ------------------------------------------------------------------ *
 *  Reduced motion
 * ------------------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  .sweep{ animation:none; opacity:.9; }
  .eyebrow .tick{ animation:none; }
}

/* ================================================================== *
 *  BLOG / LOG  — masthead, logbook index, single article
 * ================================================================== */
:root{
  --f-body:"IBM Plex Sans", system-ui, -apple-system, sans-serif;
  --measure:42rem;
}

/* --- masthead ------------------------------------------------------ */
.masthead{
  position:sticky; top:0; z-index:20;
  display:flex; align-items:center; justify-content:space-between; gap:1rem;
  padding:.95rem clamp(1.15rem,4vw,2.5rem);
  border-bottom:1px solid var(--line);
  background:rgba(10,14,20,.82);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.masthead .call{
  font-family:var(--f-display); font-weight:700; letter-spacing:.14em;
  color:var(--text); font-size:1.05rem;
}
.masthead .call:hover{ text-decoration:none; color:var(--text); }
.masthead .call .z{ color:var(--phosphor); }
.masthead .site-nav{ display:flex; gap:1.4rem; }
.masthead .site-nav a,
.masthead .site-nav li a{
  font-family:var(--f-mono);
  font-size:.72rem; letter-spacing:.24em; text-transform:uppercase;
  color:var(--muted);
}
.masthead .site-nav a:hover{ color:var(--signal); text-decoration:none; }
.masthead .site-nav a.on,
.masthead .site-nav .current-menu-item a{ color:var(--phosphor); }
.masthead .site-nav ul{ list-style:none; margin:0; padding:0; display:flex; gap:1.4rem; }

/* --- shared page shell --------------------------------------------- */
.wrap{
  max-width:var(--shell);
  margin:0 auto;
  padding:clamp(2.5rem,6vw,4.5rem) clamp(1.15rem,4vw,2.5rem) 4rem;
}
.empty{ color:var(--muted); font-family:var(--f-mono); padding:2rem 0; }

/* --- log head ------------------------------------------------------ */
.log-head{ margin-bottom:clamp(2rem,5vw,3rem); }
.log-head .eyebrow{
  display:flex; align-items:center; gap:.85rem;
  font-size:.72rem; letter-spacing:.42em; text-transform:uppercase;
  color:var(--muted); margin:0 0 1.25rem;
}
.log-head .eyebrow .rule{ flex:1; height:1px; background:var(--line-2); }
.log-head h1{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(2.4rem,7vw,4rem); letter-spacing:.02em; line-height:.98; margin:0;
}
.log-head > p{ color:var(--muted); margin:.9rem 0 0; font-size:.95rem; max-width:60ch; }

/* --- entries (logbook) --------------------------------------------- */
.entries{ border-top:1px solid var(--line); }
.entry{
  display:grid; grid-template-columns:11.5rem 1fr; gap:2rem;
  padding:1.9rem 1rem; border-bottom:1px solid var(--line);
  position:relative; transition:background .15s ease;
}
.entry::before{
  content:""; position:absolute; left:0; top:-1px; bottom:-1px; width:2px;
  background:transparent; transition:background .15s ease;
}
.entry:hover{ background:linear-gradient(90deg, rgba(91,214,192,.045), transparent 55%); }
.entry:hover::before{ background:var(--phosphor); }
.entry .rail{ font-family:var(--f-mono); font-size:.78rem; line-height:1.5; }
.entry .rail .date{ color:var(--text); letter-spacing:.04em; }
.entry .rail .no{ color:var(--muted-2); letter-spacing:.12em; margin-top:.15rem; }
.entry .body h2{
  font-family:var(--f-display); font-weight:600; font-size:1.5rem;
  line-height:1.2; margin:0 0 .55rem;
}
.entry .body h2 a{ color:var(--text); }
.entry .body h2 a:hover{ color:var(--phosphor); text-decoration:none; }
.entry .body .excerpt{ font-family:var(--f-body); color:#aab7c9; font-size:1rem; line-height:1.6; margin:0 0 .8rem; max-width:54ch; }
.entry .body .excerpt p{ margin:0; }
.entry .body .meta{ font-family:var(--f-mono); font-size:.72rem; color:var(--muted); letter-spacing:.06em; }

/* --- chips (from tags) --------------------------------------------- */
.chips{ margin-top:.7rem; display:flex; flex-wrap:wrap; gap:.4rem; }
.chip{
  display:inline-block;
  font-family:var(--f-mono); font-size:.64rem; letter-spacing:.14em; text-transform:uppercase;
  padding:.12rem .45rem; border-radius:3px;
  border:1px solid var(--line-2); color:var(--muted);
}
a.chip:hover{ text-decoration:none; border-color:var(--muted); color:var(--text); }
.chip.band{ border-color:var(--signal-dim); color:var(--signal); background:rgba(91,214,192,.07); }
a.chip.band:hover{ border-color:var(--signal); color:var(--signal); }
.chip.park{ border-color:rgba(255,180,84,.35); color:var(--phosphor); }
a.chip.park:hover{ border-color:var(--phosphor); }

/* --- pager --------------------------------------------------------- */
.pager{ display:flex; justify-content:space-between; margin-top:2.5rem; font-family:var(--f-mono); font-size:.8rem; letter-spacing:.08em; }
.pager a{ color:var(--muted); }
.pager a:hover{ color:var(--phosphor); text-decoration:none; }

/* --- single article ------------------------------------------------ */
.article{ max-width:var(--measure); margin:0 auto; }
.article .eyebrow{ font-size:.7rem; letter-spacing:.34em; text-transform:uppercase; color:var(--phosphor); margin:0 0 1.1rem; }
.article h1{ font-family:var(--f-display); font-weight:700; font-size:clamp(2rem,5.5vw,3rem); line-height:1.08; letter-spacing:.01em; margin:0 0 1.1rem; }
.article .byline{ font-family:var(--f-mono); font-size:.76rem; color:var(--muted); letter-spacing:.05em; padding-bottom:1.6rem; border-bottom:1px solid var(--line); margin:0 0 2rem; }
.article .byline b{ color:var(--signal); font-weight:500; }
.article .byline .sep{ color:var(--muted-2); margin:0 .5rem; }
.post-hero{ margin:0 0 2rem; }
.post-hero img{ display:block; width:100%; height:auto; border:1px solid var(--line); border-radius:6px; }

.content{ font-family:var(--f-body); color:#c6d1e0; font-size:1.075rem; line-height:1.75; }
.content > p{ margin:0 0 1.35rem; }
.content h2{ font-family:var(--f-display); font-weight:600; color:var(--text); font-size:1.5rem; letter-spacing:.01em; margin:2.4rem 0 .9rem; }
.content h3{ font-family:var(--f-display); font-weight:600; color:var(--text); font-size:1.2rem; margin:2rem 0 .7rem; }
.content a{ color:var(--signal); text-decoration:underline; text-underline-offset:2px; }
.content strong{ color:var(--text); }
.content img{ max-width:100%; height:auto; border:1px solid var(--line); border-radius:6px; }
.content ul, .content ol{ margin:0 0 1.35rem; padding-left:0; }
.content ul{ list-style:none; }
.content ul li{ position:relative; padding-left:1.4rem; margin-bottom:.5rem; }
.content ul li::before{ content:"\25B9"; position:absolute; left:0; color:var(--phosphor); }
.content ol{ padding-left:1.4rem; }
.content ol li{ margin-bottom:.5rem; }
.content blockquote{ margin:1.8rem 0; padding:.4rem 0 .4rem 1.3rem; border-left:2px solid var(--phosphor); font-family:var(--f-mono); font-size:.95rem; color:var(--text); font-style:normal; }
.content blockquote p{ margin:0 0 .4rem; }
.content code{ font-family:var(--f-mono); font-size:.88em; background:var(--panel-2); border:1px solid var(--line); border-radius:3px; padding:.08em .35em; }
.content pre{ background:var(--panel-2); border:1px solid var(--line); border-radius:6px; padding:1rem 1.15rem; overflow:auto; margin:0 0 1.35rem; }
.content pre code{ background:none; border:0; padding:0; font-size:.85rem; line-height:1.6; color:#c8d4c4; }
.page-links{ font-family:var(--f-mono); font-size:.8rem; color:var(--muted); margin-top:1.5rem; }

/* --- article footer: tags + prev/next ------------------------------ */
.article-foot{ max-width:var(--measure); margin:2.6rem auto 0; padding-top:1.6rem; border-top:1px solid var(--line); }
.article-foot .tags{ margin:0 0 2rem; }
.article-foot .tags .chips{ margin-top:0; }
.postnav{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.postnav a{ border:1px solid var(--line-2); border-radius:6px; padding:1rem 1.1rem; background:var(--panel); display:block; }
.postnav a:hover{ border-color:var(--phosphor); text-decoration:none; }
.postnav .lbl{ font-family:var(--f-mono); font-size:.66rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted-2); margin-bottom:.35rem; }
.postnav .ttl{ font-family:var(--f-display); color:var(--text); font-size:1rem; line-height:1.25; }
.postnav .next{ text-align:right; }

/* --- landing: live blog link + cta --------------------------------- */
.notice .qrv-link{ color:var(--phosphor); text-decoration:none; }
.notice .qrv-link:hover{ text-decoration:underline; text-underline-offset:3px; }
.notice .cta{ display:inline-block; margin-top:.9rem; font-family:var(--f-mono); font-size:.85rem; letter-spacing:.06em; color:var(--signal); }

/* --- responsive ---------------------------------------------------- */
@media (max-width:640px){
  .entry{ grid-template-columns:1fr; gap:.9rem; padding:1.6rem .25rem; }
  .entry .rail{ display:flex; align-items:center; gap:.8rem; flex-wrap:wrap; }
  .entry .rail .no{ margin-top:0; }
  .chips{ margin-top:0; }
  .postnav{ grid-template-columns:1fr; }
  .postnav .next{ text-align:left; }
  .masthead .site-nav{ gap:1rem; }
}