*{box-sizing:border-box;margin:0;padding:0}body{background-color:#111;color:#eee;font-family:Inter,sans-serif;line-height:1.6;padding:2rem}h1,h2{color:#fff;margin-bottom:1rem}form{padding:1rem;border-radius:12px;margin-bottom:2rem;margin-top:50px;display:flex;flex-direction:column;gap:.8rem;max-width:500px}input[type=text],input[type=file]{padding:.6rem;border:none;border-radius:8px}button{background-color:#6c47ff;color:#fff;padding:.7rem 1.2rem;border:none;border-radius:8px;cursor:pointer;transition:background .2s ease;font-weight:700}ul{list-style:none;margin-top:1rem;padding-left:0}li button{background:none;border:none;color:#88f0ff;font-size:1rem;padding:.5rem 0;text-align:left;cursor:pointer}li button:hover{text-decoration:underline}.waveform-container{background-color:#222;padding:1rem;border-radius:12px;margin-top:2rem}.comment-list{margin-top:1.5rem;background-color:#1a1a1a;padding:1rem;border-radius:10px}.comment-list li{margin-bottom:.8rem;border-bottom:1px solid #333;padding-bottom:.6rem}.comment-list strong{color:#6c47ff}@media (max-width: 600px){body{padding:1rem}form{width:100%}}.waveform{margin-top:1rem;margin-bottom:1rem;border-radius:8px;overflow:hidden;background:#1e1e1e;padding:.5rem;box-shadow:0 0 10px #0006;opacity:0;transition:opacity .7s cubic-bezier(.4,0,.2,1)}.waveform.visible{opacity:1}.region{opacity:.5}.controls{display:flex;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.controls button{padding:.6rem 1rem;background-color:#333;color:#eee;border:1px solid #555;border-radius:8px;cursor:pointer;transition:background .2s ease}.controls button:hover{background-color:#555}.waveform-wrapper{position:relative}.comment-float-btn{position:absolute;top:0;transform:translate(-50%,-110%);background-color:#6c47ff;color:#fff;border:none;border-radius:50%;padding:.3rem .5rem;cursor:pointer;font-size:1rem;z-index:10;transition:background .2s}.comment-float-btn:hover{background-color:#8a66ff}.comment-marker{font-size:1.2rem;transform:translateY(-5px)}ProjectList{width:30vw}.project-list{background-color:#1a1a1a;padding:1rem;border-radius:12px;margin-bottom:2rem}.Side-by-Side{display:flex;flex-direction:row;gap:2rem}.AppMain{display:flex;flex-direction:row;min-height:100vh}.RightMenu{width:90%;background:#111;box-shadow:0 0 12px #0000001f;padding:24px 16px;display:flex;flex-direction:column;gap:24px;position:fixed;right:0;top:0;height:100vh;overflow-y:auto;z-index:10;transition:transform .3s;border:1px solid grey;border-radius:10px;margin:10px 0}.RightMenu.folded{transform:translate(100%);box-shadow:none;padding:0}.MainContent{flex:1;margin-left:240px;margin-right:360px;margin-top:50px;padding:24px}.BurgerMenu{position:fixed;top:24px;right:24px;width:40px;height:40px;background:#fff;border:none;box-shadow:0 0 8px #0000001f;border-radius:8px;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:20;cursor:pointer}.BurgerMenu span{display:block;width:24px;height:3px;background:#333;margin:4px 0;border-radius:2px;color:#fff}.CloseMenu{position:absolute;top:16px;right:16px;background:none;border:none;font-size:2rem;cursor:pointer;z-index:20}.DeleteButton{background-color:#e33;color:#fff;cursor:pointer}.comment-controls-row{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.delete-confirm-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.3);display:flex;align-items:center;justify-content:center;z-index:100}.delete-confirm-content{background:#fff;padding:2rem;border-radius:8px;box-shadow:0 0 16px #0003;display:flex;flex-direction:column;gap:1rem;align-items:center;color:#111}.CloseMenu.left{position:absolute;top:16px;left:16px;background:none;border:none;font-size:2rem;cursor:pointer;z-index:30;text-align:left}.LeftMenu{position:fixed;left:0;top:0;width:220px;height:100vh;background:#111;box-shadow:0 0 12px #0000001f;padding:24px 16px 16px;z-index:20;display:flex;flex-direction:column;gap:24px;transition:transform .3s}.LeftMenu.folded{transform:translate(-100%);box-shadow:none;padding:0}.LeftMenu nav{display:flex;flex-direction:column;gap:1rem}.mentions-input{border-radius:10px;padding:5px;margin:0 20px;background:#1e1e1e;color:#eee}.conversation-list textarea{width:500px;height:100%;background:#1e1e1e;color:#eee;border:none;border-radius:8px;padding:.5rem;box-shadow:inset 0 0 10px #0006;margin:5px}.LeftMenu button.active{background:#6c47ff;color:#fff}.BurgerMenu.left{position:fixed;top:24px;left:24px;width:40px;height:40px;background:#fff;border:none;box-shadow:0 0 8px #0000001f;border-radius:8px;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:30;cursor:pointer}.BurgerMenu.left span{display:block;width:24px;height:3px;background:#333;margin:4px 0;border-radius:2px}nav{margin-top:50px}.waveform-loading{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:rgba(30,30,30,.7);z-index:10}.spinner{width:48px;height:48px;border:6px solid #eee;border-top:6px solid #6c47ff;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.login-form{max-width:340px;margin:80px auto;padding:2rem 2.5rem;background:#23233b;border-radius:12px;box-shadow:0 4px 32px #0000002e;display:flex;flex-direction:column;gap:1.2rem}.login-form input{padding:.7rem 1rem;border-radius:6px;border:1px solid #444;background:#181828;color:#fff;font-size:1rem}.login-form button{padding:.7rem 1rem;border-radius:6px;border:none;background:#6c47ff;color:#fff;font-weight:700;font-size:1rem;cursor:pointer;transition:background .2s}.login-form button:hover{background:#4b2fd6}.Personalprofil input{background-color:gray;color:#fff;padding:5px;border-radius:10px}.delete-confirm-backdrop{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(20,20,30,.55);z-index:1000}.delete-confirm-modal{position:fixed;left:50vw;top:50vh;width:300px;height:150px;background:#23233b;border:1px solid #444;border-radius:12px;padding:2rem 2.5rem;z-index:1001;box-shadow:0 8px 32px #00000040;color:#fff}.delete-confirm-modal button{margin-top:1rem;margin-right:1rem;padding:.5rem 1.2rem;border-radius:6px;border:none;background:#6c47ff;color:#fff;font-weight:700;cursor:pointer;transition:background .2s}.delete-confirm-modal button:last-child{background:#444;color:#fff}.delete-confirm-modal button:hover{background:#4b2fd6}@media (max-width: 768px){.MainContent{margin-left:0;margin-right:0;margin-top:50px;padding:16px}.RightMenu{width:100%;position:fixed;bottom:0;top:auto;left:0;right:0;height:auto;border-radius:12px 12px 0 0;box-shadow:none}.LeftMenu{width:100%;position:fixed;top:0;left:0;height:auto;border-radius:0 0 12px 12px;box-shadow:none}}:root{--radius-1: 6px;--radius-2: 10px;--radius-3: 14px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--border: #333;--bg-elev-1: #111;--bg-elev-2: #141414;--text-muted: #bbb}h1{margin:0 0 var(--space-4) 0;line-height:1.2}h2{margin:var(--space-4) 0 var(--space-3) 0;line-height:1.25}h3{margin:var(--space-3) 0 var(--space-2) 0;line-height:1.3}h4,h5,h6{margin:var(--space-3) 0 var(--space-2) 0;line-height:1.35}p{margin:0 0 var(--space-3) 0}a{color:#88f0ff;text-decoration:none}a:hover{text-decoration:underline}input:not([type=checkbox]):not([type=radio]),select,textarea{background:#1b1b1b;color:#eee;border:1px solid var(--border);border-radius:var(--radius-2);padding:10px 12px}textarea{resize:vertical}input:focus,select:focus,textarea:focus{outline:none;border-color:#6c47ff;box-shadow:0 0 0 2px #6c47ff40}button{border-radius:var(--radius-2)}button[disabled]{opacity:.7;cursor:not-allowed}.Card{background:var(--bg-elev-2);border:1px solid var(--border);border-radius:var(--radius-2);padding:var(--space-4)}.Panel{background:var(--bg-elev-1);border:1px solid var(--border);border-radius:var(--radius-3);padding:var(--space-4)}img{max-width:100%;height:auto;display:block}video{max-width:100%;display:block;border-radius:var(--radius-2)}audio{width:100%;display:block}.stack>*+*{margin-top:var(--space-3)}.conversation-list{width:100%;margin:0 auto;padding:0 1rem}.conversation-box{background:#222;border-radius:8px;margin-bottom:1rem;padding:.7rem;word-break:break-word}.conversation-box>div{display:flex;flex-wrap:wrap;align-items:flex-start;gap:.5rem}.conversation-box strong,.conversation-box span{font-size:1rem}.createButton{display:block;background-color:#85dd11;color:#00f;border:none;padding:.5rem 1rem;border-radius:4px;cursor:pointer}@media (max-width: 600px){.conversation-list{padding:0 .2rem}.conversation-box>div{flex-direction:column;align-items:flex-start;gap:.3rem}.conversation-box strong,.conversation-box span{font-size:.95rem;word-break:break-word}.conversation-box button{font-size:1rem;padding:.3rem .6rem}.DeleteButton,.createButton{display:none}}.waveform-controls{margin-bottom:1rem}.delete-button-style{margin-left:auto}.todo-list-container{background:#222;color:#eee;border-radius:12px;padding:24px;margin-bottom:30px;box-shadow:0 4px 12px #0000004d;border:1px solid #333}.todo-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:15px;border-bottom:1px solid #333;padding-bottom:16px}.todo-header h3{margin:0;color:#fff;font-size:1.25rem;font-weight:600}.todo-filters{display:flex;gap:8px;flex-wrap:wrap}.todo-filters button{padding:8px 16px;border:1px solid #555;background:#333;color:#eee;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease}.todo-filters button:hover{background:#444;border-color:#6c47ff;transform:translateY(-1px)}.todo-filters button.active{background:#6c47ff;color:#fff;border-color:#6c47ff;box-shadow:0 2px 8px #6c47ff4d}.todos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.todo-card{background:#1a1a1a;border-radius:12px;padding:20px;border-left:4px solid #555;box-shadow:0 4px 12px #0003;transition:all .3s ease;border:1px solid #333}.todo-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000004d;border-color:#444}.todo-card.pending{border-left-color:#ffc107;background:linear-gradient(135deg,#1a1a1a 0%,#2a2a1a 100%)}.todo-card.in-progress{border-left-color:#17a2b8;background:linear-gradient(135deg,#1a1a1a 0%,#1a2a2a 100%)}.todo-card.completed{border-left-color:#28a745;background:linear-gradient(135deg,#1a1a1a 0%,#1a2a1a 100%);opacity:.8}.todo-card.clickable{cursor:pointer;transition:all .3s ease}.todo-card.clickable:hover{transform:translateY(-4px);box-shadow:0 8px 24px #6c47ff4d;border-color:#6c47ff}.todo-card.clickable:active{transform:translateY(-2px);transition:all .1s ease}.todo-title-row{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px;gap:12px}.todo-card h4{margin:0;color:#fff;font-size:16px;font-weight:600;flex:1;line-height:1.3}.priority-indicator{color:#fff;padding:4px 8px;border-radius:12px;font-size:11px;font-weight:700;text-transform:uppercase;box-shadow:0 2px 4px #0003}.priority-indicator.high{background:linear-gradient(135deg,#dc3545,#c82333)}.priority-indicator.medium{background:linear-gradient(135deg,#ffc107,#e0a800)}.priority-indicator.low{background:linear-gradient(135deg,#28a745,#1e7e34)}.todo-description{color:#ccc;margin:12px 0;font-size:14px;line-height:1.5;background:#333;padding:12px;border-radius:8px;border-left:3px solid #6c47ff}.todo-meta{display:flex;flex-direction:column;gap:6px;margin:16px 0;font-size:13px;color:#aaa}.project-name{font-weight:600;color:#6c47ff;background:rgba(108,71,255,.1);padding:4px 8px;border-radius:6px;display:inline-block;width:fit-content;font-size:.85rem}.todo-actions{display:flex;justify-content:space-between;align-items:center;margin-top:16px;padding-top:16px;border-top:1px solid #333;z-index:10;position:relative}.status-select{padding:8px 12px;border:1px solid #555;border-radius:8px;background:#333;background-color:#333!important;color:#eee;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.todo-loading{text-align:center;padding:60px;color:#aaa;font-size:16px}.todo-loading:before{content:"⏳";display:block;font-size:48px;margin-bottom:16px}.no-todos{grid-column:1 / -1;text-align:center;padding:60px 40px;color:#aaa;background:#1a1a1a;border-radius:12px;border:2px dashed #444;font-size:16px}@media (max-width: 768px){.todo-list-container{padding:16px;margin-bottom:20px}.todo-header{flex-direction:column;align-items:stretch;gap:12px}.todo-filters{justify-content:center}.todos-grid{grid-template-columns:1fr;gap:16px}.todo-card{padding:16px}.todo-title-row{flex-direction:column;gap:8px}.priority-indicator{align-self:flex-start}}.modal-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(20,20,30,.8);display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#222;border:1px solid #444;border-radius:12px;width:90%;max-width:600px;max-height:90vh;overflow-y:auto;box-shadow:0 8px 32px #0006}.todo-form{padding:2rem}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:1px solid #333}.modal-header h3{margin:0;color:#fff;font-size:1.2rem;font-weight:600}.close-btn{background:#333;border:1px solid #555;color:#ccc;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease}.form-section{margin-bottom:1.25rem}.form-section.half{flex:1}.form-label{display:block;color:#ccc;font-weight:500;margin-bottom:.5rem;font-size:.9rem}.form-label.small{font-size:.8rem;margin-bottom:.75rem;color:#aaa}.form-input,.form-textarea,.form-select{width:100%;padding:10px 12px;border:1px solid #555;border-radius:6px;background:#333;color:#eee;font-size:.9rem;transition:all .2s ease}.form-input:focus,.form-textarea:focus,.form-select:focus{outline:none;border-color:#6c47ff;box-shadow:0 0 0 2px #6c47ff33}.form-textarea{resize:vertical;min-height:80px}.form-row{display:flex;gap:1rem}.user-assignment{display:flex;flex-direction:column;gap:8px;max-height:120px;overflow-y:auto;padding:12px;border:1px solid #444;border-radius:6px;background:#1a1a1a}.user-checkbox{display:flex;align-items:center;gap:8px;cursor:pointer;padding:6px 8px;border-radius:4px;transition:background-color .2s}.user-checkbox:hover{background:rgba(108,71,255,.2)}.checkbox-container{display:flex;align-items:center;gap:.75rem;cursor:pointer;padding:8px;border-radius:6px;background:#1a1a1a;border:1px solid #333;transition:all .2s}.checkbox-container:hover{background:#2a2a2a;border-color:#6c47ff}.checkbox-input{display:none}.checkbox-custom{width:18px;height:18px;border:2px solid #555;border-radius:3px;background:#333;position:relative;transition:all .2s ease}.checkbox-input:checked+.checkbox-custom{background:#6c47ff;border-color:#6c47ff}.checkbox-input:checked+.checkbox-custom:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-weight:700;font-size:12px}.checkbox-text,.user-name{color:#ccc;font-size:.9rem}.marker-color-section{margin-top:1rem;padding:1rem;background:#1a1a1a;border-radius:6px;border:1px solid #333}.color-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;max-width:200px}.color-button{width:35px;height:35px;border:2px solid #555;border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.3)}.color-button:hover{transform:scale(1.05);border-color:#6c47ff}.color-button.selected{border-color:#6c47ff;transform:scale(1.05);box-shadow:0 0 0 2px #6c47ff4d}.modal-actions{display:flex;gap:.75rem;margin-top:1.5rem;padding-top:1rem;border-top:1px solid #333}.submit-btn{flex:1;padding:12px 20px;background:#6c47ff;color:#fff;border:none;border-radius:8px;font-weight:500;cursor:pointer;transition:all .2s ease}.submit-btn:hover{background:#8a66ff;transform:translateY(-1px)}.cancel-btn{padding:12px 20px;background:#333;color:#ccc;border:1px solid #555;border-radius:8px;cursor:pointer;transition:all .2s ease}.cancel-btn:hover{background:#444;color:#fff;border-color:#666}@media (max-width: 768px){.form-row{flex-direction:column}.color-grid{grid-template-columns:repeat(auto-fit,minmax(30px,1fr))}}.todo-manager{background:#222;border-radius:12px;padding:20px;margin:20px 0;border:1px solid #333;color:#eee}.todo-manager.enhanced{border:1px solid #333;box-shadow:0 4px 12px #0000004d}.todo-manager-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #333}.todo-manager-header h4{margin:0;color:#fff;font-size:1.25rem;font-weight:600}.add-todo-btn{background:#6c47ff;color:#fff;border:none;padding:10px 18px;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease}.add-todo-btn:hover{background:#8a66ff;transform:translateY(-1px)}.add-todo-form{background:#1a1a1a;padding:20px;border-radius:8px;margin-bottom:20px;display:flex;flex-direction:column;gap:15px;border:1px solid #333}.add-todo-form.enhanced{background:linear-gradient(135deg,#1a1a1a 0%,#2a2a2a 100%);border:1px solid #444}.add-todo-form input,.add-todo-form textarea,.add-todo-form select{padding:12px;border:1px solid #555;border-radius:6px;font-size:14px;background:#333;color:#eee;transition:all .2s ease}.add-todo-form input:focus,.add-todo-form textarea:focus,.add-todo-form select:focus{outline:none;border-color:#6c47ff;box-shadow:0 0 0 2px #6c47ff33}.add-todo-form input::placeholder,.add-todo-form textarea::placeholder{color:#999}.add-todo-form textarea{resize:vertical;min-height:80px}.form-row{display:flex;gap:15px}.form-row>*{flex:1}.form-actions{display:flex;gap:12px;padding-top:16px;border-top:1px solid #333}.form-actions button{padding:12px 24px;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease}.form-actions button[type=submit]{background:#6c47ff;color:#fff;flex:1}.form-actions button[type=submit]:hover{background:#8a66ff}.form-actions button[type=button]{background:#333;color:#ccc;border:1px solid #555}.form-actions button[type=button]:hover{background:#444;color:#fff}.project-todos{display:flex;flex-direction:column;gap:16px}.project-todos.enhanced{margin-top:20px}.todos-grid{display:grid;gap:16px}.project-todo{display:flex;justify-content:space-between;align-items:flex-start;padding:20px;border-radius:8px;border-left:4px solid #555;background:#1a1a1a;border:1px solid #333}.project-todo.enhanced{background:#1a1a1a;border:1px solid #333;border-radius:12px;padding:20px;transition:all .3s ease;box-shadow:0 4px 12px #0003}.project-todo.enhanced:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0000004d;border-color:#6c47ff}.project-todo.pending{background:linear-gradient(135deg,#1a1a1a 0%,#2a2a1a 100%);border-left-color:#ffc107}.project-todo.in-progress{background:linear-gradient(135deg,#1a1a1a 0%,#1a2a2a 100%);border-left-color:#17a2b8}.project-todo.completed{background:linear-gradient(135deg,#1a1a1a 0%,#1a2a1a 100%);border-left-color:#28a745;opacity:.8}.todo-header{margin-bottom:16px}.todo-title-section{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}.todo-indicators{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.waveform-marker-btn{background:#ff6b6b;color:#fff;border:none;padding:6px 10px;border-radius:12px;font-size:11px;cursor:pointer;display:flex;align-items:center;gap:4px;transition:all .2s;font-weight:500}.waveform-marker-btn:hover{transform:scale(1.05);box-shadow:0 2px 4px #ff6b6b66}.todo-info{flex:1}.todo-info h5{margin:0 0 8px;color:#fff;font-size:16px;font-weight:600}.todo-info p{margin:0 0 10px;color:#ccc;font-size:14px}.todo-description{color:#ccc;font-size:14px;line-height:1.5;margin-bottom:16px;background:#333;padding:12px;border-radius:6px;border-left:3px solid #6c47ff}.todo-meta{display:flex;flex-direction:column;gap:6px;margin-bottom:16px;font-size:13px;color:#aaa}.created-date{color:#999;font-style:italic}.priority{padding:4px 10px;border-radius:12px;font-weight:700;color:#fff;font-size:11px;text-transform:uppercase;width:fit-content}.priority-high{background:linear-gradient(135deg,#dc3545,#c82333)}.priority-medium{background:linear-gradient(135deg,#ffc107,#e0a800);color:#333}.priority-low{background:linear-gradient(135deg,#28a745,#1e7e34)}.due-date{color:#ffc107;font-weight:500}.status-select{padding:8px 12px;border:1px solid #555;border-radius:6px;background:#333;color:#eee;font-size:13px;cursor:pointer;min-width:120px;transition:all .2s ease}.status-select:focus{outline:none;border-color:#6c47ff;box-shadow:0 0 0 2px #6c47ff33}.status-select:hover{background:#444;border-color:#6c47ff}.todo-actions{display:flex;gap:12px;align-items:center}.todo-actions select{padding:6px 10px;border:1px solid #555;border-radius:4px;font-size:12px;background:#333;color:#eee}.delete-btn{background:transparent;border:1px solid #555;color:#ccc;cursor:pointer;font-size:16px;padding:8px;border-radius:6px;transition:all .2s ease}.waveform-marker-section{padding:16px;background:#333;border-radius:8px;border:1px solid #444;margin-bottom:16px}.checkbox-label{display:flex;align-items:center;gap:12px;cursor:pointer;margin-bottom:12px;color:#ccc;font-size:14px}.checkbox-label input[type=checkbox]{width:auto;margin:0;accent-color:#6c47ff}.marker-color-picker{margin-top:12px}.marker-color-picker label{display:block;margin-bottom:8px;font-size:14px;color:#ccc;font-weight:500}.color-options{display:flex;gap:8px;flex-wrap:wrap}.color-option{width:32px;height:32px;border:2px solid #555;border-radius:50%;cursor:pointer;transition:all .2s}.color-option:hover{border-color:#6c47ff;transform:scale(1.1)}.color-option.selected{border-color:#6c47ff;box-shadow:0 0 0 2px #6c47ff4d}.no-todos{text-align:center;padding:60px 20px;background:#1a1a1a;border:2px dashed #444;border-radius:12px;color:#aaa;font-size:16px}.no-todos:before{content:"📝";display:block;font-size:64px;margin-bottom:16px;opacity:.6}.no-todos .hint{font-size:14px;color:#999;margin-top:12px}.project-todo.pending{border-left:4px solid #ffc107}.project-todo.in-progress{border-left:4px solid #17a2b8}.project-todo.completed{border-left:4px solid #28a745;opacity:.85}.project-todo.completed .todo-description,.project-todo.completed .todo-meta{opacity:.7}.focus-points-panel{background:#222;border-radius:12px;padding:20px;margin-bottom:20px;border:1px solid #333;min-height:200px;color:#eee}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.panel-header h4{margin:0;color:#fff;font-size:16px}.add-focus-btn{background:#4A90E2;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;font-size:14px;transition:background .2s}.add-focus-btn:hover{background:#357ABD}.add-comment-form{background:#1a1a1a;padding:20px;border-radius:8px;margin-bottom:20px;border:1px solid #333}.edit-comment-form{background:#1a1a1a;border:1px solid #444;border-radius:8px;padding:1.25rem;margin-bottom:1rem;box-shadow:0 4px 12px #0000004d}.time-indicator{background:#333;padding:8px 12px;border-radius:4px;font-family:monospace;font-size:14px;margin-bottom:15px;color:#ccc;border:1px solid #444}.close-btn{background:#333;border:1px solid #555;color:#ccc;width:24px;height:24px;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:14px;transition:all .2s ease}.close-btn:hover{background:#444;color:#fff;border-color:#6c47ff}.add-comment-form input,.add-comment-form textarea{width:100%;padding:10px;border:1px solid #555;border-radius:4px;margin-bottom:15px;font-size:14px;box-sizing:border-box;background:#333;color:#eee}.add-comment-form textarea{resize:vertical;font-family:inherit}.color-picker{margin-bottom:15px}.color-picker label{display:block;margin-bottom:8px;font-size:14px;color:#666;font-weight:500}.color-options{display:flex;gap:10px;flex-wrap:wrap}.color-option{width:32px;height:32px;border:2px solid transparent;border-radius:50%;cursor:pointer;transition:all .2s}.color-option:hover{transform:scale(1.1);border-color:#666}.color-option.selected{border-color:#333;box-shadow:0 0 0 2px #fff,0 0 0 4px #333}.color-options-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;max-width:200px}.color-option-btn{width:36px;height:36px;border:2px solid #ddd;border-radius:4px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.3);font-size:14px}.color-option-btn:hover{transform:scale(1.05);border-color:#999}.color-option-btn.selected{border-color:#333;border-width:3px}.form-actions{display:flex;gap:12px}.form-actions{display:flex;gap:.75rem;margin-top:1.25rem;padding-top:1rem;border-top:1px solid #f0f0f0}.save-btn{background:#28a745;color:#fff;border:none;padding:12px 24px;border-radius:6px;cursor:pointer;font-weight:500}.primary-btn{flex:1;padding:10px 20px;background:#6c47ff;color:#fff;border:none;border-radius:4px;font-weight:500;cursor:pointer;transition:background-color .2s ease}.primary-btn:hover{background:#8a66ff}.cancel-btn{background:#6c757d;color:#fff;border:none;padding:12px 24px;border-radius:6px;cursor:pointer;font-weight:500}.secondary-btn{padding:10px 20px;background:#333;color:#ccc;border:1px solid #555;border-radius:4px;cursor:pointer;transition:all .2s ease}.secondary-btn:hover{background:#444;color:#fff;border-color:#666}.comments-list{max-height:400px;overflow-y:auto}.comment-item{border:1px solid #333;border-radius:8px;padding:15px;margin-bottom:12px;transition:all .2s;background:#1a1a1a}.comment-item:hover{background:#2a2a2a;border-color:#6c47ff;transform:translateY(-1px);box-shadow:0 4px 12px #6c47ff33}.comment-item.editing{border-color:#ff9800;background:#fff8f0;box-shadow:0 0 0 2px #ff980033}.comment-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.comment-color-indicator{width:20px;height:20px;border-radius:50%;border:2px solid white;box-shadow:0 2px 4px #0003}.comment-timing{display:flex;flex-direction:column;gap:4px;flex:1}.comment-time{font-family:monospace;font-size:16px;font-weight:700;color:#6c47ff;background:#333;padding:6px 12px;border-radius:6px;box-shadow:0 2px 4px #0003;display:inline-block;min-width:auto;width:fit-content;border:1px solid #444}.comment-duration{font-size:12px;color:#ccc;font-weight:500}.comment-content{margin-bottom:20px}.comment-content h3{margin:0 0 12px;color:#fff;font-size:20px;font-weight:600}.comment-text{margin:0;color:#ccc;font-size:15px;line-height:1.6;background:#333;padding:16px;border-radius:8px;border-left:4px solid #6c47ff}.comment-meta{margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #333}.created-info{font-size:13px;color:#aaa;font-style:italic}.comment-actions{display:flex;gap:8px;flex-shrink:0}.action-btn{background:#333;border:1px solid #555;color:#ccc;padding:8px 10px;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s;display:flex;align-items:center;justify-content:center;min-width:32px;height:32px}.action-btn:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0003;border-color:#6c47ff}.loop-btn.primary{background:#6c47ff;color:#fff;border-color:#6c47ff}.loop-btn.primary:hover{background:#8a66ff;border-color:#8a66ff}.edit-btn:hover{background:#2a2a1a;border-color:#ff9800;color:#ff9800}.delete-btn:hover{background:#2a1a1a;border-color:#f44336;color:#f44336}.action-btn:active{transform:translateY(0)}.no-comments{text-align:center;padding:40px 20px;color:#aaa}.no-comments p{margin:8px 0}.hint{font-size:13px;color:#999}.deselect-btn{background:#333;color:#ccc;border:1px solid #555;padding:6px 10px;border-radius:4px;cursor:pointer;font-size:14px;transition:all .2s}.deselect-btn:hover{background:#444;color:#fff;border-color:#6c47ff}.no-selection{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%}.selection-hint{text-align:center;color:#aaa;width:100%;margin-bottom:20px}.selection-hint h5{margin:0 0 10px;font-size:18px;color:#6c47ff}.selection-hint p{margin:0;font-size:14px;line-height:1.5;color:#ccc}.all-focus-points{width:100%;margin-top:20px;padding:15px;background:#1a1a1a;border-radius:6px;border:1px solid #333}.all-focus-points h6{margin:0 0 12px;color:#ccc;font-size:14px;font-weight:600}.focus-points-csv{line-height:1.6}.selected-comment-display{animation:fadeIn .3s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.comment-card.selected{background:linear-gradient(135deg,#1a1a1a 0%,#2a2a2a 100%);border:2px solid #6c47ff;border-radius:12px;padding:24px;box-shadow:0 4px 12px #6c47ff33}.form-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.25rem;padding-bottom:.75rem;border-bottom:1px solid #333}.form-header h5{margin:0;color:#fff;font-size:1rem;font-weight:600}.form-section{margin-bottom:1rem}.form-label{display:block;color:#ccc;font-weight:500;margin-bottom:.4rem;font-size:.9rem}.form-input,.form-textarea{width:100%;padding:8px 12px;border:1px solid #555;border-radius:4px;background:#333;color:#eee;font-size:.9rem;transition:border-color .2s ease;font-family:inherit}.form-input::placeholder,.form-textarea::placeholder{color:#999}.form-input:focus,.form-textarea:focus{outline:none;border-color:#6c47ff;box-shadow:0 0 0 2px #6c47ff33}.form-textarea{resize:vertical;min-height:70px}#root{margin:0 auto;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.project-workspace{max-width:1400px;margin:0 auto;padding:20px}.ProjectHeader{display:flex;flex-direction:column;align-items:flex-start}.project-content-grid{display:flex;flex-direction:column;gap:1rem;width:100%}.main-audio-section{width:100%}.sidebar-panels-container{display:flex;gap:1rem;flex-direction:row;width:100%}.sidebar-panel{flex:1;min-height:300px}.project-header-back-btn{background:#6c757d;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;transition:all .2s ease;margin-bottom:10px;align-self:flex-start}.project-header-back-btn:hover{background:#5a6268}.logout-button{margin-left:1rem}.suggestion-fab{position:fixed;right:24px;bottom:24px;width:56px;height:56px;border-radius:50%;background:#6c47ff;color:#fff;font-size:32px;border:none;box-shadow:0 4px 16px #0000002e;cursor:pointer;z-index:1500;transition:all .2s ease}.suggestion-fab:hover{background:#8a66ff;transform:scale(1.1)}@media (max-width: 768px){.sidebar-panels-container{flex-direction:column}.sidebar-panel{min-height:200px}}:root{--de-bg: #0f0f0f;--de-panel: #121212;--de-field: #151515;--de-border: #2a2a2a;--de-border-strong: #333;--de-fg: #ffffff;--de-fg-dim: #a57979;--de-accent: #10b981;--de-focus: 0 0 0 2px rgba(16,185,129,.35), 0 0 0 1px rgba(16,185,129,.65)}input[type=text],input[type=email],input[type=search],input[type=number],input[type=password],input[type=url],textarea,select{background:var(--de-field);color:var(--de-fg);border:1px solid var(--de-border-strong);border-radius:10px;padding:8px 10px;outline:none;transition:border-color .12s ease,box-shadow .12s ease,background .12s ease}input::placeholder,textarea::placeholder{color:#9a9a9a}input:focus,textarea:focus,select:focus{border-color:var(--de-accent);box-shadow:var(--de-focus)}input[type=color]{background:var(--de-field);border:1px solid var(--de-border-strong);border-radius:6px;width:40px;height:32px;padding:2px}input[type=file]{color:var(--de-fg-dim)}input[type=file]::file-selector-button{background:#1a1a1a;color:var(--de-fg);border:1px solid var(--de-border-strong);border-radius:8px;padding:6px 10px;margin-right:10px;cursor:pointer}input[type=file]::file-selector-button:hover{background:#202020}button{border-radius:8px;border:1px solid var(--de-border-strong);background:#1a1a1a;color:var(--de-fg);padding:8px 12px;cursor:pointer;transition:transform 80ms ease,background .12s ease,border-color .12s ease}button:hover{background:#222}button:active{transform:translateY(1px)}.de-btn-accent{background:var(--de-accent);color:#000;border-color:transparent}.de-btn-accent:hover{filter:brightness(1.05)}.de-chip{background:#1a1a1a;color:var(--de-fg);border:1px solid var(--de-border-strong);border-radius:999px;padding:6px 12px}.de-chip.active{background:var(--de-accent);color:#000;border-color:transparent}