@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+SC:wght@400;500;600;700&display=swap";:root{font-family:DM Sans,Noto Sans SC,sans-serif;color:#20243a;background:#f5f7fb;font-synthesis:none;text-rendering:optimizeLegibility;font-optical-sizing:auto;font-weight:400}*{box-sizing:border-box}body{margin:0;min-width:320px}.shell{max-width:1180px;margin:auto;padding:0 32px 50px}.topbar{height:78px;display:flex;align-items:center;border-bottom:1px solid #e8eaf1}.brand-mark{height:36px;width:36px;display:grid;place-items:center;background:#5746eb;border-radius:11px;color:#fff;font-size:20px;font-weight:700;margin-right:11px;box-shadow:0 6px 14px #5947ed33}.brand-copy{display:flex;flex-direction:column;gap:2px}.brand-copy strong{font-size:14px}.brand-copy span{font-size:9px;letter-spacing:1.35px;color:#969bb0}.topbar-right{margin-left:auto;color:#81879d;font-size:12px}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#38c991;margin-right:7px}.intro{display:flex;align-items:flex-end;justify-content:space-between;padding:34px 0 25px}.eyebrow{font-size:10px;letter-spacing:1.5px;color:#9ba1b4;font-weight:700;margin:0 0 7px}.intro h1{font-size:27px;letter-spacing:-.6px;margin:0 0 7px}.subhead{color:#8c91a5;margin:0;font-size:12px}.period-chip{border:1px solid #e6e8f0;border-radius:10px;padding:9px 14px;background:#fff;display:flex;flex-direction:column;gap:3px;min-width:105px}.period-chip span{font-size:10px;color:#a0a5b5}.period-chip strong{font-size:13px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:17px}.metric-card{background:#fff;border:1px solid #e9ebf2;border-radius:13px;padding:17px;display:flex;align-items:center;position:relative;min-height:93px}.metric-icon{height:36px;width:36px;display:grid;place-items:center;border-radius:11px;font-size:17px;margin-right:12px}.violet{background:#f0edff;color:#6653ed}.blue{background:#eaf3ff;color:#4b8de9}.green{background:#e8f9f3;color:#2cbb8a}.metric-card p{font-size:11px;color:#9197aa;margin:0 0 5px}.metric-card strong{font-size:20px;letter-spacing:-.4px}.metric-card i{font-style:normal;font-size:11px;color:#858ba0;font-weight:500}.metric-card small{margin-left:auto;align-self:flex-end;font-size:9px;color:#a6aabb}.panel{background:#fff;border:1px solid #e9ebf2;border-radius:13px;padding:22px 24px;margin-bottom:16px}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:19px}.panel-heading h2{font-size:16px;margin:0;font-weight:650}.panel-heading .eyebrow{font-size:9px;margin-bottom:5px}.edit-badge{font-size:10px;color:#6959e8;background:#f2f0ff;padding:5px 9px;border-radius:20px}.rule-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.field{display:flex;flex-direction:column;gap:8px;min-width:0}.field>span{font-size:11px;font-weight:600;color:#51566d}.field b{font-size:9px;color:#a1a5b5;font-weight:400;margin-left:4px}.input-wrap{position:relative}.field input,.bill-actions input{width:100%;height:39px;border:1px solid #e6e8ef;border-radius:7px;padding:0 12px;font:inherit;font-size:12px;color:#292d42;outline:none;background:#fff}.field input:focus,.bill-actions input:focus{border-color:#8174ee;box-shadow:0 0 0 3px #6556eb12}.input-wrap input{padding-right:94px}.input-wrap em{position:absolute;right:10px;top:12px;font-size:9px;font-style:normal;color:#989daf}.formula{background:#f8f8fc;border:1px solid #f0f0f5;border-radius:7px;margin-top:16px;padding:10px 12px;display:flex;align-items:center;gap:12px;color:#858ba0;font-size:10px}.formula-label{color:#6b7188;font-weight:600}.formula strong{color:#6554e8}.formula-separator{color:#d1d3de}.panel-footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #f0f1f5;margin-top:17px;padding-top:14px}.panel-footer>span{font-size:10px;color:#9da2b2}.primary-button,.secondary-button{height:34px;border:0;border-radius:7px;padding:0 13px;font:inherit;font-size:10px;font-weight:600;cursor:pointer}.primary-button{color:#fff;background:#5d4ce9;box-shadow:0 5px 12px #5d4ce922}.primary-button:hover{background:#4e3edb}.primary-button:disabled{opacity:.55;cursor:wait}.primary-button span{margin-left:9px}.usage-panel{padding-bottom:18px}.source-note{font-size:10px;color:#a0a4b3}.usage-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.usage-grid .field input{padding:0 10px}.bill-panel{padding-bottom:5px}.bill-heading{margin-bottom:14px}.bill-actions{display:flex;gap:8px;align-items:center}.bill-actions input{width:137px;height:33px}.secondary-button{background:#f0effe;color:#6657df}.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;white-space:nowrap}th{text-align:left;color:#a0a5b5;font-size:9px;font-weight:600;padding:10px 12px;border-bottom:1px solid #eff0f4}td{padding:12px;border-bottom:1px solid #f2f3f7;font-size:10px;color:#777d92}td:first-child{color:#34384d;font-weight:600}.customer-avatar{width:23px;height:23px;border-radius:7px;background:#f0edff;color:#6554e8;display:inline-grid;place-items:center;margin-right:8px;font-size:10px}.amount{color:#4f41d5;font-weight:700}.empty{text-align:center;padding:26px;color:#a2a6b6}.page-footer{text-align:center;font-size:9px;color:#adb1bf;padding-top:6px}.page-footer span{padding:0 5px}.alert{padding:10px 13px;border-radius:8px;font-size:11px;margin-bottom:13px}.alert button{float:right;border:0;background:none;color:inherit;cursor:pointer}.error{color:#b54747;background:#fff0f0}.success{color:#25835f;background:#eaf8f1}@media(max-width:760px){.shell{padding:0 16px 32px}.intro{padding-top:26px}.metric-grid{grid-template-columns:1fr}.metric-card{min-height:77px}.rule-grid,.usage-grid{grid-template-columns:1fr 1fr}.panel{padding:18px 15px}.formula{align-items:flex-start;flex-direction:column;gap:5px}.formula-separator{display:none}.source-note{font-size:8px}}@media(max-width:430px){.rule-grid,.usage-grid{grid-template-columns:1fr}.intro h1{font-size:23px}.subhead{max-width:210px;line-height:1.7}.panel-footer>span{max-width:55%;line-height:1.6}.bill-heading{align-items:flex-start;gap:10px;flex-direction:column}}.logout-button{margin-left:auto;border:0;background:none;color:#81879d;font:inherit;font-size:11px;cursor:pointer}.login-shell{min-height:100vh;display:grid;place-items:center}.login-card{width:min(100%,390px);background:#fff;border:1px solid #e9ebf2;border-radius:16px;padding:32px;box-shadow:0 18px 55px #1c27500b}.login-card .brand-mark{margin:0 0 23px}.login-card h1{margin:0 0 8px;font-size:24px}.login-card .subhead{line-height:1.7;margin-bottom:22px}.login-button{width:100%;margin-top:17px}.customer-create{display:flex;align-items:flex-end;gap:12px;padding-bottom:17px;border-bottom:1px solid #f0f1f5}.customer-create .field{width:min(100%,360px)}.customer-create .primary-button{height:39px;white-space:nowrap}.customer-list{display:flex;flex-direction:column}.customer-row{display:flex;align-items:center;gap:10px;border-bottom:1px solid #f2f3f7;padding:12px 2px}.customer-meta{display:flex;flex-direction:column;gap:4px}.customer-meta strong{font-size:11px}.customer-meta small{font-size:9px;color:#9da2b2}.customer-status{margin-left:auto;font-size:9px;padding:4px 7px;border-radius:12px}.customer-status.active{color:#25835f;background:#eaf8f1}.customer-status.disabled{color:#b54747;background:#fff0f0}.text-button{border:0;background:none;color:#6554e8;font:inherit;font-size:10px;cursor:pointer}.key-reveal{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:8px;padding:12px;margin:12px 0;background:#f8f7ff;border:1px solid #eae7ff;border-radius:8px}.key-reveal strong{grid-column:1/-1;font-size:10px;color:#5949d8}.key-reveal code{font-size:10px;overflow-wrap:anywhere;color:#41445a}@media(max-width:430px){.customer-create{align-items:stretch;flex-direction:column}.customer-create .field{width:100%}.key-reveal{grid-template-columns:1fr auto}.key-reveal code{grid-column:1/-1}}.traffic-detail{margin:16px 0;padding-top:16px;border-top:1px solid #eeeef5}.media-path{display:block;max-width:340px;margin-top:5px;color:#81879d;overflow-wrap:anywhere;white-space:normal}