*{box-sizing:border-box}body{margin:0;background:#f5f6f8;color:#17191f;font:14px Arial,sans-serif}.shell{--dark:#070708;--dark2:#1a1a1d;--red:#ee332f;min-height:100vh;display:grid;grid-template-columns:245px 1fr}.theme-service{--dark:#15171d;--dark2:#272b35;--red:#d92d20}aside{position:fixed;width:245px;inset:0 auto 0 0;padding:20px 15px;display:flex;flex-direction:column;background:var(--dark);color:#fff}.brand{height:112px;position:relative;display:grid;place-items:center;border-radius:12px;overflow:hidden;background:var(--dark)}.brand img{width:100%;height:100%;object-fit:contain}.theme-service .brand{background:#fff}.brand>b{position:absolute;right:5px;bottom:5px;padding:4px 7px;border-radius:5px;background:var(--red);font-size:8px;letter-spacing:1px}.company{display:grid;gap:7px;margin:12px 0;padding:12px;border:1px solid #343337;border-radius:10px;background:var(--dark2)}.company small,.company span{color:#aaa;font-size:9px}.company select{padding:9px;border:1px solid #39383b;border-radius:7px;background:var(--dark);color:#fff;font-weight:bold}nav{display:grid;gap:4px}nav button{display:flex;justify-content:space-between;padding:12px;border:0;border-radius:8px;background:transparent;color:#aaa;text-align:left}nav button.active{background:var(--dark2);color:#fff;box-shadow:inset 3px 0 var(--red)}nav small{font-size:8px}.online{margin-top:auto;display:flex;gap:10px;padding:13px;border:1px solid #343337;border-radius:10px;color:#12b76a}.online span{display:grid;color:#fff;font-size:11px}.online small{color:#aaa;margin-top:3px}.workspace{grid-column:2}.workspace>header{height:70px;padding:14px 35px;display:flex;align-items:center;background:#fff;border-bottom:1px solid #e7e8eb}.workspace>header>input{width:min(500px,50vw);padding:11px;border:1px solid #e7e8eb;border-radius:9px;background:#f8f8f9}.user{margin-left:auto;display:flex;gap:10px;align-items:center}.user>b{padding:10px;border-radius:9px;background:#eee}.user span{display:grid;font-weight:bold}.user small{color:#667085;font-weight:normal}.content{padding:32px 36px;max-width:1450px;margin:auto}.heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px}.heading small{color:var(--red);font-weight:900;letter-spacing:1.5px}.heading h1{margin:6px 0 4px;font-size:28px}.heading p{margin:0;color:#667085}.primary{padding:11px 16px;border:0;border-radius:8px;background:var(--red);color:#fff;font-weight:bold}.banner{display:grid;gap:5px;padding:16px;margin-bottom:20px;border:1px solid #f2c8c3;border-radius:11px;background:#fff4f2}.banner span{color:#667085}.metrics,.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:20px}.metrics article,.cards button,.table{border:1px solid #e7e8eb;border-radius:11px;background:#fff}.metrics article{display:grid;gap:8px;padding:18px}.metrics small{color:#667085}.metrics strong{font-size:25px}.metrics span{color:#667085;font-size:11px}.cards button{padding:20px;text-align:left;font-size:15px;font-weight:bold}.cards span{display:block;margin-top:8px;color:#667085;font-size:11px}.table{overflow:hidden}.table>header,.table>div{display:grid;grid-template-columns:1.4fr 1fr 1fr .7fr;gap:14px;align-items:center;padding:13px 20px}.table>header{background:#fafafa;color:#667085;font-size:9px}.table>div{border-top:1px solid #eee}.table>div>b{display:grid;gap:4px}.table>div small{color:#667085}.table em{width:max-content;padding:5px 8px;border-radius:20px;background:#ecfdf3;color:#087443;font-style:normal;font-size:11px}.table em.low{background:#fff1f0;color:#b42318}.empty{padding:30px;text-align:center;color:#667085}.notice{padding:14px;border-radius:10px;background:#eef4ff;color:#155eef}dialog{width:min(640px,94vw);border:0;border-radius:15px;padding:0;box-shadow:0 25px 80px #0006}dialog::backdrop{background:#070708aa}.modal-head,dialog footer{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border-bottom:1px solid #eee}.modal-head small{color:var(--red);font-weight:bold}.modal-head h2{margin:4px 0}.modal-head button{border:0;background:none;font-size:25px}.fields{padding:22px;display:grid;grid-template-columns:1fr 1fr;gap:15px}.fields label{display:grid;gap:7px;font-size:11px;font-weight:bold}.fields input,.fields select,.fields textarea{padding:11px;border:1px solid #ddd;border-radius:8px}.fields .wide{grid-column:1/-1}dialog footer{justify-content:flex-end;border:0;border-top:1px solid #eee}dialog footer button{padding:10px 15px;border:1px solid #ddd;border-radius:8px;background:#fff;margin-left:8px}dialog footer .primary{background:var(--red)}@media(max-width:800px){.shell{display:block}aside{position:static;width:auto}.workspace{display:block}.metrics,.cards{grid-template-columns:1fr}.fields{grid-template-columns:1fr}.fields .wide{grid-column:1}.content{padding:22px 16px}.brand{height:100px}.online{margin-top:18px}}