/* cybee 5.4 shell. */
html{background:var(--paper)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-body);font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.55}
a{color:var(--accent)}a:hover{color:var(--ink)}
img,svg{max-width:100%}img{display:block}figure{margin:0}p{margin:0 0 20px}
h1,h2,h3,h4{margin:0;font-weight:500}
h2{font-family:var(--font-display);font-size:clamp(44px,4.4vw,64px);letter-spacing:-.045em;line-height:1.1}
h3{font-size:28px;line-height:1.2;letter-spacing:-.025em}h4{font-size:20px;line-height:1.3}
code,pre{font-family:var(--font-mono)}code{font-size:.88em}pre{white-space:pre-wrap;overflow-wrap:anywhere}
small{font-size:14px}
::selection{background:var(--blue);color:#fff}
input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}
:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.muted,.caption{color:var(--muted)}.caption{font-size:14px;line-height:1.5}
.eyebrow{font-family:var(--font-mono);font-size:14px;letter-spacing:.05em;line-height:1.5;text-transform:uppercase;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:'';display:block;flex:0 0 6px;width:6px;height:6px;background:var(--blue)}
.page{max-width:var(--frame);padding:0 var(--gutter-desktop);margin:auto}
@media(max-width:1020px){.page{padding:0 var(--gutter-mid)}}
@media(max-width:520px){.page{padding:0 var(--gutter-phone)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}