:root{--biru:#007bff;--biru-tua:#0056b3;--hijau:#28a745;--merah:#dc3545;--abu:#6c757d;--garis:#d8dde3;--radius:8px}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:#f0f0f0;margin:0;padding:20px;font-family:Arial,Helvetica,sans-serif}.no-print{border-radius:var(--radius);background:#fff;max-width:1100px;margin:0 auto 20px;padding:20px;box-shadow:0 2px 5px #0000001a}.no-print h2{margin:0;font-size:20px}.no-print h3{margin:22px 0 10px;font-size:15px}.topbar{border-bottom:1px solid var(--garis);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding-bottom:14px;display:flex}.counter{color:#666;margin-top:3px;font-size:13px;font-weight:400;display:block}.field-grid{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:14px;display:grid}.field{flex-direction:column;gap:5px;min-width:0;display:flex}.field.wide{grid-column:span 2}.field-label{color:#555;font-size:12px;font-weight:700}.field input{border:1px solid #ccc;border-radius:6px;width:100%;min-width:0;padding:10px;font-family:inherit;font-size:16px}.field input:focus{outline:2px solid var(--biru);border-color:var(--biru)}.actions{flex-wrap:wrap;align-items:center;gap:8px;display:flex}button{background:var(--biru);color:#fff;cursor:pointer;border:none;border-radius:6px;min-height:44px;padding:11px 16px;font-family:inherit;font-size:14px;font-weight:700}button:hover{background:var(--biru-tua)}button:disabled{opacity:.55;cursor:not-allowed}.btn-print{background:var(--hijau)}.btn-print:hover{background:#1e7e34}.btn-danger{background:var(--merah)}.btn-danger:hover{background:#c82333}.btn-warning{color:#000;background:#ffc107}.btn-warning:hover{background:#e0a800}.btn-success{background:var(--hijau)}.btn-success:hover{background:#1e7e34}.btn-ghost{background:var(--abu)}.btn-ghost:hover{background:#5a6268}.divider{background:var(--garis);width:1px;height:26px;margin:0 6px}.catatan{color:#777;margin:10px 0 0;font-size:12px}.overlay-ekspor{z-index:999;background:#00000073;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.overlay-kotak{background:#fff;border-radius:10px;align-items:center;gap:12px;padding:22px 26px;font-size:14px;font-weight:700;display:flex;box-shadow:0 6px 24px #00000040}.spinner{border:3px solid #dfe4ea;border-top-color:var(--biru);border-radius:50%;flex-shrink:0;width:20px;height:20px;animation:.7s linear infinite putar}@keyframes putar{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:2.5s}*{scroll-behavior:auto!important}}.mobile-list{margin-top:18px;display:none}.item-cards{gap:10px;margin:0;padding:0;list-style:none;display:grid}.item-card{border:1px solid var(--garis);border-left:4px solid var(--biru);border-radius:var(--radius);background:#fbfcfd;padding:12px}.item-card.is-editing{background:#fff9e6;border-left-color:#ffc107}.item-card-head{align-items:baseline;gap:8px;display:flex}.item-card-no{background:var(--biru);color:#fff;border-radius:20px;flex-shrink:0;padding:2px 8px;font-size:11px;font-weight:700}.item-card-nama{word-break:break-word;font-size:15px}.item-card-spek{color:#555;word-break:break-word;margin:6px 0 0;font-size:13px}.item-card-meta{grid-template-columns:repeat(auto-fit,minmax(105px,1fr));gap:8px 12px;margin:10px 0 0;font-size:13px;display:grid}.item-card-meta div{min-width:0}.item-card-meta dt{color:#777;font-size:11px;font-weight:700}.item-card-meta dd{word-break:break-word;margin:1px 0 0}.item-card-actions{gap:8px;margin-top:12px;display:flex}.item-card-actions button{flex:1;min-height:40px;padding:9px;font-size:13px}.list-kosong{text-align:center;color:#888;border:1px dashed var(--garis);border-radius:var(--radius);padding:24px 10px;font-size:13px}.paper-area{max-width:1100px;margin:0 auto}.paper-toolbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px;display:flex}.paper-toolbar span{color:#666;font-size:12px}.paper-toolbar button{min-height:38px;padding:8px 12px;font-size:13px}.paper-viewport{-webkit-overflow-scrolling:touch;overflow:auto hidden}.a4-landscape{box-sizing:border-box;transform-origin:0 0;background:#fff;width:297mm;height:210mm;margin:0 auto;padding:8mm;position:relative;box-shadow:0 0 10px #0003}.pr-container{box-sizing:border-box;border:2px solid #000;flex-direction:column;height:100%;display:flex}.header{justify-content:space-between;padding:10px 15px 5px;display:flex;position:relative}.header-left{align-self:flex-end;font-size:13px;font-weight:700;line-height:1.4}.header-left table{border-collapse:collapse;border:none;font-size:13px;font-weight:700}.header-left td{border:none;padding:2px 5px 2px 0}.header-center{text-align:center;z-index:0;width:100%;position:absolute;top:10px;left:0}.header-center h1{letter-spacing:1px;margin:0;font-size:21px;text-decoration:underline}.header-center p{margin:3px 0 0;font-size:13px;font-weight:700}.header-right{z-index:1}.header-right img{object-fit:contain;height:65px}.table-container{border-top:2px solid #000;flex-grow:1}table.pr-table{border-collapse:collapse;text-align:center;table-layout:fixed;width:100%;height:100%}table.pr-table th,table.pr-table td{border:1px solid #000}table.pr-table th{height:35px;padding:4px;font-size:12px;font-weight:700}table.pr-table tbody td{vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;height:20px;padding:2px 4px;font-size:11px;font-weight:700;overflow:hidden}.data-row:hover{cursor:pointer;background-color:#e2eef9}.data-row.is-editing{background-color:#fff3cd}.col-no{width:4%}.col-nama{width:18%}.col-spek{width:21%}.col-satuan,.col-jumlah{width:6%}.col-harga,.col-total{width:10%}.col-stock{width:6%}.col-tgl{width:11%}.col-vendor{width:8%}.cell-left{text-align:left}.grand-total-row td{height:25px;padding:5px;font-size:13px;font-weight:700}.signature-row td{vertical-align:bottom;height:115px;padding-bottom:8px}.sig-box{flex-direction:column;justify-content:flex-end;align-items:center;height:100%;display:flex;position:relative}.ttd-img{z-index:1;width:130px;position:absolute;bottom:25px;left:50%;transform:translate(-50%)}.sig-name{text-align:center;z-index:2;border-bottom:2px dotted #000;min-width:160px;margin-bottom:2px;padding-bottom:2px;font-size:13px;font-style:italic;font-weight:700;display:inline-block;position:relative}.sig-title{font-size:12px;font-weight:400}.login-wrap{justify-content:center;align-items:center;min-height:100dvh;padding:20px;display:flex}.login-card{text-align:center;background:#fff;border-radius:10px;width:100%;max-width:380px;padding:32px 26px;box-shadow:0 4px 18px #0000001f}.login-card img{object-fit:contain;height:80px;margin-bottom:12px}.login-card h1{margin:0 0 4px;font-size:19px}.login-card p.sub{color:#666;margin:0 0 22px;font-size:13px}.login-card input{text-align:center;letter-spacing:3px;border:1px solid #ccc;border-radius:6px;width:100%;padding:13px;font-family:inherit;font-size:16px}.login-card input:focus{outline:2px solid var(--biru);border-color:var(--biru)}.login-card button{width:100%;margin:14px 0 0;padding:13px;font-size:15px}.login-error{color:#842029;background:#f8d7da;border:1px solid #f5c2c7;border-radius:6px;margin-top:14px;padding:9px;font-size:13px}@media (max-width:899px){.mobile-list{display:block}.paper-toolbar{display:flex}}@media (max-width:599px){body{padding:10px}.no-print{border-radius:6px;margin-bottom:12px;padding:15px}.no-print h2{font-size:17px}.field-grid{gap:10px}.actions button{flex:100%}.actions .divider{flex-basis:100%;width:auto;height:1px;margin:8px 0}}@media (max-width:359px){.field-grid{grid-template-columns:1fr}.field.wide{grid-column:span 1}}@media (min-width:900px){.paper-toolbar{display:none}}@media print{body{background:#fff;margin:0;padding:0}.no-print,.mobile-list,.paper-toolbar{display:none!important}.paper-area{max-width:none!important;margin:0!important}.paper-viewport{width:auto!important;height:auto!important;overflow:visible!important}.a4-landscape{width:100%;height:100%;box-shadow:none;page-break-after:avoid;page-break-inside:avoid;margin:0;padding:0;transform:none!important}.data-row:hover,.data-row.is-editing{background-color:#0000}@page{size:A4 landscape;margin:5mm}}