@charset "UTF-8";
:root { color-scheme: dark; --bg:#101413; --surface:#191e1b; --border:#2b342e; --muted:#9ba79e; --text:#f2f5ef; --accent:#b0f17f; --header:86px; --sidebar:310px; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size:14px; }
button, input, select { font:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
a { color:inherit; text-decoration:none; }
button:disabled { opacity:.5; cursor:wait; }
:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.app-header { height:var(--header); display:flex; align-items:center; gap:44px; padding:0 32px; border-bottom:1px solid var(--border); }
.brand { display:flex; align-items:center; gap:12px; font-size:23px; font-weight:750; letter-spacing:-.8px; }
.brand-mark { width:39px; height:39px; border-radius:12px; display:grid; place-items:center; color:#142510; background:var(--accent); font-size:17px; padding-left:3px; }
.brand small { display:block; color:var(--muted); font-size:8px; letter-spacing:2.1px; margin-top:4px; font-weight:600; }
nav { display:flex; gap:22px; align-self:stretch; }
.nav-link { border:0; background:none; color:var(--muted); padding:0; font-size:13px; position:relative; }
.nav-link.active { color:var(--text); }
.nav-link.active::after { content:""; position:absolute; bottom:0; left:0; right:0; height:2px; background:var(--accent); }
.account-tools { margin-left:auto; display:flex; align-items:center; gap:18px; }
.support-link { color:var(--muted); font-size:12px; }
.user,.timer { font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums; }
.timer { border:1px solid var(--border); padding:8px 10px; border-radius:7px; }
.button { display:inline-flex; gap:22px; justify-content:center; align-items:center; min-height:47px; padding:12px 22px; border:1px solid var(--accent); background:var(--accent); color:#182311; border-radius:8px; font-weight:650; font-size:13px; transition:background .15s, transform .15s; }
.button:hover { background:#c6ffa0; transform:translateY(-1px); }
.button-small { min-height:37px; padding:8px 14px; font-size:12px; }
.button-ghost { background:transparent; border-color:#55624d; color:var(--text); }
.button-ghost:hover { background:#ffffff0b; }
.text-button,.icon-button { background:none; border:0; padding:0; color:var(--muted); font-size:12px; }
.text-button:hover { color:var(--accent); }
.icon-button { font-size:23px; }
.app-layout { display:grid; grid-template-columns:var(--sidebar) minmax(0,1fr); height:calc(100dvh - var(--header)); }
.library { display:flex; flex-direction:column; min-height:0; padding:29px 20px 0; border-right:1px solid var(--border); background:#121714; }
.eyebrow { color:var(--muted); font-size:9px; letter-spacing:1.9px; font-weight:650; }
.library-heading h2 { margin:10px 0 8px; font-size:21px; letter-spacing:-.7px; }
.library-heading p { color:var(--muted); font-size:11px; margin:0 0 24px; }
.search-form { display:flex; align-items:center; gap:8px; padding:0 11px; border:1px solid #3b463d; border-radius:8px; min-height:43px; }
.search-form>span { font-size:24px; color:var(--muted); }
.search-form input { width:100%; min-width:0; padding:10px 0; background:none; border:0; color:var(--text); outline:none; font-size:11px; }
.search-form:focus-within { border-color:var(--accent); }
.search-form button { background:none; border:1px solid var(--border); color:var(--muted); font-size:11px; border-radius:3px; }
.library-label { display:flex; justify-content:space-between; align-items:center; padding:24px 1px 14px; font-size:9px; letter-spacing:1.3px; color:var(--muted); }
.library-label>span:last-child { padding:3px 6px; background:var(--surface); border-radius:4px; letter-spacing:0; }
.results { flex:1; min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:#3a453c transparent; margin:0 -8px; padding:0 8px 12px; }
.result { display:flex; gap:12px; align-items:center; padding:11px 8px; border:1px solid transparent; border-radius:8px; cursor:pointer; margin:2px 0; font-size:12px; min-height:47px; }
.result:hover,.result:focus-visible { border-color:#344331; background:#1e291e; }
.result img { width:32px; height:32px; object-fit:contain; border-radius:3px; flex-shrink:0; }
.result-label { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; }
.result-arrow { color:#637064; font-size:15px; }
.time { font-size:10px; font-variant-numeric:tabular-nums; color:var(--accent); margin-right:6px; }
.library-footer { display:flex; align-items:center; gap:8px; padding:18px 0; border-top:1px solid var(--border); color:var(--muted); font-size:10px; }
.library-footer button { margin-left:auto; background:none; border:none; color:var(--muted); font-size:19px; }
.live-dot { width:6px; height:6px; display:inline-block; background:var(--accent); border-radius:50%; box-shadow:0 0 10px #b0f17f44; flex-shrink:0; }
.stage { position:relative; min-width:0; min-height:0; }
.panel { position:absolute; inset:0; overflow:auto; padding:30px 34px; }
.home-panel { scrollbar-width:thin; }
.hero { position:relative; min-height:380px; overflow:hidden; border:1px solid #354331; border-radius:15px; background:radial-gradient(ellipse at 95% 80%, #516932 0, transparent 55%),linear-gradient(125deg,#202f24,#27392a 50%,#1b231b); }
.hero-content { position:relative; z-index:1; padding:32px 32px 70px; }
.pill { display:inline-flex; gap:8px; align-items:center; border:1px solid #68785a; padding:7px 10px; border-radius:30px; font-size:8px; letter-spacing:1.4px; background:#ffffff04; }
.hero h1 { font-size:clamp(34px,3.9vw,59px); line-height:1.08; letter-spacing:-2.5px; margin:22px 0 16px; font-weight:650; }
em { color:var(--accent); font-style:normal; }
.hero p { color:#c0cabc; line-height:1.8; font-size:12px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.hero-bottom { position:absolute; bottom:0; left:0; right:0; display:flex; justify-content:space-between; padding:17px 30px; font-size:8px; letter-spacing:1.4px; color:#c6d0bc; border-top:1px solid #ffffff14; }
.hero-art { position:absolute; right:-60px; top:-10px; width:54%; height:100%; display:grid; place-items:center; transform:rotate(-12deg); }
.orbit { position:absolute; width:340px; height:340px; border:1px solid #c4f29c38; border-radius:50%; background:linear-gradient(120deg,#c7f69712,transparent 70%); box-shadow:inset 0 0 65px #00000010; }
.orbit-two { width:260px; height:260px; }
.orbit-three { width:180px; height:180px; }
.orbit-one::before,.orbit-two::after { content:""; width:9px; height:9px; position:absolute; background:var(--accent); border-radius:50%; left:22%; top:7%; box-shadow:0 0 25px #bbf38c; }
.orbit-two::after { left:auto; top:auto; right:1%; bottom:28%; }
.art-play { font-size:53px; color:#cff4a6; transform:rotate(12deg); text-shadow:0 0 60px #c3ffaf55; }
.art-caption { position:absolute; bottom:65px; right:110px; transform:rotate(12deg); border:1px solid #c0df9144; border-radius:5px; padding:10px 13px; display:flex; align-items:center; gap:8px; font-size:8px; letter-spacing:1.6px; }
.section-heading { display:flex; align-items:end; justify-content:space-between; margin:30px 0 18px; }
.section-heading h2 { margin:8px 0 0; font-size:22px; letter-spacing:-.7px; font-weight:600; }
.discovery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.discovery-card { position:relative; overflow:hidden; min-height:168px; text-align:left; padding:25px 20px 18px; border:1px solid #3d4936; border-radius:10px; color:var(--text); background:#243324; transition:transform .2s,border-color .2s; }
.discovery-card:hover { transform:translateY(-3px); border-color:var(--accent); }
.card-news { background:#26343c; border-color:#3e4b55; }
.card-film { background:#3a2e25; border-color:#514134; }
.card-art { position:absolute; right:0; top:-24px; font-size:156px; line-height:1; color:#c1dca624; font-family:Georgia,serif; transform:rotate(-24deg); }
.card-news .card-art { color:#b3d7ef28; }
.card-film .card-art { color:#e7c39528; right:12px; top:6px; font-size:110px; }
.card-kicker { position:relative; display:block; font-size:8px; letter-spacing:1.5px; color:#c4cdbf; }
.discovery-card strong { position:relative; display:block; font-size:27px; letter-spacing:-1px; font-weight:600; margin:22px 0 17px; }
.discovery-card>span:last-child { position:relative; display:block; font-size:10px; color:#c4cdbf; }
.discovery-card b { float:right; font-size:17px; font-weight:400; }
.app-promo { display:flex; align-items:center; gap:18px; padding:20px 23px; border:1px solid var(--border); border-radius:10px; margin-top:22px; }
.promo-icon { font-size:33px; color:var(--accent); background:#273322; padding:3px 13px; border-radius:9px; }
.app-promo h3 { margin:0 0 6px; font-size:14px; font-weight:600; }
.app-promo p { margin:0; color:var(--muted); font-size:11px; }
.app-promo a { margin-left:auto; }
.stage-footer { display:flex; flex-wrap:wrap; justify-content:space-between; padding:22px 0 2px; font-size:9px; color:#77837b; }
.social-links { display:flex; gap:8px; align-items:center; }
.social-links a { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border:1px solid #344b36; border-radius:10px; color:#b1f477; background:#19271b; }
.social-links svg { fill:currentColor; }
.social-links a:hover { color:#102316; background:#b1f477; }
.social-links a:focus-visible { outline:2px solid #b1f477; outline-offset:3px; }
.center-panel { display:grid; place-items:center; }
.surface { position:relative; padding:28px; border:1px solid var(--border); border-radius:14px; background:var(--surface); }
.surface h1,.checkout-heading h1 { font-size:36px; letter-spacing:-1.5px; line-height:1.15; }
.surface p { color:var(--muted); font-size:12px; line-height:1.8; }
#message_content { line-height:1.8; padding:12px 0 24px; overflow-wrap:anywhere; }
.checkout-heading { padding:8px 0 26px; }
.checkout-heading .text-button { display:block; margin-bottom:30px; }
.checkout-heading h1 { margin:14px 0; font-size:40px; }
.checkout-heading p { color:var(--muted); font-size:12px; }
.checkout-columns { display:grid; grid-template-columns:minmax(220px,.85fr) minmax(280px,1.15fr); gap:20px; align-items:start; }
.surface h2 { font-size:23px; letter-spacing:-.7px; margin:12px 0 16px; }
.surface label { display:block; color:var(--muted); font-size:11px; margin:16px 0 8px; }
.surface input,.surface select { width:100%; background:#111713; border:1px solid #354036; border-radius:7px; padding:12px; color:var(--text); min-width:0; }
.surface .button { width:100%; margin-top:17px; }
.sign-in-card>a { display:block; text-align:center; margin-top:25px; font-size:10px; color:var(--muted); }
.plans { margin:20px 0 0; padding:0; border:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.plan { position:relative; }
.plan input { position:absolute; opacity:0; width:1px; height:1px; }
.plan label { margin:0; display:flex; flex-direction:column; gap:10px; padding:12px; border:1px solid #3b453c; border-radius:8px; color:var(--text); cursor:pointer; font-size:11px; }
.plan label span { font-weight:650; font-size:15px; }
.plan input:checked+label { background:#283921; border-color:var(--accent); }
.plan input:focus-visible+label { outline:2px solid var(--accent); outline-offset:3px; }
.form-hint { font-size:10px!important; margin:8px 0 0; }
.checkout-facts { margin:0 0 20px; padding:20px 24px; }
.checkout-facts h2 { margin:0 0 10px; font-size:17px; }
.checkout-facts summary { cursor:pointer; font-weight:650; font-size:13px; }
.checkout-facts[open] summary { margin-bottom:12px; }
.checkout-facts ul { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:12px 24px; margin:0; padding-left:18px; }
.checkout-facts li,.checkout-facts p { font-size:12px; line-height:1.65; color:var(--muted); }
.checkout-facts strong { color:var(--text); }
.checkout-facts p { margin:12px 0 0; }
.player-panel { padding:0; background:#050705; width:100%; height:100%; object-fit:contain; }
.overlay { position:absolute; inset:0; z-index:10; padding:24px; display:grid; place-items:center; background:#080c0be8; backdrop-filter:blur(7px); }
.overlay .surface { width:min(100%,460px); }
.close-button { position:absolute; top:15px; right:16px; background:none; border:none; color:var(--muted); font-size:25px; }
.payment-dialog iframe { width:100%; height:460px; max-height:60dvh; background:#fff; border:0; border-radius:8px; }
@media(min-width:1600px) { .home-panel { padding:40px 60px; } .hero { min-height:450px; } .hero-content { padding:48px 42px 80px; } .hero-art { right:0; } }
@media(max-width:1100px) { :root { --sidebar:270px; } .app-header { padding:0 22px; gap:28px; } .account-tools { gap:10px; } .user:not(.preview-user) { display:none!important; } .panel { padding:25px 24px; } .hero-content { padding:30px 24px 65px; } .hero-art { right:-120px; opacity:.7; } .discovery-card { padding:20px 14px; } .card-kicker { font-size:7px; } .checkout-columns { grid-template-columns:1fr; } }
@media(max-width:800px) { :root { --sidebar:230px; --header:74px; } nav,.support-link { display:none; } .app-header { gap:12px; padding:0 18px; } .brand { font-size:20px; } .brand small { font-size:7px; } .timer { font-size:9px; padding:7px; } .library { padding:25px 14px 0; } .library-heading h2 { font-size:18px; } .library-heading p { font-size:10px; } .panel { padding:20px; } .hero h1 { font-size:38px; } .hero-art { opacity:.3; } .hero-bottom>span:last-child { display:none; } .hero p { font-size:11px; } .hero-actions { flex-direction:column; align-items:start; } .section-heading .text-button { display:none; } .discovery-grid { grid-template-columns:1fr; gap:10px; } .discovery-card { min-height:110px; } .discovery-card strong { margin:12px 0 9px; font-size:24px; } .card-art { top:-30px; } .app-promo { flex-wrap:wrap; padding:18px; gap:12px; } .app-promo a { margin:0; } .stage-footer { gap:10px; } }
@media(max-width:600px) { :root { --header:70px; } .app-header { padding:0 14px; } .brand-mark { width:32px; height:32px; font-size:14px; border-radius:9px; } .brand { font-size:18px; gap:9px; } .brand small { font-size:6px; letter-spacing:1.4px; } .account-tools { gap:8px; } .account-tools .button-small { font-size:10px; padding:8px 10px; gap:9px; } .timer { border:none; padding:0; font-size:9px; } .app-layout { display:flex; flex-direction:column; height:auto; min-height:calc(100dvh - var(--header)); } .library { border-right:0; border-bottom:1px solid var(--border); padding:20px 16px 12px; } .library-heading { display:none; } .search-form { min-height:44px; } .search-form input { font-size:13px; } .library-label { padding:16px 2px 10px; } .results { display:flex; gap:8px; flex:none; overflow-x:auto; max-height:104px; padding-bottom:8px; } .result { flex-shrink:0; border:1px solid var(--border); padding:9px 12px; max-width:240px; min-height:40px; margin:0; } .result img { width:32px; height:32px; } .result-arrow { display:none; } .library-footer { display:none; } .stage { height:calc(100dvh - 220px); min-height:540px; } .panel { padding:18px 16px; } .hero { min-height:394px; } .hero h1 { font-size:42px; } .hero-art { width:55%; top:-50px; right:-95px; opacity:.5; } .hero-content { padding:26px 23px 65px; } .hero-actions { flex-direction:row; gap:8px; } .hero-actions .button { padding:11px 15px; font-size:11px; gap:10px; } .hero-bottom { padding:15px 23px; } .section-heading { margin-top:26px; } .section-heading h2 { font-size:21px; } .discovery-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; } .discovery-card { padding:17px 10px; min-height:145px; } .card-kicker { font-size:6px; letter-spacing:.6px; } .discovery-card strong { font-size:21px; margin-top:30px; } .discovery-card>span:last-child { font-size:8px; line-height:1.5; } .card-art { font-size:100px; top:0; right:-35px; } .card-film .card-art { font-size:73px; right:-5px; } .app-promo a { margin-left:auto; } .checkout-heading h1 { font-size:34px; } .surface { padding:22px; } .overlay { padding:15px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }

@media(max-width:800px) { .art-caption { display:none; } }

@media(max-width:600px) { .app-layout { height:calc(100dvh - var(--header)); min-height:0; } .library { flex-shrink:0; } .stage { flex:1; height:auto; min-height:0; } }
.empty-state { color:var(--muted); padding:20px 8px; font-size:12px; line-height:1.8; }

.standalone-screen { min-height:100dvh; display:grid; place-items:center; padding:24px; background:radial-gradient(ellipse at top,#233321,transparent 65%),var(--bg); }
.standalone-card { width:min(100%,470px); }
.standalone-card h1 { margin:16px 0; }
.back-link { display:block; font-size:12px; color:var(--muted); margin-top:24px; }
.payment-total { font-size:38px; font-weight:650; margin:24px 0; color:var(--accent); letter-spacing:-1px; }
.payment-total span { font-size:16px; color:var(--muted); }
.payment-qr { display:block; max-width:220px; width:100%; margin:24px auto 0; padding:10px; background:#fff; border-radius:9px; }
.admin-card { max-width:100%; overflow:auto; }
.admin-card table { border-collapse:collapse; margin-top:24px; font-size:12px; }
.admin-card td,.admin-card th { text-align:left; padding:14px; border-bottom:1px solid var(--border); }
.admin-card th { color:var(--muted); font-weight:500; }

.standalone-screen:has(.crypto-payment) { padding:12px; align-items:start; }
.crypto-payment { margin:0 auto; padding:16px; width:min(100%,550px); }
.crypto-payment h1 { font-size:20px; margin:8px 0 12px; }
.payment-layout { display:grid; grid-template-columns:160px minmax(0,1fr); gap:16px; align-items:start; }
.crypto-payment .payment-qr { width:160px; height:160px; padding:6px; margin:0; }
.payment-copy-fields { min-width:0; }
.payment-label { display:block; color:var(--muted); font-size:11px; margin:0 0 4px; }
.copy-payment { display:block; width:100%; text-align:left; cursor:pointer; }
.crypto-payment .payment-total { font-size:26px; margin:0 0 12px; padding:4px 6px; }
.payment-address { overflow-wrap:anywhere; font-family:monospace; font-size:12px; padding:8px; }
.copy-status { min-height:16px; font-size:12px; margin:4px 0 0; }
.payment-open { margin-top:12px; }
.payment-note { font-size:12px; margin:8px 0 0; }
@media(max-width:400px) { .payment-layout { grid-template-columns:120px minmax(0,1fr); gap:10px; } .crypto-payment .payment-qr { width:120px; height:120px; } .crypto-payment .payment-total { font-size:21px; } }

/* Keep scan and copy controls together inside short payment frames. */
.payment-dialog iframe { height:min(460px,72dvh); max-height:calc(100dvh - 130px); }
.standalone-screen:has(.crypto-payment) { padding:8px; min-height:100dvh; align-content:center; }
.crypto-payment { padding:12px; }
.crypto-payment h1 { font-size:18px; line-height:1.2; margin:4px 0 10px; }
.crypto-payment .payment-layout { grid-template-columns:min(150px,34vw,45dvh) minmax(0,1fr); gap:12px; align-items:center; }
.crypto-payment .payment-qr { width:100%; height:auto; aspect-ratio:1; max-width:150px; padding:5px; }
.crypto-payment .payment-total { font-size:24px; line-height:1.15; margin:0 0 8px; }
.crypto-payment .payment-address { font-size:11px; line-height:1.25; padding:6px; }
.crypto-payment .copy-status { min-height:14px; line-height:1.2; margin:3px 0 0; }
.crypto-payment .payment-open { display:block; text-align:center; padding:8px 12px; margin-top:8px; }
.crypto-payment .payment-note { font-size:11px; line-height:1.3; margin:6px 0 0; }
@media(max-height:320px) {
 .standalone-screen:has(.crypto-payment) { padding:4px; }
 .crypto-payment { padding:8px; }
 .crypto-payment h1 { font-size:16px; margin:3px 0 6px; }
 .crypto-payment .payment-layout { grid-template-columns:min(110px,30vw) minmax(0,1fr); gap:8px; }
 .crypto-payment .payment-total { font-size:20px; margin-bottom:4px; }
 .crypto-payment .payment-label { font-size:10px; margin-bottom:2px; }
}

/* Size the payment frame from its contents rather than a fixed viewport height. */
.standalone-screen:has(.crypto-payment) { min-height:0; align-content:start; padding:8px; }
.crypto-payment .payment-layout { grid-template-columns:min(150px,34vw) minmax(0,1fr); }
#modal.overlay { position:fixed; }
.payment-dialog { max-height:calc(100dvh - 24px); overflow:auto; }
.payment-dialog h2 { margin:0 0 14px; font-size:20px; }
.payment-dialog iframe { display:block; height:300px; max-height:calc(100dvh - 110px); }
body:has(#modal[style*="visibility: visible"]) { overflow:hidden; }

/* Keep discovery and checkout within ordinary desktop viewport heights. */
@media(min-width:1101px) {
 .panel { padding:20px 28px; }
 .hero { min-height:0; }
 .hero-content { padding:22px 28px 52px; }
 .hero h1 { font-size:clamp(32px,3vw,46px); margin:14px 0 10px; }
 .hero p { margin:8px 0; line-height:1.5; }
 .hero-actions { margin-top:16px; }
 .hero-bottom { padding:12px 28px; }
 .section-heading { margin:18px 0 12px; }
 .section-heading h2 { font-size:20px; margin-top:6px; }
 .discovery-card { min-height:120px; padding:16px; }
 .discovery-card strong { font-size:24px; margin:14px 0 10px; }
 .app-promo { padding:12px 18px; margin-top:14px; }
 .stage-footer { padding:12px 0 0; }
 .checkout-heading { padding:0 0 14px; }
 .checkout-heading .text-button { margin-bottom:14px; }
 .checkout-heading h1 { font-size:30px; margin:8px 0; }
 .checkout-heading p { margin:8px 0 0; }
 .checkout-columns .surface { padding:20px; }
 .checkout-columns .surface h2 { font-size:21px; margin:8px 0 10px; }
 .checkout-columns .surface p { line-height:1.5; margin:8px 0; }
 .checkout-columns .surface label { margin:10px 0 5px; }
 .checkout-columns .surface input,.checkout-columns .surface select { padding:9px 10px; }
 .checkout-columns .surface .button { margin-top:12px; padding:11px; }
 .checkout-columns .plans { margin-top:12px; gap:6px; }
 .checkout-columns .plan label { margin:0; gap:6px; padding:9px 10px; }
}
@media(min-width:1400px) { .checkout-columns .plans { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(min-width:1101px) and (max-height:780px) {
 .hero h1 { font-size:34px; }
 .hero-content { padding:16px 24px 46px; }
 .hero-actions { margin-top:10px; }
 .discovery-card { min-height:100px; padding:12px; }
 .discovery-card strong { font-size:21px; margin:10px 0 8px; }
 .checkout-heading h1 { font-size:26px; }
 .checkout-heading .text-button { margin-bottom:8px; }
}

@media(min-width:1101px) {
 .home-panel { display:grid; grid-template-rows:minmax(340px,1fr) auto minmax(120px,.32fr) auto auto; gap:12px; }
 .home-panel .hero { display:flex; align-items:center; }
 .home-panel .hero-content { width:100%; }
 .home-panel .section-heading { margin:4px 0 0; }
 .home-panel .discovery-grid { min-height:0; }
 .home-panel .discovery-card { height:100%; display:flex; flex-direction:column; justify-content:center; }
 .home-panel .app-promo { margin-top:0; }
 .home-panel .stage-footer { padding:0; align-items:end; }
}
@media(min-width:1101px) and (max-height:780px) {
 .home-panel { grid-template-rows:minmax(285px,1fr) auto minmax(100px,.3fr) auto auto; gap:8px; }
}

img.brand-mark { object-fit:contain; background:transparent; flex-shrink:0; }

.app-notice { position:fixed; top:16px; left:50%; transform:translateX(-50%); z-index:100; width:min(520px,calc(100% - 32px)); display:flex; align-items:flex-start; gap:16px; padding:14px 16px; border:1px solid var(--accent); border-radius:10px; background:var(--surface); box-shadow:0 8px 30px #0006; }
.app-notice[hidden] { display:none; }
.app-notice p { flex:1; margin:0; white-space:pre-line; overflow-wrap:anywhere; line-height:1.5; }
.app-notice button { border:0; background:transparent; color:var(--text); font-size:22px; line-height:1; padding:0 4px; }

.epg-library-link { align-self:flex-start; margin-top:14px; }
.epg-panel h1 { font-size:32px; margin:8px 0; }
.epg-panel .section-heading { margin:0 0 28px; }
.epg-columns { display:grid; grid-template-columns:1fr 2fr 2fr; gap:16px; padding:16px 20px; color:var(--muted); border-bottom:1px solid var(--border); font-size:11px; letter-spacing:1px; }
.epg-empty { text-align:center; margin-top:20px; padding:56px 24px; }
.epg-empty-icon { font-size:42px; color:var(--accent); }
.epg-empty h2 { font-size:24px; margin:20px 0 12px; }
.epg-empty p { color:var(--muted); line-height:1.7; margin-bottom:24px; }
.epg-empty .button { display:inline-flex; }
@media(max-width:600px) { .epg-empty { padding:28px 18px; } .epg-empty h2 { font-size:21px; } .epg-panel .section-heading { align-items:flex-start; gap:12px; } .epg-panel .section-heading .text-button { display:block; } }

.epg-hint { color:var(--muted); font-size:12px; line-height:1.6; }
.epg-row { display:grid; grid-template-columns:1fr 2fr 2fr; gap:16px; padding:18px 20px; border-bottom:1px solid var(--border); }
.epg-row>div,.epg-row>button { min-width:0; overflow-wrap:anywhere; text-align:left; }
.epg-row strong,.epg-row small,.epg-row time { display:block; }
.epg-row strong { font-size:14px; line-height:1.5; }
.epg-row small,.epg-row time,.epg-unavailable { color:var(--muted); font-size:12px; line-height:1.6; }
.epg-row time { color:var(--accent); margin-bottom:4px; }
.epg-paging { display:flex; justify-content:space-between; padding:22px 0; font-size:12px; }
.epg-paging button:disabled { opacity:.35; cursor:default; }
@media(max-width:600px) { .epg-row,.epg-columns { gap:10px; padding:14px 2px; grid-template-columns:1fr 1.4fr 1.4fr; } .epg-row strong { font-size:12px; } .epg-row small,.epg-row time,.epg-unavailable { font-size:11px; } }

.guide-walkthrough { width: 100%; height: auto; }

/* Public guides have their own reading width; payment cards keep their sizing. */
.guide-screen { padding:clamp(12px,3vw,40px); align-items:start; }
.standalone-card.guide-card { width:min(100%,1080px); min-width:0; padding:clamp(20px,4vw,48px); }
.guide-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:24px; margin-bottom:28px; border-bottom:1px solid var(--border); }
.guide-brand { min-width:0; white-space:normal; }
.guide-brand .brand-mark { width:48px; height:48px; flex:none; }
.guide-card article { min-width:0; overflow-wrap:anywhere; }
.guide-card article > p, .guide-card article > h1, .guide-card article > h2, .guide-card article > h3 { max-width:76ch; }
.guide-card article p { font-size:16px; line-height:1.75; }
.guide-card h1 { font-size:clamp(28px,4vw,44px); line-height:1.15; }
.guide-card h2 { margin-top:36px; }
.guide-walkthrough { display:block; border-radius:12px; }
@media (max-width:600px) {
 .guide-header { align-items:flex-start; flex-direction:column; gap:16px; padding-bottom:20px; margin-bottom:24px; }
 .guide-brand { font-size:20px; }
 .guide-brand .brand-mark { width:40px; height:40px; }
 .guide-card article p { font-size:15px; line-height:1.7; }
}

.guide-dialog { width:min(1180px,calc(100% - 32px)); height:calc(100dvh - 32px); max-width:none; max-height:none; padding:0; border:1px solid var(--border); border-radius:16px; background:var(--bg); color:var(--text); overflow:hidden; }
.guide-dialog[open] { display:flex; flex-direction:column; }
.guide-dialog::backdrop { background:#000b; }
.guide-dialog-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 20px; border-bottom:1px solid var(--border); }
.guide-dialog-header h2 { margin:0; font-size:16px; }
.guide-dialog iframe { flex:1; min-height:0; width:100%; border:0; background:var(--bg); }
body:has(.guide-dialog[open]) { overflow:hidden; }
@media (max-width:600px) {
 .guide-dialog { width:calc(100% - 12px); height:calc(100dvh - 12px); border-radius:12px; }
 .guide-dialog-header { padding:10px 12px; gap:8px; }
 .guide-dialog-header h2 { font-size:13px; }
}

/* Direct/search guide visits keep their article in the initial HTML. */
.guide-card article > p, .guide-card article > h1, .guide-card article > h2, .guide-card article > h3 { max-width:none; }
.direct-guide-screen { min-height:100dvh; overflow:hidden; }
.guide-site-background { pointer-events:none; }
.direct-guide-dialog { position:fixed; inset:16px; margin:auto; }
.direct-guide-dialog[open]:not(:modal) { box-shadow:0 0 0 100vmax #000b; }
.direct-guide-scroll { flex:1; min-height:0; overflow:auto; padding:clamp(12px,2vw,28px); }
.direct-guide-scroll .guide-card { width:100%; margin:0 auto; }
@media(max-width:600px) { .direct-guide-dialog { inset:6px; } .direct-guide-scroll { padding:6px; } }

/* Desktop panels fit the viewport; reading/expanded content retains scrolling. */
@media(min-width:1101px) and (min-height:650px) {
 :root { --header:70px; }
 .panel { padding:16px 24px; }
 .home-panel { grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:minmax(180px,1fr) auto 100px auto 40px; gap:10px; }
 .home-panel>.hero,.home-panel>.section-heading,.home-panel>.discovery-grid,.home-panel>.stage-footer { grid-column:1/-1; }
 .home-panel .hero-content { padding:16px 24px 40px; }
 .home-panel .hero h1 { font-size:clamp(28px,2.6vw,40px); margin:10px 0; }
 .home-panel .hero-actions { margin-top:10px; }
 .home-panel .hero-bottom { padding:9px 24px; }
 .home-panel .section-heading h2 { margin:4px 0; }
 .home-panel .discovery-card { min-height:0; padding:12px; }
 .home-panel .discovery-card strong { margin:8px 0; font-size:22px; }
 .home-panel>.app-promo { min-width:0; padding:12px; flex-direction:column; align-items:flex-start; justify-content:center; gap:8px; }
 .home-panel .app-promo h3 { font-size:13px; margin:0 0 6px; }
 .home-panel .app-promo p { font-size:11px; line-height:1.4; margin:4px 0; }
 .home-panel .promo-icon { display:none; }
 .home-panel .app-promo .button { margin:0; }
 .checkout-heading { padding-bottom:10px; }
 .checkout-heading h1 { font-size:25px; line-height:1.1; margin:6px 0; }
 .checkout-heading h1 br { display:none; }
 .checkout-heading .text-button { margin-bottom:8px; }
 .checkout-heading p { font-size:12px; line-height:1.4; margin:6px 0 0; }
 .checkout-facts { padding:10px 14px; margin:0 0 12px; }
 .checkout-columns { gap:16px; grid-template-columns:minmax(220px,.8fr) minmax(360px,1.2fr); }
 .checkout-columns .surface { padding:16px; }
 .checkout-columns .surface h2 { font-size:20px; margin:6px 0; }
 .checkout-columns .surface label { margin:7px 0 4px; }
 .checkout-columns .surface input,.checkout-columns .surface select { padding:7px 10px; }
 .checkout-columns .plans { margin-top:10px; gap:6px; }
 .checkout-columns .plan label { padding:7px 9px; gap:3px; }
 .checkout-columns .surface .button { min-height:38px; padding:9px 12px; margin-top:10px; }
 .checkout-columns .form-hint { font-size:11px; margin:5px 0; }
}
@media(min-width:1101px) and (min-height:650px) {
 .checkout-columns .plans { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .checkout-heading h1 em::before { content:' '; }
}
@media(min-width:1101px) and (min-height:650px) {
 .checkout-columns .surface .plan label { margin:0; }
}
@media(min-width:1101px) and (min-height:650px) and (max-height:740px) {
 .checkout-panel { padding:10px 24px; }
 .checkout-heading h1 { font-size:22px; margin:4px 0; }
 .checkout-heading { padding-bottom:6px; }
 .checkout-heading .text-button { margin-bottom:4px; }
 .checkout-columns .surface { padding:12px; }
 .checkout-columns .surface h2 { font-size:18px; margin:4px 0; }
 .checkout-columns .surface label { margin-top:5px; }
}
