:root { color-scheme: dark; --radius: 16px; }
:root[data-theme="light"] { color-scheme: light; --bg:#f3f6fa; --bg-2:#ffffff; --bg-3:#edf2f9; --panel:#ffffff; --border:#d4ddea; --border-soft:#e4eaf2; --text:#1c2b43; --muted:#52637b; --accent:#245bc7; --accent-2:#6251c4; --green:#14744d; --amber:#936000; --red:#b63043; --cyan:#07758a; }
body {font-family: "Segoe UI Variable", "Segoe UI", sans-serif;}
#app {grid-template-columns:240px minmax(0,1fr)}
.sidebar {padding:28px 16px; border-right:1px solid var(--border-soft)}
.brand {padding:0 12px 26px;letter-spacing:-.8px}
.nav {gap:6px}
.nav-item {border-radius:11px;min-height:45px;padding:12px;transition:background .15s,color .15s}
.nav-item.active {background:color-mix(in srgb,var(--accent) 15%,transparent);color:var(--accent)}
.nav-item:hover,tbody tr:hover {background:var(--bg-3)}
.nav-item .dot {background:none!important;width:20px;height:20px;border-radius:0;display:grid;place-items:center;font-size:18px}
.main {min-width:0}
.topbar {min-height:84px;height:auto;padding:18px 30px;gap:16px;background:var(--bg-2);border-bottom:1px solid var(--border-soft);flex-wrap:wrap}
.topbar h2 {font-size:23px;letter-spacing:-.6px}
.topbar .right {gap:10px;flex-wrap:wrap}
.content {padding:28px 30px 55px;scroll-behavior:smooth}
.panel,.stat-card {border-radius:var(--radius);border:1px solid var(--border-soft);box-shadow:0 4px 18px #00000006}
.stat-card {padding:23px;background:var(--panel)}
.stat-card .value {font-size:34px;letter-spacing:-1.5px}
.panel-head {padding:18px 22px;flex-wrap:wrap;gap:12px}
.panel-head h3 {font-weight:650}
.btn {border-radius:9px;min-height:36px;transition:background .15s,box-shadow .15s}
.btn-primary {background:var(--accent);border-color:var(--accent);color:white}
.input,input,select,textarea {border-radius:8px;background:var(--bg-2);color:var(--text);border-color:var(--border)}
input:focus,select:focus,textarea:focus {outline:2px solid var(--accent);outline-offset:2px}
:focus-visible {outline:2px solid var(--accent);outline-offset:3px}
th {background:var(--bg-3);color:var(--muted)}
td {padding-top:15px;padding-bottom:15px}
.panel-body {overflow-x:auto}
.modal {border-radius:20px;background:var(--panel)}
.login-card {background:var(--panel);border-color:var(--border)}
#login-view {background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--accent) 18%,var(--bg)),var(--bg) 70%)}
[data-theme="light"] .tab.active,[data-theme="light"] .ref-tab.active {background:var(--bg-3);color:var(--accent)}
[data-theme="light"] .client-head,[data-theme="light"] .intake-section {background:var(--panel)}
.mf-welcome {display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:24px}
.mf-welcome h1 {font-size:30px;letter-spacing:-1px;font-weight:650;margin:5px 0 8px}
.mf-kicker {text-transform:uppercase;letter-spacing:1.8px;font-size:11px;color:var(--accent);font-weight:700}
.mf-muted {color:var(--muted);line-height:1.6}
.mf-tools {display:flex;align-items:center;gap:8px}
.mf-status {font-size:11px;color:var(--muted);max-width:190px}
.mf-status[data-error="true"] {color:var(--red)}
.mf-theme {padding:7px 9px;max-width:106px}
.mf-search {width:min(320px,100%);padding:10px 13px}
.mf-queue {margin:0 0 24px}
.mf-queue-list {display:grid;gap:1px;background:var(--border-soft)}
.mf-work-row {display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 22px;background:var(--panel)}
.mf-work-row strong {display:block;margin-bottom:4px}
.mf-work-row small {color:var(--muted)}
.mf-stage {color:var(--accent);font-size:12px;font-weight:650}
.mf-blocked {color:var(--red)}
.mf-empty {padding:26px;color:var(--muted);line-height:1.7;background:var(--panel)}
.mf-dialog {background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:20px;width:540px;max-width:calc(100vw - 28px);max-height:85vh;padding:26px;margin:auto;box-shadow:0 24px 100px #0005}
.mf-dialog::backdrop {background:#07112588;backdrop-filter:blur(4px)}
.mf-dialog h2 {font-size:22px;margin-bottom:8px}
.mf-dialog label {display:block;font-size:12px;color:var(--muted);margin:16px 0 6px}
.mf-dialog input,.mf-dialog select,.mf-dialog textarea {display:block;width:100%;padding:10px;border:1px solid var(--border)}
.mf-dialog footer {display:flex;justify-content:flex-end;gap:10px;margin-top:22px}
.mf-form-grid {display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.mf-notice {padding:15px 0;border-bottom:1px solid var(--border-soft)}
.mf-notice button {margin-top:8px}
.mf-error {color:var(--red);font-size:13px;line-height:1.5;margin-top:14px}
@media(max-width:1050px){#app{grid-template-columns:190px minmax(0,1fr)}.topbar,.content{padding-left:20px;padding-right:20px}.mf-status{display:none}}
@media(max-width:700px){#app{grid-template-columns:64px minmax(0,1fr)}.sidebar{padding:20px 7px}.brand{padding:0 0 24px}.brand>span,.nav-item>span:last-child{display:none}.nav-item{padding:11px;justify-content:center}.topbar{padding:14px}.topbar h2{font-size:19px}.topbar .right{gap:6px}.topbar .user{font-size:11px}.content{padding:18px 12px 50px}.mf-welcome{align-items:flex-start;flex-direction:column}.mf-welcome h1{font-size:25px}.mf-work-row{padding:14px;align-items:flex-start;flex-direction:column}.mf-form-grid{grid-template-columns:1fr}.stat-card{padding:15px}.stat-card .value{font-size:28px}.panel-head{padding:14px}.mf-tools{flex-wrap:wrap}.client-head{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{.mf-tools,.mf-welcome,.mf-queue,.mf-dialog{display:none!important}}
