:root{--bg: #081017;--panel: rgba(10, 19, 27, .78);--stroke: rgba(255, 255, 255, .11);--text: #f8eee0;--muted: #b9c5cf;--accent: #79ffcb;--secondary: #4dd9bf;--danger: #ff6b6b;--font-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", Georgia, serif;--font-body: "Avenir Next", "Segoe UI", sans-serif;color-scheme:dark;font-family:var(--font-body);background:var(--bg);color:var(--text);line-height:1.5;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#app{min-height:100%;margin:0}body{overflow-x:hidden;background:radial-gradient(circle at top left,rgba(121,255,203,.14),transparent 30%),radial-gradient(circle at bottom right,rgba(77,217,191,.12),transparent 24%),linear-gradient(160deg,#071017,#0b1520 55%,#0a1318);color:var(--text)}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 20% 20%,rgba(121,255,203,.09),transparent 18%),radial-gradient(circle at 80% 10%,rgba(77,217,191,.07),transparent 18%),radial-gradient(circle at 70% 78%,rgba(255,255,255,.03),transparent 22%)}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{border:0;cursor:pointer}.app-shell{position:relative;min-height:100vh}.app-shell--desktop{--page-max-width: 1120px}.app-shell--mobile{--page-max-width: 100%}.page-shell{position:relative;min-height:100vh;padding:clamp(18px,4vw,36px);display:grid;place-items:center}.page-shell__cover,.page-shell__veil,.page-shell__grain{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none}.page-shell__cover{background-position:center;background-repeat:no-repeat;background-size:cover;filter:blur(28px) saturate(.82);opacity:.3;transform:scale(1.1)}.page-shell__veil{background:radial-gradient(circle at center,rgba(255,255,255,.06),transparent 38%),linear-gradient(180deg,#050a0e47,#050a0e99)}.page-shell__grain{opacity:.08;background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px);background-size:26px 26px;mix-blend-mode:soft-light}.page-shell__content{position:relative;z-index:1;width:min(100%,var(--page-max-width))}.page-card{padding:clamp(20px,3vw,30px);border-radius:30px;border:1px solid var(--stroke);background:linear-gradient(135deg,rgba(255,255,255,.06),transparent 35%),var(--panel);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);box-shadow:0 32px 90px #00000061,inset 0 0 0 1px #ffffff0a;animation:rise-in .42s ease both}.page-card--wide{width:min(100%,1040px)}.state-page{display:grid;gap:18px;width:min(100%,680px);text-align:left}.state-page__eyebrow{margin:0;color:var(--secondary);font-size:.78rem;letter-spacing:.22em;text-transform:uppercase}.state-page__title{margin:0;font-family:var(--font-display);font-size:clamp(2rem,5vw,3.6rem);line-height:.96;letter-spacing:-.04em}.state-page__body{margin:0;color:var(--muted);line-height:1.75;font-size:1.04rem}.state-page__code{margin:0;padding:12px 14px;border-radius:16px;background:#ffffff0d;color:var(--text);word-break:break-all}.state-page__actions{display:flex;flex-wrap:wrap;gap:12px}.state-page__primary{padding:12px 20px;border-radius:999px;color:#0a1f18;background:linear-gradient(120deg,#79ffcbeb,#4dd9bfe0)}.app-shell--desktop .page-card--wide{width:min(100%,1080px)}.app-shell--mobile .page-shell{place-items:stretch;padding:14px}.app-shell--mobile .page-shell__cover{opacity:.22;filter:blur(22px) saturate(.8)}.app-shell--mobile .page-shell__content,.app-shell--mobile .page-card--wide{width:100%}.app-shell--mobile .page-card{padding:18px;border-radius:22px}.app-shell--mobile .state-page{gap:16px}.app-shell--mobile .state-page__title{font-size:clamp(1.8rem,10vw,2.8rem)}.app-shell--mobile .state-page__body{font-size:.98rem}.app-shell--mobile .state-page__actions{display:grid}.app-shell--mobile .state-page__primary{width:100%}.page-fade-enter-active,.page-fade-leave-active{transition:opacity .22s ease,transform .22s ease}.page-fade-enter-from,.page-fade-leave-to{opacity:0;transform:translateY(12px)}@keyframes rise-in{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@media(max-width:720px){.page-card{border-radius:24px}.state-page{text-align:left}}
