*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{background:var(--sky-1)}
body{background-color:var(--sky-1);background-image:var(--sky-bg);background-repeat:no-repeat;background-size:100% 100%;color:var(--sky-ink);font-family:var(--font-ui);font-size:var(--fs-body);line-height:1.5;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.12;mix-blend-mode:multiply;background-image:var(--grain);z-index:100}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;cursor:pointer}
#app{max-width:var(--maxw);margin:0 auto;min-height:100dvh;position:relative;z-index:1}
.screen{min-height:100dvh;padding:var(--sp-5) var(--gutter);animation:screen-in var(--dur-3) var(--ease-out) both}
@keyframes screen-in{from{opacity:0;transform:translateY(10px);filter:blur(4px)}to{opacity:1;transform:none;filter:blur(0)}}

:focus-visible{outline:none;box-shadow:var(--focus-ring);border-radius:var(--r-sm)}

@property --btn-ring-angle{syntax:'<angle>';inherits:false;initial-value:0deg}

.btn{position:relative;display:block;width:100%;border:0;border-radius:var(--r-pill);padding:16px 20px;background:linear-gradient(155deg,var(--gold-bright) 0%,var(--sky-gold) 48%,var(--gold-strong) 100%);color:var(--ink);font-weight:700;font-size:var(--fs-body-lg);box-shadow:0 10px 24px -8px color-mix(in srgb, var(--gold-strong) 55%, transparent);overflow:hidden;isolation:isolate;transition:box-shadow var(--dur-1) var(--ease-out),transform var(--dur-1) var(--ease-out)}
.btn::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:2px;background:conic-gradient(from var(--btn-ring-angle,0deg), transparent 0% 55%, var(--gold-bright) 72%, #fff 82%, var(--gold-bright) 90%, transparent 100%);-webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:btn-ring-spin 6s linear infinite}
@keyframes btn-ring-spin{to{--btn-ring-angle:360deg}}
.btn:hover,.btn:focus-visible{box-shadow:0 14px 30px -6px color-mix(in srgb, var(--sky-gold-strong) 65%, transparent)}
.btn:active{background:linear-gradient(155deg,var(--sky-gold) 0%,var(--gold-strong) 100%);transform:scale(.98)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--line-strong);box-shadow:none}
.btn-ghost::before{display:none}
.btn.is-disabled,.btn:disabled{box-shadow:none}
.btn.is-disabled::before,.btn:disabled::before{display:none;animation:none}
.h-display{font-family:var(--font-display);font-size:var(--fs-display);line-height:1.05;margin:0}
.h1{font-family:var(--font-display);font-size:var(--fs-h1);line-height:1.18;margin:0;word-break:normal;overflow-wrap:normal;hyphens:none;text-wrap:balance}
.h2{font-family:var(--font-display);font-size:var(--fs-h2);line-height:1.15;margin:0}
.lead{font-size:var(--fs-body-lg);color:var(--sky-ink-soft)}
.caption{font-size:var(--fs-caption);color:var(--sky-ink-faint)}
.credit{font-size:11px;color:var(--ink-faint)}
.credit a{color:inherit}

@media (min-width:960px){
  #app:has(.screen-landing){max-width:1120px}
}