.gate-marquee{
  position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;
  display:grid;align-content:center;gap:18px;
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.gate-row{display:flex;gap:16px;width:max-content;animation:gateMarquee 52s linear infinite}
.gate-row.reverse{animation-duration:64s;animation-direction:reverse}
.glimpse{
  width:292px;height:168px;flex:none;padding:14px 14px 12px;border-radius:18px;
  border:1px solid color-mix(in srgb,var(--gate-accent,#8eb6ff) 28%,rgba(255,255,255,.08));
  background:linear-gradient(180deg,rgba(22,22,26,.78),rgba(10,10,12,.72));
  box-shadow:0 24px 50px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.06);
  color:#f6f3ee;backdrop-filter:blur(8px);
}
.glimpse header{display:flex;align-items:center;gap:5px;margin-bottom:10px}
.glimpse header span{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.22)}
.glimpse header span:first-child{background:var(--gate-accent,#8eb6ff)}
.glimpse header small{margin-left:auto;color:#b7aea4;font-size:9px;letter-spacing:.14em}
.glimpse strong{display:block;font-size:14px;letter-spacing:-.03em}
.glimpse em{display:block;margin-top:4px;font-style:normal;color:var(--gate-accent,#e7b76f);font-size:12px;font-weight:700}
.glimpse-bars{display:flex;align-items:flex-end;gap:5px;height:52px;margin-top:12px}
.glimpse-bars i{flex:1;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,var(--gate-accent,#8eb6ff),rgba(255,255,255,.18));opacity:.85;transform-origin:bottom;animation:glimpseBar 2.8s ease-in-out infinite}
.glimpse-bars i:nth-child(2){animation-delay:.2s}.glimpse-bars i:nth-child(3){animation-delay:.4s}.glimpse-bars i:nth-child(4){animation-delay:.15s}.glimpse-bars i:nth-child(5){animation-delay:.35s}
.glimpse ul{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:6px}
.glimpse li{display:flex;justify-content:space-between;gap:10px;font-size:11px;color:#d9d1c8}
.glimpse li span{color:#9d948b}
@keyframes gateMarquee{to{transform:translateX(-50%)}}
@keyframes glimpseBar{50%{transform:scaleY(.72)}}
@media (max-width:640px){
  .glimpse{width:240px;height:148px}
  .gate-marquee{gap:12px}
}
@media (prefers-reduced-motion:reduce){
  .gate-row,.glimpse-bars i{animation:none}
}