:root{
  --ab-red:#BC002D;
  --ab-text:#f6f6f6;
  --ab-muted:#d6d6d6;
  --ab-line:rgba(255,255,255,.14);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#000;color:var(--ab-text);font-family:"Exo 2",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;overflow-x:hidden}
body{
  min-height:100vh;
  background:
    linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,.70)),
    url('/app-background.png') center/cover fixed no-repeat;
}
a{color:inherit}
.brand-shell{max-width:1180px;margin:0 auto;padding:28px 18px 0;position:relative}
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:18px;
  margin-bottom:28px;padding:16px 18px;border:1px solid rgba(255,255,255,.10);
  border-radius:28px;background:rgba(8,8,12,.58);
  box-shadow:0 20px 46px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.05);
}
.brandmark{display:flex;align-items:center;gap:14px;text-decoration:none;min-width:0}
.brandmark img{width:46px;height:46px;border-radius:14px;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 12px 26px rgba(0,0,0,.24)}
.brandmark-text{min-width:0}
.brandmark-title{font-family:"Orbitron",system-ui,sans-serif;letter-spacing:.14em;font-size:18px;white-space:nowrap}
.brandmark-sub{font-size:12px;color:rgba(255,255,255,.72);letter-spacing:.06em;text-transform:uppercase}
.navlinks{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.navlinks a{padding:10px 14px;border-radius:999px;text-decoration:none;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.10);font-size:14px;color:rgba(255,255,255,.80);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.navlinks a:hover{border-color:rgba(255,255,255,.18);color:var(--ab-text)}
.navlinks a[aria-current="page"]{border-color:rgba(188,0,45,.56);color:var(--ab-text);box-shadow:0 0 0 1px rgba(188,0,45,.18) inset}
.page-main{padding-bottom:18px}
.ab-story-stack{display:flex;flex-direction:column;align-items:center;gap:26px}
.ab-story-panel{
  position:relative;
  width:100%;
  border-radius:28px;
  padding:56px 44px;
  text-align:center;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.06), rgba(255,255,255,0.02)),
    rgba(0,0,0,0.72);
  border:1px solid rgba(255,255,255,0.14);
  box-shadow:
    0 26px 70px rgba(0,0,0,0.65),
    inset 0 1px 0 rgba(255,255,255,0.12);
  overflow:hidden;
}
.ab-story-panel::before{
  content:"";
  position:absolute;
  inset:-20px;
  background-image: var(--ab-panel-bg-image, none);
  background-size:cover;
  background-position:center;
  opacity:0.22;
  filter: blur(8px) saturate(1.25);
  transform: scale(1.08);
  pointer-events:none;
  z-index:0;
}
.ab-story-panel::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:28px;
  pointer-events:none;
  z-index:4;
  box-shadow:
    inset 0 0 0 1px rgba(188,0,45,0.22),
    0 0 0 1px rgba(255,255,255,0.04);
}
.ab-story-panel > *{position:relative;z-index:3}
.ab-story-panel.ab-crt{animation:abCrtFlicker 4.2s infinite}
.ab-story-panel .ab-crt-scanlines,
.ab-story-panel .ab-crt-vignette{position:absolute;inset:0;z-index:2;pointer-events:none}
.ab-story-panel .ab-crt-scanlines{
  opacity:0.22;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0.05) 0px,
    rgba(255,255,255,0.02) 1px,
    rgba(0,0,0,0.00) 3px,
    rgba(0,0,0,0.00) 7px
  );
  mix-blend-mode: overlay;
  animation: abScanMove 7.5s linear infinite;
}
.ab-story-panel .ab-crt-vignette{
  opacity:0.30;
  background: radial-gradient(
    120% 90% at 50% 45%,
    rgba(0,0,0,0.00) 0%,
    rgba(0,0,0,0.20) 55%,
    rgba(0,0,0,0.55) 100%
  );
}
.ab-story-chip{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(188,0,45,0.35);
  background: rgba(0,0,0,0.35);
  color: rgba(255,255,255,0.9);
  font-family:'Orbitron', sans-serif;
  font-size:0.72rem;
  letter-spacing:0.22em;
  margin-bottom:18px;
  text-transform:uppercase;
}
.ab-story-chip .dot{
  position:relative;width:8px;height:8px;border-radius:999px;background:#bc002d;
  box-shadow:0 0 18px rgba(188,0,45,0.55);animation:abDotPulse 2.6s ease-in-out infinite;transform-origin:center;
}
.ab-story-chip .dot::after{
  content:'';position:absolute;inset:-7px;border-radius:999px;border:1px solid rgba(188,0,45,0.38);
  box-shadow:0 0 22px rgba(188,0,45,0.10);animation:abDotRing 2.6s ease-in-out infinite;pointer-events:none;
}
.ab-story-chip[data-chip="intro"] .dot,
.ab-story-chip[data-chip="intro"] .dot::after{animation-delay:0s}
.ab-story-chip[data-chip="history"] .dot,
.ab-story-chip[data-chip="history"] .dot::after{animation-delay:.45s}
.ab-story-chip[data-chip="culture"] .dot,
.ab-story-chip[data-chip="culture"] .dot::after{animation-delay:.9s}
.ab-story-chip[data-chip="collectors"] .dot,
.ab-story-chip[data-chip="collectors"] .dot::after{animation-delay:1.35s}
.ab-story-panel h1,
.ab-story-panel h2{
  margin:0 auto 18px;
  letter-spacing:0.08em;
  line-height:1.14;
  font-family:"Orbitron",system-ui,sans-serif;
  text-wrap:balance;
}
.ab-story-panel h1{font-size:clamp(2rem,4vw,3.7rem);max-width:980px}
.ab-story-panel h2{font-size:clamp(1.2rem,2.1vw,1.72rem);max-width:900px}
.ab-story-panel p,
.ab-story-panel li{color:var(--ab-muted);max-width:860px;margin:0 auto 14px;font-size:1.1rem;line-height:1.72}
.ab-story-panel ul{max-width:860px;margin:0 auto;padding-left:1.2rem;text-align:left}
.ab-neon-divider{
  display:block;margin-inline:auto;align-self:center;width:min(860px,72vw);height:2px;border-radius:999px;
  background:linear-gradient(90deg,transparent,rgba(188,0,45,0.92),transparent);
  box-shadow:0 0 16px rgba(188,0,45,0.22),0 0 46px rgba(188,0,45,0.12);
}
.cta-row{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:22px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 16px;border-radius:999px;text-decoration:none;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--ab-text);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.btn.primary{background:linear-gradient(180deg,#d70f3d,#b20d33);border-color:rgba(255,255,255,.08)}
.crumbs{margin:24px 0 0;font-size:14px;color:rgba(255,255,255,.70)}
.crumbs a{text-decoration:none;color:rgba(255,255,255,.90)}

@keyframes abScanMove{from{background-position:0 0}to{background-position:0 140px}}
@keyframes abCrtFlicker{0%,100%{filter:contrast(1.06) saturate(1.06);opacity:1}7%{opacity:.985}11%{opacity:.995}19%{opacity:.99}33%{filter:contrast(1.08) saturate(1.07)}46%{opacity:.985}61%{opacity:1}74%{opacity:.992}}
@keyframes abDotPulse{0%,100%{transform:scale(1);opacity:.95;box-shadow:0 0 0 2px rgba(188,0,45,0.22),0 0 18px rgba(188,0,45,0.55)}50%{transform:scale(1.22);opacity:1;box-shadow:0 0 0 3px rgba(188,0,45,0.30),0 0 30px rgba(188,0,45,0.78)}}
@keyframes abDotRing{0%{transform:scale(.85);opacity:0}25%{opacity:.2}55%{transform:scale(1.75);opacity:.45}100%{transform:scale(2.05);opacity:0}}

@media (max-width: 900px){
  .topbar{flex-direction:column;align-items:flex-start}
  .navlinks{justify-content:flex-start}
}
@media (max-width: 680px){
  .brand-shell{padding:18px 12px 0}
  .topbar{padding:12px 14px;border-radius:22px}
  .ab-story-panel{padding:40px 18px;border-radius:22px}
  .ab-story-panel::after{border-radius:22px}
  .ab-story-panel p,.ab-story-panel li{font-size:1rem}
  .ab-neon-divider{width:min(92vw,860px)}
  .navlinks a{font-size:13px;padding:9px 12px}
}
@media (prefers-reduced-motion: reduce){
  .ab-story-panel.ab-crt,.ab-story-panel .ab-crt-scanlines,.ab-story-chip .dot,.ab-story-chip .dot::after{animation:none !important}
}