/* ============================================================
   Alumanel — shared styles for secondary pages
   (same tokens as the front page — palette must not change)
   ============================================================ */
:root{
  --void:#06080F;--slate:#0A0F1C;--raise:#101828;--lift:#151F33;
  --ink:#F5F8FE;--body:#98A7C3;--mute:#62718F;
  --ontrack:#3FE0A8;--paused:#F5B84E;--breach:#FF6E6E;
  --paper:#EEF2F8;--paper-ink:#0A0F1C;--paper-body:#4A5872;
  --hair:rgba(255,255,255,.075);--hair-2:rgba(255,255,255,.13);
  --display:"Instrument Sans",system-ui,sans-serif;
  --text:"Inter",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,monospace;
  --shell:1240px;
  --prose:820px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--void);color:var(--ink);font-family:var(--text);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--ontrack);outline-offset:3px;border-radius:5px}
img,svg{display:block}

.shell{max-width:var(--shell);margin:0 auto;padding:0 2rem;width:100%}
.prose-shell{max-width:var(--prose);margin:0 auto;padding:0 2rem;width:100%}

h1,h2,h3{font-family:var(--display);font-weight:600;letter-spacing:-.032em;line-height:1.08}
h1{font-size:clamp(2.5rem,5vw,3.75rem)}
h2{font-size:clamp(1.5rem,2.6vw,2rem)}
h3{font-size:1.0625rem}

.eyebrow{
  font-family:var(--mono);font-size:.6875rem;font-weight:500;
  letter-spacing:.18em;text-transform:uppercase;color:var(--ontrack);
  display:flex;align-items:center;gap:.75rem;margin-bottom:1.5rem;
}
.eyebrow::after{content:"";height:1px;flex:1;max-width:90px;background:linear-gradient(90deg,rgba(63,224,168,.45),transparent)}
.lede{color:var(--body);font-size:1.0625rem;line-height:1.7;max-width:56ch}
.fine{font-family:var(--mono);font-size:.75rem;color:var(--mute)}

.btn{display:inline-block;font-size:.9375rem;font-weight:500;padding:.8125rem 1.5rem;border-radius:9px;transition:background .18s,border-color .18s,transform .16s}
.btn--go{background:var(--ontrack);color:#04241A;border:1px solid var(--ontrack)}
.btn--go:hover{background:#5FEBBA;transform:translateY(-1px)}
.btn--line{border:1px solid var(--hair-2);color:var(--ink)}
.btn--line:hover{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.05)}

/* ---- nav ---- */
.nav{position:sticky;top:0;z-index:60;background:rgba(6,8,15,.78);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--hair)}
.nav__in{display:flex;align-items:center;gap:2rem;padding:1rem 2rem;max-width:var(--shell);margin:0 auto}
.brand{display:flex;align-items:center;gap:.6rem;font-family:var(--display);font-weight:600;font-size:1.0625rem;letter-spacing:-.02em}
.brand__mark{width:24px;height:24px;flex:none}
.brand__mark img{width:100%;height:100%;object-fit:contain}
.nav__links{display:flex;gap:1.75rem;font-size:.875rem;color:var(--body);margin-left:.5rem}
.nav__links a:hover{color:var(--ink)}
.nav__right{display:flex;align-items:center;gap:1.25rem;margin-left:auto;font-size:.875rem}
.nav__signin{color:var(--body)}
.nav__signin:hover{color:var(--ink)}
.nav__cta{padding:.5rem 1.0625rem;border-radius:8px;background:var(--ontrack);color:#04241A;font-weight:500;transition:background .18s}
.nav__cta:hover{background:#5FEBBA}

/* ---- page hero ---- */
.phero{
  position:relative;padding:5.5rem 0 4rem;
  background:radial-gradient(110% 80% at 50% -30%, rgba(63,224,168,.09) 0%, transparent 60%), linear-gradient(180deg,#04060C,#06080F);
  border-bottom:1px solid var(--hair);
}
.phero .lede{margin-top:1.375rem}

/* ---- content ---- */
.page{padding:4.5rem 0 6rem}
.page section{margin-bottom:3.5rem}
.page h2{margin-bottom:1rem;padding-top:.5rem}
.page p{color:var(--body);font-size:.9375rem;line-height:1.75;max-width:70ch;margin-bottom:1rem}
.page p b,.page li b{color:var(--ink);font-weight:500}
.page ul,.page ol{margin:0 0 1rem 1.25rem;color:var(--body);font-size:.9375rem;line-height:1.75}
.page li{margin-bottom:.4rem}
.page a:not(.btn){color:var(--ontrack)}
.page a:not(.btn):hover{text-decoration:underline}
.page code{font-family:var(--mono);font-size:.8125rem;background:rgba(255,255,255,.06);border:1px solid var(--hair);padding:.1rem .35rem;border-radius:5px;color:var(--ink)}
.page pre{background:linear-gradient(180deg,rgba(21,31,51,.8),rgba(13,20,35,.86));border:1px solid var(--hair-2);border-radius:12px;padding:1.25rem;overflow-x:auto;margin-bottom:1.25rem}
.page pre code{background:none;border:0;padding:0;font-size:.8125rem;line-height:1.7;color:var(--body)}
.page pre b{color:var(--ontrack);font-weight:500}

.rule{border:0;border-top:1px solid var(--hair);margin:3rem 0}

/* ---- list rows (roadmap / changelog / blog) ---- */
.rows{border-top:1px solid var(--hair)}
.row{
  display:grid;grid-template-columns:120px 1fr 110px;gap:1.5rem;align-items:baseline;
  padding:1.375rem 0;border-bottom:1px solid var(--hair);transition:background .2s;
}
.row:hover{background:rgba(255,255,255,.02)}
.row__d{font-family:var(--mono);font-size:.75rem;color:var(--mute)}
.row__t{font-size:.9375rem;font-weight:500;color:var(--ink);line-height:1.45}
.row__y{margin-top:.3rem;font-size:.8125rem;color:var(--mute);line-height:1.6;font-weight:400}
.row__s{justify-self:end}

.badge{
  font-family:var(--mono);font-size:.625rem;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;
  padding:.25rem .5rem;border-radius:5px;white-space:nowrap;
}
.b-ok{background:rgba(63,224,168,.13);color:var(--ontrack)}
.b-warn{background:rgba(245,184,78,.13);color:var(--paused)}
.b-mut{background:rgba(255,255,255,.06);color:var(--body)}

/* ---- cards ---- */
.cards{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem}
.pcard{
  background:linear-gradient(180deg,rgba(21,31,51,.55),rgba(13,20,35,.7));
  border:1px solid var(--hair);border-radius:14px;padding:1.625rem;
  transition:border-color .3s,transform .3s;
}
.pcard:hover{border-color:rgba(63,224,168,.28);transform:translateY(-2px)}
.pcard h3{margin-bottom:.5rem}
.pcard p{font-size:.875rem;margin-bottom:0}
.pcard__k{font-family:var(--mono);font-size:.625rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ontrack);margin-bottom:.875rem;display:block}

/* ---- status page ---- */
.stat-hero{display:flex;align-items:center;gap:.875rem;margin-top:1.5rem;font-family:var(--display);font-weight:500;font-size:1.25rem}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ontrack);animation:pulse 2.2s ease-in-out infinite;flex:none}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(63,224,168,.5)}70%{box-shadow:0 0 0 7px rgba(63,224,168,0)}}
.svc{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.125rem 0;border-bottom:1px solid var(--hair)}
.svc__n{font-size:.9375rem;color:var(--ink)}
.svc__d{font-family:var(--mono);font-size:.6875rem;color:var(--mute);margin-top:.2rem}
.svc__s{font-family:var(--mono);font-size:.6875rem;color:var(--ontrack);display:inline-flex;align-items:center;gap:.5rem;white-space:nowrap}
.up{display:flex;gap:2px;margin-top:.75rem}
.up i{flex:1;height:26px;border-radius:2px;background:rgba(63,224,168,.4)}
.up i.dim{background:rgba(63,224,168,.18)}
.up i.warn{background:rgba(245,184,78,.5)}

/* ---- footer ---- */
.ft{background:var(--slate);border-top:1px solid var(--hair);padding:4rem 0 2rem}
.ft__g{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:3rem}
.ft__ab{font-size:.875rem;color:var(--mute);margin-top:1rem;max-width:30ch;line-height:1.65}
.ft__h{font-family:var(--mono);font-size:.625rem;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);margin-bottom:1.125rem}
.ft__l{display:grid;gap:.6875rem;list-style:none;margin:0}
.ft__l a{font-size:.875rem;color:var(--body)}
.ft__l a:hover{color:var(--ink)}
.ft__b{display:flex;flex-wrap:wrap;gap:1rem 2rem;justify-content:space-between;align-items:center;margin-top:3.5rem;padding-top:1.75rem;border-top:1px solid var(--hair);font-family:var(--mono);font-size:.6875rem;color:var(--mute)}
.ft__st{display:inline-flex;align-items:center;gap:.5rem;color:var(--body)}

/* ---- reveal ---- */
.rv{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
.rv.is-in{opacity:1;transform:none}

@media (max-width:920px){
  .nav__links{display:none}
  .phero{padding:4rem 0 3rem}
  .cards{grid-template-columns:1fr}
  .ft__g{grid-template-columns:1fr 1fr;gap:2.5rem}
}
@media (max-width:660px){
  .shell,.prose-shell{padding:0 1.25rem}
  .nav__in{padding:.875rem 1.25rem;gap:1rem}
  .nav__signin{display:none}
  .row{grid-template-columns:1fr auto;gap:.375rem .875rem}
  .row__d{grid-column:1/-1}
  .ft__g{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .dot{animation:none}
  .rv{opacity:1;transform:none;transition:none}
  .btn:hover,.pcard:hover{transform:none}
}