:root{--color-navy: #202451;--color-dark-teal: #00425F;--color-teal: #2F6C81;--color-gold: #DAB177;--color-bg-main: #FFFFFF;--color-bg-secondary: #F8F9FA;--color-bg-card: #FFFFFF;--color-border-light: #E5E7EB;--color-border-accent: var(--color-teal);--color-primary: var(--color-dark-teal);--color-secondary: var(--color-gold);--color-accent: var(--color-teal);--color-text-dark: #1F2937;--color-text-medium: #4B5563;--color-text-muted: #6B7280;--space-xs: .5rem;--space-sm: 1rem;--space-md: 2rem;--space-lg: 4rem;--space-xl: 8rem;--font-main: "Outfit", sans-serif;--text-xs: .875rem;--text-sm: 1rem;--text-md: 1.25rem;--text-lg: 2rem;--text-xl: 3.5rem;--text-xxl: 5rem;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1);--transition-fast: .2s ease;--transition-smooth: .4s cubic-bezier(.25, .46, .45, .94)}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;max-width:100vw;height:100vh;overflow:hidden}body{font-family:var(--font-main);background-color:var(--color-bg-secondary);color:var(--color-text-dark);line-height:1.6;-webkit-font-smoothing:antialiased}#app{height:100%;display:flex;flex-direction:row}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;transition:margin-left .3s ease}.main-content.expanded{margin-left:0}a{text-decoration:none;color:inherit}button{border:none;background:none;font-family:inherit;cursor:pointer}.container{max-width:1200px;margin:0 auto;padding:0 var(--space-sm)}.glass-panel{background:var(--color-bg-card);border:1px solid var(--color-border-light);border-radius:12px;box-shadow:var(--shadow-sm)}.text-gradient{background:linear-gradient(135deg,var(--color-primary),var(--color-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.btn-primary{background:var(--color-primary);color:#fff;padding:.8rem 2rem;border-radius:8px;font-weight:600;font-size:var(--text-sm);transition:var(--transition-fast);box-shadow:var(--shadow-md);border:none}.btn-primary:hover{background:var(--color-dark-teal);transform:translateY(-1px);box-shadow:var(--shadow-lg)}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}.animate-float{animation:float 6s ease-in-out infinite}.sidebar{width:fit-content;min-width:200px;background:var(--color-bg-card);border-right:2px solid var(--color-border-light);display:flex;flex-direction:column;transition:width .3s ease,min-width .3s ease;flex-shrink:0;overflow:hidden;white-space:nowrap}.sidebar.collapsed{width:60px;min-width:60px}.sidebar-header{padding:1rem;border-bottom:2px solid var(--color-border-light);display:flex;justify-content:space-between;align-items:center;background:var(--color-primary);color:#fff;flex-shrink:0}.logo-section{display:flex;align-items:center;gap:.75rem;overflow:hidden}.sidebar-icon{width:32px;height:32px;flex-shrink:0}.logo-text{font-size:1.25rem;font-weight:700;white-space:nowrap;transition:opacity .3s ease;color:var(--color-gold)}.sidebar.collapsed .logo-text{opacity:0;width:0}.sidebar-toggle-btn{background:transparent;border:1px solid rgba(255,255,255,.3);color:#fff;width:28px;height:28px;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease;flex-shrink:0}.sidebar-toggle-btn:hover{background:#ffffff1a}.sidebar.collapsed .toggle-icon{transform:rotate(180deg)}.toggle-icon{transition:transform .3s ease;font-size:.75rem}.sidebar-nav{flex:1;overflow-y:auto;overflow-x:hidden;padding:.5rem 0}.menu-item-wrapper{width:100%}.menu-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;cursor:pointer;transition:background .2s ease;color:var(--color-text-dark);font-size:.9rem;white-space:nowrap;-webkit-user-select:none;user-select:none}.sidebar.collapsed .menu-item{justify-content:center;padding:.75rem .5rem;gap:0}.menu-item:hover{background:var(--color-bg-secondary)}.expand-icon{font-size:.7rem;color:var(--color-text-muted);flex-shrink:0;width:12px;transition:transform .2s ease}.expand-icon-placeholder{width:12px;flex-shrink:0}.menu-icon{font-size:1.1rem;flex-shrink:0}.menu-label{flex:1;transition:opacity .3s ease}.sidebar.collapsed .menu-label,.sidebar.collapsed .expand-icon,.sidebar.collapsed .expand-icon-placeholder{display:none}.submenu{background:#00000005}.submenu .menu-item{font-size:.85rem}.tree-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--color-border-light)}.header-actions{display:flex;gap:.5rem}.tree-wrapper{flex:1;display:flex;flex-direction:column;gap:.5rem;overflow-y:auto;padding-right:5px}@media print{body *{visibility:hidden}#tree-manager,#tree-manager *{visibility:visible}#tree-manager{position:absolute;left:0;top:0;width:100%;height:auto!important;overflow:visible!important;background:#fff!important;color:#000!important;box-shadow:none!important;border:none!important;margin:0!important;padding:0!important}.tree-header button,.node-actions,.node-toggle,.sidebar,.sidebar-toggle-btn,#theme-toggle{display:none!important}.tree-node-content{border:none!important;padding-left:0!important}.tree-node{page-break-inside:avoid}.tree-node{border-left:1px solid #ccc}}.tree-node{display:flex;flex-direction:column}.tree-node-content{display:flex;align-items:center;padding:.32rem .5rem;border-radius:6px;cursor:grab;transition:all .2s ease;border:1px solid transparent}.tree-node-content:hover{background:#dab17780!important;border-color:var(--color-gold)!important;transform:translate(5px)}.tree-node-content:hover .node-label,.tree-node-content:hover .node-icon,.tree-node-content:hover .node-toggle{color:var(--color-navy)}.tree-node-content.row-even{background-color:#f3f4f6}.tree-node-content.row-odd{background-color:#fff}.tree-node-content.dragging{opacity:.5;background:var(--color-bg-secondary);border:1px dashed var(--color-primary)}.tree-node-content.drag-over{background:#2f6c811a;border:1px dashed var(--color-teal)}.drag-over-root{background:#2f6c810d;border:2px dashed var(--color-teal);border-radius:8px}.node-toggle{width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--color-text-muted);font-size:.8rem;-webkit-user-select:none;user-select:none}.node-toggle:hover{color:var(--color-primary)}.node-icon{margin-right:.5rem;font-size:1.2rem}.node-label{flex:1;font-weight:500;color:var(--color-text-dark)}.node-actions{display:flex;gap:.25rem;opacity:0;transition:opacity .2s ease}.tree-node-content:hover .node-actions{opacity:1}.node-actions button{padding:4px;border-radius:4px;font-size:.9rem;color:var(--color-text-medium)}.node-actions button:hover{background:#0000000d;color:var(--color-primary)}.node-actions button.btn-delete:hover{color:#ef4444;background:#ef44441a}.node-actions button.btn-reactivate:hover{color:#10b981;background:#10b9811a}.tree-node-content.inactive{opacity:.6;filter:grayscale(100%)}.tree-node-content.inactive .node-label{font-style:italic;color:var(--color-text-muted)}.tree-children{display:flex;flex-direction:column;gap:.25rem;margin-top:.25rem;border-left:1px solid var(--color-border-light);margin-left:11px!important;padding-left:.5rem}.empty-state{text-align:center;padding:3rem;color:var(--color-text-muted);font-style:italic}.hero-logo{max-width:250px;height:auto;margin-bottom:2rem;filter:drop-shadow(0 4px 6px rgba(0,0,0,.1))}.footer-logo{height:24px;width:auto;opacity:.8}body.dark-mode{--color-bg-main: #111827;--color-bg-secondary: #1F2937;--color-bg-card: #374151;--color-border-light: #4B5563;--color-text-dark: #F9FAFB;--color-text-medium: #D1D5DB;--color-text-muted: #9CA3AF;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4)}.logo-light{display:block}.logo-dark{display:none}.auth-container{display:flex;justify-content:center;align-items:center;height:100vh;width:100%;background-color:var(--color-background)}.auth-header-title{margin-bottom:1rem}.auth-box{background:var(--color-surface);padding:1rem;border-radius:12px;box-shadow:var(--shadow-lg);width:100%;max-width:380px;text-align:center;border:2px solid #E5E7EB}.auth-footer-logo{margin-top:.5rem;display:flex;justify-content:center;align-items:center;width:100%}.auth-logo-bottom{height:24px;opacity:.8}.auth-box h2{margin-bottom:.5rem;font-size:1.25rem;color:var(--color-teal)}.form-group{margin-bottom:.5rem;text-align:left}.form-group label{display:block;margin-bottom:.25rem;color:var(--color-text-medium);font-size:.85rem;font-weight:500}.form-group input,.form-group select{width:100%;padding:.75rem;border:2px solid #E5E7EB;border-radius:8px;background:var(--color-background);color:var(--color-text);transition:all .3s ease;font-size:1rem;font-family:inherit}.form-group input{padding-right:2.5rem}.password-wrapper{position:relative;display:flex;align-items:center}.toggle-password{position:absolute;right:10px;background:none;border:none;cursor:pointer;font-size:1.2rem;color:var(--color-text-medium);padding:0;display:flex;align-items:center;justify-content:center;height:100%}.toggle-password:hover{color:var(--color-primary)}.form-group input:hover,.form-group select:hover{border-color:#b0b0b0;background-color:#f9fafb}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #00425f1a}.input-success{border-color:#10b981!important;background-color:#ecfdf5!important}.input-error{border-color:#ef4444!important;background-color:#fef2f2!important}.full-width{width:100%;margin-top:.5rem}.auth-link{margin-top:.5rem;font-size:.85rem;color:var(--color-text-medium)}.auth-link a{color:var(--color-primary);text-decoration:none;font-weight:600}.project-list{display:grid;gap:1rem}.project-card{background:var(--color-background);padding:1.5rem;border-radius:var(--radius-md);border:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center;transition:all .2s}.project-card:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.project-card.active{border-color:var(--color-primary);background:#00425f0d}.project-info h3{margin:0 0 .5rem;color:var(--color-text)}.project-info p{margin:0;color:var(--color-text-medium);font-size:.9rem}.project-actions{display:flex;gap:.5rem}body.dark-mode .logo-light{display:none}#custom-dialog-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9999}.dialog-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;pointer-events:auto;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);transition:opacity .2s ease}.dialog-box{background:var(--color-bg-card);border-radius:12px;box-shadow:var(--shadow-lg);width:90%;max-width:400px;padding:1.5rem;border:1px solid var(--color-border-light);display:flex;flex-direction:column;gap:1rem}.dialog-header h3{margin:0;color:var(--color-primary);font-size:1.2rem}.dialog-body p{margin:0;color:var(--color-text-dark)}.dialog-input{width:100%;padding:.5rem;border:1px solid var(--color-border-light);border-radius:6px;margin-top:.5rem;font-family:inherit;background:var(--color-bg-secondary);color:var(--color-text-dark)}.dialog-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #2f6c8133}.dialog-footer{display:flex;justify-content:flex-end;gap:.5rem;margin-top:.5rem}.btn-secondary{background:transparent;border:1px solid var(--color-border-light);padding:.5rem 1rem;border-radius:6px;color:var(--color-text-medium);font-weight:500;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:var(--color-bg-secondary);color:var(--color-text-dark)}.animate-float-in{animation:floatIn .2s ease-out forwards}.animate-float-out{animation:floatOut .2s ease-in forwards}.fade-out{opacity:0}@keyframes floatIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes floatOut{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(20px) scale(.95)}}.account-modal{background:var(--color-bg-card);border-radius:16px;box-shadow:var(--shadow-lg);width:900px;max-width:95vw;padding:0;border:1px solid var(--color-border-light);display:flex;flex-direction:column;overflow:hidden}.account-modal-header{background:linear-gradient(135deg,var(--color-primary),var(--color-accent));color:#fff;padding:1.5rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--color-border-light)}.account-modal-header h3{margin:0;font-size:1.3rem;font-weight:600}.modal-close-btn{background:#fff3;border:none;color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;transition:all .2s}.modal-close-btn:hover{background:#ffffff4d;transform:rotate(90deg)}.account-modal-body{padding:2rem;max-height:60vh;overflow-y:auto;overflow-x:hidden}.form-grid{display:flex;flex-direction:column;gap:1rem}.form-grid .full-width{grid-column:1 / -1}.form-group{display:flex;flex-direction:column}.form-group label{font-weight:500;margin-bottom:.5rem;color:var(--color-text-dark);font-size:.8rem}.required{color:#ef4444;margin-left:.25rem}.form-input{width:100%;padding:.75rem;border:2px solid var(--color-border-light);border-radius:8px;background:var(--color-bg-secondary);color:var(--color-text-dark);font-family:inherit;font-size:.85rem;transition:all .2s}.form-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #00425f1a;background:var(--color-bg-card)}.form-input:hover{border-color:var(--color-accent)}textarea.form-input{resize:vertical;min-height:80px}select.form-input{cursor:pointer}.checkbox-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.account-modal-footer{padding:1.5rem;background:var(--color-bg-secondary);border-top:1px solid var(--color-border-light);display:flex;justify-content:flex-end;gap:1rem}.account-modal-footer .btn-primary,.account-modal-footer .btn-secondary{padding:.75rem 1.5rem;font-size:.95rem}.badge-active,.badge-inactive{display:inline-block;padding:.35rem .75rem;border-radius:12px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.badge-active{background:#d1fae5;color:#065f46;border:1px solid #10B981}.badge-inactive{background:#fee2e2;color:#991b1b;border:1px solid #EF4444}.badge-master{background:#fef3c7;color:#92400e;font-weight:600;border:1px solid #F59E0B;display:inline-block;padding:.35rem .75rem;border-radius:12px;font-size:.8rem;text-transform:uppercase;letter-spacing:.5px}.badge-user{background:#dbeafe;color:#1e40af;border:1px solid #3B82F6;display:inline-block;padding:.35rem .75rem;border-radius:12px;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.account-type-badge{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .75rem;background:var(--color-bg-secondary);border:1px solid var(--color-border-light);border-radius:8px;font-size:.85rem;font-weight:500;white-space:nowrap}@keyframes slideInRight{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOutRight{0%{transform:translate(0);opacity:1}to{transform:translate(400px);opacity:0}}body.dark-mode .account-modal{background:var(--color-bg-card);border-color:var(--color-border-light)}body.dark-mode .form-input{background:var(--color-bg-secondary);color:var(--color-text-dark);border-color:var(--color-border-light)}body.dark-mode .form-input:focus{background:var(--color-bg-card)}body.dark-mode .account-type-badge{background:var(--color-bg-main);border-color:var(--color-border-light)}body.dark-mode .badge-active{background:#10b98133;color:#6ee7b7;border-color:#10b981}body.dark-mode .badge-inactive{background:#ef444433;color:#fca5a5;border-color:#ef4444}.sticky-header{position:sticky;top:0;z-index:10;background-color:var(--color-primary);color:#fff;border-bottom:2px solid var(--color-border-light)}.sticky-header th{color:#fff;font-weight:600;font-size:.85rem;position:relative}.header-content{display:flex;align-items:center;justify-content:space-between;gap:4px;width:100%;cursor:pointer;-webkit-user-select:none;user-select:none}.header-content:hover .filter-icon{opacity:1}.header-content.align-center{justify-content:center}.header-content.align-right{justify-content:flex-end}.header-content.align-left{justify-content:space-between}.filter-icon{opacity:.5;min-width:14px;width:14px;height:14px;transition:opacity .2s;color:#fffc}.filter-icon:hover{color:#fff}.filter-icon.active{opacity:1;color:var(--color-gold)}.filter-dropdown{position:absolute;top:100%;right:0;margin-top:4px;background:#fff;border:1px solid var(--color-border-light);border-radius:6px;box-shadow:var(--shadow-lg);z-index:1000;width:280px;font-size:.85rem;color:var(--color-text-dark);display:flex;flex-direction:column;max-height:480px;text-align:left;font-weight:400}.filter-search{padding:8px;border-bottom:1px solid var(--color-border-light)}.filter-search input{width:100%;padding:8px;border:1px solid var(--color-border-light);border-radius:4px;outline:none;font-size:.8rem}.filter-search input:focus{border-color:var(--color-primary)}.filter-list{flex:1;overflow-y:auto;overflow-x:hidden;padding:4px 0;max-height:300px}.filter-item{padding:6px 12px;display:flex;align-items:center;gap:8px;cursor:pointer;transition:background .1s;font-size:.85rem}.filter-item:hover{background:var(--color-bg-secondary)}.filter-item input[type=checkbox]{cursor:pointer;width:16px;height:16px;accent-color:var(--color-primary)}.filter-actions{padding:8px 12px;border-top:1px solid var(--color-border-light);display:flex;justify-content:flex-end;gap:8px;background:#fafafa;border-radius:0 0 6px 6px}.filter-btn{padding:6px 14px;border-radius:4px;font-size:.8rem;border:1px solid var(--color-border-light);background:#fff;cursor:pointer;font-weight:500;transition:all .2s}.filter-btn:hover{background:#f3f4f6}.filter-btn.primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.filter-btn.primary:hover{background:#1e3a4c}.filter-list::-webkit-scrollbar{width:6px}.filter-list::-webkit-scrollbar-track{background:transparent}.filter-list::-webkit-scrollbar-thumb{background:#ddd;border-radius:3px}