:root{--primary-contrast:#0b151e;--secondary-contrast:#0b151e99;--background-gradient:linear-gradient(90deg,#ffca28,#f57c00);--background:#ffca28;--muted:rgba(194,137,3,.3);--surface:#e99e1d;--border:transparent;--top-gradient:#ffffff33;--bottom-gradient-top:#ffffff75;--bottom-gradient-bottom:transparent;--button:#0b151e}.dark-theme{--primary-contrast:#fff;--secondary-contrast:#ffffff99;--background-gradient:linear-gradient(90deg,#0b151e,#0b151e);--background:#0b151e;--muted:rgba(21,39,60,.6);--surface:#112031;--border:#ffffff20;--top-gradient:#1b72e833;--bottom-gradient-top:#1b72e8;--bottom-gradient-bottom:#1b72e850;--button:linear-gradient(90deg,#ffca28,#f57c00)}*{margin:0;font-family:Google Sans}html{background:var(--background)}body{color:var(--primary-contrast);background:var(--background-gradient);min-height:100dvh;display:flex;flex-direction:column;align-items:center;padding-top:80px;position:relative}.navigation{position:fixed;top:0;left:0;right:0;z-index:100;background:var(--surface);border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.nav-container{max-width:1200px;margin:0 auto;padding:16px 24px;display:flex;justify-content:space-between;align-items:center;gap:20px}.nav-logo{text-decoration:none;transition:opacity .2s}.nav-logo:hover{opacity:.8}.nav-logo-text{font-size:24px;font-weight:700;background:var(--button);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-actions{gap:12px}.nav-actions,.nav-loading{display:flex;align-items:center}.nav-loading{padding:8px}.nav-loading-spinner{width:20px;height:20px;border:2px solid var(--border);border-top-color:var(--primary-contrast);border-radius:50%;animation:spin 1s linear infinite}.nav-user{display:flex;align-items:center;gap:16px}.nav-user-name{font-size:14px;color:var(--secondary-contrast);max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-auth-buttons{display:flex;align-items:center;gap:8px}.nav-button{color:var(--background);background:var(--button)}.nav-button,.nav-button-secondary{padding:10px 20px;font-size:14px;font-weight:500}.nav-button-secondary{color:var(--primary-contrast);background:transparent;border:1px solid var(--border)}.nav-button-secondary:hover{background:var(--surface)}.dots{pointer-events:none;height:100%;background-image:radial-gradient(circle at center,var(--muted) 2px,transparent 2px);background-size:30px 30px;background-position:12px 12px;-webkit-mask-image:linear-gradient(180deg,#000 0,transparent 50%);mask-image:linear-gradient(180deg,#000 0,transparent 50%)}.dots,.top-gradient{position:absolute;top:0;left:0;width:100%}.top-gradient{height:25vh;background:linear-gradient(180deg,transparent 0,var(--top-gradient) 50%);-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 10vw));clip-path:polygon(0 0,100% 0,100% 100%,0 calc(100% - 10vw))}.bottom-gradient{position:fixed;bottom:0;width:90%;height:900px;margin-bottom:-550px;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;--top:var(--bottom-gradient-top);--bottom:var(--bottom-gradient-bottom);--first:conic-gradient(from 90deg at 0% 50%,var(--top),var(--bottom));--second:conic-gradient(from 270deg at 100% 50%,var(--bottom),var(--top));-webkit-mask-image:radial-gradient(closest-side at 50% 50%,var(--background),transparent);mask-image:radial-gradient(closest-side at 50% 50%,var(--background),transparent);background-image:var(--first),var(--second);background-position-x:0,100%;background-position-y:100%,0;background-repeat:no-repeat;opacity:.4;transform:translateY(-200px) rotate(180deg) translateZ(0);transform-origin:center center}.hero{display:flex;flex-direction:column;gap:20px;text-align:center;max-width:800px}.hero,.hero-badge{align-items:center}.hero-badge{display:inline-flex;gap:6px;padding:8px 20px;background:rgba(255,202,40,.15);border:1px solid rgba(255,202,40,.3);border-radius:100px;font-size:14px;font-weight:500;color:var(--primary-contrast)}.hero-title{font-size:80px;font-weight:700;letter-spacing:-2%;background:var(--button);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-top:8px}.hero-subtitle{font-size:32px;font-weight:500;color:var(--primary-contrast);line-height:1.4;margin-top:-8px}.hero-description{font-size:17px;color:var(--secondary-contrast);line-height:1.7;max-width:600px;margin-top:8px}.cta-button{margin-top:24px;font-size:18px;padding:18px 40px;color:var(--background);background:var(--button);font-weight:600}.button{font-size:15px;line-height:1.3;font-weight:500;padding:11px 16px;border-radius:100px;border:none;cursor:pointer;transition:scale .2s,filter .2s}.button:hover{filter:brightness(1.1)}.button:active{scale:.97}.content{margin:60px 12px 80px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:100px;max-width:1200px;width:100%}.features-intro{text-align:center;margin-bottom:48px}.section-title{font-size:40px;font-weight:600;text-align:center;margin:0;color:var(--primary-contrast)}.features-section{width:100%;display:flex;flex-direction:column;align-items:center}.features-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:20px;gap:20px;width:100%}.feature-card{position:relative;border-radius:28px;background:var(--surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:40px 36px;display:flex;flex-direction:column;gap:18px;border:1px solid var(--border);transition:transform .3s ease,border-color .3s ease}.feature-card:hover{transform:translateY(-6px);border-color:rgba(255,202,40,.3)}.feature-card.primary{background:linear-gradient(135deg,rgba(27,114,232,.08),rgba(255,202,40,.06));border:1.5px solid rgba(255,202,40,.25)}.feature-card.primary:hover{border-color:rgba(255,202,40,.5)}.feature-icon{font-size:64px;line-height:1;margin-bottom:4px}.feature-card h3{font-size:24px;font-weight:600;color:var(--primary-contrast);margin:0;line-height:1.3}.feature-card p{font-size:16px;line-height:1.7;color:var(--secondary-contrast);margin:0}.card{position:relative;border-radius:24px;background:var(--surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;flex-direction:column;padding:24px;gap:12px}.card h2,.card h3{font-size:20px;line-height:1.3;font-weight:600;letter-spacing:-1%;color:var(--primary-contrast)}.card p{font-size:14px;line-height:1.6;color:var(--secondary-contrast);letter-spacing:-1%}.card:before{content:"";position:absolute;inset:0;border-radius:24px;padding:1px;background:linear-gradient(var(--border),transparent 30%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.cta-section{width:100%;max-width:750px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;padding:70px 40px;border-radius:36px;background:linear-gradient(135deg,rgba(27,114,232,.08),rgba(255,202,40,.06));border:1.5px solid rgba(255,202,40,.25);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.cta-icon{font-size:72px;line-height:1;margin-bottom:8px}.cta-section-title{font-size:36px;font-weight:700;color:var(--primary-contrast);margin:0;line-height:1.3}.cta-section-description{font-size:17px;line-height:1.7;color:var(--secondary-contrast);margin:0;max-width:550px}.cta-button-large{margin-top:16px;font-size:20px;padding:20px 48px;color:var(--background);background:var(--button);font-weight:600}.cta-note{font-size:14px;color:var(--secondary-contrast);margin:8px 0 0;opacity:.8}@media only screen and (max-width:1023px){body{padding-top:70px}.nav-container{padding:12px 16px}.nav-logo-text{font-size:20px}.nav-user-name{display:none}.nav-button,.nav-button-secondary{padding:8px 16px;font-size:13px}.content{gap:70px;margin:40px 16px 60px}.hero-badge{font-size:13px;padding:7px 16px}.hero-title{font-size:56px}.hero-subtitle{font-size:24px}.hero-description{font-size:16px}.cta-button{font-size:17px;padding:16px 36px}.section-title{font-size:32px}.features-intro{margin-bottom:36px}.features-grid{grid-template-columns:1fr;gap:16px}.feature-card{padding:32px 28px}.feature-icon{font-size:56px}.feature-card h3{font-size:22px}.feature-card p{font-size:15px}.cta-section{padding:50px 28px}.cta-icon{font-size:60px}.cta-section-title{font-size:28px}.cta-section-description{font-size:16px}.cta-button-large{font-size:18px;padding:18px 40px}.cta-note{font-size:13px}.bottom-gradient{width:150%;height:400px;margin-bottom:-450px}}@media only screen and (min-width:768px) and (max-width:1023px){.hero-title{font-size:64px}.features-grid{grid-template-columns:repeat(2,1fr)}}.auth-container{display:flex;justify-content:center;align-items:center;width:100%;max-width:480px;margin:60px 0}.auth-card{width:100%;background:var(--surface);border:1px solid var(--border);border-radius:28px;padding:48px 40px;gap:32px}.auth-card,.auth-header{display:flex;flex-direction:column}.auth-header{text-align:center;gap:8px}.auth-title{font-size:48px;font-weight:700;background:var(--button);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0}.auth-subtitle{font-size:18px;color:var(--secondary-contrast);margin:0}.google-button{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 24px;font-size:16px;font-weight:500;background:#fff;color:#1f1f1f;border:1px solid #dadce0;transition:background .2s,border-color .2s}.google-button:hover{background:#f8f9fa;border-color:#d2d4d8}.google-button:disabled{opacity:.6;cursor:not-allowed}.divider{display:flex;align-items:center;text-align:center;color:var(--secondary-contrast);margin:8px 0}.divider:after,.divider:before{content:"";flex:1 1;border-bottom:1px solid var(--border)}.divider span{padding:0 16px;font-size:14px}.auth-form{gap:20px}.auth-form,.form-group{display:flex;flex-direction:column}.form-group{gap:8px}.form-label{font-size:14px;font-weight:500}.form-input,.form-label{color:var(--primary-contrast)}.form-input{width:100%;padding:12px 16px;font-size:15px;font-family:Google Sans;background:var(--background);border:1px solid var(--border);border-radius:12px;outline:none;transition:border-color .2s,background .2s;box-sizing:border-box}.form-input::placeholder{color:var(--secondary-contrast);opacity:.6}.form-input:focus{border-color:rgba(255,202,40,.5);background:var(--surface)}.form-input:disabled{opacity:.6;cursor:not-allowed}.submit-button{width:100%;padding:14px 24px;font-size:16px;font-weight:600;color:var(--background);background:var(--button);margin-top:8px}.submit-button:disabled{opacity:.6;cursor:not-allowed}.error-message{padding:12px 16px;background:rgba(234,67,53,.1);border:1px solid rgba(234,67,53,.3);border-radius:12px;color:#ea4335}.error-message,.success-message{font-size:14px;text-align:center}.success-message{padding:16px;background:rgba(52,168,83,.1);border:1px solid rgba(52,168,83,.3);border-radius:12px;color:#34a853;line-height:1.6}.success-message p{margin:8px 0}.success-message p:first-child{margin-top:0}.success-message p:last-child{margin-bottom:0}.reset-description{line-height:1.6;margin:-8px 0 0}.auth-footer,.reset-description{font-size:14px;color:var(--secondary-contrast);text-align:center}.auth-footer{display:flex;flex-direction:column;gap:8px}.auth-footer p{margin:0}.auth-link{color:var(--primary-contrast);font-weight:600;text-decoration:none;transition:opacity .2s}.auth-link:hover{opacity:.8}.todos-container{width:100%;max-width:900px;display:flex;flex-direction:column;gap:32px;margin-top:60px;margin-bottom:80px}.todos-header{background:var(--surface);border:1px solid var(--border);border-radius:28px;padding:32px 40px}.todos-header-content{display:flex;justify-content:space-between;align-items:center;gap:20px}.todos-title{font-size:36px;font-weight:700;background:var(--button);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin:0}.todos-subtitle{font-size:16px;color:var(--secondary-contrast);margin:8px 0 0}.signout-button{padding:12px 24px;font-size:15px;font-weight:500;color:var(--primary-contrast);background:var(--background);border:1px solid var(--border);white-space:nowrap}.todos-content{background:var(--surface);border:1px solid var(--border);border-radius:28px;padding:40px;min-height:400px;gap:24px}.todos-content,.todos-placeholder{display:flex;flex-direction:column}.todos-placeholder{text-align:center;align-items:center;gap:16px;max-width:500px}.placeholder-icon{font-size:80px;line-height:1;opacity:.8}.placeholder-title{font-size:28px;font-weight:600;color:var(--primary-contrast);margin:0}.placeholder-description{font-size:16px;line-height:1.7;color:var(--secondary-contrast);margin:0}.todo-form{display:flex;gap:12px;align-items:center}.todo-input{flex:1 1;padding:14px 20px;font-size:16px;font-family:Google Sans;color:var(--primary-contrast);background:var(--background);border:1px solid var(--border);border-radius:16px;outline:none;transition:border-color .2s}.todo-input::placeholder{color:var(--secondary-contrast);opacity:.6}.todo-input:focus{border-color:rgba(255,202,40,.5)}.todo-add-button{padding:14px 28px;font-size:15px;font-weight:600;color:var(--background);background:var(--button);white-space:nowrap}.todo-stats{display:flex;align-items:center;gap:12px;padding:12px 20px;background:var(--background);border-radius:12px;font-size:14px;color:var(--secondary-contrast);justify-content:center}.todo-stats span:not(:nth-child(2)):not(:nth-child(4)){font-weight:500}.todo-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:80px 20px;text-align:center}.todo-empty-icon{font-size:64px;opacity:.5}.todo-empty-text{font-size:16px;color:var(--secondary-contrast);margin:0;line-height:1.6}.todo-empty-text small{font-size:14px;opacity:.7}.todo-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.todo-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;background:var(--background);border:1px solid var(--border);border-radius:12px;transition:all .2s}.todo-item:hover{border-color:rgba(255,202,40,.3);transform:translateX(4px)}.todo-item-content{display:flex;align-items:center;gap:14px;flex:1 1;min-width:0}.todo-checkbox{width:20px;height:20px;cursor:pointer;flex-shrink:0;accent-color:#ffca28}.todo-text{font-size:15px;color:var(--primary-contrast);line-height:1.5;word-break:break-word}.todo-text.completed{text-decoration:line-through;opacity:.5}.todo-delete-button{padding:8px 12px;background:transparent;border:none;border-radius:8px;cursor:pointer;font-size:18px;opacity:.6;transition:all .2s;flex-shrink:0}.todo-delete-button:hover{opacity:1;background:rgba(234,67,53,.1)}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;min-height:400px}.loading-spinner{width:48px;height:48px;border:4px solid var(--border);border-top-color:var(--primary-contrast);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.loading-text{font-size:16px;color:var(--secondary-contrast);margin:0}@media only screen and (max-width:1023px){.auth-card{padding:36px 28px}.auth-title{font-size:40px}.todos-header{padding:24px 28px}.todos-header-content{flex-direction:column;align-items:flex-start}.todos-title{font-size:28px}.todos-subtitle{font-size:15px}.signout-button{width:100%}.todos-content{padding:28px 20px}.todo-form{flex-direction:column}.todo-add-button{width:100%}.todo-stats{font-size:13px;padding:10px 16px}.todo-item{padding:14px 16px}.todo-text{font-size:14px}.placeholder-icon{font-size:64px}.placeholder-title{font-size:24px}.placeholder-description{font-size:15px}}