@import"https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;500;600;700&family=Fira+Sans:wght@300;400;500;600;700&display=swap";.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;width:100%;padding:var(--space-4);background-color:var(--color-bg-base)}.login-card{width:100%;max-width:380px;background-color:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:6px;padding:var(--space-8);box-shadow:0 1px 3px #0000004d}.login-title{font-size:var(--font-size-2xl);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-1);letter-spacing:-.02em}.login-subtitle{font-size:var(--font-size-base);color:var(--color-text-muted);margin-bottom:var(--space-6)}.login-form{display:flex;flex-direction:column;gap:var(--space-4);margin-bottom:var(--space-6)}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-label{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-weight:500;text-transform:uppercase;letter-spacing:.05em}.login-form input{font-size:var(--font-size-lg);padding:var(--space-3) var(--space-4);height:44px}.login-form input:disabled{opacity:.6;cursor:not-allowed}.login-error{padding:var(--space-3) var(--space-4);background-color:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:4px;font-size:var(--font-size-sm);color:#fca5a5;animation:slideDown .15s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.login-button{height:44px;background-color:var(--color-accent);color:#fff;font-size:var(--font-size-lg);font-weight:500;border-radius:4px;transition:background-color .15s ease-out,box-shadow .15s ease-out;cursor:pointer}.login-button:hover:not(:disabled){background-color:var(--color-accent-dark);box-shadow:0 4px 12px #10b9814d}.login-button:active:not(:disabled){background-color:var(--color-accent-dark)}.login-button:disabled{opacity:.5;cursor:not-allowed}.login-button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.system-status{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);border-top:1px solid var(--color-border);margin-top:var(--space-4)}.status-dot{width:8px;height:8px;border-radius:50%;transition:background-color .2s ease-out}.status-dot.ready{background-color:var(--color-success);box-shadow:0 0 8px #10b98166}.status-dot.offline{background-color:var(--color-text-muted)}.status-text{font-size:var(--font-size-sm);color:var(--color-text-muted);font-weight:500}@media (max-width: 480px){.login-card{padding:var(--space-6)}.login-title{font-size:var(--font-size-xl)}.login-subtitle{font-size:var(--font-size-sm)}}.dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--space-4)}.dialog-content{background-color:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:6px;padding:var(--space-6);max-width:500px;width:100%;box-shadow:0 20px 25px -5px #0006;animation:slideUp .2s ease-out}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.dialog-title{font-size:var(--font-size-xl);font-weight:600;color:var(--color-text-primary);margin-bottom:var(--space-4)}.dialog-warning{padding:var(--space-3) var(--space-4);background-color:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:4px;color:#fca5a5;font-size:var(--font-size-sm);margin-bottom:var(--space-4);line-height:1.6}.dialog-text{color:var(--color-text-secondary);font-size:var(--font-size-base);margin-bottom:var(--space-4)}.dialog-text code{background-color:var(--color-bg-base);padding:var(--space-1) var(--space-2);border-radius:3px;font-family:Courier New,monospace;font-size:var(--font-size-sm);color:var(--color-accent)}.dialog-form{display:flex;flex-direction:column;gap:var(--space-4);margin-bottom:var(--space-4)}.checkbox-label{display:flex;align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);color:var(--color-text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer;accent-color:var(--color-accent)}.dialog-actions{display:flex;gap:var(--space-3);justify-content:flex-end}.btn-secondary,.btn-danger{padding:var(--space-2) var(--space-4);border:1px solid var(--color-border);border-radius:4px;font-size:var(--font-size-sm);font-weight:500;cursor:pointer;transition:all .15s ease-out}.btn-secondary{background-color:transparent;color:var(--color-text-primary)}.btn-secondary:hover:not(:disabled){background-color:var(--color-bg-base);border-color:var(--color-accent);color:var(--color-accent)}.btn-danger{background-color:var(--color-error);color:#fff;border-color:var(--color-error)}.btn-danger:hover:not(:disabled){background-color:#dc2626;box-shadow:0 4px 12px #ef44444d}.btn-danger:disabled,.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary:focus-visible,.btn-danger:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.toast{position:fixed;bottom:var(--space-4);right:var(--space-4);padding:var(--space-3) var(--space-4);border-radius:4px;font-size:var(--font-size-sm);display:flex;align-items:center;gap:var(--space-3);box-shadow:0 4px 12px #0000004d;animation:slideInRight .2s ease-out;z-index:2000;max-width:400px}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.toast.hidden{animation:slideOutRight .2s ease-out forwards}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(20px)}}.toast-success{background-color:#10b9811a;border:1px solid rgba(16,185,129,.3);color:#86efac}.toast-error{background-color:#ef44441a;border:1px solid rgba(239,68,68,.3);color:#fca5a5}.toast-info{background-color:#3b82f61a;border:1px solid rgba(59,130,246,.3);color:#93c5fd}.toast-message{flex:1}.toast-close{background:none;border:none;color:inherit;cursor:pointer;font-size:var(--font-size-lg);padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity .15s ease-out}.toast-close:hover{opacity:.7}@media (max-width: 480px){.toast{bottom:var(--space-3);right:var(--space-3);max-width:calc(100vw - var(--space-6))}}.backups-container{display:flex;flex-direction:column;gap:var(--space-6);max-width:100%}.page-header{margin-bottom:var(--space-4)}.page-header h1{font-family:Fira Code,monospace;font-size:var(--font-size-2xl);font-weight:700;letter-spacing:-.03em;color:var(--color-text-primary);margin-bottom:var(--space-2);background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.subtitle{font-size:var(--font-size-base);color:var(--color-text-muted);margin:0;font-weight:400;letter-spacing:.05em;text-transform:uppercase}.backup-controls{display:grid;grid-template-columns:1fr auto;gap:var(--space-4);align-items:end;padding:var(--space-4);background:linear-gradient(135deg,rgba(37,99,235,.05) 0%,rgba(217,119,6,.05) 100%);border:1px solid rgba(37,99,235,.2);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.control-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-label{font-size:var(--font-size-sm);color:var(--color-text-muted);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-family:Fira Code,monospace}.form-select{padding:var(--space-2) var(--space-3);background-color:#0f172a99;border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-primary);font-size:var(--font-size-base);cursor:pointer;transition:all .2s cubic-bezier(.34,1.56,.64,1);font-family:Fira Sans,sans-serif}.form-select:hover:not(:disabled){border-color:var(--color-primary);background-color:#0f172acc;box-shadow:0 0 0 3px #2563eb1a}.form-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb26}.form-select:disabled{opacity:.5;cursor:not-allowed}.btn-primary{padding:var(--space-2) var(--space-6);background:linear-gradient(135deg,var(--color-accent) 0%,#c17e04 100%);color:#fff;border:1px solid rgba(217,119,6,.3);border-radius:6px;font-size:var(--font-size-base);font-weight:600;font-family:Fira Code,monospace;cursor:pointer;transition:all .2s cubic-bezier(.34,1.56,.64,1);white-space:nowrap;text-transform:uppercase;letter-spacing:.05em}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px #d9770659}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-primary:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.backup-health{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-4)}.health-card{padding:var(--space-4);background:linear-gradient(135deg,rgba(15,23,42,.8) 0%,rgba(15,23,42,.5) 100%);border:1px solid rgba(37,99,235,.15);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .2s ease-out}.health-card:hover{border-color:#2563eb4d;background:linear-gradient(135deg,rgba(15,23,42,.9) 0%,rgba(15,23,42,.6) 100%);box-shadow:0 8px 32px #2563eb1a}.health-label{font-size:var(--font-size-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.1em;font-weight:600;font-family:Fira Code,monospace;margin-bottom:var(--space-2)}.health-value{font-size:var(--font-size-2xl);font-weight:700;font-family:Fira Code,monospace;color:var(--color-primary);margin-bottom:var(--space-2);letter-spacing:-.02em}.health-detail{font-size:var(--font-size-sm);color:var(--color-text-secondary);font-family:Fira Sans,sans-serif;line-height:1.5}.backups-list{display:flex;flex-direction:column;gap:var(--space-3)}.backups-list h2{font-family:Fira Code,monospace;font-size:var(--font-size-xl);font-weight:700;color:var(--color-text-primary);margin:0;letter-spacing:-.01em;text-transform:uppercase}.placeholder-text{padding:var(--space-6);text-align:center;color:var(--color-text-muted);background:linear-gradient(135deg,rgba(37,99,235,.03) 0%,rgba(217,119,6,.03) 100%);border:2px dashed rgba(37,99,235,.15);border-radius:8px;margin:0;font-size:var(--font-size-base);font-family:Fira Sans,sans-serif}.table-wrapper{overflow-x:auto;border:1px solid var(--color-border);border-radius:8px;background:linear-gradient(135deg,rgba(15,23,42,.6) 0%,rgba(15,23,42,.4) 100%);box-shadow:0 4px 16px #0000004d}.backups-table{width:100%;border-collapse:collapse;font-size:var(--font-size-sm);font-family:Fira Sans,sans-serif}.backups-table thead{background:linear-gradient(90deg,rgba(37,99,235,.1) 0%,rgba(217,119,6,.05) 100%);border-bottom:2px solid rgba(37,99,235,.2)}.backups-table th{padding:var(--space-3) var(--space-4);text-align:left;font-weight:700;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.1em;font-size:var(--font-size-xs);font-family:Fira Code,monospace}.backups-table td{padding:var(--space-3) var(--space-4);border-bottom:1px solid rgba(37,99,235,.1);color:var(--color-text-primary);vertical-align:middle}.backups-table tbody tr{transition:all .15s ease-out}.backups-table tbody tr:hover{background-color:#2563eb14}.cell-filename code{background-color:#0f172acc;padding:var(--space-1) var(--space-2);border-radius:4px;border:1px solid rgba(217,119,6,.2);font-family:Fira Code,monospace;color:var(--color-accent);font-size:var(--font-size-xs);word-break:break-all;letter-spacing:.02em}.cell-date,.cell-size,.cell-age{color:var(--color-text-secondary);font-family:Fira Code,monospace;font-size:var(--font-size-xs)}.cell-actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.btn-action{padding:var(--space-1) var(--space-3);background-color:#2563eb1a;border:1px solid rgba(37,99,235,.3);color:var(--color-primary);border-radius:4px;font-size:var(--font-size-xs);font-weight:600;font-family:Fira Code,monospace;cursor:pointer;transition:all .15s cubic-bezier(.34,1.56,.64,1);white-space:nowrap;text-transform:uppercase;letter-spacing:.05em}.btn-action:hover{border-color:var(--color-primary);background-color:#2563eb33;box-shadow:0 4px 12px #2563eb26;transform:translateY(-1px)}.btn-action:active{transform:translateY(0)}.btn-delete{background-color:#dc26261a;border-color:#dc26264d;color:var(--color-destructive)}.btn-delete:hover{border-color:var(--color-destructive);background-color:#dc262633;box-shadow:0 4px 12px #dc262626}.btn-action:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.toasts-container{position:fixed;bottom:0;right:0;pointer-events:none;z-index:2000}.toasts-container>*{pointer-events:auto}@media (max-width: 768px){.backup-controls{grid-template-columns:1fr;gap:var(--space-3)}.control-group,.btn-primary{width:100%}.backup-health{grid-template-columns:1fr 1fr}.table-wrapper{border-radius:6px;overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch}.backups-table{font-size:11px;min-width:100%}.backups-table thead{background:linear-gradient(90deg,rgba(37,99,235,.15) 0%,rgba(217,119,6,.1) 100%);border-bottom:2px solid rgba(37,99,235,.2)}.backups-table th{padding:6px 4px;font-size:10px;white-space:nowrap;text-align:center;font-weight:700}.backups-table th:first-child{text-align:center}.backups-table tbody tr{transition:all .15s ease-out}.backups-table tbody tr:hover{background-color:#2563eb1a}.backups-table td{padding:6px 4px;border-bottom:1px solid rgba(37,99,235,.1);text-align:center;font-size:11px}.backups-table td:first-child{text-align:center}.cell-filename{width:32px;padding:6px 4px;text-align:center}.cell-filename code{background:none;padding:0;border:none;font-size:18px;color:var(--color-accent);font-weight:700;word-break:normal;display:block;cursor:pointer;line-height:1;transition:transform .15s ease-out}.cell-filename code:hover{transform:scale(1.1)}.cell-date,.cell-size,.cell-age{font-size:11px;color:var(--color-text-secondary);white-space:nowrap}.cell-actions{display:flex;gap:3px;flex-wrap:nowrap;justify-content:center}.btn-action{padding:4px 6px;font-size:10px;white-space:nowrap;min-height:32px;min-width:auto}}@media (max-width: 480px){.backup-health{grid-template-columns:1fr}.backups-table{font-size:10px}.backups-table th{padding:4px 3px;font-size:9px}.backups-table td{padding:4px 3px}.cell-filename{width:28px}.cell-filename code{font-size:16px}.cell-date{display:none}.backups-table th:nth-child(2){display:none}.btn-action{padding:3px 4px;font-size:9px;min-height:28px}.backups-list h2{font-size:var(--font-size-lg)}}:root{--color-primary: #1e40af;--color-on-primary: #ffffff;--color-secondary: #3b82f6;--color-accent: #d97706;--color-background: #0f172a;--color-foreground: #f1f5f9;--color-muted: #64748b;--color-border: #334155;--color-destructive: #dc2626;--color-success: #10b981;--color-warning: #f59e0b;--color-ring: #1e40af;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--radius-sm: 4px;--radius-md: 6px;--radius-lg: 8px;--duration-fast: .15s;--duration-base: .2s;--duration-slow: .3s;--ease-out: cubic-bezier(.4, 0, .2, 1);--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-inout: cubic-bezier(.4, 0, .2, 1)}body{font-family:Fira Sans,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;letter-spacing:-.01em;line-height:1.6}.monitoring-container{padding:var(--space-xl);max-width:1400px;margin:0 auto}.page-header{margin-bottom:32px}.page-header h1{font-family:Fira Code,monospace;font-size:32px;font-weight:700;margin-bottom:var(--space-sm);color:var(--color-foreground);letter-spacing:-.02em}.page-header .subtitle{color:var(--color-muted);font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:.05em}.system-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-lg);margin-bottom:var(--space-2xl)}.stat-card{background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-lg);transition:all var(--duration-base) var(--ease-out);position:relative;overflow:hidden}.stat-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at top right,rgba(59,130,246,.1) 0%,transparent 100%);pointer-events:none;opacity:0;transition:opacity var(--duration-base) var(--ease-out)}.stat-card:hover{border-color:var(--color-secondary);background:linear-gradient(135deg,#1e293b 0%,#1a2f4d 100%);box-shadow:0 0 20px #3b82f626}.stat-card:hover:before{opacity:1}.stat-card h3{font-family:Fira Code,monospace;font-size:12px;font-weight:600;color:var(--color-muted);margin-bottom:var(--space-md);text-transform:uppercase;letter-spacing:.1em}.stat-card .stat-value{font-family:Fira Code,monospace;font-size:32px;font-weight:700;color:var(--color-foreground);margin-bottom:var(--space-sm);letter-spacing:-.02em}.stat-card .stat-detail{font-size:12px;color:var(--color-muted);font-weight:500}.containers-section{margin-bottom:var(--space-xl)}.containers-section h2{font-family:Fira Code,monospace;font-size:20px;font-weight:700;margin-bottom:var(--space-lg);color:var(--color-foreground);letter-spacing:-.01em}.containers-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--space-lg)}.container-card{background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-lg);display:flex;flex-direction:column;gap:var(--space-lg);transition:all var(--duration-base) var(--ease-out);position:relative;overflow:hidden}.container-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:radial-gradient(circle at top right,rgba(59,130,246,.08) 0%,transparent 100%);pointer-events:none;opacity:0;transition:opacity var(--duration-base) var(--ease-out)}.container-card:hover{border-color:var(--color-secondary);background:linear-gradient(135deg,#1e293b 0%,#1a2f4d 100%);box-shadow:0 0 20px #3b82f61f,0 4px 12px #0000004d;transform:translateY(-2px)}.container-card:hover:before{opacity:1}.container-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-md)}.container-header h3{font-family:Fira Code,monospace;font-size:15px;font-weight:700;color:var(--color-foreground);margin:0;word-break:break-word;letter-spacing:-.01em}.image-name{font-size:11px;color:var(--color-muted);margin:var(--space-sm) 0 0 0;font-family:Fira Code,monospace;font-weight:500;text-transform:lowercase}.state-indicator{width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-top:5px;box-shadow:0 0 8px currentColor;opacity:.8;animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:.8}50%{opacity:1}}.container-details{display:flex;flex-direction:column;gap:var(--space-sm);padding:var(--space-md) 0;border-top:1px solid rgba(52,65,85,.5);border-bottom:1px solid rgba(52,65,85,.5)}.detail{display:flex;justify-content:space-between;align-items:center;font-size:12px}.detail .label{color:var(--color-muted);font-weight:600;text-transform:uppercase;letter-spacing:.04em;font-family:Fira Code,monospace}.detail .value{color:var(--color-foreground);text-align:right;flex-grow:1;margin-left:var(--space-lg);font-family:Fira Code,monospace;font-weight:500}.container-actions{display:flex;gap:8px}.btn-action{flex:1;padding:var(--space-sm) var(--space-md);font-size:11px;font-weight:600;border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--duration-base) var(--ease-out);text-transform:uppercase;letter-spacing:.08em;font-family:Fira Code,monospace;position:relative;overflow:hidden}.btn-action:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.2);transform:translate(-50%,-50%);transition:width var(--duration-fast) var(--ease-out),height var(--duration-fast) var(--ease-out)}.btn-action:active:before{width:100%;height:100%}.btn-action:focus-visible{outline:2px solid var(--color-ring);outline-offset:2px}.btn-action:disabled{opacity:.5;cursor:not-allowed}.btn-restart{background:var(--color-secondary);color:var(--color-on-primary);box-shadow:0 0 16px #3b82f640}.btn-restart:hover:not(:disabled){background:#2563eb;box-shadow:0 0 24px #3b82f659;transform:translateY(-1px)}.btn-restart:active:not(:disabled){transform:translateY(0)}.btn-stop{background:var(--color-destructive);color:var(--color-on-primary);box-shadow:0 0 16px #dc262640}.btn-stop:hover:not(:disabled){background:#b91c1c;box-shadow:0 0 24px #dc262659;transform:translateY(-1px)}.btn-stop:active:not(:disabled){transform:translateY(0)}.btn-start{background:var(--color-success);color:var(--color-on-primary);box-shadow:0 0 16px #10b98140}.btn-start:hover:not(:disabled){background:#059669;box-shadow:0 0 24px #10b98159;transform:translateY(-1px)}.btn-start:active:not(:disabled){transform:translateY(0)}.placeholder-text{text-align:center;color:var(--color-muted);padding:var(--space-2xl) var(--space-lg);font-size:14px;font-weight:500}.toasts-container{position:fixed;bottom:var(--space-lg);right:var(--space-lg);z-index:9999;display:flex;flex-direction:column;gap:var(--space-md)}@media (max-width: 1024px){.containers-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width: 768px){.monitoring-container{padding:var(--space-lg)}.page-header h1{font-size:24px}.system-stats,.containers-grid{grid-template-columns:1fr;gap:var(--space-md)}.container-card{padding:var(--space-md)}.btn-action{padding:var(--space-xs) var(--space-sm);font-size:10px}.toasts-container{bottom:var(--space-md);right:var(--space-md);left:var(--space-md)}.toasts-container>*{width:100%}}@media (max-width: 480px){.monitoring-container{padding:var(--space-md)}.page-header h1{font-size:20px}.stat-card .stat-value{font-size:24px}.stat-card h3,.stat-card .stat-detail{font-size:11px}.container-header h3{font-size:14px}.image-name{font-size:10px}.detail{font-size:11px}}.dashboard-container{display:flex;flex-direction:column;height:100vh;width:100%;background-color:var(--color-bg-base);overflow:hidden}.dashboard-nav{display:flex;flex-direction:column;border-bottom:1px solid var(--color-border);background-color:var(--color-bg-surface);z-index:100}.nav-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);gap:var(--space-4)}.dashboard-title{font-family:Fira Code,monospace;font-size:var(--font-size-lg);font-weight:700;color:var(--color-text-primary);margin:0;letter-spacing:-.01em}.hamburger-button{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:var(--space-2);min-width:44px;min-height:44px;align-items:center;justify-content:center}.hamburger-button span{display:block;width:24px;height:2px;background-color:var(--color-text-primary);transition:all .2s ease-out;border-radius:1px}.hamburger-button:hover span{background-color:var(--color-primary)}.nav-menu-wrapper{display:flex;flex-direction:row;align-items:center;justify-content:space-between;padding:0 var(--space-4) var(--space-4) var(--space-4);gap:var(--space-4)}.nav-menu{display:flex;list-style:none;gap:var(--space-3);margin:0;padding:0;flex-wrap:wrap}.nav-link{background:none;border:none;color:var(--color-text-muted);font-size:var(--font-size-sm);font-family:Fira Code,monospace;font-weight:600;cursor:pointer;padding:var(--space-2) var(--space-3);border-radius:4px;transition:all .15s ease-out;min-height:44px;display:flex;align-items:center;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.nav-link:hover{color:var(--color-text-primary);background-color:#2563eb1a}.nav-link.active{color:var(--color-primary);background-color:#2563eb26;font-weight:700}.nav-link:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.nav-info{display:flex;align-items:center;gap:var(--space-4);margin-left:auto}.user-icon-wrapper{position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(37,99,235,.15) 0%,rgba(217,119,6,.1) 100%);border:1px solid rgba(37,99,235,.2);cursor:help;transition:all .15s ease-out}.user-icon-wrapper:hover{border-color:#2563eb66;background:linear-gradient(135deg,rgba(37,99,235,.25) 0%,rgba(217,119,6,.15) 100%)}.user-icon{width:24px;height:24px;color:var(--color-text-secondary);transition:color .15s ease-out}.user-icon-wrapper:hover .user-icon{color:var(--color-primary)}.user-tooltip{position:absolute;bottom:-32px;left:50%;transform:translate(-50%);background-color:#0f172af2;color:var(--color-text-primary);padding:var(--space-2) var(--space-3);border-radius:4px;font-size:var(--font-size-xs);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .15s ease-out;border:1px solid rgba(37,99,235,.2);font-family:Fira Sans,sans-serif;z-index:10}.user-icon-wrapper:hover .user-tooltip{opacity:1}.logout-button{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background-color:transparent;border:1px solid rgba(220,38,38,.3);color:var(--color-text-primary);border-radius:50%;font-size:var(--font-size-sm);transition:all .15s ease-out;cursor:pointer;min-height:auto;min-width:auto}.logout-icon{width:20px;height:20px;color:var(--color-text-primary);transition:color .15s ease-out}.logout-button:hover{background-color:#dc262626;border-color:#dc262680}.logout-button:hover .logout-icon{color:#fca5a5}.logout-button:active{transform:scale(.95)}.logout-button:focus-visible{outline:2px solid var(--color-destructive);outline-offset:2px}.dashboard-main{flex:1;overflow-y:auto;overflow-x:hidden;padding:var(--space-6);padding-bottom:var(--space-8)}.dashboard-header{margin-bottom:var(--space-6)}.dashboard-header h2{font-family:Fira Code,monospace;font-size:var(--font-size-2xl);font-weight:700;color:var(--color-text-primary);margin-bottom:var(--space-2);letter-spacing:-.02em}.subtitle{font-size:var(--font-size-base);color:var(--color-text-muted);font-family:Fira Sans,sans-serif}.placeholder-content{padding:var(--space-6);background:linear-gradient(135deg,rgba(37,99,235,.05) 0%,rgba(217,119,6,.05) 100%);border:1px solid rgba(37,99,235,.15);border-radius:8px}.placeholder-content h3{font-family:Fira Code,monospace;font-size:var(--font-size-lg);font-weight:700;color:var(--color-text-primary);margin-top:var(--space-4);margin-bottom:var(--space-3)}.placeholder-content p{color:var(--color-text-secondary);margin-bottom:var(--space-4);font-family:Fira Sans,sans-serif;line-height:1.6}.feature-list{list-style:none;display:flex;flex-direction:column;gap:var(--space-2);padding:0;margin:0}.feature-list li{padding:var(--space-2) var(--space-4);position:relative;color:var(--color-text-secondary);font-size:var(--font-size-base);font-family:Fira Sans,sans-serif;border-left:2px solid rgba(37,99,235,.3);transition:all .15s ease-out}.feature-list li:hover{border-left-color:var(--color-primary);padding-left:var(--space-5)}@media (max-width: 768px){.hamburger-button{display:flex}.nav-menu-wrapper{flex-direction:column;align-items:stretch;max-height:0;overflow:hidden;opacity:0;transition:all .2s ease-out;padding:0}.nav-menu-wrapper.open{max-height:500px;opacity:1;padding:var(--space-3) var(--space-4) var(--space-4) var(--space-4);border-top:1px solid rgba(37,99,235,.15)}.nav-menu{flex-direction:column;gap:0;width:100%}.nav-link{padding:var(--space-3) var(--space-4);justify-content:flex-start;border-radius:0;font-size:var(--font-size-sm)}.nav-info{margin-left:0;flex-direction:row;align-items:center;gap:var(--space-3);width:100%;border-top:1px solid rgba(37,99,235,.15);padding-top:var(--space-3)}.user-tooltip{display:none}.logout-button{width:auto}.dashboard-main{padding:var(--space-4)}.dashboard-header h2{font-size:var(--font-size-xl)}.placeholder-content{padding:var(--space-4)}}@media (max-width: 480px){.nav-header{padding:var(--space-3)}.dashboard-title{font-size:var(--font-size-base)}.dashboard-main{padding:var(--space-3)}.dashboard-header h2{font-size:var(--font-size-lg)}.feature-list li{font-size:var(--font-size-sm);padding:var(--space-2) var(--space-3)}}*{margin:0;padding:0;box-sizing:border-box}:root{--color-bg-base: #1a1a1a;--color-bg-surface: #2d2d2d;--color-accent: #10b981;--color-accent-dark: #059669;--color-text-primary: #f5f5f5;--color-text-secondary: #a3a3a3;--color-text-muted: #888888;--color-border: #3d3d3d;--color-error: #ef4444;--color-success: #10b981;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;--font-size-sm: 12px;--font-size-base: 14px;--font-size-lg: 16px;--font-size-xl: 20px;--font-size-2xl: 28px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-6: 24px;--space-8: 32px}html,body,#root{height:100%;width:100%}body{font-family:var(--font-family);background-color:var(--color-bg-base);color:var(--color-text-primary);line-height:1.5}input,button,select,textarea{font-family:inherit;font-size:inherit}button{cursor:pointer;border:none;padding:0;background:none}input,textarea{background-color:var(--color-bg-surface);border:1px solid var(--color-border);color:var(--color-text-primary);padding:var(--space-3) var(--space-4);border-radius:4px;transition:border-color .15s ease-out,box-shadow .15s ease-out}input::placeholder,textarea::placeholder{color:var(--color-text-muted)}input:focus,textarea:focus{outline:none;border-color:var(--color-accent);box-shadow:0 0 0 2px #10b98133}@media (prefers-reduced-motion: no-preference){*:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}