@import url('https://fonts.googleapis.com/css2?family=Bagel+Fat+One&family=IBM+Plex+Mono:wght@500;600&display=swap');
/* BirdieFM shared visual foundation: bright signal colors on ink. */
:root{--bg:#111116;--panel:#1b1b24;--line:#454150;--ink:#f5f3fa;--muted:#b9b7c4;--pink:#ff65b3;--lavender:#ac8aff;--yellow:#e7f34a;--edge:#686073;--shadow:#07070b;--control:#25212e}
html{background-color:#09090e;background-image:radial-gradient(circle at 12px 20px,#ac8aff70 0 1px,transparent 1.5px),radial-gradient(circle at 76px 87px,#ff65b380 0 1px,transparent 1.5px),radial-gradient(circle at 41px 132px,#e7f34a55 0 1px,transparent 1.5px)}
body{background:var(--bg);border-color:var(--edge) var(--shadow) var(--shadow) var(--edge);box-shadow:7px 7px var(--shadow)}
.desktop-caption{background:#292037;color:var(--ink);border-bottom-color:var(--shadow)}
.desktop-caption>span:last-child{color:var(--lavender)}
header,footer{background:#17171f;border-color:var(--line);border-bottom-style:solid}
.location-bar{background:#0d0d13;border-color:var(--line)}
.hero{background:none}
.hero h1,.hero h1 .serif{text-shadow:3px 3px var(--shadow)}
.hero-bottom p{font-size:16px}
.station-sticker{background:#19141f;border:2px solid var(--pink);box-shadow:4px 4px var(--shadow)}
.station-sticker strong{color:var(--pink)}
.section h2,.scrap-heading,.standalone-heading{color:var(--ink)}
.kicker{color:var(--lavender);font-size:12px}
.about h2 em{color:var(--pink)}
.ticker{background:#0d0d13;border-block:1px solid var(--line);color:var(--lavender)}
.ticker>span:first-child{color:var(--pink)}
.signal-bars{transform:none}
.home-about,.scrapbook-preview,.guestbook-section,.broadcast-badges{border-top-color:var(--line);border-bottom-color:var(--line)}
.app,.app.notebook,.guest-window,.scrap-card:not(.scrap-visual),.screen-card{background:var(--panel);border:2px solid var(--edge);border-right-color:var(--shadow);border-bottom-color:var(--shadow);box-shadow:3px 3px var(--shadow)}
.app:hover{background:#23202c}
.app-top,.app:nth-child(2) .app-top,.app.notebook .app-top,.guest-title,.guest-pages .guest-title,.scrap-title,.scrap-card:nth-child(even) .scrap-title{background:#282130;border-bottom:1px solid var(--line);color:var(--pink)}
.app:nth-child(2) .app-top,.guest-pages .guest-title,.scrap-card:nth-child(even) .scrap-title{color:var(--lavender)}
.app.notebook .app-top{color:var(--yellow)}
.app p{font-size:16px;line-height:1.65}
.app .app-cta{font-size:14px}
.brains{color:var(--pink)}
.dono{color:var(--lavender)}
.project-row{border-color:var(--line);font-size:14px}
.section-heading>p{font-size:14px}
header nav a,.button,.tune,.hero-bottom .round-link,.retro-action,.more-nav summary{background:var(--control);border:2px solid var(--edge);border-right-color:var(--shadow);border-bottom-color:var(--shadow);color:var(--pink);box-shadow:2px 2px var(--shadow)}
header nav a:hover,.button:hover,.tune:hover,.hero-bottom .round-link:hover,.retro-action:hover:not(:disabled),.more-nav summary:hover,.more-nav[open] summary{background:#38283e;color:var(--ink)}
.hero-bottom .round-link{background:var(--pink);color:#151019;border-color:#ff9acd #a13270 #a13270 #ff9acd;font-size:14px}
.hero-bottom .round-link:hover{background:#ff87c3;color:#151019}
.more-links{background:var(--panel);border-color:var(--edge) var(--shadow) var(--shadow) var(--edge)}
header.simple-header .more-links a:hover{background:#38283e}
.web-badge{border-color:#fff6 #0008 #0008 #fff6;box-shadow:2px 2px var(--shadow)}
.web-badge.pink{background:var(--pink);color:#151019}
.web-badge.purple{background:var(--lavender);color:#151019}
.web-badge.lemon{background:var(--yellow);color:#151019}
.text-link{border-bottom:0}
.guest-form input,.guest-form textarea,.scrap-form textarea,.scrap-form input:not([type=file]){background:#0d0d13;border-color:var(--shadow) var(--edge) var(--edge) var(--shadow)}
.counter-digits{background:#0d0d13;border-color:var(--edge)}
.counter-digits>span{background:#25202d;border-color:var(--line);color:var(--pink)}
.scrap-visual .scrap-media :is(img,video){border-color:var(--line)}
footer{border-top:1px solid var(--line)}
@media(max-width:700px){.hero-bottom p{font-size:16px}.kicker{font-size:12px}.section-heading>p{font-size:14px}}

/* Clearer display type, with the pixel font reserved for station details. */
:root{--heading-font:'IBM Plex Mono','Courier New',monospace}
.hero>h1.welcome-headline,.hero>h1.welcome-headline .serif{font-family:var(--heading-font);font-weight:600;letter-spacing:-.045em;text-shadow:none}
.hero>h1.welcome-headline{font-size:clamp(36px,4.7vw,56px);line-height:1.18}
.section h2,.section h2 em,.scrap-heading,.standalone-heading,.admin-main h1,.scrap-manage-list h2{font-family:var(--heading-font);font-weight:500;font-style:normal;font-size:clamp(26px,3vw,34px);line-height:1.25;letter-spacing:-.04em}
.app h3,.app.notebook h3,.contact h3{font-family:var(--heading-font);font-size:25px;font-weight:500;line-height:1.3;letter-spacing:-.04em}
.screen-title,.screen-title em{font-family:var(--heading-font);font-size:32px;line-height:1.2;letter-spacing:-.04em}
.station-sticker strong{font-family:var(--heading-font);font-size:23px;line-height:1.3;letter-spacing:-.04em}
header nav a,.button,.tune,.retro-action,.more-nav summary{color:var(--lavender)}
.hero-bottom .round-link{background:var(--yellow);color:#17180e;border-color:#f4fc99 #879023 #879023 #f4fc99}
.hero-bottom .round-link:hover{background:#f0fa76;color:#17180e}
.station-sticker{border-color:var(--lavender)}
.station-sticker strong,.about h2 em{color:var(--lavender)}
.app-top,.guest-title{color:var(--lavender)}
.app:nth-child(2) .app-top{color:var(--pink)}
.app.notebook .app-top,.app .app-cta{color:var(--yellow)}
.notebook h3 em{color:var(--lavender)}
.counter-digits>span{color:var(--yellow)}
@media(max-width:700px){.hero>h1.welcome-headline{font-size:clamp(25px,6.5vw,44px);line-height:1.22}.section h2,.scrap-heading,.standalone-heading{font-size:27px}.app h3,.app.notebook h3{font-size:25px}.screen-title,.screen-title em{font-size:27px}}

/* Bagel Fat One connects the station wordmark to the Fourthwall shop. */
header.simple-header .brand,footer .brand{font-family:'Bagel Fat One',Arial,sans-serif;font-weight:400;font-size:42px;letter-spacing:-.025em;line-height:1.1;text-shadow:none;transform:none}
footer .brand{font-size:30px}
@media(max-width:700px){header.simple-header .brand{font-size:33px}}
@media(max-width:390px){header.simple-header .brand{font-size:30px}}

.hero>h1.welcome-headline,.hero>h1.welcome-headline .serif{font-family:'Bagel Fat One',Arial,sans-serif;font-weight:400;letter-spacing:-.025em}
.hero>h1.welcome-headline{font-size:clamp(36px,4.9vw,60px);line-height:1.12}
@media(max-width:700px){.hero>h1.welcome-headline{font-size:clamp(28px,7.3vw,48px);line-height:1.15}}

.about-page-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:42px;margin-top:30px;align-items:start}
.about-story p,.about-contact p{font-size:16px;line-height:1.8;color:var(--muted)}
.about-story p a,.about-contact p a{color:var(--lavender);text-decoration:underline;text-underline-offset:4px}
.about-story .broadcast-badges{margin:28px 0 0;border:0;padding:0}
.about-contact-inner{padding:24px}.about-contact h2{margin:0 0 18px}
.about-email{display:block;color:var(--pink);font:16px/1.7 monospace;overflow-wrap:anywhere;margin:20px 0 28px;text-decoration:underline;text-underline-offset:4px}
@media(max-width:750px){.about-page-grid{grid-template-columns:1fr;gap:30px}.about-contact-inner{padding:20px}}

.project-row .project-link{color:var(--lavender);text-decoration:underline;text-underline-offset:4px}.project-row .project-link:hover{color:var(--pink)}