*{padding:0;margin:0;box-sizing:border-box}:root{--bg-color: #f5f7fa;--card-bg: #ffffff;--text-color: #1f2937;--header-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--header-shadow: rgba(102, 126, 234, .3);--border-soft: rgba(0, 0, 0, .08);--glass-bg: rgba(255, 255, 255, .08);--glass-hover: rgba(255, 255, 255, .15);--focus-color: #579dff}[data-theme=dark]{--bg-color: #0f172a;--card-bg: #1e293b;--text-color: #f8fafc;--header-gradient: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);--header-shadow: rgba(15, 23, 42, .9);--border-soft: rgba(255, 255, 255, .15);--glass-bg: rgba(255, 255, 255, .06);--glass-hover: rgba(255, 255, 255, .12);--focus-color: #38bdf8}body{background:var(--bg-color);color:var(--text-color);transition:background .3s ease,color .3s ease}.task_card{background:var(--card-bg)}.app{display:grid;grid-template-rows:auto;overflow-x:hidden}.app_header{background:var(--header-gradient);box-shadow:0 4px 20px var(--header-shadow);position:sticky;top:0;z-index:1000;border-bottom:1px solid var(--border-soft)}.app_header .header_container{max-width:1400px;margin:0 auto;padding:0 2rem}.app_header .header_content{display:flex;align-items:center;justify-content:space-between;padding:1.2rem 0}.app_header .header_left{display:flex;align-items:center;gap:2.5rem}.app_header .header_brand{display:flex;align-items:center;gap:1rem}.app_header .brand_logo{width:48px;height:48px;background:linear-gradient(135deg,#fff,#f0f0f0);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:800;color:#667eea;box-shadow:0 4px 15px #00000026;transition:transform .3s ease,box-shadow .3s ease}.app_header .brand_logo:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 25px #00000040}.app_header .brand_info{display:flex;flex-direction:column}.app_header .brand_title{font-size:1.5rem;font-weight:700;color:#fff;letter-spacing:-.5px;line-height:1.2}.app_header .brand_subtitle{font-size:.75rem;color:#fffc;font-weight:500;letter-spacing:.5px;text-transform:uppercase}.app_header .header_right{display:flex;align-items:center;gap:1rem}.app_header .header_actions{display:flex;gap:.75rem;align-items:center}.theme_toggle{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .85rem;border-radius:999px;font-size:.85rem;font-weight:500;background:var(--glass-bg);color:#fff;border:1px solid var(--border-soft);cursor:pointer;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:all .2s ease}.theme_toggle:hover{background:var(--glass-hover)}.theme_toggle:active{transform:scale(.97)}.theme_toggle:focus-visible{outline:2px solid var(--focus-color);outline-offset:2px}.app_header .user_avatar{width:42px;height:42px;background:linear-gradient(135deg,#f093fb,#f5576c);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:1rem;cursor:pointer;border:2px solid var(--border-soft);transition:all .3s ease}.app_header .user_avatar:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 20px #00000040}.app_header .user_avatar:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 20px #0003;border-color:#ffffff80}.empty_state{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--card-bg);border-radius:12px;border:2px dashed var(--border-soft);padding:40px;text-align:center;color:var(--text-color);margin:0 auto}.empty_icon{font-size:48px;margin-bottom:16px;opacity:.8}.empty_state h2{font-size:22px;font-weight:600;color:var(--text-color);margin-bottom:8px}.empty_state p{font-size:15px;color:color-mix(in srgb,var(--text-color) 70%,transparent);max-width:420px;margin-bottom:24px}@media(max-width:768px){.app_header .brand_info{display:none}.task_form{padding:1.5rem;margin:1rem}.tag_container{gap:.5rem}.tag{padding:.5rem 1rem;font-size:.8rem}.task_input,.task_status{font-size:.95rem}.task_submit{font-size:1rem;padding:.875rem 1.5rem}}.task_form{background:var(--card-bg);border-radius:16px;padding:2rem;max-width:1300px;margin:2rem auto;width:100%;border:1px solid var(--border-soft);box-shadow:0 6px 22px color-mix(in srgb,var(--focus-color) 18%,transparent);transition:background .3s ease,border .3s ease}.task_input{width:100%;padding:1rem 1.5rem;font-size:1rem;border-radius:12px;margin-bottom:1.5rem;background:linear-gradient(135deg,var(--card-bg) 0%,color-mix(in srgb,var(--card-bg) 90%,var(--bg-color)) 100%);border:1px solid var(--border-soft);color:var(--text-color);font-family:inherit;transition:all .3s ease}.task_input::placeholder{color:color-mix(in srgb,var(--text-color) 45%,transparent)}.task_input:focus{outline:none;border-color:var(--focus-color);box-shadow:0 0 0 4px color-mix(in srgb,var(--focus-color) 20%,transparent);transform:translateY(-2px)}.tag_status{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap}.tag_container{display:flex;gap:.75rem;margin-bottom:1.5rem;flex-wrap:wrap}.tag{padding:.65rem 1.5rem;border-radius:20px;background:var(--card-bg);border:1px solid var(--border-soft);color:var(--text-color);font-size:.875rem;font-weight:600;cursor:pointer;transition:all .3s ease}.tag:hover{transform:translateY(-2px);border-color:var(--focus-color);box-shadow:0 4px 12px color-mix(in srgb,var(--focus-color) 30%,transparent)}.tag.active{background:var(--header-gradient);color:var(--text-color);border-color:transparent}.task_status{padding:1rem 3rem 1rem 1.5rem;font-size:1rem;border-radius:12px;margin-bottom:1.5rem;background:var(--card-bg);border:1px solid var(--border-soft);color:var(--text-color);font-weight:500;cursor:pointer;appearance:none;transition:all .3s ease;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23579dff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center}.task_status:hover,.task_status:focus{outline:none;border-color:var(--focus-color);box-shadow:0 0 0 4px color-mix(in srgb,var(--focus-color) 20%,transparent)}.task_status option{padding:.5rem}.task_submit{width:100%;padding:1rem 2rem;background:var(--header-gradient);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:700;letter-spacing:.5px;text-transform:uppercase;cursor:pointer;transition:all .3s ease;box-shadow:0 6px 18px color-mix(in srgb,var(--focus-color) 45%,transparent)}.task_submit:hover{transform:translateY(-3px);box-shadow:0 10px 28px color-mix(in srgb,var(--focus-color) 55%,transparent)}.task_submit:active{transform:translateY(-1px)}@media(max-width:768px){.task_form{padding:1.5rem;margin:2rem 0}.tag{padding:.5rem 1rem;font-size:.8rem}.task_input,.task_status{font-size:.95rem}.task_submit{font-size:1rem;padding:.875rem 1.5rem}}.task_column{background:linear-gradient(135deg,var(--card-bg) 0%,color-mix(in srgb,var(--card-bg) 92%,var(--bg-color)) 100%);border-radius:16px;padding:1.5rem;box-shadow:0 2px 12px color-mix(in srgb,black 8%,transparent);border:1px solid var(--border-soft);transition:all .3s ease;display:flex;flex-direction:column;gap:.5rem}.task_column:hover{box-shadow:0 6px 22px color-mix(in srgb,var(--focus-color) 18%,transparent);border-color:var(--focus-color)}.task_column_heading{display:flex;align-items:center;gap:.75rem;font-size:1.25rem;font-weight:700;color:var(--text-color);padding-bottom:1rem;border-bottom:3px solid var(--border-soft);letter-spacing:-.5px}.task_column_icon{width:28px;height:28px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.task_card{background:var(--card-bg);border-radius:12px;padding:1.25rem;box-shadow:0 2px 8px color-mix(in srgb,black 6%,transparent);border:1px solid var(--border-soft);transition:all .3s ease;cursor:pointer;position:relative;overflow:hidden;animation:slideIn .3s ease-out}.task_card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--header-gradient);transform:scaleY(0);transition:transform .3s ease}.task_card:hover{transform:translateY(-4px);box-shadow:0 10px 24px color-mix(in srgb,var(--focus-color) 25%,transparent);border-color:var(--focus-color)}.task_card:hover:before{transform:scaleY(1)}.task_card>p{font-size:.95rem;color:color-mix(in srgb,var(--text-color) 85%,transparent);line-height:1.6;margin-bottom:1rem;font-weight:500}.task_card_buttom_line{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:.75rem;border-top:1px solid var(--border-soft)}.task_card_tags{display:flex;gap:.5rem;flex-wrap:wrap;flex:1}.task_card_tags .tag_item{padding:.4rem .875rem;border-radius:16px;font-size:.75rem;font-weight:600;border:1.5px solid var(--border-soft);background:color-mix(in srgb,var(--card-bg) 80%,var(--focus-color));color:var(--text-color);transition:all .3s ease;text-transform:uppercase}.task_card_tags .tag_item:nth-child(1){background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#1e40af;border-color:#93c5fd}.task_card_tags .tag_item:nth-child(2){background:linear-gradient(135deg,#fce7f3,#fbcfe8);color:#be185d;border-color:#f9a8d4}.task_card_tags .tag_item:nth-child(3){background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#065f46;border-color:#6ee7b7}.task_card_tags .tag_item:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.task_delete,.task_edit{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;border:1px solid var(--border-soft);background:var(--card-bg);transition:all .3s ease}.task_delete:hover{background:color-mix(in srgb,red 12%,var(--card-bg));box-shadow:0 6px 14px color-mix(in srgb,red 40%,transparent)}.task_edit:hover{background:color-mix(in srgb,var(--focus-color) 18%,var(--card-bg));box-shadow:0 6px 14px color-mix(in srgb,var(--focus-color) 40%,transparent)}.delete_icon,.edit_icon{width:18px;height:18px;object-fit:contain;transition:all .3s ease}.task_card_actions{display:flex;flex-direction:column;row-gap:10px;align-items:center}.task_card input{width:100%;padding:.6rem .75rem;font-size:.95rem;border-radius:8px;border:1px solid #c7d2fe;outline:none;transition:all .3s ease;margin-bottom:1rem;font-weight:500}.task_card input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea33}.task_card_actions button{height:36px;padding:0 .75rem;font-size:.75rem;font-weight:600;border-radius:8px;border:1px solid transparent;cursor:pointer;transition:all .3s ease}.task_card_actions button:first-child{background:linear-gradient(135deg,#dcfce7,#bbf7d0);color:#065f46;border-color:#86efac}.task_card_actions button:first-child:hover{background:linear-gradient(135deg,#bbf7d0,#86efac);transform:scale(1.05);box-shadow:0 4px 10px #22c55e4d}.task_card_actions button:last-child{background:linear-gradient(135deg,#fef2f2,#fee2e2);color:#991b1b;border-color:#fecaca}.task_card_actions button:last-child:hover{background:linear-gradient(135deg,#fee2e2,#fecaca);transform:scale(1.05);box-shadow:0 4px 10px #ef44444d}.app_main{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1.5rem;padding:2rem;max-width:1400px;margin:0 auto}@media(max-width:768px){.app_main{grid-template-columns:1fr;padding:1rem;gap:1rem;width:100%}.task_column{padding:1rem}.task_column_heading{font-size:1.1rem}.task_column_icon{width:24px;height:24px}.task_card{padding:1rem}.task_card>p{font-size:.9rem}.task_card_tags .tag_item{padding:.35rem .75rem;font-size:.7rem}.task_delete{width:32px;height:32px}.delete_icon{width:16px;height:16px}}@media(min-width:769px)and (max-width:1024px){.app_main{grid-template-columns:repeat(2,1fr)}}@media(min-width:1025px){.app_main{grid-template-columns:repeat(4,1fr)}}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.task_card{animation:slideIn .3s ease-out}.drop-area{width:100%;height:100px;border:1px solid #dcdcdc;padding:15px;border-radius:15px;opacity:1}.hide-area{opacity:0}.task_search_wrapper{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:1rem auto 1.5rem;padding:.75rem 1rem;max-width:1350px;width:100%}.task_search{flex:1;height:50px;padding:15px;border-radius:12px;background:var(--card-bg);color:var(--text-color);border:1px solid var(--border-soft);font-size:.9rem;outline:none;transition:all .25s ease}.task_search::placeholder{color:color-mix(in srgb,var(--text-color) 45%,transparent)}.task_search:focus{border-color:var(--focus-color);box-shadow:0 0 0 3px color-mix(in srgb,var(--focus-color) 30%,transparent)}.task_search_wrapper>div{display:flex;gap:.5rem;flex-wrap:wrap}.task_search_wrapper button{padding:.4rem .9rem;border-radius:16px;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;background:var(--card-bg);color:var(--text-color);border:1px solid var(--border-soft);cursor:pointer;transition:all .25s ease}.task_search_wrapper button:hover{background:color-mix(in srgb,var(--header-gradient) 12%,var(--card-bg));border-color:var(--focus-color);transform:translateY(-1px)}.task_search_wrapper button.active{background:var(--header-gradient);color:#fff;border-color:transparent;box-shadow:0 4px 10px color-mix(in srgb,var(--focus-color) 50%,transparent)}@media(max-width:640px){.task_search_wrapper{flex-direction:column;align-items:stretch}.task_search_wrapper>div{justify-content:center}}