:root{color-scheme:light;font-family:Segoe UI,system-ui,sans-serif;line-height:1.5;color:#1a1a1a;background:#f3f5f8}*{box-sizing:border-box}body{margin:0}.page{max-width:1280px;margin:0 auto;padding:2rem 1rem 3rem}.header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1.5rem}.eyebrow{margin:0 0 .25rem;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:#64748b}h1,h2{margin:0}h1{font-size:clamp(1.75rem,4vw,2.25rem)}.layout{display:grid;gap:1.25rem}@media(min-width:900px){.layout{grid-template-columns:320px 1fr;align-items:start}}.card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:1.25rem;box-shadow:0 8px 24px #0f172a0f}.form{display:grid;gap:.85rem;margin-top:1rem}label{display:grid;gap:.35rem;font-size:.92rem;font-weight:600}input{width:100%;padding:.65rem .75rem;border:1px solid #cbd5e1;border-radius:10px;font:inherit}input:focus{outline:2px solid #2563eb;outline-offset:1px;border-color:#2563eb}button,.ghost{border:none;border-radius:10px;padding:.7rem 1rem;font:inherit;font-weight:600;cursor:pointer}button[type=submit],button:not(.ghost){background:#2563eb;color:#fff}button:disabled,.ghost:disabled{opacity:.6;cursor:not-allowed}.ghost{background:#fff;border:1px solid #cbd5e1;color:#334155}.toolbar{display:grid;gap:.75rem;margin-bottom:1rem}.search{max-width:420px}.table-wrap{overflow-x:auto}.phone-fields{margin:0;padding:.85rem 1rem 1rem;border:1px solid #cbd5e1;border-radius:10px}.phone-fields legend{padding:0 .35rem;font-size:.92rem;font-weight:600}.phone-grid{display:grid;gap:.85rem}@media(min-width:640px){.phone-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}table{width:100%;border-collapse:collapse}.phonebook-table{border:1px solid #1a1a1a}.phonebook-table th,.phonebook-table td{padding:.65rem .5rem;text-align:center;border:1px solid #1a1a1a;vertical-align:middle}.phonebook-table thead th{background:#3b5988;color:#fff;font-size:.95rem;font-weight:700;text-transform:none;letter-spacing:normal}.phonebook-table tbody td{background:#fff;font-size:.92rem}.phonebook-table tbody tr:nth-child(2n) td{background:#f8fafc}th,td{padding:.75rem .5rem;text-align:left;border-bottom:1px solid #e2e8f0}th{font-size:.85rem;text-transform:uppercase;letter-spacing:.04em;color:#64748b}.phonebook-table td a{color:#1d4ed8;text-decoration:none;word-break:break-word}.phonebook-table td a:hover{text-decoration:underline}.error{margin:0 0 1rem;padding:.75rem .9rem;border-radius:10px;background:#fef2f2;color:#b91c1c}.muted{color:#64748b}
