@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";:root{--bg-main:#f6f7fb;--bg-card:#fff;--text-primary:#1e2033;--text-secondary:#6b7280;--primary-color:#2563eb;--primary-hover:#1d4ed8;--primary-glow:#2563eb29;--accent-color:#0ea5e9;--success-color:#10b981;--warning-color:#f59e0b;--danger-color:#ef4444;--border-color:#e5e7eb;--shadow-sm:0 1px 2px 0 #1018280d;--shadow-md:0 4px 8px -2px #1018280f, 0 2px 4px -2px #1018280a;--shadow-lg:0 12px 16px -4px #1018280f, 0 4px 6px -2px #10182808;--shadow-glow:0 0 20px #2563eb26;--radius-md:10px;--radius-lg:16px;--radius-full:9999px;--font-sans:"Inter", sans-serif;--transition:all .2s cubic-bezier(.4, 0, .2, 1);--sidebar-width:250px;--header-height:64px}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:var(--font-sans);background-color:var(--bg-main);color:var(--text-primary);-webkit-font-smoothing:antialiased;min-height:100dvh;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.2}button{cursor:pointer;background:0 0;border:none;outline:none;font-family:inherit}input,textarea,select{outline:none;font-family:inherit}.app-container{width:100%;height:100dvh;display:flex;position:relative;overflow:hidden}.sidebar{width:var(--sidebar-width);background:var(--bg-card);border-right:1px solid var(--border-color);z-index:60;box-shadow:var(--shadow-sm);flex-direction:column;flex-shrink:0;padding:20px;display:flex}.sidebar-backdrop{display:none}.mobile-menu-btn{border-radius:var(--radius-md);justify-content:center;align-items:center;width:36px;height:36px;display:none}.mobile-menu-btn:hover{background:var(--bg-main)}.main-content{background-color:var(--bg-main);flex-direction:column;flex:1;min-width:0;display:flex;overflow:hidden}.header{height:var(--header-height);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-color);z-index:10;background:#ffffffbf;justify-content:space-between;align-items:center;gap:16px;padding:0 28px;display:flex;position:sticky;top:0}.header-search{flex-shrink:1;width:100%;min-width:0;max-width:300px;position:relative}.content-area{flex-direction:column;flex:1;padding:0;display:flex;overflow:hidden}.tab-panel{-webkit-overflow-scrolling:touch;box-sizing:border-box;height:100%;padding:28px;overflow-y:auto}.form-grid-2{grid-template-columns:1fr 1fr;gap:16px;display:grid}.table-scroll{-webkit-overflow-scrolling:touch;overflow-x:auto}@media (width<=900px){.mobile-menu-btn{display:inline-flex}.sidebar{height:100dvh;box-shadow:none;transition:transform .28s cubic-bezier(.4,0,.2,1);position:fixed;top:0;left:0;transform:translate(-100%)}.sidebar.mobile-open{box-shadow:var(--shadow-lg);transform:translate(0)}.sidebar-backdrop.mobile-open{z-index:55;background:#0f172a73;display:block;position:fixed;inset:0}.header{padding:0 16px}.tab-panel{padding:18px}}@media (width<=640px){.form-grid-2{grid-template-columns:1fr;gap:12px}.header-search{display:none}.tab-panel{padding:14px}.kanban-board{gap:14px!important}.kanban-column{min-width:260px!important}}@media (width<=480px){.auth-card{padding:28px 20px!important}.header-username{display:none}}.title{background:linear-gradient(135deg, var(--text-primary), var(--primary-color));-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:24px;font-weight:700}.subtitle{color:var(--text-secondary);font-size:14px}.btn{border-radius:var(--radius-md);transition:var(--transition);justify-content:center;align-items:center;gap:8px;padding:10px 20px;font-size:14px;font-weight:500;display:inline-flex}.btn-primary{background:var(--primary-color);color:#fff;box-shadow:0 1px 2px #1018280d}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-1px);box-shadow:0 4px 12px #2563eb40}.btn-secondary{background:var(--bg-card);border:1px solid var(--border-color);color:var(--text-primary)}.btn-secondary:hover{background:var(--bg-main);border-color:var(--text-secondary)}.input-field{border-radius:var(--radius-md);border:1px solid var(--border-color);background:var(--bg-card);width:100%;color:var(--text-primary);transition:var(--transition);padding:12px 16px;font-size:14px}.input-field:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px var(--primary-glow)}.card{background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #ffffff80;padding:24px}.kanban-board{align-items:flex-start;gap:24px;height:100%;padding-bottom:24px;display:flex;overflow-x:auto}.kanban-column{border-radius:var(--radius-lg);border:1px solid var(--border-color);background:#f1f5f980;flex-direction:column;flex:1;gap:16px;min-width:300px;padding:16px;display:flex}.kanban-column-header{justify-content:space-between;align-items:center;padding:0 8px;display:flex}.kanban-column-title{align-items:center;gap:8px;font-size:15px;font-weight:600;display:flex}.badge{background:var(--bg-card);border-radius:var(--radius-full);color:var(--text-secondary);border:1px solid var(--border-color);padding:2px 8px;font-size:12px;font-weight:500}.task-card{background:var(--bg-card);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--border-color);cursor:grab;transition:var(--transition);padding:16px}.task-card:hover{box-shadow:var(--shadow-md);border-color:var(--primary-color);transform:translateY(-2px)}.task-header{justify-content:space-between;align-items:flex-start;margin-bottom:8px;display:flex}.task-title{font-size:14px;font-weight:500}.task-meta{justify-content:space-between;align-items:center;margin-top:16px;display:flex}.avatar{background:linear-gradient(135deg, var(--primary-color), var(--accent-color));color:#fff;border:2px solid var(--bg-card);border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:12px;font-weight:600;display:flex}.glass-effect{-webkit-backdrop-filter:blur(12px);background:#fff9;border:1px solid #fffc}.auth-container{box-sizing:border-box;background:radial-gradient(circle at top left, var(--primary-glow), transparent 40%), radial-gradient(circle at bottom right, #0ea5e926, transparent 40%);background-color:var(--bg-main);justify-content:center;align-items:center;height:100dvh;padding:20px;display:flex}.auth-card{border-radius:24px;width:100%;max-width:400px;padding:40px}.auth-form{flex-direction:column;gap:20px;margin-top:32px;display:flex}
