:root { --navy:#173f6b; --blue:#2369a8; --gold:#a45e0f; --ink:#182332; --muted:#647184; --line:#dbe2ea; --bg:#f3f5f8; --surface:#fff; --good:#167153; --warn:#9a6412; --bad:#a23b3b; font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); background:var(--bg); }
* { box-sizing:border-box; } html,body { margin:0; min-height:100%; max-width:100%; overflow-x:hidden; } body { min-height:100vh; background:var(--bg); } button,input,select { font:inherit; } button,a { cursor:pointer; } a { color:inherit; } :where(a,button,input,select):focus-visible { outline:3px solid #0b6fc2; outline-offset:3px; }
.loading,.denied { min-height:calc(100vh - 70px); display:grid; place-content:center; justify-items:center; gap:14px; padding:24px; text-align:center; }.spinner { width:34px;height:34px;border:3px solid var(--line);border-top-color:var(--navy);border-radius:50%;animation:spin .8s linear infinite; } @keyframes spin { to { transform:rotate(360deg); } }
.login-shell { min-height:calc(100vh - 70px); display:grid;grid-template-columns:1.1fr .9fr; }.login-copy { display:grid;align-content:center;padding:clamp(40px,8vw,120px);background:linear-gradient(145deg,#102f52,#1f5e94);color:#fff; }.login-copy h1 { margin:0;font-size:clamp(48px,7vw,88px);letter-spacing:-.05em; }.login-copy p:last-child { font-size:22px; }.login-card { align-self:center;width:min(420px,calc(100% - 40px));margin:auto;padding:36px;background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 20px 60px #173f6b1a;display:grid;gap:16px; }.login-card label { display:grid;gap:6px;font-weight:700; }.login-card input,.filters input,.filters select { min-height:44px;border:1px solid var(--line);border-radius:8px;padding:8px 10px;background:#fff; }.primary { min-height:44px;border:0;border-radius:9px;padding:10px 18px;background:var(--navy);color:#fff;font-weight:800; }.error { color:var(--bad); }.eyebrow { margin:0;color:#4ba9de;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase; }
.direction-shell { min-height:100vh;display:flex;flex-direction:column; }.topbar { min-height:78px;padding:12px clamp(18px,3vw,48px);display:grid;grid-template-columns:minmax(220px,1fr) auto minmax(220px,1fr);align-items:center;gap:24px;background:var(--navy);color:#fff; }.topbar>div:first-child { display:grid; }.topbar>div:first-child span { opacity:.75;font-size:13px; }.topbar nav { display:flex;gap:6px; }.topbar nav button { border:0;border-radius:8px;padding:10px 13px;background:transparent;color:#dce9f5; }.topbar nav button.active { background:#ffffff1c;color:#fff; }.header-actions { display:flex;justify-content:flex-end;align-items:center;gap:14px; }.header-actions button { border:1px solid #ffffff4d;background:transparent;color:#fff;border-radius:8px;padding:8px 10px; }.direction-shell main { flex:1;width:min(1500px,100%);margin:auto;padding:clamp(20px,3vw,42px); }
.page-heading { display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:18px; }.page-heading h1 { margin:5px 0;font-size:clamp(32px,4vw,52px);letter-spacing:-.04em; }.page-heading p { margin:0;color:var(--muted); }.filters { position:sticky;top:0;z-index:5;display:flex;align-items:end;justify-content:flex-start;gap:10px;flex-wrap:wrap;margin-bottom:18px;padding:14px;background:#f3f5f8f2;border:1px solid var(--line);border-radius:12px;backdrop-filter:blur(10px); }.filters label { display:grid;gap:5px;min-width:150px;color:var(--muted);font-size:12px;font-weight:800; }.filters select,.filters input { width:100%; }.quality-row { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:15px; }.quality { padding:7px 10px;border-radius:999px;background:#e6ebf1;color:var(--muted);font-size:12px;font-weight:800; }.quality.fresh { background:#e4f4ed;color:var(--good); }.quality.stale,.quality.partial { background:#fff1da;color:var(--warn); }.quality.unavailable { background:#fbe7e7;color:var(--bad); }
.widget-grid { display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:16px; }.widget { grid-column:span 3;min-width:0;padding:22px;background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:0 7px 24px #173f6b0d; }.widget h2 { margin:0 0 16px;font-size:18px; }.widget.kpi { display:grid;gap:11px; }.widget.kpi>span { color:var(--muted);font-weight:700; }.widget.kpi>strong { font-size:clamp(28px,3vw,42px);letter-spacing:-.04em; }.widget small { color:var(--muted); }.widget button { justify-self:start;border:0;background:transparent;color:var(--blue);font-weight:800;padding:4px 0; }.widget.breakdown { grid-column:span 6; }.breakdown ul { list-style:none;margin:0;padding:0;display:grid;gap:10px; }.breakdown li { display:flex;justify-content:space-between;gap:20px;padding-bottom:8px;border-bottom:1px solid var(--line); }.future-zones { margin-top:28px; }.future-zones>div,.source-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px; }.future-zones article,.source-grid article { padding:18px;background:#ffffff80;border:1px dashed #bfc8d3;border-radius:12px;display:grid;gap:8px; }.future-zones article span,.source-grid p { color:var(--muted); }.source-status { justify-self:start;padding:5px 8px;border-radius:999px;background:#e8edf2;color:var(--muted);font-size:11px;font-weight:900;text-transform:uppercase; }.source-status.configured { background:#e4f4ed;color:var(--good); }
.notice,.empty,.loading-panel,.about-card,.drilldown,.non-validated,.collaborators { padding:24px;background:#fff;border:1px solid var(--line);border-radius:14px; }.notice.error { border-color:#e7bcbc;color:var(--bad); }.notice button { margin-left:12px; }.loading-panel { display:grid;place-items:center;min-height:240px; }.about-card { max-width:760px;margin:auto; }.about-card h1 { font-size:36px; }.about-card dl { display:grid;grid-template-columns:200px 1fr;gap:12px;margin-top:28px; }.about-card dt { color:var(--muted);font-weight:800; }.about-card dd { margin:0; }.non-validated { margin-top:18px;display:grid;grid-template-columns:minmax(180px,.8fr) minmax(0,2fr) auto;align-items:center;gap:24px;border-left:5px solid var(--warn); }.non-validated h2,.collaborators h2 { margin:4px 0;font-size:24px; }.non-validated p { margin:0;color:var(--muted); }.non-validated dl { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0; }.non-validated dl div { min-width:0; }.non-validated dt { color:var(--muted);font-size:12px;font-weight:800; }.non-validated dd { margin:5px 0 0;font-weight:850;overflow-wrap:anywhere; }.collaborators { margin-top:18px; }.section-heading { display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:16px; }.section-heading label { display:grid;gap:5px;color:var(--muted);font-size:12px;font-weight:800; }.section-heading select { min-height:40px;border:1px solid var(--line);border-radius:8px;padding:7px 9px;background:#fff; }.table-wrap { width:100%;overflow:auto; }.collaborators table,.drilldown table { width:100%;border-collapse:collapse; }.collaborators th,.collaborators td,.drilldown th,.drilldown td { padding:11px 10px;text-align:left;border-bottom:1px solid var(--line);white-space:nowrap; }.collaborators th,.drilldown th { color:var(--muted);font-size:12px; }.link-button { padding:3px 0;border:0;background:transparent;color:var(--blue);font-weight:800;text-align:left; }.drilldown { margin-top:20px;scroll-margin-top:20px; }.drilldown>div { display:flex;justify-content:space-between; }.status-pill { display:inline-block;padding:4px 7px;border-radius:999px;background:#e8edf2;font-size:11px;font-weight:850; }.status-validated,.status-reimbursed { background:#e4f4ed;color:var(--good); }.status-rejected { background:#fbe7e7;color:var(--bad); }.status-received,.status-analyzed,.status-to_review { background:#fff1da;color:var(--warn); }.empty-inline { color:var(--muted); }.product-footer { min-height:70px;padding:16px clamp(20px,4vw,60px);display:flex;align-items:center;justify-content:space-between;gap:20px;background:#e9edf2;color:#536071;font-size:12px; }
@media (max-width:1000px) { .topbar { grid-template-columns:1fr auto; }.topbar nav { grid-column:1/-1;grid-row:2;overflow:auto; }.widget { grid-column:span 6; }.page-heading { align-items:flex-start;flex-direction:column; }.non-validated { grid-template-columns:1fr; }.future-zones>div,.source-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:700px) { .login-shell { grid-template-columns:1fr; }.login-copy { min-height:240px;padding:36px 24px; }.login-card { margin:24px auto; }.topbar { grid-template-columns:1fr;gap:12px; }.topbar nav { grid-row:auto;grid-column:auto;width:100%; }.header-actions { justify-content:flex-start; }.direction-shell main { padding:18px 12px; }.filters { position:static;display:grid;grid-template-columns:1fr;width:100%; }.filters label,.filters button { min-width:0;width:100%; }.widget,.widget.breakdown { grid-column:1/-1; }.non-validated dl { grid-template-columns:1fr 1fr; }.section-heading { align-items:flex-start;flex-direction:column; }.table-wrap { overflow:visible; }.collaborators table,.collaborators thead,.collaborators tbody,.collaborators tr,.collaborators th,.collaborators td,.drilldown table,.drilldown thead,.drilldown tbody,.drilldown tr,.drilldown th,.drilldown td { display:block;width:100%; }.collaborators thead,.drilldown thead { position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0); }.collaborators tr,.drilldown tr { margin-bottom:12px;padding:10px;border:1px solid var(--line);border-radius:10px; }.collaborators td,.drilldown td { display:grid;grid-template-columns:minmax(105px,40%) 1fr;gap:10px;padding:7px 3px;border:0;white-space:normal;overflow-wrap:anywhere; }.collaborators td::before,.drilldown td::before { content:attr(data-label);color:var(--muted);font-size:12px;font-weight:800; }.future-zones>div,.source-grid { grid-template-columns:1fr; }.product-footer { align-items:flex-start;flex-direction:column; }.about-card dl { grid-template-columns:1fr;gap:5px; }.about-card dd { margin-bottom:12px; } }