:root{
  --bg:#0C0C0E; --bg2:#111114; --card:#16161B; --card2:#1D1D24;
  --text:#F4EFE6; --muted:#B9B3A5; --faint:#8E8878;
  --line:#2A2A32; --line-soft:#222228;
  --amber:#F59E0B; --on-amber:#140F05;
  --header-bg:rgba(12,12,14,.9);
  --shadow:0 16px 40px rgba(0,0,0,.5);
  --card-shadow:0 10px 28px rgba(0,0,0,.38);
  --radius:18px; --gutter:20px; --content-w:1120px;
  --body-font:Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,Roboto,Arial,sans-serif;
  --h-font:Georgia,"Times New Roman",Times,serif;
}html[data-theme="light"]{
  --bg:#FAF7F0; --bg2:#F2ECDF; --card:#FFFFFF; --card2:#FFFDF7;
  --text:#1B1712; --muted:#655D4F; --faint:#8A8172;
  --line:#E4DAC6; --line-soft:#EFE7D6;
  --header-bg:rgba(250,247,240,.92);
  --shadow:0 16px 40px rgba(80,60,25,.14);
  --card-shadow:0 10px 28px rgba(80,60,25,.1);
}.dg-redesign *{box-sizing:border-box;margin:0;padding:0}.dg-redesign .skip-link{position:absolute;left:12px;top:-52px;z-index:200;background:var(--amber);color:#140F05;font-weight:800;padding:10px 16px;border-radius:10px;transition:top .18s ease}.dg-redesign .skip-link:focus-visible{top:12px}.dg-redesign{background:var(--bg);color:var(--text);font-family:var(--body-font);font-size:1.0625rem;line-height:1.7;-webkit-font-smoothing:antialiased;transition:background .3s ease,color .3s ease}.dg-redesign img{max-width:100%}.dg-redesign a{color:inherit}.dg-redesign h2{font-family:var(--h-font);font-weight:700;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}.dg-redesign h3{font-family:var(--h-font);font-weight:700;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}.dg-redesign ::selection{background:var(--amber);color:var(--on-amber)}.dg-redesign :focus-visible{outline:3px solid var(--amber);outline-offset:3px;border-radius:6px}.dg-redesign .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 30px;border-radius:14px;font-family:var(--body-font);font-weight:800;font-size:1rem;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}.dg-redesign .btn:active{transform:translateY(1px)}.dg-redesign .btn-primary{background:var(--amber);color:var(--on-amber);box-shadow:0 10px 26px rgba(245,158,11,.28)}.dg-redesign .btn-primary:hover{box-shadow:0 14px 34px rgba(245,158,11,.4);transform:translateY(-2px)}.dg-redesign .site-header{position:sticky;top:0;z-index:60;background:var(--header-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft)}.dg-redesign .site-header .wrap{display:flex;align-items:center;gap:14px;min-height:72px}.dg-redesign .logo{display:flex;align-items:center;gap:11px;text-decoration:none;margin-right:auto}.dg-redesign .logo-mark{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:11px;background:var(--amber);color:var(--on-amber);font-family:var(--h-font);font-weight:700;font-size:1.05rem;flex:0 0 auto}.dg-redesign .logo-word{font-family:var(--h-font);font-weight:700;font-size:1.18rem;letter-spacing:-.01em;white-space:nowrap}.dg-redesign .site-nav{display:none}.dg-redesign .header-controls{display:flex;align-items:center;gap:8px;margin-left:8px}.dg-redesign .icon-btn{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;border:1px solid var(--line);background:transparent;color:var(--text);cursor:pointer;transition:border-color .18s,color .18s}.dg-redesign .icon-btn:hover{border-color:var(--amber);color:var(--amber)}.dg-redesign .icon-btn svg{width:22px;height:22px}html:not([data-theme="light"]) .dg-redesign .icon-sun{display:block}html:not([data-theme="light"]) .dg-redesign .icon-moon{display:none}html[data-theme="light"] .dg-redesign .icon-sun{display:none}html[data-theme="light"] .dg-redesign .icon-moon{display:block}.dg-redesign .mobile-nav{display:none;border-top:1px solid var(--line-soft);padding:10px var(--gutter) 18px;background:var(--header-bg)}.dg-redesign .mobile-nav.open{display:block}.dg-redesign .mobile-nav a{display:flex;align-items:center;min-height:52px;text-decoration:none;font-weight:600;color:var(--text);border-bottom:1px solid var(--line-soft)}.dg-redesign .mobile-nav a:last-child{border-bottom:0}.dg-redesign .winner-badge svg{width:14px;height:14px}.dg-redesign .site-footer{padding:60px 0 40px}.dg-redesign .foot-grid{display:grid;gap:36px;margin-bottom:44px}.dg-redesign .foot-brand p{color:var(--muted);font-size:.94rem;margin-top:14px;max-width:30em}.dg-redesign .foot-h{font-size:.8rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);margin-bottom:16px}.dg-redesign .foot-nav{list-style:none;display:grid;gap:4px}.dg-redesign .foot-nav a{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;color:var(--muted);font-weight:600;font-size:.95rem}.dg-redesign .foot-nav a:hover{color:var(--amber)}.dg-redesign .foot-legal{border-top:1px solid var(--line-soft);padding-top:28px;display:grid;gap:12px;color:var(--faint);font-size:.86rem}.dg-redesign .foot-legal .disclosure{color:var(--muted)}@media(min-width:800px){.dg-redesign .foot-grid{grid-template-columns:1.4fr 1fr 1fr}}@media(min-width:900px){.dg-redesign .site-nav{display:flex;align-items:center;gap:4px;margin-left:auto}}@media(min-width:900px){.dg-redesign .site-nav a{text-decoration:none;font-weight:600;font-size:.95rem;color:var(--muted);padding:12px 14px;border-radius:10px;transition:color .15s,background .15s}}@media(min-width:900px){.dg-redesign .site-nav a:hover{color:var(--text);background:var(--card)}}@media(min-width:900px){.dg-redesign .site-nav a[aria-current="page"]{color:var(--text)}}@media(min-width:900px){.dg-redesign .nav-toggle{display:none}}@media(min-width:900px){.dg-redesign .header-controls{margin-left:0}}
/* ===== dg-t-home (namespaced; no cross-template collisions) ===== */.dg-redesign.dg-t-home *::before{box-sizing:border-box;margin:0;padding:0}.dg-redesign.dg-t-home *::after{box-sizing:border-box;margin:0;padding:0}.dg-redesign.dg-t-home h1{font-family:var(--h-font);font-weight:700;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}.dg-redesign.dg-t-home .wrap{max-width:var(--content-w);margin:0 auto;padding:0 var(--gutter)}.dg-redesign.dg-t-home .section{padding:76px 0}.dg-redesign.dg-t-home .kicker{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-bottom:14px}.dg-redesign.dg-t-home .section-head{max-width:640px;margin-bottom:44px}.dg-redesign.dg-t-home .section-head h2{font-size:clamp(1.8rem,1.2rem+2.6vw,2.7rem);margin-bottom:12px}.dg-redesign.dg-t-home .section-head p{color:var(--muted);font-size:1.05rem}.dg-redesign.dg-t-home .btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}.dg-redesign.dg-t-home .btn-ghost:hover{border-color:var(--amber);color:var(--amber)}.dg-redesign.dg-t-home .center-cta{display:flex;justify-content:center;margin-top:30px}.dg-redesign.dg-t-home .hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line-soft)}.dg-redesign.dg-t-home .hero-art{position:absolute;inset:0;pointer-events:none}.dg-redesign.dg-t-home .hero-art .sky{position:absolute;inset:0;background:linear-gradient(180deg,#050508 0%,#0B0B12 46%,#141019 72%,#0C0C0E 100%)}html[data-theme="light"] .dg-redesign.dg-t-home .hero-art .sky{background:linear-gradient(180deg,#EFE6D3 0%,#F5EDDD 46%,#EDE2CC 72%,#FAF7F0 100%)}.dg-redesign.dg-t-home .hero-art .stars{position:absolute;top:0;left:0;right:0;height:28%;opacity:.9;overflow:hidden}html[data-theme="light"] .dg-redesign.dg-t-home .hero-art .stars{opacity:0}.dg-redesign.dg-t-home .hero-art .horizon{position:absolute;left:50%;top:58%;width:130%;height:44%;transform:translateX(-50%);background:radial-gradient(ellipse 50% 42% at 50% 100%,rgba(245,158,11,.34),rgba(245,158,11,.08) 55%,transparent 75%)}.dg-redesign.dg-t-home .hero-art .hills{position:absolute;left:-10%;right:-10%;top:62%;height:26%;background:radial-gradient(ellipse 60% 90% at 20% 100%,#131318 60%,transparent 61%),radial-gradient(ellipse 55% 85% at 78% 100%,#101015 60%,transparent 62%)}html[data-theme="light"] .dg-redesign.dg-t-home .hero-art .hills{background:radial-gradient(ellipse 60% 90% at 20% 100%,#D9CDAF 60%,transparent 61%),radial-gradient(ellipse 55% 85% at 78% 100%,#D2C5A6 60%,transparent 62%)}.dg-redesign.dg-t-home .hero-art .road{position:absolute;left:50%;bottom:-4%;width:150%;height:34%;transform:translateX(-50%);background:linear-gradient(180deg,#17171D,#0B0B0E);clip-path:polygon(44% 0,56% 0,100% 100%,0 100%)}html[data-theme="light"] .dg-redesign.dg-t-home .hero-art .road{background:linear-gradient(180deg,#D8CCB2,#C9BB9C)}.dg-redesign.dg-t-home .hero-art .road-line{position:absolute;left:50%;bottom:-4%;width:150%;height:34%;transform:translateX(-50%);clip-path:polygon(49.5% 0,50.5% 0,51.8% 100%,48.2% 100%);background:repeating-linear-gradient(180deg,var(--amber) 0 20px,transparent 20px 46px);opacity:.55}.dg-redesign.dg-t-home .hero-art .dash-glow{position:absolute;left:0;right:0;bottom:0;height:26%;background:linear-gradient(180deg,transparent,rgba(245,158,11,.07))}.dg-redesign.dg-t-home .hero-veil{position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,var(--bg) 97%)}.dg-redesign.dg-t-home .hero-inner{position:relative;padding:96px 0 110px;max-width:720px}.dg-redesign.dg-t-home .hero h1{font-size:clamp(2.5rem,1.6rem+4.6vw,4.3rem);margin:0 0 20px;text-shadow:0 3px 30px rgba(0,0,0,.55)}html[data-theme="light"] .dg-redesign.dg-t-home .hero h1{text-shadow:0 2px 18px rgba(255,255,255,.6)}.dg-redesign.dg-t-home .hero .lede{font-size:clamp(1.08rem,1rem+1vw,1.3rem);color:var(--muted);max-width:34em;margin-bottom:36px}html:not([data-theme="light"]) .dg-redesign.dg-t-home .hero .lede{color:#D8D2C2}.dg-redesign.dg-t-home .hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:30px}.dg-redesign.dg-t-home .hero-proof{display:flex;flex-wrap:wrap;gap:10px 26px;color:var(--muted);font-size:.92rem;font-weight:600}html:not([data-theme="light"]) .dg-redesign.dg-t-home .hero-proof{color:#C9C2B1}.dg-redesign.dg-t-home .hero-proof span{display:inline-flex;align-items:center;gap:8px}.dg-redesign.dg-t-home .hero-proof svg{width:17px;height:17px;color:var(--amber);flex:0 0 auto}.dg-redesign.dg-t-home .hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:22% 55%}.dg-redesign.dg-t-home .hero-art.has-photo .stars{display:none}.dg-redesign.dg-t-home .hero-art.has-photo .horizon{display:none}.dg-redesign.dg-t-home .hero-art.has-photo .hills{display:none}.dg-redesign.dg-t-home .hero-art.has-photo .road{display:none}.dg-redesign.dg-t-home .hero-art.has-photo .road-line{display:none}.dg-redesign.dg-t-home .hero-art.has-photo .dash-glow{display:none}.dg-redesign.dg-t-home .hero-art.has-photo .sky{opacity:.5}html[data-theme="light"] .dg-redesign.dg-t-home .hero-art.has-photo .sky{opacity:.55}html[data-theme="light"] .dg-redesign.dg-t-home .hero-art.has-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(250,247,240,.97) 0%,rgba(250,247,240,.95) 55%,rgba(250,247,240,.70) 72%,rgba(250,247,240,.35) 88%,rgba(250,247,240,.30) 100%)}html:not([data-theme="light"]) .dg-redesign.dg-t-home .hero-art.has-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(5,5,8,.80) 0%,rgba(5,5,8,.68) 55%,rgba(5,5,8,.44) 72%,rgba(5,5,8,.24) 88%,rgba(5,5,8,.20) 100%)}html[data-theme="light"] .dg-redesign.dg-t-home .hero-art.has-photo + .wrap .hero-inner .lede{color:var(--text)}html[data-theme="light"] .dg-redesign.dg-t-home .hero .kicker{color:#B45309}.dg-redesign.dg-t-home .pick-media{margin:0 0 18px;border-radius:12px;overflow:hidden;background:var(--card2)}.dg-redesign.dg-t-home .pick-media img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}.dg-redesign.dg-t-home .hub-thumb{display:block;margin-bottom:18px;border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:var(--card2)}.dg-redesign.dg-t-home .hub-thumb img{display:block;width:100%;height:100%;object-fit:cover}.dg-redesign.dg-t-home .art-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.dg-redesign.dg-t-home .pick-grid{display:grid;gap:22px}.dg-redesign.dg-t-home .pick{position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:28px 26px 26px;box-shadow:var(--card-shadow);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.dg-redesign.dg-t-home .pick:hover{transform:translateY(-4px);border-color:var(--line)}.dg-redesign.dg-t-home .pick-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}.dg-redesign.dg-t-home .pick-rank{font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}.dg-redesign.dg-t-home .score-chip{display:inline-flex;flex-direction:column;align-items:flex-end;gap:2px}.dg-redesign.dg-t-home .score{display:inline-flex;align-items:baseline;background:var(--amber);color:var(--on-amber);font-weight:800;font-size:1.12rem;padding:7px 14px;border-radius:999px;letter-spacing:.01em;white-space:nowrap}.dg-redesign.dg-t-home .score small{font-size:.78em;font-weight:700;opacity:.75;margin-left:2px}.dg-redesign.dg-t-home .score-cap{font-size:.72rem;color:var(--faint);font-weight:600}.dg-redesign.dg-t-home .winner-badge{position:absolute;top:-15px;left:26px;display:inline-flex;align-items:center;gap:7px;background:var(--amber);color:var(--on-amber);font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:8px 16px;border-radius:999px;box-shadow:0 8px 22px rgba(245,158,11,.35)}.dg-redesign.dg-t-home .pick.is-winner{border-color:rgba(245,158,11,.5)}.dg-redesign.dg-t-home .pick h3{font-size:1.42rem;margin-bottom:6px}.dg-redesign.dg-t-home .pick-cat{font-size:.85rem;font-weight:700;color:var(--faint);letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}.dg-redesign.dg-t-home .verdict{border-left:3px solid var(--amber);padding:4px 0 4px 16px;margin:0 0 22px;color:var(--muted);font-size:.99rem}.dg-redesign.dg-t-home .pick .btn{margin-top:auto;width:100%}.dg-redesign.dg-t-home .pick-note{margin-top:34px;text-align:center;color:var(--faint);font-size:.9rem}.dg-redesign.dg-t-home .hub-grid{display:grid;gap:18px}.dg-redesign.dg-t-home .hub{display:block;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:28px 24px;text-decoration:none;transition:transform .2s ease,border-color .2s ease}.dg-redesign.dg-t-home .hub:hover{transform:translateY(-4px);border-color:var(--amber)}.dg-redesign.dg-t-home .hub-icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:var(--card2);border:1px solid var(--line);margin-bottom:18px}.dg-redesign.dg-t-home .hub-icon svg{width:26px;height:26px;color:var(--amber)}.dg-redesign.dg-t-home .hub h3{font-size:1.25rem;margin-bottom:8px}.dg-redesign.dg-t-home .hub p{color:var(--muted);font-size:.95rem}.dg-redesign.dg-t-home .hub .go{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-weight:700;font-size:.92rem;color:var(--amber)}.dg-redesign.dg-t-home .method{border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background:var(--bg2)}.dg-redesign.dg-t-home .method-inner{display:flex;flex-direction:column;gap:14px;max-width:760px}.dg-redesign.dg-t-home .method-badge{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:var(--amber);color:var(--on-amber)}.dg-redesign.dg-t-home .method-badge svg{width:30px;height:30px}.dg-redesign.dg-t-home .method p{font-size:1.06rem}.dg-redesign.dg-t-home .method .byline{color:var(--faint);font-size:.9rem;margin-top:8px}.dg-redesign.dg-t-home .art-grid{display:grid;gap:22px}.dg-redesign.dg-t-home .art{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);overflow:hidden;text-decoration:none;transition:transform .2s ease,border-color .2s ease}.dg-redesign.dg-t-home .art:hover{transform:translateY(-4px);border-color:var(--line)}.dg-redesign.dg-t-home .art-thumb{aspect-ratio:16/9;background:linear-gradient(135deg,#1B1B22,#101014);position:relative;overflow:hidden}html[data-theme="light"] .dg-redesign.dg-t-home .art-thumb{background:linear-gradient(135deg,#E7DCC3,#D9CCAC)}.dg-redesign.dg-t-home .art-thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 110%,rgba(245,158,11,.28),transparent 70%)}.dg-redesign.dg-t-home .art-body{padding:24px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}.dg-redesign.dg-t-home .art h3{font-size:1.28rem}.dg-redesign.dg-t-home .art-meta{display:flex;align-items:center;gap:12px;color:var(--faint);font-size:.85rem;font-weight:600;margin-top:auto;padding-top:8px}.dg-redesign.dg-t-home .news-band{background:var(--bg2);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}.dg-redesign.dg-t-home .news-card{max-width:680px;margin:0 auto;text-align:center}.dg-redesign.dg-t-home .news-card h2{font-size:clamp(1.7rem,1.3rem+2vw,2.4rem);margin-bottom:12px}.dg-redesign.dg-t-home .news-card>p{color:var(--muted);margin-bottom:30px}.dg-redesign.dg-t-home .news-form{display:grid;gap:12px;text-align:left}.dg-redesign.dg-t-home .field label{display:block;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}.dg-redesign.dg-t-home .field input{width:100%;min-height:52px;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);font-family:var(--body-font);font-size:1rem}.dg-redesign.dg-t-home .field input::placeholder{color:var(--faint)}.dg-redesign.dg-t-home .field input:focus{border-color:var(--amber);outline:none}.dg-redesign.dg-t-home .news-fine{margin-top:16px;color:var(--faint);font-size:.84rem}.dg-redesign.dg-t-home .news-done{display:none;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px;font-weight:600}.dg-redesign.dg-t-home .news-done.show{display:block}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-home *{transition:none!important}}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-home *::before{transition:none!important}}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-home *::after{transition:none!important}}@media(min-width:640px){.dg-redesign.dg-t-home .news-form{grid-template-columns:1fr 1fr auto;align-items:end}}@media(min-width:1024px){.dg-redesign.dg-t-home .art-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:760px){.dg-redesign.dg-t-home .art-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:900px){.dg-redesign.dg-t-home .method-inner{flex-direction:row;align-items:center;gap:28px}}@media(min-width:1024px){.dg-redesign.dg-t-home .hub-grid{grid-template-columns:repeat(4,1fr)}}@media(min-width:700px){.dg-redesign.dg-t-home .hub-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.dg-redesign.dg-t-home .pick-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:760px){.dg-redesign.dg-t-home .pick-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.dg-redesign.dg-t-home .hero-inner{padding:140px 0 160px}}@media(min-width:1024px){.dg-redesign.dg-t-home .section{padding:116px 0}}
/* ===== dg-t-post (namespaced; no cross-template collisions) ===== */.dg-redesign.dg-t-post h1{font-family:var(--h-font);font-weight:700;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}.dg-redesign.dg-t-post h1{
  font-family:var(--h-font);font-weight:700;
  font-size:clamp(2.1rem,4.6vw + 1rem,3.4rem);
  line-height:1.12;letter-spacing:-.01em;
  max-width:16ch;
}.dg-redesign.dg-t-post .wrap{max-width:1120px;margin:0 auto;padding:0 20px}.dg-redesign.dg-t-post .kicker{
  display:inline-block;margin-bottom:14px;
  color:var(--amber);font-size:.78rem;font-weight:800;
  letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
}.dg-redesign.dg-t-post .hero{
  margin:34px 0 0;border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--line-soft);box-shadow:var(--shadow);
  aspect-ratio:16/9;position:relative;
  background:
    radial-gradient(1100px 420px at 50% 120%,var(--hero-glow),transparent 60%),
    linear-gradient(160deg,var(--card2),var(--card));
}.dg-redesign.dg-t-post .score-chip{
  display:inline-flex;flex-direction:row;align-items:baseline;white-space:nowrap;
  background:var(--amber);color:var(--on-amber);
  font-weight:800;font-size:1.15rem;letter-spacing:.01em;
  padding:8px 16px;border-radius:999px;line-height:1;
}.dg-redesign.dg-t-post .score-cap{font-size:.75rem;color:var(--faint);font-weight:600}.dg-redesign.dg-t-post .winner-badge{
  position:absolute;top:-15px;left:26px;
  display:inline-flex;align-items:center;gap:7px;
  background:var(--amber);color:var(--on-amber);
  font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  padding:8px 16px;border-radius:999px;
  box-shadow:0 8px 22px rgba(245,158,11,.35);
}.dg-redesign.dg-t-post .verdict{
  margin:38px 0 0;padding:26px 26px 26px 30px;color:var(--text);font-size:1rem;
  background:var(--card);border:1px solid var(--line-soft);
  border-left:3px solid var(--amber);border-radius:0 var(--radius) var(--radius) 0;
  box-shadow:var(--card-shadow);
}.dg-redesign.dg-t-post .method{
  margin:56px 0 0;padding:28px;
  background:var(--card2);border:1px dashed var(--line-soft);border-radius:var(--radius);
}.dg-redesign.dg-t-post .method p{color:var(--muted);font-size:.98rem;max-width:64ch}.dg-redesign.dg-t-post svg{max-width:100%}.dg-redesign.dg-t-post .prose{max-width:736px;margin:0 auto}.dg-redesign.dg-t-post .crumbs{padding:26px 0 0;font-size:.88rem;color:var(--muted)}.dg-redesign.dg-t-post .crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.dg-redesign.dg-t-post .crumbs a{text-decoration:none;color:var(--muted)}.dg-redesign.dg-t-post .crumbs a:hover{color:var(--text);text-decoration:underline}.dg-redesign.dg-t-post .crumbs li:not(:last-child)::after{content:"/";margin-left:8px;opacity:.55}.dg-redesign.dg-t-post .crumbs [aria-current="page"]{color:var(--text)}.dg-redesign.dg-t-post .prose>.kicker{margin:30px 0 14px}.dg-redesign.dg-t-post .standfirst{
  margin-top:18px;font-size:1.18rem;line-height:1.65;color:var(--muted);max-width:56ch;
}.dg-redesign.dg-t-post .byline{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  margin:26px 0 0;padding:18px 0;
  border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);
}.dg-redesign.dg-t-post .avatar{
  width:48px;height:48px;border-radius:50%;flex:0 0 auto;
  background:var(--card2);border:1px solid var(--line-soft);
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:.95rem;color:var(--text);
}.dg-redesign.dg-t-post .byline .who{display:flex;flex-direction:column;line-height:1.45;flex:1;min-width:220px}.dg-redesign.dg-t-post .byline .who strong{font-size:.98rem}.dg-redesign.dg-t-post .byline .who span{font-size:.87rem;color:var(--muted)}.dg-redesign.dg-t-post .hero svg{position:absolute;inset:0;width:100%;height:100%}.dg-redesign.dg-t-post .hero figcaption{
  position:absolute;left:16px;bottom:12px;
  font-size:.8rem;color:#F5F1E8;
  background:rgba(10,10,12,.62);padding:5px 10px;border-radius:8px;
}.dg-redesign.dg-t-post .fan-blades{transform-origin:center;transform-box:fill-box;animation:spin 7s linear infinite}.dg-redesign.dg-t-post .hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.dg-redesign.dg-t-post .prod-media{margin:0 0 22px;border-radius:12px;overflow:hidden;background:var(--card2)}.dg-redesign.dg-t-post .prod-media img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}.dg-redesign.dg-t-post .rel-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.dg-redesign.dg-t-post .verdict .v-kicker{
  color:var(--amber);font-size:.78rem;font-weight:800;
  letter-spacing:.16em;text-transform:uppercase;margin-bottom:8px;
}.dg-redesign.dg-t-post .verdict h2{font-family:var(--h-font);font-size:1.55rem;font-weight:700;letter-spacing:-.01em;margin-bottom:8px}.dg-redesign.dg-t-post .verdict p{color:var(--muted);margin-bottom:18px;max-width:52ch}.dg-redesign.dg-t-post .btn svg{width:18px;height:18px;flex:0 0 auto}.dg-redesign.dg-t-post .cta-row{margin-top:6px}.dg-redesign.dg-t-post .cta-note{display:block;margin-top:10px;font-size:.82rem;color:var(--muted)}.dg-redesign.dg-t-post .takeaways{
  margin:38px 0 0;padding:26px;
  background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);
}.dg-redesign.dg-t-post .takeaways h2{font-size:1.05rem;font-weight:700;margin-bottom:14px;letter-spacing:-.01em}.dg-redesign.dg-t-post .takeaways ul{list-style:none;display:grid;gap:12px}.dg-redesign.dg-t-post .takeaways li{
  position:relative;padding-left:30px;font-size:.99rem;color:var(--muted);line-height:1.6;
}.dg-redesign.dg-t-post .takeaways li::before{
  content:"";position:absolute;left:2px;top:9px;
  width:14px;height:8px;
  border-left:3px solid var(--amber);border-bottom:3px solid var(--amber);
  transform:rotate(-45deg) translateY(-2px);
}.dg-redesign.dg-t-post .takeaways li strong{color:var(--text);font-weight:600}.dg-redesign.dg-t-post .sec-head{margin:64px 0 6px}.dg-redesign.dg-t-post .sec-head .kicker{margin:0 0 10px}.dg-redesign.dg-t-post h2.sec-title{
  font-family:var(--h-font);font-weight:700;letter-spacing:-.01em;
  font-size:clamp(1.8rem,1.2rem + 2.6vw,2.7rem);line-height:1.15;
}.dg-redesign.dg-t-post .sec-sub{color:var(--muted);margin-top:8px;max-width:58ch}.dg-redesign.dg-t-post .product{
  margin:34px 0 0;padding:28px 26px 26px;
  background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);
  box-shadow:var(--card-shadow);position:relative;
}.dg-redesign.dg-t-post .product.pick{border-color:rgba(245,158,11,.5)}.dg-redesign.dg-t-post .product h3{
  font-family:var(--h-font);font-size:1.65rem;font-weight:700;letter-spacing:-.01em;line-height:1.25;
}.dg-redesign.dg-t-post .score-row{display:flex;align-items:center;gap:14px;margin:16px 0 4px;flex-wrap:wrap}.dg-redesign.dg-t-post .score-chip small{font-size:.78em;font-weight:700;opacity:.75;margin-left:2px}.dg-redesign.dg-t-post .product .summary{margin:14px 0 0;color:var(--muted);max-width:60ch}.dg-redesign.dg-t-post .pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0 0}.dg-redesign.dg-t-post .pros-cons h4{font-size:.82rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:10px}.dg-redesign.dg-t-post .pros-cons ul{list-style:none;display:grid;gap:9px;font-size:.95rem;line-height:1.55}.dg-redesign.dg-t-post .pros-cons li{position:relative;padding-left:26px;color:var(--muted)}.dg-redesign.dg-t-post .pros-cons li strong{color:var(--text);font-weight:600}.dg-redesign.dg-t-post .pros h4{color:var(--text)}.dg-redesign.dg-t-post .pros li::before{content:"+";position:absolute;left:4px;top:0;font-weight:700;color:var(--text)}.dg-redesign.dg-t-post .cons li::before{content:"–";position:absolute;left:6px;top:0;font-weight:700;color:var(--muted)}.dg-redesign.dg-t-post .spec-rows{margin:22px 0 0;border-top:1px solid var(--line-soft)}.dg-redesign.dg-t-post .spec-row{
  display:flex;justify-content:space-between;align-items:baseline;gap:16px;
  padding:12px 2px;border-bottom:1px solid var(--line-soft);font-size:.95rem;
}.dg-redesign.dg-t-post .spec-row dt{color:var(--muted)}.dg-redesign.dg-t-post .spec-row dd{font-weight:600;text-align:right}.dg-redesign.dg-t-post .product .cta-row{margin-top:24px}.dg-redesign.dg-t-post .table-scroll{margin:26px 0 0;overflow-x:auto;border:1px solid var(--line-soft);border-radius:var(--radius);background:var(--card)}.dg-redesign.dg-t-post table.compare{width:100%;min-width:640px;border-collapse:collapse;font-size:.93rem}.dg-redesign.dg-t-post .compare caption{text-align:left;padding:18px 20px 6px;font-weight:700;font-size:1.02rem}.dg-redesign.dg-t-post .compare th{padding:13px 16px;text-align:left;border-top:1px solid var(--line-soft);vertical-align:top}.dg-redesign.dg-t-post .compare td{padding:13px 16px;text-align:left;border-top:1px solid var(--line-soft);vertical-align:top}.dg-redesign.dg-t-post .compare thead th{border-top:none;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700}.dg-redesign.dg-t-post .compare tbody th{font-weight:600;white-space:nowrap}.dg-redesign.dg-t-post .compare .t-score{color:var(--amber);font-weight:700;font-size:1.02rem;white-space:nowrap}.dg-redesign.dg-t-post .compare tr.winner-row td{background:var(--hero-glow)}.dg-redesign.dg-t-post .compare tr.winner-row th{background:var(--hero-glow)}.dg-redesign.dg-t-post .faq{margin:26px 0 0;display:grid;gap:14px}.dg-redesign.dg-t-post .faq details{
  background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);
  overflow:hidden;transition:border-color .15s;
}.dg-redesign.dg-t-post .faq details[open]{border-color:var(--amber)}.dg-redesign.dg-t-post .faq summary{
  list-style:none;cursor:pointer;min-height:48px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:18px 22px;font-weight:600;font-size:1.02rem;
}.dg-redesign.dg-t-post .faq summary::-webkit-details-marker{display:none}.dg-redesign.dg-t-post .faq summary .q-icon{
  flex:0 0 auto;width:32px;height:32px;border-radius:50%;
  border:1px solid var(--line-soft);display:flex;align-items:center;justify-content:center;
  font-size:1.1rem;font-weight:400;color:var(--muted);transition:transform .2s;
}.dg-redesign.dg-t-post .faq details[open] .q-icon{transform:rotate(45deg);color:var(--amber);border-color:var(--amber)}.dg-redesign.dg-t-post .faq .a{padding:0 22px 22px;color:var(--muted);font-size:.99rem;max-width:64ch}.dg-redesign.dg-t-post .method h2{font-size:1.15rem;font-weight:700;margin-bottom:12px}.dg-redesign.dg-t-post .method p+p{margin-top:12px}.dg-redesign.dg-t-post .method .honest{color:var(--text);font-weight:600}.dg-redesign.dg-t-post .related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:26px 0 0}.dg-redesign.dg-t-post .rel-card{
  display:flex;flex-direction:column;text-decoration:none;
  background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);
  overflow:hidden;transition:transform .15s ease,border-color .15s;
}.dg-redesign.dg-t-post .rel-card:hover{transform:translateY(-3px);border-color:var(--amber)}.dg-redesign.dg-t-post .rel-visual{aspect-ratio:16/9;position:relative;overflow:hidden;
  background:linear-gradient(150deg,var(--card2),var(--card));}.dg-redesign.dg-t-post .rel-visual svg{position:absolute;inset:0;width:100%;height:100%}.dg-redesign.dg-t-post .rel-body{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}.dg-redesign.dg-t-post .rel-body .kicker{margin:0}.dg-redesign.dg-t-post .rel-body .rel-title{display:block;font-family:var(--h-font);font-size:1.18rem;font-weight:700;line-height:1.35;letter-spacing:-.01em}.dg-redesign.dg-t-post .rel-body .rel-desc{display:block;font-size:.9rem;color:var(--muted);line-height:1.6}.dg-redesign.dg-t-post .rel-more{margin-top:auto;padding-top:10px;font-size:.88rem;font-weight:600}.dg-redesign.dg-t-post .rel-card:hover .rel-more{text-decoration:underline}@media (max-width:560px){.dg-redesign.dg-t-post .pros-cons{grid-template-columns:1fr}}@media (max-width:560px){.dg-redesign.dg-t-post .product{padding:24px 20px}}@media (max-width:560px){.dg-redesign.dg-t-post .verdict{padding:22px 20px 22px 24px}}@media (max-width:560px){.dg-redesign.dg-t-post .spec-row{font-size:.9rem}}@media (max-width:900px){.dg-redesign.dg-t-post .related-grid{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.dg-redesign.dg-t-post .fan-blades{animation:none}}@media (prefers-reduced-motion:reduce){.dg-redesign.dg-t-post *{transition:none!important}}@media (prefers-reduced-motion:reduce){.dg-redesign.dg-t-post *::before{transition:none!important}}@media (prefers-reduced-motion:reduce){.dg-redesign.dg-t-post *::after{transition:none!important}}
/* ===== dg-t-browse (namespaced; no cross-template collisions) ===== */.dg-redesign.dg-t-browse *::before{box-sizing:border-box;margin:0;padding:0}.dg-redesign.dg-t-browse *::after{box-sizing:border-box;margin:0;padding:0}.dg-redesign.dg-t-browse h1{font-family:var(--h-font);font-weight:700;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}.dg-redesign.dg-t-browse .wrap{max-width:var(--content-w);margin:0 auto;padding:0 var(--gutter)}.dg-redesign.dg-t-browse .section{padding:76px 0}.dg-redesign.dg-t-browse .kicker{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-bottom:14px}.dg-redesign.dg-t-browse .section-head{max-width:640px;margin-bottom:44px}.dg-redesign.dg-t-browse .section-head h2{font-size:clamp(1.8rem,1.2rem+2.6vw,2.7rem);margin-bottom:12px}.dg-redesign.dg-t-browse .section-head p{color:var(--muted);font-size:1.05rem}.dg-redesign.dg-t-browse .btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}.dg-redesign.dg-t-browse .btn-ghost:hover{border-color:var(--amber);color:var(--amber)}.dg-redesign.dg-t-browse .center-cta{display:flex;justify-content:center;margin-top:30px}.dg-redesign.dg-t-browse .hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line-soft)}.dg-redesign.dg-t-browse .hero-art{position:absolute;inset:0;pointer-events:none}.dg-redesign.dg-t-browse .hero-art .sky{position:absolute;inset:0;background:linear-gradient(180deg,#050508 0%,#0B0B12 46%,#141019 72%,#0C0C0E 100%)}html[data-theme="light"] .dg-redesign.dg-t-browse .hero-art .sky{background:linear-gradient(180deg,#EFE6D3 0%,#F5EDDD 46%,#EDE2CC 72%,#FAF7F0 100%)}.dg-redesign.dg-t-browse .hero-art .stars{position:absolute;top:0;left:0;right:0;height:28%;opacity:.9;overflow:hidden}html[data-theme="light"] .dg-redesign.dg-t-browse .hero-art .stars{opacity:0}.dg-redesign.dg-t-browse .hero-art .horizon{position:absolute;left:50%;top:58%;width:130%;height:44%;transform:translateX(-50%);background:radial-gradient(ellipse 50% 42% at 50% 100%,rgba(245,158,11,.34),rgba(245,158,11,.08) 55%,transparent 75%)}.dg-redesign.dg-t-browse .hero-art .hills{position:absolute;left:-10%;right:-10%;top:62%;height:26%;background:radial-gradient(ellipse 60% 90% at 20% 100%,#131318 60%,transparent 61%),radial-gradient(ellipse 55% 85% at 78% 100%,#101015 60%,transparent 62%)}html[data-theme="light"] .dg-redesign.dg-t-browse .hero-art .hills{background:radial-gradient(ellipse 60% 90% at 20% 100%,#D9CDAF 60%,transparent 61%),radial-gradient(ellipse 55% 85% at 78% 100%,#D2C5A6 60%,transparent 62%)}.dg-redesign.dg-t-browse .hero-art .road{position:absolute;left:50%;bottom:-4%;width:150%;height:34%;transform:translateX(-50%);background:linear-gradient(180deg,#17171D,#0B0B0E);clip-path:polygon(44% 0,56% 0,100% 100%,0 100%)}html[data-theme="light"] .dg-redesign.dg-t-browse .hero-art .road{background:linear-gradient(180deg,#D8CCB2,#C9BB9C)}.dg-redesign.dg-t-browse .hero-art .road-line{position:absolute;left:50%;bottom:-4%;width:150%;height:34%;transform:translateX(-50%);clip-path:polygon(49.5% 0,50.5% 0,51.8% 100%,48.2% 100%);background:repeating-linear-gradient(180deg,var(--amber) 0 20px,transparent 20px 46px);opacity:.55}.dg-redesign.dg-t-browse .hero-art .dash-glow{position:absolute;left:0;right:0;bottom:0;height:26%;background:linear-gradient(180deg,transparent,rgba(245,158,11,.07))}.dg-redesign.dg-t-browse .hero-veil{position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,var(--bg) 97%)}.dg-redesign.dg-t-browse .hero-inner{position:relative;padding:96px 0 110px;max-width:720px}.dg-redesign.dg-t-browse .hero h1{font-size:clamp(2.5rem,1.6rem+4.6vw,4.3rem);margin:0 0 20px;text-shadow:0 3px 30px rgba(0,0,0,.55)}html[data-theme="light"] .dg-redesign.dg-t-browse .hero h1{text-shadow:0 2px 18px rgba(255,255,255,.6)}.dg-redesign.dg-t-browse .hero .lede{font-size:clamp(1.08rem,1rem+1vw,1.3rem);color:var(--muted);max-width:34em;margin-bottom:36px}html:not([data-theme="light"]) .dg-redesign.dg-t-browse .hero .lede{color:#D8D2C2}.dg-redesign.dg-t-browse .hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:30px}.dg-redesign.dg-t-browse .hero-proof{display:flex;flex-wrap:wrap;gap:10px 26px;color:var(--muted);font-size:.92rem;font-weight:600}html:not([data-theme="light"]) .dg-redesign.dg-t-browse .hero-proof{color:#C9C2B1}.dg-redesign.dg-t-browse .hero-proof span{display:inline-flex;align-items:center;gap:8px}.dg-redesign.dg-t-browse .hero-proof svg{width:17px;height:17px;color:var(--amber);flex:0 0 auto}.dg-redesign.dg-t-browse .pick-grid{display:grid;gap:22px}.dg-redesign.dg-t-browse .pick{position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:28px 26px 26px;box-shadow:var(--card-shadow);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.dg-redesign.dg-t-browse .pick:hover{transform:translateY(-4px);border-color:var(--line)}.dg-redesign.dg-t-browse .pick-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}.dg-redesign.dg-t-browse .pick-rank{font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}.dg-redesign.dg-t-browse .score-chip{display:inline-flex;flex-direction:column;align-items:flex-end;gap:2px}.dg-redesign.dg-t-browse .score{display:inline-flex;align-items:baseline;background:var(--amber);color:var(--on-amber);font-weight:800;font-size:1.12rem;padding:7px 14px;border-radius:999px;letter-spacing:.01em;white-space:nowrap}.dg-redesign.dg-t-browse .score small{font-size:.78em;font-weight:700;opacity:.75;margin-left:2px}.dg-redesign.dg-t-browse .score-cap{font-size:.72rem;color:var(--faint);font-weight:600}.dg-redesign.dg-t-browse .winner-badge{position:absolute;top:-15px;left:26px;display:inline-flex;align-items:center;gap:7px;background:var(--amber);color:var(--on-amber);font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:8px 16px;border-radius:999px;box-shadow:0 8px 22px rgba(245,158,11,.35)}.dg-redesign.dg-t-browse .pick.is-winner{border-color:rgba(245,158,11,.5)}.dg-redesign.dg-t-browse .pick h3{font-size:1.42rem;margin-bottom:6px}.dg-redesign.dg-t-browse .pick-cat{font-size:.85rem;font-weight:700;color:var(--faint);letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}.dg-redesign.dg-t-browse .verdict{border-left:3px solid var(--amber);padding:4px 0 4px 16px;margin:0 0 22px;color:var(--muted);font-size:.99rem}.dg-redesign.dg-t-browse .pick .btn{margin-top:auto;width:100%}.dg-redesign.dg-t-browse .pick-note{margin-top:34px;text-align:center;color:var(--faint);font-size:.9rem}.dg-redesign.dg-t-browse .hub-grid{display:grid;gap:18px}.dg-redesign.dg-t-browse .hub{display:block;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:28px 24px;text-decoration:none;transition:transform .2s ease,border-color .2s ease}.dg-redesign.dg-t-browse .hub:hover{transform:translateY(-4px);border-color:var(--amber)}.dg-redesign.dg-t-browse .hub-icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:var(--card2);border:1px solid var(--line);margin-bottom:18px}.dg-redesign.dg-t-browse .hub-icon svg{width:26px;height:26px;color:var(--amber)}.dg-redesign.dg-t-browse .hub h3{font-size:1.25rem;margin-bottom:8px}.dg-redesign.dg-t-browse .hub p{color:var(--muted);font-size:.95rem}.dg-redesign.dg-t-browse .hub .go{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-weight:700;font-size:.92rem;color:var(--amber)}.dg-redesign.dg-t-browse .method{border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background:var(--bg2)}.dg-redesign.dg-t-browse .method-inner{display:flex;flex-direction:column;gap:14px;max-width:760px}.dg-redesign.dg-t-browse .method-badge{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:var(--amber);color:var(--on-amber)}.dg-redesign.dg-t-browse .method-badge svg{width:30px;height:30px}.dg-redesign.dg-t-browse .method p{font-size:1.06rem}.dg-redesign.dg-t-browse .method .byline{color:var(--faint);font-size:.9rem;margin-top:8px}.dg-redesign.dg-t-browse .art-grid{display:grid;gap:22px}.dg-redesign.dg-t-browse .art{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);overflow:hidden;text-decoration:none;transition:transform .2s ease,border-color .2s ease}.dg-redesign.dg-t-browse .art:hover{transform:translateY(-4px);border-color:var(--line)}.dg-redesign.dg-t-browse .art-thumb{aspect-ratio:16/9;background:linear-gradient(135deg,#1B1B22,#101014);position:relative;overflow:hidden}html[data-theme="light"] .dg-redesign.dg-t-browse .art-thumb{background:linear-gradient(135deg,#E7DCC3,#D9CCAC)}.dg-redesign.dg-t-browse .art-thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 110%,rgba(245,158,11,.28),transparent 70%)}.dg-redesign.dg-t-browse .art-body{padding:24px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}.dg-redesign.dg-t-browse .art h3{font-size:1.28rem}.dg-redesign.dg-t-browse .art-meta{display:flex;align-items:center;gap:12px;color:var(--faint);font-size:.85rem;font-weight:600;margin-top:auto;padding-top:8px}.dg-redesign.dg-t-browse .news-band{background:var(--bg2);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}.dg-redesign.dg-t-browse .news-card{max-width:680px;margin:0 auto;text-align:center}.dg-redesign.dg-t-browse .news-card h2{font-size:clamp(1.7rem,1.3rem+2vw,2.4rem);margin-bottom:12px}.dg-redesign.dg-t-browse .news-card>p{color:var(--muted);margin-bottom:30px}.dg-redesign.dg-t-browse .news-form{display:grid;gap:12px;text-align:left}.dg-redesign.dg-t-browse .field label{display:block;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}.dg-redesign.dg-t-browse .field input{width:100%;min-height:52px;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);font-family:var(--body-font);font-size:1rem}.dg-redesign.dg-t-browse .field input::placeholder{color:var(--faint)}.dg-redesign.dg-t-browse .field input:focus{border-color:var(--amber);outline:none}.dg-redesign.dg-t-browse .news-fine{margin-top:16px;color:var(--faint);font-size:.84rem}.dg-redesign.dg-t-browse .news-done{display:none;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px;font-weight:600}.dg-redesign.dg-t-browse .news-done.show{display:block}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-browse *{transition:none!important}}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-browse *::before{transition:none!important}}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-browse *::after{transition:none!important}}@media(min-width:640px){.dg-redesign.dg-t-browse .news-form{grid-template-columns:1fr 1fr auto;align-items:end}}@media(min-width:1024px){.dg-redesign.dg-t-browse .art-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:760px){.dg-redesign.dg-t-browse .art-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:900px){.dg-redesign.dg-t-browse .method-inner{flex-direction:row;align-items:center;gap:28px}}@media(min-width:1024px){.dg-redesign.dg-t-browse .hub-grid{grid-template-columns:repeat(4,1fr)}}@media(min-width:700px){.dg-redesign.dg-t-browse .hub-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.dg-redesign.dg-t-browse .pick-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:760px){.dg-redesign.dg-t-browse .pick-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.dg-redesign.dg-t-browse .hero-inner{padding:140px 0 160px}}@media(min-width:1024px){.dg-redesign.dg-t-browse .section{padding:116px 0}}.dg-redesign.dg-t-browse .sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:20px;border-bottom:1px solid var(--line-soft);padding-bottom:12px}.dg-redesign.dg-t-browse .hero-compact .hero-inner{padding:56px 0 48px}.dg-redesign.dg-t-browse .hero-compact .road{display:none}.dg-redesign.dg-t-browse .hero-compact .road-line{display:none}.dg-redesign.dg-t-browse .filter-bar{position:sticky;top:72px;z-index:50;background:var(--header-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line-soft);padding:10px 0}.dg-redesign.dg-t-browse .filter-inner{display:grid;gap:10px}.dg-redesign.dg-t-browse .search-wrap{position:relative}.dg-redesign.dg-t-browse .search-wrap svg{position:absolute;left:16px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--faint);pointer-events:none}.dg-redesign.dg-t-browse #archiveSearch{width:100%;min-height:44px;padding:10px 16px 10px 48px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);font-family:var(--body-font);font-size:1rem}.dg-redesign.dg-t-browse #archiveSearch::placeholder{color:var(--faint)}.dg-redesign.dg-t-browse #archiveSearch:focus{border-color:var(--amber);outline:none}.dg-redesign.dg-t-browse .chips{display:flex;flex-wrap:nowrap;gap:10px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}.dg-redesign.dg-t-browse .chips::-webkit-scrollbar{display:none}.dg-redesign.dg-t-browse .chip{flex:0 0 auto;min-height:40px;padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--card);color:var(--muted);font-family:var(--body-font);font-weight:700;font-size:.85rem;cursor:pointer;transition:border-color .15s,color .15s,background .15s}.dg-redesign.dg-t-browse .chip:hover{border-color:var(--amber);color:var(--text)}.dg-redesign.dg-t-browse .chip[aria-pressed="true"]{background:var(--amber);border-color:var(--amber);color:var(--on-amber)}.dg-redesign.dg-t-browse .archive-sec{scroll-margin-top:150px;padding:56px 0 0}.dg-redesign.dg-t-browse .archive-sec:last-of-type{padding-bottom:8px}.dg-redesign.dg-t-browse .sec-head h2{font-size:clamp(1.5rem,1.2rem+1.6vw,2rem)}.dg-redesign.dg-t-browse .sec-count{color:var(--faint);font-size:.88rem;font-weight:700;white-space:nowrap}.dg-redesign.dg-t-browse .arow{display:block;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:20px 22px;margin-bottom:12px;text-decoration:none;transition:border-color .18s ease,transform .18s ease}.dg-redesign.dg-t-browse .arow:hover{border-color:var(--amber);transform:translateY(-2px)}.dg-redesign.dg-t-browse .arow h3{font-size:1.18rem;margin-bottom:6px}.dg-redesign.dg-t-browse .arow p{color:var(--muted);font-size:.95rem;margin-bottom:10px}.dg-redesign.dg-t-browse .arow .tag{display:inline-block;font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--amber)}.dg-redesign.dg-t-browse .arow.has-thumb{display:flex;gap:16px;align-items:flex-start}.dg-redesign.dg-t-browse .arow-thumb{flex:0 0 88px;width:88px;height:88px;border-radius:10px;overflow:hidden;background:var(--card2)}.dg-redesign.dg-t-browse .arow-thumb img{display:block;width:100%;height:100%;object-fit:cover}.dg-redesign.dg-t-browse .arow-text{flex:1;min-width:0}.dg-redesign.dg-t-browse .no-results{display:none;text-align:center;padding:48px 0;color:var(--muted);font-weight:600}.dg-redesign.dg-t-browse .no-results.show{display:block}.dg-redesign.dg-t-browse .about-row{border-top:1px solid var(--line-soft);margin-top:56px;padding:40px 0 76px}.dg-redesign.dg-t-browse .about-links{display:flex;flex-wrap:wrap;gap:10px 26px}.dg-redesign.dg-t-browse .about-links a{display:inline-flex;align-items:center;min-height:48px;font-weight:700;color:var(--muted);text-decoration:none}.dg-redesign.dg-t-browse .about-links a:hover{color:var(--amber)}.dg-redesign.dg-t-browse .arow-wrap{margin-bottom:12px}.dg-redesign.dg-t-browse .arow-wrap .arow{margin-bottom:0}.dg-redesign.dg-t-browse .arow .arow-title{display:block;font-family:var(--h-font);font-weight:700;line-height:1.15;letter-spacing:-.01em;font-size:1.18rem;margin-bottom:6px}.dg-redesign.dg-t-browse .arow .arow-desc{display:block;color:var(--muted);font-size:.95rem;margin-bottom:10px}@media(min-width:1024px){.dg-redesign.dg-t-browse .hero-compact .hero-inner{padding:96px 0 72px}}
/* ===== dg-t-tool (namespaced; no cross-template collisions) ===== */.dg-redesign.dg-t-tool *::before{box-sizing:border-box;margin:0;padding:0}.dg-redesign.dg-t-tool *::after{box-sizing:border-box;margin:0;padding:0}.dg-redesign.dg-t-tool h1{font-family:var(--h-font);font-weight:700;line-height:1.15;letter-spacing:-.01em;text-wrap:balance}.dg-redesign.dg-t-tool .wrap{max-width:var(--content-w);margin:0 auto;padding:0 var(--gutter)}.dg-redesign.dg-t-tool .section{padding:76px 0}.dg-redesign.dg-t-tool .kicker{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin-bottom:14px}.dg-redesign.dg-t-tool .section-head{max-width:640px;margin-bottom:44px}.dg-redesign.dg-t-tool .section-head h2{font-size:clamp(1.8rem,1.2rem+2.6vw,2.7rem);margin-bottom:12px}.dg-redesign.dg-t-tool .section-head p{color:var(--muted);font-size:1.05rem}.dg-redesign.dg-t-tool .btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}.dg-redesign.dg-t-tool .btn-ghost:hover{border-color:var(--amber);color:var(--amber)}.dg-redesign.dg-t-tool .center-cta{display:flex;justify-content:center;margin-top:30px}.dg-redesign.dg-t-tool .hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line-soft)}.dg-redesign.dg-t-tool .hero-art{position:absolute;inset:0;pointer-events:none}.dg-redesign.dg-t-tool .hero-art .sky{position:absolute;inset:0;background:linear-gradient(180deg,#050508 0%,#0B0B12 46%,#141019 72%,#0C0C0E 100%)}html[data-theme="light"] .dg-redesign.dg-t-tool .hero-art .sky{background:linear-gradient(180deg,#EFE6D3 0%,#F5EDDD 46%,#EDE2CC 72%,#FAF7F0 100%)}.dg-redesign.dg-t-tool .hero-art .stars{position:absolute;top:0;left:0;right:0;height:28%;opacity:.9;overflow:hidden}html[data-theme="light"] .dg-redesign.dg-t-tool .hero-art .stars{opacity:0}.dg-redesign.dg-t-tool .hero-art .horizon{position:absolute;left:50%;top:58%;width:130%;height:44%;transform:translateX(-50%);background:radial-gradient(ellipse 50% 42% at 50% 100%,rgba(245,158,11,.34),rgba(245,158,11,.08) 55%,transparent 75%)}.dg-redesign.dg-t-tool .hero-art .hills{position:absolute;left:-10%;right:-10%;top:62%;height:26%;background:radial-gradient(ellipse 60% 90% at 20% 100%,#131318 60%,transparent 61%),radial-gradient(ellipse 55% 85% at 78% 100%,#101015 60%,transparent 62%)}html[data-theme="light"] .dg-redesign.dg-t-tool .hero-art .hills{background:radial-gradient(ellipse 60% 90% at 20% 100%,#D9CDAF 60%,transparent 61%),radial-gradient(ellipse 55% 85% at 78% 100%,#D2C5A6 60%,transparent 62%)}.dg-redesign.dg-t-tool .hero-art .road{position:absolute;left:50%;bottom:-4%;width:150%;height:34%;transform:translateX(-50%);background:linear-gradient(180deg,#17171D,#0B0B0E);clip-path:polygon(44% 0,56% 0,100% 100%,0 100%)}html[data-theme="light"] .dg-redesign.dg-t-tool .hero-art .road{background:linear-gradient(180deg,#D8CCB2,#C9BB9C)}.dg-redesign.dg-t-tool .hero-art .road-line{position:absolute;left:50%;bottom:-4%;width:150%;height:34%;transform:translateX(-50%);clip-path:polygon(49.5% 0,50.5% 0,51.8% 100%,48.2% 100%);background:repeating-linear-gradient(180deg,var(--amber) 0 20px,transparent 20px 46px);opacity:.55}.dg-redesign.dg-t-tool .hero-art .dash-glow{position:absolute;left:0;right:0;bottom:0;height:26%;background:linear-gradient(180deg,transparent,rgba(245,158,11,.07))}.dg-redesign.dg-t-tool .hero-veil{position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,var(--bg) 97%)}.dg-redesign.dg-t-tool .hero-inner{position:relative;padding:96px 0 110px;max-width:720px}.dg-redesign.dg-t-tool .hero h1{font-size:clamp(2.5rem,1.6rem+4.6vw,4.3rem);margin:0 0 20px;text-shadow:0 3px 30px rgba(0,0,0,.55)}html[data-theme="light"] .dg-redesign.dg-t-tool .hero h1{text-shadow:0 2px 18px rgba(255,255,255,.6)}.dg-redesign.dg-t-tool .hero .lede{font-size:clamp(1.08rem,1rem+1vw,1.3rem);color:var(--muted);max-width:34em;margin-bottom:36px}html:not([data-theme="light"]) .dg-redesign.dg-t-tool .hero .lede{color:#D8D2C2}.dg-redesign.dg-t-tool .hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:30px}.dg-redesign.dg-t-tool .hero-proof{display:flex;flex-wrap:wrap;gap:10px 26px;color:var(--muted);font-size:.92rem;font-weight:600}html:not([data-theme="light"]) .dg-redesign.dg-t-tool .hero-proof{color:#C9C2B1}.dg-redesign.dg-t-tool .hero-proof span{display:inline-flex;align-items:center;gap:8px}.dg-redesign.dg-t-tool .hero-proof svg{width:17px;height:17px;color:var(--amber);flex:0 0 auto}.dg-redesign.dg-t-tool .hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.dg-redesign.dg-t-tool .hero-art.has-photo .stars{display:none}.dg-redesign.dg-t-tool .hero-art.has-photo .horizon{display:none}.dg-redesign.dg-t-tool .hero-art.has-photo .hills{display:none}.dg-redesign.dg-t-tool .hero-art.has-photo .road{display:none}.dg-redesign.dg-t-tool .hero-art.has-photo .road-line{display:none}.dg-redesign.dg-t-tool .hero-art.has-photo .dash-glow{display:none}.dg-redesign.dg-t-tool .hero-art.has-photo .sky{opacity:.5}html[data-theme="light"] .dg-redesign.dg-t-tool .hero-art.has-photo .sky{opacity:.55}.dg-redesign.dg-t-tool .hub-thumb{display:block;margin-bottom:18px;border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:var(--card2)}.dg-redesign.dg-t-tool .hub-thumb img{display:block;width:100%;height:100%;object-fit:cover}.dg-redesign.dg-t-tool .pick-grid{display:grid;gap:22px}.dg-redesign.dg-t-tool .pick{position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:28px 26px 26px;box-shadow:var(--card-shadow);transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.dg-redesign.dg-t-tool .pick:hover{transform:translateY(-4px);border-color:var(--line)}.dg-redesign.dg-t-tool .pick-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}.dg-redesign.dg-t-tool .pick-rank{font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}.dg-redesign.dg-t-tool .score-chip{display:inline-flex;flex-direction:column;align-items:flex-end;gap:2px}.dg-redesign.dg-t-tool .score{display:inline-flex;align-items:baseline;background:var(--amber);color:var(--on-amber);font-weight:800;font-size:1.12rem;padding:7px 14px;border-radius:999px;letter-spacing:.01em;white-space:nowrap}.dg-redesign.dg-t-tool .score small{font-size:.78em;font-weight:700;opacity:.75;margin-left:2px}.dg-redesign.dg-t-tool .score-cap{font-size:.72rem;color:var(--faint);font-weight:600}.dg-redesign.dg-t-tool .winner-badge{position:absolute;top:-15px;left:26px;display:inline-flex;align-items:center;gap:7px;background:var(--amber);color:var(--on-amber);font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;padding:8px 16px;border-radius:999px;box-shadow:0 8px 22px rgba(245,158,11,.35)}.dg-redesign.dg-t-tool .pick.is-winner{border-color:rgba(245,158,11,.5)}.dg-redesign.dg-t-tool .pick h3{font-size:1.42rem;margin-bottom:6px}.dg-redesign.dg-t-tool .pick-cat{font-size:.85rem;font-weight:700;color:var(--faint);letter-spacing:.06em;text-transform:uppercase;margin-bottom:14px}.dg-redesign.dg-t-tool .verdict{border-left:3px solid var(--amber);padding:4px 0 4px 16px;margin:0 0 22px;color:var(--muted);font-size:.99rem}.dg-redesign.dg-t-tool .pick .btn{margin-top:auto;width:100%}.dg-redesign.dg-t-tool .pick-note{margin-top:34px;text-align:center;color:var(--faint);font-size:.9rem}.dg-redesign.dg-t-tool .hub-grid{display:grid;gap:18px}.dg-redesign.dg-t-tool .hub{display:block;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:28px 24px;text-decoration:none;transition:transform .2s ease,border-color .2s ease}.dg-redesign.dg-t-tool .hub:hover{transform:translateY(-4px);border-color:var(--amber)}.dg-redesign.dg-t-tool .hub-icon{display:inline-flex;align-items:center;justify-content:center;width:52px;height:52px;border-radius:14px;background:var(--card2);border:1px solid var(--line);margin-bottom:18px}.dg-redesign.dg-t-tool .hub-icon svg{width:26px;height:26px;color:var(--amber)}.dg-redesign.dg-t-tool .hub h3{font-size:1.25rem;margin-bottom:8px}.dg-redesign.dg-t-tool .hub p{color:var(--muted);font-size:.95rem}.dg-redesign.dg-t-tool .hub .go{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-weight:700;font-size:.92rem;color:var(--amber)}.dg-redesign.dg-t-tool .method{border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background:var(--bg2)}.dg-redesign.dg-t-tool .method-inner{display:flex;flex-direction:column;gap:14px;max-width:760px}.dg-redesign.dg-t-tool .method-badge{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:64px;height:64px;border-radius:50%;background:var(--amber);color:var(--on-amber)}.dg-redesign.dg-t-tool .method-badge svg{width:30px;height:30px}.dg-redesign.dg-t-tool .method p{font-size:1.06rem}.dg-redesign.dg-t-tool .method .byline{color:var(--muted);font-size:.9rem;margin-top:8px}.dg-redesign.dg-t-tool .art-grid{display:grid;gap:22px}.dg-redesign.dg-t-tool .art{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);overflow:hidden;text-decoration:none;transition:transform .2s ease,border-color .2s ease}.dg-redesign.dg-t-tool .art:hover{transform:translateY(-4px);border-color:var(--line)}.dg-redesign.dg-t-tool .art-thumb{aspect-ratio:16/9;background:linear-gradient(135deg,#1B1B22,#101014);position:relative;overflow:hidden}html[data-theme="light"] .dg-redesign.dg-t-tool .art-thumb{background:linear-gradient(135deg,#E7DCC3,#D9CCAC)}.dg-redesign.dg-t-tool .art-thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 60% at 50% 110%,rgba(245,158,11,.28),transparent 70%)}.dg-redesign.dg-t-tool .art-body{padding:24px 24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}.dg-redesign.dg-t-tool .art h3{font-size:1.28rem}.dg-redesign.dg-t-tool .art-meta{display:flex;align-items:center;gap:12px;color:var(--faint);font-size:.85rem;font-weight:600;margin-top:auto;padding-top:8px}.dg-redesign.dg-t-tool .news-band{background:var(--bg2);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}.dg-redesign.dg-t-tool .news-card{max-width:680px;margin:0 auto;text-align:center}.dg-redesign.dg-t-tool .news-card h2{font-size:clamp(1.7rem,1.3rem+2vw,2.4rem);margin-bottom:12px}.dg-redesign.dg-t-tool .news-card>p{color:var(--muted);margin-bottom:30px}.dg-redesign.dg-t-tool .news-form{display:grid;gap:12px;text-align:left}.dg-redesign.dg-t-tool .field label{display:block;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}.dg-redesign.dg-t-tool .field input{width:100%;min-height:52px;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--text);font-family:var(--body-font);font-size:1rem}.dg-redesign.dg-t-tool .field input::placeholder{color:var(--faint)}.dg-redesign.dg-t-tool .field input:focus{border-color:var(--amber);outline:none}.dg-redesign.dg-t-tool .news-fine{margin-top:16px;color:var(--faint);font-size:.84rem}.dg-redesign.dg-t-tool .news-done{display:none;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:26px;font-weight:600}.dg-redesign.dg-t-tool .news-done.show{display:block}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-tool *{transition:none!important}}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-tool *::before{transition:none!important}}@media(prefers-reduced-motion:reduce){.dg-redesign.dg-t-tool *::after{transition:none!important}}@media(min-width:640px){.dg-redesign.dg-t-tool .news-form{grid-template-columns:1fr 1fr auto;align-items:end}}@media(min-width:1024px){.dg-redesign.dg-t-tool .art-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:760px){.dg-redesign.dg-t-tool .art-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:900px){.dg-redesign.dg-t-tool .method-inner{flex-direction:row;align-items:center;gap:28px}}@media(min-width:1024px){.dg-redesign.dg-t-tool .hub-grid{grid-template-columns:repeat(4,1fr)}}@media(min-width:700px){.dg-redesign.dg-t-tool .hub-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.dg-redesign.dg-t-tool .pick-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:760px){.dg-redesign.dg-t-tool .pick-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.dg-redesign.dg-t-tool .hero-inner{padding:140px 0 160px}}@media(min-width:1024px){.dg-redesign.dg-t-tool .section{padding:116px 0}}.dg-redesign.dg-t-tool .crumbs{padding:0;margin:0 0 22px;font-size:.88rem;color:var(--muted)}.dg-redesign.dg-t-tool .crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.dg-redesign.dg-t-tool .crumbs a{text-decoration:none;color:var(--muted)}.dg-redesign.dg-t-tool .crumbs a:hover{color:var(--text);text-decoration:underline}.dg-redesign.dg-t-tool .crumbs li:not(:last-child)::after{content:"/";margin-left:8px;opacity:.55}.dg-redesign.dg-t-tool .crumbs [aria-current="page"]{color:var(--text)}.dg-redesign.dg-t-tool .related-grid{display:grid;gap:18px}html[data-theme="light"] .dg-redesign.dg-t-tool .hero-art.has-photo .hero-veil{background:linear-gradient(180deg,rgba(250,247,240,.84) 0%,rgba(250,247,240,.62) 45%,rgba(250,247,240,.34) 72%,var(--bg) 97%)}.dg-redesign.dg-t-tool .tool-hero .hero-inner{padding:64px 0 72px}.dg-redesign.dg-t-tool .tool-hero .road-line{display:none}.dg-redesign.dg-t-tool .tool-card{background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:30px 26px;box-shadow:var(--card-shadow);max-width:760px}.dg-redesign.dg-t-tool .tool-grid{display:grid;gap:18px;margin-bottom:20px}.dg-redesign.dg-t-tool .tool-field label{display:block;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint);margin-bottom:8px}.dg-redesign.dg-t-tool .tool-field input{width:100%;min-height:52px;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--text);font-family:var(--body-font);font-size:1rem}.dg-redesign.dg-t-tool .tool-field select{width:100%;min-height:52px;padding:12px 16px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--text);font-family:var(--body-font);font-size:1rem}.dg-redesign.dg-t-tool .tool-field input:focus{border-color:var(--amber);outline:none}.dg-redesign.dg-t-tool .tool-field select:focus{border-color:var(--amber);outline:none}.dg-redesign.dg-t-tool .tool-note{color:var(--faint);font-size:.9rem;margin-bottom:26px}.dg-redesign.dg-t-tool .tool-note strong{color:var(--muted)}.dg-redesign.dg-t-tool .tool-card .btn{width:100%}.dg-redesign.dg-t-tool .result{margin-top:26px;border:1px solid var(--line);border-radius:14px;padding:24px;background:var(--bg)}.dg-redesign.dg-t-tool .result{display:none}.dg-redesign.dg-t-tool .result-num{font-family:var(--h-font);font-size:2.8rem;font-weight:700;color:var(--amber);line-height:1.1}.dg-redesign.dg-t-tool .result-num small{font-size:1.05rem;font-family:var(--body-font);font-weight:600;color:var(--muted)}.dg-redesign.dg-t-tool .result-verdict{color:var(--muted);margin-top:8px;font-size:1rem}.dg-redesign.dg-t-tool .math-card{background:var(--card);border:1px solid var(--line-soft);border-radius:var(--radius);padding:30px 26px;max-width:760px}.dg-redesign.dg-t-tool .math-card p{color:var(--muted);margin-bottom:14px}.dg-redesign.dg-t-tool .math-card p:last-child{margin-bottom:0}.dg-redesign.dg-t-tool .math-formula{font-family:var(--h-font);font-size:1.2rem;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:16px 20px;margin:18px 0;text-align:center}.dg-redesign.dg-t-tool .tool-field>p{margin:0}.dg-redesign.dg-t-tool .tool-legend{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 4px;font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--faint)}.dg-redesign.dg-t-tool .tool-val{font-weight:800;color:var(--amber);font-size:.95rem;white-space:nowrap;letter-spacing:0;text-transform:none}.dg-redesign.dg-t-tool .tool-field input[type="range"]{-webkit-appearance:none;appearance:none;display:block;width:100%;height:8px;min-height:0;padding:0;border:0;border-radius:999px;background:var(--line);margin:14px 0 6px;cursor:pointer}.dg-redesign.dg-t-tool .tool-field input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:28px;height:28px;border-radius:50%;background:var(--amber);border:3px solid var(--bg);box-shadow:0 2px 8px rgba(0,0,0,.35);cursor:pointer}.dg-redesign.dg-t-tool .tool-field input[type="range"]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--amber);border:3px solid var(--bg);box-shadow:0 2px 8px rgba(0,0,0,.35);cursor:pointer}.dg-redesign.dg-t-tool .tool-field input[type="range"]:focus{outline:none;border:0}.dg-redesign.dg-t-tool .tool-field input[type="range"]:focus-visible{outline:3px solid var(--amber);outline-offset:8px}.dg-redesign.dg-t-tool .tool-scale{display:flex;justify-content:space-between;color:var(--muted);font-size:.8rem;font-weight:600;margin:0 0 4px}.dg-redesign.dg-t-tool .tool-hint{color:var(--muted);font-size:.88rem;margin:10px 0 0}.dg-redesign.dg-t-tool .tool-choices{display:grid;gap:10px;margin:0}.dg-redesign.dg-t-tool .tool-field .tool-choice{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--bg);cursor:pointer;font-weight:700;font-size:.98rem;line-height:1.45;margin:0;min-height:0}.dg-redesign.dg-t-tool .tool-field .tool-choice input{accent-color:var(--amber);width:20px;height:20px;min-height:0;padding:0;border:0;background:none;margin:3px 0 0;flex:0 0 auto;cursor:pointer}.dg-redesign.dg-t-tool .tool-choice .tc-t{display:block}.dg-redesign.dg-t-tool .tool-choice small{display:block;font-weight:500;color:var(--muted);font-size:.86rem;margin-top:2px}.dg-redesign.dg-t-tool .tool-field .tool-choice:has(input:checked){border-color:var(--amber);background:var(--card2)}.dg-redesign.dg-t-tool .tool-btns{display:grid;gap:10px;margin:0}.dg-redesign.dg-t-tool .tool-btn{padding:14px 12px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--text);font-family:var(--body-font);font-weight:700;font-size:.94rem;line-height:1.45;cursor:pointer;transition:border-color .15s,background .15s;margin:0}.dg-redesign.dg-t-tool .tool-btn:hover{border-color:var(--amber)}.dg-redesign.dg-t-tool .tool-btn.on{border-color:var(--amber);background:rgba(245,158,11,.12)}.dg-redesign.dg-t-tool .tool-btn .tb-sub{display:block;font-weight:500;color:var(--muted);font-size:.85rem;margin-top:2px}.dg-redesign.dg-t-tool .tool-alert{display:none;border:1px solid rgba(245,158,11,.45);background:rgba(245,158,11,.08);border-radius:12px;padding:16px 18px;margin-top:14px;font-size:.95rem}.dg-redesign.dg-t-tool .tool-alert.show{display:block}.dg-redesign.dg-t-tool .tool-alert p{margin:0;color:var(--text)}.dg-redesign.dg-t-tool .tool-math{font-size:.98rem;color:var(--muted);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:14px 18px;margin:18px 0 0}.dg-redesign.dg-t-tool .tool-fine{color:var(--muted);font-size:.86rem;margin:16px 0 0}.dg-redesign.dg-t-tool .tool-points{list-style:none;margin:18px 0 0;padding:0;display:grid;gap:12px}.dg-redesign.dg-t-tool .tool-points li{border-left:3px solid var(--amber);padding:2px 0 2px 14px;color:var(--muted);font-size:.95rem}.dg-redesign.dg-t-tool .tool-points li strong{color:var(--text)}.dg-redesign.dg-t-tool .tool-rows{margin:16px 0 0;border-top:1px solid var(--line-soft)}.dg-redesign.dg-t-tool .tool-row{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:11px 0;border-bottom:1px solid var(--line-soft)}.dg-redesign.dg-t-tool .tool-row .k{color:var(--muted);font-weight:600;font-size:.95rem}.dg-redesign.dg-t-tool .tool-row .v{font-weight:800;font-size:1.05rem;text-align:right}.dg-redesign.dg-t-tool .result.show{display:block}.dg-redesign.dg-t-tool .result .kicker{margin-bottom:10px}.dg-redesign.dg-t-tool .hub-body{display:block}.dg-redesign.dg-t-tool .hub-title{display:block;font-family:var(--h-font);font-size:1.25rem;font-weight:700;line-height:1.2;margin-bottom:8px}.dg-redesign.dg-t-tool .hub-desc{display:block;color:var(--muted);font-size:.95rem}@media(min-width:640px){.dg-redesign.dg-t-tool .tool-choices{grid-template-columns:1fr 1fr}}@media(min-width:640px){.dg-redesign.dg-t-tool .tool-btns{grid-template-columns:1fr 1fr}}@media(min-width:640px){.dg-redesign.dg-t-tool .tool-btns.cols3{grid-template-columns:repeat(3,1fr)}}@media(min-width:700px){.dg-redesign.dg-t-tool .related-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:640px){.dg-redesign.dg-t-tool .math-card{padding:36px}}@media(min-width:640px){.dg-redesign.dg-t-tool .tool-card .btn{width:auto;min-width:280px}}@media(min-width:640px){.dg-redesign.dg-t-tool .tool-grid{grid-template-columns:1fr 1fr}}@media(min-width:640px){.dg-redesign.dg-t-tool .tool-card{padding:38px 36px}}@media(min-width:1024px){.dg-redesign.dg-t-tool .tool-hero .hero-inner{padding:88px 0 96px}}@keyframes spin{to{transform:rotate(360deg)}}
/* ===== HAND-MAINTAINED LAWS (visual/hand-laws.css) ===== */
/* ============ 15. Fluent Forms submit button — third-party override ============
   FLUENT BUTTON LAW (2026-09-24): Fluent Forms injects
   `form.fluent_form_N .ff-btn-submit:not(.ff_btn_no_style){color:#ffffff}` (0,3,1) from the
   footer, which beats the page rule — white-on-amber renders at ~2:1, unreadable, on the
   site's single conversion action. !important is required: the plugin style comes later in
   source order and wins any equal-specificity contest. Dark text matches the site CTA. */
.fluentform .ff-btn-submit{color:#140F05!important}

/* ============ 16. Scriptless Social Sharing — third-party overrides ============
   SHARE BUTTON LAW (2026-09-24, visual-sweep fix pass): the plugin renders
   `.scriptlesssocialsharing__buttons > a.button.<network>` with white labels on
   brand-color backgrounds, but the theme's
   `html:not([data-theme="dark"]) body.single .entry-content a` rule (0,3,3) beats
   the plugin's `.scriptlesssocialsharing a.button` (0,2,1), turning labels theme-
   orange on brand backgrounds (unreadable in light mode, e.g. Pinterest). The
   plugin's `border:1px solid` also inherits the orange link color, rendering as
   unstyled squares. This (0,4,3) wins in both themes regardless of source order.
   The email button wraps to a second row on desktop because the flex container
   allows wrap; a single 5-up row fits at all desktop widths.
   16b — STATIC BASE VENDORING (2026-09-25, static-migration parity fix): the
   static build captures the plugin's markup but NOT its stylesheet (the plugin
   CSS is enqueued separately on live WP, never inlined into the union CSS), so
   static share blocks rendered as plain amber text links — the sole genuine
   visual regression across the 38-page parity QA (10+ pages tripped the 2% gate
   on this alone). The v3.3.1 base rules below are vendored VERBATIM from the
   plugin's own file
   (wp-content/plugins/scriptless-social-sharing/includes/css/scriptlesssocialsharing-style.css?ver=3.3.1),
   captured 2026-09-25 — never hand-guessed, so static matches live exactly. On
   live WP these rules are a harmless duplicate of what the plugin already
   enqueues (same selectors, same values).
   16c — SCOPE FIX (2026-09-25): on migrated pages the share block sits AFTER
   the closing article tag, OUTSIDE .entry-content, so the .entry-content-scoped
   override above never matched there. The unscoped selector group below covers
   the block wherever it lives. (0,3,3) beats the plugin base (0,2,1) outright;
   inside .entry-content the older (0,4,3) group still wins the theme rule. */
.scriptlesssocialsharing{box-sizing:border-box;margin:18px auto}
.scriptlesssocialsharing a.button{border:none;border-radius:0;box-shadow:none;color:#fff;line-height:1;margin:0;text-align:center;text-decoration:none}
.scriptlesssocialsharing a.button:hover{color:#fff}
.scriptlesssocialsharing .screen-reader-text{position:absolute;clip:rect(1px,1px,1px,1px);height:1px;width:1px;border:0;overflow:hidden}
.scriptlesssocialsharing-buttons{border-collapse:separate;border-spacing:3px;display:table;table-layout:fixed}
.scriptlesssocialsharing-buttons .button{display:table-cell}
.scriptlesssocialsharing__buttons{display:flex;flex-wrap:wrap}
.scriptlesssocialsharing__buttons a.button{border:1px solid;display:flex;justify-content:center;align-items:center}
.scriptlesssocialsharing__icon{display:inline-block;fill:currentColor;font-size:18px;height:1em;width:1em}
.scriptlesssocialsharing__icon+.sss-name{margin-left:8px}
.scriptlesssocialsharing .button.email{background-color:rgba(51,51,51,.8)}
.scriptlesssocialsharing .button.email:hover{background-color:#333}
.scriptlesssocialsharing .button.twitter{background-color:rgba(20,23,26,.8)}
.scriptlesssocialsharing .button.twitter:hover{background-color:#14171a}
.scriptlesssocialsharing .button.facebook{background-color:rgba(59,89,152,.8)}
.scriptlesssocialsharing .button.facebook:hover{background-color:#3b5998}
.scriptlesssocialsharing .button.linkedin{background-color:rgba(0,119,181,.8)}
.scriptlesssocialsharing .button.linkedin:hover{background-color:#0077b5}
.scriptlesssocialsharing .button.pinterest{background-color:rgba(189,8,28,.8)}
.scriptlesssocialsharing .button.pinterest:hover{background-color:#bd081c}
.scriptlesssocialsharing .button.reddit{background-color:rgba(255,69,0,.8)}
.scriptlesssocialsharing .button.reddit:hover{background-color:#ff4500}
.scriptlesssocialsharing .button.whatsapp{background-color:rgba(37,211,102,.8)}
.scriptlesssocialsharing .button.whatsapp:hover{background-color:#25d366}
.scriptlesssocialsharing .button.pocket{background-color:rgba(239,64,86,.8)}
.scriptlesssocialsharing .button.pocket:hover{background-color:#ef4056}
.scriptlesssocialsharing .button.telegram{background-color:rgba(0,136,204,.8)}
.scriptlesssocialsharing .button.telegram:hover{background-color:#08c}
.scriptlesssocialsharing .button.hatena{background-color:rgba(0,164,222,.8)}
.scriptlesssocialsharing .button.hatena:hover{background-color:#00a4de}
.scriptlesssocialsharing .button.sms{background-color:rgba(0,153,51,.8)}
.scriptlesssocialsharing .button.sms:hover{background-color:#093}
.scriptlesssocialsharing .button.bluesky{background-color:rgba(17,133,254,.8)}
.scriptlesssocialsharing .button.bluesky:hover{background-color:#1185fe}
@media print{.scriptlesssocialsharing{display:none}}
html body.single .entry-content .scriptlesssocialsharing a.button,
html body.single .entry-content .scriptlesssocialsharing a.button:hover,
html body.single .entry-content .scriptlesssocialsharing a.button:visited,
html body.single .entry-content .scriptlesssocialsharing a.button:focus,
html body.single .scriptlesssocialsharing a.button,
html body.single .scriptlesssocialsharing a.button:hover,
html body.single .scriptlesssocialsharing a.button:visited,
html body.single .scriptlesssocialsharing a.button:focus{color:#fff;border-color:transparent;text-decoration:none}
@media(min-width:768px){.scriptlesssocialsharing__buttons{flex-wrap:nowrap}.scriptlesssocialsharing__buttons a.button{flex:1 1 0;min-width:0}}

/* ============ 17. Hero-band kicker scrim — caption legibility ============
   HERO KICKER LAW (2026-09-24, visual-sweep fix pass): the figcaption gradient
   is transparent at the top where the amber kicker sits, so on bright photos the
   kicker escapes its scrim (seen live: 12V guide "POWER CHECK" on the dash
   photo). A dark pill behind the kicker guarantees contrast on any photo, in
   both themes, matching the illustration-caption treatment. */
.dg-v-hero-band .dg-v-kicker{background:rgba(0,0,0,.55);border-radius:999px;padding:5px 11px}

/* ============ 18. Illustration caption contrast — ::after overrides ============
   ILLUSTRATION CAPTION LAW (2026-09-24, visual-sweep fix pass): per-page inline
   styles inject `body.postid-NNN .dg-hero::after` (0,2,2) with
   color:rgba(255,255,255,.8) on background:rgba(0,0,0,.5) — dim on bright
   illustrations. This (0,2,3) beats the per-page rules regardless of source
   order and applies to every postid-scoped illustration caption sitewide. */
html body[class*="postid-"] .dg-hero::after{color:#fff;background:rgba(0,0,0,.68)}

/* ============ 19. Table of contents (dg-toc) ============
   Rendered by partials/blocks/toc.html from page.toc. Single <nav>, no blank
   lines in markup (wpautop law). */
.dg-toc{border:1px solid var(--dg-v-line);border-radius:var(--dg-v-radius);padding:14px 16px;margin:0 0 22px;background:var(--dg-v-card)}
.dg-toc>p{margin:0 0 8px;font-weight:700;color:var(--dg-v-ink)}
.dg-toc ol{margin:0;padding-left:20px;display:grid;gap:7px;color:var(--dg-v-ink-dim)}
.dg-toc a{color:var(--dg-v-ink);text-decoration:none;border-bottom:1px dotted var(--dg-v-ink-dim)}
.dg-toc a:hover{color:var(--dg-v-amber);border-bottom-style:solid}
/* TOC TITLE LAW (2026-09-25): "On this page" renders as an amber kicker so
   the contents block reads as navigation, not body text. Light mode needs
   the darker amber (#B45309) for legibility on the light card — plain
   #F59E0B is ~2:1 on white (HERO BRAND LAW refinement). (0,2,0) beats
   .dg-toc>p (0,1,1). Sentence case kept, no text-transform. */
.dg-toc>#dg-toc-title{color:var(--amber);font-size:.78rem;font-weight:800;letter-spacing:.14em;margin:0 0 10px}
html[data-theme="light"] .dg-toc>#dg-toc-title{color:#B45309}

/* ============ 20. CookieYes preference-center close target ============
   CONSENT LAW (2026-09-24, Law 25/PIPEDA pass): CookieYes ships
   .cky-preference-header .cky-btn-close at 24x24px. Touch targets must be
   44x44. Same specificity (0,2,0) + !important beats their rule. */
.cky-preference-header .cky-btn-close{min-width:44px!important;min-height:44px!important;width:44px!important;height:44px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
/* ============ 21. Anchor scroll margin for TOC targets ============
   TOC LAW (2026-09-24): the sticky site header (~64px) covers jump targets.
   Give every id-bearing heading scroll room so #anchor jumps land visible. */
h2[id]{scroll-margin-top:84px}
/* TOC links must beat the theme's body.single .entry-content a (0,3,3).
   SPECIFICITY LAW (2026-09-24): a bare .dg-toc a (0,1,1) loses to the
   theme's amber link rule on single posts — scope up to (0,3,4). */
html body:is(.single,.page) .entry-content .dg-toc li a{color:var(--dg-v-ink)}
/* ============ 22. Kill the white gap above the DG site header ============
   GAP LAW (2026-09-25): TT5's single + page templates put
   margin-top:var(--wp--preset--spacing--60) inline on
   main#wp--skip-link--target and padding-top:var(--wp--preset--spacing--60)
   inline on its first .alignfull group, and wpautop injects an empty
   paragraph before the DG header when post content has a blank line
   after the closing style tag. With the native header display:none, all three stack into a
   white gap above the DG banner on every post and regular page. (The old
   per-post rule ".entry-content main{margin-top:0}" never matched — main
   is the ANCESTOR of .entry-content, not its child.) Inline template
   styles need !important to override. */
main#wp--skip-link--target{margin-top:0!important}
main#wp--skip-link--target>.wp-block-group.alignfull:first-child{padding-top:0!important}
.wp-block-post-content>p:empty:first-child{display:none}
.wp-block-post-content>p:first-child:has(>script:only-child){display:none}
header.site-header{margin-top:0!important}
/* ============ 23. Header logo vs global-styles amber link rules ============
   LOGO LAW (2026-09-25): the Additional-CSS rules
   `html:not([data-theme="dark"]) body.single .entry-content a{color:#B45309}`
   (0,3,3) paint every link inside .entry-content amber — including the DG
   header's a.logo, because the header ships INSIDE the post content. The
   homepage (header outside .entry-content) renders the logo in --paper, so
   posts showed an amber logo while the homepage showed ink: the exact
   banner mismatch Rafael spotted. These (0,4,3)/(0,5,3) selectors beat the
   global-styles rules (and their :hover/:focus variants) in both themes
   regardless of source order, restoring --paper on the logo everywhere. */
html:not([data-theme="dark"]) body.single .entry-content a.logo{color:var(--paper)}
html:not([data-theme="dark"]) body.single .entry-content a.logo:hover,
html:not([data-theme="dark"]) body.single .entry-content a.logo:focus{color:var(--paper)}
html[data-theme="dark"] body.single .entry-content a.logo,
html[data-theme="dark"] body.single .entry-content a.logo:hover,
html[data-theme="dark"] body.single .entry-content a.logo:focus{color:var(--paper)}
/* ============ 24. CTA buttons vs global-styles amber link rules ============
   BUTTON LAW (2026-09-25): the same global-styles rules
   `html[data-theme="dark"] body.single .entry-content a{color:#F59E0B}` and
   `html:not([data-theme="dark"]) body.single .entry-content a{color:#B45309}`
   (both 0,3,3) beat `.dg-redesign .btn-primary` (0,2,0), painting CTA button
   text amber-on-amber — invisible in dark mode, wrong brown in light mode
   (found on migrated post 1029 via mirror QA; the live canary 1194 had the
   same defect). These (0,5,3) selectors restore --on-amber on every
   .dg-redesign .btn in both themes regardless of source order. */
html:not([data-theme="dark"]) body.single .entry-content .dg-redesign a.btn{color:var(--on-amber)}
html[data-theme="dark"] body.single .entry-content .dg-redesign a.btn{color:var(--on-amber)}
/* ============ 25. Stray <br> inside grids (wpautop defense) ============
   A bare <br> as a direct child of a grid container is always a wpautop
   artifact (single newlines between card anchors), never intentional
   markup — it becomes a bogus grid item and breaks multi-column layouts
   (found on the four migrated tool pages, 2026-09-25). Hide them. */
.dg-redesign div[class*="-grid"]>br{display:none}

/* ============ 26. Winner-badge wrap law ============
   WINNER-BADGE WRAP LAW (2026-09-25): .winner-badge is absolutely positioned
   with a fixed top:-15px, so when the label wraps to two lines at 375px
   (e.g. "BEST CANADIAN THERMOELECTRIC" on post 258) the badge grows DOWNWARD
   into the card and covers the product heading. Anchor the badge by its
   vertical CENTER on the card's top edge instead, and give badged cards
   enough top padding to clear a two-line badge. Single-line badges render
   pixel-identical to before (15.5px straddle either side of the edge). */
.dg-redesign .product .winner-badge{top:auto;bottom:100%;transform:translateY(50%)}
.dg-redesign .product:has(.winner-badge){padding-top:42px}
/* ============ 27. Tool fieldset border law ============
   FIELDSET LAW (2026-09-25): the .dg-redesign *{margin:0;padding:0} reset
   does NOT clear borders, so <fieldset class="tool-field"> keeps its UA
   groove border — rendering as a broken-looking white box around each
   input group on the heated-blanket calculator (1175). Strip it; the
   .tool-legend already styles the legend as the group label. */
.dg-redesign .tool-field{border:0}
/* ============ 28. Comparison tables stack on mobile ============
   STACKED-TABLE LAW (2026-09-25): hand-built comparison pages carry
   .table-scroll.dg-cmp-stack. Below 768px the compare table collapses to
   stacked card rows (no horizontal scroll at 375px): thead hides, each td
   takes its column label from data-th, row-header th becomes the card title. */
@media(max-width:767px){
.dg-redesign .table-scroll.dg-cmp-stack{overflow:visible;border:0;background:none}
.dg-redesign .table-scroll.dg-cmp-stack table.compare{min-width:0;display:block}
.dg-redesign .table-scroll.dg-cmp-stack table.compare thead{display:none}
.dg-redesign .table-scroll.dg-cmp-stack table.compare tbody{display:block}
.dg-redesign .table-scroll.dg-cmp-stack table.compare tr{display:block;border:1px solid var(--line-soft);border-radius:var(--radius);background:var(--card);margin-bottom:14px;padding:6px 18px}
.dg-redesign .table-scroll.dg-cmp-stack table.compare th,.dg-redesign .table-scroll.dg-cmp-stack table.compare td{display:block;width:100%;border:0;padding:10px 0;border-bottom:1px dashed var(--line-soft);text-align:left}
.dg-redesign .table-scroll.dg-cmp-stack table.compare th:last-child,.dg-redesign .table-scroll.dg-cmp-stack table.compare td:last-child{border-bottom:0}
.dg-redesign .table-scroll.dg-cmp-stack table.compare td::before{content:attr(data-th);display:block;font-weight:800;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--amber);margin-bottom:3px}
.dg-redesign .table-scroll.dg-cmp-stack table.compare td:not([data-th])::before{display:none}
.dg-redesign .table-scroll.dg-cmp-stack table.compare tbody th{white-space:normal}
}

/* ============ 29. V2 font bridge ============
   V2 FONT BRIDGE (2026-09-25): the v2 theme shell carries `body.dg-chrome-v2`
   while live article content still uses v1 markup (.dg-v-*, .dg-redesign). The
   class pins the v2 system font stack from redesign-v2/typography.css
   (font-family ONLY — colors/spacing stay with existing rules; inheritance
   carries the new stack into legacy components with zero specificity fights). */
body.dg-chrome-v2{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}

/* ============ 30. V2 chrome shortcode components (home feed / site index / theme button) ============
   CHROME-SHORTCODE LAW (2026-09-25): dg-site-chrome.php (snippet 13) ships 14
   classes with zero CSS coverage: dgv2-themebtn(+label), dgv2-home-feed,
   dgv2-hero-band(+title/sub/cta), dgv2-tools-band/list, dgv2-site-index,
   dgv2-index-group/count/list, dgv2-footer-disclose. Styled here in the v2
   token language: dark-first surfaces, amber accents (kickers amber ONLY on
   hero/feature per the five-jobs discipline; feed kickers stay muted grey),
   rounded cards, compact feed rows (thumb 120px, title 2-line clamp, meta
   "M j, Y • N min read"), index accordions via details/summary, footer
   disclosure as small muted text. DARK-DEFAULT: dark-state selectors use
   html:not([data-theme="light"]) — never bare html[data-theme="dark"].
   HERO BRAND LAW: the hero band carries no photo and no brand marks. If a
   photo is ever added, steer object-position to the quiet zone and lay a
   directional (~100deg) left-weighted scrim so the text column stays legible
   in both themes; the kicker re-tints via --kicker in light mode. */
.dgv2-themebtn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;padding:12px 16px;margin:0 0 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-family:var(--font-stack);font-size:1rem;font-weight:700;cursor:pointer}
.dgv2-themebtn:hover{background:var(--surface-3)}
.dgv2-themebtn svg{width:22px;height:22px;flex:none}
.dgv2-themebtn-label{line-height:1.25}
html:not([data-theme="light"]) .dgv2-themebtn .icon-moon{display:none}
html[data-theme="light"] .dgv2-themebtn .icon-sun{display:none}
.dgv2-home-feed{margin:0}
.dgv2-hero-band{position:relative;overflow:hidden;background:linear-gradient(100deg,var(--surface) 0%,var(--surface) 55%,var(--surface-2) 100%);border:1px solid var(--border);border-radius:var(--radius-xl);padding:30px 24px;margin:0 0 30px}
.dgv2-hero-band .dgv2-kicker{color:var(--kicker);margin-bottom:10px}
.dgv2-home-feed .dgv2-hero-band-title{font-size:clamp(1.75rem,1.2rem + 2.5vw,2.5rem);font-weight:800;letter-spacing:-.02em;line-height:1.15;color:var(--text);margin:0 0 10px;text-wrap:balance}
.dgv2-hero-band-sub{color:var(--muted);font-size:var(--fs-body);line-height:var(--lh-body);margin:0 0 20px;max-width:52ch}
.dgv2-hero-band-cta{margin:0}
.dgv2-hero-band-cta .dgv2-cta{width:auto;min-width:220px}
/* ===== dgv2-cover: cinematic editorial cover (Sept 2026) ===== */
.dgv2-cover{position:relative;overflow:hidden;border-radius:var(--radius-xl);margin:0 0 30px;min-height:min(78vh,620px);display:flex;align-items:flex-end;isolation:isolate}
.dgv2-cover-bg{position:absolute;inset:0;z-index:-2}
.dgv2-cover-bg img{width:100%;height:100%;object-fit:cover;object-position:68% 50%;display:block}
.dgv2-cover-scrim{position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(4,4,7,.94) 0%,rgba(4,4,7,.88) 38%,rgba(4,4,7,.55) 62%,rgba(4,4,7,.18) 85%,rgba(4,4,7,.08) 100%)}
.dgv2-cover-scrim::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(4,4,7,.55) 100%)}
.dgv2-cover-content{position:relative;padding:44px 24px 60px;max-width:640px}
.dgv2-cover .dgv2-cover-kicker{display:inline-block;font-size:.75rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--amber);margin:0 0 14px}
.dgv2-cover h1.dgv2-cover-title{font-size:clamp(2.1rem,1.4rem + 5vw,3.4rem);font-weight:800;letter-spacing:-.02em;line-height:1.08;color:#fff;margin:0 0 16px;text-wrap:balance;text-shadow:0 2px 24px rgba(0,0,0,.5)}
.dgv2-cover .dgv2-cover-dek{color:rgba(255,255,255,.87);font-size:clamp(1rem,.95rem + 1vw,1.15rem);line-height:1.55;margin:0 0 26px;max-width:44ch}
.dgv2-cover .dgv2-cover-cta-row{margin:0}
.dgv2-cover a.dgv2-cover-cta{display:inline-flex;align-items:center;gap:10px;background:var(--amber);color:#140F05;font-weight:800;font-size:1.02rem;padding:15px 28px;border-radius:999px;text-decoration:none;box-shadow:0 8px 28px rgba(245,158,11,.35)}
html body.page .entry-content .dgv2-prose .dgv2-cover a.dgv2-cover-cta{text-decoration:none}
.dgv2-cover a.dgv2-cover-cta:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(245,158,11,.45)}
.dgv2-cover ul.dgv2-cover-proof{display:flex;flex-wrap:wrap;gap:8px 20px;margin:22px 0 0;padding:0;list-style:none;color:rgba(255,255,255,.68);font-size:.88rem;font-weight:600}
.dgv2-cover ul.dgv2-cover-proof li{display:inline-flex;align-items:center;gap:7px}
.dgv2-cover ul.dgv2-cover-proof li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--amber);flex:0 0 auto}
.dgv2-cover a.dgv2-cover-scroll{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);color:rgba(255,255,255,.75);font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none}
html body.page .entry-content .dgv2-prose .dgv2-cover a.dgv2-cover-scroll{text-decoration:none;color:rgba(255,255,255,.75)}
.dgv2-cover a.dgv2-cover-scroll svg{width:18px;height:18px;animation:dgv2-bob 2s ease-in-out infinite}
@keyframes dgv2-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@media(min-width:760px){.dgv2-cover{min-height:min(82vh,700px)}.dgv2-cover .dgv2-cover-content{padding:64px 48px 76px}}
.dgv2-tools-band{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:24px 20px;margin:44px 0 0}
.dgv2-tools-band .dgv2-sechead{margin:0 0 14px}
.dgv2-tools-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.dgv2-tools-list a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);text-decoration:none;font-weight:700;font-size:16px;line-height:1.4}
.dgv2-tools-list a:hover{background:var(--surface-3)}
.dgv2-tools-list .chev{width:20px;height:20px;flex:none;color:var(--muted)}
.dgv2-site-index{margin:0}
details.dgv2-index-group{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);margin:0 0 12px;overflow:hidden}
.dgv2-index-group summary{display:flex;align-items:center;gap:12px;min-height:56px;padding:14px 18px;cursor:pointer;list-style:none;font-weight:700;font-size:var(--fs-toc);color:var(--text)}
.dgv2-index-group summary::-webkit-details-marker{display:none}
.dgv2-index-group summary::after{content:"";flex:none;width:9px;height:9px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(-45deg);transition:transform .18s ease}
.dgv2-index-group[open] summary::after{transform:rotate(45deg)}
.dgv2-index-count{margin-left:auto;font-size:var(--fs-kicker);font-weight:700;letter-spacing:.06em;color:var(--muted);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-full);padding:3px 10px;line-height:1.4;white-space:nowrap}
.dgv2-index-list{list-style:none;margin:0;padding:4px 18px 16px;display:grid}
.dgv2-index-list li{display:flex;align-items:baseline;justify-content:space-between;gap:14px;min-width:0;padding:10px 0;border-top:1px solid var(--border)}
.dgv2-index-list li a{color:var(--text);text-decoration:none;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dgv2-index-list li a:hover{color:var(--kicker)}
.dgv2-index-list .dgv2-meta{margin:0;flex:none;white-space:nowrap}
.dgv2-footer-disclose{margin:0 0 12px;font-size:12px;line-height:1.6;color:var(--muted)}
/* FEED-LINK DEFENSE (2026-09-25): typography.css sets
   html body:is(.single,.page) .entry-content .dgv2-prose a:not(.dgv2-cta)
   (0,4,3) — text colour + underline on every prose link. Card/row anchors in
   the home feed and site index must stay underline-free; these (0,5,3)
   selectors win regardless of source order (hand-laws ships BEFORE the v2
   head in the union). */
html body:is(.single,.page) .entry-content .dgv2-prose.dgv2-home-feed a.dgv2-fcard,html body:is(.single,.page) .entry-content .dgv2-prose.dgv2-home-feed a.dgv2-hcard,html body:is(.single,.page) .entry-content .dgv2-prose.dgv2-home-feed .dgv2-tools-list li a,html body:is(.single,.page) .entry-content .dgv2-prose.dgv2-site-index .dgv2-index-list li a{text-decoration:none}
html body:is(.single,.page) .entry-content .dgv2-prose.dgv2-home-feed a.dgv2-sechead-link{color:var(--kicker);text-decoration:none}
/* ============ 31. CookieYes banner compaction (all viewports) ============
   COOKIE-COMPACT LAW (2026-09-25, fixed 2026-09-25): the CookieYes consent bar
   ("We value your privacy") covers ~40-50% of the 375px viewport — title +
   description + three full-width stacked buttons. Compact it into a slim
   bottom sheet: tighter padding, smaller type, and the three buttons in one
   compact row. BUGFIX 2026-09-25: the original law set display:flex but never
   overrode the plugin's `flex-direction:column`, so the buttons kept stacking
   and the banner stayed massive — flex-direction:row is the actual fix.
   Refinement 2026-09-25: the core compaction now applies at ALL widths (the
   desktop 440px banner was also obscuring the p1175 calculator), with extra
   tightening below 480px.
   COMPLIANCE: no control is hidden and no consent state is changed — Accept,
   Reject and Customise all stay visible with >=44px touch targets, nothing is
   pre-ticked. The preference-center modal is untouched. !important is required:
   the plugin stylesheet prints after this snippet in wp_head and wins ties. */
.cky-consent-container .cky-consent-bar{padding:14px 18px!important}
.cky-consent-container .cky-notice{padding:0!important}
.cky-consent-container p.cky-title{font-size:1rem!important;line-height:1.3!important;margin:0 0 4px!important}
.cky-consent-container .cky-notice-des{font-size:13px!important;line-height:1.45!important;margin:0 0 10px!important}
.cky-consent-container .cky-notice-des p{margin:0!important}
.cky-consent-container .cky-notice-btn-wrapper{display:flex!important;flex-direction:row!important;gap:8px!important;margin:0!important}
.cky-consent-container .cky-notice-btn-wrapper .cky-btn{flex:1 1 0!important;min-width:0!important;min-height:44px!important;margin:0!important;padding:10px 4px!important;font-size:.875rem!important;line-height:1.2!important}
@media(max-width:480px){
.cky-consent-container .cky-consent-bar{padding:10px 14px!important}
.cky-consent-container .cky-notice-des{font-size:12px!important;margin:0 0 8px!important}
}
/* ============ 32. Dark-mode body background ============
   BODY BG LAW (2026-09-25): Twenty Twenty-Five's global styles set
   `body{background-color:var(--wp--preset--color--base)}` (white, 0,0,1) and it
   wins because the union CSS only themes .dg-redesign/.dgv2 descendants —
   leaving white gutters and white template space around dark content in
   dark/default mode. Explicit per-theme body backgrounds fix it. The
   :not([data-theme="light"]) form covers dark AND the default no-attribute
   state, per the DARK-DEFAULT :not() PATTERN. (0,2,2) beats TT5 (0,0,1). */
html:not([data-theme="light"]) body.dg-chrome-v2{background-color:#0C0C0E;color:#F4F2EC}
html[data-theme="light"] body.dg-chrome-v2{background-color:#FAF7F0;color:#16130D}
/* ============ 33. Homepage gap-fill (2026-09-25): quick-pick badges, method strip, comparisons 2-col, deal band ============
   Quick-pick badge is an outline pill in the sponsored-kicker style; amber
   stays reserved for editorial kickers/CTAs. All rules use v2 tokens so both
   themes hold. DARK-DEFAULT: no theme-conditional rules needed here. */
.dgv2-tool-left{display:flex;align-items:center;gap:10px;min-width:0;flex-wrap:wrap}
.dgv2-tool-badge{display:inline-block;flex:none;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:4px 10px;line-height:1.4;white-space:nowrap}
.dgv2-method-strip{margin:26px 0 0;padding:16px 20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);text-align:center}
.dgv2-method-strip p{margin:0;font-size:.875rem;line-height:1.6;color:var(--muted)}
.dgv2-method-strip a{color:var(--amber-kicker);font-weight:700}
ul.dgv2-hcards.dgv2-2col{display:grid;grid-template-columns:1fr;gap:22px}
@media(min-width:640px){ul.dgv2-hcards.dgv2-2col{grid-template-columns:1fr 1fr;gap:22px 28px}}
.dgv2-deal-band{margin:44px 0 0;padding:24px 20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg)}
.dgv2-deal-band .dgv2-sechead{margin:0 0 6px}
.dgv2-deal-sub{margin:0 0 18px;font-size:.875rem;color:var(--muted);line-height:1.55}
.dgv2-deal-note{display:block;font-size:.875rem;color:var(--muted);margin:10px 0 0;line-height:1.55}
/* ============ 34. Type discipline (2026-09-25) ============
   TYPE-DISCIPLINE LAW: Cybernews-aligned typographic discipline for the live
   v1 article system (.dg-redesign.dg-t-*). (1) One alignment per block:
   review/money articles stay LEFT-aligned throughout (their review template
   centers nothing); no justification anywhere. (2) Restrained ladder
   (12/14/16/18/20/24/30/32/40/48px) and max three weights (400/600/700 — the
   800s below become 700). (3) Body 17px at lh 1.6, measure 68ch. (4) Reading
   rhythm the v1 templates never shipped (the * reset zeroes p/h2/ul margins):
   24px paragraph gaps, H2 24px top / 16px bottom, 4px list-item gaps.
   Font families untouched (Manrope/Georgia v1, system stack v2). */
.dg-redesign{line-height:1.6}
.dg-redesign.dg-t-post .prose{max-width:68ch}
.dg-redesign.dg-t-post .prose>p{margin:0 0 24px}
.dg-redesign.dg-t-post .prose>ul,.dg-redesign.dg-t-post .prose>ol{margin:0 0 24px;padding-left:24px}
.dg-redesign.dg-t-post .prose>ul>li,.dg-redesign.dg-t-post .prose>ol>li{margin-bottom:4px}
.dg-redesign.dg-t-post .prose>h2{font-size:1.5rem;margin:24px 0 16px}
.dg-redesign.dg-t-post .prose>h3{font-size:1.25rem;margin:20px 0 12px}
.dg-redesign.dg-t-post h1{font-size:clamp(2rem,1rem + 4.6vw,3rem)}
.dg-redesign.dg-t-post h2.sec-title{margin:24px 0 16px}
.dg-redesign.dg-t-tool .hero h1{font-size:clamp(2rem,1.6rem + 4.6vw,3rem)}
.dg-redesign.dg-t-post .verdict h2{font-size:1.5rem}
.dg-redesign.dg-t-post .product h3{font-size:1.5rem}
.dg-redesign.dg-t-post .takeaways h2{font-size:1.125rem}
.dg-redesign.dg-t-post .method h2{font-size:1.125rem}
.dg-redesign.dg-t-post .method p{font-size:1rem}
.dg-redesign.dg-t-post .kicker,.dg-redesign.dg-t-tool .kicker{font-size:.75rem;font-weight:700}
.dg-redesign.dg-t-post .byline .who strong{font-size:1rem}
.dg-redesign.dg-t-post .byline .who span{font-size:.875rem}
.dg-redesign.dg-t-post .hero figcaption{font-size:.75rem;text-align:center}
.dg-redesign.dg-t-post .standfirst{font-size:1.125rem;line-height:1.6}
.dg-redesign.dg-t-post .rel-body .rel-title{font-size:1.125rem}
.dg-redesign .skip-link,.dg-redesign .btn,.dg-redesign .foot-h{font-weight:700}
.dg-redesign.dg-t-home .score,.dg-redesign.dg-t-browse .score,.dg-redesign.dg-t-tool .score,.dg-redesign.dg-t-home .winner-badge,.dg-redesign.dg-t-post .winner-badge,.dg-redesign.dg-t-browse .winner-badge,.dg-redesign.dg-t-tool .winner-badge,.dg-redesign.dg-t-home .pick-rank,.dg-redesign.dg-t-browse .pick-rank,.dg-redesign.dg-t-tool .pick-rank,.dg-redesign.dg-t-post .verdict .v-kicker,.dg-redesign.dg-t-browse .arow .tag,.dg-redesign.dg-t-tool .tool-val,.dg-redesign.dg-t-tool .tool-row .v,.dg-redesign.dg-t-post .score-chip{font-weight:700}
.dg-redesign .table-scroll.dg-cmp-stack table.compare td::before{font-weight:700}
.dg-redesign .table-scroll.dg-cmp-stack table.compare td::before{font-size:.75rem}
.dgv2-home-feed .dgv2-hero-band-title{font-weight:700}
.dg-redesign.dg-t-tool .tool-choice small,.dg-redesign.dg-t-tool .tool-btn .tb-sub{font-weight:400;font-size:.875rem}
/* ===== §33 LINK-COLOR DARK-DEFAULT LAW (Sept 25, 2026) =====
   Leftover-audit find: global-styles still carries the old
   html[data-theme="dark"] body.single .entry-content a{color:#F59E0B} rule, which
   does NOT match fresh visitors (no data-theme attr = dark default), so
   first-time dark-mode visitors got the light rule #B45309 on #0C0C0E = 3.89:1.
   This (0,6,3) rule beats global-styles (0,3,3) despite dg-visual-components
   loading earlier; the :not()s keep the logo/btn/cta color overrides intact. */
html:not([data-theme="light"]) body.single .entry-content a:not(.logo):not(.btn):not(.dgv2-cta){color:#F59E0B}
html:not([data-theme="light"]) body.single .entry-content a:not(.logo):not(.btn):not(.dgv2-cta):hover{color:#FBBF24}
/* ---- 34b. V1 off-ladder sizes -> ladder (2026-09-25) ----
   Every discrete v1 font-size that sat between ladder rungs, normalized.
   (Fluid clamp() display sizes interpolate between rungs by design.) */
.dg-redesign.dg-t-tool .score-cap{font-size:.75rem}
.dg-redesign.dg-t-post .winner-badge{font-size:.75rem}
.dg-redesign.dg-t-tool .pick-rank{font-size:.75rem}
.dg-redesign .foot-h{font-size:.75rem}
.dg-redesign.dg-t-post .cta-note{font-size:.875rem}
.dg-redesign.dg-t-tool .news-fine{font-size:.875rem}
.dg-redesign.dg-t-post .crumbs{font-size:.875rem}
.dg-redesign.dg-t-post .table-scroll table.compare{font-size:.875rem}
.dg-redesign .foot-brand p{font-size:1rem}
.dg-redesign.dg-t-post .spec-row{font-size:.875rem}
.dg-redesign.dg-t-post .faq summary{font-size:1rem}
.dg-redesign.dg-t-tool .section-head p{font-size:1.125rem}
.dg-redesign.dg-t-tool .method p{font-size:1.125rem}
.dg-redesign.dg-t-tool .score{font-size:1.125rem}
.dg-redesign.dg-t-tool .art h3{font-size:1.25rem}
.dg-redesign.dg-t-tool .math-formula{font-size:1.25rem}
.dg-redesign.dg-t-tool .pick h3{font-size:1.5rem}
.dg-redesign.dg-t-tool .result-num{font-size:2.5rem}
.dg-redesign.dg-t-tool .hero .lede{font-size:clamp(1.125rem,1rem + 1.5vw,1.25rem)}
.dg-redesign .logo-mark{font-size:1.125rem}
.dg-redesign .logo-word{font-size:1.125rem}
.dg-redesign .foot-nav a{font-size:1rem}
.dg-redesign .foot-legal{font-size:.875rem}
.dg-redesign .site-nav a{font-size:1rem}
/* ============ 33. Footer newsletter block (Phase 2d — wired 2026-09-25) ============
   DG-NEWS: calm footer signup for Fluent Forms form #5 ("Driver Gear
   Newsletter"). The panel sits in .dgv2-footer-in between the link columns
   and the legal row. No popups, no exit intent — footer block only, per the
   "not annoying" rule. DARK-DEFAULT: dark-state selectors use
   html:not([data-theme="light"]) — never bare html[data-theme="dark"].
   FF-OVERRIDE LAW: Fluent Forms injects its own <style> for the submit
   button (form.fluent_form_5 .ff-btn-submit:not(.ff_btn_no_style), 0,3,1)
   at render time. Our selectors below are (0,4,1)+ so they win regardless
   of source order — no !important needed. */
.dg-news{border-top:1px solid var(--border);margin-top:28px;padding:28px 0 8px;max-width:760px}
.dg-news-kicker{margin:0 0 6px;font-size:var(--fs-kicker);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.dg-news-title{margin:0 0 6px;font-size:var(--fs-title);font-weight:800;line-height:var(--lh-tight);letter-spacing:-.01em;color:var(--text);text-wrap:balance}
.dg-news-copy{margin:0 0 16px;font-size:var(--fs-meta);line-height:var(--lh-body);color:var(--muted);max-width:52ch}
.dg-news .fluentform{margin:0}
.dg-news .fluentform .ff-el-form{margin:0}
.dg-news .fluentform .ff-el-group{margin:0 0 12px;padding:0}
.dg-news .fluentform .ff-el-input--label{margin:0 0 6px}
.dg-news .fluentform .ff-el-input--label label{font-size:12px;font-weight:600;color:var(--muted);margin:0}
.dg-news .fluentform .ff-el-form-control{width:100%;min-height:48px;padding:12px 14px;font-size:16px;line-height:1.4;color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);box-sizing:border-box;font-family:inherit}
.dg-news .fluentform .ff-el-form-control::placeholder{color:var(--faint)}
.dg-news .fluentform .ff-el-form-control:focus{outline:2px solid var(--amber);outline-offset:1px;border-color:var(--amber)}
.dg-news .fluentform .ff-el-group.ff-el-is-error .ff-el-form-control{border-color:#e0655f}
.dg-news .fluentform .ff_submit_btn_wrapper{margin:4px 0 0}
.dg-news .fluentform form.fluent_form_5 .ff-btn-submit{display:inline-flex;align-items:center;justify-content:center;min-width:180px;min-height:52px;padding:14px 28px;font-size:16px;font-weight:800;line-height:1.2;color:var(--on-amber);background:var(--cta-bg);border:0;border-radius:var(--radius-full);cursor:pointer;font-family:inherit}
.dg-news .fluentform form.fluent_form_5 .ff-btn-submit:hover{filter:brightness(1.06)}
.dg-news .fluentform .ff-el-error{font-size:12px;color:#e0655f;margin-top:6px}
html[data-theme="light"] .dg-news .fluentform .ff-el-error{color:#b3261e}
.dg-news .fluentform .ff_form_msg{margin:12px 0 0;padding:14px 16px;font-size:14px;line-height:1.5;color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md)}
@media(min-width:640px){.dg-news .fluentform form.fluent_form_5 fieldset{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;align-items:end}.dg-news .fluentform .ff_submit_btn_wrapper{grid-column:1/-1}}
/* GRID-SELECTOR FIX (2026-09-25): the form element carries .ff-el-form-top,
   not .ff-el-form, so the earlier .ff-el-form fieldset selector never
   matched and desktop stayed single-column. Scoped to form.fluent_form_5. */
/* ============ 33. Footer 4-column desktop (nav rebuild 2026-09-25) ============
   NAV-REBUILD LAW: the footer carries four link columns (Reviews / Guides /
   Tools / Company) in the Cybernews pattern. The base 2-col grid suits phones;
   at desktop widths open all four columns. */
@media(min-width:900px){.dgv2-footer .dgv2-footer-cols{grid-template-columns:repeat(4,minmax(0,1fr));}}
/* ============ 33b. Footer newsletter: pin to dark palette (2026-09-25) ============
   DARK-FOOTER LAW: .dgv2-footer is hardcoded dark (#0A0A0C) in BOTH themes,
   but §33 used theme tokens — in light mode the title/copy/labels flipped
   to dark ink on the dark footer (unreadable, caught by mirror QA). The
   newsletter block lives only in the footer (no popups/exit intent ever),
   so pin it to the dark palette explicitly, in both themes. */
.dgv2-footer .dg-news{border-top-color:#26262C}
.dgv2-footer .dg-news-title{color:#F4EFE6}
.dgv2-footer .dg-news-copy,.dgv2-footer .dg-news-kicker{color:#B9B3A5}
.dgv2-footer .dg-news .fluentform .ff-el-input--label label{color:#B9B3A5}
.dgv2-footer .dg-news .fluentform .ff-el-form-control{color:#F4EFE6;background:#1C1C21;border-color:#26262C}
.dgv2-footer .dg-news .fluentform .ff-el-form-control::placeholder{color:#8E8878}
.dgv2-footer .dg-news .fluentform .ff_form_msg{color:#F4EFE6;background:#1C1C21;border-color:#26262C}
.dgv2-footer .dg-news .fluentform .ff-el-error{color:#e0655f}
html[data-theme="light"] .dgv2-footer .dg-news .fluentform .ff-el-error{color:#e0655f}
/* ============ 35. Search-results search bar compaction (2026-09-25) ============
   SEARCHBAR LAW: TT5's wp-block-search on the results page rendered ~58px tall
   with 16px 36px button padding — a dominant pill pair for a utility bar
   (Rafael's phone catch). Compact to a 44px utility bar. Scoped to body.search
   so other templates keep theme defaults; the header overlay and drawer search
   pills are intentionally large (full-screen/drawer contexts) and untouched.
   (0,3,1) beats TT5 .wp-element-button (0,1,0). */
body.search .wp-block-search .wp-block-search__inside-wrapper{gap:8px}
body.search .wp-block-search .wp-block-search__input{min-height:44px;line-height:1.4;padding:8px 16px;font-size:1rem;border-radius:999px}
body.search .wp-block-search .wp-block-search__button{min-height:44px;padding:10px 22px;font-size:.95rem;border-radius:999px}
/* ============ 36. Gemini-roast contrast fixes (2026-09-25) ============
   ROAST-CONTRAST LAW: the 2026-09-25 Gemini roast flagged several light-mode
   (and one both-theme) contrast failures, all verified against the live
   renders before fixing. All are pure color/size overrides, no layout change.
   (a) .score-cap ("provisional · specs + reviews") was var(--faint) — ~3.7:1
   on light cards and tiny; now >=12px with #4B5563 (light, ~7:1) / #9CA3AF
   (dark/default, ~5.5:1). (b) .kicker section labels (FIT CHECKS, TOP PICKS…)
   rendered in bright var(--amber) on cream in light mode (~2:1); pinned to
   #B45309 in light mode (~4.6:1, same family as the hero kicker law).
   (c) .cta-note price disclaimers ("~$60–65 CAD · recorded September 2026")
   were faint var(--muted) on light cards; darkened to #4B5563 in light mode.
   (d) .tool-hero .lede on p1175 was #D8D2C2 on the light blanket photo in
   light mode (~1.5:1); now #3F3A33 (~9:1 on the cream scrim). The h1 itself
   was already dark — the roast's "white headline" claim did not reproduce.
   DARK-DEFAULT: :not([data-theme="light"]) covers dark AND the default
   no-attribute state. (0,2,1)/(0,3,1) beat the page (0,1,0) rules. */
html[data-theme="light"] .score-cap{color:#4B5563!important}
html:not([data-theme="light"]) .score-cap{color:#9CA3AF!important}
.score-cap{font-size:.75rem!important}
html[data-theme="light"] .kicker{color:#B45309!important}
/* ---- 36e. kicker on tinted band backgrounds (2026-09-25) ----
   METHOD-BAND LAW: the global light-mode kicker re-tint (#B45309) passes
   4.69:1 on the normal cream background but drops to 4.27:1 on tinted
   --bg2 bands (#F2ECDF: .method, .news-band) — under the 4.5:1 minimum
   (caught by the typography style audit, Sept 2026). Pin kickers inside
   those bands to #93430A in light mode: 5.85:1 on bg2, 6.44:1 on plain bg,
   same amber family. Dark mode keeps var(--amber) (~7.65:1, fine). */
html[data-theme="light"] .method .kicker,
html[data-theme="light"] .news-band .kicker{color:#93430A!important}
html[data-theme="light"] .cta-note{color:#4B5563!important}
html[data-theme="light"] .tool-hero .lede{color:#3F3A33!important}
/* ============ 36. table-wrap scroll containment (2026-09-25) ============
   TABLE-WRAP LAW: post 1449 wraps its 6-column compare table in .table-wrap,
   a bare class with no CSS — the table rendered 1083px wide on 375px with
   columns 3-6 unreachable (no scroll container). Same containment treatment
   as .table-scroll: horizontal scroll plus a min-width so columns scroll
   instead of crushing. Harmless anywhere else the class appears. */
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{min-width:560px}
/* TEXT-OVER-IMAGE LAW (2026-09-25, staged): tool hero veils must guarantee text
   contrast over photos in BOTH themes. Dark veil had transparent top 42%;
   light veil too weak for small text over bright photo areas. */
.dg-redesign.dg-t-tool .hero-veil{background:linear-gradient(180deg,rgba(12,12,14,.92) 0%,rgba(12,12,14,.80) 32%,rgba(12,12,14,.58) 58%,rgba(12,12,14,.30) 78%,var(--bg) 97%)}
html[data-theme="light"] .dg-redesign.dg-t-tool .hero-art.has-photo .hero-veil{background:linear-gradient(180deg,rgba(250,247,240,.96) 0%,rgba(250,247,240,.86) 32%,rgba(250,247,240,.64) 58%,rgba(250,247,240,.38) 78%,var(--bg) 97%)}
.dg-redesign.dg-t-tool .hero .crumbs,.dg-redesign.dg-t-tool .hero .crumbs a,.dg-redesign.dg-t-tool .hero .tool-fine,.dg-redesign.dg-t-tool .hero .kicker,.dg-redesign.dg-t-tool .hero h1,.dg-redesign.dg-t-tool .hero .lede{text-shadow:0 1px 10px rgba(0,0,0,.85),0 0 3px rgba(0,0,0,.9)}
html[data-theme="light"] .dg-redesign.dg-t-tool .hero .crumbs,html[data-theme="light"] .dg-redesign.dg-t-tool .hero .crumbs a,html[data-theme="light"] .dg-redesign.dg-t-tool .hero .tool-fine,html[data-theme="light"] .dg-redesign.dg-t-tool .hero .kicker,html[data-theme="light"] .dg-redesign.dg-t-tool .hero h1,html[data-theme="light"] .dg-redesign.dg-t-tool .hero .lede{text-shadow:0 1px 10px rgba(250,247,240,.9),0 0 3px rgba(250,247,240,.95)}

/* ============ 37. post-214 table scroll containment (2026-09-25) ============
   TABLE-WRAP LAW extension: post 214's bare 4-column compare table rendered
   387px wide inside a 315px container with no scroll wrapper — the 4th column
   clipped with no way to reach it. Scoped horizontal-scroll containment on the
   table itself (display:block + overflow-x:auto keeps table layout via
   anonymous table-box generation; narrow tables are visually unaffected). */
body.postid-214 .entry-content table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ============ 38. Floating TOC bar — Cybernews-style mobile (2026-09-25) ============
   Crawled from website-builders.cybernews.com: on mobile their inline TOC card
   stays in-flow, and once you scroll past it a slim FIXED bar docks under the
   sticky header showing the current section (scrollspy). Tap expands the full
   list as an overlay with a dimmed backdrop; the active link gets bold +
   accent bar. Desktop keeps the inline card (Cybernews does the same).
   OUR ADAPTATION: JS (snippet "DG TOC — Floating Bar") injects the bar only
   when the page rendered a .dg-toc (long reads). Header is already sticky
   (dgv2-header, z-60) and never folds — the bar docks below it at z-55,
   under the drawer (z-80). Anchored h2s get scroll-margin so jumps clear
   header + bar.
   TOKEN LAW: the bar is appended to <body>, outside any article scope, so it
   uses the GLOBAL v2 tokens (:root --surface/--text/--muted/--border/--kicker).
   The old --dg-v-* names are undefined sitewide (never declared) and resolve
   to transparent/inherit — never use them here. */
.dg-tocbar{display:none}
h2[id]{scroll-margin-top:128px}
@media (max-width:768px){
.dg-tocbar.is-on{display:block;position:fixed;left:0;right:0;z-index:55;visibility:hidden;transform:translateY(-110%);transition:transform .25s ease,visibility .25s}
.dg-tocbar.is-on.is-visible{visibility:visible;transform:translateY(0)}
.dg-tocbar-bar{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:10px 14px;background:var(--surface);border:0;border-bottom:1px solid var(--border);font:inherit;color:var(--text);text-align:left;cursor:pointer;-webkit-tap-highlight-color:transparent}
.dg-tocbar-kicker{flex:0 0 auto;font-size:.7rem;font-weight:800;letter-spacing:.14em;color:var(--kicker);white-space:nowrap}
.dg-tocbar-current{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;font-weight:600;color:var(--text)}
.dg-tocbar-chev{flex:0 0 auto;width:24px;height:24px;color:var(--muted);transition:transform .2s ease}
.dg-tocbar.is-open .dg-tocbar-chev{transform:rotate(180deg)}
.dg-tocbar-panel{display:none;background:var(--surface);border-bottom:1px solid var(--border);box-shadow:0 14px 28px rgba(0,0,0,.28);max-height:62vh;max-height:62dvh;overflow-y:auto;-webkit-overflow-scrolling:touch}
.dg-tocbar.is-open .dg-tocbar-panel{display:block}
.dg-tocbar-panel ol{list-style:none;margin:0;padding:8px 0}
.dg-tocbar-panel li{margin:0;padding:0}
/* (0,4,3): beats the global .entry-content a amber rules (0,3,3) even if a
   future template ever nests the bar inside article markup. No data-theme
   qualifier — dark-default has no data-theme attribute (DARK-DEFAULT law). */
html body:is(.single,.page) .dg-tocbar.is-on .dg-tocbar-panel a{position:relative;display:flex;align-items:center;min-height:46px;padding:11px 16px 11px 22px;color:var(--text);text-decoration:none;font-size:.95rem;line-height:1.35}
.dg-tocbar-panel a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:transparent}
html body:is(.single,.page) .dg-tocbar.is-on .dg-tocbar-panel a.is-active{font-weight:800}
.dg-tocbar-panel a.is-active::before{background:var(--amber)}
.dg-tocbar-backdrop{display:none;position:fixed;inset:0;z-index:54;background:rgba(0,0,0,.5);border:0;padding:0;cursor:default}
.dg-tocbar-backdrop.is-on{display:block}
}
@media (min-width:769px){.dg-tocbar{display:none!important}.dg-tocbar-backdrop{display:none!important}}
@media (prefers-reduced-motion:reduce){.dg-tocbar.is-on{transition:none}.dg-tocbar-chev{transition:none}}

/* ===== TYPOGRAPHY SYSTEM v1 — audit 2026-09-25 (typography/typography.css) ===== */
/* ============================================================
   TYPOGRAPHY SYSTEM v1 — audit 2026-09-25
   Implements R1, R3, R4, R6, R7 from typography/RECOMMENDATIONS.md.
   (R2 headline casing and R5 H1 shortening are CONTENT edits —
   see typography/TEMPLATE-SPEC.md. R8 is an editorial rule, no CSS.)

   PLACEMENT: append to the END of ~/workspace/driver-gear/visual/components.css
   (the file generate_site.py copies to site/assets/components.css).
   Do NOT edit site/assets/components.css directly — it is generated.

   SPECIFICITY WARNING: the verbatim WP global-styles <style> block sits LATER
   in <head> than the components.css <link>, so its body{font-weight:300}
   (0,0,1) wins any tie. Every rule below uses specificity >= (0,1,0) or a
   body-qualified selector, and comes last in source order.
   ============================================================ */

/* ---- T1 (R1): body weight 400 — kills the WP global-styles 300 leak.
   (0,1,1) beats the inline body{font-weight:300} (0,0,1). */
body.dg-chrome-v2,
body.dg-chrome-v2 .dg-redesign,
body.dg-chrome-v2 .dgv2 {
  font-weight: 400;
  letter-spacing: 0;
}

/* ---- T3 (R3): lock the heading ladder.
   .dg-t-post .product h3 was 1.5rem — identical to .verdict h2 (1.5rem).
   Same specificity as the existing rule, later in source => wins. */
.dg-redesign.dg-t-post .product h3 {
  font-size: 1.25rem;
  line-height: 1.3;
}

/* ---- T4 (R4): one brand voice — Georgia headlines + Manrope body on v2
   surfaces. (0,2,1)/(0,2,2) beats the body-qualified system-stack rule.
   .dgv2-sechead h2 covers the homepage section heads ("Cab Tools", "Latest"...),
   which otherwise render in the system stack. */
body.dg-chrome-v2 .dgv2-hero-band-title,
body.dg-chrome-v2 .dgv2-fcard-title,
body.dg-chrome-v2 .dgv2-tool-title,
body.dg-chrome-v2 .dg-news-title,
body.dg-chrome-v2 .dgv2-sechead h2 {
  font-family: Georgia, "Times New Roman", Times, serif;
  letter-spacing: -.01em;
}
body.dg-chrome-v2 .dgv2-fcard-dek,
body.dg-chrome-v2 .dgv2-fcard-body,
body.dg-chrome-v2 .dgv2-meta,
body.dg-chrome-v2 .dgv2-tools-list a {
  font-family: Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI",
    system-ui, Roboto, Arial, sans-serif;
}

/* ---- T6 (R6): section heads wrap, never truncate.
   (0,2,2) beats .dgv2-sechead h2 (0,1,1). */
body.dg-chrome-v2 .dgv2-sechead h2 {
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  text-wrap: balance;
}

/* ---- T7 (R7): one caption system, theme-aware.
   Hero captions (on-photo) keep their explicit cream treatment. */
body.dg-chrome-v2 figure figcaption {
  font-family: Manrope, -apple-system, BlinkMacSystemFont, "Segoe UI",
    system-ui, Roboto, Arial, sans-serif;
  font-size: .75rem;
  line-height: 1.5;
  font-weight: 400;
  text-align: center;
  color: #A8A39B; /* ~7:1 on near-black */
}
html[data-theme="light"] body.dg-chrome-v2 figure figcaption {
  color: #655D4F; /* ~6.5:1 on cream */
}
/* hero captions sit on the photo scrim — keep the designed cream */
body.dg-chrome-v2 .dg-redesign.dg-t-post .hero figcaption,
body.dg-chrome-v2 .dgv2-hero figure figcaption {
  color: rgb(245, 241, 232);
}

/* ==========================================================================
   The Driver Gear — v2 design-system CSS. BUILT ARTIFACT — DO NOT EDIT.
   Sources live in redesign-v2/; this file is generated by build-v2-css.py.
   Build:   cd redesign-v2 && python3 build-v2-css.py > ../visual/components.css
   Verify:  python3 build-v2-css.py --check ../visual/components.css
   Layer order: tokens.css (canonical) -> typography.css -> components-v2.css
   (token-aligned per the rename map in the builder) -> build constants ->
   hand-laws.css (verbatim). Builder prints to stdout; it does NOT write.
   NEVER PUT raw CSS to the snippets endpoint.
   ========================================================================== */
/* ==========================================================================
   The Driver Gear — Redesign v2 token system
   DARK-FIRST. Cybernews-inspired. Amber brand (#F59E0B) — non-negotiable.
   Spec + tokens only (Worker B owns components, Worker D owns migration).

   THEME MODEL (per DARK-DEFAULT law):
   - Dark tokens live on :root, so "no data-theme attribute" (fresh visitors)
     resolves to dark without any JS.
   - Light theme overrides live under html[data-theme="light"] ONLY.
   - Any rule that must target dark explicitly MUST use
     html:not([data-theme="light"]) — html[data-theme="dark"] misses the
     no-attribute case and is forbidden for dark-state targeting.

   AMBER'S FIVE JOBS (the only places --amber may appear):
   1. CTA buttons          (bg --cta-bg, text --cta-text)
   2. Feature-card kickers (text --kicker)
   3. Score numerals       (text --score)
   4. Winner pills/badges  (bg or text --winner)
   5. Verdict edge         (border --verdict-edge)
   Everything else is neutral. No amber links, no amber borders, no amber
   icons outside these five jobs.
   ========================================================================== */

:root {
  /* ---- Dark theme (default) ---- */
  --bg:        #0C0C0E;   /* near-black page background */
  --surface:   #151518;   /* cards */
  --surface-2: #1C1C21;   /* nested cards, inputs, newsletter panel */
  --surface-3: #242429;   /* hover/pressed states on cards */
  --text:      #F4F2EC;   /* warm near-white */
  --muted:     #A8A39B;   /* secondary text, meta lines, kicker-grey */
  --faint:     #6E6A62;   /* dividers-adjacent labels, placeholders — text only when large */
  --border:    #26262C;   /* hairline dividers, card outlines (decorative) */

  /* ---- Brand amber (same value in both themes; never a text colour in light) ---- */
  --amber:     #F59E0B;
  --on-amber:  #140F05;   /* text on amber fills */

  /* ---- The five amber jobs ---- */
  --cta-bg:    #F59E0B;
  --cta-text:  #140F05;   /* BUTTON LAW: beat global .entry-content a (0,3,3) */
  --kicker:    #F59E0B;   /* feature cards only, centred */
  --score:     #F59E0B;
  --winner:    #F59E0B;
  --verdict-edge: #F59E0B;

  /* ---- Kicker fallback (feed cards, muted — NOT amber) ---- */
  --kicker-grey: #A8A39B;

  /* ---- Radius scale ---- */
  --radius-sm: 8px;    /* chips, badges, duration badge */
  --radius-md: 12px;   /* TOC card, thumbs, two-col card images */
  --radius-lg: 16px;   /* feature image, newsletter panel */
  --radius-xl: 20px;   /* hero treatment */
  --radius-full: 999px;/* search field, back-to-top, social icons */

  /* ---- Spacing scale ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;   /* page gutter, mobile */
  --space-5: 20px;
  --space-6: 24px;   /* card gap inside a section */
  --space-8: 32px;
  --space-10: 40px;  /* section gap (lower bound) */
  --space-12: 48px;  /* section gap (upper bound) */

  /* ---- Type scale (sentence-case headlines, 700/800 weight) ---- */
  --fs-display: 1.875rem; /* 30px — feature-card headline */
  --fs-section: 1.5rem;   /* 24px — section headers (Shorts, News, Security) */
  --fs-title:   1.25rem;  /* 20px — two-col card titles */
  --fs-card:    1.125rem; /* 18px — compact-card titles */
  --fs-body:    1rem;     /* 16px — article body, TOC rows */
  --fs-meta:    0.875rem; /* 14px — "Sep 25, 2026 • 3 min read" */
  --fs-kicker:  0.75rem;  /* 12px — small caps, letter-spacing 0.08em */
  --fs-toc:     1.125rem; /* 18px — TOC label */

  --lh-tight: 1.2;    /* headlines */
  --lh-title: 1.35;   /* card titles */
  --lh-body:  1.65;   /* article body */
  --lh-loose: 1.75;   /* "Keep reading" bullets */

  --font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                 "Helvetica Neue", Arial, sans-serif;
}

/* ---- Light theme override (user explicitly chose light) ---- */
html[data-theme="light"] {
  --bg:        #FAF7F0;
  --surface:   #FFFFFF;
  --surface-2: #F1ECE1;
  --surface-3: #E9E1D2;
  --text:      #16130D;
  --muted:     #6B6257;
  --faint:     #9A9184;
  --border:    #E5DDD0;

  /* HERO BRAND LAW refinement: #F59E0B text on light is ~2:1 (unreadable).
     Kicker re-tint for light mode keeps the amber family at 4.5:1+. */
  --kicker:      #B45309;
  --score:       #B45309;
  --winner:      #B45309;
  --verdict-edge:#B45309;

  /* CTA and on-amber stay dark-on-amber (8.89:1) in both themes. */
  --kicker-grey: #6B6257;
}

/* ==========================================================================
   CONTRAST LEDGER — every token pair measured (WCAG 2.1, relative luminance).
   Text pairs all clear 4.5:1; most clear 7:1. Borders are decorative only.

   DARK
   --text (#F4F2EC)   on --bg (#0C0C0E)        17.46:1 PASS
   --muted (#A8A39B)  on --bg (#0C0C0E)         7.80:1 PASS
   --text (#F4F2EC)   on --surface (#151518)   16.28:1 PASS
   --muted (#A8A39B)  on --surface (#151518)    7.27:1 PASS
   --muted (#A8A39B)  on --surface-2 (#1C1C21)  6.77:1 PASS
   --kicker (#F59E0B) on --bg (#0C0C0E)         9.10:1 PASS
   --on-amber (#140F05) on --amber (#F59E0B)    8.89:1 PASS

   LIGHT
   --text (#16130D)   on --bg (#FAF7F0)        17.32:1 PASS
   --muted (#6B6257)  on --bg (#FAF7F0)         5.59:1 PASS
   --muted (#6B6257)  on --surface (#FFFFFF)    5.98:1 PASS
   --kicker (#B45309) on --bg (#FAF7F0)         4.69:1 PASS
   --on-amber (#140F05) on --amber (#F59E0B)    8.89:1 PASS (unchanged)

   NOTE: caption samplers that measure inherited colour on figcaption
   wrappers report bogus ~1.0 fails — only screenshot-corroborated
   contrast defects count (contrast-audit lesson, Sept 24 2026).
   ========================================================================== */

/* ==========================================================================
   The Driver Gear — v2 typography system (source: redesign-v2/typography.css)
   Emitted verbatim by build-v2-css.py, AFTER tokens.css, BEFORE components.

   PAGE-WEIGHT LAW (rural LTE): system stacks ONLY — no webfont ships. The
   pairing is one refined stack in two voices: body at 400/1.65, headlines at
   700/800 with tight tracking and balanced wrap. A webfont's weight was not
   justified; -apple-system/Segoe UI/Roboto already render cleanly.
   Sentence case is preserved everywhere: NO text-transform on headlines
   (kickers/captions keep their small-caps treatment).

   KICKER LAW (spec, tokens.css): amber kickers live on FEATURE cards only.
   Feed/compact-card kickers are muted grey (--kicker-grey). Enforced in the
   component layer (.dgv2-kicker default grey; .dgv2-fcard .dgv2-kicker amber).
   ========================================================================== */

/* ---- Base: 16px body, 1.65 line-height on the v2 scope ---- */
.dgv2{font-family:var(--font-stack);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text);}

/* ---- Article prose: measure ~65ch, quiet rhythm ----
   Contract for Worker D (PHP migration): wrap migrated article body copy in
   <div class="dgv2-prose">. Component blocks (toc, keepreading, cards) keep
   their own styles; prose covers raw article text only. */
.dgv2-prose{max-width:65ch;font-size:var(--fs-body);line-height:var(--lh-body);}
.dgv2-prose>p{margin:0 0 1.5em;overflow-wrap:break-word;}
.dgv2-prose>h1:first-child{margin-top:0;}
.dgv2-prose h1,.dgv2-prose h2,.dgv2-prose h3,.dgv2-prose h4{font-family:var(--font-stack);font-weight:700;letter-spacing:-.015em;line-height:var(--lh-tight);color:var(--text);text-wrap:balance;margin:24px 0 16px;}
.dgv2-prose h1{font-size:var(--fs-display);}
.dgv2-prose h2{font-size:var(--fs-section);}
.dgv2-prose h3{font-size:var(--fs-title);font-weight:700;}
.dgv2-prose h4{font-size:var(--fs-card);font-weight:700;line-height:var(--lh-title);letter-spacing:-.01em;}

/* ---- Article links: visible, neutral, never button-like ----
   Amber is NOT a link colour (five-jobs discipline): links stay text-coloured
   with a muted underline that solidifies on hover. Scoped to (0,4,3) so the
   rule beats the theme's global body.single .entry-content a (0,3,3) amber
   link rules in both themes regardless of source order. Buttons (.dgv2-cta)
   are excluded — their amber fill + dark label is untouched (BUTTON LAW). */
html body.single .entry-content .dgv2-prose a:not(.dgv2-cta),
html body.page .entry-content .dgv2-prose a:not(.dgv2-cta){color:var(--text);text-decoration:underline;text-decoration-color:var(--muted);text-decoration-thickness:1px;text-underline-offset:3px;}
html body.single .entry-content .dgv2-prose a:not(.dgv2-cta):hover,
html body.page .entry-content .dgv2-prose a:not(.dgv2-cta):hover{text-decoration-color:var(--text);text-decoration-thickness:2px;}

/* ---- Muted captions: 12px meta voice for image credits / captions, centered ---- */
.dgv2-caption{display:block;font-size:.75rem;line-height:1.5;color:var(--muted);margin:var(--space-2) 0 0;text-align:center;}

/* ============================================================
   The Driver Gear - v2 component library (dark-first, cybernews-inspired)
   Local preview only. Pairs with markup-samples.html.
   Token names aligned to canonical tokens.css by build-v2-css.py (tokens.css wins; fallback :root/light blocks stripped at build).
   Amber discipline: amber ONLY for CTA / kicker / score / winner / verdict-edge.
   Dark is the DEFAULT: dark selectors use html:not([data-theme="light"]).
   ============================================================ */


.dgv2,.dgv2 body{margin:0;}
.dgv2{background:var(--bg);color:var(--text);font-family:var(--font-stack);-webkit-text-size-adjust:100%;}
.dgv2 img{max-width:100%;height:auto;display:block;}
.dgv2 a{color:inherit;}
.dgv2 button{font-family:inherit;cursor:pointer;}
.dgv2 :focus-visible{outline:2px solid var(--amber);outline-offset:2px;border-radius:4px;}
/* Shared atoms */
/* KICKER LAW (canonical spec): amber kickers on feature cards only; feed cards get the muted grey. */
.dgv2-kicker{display:block;font-size:var(--fs-kicker);font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--kicker-grey);margin:0 0 var(--space-2);}
.dgv2-fcard .dgv2-kicker{color:var(--kicker);}
.dgv2-meta{display:block;font-size:var(--fs-meta);line-height:1.5;color:var(--muted);margin:10px 0 0;}
/* ============================================================
   1. Sticky site header - dark bar in BOTH themes (brand chrome)
   ============================================================ */
.dgv2-header{position:sticky;top:0;z-index:60;background:#0C0C0E;color:#fff;border-bottom:1px solid #1E1E22;}
html[data-theme="light"] .dgv2-header{border-bottom:1px solid #1E1E22;}
.dgv2-header-in{display:flex;align-items:center;justify-content:space-between;height:60px;max-width:var(--dgv2-maxw);margin:0 auto;padding:0 16px;}
.dgv2-iconbtn{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;background:transparent;border:0;color:#fff;border-radius:10px;padding:10px;}
.dgv2-iconbtn svg{width:24px;height:24px;flex:none;}
.dgv2-iconbtn:hover{background:rgba(255,255,255,.08);}
a.dgv2-brand{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:#fff;font-weight:700;font-size:18px;letter-spacing:-.01em;line-height:1;}
.dgv2-brand-mark{width:26px;height:26px;flex:none;border-radius:7px;background:var(--amber);display:inline-flex;align-items:center;justify-content:center;}
.dgv2-brand-mark svg{width:16px;height:16px;color:var(--on-amber);}
/* LOGO LAW override: beat the 0,3,3 global .entry-content a rules on header-in-content pages */
html:not([data-theme="light"]) body.single .entry-content .dgv2 a.dgv2-brand,
html:not([data-theme="light"]) body.single .entry-content .dgv2 a.dgv2-brand:link,
html:not([data-theme="light"]) body.single .entry-content .dgv2 a.dgv2-brand:visited,
html[data-theme="light"] body.single .entry-content .dgv2 a.dgv2-brand,
html[data-theme="light"] body.single .entry-content .dgv2 a.dgv2-brand:link,
html[data-theme="light"] body.single .entry-content .dgv2 a.dgv2-brand:visited{color:#fff;}
/* ============================================================
   2. Mobile drawer - full-screen dark panel
   ============================================================ */
.dgv2-drawer{position:fixed;inset:0;z-index:80;background:#0C0C0E;color:#fff;overflow-y:auto;-webkit-overflow-scrolling:touch;transform:translateX(-102%);transition:transform .28s ease;visibility:hidden;}
html.dgv2-drawer-open .dgv2-drawer{transform:translateX(0);visibility:visible;}
.dgv2-drawer-top{display:flex;align-items:center;justify-content:space-between;padding:8px 16px;border-bottom:1px solid #1E1E22;}
.dgv2-drawer-search{padding:16px;}
.dgv2-drawer-search form{display:flex;align-items:center;gap:8px;background:#1D1D22;border:1px solid #2A2A30;border-radius:999px;padding:0 8px 0 18px;}
.dgv2-drawer-search input{flex:1;min-width:0;background:transparent;border:0;color:#fff;font-size:16px;min-height:52px;outline:none;}
.dgv2-drawer-search input::placeholder{color:#8A8A94;}
.dgv2-drawer-search button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;background:transparent;border:0;color:#fff;}
.dgv2-drawer-search button svg{width:22px;height:22px;}
.dgv2-drawer nav{padding:4px 0 24px;}
.dgv2-drawer-list{list-style:none;margin:0;padding:0;}
.dgv2-drawer-list>li{border-bottom:1px solid #191920;}
.dgv2-drawer-list a.dgv2-drawer-link,.dgv2-drawer-group{display:flex;align-items:center;justify-content:space-between;width:100%;box-sizing:border-box;min-height:52px;padding:14px 20px;color:#fff;text-decoration:none;font-size:1.125rem;background:transparent;border:0;text-align:left;}
.dgv2-drawer-link:hover,.dgv2-drawer-group:hover{background:#141417;}
.dgv2-drawer-link .chev,.dgv2-drawer-group .chev{width:20px;height:20px;color:#8A8A94;flex:none;transition:transform .2s ease;}
.dgv2-drawer-group.dgv2-group-open .chev{transform:rotate(90deg);}
.dgv2-drawer-sub{list-style:none;margin:0;padding:0;background:#101013;display:none;}
.dgv2-drawer-group.dgv2-group-open+.dgv2-drawer-sub{display:block;}
.dgv2-drawer-sub a{display:block;min-height:48px;padding:13px 20px 13px 34px;color:#C9C9D1;text-decoration:none;font-size:16px;}
.dgv2-drawer-sub a:hover{color:#fff;}
.dgv2-drawer-foot{padding:20px;border-top:1px solid #1E1E22;}
.dgv2-social{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 18px;padding:0;list-style:none;}
.dgv2-social a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #3A3A42;border-radius:50%;color:#fff;text-decoration:none;}
.dgv2-social a:hover{border-color:var(--amber);color:var(--amber);}
.dgv2-social svg{width:20px;height:20px;}
.dgv2-drawer-legal{margin:0;font-size:.875rem;line-height:2;color:#8A8A94;}
.dgv2-drawer-legal a{color:#8A8A94;text-decoration:none;}
.dgv2-drawer-legal a:hover{color:#fff;}
/* ============================================================
   3. Search overlay - full-screen dark
   ============================================================ */
.dgv2-search{position:fixed;inset:0;z-index:90;background:rgba(12,12,14,.98);color:#fff;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .22s ease;}
html.dgv2-search-open .dgv2-search{opacity:1;visibility:visible;}
.dgv2-search-in{max-width:var(--dgv2-maxw);margin:0 auto;padding:12px 20px 40px;}
.dgv2-search-top{display:flex;justify-content:flex-start;margin-bottom:20px;}
.dgv2-search-form{display:flex;align-items:center;gap:8px;background:#1D1D22;border:1px solid #2A2A30;border-radius:999px;padding:0 8px 0 20px;}
.dgv2-search-form input{flex:1;min-width:0;background:transparent;border:0;color:#fff;font-size:18px;min-height:56px;outline:none;}
.dgv2-search-form input::placeholder{color:#8A8A94;}
.dgv2-search-form button{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;background:transparent;border:0;color:#fff;}
.dgv2-search-form button svg{width:24px;height:24px;}
.dgv2-search-label{display:block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#8A8A94;margin:28px 0 4px;}
.dgv2-search-list{list-style:none;margin:0;padding:0;}
.dgv2-search-list li{border-bottom:1px solid #1E1E22;}
.dgv2-search-list a{display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:14px 4px;color:#fff;text-decoration:none;font-size:1.125rem;}
.dgv2-search-list a:hover{color:var(--amber);}
.dgv2-search-list svg{width:20px;height:20px;color:#8A8A94;flex:none;}
/* ============================================================
   4. Article TOC card - collapsible, theme surface
   ============================================================ */
.dgv2-toc{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);margin:24px 0;overflow:hidden;}
.dgv2-toc summary{display:flex;align-items:center;justify-content:space-between;min-height:56px;padding:14px 20px;cursor:pointer;list-style:none;font-weight:700;font-size:1.125rem;color:var(--text);}
.dgv2-toc summary::-webkit-details-marker{display:none;}
.dgv2-toc summary .chev{width:22px;height:22px;color:var(--muted);flex:none;transition:transform .2s ease;}
.dgv2-toc[open] summary .chev{transform:rotate(180deg);}
.dgv2-toc-list{list-style:none;margin:0;padding:4px 20px 20px;}
.dgv2-toc-list li{border-top:1px solid var(--border);}
.dgv2-toc-list a{display:block;min-height:44px;padding:11px 0;color:var(--muted);text-decoration:none;font-size:1rem;line-height:1.45;}
.dgv2-toc-list a:hover{color:var(--kicker);}
/* ============================================================
   5. Keep reading to learn - amber square bullets
   ============================================================ */
.dgv2-keepreading{margin:28px 0;}
.dgv2-keepreading-title{font-weight:700;font-size:1.125rem;margin:0 0 12px;color:var(--text);}
.dgv2-keepreading ul{list-style:none;margin:0;padding:0;}
.dgv2-keepreading li{position:relative;padding:7px 0 7px 26px;font-size:16px;line-height:1.55;color:var(--text);}
.dgv2-keepreading li::before{content:"";position:absolute;left:2px;top:16px;width:9px;height:9px;background:var(--amber);border-radius:2px;}
/* ============================================================
   6. Compact horizontal card - 120px rounded thumb, 2-line clamp
   ============================================================ */
.dgv2-hcards{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:22px;}
a.dgv2-hcard{display:flex;gap:14px;text-decoration:none;color:var(--text);min-width:0;overflow:hidden;align-items:flex-start;}
.dgv2-hcard-thumb{flex:0 0 120px;width:120px;height:96px;border-radius:12px;overflow:hidden;background:var(--surface-2);}
.dgv2-hcard-thumb img{width:100%;height:100%;object-fit:cover;}
.dgv2-hcard-body{flex:1;min-width:0;display:flex;flex-direction:column;}
.dgv2-hcard-title{display:block;font-size:1.125rem;line-height:1.35;font-weight:700;color:var(--text);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
a.dgv2-hcard:hover .dgv2-hcard-title{color:var(--kicker);}
.dgv2-hcard .dgv2-meta{margin:8px 0 0;}
/* Sponsored variant - explicit disclosure, NOT blended like cybernews.
   Kicker badge is an outline pill (amber reserved for editorial kickers/CTAs). */
.dgv2-kicker-sponsored{display:inline-block;align-self:flex-start;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border:1px solid var(--border);border-radius:999px;padding:4px 10px;margin:0 0 8px;}
.dgv2-hcard.dgv2-sponsored{border:1px dashed var(--border);border-radius:var(--radius-lg);padding:14px;}
.dgv2-disclose{display:block;font-size:12px;color:var(--muted);margin:8px 0 0;line-height:1.5;}
/* ============================================================
   7. Feature card - big image, kicker, headline, dek, meta
   ============================================================ */
a.dgv2-fcard{display:block;text-decoration:none;color:var(--text);min-width:0;overflow:hidden;}
.dgv2-fcard-media{display:block;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-2);aspect-ratio:16/9;}
.dgv2-fcard-media img{width:100%;height:100%;object-fit:cover;}
.dgv2-fcard-body{display:block;padding:18px 4px 0;}
.dgv2-fcard-title{display:block;font-size:24px;line-height:1.25;font-weight:700;letter-spacing:-.01em;color:var(--text);margin:0 0 10px;}
a.dgv2-fcard:hover .dgv2-fcard-title{color:var(--kicker);}
.dgv2-fcard-dek{display:block;font-size:16px;line-height:1.55;color:var(--muted);margin:0;}
/* ============================================================
   8. Section head with arrow link
   ============================================================ */
.dgv2-sechead{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:36px 0 18px;min-width:0;}
.dgv2-sechead h2{font-size:24px;font-weight:700;letter-spacing:-.01em;margin:0;color:var(--text);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
a.dgv2-sechead-link{display:inline-flex;align-items:center;gap:6px;flex:none;min-width:44px;min-height:44px;text-decoration:none;color:var(--kicker);font-weight:700;font-size:1rem;}
a.dgv2-sechead-link svg{width:20px;height:20px;}
a.dgv2-sechead-link .lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
/* ============================================================
   9. Newsletter panel - dark panel in BOTH themes (brand chrome)
   ============================================================ */
.dgv2-news{background:#141417;color:#fff;border:1px solid #232328;border-radius:20px;padding:32px 24px;margin:36px 0;}
.dgv2-news-title{font-size:24px;font-weight:700;letter-spacing:-.01em;margin:0 0 8px;line-height:1.25;}
.dgv2-news-sub{font-size:1rem;line-height:1.55;color:#B9B9C2;margin:0 0 20px;}
.dgv2-news-opts{display:flex;gap:24px;flex-wrap:wrap;margin:0 0 18px;}
.dgv2-news-opt{display:inline-flex;align-items:center;gap:10px;font-size:1rem;min-height:44px;cursor:pointer;}
.dgv2-news-opt input{width:22px;height:22px;accent-color:var(--amber);flex:none;}
.dgv2-news-form{display:flex;flex-direction:column;gap:12px;}
.dgv2-news-form label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.dgv2-news-form input[type="email"]{width:100%;box-sizing:border-box;background:#232328;border:1px solid #33333A;border-radius:12px;color:#fff;font-size:16px;min-height:54px;padding:12px 18px;outline:none;}
.dgv2-news-form input[type="email"]::placeholder{color:#8A8A94;}
.dgv2-news-form input[type="email"]:focus{border-color:var(--amber);}
/* CTA - amber bg, dark label in BOTH themes. Specificity beats the
   0,3,3 global .entry-content a rules (BUTTON LAW). */
button.dgv2-cta,a.dgv2-cta{display:inline-flex;align-items:center;justify-content:center;min-height:54px;padding:14px 28px;background:var(--cta-bg);color:var(--cta-text);border:0;border-radius:12px;font-size:18px;font-weight:700;text-decoration:none;width:100%;box-sizing:border-box;}
button.dgv2-cta:hover,a.dgv2-cta:hover{background:#FBBF24;}
html:not([data-theme="light"]) body.single .entry-content .dgv2 a.dgv2-cta,
html:not([data-theme="light"]) body.single .entry-content .dgv2 a.dgv2-cta:link,
html:not([data-theme="light"]) body.single .entry-content .dgv2 a.dgv2-cta:visited,
html:not([data-theme="light"]) body.single .entry-content .dgv2 a.dgv2-cta:hover,
html:not([data-theme="light"]) body.single .entry-content .dgv2 a.dgv2-cta:active,
html[data-theme="light"] body.single .entry-content .dgv2 a.dgv2-cta,
html[data-theme="light"] body.single .entry-content .dgv2 a.dgv2-cta:link,
html[data-theme="light"] body.single .entry-content .dgv2 a.dgv2-cta:visited,
html[data-theme="light"] body.single .entry-content .dgv2 a.dgv2-cta:hover,
html[data-theme="light"] body.single .entry-content .dgv2 a.dgv2-cta:active{color:var(--cta-text);background:var(--cta-bg);}
.dgv2-news-fine{font-size:.875rem;line-height:1.6;color:#8A8A94;margin:16px 0 0;text-align:center;}
.dgv2-news-fine a{color:#B9B9C2;}
/* ============================================================
   10. Footer - dark in BOTH themes (brand chrome)
   ============================================================ */
.dgv2-footer{background:#0A0A0C;color:#fff;margin:48px 0 0;}
.dgv2-footer-in{max-width:var(--dgv2-maxw);margin:0 auto;padding:40px 20px 28px;}
.dgv2-footer-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 20px;margin:0 0 28px;}
.dgv2-footer-col h3{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#8A8A94;margin:0 0 14px;}
.dgv2-footer-col ul{list-style:none;margin:0;padding:0;}
.dgv2-footer-col li{margin:0;}
.dgv2-footer-col a{display:inline-block;min-height:44px;padding:10px 0;color:#C9C9D1;text-decoration:none;font-size:1rem;line-height:1.4;}
.dgv2-footer-col a:hover{color:#fff;}
.dgv2-footer .dgv2-social{margin:0 0 24px;}
.dgv2-footer-legal{border-top:1px solid #1E1E22;padding-top:20px;font-size:.875rem;line-height:2.1;color:#8A8A94;}
.dgv2-footer-legal nav{display:flex;flex-wrap:wrap;gap:4px 20px;margin:0 0 12px;}
.dgv2-footer-legal a{color:#8A8A94;text-decoration:none;}
.dgv2-footer-legal a:hover{color:#fff;}
.dgv2-footer-copy{margin:0;}
/* ============================================================
   11. Floating back-to-top - 56px circle, amber CTA
   ============================================================ */
button.dgv2-top{position:fixed;right:20px;bottom:24px;z-index:70;width:56px;height:56px;border-radius:50%;background:var(--cta-bg);border:0;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 6px 20px rgba(0,0,0,.35);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .22s ease,transform .22s ease,visibility .22s;}
button.dgv2-top svg{width:26px;height:26px;color:var(--on-amber);}
html.dgv2-top-show button.dgv2-top{opacity:1;visibility:visible;transform:translateY(0);}
/* ============================================================
   12. Demo page scaffolding (preview only, not shipped)
   ============================================================ */
.dgv2-demo{max-width:var(--dgv2-maxw);margin:0 auto;padding:0 20px 60px;}
.dgv2-demo>h2.dgv2-demo-label{font-size:.875rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:48px 0 16px;padding-top:24px;border-top:1px dashed var(--border);}
.dgv2-demo-note{font-size:14px;color:var(--muted);line-height:1.6;margin:0 0 16px;}
@media (prefers-reduced-motion:reduce){
  .dgv2-drawer,.dgv2-search,button.dgv2-top,.dgv2-drawer-group .chev,.dgv2-toc summary .chev{transition:none;}
}

/* v2 component constants (build-defined; NOT theme tokens — do not move to tokens.css) */
:root{--dgv2-maxw:720px;}
