*{box-sizing:border-box}body{margin:0;font-family:system-ui,sans-serif;background-color:#444;transition:background-color .3s ease,color .3s ease}body.light{background-color:#f9fafb;color:#111827}body.dark{background-color:#0f172a;color:#e5e7eb}body.dark .search-input{background:#020617;color:#e5e7eb;border-color:#1e293b}article{background:#fff;border-radius:12px;padding:16px;transition:background .3s ease}body.dark article{background:#020617}header{display:flex;justify-content:space-between;align-items:center;padding:16px}.toggleTheme{border:none;padding:8px 12px;border-radius:8px;cursor:pointer;font-weight:600}body.dark .toggleTheme{background:#1e293b;color:#e5e7eb}body.light .toggleTheme{background:#e5e7eb;color:#111827}.app{max-width:1200px;margin:0 auto;padding:24px}.header{text-align:center;margin-bottom:32px}.header h1{margin-bottom:8px;font-size:2.2rem}.header p{color:#555}.filters{display:flex;justify-content:center;gap:12px;margin-bottom:32px}.filters button{padding:10px 18px;border-radius:6px;border:1px solid #ddd;background:#fff;cursor:pointer;font-weight:500;transition:background .2s ease,color .2s ease}.filters button:hover{background:#eef2ff}.filters button.active{background:#4f46e5;color:#fff;border-color:#4f46e5}section{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:768px){section{grid-template-columns:repeat(3,1fr)}}article{background:#fff;border-radius:10px;padding:20px;box-shadow:0 10px 20px #0000000d;transition:transform .2s ease,box-shadow .2s ease}article:hover{transform:translateY(-4px);box-shadow:0 14px 28px #00000014}body.dark article:hover{background:#020617}article h2{margin-top:0}article ul{padding-left:18px}article a{color:#4f46e5;text-decoration:none}article a:hover{text-decoration:underline}.level-badge{display:inline-block;margin-bottom:10px;padding:4px 10px;font-size:.75rem;font-weight:600;border-radius:999px;text-transform:capitalize}.level.beginner .level-badge{background:#dcfce7;color:#166534}.level.intermediate .level-badge{background:#fef9c3;color:#854d0e}.level.advanced .level-badge{background:#fee2e2;color:#991b1b}.progress{margin-bottom:24px}.progress-bar{height:8px;background:#e5e7eb;border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:#22c55e;width:auto;transition:.3s ease}.search-input{width:100%;padding:12px;margin-bottom:16px;border-radius:8px;border:1px solid #ccc}.grid{display:grid;gap:24px}@media(min-width:768px){.grid{grid-template-columns:repeat(3,1fr)}}.completed{border-left:6px solid #22c55e;opacity:.9}textarea{resize:none;overflow:hidden}.progress-wrapper{max-width:600px;margin:0 auto 2rem;text-align:center}.progress-text{font-size:.9rem;margin-bottom:.4rem;color:#444}.progress-bar{width:100%;height:12px;background:#e5e7eb;border-radius:999px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#2563eb,#4f46e5);width:0%;transition:width .4s ease}