.st-directory,
.st-single-wrap {
    --st-bg: #f5f7fb;
    --st-card: #ffffff;
    --st-text: #172033;
    --st-muted: #667085;
    --st-line: #e6eaf0;
    --st-accent: #1d4ed8;
    box-sizing: border-box;
    max-width: 1180px;
    margin: 24px auto;
    padding: 0 16px;
    color: var(--st-text);
}
.st-directory *, .st-single-wrap * { box-sizing: border-box; }

.st-toolbar {
    display:flex; gap:14px; align-items:center; justify-content:space-between;
    margin:0 0 22px;
}
.st-search { flex:1; }
.st-search input {
    width:100%; height:48px; border:1px solid var(--st-line); border-radius:14px;
    padding:0 16px; font-size:16px; background:#fff; outline:none;
}
.st-search input:focus { border-color:var(--st-accent); box-shadow:0 0 0 3px rgba(29,78,216,.10); }
.st-count {
    min-width:44px; height:40px; padding:0 13px; border-radius:999px;
    background:#eef3ff; display:flex; align-items:center; justify-content:center;
    font-weight:700; color:var(--st-accent);
}
.st-grid {
    display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px;
}
.st-card {
    background:var(--st-card); border:1px solid var(--st-line); border-radius:22px;
    overflow:hidden; transition:transform .18s ease, box-shadow .18s ease;
}
.st-card:hover { transform:translateY(-3px); box-shadow:0 12px 30px rgba(16,24,40,.10); }
.st-card-link { display:block; height:100%; color:inherit; text-decoration:none; }
.st-photo {
    height:250px; background:linear-gradient(135deg,#eef2f7,#dfe7f2);
    display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.st-photo img { width:100%; height:100%; object-fit:cover; }
.st-avatar {
    width:96px; height:96px; border-radius:50%; background:#dbe7ff;
    color:#1d4ed8; display:flex; align-items:center; justify-content:center;
    font-size:38px; font-weight:700;
}
.st-avatar-lg { width:150px; height:150px; font-size:58px; }
.st-card-body { padding:18px 18px 20px; }
.st-card h3 { margin:0 0 8px; font-size:20px; line-height:1.25; }
.st-position { font-weight:700; margin-bottom:7px; }
.st-subjects { color:var(--st-accent); margin-bottom:8px; }
.st-short-meta { color:var(--st-muted); font-size:14px; line-height:1.45; }
.st-more { display:inline-block; margin-top:14px; font-weight:700; color:var(--st-accent); }
.st-empty { padding:28px; text-align:center; background:#fff; border:1px solid var(--st-line); border-radius:18px; }
.st-breadcrumb { margin-bottom:18px; }
.st-breadcrumb a { color:var(--st-accent); text-decoration:none; font-weight:600; }
.st-profile { background:#fff; border:1px solid var(--st-line); border-radius:24px; padding:28px; }
.st-profile-head {
    display:grid; grid-template-columns:180px 1fr; gap:28px; align-items:center;
    padding-bottom:26px; border-bottom:1px solid var(--st-line);
}
.st-profile-photo {
    width:180px; height:220px; border-radius:18px; overflow:hidden;
    background:linear-gradient(135deg,#eef2f7,#dfe7f2); display:flex; align-items:center; justify-content:center;
}
.st-profile-photo img { width:100%; height:100%; object-fit:cover; }
.st-kicker { color:var(--st-accent); font-size:14px; font-weight:700; margin-bottom:8px; }
.st-profile h1 { margin:0; font-size:34px; line-height:1.15; }
.st-profile-position { margin-top:10px; font-size:18px; color:var(--st-muted); }
.st-fields {
    display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:24px;
}
.st-field { border:1px solid var(--st-line); border-radius:16px; padding:16px; background:#fafbfc; }
.st-label { color:var(--st-muted); font-size:13px; font-weight:700; margin-bottom:7px; }
.st-value { font-size:16px; line-height:1.55; white-space:normal; overflow-wrap:anywhere; }
.st-description { margin-top:24px; padding-top:24px; border-top:1px solid var(--st-line); }
.st-description h2 { font-size:22px; margin:0 0 12px; }

@media (max-width: 900px) {
    .st-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .st-profile-head { grid-template-columns:140px 1fr; }
    .st-profile-photo { width:140px; height:180px; }
    .st-fields { grid-template-columns:1fr; }
}
@media (max-width: 620px) {
    .st-directory, .st-single-wrap { padding:0 12px; margin-top:16px; }
    .st-toolbar { flex-direction:column; align-items:stretch; }
    .st-grid { grid-template-columns:1fr; }
    .st-photo { height:280px; }
    .st-profile { padding:18px; border-radius:18px; }
    .st-profile-head { grid-template-columns:1fr; gap:16px; }
    .st-profile-photo { width:140px; height:180px; }
    .st-profile h1 { font-size:27px; }
}