:root{--orange:#f7931e;--yellow:#f6c515;--blue:#0756a6;--ink:#4d474a;--bg:#f4f6f8;--white:#fff;--line:#e5e8ec;--muted:#6e7781;--good:#17834b;--warn:#c77800;--bad:#b93232;--shadow:0 8px 26px rgba(21,32,43,.07)}
*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:#252a30}.sidebar{position:fixed;inset:0 auto 0 0;width:245px;background:#fff;border-right:1px solid var(--line);padding:24px 16px;display:flex;flex-direction:column;z-index:10}.brand{padding:4px 8px 25px;border-bottom:1px solid var(--line);margin-bottom:18px}.brand img{width:100%;height:auto;display:block}.sidebar nav{display:flex;flex-direction:column;gap:6px}.nav-item{border:0;background:transparent;padding:12px 13px;border-radius:10px;text-align:left;font-size:14px;color:#555b61;cursor:pointer;display:flex;gap:10px;align-items:center}.nav-item:hover{background:#fff7ed;color:#111}.nav-item.active{background:#fff2e2;color:#a84d00;font-weight:700}.sidebar-foot{margin-top:auto;font-size:11px;color:#9299a2;padding:10px}.main{margin-left:245px;min-height:100vh;padding:25px 30px 50px}.topbar{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:22px}.topbar h1{margin:0;color:var(--ink);font-size:30px}.topbar p{margin:6px 0 0;color:var(--muted);font-size:14px}.top-actions{display:flex;gap:10px}.btn{border:0;border-radius:9px;padding:10px 14px;font-weight:700;cursor:pointer;font-size:13px}.btn.primary{background:var(--blue);color:#fff}.btn.primary:hover{filter:brightness(.95)}.btn.secondary{background:#fff;border:1px solid var(--line);color:#4f555b}.btn.small{padding:7px 9px;font-size:12px}.btn.orange{background:var(--orange);color:#fff}.view{display:none}.view.active{display:block}.metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin-bottom:18px}.metrics.compact{grid-template-columns:repeat(4,minmax(0,1fr))}.metric{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:var(--shadow)}.metric .label{font-size:12px;color:var(--muted)}.metric .value{font-size:25px;font-weight:800;color:#333;margin:6px 0}.metric .note{font-size:11px;color:#8b9299}.metric.orange{border-top:4px solid var(--orange)}.metric.blue{border-top:4px solid var(--blue)}.metric.yellow{border-top:4px solid var(--yellow)}.metric.green{border-top:4px solid var(--good)}.metric.red{border-top:4px solid var(--bad)}.grid{display:grid;gap:18px;margin-bottom:18px}.grid.two{grid-template-columns:1fr 1fr}.grid.form-layout{grid-template-columns:390px 1fr;align-items:start}.card{background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:18px}.sticky-card{position:sticky;top:18px}.card-head{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:15px}.card h2{margin:0;font-size:17px;color:#34383e}.card p{margin:4px 0 0;color:var(--muted);font-size:12px}.flow{display:flex;gap:8px;align-items:center;overflow:auto;padding:6px 0 4px}.flow i{font-style:normal;color:#b7bcc2}.flow-step{min-width:110px;border:1px solid var(--line);border-radius:12px;padding:12px;background:#fafbfc}.flow-step b{display:inline-flex;width:24px;height:24px;border-radius:50%;background:#fff0dc;color:#ac5500;align-items:center;justify-content:center;margin-bottom:8px}.flow-step span,.flow-step small{display:block}.flow-step span{font-weight:800;font-size:13px}.flow-step small{font-size:10px;color:var(--muted);margin-top:2px}.alert{padding:10px 12px;border-radius:9px;margin-bottom:8px;font-size:12px;border:1px solid}.alert.good{background:#effaf4;color:#126a3d;border-color:#ccebd9}.alert.warn{background:#fff7e8;color:#945400;border-color:#f2dfb3}.alert.bad{background:#fff0f0;color:#8e2424;border-color:#efc8c8}.table-wrap{overflow:auto}.table-wrap table{width:100%;border-collapse:collapse;min-width:640px}th,td{text-align:left;border-bottom:1px solid #edf0f2;padding:11px 10px;font-size:12px;vertical-align:top}th{color:#727a82;font-weight:700;background:#fafbfc;position:sticky;top:0}.badge{display:inline-block;padding:4px 8px;border-radius:99px;font-weight:700;font-size:10px;white-space:nowrap}.badge.good{background:#e8f6ee;color:#176a40}.badge.warn{background:#fff2d9;color:#955b00}.badge.bad{background:#fdeaea;color:#9b2626}.badge.blue{background:#eaf2fb;color:#0d5b9f}.badge.gray{background:#eff1f3;color:#5c646d}.search{border:1px solid var(--line);border-radius:9px;padding:9px 10px;background:#fff;min-width:180px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid label{font-size:11px;color:#596068;font-weight:700}.form-grid input,.form-grid select{width:100%;margin-top:5px;border:1px solid #dfe3e7;border-radius:8px;padding:10px;background:white;font-size:12px}.span-2{grid-column:1/-1}.form-actions{padding-top:5px}.calc-box{border:1px dashed #edb15b;background:#fff8ee;border-radius:10px;padding:10px}.calc-box span,.calc-box small{display:block;font-size:10px;color:#906019}.calc-box strong{display:block;font-size:26px;color:#a95000}.rule-box{background:#f8fafc;border:1px solid var(--line);padding:18px;border-radius:12px}.rule-box code{display:block;background:#23262b;color:#f7c948;padding:12px;border-radius:8px;font-size:13px;margin-bottom:12px}.pack-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pack-card{border:1px solid var(--line);border-radius:12px;padding:14px}.pack-card .code{font-size:15px;font-weight:900;color:var(--blue)}.pack-card .meta{font-size:11px;color:#6d747b;margin:6px 0}.pack-card .pack-actions{display:flex;gap:7px;margin-top:10px}.trace-search-card{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:18px}.trace-search{display:flex;gap:8px}.trace-search select{min-width:260px;border:1px solid var(--line);border-radius:9px;padding:10px}.trace-panel{display:grid;grid-template-columns:230px 1fr;gap:18px}.qr-card{text-align:center}.qr-card img{width:210px;height:210px;border:1px solid var(--line);padding:8px;border-radius:10px;background:#fff}.qr-card .payload{margin-top:10px;font-size:10px;word-break:break-all;color:#68717a;max-height:85px;overflow:auto;text-align:left;background:#f8fafc;padding:8px;border-radius:8px}.timeline{border-left:3px solid #efeff1;margin-left:8px;padding-left:20px}.timeline-item{position:relative;margin-bottom:15px;border:1px solid var(--line);border-radius:12px;padding:13px}.timeline-item:before{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:var(--orange);left:-28px;top:18px;border:3px solid #fff}.timeline-item h3{margin:0 0 5px;font-size:13px}.timeline-item p{margin:2px 0;font-size:11px}.kv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:8px}.kv div{background:#f8fafc;border-radius:8px;padding:8px}.kv small{display:block;color:#7c848d;font-size:9px}.kv b{font-size:11px}.flash{padding:12px 14px;border-radius:10px;margin-bottom:15px;background:#eaf4ff;color:#185789;border:1px solid #cce2f6;font-size:13px}.hidden{display:none!important}.modal{position:fixed;inset:0;background:rgba(18,24,29,.48);display:flex;align-items:center;justify-content:center;padding:20px;z-index:50}.modal-box{background:#fff;width:min(560px,95vw);max-height:90vh;overflow:auto;border-radius:14px;padding:22px;position:relative;box-shadow:0 20px 80px rgba(0,0,0,.24)}.modal-close{position:absolute;right:12px;top:10px;border:0;background:#f1f3f5;border-radius:50%;width:30px;height:30px;cursor:pointer}.modal h2{margin-top:0}.pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.doc-link{color:var(--blue);text-decoration:none;font-weight:700}.empty{padding:25px;text-align:center;color:#8c939a}.trace-header{display:flex;justify-content:space-between;gap:20px;align-items:start;margin-bottom:14px}.trace-header h2{margin:0}.trace-header .tag{background:#fff2dc;color:#a55a00;padding:6px 9px;border-radius:99px;font-size:11px;font-weight:700}.small-muted{font-size:10px;color:#8a929a}.money{font-variant-numeric:tabular-nums}.doc-count{font-size:10px;color:#65707a}
@media(max-width:1050px){.sidebar{width:82px}.brand{padding:4px 2px 18px}.nav-item span,.sidebar-foot{display:none}.nav-item{justify-content:center;font-size:20px}.main{margin-left:82px}.metrics{grid-template-columns:repeat(2,1fr)}.grid.two,.grid.form-layout{grid-template-columns:1fr}.sticky-card{position:static}.trace-panel{grid-template-columns:1fr}.qr-card{text-align:left}.trace-search-card{align-items:stretch;flex-direction:column}.pack-grid{grid-template-columns:1fr}}
@media(max-width:650px){.main{padding:18px 14px 35px}.topbar{align-items:flex-start;flex-direction:column}.top-actions{width:100%}.top-actions .btn{flex:1}.metrics,.metrics.compact{grid-template-columns:1fr 1fr}.form-grid,.pay-grid{grid-template-columns:1fr}.span-2{grid-column:auto}.card{padding:14px}.trace-search{flex-direction:column}.trace-search select{min-width:0;width:100%}.kv{grid-template-columns:1fr}.pack-grid{grid-template-columns:1fr}}
.doc-button{border:0;background:transparent;color:var(--blue);padding:0;font:inherit;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px}