.app-container{width:100%;height:100vh;margin:0;padding:0;background-color:var(--bg-color, #1a1a2e);display:flex;flex-direction:column}.top-nav{height:60px;background:#0006;border-bottom:1px solid var(--border, #333);display:flex;align-items:center;padding:0 2rem;justify-content:space-between;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.nav-brand{font-weight:700;font-size:1.2rem;color:var(--accent, #4facfe);letter-spacing:.5px}.nav-links{flex:1;display:flex;align-items:center;justify-content:center}.nav-links a{color:#ccc;text-decoration:none;margin:0 1rem;font-weight:500;transition:color .2s}.nav-links a:hover,.nav-links a.router-link-active{color:var(--accent, #4facfe)}.nav-actions{display:flex;align-items:center}.logout-btn{background:transparent;border:1px solid var(--border, #555);color:#ccc;padding:6px 16px;border-radius:4px;cursor:pointer;font-size:.9rem;transition:all .2s}.logout-btn:hover{background:#ffffff1a;color:#fff;border-color:#888}.main-content{flex:1;width:100%;overflow:hidden;display:flex;flex-direction:column}:root{--bg-color: #0d0d12;--card-bg: #16161e;--input-bg: #1f1f2a;--border-color: #2b2b3b;--text-primary: #e0e0ed;--text-secondary: #9090a0;--accent: #6c63ff;--accent-hover: #5a52d5;--success: #00e676;--font-main: "Inter", sans-serif;--font-code: "JetBrains Mono", monospace}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);font-family:var(--font-main);height:100vh;overflow:hidden;display:block}.app-container{display:flex;width:100%;height:100%}.sidebar{width:280px;background:var(--card-bg);border-right:1px solid var(--border-color);display:flex;flex-direction:column;flex-shrink:0}.sidebar-header{padding:1.5rem;border-bottom:1px solid var(--border-color)}.logo{display:flex;align-items:center;gap:.75rem;color:var(--accent)}.logo h1{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin:0}.sidebar-nav{flex:1;overflow-y:auto;padding:1rem}.sidebar-footer{padding:1rem;border-top:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--text-secondary)}.status-indicator{display:flex;align-items:center;gap:.5rem;color:var(--success)}.dot{width:8px;height:8px;background-color:var(--success);border-radius:50%;box-shadow:0 0 8px var(--success)}.nav-section{margin-bottom:1.5rem}.nav-section-header{text-transform:uppercase;font-size:.75rem;font-weight:600;color:var(--text-secondary);letter-spacing:.05em;margin-bottom:.75rem;padding-left:.5rem}.nav-item{padding:.4rem .6rem;border-radius:4px;font-size:.9rem;color:var(--text-secondary);cursor:pointer;transition:all .2s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;text-decoration:none;margin-bottom:.25rem}.nav-item:hover{color:var(--text-primary);background:#1f1f2a}.nav-item.active{color:#fff;background:var(--accent)}.nav-item .icon{margin-right:.75rem;font-size:1.1em}.main-content{flex:1;display:flex;flex-direction:column;min-width:0;background:var(--bg-color)}.view-container{height:100%;width:100%;display:flex;flex-direction:column}.view-header{height:60px;border-bottom:1px solid var(--border-color);display:flex;align-items:center;padding:0 2rem;background:var(--bg-color)}.view-header h2{font-size:1.1rem;font-weight:500;margin:0}.view-content{flex:1;padding:2rem;overflow-y:auto}button,.btn{background:var(--accent);color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;font-weight:500;cursor:pointer;transition:background .2s}button:hover,.btn:hover{background:var(--accent-hover)}input,select,textarea{background:var(--input-bg);border:1px solid var(--border-color);color:var(--text-primary);padding:.75rem;border-radius:6px;font-family:var(--font-main);font-size:.9rem;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--accent)}.panel,.card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:12px}