html, body {height: auto; overflow: auto;}
body {margin: 0;}
main {padding: 24px;}
.bwv-header {margin-bottom: 20px;}
.preview-badge {font-size: var(--ts-xs); color: var(--orange); border: 1px solid var(--orange-border); border-radius: 999px; padding: 5px 12px;}
.preview-hint {font-size: var(--ts-sm); margin: 0; color: var(--text-secondary);}
.preview-hint span {display: none;}
.preview-scroll {overflow-x: auto; overflow-y: hidden;}
.funnel-container {min-width: 1100px; height: clamp(480px, calc(100vh - 190px), 760px);}
.pl-planet {min-width: 44px; min-height: 44px;}
.pl-planet.is-webinar {min-width: 28px; min-height: 28px; opacity: 0.7;}
.pl-planet .pl-num {font-size: 14px !important; opacity: 0.8;}
.pl-planet::before {inset: -10px;}
.pl-tip {z-index: 20;}
.preview-topics {border-top: 1px solid var(--border); margin-top: 12px; padding-top: 20px; font-size: var(--ts-base);}
.preview-topics summary {cursor: pointer; color: var(--text); padding: 8px 0;}
.preview-topics > section {margin: 24px 0;}
.preview-topics h2 {font-family: var(--font-heading); font-size: var(--ts-lg); color: var(--text);}
.preview-topics ul {padding-left: 22px;}
.preview-topics li {margin: 10px 0;}
.preview-topics button {background: none; border: 0; padding: 8px 0; color: var(--text); font: inherit; text-align: left; cursor: pointer;}
dialog {margin: auto; color: var(--text); background: var(--bg); border: 1px solid var(--border-strong); border-radius: var(--radius-lg); padding: 40px; width: min(520px, calc(100% - 32px)); max-height: calc(100% - 32px); overflow: auto;}
dialog::backdrop {background: rgb(0 0 0 / 0.75); backdrop-filter: blur(8px);}
.preview-close {position: absolute; top: 12px; right: 12px; width: 44px; height: 44px; color: var(--text); border: 1px solid var(--border-strong); border-radius: 50%; background: var(--surface); font-size: 26px; cursor: pointer;}
.preview-phase {font: 600 var(--ts-xs) var(--font-mono); text-transform: uppercase; letter-spacing: var(--track-caps); color: var(--orange); margin: 0 48px 24px 0;}
.preview-number {font-size: var(--ts-sm); color: var(--text-muted); margin-bottom: 12px;}
#preview-title {font-family: var(--font-heading); font-size: 28px; line-height: 1.2; margin-bottom: 28px;}
#preview-topic-list {padding-left: 20px; font-size: var(--ts-md);}
#preview-topic-list li {margin: 16px 0;}
.preview-note {border-top: 1px solid var(--border); padding-top: 24px; margin-top: 32px; font-size: var(--ts-sm); color: var(--text-muted);}
@media (max-width: 700px) {
  main {padding: 18px;}
  .bwv-logo-wordmark, .bwv-header .subtitle {display: none;}
  .preview-hint span {display: block; margin-top: 8px;}
  .funnel-container {height: 480px;}
  dialog {padding: 28px;}
}
