#app{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#2c3e50;min-height:100vh}body{margin:0;background:#f8fafc}.app-header{background:#fff;border-bottom:1px solid #e5e7eb;position:sticky;top:0;z-index:100;box-shadow:0 1px 3px #0000001a}.header-content{display:flex;justify-content:space-between;align-items:center;height:64px}.header-left{display:flex;align-items:center;gap:32px}.logo{display:flex;align-items:center;padding-left:12px;padding-right:12px;gap:8px;text-decoration:none;color:#1a1a1a;font-weight:700;font-size:20px}.logo-icon{font-size:24px}.main-nav{display:flex;gap:24px}.nav-link{color:#666;text-decoration:none;font-weight:500;padding:8px 16px;border-radius:6px;transition:all .2s ease}.nav-link:hover,.nav-link.router-link-active{color:#667eea;background:#667eea1a}.user-menu{position:relative}.user-button{display:flex;align-items:center;gap:8px;background:none;border:none;padding:8px 12px;border-radius:8px;cursor:pointer;transition:background .2s ease}.user-button:hover{background:#f3f4f6}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px}.user-name{font-weight:500;color:#333}.dropdown-arrow{font-size:12px;color:#666;transition:transform .2s ease}.user-button:hover .dropdown-arrow{transform:rotate(180deg)}.user-dropdown{position:absolute;top:100%;right:0;margin-top:8px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;box-shadow:0 4px 6px #0000001a;min-width:200px;z-index:1000}.dropdown-item{display:flex;align-items:center;gap:8px;padding:12px 16px;color:#333;font-size:14px}.dropdown-button{width:100%;background:none;border:none;text-align:left;cursor:pointer;transition:background .2s ease}.dropdown-button:hover{background:#f3f4f6}.dropdown-icon{width:16px;text-align:center}.dropdown-divider{height:1px;background:#e5e7eb;margin:4px 0}.app-main{min-height:100vh}.app-main.with-header{min-height:calc(100vh - 64px)}.overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:99}@media (max-width: 768px){.header-content{height:56px}.header-left{gap:16px}.logo-text,.main-nav,.user-name{display:none}.app-main.with-header{min-height:calc(100vh - 56px)}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;color:#333}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.container{max-width:1200px;margin:0 auto;padding:0 20px}.text-center{text-align:center}.mt-20{margin-top:20px}.mb-20{margin-bottom:20px}.btn{display:inline-block;padding:8px 16px;border:none;border-radius:4px;cursor:pointer;text-decoration:none;font-size:14px;transition:background-color .2s}.btn:hover{opacity:.9}.btn-primary{background-color:#42b983;color:#fff}.btn-secondary{background-color:#6c757d;color:#fff}.btn-danger{background-color:#dc3545;color:#fff}.btn-success{background-color:#28a745;color:#fff}.form-group{margin-bottom:15px}.form-group label{display:block;margin-bottom:5px;font-weight:500}.form-control{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px}.form-control:focus{outline:none;border-color:#42b983;box-shadow:0 0 0 2px #42b98333}.card{background:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;padding:20px;margin-bottom:20px;border:1px solid #ddd}.grid{display:grid;gap:20px}.grid-2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.grid-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}@media (max-width: 768px){.container{padding:0;max-width:100%}.grid-2,.grid-3{grid-template-columns:1fr}}