:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#162033;background:#f4f7fb}*{box-sizing:border-box}body{margin:0}.shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh}.side{background:#101a2c;color:white;padding:22px 16px;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;margin-bottom:28px}.brand img{width:145px;filter:brightness(0) invert(1)}.brand span{font-weight:800;border-left:1px solid #536076;padding-left:10px}.side nav{display:grid;gap:8px}.nav{border:0;background:transparent;color:#d9e2ef;text-align:left;padding:12px 14px;border-radius:10px;font-weight:650;cursor:pointer}.nav:hover,.nav.active{background:#1d2b44;color:white}.security{margin-top:auto;font-size:12px;color:#9fb0c7;padding:14px}.top{padding:24px 30px 14px;display:flex;justify-content:space-between;align-items:center}.top h1{margin:0;font-size:28px}.top p{margin:5px 0 0;color:#68758a}.user{display:flex;gap:9px;align-items:center;background:white;border:1px solid #dde4ee;padding:10px 13px;border-radius:12px}.user small{display:block;color:#718096}.dot{width:10px;height:10px;background:#2db36c;border-radius:50%}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:0 30px 18px}.metrics div{background:#fff;border:1px solid #e0e6ef;border-radius:14px;padding:16px}.metrics span{display:block;color:#6b778b;font-size:13px}.metrics strong{font-size:27px}.panel{background:white;margin:0 30px 30px;border:1px solid #e0e6ef;border-radius:16px;overflow:hidden}.panelbar{padding:20px 22px;display:flex;justify-content:space-between;border-bottom:1px solid #edf0f4}.panelbar h2{margin:0}.panelbar p{margin:5px 0 0;color:#79869a}.primary{background:#1456d9;color:white;border:0;border-radius:10px;padding:11px 15px;font-weight:750;cursor:pointer}.filters{display:flex;gap:10px;padding:14px 18px;background:#fbfcfe;border-bottom:1px solid #edf0f4}.filters input,.filters select{border:1px solid #dce3ed;border-radius:9px;padding:10px 12px;background:white}.filters input{flex:1}.layout{display:grid;grid-template-columns:390px 1fr;min-height:620px}.orders{border-right:1px solid #e8edf3}.order{padding:15px 17px;border-bottom:1px solid #edf1f5;cursor:pointer}.order:hover,.order.active{background:#f1f6ff}.order .row{display:flex;justify-content:space-between;gap:10px}.order b{font-size:15px}.order small{color:#7d8998}.badge{font-size:11px;font-weight:800;border-radius:999px;padding:4px 8px;background:#eaf1ff;color:#1456d9}.detail{padding:24px}.detail h3{margin:0 0 4px;font-size:23px}.muted{color:#788598}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0}.field{border:1px solid #e2e7ee;border-radius:10px;padding:12px}.field span{display:block;font-size:11px;color:#7b8799;text-transform:uppercase;letter-spacing:.04em}.field b{display:block;margin-top:4px}.actions{display:flex;flex-wrap:wrap;gap:9px;margin:18px 0}.actions button{border:1px solid #cfd8e5;background:white;border-radius:9px;padding:9px 12px;font-weight:700;cursor:pointer}.actions button.primary{border-color:#1456d9;background:#1456d9;color:white}.timeline{border-top:1px solid #e9edf2;margin-top:20px;padding-top:16px}.event{padding:11px 0;border-bottom:1px solid #eef1f5}.event time{display:block;color:#8793a4;font-size:12px}.modal{position:fixed;inset:0;background:#0007;display:grid;place-items:center;padding:20px}.modal.hidden{display:none}.card{background:white;border-radius:16px;padding:22px;width:min(620px,100%);box-shadow:0 24px 70px #0004}.card h3{margin-top:0}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:11px}.formgrid input,.formgrid select{width:100%;padding:10px;border:1px solid #d5dde8;border-radius:9px}.formactions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}.mobilebar,.mobilenav{display:none}@media(max-width:900px){.mobilebar{display:flex;position:sticky;top:0;z-index:30;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;background:#101a2c;color:#fff;box-shadow:0 2px 12px #101a2c22}.mobilebrand{display:flex;align-items:center;gap:8px;min-width:0}.mobilebrand img{width:132px;height:auto}.mobilebrand span{font-weight:800;border-left:1px solid #536076;padding-left:8px}.menubtn{border:1px solid #52617a;background:#1d2b44;color:#fff;border-radius:10px;padding:9px 13px;font-weight:800}.mobilenav{display:none;position:sticky;top:58px;z-index:29;background:#101a2c;padding:8px 14px 14px;grid-template-columns:1fr 1fr;gap:7px;box-shadow:0 10px 18px #101a2c22}.mobilenav.open{display:grid}.mobilenav .nav{background:#1d2b44;border:1px solid #2c3d59;text-align:center;padding:11px 8px}.mobilenav .nav.active{background:#1456d9}.shell{grid-template-columns:1fr}.shell{grid-template-columns:1fr}.side{display:none}.metrics{grid-template-columns:1fr 1fr;padding:0 14px 14px}.top{padding:18px 14px}.panel{margin:0 14px 20px}.layout{grid-template-columns:1fr}.orders{border-right:0}.detail{border-top:1px solid #e8edf3}.user{display:none}}
@media(max-width:600px){.top{padding:18px 18px 14px}.top h1{font-size:26px;line-height:1.08}.top p{font-size:15px;line-height:1.45}.metrics{gap:10px;padding:0 12px 12px}.metrics div{padding:14px 15px;min-width:0}.metrics strong{font-size:25px}.panel{margin:0 10px 18px;border-radius:14px}.panelbar{padding:18px 16px;display:grid;grid-template-columns:1fr;gap:14px}.panelbar h2{font-size:26px}.panelbar p{font-size:15px;line-height:1.4}.panelbar .primary{width:100%;min-height:48px;font-size:16px}.filters{display:grid;grid-template-columns:1fr;gap:9px;padding:12px}.filters input,.filters select{width:100%;min-width:0;min-height:46px;font-size:16px}.order{padding:15px}.order .row{align-items:flex-start}.detail{padding:18px 15px}.grid{grid-template-columns:1fr}.actions{display:grid;grid-template-columns:1fr}.actions button{min-height:44px}.formgrid{grid-template-columns:1fr}}