:root{--primary-color: #a085e2;--secondary-color: #7fd1b9;--bg-light: #e2d4f7;--card-bg: #cdb5f2;--text-dark: #333333;--text-light: #f0ebfc;--font-body: "Montserrat", sans-serif;--font-button: "Poppins", sans-serif;--font-heading: "Sacramento", cursive;--font-code: "Courier New", monospace}body,main{margin:0;padding:0}html,body,#root{height:100%;margin:0}body{font-family:var(--font-body);color:var(--text-dark);background-color:var(--bg-light);line-height:1.5;margin:0;padding:0}a{text-decoration:none;color:inherit}h1,h2,h3,.task-card .task-title{font-family:var(--font-heading);font-size:3rem;text-align:center;letter-spacing:.5px;font-weight:400;margin-bottom:1.2rem;color:var(--primary-color)}code{font-family:var(--font-code)}.container{max-width:480px;margin:0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;min-height:auto}.app-content{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;padding-bottom:70px}button,.cta-button{font-family:var(--font-button);font-size:1rem;font-weight:500;padding:.8rem 1.5rem;cursor:pointer;transition:background-color .3s,color .3s,transform .2s,box-shadow .2s;box-shadow:0 3px 8px #0000001a;display:inline-block;text-align:center;border:none}button:hover,.cta-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #00000026}.cta-button,.cta-button.cta-task{background-color:var(--primary-color);color:var(--text-light);border-radius:999px;margin:1rem 0}header nav{display:flex;justify-content:center;gap:.5rem;margin-top:1rem}header nav a,.bottom-nav .nav-links a{background-color:var(--primary-color);color:var(--text-dark);border-radius:8px;padding:.5rem 1rem;font-weight:700;transition:background-color .3s,color .3s}footer .nav-links a{flex:1;text-align:center}header nav a:hover,.bottom-nav .nav-links a:hover{background-color:var(--primary-color);color:var(--text-light)}header nav a.active,.bottom-nav .nav-links a.active{background-color:var(--primary-color);color:var(--text-light)}@media(max-width:768px){header.hero-header nav{display:none;margin:0;padding:0;height:0;line-height:0}}@media(max-width:480px){main .app-content{min-height:auto}}