*{box-sizing:border-box}html,body,#app{min-height:100%}body{margin:0;min-width:320px;background:#f8fafc;color:#0f172a;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif}button,input,textarea,select{font:inherit}.app-shell{min-height:100vh}.center-screen,.login-screen{display:grid;min-height:100vh;place-items:center}.login-screen{padding:24px;background:#f8fafc}.login-card{width:min(420px,calc(100vw - 32px));border-radius:8px}.login-title{margin-bottom:6px;color:#0f172a;font-size:24px;font-weight:700}.login-subtitle{margin-bottom:20px;color:#64748b;font-size:13px}.login-form{margin-top:6px}.admin-shell{display:grid;min-height:100vh;grid-template-columns:256px minmax(0,1fr)}.sidebar{position:sticky;top:0;display:flex;height:100vh;flex-direction:column;flex-shrink:0;border-right:1px solid #e2e8f0;background:#fff}.sidebar-brand{display:flex;align-items:center;gap:12px;padding:24px}.brand-mark{display:grid;width:32px;height:32px;place-items:center;border-radius:4px;background:#2563eb;color:#fff;font-weight:700}.brand{color:#0f172a;font-size:18px;font-weight:700;letter-spacing:-.01em}.brand-version{color:#94a3b8;font-size:12px;font-weight:400}.subline{margin-top:4px;color:#64748b;font-size:12px}.side-nav{display:grid;flex:1;align-content:flex-start;gap:4px;padding:0 12px}.nav-section-label{margin:18px 12px 6px;color:#94a3b8;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.nav-item{display:flex;width:100%;align-items:center;gap:12px;padding:10px 12px;border:0;border-right:3px solid transparent;border-radius:6px;background:transparent;color:#475569;cursor:pointer;font-size:14px;font-weight:500;text-align:left;transition:background-color .16s ease,border-color .16s ease,color .16s ease}.nav-item:hover{background:#f8fafc;color:#0f172a}.nav-item.active{border-right-color:#2563eb;background:#eff6ff;color:#2563eb}.sidebar-footer{padding:16px;border-top:1px solid #f1f5f9;color:#94a3b8;font-size:12px}.workspace{min-width:0}.topbar{position:sticky;top:0;z-index:20;display:flex;height:64px;align-items:center;justify-content:space-between;gap:16px;padding:0 32px;border-bottom:1px solid #e2e8f0;background:#fff}.brand-block{min-width:0}.page-title{margin:0;color:#1e293b;font-size:20px;font-weight:700}.toolbar{display:flex;align-items:center;justify-content:flex-end;gap:16px;flex-wrap:wrap}.top-action,.logout-action{display:inline-flex;height:34px;align-items:center;gap:8px;padding:0 12px;border-radius:4px;cursor:pointer;font-size:14px;font-weight:500;transition:background-color .16s ease,border-color .16s ease}.top-action{border:1px solid #cbd5e1;background:#fff;color:#334155}.top-action:hover{background:#f8fafc}.logout-action{border:1px solid #1e293b;background:#1e293b;color:#fff}.logout-action:hover{border-color:#0f172a;background:#0f172a}.tag-list{display:flex;flex-wrap:wrap;gap:6px}.page{padding:32px}.content-stack{display:grid;gap:32px}.overview-section{display:grid;gap:16px}.overview-head{display:flex;align-items:center;justify-content:space-between;gap:16px}.section-kicker{margin:0;color:#64748b;font-size:14px;font-weight:700;letter-spacing:.05em;text-transform:uppercase}.panel{overflow:hidden;padding:0;border:1px solid #e2e8f0;border-radius:8px;background:#fff;box-shadow:0 1px 2px #0f172a0a}.panel-head,.table-panel-head,.panel>.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin:0;padding:16px 24px;border-bottom:1px solid #f1f5f9;background:#f8fafc80}.section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}.panel-title{color:#334155;font-size:14px;font-weight:700}.admin-page-title{color:#0f172a;font-size:20px;font-weight:700;letter-spacing:-.01em}.admin-section-body{padding:24px}.admin-two-col{display:grid;grid-template-columns:minmax(360px,.85fr) minmax(0,1.35fr);gap:24px;padding:24px}.admin-two-col-wide{grid-template-columns:minmax(420px,.75fr) minmax(0,1.45fr)}.admin-form-card,.admin-table-card{min-width:0;padding:20px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;box-shadow:0 1px 2px #0f172a08}.admin-form-card{background:#fbfdff}.admin-form-card-wide{align-self:start}.admin-block-title{margin-bottom:16px;color:#334155;font-size:15px;font-weight:700}.empty-panel{display:grid;min-height:220px;place-items:center;border:1px dashed #cbd5e1;border-radius:8px;color:#94a3b8;font-size:14px}.inline-alert{margin:0 0 16px}.panel-desc{margin-top:4px;color:#64748b;font-size:12px}.section-alert{margin:14px 24px}.overview-section .section-alert{margin:0}.metric-grid{display:grid;grid-template-columns:repeat(6,minmax(150px,1fr));gap:16px}.metric-card{padding:20px;border:1px solid #e2e8f0;border-radius:8px;background:#fff;box-shadow:0 1px 2px #0f172a0a}.metric-label{margin-bottom:4px;color:#64748b;font-size:12px}.metric-value{color:#0f172a;font-size:24px;font-weight:700}.metric-blue{color:#2563eb}.metric-red{color:#ef4444}.metric-note{margin-top:6px;color:#64748b;font-size:12px}.self-usage-card{display:grid;grid-template-columns:minmax(220px,.65fr) minmax(0,1.35fr);gap:20px;align-items:center;padding:18px 20px;border:1px solid #dbeafe;border-radius:8px;background:#fff;box-shadow:0 1px 2px #0f172a0a}.self-usage-title{color:#0f172a;font-size:16px;font-weight:700}.self-usage-desc{margin-top:4px;color:#64748b;font-size:12px}.self-usage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.self-usage-item{display:grid;gap:4px;min-width:0;padding:12px;border-radius:6px;background:#f8fafc}.self-usage-item span{color:#64748b;font-size:12px}.self-usage-item strong{overflow:hidden;color:#1d4ed8;font-size:18px;text-overflow:ellipsis;white-space:nowrap}.chart-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,.85fr) minmax(320px,1fr);gap:24px}.chart-card{min-height:280px}.chart-body{padding:20px 24px 24px}.line-chart{display:block;width:100%;height:150px}.chart-axis{stroke:#e2e8f0;stroke-width:1}.line-requests,.line-cost{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:3}.line-requests{stroke:#2563eb}.line-cost{stroke:#10b981;opacity:.8}.chart-legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:8px;color:#64748b;font-size:12px}.legend-dot{display:inline-block;width:8px;height:8px;margin-right:6px;border-radius:99px}.legend-blue{background:#2563eb}.legend-green{background:#10b981}.chart-days{display:flex;justify-content:space-between;gap:6px;margin-top:10px;color:#94a3b8;font-size:11px}.donut-layout{display:grid;grid-template-columns:minmax(132px,.85fr) minmax(0,1.15fr);align-items:center;gap:18px}.donut-wrap{position:relative;display:grid;place-items:center;min-width:0}.donut-chart{width:100%;max-width:172px;aspect-ratio:1}.donut-rail,.donut-segment{fill:none;stroke-width:18}.donut-rail{stroke:#edf2f7}.donut-segment{stroke-linecap:round;transition:stroke-dasharray .2s ease}.donut-center{position:absolute;display:grid;justify-items:center;gap:2px;color:#64748b;font-size:11px}.donut-center strong{color:#0f172a;font-size:22px;line-height:1}.donut-legend{display:grid;gap:10px;min-width:0}.donut-legend-row{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:10px}.donut-legend-name{display:flex;min-width:0;align-items:center;gap:8px;overflow:hidden;color:#334155;font-size:12px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.donut-legend-name i{width:9px;height:9px;flex:0 0 auto;border-radius:99px}.donut-legend-value{display:grid;flex:0 0 auto;justify-items:end;color:#94a3b8;font-size:11px}.donut-legend-value strong{color:#0f172a;font-size:12px}.user-bars{display:grid;gap:14px}.user-bar-row{display:grid;gap:7px}.user-bar-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.user-bar-label{overflow:hidden;color:#334155;font-size:12px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.user-bar-value{flex:0 0 auto;color:#64748b;font-size:12px}.user-bar-track{height:9px;overflow:hidden;border-radius:99px;background:#f1f5f9}.user-bar-fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,#2563eb,#38bdf8)}.chart-empty{display:grid;min-height:210px;place-items:center;padding:24px;color:#94a3b8;font-size:14px}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:0 24px 24px}.split-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}.table-wrap{overflow:auto;border:0;border-radius:0}.table-panel .table-wrap{margin-top:-12px}.table-panel .n-data-table-th{background:#f1f5f9;color:#475569;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.table-panel .n-data-table-td{color:#334155}.table-panel .n-data-table-tr:hover .n-data-table-td{background:#f8fafc}.table-panel>.n-form{padding:0 24px 24px}.admin-form-card>.n-form{padding:0}.cell-main{display:flex;min-width:0;flex-direction:column;gap:2px}.cell-primary{overflow:hidden;color:#0f172a;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.cell-secondary,.muted{overflow:hidden;color:#94a3b8;font-size:12px;text-overflow:ellipsis;white-space:nowrap}.money-text{color:#047857;font-variant-numeric:tabular-nums;font-weight:700}.quota-cell{display:grid;gap:6px}.quota-cell .n-progress-graph-line{height:8px}.quota-meta{color:#475569;font-size:12px;font-style:italic}.quota-sub{color:#94a3b8;font-size:10px}.field{width:156px}.field-wide{width:210px}.native-date{height:32px;padding:0 8px;border:1px solid #cbd5e1;border-radius:4px;background:#fff;color:#334155;font-size:14px}.native-date:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1f}.filter-bar{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px}.stack{display:flex;min-width:0;flex-direction:column}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px}.span-2{grid-column:span 2}@media (max-width: 1180px){.metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.self-usage-card,.grid-2,.split-grid,.chart-grid,.admin-two-col,.admin-two-col-wide{grid-template-columns:1fr}}@media (max-width: 760px){.admin-shell{grid-template-columns:1fr}.sidebar{position:static;height:auto}.side-nav{grid-template-columns:repeat(2,minmax(0,1fr))}.nav-section-label{grid-column:1 / -1}.sidebar-footer{display:none}.topbar,.overview-head,.panel-head,.table-panel-head,.panel>.section-head,.section-head{height:auto;align-items:stretch;flex-direction:column}.topbar{padding:14px 16px}.page{padding:20px 16px}.toolbar,.filter-bar{justify-content:flex-start}.field,.field-wide{width:100%}.metric-grid,.self-usage-grid,.form-grid{grid-template-columns:1fr}.span-2{grid-column:span 1}}
