/* Presentation shared by the two Pages HTML renderers; no runtime/data changes. */
html.cinematic-products{color-scheme:dark;--ink:#f1eee5;--ink-soft:#bbc0b7;--muted:#a6aaa3;--muted-strong:#bfc1b6;--paper:#090b0d;--surface:#111719;--surface-2:#171d1d;--line:#dfbd7b29;--line-strong:#dfbd7b3c;--green:#dfbd7b;--green-deep:#e3c994;--green-soft:#24251e;--green-line:#887349;--on-dark:#f1eee5;--tone-good:#dfbd7b;--shadow-soft:none;scroll-padding-top:100px}
.cinematic-products body{width:100%;min-width:320px}
.cinematic-products a:focus-visible,.cinematic-products summary:focus-visible{outline:2px solid #dfbd7b;outline-offset:5px}
.cinematic-products .site-header{background:#090b0df5;backdrop-filter:blur(16px)}
.cinematic-products .brand{font-size:.95rem;letter-spacing:-.02em}
.cinematic-products .brand-mark{border:1px solid #ad8d53;border-radius:2px;background:#191f1c;box-shadow:none}
.cinematic-products .brand-mark::before{background:linear-gradient(#dfbd7b 0 2px,transparent 2px) 0 0/100% 5px,linear-gradient(90deg,#dfbd7b 0 2px,transparent 2px) 0 0/5px 100%}
.cinematic-products .nav{font-size:.75rem}
.cinematic-products .nav a{color:#c0c5ba;padding:10px;min-height:44px}
.cinematic-products .nav a.nav-feature,.cinematic-products .mobile-ask-ai{color:#dfbd7b;border-color:#77633e;border-radius:2px;background:#1c211c;box-shadow:none}
.cinematic-products .nav a.nav-feature:hover{color:#111613;background:#dfbd7b;transform:none}
.cinematic-products .console{background:#0a0d0f;border-bottom:1px solid var(--line)}
.cinematic-products .console-inner{padding-block:58px}
.product-editorial-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:7%;align-items:center}
.product-editorial-text{padding-block:76px!important;max-width:900px;margin-left:max(24px,calc((100% - 1200px)/2))!important}
.cinematic-products .console h1{font-family:"Avenir Next Condensed","Arial Narrow",system-ui,sans-serif;font-size:clamp(35px,4.2vw,58px);line-height:1.07;letter-spacing:-.045em;max-width:22ch;text-wrap:balance}
.cinematic-products .eyebrow{font-size:10px;letter-spacing:.15em;color:#dfbd7b;margin-bottom:20px}
.cinematic-products .eyebrow i{background:#dfbd7b}
.cinematic-products .console-sub{font-size:16px;line-height:1.8;color:#b8bcb3;max-width:52ch}
.cinematic-products .console-meta{font-size:11px;color:#e3c994;background:#dfbd7b0b;border-color:#dfbd7b40;border-radius:2px}
.product-editorial-visual{margin:0;min-width:0;position:relative;border:1px solid var(--line);background:#0b0e10}
.product-editorial-visual img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.product-editorial-visual figcaption{padding:12px 15px;color:#a6aaa3;font-size:11px;line-height:1.6}
.cinematic-products .page{padding-block:54px 82px}
.cinematic-products .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px;border-top:1px solid var(--line)}
.cinematic-products .card{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:30px 0;background:none;box-shadow:none;gap:14px}
.cinematic-products .card h2{font-size:27px;letter-spacing:-.035em;max-width:26ch}
.cinematic-products .card p{font-size:16px;line-height:1.8}
.cinematic-products .card-eyebrow{font-size:10px;letter-spacing:.15em}
.cinematic-products .side-card span{border-radius:2px;color:#e3c994;background:#24251e;font-size:11px;font-weight:500}
/* Non-verdict pills (confidence, device category) sit neutral so they no longer borrow the accent that used to make every value look approved. */
.cinematic-products .tag,.cinematic-products .status-row span{border:1px solid var(--line);border-radius:2px;color:#bfc1b6;background:#171d1d;font-size:11px;font-weight:500}
.cinematic-products .layout{gap:45px;grid-template-columns:minmax(0,1fr) 250px}
.cinematic-products .main-card{background:none;border:0;border-radius:0;padding:0 0 30px;border-bottom:1px solid var(--line)}
.cinematic-products .main-card h2{font-size:24px;line-height:1.3;letter-spacing:-.025em;margin-top:26px}
.cinematic-products .main-card p{font-size:16px;line-height:1.85;max-width:70ch}
.cinematic-products .side-card{background:#101416;border-radius:0;padding:24px;border-color:var(--line)}
.cinematic-products .side-card strong{font-size:19px;line-height:1.5;font-weight:500}
.cinematic-products .panel{background:#101416;border-radius:0;border-color:var(--line);padding:28px;margin-top:28px}
.cinematic-products .panel h2{font-size:23px;letter-spacing:-.025em;line-height:1.3;margin-top:0;margin-bottom:18px}
.cinematic-products .panel-note{font-size:16px;line-height:1.85;max-width:75ch}
.cinematic-products .checks,.cinematic-products .sources{padding:0;list-style:none;gap:18px}
.cinematic-products .checks li,.cinematic-products .sources li{padding-bottom:18px;border-bottom:1px solid var(--line)}
.cinematic-products .checks strong,.cinematic-products .sources a{font-weight:500}
.cinematic-products .checks span,.cinematic-products .sources span{margin-top:6px;font-size:14px;line-height:1.7}
.cinematic-products .plain{line-height:1.85}
.cinematic-products .button{font-size:12px;border-radius:2px;padding:12px 18px;min-height:48px;box-shadow:none}
.cinematic-products .button.primary{background:#dfbd7b;border-color:#dfbd7b;color:#111613}
.cinematic-products .button.primary:hover{background:#efdaa9}
.cinematic-products .button:hover{transform:none}
.cinematic-products .empty{background:none;border:0;border-block:1px solid var(--line);padding:30px 0;border-radius:0;max-width:820px;gap:20px}
.cinematic-products .empty h2{font-size:29px;letter-spacing:-.025em}
.cinematic-products .empty p{font-size:16px;line-height:1.85}
.cinematic-products .actions{gap:12px;margin-top:18px}
.cinematic-products .site-footer{background:#090b0d}
.cinematic-products .footer-inner{padding-block:35px;font-size:11px;line-height:1.8;gap:25px}
.cinematic-products .footer-inner>span{max-width:75ch}
.cinematic-products .footer-links a{min-height:44px;display:inline-flex;align-items:center;color:#bfc1b6}
.cinematic-products .editorial-details>summary{cursor:pointer;font-size:17px;color:#dfbd7b;min-height:48px;line-height:1.6}
.cinematic-products .editorial-details[open]>summary{margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
@media(max-width:1080px){.cinematic-products .nav a{padding-inline:7px}.cinematic-products .brand{font-size:13px}.product-editorial-hero{gap:35px}.cinematic-products .console h1{font-size:42px}}
@media(max-width:860px){.cinematic-products .mobile-nav-menu summary{border-radius:2px;background:#19201e;color:#dfd9c8;min-height:44px}.cinematic-products .mobile-nav-links{border-radius:2px}.cinematic-products .mobile-nav-links a{min-height:44px}.cinematic-products .layout{grid-template-columns:1fr;gap:20px}.cinematic-products .side-card{max-width:460px}}
@media(max-width:660px){.cinematic-products .console-inner{padding-block:37px}.product-editorial-hero{grid-template-columns:1fr;gap:28px}.product-editorial-text{margin-inline:24px!important;width:calc(100% - 48px)!important}.cinematic-products .console h1{font-size:37px}.product-editorial-visual img{aspect-ratio:16/9}.cinematic-products .page{padding-block:36px 55px}.cinematic-products .grid,.cinematic-products .grid2{grid-template-columns:1fr;gap:0}.cinematic-products .grid2 .panel{margin-top:24px}.cinematic-products .panel{padding:23px}.cinematic-products .card h2{font-size:25px}.cinematic-products .actions .button{width:100%}}
@media(prefers-reduced-motion:reduce){.cinematic-products *{scroll-behavior:auto!important;transition:none!important}}
.cinematic-products .product-details{border-block:1px solid var(--line);margin-block:28px}.cinematic-products .product-details>summary{cursor:pointer;min-height:64px;padding:20px 0;color:#dfbd7b;font-size:17px}.cinematic-products .product-details[open]{padding-bottom:28px}.cinematic-products .footer-inner>span{min-width:0}@media(max-width:660px){.cinematic-products .footer-inner{display:block}.cinematic-products .footer-inner>span{display:block;max-width:65ch;font-size:12px}.cinematic-products .footer-links{margin-top:18px}}

/* Support-state pills (cinematic theme). The marker shape, border style and wording
   already separate the four states without colour; hue is the fourth, redundant cue,
   so the states stay readable in greyscale and for red-green colour blindness.
   Marker geometry is inherited from the renderers' inline base CSS and follows currentColor. */
.cinematic-products .tag--supported,.cinematic-products .status-row span.tag--supported{border-color:#3d5b4b;background:#16201b;color:#9fd9ba}
.cinematic-products .tag--partial,.cinematic-products .status-row span.tag--partial{border-style:dashed;border-color:#7e6a42;background:#221f16;color:#dfbd7b}
.cinematic-products .tag--unsupported,.cinematic-products .status-row span.tag--unsupported{border-color:#7d4535;background:#241715;color:#e2947c;font-weight:700}
.cinematic-products .tag--unknown,.cinematic-products .status-row span.tag--unknown{border-style:dotted;border-color:var(--line-strong);background:#171d1d;color:#a6aaa3}