:root{
  /* surfaces: moody, not black */
  --bg-1:   #123c3f;     /* sea dusk */
  --bg-2:   #0f3538;     /* deeper edge */
  --panel:  #123e41;     /* cards/panels on dark */
  --border: #1d5659;

  /* inks: softer than pure white */
  --ink:      #dff7f3;   /* primary text */
  --ink-dim:  #bfe6e2;   /* secondary */
  --ink-faint:#98d3cf;   /* captions */

  /* accents from your board */
  --mint:   #46f2e3;
  --teal:   #1bccc1;
  --sky:    #1fa5c9;
  --aqua:   #52f4d2;
  --hotpink:#ff42d0;

  /* utility */
  --ring: rgba(70,242,227,.28);
}
.hidden{ display:none !important }




html,body{
  background:
    radial-gradient(1200px 700px at 50% 120px, var(--bg-1) 0%, var(--bg-2) 70%),
    linear-gradient(180deg, #133c3f 0%, #103335 100%);
  color:var(--ink);
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}



a{ color:var(--accent); text-decoration:none }
a:hover{ text-decoration:underline }

.site-header,.site-footer{ background:transparent; border-bottom:1px solid var(--border) }
.site-footer{ border-top:1px solid var(--border); border-bottom:0 }
.brand{ color:var(--ink); font-weight:900; letter-spacing:.04em }
.nav a{ color:var(--ink-dim); font-weight:600 }
.nav a:hover{ color:var(--ink) }

.sep{ opacity:.35 }

.wrapper{ max-width:980px; margin:0 auto; padding:0 20px }

.hero{ padding:6rem 0 2rem }
.wordmark{
  font-weight:900; line-height:1;
  background: linear-gradient(90deg, var(--hotpink), var(--mint), var(--sky));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  text-shadow: 0 10px 28px rgba(70,242,227,.12);
}



#glitch-cloud{ display:none } /* park the marquee for now */

.countdown{
  margin:20px auto 0; padding:.55rem .95rem; border-radius:999px;
  background: rgba(16, 51, 53, .55);
  border: 1px solid var(--border);
  color: var(--ink-dim); font-weight:800; font-variant-numeric: tabular-nums;
}
.countdown.neon-pink{ color: var(--hotpink) }
.countdown.neon-turq{ color: var(--mint) }
.countdown.brighten{ filter: brightness(1.12) saturate(1.08) }


.feed{ margin:32px auto 0 }
.card{
  background: linear-gradient(180deg, rgba(28,84,86,.85), rgba(22,66,68,.85));
  border: 1px solid var(--border);
  border-radius: 18px;
}
.card h2, .card h2 a{ color:var(--ink); font-weight:900; text-decoration:none }
.more{ color:var(--aqua); text-underline-offset:3px; text-decoration-thickness:2px }
.more:hover{ color:var(--mint) }


.prose{
  background: linear-gradient(180deg, rgba(28,84,86,.85), rgba(22,66,68,.85));
  border:1px solid var(--border); border-radius:16px;
  padding:28px; margin:28px auto; line-height:1.72; color:var(--ink);
}
.prose h1{ color:var(--ink); margin:.25rem 0 1rem; font-size:clamp(36px,6vw,72px) }
.prose p{ color:var(--ink-dim) }
}


.comments h2{ color:var(--ink) }
.comment-form textarea{
  background:#0c1616; color:var(--ink); border:1px solid var(--border); border-radius:10px;
}

.btn{
  background: linear-gradient(180deg, var(--teal), var(--aqua));
  color:#0d2122; border:1px solid #159e98; border-radius:999px;
  padding:.6rem 1rem; font-weight:700;
}
.btn:hover{ box-shadow:0 0 0 4px var(--ring) }

.signoff{
  margin-top:3rem;
  font-size:1.25rem;
  font-weight:600;
  color:var(--ink-dim);
}
.sig{
  font-family:'Caveat', cursive;
  font-size:1.75rem;
  color:var(--ink);
  letter-spacing:.04em;
}
.signed-label {
  font-family:Inter, sans-serif;
}
footer {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 10px 0; /* Adjust for comfort */
  background-color: inherit; /* or set your desired footer bg */
}