/* Fringe Next — staging-only design/performance layer */
:root{
  --fn-bg:#05060a;
  --fn-bg-2:#080a12;
  --fn-panel:rgba(255,255,255,.035);
  --fn-panel-2:rgba(255,255,255,.06);
  --fn-border:rgba(255,255,255,.10);
  --fn-border-soft:rgba(255,255,255,.06);
  --fn-text:#f7f8ff;
  --fn-muted:#a7adc2;
  --fn-dim:#737b96;
  --fn-red:#ff3158;
  --fn-red-2:#ff6a86;
  --fn-violet:#7c5cff;
  --fn-blue:#54c7ff;
  --fn-green:#3ef7a6;
  --fn-shadow:0 24px 80px rgba(0,0,0,.45);
  --fn-radius:22px;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--fn-bg)}
body{
  background:
    radial-gradient(circle at 15% -10%,rgba(255,49,88,.18),transparent 34rem),
    radial-gradient(circle at 82% 0%,rgba(124,92,255,.18),transparent 32rem),
    linear-gradient(180deg,var(--fn-bg),var(--fn-bg-2) 42%,#05060a)!important;
  color:var(--fn-text)!important;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif!important;
  font-feature-settings:"cv01","ss03";
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:none;color:#fff}
img,iframe,video{max-width:100%}
.site-top-shell{
  position:sticky!important;top:0!important;z-index:80!important;
  width:min(100%,1180px)!important;margin:0 auto!important;
  padding:12px clamp(10px,2vw,18px)!important;
  backdrop-filter:blur(22px) saturate(1.2)!important;
}
.site-top-shell:before{
  content:"";position:absolute;inset:0;border:1px solid var(--fn-border-soft);border-top:0;
  border-radius:0 0 24px 24px;background:linear-gradient(180deg,rgba(6,7,12,.82),rgba(6,7,12,.55));
  box-shadow:0 16px 60px rgba(0,0,0,.35);pointer-events:none;z-index:-1;
}
#top-banner.brand-banner,#top-banner.banner{
  height:clamp(82px,10vw,118px)!important;min-height:82px!important;max-height:118px!important;
  filter:drop-shadow(0 10px 28px rgba(255,49,88,.18));
}
#top-banner .banner-logo-fill,#top-banner.brand-banner .banner-logo-fill{
  object-fit:contain!important;object-position:center!important;transform:none!important;
}
.nav .chip,.chip,.pill,.tag{
  transition:transform .18s ease,border-color .18s ease,background .18s ease,box-shadow .18s ease,color .18s ease;
}
.nav .chip{
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.025))!important;
  border:1px solid var(--fn-border)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)!important;
  letter-spacing:-.01em;
}
.nav .chip:hover,.chip:hover,.pill:hover,.tag:hover{
  transform:translateY(-1px);
  border-color:rgba(255,49,88,.42)!important;
  box-shadow:0 10px 28px rgba(255,49,88,.12), inset 0 1px 0 rgba(255,255,255,.1)!important;
}
.wrap,main{width:min(100% - 24px,1180px)!important;margin-inline:auto!important}
h1,h2,h3{
  color:var(--fn-text)!important;letter-spacing:-.045em;text-wrap:balance;
}
h1{font-size:clamp(2.1rem,6vw,5rem)!important;line-height:.92!important;font-weight:850!important}
h2{font-size:clamp(1.55rem,3vw,2.45rem)!important;line-height:1!important;font-weight:800!important}
h3{font-weight:760!important;line-height:1.08!important}
.top-videos,#top-videos,#top-viewed,.card,article.card{
  border-color:var(--fn-border)!important;
}
.top-videos,#top-videos,#top-viewed{
  position:relative;overflow:hidden;border-radius:28px!important;
  background:linear-gradient(150deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
  box-shadow:var(--fn-shadow), inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.top-videos:before,#top-videos:before,#top-viewed:before{
  content:"";position:absolute;inset:-2px;background:
    radial-gradient(circle at 12% 0%,rgba(255,49,88,.16),transparent 30%),
    radial-gradient(circle at 90% 12%,rgba(84,199,255,.12),transparent 26%);
  pointer-events:none;z-index:0;
}
.top-videos>* ,#top-videos>* ,#top-viewed>*{position:relative;z-index:1}
.grid{gap:clamp(14px,2vw,22px)!important}
article.card{
  position:relative;overflow:hidden;border-radius:var(--fn-radius)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.024))!important;
  box-shadow:0 18px 50px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08)!important;
  transform:translateZ(0);
}
article.card>*{position:relative;z-index:1}
article.card:after{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:0;
  background:linear-gradient(120deg,rgba(255,255,255,.10),transparent 35%,rgba(255,49,88,.06));opacity:.34;
}
article.card:hover{transform:translateY(-3px);border-color:rgba(255,49,88,.35)!important;box-shadow:0 24px 70px rgba(0,0,0,.38)!important}
.preview-holder,.thumb,.player-wrap{border-radius:18px!important;overflow:hidden;background:#090d18!important}
.preview-holder{isolation:isolate;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.preview-holder:before{
  content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.42));z-index:1;pointer-events:none;
}
.preview-holder>span{
  z-index:2!important;background:linear-gradient(135deg,var(--fn-red),var(--fn-violet))!important;
  border:0!important;box-shadow:0 8px 24px rgba(255,49,88,.28)!important;font-weight:800!important;
}
.thumb{transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .45s ease;filter:saturate(1.08) contrast(1.05)}
article.card:hover .thumb-static{transform:scale(1.035)}
.video-card-tags,.meta.video-tags{display:flex;gap:7px;flex-wrap:wrap}.video-card-tags .chip,.meta.video-tags .pill,.tag{
  border:1px solid rgba(255,255,255,.09)!important;background:rgba(255,255,255,.045)!important;color:#e8ebff!important;
  border-radius:999px!important;font-weight:700!important;
}
.card-date,.meta,.muted,p{color:var(--fn-muted)!important}.card-views{color:#c2c8dc!important}
.read,.actions a,.card a[href*="/video/"]:not(.chip):not(.tag){font-weight:800}.read,.actions a:last-child{
  background:linear-gradient(135deg,var(--fn-red),var(--fn-violet))!important;color:white!important;border:0!important;
  box-shadow:0 12px 30px rgba(255,49,88,.22)!important;
}
.crumbs{color:var(--fn-dim)!important}.player-wrap{box-shadow:0 22px 70px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.08)}
#home-video-carousel{border-radius:30px}.carousel-nav-btn{backdrop-filter:blur(14px);box-shadow:0 12px 35px rgba(0,0,0,.32)!important}
@media (max-width:720px){
  .site-top-shell{padding:8px!important}.nav{gap:6px!important}.nav .chip{font-size:11px!important;min-height:36px!important;border-radius:14px!important}
  .wrap,main{width:min(100% - 14px,1180px)!important}article.card{border-radius:18px!important}h1{font-size:clamp(2rem,13vw,3.6rem)!important}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}