@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#fffffff2;background-color:#0f0c1b;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg-gradient: linear-gradient(135deg, #0d0a1b 0%, #17112c 50%, #0d0a1b 100%);--panel-bg: #1a152c;--panel-border: #2a2440;--card-bg: #211b36;--card-bg-hover: #2b2346;--card-border: #2a2440;--card-border-hover: #7c4ddb;--primary: #8b5cf6;--primary-hover: #a78bfa;--primary-glow: rgba(139, 92, 246, .3);--accent-pink: #ec4899;--accent-blue: #06b6d4;--danger: #ef4444;--danger-hover: #f87171;--success: #10b981;--text-muted: #94a3b8;--text-light: #f8fafc}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;background-image:linear-gradient(#0d0a1bbf,#17112cd1),url(/background.jpg);background-size:cover;background-position:center;background-attachment:fixed;overflow:hidden}#root{height:100vh;display:flex;flex-direction:column}.app-header{height:60px;background:#0d0a1bf2;border-bottom:1px solid var(--panel-border);display:flex;align-items:center;justify-content:space-between;padding:0 24px;z-index:10;flex-shrink:0}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.25rem;letter-spacing:-.025em;background:linear-gradient(135deg,var(--text-light) 30%,var(--primary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.brand-icon{color:var(--primary);filter:drop-shadow(0 0 8px var(--primary-glow))}.header-actions{display:flex;align-items:center;gap:16px}.sync-status{display:flex;align-items:center;gap:6px;font-size:.8rem;padding:4px 10px;border-radius:9999px;background:#ffffff0d;color:var(--text-muted);transition:all .3s ease;border:1px solid rgba(255,255,255,.02)}.sync-status.synced{color:var(--success);background:#10b9811a;border-color:#10b98133}.sync-status.saving{color:var(--accent-blue);background:#06b6d41a;border-color:#06b6d433}.sync-status.error{color:var(--danger);background:#ef44441a;border-color:#ef444433;animation:pulse 2s infinite}.btn-icon{background:none;border:none;color:var(--text-muted);padding:8px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.btn-icon:hover{background:#ffffff14;color:var(--text-light)}.btn-icon.back-btn{border:1px solid var(--panel-border);gap:6px;padding:6px 12px;font-size:.85rem;font-weight:500}.workspace{flex-grow:1;display:flex;flex-direction:column;overflow:hidden;position:relative}.boards-dashboard{flex-grow:1;overflow-y:auto;padding:40px 24px;max-width:1200px;width:100%;margin:0 auto}.dashboard-title{font-size:2rem;font-weight:700;margin-bottom:28px;letter-spacing:-.03em;display:flex;align-items:center;gap:12px}.boards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}.board-tile{background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:16px;padding:24px;height:140px;display:flex;flex-direction:column;justify-content:space-between;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.board-tile:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(139,92,246,.15) 0%,transparent 50%);opacity:0;transition:opacity .3s ease}.board-tile:hover{transform:translateY(-4px);border-color:var(--primary);box-shadow:0 12px 30px #0000004d,0 0 15px #8b5cf626}.board-tile:hover:before{opacity:1}.board-tile-title{font-size:1.15rem;font-weight:600;color:var(--text-light);line-height:1.3}.board-tile-footer{display:flex;align-items:center;justify-content:space-between;font-size:.75rem;color:var(--text-muted)}.board-delete-btn{opacity:0;transform:scale(.9);transition:all .2s ease;color:var(--text-muted)}.board-tile:hover .board-delete-btn{opacity:1;transform:scale(1)}.board-delete-btn:hover{color:var(--danger);background:#ef44441a}.create-board-tile{background:#ffffff05;border:2px dashed rgba(255,255,255,.15);border-radius:16px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;height:140px;cursor:pointer;color:var(--text-muted);font-weight:500;transition:all .2s ease}.create-board-tile:hover{border-color:var(--primary);color:var(--text-light);background:#8b5cf608}.create-board-input-wrapper{display:flex;flex-direction:column;gap:10px;width:100%}.create-board-input{background:#0003;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:8px 12px;color:var(--text-light);font-family:inherit;font-size:.9rem;outline:none}.create-board-input:focus{border-color:var(--primary)}.create-board-actions{display:flex;gap:8px}.board-view{flex-grow:1;display:flex;flex-direction:column;overflow:hidden}.board-sub-header{height:52px;padding:0 24px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.03);flex-shrink:0}.board-title-editor{font-size:1.25rem;font-weight:600;background:transparent;border:1px solid transparent;padding:4px 8px;border-radius:6px;color:var(--text-light);font-family:inherit;outline:none;cursor:pointer;transition:all .15s ease}.board-title-editor:focus{background:#ffffff0d;border-color:var(--primary);cursor:text}.lists-container{flex-grow:1;display:flex;gap:20px;padding:20px 24px;overflow-x:auto;overflow-y:hidden;align-items:flex-start;white-space:nowrap}.lists-container::-webkit-scrollbar{height:10px}.lists-container::-webkit-scrollbar-track{background:#00000026;border-radius:10px}.lists-container::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}.lists-container::-webkit-scrollbar-thumb:hover{background:#fff3}.list-column{width:290px;min-width:290px;max-height:100%;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:16px;display:flex;flex-direction:column;overflow:visible;box-shadow:0 4px 20px #00000026}.list-header{padding:16px 16px 12px;display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:grab}.list-header-title-container{display:flex;align-items:center;gap:8px;flex-grow:1;overflow:hidden}.list-title-input{font-size:.95rem;font-weight:600;background:transparent;border:1px solid transparent;color:var(--text-light);font-family:inherit;outline:none;padding:3px 6px;border-radius:4px;width:100%;text-overflow:ellipsis}.list-title-input:focus{background:#0003;border-color:var(--primary)}.card-count-badge{font-size:.75rem;padding:2px 7px;border-radius:9999px;background:#ffffff14;color:var(--text-muted);font-weight:600}.cards-list{padding:4px 12px 12px;flex-grow:1;overflow:visible;display:flex;flex-direction:column;min-height:80px}.cards-list::-webkit-scrollbar{width:6px}.cards-list::-webkit-scrollbar-track{background:transparent}.cards-list::-webkit-scrollbar-thumb{background:#ffffff0d;border-radius:4px}.cards-list::-webkit-scrollbar-thumb:hover{background:#ffffff26}.card-item{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;padding:14px;margin-bottom:8px;display:flex;flex-direction:column;gap:8px;cursor:grab;transition:border-color .2s ease,background-color .2s ease;position:relative;white-space:normal}.card-item:hover{border-color:var(--card-border-hover);background:var(--card-bg-hover);box-shadow:0 6px 16px #0003}.card-item.is-dragging{box-shadow:0 4px 12px #0000004d;cursor:grabbing}.card-item:active{cursor:grabbing}.card-item-header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}.card-item-title{font-size:.9rem;font-weight:500;color:var(--text-light);line-height:1.4}.card-actions{opacity:0;display:flex;gap:4px;transition:opacity .2s ease}.card-item:hover .card-actions{opacity:1}.card-item-description{font-size:.8rem;color:var(--text-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4}.add-button{background:none;border:none;color:var(--text-muted);font-size:.85rem;font-weight:500;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 14px;margin:0 16px 12px;border-radius:10px;cursor:pointer;transition:all .2s ease;border:1px dashed rgba(255,255,255,.05)}.add-button:hover{background:#ffffff0a;color:var(--text-light);border-color:#ffffff26}.inline-creator{display:flex;flex-direction:column;gap:8px;padding:12px;background:#00000026;border-radius:12px;margin:0 16px 12px;border:1px solid rgba(255,255,255,.05)}.inline-creator-input{background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 10px;color:var(--text-light);font-family:inherit;font-size:.85rem;outline:none}.inline-creator-input:focus{border-color:var(--primary)}.inline-creator-actions{display:flex;gap:6px}.btn-primary{background:var(--primary);border:none;color:#fff;padding:6px 12px;border-radius:8px;font-family:inherit;font-weight:500;font-size:.85rem;cursor:pointer;transition:all .2s ease}.btn-primary:hover{background:var(--primary-hover);box-shadow:0 0 12px var(--primary-glow)}.btn-secondary{background:#ffffff0d;border:1px solid var(--panel-border);color:var(--text-muted);padding:6px 12px;border-radius:8px;font-family:inherit;font-weight:500;font-size:.85rem;cursor:pointer;transition:all .2s ease}.btn-secondary:hover{background:#ffffff1a;color:var(--text-light)}.add-list-column-btn{min-width:290px;width:290px;background:#ffffff03;border:2px dashed rgba(255,255,255,.08);border-radius:16px;height:120px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;cursor:pointer;color:var(--text-muted);font-weight:500;font-size:.95rem;transition:all .2s ease}.add-list-column-btn:hover{background:#ffffff08;border-color:var(--primary);color:var(--text-light)}.add-list-column-creator{min-width:290px;width:290px;background:var(--panel-bg);border:1px solid var(--panel-border);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:12px}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.modal-content{background:#191430;border:1px solid var(--panel-border);border-radius:20px;width:100%;max-width:600px;padding:28px;box-shadow:0 20px 50px #00000080;display:flex;flex-direction:column;gap:20px;animation:slideUp .3s cubic-bezier(.2,.8,.2,1);position:relative}.modal-close{position:absolute;top:20px;right:20px}.modal-header{display:flex;flex-direction:column;gap:6px}.modal-header-tag{font-size:.75rem;color:var(--primary);font-weight:600;text-transform:uppercase;letter-spacing:.05em}.modal-title-input{font-size:1.5rem;font-weight:700;color:var(--text-light);background:transparent;border:1px solid transparent;border-radius:6px;padding:4px 8px;font-family:inherit;outline:none;width:100%}.modal-title-input:focus{background:#ffffff08;border-color:var(--primary)}.modal-section{display:flex;flex-direction:column;gap:8px}.modal-section-label{font-size:.85rem;font-weight:600;color:var(--text-muted);display:flex;align-items:center;gap:6px}.modal-textarea{background:#0003;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:14px;color:var(--text-light);font-family:inherit;font-size:.9rem;outline:none;resize:vertical;min-height:120px;line-height:1.5;transition:border-color .2s ease}.modal-textarea:focus{border-color:var(--primary)}.modal-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:10px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes pulse{0%{opacity:.6}50%{opacity:1}to{opacity:.6}}.toast-container{position:fixed;bottom:24px;right:24px;z-index:2000;display:flex;flex-direction:column;gap:10px}.toast{background:#281a1a;border:1px solid var(--danger);color:var(--danger-hover);padding:12px 18px;border-radius:12px;font-size:.85rem;font-weight:500;box-shadow:0 10px 25px #0000004d;display:flex;align-items:center;gap:8px;animation:slideIn .3s cubic-bezier(.2,.8,.2,1)}@keyframes slideIn{0%{transform:translate(100px);opacity:0}to{transform:translate(0);opacity:1}}.loading-view{flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--text-muted)}.spinner{width:40px;height:40px;border:3px solid rgba(139,92,246,.1);border-top-color:var(--primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
