:root{
  --bg:#c9d8e5;--panel:#d7e3ee;--panel2:#eef4fa;--line:#1d1d1d;--grid:#5e88a7;--head:#5b96cf;
  --sub:#d9e7f4;--text:#11314f;--muted:#4b6780;--btn:#2f6fa9;--btn-hover:#285f91;--green:#1f8b4c;
  --yellow:#d6a700;--orange:#d47b12;--red:#c94747;--white:#ffffff;--shadow:0 18px 40px rgba(17,49,79,.14);
}
*{box-sizing:border-box} html,body{height:100%}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text)}
.page{min-height:100%;display:flex;flex-direction:column;gap:12px;padding:14px}
.topbar{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.titlebox{display:flex;flex-direction:column;gap:4px;min-width:340px}
.title-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.title{font-size:22px;font-weight:800}
.subtitle{font-size:12px;color:var(--muted)}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
.btn,.back-btn{height:38px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:var(--btn);color:#fff;font-size:12px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;white-space:nowrap}
.btn:hover,.back-btn:hover{background:var(--btn-hover)}
.back-btn{background:rgba(255,255,255,.88);color:var(--text)} .back-btn:hover{background:#fff}
.status-grid{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:10px}
.status-card{background:rgba(255,255,255,.42);border:1px solid rgba(29,29,29,.18);border-radius:14px;padding:10px 12px;min-height:74px;box-shadow:0 1px 0 rgba(255,255,255,.4) inset}
.status-label{font-size:11px;text-transform:uppercase;color:var(--muted);font-weight:700;letter-spacing:.05em}
.status-value{font-size:18px;font-weight:800;margin-top:6px}
.status-sub{font-size:12px;color:var(--muted);margin-top:4px}
.shell{background:var(--panel);border:1px solid rgba(29,29,29,.18);border-radius:18px;box-shadow:var(--shadow);display:flex;flex-direction:column;min-height:0}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 14px 10px}
.section-title{font-size:15px;font-weight:800}
.section-subtitle{font-size:11px;color:var(--muted);margin-top:2px}
.section-body{padding:0 14px 14px;display:flex;flex-direction:column;gap:12px;min-height:0}
.table-wrap{overflow:auto;border:1px solid rgba(29,29,29,.14);border-radius:14px;background:#f6fafe}
table{width:100%;border-collapse:separate;border-spacing:0;min-width:100%}
th,td{border-right:1px solid var(--grid);border-bottom:1px solid var(--grid);padding:8px 8px;font-size:12px;text-align:center;white-space:nowrap;background:#fff}
th{position:sticky;top:0;z-index:2;background:var(--head);color:#fff;font-weight:800}
td.left,th.left{text-align:left}
tr:hover td{background:#eaf3ff}
.control{display:flex;flex-direction:column;gap:5px}
.control label{font-size:11px;font-weight:800;color:var(--text);text-transform:uppercase}
.control input,.control select,.control textarea{width:100%;min-height:38px;border-radius:12px;border:1px solid rgba(29,29,29,.18);background:#fff;padding:8px 10px;font:inherit;color:var(--text);outline:none}
.grid2{display:grid;grid-template-columns:320px 1fr;gap:12px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.reper-block{border:1px solid rgba(29,29,29,.14);border-radius:18px;background:rgba(255,255,255,.28);padding:14px;display:flex;flex-direction:column;gap:12px}
.reper-title{font-size:18px;font-weight:800}
.dual{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mini-shell{border:1px solid rgba(29,29,29,.14);border-radius:18px;background:rgba(255,255,255,.22);padding:14px;display:flex;flex-direction:column;gap:8px}
.mini-title{font-size:14px;font-weight:800}
.mini-sub{font-size:12px;color:var(--muted)}
.note{padding:10px 12px;border:1px solid rgba(29,29,29,.14);border-radius:12px;background:#fff;font-size:12px;color:var(--muted)}
.tag{display:inline-flex;align-items:center;justify-content:center;min-width:88px;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:800}
.t-green{background:#e3f6eb;color:#14633a;border:1px solid #b4e0c4}
.t-yellow{background:#fff6d8;color:#8d6b00;border:1px solid #ecd98c}
.t-red{background:#fde4e4;color:#962f2f;border:1px solid #f0bbbb}
.t-orange{background:#ffe8cd;color:#9a5500;border:1px solid #f2c58d}
.t-empty{background:#eef3f8;color:#66788d;border:1px solid #cad6e2}
.right{justify-self:end}
@media (max-width: 1100px){ .grid2,.grid3,.dual{grid-template-columns:1fr} }