/* BI «Аура» — дизайн-система в стиле существующих отчётов */
:root{
  --bg:#f4f6fb; --card:#ffffff; --ink:#1a2233; --muted:#6b7488;
  --line:#e6eaf2; --accent:#1d4ed8; --accent-soft:#eaf0fe;
  --ok:#10b981; --warn:#f59e0b; --bad:#ef4444;
  --shadow:0 1px 2px rgba(16,24,40,.05),0 6px 18px rgba(16,24,40,.05);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--ink);
  font:14px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:22px;margin:0 0 4px}
h2{font-size:16px;margin:0}

/* ---------- Шапка ---------- */
.topbar{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.topbar-in{max-width:1320px;margin:0 auto;padding:10px 16px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink)}
.brand:hover{text-decoration:none}
.logo{width:40px;height:40px;border-radius:11px;flex-shrink:0;
  background:linear-gradient(135deg,#1d4ed8,#2563eb);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:17px}
.brand-t{font-weight:700;font-size:14.5px;line-height:1.2}
.brand-t small{display:block;font-weight:400;color:var(--muted);font-size:11.5px}
.nav{display:flex;gap:4px;flex-wrap:wrap;flex:1}
.nav a{color:var(--muted);padding:7px 12px;border-radius:9px;font-size:13.5px;font-weight:500;
  display:flex;align-items:center;gap:7px}
.nav a:hover{color:var(--ink);background:var(--bg);text-decoration:none}
.nav a.active{color:var(--accent);background:var(--accent-soft)}
.dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex-shrink:0}
.dot.lg{width:10px;height:10px}
.userbox{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--muted)}
.userbox a{color:var(--muted)}
.userbox a.active{color:var(--accent);font-weight:600}
.uname{color:var(--ink);font-weight:600}
.logout:hover{color:var(--bad)}

/* ---------- Каркас страницы ---------- */
.wrap{max-width:1320px;margin:0 auto;padding:22px 16px 60px}
.foot{max-width:1320px;margin:0 auto;padding:0 16px 30px;color:var(--muted);font-size:12px}
.pagehead{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
  flex-wrap:wrap;margin-bottom:16px}
.muted{color:var(--muted)}
.crumbs{font-size:12.5px;color:var(--muted);margin-bottom:2px}
.crumbs a{color:var(--muted)}
.period-form label{display:flex;flex-direction:column;gap:4px;font-size:11.5px;font-weight:700;
  letter-spacing:.02em;color:var(--muted);text-transform:uppercase}
.period-form select{padding:8px 10px;border:1px solid var(--line);border-radius:9px;
  font:inherit;color:var(--ink);background:#fff;min-width:160px}

/* ---------- Свежесть данных ---------- */
.freshness{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.chip{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);
  border-radius:999px;padding:5px 12px;font-size:12.5px;color:var(--muted)}
.chip i{width:7px;height:7px;border-radius:50%;background:#cbd2e0}
.chip.ok i{background:var(--ok)}
.chip.running i{background:var(--warn);animation:pulse 1.2s infinite}
.chip.error i{background:var(--bad)}
.chip.admin{background:var(--accent-soft);color:var(--accent);border-color:#d5e1fb}
@keyframes pulse{50%{opacity:.35}}

/* ---------- Сводный расход ---------- */
.spend-band{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center}
.spend-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.spend-value{font-size:34px;font-weight:800;letter-spacing:-.02em;margin-top:4px;
  display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.spend-parts{display:flex;gap:22px;flex-wrap:wrap}
.spend-part{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13.5px}
.spend-part b{color:var(--ink);font-size:16px}

/* ---------- Секции и KPI ---------- */
.secline{margin-top:22px}
.secline-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.secline-head h2{display:flex;align-items:center;gap:9px;font-size:15px}
.arrow{font-size:13px;font-weight:600}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.kpi-grid.wide{margin-bottom:22px}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;
  box-shadow:var(--shadow);color:var(--ink);transition:.15s;position:relative}
a.kpi:hover{text-decoration:none;border-color:#c7d4f2;transform:translateY(-1px)}
.kpi.static{cursor:default}
.kpi-title{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.kpi-value{font-size:26px;font-weight:800;letter-spacing:-.02em;margin:6px 0 4px}
.kpi-delta{font-size:12px;font-weight:600;color:var(--muted)}
.kpi-delta.up{color:var(--ok)}
.kpi-delta.down{color:var(--bad)}
.muted-d{font-weight:400;font-size:11.5px}

/* ---------- Карточки отчётов ---------- */
.rep-title{margin:26px 0 12px;font-size:14px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.reports-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.report-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px;
  box-shadow:var(--shadow);color:var(--ink);display:flex;flex-direction:column;gap:7px;transition:.15s}
.report-card:hover{text-decoration:none;border-color:#c7d4f2;transform:translateY(-1px)}
.rc-title{font-weight:700;font-size:14.5px}
.rc-desc{color:var(--muted);font-size:12.8px;flex:1}
.rc-status{font-size:12px;font-weight:600;color:var(--accent)}
.report-card.soon .rc-status{color:var(--muted);font-weight:400}
.report-card.soon .rc-title{color:var(--muted)}

/* ---------- Карточки/таблицы/формы ---------- */
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;
  box-shadow:var(--shadow);padding:18px 20px}
.stub{text-align:center;padding:56px 20px}
.stub-ico{font-size:40px;margin-bottom:8px}
.alert{border-radius:12px;padding:10px 14px;font-size:13px;margin-bottom:14px}
.alert.err{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c}
.alert.ok{background:#ecfdf5;border:1px solid #a7f3d0;color:#047857}
.tablecard{padding:6px 0;overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);
  text-align:left;padding:10px 14px;border-bottom:1px solid var(--line)}
td{padding:9px 14px;border-bottom:1px solid #f1f3f9;vertical-align:middle}
tr:last-child td{border-bottom:none}
.t-ellip{max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.formcard{margin-top:16px}
.userform{display:flex;gap:14px;flex-wrap:wrap;align-items:flex-end}
.userform label{display:flex;flex-direction:column;gap:5px;font-size:11.5px;font-weight:700;
  letter-spacing:.02em;color:var(--muted);text-transform:uppercase}
.userform input,.userform select{padding:8px 10px;border:1px solid var(--line);border-radius:9px;
  font:inherit;color:var(--ink);min-width:180px}
.inline{display:inline}
.btn-primary{background:var(--accent);color:#fff;border:none;border-radius:9px;padding:9px 16px;
  font:inherit;font-weight:600;cursor:pointer}
.btn-primary:hover{background:#1e40af}
.btn-ghost{background:#fff;color:var(--muted);border:1px solid var(--line);border-radius:9px;
  padding:8px 14px;font:inherit;cursor:pointer}
.btn-ghost:hover{color:var(--ink);border-color:#c7cddb}
.btn-ghost.sm{padding:4px 10px;font-size:12px}
.w100{width:100%}

/* ---------- Логин ---------- */
.login-card{max-width:380px;margin:9vh auto 0;background:var(--card);border:1px solid var(--line);
  border-radius:16px;box-shadow:var(--shadow);padding:30px 28px;text-align:center}
.login-card h1{font-size:19px;margin-bottom:4px}
.login-card p{margin-top:0}
.login-card form{text-align:left;margin-top:18px;display:flex;flex-direction:column;gap:14px}
.login-card label{display:flex;flex-direction:column;gap:5px;font-size:11.5px;font-weight:700;
  letter-spacing:.02em;color:var(--muted);text-transform:uppercase;text-align:left}
.login-card input{padding:10px 12px;border:1px solid var(--line);border-radius:9px;font:inherit}

@media (max-width:760px){
  .topbar-in{gap:10px}
  .nav{order:3;width:100%}
  .spend-value{font-size:26px}
}