
:root{
  --wire-bg:#f4f3f8;
  --wire-panel:rgba(255,255,255,.64);
  --wire-panel-strong:rgba(255,255,255,.82);
  --wire-text:#16131c;
  --wire-muted:#786f82;
  --wire-line:rgba(72,52,94,.11);
  --wire-cyan:#24b8d2;
  --wire-purple:#8a5ed7;
  --wire-pink:#d559a4;
  --wire-gold:#c69538;
}

*{box-sizing:border-box}

html{
  min-height:100%;
  scroll-behavior:smooth;
}

body.news-wire-page{
  min-height:100vh;
  margin:0;
  overflow-x:hidden;
  color:var(--wire-text);
  background:
    radial-gradient(circle at 15% 8%,rgba(117,82,221,.09),transparent 28%),
    radial-gradient(circle at 85% 18%,rgba(35,190,213,.08),transparent 31%),
    linear-gradient(180deg,#f6f4f9,#f2f4f7 52%,#f5f2f8);
}

.news-wire-glow{
  position:fixed;
  z-index:-3;
  width:440px;
  height:440px;
  border-radius:50%;
  filter:blur(110px);
  opacity:.18;
  pointer-events:none;
  animation:wireDrift 18s ease-in-out infinite alternate;
}

.news-wire-glow.glow-a{
  left:-180px;
  top:15%;
  background:#8d64df;
}

.news-wire-glow.glow-b{
  right:-180px;
  top:46%;
  background:#42c4d8;
  animation-delay:-8s;
}

.news-wire-grid-bg{
  position:fixed;
  z-index:-4;
  inset:0;
  opacity:.035;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(75,54,102,.5) 1px,transparent 1px),
    linear-gradient(90deg,rgba(75,54,102,.5) 1px,transparent 1px);
  background-size:44px 44px;
  mask-image:linear-gradient(180deg,black,transparent 82%);
}

.news-wire-topbar{
  position:sticky;
  z-index:50;
  top:14px;
  width:min(1220px,calc(100% - 30px));
  min-height:68px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:14px auto 0;
  padding:10px 13px;
  border:1px solid var(--wire-line);
  border-radius:21px;
  background:rgba(249,248,252,.76);
  box-shadow:0 16px 48px rgba(65,43,85,.07);
  backdrop-filter:blur(19px) saturate(130%);
  -webkit-backdrop-filter:blur(19px) saturate(130%);
}

.news-wire-brand{
  display:flex;
  align-items:center;
  gap:10px;
  color:inherit;
  text-decoration:none;
}

.news-wire-brand-orb{
  width:43px;
  height:43px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:white;
  font-weight:950;
  font-style:italic;
  background:conic-gradient(from 210deg,#7558e1,#39cfe0,#dd64b3,#ecae55,#7558e1);
  box-shadow:0 0 24px rgba(118,83,220,.14);
}

.news-wire-brand>span:last-child{
  display:grid;
  line-height:1;
}

.news-wire-brand small{
  color:var(--wire-muted);
  font-size:7px;
  font-weight:950;
  letter-spacing:.18em;
}

.news-wire-brand b{
  margin-top:4px;
  font-size:14px;
  letter-spacing:.08em;
}

.news-wire-top-actions{
  display:flex;
  align-items:center;
  gap:8px;
}

.news-wire-identity{
  color:var(--wire-muted);
  font-size:8px;
  font-weight:850;
}

.news-wire-identity.is-signed-in{
  color:#3a9cad;
}

.news-wire-shell{
  width:min(1220px,calc(100% - 30px));
  margin:22px auto 70px;
}

.news-wire-hero{
  min-height:370px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 310px;
  align-items:center;
  gap:40px;
  padding:clamp(30px,5vw,58px);
  overflow:hidden;
  border:1px solid var(--wire-line);
  border-radius:34px;
  background:
    radial-gradient(circle at 78% 20%,rgba(45,203,224,.08),transparent 27%),
    radial-gradient(circle at 6% 84%,rgba(139,88,222,.09),transparent 34%),
    rgba(255,255,255,.58);
  box-shadow:0 30px 90px rgba(67,45,91,.08);
  backdrop-filter:blur(16px);
}

.news-wire-kicker{
  display:flex;
  align-items:center;
  gap:7px;
  color:#665676;
  font-size:8px;
  font-weight:950;
  letter-spacing:.16em;
}

.news-wire-kicker i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--wire-cyan);
  box-shadow:0 0 12px rgba(36,184,210,.45);
  animation:wirePulse .9s ease-in-out infinite alternate;
}

.news-wire-hero h1{
  margin:15px 0 14px;
  font-size:clamp(64px,10vw,124px);
  line-height:.70;
  letter-spacing:-.075em;
}

.news-wire-hero h1 span{
  color:transparent;
  background:linear-gradient(90deg,#8058d2,#32bcd1,#d454a1);
  -webkit-background-clip:text;
  background-clip:text;
}

.news-wire-hero p{
  max-width:690px;
  margin:0;
  color:var(--wire-muted);
  font-size:14px;
  line-height:1.65;
}

.news-wire-hero-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:24px;
}

.news-wire-hero-meta span{
  min-height:31px;
  display:flex;
  align-items:center;
  gap:5px;
  padding:0 9px;
  border:1px solid var(--wire-line);
  border-radius:999px;
  color:#796e83;
  background:rgba(255,255,255,.42);
  font-size:7px;
  font-weight:900;
  letter-spacing:.08em;
}

.news-wire-hero-meta b{
  color:#4f435b;
}

.news-wire-hero-meta i{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#38cda2;
  box-shadow:0 0 9px rgba(56,205,162,.45);
}

.news-wire-signal{
  position:relative;
  height:270px;
  display:grid;
  place-items:center;
}

.news-wire-signal-orb{
  position:relative;
  z-index:3;
  width:150px;
  height:150px;
  display:grid;
  place-items:center;
  border:1px solid rgba(124,84,206,.19);
  border-radius:50%;
  background:
    radial-gradient(circle at 34% 27%,rgba(255,255,255,.82),transparent 12%),
    radial-gradient(circle at 50% 50%,rgba(80,207,223,.16),rgba(126,79,218,.13) 48%,rgba(98,68,165,.08));
  box-shadow:
    inset 0 0 35px rgba(255,255,255,.45),
    0 20px 60px rgba(92,55,147,.12);
}

.news-wire-signal-orb::before,
.news-wire-signal-orb::after{
  content:'';
  position:absolute;
  inset:-22px;
  border:1px solid rgba(129,88,217,.18);
  border-radius:50%;
  border-left-color:transparent;
  animation:wireOrbit 12s linear infinite;
}

.news-wire-signal-orb::after{
  inset:-40px -16px;
  transform:rotate(28deg) scaleY(.60);
  border-color:rgba(54,192,214,.18);
  border-right-color:transparent;
  animation-duration:9s;
  animation-direction:reverse;
}

.news-wire-signal-orb span{
  font-size:39px;
  font-weight:950;
  font-style:italic;
  letter-spacing:-.12em;
}

.news-wire-signal-orb i{
  position:absolute;
  right:20px;
  bottom:31px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#39d6df;
  box-shadow:0 0 13px rgba(57,214,223,.55);
}

.news-wire-signal-lines{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  pointer-events:none;
}

.news-wire-signal-lines i{
  position:absolute;
  width:230px;
  height:1px;
  transform-origin:center;
  background:linear-gradient(90deg,transparent,rgba(116,79,199,.17),transparent);
}

.news-wire-signal-lines i:nth-child(1){transform:rotate(0deg)}
.news-wire-signal-lines i:nth-child(2){transform:rotate(32deg)}
.news-wire-signal-lines i:nth-child(3){transform:rotate(68deg)}
.news-wire-signal-lines i:nth-child(4){transform:rotate(110deg)}
.news-wire-signal-lines i:nth-child(5){transform:rotate(146deg)}

.news-wire-signal>b{
  position:absolute;
  right:7px;
  bottom:6px;
  color:#8e809b;
  font-size:8px;
  line-height:1.2;
  letter-spacing:.18em;
}

.news-wire-controls{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin:16px 0;
}

.news-wire-filters{
  display:flex;
  align-items:center;
  gap:7px;
  overflow-x:auto;
  padding:2px;
  scrollbar-width:none;
}

.news-wire-filter{
  min-height:36px;
  flex:0 0 auto;
  padding:0 11px;
  border:1px solid var(--wire-line);
  border-radius:999px;
  color:#73697c;
  background:rgba(255,255,255,.48);
  font:inherit;
  font-size:8px;
  font-weight:850;
  cursor:pointer;
  transition:.17s ease;
}

.news-wire-filter.active,
.news-wire-filter:hover{
  color:#62429a;
  border-color:rgba(127,80,206,.21);
  background:rgba(126,80,206,.07);
}

.news-wire-pinned{
  display:grid;
  gap:10px;
  margin:15px 0 28px;
}

.news-wire-pinned.hidden{
  display:none;
}

.news-wire-pinned-label{
  display:flex;
  align-items:center;
  gap:7px;
  color:#a27120;
  font-size:8px;
  font-weight:950;
  letter-spacing:.13em;
}

.news-wire-pinned-label::before{
  content:'';
  width:19px;
  height:1px;
  background:#d09d47;
}

.news-wire-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:14px;
}

.news-wire-section-head span{
  color:#7f609b;
  font-size:7px;
  font-weight:950;
  letter-spacing:.14em;
}

.news-wire-section-head h2{
  margin:5px 0 0;
  font-size:31px;
  letter-spacing:-.045em;
}

.news-wire-section-head p{
  max-width:470px;
  margin:0;
  color:var(--wire-muted);
  font-size:10px;
  line-height:1.55;
  text-align:right;
}

.news-wire-feed{
  display:grid;
  gap:12px;
}

.news-wire-post{
  position:relative;
  overflow:hidden;
  padding:22px;
  border:1px solid var(--wire-line);
  border-radius:23px;
  background:
    radial-gradient(circle at 100% 0,rgba(114,82,205,.045),transparent 31%),
    var(--wire-panel);
  box-shadow:0 16px 50px rgba(56,38,75,.05);
  backdrop-filter:blur(13px);
}

.news-wire-post.is-pinned{
  border-color:rgba(211,157,60,.20);
  background:
    radial-gradient(circle at 100% 0,rgba(222,170,73,.10),transparent 32%),
    radial-gradient(circle at 0 100%,rgba(129,87,213,.055),transparent 36%),
    var(--wire-panel);
}

.news-wire-post::after{
  content:'';
  position:absolute;
  top:-60px;
  right:-70px;
  width:185px;
  height:185px;
  border:1px solid rgba(120,84,195,.055);
  border-radius:50%;
  box-shadow:
    0 0 0 30px rgba(56,196,216,.018),
    0 0 0 62px rgba(139,78,212,.013);
  pointer-events:none;
}

.news-wire-post-head{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
}

.news-wire-category,
.news-wire-pin{
  min-height:25px;
  display:flex;
  align-items:center;
  padding:0 8px;
  border-radius:999px;
  font-size:6px;
  font-weight:950;
  letter-spacing:.10em;
}

.news-wire-category{
  color:#276d7b;
  border:1px solid rgba(45,183,207,.15);
  background:rgba(40,185,210,.055);
}

.news-wire-category.category-creator-news{
  color:#7751a6;
  border-color:rgba(134,91,198,.16);
  background:rgba(134,91,198,.06);
}

.news-wire-category.category-events{
  color:#ae4e87;
  border-color:rgba(215,83,164,.16);
  background:rgba(215,83,164,.055);
}

.news-wire-category.category-giveaways{
  color:#a67624;
  border-color:rgba(211,158,67,.17);
  background:rgba(211,158,67,.06);
}

.news-wire-category.category-maintenance{
  color:#9b6651;
  border-color:rgba(198,112,82,.17);
  background:rgba(198,112,82,.055);
}

.news-wire-pin{
  color:#a47019;
  border:1px solid rgba(214,159,62,.18);
  background:rgba(221,170,71,.065);
}

.news-wire-post-head time{
  margin-left:auto;
  color:#918899;
  font-size:7px;
  font-weight:800;
}

.news-wire-post h3{
  position:relative;
  z-index:2;
  margin:13px 0 6px;
  font-size:clamp(23px,3vw,34px);
  line-height:1;
  letter-spacing:-.045em;
}

.news-wire-byline{
  position:relative;
  z-index:2;
  color:#918697;
  font-size:8px;
  font-weight:800;
}

.news-wire-body{
  position:relative;
  z-index:2;
  margin:15px 0 0;
  color:#514957;
  font-size:13px;
  line-height:1.72;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.news-wire-link{
  position:relative;
  z-index:2;
  display:inline-flex;
  align-items:center;
  gap:7px;
  margin-top:15px;
  padding:9px 11px;
  border:1px solid rgba(125,81,205,.14);
  border-radius:11px;
  color:#7246aa;
  text-decoration:none;
  background:rgba(126,80,204,.05);
  font-size:9px;
  font-weight:900;
}

.news-wire-reaction-bar{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:18px;
  padding-top:14px;
  border-top:1px solid rgba(86,61,106,.075);
}

.news-wire-reactions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.news-wire-reaction{
  min-height:36px;
  display:flex;
  align-items:center;
  gap:6px;
  padding:0 9px;
  border:1px solid rgba(91,67,111,.10);
  border-radius:999px;
  color:#746b7a;
  background:rgba(255,255,255,.48);
  font:inherit;
  cursor:pointer;
  transition:.15s ease;
}

.news-wire-reaction:hover{
  transform:translateY(-1px);
  border-color:rgba(126,80,204,.21);
}

.news-wire-reaction.active{
  color:#654096;
  border-color:rgba(127,79,208,.27);
  background:rgba(126,80,204,.09);
  box-shadow:0 0 17px rgba(128,78,207,.045);
}

.news-wire-reaction:disabled{
  opacity:.52;
  cursor:not-allowed;
  transform:none;
}

.news-wire-reaction span{
  font-size:16px;
}

.news-wire-reaction b{
  font-size:8px;
}

.news-wire-reaction-note{
  color:#958b9d;
  font-size:7px;
  font-weight:800;
}

.news-wire-empty,
.news-wire-loading{
  min-height:230px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:8px;
  border:1px dashed rgba(111,79,147,.18);
  border-radius:23px;
  color:var(--wire-muted);
  text-align:center;
}

.news-wire-empty b,
.news-wire-loading b{
  color:var(--wire-text);
  font-size:17px;
}

.news-wire-loading span{
  width:35px;
  height:35px;
  border:3px solid rgba(113,80,156,.10);
  border-top-color:#8558d0;
  border-radius:50%;
  animation:wireSpin .8s linear infinite;
}

.news-wire-toast{
  position:fixed;
  z-index:90;
  left:50%;
  bottom:24px;
  max-width:min(430px,calc(100% - 30px));
  padding:10px 14px;
  border:1px solid var(--wire-line);
  border-radius:12px;
  color:var(--wire-text);
  background:rgba(250,248,253,.90);
  box-shadow:0 16px 48px rgba(50,32,67,.12);
  backdrop-filter:blur(15px);
  opacity:0;
  transform:translate(-50%,12px);
  pointer-events:none;
  transition:.2s ease;
}

.news-wire-toast.show{
  opacity:1;
  transform:translate(-50%,0);
}

/* Vibrant dark uses the Hub's shared preference. */
body.news-wire-page.vibrant-dark{
  --wire-bg:#070a11;
  --wire-panel:rgba(12,15,27,.82);
  --wire-panel-strong:rgba(13,16,29,.92);
  --wire-text:#f4f5ff;
  --wire-muted:#a6adbe;
  --wire-line:rgba(255,255,255,.11);
  background:
    radial-gradient(circle at 15% 8%,rgba(115,63,255,.16),transparent 29%),
    radial-gradient(circle at 85% 18%,rgba(31,211,240,.11),transparent 31%),
    linear-gradient(180deg,#090c15,#060910 58%,#090812);
}

body.news-wire-page.vibrant-dark .news-wire-topbar{
  background:rgba(7,10,18,.80);
  box-shadow:0 18px 55px rgba(0,0,0,.38);
}

body.news-wire-page.vibrant-dark .news-wire-brand b,
body.news-wire-page.vibrant-dark .news-wire-hero-meta b,
body.news-wire-page.vibrant-dark .news-wire-empty b,
body.news-wire-page.vibrant-dark .news-wire-loading b{
  color:#f4f5ff;
}

body.news-wire-page.vibrant-dark .news-wire-hero{
  background:
    radial-gradient(circle at 78% 20%,rgba(45,203,224,.09),transparent 27%),
    radial-gradient(circle at 6% 84%,rgba(139,88,222,.13),transparent 34%),
    rgba(10,13,23,.78);
  box-shadow:0 30px 90px rgba(0,0,0,.32);
}

body.news-wire-page.vibrant-dark .news-wire-kicker,
body.news-wire-page.vibrant-dark .news-wire-hero-meta span{
  color:#a4abc0;
}

body.news-wire-page.vibrant-dark .news-wire-hero-meta span,
body.news-wire-page.vibrant-dark .news-wire-filter{
  background:rgba(255,255,255,.045);
}

body.news-wire-page.vibrant-dark .news-wire-post,
body.news-wire-page.vibrant-dark .news-wire-post.is-pinned{
  background:
    radial-gradient(circle at 100% 0,rgba(118,76,230,.07),transparent 31%),
    var(--wire-panel);
  box-shadow:0 18px 54px rgba(0,0,0,.23);
}

body.news-wire-page.vibrant-dark .news-wire-post.is-pinned{
  background:
    radial-gradient(circle at 100% 0,rgba(220,162,58,.09),transparent 31%),
    radial-gradient(circle at 0 100%,rgba(128,74,227,.065),transparent 36%),
    var(--wire-panel);
}

body.news-wire-page.vibrant-dark .news-wire-body{
  color:#d0d3de;
}

body.news-wire-page.vibrant-dark .news-wire-byline,
body.news-wire-page.vibrant-dark .news-wire-post-head time,
body.news-wire-page.vibrant-dark .news-wire-reaction-note{
  color:#979fb1;
}

body.news-wire-page.vibrant-dark .news-wire-reaction{
  color:#c4c8d4;
  border-color:rgba(255,255,255,.09);
  background:rgba(255,255,255,.04);
}

body.news-wire-page.vibrant-dark .news-wire-reaction.active{
  color:#d9c4ff;
  border-color:rgba(157,102,255,.28);
  background:rgba(135,77,238,.12);
}

body.news-wire-page.vibrant-dark .news-wire-link{
  color:#c8a3ff;
  border-color:rgba(160,102,255,.18);
  background:rgba(137,78,238,.075);
}

body.news-wire-page.vibrant-dark .news-wire-toast{
  color:#f4f5ff;
  background:rgba(7,10,18,.90);
}

@keyframes wireSpin{to{transform:rotate(360deg)}}
@keyframes wireOrbit{to{transform:rotate(360deg)}}
@keyframes wirePulse{from{opacity:.45;transform:scale(.84)}to{opacity:1;transform:scale(1.12)}}
@keyframes wireDrift{to{transform:translate(50px,-30px) scale(1.08)}}

@media(max-width:850px){
  .news-wire-hero{
    grid-template-columns:1fr;
  }

  .news-wire-signal{
    display:none;
  }

  .news-wire-section-head{
    align-items:flex-start;
    flex-direction:column;
  }

  .news-wire-section-head p{
    text-align:left;
  }
}

@media(max-width:620px){
  .news-wire-topbar{
    align-items:flex-start;
    flex-direction:column;
  }

  .news-wire-top-actions{
    width:100%;
    flex-wrap:wrap;
  }

  .news-wire-identity{
    width:100%;
  }

  .news-wire-theme-toggle,
  .news-wire-top-actions .btn{
    flex:1;
  }

  .news-wire-shell{
    width:calc(100% - 18px);
  }

  .news-wire-hero{
    min-height:0;
    padding:30px 20px;
    border-radius:25px;
  }

  .news-wire-hero h1{
    font-size:clamp(58px,19vw,90px);
  }

  .news-wire-controls{
    align-items:stretch;
    flex-direction:column;
  }

  .news-wire-post{
    padding:17px;
  }

  .news-wire-post-head time{
    width:100%;
    margin-left:0;
  }

  .news-wire-reaction-bar{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(prefers-reduced-motion:reduce){
  .news-wire-glow,
  .news-wire-kicker i,
  .news-wire-signal-orb::before,
  .news-wire-signal-orb::after,
  .news-wire-loading span{
    animation:none!important;
  }
}


/* ============================================================
   News Wire performance isolation
   ============================================================ */
body.news-wire-page{
  font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

body.news-wire-page.page-hidden *{
  animation-play-state:paused!important;
}

@supports (content-visibility:auto){
  .news-wire-post{
    content-visibility:auto;
    contain-intrinsic-size:auto 280px;
    contain:layout paint style;
  }
}
