.quantity-dashboard{display:flex;gap:24px;align-items:center;justify-content:space-between;padding:20px 24px;border:1px solid #53979850;border-radius:14px;background:linear-gradient(110deg,#15384799,#0d2335b0);margin:22px 0;color:#d1e8f0}
.quantity-dashboard-label{display:block;color:#9fc4ce;font-size:12px}.quantity-dashboard strong{display:block;font:30px var(--mono);margin-top:8px;color:#88e7d3}.quantity-dashboard strong small{font:12px var(--font)}.quantity-dashboard p{font-size:12px;line-height:1.8;margin:7px 0}.quantity-dashboard p small{display:block;font-size:11px;color:#91aebe}.quantity-dashboard .ghost-btn{flex-shrink:0}
.quantity-actions{display:flex;flex-wrap:wrap;gap:10px}.quantity-out-button{border-color:#b58245!important;color:#ecc089!important}#quantityError:empty{display:none}
.quantity-metrics{display:grid;grid-template-columns:1.35fr repeat(3,1fr);gap:15px;margin-bottom:20px}.quantity-metrics article{padding:24px 20px;border:1px solid var(--line);border-radius:13px;background:#12283abb;min-width:0}.quantity-metrics article>span{font-size:12px;color:#adc7d8}.quantity-metrics article>strong{display:block;font:32px var(--mono);margin:17px 0;color:#d0e6f2}.quantity-metrics article>strong small{font:12px var(--font)}.quantity-metrics article>small,.quantity-metrics article>p{font-size:10px;color:#8faebf;line-height:1.7;margin:0}.quantity-metrics .quantity-balance{background:linear-gradient(130deg,#174748b0,#0c263a);border-color:#39847d99;position:relative;overflow:hidden}.quantity-balance:after{content:'';width:100px;height:100px;border:18px solid #74d7c714;border-radius:24px;position:absolute;right:-20px;top:14px;transform:rotate(-18deg);pointer-events:none}.quantity-metrics .quantity-balance>strong{font-size:38px;color:#84e5cd}.quantity-metrics .quantity-in strong{color:#79d9c6}.quantity-metrics .quantity-out strong{color:#f1bd7e}
.quantity-setup{padding:28px;margin-bottom:20px}.quantity-setup h2{font-size:22px;margin:12px 0}.quantity-setup p{font-size:13px;color:#a8c5d5;line-height:1.8}.quantity-setup .primary-btn{margin-top:12px}.quantity-explain{margin:18px 0 24px;color:#94b2c5;font-size:12px;line-height:1.9}.quantity-explain summary{cursor:pointer}.quantity-explain p{margin:8px 0 0;max-width:950px}
.quantity-search{display:flex;align-items:end;flex-wrap:wrap;gap:12px;padding:0 22px 22px;border-bottom:1px solid var(--line)}.quantity-search label{display:flex;flex-direction:column;gap:8px;font-size:11px;color:#a8c4d4;min-width:0;flex:1}.quantity-search label:first-child{flex:2;min-width:200px}.quantity-search>div{display:flex;gap:8px}.quantity-search :is(input,select){width:100%;box-sizing:border-box;min-width:0;padding:10px;border:1px solid #57798d77;border-radius:7px;color:#d4e7f1;background:#0c1e2f;font:12px var(--font);height:39px;color-scheme:dark}.quantity-search option{background:#10283a;color:#d4e7f1}
.quantity-record{padding:18px 22px;border-bottom:1px solid var(--line)}.quantity-record-title{display:flex;align-items:center;flex-wrap:wrap;gap:12px;color:#96b4c8;font-size:11px}.quantity-record-title>b{font:11px var(--mono)}.quantity-record-title>em{margin-left:auto;font-style:normal;font-size:11px;color:#b2a9bd}.quantity-kind{padding:5px 9px;border-radius:6px;background:#3c769529;color:#bbd4e6;border:1px solid #53789266}.kind-in{background:#49b39c15;color:#88e2c7;border-color:#48a48e60}.kind-out{background:#bd8f541a;color:#edc58e;border-color:#ac805460}.kind-reverse{background:#9182ca20;color:#c6b8ef;border-color:#9d8cba60}.quantity-record-body{display:flex;align-items:center;gap:26px;margin-top:17px}.quantity-record-amount{min-width:145px;flex-shrink:0}.quantity-record-amount>strong{font:24px var(--mono);display:block}.quantity-record-amount strong small{font:11px var(--font)}.quantity-record-amount>span{display:block;color:#91afc2;font-size:11px;margin-top:8px}.quantity-positive{color:#87dfc9}.quantity-negative{color:#eabc86}.quantity-record-copy{min-width:0;flex:1}.quantity-record-copy>strong{font-size:13px;color:#cfdfeb;font-weight:500;overflow-wrap:anywhere}.quantity-record-copy p{font-size:12px;color:#a0bdce;line-height:1.7;white-space:pre-wrap;overflow-wrap:anywhere;margin:7px 0}.quantity-record-copy small{font-size:10px;color:#8fa9bd}.quantity-record-body>.text-btn{flex-shrink:0}.quantity-record.is-reversed .quantity-record-amount>strong{text-decoration:line-through;color:#96a8b7}.quantity-pagination{padding:16px 22px}
.quantity-dialog{width:min(580px,calc(100vw - 28px));max-height:90vh;max-height:90dvh;overflow-y:auto}.quantity-dialog p{font-size:13px;color:#abc7d6;line-height:1.8}.quantity-field{display:flex;flex-direction:column;gap:9px;color:#b6d1e0;font-size:12px;margin-bottom:17px}.quantity-field :is(input,textarea){padding:12px;width:100%;box-sizing:border-box;border-radius:8px;border:1px solid #567a8f;color:#d7e8ef;background:#0d2232;font:14px var(--font);color-scheme:dark}.quantity-field :is(input,textarea):focus{outline:2px solid #65c6b2;outline-offset:1px}.quantity-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.quantity-preview{padding:14px;border:1px solid #55988b70;border-radius:8px;background:#3dc3a70e;color:#96e4d0;font-size:13px;line-height:1.8;margin:12px 0}.quantity-preview.invalid{color:#ffb4ad;border-color:#b75c56;background:#d14a3814}.quantity-confirm{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.8;color:#b2c9d9;margin-top:14px}.quantity-confirm input{width:18px;height:18px;accent-color:#4cb19e;flex-shrink:0}.quantity-dialog .dialog-footer{gap:10px;flex-wrap:wrap;position:sticky;bottom:-24px;padding:16px 0;background:#102335}
body[data-theme=light] .quantity-dashboard{background:linear-gradient(110deg,#ebf8f5,#f5f9ff);color:#2b4d60;border-color:#b7d7d3}body[data-theme=light] .quantity-dashboard strong{color:#087e70}body[data-theme=light] :is(.quantity-dashboard-label,.quantity-dashboard p small,.quantity-explain,.quantity-setup p){color:#526f80}
body[data-theme=light] .quantity-metrics article{background:#f7fbff;border-color:#c7d7e2}body[data-theme=light] .quantity-metrics .quantity-balance{background:linear-gradient(120deg,#e6f5ef,#e9f4fa);border-color:#9ac8bc}body[data-theme=light] .quantity-metrics article>span,body[data-theme=light] .quantity-metrics article>small,body[data-theme=light] .quantity-metrics article>p{color:#4d6d80}body[data-theme=light] .quantity-metrics article>strong{color:#29485d}body[data-theme=light] .quantity-metrics :is(.quantity-balance,.quantity-in)>strong,body[data-theme=light] .quantity-positive{color:#08755f}body[data-theme=light] .quantity-metrics .quantity-out>strong,body[data-theme=light] .quantity-negative{color:#9c621f}body[data-theme=light] .quantity-out-button{color:#91591b!important;border-color:#c39967!important}
body[data-theme=light] .quantity-search label,body[data-theme=light] .quantity-field,body[data-theme=light] .quantity-confirm,body[data-theme=light] .quantity-record-title,body[data-theme=light] .quantity-record-amount>span,body[data-theme=light] .quantity-record-copy small,body[data-theme=light] .quantity-record-copy p,body[data-theme=light] .quantity-dialog p{color:#516e81}body[data-theme=light] .quantity-record-copy>strong{color:#28495d}body[data-theme=light] .quantity-search :is(input,select,option),body[data-theme=light] .quantity-field :is(input,textarea){background:white;color:#27465b;border-color:#b2c6d4;color-scheme:light}body[data-theme=light] .quantity-kind{color:#365f78;background:#edf4fa;border-color:#bbd1df}body[data-theme=light] .kind-in{color:#08664f;background:#e6f5ee;border-color:#a9d7c4}body[data-theme=light] .kind-out{color:#895518;background:#fff5e4;border-color:#d9bc87}body[data-theme=light] .kind-reverse{color:#665291;background:#f3effb;border-color:#c8badd}body[data-theme=light] .quantity-preview{background:#eef9f4;color:#246850;border-color:#accfbf}body[data-theme=light] .quantity-preview.invalid{background:#fff3ef;color:#a03128;border-color:#d9aea6}body[data-theme=light] .quantity-dialog .dialog-footer{background:#f7fafc}
@media(max-width:1100px){.quantity-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.quantity-search label{flex-basis:30%}.quantity-search label:first-child{flex-basis:50%}}
@media(max-width:600px){.quantity-dashboard{flex-wrap:wrap;padding:18px;gap:10px 18px}.quantity-dashboard>p{flex-basis:100%;order:3;font-size:11px}.quantity-dashboard .ghost-btn{margin-left:auto;font-size:11px}.quantity-dashboard strong{font-size:26px}.quantity-actions{width:100%}.quantity-actions .primary-btn,.quantity-actions .quantity-out-button{flex:1}.quantity-metrics{gap:10px}.quantity-metrics article{padding:17px 14px}.quantity-metrics article>strong{font-size:25px}.quantity-metrics .quantity-balance>strong{font-size:30px}.quantity-metrics article>small{font-size:9px}.quantity-setup{padding:20px}.quantity-setup h2{font-size:20px}.quantity-setup p{font-size:12px}.quantity-search{padding:0 16px 16px;gap:12px}.quantity-search label:first-child{flex-basis:100%;min-width:0}.quantity-search label{flex-basis:40%}.quantity-search>div{flex-basis:100%}.quantity-search>div button{flex:1}.quantity-record{padding:16px}.quantity-record-title{gap:8px}.quantity-record-body{align-items:start;flex-wrap:wrap;gap:14px}.quantity-record-amount{min-width:110px}.quantity-record-copy{flex-basis:55%}.quantity-record-body>.text-btn{margin-left:auto}.quantity-record-copy small{line-height:1.8}.quantity-dialog{padding:20px 16px}.quantity-dialog .dialog-head h2{font-size:21px}.quantity-form-grid{grid-template-columns:1fr;gap:0}.quantity-field :is(input,textarea){font-size:16px}.quantity-dialog .dialog-footer{bottom:-20px}.quantity-dialog .dialog-footer .primary-btn{flex:1;min-height:44px}}
