:root{
    --paper: #F5F4F3;
    --paper-dim: #EBEAE7;
    --ink: #171717;
    --ink-soft: #58564F;
    --accent: #F3C958;
    --accent-ink: #171717;
    --accent-soft: #FBEFCB;
    --line: #DEDCD6;
    --radius: 3px;
  }

  *{ box-sizing:border-box; margin:0; padding:0; }

  html{ scroll-behavior:smooth; }

  body{
    background:var(--paper);
    color:var(--ink);
    font-family:'Inter', sans-serif;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }

  @media (prefers-reduced-motion: reduce){
    *{ animation:none !important; transition:none !important; }
  }

  a{ color:inherit; text-decoration:none; }

  .wrap{
    max-width:1080px;
    margin:0 auto;
    padding:0 32px;
  }

  h1,h2,h3{
    font-family:'Fraunces', serif;
    font-weight:450;
    letter-spacing:-0.01em;
  }

  .eyebrow{
    font-family:'JetBrains Mono', monospace;
    font-size:12px;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:#96751B;
  }

  /* ---------- waveform signature ---------- */
  .waveform{
    display:flex;
    align-items:center;
    gap:3px;
    height:20px;
  }
  .waveform span{
    display:block;
    width:3px;
    background:var(--accent);
    border-radius:2px;
    animation: wave 1.6s ease-in-out infinite;
  }
  .waveform.static span{ animation:none; }
  @keyframes wave{
    0%,100%{ transform:scaleY(0.4); }
    50%{ transform:scaleY(1); }
  }
  .waveform span:nth-child(1){ height:40%; animation-delay:0s; }
  .waveform span:nth-child(2){ height:80%; animation-delay:0.1s; }
  .waveform span:nth-child(3){ height:100%; animation-delay:0.2s; }
  .waveform span:nth-child(4){ height:60%; animation-delay:0.3s; }
  .waveform span:nth-child(5){ height:90%; animation-delay:0.4s; }
  .waveform span:nth-child(6){ height:50%; animation-delay:0.5s; }
  .waveform span:nth-child(7){ height:75%; animation-delay:0.6s; }
  .waveform span:nth-child(8){ height:35%; animation-delay:0.7s; }

  .divider{
    display:flex;
    justify-content:center;
    padding:64px 0;
  }
  .divider .waveform span{ background:var(--line); }
  .divider .waveform span:nth-child(odd){ background:var(--accent); opacity:0.5; }

  /* ---------- nav ---------- */
  header{
    position:sticky;
    top:0;
    background:rgba(246,245,240,0.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--line);
    z-index:100;
  }
  nav{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:18px 32px;
    max-width:1080px;
    margin:0 auto;
  }
  .logo{
    font-family:'Fraunces', serif;
    font-size:20px;
    font-weight:600;
    display:flex;
    align-items:center;
    gap:10px;
  }
  .logo-mark{
    width:34px;
    height:34px;
    border-radius:50%;
    object-fit:cover;
  }
  .nav-links{
    display:flex;
    gap:32px;
    font-size:14px;
    font-weight:500;
  }
  .nav-links a{ color:var(--ink-soft); transition:color 0.2s; }
  .nav-links a:hover{ color:var(--accent); }
  .nav-links a:focus-visible, a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{
    outline:2px solid var(--accent);
    outline-offset:3px;
  }
  .nav-links a.yt-link{
    display:flex;
    align-items:center;
    gap:6px;
    color:var(--ink);
    font-weight:600;
  }
  .nav-links a.yt-link::before{
    content:'';
    width:8px;
    height:8px;
    border-radius:50%;
    background:#D3402F;
    display:inline-block;
  }

  @media (max-width:640px){
    .nav-links{ display:none; }
  }

  /* ---------- hero ---------- */
  .hero{
    padding:96px 0 64px;
  }
  .hero-inner{
    display:block;
  }
  .hero h1{
    font-size:clamp(42px, 6vw, 76px);
    line-height:1.02;
    margin:18px 0 24px;
  }
  .hero h1 em{
    font-style:italic;
    background: linear-gradient(to bottom, transparent 62%, var(--accent) 62%);
    padding:0 2px;
  }
  .hero p.lede{
    font-size:18px;
    color:var(--ink-soft);
    max-width:44ch;
    margin-bottom:28px;
  }
  .tagline-row{
    display:flex;
    align-items:center;
    gap:10px;
    font-family:'JetBrains Mono', monospace;
    font-size:12px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--ink-soft);
    margin-bottom:28px;
  }
  .tagline-row .dot{
    width:4px;
    height:4px;
    border-radius:50%;
    background:var(--accent);
  }
  .yt-cta{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:var(--accent);
    color:var(--accent-ink);
    padding:13px 22px;
    border-radius:var(--radius);
    font-size:14px;
    font-weight:600;
    transition:background 0.2s, transform 0.15s;
  }
  .yt-cta svg{ color:var(--accent-ink); }
  .yt-cta:hover{ background:#E8B935; transform:translateY(-1px); }
  .hero-side{
    border-left:1px solid var(--line);
    padding-left:32px;
    font-size:14px;
    color:var(--ink-soft);
  }
  .hero-side .stat{
    margin-bottom:20px;
  }
  .hero-side .stat b{
    display:block;
    font-family:'Fraunces', serif;
    font-size:28px;
    color:var(--ink);
    font-weight:450;
  }

  @media (max-width:800px){
    .hero-inner{ grid-template-columns:1fr; }
    .hero-side{ border-left:none; border-top:1px solid var(--line); padding-left:0; padding-top:24px; display:flex; gap:32px; }
  }

  /* ---------- now playing ---------- */
  .player-card{
    margin-top:56px;
    background:var(--ink);
    color:var(--paper);
    border-radius:var(--radius);
    padding:32px;
    display:grid;
    grid-template-columns:auto 1fr auto;
    gap:24px;
    align-items:center;
  }
  .play-btn{
    width:52px;
    height:52px;
    border-radius:50%;
    background:var(--accent);
    border:none;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    flex-shrink:0;
    transition:transform 0.15s;
  }
  .play-btn:hover{ transform:scale(1.06); }
  .play-btn svg{ width:18px; height:18px; fill:var(--paper); margin-left:2px; }

  .player-meta .eyebrow{ color:#F3C958; }
  .player-meta h3{ font-size:20px; margin:4px 0 6px; font-weight:450; }
  .player-meta p{ font-size:13px; color:#B8B6AE; }

  .player-track{
    grid-column:1 / -1;
    display:flex;
    align-items:center;
    gap:12px;
    margin-top:8px;
  }
  .track-bar{
    flex:1;
    height:3px;
    background:#3A3835;
    border-radius:2px;
    position:relative;
  }
  .track-bar::before{
    content:'';
    position:absolute;
    left:0; top:0; bottom:0;
    width:0%;
    background:var(--accent);
    border-radius:2px;
  }
  .track-time{
    font-family:'JetBrains Mono', monospace;
    font-size:11px;
    color:#8B897F;
  }
  .player-note{
    grid-column:1/-1;
    font-size:12px;
    color:#8B897F;
    font-style:italic;
  }

  /* ---------- episodes ---------- */
  .section-head{
    display:flex;
    justify-content:space-between;
    align-items:baseline;
    margin-bottom:40px;
  }
  .section-head h2{ font-size:32px; font-weight:450; }

  .episode{
    display:grid;
    grid-template-columns:64px 1fr auto;
    gap:24px;
    align-items:center;
    padding:24px 0;
    border-top:1px solid var(--line);
    transition:padding-left 0.2s;
  }
  .episode:last-child{ border-bottom:1px solid var(--line); }
  .episode:hover{ padding-left:8px; }

  .ep-num{
    font-family:'JetBrains Mono', monospace;
    font-size:12px;
    font-weight:500;
    color:var(--accent-ink);
    background:var(--accent);
    padding:4px 8px;
    border-radius:2px;
    align-self:start;
  }
  .ep-title{
    font-family:'Fraunces', serif;
    font-size:20px;
    font-weight:450;
    margin-bottom:4px;
  }
  .ep-guest{
    font-size:13px;
    color:var(--ink-soft);
  }
  .ep-len{
    font-family:'JetBrains Mono', monospace;
    font-size:12px;
    color:var(--ink-soft);
    white-space:nowrap;
  }

  @media (max-width:640px){
    .episode{ grid-template-columns:40px 1fr; }
    .ep-len{ grid-column:2; padding-top:4px; }
  }

  /* ---------- about ---------- */
  .about{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:64px;
    align-items:start;
  }
  .about h2{ font-size:32px; margin-bottom:20px; }
  .about p{ color:var(--ink-soft); margin-bottom:16px; max-width:52ch; }
  .about-side{
    background:var(--paper-dim);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:32px;
  }
  .about-side .eyebrow{ margin-bottom:16px; display:block; }
  .about-side ul{ list-style:none; }
  .about-side li{ border-top:1px solid var(--line); }
  .about-side li:first-of-type{ border-top:none; }
  .about-side li a{
    padding:10px 0;
    font-size:14px;
    display:flex;
    justify-content:space-between;
    transition:color 0.2s;
  }
  .about-side li a:hover{ color:var(--accent); }
  .about-side li a b{ font-weight:600; }

  @media (max-width:800px){
    .about{ grid-template-columns:1fr; }
  }

  /* ---------- suggest guest form ---------- */
  .suggest{
    background:var(--ink);
    color:var(--paper);
    border-radius:var(--radius);
    padding:64px 56px;
  }
  .suggest .eyebrow{ color:#F3C958; }
  .suggest h2{ color:var(--paper); font-size:34px; margin:14px 0 12px; }
  .suggest > p{ color:#B8B6AE; max-width:52ch; margin-bottom:40px; }

  .form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
  }
  .field{ display:flex; flex-direction:column; gap:8px; }
  .field.full{ grid-column:1/-1; }
  .field label{
    font-size:12px;
    font-family:'JetBrains Mono', monospace;
    letter-spacing:0.04em;
    color:#F3C958;
    text-transform:uppercase;
  }
  .field input, .field textarea{
    background:#26241F;
    border:1px solid #3A3835;
    border-radius:var(--radius);
    padding:12px 14px;
    color:var(--paper);
    font-family:'Inter', sans-serif;
    font-size:14px;
  }
  .field input::placeholder, .field textarea::placeholder{ color:#6B6960; }
  .field textarea{ resize:vertical; min-height:90px; }

  .submit-btn{
    margin-top:28px;
    background:var(--accent);
    color:var(--accent-ink);
    border:none;
    padding:14px 28px;
    border-radius:var(--radius);
    font-family:'Inter', sans-serif;
    font-weight:600;
    font-size:14px;
    cursor:pointer;
    transition:background 0.2s;
  }
  .submit-btn:hover{ background:#E8B935; }

  .form-status{
    margin-top:18px;
    font-size:13px;
    color:#F3C958;
    display:none;
  }
  .form-status.show{ display:block; }

  @media (max-width:640px){
    .suggest{ padding:40px 24px; }
    .form-grid{ grid-template-columns:1fr; }
  }

  /* ---------- footer ---------- */
  footer{
    border-top:1px solid var(--line);
    padding:40px 0 24px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:13px;
    color:var(--ink-soft);
  }
  .footer-links{ display:flex; gap:24px; }
  .footer-links a{ transition:color 0.2s; }
  .footer-links a:hover{ color:var(--accent); }
  .footer-credit{
    text-align:center;
    padding-bottom:32px;
    font-size:12px;
    color:var(--ink-soft);
  }
  .footer-credit a{
    color:var(--ink-soft);
    text-decoration:underline;
    text-underline-offset:2px;
    transition:color 0.2s;
  }
  .footer-credit a:hover{ color:var(--accent); }

  @media (max-width:640px){
    footer{ flex-direction:column; gap:16px; text-align:center; }
  }

  /* ---------- multi-page additions ---------- */
  .nav-links a.active{ color:var(--ink); }

  .page-header{
    padding:72px 0 48px;
    border-bottom:1px solid var(--line);
    margin-bottom:64px;
  }
  .page-header .eyebrow{ margin-bottom:14px; display:block; }
  .page-header h1{
    font-size:clamp(36px, 5vw, 54px);
    font-weight:450;
    line-height:1.05;
    max-width:16ch;
  }
  .page-header p{
    font-size:17px;
    color:var(--ink-soft);
    max-width:52ch;
    margin-top:18px;
  }

  .page-body{ padding-bottom:96px; }

  /* ---- about page ---- */
  .value-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:32px;
    margin-top:56px;
  }
  .value-card{
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px;
    background:var(--paper-dim);
  }
  .value-card .eyebrow{ margin-bottom:12px; display:block; }
  .value-card h3{ font-size:19px; font-weight:450; margin-bottom:10px; }
  .value-card p{ font-size:14px; color:var(--ink-soft); }

  @media (max-width:800px){
    .value-grid{ grid-template-columns:1fr; }
  }

  .about-copy{ max-width:64ch; }
  .about-copy p{ color:var(--ink-soft); margin-bottom:18px; font-size:16px; }
  .about-copy h2{ font-size:26px; font-weight:450; margin:48px 0 16px; }

  /* ---- watch page ---- */
  .platform-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:24px;
  }
  .platform-card{
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:32px 28px;
    background:var(--paper-dim);
    transition:transform 0.2s, border-color 0.2s;
    display:block;
  }
  .platform-card:hover{ transform:translateY(-3px); border-color:var(--accent); }
  .platform-icon{
    width:40px;
    height:40px;
    border-radius:50%;
    background:var(--accent);
    color:var(--accent-ink);
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:20px;
    font-family:'JetBrains Mono', monospace;
    font-weight:600;
    font-size:13px;
  }
  .platform-card h3{ font-size:19px; font-weight:450; margin-bottom:8px; }
  .platform-card p{ font-size:14px; color:var(--ink-soft); margin-bottom:16px; }
  .platform-card .go{
    font-family:'JetBrains Mono', monospace;
    font-size:12px;
    color:var(--ink);
    display:inline-flex;
    align-items:center;
    gap:6px;
  }

  @media (max-width:800px){
    .platform-grid{ grid-template-columns:1fr; }
  }

  /* ---- contact page ---- */
  .contact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:64px;
  }
  .contact-list{ list-style:none; margin-top:28px; }
  .contact-list li{
    padding:18px 0;
    border-top:1px solid var(--line);
  }
  .contact-list li:first-child{ border-top:none; }
  .contact-list .label{
    font-family:'JetBrains Mono', monospace;
    font-size:11px;
    letter-spacing:0.06em;
    text-transform:uppercase;
    color:var(--ink-soft);
    display:block;
    margin-bottom:6px;
  }
  .contact-list a{
    font-family:'Fraunces', serif;
    font-size:20px;
    transition:color 0.2s;
  }
  .contact-list a:hover{ color:var(--accent-ink); text-decoration:underline; text-decoration-color:var(--accent); }

  .contact-note{
    background:var(--paper-dim);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px;
    font-size:14px;
    color:var(--ink-soft);
  }

  @media (max-width:800px){
    .contact-grid{ grid-template-columns:1fr; gap:40px; }
  }

  /* ---- suggest page wrapper (form reused, page not dark full-bleed) ---- */
  .suggest-page-wrap{ padding-bottom:96px; }