/* TGOC v0.30: Font is delivered from our own Cloudflare origin.
   A fixed, cacheable Worker endpoint fetches the public open-licensed WOFF2
   from Google Fonts server-to-server; visitors make no Google Fonts request. */
@font-face {
  font-family: "Press Start 2P";
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url("/api/font/press-start-2p.woff2") format("woff2");
}
/* TGOC V0.30 - Press Start 2P is first-party proxied. */
:root { --pixel-font: "Press Start 2P", "Courier New", monospace; --discord-font-size: 13px; --card-font-size: 13px; --section-font-size: 17px; --kong-font-size: 16px; }
/* Selected prominent buttons and headings only; body text and navigation remain readable. */
.discord-button > span, .portal-heading, .section-heading h2, .internet-end-copy h2 { font-family: var(--pixel-font); font-weight: 400; }
.discord-button > span { font-size: var(--discord-font-size); line-height: 1.5; letter-spacing: 0; white-space: nowrap; }
.portal-grid .portal-heading { font-size: var(--card-font-size); letter-spacing: -.4px; line-height: 1.44; overflow-wrap: normal; word-break: normal; }
.section-heading h2 { font-size: var(--section-font-size); line-height: 1.5; }
.internet-end-copy h2 { font-size: var(--kong-font-size); line-height: 1.65; color: #ffdf00; }
/* LIVE indicator uses clear bold sans, deliberately not the pixel font. */
.portal-heading .live-badge { font-family: Arial, Helvetica, sans-serif; font-size: 11px; letter-spacing: 0; line-height: 1.1; }
.portal-grid .portal { gap: 10px; }
.portal-grid .portal-copy { min-width: 0; }
.portal-grid .portal-caption { font-size: 11px; }
.discord-button { gap: 14px; }
.portal-icon.tgoc-mic { object-fit: contain; display: block; }
.portal-icon.cap-icon { width: 40px; height: 40px; object-fit: contain; }
.podcast-section-heading h2 { display: flex; align-items: center; }
.podcast-head-mic { width: 36px; height: 36px; object-fit: contain; flex-shrink: 0; }
/* Integrated icons: retain their original colors, dim to 50% brightness at rest, full color on hover/focus. */
.podcast-services { border-top: 1px solid rgba(230,255,238,.14); margin-top: 20px; padding-top: 13px; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.podcast-services .podcast-platform-list { display: flex; align-items: center; gap: 12px; }
.podcast-services .podcast-platform { width: 43px; height: 43px; display: grid; place-items: center; opacity: 1; flex: none; border-radius: 10px; cursor: default; }
.podcast-services .podcast-platform img { height: 40px; width: 40px; object-fit: contain; filter: brightness(.5); opacity: 1; transition: filter .18s ease, opacity .18s ease, transform .18s ease; }
.podcast-services .podcast-platform:hover img, .podcast-services .podcast-platform:focus-visible img { filter: none; opacity: 1; transform: translateY(-2px); }
.podcast-services a.podcast-platform { cursor: pointer; }
/* Heart is an actual image: no intervening spaces, periods, or CSS margins. */
.footer-heart { display: inline-block; width: 17px; height: 17px; vertical-align: -4px; image-rendering: pixelated; margin: 0; }
/* Navigation brand: same subdued and yellow pair as the footer brand. */
.nav-brand { position: relative; display: block; }
.nav-brand img { display: block; transition: opacity .2s ease; }
.nav-brand .nav-logo-hover { position: absolute; inset: 0; width: 100%; height: auto; opacity: 0; pointer-events: none; }
.nav-brand:hover .nav-logo-default, .nav-brand:focus-visible .nav-logo-default { opacity: 0; }
.nav-brand:hover .nav-logo-hover, .nav-brand:focus-visible .nav-logo-hover { opacity: 1; }
/* Footer logo: swap the original subdued white logo for exactly the yellow header/menu artwork. */
.footer-brand { position: relative; display: inline-block; }
.footer-brand img { display: block; transition: opacity .2s ease; }
.footer-brand .footer-logo-hover { position: absolute; inset: 0; width: 100%; height: auto; opacity: 0; }
.footer-brand:hover .footer-logo-default, .footer-brand:focus-visible .footer-logo-default { opacity: 0; }
.footer-brand:hover .footer-logo-hover, .footer-brand:focus-visible .footer-logo-hover { opacity: 1; }
/* Description stays regular typographic body type. */
.podcast-about > p:not(.podcast-eyebrow) { color: #cbd5d5; font-size: 15px; line-height: 1.75; }
@media (max-width: 1300px) and (min-width: 1001px) {
  :root { --card-font-size: 11px; --section-font-size: 16px; }
  .portal-grid .portal { gap: 8px; padding: 15px 11px; }
  .portal-grid .portal-icon { width: 30px; height: 30px; }
  .portal-grid .portal-arrow { display: none; }
}
@media (max-width: 1000px) and (min-width: 641px) {
  :root { --card-font-size: 14px; --section-font-size: 16px; }
}
@media (max-width: 780px) {
  .podcast-about > p:not(.podcast-eyebrow) { font-size: 13px; line-height: 1.55; }
}
@media (max-width: 640px) {
  :root { --discord-font-size: 11px; --card-font-size: 13px; --section-font-size: 13px; --kong-font-size: 13px; }
  .discord-button { gap: 10px; }
  .discord-button > .icon:first-child { width: 26px; height: 26px; }
  .discord-button .button-chevron { width: 15px; height: 15px; margin-left: 0; }
  .podcast-services { justify-content: center; gap: 9px; }
  .podcast-services .podcast-platform-list { gap: 8px; justify-content: center; }
  .podcast-services .podcast-platform { width: 42px; height: 42px; }
  .podcast-services .podcast-platform img { height: 38px; width: 38px; }
  .podcast-section-heading h2 { gap: 8px; }
  .podcast-head-mic { width: 27px; height: 27px; }
  .podcast-about > p:not(.podcast-eyebrow) { font-size: 14px; line-height: 1.6; }
}
@media (max-width: 360px) {
  :root { --discord-font-size: 10px; --card-font-size: 12px; --section-font-size: 11.5px; --kong-font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .footer-brand img, .nav-brand img, .podcast-services .podcast-platform img { transition: none; }
}