.buttons-container{display:flex;align-items:center;gap:10px}.checkbox{width:20px;height:20px;cursor:pointer}.button-group{display:flex;gap:5px}.button-group button{background:transparent;border:1px solid #dddddd33;border-radius:6px;font-size:15px;padding:4px 5px}.button-group button:hover,.history-controls button:hover{background:#0072b5;cursor:pointer}.history-controls{display:flex;justify-content:space-around}.history-controls button{background:transparent;border:1px solid #dddddd33;border-radius:6px;font-size:1rem;padding:4px 25px}:root{color-scheme:light;--bg-main: #f4f6fb;--bg-card: #ffffff;--bg-input: #eef2f7;--text-primary: #0f172a;--text-secondary: #475569;--text-muted: #94a3b8;--border-soft: rgba(15, 23, 42, .08);--border-strong: rgba(15, 23, 42, .16);--accent: #2563eb;--accent-hover: #1d4ed8;--accent-glow: rgba(37, 99, 235, .22);--danger: #ef4444;--shadow-soft: 0 6px 18px rgba(15, 23, 42, .06);--shadow-strong: 0 18px 48px rgba(15, 23, 42, .12);--radius: 14px;--ease: cubic-bezier(.22, .61, .36, 1)}@media(prefers-color-scheme:dark){:root{--bg-main: #0e1217;--bg-card: #161b22;--bg-input: #11161c;--text-primary: #e6edf3;--text-secondary: #9aa4af;--text-muted: #6b7280;--border-soft: rgba(148, 163, 184, .14);--border-strong: rgba(148, 163, 184, .28);--accent: #60a5fa;--accent-hover: #3b82f6;--accent-glow: rgba(96, 165, 250, .28);--danger: #ff6b6b;--shadow-soft: 0 8px 28px rgba(0, 0, 0, .45);--shadow-strong: 0 24px 70px rgba(0, 0, 0, .65)}}*{box-sizing:border-box}html{background:radial-gradient(circle at top,color-mix(in srgb,var(--bg-card) 92%,transparent),var(--bg-main));min-height:100%}body{margin:0;padding:24px 16px;color:var(--text-primary);font-family:system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;transition:background .25s var(--ease),color .2s var(--ease)}.main-app{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(180deg,var(--bg-card),color-mix(in srgb,var(--bg-card) 94%,transparent));border:1px solid var(--border-soft);border-radius:calc(var(--radius) + 4px);box-shadow:var(--shadow-strong);padding:1rem;width:100%;max-width:520px;display:flex;flex-direction:column;gap:1rem;margin:0 auto 4rem;overflow-y:auto;transition:all .25s var(--ease)}.main-app:hover{border-color:var(--border-strong)}.main-app::-webkit-scrollbar{width:10px}.main-app::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--accent),var(--accent-hover));border-radius:999px;border:2px solid transparent;background-clip:padding-box}.input-container{display:flex;gap:.6rem;width:100%}.input-container input{flex:1;padding:.85rem 1.05rem;border-radius:var(--radius);border:1px solid var(--border-soft);font-size:.98rem;background:var(--bg-input);color:var(--text-primary);outline:none;transition:all .18s var(--ease)}.input-container input:hover{border-color:var(--border-strong)}.input-container input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.input-container button{padding:.8rem 1.25rem;border:none;border-radius:var(--radius);font-weight:600;cursor:pointer;background:linear-gradient(135deg,var(--accent),var(--accent-hover));color:#0b0f14;transition:all .16s var(--ease)}.input-container button:hover{transform:translateY(-2px);box-shadow:0 10px 26px var(--accent-glow)}.input-container button:active{transform:translateY(0);box-shadow:none}.history-buttons{display:flex;gap:.5rem;justify-content:center}.history-buttons button{padding:.55rem .95rem;border-radius:10px;border:1px solid var(--border-soft);background:transparent;color:var(--text-secondary);cursor:pointer;transition:all .18s var(--ease)}.history-buttons button:hover:not(:disabled){background:var(--bg-input);color:var(--text-primary);transform:translateY(-1px)}.history-buttons button:disabled{opacity:.4;cursor:not-allowed}ul{list-style:none;display:flex;flex-direction:column;align-items:center;gap:.6rem;width:100%;padding:0;margin:0}.sortable-item{display:flex;align-items:center;justify-content:space-between;width:100%;background:linear-gradient(180deg,var(--bg-card),color-mix(in srgb,var(--bg-card) 96%,transparent));border:1px solid var(--border-soft);border-radius:var(--radius);padding:.75rem .7rem;cursor:pointer;transition:all .16s var(--ease);-webkit-user-select:none;user-select:none}.sortable-item:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--shadow-soft)}.sortable-item.dragging{box-shadow:var(--shadow-strong)}.drag-handle{touch-action:none;margin-right:.8rem;-webkit-user-select:none;user-select:none;font-size:1.15rem;color:var(--text-secondary);transition:all .15s var(--ease)}.drag-handle:hover{cursor:grab;color:var(--accent);transform:scale(1.08)}.drag-handle:active{cursor:grabbing}.completed-text,.normal-text{flex:1;text-align:left;max-width:18ch;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical}.completed-text{text-decoration:line-through;color:var(--text-muted)}.normal-text{color:var(--text-primary)}.item-buttons{display:flex;gap:.45rem}.item-buttons button{width:34px;height:34px;border-radius:10px;border:1px solid var(--border-soft);background:transparent;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .15s var(--ease)}.item-buttons button:hover{background:var(--bg-input);color:var(--text-primary);transform:translateY(-1px) scale(1.05);box-shadow:var(--shadow-soft)}.item-buttons .remove{color:var(--danger);border-color:#ef444459}.item-buttons .remove:hover{background:#ef44441f}.checkbox{width:20px;height:20px;accent-color:var(--accent);cursor:pointer;transition:transform .12s var(--ease)}.checkbox:hover{transform:scale(1.08)}.drag-overlay{box-shadow:var(--shadow-strong)}.sortable-item.source-hidden{opacity:.25}.sortable-item.overlay{pointer-events:none;box-shadow:var(--shadow-soft);background:var(--bg-card)}:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-glow);border-radius:8px}@media(max-width:600px){body{padding:16px 12px}.item-buttons button{width:30px;height:30px}.input-container button{padding:.75rem 1.05rem}.completed-text,.normal-text{max-width:14ch}}:root{--font: "Trebuchet MS", Arial, sans-serif;--bg: linear-gradient(135deg, #0f2027, #203a43, #2c5364);--text: #fff;--accent: #00aaff;--muted: #6c757d;--surface: #1c1c1c;--border: #00aaff;--btn-bg: #00aaff;--btn-text: #000;--btn-delete: #fdcace}header{display:flex;align-items:center;justify-content:center;margin:1rem 0}h1{font-size:1.2rem;color:var(--accent)}header a{color:var(--accent);text-decoration:none;border:1px solid #00f59f2e;padding:.5rem 1rem}header a:hover{color:var(--bg)}*{box-sizing:border-box;margin:0;padding:0;font-family:Trebuchet MS,Lucida Sans Unicode,Lucida Grande,Lucida Sans,Arial,sans-serif}body,html{margin:0;padding:0}.App-container{display:flex;flex-direction:column;align-items:center}