:root{--c-primary:#8bc34a;--c-primary-dark:#689f38;--c-primary-light:#aed581;--c-primary-pale:#dcedc8;--c-accent:#cddc39;--c-accent-warm:#d4e157;--c-yellow:#ffd54f;--c-yellow-soft:#fff8e1;--c-bg:#f5f7f0;--c-bg-soft:#fafbf7;--c-bg-card:#fff;--c-sidebar:#2e3b1f;--c-sidebar-hover:#3d4d2a;--c-sidebar-active:#689f38;--c-text:#2e3b1f;--c-text-secondary:#5c6b4a;--c-text-light:#8a9a7a;--c-text-inverse:#f5f7f0;--c-text-sidebar:#c5d1b5;--c-border:#e0e5d5;--c-border-light:#eff2e8;--c-success:#4caf50;--c-warning:#ff9800;--c-error:#f44336;--c-info:#2196f3;--shadow-sm:0 1px 3px #3c502814;--shadow-md:0 4px 12px #3c50281f;--shadow-lg:0 8px 28px #3c502829;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--sidebar-width:240px;--topbar-height:60px;--content-max-width:1200px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{min-height:100vh;color:var(--c-text);background:var(--c-bg);text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:PingFang SC,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,Segoe UI,sans-serif;font-size:14px;line-height:1.6}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--c-primary-light);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--c-primary)}.text-primary{color:var(--c-primary)}.text-secondary{color:var(--c-text-secondary)}.text-light{color:var(--c-text-light)}.text-error{color:var(--c-error)}.text-success{color:var(--c-success)}.bg-pale{background:var(--c-primary-pale)}.bg-yellow-soft{background:var(--c-yellow-soft)}.fade-enter-active,.fade-leave-active{transition:opacity .25s}.fade-enter-from,.fade-leave-to{opacity:0}.slide-fade-enter-active{transition:all .3s}.slide-fade-leave-active{transition:all .2s}.slide-fade-enter-from{opacity:0;transform:translateY(10px)}.slide-fade-leave-to{opacity:0;transform:translateY(-10px)}#app{width:100%;min-height:100vh}a{color:var(--c-primary-dark);text-decoration:none;transition:color .2s}a:hover{color:var(--c-primary)}.btn{border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;justify-content:center;align-items:center;gap:6px;padding:8px 20px;font-size:14px;font-weight:500;line-height:1.5;transition:all .2s;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--c-primary);color:#fff}.btn-primary:hover:not(:disabled){background:var(--c-primary-dark);box-shadow:var(--shadow-md)}.btn-accent{background:var(--c-accent);color:var(--c-text)}.btn-accent:hover:not(:disabled){background:var(--c-accent-warm);box-shadow:var(--shadow-md)}.btn-outline{border:1px solid var(--c-border);color:var(--c-text-secondary);background:0 0}.btn-outline:hover:not(:disabled){border-color:var(--c-primary);color:var(--c-primary-dark);background:var(--c-primary-pale)}.btn-danger{background:var(--c-error);color:#fff}.btn-danger:hover:not(:disabled){opacity:.85}.btn-sm{padding:4px 12px;font-size:12px}.btn-lg{padding:12px 28px;font-size:16px}.btn-block{width:100%}.card{background:var(--c-bg-card);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--c-border-light);overflow:hidden}.card-header{border-bottom:1px solid var(--c-border-light);justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.card-body{padding:20px}.form-group{margin-bottom:20px}.form-label{color:var(--c-text-secondary);margin-bottom:6px;font-size:13px;font-weight:500;display:block}.form-input,.form-textarea,.form-select{border:1px solid var(--c-border);border-radius:var(--radius-sm);width:100%;color:var(--c-text);background:var(--c-bg-card);outline:none;padding:10px 14px;font-size:14px;transition:border-color .2s,box-shadow .2s}.form-input:focus,.form-textarea:focus,.form-select:focus{border-color:var(--c-primary);box-shadow:0 0 0 3px #8bc34a26}.form-input::placeholder,.form-textarea::placeholder{color:var(--c-text-light)}.form-textarea{resize:vertical;min-height:80px;line-height:1.6}.tag{border-radius:12px;padding:2px 10px;font-size:12px;font-weight:500;line-height:1.5;display:inline-block}.tag-primary{background:var(--c-primary-pale);color:var(--c-primary-dark)}.tag-accent{color:#827717;background:#f0f4c7}.tag-warning{color:#e65100;background:#fff3e0}.tag-error{color:#c62828;background:#ffebee}.tag-info{color:#1565c0;background:#e3f2fd}.tag-default{color:#616161;background:#f5f5f5}.empty-state{text-align:center;color:var(--c-text-light);padding:48px 20px}.empty-state .icon{margin-bottom:16px;font-size:48px}.loading-spinner{border:2px solid var(--c-primary-pale);border-top-color:var(--c-primary);border-radius:50%;width:20px;height:20px;animation:.8s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.page{padding:var(--space-lg) var(--space-xl);max-width:var(--content-max-width);margin:0 auto}.page-header{margin-bottom:var(--space-lg)}.page-title{color:var(--c-text);font-size:22px;font-weight:700}.page-subtitle{color:var(--c-text-secondary);margin-top:4px;font-size:14px}