:root{color:#1f2937;background:#f5f7fb;font-family:Hiragino Sans,Yu Gothic,sans-serif}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}.app{background:linear-gradient(#eef4ff 0%,#f8fafc 100%);min-height:100vh;padding:32px 16px}.panel{background:#fff;border:1px solid #dbe3f0;border-radius:16px;max-width:640px;margin:0 auto;padding:24px;box-shadow:0 10px 30px #0f172a14}.description{color:#4b5563;margin-top:8px}.todo-form{grid-template-columns:1fr auto;gap:12px;margin-top:20px;display:grid}.todo-form input{border:1px solid #cbd5e1;border-radius:10px;padding:12px 14px}.todo-form button,.delete-button{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:10px;padding:12px 16px}.todo-form button:disabled{opacity:.7;cursor:wait}.error-message{color:#b91c1c;margin-top:16px}.status-message{color:#4b5563;margin-top:20px}.todo-list{gap:12px;margin:20px 0 0;padding:0;list-style:none;display:grid}.todo-item{background:#f8fafc;border:1px solid #dbe3f0;border-radius:12px;justify-content:space-between;align-items:center;gap:16px;padding:16px;display:flex}.todo-title{margin:0;font-weight:700}.todo-date{color:#64748b;margin:6px 0 0;font-size:.9rem}.delete-button{background:#dc2626;flex-shrink:0}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=640px){.panel{padding:20px}.todo-form,.todo-item{grid-template-columns:1fr}.todo-item{display:grid}}