/* ============================================================
   XAMAN Allocation Protocol — stylesheet
   ============================================================ */
:root{
  --bg:#05080f;
  --bg-2:#080d18;
  --panel:rgba(255,255,255,.035);
  --panel-2:rgba(255,255,255,.055);
  --line:rgba(255,255,255,.09);
  --line-2:rgba(255,255,255,.16);
  --txt:#eaf1ff;
  --muted:#8b9ab5;
  --cyan:#28e6c8;
  --blue:#3aa0ff;
  --navy:#0b1a3a;
  --up:#2fe08a;
  --down:#ff6b6b;
  --grad:linear-gradient(100deg,#28e6c8,#3aa0ff);
  --radius:18px;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--bg);color:var(--txt);
  font-family:"Sora",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  line-height:1.6;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,h5{margin:0;line-height:1.15;letter-spacing:-.02em}
p{margin:0}
.wrap{width:min(1200px,100% - 2.5rem);margin-inline:auto}
.ta-r{text-align:right}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

.grid-bg{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(900px 520px at 78% -8%,rgba(58,160,255,.20),transparent 62%),
    radial-gradient(760px 480px at 6% 12%,rgba(40,230,200,.14),transparent 60%),
    linear-gradient(rgba(255,255,255,.032) 1px,transparent 1px) 0 0/64px 64px,
    linear-gradient(90deg,rgba(255,255,255,.032) 1px,transparent 1px) 0 0/64px 64px;
  mask-image:linear-gradient(180deg,#000,rgba(0,0,0,.55) 60%,transparent);
}
main,header,footer{position:relative;z-index:1}

/* ---------- badges ---------- */
.tag{
  display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--cyan);border:1px solid rgba(40,230,200,.3);
  background:rgba(40,230,200,.07);padding:.35rem .7rem;border-radius:999px;margin-bottom:1rem;
}
.dot{width:7px;height:7px;border-radius:50%;background:var(--up);display:inline-block;
  box-shadow:0 0 0 0 rgba(47,224,138,.6);animation:pulse 1.9s infinite}
@keyframes pulse{70%{box-shadow:0 0 0 9px rgba(47,224,138,0)}100%{box-shadow:0 0 0 0 rgba(47,224,138,0)}}
.live-pill{
  display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.68rem;
  letter-spacing:.14em;padding:.42rem .8rem;border-radius:999px;
  border:1px solid rgba(47,224,138,.32);background:rgba(47,224,138,.08);color:#bff7dc;white-space:nowrap;
}
.live-pill.sm{font-size:.62rem}

/* ---------- header ---------- */
.site-header{position:sticky;top:0;z-index:60;backdrop-filter:blur(16px);
  background:rgba(5,8,15,.78);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:1.2rem;padding:.85rem 0;justify-content:space-between}
.brand{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.brand-logo{width:42px;height:42px;object-fit:contain;
  filter:drop-shadow(0 0 14px rgba(58,160,255,.45));background:#fff;border-radius:12px;padding:3px}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-text strong{font-size:1.18rem;font-weight:800;letter-spacing:.16em}
.brand-text em{font-style:normal;font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.nav{display:flex;gap:1.5rem;font-size:.86rem;color:var(--muted)}
.nav a{position:relative;padding:.2rem 0;transition:color .2s}
.nav a:hover{color:var(--txt)}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1.5px;background:var(--grad);transition:right .25s}
.nav a:hover::after{right:0}
.header-right{display:flex;align-items:center;gap:.8rem}
.burger{display:none;background:none;border:1px solid var(--line-2);border-radius:10px;
  width:42px;height:38px;padding:9px 10px;cursor:pointer;flex-direction:column;justify-content:space-between}
.burger span{display:block;height:2px;background:var(--txt);border-radius:2px;transition:.25s}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* ticker */
.ticker{border-top:1px solid var(--line);overflow:hidden;background:rgba(255,255,255,.02)}
.ticker-track{display:flex;gap:2.2rem;white-space:nowrap;padding:.42rem 0;font-family:var(--mono);
  font-size:.72rem;color:var(--muted);animation:slide 38s linear infinite;width:max-content}
.ticker-track span b{color:var(--txt)}
.ticker-track .up{color:var(--up)}.ticker-track .down{color:var(--down)}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- hero ---------- */
.hero{padding:4.5rem 0 3.5rem}
.hero-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:2.6rem;align-items:start}
h1{font-size:clamp(2.1rem,4.4vw,3.5rem);font-weight:800}
.lede{color:var(--muted);margin-top:1.1rem;max-width:60ch;font-size:1.02rem}
.stat-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:2rem}
.stat{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:.9rem 1rem}
.stat .k{display:block;font-family:var(--mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.stat b{display:block;font-size:1.32rem;font-weight:700;margin-top:.25rem;font-variant-numeric:tabular-nums}
.chg{font-style:normal;font-family:var(--mono);font-size:.7rem}
.chg.up{color:var(--up)}.chg.down{color:var(--down)}.chg.neutral{color:var(--muted)}
.pool-bar{height:8px;border-radius:999px;background:rgba(255,255,255,.07);margin-top:1.6rem;overflow:hidden}
.pool-fill{height:100%;width:0;background:var(--grad);border-radius:999px;transition:width 1s ease;
  box-shadow:0 0 18px rgba(58,160,255,.5)}
.pool-note{font-family:var(--mono);font-size:.74rem;color:var(--muted);margin-top:.55rem}

/* ---------- vote portal ---------- */
.vote-portal{
  position:relative;border-radius:24px;padding:1.6rem;
  background:linear-gradient(170deg,rgba(58,160,255,.13),rgba(40,230,200,.06) 45%,rgba(255,255,255,.03));
  border:1px solid rgba(58,160,255,.3);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08);
  overflow:hidden;
}
.vote-portal::before{content:"";position:absolute;inset:-40% -10% auto;height:70%;
  background:radial-gradient(closest-side,rgba(58,160,255,.28),transparent);pointer-events:none}
.vp-head{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap;position:relative}
.vp-chip{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.66rem;
  letter-spacing:.18em;padding:.36rem .7rem;border-radius:999px;border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.06)}
.vp-epoch{font-family:var(--mono);font-size:.7rem;color:var(--muted)}
.vp-epoch b{color:var(--cyan)}
.vp-title{font-size:1.6rem;font-weight:800;margin-top:1.1rem;position:relative}
.vp-sub{color:var(--muted);font-size:.9rem;margin-top:.35rem;position:relative}
.vp-meter{margin-top:1.3rem;position:relative}
.vp-meter-row{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.72rem;margin-bottom:.4rem}
.vp-meter-row.muted{color:var(--muted);margin:.45rem 0 0}
.vp-track{height:7px;background:rgba(255,255,255,.09);border-radius:999px;overflow:hidden}
.vp-fill{height:100%;width:0;background:var(--grad);transition:width .9s ease}

.btn-vote{
  position:relative;width:100%;margin-top:1.5rem;border:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  padding:1.05rem 1.2rem;border-radius:16px;overflow:hidden;
  font-family:"Sora",sans-serif;font-size:1.06rem;font-weight:700;letter-spacing:.02em;
  color:#03121c;background:var(--grad);
  box-shadow:0 14px 34px -12px rgba(40,230,200,.65),inset 0 1px 0 rgba(255,255,255,.45);
  transition:transform .18s cubic-bezier(.2,.9,.3,1.4),box-shadow .25s,filter .25s;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.btn-vote svg{transition:transform .25s}
.btn-vote:hover{transform:translateY(-3px) scale(1.015);box-shadow:0 22px 46px -12px rgba(58,160,255,.75);filter:saturate(1.15)}
.btn-vote:hover svg{transform:translateX(5px)}
.btn-vote:active{transform:translateY(0) scale(.985);box-shadow:0 8px 20px -10px rgba(40,230,200,.7)}
.btn-vote:focus-visible{outline:3px solid rgba(255,255,255,.8);outline-offset:3px}
.btn-vote-glow{position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,rgba(255,255,255,.55) 50%,transparent 80%);
  transform:translateX(-120%);animation:sheen 3.4s ease-in-out infinite}
@keyframes sheen{0%,65%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.btn-vote::after{content:"";position:absolute;inset:0;border-radius:16px;pointer-events:none;
  box-shadow:0 0 0 0 rgba(40,230,200,.55);animation:ring 2.6s infinite}
@keyframes ring{70%{box-shadow:0 0 0 16px rgba(40,230,200,0)}100%{box-shadow:0 0 0 0 rgba(40,230,200,0)}}
.btn-vote.press{animation:press .3s ease}
@keyframes press{50%{transform:scale(.96)}}

.vp-fine{margin-top:1.15rem;font-size:.78rem;line-height:1.65;color:var(--muted);position:relative}
.vp-fine b{color:var(--txt)}

/* ---------- sections ---------- */
.section{padding:4.5rem 0}
.section.alt{background:linear-gradient(180deg,transparent,rgba(255,255,255,.022),transparent)}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;margin-bottom:2.2rem;flex-wrap:wrap}
.sec-head.col{flex-direction:column;align-items:center;text-align:center}
.sec-head h2{font-size:clamp(1.6rem,3vw,2.4rem);font-weight:800}
.sub{color:var(--muted);margin-top:.5rem;max-width:62ch}
.feed-status{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--mono);font-size:.72rem;color:var(--muted)}

/* ---------- activity ---------- */
.activity-grid{display:grid;grid-template-columns:340px 1fr;gap:1.2rem;align-items:start}
.metrics{display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.metric{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:.85rem .9rem;transition:border-color .3s,background .3s}
.metric.flash{border-color:rgba(40,230,200,.55);background:rgba(40,230,200,.07)}
.metric .k{display:block;font-family:var(--mono);font-size:.6rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.metric b{display:block;font-size:1.05rem;margin-top:.3rem;font-variant-numeric:tabular-nums}
.metric em{font-style:normal;font-family:var(--mono);font-size:.66rem;color:var(--muted)}

.feed-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.feed-head,.feed li{display:grid;grid-template-columns:1.5fr .9fr .9fr .9fr .5fr;gap:.6rem;
  padding:.7rem 1rem;align-items:center;font-size:.82rem}
.feed-head{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);background:rgba(255,255,255,.03);border-bottom:1px solid var(--line)}
.feed{list-style:none;margin:0;padding:0;max-height:430px;overflow:hidden}
.feed li{border-bottom:1px solid rgba(255,255,255,.05);animation:rowIn .5s ease}
@keyframes rowIn{from{opacity:0;transform:translateY(-10px);background:rgba(40,230,200,.12)}to{opacity:1;transform:none}}
.addr{font-family:var(--mono);font-size:.78rem;color:var(--txt);display:flex;align-items:center;gap:.45rem;overflow:hidden}
.addr i{width:6px;height:6px;border-radius:50%;background:var(--cyan);flex:0 0 auto}
.pill{font-family:var(--mono);font-size:.62rem;padding:.2rem .5rem;border-radius:999px;border:1px solid var(--line-2);color:var(--muted);white-space:nowrap}
.pill.t1{color:#bff7dc;border-color:rgba(47,224,138,.35);background:rgba(47,224,138,.08)}
.pill.t2{color:#bcdcff;border-color:rgba(58,160,255,.35);background:rgba(58,160,255,.08)}
.pill.t3{color:#ffe2b0;border-color:rgba(255,190,90,.35);background:rgba(255,190,90,.08)}
.amt{font-family:var(--mono);text-align:right;font-variant-numeric:tabular-nums}
.usd{font-family:var(--mono);text-align:right;color:var(--up);font-variant-numeric:tabular-nums}
.age{font-family:var(--mono);text-align:right;color:var(--muted);font-size:.72rem}
.feed-foot{display:flex;justify-content:space-between;padding:.65rem 1rem;font-family:var(--mono);
  font-size:.66rem;color:var(--muted);border-top:1px solid var(--line);background:rgba(255,255,255,.02)}

/* ---------- flow chart ---------- */
.flow{display:flex;flex-direction:column;align-items:center;gap:0}
.flow-lane{display:flex;align-items:stretch;justify-content:center;gap:0;width:100%;flex-wrap:wrap}
.flow-lane.split{gap:1rem}
.node{flex:1 1 220px;max-width:300px;background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:1.1rem;position:relative;transition:transform .25s,border-color .25s,box-shadow .25s}
.node:hover{transform:translateY(-5px);border-color:rgba(58,160,255,.5);box-shadow:0 18px 40px -22px rgba(58,160,255,.7)}
.node .n{font-family:var(--mono);font-size:.66rem;color:var(--cyan);letter-spacing:.14em}
.node h3{font-size:1rem;margin-top:.35rem}
.node p{color:var(--muted);font-size:.8rem;margin-top:.4rem}
.node.tier{background:linear-gradient(160deg,rgba(58,160,255,.1),rgba(255,255,255,.03));border-color:rgba(58,160,255,.25)}
.node.final{background:linear-gradient(160deg,rgba(40,230,200,.14),rgba(255,255,255,.03));border-color:rgba(40,230,200,.4)}
.arrow{flex:0 0 54px;align-self:center;height:2px;background:linear-gradient(90deg,rgba(58,160,255,.15),rgba(58,160,255,.75));position:relative}
.arrow::after{content:"";position:absolute;right:-1px;top:-4px;border-left:9px solid rgba(58,160,255,.85);
  border-top:5px solid transparent;border-bottom:5px solid transparent}
.flow-connect{height:44px;display:flex;justify-content:center;width:100%}
.flow-connect span{width:2px;height:100%;background:linear-gradient(180deg,rgba(58,160,255,.15),rgba(58,160,255,.7));position:relative}
.flow-connect span::after{content:"";position:absolute;bottom:-1px;left:-4px;border-top:9px solid rgba(58,160,255,.85);
  border-left:5px solid transparent;border-right:5px solid transparent}

/* ---------- spiral ---------- */
.spiral-wrap{display:grid;grid-template-columns:1fr 340px;gap:2rem;align-items:center}
.spiral{position:relative;width:100%;aspect-ratio:1;max-width:700px;margin-inline:auto}
.spiral-svg{position:absolute;inset:0;width:100%;height:100%;animation:spin 90s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.spiral-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;
  width:112px;height:112px;border-radius:50%;background:radial-gradient(circle,#0d1730,#05080f);
  border:1px solid rgba(58,160,255,.45);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.2rem;
  box-shadow:0 0 60px rgba(58,160,255,.35)}
.spiral-core img{width:44px;height:44px;object-fit:contain;background:#fff;border-radius:10px;padding:2px}
.spiral-core span{font-family:var(--mono);font-size:.56rem;letter-spacing:.14em;color:var(--muted)}
.orb{position:absolute;left:50%;top:50%;z-index:2;
  transform:translate(-50%,-50%) rotate(var(--a)) translate(var(--r)) rotate(calc(-1 * var(--a)));
  background:rgba(8,13,24,.92);border:1px solid var(--line-2);border-radius:12px;padding:.5rem .7rem;
  min-width:118px;text-align:center;backdrop-filter:blur(6px);transition:border-color .25s,box-shadow .25s}
.orb:hover{border-color:var(--cyan);box-shadow:0 0 26px rgba(40,230,200,.35)}
.orb b{display:block;font-size:.78rem}
.orb span{font-family:var(--mono);font-size:.58rem;color:var(--muted)}
.spiral-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.8rem}
.spiral-legend li{font-size:.84rem;color:var(--muted);border-left:2px solid rgba(58,160,255,.5);padding-left:.85rem}
.spiral-legend b{color:var(--txt)}

/* ---------- eligibility ---------- */
.table-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow-x:auto}
.alloc-table{width:100%;border-collapse:collapse;min-width:640px}
.alloc-table th,.alloc-table td{padding:.85rem 1rem;text-align:left;font-size:.85rem;border-bottom:1px solid rgba(255,255,255,.06)}
.alloc-table th{font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);background:rgba(255,255,255,.03)}
.alloc-table td:last-child,.alloc-table th:last-child{text-align:right;font-family:var(--mono);color:var(--up)}
.alloc-table tbody tr:hover{background:rgba(58,160,255,.05)}
.crit-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.9rem;margin-top:1.2rem}
.crit{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1rem}
.crit h4{font-size:.92rem}
.crit p{color:var(--muted);font-size:.79rem;margin-top:.35rem}

/* ---------- testimonies ---------- */
.quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.quote{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:1.2rem;display:flex;flex-direction:column;gap:.9rem;transition:transform .25s,border-color .25s}
.quote:hover{transform:translateY(-5px);border-color:rgba(40,230,200,.4)}
.q-top{display:flex;align-items:center;gap:.7rem}
.av{width:40px;height:40px;flex:0 0 auto;border-radius:50%;display:grid;place-items:center;
  background:var(--grad);color:#03121c;font-weight:700;font-size:.82rem}
.q-top b{display:block;font-size:.9rem}
.q-top em{font-style:normal;font-family:var(--mono);font-size:.64rem;color:var(--muted)}
.verif{margin-left:auto;font-family:var(--mono);font-size:.6rem;color:#bff7dc;
  border:1px solid rgba(47,224,138,.3);background:rgba(47,224,138,.08);padding:.2rem .45rem;border-radius:999px;white-space:nowrap}
.quote blockquote{margin:0;font-size:.87rem;color:#cfdaee;line-height:1.65}
.q-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);
  padding-top:.7rem;margin-top:auto;font-family:var(--mono);font-size:.72rem;color:var(--muted)}
.q-foot b{color:var(--cyan);font-size:.88rem}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);background:rgba(255,255,255,.02);padding-top:2.6rem;margin-top:2rem}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:1.6rem}
.foot-note{color:var(--muted);font-size:.8rem;margin-top:.9rem;max-width:38ch}
.foot-col{display:flex;flex-direction:column;gap:.5rem}
.foot-col h5{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:.2rem}
.foot-col a{font-size:.84rem;color:#c2cee4;transition:color .2s}
.foot-col a:hover{color:var(--cyan)}
.foot-meta{font-family:var(--mono);font-size:.7rem;color:var(--muted)}
.footer-bottom{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  border-top:1px solid var(--line);margin-top:2rem;padding:1rem 0;font-family:var(--mono);font-size:.68rem;color:var(--muted)}

/* ============ RESPONSIVE ============ */
@media (max-width:1080px){
  .hero-grid{grid-template-columns:1fr}
  .activity-grid{grid-template-columns:1fr}
  .metrics{grid-template-columns:repeat(3,1fr)}
  .spiral-wrap{grid-template-columns:1fr}
  .quotes{grid-template-columns:repeat(2,1fr)}
  .crit-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:860px){
  .burger{display:flex}
  .nav{position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;
    background:rgba(5,8,15,.98);border-bottom:1px solid var(--line);
    max-height:0;overflow:hidden;transition:max-height .3s ease}
  .nav.open{max-height:340px}
  .nav a{padding:.9rem 1.25rem;border-bottom:1px solid rgba(255,255,255,.05)}
  .nav a::after{display:none}
  .live-pill{font-size:.58rem;padding:.35rem .6rem}
}
@media (max-width:720px){
  .hero{padding:2.6rem 0 2rem}
  .section{padding:3rem 0}
  .stat-row{grid-template-columns:1fr;gap:.6rem}
  .metrics{grid-template-columns:1fr 1fr}
  .quotes{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .arrow{display:none}
  .flow-lane{gap:.8rem}
  .node{max-width:none;flex:1 1 100%}
  .flow-connect{height:28px}
  .feed-head,.feed li{grid-template-columns:1.3fr .8fr .8fr;font-size:.76rem;padding:.65rem .8rem}
  .feed-head span:nth-child(4),.feed-head span:nth-child(5),
  .feed li .usd,.feed li .age{display:none}
  .spiral{max-width:420px}
  .orb{min-width:92px;padding:.35rem .5rem}
  .orb b{font-size:.66rem}
  .orb span{display:none}
  .spiral-core{width:86px;height:86px}
  .spiral-core img{width:34px;height:34px}
  .vote-portal{padding:1.2rem}
  .brand-text strong{font-size:1rem}
  .live-pill{display:none}
}
@media (max-width:400px){
  .wrap{width:min(1200px,100% - 1.6rem)}
  .orb{min-width:74px}
  .orb b{font-size:.58rem}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
}

/* --- spiral scaling for small screens (prevents horizontal overflow) --- */
.spiral-wrap{overflow:hidden}
.o1{--r:120px}.o2{--r:170px}.o3{--r:212px}.o4{--r:250px}.o5{--r:284px}.o6{--r:305px}.o7{--r:322px}
@media (max-width:1080px){.o1{--r:100px}.o2{--r:142px}.o3{--r:176px}.o4{--r:206px}.o5{--r:232px}.o6{--r:250px}.o7{--r:264px}}
@media (max-width:720px){
  .spiral{max-width:340px}
  .o1{--r:82px}.o2{--r:98px}.o3{--r:112px}.o4{--r:124px}.o5{--r:134px}.o6{--r:142px}.o7{--r:150px}
}
@media (max-width:400px){
  .spiral{max-width:300px}
  .o1{--r:74px}.o2{--r:86px}.o3{--r:98px}.o4{--r:108px}.o5{--r:116px}.o6{--r:122px}.o7{--r:128px}
}

section[id],header[id]{scroll-margin-top:96px}