body { font-family: system-ui, -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; }
    .mono { font-family: ui-monospace, Menlo, Consolas, monospace; }
    /* Sidebar item states from Pencil design */
    .nav-sec { font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: #94A3B8; padding: 12px 10px 6px; }
    .nav-item { display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:6px; color:#CBD5E1; cursor:pointer; font-size:13px; }
    .nav-item:hover { background:#1E293B; color:#F1F5F9; }
    .nav-item.active { background:#1D4ED8; color:#FFFFFF; }
    .nav-item.disabled { opacity:.45; cursor:not-allowed; }
    .nav-item.disabled:hover { background:transparent; color:#CBD5E1; }
    .lu { font-family: 'lucide' !important; font-style: normal; -webkit-font-smoothing: antialiased; }
    .nav-item .lu { width:16px; height:16px; font-size:16px; line-height:1; }
    /* Card */
    .card { background:#fff; border:1px solid #D9E1EA; border-radius:8px; }
    /* Workspace tabs */
    .worktab { display:flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid #D9E1EA; border-bottom:none; border-radius:8px 8px 0 0; background:#EEF2F7; color:#475569; cursor:pointer; font-size:13px; }
    .worktab.active { background:#FFFFFF; color:#0F172A; }
    .worktab-close { color:#94A3B8; font-size:12px; cursor:pointer; }
    .worktab-close:hover { color:#0F172A; }
    /* Pill badge */
    .pill { display:inline-block; font-size:11px; padding:2px 8px; border-radius:999px; }
    .pill-green { background:#DCFCE7; color:#166534; }
    .pill-slate { background:#E2E8F0; color:#475569; }
    .pill-red { background:#FEE2E2; color:#991B1B; }
    .pill-amber { background:#FEF3C7; color:#92400E; }
    .pill-blue { background:#DBEAFE; color:#1E40AF; }
    /* Scrollbars */
    ::-webkit-scrollbar { width:8px; height:8px; }
    ::-webkit-scrollbar-thumb { background:#CBD5E1; border-radius:4px; }
    /* Toast */
    .toast { position:fixed; bottom:24px; right:24px; padding:10px 16px; border-radius:6px; color:#fff; font-size:13px; z-index:50; box-shadow:0 10px 25px rgba(15,23,42,.18); }
    .toast.ok { background:#16A34A; }
    .toast.err { background:#DC2626; }
    /* Modal (pencil bQg74 / isCUn) */
    .modal-backdrop { position:fixed; inset:0; background:rgba(15,23,42,.45); z-index:40; display:flex; align-items:flex-start; justify-content:center; padding:48px 16px; overflow-y:auto; }
    .modal-dialog { background:#fff; border-radius:10px; box-shadow:0 25px 50px rgba(15,23,42,.25); width:100%; max-width:720px; display:flex; flex-direction:column; max-height:calc(100vh - 96px); }
    .modal-dialog.wide { max-width:960px; }
    .modal-header { display:flex; align-items:center; justify-content:space-between; padding:18px 24px; border-bottom:1px solid #E5EBF1; }
    .modal-title { font-size:15px; font-weight:600; color:#0F172A; }
    .modal-subtitle { font-size:12px; color:#64748B; margin-top:2px; }
    .modal-close { width:28px; height:28px; display:flex; align-items:center; justify-content:center; border-radius:6px; color:#64748B; cursor:pointer; font-size:16px; }
    .modal-close:hover { background:#F1F5F9; color:#0F172A; }
    .modal-body { padding:20px 24px; overflow-y:auto; flex:1; }
    .modal-footer { display:flex; justify-content:flex-end; gap:8px; padding:14px 24px; border-top:1px solid #E5EBF1; background:#F8FAFC; border-radius:0 0 10px 10px; }
    .btn-primary { background:#1D4ED8; color:#fff; font-size:13px; padding:8px 18px; border-radius:6px; }
    .btn-primary:hover { background:#1E40AF; }
    .btn-success { background:#059669; color:#fff; font-size:13px; padding:8px 18px; border-radius:6px; }
    .btn-success:hover { background:#047857; }
    .btn-ghost { background:#fff; color:#475569; font-size:13px; padding:8px 18px; border-radius:6px; border:1px solid #CBD5E1; }
    .btn-ghost:hover { background:#F1F5F9; }
    .field-label { font-size:12px; color:#475569; margin-bottom:4px; font-weight:500; }
    .field-hint { font-size:11px; color:#94A3B8; margin-top:4px; }
    .field-input { width:100%; border:1px solid #CBD5E1; border-radius:6px; padding:8px 10px; font-size:13px; background:#fff; }
    .field-input:focus { outline:none; border-color:#1D4ED8; box-shadow:0 0 0 2px rgba(29,78,216,.15); }
    /* Page banner (pencil pageHead 4w0MJ) — compact variant */
    .page-banner { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; padding:2px 0; }
    .page-banner-title { font-size:16px; font-weight:600; color:#0F172A; line-height:1.3; }
    .page-banner-sub   { font-size:12px; color:#64748B; margin-top:2px; }
    .page-banner-actions { display:flex; gap:8px; }
    .btn-outline { background:#fff; border:1px solid #CBD5E1; color:#334155; font-size:12px; padding:6px 12px; border-radius:6px; }
    .btn-outline:hover { background:#F8FAFC; }
    .page-banner .btn-primary { font-size:12px; padding:6px 14px; }
    /* Filter bar (pencil mriPh) */
    .filter-bar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; padding:14px 20px; border-bottom:1px solid #E5EBF1; background:#FFFFFF; }
    .filter-bar input, .filter-bar select { height:34px; border:1px solid #CBD5E1; border-radius:6px; padding:0 10px; font-size:13px; background:#fff; }
    .filter-bar input:focus, .filter-bar select:focus { outline:none; border-color:#1D4ED8; box-shadow:0 0 0 2px rgba(29,78,216,.12); }
    .filter-grow { flex:1; min-width:220px; }
    /* Table footer pager (pencil iBzqw) */
    .tfoot { display:flex; align-items:center; justify-content:space-between; padding:12px 20px; border-top:1px solid #E5EBF1; background:#fff; }
    .pager { display:flex; gap:6px; align-items:center; }
    .pager button { min-width:32px; height:32px; padding:0 8px; font-size:12px; border:1px solid #CBD5E1; background:#fff; color:#334155; border-radius:6px; cursor:pointer; }
    .pager button:hover:not(:disabled) { background:#F1F5F9; }
    .pager button.active { background:#1D4ED8; border-color:#1D4ED8; color:#fff; }
    .pager button:disabled { opacity:.4; cursor:not-allowed; }
    /* Collapsible dept picker (hidden <select> backs value; tree is the UI) */
    .dept-hidden { display:none; }
    .dept-tree { border:1px solid #CBD5E1; border-radius:6px; background:#fff; }
    .dept-tree-current { padding:8px 10px; font-size:13px; border-bottom:1px solid #E5EBF1; display:flex; align-items:center; justify-content:space-between; gap:8px; }
    .dept-tree-current .clear { font-size:11px; color:#94A3B8; cursor:pointer; padding:2px 8px; border-radius:4px; }
    .dept-tree-current .clear:hover { background:#F1F5F9; color:#0F172A; }
    .dept-tree-search { width:100%; border:none; border-bottom:1px solid #E5EBF1; padding:6px 10px; font-size:13px; outline:none; box-sizing:border-box; }
    .dept-tree-groups { max-height:260px; overflow-y:auto; }
    .dept-tree-groups details { border-bottom:1px solid #F1F5F9; }
    .dept-tree-groups summary { padding:6px 10px; font-size:12px; color:#475569; cursor:pointer; list-style:none; user-select:none; background:#F8FAFC; }
    .dept-tree-groups summary::-webkit-details-marker { display:none; }
    .dept-tree-groups summary::before { content:"▸  "; color:#94A3B8; font-size:10px; }
    .dept-tree-groups details[open] summary::before { content:"▾  "; }
    .dept-tree-groups summary:hover { background:#EEF2F7; }
    .dept-tree-item { padding:5px 24px; font-size:13px; cursor:pointer; color:#334155; }
    .dept-tree-item:hover { background:#F1F5F9; }
    .dept-tree-item.selected { background:#EFF6FF; color:#1D4ED8; font-weight:500; }