:root{--bg: #020617;--text: #f8fafc;--muted: #cbd5e1;--line: #334155;--green: #22c55e;--orange: #f59e0b;--red: #ef4444;--blue: #38bdf8;--purple: #a78bfa}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:linear-gradient(135deg,#020617,#0f172a);color:var(--text)}.wrap{width:min(1180px,calc(100% - 28px));margin:0 auto;padding:24px 0 44px}header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px}h1{margin:0;font-size:clamp(28px,5vw,54px);letter-spacing:-.05em;line-height:1}h2{margin:0 0 12px;letter-spacing:-.03em}.muted{color:var(--muted);line-height:1.45}.panel{background:#111827e0;border:1px solid rgba(148,163,184,.18);border-radius:18px;padding:18px;margin-bottom:18px;box-shadow:0 18px 60px #00000047}.narrow{max-width:520px}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.cards.single{grid-template-columns:1fr}.card{background:#1f2937bd;border:1px solid rgba(148,163,184,.15);border-radius:16px;padding:16px;min-height:108px}.label{color:var(--muted);font-size:13px;margin-bottom:10px}.number{font-size:clamp(32px,6vw,62px);font-weight:900;letter-spacing:-.05em;line-height:1}.green{color:#86efac}.orange{color:#fcd34d}.red{color:#fca5a5}.blue{color:#7dd3fc}.purple{color:#c4b5fd}.big{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}.percent{display:grid;place-items:center;text-align:center;min-height:460px;border-radius:22px;background:radial-gradient(circle at center,rgba(239,68,68,.16),transparent 56%),#0f172ab8;border:1px solid rgba(239,68,68,.25);padding:24px}.percent .value{font-size:clamp(82px,16vw,180px);line-height:.9;font-weight:900;letter-spacing:-.08em;color:#fca5a5}.percent .title{font-size:clamp(22px,4vw,42px);font-weight:900;letter-spacing:-.04em;margin-top:18px}.progress{width:100%;height:28px;border-radius:999px;overflow:hidden;background:#94a3b82e;border:1px solid rgba(148,163,184,.18);margin-top:26px}.progress-inner{height:100%;width:0%;background:linear-gradient(90deg,#22c55e,#f59e0b,#ef4444);transition:width .2s ease}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.grid.compact{margin-top:10px}.field label{display:block;color:var(--muted);font-size:13px;margin-bottom:7px}input,select,textarea,button{font:inherit}input,select,textarea{width:100%;background:#020617;border:1px solid var(--line);color:var(--text);border-radius:12px;padding:11px 12px;min-height:44px}textarea{min-height:92px;resize:vertical}.spaced{margin-top:14px}button,.btn{display:inline-flex;align-items:center;justify-content:center;border:0;background:var(--green);color:#052e16;font-weight:900;border-radius:12px;padding:12px 14px;min-height:44px;cursor:pointer;text-decoration:none;white-space:nowrap}.secondary{background:#334155;color:var(--text)}.warning{background:var(--orange);color:#451a03}.danger{background:var(--red);color:#450a0a}.blue{background:var(--blue);color:#082f49}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.top-actions{display:flex;gap:10px;flex-wrap:wrap}.pill{display:inline-flex;border-radius:999px;padding:8px 11px;background:#22c55e1f;border:1px solid rgba(34,197,94,.32);color:#bbf7d0;font-size:13px;font-weight:800;align-items:center}.note{background:#020617a3;border:1px solid rgba(148,163,184,.15);padding:14px;border-radius:14px;line-height:1.5}.message{margin-top:12px;color:var(--muted);line-height:1.45}.table-area{overflow-x:auto;border-radius:16px;border:1px solid rgba(148,163,184,.18);max-height:56vh}table{width:100%;border-collapse:collapse;min-width:940px;background:#0f172acc}th,td{padding:12px 13px;border-bottom:1px solid rgba(148,163,184,.13);text-align:left;font-size:14px}th{background:#1e293bfa;font-size:12px;text-transform:uppercase;letter-spacing:.05em;position:sticky;top:0}.status{display:inline-flex;border-radius:999px;padding:6px 9px;font-weight:900;font-size:12px}.ok{background:#22c55e24;color:#86efac}.out{background:#f59e0b21;color:#fcd34d}.neutral{background:#38bdf81c;color:#7dd3fc}@media (max-width: 900px){header,.big{display:block}.cards,.grid{grid-template-columns:1fr 1fr}.top-actions{margin-top:14px}.percent{min-height:360px;margin-bottom:18px}}@media (max-width: 560px){.cards,.grid{grid-template-columns:1fr}.actions button,.actions .btn{width:100%}}
