@font-face{font-family:Inter;src:url("/assets/fonts/inter.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
:root{color-scheme:dark;--bg:#0e111c;--panel:#151a29;--raised:#191f31;--ink:#f3f4f8;--muted:#a9b1c6;--line:#30374d;--lime:#c7f581;--lime-ink:#151e0c;--violet:#b5a5ff;--blue:#9ebdff;--amber:#ffd488;--pink:#ffa7cb;--orange:#fbb692;--teal:#89ebd2;--wrap:1336px;--gutter:clamp(17px,4vw,56px);--radius:17px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:95px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 15px/1.65 Inter,system-ui,sans-serif;overflow-wrap:break-word}
a{color:inherit;text-decoration:none}
p{margin:0 0 1em}
h1,h2,h3{margin:0;font-weight:760;line-height:1.13;letter-spacing:-.038em;text-wrap:balance}
h1{font-size:clamp(36px,5.8vw,79px)}
h2{font-size:clamp(26px,3vw,41px)}
h3{font-size:20px}
img,svg{display:block}
img{max-width:100%;height:auto}
button,input,select,textarea{font:inherit}
button,input,select,textarea,a{touch-action:manipulation}
button,summary{cursor:pointer}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--lime);outline-offset:4px}
.wrap{width:min(calc(100% - 2 * var(--gutter)),var(--wrap));margin-inline:auto}
.narrow{max-width:700px}
.sr-only,.skip-link:not(:focus){position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link:focus{position:fixed;z-index:10;left:20px;top:12px;background:var(--lime);color:var(--lime-ink);padding:10px 16px;border-radius:8px;font-weight:750}
[hidden]{display:none!important}
.site-header{position:sticky;top:0;z-index:6;border-bottom:1px solid #2a3043;background:#0e111cf5;backdrop-filter:blur(16px)}
.header-inner{height:72px;display:flex;align-items:center;gap:clamp(14px,2vw,28px)}
.brand{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;line-height:.98;font-size:21px;font-weight:850;letter-spacing:-.055em;flex:none}
.brand img{width:40px;height:40px}
.brand-sub{display:block;margin-top:4px;color:var(--muted);font-size:10px;font-weight:670;letter-spacing:.045em}
.desktop-nav,.header-actions{display:flex;align-items:center;gap:clamp(12px,1.7vw,24px);white-space:nowrap}
.desktop-nav a,.header-sign{color:#d0d5e6;font-size:13px;font-weight:670}
.desktop-nav a:hover,.desktop-nav a[aria-current],.header-sign:hover{color:var(--lime)}
.header-sign{max-width:106px;overflow:hidden;text-overflow:ellipsis}
.header-actions{margin-left:auto}
.search-box{display:flex;align-items:center;border:1px solid var(--line);background:#0d111e;border-radius:11px;min-width:0;position:relative}
.search-box:focus-within{border-color:var(--lime)}
.search-box input{border:0;background:transparent;padding:10px 12px;color:var(--ink);width:100%;min-width:0;border-radius:11px;outline-offset:-1px}
.search-box input::placeholder{color:#a2aac0}
.search-box button{border:0;border-radius:9px;background:transparent;color:var(--lime);padding:8px;margin:2px;display:grid;place-items:center;flex:none}
.header-search{margin-left:auto;min-width:140px;max-width:270px;flex:1;flex-direction:row-reverse}
.header-search input{padding:8px 22px 8px 0;font-size:12px}
.header-search button{padding:7px;color:var(--muted)}
.header-search kbd{position:absolute;right:7px;font:12px/1 Inter,sans-serif;color:var(--muted);border:1px solid var(--line);border-radius:5px;padding:3px 5px;pointer-events:none}
.mobile-nav{display:none;position:relative;margin-left:auto}
.mobile-nav summary{list-style:none;border:1px solid var(--line);border-radius:8px;padding:9px;color:var(--ink)}
.mobile-nav summary::-webkit-details-marker,.faq-row summary::-webkit-details-marker{display:none}
.mobile-pop{position:absolute;right:0;top:50px;width:min(310px,calc(100vw - 34px));background:#161b2b;border:1px solid var(--line);padding:14px;border-radius:12px;display:grid;gap:10px;box-shadow:0 14px 35px #0008}
.mobile-pop>a:not(.button){display:block;padding:5px}
.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;border:1px solid transparent;padding:10px 16px;border-radius:10px;font-size:13px;line-height:1.36;font-weight:740;white-space:normal;min-height:41px}
.button.primary{background:var(--lime);color:var(--lime-ink)}
.button.primary:hover{background:#e0ffa9}
.button.outline{background:transparent;color:var(--ink);border-color:#414a66}
.button.outline:hover{border-color:var(--violet);background:#b5a5ff13}
.button svg{flex:none}
.header-ask{min-height:36px;padding:8px 11px;font-size:12px}
.eyebrow{color:var(--lime);font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:790;margin:0 0 12px}
.hero{position:relative;background:radial-gradient(ellipse at 75% 36%,#242047 0,transparent 63%),#101321;border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:1fr minmax(0,1.08fr);gap:clamp(19px,3vw,50px);align-items:center;padding-block:clamp(35px,5vw,68px)}
.hero h1{font-size:clamp(46px,6vw,83px);letter-spacing:-.075em;line-height:.99;text-wrap:initial}
.hero h1 span{display:block;color:var(--lime)}
.hero-copy .lede{max-width:480px;margin:19px 0 22px}
.lede{font-size:clamp(15px,1.45vw,19px);line-height:1.58;color:#bbc3d8;max-width:740px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.hero-art{margin:0;border-radius:22px;overflow:hidden;border:1px solid #494370;position:relative;background:#141a2c;min-width:0;box-shadow:0 20px 65px #06081575}
.hero-art img{width:100%;aspect-ratio:1.64;object-fit:cover}
.hero-art-fallback{display:grid;place-items:center;aspect-ratio:1.64;background:radial-gradient(ellipse,#322869,#111626 65%)}
.hero-art-fallback svg{width:31%;height:auto;color:var(--lime);filter:drop-shadow(0 0 40px #8f6fff)}
.home-search{max-width:460px;margin-top:18px}
.hero-links{display:flex;flex-wrap:wrap;gap:8px 13px;color:var(--muted);font-size:12px;margin:11px 0 0}
.hero-links a{color:#d3d9eb;text-decoration:underline;text-underline-offset:3px}
.media-deck{background:#131727;border-bottom:1px solid #30374a}
.media-rail{border-bottom:1px solid #262d41}
.rail-inner{display:grid;grid-template-columns:145px minmax(0,1fr);gap:13px;align-items:center;min-height:66px}
.rail-inner h2{font-size:12px;letter-spacing:.012em;font-weight:720}
.rail-inner h2 a{display:inline-flex;align-items:center;gap:6px}
.rail-inner h2 svg{color:var(--violet)}
.rail-window{overflow-x:auto;scrollbar-width:none;padding:8px 0;overscroll-behavior-inline:contain}
.rail-window::-webkit-scrollbar{display:none}
.rail-window ul{display:flex;gap:7px;list-style:none;margin:0;padding:0;min-width:100%;width:max-content}
.rail-window li{flex:none}
.rail-window li a,.rail-window li .motion-clone{display:flex;align-items:center;gap:7px;min-height:42px;background:#191f32;border:1px solid #343b51;border-radius:8px;padding:5px 9px;white-space:nowrap;font-size:11px;font-weight:670}
.rail-window a:focus-visible{outline-offset:-2px}
.rail-window a:hover{border-color:var(--violet)}
.rail-window img{width:31px;height:25px;object-fit:contain;background:#eef0f4;border-radius:4px;padding:3px}
.rail-movies img{padding:0;height:29px;width:23px;object-fit:cover}
.rail-mark{display:grid;place-items:center;min-width:27px;min-height:24px;background:#302652;color:#e0d4ff;border-radius:5px;font-size:9px;font-weight:800}
.motion-enabled .rail-window ul{animation:rail-move var(--rail-duration,50s) linear infinite}
.motion-enabled .rail-window:hover ul{animation-play-state:paused}
.motion-enabled .rail-window:focus-within{overflow-x:auto}
.motion-enabled .rail-window:focus-within ul{animation:none}
.motion-enabled .rail-window{overflow-x:hidden}
@keyframes rail-move{from{transform:translateX(0)}to{transform:translateX(calc(-1 * var(--rail-distance,0px)))}}
.deck-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:9px;font-size:11px;color:var(--muted)}
.deck-footer a{text-decoration:underline;text-underline-offset:3px}
.motion-toggle{display:inline-flex;align-items:center;gap:6px;background:transparent;color:#c9d1e7;border:0;padding:5px 0;font-size:11px;white-space:nowrap}
.content-section{padding-block:clamp(28px,4vw,58px)}
.content-section+.content-section{border-top:1px solid #262e43}
.content-section.tinted{background:#121725}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:15px;margin-bottom:20px}
.section-head p{margin:6px 0 0;color:var(--muted);max-width:650px}
.grid{display:grid;gap:13px;min-width:0}
.three,.brand-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.categories,.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{position:relative;padding:17px;border-radius:var(--radius);background:var(--panel);border:1px solid var(--line);min-width:0}
.card:hover{border-color:#5c6483}
.card h3{font-size:17px;letter-spacing:-.024em;padding-right:15px}
.card h3 a:hover{color:var(--lime)}
.card h3 a::after{content:"";position:absolute;inset:0;border-radius:inherit}
.card p:not(.eyebrow){margin:7px 0 0;color:var(--muted);font-size:13px;line-height:1.54}
.card-arrow{position:absolute;right:14px;top:15px;color:#929cba}
.category-card{min-height:153px}
.category-icon,.topic-icon{display:grid;place-items:center;width:37px;height:37px;color:var(--tint,var(--lime));background:color-mix(in srgb,var(--tint,var(--lime)),transparent 87%);border-radius:9px;margin-bottom:10px}
.mint{--tint:var(--lime)}.violet{--tint:var(--violet)}.blue{--tint:var(--blue)}.amber{--tint:var(--amber)}.pink{--tint:var(--pink)}.orange{--tint:var(--orange)}.teal{--tint:var(--teal)}
.category-count{display:block;margin-top:11px;color:var(--tint);font-size:11px;font-weight:650}
.article-card{min-height:120px}
.article-card .eyebrow{font-size:10px}
.brand-card{display:flex;align-items:flex-start;gap:12px}
.brand-tile{display:grid;place-items:center;flex:none;width:41px;height:41px;border-radius:10px;background:#332653;color:#e4d2ff;font-size:11px;font-weight:850;letter-spacing:.015em}
.tint-1{background:#20374c;color:#abd5ff}.tint-2{background:#33412a;color:#d4f6a5}.tint-3{background:#482e42;color:#ffc5de}.tint-4{background:#483927;color:#ffda9d}
.brand-card .domain{color:var(--violet)!important;font-size:11px!important}
.grid.country-grid{grid-template-columns:repeat(5,minmax(0,1fr))}
.country-card{display:flex;align-items:center;gap:11px;padding:13px;min-height:65px}
.flag{font-size:24px;flex:none}
.country-card h3{font-size:14px;padding:0}
.country-card p{margin:3px 0 0!important;font-size:11px!important}
.shortcut-strip{border-bottom:1px solid var(--line);background:#0e1320}
.shortcut-strip .wrap{display:flex;gap:12px 22px;align-items:center;flex-wrap:wrap;padding-block:12px}
.shortcut-strip a{font-weight:650;font-size:12px;color:#cbd3ea;display:inline-flex;align-items:center;gap:6px}
.shortcut-strip svg{color:var(--lime)}
.page-lead{padding-block:27px clamp(24px,4vw,55px);border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 85% 0,#262146 0,transparent 62%),#121626}
.page-lead-inner{padding-top:14px}
.page-lead h1{font-size:clamp(32px,5vw,66px);overflow-wrap:anywhere;max-width:1020px}
.page-lead .lede{margin:12px 0 0}
.page-lead .actions{margin-top:17px}
.breadcrumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 10px;line-height:1.5;color:var(--muted);font-size:11px}
.breadcrumbs li+li::before{content:"/";margin-right:10px;color:#7f8baa}
.breadcrumbs a:hover{color:var(--lime)}
.reading-layout{display:grid;grid-template-columns:minmax(0,790px) minmax(210px,310px);justify-content:space-between;gap:clamp(20px,4vw,65px);padding-block:32px 64px}
.prose{color:#d9ddec;font-size:16px;line-height:1.72;min-width:0}
.prose p,.prose ul,.prose ol{margin:0 0 16px}
.prose h2{font-size:27px;margin:28px 0 11px}
.prose h3{font-size:20px;margin:21px 0 8px}
.prose li+li{margin-top:6px}
.prose a,.source-list a,.form-links>a:not(.button),.related-panel a:not(.button),.subtle-link{color:var(--lime);text-decoration:underline;text-underline-offset:3px}
.prose pre{background:#0a0e18;border:1px solid var(--line);border-radius:9px;padding:12px;overflow:auto}
.prose code{font-size:.92em;overflow-wrap:anywhere}
.prose blockquote{border-left:3px solid var(--violet);padding:10px 15px;margin:0 0 16px;background:#b5a5ff10}
.table-wrap{overflow-x:auto;margin:12px 0 22px}
.prose table{width:100%;border-collapse:collapse;min-width:400px}
.prose td,.prose th{padding:10px 12px;border:1px solid var(--line);text-align:left}
.prose th{background:#1d2439;color:var(--ink)}
.byline{font-size:12px;color:var(--muted);margin-bottom:12px!important}
.article-asset{max-height:230px;width:auto;object-fit:contain;margin:0 0 19px;background:#e9edf4;padding:13px;border-radius:11px}
.related-panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:17px;align-self:start}
.related-panel h2{font-size:19px}
.related-panel ul,.source-list ul{padding-left:18px}
.related-panel a svg{display:inline;vertical-align:text-bottom}
.source-list{border-top:1px solid var(--line);margin-top:24px}
.muted,.empty{color:var(--muted)}
.empty{padding:15px;border:1px dashed #404961;border-radius:11px;margin:0}
.filter-controls{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:14px}
.filter-controls input,.filter-controls select,.field input,.field select,.field textarea{width:100%;min-width:0;background:#101422;color:var(--ink);border:1px solid #414a64;border-radius:9px;padding:9px 11px}
.filter-controls input{width:min(100%,320px)}
.filter-controls select{width:auto;max-width:100%}
.filter-count{color:var(--muted);font-size:12px}
.faq-row{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:8px;padding:0 14px}
.faq-row summary{display:flex;justify-content:space-between;align-items:center;gap:9px;font-weight:710;list-style:none;padding:12px 0}
.faq-row summary::after{content:"+";font-size:19px;color:var(--lime)}
.faq-row[open] summary::after{content:"−"}
.faq-row .prose{padding:2px 0 10px;font-size:14px}
.topic-list{list-style:none;margin:0;padding:0;border:1px solid var(--line);border-radius:13px;background:var(--panel)}
.topic-list li{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:11px;padding:11px 13px}
.topic-list li+li{border-top:1px solid var(--line)}
.topic-icon{margin:0;width:35px;height:35px;--tint:var(--violet)}
.topic-title{font-weight:730}
.topic-title:hover{color:var(--lime)}
.topic-list p,.topic-replies{color:var(--muted);font-size:12px;margin:2px 0 0}
.pill{display:inline-block;border:1px solid #464e69;border-radius:999px;padding:1px 8px;font-size:10px;font-weight:710;color:#d1d8ed;white-space:nowrap;vertical-align:middle}
.accepted{color:var(--lime);border-color:#658947}
.staff-label{color:var(--violet)}
.tag-list{display:flex;gap:7px;flex-wrap:wrap;margin:0 0 10px}
.post{border:1px solid var(--line);border-radius:15px;padding:17px;background:var(--panel);margin-bottom:12px}
.post.solution{border-color:#608047}
.post header{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.post header p{font-size:11px;color:var(--muted);margin:1px 0}
.avatar{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#302c55;color:#ddd0ff;font-weight:750;flex:none}
.post-actions,.form-links,.pagination{display:flex;gap:9px 12px;align-items:center;flex-wrap:wrap;margin-top:13px}
.subtle-link,.post-actions button{font-size:12px}
.inline-form{display:inline}
.inline-form .button{min-height:31px;padding:5px 9px}
.thread-wrap{max-width:910px;padding-block:25px 60px}
.thread-wrap>section{margin-top:22px}
.thread-wrap>section h2{margin-bottom:9px;font-size:23px}
.attachment{max-width:min(100%,500px);border-radius:10px;margin-top:10px}
.page-form{padding-block:26px 64px}
.form-panel{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:18px;max-width:700px}
.field{margin:0 0 12px}
.field label{display:block;margin-bottom:4px;font-weight:680;font-size:13px}
.field small{display:block;margin-top:4px;color:var(--muted)}
.field textarea{resize:vertical}
.check-field{display:flex;align-items:flex-start;gap:8px;margin-bottom:13px}
.check-field input{margin-top:5px;accent-color:var(--lime)}
.check-field a{color:var(--lime);text-decoration:underline}
.alert{padding:10px 13px;background:#3b2c24;border:1px solid #825f44;border-radius:9px;color:#ffddbd;margin:0 0 10px}
.upload-options{margin:0 0 12px}
.upload-options summary{color:var(--violet);padding-block:5px}
.queue{margin-bottom:12px;border:1px solid var(--line);padding:14px;border-radius:12px;background:var(--panel)}
.queue h3{margin-bottom:6px}
.queue .moderation-form{display:flex;align-items:end;gap:8px;flex-wrap:wrap}
.moderation-form .field{margin:0}
.site-footer{border-top:1px solid var(--line);background:#0b0e18;padding:37px 0 13px}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr;gap:17px}
.footer-grid h2{font-size:13px;letter-spacing:0}
.footer-grid ul{list-style:none;padding:0;margin:9px 0 0}
.footer-grid p,.footer-grid li{color:var(--muted);font-size:12px;margin:6px 0}
.footer-grid p{max-width:235px;margin-top:12px}
.footer-grid a:hover,.footer-bottom a:hover{color:var(--lime)}
.footer-bottom{border-top:1px solid var(--line);margin-top:23px;padding-top:12px;display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:11px}
@media(max-width:1120px){.header-search{display:none}.desktop-nav{margin-left:auto}.header-actions{margin-left:0}.grid.country-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:850px){.desktop-nav,.header-actions{display:none}.mobile-nav{display:block}.header-inner{height:61px}.hero-grid{grid-template-columns:1fr 1fr;gap:17px}.categories,.four{grid-template-columns:repeat(2,minmax(0,1fr))}.three,.brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid.country-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.rail-inner{grid-template-columns:115px minmax(0,1fr);gap:8px}.reading-layout{grid-template-columns:minmax(0,1fr) 185px}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:610px){.hero-grid,.reading-layout{grid-template-columns:minmax(0,1fr)}.hero-grid{padding-block:27px 23px}.hero h1{font-size:clamp(45px,11vw,66px)}.hero-copy .lede{margin-block:12px 16px}.hero-art{border-radius:14px}.hero-art img{aspect-ratio:1.87}.hero-search{margin-top:13px}.section-head{align-items:flex-start;flex-direction:column;gap:8px;margin-bottom:13px}.section-head .button{min-height:33px;padding:6px 10px}.rail-inner{grid-template-columns:minmax(0,1fr);gap:0;padding-top:8px}.rail-window{padding-top:4px}.rail-window li a,.rail-window li .motion-clone{min-height:34px;padding:4px 7px}.rail-window img{width:25px;height:21px}.grid.country-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grid{gap:8px}.card{padding:12px;border-radius:11px}.card h3{font-size:15px}.card p:not(.eyebrow){font-size:12px}.card-arrow{right:9px;top:10px}.brand-card{gap:7px}.brand-tile{width:27px;height:28px;font-size:8px}.country-card{min-height:58px}.topic-list li{grid-template-columns:31px minmax(0,1fr);gap:7px}.topic-icon{width:28px;height:28px}.topic-replies{grid-column:2}.page-lead .lede{font-size:15px}.reading-layout{padding-block:22px 36px}.shortcut-strip .wrap{gap:8px 13px}.footer-grid{gap:13px}}
@media(max-width:370px){.three,.brand-grid{grid-template-columns:minmax(0,1fr)}.button{padding:8px 10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;scroll-behavior:auto!important}.motion-enabled .rail-window{overflow-x:auto}}

.region-links{columns:3;column-gap:22px}
.region-links li{break-inside:avoid}
@media(max-width:610px){.region-links{columns:2}}

.brand-tile img{max-width:95%;max-height:90%;object-fit:contain}

.facet-search{align-items:end;display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) auto auto;gap:12px;max-width:100%;margin-block:8px 22px}
.facet-search-wide{grid-template-columns:repeat(5,minmax(0,1fr)) auto auto}
.facet-search .field{min-width:0;margin:0}.facet-search input,.facet-search select{max-width:100%;min-width:0}
.facet-search .button{justify-content:center}.pagination .page-current{background:var(--panel);font-weight:700}.pagination-gap{padding:0 5px}
.app-screens{grid-template-columns:repeat(2,minmax(0,1fr));margin-bottom:20px}.app-screen{margin:0;min-width:0}
.app-screen img{width:100%;height:auto;border:1px solid var(--line);border-radius:14px;display:block}
.app-screen figcaption{padding:10px 4px;color:var(--muted);font-size:14px}.app-screen figcaption a{text-decoration:underline}
.catalogue-more{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.guide-reference{border-inline-start:3px solid var(--lime);padding-inline-start:12px;margin-block:8px 16px}.guide-reference a{text-decoration:underline}
@media(max-width:900px){.facet-search{grid-template-columns:repeat(3,minmax(0,1fr));align-items:end}}
@media(max-width:600px){.facet-search{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.app-screens{grid-template-columns:1fr}}

@font-face {
  font-family: Bricolage;
  src: url('/assets/fonts/bricolage-grotesque.woff2') format('woff2');
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg: #0b0c14;
  --panel: #151824;
  --raised: #1b1e2b;
  --ink: #f8f4ef;
  --muted: #b2b4c3;
  --line: #333545;
  --lime: #ffcc84;
  --lime-ink: #231403;
  --amber: #ffcb80;
  --violet: #c7b7ff;
  --blue: #9bc8ff;
  --teal: #89e2d0;
  --wrap: 1392px;
  --gutter: clamp(17px, 3.7vw, 58px);
  --radius: 17px;
  --display: Bricolage, Inter, system-ui, sans-serif;
}

h1, h2, h3 { font-family: var(--display); }
.site-header { background: #0d0f19f0; border-color: #303343; }
.header-inner { height: 76px; }
.brand { font-family: var(--display); font-size: 25px; }
.brand-sub { font-family: Inter, sans-serif; font-size: 10px; }
.desktop-nav a { font-size: 13px; }
.desktop-nav a[aria-current] { text-decoration: underline; text-underline-offset: 7px; }
.button { min-height: 45px; border-radius: 9px; }
.button.primary {
  background: linear-gradient(122deg, #ffddab, #ffbe65);
  box-shadow: 0 2px 16px #eeb0751f;
}
.button.primary:hover { background: #ffe2bc; }
.button.outline { border-color: #535567; }
.button.outline:hover { background: #e3ceff10; }
.search-box { background: #121420; }
.search-box input::placeholder { color: #a8abba; }
.header-ask { min-height: 39px; }

.premium-hero {
  isolation: isolate;
  background: radial-gradient(ellipse at 46% 20%, #2e2141, transparent 62%), #0c0e18;
  border-bottom: 1px solid #463340;
}
.premium-hero .hero-grid {
  min-height: 510px;
  grid-template-columns: minmax(0, 1fr) minmax(0, .78fr);
  gap: 40px;
  position: relative;
  padding-block: clamp(39px, 5vw, 74px);
}
.hero-photo {
  position: absolute;
  z-index: -1;
  inset: 0 0 0 32%;
  margin: 0;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 17%);
}
.hero-photo picture { display: block; width: 100%; height: 100%; }
.hero-photo .hero-cover-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 61% 52%;
  filter: saturate(.87) contrast(1.12) brightness(.85);
}
.hero-photo::after {
  position: absolute;
  content: '';
  inset: 0;
  background: linear-gradient(90deg, #161321 0, #171626bf 13%, #11102210 54%),
              linear-gradient(0deg, #0b0d1a 0, transparent 43%);
  pointer-events: none;
}
.hero-photo figcaption { position: absolute; z-index: 1; right: var(--gutter); bottom: 9px; font-size: 10px; color: #d2cbd8; }
.hero-kicker { display: flex; align-items: center; gap: 9px; color: #ffe1b9; font-size: 11px; }
.hero-kicker span { width: 7px; height: 7px; background: #ffcc84; border-radius: 50%; }
.premium-hero h1 { font-size: clamp(56px, 7.8vw, 113px); letter-spacing: -.067em; font-weight: 800; line-height: .9; }
.premium-hero h1 span { color: #ffcc84; }
.premium-hero .hero-copy .lede { margin: 19px 0 20px; max-width: 490px; color: #e5e1eb; }
.premium-hero .home-search { margin: 0 0 15px; max-width: 495px; }
.premium-hero .search-box { border-color: #625773; background: #151425dc; }
.premium-hero .search-box input { padding: 13px 14px; }
.premium-hero .button.outline { background: #14142196; }
.hero-guide {
  display: flex;
  gap: 13px;
  align-items: center;
  align-self: end;
  justify-self: end;
  max-width: 345px;
  padding: 13px 15px;
  margin-bottom: 3px;
  border: 1px solid #ffffff42;
  border-radius: 13px;
  background: #141423d9;
  box-shadow: 0 8px 28px #02040e6b;
  backdrop-filter: blur(10px);
}
.hero-guide-icon, .front-nav-icon {
  width: 38px;
  height: 38px;
  flex: none;
  display: grid;
  place-items: center;
  background: #ffcd831a;
  color: #ffce86;
  border: 1px solid #ffd09933;
  border-radius: 9px;
}
.hero-guide p { margin: 0 0 3px; color: #c9c4d1; font-size: 12px; }
.hero-guide a { display: inline-flex; align-items: center; gap: 6px; font-weight: 720; font-size: 14px; }
.hero-guide a:hover { color: var(--amber); }
.hero-guide a svg { color: var(--amber); }

.media-deck { background: linear-gradient(120deg, #181726, #121422 64%); }
.media-rail { border-color: #333042; }
.rail-inner { grid-template-columns: 157px minmax(0, 1fr); min-height: 79px; }
.rail-inner h2 { font-size: 14px; font-weight: 730; }
.rail-window ul { gap: 10px; }
.rail-window li a, .rail-window li .motion-clone {
  padding: 6px 11px;
  min-height: 50px;
  border-radius: 9px;
  background: #222538;
  border-color: #3e3d53;
  font-size: 12px;
}
.rail-window img { width: 48px; height: 31px; padding: 3px; border-radius: 4px; }
.rail-window img.surface-dark { background: #1a1c2e; }
.rail-sports .rail-inner h2 svg { color: #92dfca; }
.rail-movies .rail-inner h2 svg { color: #ffc38e; }
.rail-movies li a, .rail-movies li .motion-clone { min-height: 63px; }
.rail-movies img { width: 32px; height: 46px; padding: 0; }
.deck-footer { padding-block: 9px; }
.front-nav { border-bottom: 1px solid var(--line); background: #10121e; }
.front-nav .wrap { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.front-nav a {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 11px;
  padding: 16px 18px;
  border-right: 1px solid var(--line);
}
.front-nav a:first-child { border-left: 1px solid var(--line); }
.front-nav a:hover { background: #c7b7ff0a; }
.front-nav a > svg { color: var(--violet); }
.front-nav strong { display: block; font-family: var(--display); font-size: 15px; line-height: 1.2; }
.front-nav small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; line-height: 1.3; }

.content-section { padding-block: clamp(34px, 4.5vw, 67px); }
.content-section.tinted { background: radial-gradient(ellipse at top right, #211d33, transparent 65%), #11131f; }
.section-head { margin-bottom: 23px; }
.section-head h2 { font-size: clamp(30px, 4.3vw, 51px); }
.section-head p { font-size: 14px; }
.grid { gap: 17px; }
.card { background: linear-gradient(151deg, #1a1c2b, #151824 80%); }
.card h3 { font-size: 20px; }
.card p:not(.eyebrow) { color: #bec0ce; }
.category-card { border-top: 2px solid color-mix(in srgb, var(--tint) 58%, #303342); }
.category-card .category-icon { width: 43px; height: 43px; }
.story-grid { display: grid; grid-template-columns: 1.32fr 1fr 1fr; gap: 17px; }
.story-card {
  position: relative;
  min-height: 289px;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: end;
  border: 1px solid #474456;
  border-radius: var(--radius);
  background: radial-gradient(ellipse at top right, #3d3157, #171927 70%);
}
.story-card picture, .story-card .story-photo { position: absolute; inset: 0; height: 100%; width: 100%; object-fit: cover; z-index: -2; }
.story-card::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(0deg, #0e101cfa, #10121cae 38%, #1c142245 83%); }
.story-copy { padding: 19px 19px 21px; width: 100%; }
.story-copy .eyebrow { margin-bottom: 5px; }
.story-copy h3 { font-size: clamp(23px, 2.5vw, 35px); max-width: 95%; }
.story-copy h3 a::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.story-copy h3 a:hover { color: var(--amber); }
.story-copy p:last-of-type { color: #d1cddb; font-size: 13px; margin: 8px 0 0; max-width: 94%; }
.story-arrow { color: var(--amber); position: absolute; top: 12px; right: 12px; background: #151422ad; border: 1px solid #ffffff40; border-radius: 50%; padding: 8px; }

.brand-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.brand-card { display: block; padding: 0; overflow: hidden; background: #151824; }
.brand-cover { position: relative; display: grid; place-items: center; aspect-ratio: 16/8.5; overflow: hidden; background: #14182a; border-bottom: 1px solid #3a3a4b; }
.brand-cover picture, .brand-cover img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.brand-cover img { object-fit: cover; object-position: center; }
.brand-cover.cover-fallback { font: 750 44px/1 var(--display); color: var(--amber); background: radial-gradient(ellipse at 62% 35%, #483769, #181a30 65%); }
.brand-cover.cover-fallback img { width: 60%; height: 65%; inset: 17.5% 20%; object-fit: contain; }
.brand-card-body { padding: 14px 15px 16px; }
.brand-card-name { display: flex; align-items: center; gap: 10px; }
.brand-card-name > div:last-child { min-width: 0; }
.brand-card-name .domain { margin-top: 2px !important; }
.brand-card .brand-tile { width: 42px; height: 42px; font-size: 12px; background: #232439; border: 1px solid #434256; }
.brand-card .card-arrow { top: auto; bottom: 14px; right: 12px; color: #9d94b4; }
.brand-card p:not(.domain) { margin-top: 11px; padding-right: 8px; }
.brand-fact { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 3px 6px; color: #ffd598; font-size: 14px; font-weight: 730; padding-right: 18px; margin-top: 10px; }
.brand-fact small { color: #b9b6c6; font-size: 10px; font-weight: 500; }
.article-card.has-image { padding: 0; overflow: hidden; }
.article-card.has-image .article-card-body { padding: 15px 16px 17px; }
.article-card.has-image .card-arrow { top: auto; bottom: 13px; }
.card-image { aspect-ratio: 16/7.4; overflow: hidden; display: grid; place-items: center; background: #21243a; border-bottom: 1px solid var(--line); }
.card-image img, .card-image picture { width: 100%; height: 100%; object-fit: cover; }
.card-image-ott-logo img, .card-image-sport-logo img, .card-image-channel-logo img,
.card-image-platform-logo img, .card-image-device-logo img, .card-image-device-photo img, .card-image-mark img {
  width: min(76%, 245px);
  height: 74%;
  object-fit: contain;
  margin: auto;
}
.card-image-channel-logo, .card-image-ott-logo, .card-image-sport-logo { background: #edf0f6; }
.card-image.surface-dark { background: #24263e; }
.card-image-device-photo { background: radial-gradient(ellipse at 60% 30%, #3f4263, #25283d 71%); }
.card-image-poster { aspect-ratio: 16/9; }
.card-image-poster img { object-fit: contain; }
.duel { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: #51425d; border-bottom: 1px solid var(--line); }
.duel-brand { display: grid; align-content: center; justify-items: center; gap: 6px; min-height: 94px; padding: 10px 16px; }
.duel-brand > div { display: grid; place-items: center; width: 62px; height: 38px; color: var(--ink); font: 750 18px/1 var(--display); }
.duel-brand img { width: 100%; height: 100%; max-height: 38px; object-fit: contain; }
.duel-brand span { font-size: 10px; text-align: center; color: #f7f4ff; }
.duel-vs { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); display: grid; place-items: center; width: 26px; height: 26px; border: 1px solid #b396ac; border-radius: 50%; background: #191a29; color: var(--amber); font-size: 10px; font-weight: 750; }

.screen-grid, .article-gallery-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.screen-grid { margin-bottom: 22px; }
.visual-figure { margin: 0; min-width: 0; }
.visual-figure img { width: 100%; height: auto; object-fit: contain; }
.visual-figure figcaption, .page-lead figure figcaption { margin-top: 7px; color: #bdb8c9; font-size: 12px; line-height: 1.45; }
.screen-tile { border: 1px solid #3e3b50; border-radius: 12px; background: #171927; overflow: hidden; }
.screen-tile a { display: block; aspect-ratio: 16/9.7; background: #0c0e16; }
.screen-tile img { width: 100%; height: 100%; }
.screen-tile figcaption { padding: 2px 10px 9px; color: var(--ink); font-weight: 650; }
.poster-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 15px; }
.poster-card { min-width: 0; background: #161827; border: 1px solid #35374a; border-radius: 12px; overflow: hidden; }
.poster-card:hover { border-color: #c7b7ff; }
.poster-card img { aspect-ratio: 2/3; width: 100%; height: auto; object-fit: cover; }
.poster-card a { display: block; }
.poster-card a:focus-visible { outline-offset: -3px; }
.poster-card a div { padding: 10px; }
.poster-card h3 { font-size: 16px; text-wrap: wrap; }
.poster-card p { color: var(--muted); margin: 4px 0 0; font-size: 11px; }

.page-lead { background: radial-gradient(ellipse at 79% 0, #352840, transparent 63%), #151724; }
.page-lead h1 { font-size: clamp(34px, 5.2vw, 73px); }
.page-lead-layout { min-width: 0; }
.illustrated-lead .page-lead-layout { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: clamp(18px, 4vw, 48px); align-items: center; padding-top: 20px; }
.page-lead figure { margin: 0; }
.page-lead .lead-cover { width: 100%; max-height: 320px; aspect-ratio: 16/8.7; object-fit: contain; background: #151825; border: 1px solid #55465c; border-radius: 16px; }
.reading-layout { grid-template-columns: minmax(0, 855px) minmax(215px, 290px); }
.article-main { min-width: 0; }
.article-main .prose { color: #e2dfeb; }
.prose { font-size: 17px; line-height: 1.78; }
.prose h2 { font-size: clamp(25px, 3.25vw, 35px); color: var(--ink); margin-top: 37px; }
.prose table caption { text-align: left; padding: 8px 10px; background: #1b1d2c; color: #cbc6d5; font-size: 13px; }
.prose th { background: #25263a; }
.prose tr:nth-child(even) td { background: #161824; }
.reading-note { border-left: 3px solid var(--amber); background: #28212c; border-radius: 0 10px 10px 0; padding: 13px 16px 1px; margin-bottom: 22px; }
.related-panel { position: sticky; top: 96px; background: linear-gradient(155deg, #1f2031, #161824); padding: 18px; }
.related-panel nav { border-bottom: 1px solid var(--line); padding-bottom: 10px; margin-bottom: 15px; }
.related-panel ol { padding-left: 19px; font-size: 13px; }
.related-panel li+li { margin-top: 5px; }
.related-panel ul { font-size: 14px; }
.article-visual { margin: 13px 0 18px; }
.article-visual img { width: auto; max-height: 390px; border-radius: 12px; border: 1px solid var(--line); background: #202337; }
.article-visual.visual-logo img, .article-visual.visual-ott-logo img, .article-visual.visual-sport-logo img, .article-visual.visual-channel-logo img {
  width: auto;
  max-width: min(260px, 70%);
  max-height: 112px;
  padding: 11px;
  background: #edeef5;
}
.provider-gallery { padding-bottom: 48px; }
.article-gallery { margin: 10px 0 31px; }
.article-gallery h2 { font-size: 34px; margin-bottom: 13px; }
.article-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.provider-figure a { display: block; aspect-ratio: 16/10; background: #10121b; border-radius: 11px; overflow: hidden; border: 1px solid #3e3d50; }
.provider-figure img { height: 100%; }
.offer-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 0; list-style: none; }
.offer-strip li { margin: 0 !important; padding: 11px; border: 1px solid #4e4051; border-radius: 9px; background: #211d2a; }
.offer-strip span, .offer-strip small { display: block; color: var(--muted); font-size: 11px; }
.offer-strip strong { display: block; color: var(--amber); font: 740 20px/1.2 var(--display); overflow-wrap: anywhere; }
.article-main > .duel { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; margin: 12px 0 18px; }
.site-footer { background: #0c0d16; }
.facet-search:has(select[name='category']):has(select[name='country']) { grid-template-columns: repeat(3, minmax(0, 1fr)) auto auto; }

@media (max-width: 1150px) {
  .brand-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .story-grid { grid-template-columns: 1.22fr 1fr 1fr; }
  .poster-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}
@media (max-width: 850px) {
  .header-inner { height: 64px; }
  .premium-hero .hero-grid { min-height: 444px; gap: 13px; }
  .hero-photo { left: 22%; }
  .hero-photo::after { background: linear-gradient(90deg,#191523, #161524a3 41%,#11101d0d 92%), linear-gradient(0deg,#0b0d19,transparent 47%); }
  .hero-guide { max-width: 260px; }
  .front-nav .wrap { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .front-nav a { border: 1px solid var(--line); border-width: 0 1px 1px 0; }
  .front-nav a:nth-child(odd) { border-left: 1px solid var(--line); }
  .story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .story-card:first-child { grid-column: 1 / -1; min-height: 310px; }
  .story-card { min-height: 250px; }
  .screen-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .poster-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .reading-layout { grid-template-columns: minmax(0, 1fr) minmax(175px, 215px); }
  .related-panel { top: 80px; }
}
@media (max-width: 680px) {
  .premium-hero .hero-grid { grid-template-columns: minmax(0,1fr); min-height: auto; padding-block: 36px 24px; }
  .hero-photo { inset: 0; mask-image: none; }
  .hero-photo .hero-cover-img { object-position: 64% center; }
  .hero-photo::after { background: linear-gradient(90deg,#121321eb 0,#121321ae 58%,#1213215e 100%), linear-gradient(0deg,#10121e 0,transparent 72%); }
  .hero-photo figcaption { bottom: 4px; }
  .premium-hero h1 { font-size: clamp(52px, 12vw, 76px); }
  .premium-hero .hero-copy .lede { margin: 15px 0 16px; }
  .hero-guide { justify-self: start; margin-top: 4px; margin-bottom: 9px; }
  .hero-guide a { font-size: 13px; }
  .rail-inner { grid-template-columns: minmax(0,1fr); min-height: 65px; }
  .rail-inner h2 { font-size: 12px; }
  .rail-window li a,.rail-window li .motion-clone { min-height: 41px; padding: 4px 8px; font-size: 11px; }
  .rail-window img { width: 35px; height: 26px; }
  .rail-movies img { width: 26px; height: 39px; }
  .front-nav a { padding: 11px 7px; gap: 7px; }
  .front-nav-icon { width: 31px; height: 31px; }
  .front-nav-icon svg { width: 17px; height: 17px; }
  .front-nav strong { font-size: 13px; }
  .front-nav small { font-size: 10px; }
  .grid { gap: 10px; }
  .story-grid { gap: 9px; }
  .story-card:first-child { min-height: 244px; }
  .story-card { min-height: 227px; }
  .story-copy { padding: 13px 11px; }
  .story-copy h3 { font-size: 21px; }
  .story-copy p:last-of-type { font-size: 11px; line-height: 1.4; }
  .story-arrow { padding: 5px; }
  .story-arrow svg { width: 17px; height: 17px; }
  .brand-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .brand-card { padding: 0; }
  .brand-card-body { padding: 9px; }
  .brand-card-name { gap: 5px; }
  .brand-card .brand-tile { width: 28px; height: 28px; font-size: 9px; }
  .brand-card h3 { font-size: 16px; padding-right: 0; }
  .brand-card .domain { font-size: 9px !important; }
  .brand-card p:not(.domain) { font-size: 11px; margin-top: 6px; }
  .brand-fact { font-size: 12px; margin-top: 6px; }
  .brand-card .card-arrow { bottom: 8px; right: 7px; }
  .brand-card .card-arrow svg { width: 12px; }
  .article-card.has-image .article-card-body { padding: 10px; }
  .card h3 { font-size: 17px; }
  .screen-grid, .article-gallery-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
  .poster-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 9px; }
  .poster-card h3 { font-size: 14px; }
  .illustrated-lead .page-lead-layout { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .page-lead .lead-cover { max-height: 215px; }
  .reading-layout { grid-template-columns: minmax(0,1fr); }
  .prose { font-size: 16px; }
  .related-panel { position: static; }
  .offer-strip { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .facet-search:has(select[name='category']):has(select[name='country']) { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 350px) {
  .poster-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .front-nav a { grid-template-columns: auto minmax(0,1fr); }
  .front-nav a > svg { display: none; }
}

.station-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; margin: 0 0 26px; }
.station-facts > div { padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; background: #1a1c2b; }
.station-facts dt { font-size: 12px; color: var(--muted); }
.station-facts dd { margin: 4px 0 0; color: var(--ink); font-size: 16px; font-weight: 650; overflow-wrap: anywhere; }
.catalog-gallery { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.catalog-image { border: 1px solid var(--line); border-radius: 12px; background: #171928; overflow: hidden; }
.catalog-image a:has(img) { display: block; aspect-ratio: 4/3; background: #222639; }
.catalog-image img { height: 100%; padding: 9px; }
.catalog-image.visual-sport-photo img { object-fit: cover; padding: 0; }
.catalog-image figcaption { padding: 0 9px 11px; }
.visual-figure figcaption small, .page-lead figure figcaption small { display: block; margin-top: 3px; color: #c3bfcf; font-size: 10px; }
.visual-figure figcaption a, .page-lead figure figcaption a { text-decoration: underline; text-underline-offset: 3px; }
.article-visual img.surface-dark { background: #242639; }
.related-panel { max-height: calc(100vh - 115px); overflow: auto; scrollbar-width: thin; }
@media (max-width: 900px) { .catalog-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 680px) { .catalog-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } .related-panel { max-height: none; overflow: visible; } }

/* Public directories, source artwork, and examples. */
.static-facets {
  padding: clamp(12px, 2vw, 20px);
  border: 1px solid var(--line);
  border-radius: 16px;
  background: linear-gradient(135deg, #241e31, #191d2c 72%);
}
.static-facets[data-static-filters="compare"] { grid-template-columns: minmax(150px, 1.25fr) repeat(4, minmax(0, 1fr)) auto auto; }
.directory-crosslink { margin-top: -5px; color: var(--muted); }
.directory-crosslink a, .media-result figcaption a, .market-station-list a {
  color: var(--violet);
  text-decoration: underline;
  text-underline-offset: 3px;
}
[data-directory-status] { margin-block: 16px; font-variant-numeric: tabular-nums; }
[data-directory-results][aria-busy="true"] { opacity: .72; }
[data-directory-results] .result-empty {
  padding: 16px 18px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: var(--panel);
}
[data-directory-pager] .pagination { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 24px; }
.pagination .button { padding-inline: 12px; }
.search-sections { margin-top: 26px; }
[data-static-directory="site"] .grid { grid-template-columns: 1fr; }
.media-library-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(10px, 1.55vw, 22px);
}
.media-result {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: linear-gradient(145deg, #202235, #171923);
}
.media-result:hover { border-color: #8c79b1; }
.media-preview {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #eaeaf2;
}
.media-preview:focus-visible { outline-offset: -4px; }
.media-preview.surface-dark, .media-card .media-preview, .media-hero .media-preview,
.media-sport-photo .media-preview, .media-app-screen .media-preview { background: #111421; }
.media-preview img { width: 100%; height: 100%; object-fit: contain; padding: clamp(8px, 1.5vw, 18px); }
.media-poster .media-preview { aspect-ratio: 2 / 2.7; background: #111421; }
.media-poster .media-preview img { padding: 0; }
.media-device-photo .media-preview img, .media-photo .media-preview img, .media-card .media-preview img,
.media-hero .media-preview img, .media-sport-photo .media-preview img { padding: 0; }
.media-result figcaption { padding: 12px clamp(9px, 1.6vw, 17px) 15px; line-height: 1.48; }
.media-result strong { display: block; font-size: clamp(14px, 1.7vw, 17px); }
.media-result small { display: block; margin: 4px 0 9px; color: var(--muted); font-size: 11px; }
.media-result figcaption p { margin: 3px 0 0; font-size: 12px; }
.media-result figcaption a { display: inline-block; padding-block: 2px; }
.media-result figcaption a:hover, .directory-crosslink a:hover { color: var(--lime); }
.market-station-list { padding: 0; list-style: none; }
.market-station-list li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; border-bottom: 1px solid var(--line); padding: 8px 0; }
.market-station-list li span { color: var(--muted); font-size: 13px; }
.market-station-list li code { overflow-wrap: anywhere; }
.static-note { max-width: 830px; }
.static-note pre { overflow: auto; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: #171929; white-space: pre-wrap; }
[data-guide-context]:empty, [data-copy-status]:empty { display: none; }
[data-directory-results] .card-image { aspect-ratio: 16 / 7.5; }

@media (max-width: 1100px) {
  .static-facets[data-static-filters="compare"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .media-library-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 650px) {
  .media-library-grid, .static-facets[data-static-filters="compare"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .static-facets .button, .static-facets input, .static-facets select { min-height: 44px; }
}

/* IPTV Complete Forum — full-width premium theme */
:root {
  --wrap: 100%;
  --gutter: clamp(12px, 1.65vw, 32px);
  --bg: #0a0d16;
  --panel: #151b2a;
  --raised: #1c2436;
  --ink: #f8f5ef;
  --muted: #b8c0d2;
  --line: #343d52;
  --lime: #ffd69d;
  --lime-ink: #241507;
  --amber: #ffd39a;
  --violet: #d0c0ff;
  --blue: #a0caff;
  --teal: #99eadc;
  --radius: 18px;
  --panel-gradient: linear-gradient(150deg, #1b2335, #141a29 72%);
  --panel-shadow: 0 10px 28px #03050d45;
}

/* Shared navigation and controls */
.site-header {
  background: #0b0f19f5;
  border-color: #41455b;
  box-shadow: 0 10px 28px #03050b55, inset 0 1px #ffe3b511;
}
.desktop-nav { gap: clamp(5px, .8vw, 15px); }
.desktop-nav a { padding: 6px 7px; border-radius: 7px; color: #d9deeb; }
.desktop-nav a:hover, .desktop-nav a[aria-current] { background: #ffd39a14; color: var(--amber); }
.header-sign, .mobile-pop a { color: #e1e5ef; }
.header-search { max-width: 330px; }
.search-box, .field input, .field select, .field textarea,
.filter-controls input, .filter-controls select {
  background: #0d1320;
  border-color: #444e65;
  color: var(--ink);
}
.search-box input { background: transparent; }
.search-box:focus-within { border-color: var(--amber); box-shadow: 0 0 0 3px #ffd39a26; }
.search-box button { color: var(--amber); }
.button { border-radius: 10px; max-width: 100%; }
.button.primary {
  background: linear-gradient(112deg, #ffe7c4, #f1be7c 60%, #e5a761);
  border-color: #ffdfaf;
  color: var(--lime-ink);
  box-shadow: 0 5px 20px #d8994e36, inset 0 1px #fff4dbac;
}
.button.primary:hover { background: #ffdfac; }
.button.outline { border-color: #5a6279; background: #1a22338c; }
.button.outline:hover { border-color: var(--violet); background: #2a2941; }
.mobile-nav summary { border-color: #586178; background: #1b2334; }
.mobile-pop {
  background: linear-gradient(145deg, #222a3f, #121826 78%);
  border-color: #525e77;
  box-shadow: 0 16px 45px #02040caa;
}

/* Homepage hero and three media rails */
.premium-hero {
  background: radial-gradient(ellipse at 18% 5%, #2e2542 0, transparent 62%), #0b101b;
  border-color: #6d573f;
}
.premium-hero .hero-grid {
  min-height: clamp(470px, 36vw, 650px);
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(16px, 3vw, 55px);
  padding-block: clamp(40px, 5vw, 88px);
}
.hero-photo { inset: 0 0 0 24%; mask-image: linear-gradient(90deg, transparent, #000 16%); }
.hero-photo .hero-cover-img { object-position: 58% 52%; filter: saturate(1.06) contrast(1.09) brightness(.87); }
.hero-photo::after {
  background: linear-gradient(90deg, #101421 0%, #131728ef 13%, #16192aba 33%, #1b1c310c 72%),
              linear-gradient(0deg, #090d18 0%, #090d1840 34%, transparent 62%);
}
.hero-photo figcaption { color: #e2e2ed; }
.hero-kicker { color: #ffe1b7; letter-spacing: .13em; }
.hero-kicker span { background: #ffd39a; box-shadow: 0 0 13px #ffc36a95; }
.premium-hero h1 { font-size: clamp(54px, 7.1vw, 114px); line-height: .94; }
.premium-hero h1 span { color: var(--amber); }
.premium-hero .hero-copy .lede { max-width: 51ch; color: #e5e8f1; }
.premium-hero .home-search { max-width: 540px; }
.premium-hero .search-box {
  background: #101827f0;
  border-color: #7d7286;
  border-radius: 13px;
  box-shadow: 0 12px 32px #03050f59, inset 0 1px #ffffff12;
}
.premium-hero .search-box button { background: #ffd39a20; margin: 5px; padding: 10px; }
.premium-hero .search-box button:hover { background: #ffd39a3b; }
.hero-guide {
  min-width: 0;
  background: linear-gradient(135deg, #25283ef2, #111824f5);
  border-color: #9a795a;
  border-radius: 15px;
  box-shadow: 0 16px 38px #03050b8c, inset 0 1px #ffe2b622;
}
.hero-guide a svg { flex: none; }
.hero-guide-icon, .front-nav-icon {
  background: linear-gradient(150deg, #ffd39a2d, #ffd39a0b);
  border-color: #ffd39a52;
  color: var(--amber);
}
.media-deck { background: linear-gradient(115deg, #1a1b2d, #0f1523 76%); }
.media-rail { --rail-accent: var(--violet); border-color: #3a4056; }
.rail-sports { --rail-accent: var(--teal); }
.rail-movies { --rail-accent: #ffc398; }
.rail-inner { grid-template-columns: clamp(148px, 11vw, 192px) minmax(0, 1fr); gap: 16px; }
.rail-inner h2 a {
  padding-inline-start: 10px;
  border-inline-start: 2px solid var(--rail-accent);
  color: #f0edf8;
}
.rail-inner h2 a:hover, .rail-inner h2 a svg { color: var(--rail-accent); }
.rail-window { min-width: 0; max-width: 100%; }
.rail-window li a, .rail-window li .motion-clone {
  background: linear-gradient(145deg, #263047, #1b2133);
  border-color: #4a526d;
  box-shadow: inset 0 1px #ffffff0c;
  border-radius: 10px;
}
.rail-window li a:hover { border-color: var(--rail-accent); }
.deck-footer { flex-wrap: wrap; gap: 4px 14px; color: #c9d0e0; }
.deck-footer a:hover, .motion-toggle:hover { color: var(--amber); }

/* Directory shortcuts and feature photography */
.front-nav { background: linear-gradient(90deg, #121827, #181c30, #121827); }
.front-nav .wrap { gap: clamp(7px, 1.1vw, 16px); padding-block: 12px 15px; }
.front-nav a, .front-nav a:first-child, .front-nav a:nth-child(odd) {
  min-width: 0;
  border: 1px solid #454d64;
  border-radius: 13px;
  background: var(--panel-gradient);
  box-shadow: var(--panel-shadow);
}
.front-nav a:hover, .front-nav a:focus-visible { border-color: #b59771; background: #252b40; }
.front-nav a:nth-child(2) .front-nav-icon { color: var(--violet); border-color: #bcafff60; background: #b7a8ff1a; }
.front-nav a:nth-child(3) .front-nav-icon { color: var(--teal); border-color: #8bdac764; background: #8bdac71a; }
.front-nav a:nth-child(4) .front-nav-icon { color: var(--blue); border-color: #9ec6ff5c; background: #9ec6ff1b; }
.front-nav small { color: #c4ccdf; }
.content-section { padding-block: clamp(30px, 4.05vw, 66px); }
.content-section + .content-section { border-color: #30384d; }
.content-section.tinted {
  background: radial-gradient(ellipse at 92% 0%, #30274481, transparent 61%), #101522;
}
.section-head { position: relative; padding-bottom: 13px; border-bottom: 1px solid #3c4359; }
.section-head::after {
  content: "";
  position: absolute;
  inset-inline-start: 0;
  inset-block-end: -1px;
  width: 53px;
  height: 2px;
  background: linear-gradient(90deg, #ffd69d, #be9cf5);
}
.section-head > div { min-width: 0; }
.section-head > .button { flex: none; }
.section-head p { color: #c1c9da; }
.grid, .story-grid, .screen-grid, .poster-grid, .article-gallery-grid, .media-library-grid {
  gap: clamp(10px, 1.25vw, 23px);
}
.story-grid { grid-template-columns: minmax(0, 1.28fr) repeat(2, minmax(0, 1fr)); }
.story-card {
  min-width: 0;
  min-height: clamp(290px, 24vw, 430px);
  border-radius: var(--radius);
  border-color: #555772;
  box-shadow: 0 12px 30px #03050d62;
}
.story-card::before {
  background: linear-gradient(0deg, #0a101cfb 0%, #0c111ee6 22%, #0b101b59 65%, #10142317 100%);
}
.story-copy { padding: clamp(17px, 1.9vw, 30px); }
.story-copy .eyebrow { color: var(--amber); }
.story-card:nth-child(2) .eyebrow { color: var(--teal); }
.story-card:nth-child(3) .eyebrow { color: var(--violet); }
.story-copy p:last-of-type { color: #e1e5f1; }
.story-arrow { background: #101622db; border-color: #b69c74; }

/* Content cards and image galleries */
.card, .poster-card, .screen-tile, .media-result, .faq-row,
.related-panel, .form-panel, .post, .queue {
  background: var(--panel-gradient);
  border-color: #424b63;
  box-shadow: var(--panel-shadow);
}
.card p:not(.eyebrow) { color: #c4ccdd; }
.card-arrow { color: #c4a980; }
.category-card { border-top: 2px solid color-mix(in srgb, var(--tint) 74%, #323b52); }
.category-icon, .topic-icon { border: 1px solid color-mix(in srgb, var(--tint, var(--amber)) 40%, #343d52); }
.category-count { color: var(--tint, var(--amber)); }
.brand-card-body, .article-card.has-image .article-card-body { padding: clamp(12px, 1.2vw, 20px); }
.brand-card .brand-tile { background: #171f32; border-color: #566079; }
.brand-fact {
  padding: 4px 8px;
  border: 1px solid #b287575f;
  border-radius: 7px;
  background: #ffd39a12;
  color: var(--amber);
  max-width: calc(100% - 15px);
}
.brand-fact small { color: #d1d7e6; }
.card-image.surface-dark, .media-preview.surface-dark { background: #232b41; }
.media-result figcaption, .poster-card a div { padding: clamp(10px, 1.3vw, 17px); }
.media-result strong { color: #f7f3ed; }
.media-result small { color: #c5cee0; }
.screen-tile figcaption { padding: 6px 11px 11px; }
.duel { background: #67617b; }
.duel-brand { min-width: 0; }
.duel-vs { border-color: #d9ac7c; color: #ffe0b0; background: #161d2d; }
.card:hover, .card:focus-within, .story-card:hover, .story-card:focus-within,
.poster-card:hover, .poster-card:focus-within, .media-result:hover, .media-result:focus-within,
.screen-tile:hover, .screen-tile:focus-within, .faq-row:hover, .faq-row:focus-within {
  border-color: #a78eac;
}

/* Article reading areas, forms, and footer */
.page-lead {
  background: radial-gradient(ellipse at 88% 3%, #49395c9e, transparent 58%), linear-gradient(120deg, #1b2337, #111725 74%);
  border-color: #514861;
}
.page-lead .lead-cover { border-color: #6e5c77; box-shadow: 0 12px 36px #080b1380; }
.reading-layout { gap: clamp(13px, 2.4vw, 42px); }
.article-main {
  padding: clamp(14px, 2vw, 34px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(145deg, #151c2b, #111725 65%);
  box-shadow: var(--panel-shadow);
}
.article-main > :is(p, ul, ol, blockquote, .reading-note) { max-width: 78ch; }
.article-main a, .related-panel a { overflow-wrap: anywhere; }
.related-panel { min-width: 0; }
.table-wrap, .prose pre { max-width: 100%; }
.prose th { background: #2b354b; }
.prose tr:nth-child(even) td { background: #192131; }
.prose table caption { background: #212c41; color: #e2e6f1; }
.reading-note, .offer-strip li { background: #29243a; border-color: #b28b60; }
.static-facets { background: linear-gradient(125deg, #262940, #161d2d 74%); border-color: #49546d; }
.faq-row summary { color: #f5f2fa; }
.faq-row summary::after { flex: none; }
.faq-row[open] { border-color: #a58f76; }
.site-footer {
  background: radial-gradient(ellipse at 7% 0%, #272440a6, transparent 52%), #0d1220;
  border-color: #575068;
}
.footer-grid { gap: clamp(13px, 2vw, 32px); }
.footer-grid h2 { color: #f2e2cb; }
.footer-grid p, .footer-grid li { color: #bec8dc; }

@media (min-width: 851px) {
  .reading-layout { grid-template-columns: minmax(0, 1fr) minmax(220px, clamp(230px, 22vw, 350px)); }
}
@media (min-width: 1800px) {
  .brand-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .grid.country-grid, .poster-grid, .media-library-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}
@media (max-width: 850px) {
  .header-inner { position: relative; }
  .mobile-nav { position: static; }
  .mobile-pop { top: calc(100% - 4px); width: min(100%, 310px); }
  .premium-hero .hero-grid { min-height: 420px; }
  .premium-hero h1 { font-size: clamp(49px, 8.2vw, 72px); }
  .rail-inner { grid-template-columns: 128px minmax(0, 1fr); gap: 10px; }
  .story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .story-card { min-height: 252px; }
}
@media (max-width: 680px) {
  .premium-hero .hero-grid { min-height: auto; grid-template-columns: minmax(0, 1fr); padding-block: 33px 26px; }
  .hero-photo { inset: 0; mask-image: none; }
  .hero-photo .hero-cover-img { object-position: 65% center; }
  .hero-photo::after { background: linear-gradient(90deg, #111626f2, #14192bd6 49%, #0f152764), linear-gradient(0deg, #0b101b, transparent 58%); }
  .premium-hero h1 { font-size: clamp(44px, 12vw, 70px); }
  .rail-inner { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .rail-inner h2 a { padding-inline-start: 7px; }
  .front-nav a { padding: 9px 7px; }
  .story-card { min-height: 222px; }
  .story-copy { padding: 13px 11px; }
  .story-copy h3 { font-size: clamp(18px, 4.7vw, 25px); }
  .story-copy p:last-of-type { font-size: 12px; }
  .article-main { border-radius: 12px; }
}
@media (max-width: 350px) {
  .story-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .card, .story-card, .poster-card, .media-result { transition: border-color .18s ease, box-shadow .18s ease; }
  .card:hover, .story-card:hover, .poster-card:hover, .media-result:hover { box-shadow: 0 12px 34px #03050e88; }
}
