@font-face{font-family:Satoshi;src:url('assets/fonts/satoshi-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Newsreader;src:url('assets/fonts/newsreader-variable.ttf') format('truetype');font-weight:200 800;font-display:swap}
:root{color-scheme:dark;font-family:Satoshi,Arial,sans-serif;color:#f4f3e8;background:#07565b}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;padding:clamp(24px,5vw,64px);display:flex;flex-direction:column}
.brand{display:flex;align-items:center;gap:12px;font-size:28px;letter-spacing:-.035em}
.brand-mark{width:34px;height:34px;background:currentColor;mask:url('assets/greyfold/mark.png') center/contain no-repeat;-webkit-mask:url('assets/greyfold/mark.png') center/contain no-repeat}
main{flex:1;display:grid;align-content:center;width:min(100%,460px);margin:48px auto 80px}
h1{margin:0 0 18px;font:400 clamp(44px,8vw,68px)/1.08 Newsreader,Georgia,serif;letter-spacing:-.025em}
p{font-size:17px;line-height:1.5;margin:0 0 38px}
label{display:block;font-size:16px;margin-bottom:10px}
.entry-controls{display:flex;gap:12px}
input,button{font:inherit;min-height:54px;border-radius:0}
input{width:100%;min-width:0;background:transparent;color:inherit;border:1px solid #f4f3e880;padding:12px 16px;font-size:18px}
button{flex-shrink:0;padding:12px 22px;background:#73c9a2;color:#171717;border:1px solid #73c9a2;cursor:pointer}
button:hover{background:#8ed9b7}
input:focus-visible,button:focus-visible{outline:2px solid #f4f3e8;outline-offset:4px}
input[aria-invalid=true]{border-color:#f38b57}
.entry-error{color:#ffd1b8;min-height:1.5em;margin:14px 0 0;font-size:16px}
noscript p{margin-top:20px}
@media(max-width:420px){.entry-controls{flex-direction:column}button{width:100%}}
