:root { color-scheme: light; --paper:#f5f3eb; --ink:#223d33; --green:#176956; --muted:#52665b; --line:#ced5c9; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:system-ui,sans-serif; line-height:1.55; }
header { min-height:88px; padding:22px clamp(20px,6vw,88px); border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; gap:16px; }
a { color:var(--green); }
.brand { font:1.5rem Georgia,serif; text-decoration:none; color:var(--ink); }
header span { color:var(--muted); font-size:.85rem; }
main { max-width:1100px; margin:70px auto; padding:0 28px; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
h1,h2 { font-family:Georgia,serif; font-weight:400; line-height:1.15; }
h1 { font-size:clamp(2.6rem,5vw,4.2rem); margin:24px 0; }
h2 { font-size:1.9rem; margin:0 0 14px; }
p { color:var(--muted); }
.eyebrow { font-size:.72rem; letter-spacing:.13em; font-weight:650; }
.intro > p:last-child { max-width:36ch; }
.card { background:#fffef9; border:1px solid var(--line); border-radius:20px; padding:clamp(24px,4vw,42px); box-shadow:0 16px 36px #223d3309; min-width:0; }
form { display:flex; flex-direction:column; }
label { font-size:.92rem; font-weight:600; margin:18px 0 7px; }
input,select,button { font:inherit; min-height:48px; width:100%; border-radius:9px; }
input,select { background:#fff; color:var(--ink); padding:11px 12px; border:1px solid #8e9e92; min-width:0; }
button { margin-top:24px; background:var(--green); color:#fff; border:1px solid var(--green); padding:12px 20px; font-weight:650; cursor:pointer; }
button:hover:not(:disabled) { background:#115241; }
:focus-visible { outline:3px solid #926622; outline-offset:3px; }
:disabled { opacity:.62; cursor:wait; }
.help { font-size:.8rem; margin:8px 0 0; }
#authStatus { min-height:1.6em; color:#774723; font-size:.92rem; overflow-wrap:anywhere; }
.privacy { font-size:.78rem; border-top:1px solid var(--line); padding-top:18px; }
footer { margin:0 auto 30px; max-width:860px; padding:0 24px; text-align:center; font-size:.78rem; color:var(--muted); }
@media (max-width:700px) { header { min-height:72px; padding:18px 20px; } main { grid-template-columns:1fr; gap:24px; margin:32px auto; padding:0 18px; max-width:500px; } h1 { font-size:2.6rem; margin:12px 0; } .intro > p:last-child { display:none; } .eyebrow { font-size:.64rem; } .card { padding:25px 22px; border-radius:16px; } }