/* Announcement and approved first screen */
.bar-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.notice{position:relative;height:40px;display:flex;align-items:center;justify-content:center;padding:0 60px;background:var(--notice);color:var(--ink);font-size:13.5px;font-weight:500;letter-spacing:.01em;line-height:1.4}
.notice-text{white-space:nowrap}
.notice-sep{margin:0 10px;color:var(--peri-deep)}
.notice a{margin-left:12px;font-weight:600;text-decoration:underline;text-decoration-thickness:1.5px;text-underline-offset:3px}
.notice-close{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:30px;height:30px;display:grid;place-items:center;border-radius:var(--r-pill);color:var(--ink);background:transparent;cursor:pointer;transition:background-color var(--time-fast)}
.notice-close svg{width:18px;height:18px}
.notice-close:hover{background:var(--hi-1)}
.bar-toggle:focus-visible+.notice .notice-close{outline:2px solid var(--ink);outline-offset:2px}
.bar-toggle:checked+.notice{display:none}
.first-screen{position:relative;isolation:isolate;overflow:clip;max-width:100%;background:linear-gradient(180deg,var(--bg-top) 0%,var(--bg) 52%,var(--bg-bottom) 100%)}
.first-screen-glow{position:absolute;inset:0 -12% 34% 44%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,var(--glow) 0%,color-mix(in srgb,var(--glow) 55%,transparent) 45%,transparent 100%);opacity:.85}
.hero{position:relative;padding-top:28px;padding-bottom:44px}
.hero-copy{position:relative;z-index:3;max-width:1040px;margin:0 auto;padding:0 24px;display:flex;flex-direction:column;align-items:center;text-align:center}
.eyebrow{height:30px;display:inline-flex;align-items:center;gap:9px;padding:0 14px 0 12px;border-radius:var(--r-pill);background:var(--panel);color:var(--ink-soft);font-size:13px;font-weight:600;letter-spacing:.04em;box-shadow:inset 0 0 0 1px var(--border),inset 0 1px 0 var(--hi-1),var(--lift-warm)}
.eyebrow-dot{width:8px;height:8px;flex-shrink:0;border-radius:var(--r-pill);background:var(--accent-dark);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent-dark) 15%,transparent)}
.hero h1{margin:16px 0 0;font-family:var(--font-display);font-weight:800;font-size:68px;line-height:1.1;letter-spacing:-.03em;color:var(--ink)}
.mark{position:relative;display:inline-block;z-index:0;margin-right:.18em}
.mark::after{content:"";position:absolute;left:-.05em;right:-.07em;bottom:.03em;height:.25em;z-index:-1;border-radius:.06em .22em .1em .26em / .18em .1em .22em .12em;background:linear-gradient(100deg,var(--accent) 0%,var(--accent) 72%,color-mix(in srgb,var(--accent) 80%,var(--accent-dark)) 100%);transform:rotate(-1.1deg) skewX(-8deg)}
.lede{margin-top:14px;font-size:20px;line-height:1.5;color:var(--muted)}
.lede span{display:block}
.lede strong{color:var(--ink);font-weight:600}
.facts{margin:18px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.facts li{height:32px;display:inline-flex;align-items:center;gap:7px;padding:0 14px 0 11px;border-radius:var(--r-pill);background:var(--panel);color:var(--ink-soft);font-size:13.5px;font-weight:500;white-space:nowrap;box-shadow:inset 0 0 0 1px var(--border),inset 0 1px 0 var(--hi-1),var(--lift-warm)}
.facts svg{width:15px;height:15px;color:var(--muted);flex:none}
.meta-row{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:20px;color:var(--ink-soft);font-size:13px}
.meta-group{display:flex;align-items:center;gap:12px}
.meta-label{font-size:12px;color:var(--muted-2);letter-spacing:.08em;white-space:nowrap}
.meta-group ul{display:flex;align-items:center;gap:14px;margin:0;padding:0;list-style:none}
.meta-group li{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.plat svg{width:17px;height:17px;flex:none;color:var(--ink-soft)}
.vrule{width:1px;height:18px;background:var(--border-strong);flex:none}
.flag{position:relative;display:inline-block;flex:none;width:21px;height:14px;border-radius:3.5px;overflow:hidden;vertical-align:middle}
.flag svg{display:block;width:100%;height:100%}
.flag::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 16%,transparent)}
.flag-lg{width:24px;height:16px;border-radius:var(--r-sm)}
.fx-red{fill:var(--fl-red)}.fx-white{fill:var(--fl-white)}.fx-blue{fill:var(--fl-blue)}
.fx-st-white{fill:none;stroke:var(--fl-white)}.fx-st-red{fill:none;stroke:var(--fl-red)}.fill-cream{fill:var(--cream)}
.reel{--cw:clamp(260px,calc((100% - 64px) / 4),420px);--ch:clamp(300px,calc(100svh - 556px),372px);position:relative;z-index:2;width:100%;margin-top:24px}
.reel-track{display:flex;justify-content:center;gap:16px}
.pcard{--c:var(--peri);position:relative;flex:0 0 var(--cw);width:var(--cw);height:var(--ch);border-radius:var(--r-card);background:var(--c);box-shadow:inset 0 1px 0 var(--hi-1),inset 0 0 0 1px var(--hi-2),0 6px 14px -8px color-mix(in srgb,var(--c) 30%,transparent),0 26px 40px -6px color-mix(in srgb,var(--c) 12%,transparent);transition:transform .35s var(--ease)}
.pcard::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(155deg,var(--hi-2),transparent 44%)}
.pcard:hover{transform:translateY(-6px)}
.poster{position:absolute;inset:28px;border-radius:var(--r-poster);overflow:hidden;display:flex;flex-direction:column}
.pc-tokyo{--c:var(--peri)}
.pc-tokyo .poster{inset:28px 24px 28px 64px;padding:20px;align-items:flex-end;text-align:right;color:var(--cream);background:linear-gradient(170deg,color-mix(in srgb,var(--peri-deep) 86%,var(--peri)),var(--peri-deep) 62%);box-shadow:inset 0 0 0 1px var(--hi-2),0 18px 30px -18px color-mix(in srgb,var(--peri-deep) 60%,transparent)}
.oval{display:inline-block;padding:2px 13px;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--cream) 78%,transparent);font-family:var(--font-serif);font-size:14px;letter-spacing:.06em}
.serif-big{margin-top:14px;font-family:var(--font-serif);font-weight:700;font-size:48px;line-height:1.04;letter-spacing:.03em}
.sub-line{margin-top:10px;font-size:12px;letter-spacing:.08em;color:var(--peri-soft)}
.poster-foot{margin-top:auto;display:flex;align-items:center;gap:8px}
.tag-outline{height:24px;display:inline-flex;align-items:center;padding:0 10px;border-radius:var(--r-pill);border:1px solid color-mix(in srgb,currentColor 55%,transparent);font-size:11.5px;font-weight:600;letter-spacing:.04em;white-space:nowrap}
.pc-global{--c:var(--olive)}
.pc-global .poster{padding:16px 18px 18px;align-items:center;text-align:center;color:var(--olive-cream);background:linear-gradient(180deg,color-mix(in srgb,var(--olive-deep) 90%,var(--olive)),var(--olive-deep) 40%);box-shadow:inset 0 0 0 1px var(--hi-2),0 18px 30px -18px color-mix(in srgb,var(--olive-deep) 60%,transparent)}
.kicker{font-size:10.5px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap}
.rule{display:block;width:100%;height:1px;margin:10px 0 12px;background:color-mix(in srgb,var(--olive-cream) 32%,transparent)}
.slab{font-family:var(--font-display);font-weight:900;font-size:46px;line-height:.92;letter-spacing:-.045em;text-transform:uppercase;transform:scaleX(.86)}
.ticks{width:100%;margin-top:14px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.tick{padding:9px 2px 7px;border-radius:var(--r-sm);background:var(--olive-mid);box-shadow:inset 0 1px 0 var(--hi-2)}
.tick b{display:block;font-family:var(--font-mono);font-size:19px;font-weight:800;line-height:1;letter-spacing:-.04em}
.tick span{display:block;margin-top:5px;font-size:10.5px;opacity:.82;white-space:nowrap}
.outline-btn{width:100%;height:30px;margin-top:auto;display:grid;place-items:center;border-radius:var(--r-sm);border:1px solid color-mix(in srgb,currentColor 55%,transparent);font-size:12px;font-weight:700;letter-spacing:.14em}
.pc-west{--c:var(--oxblood)}
.pc-west .poster{inset:28px 34px;padding:50px 22px 18px;align-items:center;text-align:center;border-radius:200px 200px var(--r-poster) var(--r-poster);color:var(--oxblood);background:linear-gradient(180deg,var(--cream),var(--cream-2));box-shadow:inset 0 1px 0 var(--hi-1),0 18px 30px -16px color-mix(in srgb,var(--oxblood) 70%,transparent)}
.pc-west .kicker{letter-spacing:.26em}
.retro{margin-top:6px;font-family:var(--font-display);font-weight:900;font-size:44px;line-height:1.08;letter-spacing:-.02em;text-shadow:3px 3px 0 color-mix(in srgb,var(--ochre) 75%,transparent)}
.flag-list{display:flex;flex-wrap:wrap;justify-content:center;width:100%;gap:4px 12px;margin:14px 0 0;padding:0;list-style:none;font-size:12px;font-weight:600}
.flag-list li{display:inline-flex;align-items:center;gap:5px;min-width:0;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.chip-row{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
.pc-west .outline-btn{border-width:1.5px;border-color:color-mix(in srgb,var(--oxblood) 70%,transparent)}
.sticker{position:absolute;top:12px;right:10px;z-index:2;width:88px;height:88px;display:grid;place-items:center;text-align:center;color:var(--oxblood);transform:rotate(14deg)}
.sticker svg{position:absolute;inset:0;width:88px;height:88px;filter:drop-shadow(0 8px 10px color-mix(in srgb,var(--ink) 30%,transparent))}
.sticker-text{position:relative;line-height:1.2}
.sticker-text b{display:block;font-size:13px;font-weight:900;letter-spacing:.02em}
.sticker-text span{display:block;font-size:10.5px;font-weight:700}
.pc-route{--c:var(--ochre)}
.win{position:absolute;inset:26px 22px;display:flex;flex-direction:column;overflow:hidden;border-radius:var(--r-win);background:var(--panel);box-shadow:inset 0 1px 0 var(--hi-1),0 0 0 1px color-mix(in srgb,var(--ochre-deep) 16%,transparent),0 20px 34px -14px color-mix(in srgb,var(--ochre-deep) 42%,transparent)}
.chrome{height:38px;flex:none;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 8px 0 11px;border-bottom:1px solid var(--border);background:linear-gradient(180deg,var(--panel),color-mix(in srgb,var(--panel-2) 45%,var(--panel)))}
.chrome-brand{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:800;letter-spacing:-.01em;white-space:nowrap}
.chrome-brand .brand-mark{width:18px;height:18px;border-radius:var(--r-sm)}
.chrome-title{font-size:11px;font-weight:700;letter-spacing:.16em;color:var(--ink-soft);white-space:nowrap}
.chrome-btn{justify-self:end;height:24px;display:inline-flex;align-items:center;justify-content:center;padding:0 11px;border-radius:var(--r-sm);background:var(--ink);color:var(--on-ink);font-size:11.5px;font-weight:700;text-decoration:none}
.win-body{flex:1;display:flex;flex-direction:column;gap:7px;padding:10px 11px 11px;min-height:0}
.seg{display:inline-flex;gap:2px;padding:3px;border-radius:var(--r-pill);background:var(--panel-2);align-self:flex-start}
.seg span{padding:3px 10px;border-radius:var(--r-pill);font-size:11px;color:var(--muted);white-space:nowrap}
.seg .on{background:var(--panel);color:var(--ink);font-weight:600;box-shadow:0 1px 3px color-mix(in srgb,var(--ochre-deep) 22%,transparent)}
.routes{display:flex;flex-direction:column;gap:6px;margin:2px 0 0;padding:0;list-style:none}
.route{height:40px;display:flex;align-items:center;gap:8px;padding:0 10px;border-radius:var(--r-sm);background:var(--panel);box-shadow:inset 0 0 0 1px var(--border)}
.route.on{background:color-mix(in srgb,var(--ochre) 15%,var(--panel));box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--ochre) 75%,transparent)}
.route-name{font-size:13px;font-weight:700;white-space:nowrap}
.route-code{font-family:var(--font-mono);font-size:10px;color:var(--muted);letter-spacing:.04em}
.route-tag{margin-left:auto;padding:2px 8px;border-radius:var(--r-pill);background:var(--panel-2);color:var(--ink-soft);font-size:10.5px;font-weight:600;white-space:nowrap}
.route.on .route-tag{background:var(--panel)}
.status-dot{width:8px;height:8px;flex:none;border-radius:var(--r-pill);background:var(--success);box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 16%,transparent)}
.win-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--muted)}
.pc-hbo{--c:var(--peri)}
.pc-hbo .poster{inset:28px 64px 28px 24px;padding:18px 16px;align-items:flex-start;color:var(--peri-deep);background:linear-gradient(180deg,var(--cream),var(--cream-2));box-shadow:inset 0 1px 0 var(--hi-1),0 18px 30px -18px color-mix(in srgb,var(--peri-deep) 55%,transparent)}
.pc-hbo .rule{background:color-mix(in srgb,var(--peri-deep) 25%,transparent)}
.pc-hbo .slab{font-size:30px;line-height:1;transform-origin:left center}
.pc-hbo .sub-line{color:var(--peri-deep);font-weight:700;font-size:13px;letter-spacing:.12em}
.row-list{width:100%;margin-top:auto;display:flex;flex-direction:column;gap:6px}
.row-list span{height:28px;display:flex;align-items:center;gap:7px;padding:0 10px;border-radius:var(--r-sm);border:1px solid color-mix(in srgb,var(--peri-deep) 45%,transparent);font-family:var(--font-serif);font-size:13px;white-space:nowrap}
.reel-lock{position:absolute;top:-14px;right:6%;display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:var(--r-pill);background:var(--panel);box-shadow:var(--lift-warm);font-size:12px;z-index:4}
.reel-lock svg{width:14px;height:14px}
.reel-pause{position:absolute;right:32px;bottom:-18px;display:grid;place-items:center;width:32px;height:32px;background:var(--muted);color:var(--panel);border-radius:var(--r-sm);font-size:12px}

/* Navigation, data and editorial components */
.tabs{min-width:0}
[role="tablist"]{display:flex;gap:8px;max-width:100%;overflow-x:auto;padding:6px;background:var(--panel-2);border-radius:var(--r-pill);scrollbar-width:thin}
[role="tab"]{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 20px;flex-shrink:0;white-space:nowrap;border-radius:var(--r-pill);background:transparent;color:var(--muted);font-size:var(--text-sm)}
[role="tab"][aria-selected="true"]{color:var(--ink);background:var(--panel);box-shadow:inset 0 0 0 1px var(--border),var(--lift-warm);font-weight:700}
[role="tabpanel"]{margin-top:24px;min-width:0}
.toc-tabs{position:sticky;top:12px;z-index:25;display:flex;align-items:center;gap:8px;max-width:100%;overflow-x:auto;padding:8px;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-pill);box-shadow:var(--lift-warm)}
.toc-tabs a{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:44px;padding:8px 18px;white-space:nowrap;font-size:var(--text-sm);text-decoration:none;border-radius:var(--r-pill);color:var(--muted)}
.toc-tabs a.is-current,.toc-tabs a[aria-current]{background:var(--ink);color:var(--on-ink)}
body:has(.toc-tabs) section[id]{scroll-margin-top:var(--toc-offset)}
.faq-item{padding:0 24px;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-win);box-shadow:inset 0 1px 0 var(--hi-1)}
.faq-item+.faq-item{margin-top:12px}
.faq-item summary{position:relative;list-style:none;cursor:pointer;padding:20px 32px 20px 0;font-weight:600}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:0;top:18px;width:24px;height:24px;display:grid;place-items:center;color:var(--muted)}
.faq-item[open] summary::after{content:"−"}
.faq-item p{padding-bottom:24px;color:var(--muted)}
.badge,.tag{display:inline-flex;align-items:center;gap:6px;min-height:28px;max-width:100%;padding:3px 12px;border-radius:var(--r-pill);background:var(--panel-2);color:var(--ink-soft);font-size:var(--text-xs);line-height:1.5;overflow-wrap:anywhere}
.badge-success{background:color-mix(in srgb,var(--success) 12%,var(--panel));color:var(--success)}
.badge-warn{background:color-mix(in srgb,var(--warn) 15%,var(--panel));color:var(--olive-deep)}
.badge-error{background:color-mix(in srgb,var(--error) 10%,var(--panel));color:var(--error)}
.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch;margin-top:28px}
.plan-card{position:relative;display:flex;flex-direction:column;gap:20px;min-width:0;padding:32px;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-card);box-shadow:var(--shadow-panel)}
.plan-card.is-current{background:color-mix(in srgb,var(--olive) 18%,var(--panel));border-color:var(--olive-deep);box-shadow:inset 0 0 0 1px var(--olive-deep),0 26px 40px -6px color-mix(in srgb,var(--olive) 12%,transparent)}
.plan-badge{align-self:flex-start;display:inline-flex;align-items:center;min-height:28px;padding:3px 12px;background:var(--olive-deep);color:var(--olive-cream);border-radius:var(--r-pill);font-size:var(--text-xs);font-weight:700}
.plan-card h3{margin:0}
.plan-price{font-family:var(--font-mono);font-size:36px;line-height:1.2;font-weight:700;font-variant-numeric:tabular-nums}
.plan-price small{font-family:var(--font-body);font-size:var(--text-sm);font-weight:400;color:var(--muted)}
.plan-card ul{padding-left:20px;margin:0;color:var(--muted)}
.plan-card .btn{margin-top:auto;align-self:flex-start}
.table-scroll{overflow-x:auto;max-width:100%;width:100%;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:var(--r-win);background:var(--panel)}
.data-table,.route-table{width:100%;min-width:640px;border-collapse:collapse;font-size:var(--text-sm);text-align:left}
.data-table th,.route-table th{font-weight:700;background:var(--panel-2);color:var(--ink);white-space:nowrap}
.data-table th,.data-table td,.route-table th,.route-table td{padding:16px 20px;border-bottom:1px solid var(--border);word-break:keep-all}
.data-table td:first-child,.route-table td:first-child{color:var(--ink);font-weight:600}
.data-table tr:last-child td,.route-table tr:last-child td{border-bottom:0}
.route-table .region-row th{background:var(--peri-soft);color:var(--peri-deep)}
.prose>.data-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;min-width:0}
.platform-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.platform-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;min-width:0;padding:24px 12px;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-card);box-shadow:var(--shadow-panel)}
.platform-card svg{width:32px;height:32px}
.platform-card h3{font-size:18px;margin:0}
.platform-card .btn{font-size:13px;padding-inline:14px}
.article-card{min-width:0;padding:28px;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-card);box-shadow:var(--shadow-panel);display:flex;flex-direction:column;gap:16px}
.article-card h3{font-size:22px;margin:0}
.article-card h3 a{text-decoration:none}
.article-card h3 a:hover{text-decoration:underline}
.article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;font-size:var(--text-xs);color:var(--muted)}
.article-card p{color:var(--muted);font-size:var(--text-sm)}
.article-card>a{margin-top:auto;min-height:28px}
.article-hero{position:relative;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-card);padding:40px 32px 40px 52px;overflow-x:clip;box-shadow:var(--shadow-panel)}
.article-hero::before{content:"";position:absolute;left:20px;top:24px;bottom:24px;width:6px;border-radius:var(--r-pill);background:linear-gradient(var(--accent),var(--oxblood))}
.callout{margin:24px 0;padding:20px 24px;border-left:4px solid var(--olive-deep);border-radius:0 var(--r-win) var(--r-win) 0;background:var(--panel-2);color:var(--ink-soft)}
.promo-block{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:32px;background:var(--panel-2);border:1px solid var(--border);border-radius:var(--r-card);box-shadow:var(--shadow-panel)}
.promo-block>div{min-width:0}
.promo-block h2,.promo-block h3{margin-bottom:10px;font-size:24px}
.promo-block p{color:var(--muted)}
.promo-block .btn{flex-shrink:0;white-space:nowrap}
.float-cta{position:fixed;right:24px;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:40;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 22px;border-radius:var(--r-pill);background:var(--ink);color:var(--on-ink);box-shadow:0 12px 30px -10px color-mix(in srgb,var(--oxblood) 35%,transparent),inset 0 1px 0 var(--hi-2);text-decoration:none;font-size:var(--text-sm);font-weight:600}
.float-cta svg{width:18px;height:18px}
body:has(.float-cta)::after{content:"";display:block;height:calc(88px + env(safe-area-inset-bottom,0px))}
.feature-heading{text-align:center;max-width:800px;margin:0 auto 40px}
.feature-heading p{color:var(--muted);font-size:var(--text-lede)}
.feature-stage{padding:56px;background:var(--panel-2);border-radius:var(--r-stage);overflow-x:clip}
.feature-window{position:relative;background:var(--panel);border-radius:var(--r-win);overflow:hidden;box-shadow:inset 0 1px 0 var(--hi-1),0 26px 40px -6px color-mix(in srgb,var(--olive) 12%,transparent)}
.feature-browser{display:grid;grid-template-columns:220px minmax(0,1fr);min-height:400px}
.feature-browser>[role="tablist"]{flex-direction:column;border-radius:0;padding:20px;background:var(--panel);border-right:1px solid var(--border);overflow:visible}
.feature-browser [role="tab"]{justify-content:flex-start;white-space:normal;text-align:left;border-radius:var(--r-sm)}
.feature-browser [role="tab"][aria-selected="true"]{background:var(--peri-soft)}
.feature-browser [role="tabpanel"]{margin:0;padding:32px}
.feature-detail{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.8fr);gap:28px;align-items:center}
.feature-detail p{color:var(--muted)}
.feature-poster{display:flex;align-items:center;justify-content:center;min-height:260px;padding:24px;background:var(--oxblood);color:var(--cream);border-radius:var(--r-poster);font-family:var(--font-serif);font-size:36px;font-weight:700;text-align:center;line-height:1.3}
.draw-lines{display:block;width:100%;height:80px;color:var(--olive-deep)}
.draw-lines path{fill:none;stroke:currentColor;stroke-width:2}

/* Preview catalogue */
.preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.swatch{min-width:0;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-win);overflow:hidden;font-family:var(--font-mono);font-size:12px}
.swatch span{display:block;padding:12px;overflow-wrap:anywhere}
.swatch-chip{display:block;height:64px;border-bottom:1px solid var(--border)}
.sw-bg{background:var(--bg)}.sw-top{background:var(--bg-top)}.sw-bottom{background:var(--bg-bottom)}.sw-panel{background:var(--panel)}.sw-panel2{background:var(--panel-2)}.sw-border{background:var(--border)}.sw-border-strong{background:var(--border-strong)}
.sw-accent{background:var(--accent)}.sw-accent-dark{background:var(--accent-dark)}.sw-ink{background:var(--ink)}.sw-ink-soft{background:var(--ink-soft)}.sw-muted{background:var(--muted)}.sw-muted2{background:var(--muted-2)}.sw-success{background:var(--success)}.sw-warn{background:var(--warn)}.sw-error{background:var(--error)}
.sw-glow{background:var(--glow)}.sw-notice{background:var(--notice)}.sw-peri{background:var(--peri)}.sw-peri-deep{background:var(--peri-deep)}.sw-peri-soft{background:var(--peri-soft)}
.sw-olive{background:var(--olive)}.sw-olive-deep{background:var(--olive-deep)}.sw-olive-mid{background:var(--olive-mid)}.sw-olive-cream{background:var(--olive-cream)}.sw-oxblood{background:var(--oxblood)}.sw-ochre{background:var(--ochre)}.sw-ochre-deep{background:var(--ochre-deep)}
.sw-cream{background:var(--cream)}.sw-cream2{background:var(--cream-2)}.sw-on-ink{background:var(--on-ink)}.sw-hi1{background:var(--hi-1)}.sw-hi2{background:var(--hi-2)}.sw-veil{background:var(--veil)}.sw-red{background:var(--fl-red)}.sw-white{background:var(--fl-white)}.sw-blue{background:var(--fl-blue)}
.sample-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.type-display{font-family:var(--font-display);font-size:52px;font-weight:800;line-height:1.1}
.type-serif{font-family:var(--font-serif);font-size:32px}
.preview-note{font-size:var(--text-sm);color:var(--muted);margin-bottom:24px}
@media(max-width:1100px){
  .meta-row{flex-direction:column;gap:12px}
  .vrule{display:none}
  .platform-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .feature-stage{padding:28px}
}
@media(max-width:768px){
  .hero h1{font-size:40px;letter-spacing:-.02em;max-width:100%}
  .hero-copy{padding-inline:var(--gutter)}
  .lede{font-size:18px}
  .meta-group ul{flex-wrap:wrap;justify-content:center;gap:10px 14px}
  .meta-group{justify-content:center}
  .plan-grid{grid-template-columns:minmax(0,1fr)}
  .feature-browser{display:block}
  .feature-browser>[role="tablist"]{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--border)}
  .feature-browser [role="tab"]{white-space:nowrap}
  .feature-detail{grid-template-columns:minmax(0,1fr)}
  .feature-poster{min-height:180px}
  .promo-block{align-items:flex-start;flex-direction:column}
}
@media(max-width:640px){
  .notice{justify-content:flex-start;padding-left:16px;padding-right:48px;font-size:12px}
  .notice-text{overflow-x:auto;scrollbar-width:none;max-width:100%}
  .notice-sep{margin-inline:6px}
  .notice a{margin-left:8px}
  .hero{padding-top:24px;padding-bottom:36px}
  .hero h1{font-size:clamp(28px,9vw,40px)}
  .eyebrow{font-size:12px}
  .facts{gap:6px}
  .facts li{font-size:11.5px;padding-inline:10px;height:30px}
  .meta-row{width:100%;font-size:11px}
  .meta-group{max-width:100%;gap:8px}
  .meta-label{display:none}
  .plat svg{width:15px;height:15px}
  .meta-group ul{gap:8px 12px}
  .reel{--cw:80vw;--ch:320px;overflow-x:auto;overflow-y:hidden;padding:16px var(--gutter) 32px;margin-top:8px;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter)}
  .reel-track{justify-content:flex-start;width:max-content;gap:16px}
  .pcard{scroll-snap-align:start}
  .pc-tokyo .poster,.pc-hbo .poster{inset:28px 24px}
  .reel-lock,.reel-pause{display:none}
  .platform-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .platform-card:last-child{grid-column:1/-1}
  .feature-stage{padding:12px}
  .feature-browser [role="tabpanel"]{padding:20px}
  .plan-card{padding:24px}
  .float-cta{right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px))}
  .article-hero{padding:28px 24px 28px 40px}
  .article-hero::before{left:16px}
  .type-display{font-size:36px}
  .promo-block{padding:24px}
}

/* fab-guard:start */
@supports (animation-timeline:scroll()){
  .float-cta{animation:fab-guard-in linear both;animation-timeline:scroll(root);animation-range:0 60vh}
}
@keyframes fab-guard-in{0%,40%{opacity:0;visibility:hidden}100%{opacity:1;visibility:visible}}
body:has(.float-cta) > footer:last-of-type{padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))!important}
body:has(.float-cta):not(:has(> footer)){padding-bottom:calc(88px + env(safe-area-inset-bottom,0px))!important}
/* fab-guard:end */
