:root{color-scheme:light dark;--bg: #f6f7f9;--panel: #ffffff;--ink: #16181d;--muted: #6b7280;--line: #e5e7eb;--accent: #2f6df6}@media(prefers-color-scheme:dark){:root{--bg: #0f1115;--panel: #171a21;--ink: #e8eaed;--muted: #9aa3b2;--line: #262a33;--accent: #6f9dff}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}.app{max-width:820px;margin:0 auto;padding:40px 24px 64px}.app__header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}h1{margin:0;font-size:26px;letter-spacing:-.02em}h2{margin:0;font-size:16px}.app__subtitle{margin:6px 0 0;color:var(--muted);font-size:14px}.btn{border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:8px;padding:9px 14px;font:inherit;font-weight:500;cursor:pointer}.btn:hover{border-color:var(--accent)}.btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}.panel{margin-top:28px;background:var(--panel);border:1px solid var(--line);border-radius:12px;overflow:hidden}.panel__head{display:flex;align-items:center;gap:10px;padding:16px 18px;border-bottom:1px solid var(--line)}.badge{background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:1px 9px;font-size:12px;color:var(--muted)}.list{list-style:none;margin:0;padding:0}.list__row{display:grid;grid-template-columns:1.2fr 1.6fr auto;gap:12px;padding:13px 18px;border-bottom:1px solid var(--line)}.list__row:last-child{border-bottom:0}.list__name{font-weight:500}.list__email,.list__date{color:var(--muted);font-size:14px}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#090b1080;display:grid;place-items:center;padding:24px}.modal{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:22px;width:min(420px,100%)}.modal h2{margin-bottom:16px}.field{display:block;margin-bottom:14px}.field span{display:block;font-size:13px;color:var(--muted);margin-bottom:5px}.field input{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit}.field input:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.error{color:#d33a3a;font-size:13px;margin:0 0 12px}.modal__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}.search{margin-left:auto;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);font:inherit;font-size:13px;min-width:200px}.btn--small{padding:4px 10px;font-size:12px}.list__row{grid-template-columns:1.2fr 1.6fr auto auto;align-items:center}.empty{padding:18px;margin:0;color:var(--muted);font-size:14px}