:root {
      color-scheme: light;
      --riso-yellow: #d4f500;
      --riso-black: #111111;
      --riso-white: #f5f0e8;
      --riso-gray: #888;
    }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    /* Horizontal clip lives on .page-shell (see index.html), not html: overflow-x on html
       breaks position:fixed on iOS Safari — the nav scrolls with the page and content shows above it. */
    html {
      -webkit-text-size-adjust: 100%;
      overscroll-behavior-y: contain;
    }
    .page-shell {
      overflow-x: hidden;
      min-width: 0;
    }
    @supports (overflow: clip) {
      .page-shell { overflow-x: clip; }
    }
    body {
      background: var(--riso-white);
      color: var(--riso-black);
      font-family: 'Courier Prime', monospace;
      cursor: crosshair;
      padding-left: env(safe-area-inset-left, 0px);
      padding-right: env(safe-area-inset-right, 0px);
      padding-bottom: env(safe-area-inset-bottom, 0px);
      overscroll-behavior-y: contain;
    }
    /* Grain sits above in-flow content but below the fixed nav (was z-index 9999 over nav, which
       worsens iOS scroll / rubber-band glitches where page content can paint oddly above the bar). */
    body::before {
      content: '';
      position: fixed;
      inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.08'/%3E%3C/svg%3E");
      pointer-events: none;
      z-index: 850;
      opacity: 0.4;
    }

    /* NAV */
    .nav-bar {
      position: fixed; top:0; left:0; right:0; z-index:1000;
      -webkit-transform: translateZ(0);
      transform: translateZ(0);
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      display:flex; justify-content:space-between; align-items:center;
      padding:max(14px, env(safe-area-inset-top, 0px)) max(24px, env(safe-area-inset-right, 0px)) 14px max(24px, env(safe-area-inset-left, 0px));
      background:var(--riso-black);
      border-bottom:3px solid var(--riso-yellow);
    }
    .nav-logo { font-family:'VT323',monospace; font-size:1.4rem; color:var(--riso-yellow); letter-spacing:.15em; text-transform:uppercase; }
    .nav-sub  { font-size:.62rem; color:#666; letter-spacing:.2em; text-transform:uppercase; }
    .hamburger { display:flex; flex-direction:column; gap:5px; cursor:pointer; padding:4px; background:none; border:none; }
    .hamburger span { display:block; width:28px; height:2px; background:var(--riso-yellow); transition:all .3s ease; transform-origin:center; }
    .hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
    .hamburger.open span:nth-child(2){opacity:0;}
    .hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

    .menu-overlay {
      position:fixed; inset:0; background:var(--riso-black); z-index:800;
      display:flex; flex-direction:column; justify-content:center; align-items:flex-start;
      padding:60px 48px;
      transform:translateX(-100%);
      transition:transform .4s cubic-bezier(.77,0,.18,1);
      border-right:4px solid var(--riso-yellow);
    }
    .menu-overlay.open{transform:translateX(0);z-index:1100;}
    .menu-overlay nav{display:flex;flex-direction:column;gap:8px;}
    .menu-overlay nav a{font-family:'VT323',monospace;font-size:3.5rem;color:var(--riso-white);text-decoration:none;text-transform:uppercase;letter-spacing:.05em;line-height:1;transition:color .15s;border-bottom:2px solid transparent;}
    .menu-overlay nav a:hover{color:var(--riso-yellow);border-bottom-color:var(--riso-yellow);}
    .menu-footer{position:absolute;bottom:48px;left:48px;font-size:.7rem;color:#555;letter-spacing:.15em;text-transform:uppercase;}

    /* MARQUEE */
    .marquee-wrap{box-sizing:border-box;width:100%;max-width:100%;overflow:hidden;background:var(--riso-yellow);border-top:2px solid var(--riso-black);border-bottom:2px solid var(--riso-black);padding:10px 0;margin-top:calc(53px + env(safe-area-inset-top, 0px));}
    .marquee-track{display:inline-flex;animation:marquee 22s linear infinite;white-space:nowrap;}
    .marquee-track span{font-family:'VT323',monospace;font-size:1.2rem;letter-spacing:.2em;text-transform:uppercase;color:var(--riso-black);padding:0 28px;}
    @keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

    /* HERO — minmax(0,1fr) + min-width:0 so wide headlines don’t force the grid past the viewport
       (otherwise .page-shell clips the right edge). Title size uses cqi from .hero-left. */
    .hero{padding:40px 24px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;}
    .hero-left,.hero-right{min-width:0;}
    .hero-left{padding:32px 40px 32px 0;border-right:2px solid var(--riso-black);display:flex;flex-direction:column;gap:0;container-type:inline-size;container-name:herocol;}
    .hero-left > :first-child{flex-shrink:0;}
    .eyebrow{font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--riso-gray);margin-bottom:16px;}
    .show-title{font-family:'Permanent Marker',cursive;font-size:clamp(2rem,9vw,7rem);line-height:.92;color:var(--riso-black);text-transform:uppercase;position:relative;max-width:100%;overflow-wrap:break-word;}
    @container herocol (min-width:0px){
      .show-title{font-size:clamp(1.75rem,calc(0.45rem + 10.5cqi),6.25rem);line-height:.92;}
    }
    .show-title .highlight{display:inline-block;padding:0 10px;transform:rotate(-1.5deg);position:relative;z-index:0;isolation:isolate;}
    .show-title .highlight::before{content:'';position:absolute;inset:-2px -26px;background:var(--riso-yellow);filter:url(#marker-rough);z-index:-1;}
    .hero-desc{margin-top:28px;font-size:.95rem;line-height:1.7;max-width:380px;border-top:1px solid var(--riso-black);padding-top:20px;}
    .hosts-line{margin-top:20px;font-family:'VT323',monospace;font-size:1.6rem;letter-spacing:.1em;color:var(--riso-black);}
    .hosts-line span{color:var(--riso-gray);font-size:.7rem;font-family:'Courier Prime',monospace;letter-spacing:.2em;text-transform:uppercase;display:block;margin-bottom:4px;}
    .cta-box{margin-top:28px;display:inline-block;}
    .cta-box a{display:inline-block;font-family:'VT323',monospace;font-size:1.5rem;letter-spacing:.1em;text-transform:uppercase;color:var(--riso-black);text-decoration:none;border:2px solid var(--riso-black);padding:8px 20px;position:relative;transition:transform .15s;overflow:visible;}
    .cta-box a::after{content:'';position:absolute;top:2px;left:2px;right:-4px;bottom:-4px;border:2px solid var(--riso-black);z-index:-1;background:var(--riso-yellow);}
    .cta-box a:hover{transform:translate(2px,2px);}

    .player-panel{
      margin-top:20px;
      max-width:420px;
      overflow:hidden;
      max-height:0;
      opacity:0;
      transition:max-height .4s ease, opacity .3s ease;
    }
    .player-panel.open{max-height:120px;opacity:1;}
    .player-label{
      font-size:.6rem;letter-spacing:.25em;text-transform:uppercase;
      color:var(--riso-gray);margin-bottom:8px;
    }
    .player-panel iframe{
      border:2px solid var(--riso-black);
      display:block;
      filter:invert(1) hue-rotate(180deg);
    }

    /* HERO RIGHT */
    .hero-right{padding:40px 0 40px 40px;display:flex;flex-direction:column;gap:20px;}
    .broadcast-block{border:2px solid var(--riso-black);padding:20px;background:var(--riso-white);}
    .broadcast-block.inverted{background:var(--riso-black);color:var(--riso-white);}
    .broadcast-block.inverted .block-label{color:var(--riso-yellow);}
    .block-label{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--riso-gray);display:block;margin-bottom:8px;}
    .block-value{font-family:'VT323',monospace;font-size:clamp(1.2rem,2.2vw,1.9rem);line-height:1.2;overflow-wrap:break-word;word-break:break-word;}

    .next-show-block{border:2px solid var(--riso-black);background:var(--riso-yellow);padding:20px;}
    .next-show-block .block-label{color:#555;}
    .next-show-date{font-family:'Permanent Marker',cursive;font-size:1.5rem;line-height:1.15;color:var(--riso-black);}
    .next-show-time{font-family:'VT323',monospace;font-size:1.2rem;color:#333;margin-top:2px;letter-spacing:.05em;}
    .countdown-row{display:flex;gap:16px;margin-top:14px;flex-wrap:wrap;}
    .countdown-unit{text-align:center;}
    .countdown-num{font-family:'VT323',monospace;font-size:2.2rem;line-height:1;display:block;color:var(--riso-black);}
    .countdown-lbl{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:#444;}

    .zigzag-border{height:12px;background:repeating-linear-gradient(-45deg,var(--riso-black) 0,var(--riso-black) 4px,transparent 4px,transparent 8px);}

    /* PAST SHOWS */
    #past-shows{padding:80px 24px;}
    .section-header{display:flex;align-items:baseline;gap:20px;margin-bottom:40px;padding-bottom:12px;}
    .section-title{font-family:'Special Elite',cursive;font-size:clamp(1.6rem,3.5vw,2.4rem);text-transform:uppercase;letter-spacing:.05em;display:inline-block;position:relative;transform:rotate(-1.2deg);padding:8px 24px 6px;color:var(--riso-black);filter:drop-shadow(2px 3px 0 rgba(0,0,0,0.12));}
    .section-title::before{content:'';position:absolute;inset:0 -8px;background:#e8d9b0;filter:url(#tape-rip);z-index:-1;}
    .section-count{font-family:'VT323',monospace;font-size:1.4rem;color:var(--riso-gray);}
    .shows-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:2px solid var(--riso-black);}
    .show-card{border-right:2px solid var(--riso-black);border-bottom:2px solid var(--riso-black);padding:24px;position:relative;transition:background .15s;cursor:pointer;min-height:280px;}
    .show-card:hover{background:var(--riso-yellow);}
    .show-ep{font-family:'VT323',monospace;font-size:.9rem;letter-spacing:.2em;color:var(--riso-gray);text-transform:uppercase;margin-bottom:8px;}
    .show-date{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--riso-gray);margin-bottom:10px;}
    .show-name{font-family:'Special Elite',cursive;font-size:1.25rem;line-height:1.2;margin-bottom:10px;}
    .show-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;}
    .tag{font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;border:1px solid var(--riso-black);padding:2px 8px;}
    .show-card.featured{background:var(--riso-black);color:var(--riso-white);grid-column:span 2;}
    .show-card.featured:hover{background:#1e1e1e;}
    .show-card.featured .show-ep,.show-card.featured .show-date{color:var(--riso-yellow);}
    .show-card.featured .tag{border-color:#555;color:#ccc;}
    .show-card.featured .show-name{font-size:1.8rem;}
    .show-card{border-right:2px solid var(--riso-black);border-bottom:2px solid var(--riso-black);padding:24px;position:relative;transition:background .15s;cursor:pointer;min-height:280px;display:flex;flex-direction:column;}
    .show-card-placeholder{min-height:0;padding:0;border-color:transparent !important;background:transparent !important;pointer-events:none;visibility:hidden;overflow:hidden;}
    .listen-link{display:inline-block;margin-top:auto;padding-top:16px;font-family:'VT323',monospace;font-size:1.1rem;letter-spacing:.1em;text-transform:uppercase;color:inherit;text-decoration:none;border-bottom:1px solid currentColor;align-self:flex-start;}
    .corner-mark{position:absolute;bottom:16px;right:16px;font-family:'VT323',monospace;font-size:1.4rem;opacity:.18;}

    .archive-hidden{display:none;}
    .archive-hidden.visible{display:block;}

    .load-more-row{margin-top:24px;display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;}
    .load-more-btn{font-family:'VT323',monospace;font-size:1.2rem;letter-spacing:.1em;text-transform:uppercase;color:var(--riso-black);background:none;border:2px solid var(--riso-black);padding:6px 20px;cursor:pointer;position:relative;transition:all .15s;flex-shrink:0;}
    .load-more-btn::after{content:'';position:absolute;inset:-2px;border:2px solid var(--riso-black);transform:translate(3px,3px);z-index:-1;background:var(--riso-yellow);}
    .load-more-btn:hover{transform:translate(2px,2px);}
    .archive-status{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--riso-gray);line-height:1.4;flex:1 1 12rem;min-width:0;}

    /* ABOUT */
    #about{padding:80px 24px;display:grid;grid-template-columns:1fr 2fr;gap:48px;}
    .about-label-col{display:flex;flex-direction:row;gap:12px;align-items:flex-start;border-right:2px solid var(--riso-black);padding-right:48px;}
    .vertical-text{writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);font-family:'VT323',monospace;font-size:1.4rem;letter-spacing:.2em;color:var(--riso-gray);text-transform:uppercase;}
    .about-number{font-family:'Permanent Marker',cursive;font-size:5rem;line-height:1;color:var(--riso-yellow);-webkit-text-stroke:2px var(--riso-black);}
    .about-content{padding:12px 0 0 0;}
    .about-content h2{font-family:'Cabin Sketch',cursive;font-weight:700;font-size:54px;line-height:1.1;text-transform:uppercase;letter-spacing:.01em;color:var(--riso-black);margin:0 0 32px 0;transform:rotate(-0.4deg);}
    .about-content p{font-family:'Architects Daughter',cursive;font-size:17px;line-height:1.7;max-width:560px;margin:0 0 24px 0;}
    .about-content p em{font-style:normal;background-color:transparent;background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 22' preserveAspectRatio='none'><defs><filter id='m' x='-15' y='-2' width='230' height='26' filterUnits='userSpaceOnUse'><feTurbulence type='fractalNoise' baseFrequency='0.04 0.18' numOctaves='2' seed='3' result='noise'/><feColorMatrix in='noise' values='1 0 0 0 0  0 0 0 0 0.5  0 0 0 0 0  0 0 0 0 1' result='hOnlyNoise'/><feDisplacementMap in='SourceGraphic' in2='hOnlyNoise' scale='10' xChannelSelector='R' yChannelSelector='G' result='displaced'/><feTurbulence type='fractalNoise' baseFrequency='0.06 0.18' numOctaves='2' seed='11' result='fibers'/><feColorMatrix in='fibers' values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  5 0 0 0 -0.9' result='fiberMask'/><feComposite in='displaced' in2='fiberMask' operator='in'/></filter></defs><rect x='5' y='1' width='190' height='20' fill='%23d4f500' filter='url(%23m)'/></svg>");background-size:100% 100%;background-repeat:no-repeat;padding:0 5px;-webkit-box-decoration-break:clone;box-decoration-break:clone;}

    /* SUBSCRIBE */
    .subscribe-strip{background:var(--riso-black);color:var(--riso-white);padding:40px 24px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;border-bottom:3px solid var(--riso-yellow);}
    .subscribe-strip h3{font-family:'VT323',monospace;font-size:2rem;letter-spacing:.1em;text-transform:uppercase;}
    .sub-links{display:flex;gap:16px;flex-wrap:wrap;}
    .sub-links a{font-family:'VT323',monospace;font-size:1.3rem;letter-spacing:.1em;text-transform:uppercase;color:var(--riso-yellow);text-decoration:none;border:1px solid var(--riso-yellow);padding:6px 16px;transition:all .15s;}
    .sub-links a:hover{background:var(--riso-yellow);color:var(--riso-black);}

    /* FOOTER */
    footer{padding:32px 24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;}
    footer p{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--riso-gray);}
    .footer-deco{font-family:'VT323',monospace;font-size:1.1rem;color:var(--riso-gray);letter-spacing:.1em;}

    #past-shows, #about { max-width: 1280px; margin-left: auto; margin-right: auto; }
    .hero-wrap { border-bottom: 3px solid var(--riso-black); }
    .hero { max-width: 1280px; margin-left: auto; margin-right: auto; }

    @media(max-width:1100px){ .shows-grid{grid-template-columns:repeat(3,1fr);} }
    @media(max-width:860px){
      .hero{grid-template-columns:minmax(0,1fr);padding:28px 16px;}
      .hero-left{border-right:none;border-bottom:2px solid var(--riso-black);padding:28px 0;}
      .hero-right{padding:28px 0;gap:14px;}
      .broadcast-block,.next-show-block{padding:16px;}
      .shows-grid{grid-template-columns:repeat(2,1fr);}
      .show-card.featured{grid-column:span 2;}
    }
    @media(max-width:700px){
      .load-more-row{flex-direction:column;align-items:stretch;gap:10px;}
      .load-more-btn{align-self:flex-start;}
      .archive-status{flex:none;}
      .shows-grid{grid-template-columns:1fr;}
      .show-card.featured{grid-column:span 1;}
      #about{grid-template-columns:1fr;gap:24px;padding:40px 16px;}
      .about-label-col{border-right:none;border-bottom:none;padding:0;flex-direction:column;align-items:stretch;gap:16px;}
      .about-label-col img{width:100%;height:auto;object-fit:contain;}
      .vertical-text{writing-mode:horizontal-tb;transform:none;font-size:1.2rem;}
      .about-content{padding:12px 0 0 0;}
      .about-content h2{font-size:36px;line-height:1.1;margin:0 0 24px 0;}
      .about-content p{font-size:16px;line-height:1.7;}
    }
