:root{
  --bg:#f6f8fb;--surface:#fff;--ink:#1f2933;--muted:#67738a;--line:#e3e8f0;
  --accent:#3a7bd5;--accent-soft:#eaf2fb;
  --good:#1f8a4d;--good-soft:#e7f6ec;
  --warn:#a16207;--warn-soft:#fdf3d3;
  --review:#a02525;--review-soft:#fbe1e1;
}
*{box-sizing:border-box}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
     margin:0;background:var(--bg);color:var(--ink);line-height:1.55;font-size:14px}
.wrap{max-width:1280px;margin:0 auto;padding:24px 28px 80px}
header{background:#1c2333;color:#fff;padding:14px 28px;display:flex;align-items:center;
       gap:16px;border-bottom:1px solid #28324a}
header h1{margin:0;font-size:16px;font-weight:600}
header nav a{color:#cdd5e2;text-decoration:none;margin-right:14px;font-size:13px}
header nav a:hover{color:#fff;text-decoration:underline}
header nav a.active{color:#fff;font-weight:600}
header .tag{font-size:10px;background:var(--accent);padding:2px 8px;border-radius:999px;
            margin-left:6px;letter-spacing:0.4px}
h1.page{font-size:22px;margin:0 0 4px 0;font-weight:600}
.lead{color:var(--muted);font-size:13px;margin:0 0 22px 0}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin-bottom:22px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;
     box-shadow:0 1px 2px rgba(31,41,51,0.04),0 4px 16px rgba(31,41,51,0.04)}
.kpi .label{color:var(--muted);font-size:11px;font-weight:600;text-transform:uppercase;
            letter-spacing:0.5px;margin-bottom:8px}
.kpi .value{font-size:26px;font-weight:700}
.kpi.good{background:var(--good-soft);border-color:#b9e2c7}
.kpi.warn{background:var(--warn-soft);border-color:#ecd58e}
.kpi.review{background:var(--review-soft);border-color:#e1a7a7}
.card{background:var(--surface);border:1px solid var(--line);border-radius:10px;
      padding:18px 20px;margin-bottom:18px;
      box-shadow:0 1px 2px rgba(31,41,51,0.04),0 4px 16px rgba(31,41,51,0.04)}
.card h2{margin:0 0 12px 0;font-size:16px;color:var(--ink)}
.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
              gap:14px;margin-top:8px}
.summary-grid .item{background:#f9fbfd;border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.summary-grid .item .k{color:var(--muted);font-size:11px;font-weight:600;text-transform:uppercase;
                       letter-spacing:0.3px;margin-bottom:4px}
.summary-grid .item .v{font-size:15px;font-weight:600}
.badge{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;
       font-weight:600;letter-spacing:0.3px}
.badge-pattern{background:#eef0f6;color:#414c63;border:1px solid #ccd2dd}
.badge-strong{background:var(--good-soft);color:var(--good);border:1px solid #b9e2c7}
.badge-medium{background:var(--warn-soft);color:var(--warn);border:1px solid #ecd58e}
.badge-review{background:var(--review-soft);color:var(--review);border:1px solid #e1a7a7}
.branch{margin:14px 0;padding:14px 16px;border:1px solid var(--line);border-radius:10px;background:#fbfcfe}
.branch>h2{margin:0 0 10px 0;font-size:15px}
.stm{margin:10px 0 6px 0;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:#fff}
.stm>h3{margin:0 0 10px 0;font-size:12px;color:var(--muted);font-weight:600;
        text-transform:uppercase;letter-spacing:0.3px}
.cases{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.case{background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px;
      display:flex;flex-direction:column;gap:6px}
.case img{width:100%;max-height:220px;object-fit:cover;border-radius:6px;background:#000;
          border:1px solid var(--line);display:block}
.case .meta{font-size:12px}
.case .meta b{color:var(--muted);font-size:11px;font-weight:600;text-transform:uppercase;
              letter-spacing:0.3px;display:block;margin-bottom:2px}
table.simple{width:100%;border-collapse:collapse;background:var(--surface);
             border-radius:8px;overflow:hidden}
table.simple th,table.simple td{padding:10px 12px;border-bottom:1px solid var(--line);
                                 text-align:left;font-size:13px;vertical-align:top}
table.simple th{background:#f1f4f9;font-size:11px;text-transform:uppercase;letter-spacing:0.4px;
                color:var(--muted);font-weight:600}
table.simple td img{height:64px;border-radius:4px;border:1px solid var(--line);background:#000}
.case .status{margin-top:auto}
.btn{display:inline-block;padding:8px 16px;background:var(--accent);color:#fff;border-radius:6px;
     text-decoration:none;font-weight:600;font-size:13px}
.btn:hover{background:#2d6cc4}
small{color:var(--muted)}
.note{background:var(--accent-soft);border:1px solid #cbdef7;border-radius:8px;padding:14px 16px;
      color:#1d3a66;margin-bottom:18px}