*{box-sizing:border-box}body{margin:0;font:14px Arial,sans-serif;background:#f4f7fb;color:#17233c}.app{display:flex;min-height:100vh}.sidebar{width:250px;background:#082b5d;color:#fff;position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column}.brand{padding:18px;display:flex;gap:12px;align-items:center;background:#06234c}.brand img{width:52px;height:52px;object-fit:contain;background:#fff;border-radius:8px}.brand small,.profile small{display:block;opacity:.8;margin-top:4px}.sidebar nav{padding:12px;overflow:auto;flex:1}.sidebar nav a{display:block;color:#eaf2ff;text-decoration:none;padding:11px 12px;border-radius:8px;margin:2px 0}.sidebar nav a:hover{background:#1266d4}.profile{padding:16px;background:#061f43}.profile a{color:#fff;float:right}main{margin-left:250px;width:calc(100% - 250px)}.topbar{height:72px;background:#fff;border-bottom:1px solid #dde5f1;display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:5}.topbar h1{display:inline;font-size:20px;margin-left:10px}.menu-btn{display:none}.content{padding:20px}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}.card{background:#fff;border:1px solid #e1e8f2;border-radius:12px;padding:16px;box-shadow:0 2px 8px #153b6510}.kpi{grid-column:span 3}.kpi small{color:#6e7890}.kpi strong{display:block;font-size:24px;margin-top:8px;color:#0b5ed7}.span-12{grid-column:span 12}.span-8{grid-column:span 8}.span-6{grid-column:span 6}.span-4{grid-column:span 4}.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;gap:10px}.btn{display:inline-block;border:0;border-radius:7px;padding:9px 13px;background:#0b64d8;color:#fff;text-decoration:none;cursor:pointer}.btn.gray{background:#667085}.btn.green{background:#198754}.btn.red{background:#dc3545}.btn.orange{background:#f59f00}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{padding:10px;border-bottom:1px solid #e8edf4;text-align:left;white-space:nowrap}th{background:#f7f9fc}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-group label{display:block;font-weight:700;margin-bottom:6px}.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px;border:1px solid #cdd7e5;border-radius:7px;background:#fff}.form-group textarea{min-height:90px}.full{grid-column:1/-1}.badge{padding:4px 8px;border-radius:999px;font-size:12px}.badge.ok{background:#dff7e8;color:#147a42}.badge.wait{background:#fff1d6;color:#9a6100}.badge.bad{background:#fde4e4;color:#b42318}.alert{padding:12px;border-radius:8px;margin-bottom:14px}.alert.success{background:#dff7e8}.alert.error{background:#fde4e4}.muted{color:#667085}.login{max-width:430px;margin:8vh auto;background:#fff;padding:28px;border-radius:14px;border:1px solid #dfe6f0}.login-logo{text-align:center}.login-logo img{width:100px}.login h2{text-align:center}.steps{display:flex;gap:4px}.step{flex:1;padding:10px;text-align:center;background:#eef3fa}.step.active{background:#0b64d8;color:#fff}.print-slip{max-width:900px;margin:auto;background:#fff;padding:24px;border:1px solid #ddd}.slip-head{display:flex;justify-content:space-between}.slip-head img{width:90px}@media(max-width:900px){.sidebar{transform:translateX(-100%);z-index:10}.open .sidebar{transform:translateX(0)}main{margin-left:0;width:100%}.menu-btn{display:inline-block}.kpi,.span-8,.span-6,.span-4{grid-column:span 12}.form-grid{grid-template-columns:1fr}}@media print{.sidebar,.topbar,.no-print{display:none!important}main{margin:0;width:100%}.content{padding:0}.print-slip{border:0}}