:root{
  --bg:#f4f6fb; --card:#ffffff; --text:#172033; --muted:#69758a; --line:#e5e9f2;
  --primary:#1f4ed8; --primary-dark:#173ca6; --accent:#ff8a00;
  --shadow:0 18px 50px rgba(22,34,51,.08); --radius:22px;
}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at top left,#e8efff 0,transparent 34%),var(--bg);color:var(--text)}
a{color:inherit;text-decoration:none}
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}
.login-card{width:100%;max-width:420px;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.72);border-radius:28px;box-shadow:var(--shadow);padding:34px}
.brand-mark{width:54px;height:54px;border-radius:18px;background:linear-gradient(135deg,var(--primary),#6a8cff);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;font-size:22px;margin-bottom:18px}
h1,h2,h3{margin:0}.login-card h1{font-size:28px;letter-spacing:-.04em}.login-card p{color:var(--muted);line-height:1.55}
.input,textarea,select{width:100%;border:1px solid var(--line);background:#fff;border-radius:14px;padding:13px 14px;font-size:15px;outline:none;transition:.18s}
.input:focus,textarea:focus,select:focus{border-color:rgba(31,78,216,.55);box-shadow:0 0 0 4px rgba(31,78,216,.08)}
label{font-size:13px;font-weight:800;color:#344052;margin-bottom:7px;display:block}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-field.full{grid-column:1/-1}
.btn{border:0;border-radius:15px;padding:12px 16px;background:var(--primary);color:#fff;font-weight:900;cursor:pointer;display:inline-flex;align-items:center;gap:8px;transition:.18s;font-size:14px}
.btn:hover{background:var(--primary-dark);transform:translateY(-1px)}.btn.secondary{background:#eef2ff;color:#1f3d9a}.btn.danger{background:#fff0f0;color:#bd1f1f}.btn.ghost{background:#fff;color:#26354c;border:1px solid var(--line)}.btn.gold{background:#fff7da;color:#8a6100}
.alert{padding:12px 14px;border-radius:14px;margin:14px 0;background:#fff0f0;color:#a51f1f;font-weight:800}
.app{min-height:100vh;display:grid;grid-template-columns:280px 1fr}
.sidebar{padding:26px 20px;background:#101827;color:#fff;position:sticky;top:0;height:100vh}
.logo-row{display:flex;align-items:center;gap:12px;margin-bottom:32px}.logo{width:46px;height:46px;border-radius:16px;background:linear-gradient(135deg,var(--accent),#ffd08a);display:flex;align-items:center;justify-content:center;color:#101827;font-weight:900}
.logo-row strong{display:block;font-size:18px}.logo-row span{display:block;color:#a9b4c7;font-size:13px;margin-top:2px}
.nav-item{display:flex;align-items:center;gap:11px;padding:13px 14px;border-radius:14px;color:#cdd6e7;margin-bottom:8px;font-weight:800}
.nav-item.active,.nav-item:hover{background:rgba(255,255,255,.1);color:#fff}.sidebar-footer{position:absolute;left:20px;right:20px;bottom:22px;color:#9faabd;font-size:13px;line-height:1.5}
.main{padding:28px;overflow:hidden}.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:24px}.title-block h1{font-size:30px;letter-spacing:-.05em}.title-block p{margin:6px 0 0;color:var(--muted)}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:22px}.stat-card{background:var(--card);border:1px solid rgba(229,233,242,.9);border-radius:var(--radius);padding:18px;box-shadow:0 10px 26px rgba(22,34,51,.05)}.stat-card span{font-size:13px;color:var(--muted);font-weight:800}.stat-card strong{display:block;font-size:28px;letter-spacing:-.04em;margin-top:8px}
.panel{background:rgba(255,255,255,.9);border:1px solid rgba(229,233,242,.92);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;margin-bottom:20px}.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:12px;align-items:end}
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:20px;align-items:start}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.contact-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:17px;transition:.18s}.contact-card:hover{transform:translateY(-2px);box-shadow:0 16px 34px rgba(22,34,51,.08)}
.card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.avatar{width:44px;height:44px;border-radius:16px;background:linear-gradient(135deg,#e9efff,#fff2df);display:flex;align-items:center;justify-content:center;font-weight:900;color:#1f4ed8}.name-row{display:flex;gap:12px;align-items:center}.contact-card h3{font-size:17px;margin-bottom:3px}.muted{color:var(--muted)}.meta{font-size:13px;line-height:1.5}
.tag{display:inline-flex;align-items:center;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:900;white-space:nowrap}.tag-green{background:#e8f8ef;color:#157347}.tag-yellow{background:#fff6db;color:#956600}.tag-red{background:#ffecec;color:#b42318}.tag-blue{background:#ecf2ff;color:#1f4ed8}.tag-purple{background:#f2e9ff;color:#6f32c9}.tag-gray{background:#f1f3f6;color:#596579}.tag-gold{background:#fff5cf;color:#8a6100}
.card-actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}.detail-panel{position:sticky;top:28px}.detail-empty{text-align:center;padding:34px;color:var(--muted)}.detail-title{display:flex;gap:14px;align-items:center;margin-bottom:14px}.detail-title h2{font-size:22px;letter-spacing:-.03em}
.info-list{display:grid;gap:11px;margin-top:16px}.info-item{border:1px solid var(--line);border-radius:16px;padding:12px;background:#fbfcff}.info-item span{display:block;font-size:12px;font-weight:900;color:var(--muted);margin-bottom:4px}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;background:#fff;border-radius:18px;overflow:hidden}th,td{padding:13px 12px;border-bottom:1px solid var(--line);text-align:left;font-size:14px;vertical-align:top}th{background:#f8faff;color:#4a566b;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.empty-state{padding:40px;text-align:center;color:var(--muted);border:1px dashed #cbd4e6;border-radius:22px;background:#fbfcff}
.recommend-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.recommend-card{border:1px solid var(--line);background:#fff;border-radius:20px;padding:17px}.score{font-size:12px;font-weight:900;color:#7a8699}.star{font-size:18px;color:#d29300;margin-right:4px}.mini-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}.section-title p{margin:4px 0 0;color:var(--muted)}
@media(max-width:1100px){.app{grid-template-columns:1fr}.sidebar{height:auto;position:relative}.sidebar-footer{position:static;margin-top:20px}.content-grid{grid-template-columns:1fr}.detail-panel{position:relative;top:auto}.stats{grid-template-columns:repeat(2,1fr)}.recommend-grid{grid-template-columns:1fr}}
@media(max-width:720px){.main{padding:18px}.cards,.stats,.form-grid,.filters{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}}