:root{color-scheme:light dark}body{font:18px/1.5 system-ui,sans-serif;margin:0;display:grid;min-height:100vh;place-items:center}main{max-width:28rem;padding:1.5rem;text-align:center}button{font:inherit;padding:.75rem 1.5rem;min-height:44px;cursor:pointer}:root{--boot-ground: #f6f2e7;--boot-ink: #1b1542;--boot-ink-2: #4a4466;--boot-line: rgba(27, 21, 66, .14);--boot-accent: #463a80;--boot-label: "Round the Bend";--boot-font: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--boot-size: 56px;--boot-fade: .2s;--boot-reveal-after: .2s;--boot-giveup: 20s}@media(prefers-color-scheme:dark){:root{--boot-ground: #15112f;--boot-ink: #efebdf;--boot-ink-2: #c4bedb;--boot-line: rgba(239, 235, 223, .12);--boot-accent: #b9b2d6}}:root[data-theme=dark]{--boot-ground: #15112f;--boot-ink: #efebdf;--boot-ink-2: #c4bedb;--boot-line: rgba(239, 235, 223, .12);--boot-accent: #b9b2d6}:root[data-theme=light]{--boot-ground: #f6f2e7;--boot-ink: #1b1542;--boot-ink-2: #4a4466;--boot-line: rgba(27, 21, 66, .14);--boot-accent: #463a80}body.is-booting>main{visibility:hidden}body.is-booting:before,body.is-booting:after{position:fixed;z-index:2147483000;pointer-events:none}body.is-booting:before{content:var(--boot-label);inset:0;display:grid;place-items:center;padding-top:calc(var(--boot-size) + 40px);background:var(--boot-ground);color:var(--boot-ink-2);font:500 14px/1.4 var(--boot-font);letter-spacing:.06em;animation:boot-in var(--boot-fade) ease-out var(--boot-reveal-after) backwards,boot-giveup 0s linear var(--boot-giveup) forwards}body.is-booting:after{content:"";top:calc(50% - var(--boot-size) / 2 - 12px);left:calc(50% - var(--boot-size) / 2);width:var(--boot-size);height:var(--boot-size);border-radius:50%;background:conic-gradient(from 0deg,transparent 0 25%,var(--boot-accent) 25% 100%);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),black calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 3px),black calc(100% - 2px));animation:boot-spin 1.6s linear infinite,boot-in var(--boot-fade) ease-out var(--boot-reveal-after) backwards,boot-giveup 0s linear var(--boot-giveup) forwards}@keyframes boot-spin{to{transform:rotate(360deg)}}@keyframes boot-in{0%{opacity:0}}@keyframes boot-out{to{opacity:0;visibility:hidden}}@keyframes boot-giveup{to{visibility:hidden}}@keyframes boot-show{to{visibility:visible}}body.is-booting.boot-done>main{visibility:visible}body.is-booting.boot-done:before,body.is-booting.boot-done:after{animation:boot-out var(--boot-fade) ease-out forwards}body.is-booting>main{animation:boot-show 0s linear var(--boot-giveup) forwards}@media(scripting:none){body.is-booting>main{visibility:visible;animation:none}body.is-booting:before,body.is-booting:after{display:none}}@media(prefers-reduced-motion:reduce){body.is-booting:before,body.is-booting:after{animation:boot-giveup 0s linear var(--boot-giveup) forwards}body.is-booting.boot-done:before,body.is-booting.boot-done:after{animation:none;visibility:hidden}}
