:root{
  --bg:#f4f6fb;--card:#ffffff;--ink:#0d1222;--ink2:#4a5370;--ink3:#8089a3;--line:#e3e7f0;
  --acc:#ff3d2e;--acc2:#7b5cff;--acc3:#00c2ff;--chip:#eef1f8;--shadow:0 1px 2px rgba(13,18,34,.05),0 8px 24px -12px rgba(13,18,34,.18);
  --r:16px;--hdr:rgba(255,255,255,.82);
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --bg:#070a14;--card:#0f1424;--ink:#eef1fb;--ink2:#a9b1cc;--ink3:#6b7493;--line:#1c2338;--chip:#161d31;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px -14px rgba(0,0,0,.8);--hdr:rgba(7,10,20,.8)}}
:root[data-theme=dark]{
  --bg:#070a14;--card:#0f1424;--ink:#eef1fb;--ink2:#a9b1cc;--ink3:#6b7493;--line:#1c2338;--chip:#161d31;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 10px 30px -14px rgba(0,0,0,.8);--hdr:rgba(7,10,20,.8)}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:1240px;margin:0 auto;padding:0 16px}

/* ---------- header */
.top{position:sticky;top:0;z-index:50;background:var(--hdr);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:18px;height:62px}
.logo{font:700 24px/1 "Space Grotesk",Inter,sans-serif;letter-spacing:-.5px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.bolt{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;font-size:18px;
  background:linear-gradient(135deg,var(--acc),#ff8a3d 50%,var(--acc2));box-shadow:0 6px 20px -6px var(--acc);animation:pulse 3s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 6px 28px -4px var(--acc2)}}
.search{flex:1;max-width:560px}
.search input{width:100%;height:42px;border-radius:999px;border:1px solid var(--line);background:var(--chip);color:var(--ink);
  padding:0 18px 0 42px;font:inherit;outline:none;transition:.2s;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%238089a3' stroke-width='2.2'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:15px 50%}
.search input:focus{border-color:var(--acc2);box-shadow:0 0 0 4px color-mix(in srgb,var(--acc2) 18%,transparent);background-color:var(--card)}
.search.big input{height:54px;font-size:18px}
.tools{margin-left:auto;display:flex;align-items:center;gap:12px;color:var(--ink2);font-size:13px;white-space:nowrap}
.themebtn{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--card);color:var(--ink);font-size:18px;cursor:pointer}
.tabs{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding-bottom:0}
.tabs::-webkit-scrollbar{display:none}
.tabs a{display:flex;gap:6px;align-items:center;padding:10px 14px 12px;font-weight:600;font-size:14px;color:var(--ink2);border-bottom:3px solid transparent;white-space:nowrap;transition:.2s}
.tabs a span{font-size:14px}
.tabs a:hover{color:var(--ink)}
.tabs a.on{color:var(--ink);border-color:var(--acc)}

/* ---------- ticker */
.ticker{display:flex;align-items:center;background:linear-gradient(90deg,#0d1222,#1a1440);color:#fff;font-size:13px;height:36px;overflow:hidden}
.live{flex:none;background:var(--acc);font-weight:800;letter-spacing:1px;padding:0 14px;height:100%;display:flex;align-items:center;gap:6px}
.live:before{content:"";width:7px;height:7px;border-radius:50%;background:#fff;animation:blink 1.2s infinite}
@keyframes blink{50%{opacity:.2}}
.tk{overflow:hidden;flex:1;mask-image:linear-gradient(90deg,transparent,#000 30px,#000 calc(100% - 30px),transparent)}
.tkin{display:inline-flex;white-space:nowrap;animation:scroll 120s linear infinite}
.tkin:hover{animation-play-state:paused}
.tkin a{padding:0 28px;opacity:.9}
.tkin a:hover{opacity:1;text-decoration:underline}
.tkin b{color:#ffb4ad;margin-right:6px}
@keyframes scroll{to{transform:translateX(-50%)}}

/* ---------- layout */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;margin-top:22px}
.sh{font:700 20px/1.2 "Space Grotesk",Inter,sans-serif;margin:30px 0 14px;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.sh small{font:500 12px Inter,sans-serif;color:var(--ink3)}
.sh a{display:flex;gap:8px;align-items:center}
.sh a span{color:var(--acc);font-size:24px;transition:.2s}
.sh a:hover span{transform:translateX(4px)}
.topst .sh{margin-top:4px}
.ph{font:700 32px/1.15 "Space Grotesk",Inter,sans-serif;margin:6px 0 14px;letter-spacing:-.5px}

/* ---------- source line */
.src{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink2);font-weight:600;min-width:0}
.src span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.src time{color:var(--ink3);font-weight:500;white-space:nowrap}
.src time:before{content:"\00b7";margin-right:6px}
.fav{width:16px;height:16px;border-radius:4px;flex:none;background:var(--chip)}
.badge{margin-left:auto;font-size:11px;font-weight:700;color:var(--acc2);background:color-mix(in srgb,var(--acc2) 12%,transparent);padding:2px 8px;border-radius:999px;white-space:nowrap}

/* ---------- images */
.thumb,.lthumb,.rthumb{position:relative;overflow:hidden;background:var(--chip)}
.thumb img,.lthumb img,.rthumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.noimg:after{content:attr(data-l);position:absolute;inset:0;display:grid;place-items:center;font:700 42px "Space Grotesk",sans-serif;color:rgba(255,255,255,.9)}
.noimg img{display:none}
.noimg.sec-top,.noimg.sec-us{background:linear-gradient(135deg,#ff3d2e,#7b5cff)}
.noimg.sec-world{background:linear-gradient(135deg,#00b4d8,#0353a4)}
.noimg.sec-business{background:linear-gradient(135deg,#0ead69,#0b6e4f)}
.noimg.sec-tech{background:linear-gradient(135deg,#7b5cff,#00c2ff)}
.noimg.sec-crypto{background:linear-gradient(135deg,#f7931a,#c4471b)}
.noimg.sec-sports{background:linear-gradient(135deg,#2ec4b6,#1d3557)}
.noimg.sec-entertainment{background:linear-gradient(135deg,#ff4fa3,#7b2cbf)}
.noimg.sec-spirit{background:linear-gradient(135deg,#3a0ca3,#f72585 60%,#ffd166)}

/* ---------- lead (top story) */
.lead{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:20px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px;margin-bottom:14px;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}
.lead:hover{transform:translateY(-2px)}
.limg{display:block}
.lthumb{aspect-ratio:16/10;border-radius:12px;height:100%;max-height:260px;width:100%}
.lead:hover .lthumb img{transform:scale(1.05)}
.lbody{display:flex;flex-direction:column;gap:6px;min-width:0;padding:4px 4px 4px 0}
.lbody h2{font:700 20px/1.3 Inter,sans-serif;margin:2px 0;letter-spacing:-.2px}
.lbody h2:hover,.card:hover h3,.row:hover h3{color:var(--acc)}
.lbody p{margin:0;color:var(--ink2);font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rel{list-style:none;margin:6px 0 0;padding:8px 0 0;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:6px}
.rel a{font-size:13.5px;color:var(--ink);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.rel a:hover{color:var(--acc)}
.rel b{color:var(--acc2);font-weight:700;margin-right:4px}

/* ---------- cards & grids */
.grid{display:grid;gap:14px}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-feat{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-3px)}
.card:hover img{transform:scale(1.06)}
.card .thumb{aspect-ratio:16/9}
.cbody{padding:12px 14px 14px;display:flex;flex-direction:column;gap:6px}
.card h3{margin:0;font-size:15.5px;line-height:1.35;font-weight:700;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;transition:color .2s}
.g-feat>.card .thumb{aspect-ratio:16/10}
.g-feat>.card h3{font-size:18px}
.stack{display:flex;flex-direction:column;gap:10px}
.row{display:flex;gap:14px;align-items:flex-start;justify-content:space-between;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px;transition:transform .2s,border-color .2s}
.row:hover{border-color:color-mix(in srgb,var(--acc) 40%,var(--line))}
.rbody{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
.row h3{margin:0;font-size:15px;line-height:1.35;font-weight:700;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;transition:color .2s}
.row p{margin:0;font-size:13.5px;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rthumb{flex:none;width:112px;height:84px;border-radius:10px}
.rthumb.noimg:after{font-size:28px}
.stack .row p{display:none}
.stack .rthumb{width:88px;height:66px}
.list{display:flex;flex-direction:column;gap:10px}
.hero3{margin-bottom:6px}
.hero3 .card h3{font-size:16.5px}
.secblock{scroll-margin-top:120px}

/* ---------- sidebar */
.side{display:flex;flex-direction:column;gap:18px}
.panel{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:var(--shadow)}
.panel h4{margin:0 0 10px;font:700 16px "Space Grotesk",Inter,sans-serif}
.trend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.trend a{display:flex;gap:12px;padding:9px 0;border-top:1px solid var(--line)}
.trend li:first-child a{border-top:0}
.num{flex:none;font:700 22px/1 "Space Grotesk",sans-serif;background:linear-gradient(135deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent;width:24px}
.trend b{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px;line-height:1.35}
.trend small{display:block;color:var(--ink3);font-size:11.5px;margin-top:3px}
.trend a:hover b{color:var(--acc)}
.latest{list-style:none;margin:0;padding:0}
.latest a{display:flex;gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:13.5px;line-height:1.35}
.latest li:first-child a{border-top:0}
.latest time{flex:none;width:52px;color:var(--acc);font-weight:700;font-size:12px}
.latest a:hover span{color:var(--acc)}
.mk{display:flex;flex-direction:column;gap:2px}
.mkr{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-top:1px solid var(--line);font-size:14px}
.mkr:first-child{border-top:0}
.mkr b{font-weight:700}.mkr span{font-variant-numeric:tabular-nums}
.up{color:#0ead69;font-weight:700;font-size:12px}.dn{color:#ff3d2e;font-weight:700;font-size:12px}
.mknote{color:var(--ink3);font-size:11px}
.sticky{position:sticky;top:120px}

/* ---------- ads */
.ad{display:block;position:relative;border-radius:var(--r);overflow:hidden;text-align:center}
.adlbl{position:absolute;top:6px;left:10px;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--ink3);font-weight:700}
.ad:not(.house){padding-top:22px;background:var(--card);border:1px solid var(--line)}
.house{padding:22px 12px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1.5px dashed color-mix(in srgb,var(--acc2) 45%,var(--line));
  background:linear-gradient(135deg,color-mix(in srgb,var(--acc2) 7%,var(--card)),color-mix(in srgb,var(--acc) 6%,var(--card)));transition:.25s}
.house:hover{border-style:solid;transform:translateY(-2px)}
.house strong{font:700 18px "Space Grotesk",sans-serif}
.adsz{font-size:12px;color:var(--ink2)}
.adcta{font-size:12px;font-weight:700;color:var(--acc)}
.ad-leaderboard{min-height:90px;margin-top:18px}
.ad-footer{min-height:90px;margin:26px 0 0}
.ad-sidebar_top{min-height:250px}
.ad-sidebar_tall{min-height:600px}
.infeed{min-height:110px;margin:4px 0 14px}
.list .infeed{margin:4px 0}
.native .thumb.nat{background:linear-gradient(135deg,#ffd166,#ff3d2e 45%,#7b5cff);display:grid;place-items:center}
.native .thumb.nat:after{content:"Your ad here";font:700 22px "Space Grotesk",sans-serif;color:#fff}
.spons{font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:var(--ink3);font-weight:700}

/* ---------- more grid */
.more{margin-top:12px}

/* ---------- chips */
.chips{display:flex;gap:8px;overflow-x:auto;padding-bottom:12px;scrollbar-width:none}
.chips::-webkit-scrollbar{display:none}
.chip{flex:none;border:1px solid var(--line);background:var(--card);color:var(--ink2);border-radius:999px;padding:7px 14px;font:600 13px Inter,sans-serif;cursor:pointer;transition:.2s}
.chip.on,.chip:hover{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.hide{display:none!important}

/* ---------- doc pages */
.doc{max-width:860px;padding-top:26px;padding-bottom:20px}
.doc h2{font:700 22px "Space Grotesk",sans-serif;margin:32px 0 12px}
.lede{font-size:18px;color:var(--ink2);line-height:1.6}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}
.stats div{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:18px;text-align:center}
.stats b{display:block;font:700 28px "Space Grotesk",sans-serif;background:linear-gradient(135deg,var(--acc),var(--acc2));-webkit-background-clip:text;background-clip:text;color:transparent}
.stats span{color:var(--ink2);font-size:13px}
.rates{width:100%;border-collapse:collapse;background:var(--card);border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}
.rates th,.rates td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line);font-size:14px}
.rates th{background:var(--chip);font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--ink2)}
.rates tr:target{background:color-mix(in srgb,var(--acc2) 12%,transparent)}
.why li{margin:8px 0}
.btn{display:inline-block;margin-top:20px;background:linear-gradient(135deg,var(--acc),var(--acc2));color:#fff;font-weight:700;padding:14px 22px;border-radius:999px;box-shadow:0 10px 30px -10px var(--acc)}
.note,.sinfo{color:var(--ink2)}
.srcs{color:var(--ink2);line-height:1.8}
.empty{padding:40px;text-align:center;color:var(--ink2);background:var(--card);border-radius:var(--r);border:1px dashed var(--line)}

/* ---------- footer */
.foot{margin-top:40px;border-top:1px solid var(--line);background:var(--card);padding:34px 0 0}
.foot .wrap{display:grid;grid-template-columns:2fr 1fr 1fr;gap:30px}
.foot p{color:var(--ink2);font-size:14px}.foot .small{font-size:12px;color:var(--ink3)}
.fc{display:flex;flex-direction:column;gap:7px;font-size:14px;color:var(--ink2)}
.fc a:hover{color:var(--acc)}
.fc h5{margin:0 0 4px;font-size:12px;text-transform:uppercase;letter-spacing:1px;color:var(--ink3)}
.foot .copy{display:block;padding:18px 16px;margin-top:20px;border-top:1px solid var(--line);font-size:12px;color:var(--ink3)}

/* ---------- reveal animation */
.rv{opacity:0;transform:translateY(14px)}
.rv.in{opacity:1;transform:none;transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.tkin,.bolt{animation:none}}

/* ---------- responsive */
@media (max-width:1020px){
  .layout{grid-template-columns:minmax(0,1fr)}
  .side{display:grid;grid-template-columns:1fr 1fr}
  .ad-sidebar_tall{display:none}
  .g4{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:720px){
  .today{display:none}
  .bar{gap:10px;height:56px}
  .logo{font-size:20px}.bolt{width:30px;height:30px}
  .search input{height:38px}
  .lead{grid-template-columns:1fr;padding:10px}
  .lthumb{max-height:none}
  .g3,.g-feat{grid-template-columns:1fr}
  .g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g4 .card h3{font-size:14px}
  .side{grid-template-columns:1fr}
  .ad-leaderboard,.ad-footer{min-height:70px}
  .ad-sidebar_top{min-height:200px}
  .stats{grid-template-columns:repeat(2,1fr)}
  .foot .wrap{grid-template-columns:1fr 1fr}.fl{grid-column:1/-1}
  .ph{font-size:26px}
  .rthumb{width:92px;height:72px}
}
@media (max-width:420px){.logo{font-size:0;gap:0}.logo .bolt{font-size:17px}}

/* ---------- FlashFeed Briefs */
.bb{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;
  color:#fff;background:linear-gradient(135deg,var(--acc),var(--acc2));padding:3px 9px;border-radius:999px;white-space:nowrap}
.bcard .src time:before{content:""}
.bcard .src{gap:8px}
.bdek{margin:0;font-size:13.5px;color:var(--ink2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bsrc{font-size:12px;font-weight:700;color:var(--acc2)}
.bcard{border-color:color-mix(in srgb,var(--acc2) 30%,var(--line))}
.g-briefs{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-briefs .big{grid-column:1/-1;flex-direction:row}
.g-briefs .big .thumb{width:55%;aspect-ratio:16/9;flex:none}
.g-briefs .big .cbody{justify-content:center;padding:18px 22px}
.g-briefs .big h3{font-size:22px;-webkit-line-clamp:4}
.g-briefs .big .bdek{-webkit-line-clamp:3;font-size:15px}
.g-briefs.all{grid-template-columns:repeat(2,minmax(0,1fr))}
.briefstrip{margin-bottom:10px}.briefstrip .sh{margin-top:4px}
.readbrief{display:inline-block;margin-top:8px;font-size:13px;font-weight:700;color:var(--acc)}
.readbrief:hover{text-decoration:underline}
.story{max-width:760px}
.story .kicker{display:flex;gap:10px;align-items:center;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.6px;color:var(--acc)}
.story h1{font:700 38px/1.15 "Space Grotesk",Inter,sans-serif;letter-spacing:-.6px;margin:12px 0 10px}
.story .dek{font-size:19px;line-height:1.5;color:var(--ink2);margin:0 0 12px}
.story .meta{font-size:13px;color:var(--ink3);padding-bottom:16px;border-bottom:1px solid var(--line)}
.story .hero{margin:18px 0 6px}
.story .hero img{width:100%;max-height:440px;object-fit:cover;border-radius:var(--r);display:block;background:var(--chip)}
.story figcaption{font-size:12px;color:var(--ink3);margin-top:6px}
.story figcaption a{text-decoration:underline}
.sbody p,.story>p{font-size:17.5px;line-height:1.75;margin:16px 0}
.story h2{font:700 22px "Space Grotesk",Inter,sans-serif;margin:30px 0 8px}
.facts{background:linear-gradient(135deg,color-mix(in srgb,var(--acc2) 8%,var(--card)),var(--card));border:1px solid var(--line);
  border-left:4px solid var(--acc2);border-radius:var(--r);padding:16px 20px;margin:22px 0}
.facts h3{margin:0 0 8px;font:700 17px "Space Grotesk",sans-serif}
.facts ul{margin:0;padding-left:20px}.facts li{margin:7px 0;font-size:15.5px}
.tl{list-style:none;margin:0;padding:0 0 0 18px;border-left:2px solid var(--line)}
.tl li{position:relative;display:flex;gap:12px;padding:8px 0;font-size:14.5px}
.tl li:before{content:"";position:absolute;left:-24px;top:14px;width:10px;height:10px;border-radius:50%;background:var(--acc)}
.tl time{flex:none;width:76px;color:var(--ink3);font-size:12.5px;font-weight:600;padding-top:2px}
.tl a:hover,.srcl a:hover{color:var(--acc)}
.srcl{list-style:none;margin:0;padding:0}
.srcl li{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-top:1px solid var(--line);font-size:14.5px}
.srcl .fav{margin-top:3px}
.tagrow{margin-top:22px}
.disclose{font-size:13px!important;line-height:1.6!important;color:var(--ink3);background:var(--chip);border-radius:12px;padding:14px 16px}
.lede.small{font-size:16px;margin-top:-4px}
@media (max-width:720px){
  .g-briefs,.g-briefs.all{grid-template-columns:1fr}
  .g-briefs .big{flex-direction:column}.g-briefs .big .thumb{width:100%}
  .g-briefs .big h3{font-size:19px}
  .story h1{font-size:28px}.story .dek{font-size:17px}
  .sbody p{font-size:16.5px}
}

/* ---------- Social Buzz: videos */
.g-vid{grid-template-columns:repeat(2,minmax(0,1fr))}
.g-vid.all{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-vid .big{grid-column:1/-1}
.g-vid .vcard.big h3{font-size:19px}
.g-shorts{grid-template-columns:repeat(4,minmax(0,1fr))}
.g-shorts .yt{aspect-ratio:9/16}
.vcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;height:100%}
.yt{position:relative;aspect-ratio:16/9;background:#000;cursor:pointer;overflow:hidden}
.yt img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s,opacity .3s;opacity:.92}
.yt:hover img{transform:scale(1.05);opacity:1}
.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:62px;height:62px;border-radius:50%;display:grid;place-items:center;
  font-size:22px;color:#fff;background:rgba(255,0,0,.88);box-shadow:0 10px 30px -6px rgba(255,0,0,.7);transition:transform .25s;padding-left:4px}
.yt:hover .play{transform:translate(-50%,-50%) scale(1.12)}
.yt:focus-visible{outline:3px solid var(--acc2);outline-offset:2px}
.vbody{padding:11px 14px 13px;display:flex;flex-direction:column;gap:6px}
.vbody h3{margin:0;font-size:15px;line-height:1.35;font-weight:700;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.vbody .src em{font-style:normal;color:var(--ink3);font-weight:500;white-space:nowrap}
.vbody .src em:before{content:"\00b7";margin-right:6px}
.ytb{display:inline-grid;place-items:center;width:18px;height:13px;border-radius:3px;background:#ff0000;color:#fff;font-size:7px;flex:none}
.vstrip{margin-top:10px}
.vwrap{display:block}

/* ---------- Social Buzz: posts */
.buzz{padding-top:6px}
.posts{columns:2 520px;column-gap:18px}
.post{break-inside:avoid;margin:0 0 18px;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px;box-shadow:var(--shadow);overflow:hidden}
.phead{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;color:var(--ink2);margin-bottom:8px;flex-wrap:wrap}
.pdot{width:10px;height:10px;border-radius:50%}
.pnote{flex-basis:100%;margin:2px 0 0;text-transform:none;letter-spacing:0;font-weight:600;font-size:14px;color:var(--ink)}
.pbody{display:flex;justify-content:center}
.pbody iframe.fbembed{max-width:100%;background:#fff;border-radius:10px}
.pbody blockquote{margin:0!important;max-width:100%!important;min-width:0!important;width:100%}
.plink{display:flex;flex-direction:column;gap:4px;padding:16px;border-radius:12px;background:var(--chip);width:100%}
.plink span{font-size:12px;color:var(--ink3)}
@media (max-width:1020px){.g-vid.all{grid-template-columns:repeat(2,minmax(0,1fr))}.g-shorts{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:720px){.g-vid,.g-vid.all{grid-template-columns:1fr}.g-shorts{grid-template-columns:repeat(2,minmax(0,1fr))}.posts{columns:1}}
.pbody .vcard{width:100%;box-shadow:none}

/* ---------- Mixed vertical + horizontal blocks */
.mix{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:6px;grid-auto-flow:row dense;column-gap:16px;margin-top:6px}
.tile{min-width:0;grid-row-end:span 50}
.tin{padding-bottom:16px}
.t-w{grid-column:span 2}
.t-f{grid-column:1/-1}
.tile .vcard,.tile .card,.tile .post{height:auto}
.tile .post{margin:0}
.vcard.vert .yt{aspect-ratio:9/16}
.vcard.vert .yt img{object-fit:cover}
.vcard.vert .play{width:54px;height:54px;font-size:19px}
.tile .card .thumb{aspect-ratio:16/10}
.tile .ad{margin:0;border-radius:var(--r)}
.tile .ad-mix_square{aspect-ratio:300/250}
.tile .ad-mix_tall{aspect-ratio:300/600}
.tile .ad-mix_billboard{min-height:220px}
.tile .ad-mix_story{aspect-ratio:9/16}
.tile .house.ad-mix_story{border:none;color:#fff;background:linear-gradient(165deg,#1a1440 0%,#7b5cff 45%,#ff3d2e 80%,#ffb020 100%)}
.tile .house.ad-mix_story .adlbl,.tile .house.ad-mix_story .adsz{color:rgba(255,255,255,.8)}
.tile .house.ad-mix_story .adcta{color:#fff}
.storyplay{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-size:24px;padding-left:4px;
  background:rgba(255,255,255,.18);border:2px solid rgba(255,255,255,.7);margin-bottom:10px;animation:pulse2 2.4s ease-in-out infinite}
@keyframes pulse2{50%{transform:scale(1.08);background:rgba(255,255,255,.28)}}
.tile .house.ad-mix_tall{background:linear-gradient(180deg,color-mix(in srgb,var(--acc2) 10%,var(--card)),color-mix(in srgb,var(--acc) 10%,var(--card)))}
.tile .house.ad-mix_billboard{background:linear-gradient(90deg,color-mix(in srgb,var(--acc) 10%,var(--card)),color-mix(in srgb,var(--acc2) 12%,var(--card)),color-mix(in srgb,var(--acc3) 10%,var(--card)))}
.tile .house.ad-mix_billboard strong{font-size:26px}
.vstrip .mix{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:900px){
  .mix,.vstrip .mix{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px}
  .tin{padding-bottom:12px}
}
@media (max-width:600px){
  .emb{grid-column:1/-1}
  .tile .house.ad-mix_billboard strong{font-size:20px}
  .tile .card h3,.vbody h3{font-size:14px}
}