:root{--md-sys-color-primary: #6750A4;--md-sys-color-on-primary: #FFFFFF;--md-sys-color-primary-container: #EADDFF;--md-sys-color-on-primary-container: #21005D;--md-sys-color-surface: #FEF7FF;--md-sys-color-surface-variant: #E7E0EC;--md-sys-color-on-surface: #1C1B1F;--md-sys-color-on-surface-variant: #49454F;--md-sys-color-outline: #79747E;--md-sys-color-error: #B3261E;--md-sys-color-success: #386A20;--md-elevation-1: 0 1px 2px rgba(0,0,0,.3), 0 1px 3px 1px rgba(0,0,0,.15);--md-elevation-2: 0 1px 2px rgba(0,0,0,.3), 0 2px 6px 2px rgba(0,0,0,.15);font-family:Noto Sans SC,system-ui,sans-serif;color-scheme:light}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{background:var(--md-sys-color-surface);color:var(--md-sys-color-on-surface);min-height:100vh}.app-bar{background:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary);padding:10px 16px;display:flex;align-items:center;gap:10px;box-shadow:var(--md-elevation-2)}.app-bar-icon{width:28px;height:28px;border-radius:6px;flex-shrink:0}.app-bar h1{font-size:18px;font-weight:500}.app-bar .spacer{flex:1}.app-bar button{background:transparent;border:1px solid rgba(255,255,255,.4);color:var(--md-sys-color-on-primary);border-radius:16px;padding:4px 12px;cursor:pointer;font-size:13px;font-family:inherit;transition:background .2s}.app-bar button:hover{background:#ffffff26}.app-bar button#btn-refresh{font-size:17px;padding:4px 9px;line-height:1}.app-bar button#btn-refresh.spinning{animation:spin .7s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.main-content{max-width:1200px;margin:0 auto;padding:12px}.group-title{font-size:12px;font-weight:500;color:var(--md-sys-color-primary);letter-spacing:.5px;text-transform:uppercase;margin:12px 0 8px}.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}.card{background:var(--md-sys-color-surface);border-radius:10px;padding:12px 14px;box-shadow:var(--md-elevation-1);border:1px solid var(--md-sys-color-surface-variant);transition:box-shadow .2s}.card:hover{box-shadow:var(--md-elevation-2)}.card-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:10px}.card-title-wrap{display:flex;flex-direction:row;align-items:center;gap:6px}.card-title{font-size:14px;font-weight:500;color:var(--md-sys-color-on-surface)}.card-source{font-size:10px;font-weight:500;color:var(--md-sys-color-primary);background:var(--md-sys-color-primary-container);padding:1px 6px;border-radius:6px;letter-spacing:.3px}.card-source.vps{color:#1565c0;background:#e3f2fd}.card-status{font-size:11px;padding:1px 8px;border-radius:10px;font-weight:500}.card-status.active{background:#d9ead3;color:var(--md-sys-color-success)}.card-status.inactive{background:#fad2ce;color:var(--md-sys-color-error)}.progress-section{margin-bottom:8px}.progress-label{display:flex;justify-content:space-between;font-size:11px;color:var(--md-sys-color-on-surface-variant);margin-bottom:4px}.progress-bar{height:6px;border-radius:3px;background:var(--md-sys-color-surface-variant);overflow:hidden}.progress-fill{height:100%;border-radius:3px;background:var(--md-sys-color-primary);transition:width .4s ease}.progress-fill.warn{background:#b45309}.progress-fill.danger{background:var(--md-sys-color-error)}.progress-fill.expiry{background:#7c3aed}.progress-fill.expiry.warn{background:#b45309}.progress-fill.expiry.danger{background:var(--md-sys-color-error)}.progress-sublabel{font-size:10px;color:var(--md-sys-color-on-surface-variant);margin-top:2px}.traffic-details{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:8px}.traffic-item{background:var(--md-sys-color-surface-variant);border-radius:6px;padding:5px 8px}.traffic-item-label{font-size:10px;color:var(--md-sys-color-on-surface-variant);margin-bottom:1px}.traffic-item-value{font-size:13px;font-weight:500;color:var(--md-sys-color-on-surface)}.login-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:24px}.login-card{background:var(--md-sys-color-surface);border-radius:28px;padding:40px 48px;box-shadow:var(--md-elevation-2);text-align:center;min-width:320px}.login-icon{width:64px;height:64px;border-radius:14px;margin-bottom:12px}.login-card h2{font-size:24px;font-weight:700;color:var(--md-sys-color-primary);margin-bottom:8px}.login-card p{color:var(--md-sys-color-on-surface-variant);font-size:14px;margin-bottom:32px}.btn-primary{background:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary);border:none;border-radius:20px;padding:12px 32px;font-size:15px;font-weight:500;font-family:inherit;cursor:pointer;width:100%;transition:opacity .2s}.btn-primary:hover{opacity:.9}.btn-primary:disabled{opacity:.5;cursor:default}.login-error{color:var(--md-sys-color-error);font-size:13px;margin-top:12px}.loading{display:flex;align-items:center;justify-content:center;padding:60px;color:var(--md-sys-color-on-surface-variant);font-size:15px}.spinner{width:20px;height:20px;border:3px solid var(--md-sys-color-surface-variant);border-top-color:var(--md-sys-color-primary);border-radius:50%;animation:spin .8s linear infinite;margin-right:10px}@keyframes spin{to{transform:rotate(360deg)}}.updated-at{font-size:11px;color:var(--md-sys-color-on-surface-variant);margin-top:12px;text-align:right}.card-source.moonshot{color:#00796b;background:#e0f2f1}.card-source.kimi{color:#5c6bc0;background:#e8eaf6}.card-source.zhipu{color:#1a5276;background:#d6eaf8}.card-source.packy{color:#2e7d32;background:#e8f5e9}.card-source.ikun{color:#bf360c;background:#fbe9e7}.balance-main{text-align:center;padding:8px 0 4px}.balance-value{font-size:28px;font-weight:700;color:var(--md-sys-color-primary);letter-spacing:-.5px}.balance-label{font-size:11px;color:var(--md-sys-color-on-surface-variant);margin-top:2px}.traffic-item-value.danger{color:var(--md-sys-color-error)}.card-expired-overlay{position:absolute;inset:0;border-radius:inherit;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:#00000073;display:flex;align-items:center;justify-content:center;z-index:10}.card-expired-content{text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px}.card-expired-title{font-size:15px;font-weight:600;color:#fff;letter-spacing:.2px}.btn-notify-claw{padding:7px 16px;border-radius:20px;border:none;background:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary);font-size:13px;font-weight:500;cursor:pointer;transition:opacity .15s}.btn-notify-claw:hover{opacity:.85}.btn-notify-claw:disabled{opacity:.5;cursor:default}.card-status.expired{background:#fad2ce;color:var(--md-sys-color-error)}
