:root {
  --bg: #07111f;
  --panel: rgba(255, 255, 255, 0.08);
  --panel-strong: rgba(255, 255, 255, 0.13);
  --text: #eef5ff;
  --muted: #9fb1c8;
  --accent: #38bdf8;
  --accent-2: #a78bfa;
  --hot: #fb7185;
  --line: rgba(255, 255, 255, 0.14);
  --shadow: 0 28px 80px rgba(0, 0, 0, 0.34);
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 10% 0%, rgba(56, 189, 248, 0.22), transparent 34rem),
    radial-gradient(circle at 92% 12%, rgba(167, 139, 250, 0.2), transparent 30rem),
    linear-gradient(180deg, #07111f 0%, #0b1220 48%, #101827 100%);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

button, select, input { font: inherit; }
button, .link-button {
  border: 0;
  border-radius: 16px;
  padding: 12px 16px;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  color: #06111f;
  font-weight: 900;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 16px 38px rgba(56, 189, 248, 0.22);
  transition: transform .18s ease, opacity .18s ease;
}
button:hover, .link-button:hover { transform: translateY(-2px); }
button.ghost, .link-button.ghost {
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.08);
  color: var(--text);
  box-shadow: none;
}

.podcast-shell {
  width: min(1240px, calc(100% - 28px));
  margin: 0 auto;
  padding: 28px 0 76px;
}
.hero, .player-card, .insight-grid article, .news-card, .script-card, .radar-card, .reading-card, .source-card, .history-card {
  border: 1px solid var(--line);
  background: var(--panel);
  box-shadow: var(--shadow);
  backdrop-filter: blur(18px);
}
.hero {
  overflow: hidden;
  border-radius: 34px;
  padding: 30px;
  background:
    linear-gradient(135deg, rgba(7, 17, 31, 0.92), rgba(19, 33, 58, 0.72)),
    repeating-linear-gradient(90deg, transparent 0 48px, rgba(255, 255, 255, 0.035) 49px 50px),
    repeating-linear-gradient(0deg, transparent 0 48px, rgba(255, 255, 255, 0.035) 49px 50px);
}
.crumbs { display: flex; gap: 10px; color: var(--muted); font-size: 14px; }
.crumbs a { color: #bae6fd; text-decoration: none; }
.hero-grid { display: grid; grid-template-columns: 1fr 320px; gap: 28px; align-items: end; padding-top: 42px; }
.eyebrow { margin: 0 0 9px; color: var(--accent); font-size: 12px; font-weight: 950; letter-spacing: .16em; text-transform: uppercase; }
h1, h2, h3, p { margin-top: 0; }
h1 { margin-bottom: 16px; font-size: clamp(46px, 8vw, 96px); line-height: .92; letter-spacing: -.075em; }
h2 { margin-bottom: 0; font-size: 28px; }
h3 { margin-bottom: 10px; }
.lead { max-width: 760px; margin-bottom: 0; color: #c8d6e8; font-size: 18px; line-height: 1.85; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.signal-card { border: 1px solid var(--line); border-radius: 26px; padding: 22px; background: rgba(255, 255, 255, 0.08); }
.signal-card span { color: var(--muted); font-size: 13px; font-weight: 800; }
.signal-card strong { display: block; margin: 8px 0; font-size: 34px; letter-spacing: -.04em; }
.signal-card p { margin-bottom: 0; color: var(--muted); line-height: 1.7; }

.player-card { position: sticky; top: 12px; z-index: 5; display: grid; gap: 16px; margin: 20px 0; padding: 18px; border-radius: 28px; background: rgba(8, 18, 32, .86); }
.player-main { display: flex; gap: 16px; align-items: center; }
.round-button { display: grid; width: 58px; height: 58px; flex: 0 0 auto; place-items: center; border-radius: 999px; padding: 0; font-size: 22px; }
.track-info p { margin-bottom: 0; color: var(--muted); line-height: 1.55; }
.player-controls { display: grid; grid-template-columns: auto auto 1fr minmax(220px, 320px); gap: 12px; align-items: center; }
.player-controls label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 900; }
select { width: 100%; border: 1px solid var(--line); border-radius: 14px; padding: 10px; background: #0f1b2d; color: var(--text); }
input[type="range"] { accent-color: var(--accent); }
.progress-line { overflow: hidden; height: 5px; border-radius: 999px; background: rgba(255,255,255,.1); }
.progress-line span { display: block; width: 0%; height: 100%; background: linear-gradient(90deg, var(--accent), var(--accent-2)); transition: width .25s ease; }

.insight-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 22px; }
.insight-grid article { min-height: 190px; border-radius: 26px; padding: 22px; }
.insight-grid span { display: inline-grid; width: 42px; height: 42px; margin-bottom: 18px; place-items: center; border-radius: 15px; background: rgba(56, 189, 248, .16); color: var(--accent); font-weight: 950; }
.insight-grid p, .news-card p, .history-item p { color: var(--muted); line-height: 1.75; }

.toolbar { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0; }
.filter-button { padding: 10px 14px; border-radius: 999px; background: rgba(255,255,255,.07); color: var(--text); box-shadow: none; }
.filter-button.active { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #06111f; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.section-heading.compact { display: block; }
.news-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.news-card { display: flex; flex-direction: column; min-height: 330px; border-radius: 26px; padding: 22px; }
.news-card header { display: flex; justify-content: space-between; gap: 12px; align-items: start; margin-bottom: 12px; }
.news-card h3 { font-size: 22px; line-height: 1.35; }
.badges { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.badge { border: 1px solid var(--line); border-radius: 999px; padding: 5px 9px; color: #c8d6e8; font-size: 12px; font-weight: 800; }
.score { flex: 0 0 auto; display: grid; width: 58px; height: 58px; place-items: center; border-radius: 18px; background: rgba(251, 113, 133, .14); color: #fecdd3; font-weight: 950; }
.commentary { margin-top: auto; padding: 14px; border-left: 3px solid var(--accent); border-radius: 14px; background: rgba(56, 189, 248, .08); }
.news-card a, .source-list a, .reading-grid a { color: #bae6fd; text-decoration: none; }
.news-card a:hover, .source-list a:hover, .reading-grid a:hover { text-decoration: underline; }

.two-column { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(300px, .7fr); gap: 16px; margin-top: 22px; }
.script-card, .radar-card, .reading-card, .source-card, .history-card { border-radius: 28px; padding: 22px; }
pre { overflow: auto; white-space: pre-wrap; margin: 0; color: #dce8f7; line-height: 1.8; font-family: inherit; }
.radar-list { display: grid; gap: 12px; margin: 0; padding-left: 20px; }
.radar-list li { color: var(--muted); line-height: 1.65; }
.radar-list strong { display: block; color: var(--text); }
.reading-card, .source-card, .history-card { margin-top: 16px; }
.reading-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.history-grid { display: grid; gap: 12px; }
.history-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 18px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.06); }
.history-item h3 { margin-bottom: 8px; font-size: 22px; }
.history-item p { margin-bottom: 12px; }
.history-item a { color: #bae6fd; font-weight: 900; text-decoration: none; white-space: nowrap; }
.history-item a:hover { text-decoration: underline; }
.reading-grid a { display: grid; gap: 8px; min-height: 118px; padding: 16px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.06); }
.reading-grid span { color: var(--muted); line-height: 1.6; }
.source-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.source-list a { display: block; padding: 14px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.06); font-weight: 850; }
.source-list span { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; font-weight: 500; }
code { color: #fef08a; }
#toast { position: fixed; right: 20px; bottom: 20px; opacity: 0; transform: translateY(12px); border: 1px solid var(--line); border-radius: 16px; padding: 12px 16px; background: rgba(8,18,32,.94); color: var(--text); transition: .2s ease; }
#toast.show { opacity: 1; transform: translateY(0); }

@media (max-width: 980px) {
  .hero-grid, .two-column, .news-grid, .insight-grid, .reading-grid, .source-list { grid-template-columns: 1fr; }
  .player-controls { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .podcast-shell { width: min(100% - 18px, 1240px); padding-top: 14px; }
  .hero, .player-card, .news-card, .script-card, .radar-card, .reading-card, .source-card, .history-card { border-radius: 22px; padding: 18px; }
  .history-item { grid-template-columns: 1fr; }
  .player-controls { grid-template-columns: 1fr; }
  .player-main { align-items: flex-start; }
}

.history-hero {
  margin-bottom: 20px;
}

.history-page-card {
  margin-top: 0;
}
