:root{--primary:#155eef;--primary-light:#eff4ff;--primary-dark:#004aca;--primary-hover:#3b7cf7;--success:#17b26a;--success-light:#ecfdf3;--warning:#f79009;--warning-light:#fffaeb;--danger:#f04438;--danger-light:#fef3f2;--bg:#f5f8ff;--surface:#fff;--surface-secondary:#f9fafb;--text:#101828;--text-secondary:#667085;--text-tertiary:#98a2b3;--border:#eaecf0;--border-light:#f2f4f7;--divider:#e4e7ec;--radius-sm:6px;--radius:8px;--radius-md:10px;--radius-lg:12px;--radius-xl:16px;--radius-full:9999px;--shadow-xs:0 1px 2px #1018280d;--shadow-sm:0 1px 3px #1018281a, 0 1px 2px #1018280f;--shadow:0 4px 8px -2px #1018281a, 0 2px 4px -2px #1018280f;--shadow-md:0 12px 16px -4px #10182814, 0 4px 6px -2px #10182808;--shadow-lg:0 20px 24px -4px #10182814, 0 8px 8px -4px #10182808;--transition-fast:.15s ease;--transition:.2s ease;--transition-slow:.3s ease;--sidebar-w:200px;--header-h:56px}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,sans-serif;font-size:14px;line-height:1.6}#app{width:100%;min-height:100vh}a{color:var(--primary);text-decoration:none}a:hover{color:var(--primary-hover)}pre,code{font-family:JetBrains Mono,SF Mono,Fira Code,Consolas,monospace}button{cursor:pointer;font-family:inherit}input,textarea,select{font-family:inherit}::selection{color:inherit;background:#155eef26}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#d0d5dd;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#98a2b3}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.3s fadeIn}@keyframes slideIn{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:translate(0)}}.slide-in{animation:.2s slideIn}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton{border-radius:var(--radius-sm);background:linear-gradient(90deg,#f2f4f7 25%,#eaecf0 50%,#f2f4f7 75%) 0 0/200% 100%;animation:1.5s infinite shimmer}.badge{border-radius:var(--radius-full);align-items:center;padding:2px 8px;font-size:12px;font-weight:500;line-height:18px;display:inline-flex}.badge-primary{background:var(--primary-light);color:var(--primary)}.badge-success{background:var(--success-light);color:var(--success)}.badge-warning{background:var(--warning-light);color:var(--warning)}.badge-danger{background:var(--danger-light);color:var(--danger)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}input::placeholder,textarea::placeholder{color:var(--text-tertiary)}input[type=text],input[type=password],input[type=email],input[type=url],input[type=number],textarea,select{border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);background:var(--surface);transition:border-color var(--transition-fast), box-shadow var(--transition-fast);outline:none;padding:9px 13px;font-size:14px}input:focus,textarea:focus,select:focus{border-color:var(--primary);box-shadow:0 0 0 3px #155eef1f}.page-enter-active{animation:pageIn var(--transition-slow) ease;animation-fill-mode:both}.page-leave-active{animation:.15s both pageOut}.page-enter-active,.page-leave-active{max-height:100vh;overflow:hidden}@keyframes pageIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes pageOut{0%{opacity:1}to{opacity:0}}.toast-container{z-index:10000;pointer-events:none;flex-direction:column;gap:8px;display:flex;position:fixed;top:20px;right:20px}.toast{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);color:var(--text);pointer-events:auto;align-items:center;gap:10px;max-width:360px;padding:12px 16px;font-size:13px;font-weight:500;animation:.3s toastIn;display:flex}.toast.toast-success{border-left:3px solid var(--success)}.toast.toast-error{border-left:3px solid var(--danger)}.toast.toast-warning{border-left:3px solid var(--warning)}.toast.toast-info{border-left:3px solid var(--primary)}.toast-exit{animation:.2s forwards toastOut}@keyframes toastIn{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes toastOut{to{opacity:0;transform:translate(20px)}}.empty-state{text-align:center;flex-direction:column;align-items:center;padding:60px 20px;display:flex}.empty-state-icon{background:var(--surface-secondary);border-radius:var(--radius-xl);width:64px;height:64px;color:var(--text-tertiary);justify-content:center;align-items:center;margin-bottom:16px;display:flex}.empty-state-title{color:var(--text);margin-bottom:6px;font-size:15px;font-weight:600}.empty-state-desc{color:var(--text-secondary);max-width:320px;font-size:13px;line-height:1.5}@media (width<=640px){.hide-mobile{display:none!important}}@media (width>=641px) and (width<=1024px){.hide-tablet{display:none!important}}.g-btn{border-radius:var(--radius);transition:all var(--transition-fast);cursor:pointer;border:none;justify-content:center;align-items:center;gap:6px;padding:8px 16px;font-size:13px;font-weight:600;line-height:1.4;display:inline-flex}.g-btn-primary{background:var(--primary);color:#fff}.g-btn-primary:hover{background:var(--primary-dark)}.g-btn-primary:disabled{opacity:.5;cursor:not-allowed}.g-btn-secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.g-btn-secondary:hover{background:var(--surface-secondary);border-color:var(--divider)}.g-btn-danger{background:var(--danger-light);color:var(--danger)}.g-btn-danger:hover{background:#fee4e2}.g-btn-ghost{color:var(--text-secondary);background:0 0}.g-btn-ghost:hover{background:var(--surface-secondary);color:var(--text)}.g-btn-sm{padding:5px 12px;font-size:12px}.g-btn-lg{padding:10px 20px;font-size:14px}.pg-header{margin-bottom:24px}.pg-title{color:var(--text);margin:0 0 4px;font-size:22px;font-weight:700;line-height:1.3}.pg-subtitle{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.5}.section-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg,12px);margin-bottom:16px;padding:20px 24px}.section-card h3{color:var(--text);margin:0 0 12px;font-size:15px;font-weight:700}.g-spinner{border:2.5px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:20px;height:20px;animation:.7s linear infinite g-spin}.g-spinner-sm{border-width:2px;width:14px;height:14px}@keyframes g-spin{to{transform:rotate(360deg)}}.app-layout{background:var(--bg);min-height:100vh;display:flex}.sidebar{width:var(--sidebar-w);background:var(--surface);border-right:1px solid var(--border);z-index:100;transition:width var(--transition);flex-direction:column;display:flex;position:fixed;top:0;bottom:0;left:0;overflow:hidden}.sidebar.collapsed{width:64px}.sidebar-top{flex-shrink:0;padding:16px 12px 8px}.brand{border-radius:var(--radius);cursor:pointer;transition:background var(--transition-fast);align-items:center;gap:10px;min-height:40px;padding:6px 8px;display:flex}.brand:hover{background:var(--surface-secondary)}.brand-logo{flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.brand-text{flex-direction:column;min-width:0;display:flex}.brand-name{color:var(--text);white-space:nowrap;font-size:14px;font-weight:700}.brand-desc{color:var(--text-tertiary);white-space:nowrap;font-size:11px}.nav-body{flex:1;padding:0 8px;overflow-y:auto}.nav-group{margin-bottom:4px}.nav-group-label{color:var(--text-tertiary);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;padding:12px 12px 4px;font-size:11px;font-weight:600}.nav-group-divider{background:var(--border-light);height:1px;margin:8px 12px}.nav-list{list-style:none}.nav-list li{margin-bottom:1px}.nav-list a{color:var(--text-secondary);border-radius:var(--radius);transition:all var(--transition-fast);white-space:nowrap;align-items:center;gap:8px;padding:7px 10px;font-size:13px;font-weight:500;text-decoration:none;display:flex}.nav-list a:hover{background:var(--surface-secondary);color:var(--text);text-decoration:none}.nav-list a:focus-visible{outline:2px solid var(--primary);outline-offset:-2px;border-radius:8px}.nav-list a.active{background:var(--primary-light);color:var(--primary);font-weight:600}.nav-list a.active .nav-icon{color:var(--primary)}.nav-icon{flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;display:flex}.nav-label{flex:1}.sidebar.collapsed .nav-list a{justify-content:center;padding:10px}.sidebar.collapsed .brand{justify-content:center;padding:6px}.sidebar-bottom{border-top:1px solid var(--border-light);flex-shrink:0;padding:8px}.user-card{border-radius:var(--radius);transition:background var(--transition-fast);align-items:center;gap:10px;padding:8px 10px;display:flex}.user-card:hover{background:var(--surface-secondary)}.sidebar.collapsed .user-card{justify-content:center}.sidebar.collapsed .notif-bell-wrap{margin:0 4px 4px}.sidebar.collapsed .notif-bell{justify-content:center;padding:6px}.user-avatar{background:var(--primary);border-radius:var(--radius);color:#fff;flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;font-size:13px;font-weight:700;display:flex}.user-meta{flex-direction:column;flex:1;min-width:0;display:flex}.user-name{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:600;overflow:hidden}.user-role{color:var(--text-tertiary);font-size:11px}.btn-logout{color:var(--text-tertiary);border-radius:var(--radius-sm);transition:all var(--transition-fast);background:0 0;border:none;align-items:center;padding:6px;display:flex}.btn-logout:hover{color:var(--danger);background:var(--danger-light)}.balance-badge{border-radius:var(--radius);color:var(--success);cursor:pointer;background:linear-gradient(135deg,#f0fdf4 0%,#ecfdf5 100%);border:1px solid #bbf7d0;align-items:center;gap:6px;margin:0 8px 6px;padding:6px 12px;font-size:13px;font-weight:700;transition:all .15s;display:flex}.balance-badge:hover{background:linear-gradient(135deg,#dcfce7 0%,#d1fae5 100%)}.balance-badge svg{stroke:var(--success);flex-shrink:0}.main-content{margin-left:var(--sidebar-w);min-height:100vh;transition:margin-left var(--transition);flex:1;padding:28px 40px}.main-content.sidebar-collapsed{margin-left:64px}.fade-text-enter-active{transition:opacity .15s}.fade-text-leave-active{transition:opacity .1s}.fade-text-enter-from,.fade-text-leave-to{opacity:0}.notif-bell-wrap{margin:0 8px 4px;position:relative}.notif-bell{background:var(--surface-secondary);border:1px solid var(--border-light);border-radius:var(--radius);width:100%;color:var(--text-secondary);cursor:pointer;justify-content:center;align-items:center;gap:4px;padding:6px 12px;transition:all .15s;display:flex;position:relative}.notif-bell:hover{background:var(--surface-hover,#f3f4f6);color:var(--text)}.notif-dot{background:var(--danger,#ef4444);color:#fff;border-radius:9px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 5px;font-size:10px;font-weight:700;line-height:1;display:flex;position:absolute;top:-4px;right:-4px}.notif-panel{background:var(--surface);border:1px solid var(--border);z-index:1000;border-radius:12px;flex-direction:column;width:320px;max-height:420px;display:flex;position:absolute;bottom:calc(100% + 8px);left:0;overflow:hidden;box-shadow:0 8px 32px #0000001f}.notif-header{border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.notif-title{color:var(--text);font-size:14px;font-weight:700}.notif-readall{color:var(--primary);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:12px;font-weight:600}.notif-readall:hover{background:var(--primary-light)}.notif-body{max-height:360px;overflow-y:auto}.notif-empty{text-align:center;color:var(--text-tertiary);padding:32px 16px;font-size:13px}.notif-item{border-bottom:1px solid var(--border-light);cursor:pointer;padding:10px 16px;transition:background .1s}.notif-item:hover{background:var(--surface-secondary)}.notif-item.unread{border-left:3px solid var(--primary);background:#eff6ff}.notif-item-head{justify-content:space-between;align-items:center;margin-bottom:2px;display:flex}.notif-cat{color:#2563eb;background:#dbeafe;border-radius:4px;padding:1px 6px;font-size:11px;font-weight:600}.notif-cat[data-cat=withdrawal]{color:#d97706;background:#fef3c7}.notif-time{color:var(--text-tertiary);font-size:11px}.notif-item-title{color:var(--text);margin-bottom:2px;font-size:13px;font-weight:600}.notif-item-content{color:var(--text-secondary);font-size:12px;line-height:1.4}.notif-slide-enter-active,.notif-slide-leave-active{transition:all .2s}.notif-slide-enter-from,.notif-slide-leave-to{opacity:0;transform:translateY(8px)}@media (width<=768px){.sidebar{width:64px}.sidebar .brand-text,.sidebar .nav-group-label,.sidebar .nav-label,.sidebar .user-meta{display:none}.sidebar .notif-bell-wrap{margin:0 4px 4px}.sidebar .notif-bell{justify-content:center;padding:6px}.sidebar .notif-bell svg+span:not(.notif-dot){display:none}.sidebar .notif-panel{width:280px;bottom:calc(100% + 8px);left:50%;transform:translate(-50%)}.sidebar .nav-list a{justify-content:center;padding:10px}.sidebar .brand,.sidebar .user-card{justify-content:center}.main-content{margin-left:64px;padding:16px}}