:root { --ink:#192321; --muted:#67716e; --line:#d9dfdc; --paper:#f5f7f6; --green:#176b52; --green2:#0f4c3b; --amber:#d99728; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter,Arial,sans-serif; font-size:14px; letter-spacing:0; }
.topbar { min-height:82px; padding:16px clamp(18px,4vw,54px); display:flex; align-items:center; justify-content:space-between; background:#152a25; color:#fff; border-bottom:4px solid var(--amber); }
.topbar small { color:#b9c8c3; font-size:11px; font-weight:800; }
.topbar h1 { font-size:24px; margin:3px 0 0; }
.top-actions { display:flex; align-items:center; gap:16px; }
.top-actions a { color:#fff; text-decoration:none; border-bottom:1px solid #8caaa1; padding:5px 0; }
.tabs { display:flex; gap:4px; padding:0 clamp(18px,4vw,54px); background:#fff; border-bottom:1px solid var(--line); }
.tabs button { border:0; background:transparent; padding:15px 18px; font-weight:750; color:var(--muted); cursor:pointer; white-space:nowrap; }
.tabs button.active { color:var(--green2); box-shadow:inset 0 -3px var(--green); }
main { padding:28px clamp(18px,4vw,54px) 50px; max-width:1500px; margin:auto; }
.hidden { display:none!important; }
.module-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; }
.module-link { min-height:142px; padding:20px; display:flex; flex-direction:column; justify-content:space-between; text-decoration:none; color:var(--ink); background:#fff; border:1px solid var(--line); border-left:5px solid var(--green); border-radius:6px; transition:.15s; }
.module-link:hover { transform:translateY(-2px); border-color:#9fb2ac; box-shadow:0 8px 24px #1c352d12; }
.module-link h2 { margin:0; font-size:19px; }
.module-link p { color:var(--muted); margin:7px 0; }
.module-link footer { display:flex; justify-content:space-between; align-items:center; color:var(--green); font-weight:750; }
.access-badge { font-size:11px; color:var(--muted); text-transform:uppercase; }
.section-head { display:flex; justify-content:space-between; align-items:end; gap:18px; margin-bottom:18px; }
.section-head h2 { font-size:21px; margin:0; }
.section-head p { margin:5px 0 0; color:var(--muted); }
.status-on, .status-off { padding:7px 10px; border-radius:5px; font-weight:750; }
.status-on { color:#0f5b43; background:#e5f3ed; }
.status-off { color:#7a5215; background:#fff1d8; }
input, select { font:inherit; border:1px solid #bfc9c5; border-radius:5px; background:#fff; min-height:36px; padding:7px 9px; }
.settings-list { display:grid; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.setting-row { display:grid; grid-template-columns:minmax(230px,1.6fr) 110px 130px 130px 130px 95px; gap:14px; align-items:center; padding:14px 16px; background:#fff; }
.setting-disabled { opacity:.6; background:#f7f8f8; }
.setting-title strong, .setting-title small, .employee-cell strong, .employee-cell small { display:block; }
.setting-title small, .employee-cell small { color:var(--muted); margin-top:3px; }
.field span { display:block; font-size:11px; color:var(--muted); margin-bottom:4px; }
.switch { display:flex; align-items:center; gap:8px; font-weight:700; }
.switch input { min-height:auto; }
.legend { display:flex; flex-wrap:wrap; gap:14px; margin-bottom:12px; color:var(--muted); font-size:12px; }
.legend b { color:var(--ink); }
.table-wrap { overflow:auto; background:#fff; border:1px solid var(--line); border-radius:6px; }
#accessPanel, #directoriesPanel, #notificationsPanel { display:flex; flex-direction:column; height:calc(100dvh - 214px); min-height:320px; }
#accessPanel > .section-head, #accessPanel > .legend, #directoriesPanel > .section-head, #directoriesPanel > .directory-toolbar, #notificationsPanel > .section-head { flex-shrink:0; }
#accessPanel > .table-wrap, #directoriesPanel > .table-wrap, .notifications-scroll { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; }
#accessPanel table, #directoriesPanel table { border-collapse:separate; border-spacing:0; }
#accessPanel thead th, #directoriesPanel thead th { z-index:3; }
#accessPanel thead th:first-child, #directoriesPanel thead th:first-child { z-index:4; }
.notifications-scroll { border:1px solid var(--line); border-radius:6px; background:#fff; }
.notification-head { position:sticky; top:0; z-index:3; background:#edf2f0; font-size:12px; font-weight:750; }
.notifications-scroll .setting-row { min-width:1045px; }
.notifications-scroll .settings-list { border:0; border-radius:0; overflow:visible; min-width:1045px; }
table { width:100%; border-collapse:collapse; min-width:1050px; }
th, td { padding:10px 12px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; }
th { position:sticky; top:0; background:#edf2f0; font-size:12px; z-index:1; }
th:first-child, td:first-child { position:sticky; left:0; background:#fff; z-index:2; min-width:230px; }
th:first-child { background:#edf2f0; z-index:3; }
.access-select { width:100%; min-width:125px; }
.inactive { opacity:.55; }
.directory-head { align-items:center; }
.segmented { display:flex; border:1px solid #bfc9c5; border-radius:6px; overflow:hidden; background:#fff; }
.segmented button { border:0; border-right:1px solid #bfc9c5; background:#fff; color:var(--muted); min-height:38px; padding:8px 13px; font:inherit; font-weight:750; cursor:pointer; }
.segmented button:last-child { border-right:0; }
.segmented button.active { background:var(--green); color:#fff; }
.directory-toolbar { position:sticky; top:0; z-index:5; display:grid; grid-template-columns:minmax(250px,460px) 1fr auto; gap:14px; align-items:center; margin-bottom:12px; padding:8px 0; background:var(--paper); }
.directory-toolbar span { color:var(--muted); }
button { font:inherit; }
.primary-button, .danger-button, .dialog-actions button { min-height:38px; border:1px solid #b5c0bc; border-radius:5px; padding:8px 14px; background:#fff; cursor:pointer; font-weight:750; }
.primary-button { color:#fff; border-color:var(--green); background:var(--green); }
.danger-button { color:#fff; border-color:#9f352d; background:#9f352d; }
button:disabled { opacity:.48; cursor:not-allowed; }
.directory-table { min-width:880px; }
.directory-table th:first-child, .directory-table td:first-child { min-width:48px; width:48px; text-align:center; }
.directory-table th:nth-child(2), .directory-table td:nth-child(2) { min-width:260px; }
.directory-table .check-cell input { min-height:auto; width:17px; height:17px; }
.directory-name strong, .directory-name small { display:block; }
.directory-name small { margin-top:3px; color:var(--muted); }
.usage-summary { color:#315f52; }
.usage-summary.empty, .empty-row { color:var(--muted); }
.official-link { width:100%; min-width:220px; }
.merge-dialog { width:min(680px,calc(100vw - 28px)); padding:0; border:0; border-radius:7px; color:var(--ink); box-shadow:0 24px 80px #0006; }
.merge-dialog::backdrop { background:#12201dcc; }
.merge-dialog form { padding:22px; }
.dialog-head { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }
.dialog-head h2 { margin:0; font-size:21px; }
.dialog-head p { margin:5px 0 0; color:var(--muted); }
.icon-button { border:0; background:transparent; width:34px; height:34px; font-size:28px; line-height:1; cursor:pointer; color:var(--muted); }
.merge-dialog fieldset { border:1px solid var(--line); border-radius:6px; margin:20px 0 14px; padding:10px 14px; }
.merge-dialog legend { padding:0 6px; font-weight:750; }
.merge-dialog fieldset label { display:flex; align-items:center; gap:9px; padding:7px 0; }
.merge-dialog fieldset input { min-height:auto; }
.merge-preview { min-height:126px; padding:14px; background:#eef3f1; border-left:4px solid var(--green); }
.merge-preview strong { display:block; margin-bottom:12px; }
.merge-preview p { margin:12px 0 0; color:var(--muted); }
.impact-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:6px; }
.impact-grid span { padding:9px 6px; text-align:center; background:#fff; border:1px solid var(--line); font-size:11px; }
.impact-grid b { display:block; color:var(--green2); font-size:19px; margin-bottom:2px; }
.preview-error { color:#8a2c25; font-weight:700; }
.dialog-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:18px; }
.dialog-actions .danger-button { color:#fff; border-color:#9f352d; background:#9f352d; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.toast { position:fixed; right:24px; bottom:24px; background:#173b31; color:#fff; padding:12px 16px; border-radius:5px; box-shadow:0 8px 30px #0003; }
@media (max-width:850px) {
  .topbar { align-items:flex-start; }
  .top-actions { flex-direction:column; align-items:flex-end; gap:5px; }
  .setting-row { grid-template-columns:1fr 1fr; }
  .setting-title { grid-column:1/-1; }
  .section-head { align-items:flex-start; flex-direction:column; }
  .section-head input { width:100%; }
  .tabs { overflow-x:auto; }
  main { padding-top:20px; }
  .segmented { width:100%; }
  .segmented button { flex:1; }
  .directory-toolbar { grid-template-columns:1fr auto; }
  .directory-toolbar input { grid-column:1/-1; }
  .impact-grid { grid-template-columns:repeat(2,1fr); }
}
