:root{
  --sys-ink:#1f1f23;
  --sys-muted:#6f6f79;
  --sys-line:rgba(31,31,35,.11);
  --sys-violet:#5147ee;
  --sys-violet-deep:#4036d8;
  --sys-paper:#f7f7fa;
  --sys-dark:#211f2f;
  --sys-radius:16px;
}

*{ box-sizing:border-box; }
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
html{ min-height:100%; background:var(--sys-paper); }
body.system-page{
  min-height:100vh;
  margin:0;
  display:flex;
  flex-direction:column;
  color:var(--sys-ink);
  background:
    radial-gradient(900px 520px at 84% 12%, rgba(81,71,238,.13), transparent 67%),
    radial-gradient(720px 460px at 7% 58%, rgba(126,118,255,.09), transparent 70%),
    var(--sys-paper);
  font-family:"Inter",sans-serif;
}

.sys-shell{ width:min(1180px,calc(100% - 48px)); margin:0 auto; }

.sys-header{
  position:relative;
  z-index:10;
  min-height:88px;
  display:flex;
  align-items:center;
  background:rgba(255,255,255,.76);
  border-bottom:1px solid rgba(31,31,35,.08);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.sys-header-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; }
.sys-logo{ display:inline-flex; color:inherit; text-decoration:none; }
.sys-logo .ch-mark{ transition:transform .35s cubic-bezier(.16,1,.3,1),color .25s ease; }
.sys-logo:hover .ch-mark{ color:#6961f4; transform:rotate(-3deg) translateY(-1px); }
.sys-home-link{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:0 15px;
  color:var(--sys-ink);
  border:1px solid var(--sys-line);
  border-radius:10px;
  background:rgba(255,255,255,.72);
  text-decoration:none;
  font-family:"Inter Tight",sans-serif;
  font-size:14px;
  font-weight:600;
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.sys-home-link:hover{ transform:translateY(-1px); border-color:rgba(81,71,238,.35); background:#fff; }

.sys-main{ position:relative; flex:1; display:grid; align-items:center; padding:72px 0 88px; overflow:hidden; }
.sys-main::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.45;
  background-image:
    linear-gradient(rgba(31,31,35,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(31,31,35,.035) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:linear-gradient(to bottom,transparent 0,#000 18%,#000 75%,transparent 100%);
}

.sys-stage{ position:relative; z-index:1; }
.sys-panel{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(31,31,35,.10);
  border-radius:var(--sys-radius);
  background:rgba(255,255,255,.82);
  box-shadow:0 30px 80px -48px rgba(31,31,50,.36);
}
.sys-panel::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.86);
}

.sys-eyebrow{
  margin:0 0 22px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  color:var(--sys-violet);
  font-family:"Inter Tight",sans-serif;
  font-size:12px;
  line-height:1;
  font-weight:700;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.sys-eyebrow::before{ content:""; width:7px; height:7px; border-radius:50%; background:currentColor; box-shadow:0 0 0 5px rgba(81,71,238,.10); }
.sys-title{
  margin:0;
  font-family:"Inter Tight",sans-serif;
  font-size:clamp(44px,6vw,82px);
  line-height:.98;
  letter-spacing:-.052em;
  font-weight:600;
  text-wrap:balance;
}
.sys-copy{ margin:24px 0 0; color:var(--sys-muted); font-size:17px; line-height:1.62; max-width:56ch; text-wrap:pretty; }

.sys-actions{ display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-top:34px; }
.sys-primary,.sys-secondary{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:11px;
  padding:0 21px;
  border-radius:10px;
  font-family:"Inter Tight",sans-serif;
  font-size:15px;
  font-weight:650;
  text-decoration:none;
  cursor:pointer;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease;
}
.sys-primary{ border:1px solid transparent; color:#fff; background:linear-gradient(112deg,var(--sys-violet),var(--sys-violet-deep)); box-shadow:0 12px 28px -14px rgba(81,71,238,.72); }
.sys-secondary{ color:var(--sys-ink); background:#fff; border:1px solid var(--sys-line); }
.sys-primary:hover,.sys-secondary:hover{ transform:translateY(-2px); }
.sys-primary:hover{ box-shadow:0 18px 34px -16px rgba(81,71,238,.8); }
.sys-secondary:hover{ border-color:rgba(81,71,238,.35); }

/* 404 */
.error-panel{ min-height:590px; display:grid; grid-template-columns:minmax(0,1fr) minmax(340px,.72fr); }
.error-copy{ display:flex; flex-direction:column; justify-content:center; padding:clamp(42px,6vw,78px); }
.error-art{
  position:relative;
  min-height:440px;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:var(--sys-dark);
  color:#fff;
}
.error-art::before,.error-art::after{
  content:"";
  position:absolute;
  border:1px solid rgba(148,140,255,.28);
  border-radius:50%;
  animation:sys-orbit 14s linear infinite;
}
.error-art::before{ width:480px; height:480px; }
.error-art::after{ width:310px; height:310px; animation-direction:reverse; animation-duration:11s; }
.error-number{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:min(84%,440px);
  font-family:"Inter Tight",sans-serif;
  font-size:clamp(112px,12vw,188px);
  line-height:.8;
  font-weight:600;
  letter-spacing:-.06em;
}
.error-number .error-mark{
  position:absolute;
  left:50%;
  top:50%;
  width:clamp(76px,8vw,122px);
  height:clamp(76px,8vw,122px);
  color:#6e65ff;
  transform:translate(-50%,-48%);
}
.error-number .error-mark svg{ width:100%; height:100%; display:block; }
.error-note{ position:absolute; left:28px; bottom:26px; right:28px; display:flex; justify-content:space-between; gap:12px; color:rgba(255,255,255,.48); font-size:12px; letter-spacing:.08em; text-transform:uppercase; }

/* Under construction */
.access-panel{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(360px,.8fr); }
.access-copy{ padding:clamp(42px,6vw,76px); }
.access-summary{
  position:relative;
  padding:clamp(28px,4vw,48px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  background:var(--sys-dark);
  color:#fff;
}
.access-summary::before{
  content:"";
  position:absolute;
  width:340px;
  height:340px;
  right:-170px;
  top:-150px;
  border:1px solid rgba(129,120,255,.28);
  border-radius:50%;
  box-shadow:0 0 0 58px rgba(129,120,255,.045),0 0 0 116px rgba(129,120,255,.028);
}
.capacity-row{ display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.capacity-label{ color:rgba(255,255,255,.58); font-size:13px; line-height:1.4; }
.capacity-value{ font-family:"Inter Tight",sans-serif; font-size:34px; line-height:1; letter-spacing:-.04em; font-weight:600; white-space:nowrap; }
.capacity-track{ height:7px; margin:18px 0 32px; overflow:hidden; border-radius:999px; background:rgba(255,255,255,.12); }
.capacity-track span{ display:block; height:100%; width:100%; border-radius:inherit; background:linear-gradient(90deg,#8178ff,#b1abff); transform-origin:left; animation:sys-fill .9s .28s cubic-bezier(.16,1,.3,1) both; }
.offer-card{ position:relative; z-index:1; padding:24px; border:1px solid rgba(255,255,255,.14); border-radius:var(--sys-radius); background:rgba(255,255,255,.06); }
.offer-kicker{ margin:0 0 9px; color:#a9a3ff; font-family:"Inter Tight",sans-serif; font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.offer-title{ margin:0; font-family:"Inter Tight",sans-serif; font-size:clamp(28px,3vw,40px); line-height:1.06; letter-spacing:-.04em; font-weight:600; }
.offer-copy{ margin:14px 0 0; color:rgba(255,255,255,.62); font-size:14px; line-height:1.55; }

.wait-form{ margin-top:34px; max-width:590px; }
.wait-field{ display:flex; align-items:center; gap:10px; padding:5px; border:1px solid var(--sys-line); border-radius:12px; background:#fff; box-shadow:0 14px 30px -25px rgba(31,31,35,.36); transition:border-color .2s ease,box-shadow .2s ease; }
.wait-field:focus-within{ border-color:rgba(81,71,238,.48); box-shadow:0 0 0 4px rgba(81,71,238,.08); }
.wait-field input{ min-width:0; flex:1; height:44px; padding:0 12px; border:0; outline:0; background:transparent; color:var(--sys-ink); font:500 15px/1 "Inter",sans-serif; }
.wait-field input::placeholder{ color:#92929a; }
.wait-field button{ min-height:44px; padding:0 18px; border:0; border-radius:9px; color:#fff; background:linear-gradient(112deg,var(--sys-violet),var(--sys-violet-deep)); font:650 14px/1 "Inter Tight",sans-serif; cursor:pointer; transition:transform .2s ease,box-shadow .2s ease; }
.wait-field button:hover{ transform:translateY(-1px); box-shadow:0 10px 22px -12px rgba(81,71,238,.8); }
.wait-privacy{ margin:10px 2px 0; color:#888891; font-size:12px; line-height:1.45; }
.wait-status{ min-height:20px; margin:10px 2px 0; color:var(--sys-violet-deep); font-size:13px; font-weight:600; }

.sys-footer{ background:var(--sys-dark); color:#fff; }
.sys-footer-inner{ min-height:106px; display:flex; align-items:center; justify-content:space-between; gap:32px; padding-top:26px; padding-bottom:26px; }
.sys-footer-brand{ display:flex; align-items:center; gap:18px; }
.sys-footer-brand [data-lockup-h]{ display:inline-flex; color:#fff; flex:none; }
.sys-footer-copy{ margin:0; color:rgba(255,255,255,.54); font-size:12px; line-height:1.5; max-width:440px; }
.sys-footer-meta{ display:flex; align-items:center; gap:20px; white-space:nowrap; color:rgba(255,255,255,.54); font-size:12px; }
.sys-footer-meta a{ color:inherit; text-decoration:none; }
.sys-footer-meta a:hover{ color:#fff; }

@keyframes sys-orbit{ to{ transform:rotate(360deg); } }
@keyframes sys-fill{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }

@media (max-width:860px){
  .error-panel,.access-panel{ grid-template-columns:1fr; }
  .error-art{ min-height:340px; grid-row:1; }
  .error-copy{ grid-row:2; }
  .access-summary{ min-height:360px; }
  .sys-footer-inner{ align-items:flex-start; }
  .sys-footer-brand{ align-items:flex-start; flex-direction:column; gap:12px; }
}

@media (max-width:600px){
  .sys-shell{ width:min(100% - 28px,1180px); }
  .sys-header{ min-height:74px; }
  .sys-logo [data-lockup-h]{ --mark-size:20px; }
  .sys-home-link{ min-height:38px; padding:0 12px; font-size:13px; }
  .sys-main{ padding:32px 0 44px; }
  .sys-panel{ border-radius:14px; }
  .error-copy,.access-copy{ padding:34px 24px 38px; }
  .error-art{ min-height:270px; }
  .error-art::before{ width:350px; height:350px; }
  .error-art::after{ width:220px; height:220px; }
  .error-note{ left:20px; right:20px; bottom:18px; font-size:10px; }
  .sys-title{ font-size:42px; }
  .sys-copy{ margin-top:18px; font-size:15px; }
  .sys-actions{ margin-top:28px; }
  .sys-primary,.sys-secondary{ width:100%; }
  .access-summary{ min-height:330px; padding:32px 24px; }
  .wait-field{ display:grid; padding:6px; }
  .wait-field button{ min-height:46px; }
  .sys-footer-inner{ min-height:0; flex-direction:column; align-items:flex-start; gap:22px; }
  .sys-footer-meta{ width:100%; justify-content:space-between; white-space:normal; }
}

@media (prefers-reduced-motion:reduce){
  .error-art::before,.error-art::after,.capacity-track span{ animation:none; }
  .sys-logo .ch-mark,.sys-primary,.sys-secondary,.wait-field button{ transition:none; }
}