:root { color-scheme: light dark; --paper:#fff; --ink:#182e34; --muted:#61747a; --petrol:#17677b; --line:#dce6e8; --canvas:#f3f7f7; }
* { box-sizing:border-box; }
body { margin:0; min-height:100dvh; display:grid; place-items:center; padding:clamp(20px,5vw,64px); color:var(--ink); background:radial-gradient(ellipse at top left,#17677b18,transparent 65%),var(--canvas); font:16px/1.6 system-ui,sans-serif; }
main { width:100%; max-width:460px; padding:clamp(24px,6vw,48px); border:1px solid var(--line); border-radius:28px; background:var(--paper); box-shadow:0 20px 80px #102f3810; }
.brand { display:flex; gap:12px; align-items:center; font-weight:750; letter-spacing:-.04em; font-size:1.5rem; }
.brand img { width:44px; height:44px; }
h1 { font-size:clamp(1.8rem,6vw,2.3rem); line-height:1.15; letter-spacing:-.04em; margin:32px 0 12px; }
p { color:var(--muted); margin:0 0 24px; }
form { display:grid; gap:20px; }
label { display:grid; gap:7px; font-size:.9rem; font-weight:600; }
input,select,button { font:inherit; width:100%; min-height:48px; padding:12px 14px; border-radius:12px; border:1px solid var(--line); background:var(--paper); color:var(--ink); }
button { background:var(--petrol); color:white; font-weight:650; border-color:transparent; cursor:pointer; margin-top:4px; }
button:hover { filter:brightness(1.1); }
:focus-visible { outline:3px solid #4797ac; outline-offset:3px; }
[role=alert] { padding:14px; border-radius:12px; color:#aa293d; background:#ffedf0; }
[hidden] { display:none; }
@media(prefers-color-scheme:dark) { :root { --paper:#172b32; --ink:#eef4f5; --muted:#a6b9bf; --petrol:#237f95; --line:#34505a; --canvas:#102026; } }
form + form { margin-top:28px; padding-top:24px; border-top:1px solid var(--line); }
h2 { margin:0; font-size:1.15rem; letter-spacing:-.02em; }
[role=status] { padding:14px; border-radius:12px; color:var(--petrol); background:#17677b0d; }
a.brand { text-decoration:none; color:inherit; }
.guest-login { background:transparent; color:var(--petrol); border:1px solid var(--petrol); }
.site-footer { width:min(1180px,100%); margin:40px auto 8px; padding-top:18px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--muted); font-size:13px; }
.site-footer a { color:inherit; text-decoration:none; }
.site-footer a:hover,.site-footer .version { color:var(--petrol); }
.site-footer-links { margin-left:auto; display:inline-flex; gap:14px; }

.delete-consent { display:flex; align-items:flex-start; gap:12px; }
.delete-consent input { width:22px; height:22px; min-height:22px; flex-shrink:0; margin:3px 0; accent-color:var(--petrol); }
button.danger { background:#aa293d; }