:root{
  --ink:#2f2f2f; --ink-2:#383838; --line:#505050; --paper:#ffffff; --muted:#c9c9c9;
  --cookie:#e8915c; --poppy:#e52222; --poppy-dark:#c41818; --leaf:#8fd17f;
  --font:"Avenir Next","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--paper);font:1.0625rem/1.65 var(--font);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--cookie);text-underline-offset:.18em}
a:hover{color:#f4b08a}
:focus-visible{outline:3px solid var(--cookie);outline-offset:3px;border-radius:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--paper);color:var(--ink);padding:.6rem 1rem;z-index:10}
.skip:focus{left:0}
.wrap{width:min(1080px,100% - 2.5rem);margin-inline:auto}
main{padding-block:2.5rem 4rem}
h1,h2,h3{line-height:1.15;letter-spacing:-.015em;margin:0 0 .6em}
h1{font-size:clamp(2.3rem,5.4vw,3.9rem);font-weight:800;max-width:15ch}
h2{font-size:clamp(1.5rem,3vw,2rem);font-weight:750}
h3{font-size:1.15rem}
p{margin:0 0 1em;max-width:62ch}
.lead{font-size:1.25rem;color:var(--muted);max-width:52ch}
.small{font-size:.875rem;color:var(--muted)}

.site-header{border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-block:.9rem}
.brand img{display:block;height:44px;width:auto}
nav{display:flex;gap:.25rem 1.4rem;flex-wrap:wrap}
nav a{color:var(--paper);text-decoration:none;padding:.35rem 0;border-bottom:2px solid transparent}
nav a:hover{border-color:var(--cookie)}
nav a[aria-current=page]{border-color:var(--poppy)}

.hero{position:relative;overflow:hidden;padding-block:3rem 2rem}
.hero .wrap{position:relative;z-index:1}
.hero-cookie{position:absolute;right:-9rem;top:-3rem;width:clamp(300px,46vw,560px);opacity:.95;transform:rotate(8deg);pointer-events:none}
.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.btn{display:inline-block;font:inherit;font-weight:700;background:var(--poppy);color:#fff;border:2px solid var(--poppy);padding:.65rem 1.25rem;border-radius:6px;text-decoration:none;cursor:pointer}
.btn:hover{background:var(--poppy-dark);border-color:var(--poppy-dark);color:#fff}
.btn.ghost{background:transparent;border-color:var(--muted);color:var(--paper)}
.btn.ghost:hover{border-color:var(--paper);background:transparent}
.btn.small{padding:.35rem .8rem;font-size:.9rem}
.btn.danger{background:transparent;border-color:var(--poppy);color:#ff9b9b}

.rows{border-top:1px solid var(--line);margin-top:1rem}
.row{display:grid;grid-template-columns:minmax(0,15rem) 1fr;gap:1rem 2.5rem;padding:1.4rem 0;border-bottom:1px solid var(--line)}
.row h3{margin:0}
.row p{margin:0}
@media(max-width:640px){.row{grid-template-columns:1fr}}
section+section{margin-top:3.5rem}

.devnote{display:inline-block;border-left:4px solid var(--poppy);padding:.5rem 1rem;background:var(--ink-2);color:var(--muted);margin:0}
.status{display:inline-block;font-size:.85rem;font-weight:700;padding:.1rem .6rem;border-radius:99px;border:1px solid var(--line)}
.status.approved,.hire{color:var(--leaf);border-color:var(--leaf)}
.status.pending{color:#ffd37a;border-color:#ffd37a}
.status.rejected{color:#ff9b9b;border-color:#ff9b9b}

.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:1.25rem;margin-top:1.5rem}
.person{background:var(--ink-2);border:1px solid var(--line);border-radius:10px;padding:1.2rem}
.person header{display:flex;gap:.9rem;align-items:center;margin-bottom:.7rem}
.person img{width:52px;height:52px;border-radius:50%;object-fit:cover;background:var(--ink)}
.person h3{margin:0;font-size:1.05rem}
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:.35rem;padding:0;margin:.4rem 0 0}
.tags li{font-size:.82rem;border:1px solid var(--line);border-radius:4px;padding:.05rem .5rem;color:var(--muted)}
details{margin-top:.6rem}
summary{cursor:pointer;color:var(--cookie)}
.work{padding-left:1.1rem}

form.stack{display:grid;gap:1rem;max-width:560px}
label{display:grid;gap:.3rem;font-weight:650}
label.check{display:flex;gap:.6rem;align-items:center;font-weight:500}
input[type=text],input[type=url],textarea{font:inherit;color:var(--paper);background:var(--ink-2);border:1.5px solid #777;border-radius:6px;padding:.6rem .75rem;width:100%}
textarea{min-height:7rem;resize:vertical}
input[type=checkbox]{width:1.25rem;height:1.25rem;accent-color:var(--poppy)}
.hint{font-weight:400;font-size:.88rem;color:var(--muted)}
.panel{background:var(--ink-2);border:1px solid var(--line);border-radius:10px;padding:1.3rem;margin-top:1rem}
.list{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
.list li{border-top:1px solid var(--line);padding-top:.8rem}
.msg{min-height:1.5em;margin-top:.5rem}
.msg.error{color:#ff9b9b}.msg.ok{color:var(--leaf)}
.unread{border-left:4px solid var(--poppy);padding-left:.7rem}
[hidden]{display:none!important}

.site-footer{border-top:1px solid var(--line);padding-block:2rem;color:var(--muted);font-size:.95rem}
.site-footer p{max-width:80ch;margin-bottom:.6rem}
.links{display:flex;gap:1.2rem;flex-wrap:wrap}
.legal h2{margin-top:2rem}.legal li{margin-bottom:.4rem}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
.hero>*:not(.hero-cookie){position:relative;z-index:1}