*{box-sizing:border-box}
html{background:var(--bg);-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;color:var(--ink);font-family:var(--font);font-size:var(--fs-m);line-height:1.5;
  background:linear-gradient(155deg,#fbfbff 0%,#f5f7ff 50%,#f3fffc 100%)}
h1,h2,h3,p{margin:0}
h1{font-size:var(--fs-xl);line-height:1.15;letter-spacing:-.02em}
h2{font-size:var(--fs-l);line-height:1.2}
h3{font-size:var(--fs-m);line-height:1.25}
button,input,select{font:inherit;color:inherit}
button{cursor:pointer;-webkit-tap-highlight-color:transparent}
button:disabled{cursor:not-allowed}
:focus-visible{outline:3px solid var(--purple);outline-offset:3px;border-radius:8px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:8px;top:-60px;background:var(--ink);color:#fff;padding:10px 14px;border-radius:10px;z-index:50}
.skip-link:focus{top:8px}
.app-frame{max-width:560px;min-height:100vh;margin:0 auto;background:rgba(250,250,255,.85);
  border-inline:1px solid #fff;padding-bottom:calc(84px + env(safe-area-inset-bottom))}
@media(min-width:900px){
  body{background:linear-gradient(155deg,#eceeff,#e9fbf6)}
  .app-frame{max-width:720px;margin-block:0;box-shadow:0 0 70px rgba(66,68,106,.1)}
}
h1:focus{outline:none}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
html[data-motion="off"] *,html[data-motion="off"] *::before,html[data-motion="off"] *::after{animation:none!important;transition:none!important}
.noscript{padding:24px}
