.app-container{width:100%;display:flex;flex-direction:column;gap:2rem;padding:1rem}.header{text-align:center;margin-bottom:1rem}.header-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding:.5rem 1rem;background:var(--surface-color);border-radius:12px;border:1px solid var(--border-color)}.login-card{padding:2.5rem;width:100%;max-width:400px;text-align:center;background:var(--surface-color);border:1px solid var(--border-color);border-radius:16px;box-shadow:var(--shadow-md)}.user-info{display:flex;align-items:center;gap:.5rem;font-size:.95rem}.user-avatar{background:var(--surface-color-hover);padding:.25rem;border-radius:50%}.btn-logout{background:transparent;color:var(--text-secondary);border:1px solid var(--border-color);padding:.4rem .8rem;border-radius:8px;font-size:.85rem;cursor:pointer;transition:all .2s ease}.btn-logout:hover{background:#ef44441a;color:#f87171;border-color:#ef44444d}.header h1{font-size:2.5rem;margin-bottom:.5rem}.header p{color:var(--text-secondary);font-size:1.1rem}.main-content{display:grid;grid-template-columns:1fr;gap:2rem}@media (min-width: 768px){.main-content{grid-template-columns:350px 1fr;align-items:start}}.task-form-card{padding:1.5rem}.task-form-card h2{margin-bottom:1.5rem;font-size:1.25rem;color:var(--text-primary)}.form-actions{margin-top:1.5rem;display:flex;justify-content:flex-end}.task-list-container{display:flex;flex-direction:column;gap:1rem}.task-list-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.task-list-header h2{font-size:1.25rem}.task-stats{font-size:.9rem;color:var(--text-secondary);background:var(--surface-color-hover);padding:.25rem .75rem;border-radius:20px}.empty-state{text-align:center;padding:3rem 1rem;color:var(--text-secondary);background:var(--surface-color-hover);border-radius:12px;border:1px dashed var(--border-color)}.task-tree{display:flex;flex-direction:column;gap:1rem}.task-node{display:flex;flex-direction:column}.task-children-container{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem;position:relative}.task-children-container:before{content:"";position:absolute;top:-.5rem;bottom:0;left:.75rem;width:2px;background-color:var(--border-color);opacity:.5;z-index:0}.task-item{padding:1rem 1.25rem;display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;transition:all .3s ease;position:relative;overflow:hidden;z-index:1}.task-item:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background-color:var(--status-color, var(--primary-color));transition:all .3s ease}.task-item:hover{transform:translate(4px);background:var(--surface-color-hover)}.task-content-wrapper{display:flex;align-items:flex-start;gap:.75rem;flex:1}.btn-collapse{background:transparent;border:none;color:var(--text-secondary);cursor:pointer;padding:.25rem;margin-top:.1rem;display:flex;align-items:center;justify-content:center;border-radius:4px}.btn-collapse:hover{color:var(--text-primary);background:var(--surface-color-hover)}.task-content{flex:1}.task-title{font-weight:600;font-size:1.1rem;margin-bottom:.25rem;color:var(--text-primary)}.task-desc{font-size:.9rem;color:var(--text-secondary);margin-bottom:.75rem;line-height:1.4}.task-meta{display:flex;gap:1rem;font-size:.8rem;flex-wrap:wrap}.task-date,.task-author{color:var(--text-secondary);display:flex;align-items:center;gap:.3rem;background:#ffffff0d;padding:.15rem .5rem;border-radius:4px}.task-date svg,.task-author svg{opacity:.7}.task-author{color:#a78bfa}.task-status{padding:.15rem .5rem;border-radius:4px;font-weight:500;background:#ffffff1a;color:var(--status-color, var(--text-primary))}.task-actions{display:flex;gap:.5rem}.btn-icon{background:#ffffff0d;border:1px solid var(--border-color);color:var(--text-secondary);width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.btn-icon:hover{background:var(--surface-color-hover);color:var(--text-primary);transform:scale(1.05)}.btn-icon.active{background:#6366f133;color:#818cf8;border-color:#6366f14d}.btn-icon.comments{position:relative}.comment-count{position:absolute;top:-5px;right:-5px;background:var(--primary-color);color:#fff;font-size:.65rem;font-weight:700;padding:.1rem .35rem;border-radius:10px}.btn-icon.delete:hover{background:#ef444433;color:#f87171;border-color:#ef44444d}.btn-icon.complete:hover{background:#10b98133;color:#34d399;border-color:#10b9814d}.btn-icon.add-subtask:hover{background:#6366f133;color:#818cf8;border-color:#6366f14d}.task-status-select{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;border-radius:6px;padding:.25rem 1.5rem .25rem .75rem;color:#fff;font-weight:600;font-size:.8rem;font-family:var(--font-body);cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='white'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;background-size:.8rem;outline:none}.task-status-select option{background-color:var(--surface-color);color:var(--text-primary)}.comments-panel{background:var(--surface-color-hover);border:1px solid var(--border-color);border-radius:12px;padding:1rem;margin-top:.5rem;margin-bottom:1rem}.comments-list{display:flex;flex-direction:column;gap:.75rem;margin-bottom:1rem;max-height:250px;overflow-y:auto}.no-comments{color:var(--text-secondary);font-size:.9rem;text-align:center;font-style:italic}.comment-bubble{background:var(--surface-color);border:1px solid var(--border-color);padding:.75rem 1rem;border-radius:0 12px 12px}.comment-header{display:flex;justify-content:space-between;margin-bottom:.25rem;font-size:.8rem}.comment-header strong{color:#a78bfa}.comment-header span{color:var(--text-secondary);font-size:.75rem}.comment-bubble p{font-size:.9rem;color:var(--text-primary);line-height:1.4}.comment-form{display:flex;gap:.5rem}.comment-form .form-control,.comment-form .btn{padding:.5rem 1rem}.task-form-inline{padding:1rem;border:1px solid var(--primary-glow);background:#6366f10d;animation:slideIn .2s ease-out}.form-inline-layout{display:flex;flex-wrap:wrap;align-items:flex-end;gap:1rem}.form-inline-layout .input-group{margin-bottom:0;flex:1;min-width:200px}.form-inline-layout .form-actions{margin-top:0}.login-wrapper{display:flex;justify-content:center;align-items:center;min-height:80vh;width:100%}.login-card{width:100%;max-width:400px;padding:2.5rem}.login-header{text-align:center;margin-bottom:2rem}.login-header h2{font-size:1.8rem;margin-bottom:.5rem;color:var(--text-primary)}.login-header p{color:var(--text-secondary);font-size:.95rem}.login-form{display:flex;flex-direction:column;gap:1rem}.login-btn{margin-top:1rem;width:100%;padding:1rem;font-size:1rem}.login-footer{margin-top:1.5rem;text-align:center;font-size:.9rem;color:var(--text-secondary)}.btn-link{background:none;border:none;color:var(--primary-color);font-weight:600;cursor:pointer;padding:0;margin-left:.5rem;font-family:inherit}.btn-link:hover{text-decoration:underline;color:var(--secondary-color)}.error-message{color:#f87171;background:#ef44441a;border:1px solid rgba(239,68,68,.2);padding:.75rem;border-radius:8px;font-size:.85rem;text-align:center}.view-tabs{display:flex;justify-content:center;gap:1rem;margin-top:1.5rem;flex-wrap:wrap}.tab-btn{background:#0003;border:1px solid var(--border-color);color:var(--text-secondary);padding:.75rem 1.5rem;border-radius:8px;font-family:var(--font-body);font-weight:500;cursor:pointer;display:flex;align-items:center;gap:.5rem;transition:all .2s ease}.tab-btn:hover{background:#ffffff0d;color:var(--text-primary)}.tab-btn.active{background:var(--primary-glow);color:var(--primary-color);border-color:var(--primary-color);box-shadow:0 0 15px #01d47733}.table-responsive{width:100%;overflow-x:auto}.summary-table{width:100%;border-collapse:collapse;font-size:.95rem;text-align:left}.summary-table th,.summary-table td{padding:1rem;border-bottom:1px solid var(--border-color)}.summary-table th{color:var(--text-secondary);font-weight:600;text-transform:uppercase;font-size:.8rem;letter-spacing:.05em}.summary-table tr:hover{background:#ffffff05}.badge-status{padding:.25rem .6rem;border-radius:4px;color:#fff;font-size:.8rem;font-weight:600}.badge-user{background:#a78bfa33;color:#c4b5fd;padding:.25rem .6rem;border-radius:20px;font-size:.85rem;font-weight:500}.badge-level{font-size:.8rem;padding:.2rem .5rem;border-radius:4px;border:1px solid var(--border-color);color:var(--text-secondary)}.badge-level.principal{background:#ffffff0d;color:var(--text-primary)}.form-row{display:flex;gap:1rem}@media (max-width: 768px){body{padding:.5rem}.app-container{padding:.25rem;gap:1rem}.header h1{font-size:1.8rem}.header-top{flex-direction:column;gap:1rem;align-items:center}.view-tabs{flex-wrap:nowrap;overflow-x:auto;justify-content:flex-start;padding-bottom:.5rem;-webkit-overflow-scrolling:touch;scrollbar-width:none}.view-tabs::-webkit-scrollbar{display:none}.tab-btn{white-space:nowrap;padding:.5rem 1rem;font-size:.85rem}.task-item{flex-direction:column;align-items:stretch;padding:.75rem;gap:.75rem}.task-content-wrapper{flex-direction:column;gap:.5rem}.task-meta{flex-direction:column;align-items:flex-start;gap:.5rem}.task-actions{width:100%;justify-content:space-around;padding-top:.5rem;border-top:1px solid var(--border-color)}.form-row{flex-direction:column;gap:0}.form-actions{flex-direction:column}.form-inline-layout{flex-direction:column;align-items:stretch}.form-inline-layout>div{width:100%}.btn{width:100%;justify-content:center}.comments-panel,.task-children-container{margin-left:.5rem!important}}