*{margin:0;padding:0}*,*:before,*:after{box-sizing:border-box}body{background-color:#f5f7fa;font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif;color:#111;margin:0;transition:background-color .2s,color .2s}body.dark{background-color:#0f172a;color:#e5e7eb}.app{max-width:480px;box-sizing:border-box;background-color:#fff;border-radius:12px;box-shadow:0 10px 25px #00000014;margin:3rem auto;padding:2rem;transition:background-color .2s}body.dark .app{background-color:#1e293b}@media(max-width:767px){.app{width:100%;border-radius:0;margin:0;padding:16px}}.app-ttl{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:1.5rem}.theme-toggle{display:block;background:none;border:none;font-size:.9rem;color:inherit;cursor:pointer}.task-add-btn{margin:0 0 1rem auto}input,textarea{flex:1;width:100%;border:1px solid #ccc;border-radius:6px;font-size:14px;padding:.5rem .75rem;transition:background-color .2s,color .2s}body.dark input,body.dark textarea{background-color:#1e293b;color:#e5e7eb}@media(max-width:767px){input,textarea{height:44px;font-size:16px}}body.dark input[type=date],body.dark textarea[type=date]{color-scheme:dark}input[type=date]::-webkit-calendar-picker-indicator,textarea[type=date]::-webkit-calendar-picker-indicator{cursor:pointer}textarea{min-height:96px;line-height:1.5;resize:vertical}.btn{display:block;background-color:#4f46e5;border:none;border-radius:6px;color:#fff;padding:.5rem 1rem;cursor:pointer}.btn:hover{opacity:.9}@media(max-width:767px){.btn{height:44px}}.task-list{list-style:none;margin-top:24px;padding:0}.empty-message{color:#999;text-align:center;margin-top:2rem}@media(max-width:767px){.empty-message{font-size:14px;padding:32px 0}}.task-item{display:flex;justify-content:space-between;align-items:center;gap:.5rem;border-bottom:1px solid #eee;padding:.5rem 0;transition:border-bottom .2s}body.dark .task-item{border-bottom:1px solid #334155}@media(max-width:767px){.task-item{padding:12px 0}}.task-item:last-child{border-bottom:none}.task-item.completed span{text-decoration:line-through;color:#999}.task-item button{background:none;border:none;color:inherit;cursor:pointer}@media(max-width:767px){.task-item button{padding:8px 12px}}.task-item button:hover{color:#e11d48}.task-label{display:flex;align-items:center;gap:8px;cursor:pointer}.task-label input[type=checkbox]{cursor:pointer}.task-meta{font-size:.85rem;margin-left:1.5rem}.task-action{display:flex;align-items:center;gap:.5rem}.task-editing{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}.filter-tabs{display:flex;gap:8px;margin-bottom:16px}.filter-tabs button{flex:1;background-color:#fff;border:1px solid #ccc;padding:8px;transition:background-color .2s,color .2s;cursor:pointer}.filter-tabs button.is-active{background-color:#333;color:#fff}.filter-tabs button:hover{background-color:#3333;color:#fff}.modal{width:100%;max-width:420px;background:#fff;border-radius:12px;padding:1.5rem;animation:modal-fade-in .2s ease-out}body.dark .modal{background:#1e293b}@media(max-width:767px){.modal{border-radius:0}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:grid;place-items:center;z-index:1000}.modal-ttl{color:#111}body.dark .modal-ttl{color:#e5e7eb}.modal-input{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}.modal-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1rem}@keyframes modal-fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
