.detail-drawer{position:fixed;inset:0 0 0 auto;z-index:35;width:min(1080px,100vw);height:100dvh;display:flex;flex-direction:column;background:#fff;border-left:1px solid #dadce0;box-shadow:-8px 0 28px #0002;transform:translateX(100%);transition:transform .22s ease;overflow:hidden}
.detail-drawer.is-open{transform:translateX(0)}
.detail-drawer-header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid #ededed;flex-shrink:0}
.detail-drawer-header h2{margin:0;font-size:21px;font-weight:600}
.detail-drawer-header p{margin:6px 0 0;color:#888;font-size:12px}
.detail-customer-strip{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:16px 20px;background:#fafaff;border-bottom:1px solid #ededed;flex-shrink:0}
.detail-customer{display:grid;gap:5px;min-width:0}
.detail-customer strong{font-size:18px;font-weight:600;overflow-wrap:anywhere}
.detail-customer span{font-size:13px;color:#777}
.detail-metrics{display:flex;gap:28px;flex-shrink:0}
.detail-metrics>div{display:grid;gap:5px;text-align:right}
.detail-metrics span{font-size:12px;color:#888}
.detail-metrics strong{font-size:17px;font-weight:600;color:#0d6efd}
@media(max-width:600px){.detail-customer-strip{flex-wrap:wrap}.detail-metrics{width:100%;justify-content:space-between}}
.detail-drawer-tools{display:flex;align-items:center;gap:7px;padding:10px 20px;flex-shrink:0;border-bottom:1px solid #ededed}
.detail-drawer-tools>span{font-size:12px;color:#888;margin-right:auto}
.detail-drawer-tools button,.detail-retry{border:1px solid #ddd;background:#fff;border-radius:4px;padding:5px 9px;font-size:12px}
.detail-drawer-content{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 20px;background:#f4f5f7}
.detail-drawer-content>.detail-loading{background:#fff;border:1px solid #ededed;border-radius:5px;margin:0;padding:50px 16px}
.purchase-entry{background:#fff;border:1px solid #e1e4e8;border-radius:5px;margin-bottom:10px;overflow:hidden}
.purchase-entry.selected-purchase{border-color:#9cc4ff}
.purchase-entry-heading{display:flex;align-items:center;gap:12px;min-height:66px;padding:12px 14px;cursor:pointer;list-style:none}
.purchase-entry-heading::-webkit-details-marker{display:none}
.purchase-entry-heading:hover{background:#fafaff}
.purchase-entry-heading:focus-visible{outline:2px solid #86b7fe;outline-offset:-2px}
.purchase-entry-date{display:grid;gap:6px;min-width:0;margin-right:auto}
.purchase-entry-date>strong{font-size:14px;font-weight:600}
.purchase-entry-date small{font-size:11px;color:#888;overflow-wrap:anywhere}
.purchase-entry-total{font-size:15px;font-weight:600;white-space:nowrap;color:#0d6efd}
.purchase-entry-total.zero-price{color:#d93025}
.selected-purchase-label{font-size:11px;color:#0d6efd;white-space:nowrap;background:#edf4ff;border-radius:3px;padding:4px 6px}
.purchase-entry-heading>.icon{font-size:20px;color:#999;transition:transform .15s ease}
.purchase-entry[open]>.purchase-entry-heading{border-bottom:1px solid #ededed}
.purchase-entry[open]>.purchase-entry-heading>.icon{transform:rotate(180deg)}
.purchase-entry-body{padding:12px}
.purchase-entry-body .detail-table{font-size:13px}
.purchase-entry-body .detail-table th,.purchase-entry-body .detail-table td{padding:8px}
.purchase-entry-body .detail-table .product-brand{min-width:110px;max-width:170px;white-space:normal;overflow-wrap:anywhere;font-weight:500;text-align:center}
.purchase-entry-body .payment-summary{gap:6px;margin-top:12px}
.purchase-entry-body .payment-summary>div{flex:1;min-width:110px;padding:9px 10px}
.purchase-entry-body .payment-summary strong{font-size:14px}
.purchase-entry-body .purchase-memo{font-size:13px;margin-top:12px}
.purchase-notice{font-size:13px;line-height:1.6;background:#fff8df;border:1px solid #f2e0a5;padding:10px 12px;border-radius:4px;margin:0 0 12px}
.detail-drawer>.dialog-footer{flex-shrink:0;background:#fff}
@media(prefers-reduced-motion:reduce){.detail-drawer,.purchase-entry-heading>.icon{transition:none}}