:root{
  color-scheme:light;
  --bg:#f4f6f9;
  --surface:#ffffff;
  --surface-soft:#f8fafc;
  --text:#172033;
  --muted:#677386;
  --border:#dfe4eb;
  --border-strong:#cbd3df;
  --navy:#10213d;
  --primary:#2457d6;
  --primary-hover:#1d48b5;
  --primary-soft:#eef3ff;
  --success:#16794c;
  --success-soft:#edf8f2;
  --warning:#9a6700;
  --warning-soft:#fff8e8;
  --danger:#b42318;
  --danger-soft:#fff0ee;
  --radius-sm:8px;
  --radius:12px;
  --radius-lg:18px;
  --shadow:0 10px 30px rgba(22,32,51,.08);
  --space-1:4px;
  --space-2:8px;
  --space-3:12px;
  --space-4:16px;
  --space-5:20px;
  --space-6:24px;
  --space-8:32px;
}
*{box-sizing:border-box}
html{background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text)}
body{margin:0;background:var(--bg);color:var(--text);min-height:100vh}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.52}
a{color:var(--primary)}
.hidden{display:none!important}
.muted{color:var(--muted)}
.eyebrow{display:block;margin-bottom:8px;color:var(--primary);font-size:12px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.brand{display:flex;align-items:center;gap:10px;border:0;background:transparent;color:inherit;padding:0;text-align:left}
.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--navy);color:#fff;font-weight:800;letter-spacing:.02em}
.brand-copy{display:flex;flex-direction:column;line-height:1.08}
.brand-copy strong{font-size:14px;letter-spacing:.04em}
.brand-copy small{margin-top:3px;color:var(--muted);font-size:11px}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;height:68px;padding:0 28px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--border);backdrop-filter:blur(12px)}
.topbar-actions{display:flex;align-items:center;gap:8px}
.btn,.primary,.danger-btn,.icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;border-radius:10px;border:1px solid var(--border-strong);padding:9px 14px;background:var(--surface);color:var(--text);font-weight:650;transition:background .15s,border-color .15s,color .15s,box-shadow .15s}
.btn:hover,.icon-btn:hover{background:var(--surface-soft);border-color:#b9c3d2}
.primary{border-color:var(--primary);background:var(--primary);color:#fff}
.primary:hover{border-color:var(--primary-hover);background:var(--primary-hover)}
.btn.danger,.danger-btn{border-color:#efc3be;color:var(--danger);background:#fff}
.btn.danger:hover,.danger-btn:hover{background:var(--danger-soft)}
.icon-btn{min-width:38px;padding:8px}
:focus-visible{outline:3px solid rgba(36,87,214,.24);outline-offset:2px}
input,select,textarea{width:100%;min-height:42px;border:1px solid var(--border-strong);border-radius:10px;background:#fff;color:var(--text);padding:9px 12px;outline:none}
textarea{min-height:110px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(36,87,214,.10)}
.field{display:flex;flex-direction:column;gap:7px}
.field>span,.field>label{font-size:13px;font-weight:700}
.field small{color:var(--muted);font-size:12px;line-height:1.45}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:0 1px 2px rgba(22,32,51,.03)}
.section-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.section-heading h3{margin:0 0 5px;font-size:18px}
.section-heading p{margin:0;color:var(--muted);font-size:14px;line-height:1.5}
.count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:30px;height:28px;border-radius:999px;background:var(--surface-soft);border:1px solid var(--border);font-size:12px;font-weight:750;color:var(--muted)}
.status-badge,.client-state,.doc-status{display:inline-flex;align-items:center;min-height:26px;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:750;white-space:nowrap;background:var(--surface-soft);border:1px solid var(--border);color:var(--muted)}
.status-badge.active,.status-badge.ready,.doc-status.ready,.client-state.active{background:var(--success-soft);border-color:#bfe2cf;color:var(--success)}
.status-badge.draft{background:var(--warning-soft);border-color:#ecd7a3;color:var(--warning)}
.doc-status.warning{background:var(--warning-soft);border-color:#ecd7a3;color:var(--warning)}
.doc-status.danger{background:var(--danger-soft);border-color:#efc3be;color:var(--danger)}
.notice{margin-top:14px;border:1px solid #c8d8ff;border-radius:12px;background:var(--primary-soft);padding:14px 16px;color:#244373}
.notice b{display:block;margin-bottom:4px}
.notice p{margin:0;line-height:1.5}
.notice.danger{border-color:#efc3be;background:var(--danger-soft);color:var(--danger)}
.empty-state{display:flex;min-height:230px;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px dashed var(--border-strong);border-radius:var(--radius-lg);padding:28px;background:rgba(255,255,255,.55)}
.empty-state.compact{min-height:150px}
.empty-state h2,.empty-state h3{margin:8px 0 5px}
.empty-state p{max-width:500px;margin:0 0 18px;color:var(--muted);line-height:1.5}
.empty-icon{font-size:28px;color:#8190a6}
.toast{position:fixed;right:22px;bottom:22px;z-index:100;max-width:360px;border-radius:12px;background:var(--navy);color:#fff;padding:12px 16px;box-shadow:var(--shadow);font-size:14px;font-weight:650}
.modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;background:rgba(11,22,40,.45);padding:20px}
.modal-card{width:min(520px,100%);max-height:calc(100vh - 40px);overflow:auto;border-radius:18px;background:#fff;border:1px solid var(--border);box-shadow:0 24px 70px rgba(11,22,40,.22);padding:22px}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px}
.modal-head h3{margin:0 0 5px;font-size:20px}
.modal-head p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}
.modal-close{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:9px;background:var(--surface-soft);color:var(--muted);font-size:20px}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:22px}
.modal-open{overflow:hidden}
.spinner{display:inline-block;width:22px;height:22px;border:2px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:700px){
  .topbar{height:60px;padding:0 16px}
  .brand-copy small{display:none}
  .topbar-actions .btn-label{display:none}
  .modal{padding:10px;align-items:end}
  .modal-card{width:100%;max-height:88vh;border-radius:18px 18px 10px 10px;padding:18px}
  .toast{left:14px;right:14px;bottom:14px;max-width:none}
}