.csa-app-body { min-height:100vh; background:var(--csa-bg); }
.csa-app-shell { min-height:100vh; display:grid; grid-template-columns:250px 1fr; }
.csa-sidebar { background:linear-gradient(180deg,#122c4d 0,#0d1f36 100%); color:#fff; padding:24px 18px; display:flex; flex-direction:column; position:sticky; top:0; height:100vh; }
.csa-sidebar-brand { display:flex; align-items:center; gap:12px; font-weight:800; font-size:18px; margin-bottom:34px; padding:0 8px; }
.csa-brand-mark { width:36px; height:36px; border-radius:12px; display:grid; place-items:center; background:linear-gradient(135deg,var(--csa-accent),#4bb5a6); }
.csa-nav { display:grid; gap:8px; }
.csa-nav a { text-decoration:none; color:#dce8f5; padding:12px 14px; border-radius:12px; font-weight:700; }
.csa-nav a:hover, .csa-nav a.active { background:rgba(255,255,255,.12); color:#fff; }
.csa-sidebar-user { margin-top:auto; display:flex; gap:10px; align-items:center; padding:14px 8px; border-top:1px solid rgba(255,255,255,.1); }
.csa-sidebar-user small { display:block; color:#a9bbce; max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.csa-avatar { width:38px; height:38px; border-radius:50%; display:grid; place-items:center; background:#fff; color:var(--csa-primary); font-weight:900; }
.csa-logout { color:#f8c6c6; text-decoration:none; padding:10px 8px; font-weight:700; }
.csa-main { padding:30px; min-width:0; }
.csa-topbar { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:24px; }
.csa-topbar h1 { margin:4px 0 0; font-size:30px; }
.csa-eyebrow { text-transform:uppercase; letter-spacing:.12em; font-size:12px; color:var(--csa-muted); font-weight:800; }
.csa-btn { display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--csa-border); background:#fff; color:var(--csa-text); padding:11px 15px; border-radius:11px; font-weight:800; text-decoration:none; cursor:pointer; }
.csa-btn-primary { border-color:transparent; background:linear-gradient(135deg,var(--csa-primary),var(--csa-primary-2)); color:#fff; }
.csa-btn-small { padding:8px 11px; font-size:13px; }
.csa-panel, .csa-tree-card, .csa-empty-card { background:var(--csa-panel); border:1px solid var(--csa-border); border-radius:var(--csa-radius); box-shadow:var(--csa-shadow); padding:24px; }
.csa-stats-row { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:18px; }
.csa-stats-row article { background:#fff; border:1px solid var(--csa-border); border-radius:16px; padding:18px; box-shadow:0 8px 26px rgba(22,36,58,.06); }
.csa-stats-row strong { display:block; font-size:24px; }
.csa-stats-row span { color:var(--csa-muted); font-size:13px; }
.csa-form-grid { display:grid; gap:16px; }
.csa-form-two-cols { grid-template-columns:repeat(2,minmax(0,1fr)); }
.csa-form-grid label { display:grid; gap:7px; font-weight:700; color:#31445a; }
.csa-form-grid input, .csa-form-grid select, .csa-form-grid textarea { width:100%; border:1px solid var(--csa-border); background:#fbfdff; padding:12px 13px; border-radius:10px; }
.csa-form-grid input:focus, .csa-form-grid select:focus, .csa-form-grid textarea:focus { outline:none; border-color:var(--csa-primary-2); box-shadow:0 0 0 4px rgba(36,95,141,.10); }
.csa-span-2 { grid-column:1 / -1; }
.csa-form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:4px; }
.csa-member-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px; }
.csa-member-card { background:#fff; border:1px solid var(--csa-border); border-radius:16px; padding:18px; box-shadow:0 8px 26px rgba(22,36,58,.06); display:grid; grid-template-columns:58px 1fr auto; align-items:center; gap:14px; }
.csa-member-photo { width:58px; height:58px; border-radius:16px; overflow:hidden; background:#eaf1f8; display:grid; place-items:center; color:var(--csa-primary); font-weight:900; }
.csa-member-photo img { width:100%; height:100%; object-fit:cover; }
.csa-member-info h3 { margin:0 0 4px; }.csa-member-info p { margin:0 0 7px; color:var(--csa-muted); font-size:13px; }
.csa-badge { display:inline-block; font-size:11px; padding:4px 8px; border-radius:999px; font-weight:800; }.csa-badge.editable{background:#e7f8f4;color:#147766}.csa-badge.readonly{background:#eef2f6;color:#66778a}
.csa-profile-card { display:flex; gap:20px; align-items:center; }.csa-avatar-large { width:86px; height:86px; border-radius:24px; display:grid; place-items:center; background:linear-gradient(135deg,var(--csa-primary),var(--csa-primary-2)); color:#fff; font-size:30px; font-weight:900; }
.csa-notice { background:#e8f7ef; color:#156b45; border:1px solid #bde6ce; padding:12px 14px; border-radius:10px; margin-bottom:16px; }
@media(max-width:900px){.csa-app-shell{grid-template-columns:1fr}.csa-sidebar{position:relative;height:auto}.csa-main{padding:18px}.csa-form-two-cols{grid-template-columns:1fr}.csa-span-2{grid-column:auto}.csa-stats-row{grid-template-columns:1fr}.csa-topbar{align-items:flex-start;flex-direction:column}}
.csa-family-users{display:grid;gap:10px}.csa-family-user{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--csa-border);border-radius:12px;background:#fbfdff}.csa-family-user small{display:block;color:var(--csa-muted);margin-top:3px}