@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&family=Inter:wght@400;600;700&display=swap');
:root{color-scheme:light;--bg:#f6f6f5;--surface:#fff;--ink:#111;--muted:#737373;--line:#e3e3e1;--soft:#f1f1ef;--danger:#b4232a;--shadow:0 18px 55px rgba(0,0,0,.07)}
[data-theme="dark"]{color-scheme:dark;--bg:#0a0a0a;--surface:#121212;--ink:#f5f5f5;--muted:#a3a3a3;--line:#2a2a2a;--soft:#1b1b1b;--danger:#ff858b;--shadow:0 20px 60px rgba(0,0,0,.35)}
*{box-sizing:border-box}[hidden]{display:none!important}html,body{min-height:100%}body{margin:0;background:var(--bg);color:var(--ink);font-family:Cairo,Inter,sans-serif;transition:background .2s,color .2s}button,input,select{font:inherit}.logo-dark{display:none}[data-theme="dark"] .logo-light{display:none}[data-theme="dark"] .logo-dark{display:block}.brand-logo img{width:100%;height:100%;object-fit:contain}.utility{position:fixed;z-index:20;inset-block-start:20px;inset-inline-end:24px;display:flex;gap:8px}.icon-button{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink);font-weight:700;cursor:pointer}.login-view{min-height:100vh;display:grid;place-items:center;padding:24px}.login-shell{width:min(460px,100%);background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:var(--shadow)}.login-card{display:flex;flex-direction:column;padding:48px}.login-card .brand-logo{width:250px;height:112px;align-self:center;margin:-12px 0 20px}.eyebrow{font:700 11px Inter,sans-serif;letter-spacing:2.5px;color:var(--muted);margin-bottom:12px}.login-card h1{font-size:32px;line-height:1.2;margin:0 0 8px}.login-card>p{color:var(--muted);margin:0 0 22px}.login-card label,.filters label{display:grid;gap:8px;font-weight:600;margin-top:15px}.login-card input,.filters input,.filters select{width:100%;border:1px solid var(--line);border-radius:10px;padding:12px 13px;background:var(--surface);color:var(--ink);outline:none}.login-card input:focus,.filters input:focus,.filters select:focus{border-color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--ink) 10%,transparent)}.primary,.secondary{border:1px solid var(--ink);border-radius:10px;padding:12px 18px;font-weight:700;cursor:pointer;white-space:nowrap}.primary{background:var(--ink);color:var(--surface)}.secondary{background:transparent;color:var(--ink)}.login-card .primary{width:100%;margin-top:24px}.error{color:var(--danger);min-height:24px;margin-top:10px}.dashboard-view{max-width:1180px;margin:auto;padding:34px 28px 60px}.dashboard-view header{display:flex;justify-content:space-between;align-items:center;margin:26px 0}.header-brand{display:flex;align-items:center;gap:18px}.header-brand .brand-logo{width:150px;height:72px}.header-brand span{font:700 10px Inter,sans-serif;letter-spacing:2px;color:var(--muted)}.header-brand h1{font-size:28px;margin:2px 0}.ghost{border:1px solid var(--line);color:var(--ink);background:var(--surface);border-radius:10px;padding:10px 16px;font-weight:700;cursor:pointer}.panel{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:21px}.filters{display:grid;grid-template-columns:2fr 1fr 1fr auto;gap:13px;align-items:end}.filters label{margin:0}.filter-actions{display:flex;gap:8px}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:13px;margin:14px 0}.cards article{min-height:125px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:19px}.cards article:nth-child(3){background:var(--ink);color:var(--surface)}.cards small{display:block;color:var(--muted);min-height:42px}.cards article:nth-child(3) small{color:color-mix(in srgb,var(--surface) 65%,transparent)}.cards strong{display:block;font-size:24px;margin-top:8px}.chart{height:380px}.chart h2{font-size:17px;margin-top:0}[dir="ltr"] body{font-family:Inter,Cairo,sans-serif}
@media(max-width:800px){.filters,.cards{grid-template-columns:1fr 1fr}.filter-actions{grid-column:1/-1}.filter-actions button{flex:1}.dashboard-view{padding:24px 16px}.dashboard-view header{margin-top:52px}.chart{height:330px}}
@media(max-width:500px){.login-view{padding:14px}.login-card{padding:36px 24px}.login-card .brand-logo{width:220px}.cards,.filters{grid-template-columns:1fr}.filter-actions{flex-direction:column}.header-brand{gap:10px}.header-brand .brand-logo{width:92px;height:55px}.header-brand h1{font-size:20px}.ghost{padding:9px 11px}.utility{inset-block-start:12px;inset-inline-end:14px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
