/* Secure AMS status site. Tokens mirror the public site (app/index.html) so the
   status page reads as the same product: navy #103f5b family, action blue
   #167eae, cyan/aqua accents, Inter-first system font stack. */
:root{
  --navy:#103f5b;--navy-900:#082739;--navy-950:#061f2e;--blue:#167eae;--blue-700:#0f6d98;--cyan:#1ba6ba;--aqua:#6fe1e9;
  --ink:#12283a;--muted:#5e7382;--line:#d8e4ea;--paper:#fff;--wash:#f1f6f8;--soft-blue:#eaf6fa;
  --green:#11834a;--green-soft:#e1f6e9;--amber:#9a6400;--amber-soft:#fff1cb;--red:#b42318;--red-soft:#fff3f2;
  --radius:22px;--shadow:0 18px 55px rgba(6,31,46,.12);--shadow-soft:0 8px 30px rgba(18,59,86,.055)
}
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
body{margin:0;background:var(--wash);color:var(--ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-wrap:anywhere}
a{color:var(--blue)}
.shell{width:min(1100px,calc(100% - 32px));margin-inline:auto}
.mark{width:36px;height:36px;flex:0 0 auto}
:focus-visible{outline:3px solid var(--aqua);outline-offset:3px}

/* Header: same sticky navy bar as the homepage */
.site-header{position:sticky;top:0;z-index:40;background:rgba(8,39,57,.96);color:#fff;border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(14px)}
.nav{min-height:72px;display:flex;align-items:center;gap:20px}
.brand{display:inline-flex;align-items:center;gap:10px;margin-right:auto;color:#fff;text-decoration:none;font-size:20px;font-weight:850;letter-spacing:-.025em}
.brand span,.brand-tag,.button{white-space:nowrap}
.brand-tag{padding:3px 9px;border:1px solid rgba(111,225,233,.45);border-radius:99px;color:var(--aqua);font-size:12px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.nav-links{display:flex;align-items:center;gap:18px}
.nav-links>a:not(.button){color:#dbeaf1;text-decoration:none;font-weight:650;font-size:15px}
.nav-links>a:not(.button):hover{color:#fff}

.button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 20px;border:1px solid transparent;border-radius:10px;background:var(--blue);color:#fff;text-decoration:none;font:inherit;font-weight:800;cursor:pointer;transition:transform .18s ease,background .18s ease,box-shadow .18s ease}
.button:hover,.button:focus-visible{background:var(--blue-700);transform:translateY(-1px);box-shadow:0 9px 28px rgba(22,126,174,.22)}
.button-small{min-height:40px;padding:8px 15px;font-size:14px}
.button-ghost{border-color:rgba(255,255,255,.35);background:rgba(255,255,255,.05);color:#fff}
.button-ghost:hover,.button-ghost:focus-visible{background:rgba(255,255,255,.12)}

/* Hero: the homepage's dark gradient with its faint grid */
.hero{position:relative;overflow:hidden;background:radial-gradient(circle at 80% 20%,rgba(27,166,186,.26),transparent 34%),linear-gradient(135deg,var(--navy-950),var(--navy-900) 56%,#0e6177);color:#fff}
.hero::before{content:"";position:absolute;inset:0;opacity:.14;background-image:linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to right,transparent,#000 40%);-webkit-mask-image:linear-gradient(to right,transparent,#000 40%);pointer-events:none}
.hero-inner{position:relative;padding-block:clamp(44px,7vw,76px)}
.eyebrow{margin:0 0 14px;color:#83e6ec;font-size:13px;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.hero h1{display:flex;align-items:center;gap:16px;margin:0;font-size:clamp(32px,5.4vw,56px);line-height:1.04;letter-spacing:-.045em}
.hero .lead{max-width:720px;margin:18px 0 0;color:#d8e8ef;font-size:clamp(17px,2vw,20px)}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin:22px 0 0;color:#bdd3df;font-size:14px}
.hero-meta span{display:inline-flex;align-items:center;gap:7px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

/* Status signal: a pulsing dot in the state's colour */
.signal{position:relative;display:inline-block;width:18px;height:18px;flex:0 0 auto;border-radius:50%;background:currentColor}
.signal::after{content:"";position:absolute;inset:-7px;border-radius:50%;background:currentColor;opacity:.22;animation:pulse 2s ease-in-out infinite}
.hero .signal.ok{color:#61dca5}.hero .signal.warn{color:#ffcf5c}.hero .signal.info{color:var(--aqua)}.hero .signal.bad{color:#ff8a80}
@keyframes pulse{0%,100%{transform:scale(.7);opacity:.28}50%{transform:scale(1);opacity:.08}}
@media (prefers-reduced-motion:reduce){.signal::after{animation:none}.button{transition:none}}

.notice{display:flex;gap:10px;align-items:flex-start;margin:22px 0 0;padding:13px 16px;border:1px solid rgba(255,207,92,.45);border-radius:12px;background:rgba(255,207,92,.12);color:#ffe7a8;font-weight:650;max-width:720px}

/* Content */
.content{padding-block:clamp(28px,5vw,48px) 56px;display:grid;gap:22px}
.card{padding:clamp(20px,3.5vw,30px);border:1px solid var(--line);border-radius:var(--radius);background:var(--paper);box-shadow:var(--shadow-soft)}
.card-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:6px 16px;margin-bottom:18px}
.card h2{margin:0;font-size:clamp(22px,3vw,27px);letter-spacing:-.03em;color:var(--navy)}
.card-head p{margin:0;color:var(--muted);font-size:14px}
.group-title{margin:22px 0 10px;color:var(--muted);font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.group-title:first-of-type{margin-top:0}

.components{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.component{display:flex;flex-direction:column;gap:10px;padding:16px 17px;border:1px solid #e2eaee;border-radius:14px;background:#fff}
.component-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.component strong{font-size:16px;line-height:1.3}
.component p{margin:0;color:#405a6b;font-size:14px}

.pill{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;padding:4px 10px;border-radius:99px;font-size:12px;font-weight:850;white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.ok{background:var(--green-soft);color:#0d6d3b}
.pill.warn{background:var(--amber-soft);color:#775000}
.pill.info{background:var(--soft-blue);color:#0f6d98}
.pill.bad{background:#ffe1e0;color:#9d1822}

.uptime{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.uptime div{padding:8px 10px;border-radius:10px;background:var(--wash);text-align:center}
.uptime small{display:block;color:#718592;font-size:10px;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
.uptime b{display:block;margin-top:2px;font-size:15px;color:var(--ink)}

.empty{display:flex;align-items:center;gap:12px;margin:0;padding:16px 18px;border-radius:14px;background:var(--green-soft);color:#0d6d3b;font-weight:700}
.empty::before{content:"";width:10px;height:10px;flex:0 0 auto;border-radius:50%;background:#11834a;box-shadow:0 0 0 4px rgba(17,131,74,.15)}

.event{padding:4px 0 4px 20px;border-left:3px solid var(--line)}
.event+.event{margin-top:22px}
.event.ok{border-left-color:#5cc08a}.event.bad{border-left-color:#e2655c}.event.warn{border-left-color:#e5b23c}.event.info{border-left-color:var(--cyan)}
.event h3{margin:0 0 6px;font-size:18px;letter-spacing:-.015em}
.event>p{margin:0 0 10px;color:#405a6b}
.event-when{color:var(--muted);font-size:14px;font-weight:650}
.affects{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.affects span{padding:3px 9px;border-radius:99px;background:var(--soft-blue);color:#0f6d98;font-size:12px;font-weight:750}
.update{margin:12px 0 0;padding:12px 14px;border-radius:12px;background:var(--wash)}
.update-head{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin-bottom:4px}
.update-head strong{color:var(--navy)}
.update-head span{color:var(--muted);font-size:13px}
.update p{margin:0;color:#405a6b}

/* Subscribe form */
.narrow{width:min(720px,calc(100% - 32px))}
.form{display:grid;gap:16px;margin-top:6px}
.field-label{display:block;margin:0 0 7px;font-size:14px;font-weight:750}
.checks legend{padding:0 6px}
.input{display:block;width:100%;min-height:48px;padding:11px 13px;border:1px solid #b9cbd6;border-radius:10px;background:#fff;font:inherit;color:var(--ink)}
.input:focus{border-color:var(--blue);outline:3px solid rgba(22,126,174,.18);outline-offset:0}
.checks{display:grid;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--wash)}
.checks label{display:flex;gap:10px;align-items:center;font-weight:650}
.checks input{width:18px;height:18px;accent-color:var(--blue)}
.message{margin:0 0 6px;padding:13px 16px;border-radius:12px;font-weight:650}
.message.ok{background:var(--green-soft);color:#0d6d3b}
.message.err{background:var(--red-soft);color:#8a1d18;border:1px solid #f4c7c3}
.back{display:inline-flex;align-items:center;gap:6px;margin-bottom:16px;color:#bdd3df;text-decoration:none;font-weight:700}
.back:hover{color:#fff}

/* Footer: the homepage's navy footer */
.footer{padding:34px 0;background:var(--navy-950);color:#c9dbe5}
.footer-row{display:flex;flex-wrap:wrap;align-items:center;gap:18px}
.footer .brand{font-size:18px}
.footer .mark{width:30px;height:30px}
.footer-links{display:flex;flex-wrap:wrap;gap:10px}
.footer-links a{display:inline-flex;min-height:40px;align-items:center;padding:7px 13px;border:1px solid #56798c;border-radius:8px;color:#dceaf2;text-decoration:none;font-weight:750}
.footer-links a:hover,.footer-links a:focus-visible{border-color:#fff;background:#fff;color:var(--navy-950)}
.copyright{margin:18px 0 0;color:#8ca9b8;font-size:14px}

@media (max-width:640px){
  .nav{min-height:64px;gap:12px}
  .brand{gap:8px;font-size:17px}.mark{width:28px;height:28px}
  .brand-tag{padding:2px 7px;font-size:10px}
  .nav-links .button-small{min-height:38px;padding:7px 12px;font-size:13px}
  .nav-links>a:not(.button){display:none}
  .hero h1{gap:12px}
  .uptime{gap:6px}
  .hero-actions .button{flex:1 1 100%}
}
@media (max-width:380px){.brand-tag{display:none}}