.auth-bg{min-height:100svh;background:linear-gradient(140deg,#4ecdc4 0%,#c084fc 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:100px 16px 60px;position:relative}.auth-logo-card{position:absolute;top:20px;left:50%;transform:translate(-50%);background:rgba(255,255,255,.9);border-radius:28px;box-shadow:0 16px 24px #0000001f;padding:18px 24px;display:flex;gap:10px;align-items:center;white-space:nowrap}.auth-logo-card .sparkle{position:absolute;top:-8px;right:-8px;font-size:24px;line-height:1}.auth-title{font-family:Fredoka One,cursive;font-size:clamp(32px,6vw,48px);color:#fff;text-align:center;line-height:1.3}.auth-subtitle{font-weight:600;font-size:clamp(14px,2.5vw,18px);color:#ffffffe6;text-align:center;margin-top:6px}.auth-form-card{background:white;border-radius:24px;box-shadow:0 20px 48px #0003;width:min(448px,100%);padding:clamp(20px,4vw,32px);margin-top:20px}.auth-tabs{display:flex;background:#f3f4f6;border-radius:18px;padding:4px;gap:6px;margin-bottom:20px}.auth-tab{flex:1;height:44px;border-radius:14px;font-family:Nunito,sans-serif;font-weight:700;font-size:15px;border:none;cursor:pointer;color:#666;background:transparent;transition:all .2s}.auth-tab.active-login{background:linear-gradient(165deg,#4ecdc4 0%,#c084fc 100%);color:#fff}.auth-tab.active-signup{background:linear-gradient(165deg,#ff6b6b 0%,#ffd43b 100%);color:#fff}.form-label{font-weight:700;font-size:15px;color:#364153;display:block;margin-bottom:6px}.form-input{width:100%;height:56px;border:3px solid #e5e7eb;border-radius:16px;padding:0 20px;font-family:Nunito,sans-serif;font-size:16px;color:#0a0a0a80;outline:none;margin-bottom:14px;transition:border-color .2s}.form-input:focus{border-color:#4ecdc4;color:#333}.form-input-wrap{position:relative;margin-bottom:14px}.form-input-wrap .form-input{margin-bottom:0}.eye-btn{position:absolute;right:16px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:18px;color:#888}.auth-error{color:#ef4444;font-size:14px;font-weight:600;margin-bottom:10px;text-align:center}.btn-login{width:100%;height:60px;border-radius:20px;border:none;cursor:pointer;font-family:Nunito,sans-serif;font-weight:800;font-size:18px;color:#fff;background:linear-gradient(169deg,#4ecdc4 0%,#c084fc 100%);box-shadow:0 8px 16px #0000001a;margin-top:6px;transition:opacity .2s}.btn-login:hover:not(:disabled){opacity:.9}.btn-login:disabled{opacity:.6;cursor:not-allowed}.btn-signup{width:100%;height:60px;border-radius:20px;border:none;cursor:pointer;font-family:Nunito,sans-serif;font-weight:800;font-size:18px;color:#fff;background:linear-gradient(169deg,#ff6b6b 0%,#ffd43b 100%);box-shadow:0 8px 16px #0000001a;margin-top:6px;transition:opacity .2s}.btn-signup:hover:not(:disabled){opacity:.9}.btn-signup:disabled{opacity:.6;cursor:not-allowed}.auth-dots{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;gap:10px}.auth-dot{width:14px;height:14px;border-radius:50%}.app-screen{display:flex;min-height:100svh;width:100%}.sidenav{width:clamp(60px,22vw,288px);background:linear-gradient(to bottom,#4ecdc4,#c084fc);border-right:3px solid rgba(255,255,255,.15);box-shadow:4px 0 24px #0000001f;flex-shrink:0;display:flex;flex-direction:column;position:sticky;top:0;height:100svh;overflow-y:auto;overflow-x:hidden;scrollbar-width:none}.sidenav::-webkit-scrollbar{display:none}.sidenav-header{padding:clamp(16px,2.5vw,32px) clamp(12px,2vw,32px) 0;display:flex;flex-direction:column;gap:6px}.sidenav-brand{display:flex;align-items:center;gap:10px}.sidenav-brand-name{font-family:Fredoka One,cursive;font-size:clamp(0px,1.8vw,26px);color:#fff;line-height:1.3;overflow:hidden;white-space:nowrap}.sidenav-tagline{font-weight:600;font-size:clamp(0px,1vw,13px);color:#fffc;padding-bottom:12px;overflow:hidden;white-space:nowrap}.sidenav-nav{padding:0 clamp(6px,1vw,16px);display:flex;flex-direction:column;gap:6px;flex:1}.nav-link{display:flex;align-items:center;gap:clamp(0px,1vw,16px);height:clamp(44px,5vw,58px);padding-left:clamp(8px,1.5vw,24px);border-radius:16px;cursor:pointer;transition:background .15s;text-decoration:none;color:#fffc;overflow:hidden}.nav-link:hover:not(.nav-active){background:rgba(255,255,255,.15)}.nav-active{background:white;box-shadow:0 8px 16px #0000001a;color:#4ecdc4!important}.nav-icon{width:22px;height:22px;flex-shrink:0}.nav-label{font-weight:700;font-size:clamp(0px,1.2vw,16px);color:inherit;white-space:nowrap;overflow:hidden}.sidenav-footer{margin:0 clamp(8px,1.5vw,24px) 20px;background:rgba(255,255,255,.2);border-radius:20px;padding:16px;text-align:center}.sidenav-footer p{font-weight:700;font-size:clamp(0px,1vw,14px);color:#ffffffe6;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.content-area{flex:1;min-width:0;display:flex;flex-direction:column;overflow-y:auto}.content-header{min-height:110px;border-radius:0 0 32px 32px;padding:clamp(16px,2.5vw,32px) clamp(16px,3vw,48px);display:flex;flex-direction:column;justify-content:center;gap:6px;flex-shrink:0}.content-header h1{font-family:Fredoka One,cursive;font-size:clamp(20px,2.5vw,32px);color:#fff;line-height:1.3}.content-header p{font-weight:600;font-size:clamp(13px,1.4vw,17px);color:#ffffffe6}.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,2vw,24px);padding:clamp(12px,2vw,24px)}.card{background:white;border-radius:24px;box-shadow:0 4px 6px #00000014,0 2px 4px #0000000f}.stepper-btn{width:clamp(52px,6vw,64px);height:clamp(52px,6vw,64px);border-radius:16px;border:none;background:linear-gradient(135deg,#ff6b6b,#ffd43b);color:#fff;font-size:clamp(28px,3vw,36px);font-weight:300;line-height:1;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #ff6b6b59;transition:transform .1s;-webkit-user-select:none;user-select:none}.stepper-btn:hover{transform:scale(1.07)}.stepper-btn:active{transform:scale(.94)}@media (max-width: 600px){.sidenav{width:56px}.sidenav-header{display:none}.sidenav-nav{padding:8px 6px;gap:4px;justify-content:center}.nav-link{height:48px;padding-left:0;justify-content:center;border-radius:12px}.nav-label,.sidenav-footer{display:none}.content-header{min-height:80px;padding:14px 16px;border-radius:0 0 20px 20px}.content-header h1{font-size:20px}.content-header p{font-size:13px}.content-grid{grid-template-columns:1fr;gap:12px;padding:12px}}@media (min-width: 601px) and (max-width: 900px){.sidenav{width:72px}.sidenav-header{display:none}.sidenav-nav{padding:12px 8px;gap:6px}.nav-link{height:52px;padding-left:0;justify-content:center}.nav-label,.sidenav-footer{display:none}.content-grid{grid-template-columns:1fr 1fr;gap:14px;padding:14px}}.home-bg{background:linear-gradient(180deg,#fff9e6 0%,#ffffff 100%)}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,1.5vw,16px)}.stat-mini{background:white;border-radius:20px;box-shadow:0 4px 6px #00000014;padding:clamp(12px,1.5vw,20px);border:3px solid transparent}.stat-mini-header{display:flex;align-items:center;gap:6px;margin-bottom:6px}.stat-mini-label{font-weight:600;font-size:clamp(11px,1vw,14px);color:#666}.stat-mini-value{font-family:Fredoka One,cursive;font-size:clamp(22px,2.5vw,32px);line-height:1.4}.stat-mini-sub{font-weight:600;font-size:clamp(10px,.9vw,13px);color:#999}.fun-fact-card{padding:clamp(16px,2vw,27px);border:3px solid #c084fc;margin-top:clamp(10px,1.5vw,24px)}.fun-fact-title{font-family:Fredoka One,cursive;font-size:clamp(16px,1.5vw,20px);color:#c084fc;margin-bottom:10px}.fun-fact-text{font-weight:600;font-size:clamp(12px,1.1vw,15px);color:#364153;line-height:1.6}.goal-card{background:linear-gradient(to bottom,#ffd43b,#ff6b6b);border-radius:28px;box-shadow:0 8px 16px #0000001a;padding:clamp(16px,2vw,24px);display:flex;flex-direction:column;gap:clamp(10px,1.5vw,16px)}.goal-card-header{display:flex;align-items:center;gap:8px}.goal-card-title{font-family:Fredoka One,cursive;font-size:clamp(16px,1.8vw,22px);color:#fff}.goal-input-row{display:flex;align-items:center;gap:10px}.goal-stepper{display:flex;align-items:center;gap:8px;background:white;border-radius:20px;padding:8px;flex:1}.goal-stepper input{font-family:Fredoka One,cursive;font-size:clamp(22px,2.5vw,30px);background:linear-gradient(135deg,#ffd43b,#ff6b6b);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-align:center;border:none;outline:none;flex:1;min-width:0;width:0;-moz-appearance:textfield}.goal-stepper input::-webkit-outer-spin-button,.goal-stepper input::-webkit-inner-spin-button{-webkit-appearance:none}.goal-minutes-label{font-weight:700;font-size:clamp(14px,1.5vw,18px);color:#fff;white-space:nowrap}.goal-update-btn{background:white;border-radius:16px;height:46px;border:none;cursor:pointer;width:100%;font-weight:800;font-size:clamp(13px,1.3vw,16px);color:#ff6b6b;box-shadow:0 4px 6px #00000014;transition:opacity .2s}.goal-update-btn:hover:not(:disabled){opacity:.85}.goal-update-btn:disabled{opacity:.6;cursor:not-allowed}.goal-motivate{font-weight:600;font-size:clamp(12px,1.1vw,15px);color:#ffffffe6;text-align:center}.goal-saved-msg{font-weight:700;font-size:13px;color:#fffffff2;text-align:center;margin-top:-6px}.log-bg{background:linear-gradient(180deg,#fff0f5 0%,#ffffff 100%)}.log-split{display:flex;gap:clamp(12px,2vw,24px);padding:clamp(12px,2vw,24px);align-items:stretch;flex:1}.log-panel{flex:1;min-width:0;display:flex;flex-direction:column}.log-form-card{flex:1;border:4px solid #ffd43b;padding:clamp(16px,2.5vw,28px);border-radius:28px;box-shadow:0 16px 24px #0000001a;display:flex;flex-direction:column;background:white}.log-form-gap{flex:1;min-height:16px}.log-form-label{display:flex;align-items:center;gap:8px;margin-bottom:10px}.log-form-label span{font-weight:700;font-size:clamp(14px,1.5vw,18px);color:#333}.minutes-input-box{border:3px solid #e5e7eb;border-radius:20px;height:90px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;gap:8px;margin-bottom:14px}.minutes-input-box input{font-family:Fredoka One,cursive;font-size:clamp(32px,4vw,48px);color:#ff6b6b;text-align:center;border:none;outline:none;background:transparent;flex:1;min-width:0;-moz-appearance:textfield}.minutes-input-box input::-webkit-outer-spin-button,.minutes-input-box input::-webkit-inner-spin-button{-webkit-appearance:none}.log-field-label{font-weight:700;font-size:clamp(13px,1.2vw,15px);color:#364153;display:block;margin-bottom:6px;margin-top:2px}.log-text-input{width:100%;height:50px;border:3px solid #e5e7eb;border-radius:16px;padding:0 16px;font-family:Nunito,sans-serif;font-size:15px;color:#333;outline:none;margin-bottom:12px;transition:border-color .2s;background:white}.log-text-input:focus{border-color:#ffd43b}.log-date-input{width:100%;height:50px;border:3px solid #e5e7eb;border-radius:16px;padding:0 16px;font-family:Nunito,sans-serif;font-size:15px;font-weight:600;color:#333;outline:none;margin-bottom:14px;transition:border-color .2s;background:white;cursor:pointer}.log-date-input:focus{border-color:#ffd43b}.btn-log{width:100%;height:60px;border-radius:20px;border:none;cursor:pointer;font-weight:800;font-size:clamp(15px,1.8vw,19px);color:#fff;background:linear-gradient(165deg,#ff6b6b 0%,#ffd43b 100%);box-shadow:0 8px 16px #0000001a;transition:opacity .2s}.btn-log:hover:not(:disabled){opacity:.9}.btn-log:disabled{opacity:.6;cursor:not-allowed}.recent-logs-title{display:flex;align-items:center;gap:8px;margin-bottom:12px;flex-shrink:0}.recent-logs-title span{font-family:Fredoka One,cursive;font-size:clamp(18px,2vw,24px);color:#333}.log-list-scroll{flex:1;overflow-y:auto;padding-right:4px;scrollbar-width:thin;scrollbar-color:#e5e7eb transparent}.log-list-scroll::-webkit-scrollbar{width:6px}.log-list-scroll::-webkit-scrollbar-track{background:transparent}.log-list-scroll::-webkit-scrollbar-thumb{background:#e5e7eb;border-radius:3px}.log-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:clamp(24px,4vw,48px) 20px;height:100%;min-height:200px;gap:12px}.log-empty-illustration{font-size:clamp(48px,8vw,80px);line-height:1;filter:grayscale(.2) opacity(.75)}.log-empty-title{font-family:Fredoka One,cursive;font-size:clamp(18px,2vw,22px);color:#4a5565}.log-empty-text{font-weight:600;font-size:clamp(13px,1.2vw,15px);color:#99a1af;line-height:1.6;max-width:220px}.btn-log-first{height:48px;padding:0 24px;border-radius:16px;border:none;cursor:pointer;font-weight:800;font-size:15px;color:#fff;background:linear-gradient(165deg,#ff6b6b 0%,#ffd43b 100%);box-shadow:0 4px 10px #0000001a;transition:opacity .2s;margin-top:4px}.btn-log-first:hover{opacity:.9}.log-entry{background:white;border:3px solid #f0f0f0;border-radius:20px;padding:0 clamp(14px,2vw,24px);min-height:clamp(72px,8vw,88px);display:flex;align-items:center;justify-content:space-between;box-shadow:0 3px 6px #00000012;margin-bottom:10px;flex-shrink:0;gap:8px}.log-entry.highlight{background:linear-gradient(164deg,#4ecdc4 0%,#c084fc 100%);border:none}.log-entry-left{display:flex;flex-direction:column;min-width:0}.log-day{font-weight:700;font-size:clamp(13px,1.3vw,16px);color:#4a5565}.log-weekday{font-weight:600;font-size:clamp(11px,1vw,13px);color:#99a1af;margin-top:2px}.log-book{font-weight:600;font-size:clamp(11px,1vw,12px);color:#aab0bb;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:140px}.log-entry.highlight .log-day{color:#fff}.log-entry.highlight .log-weekday{color:#fffc}.log-entry.highlight .log-book{color:#ffffffbf}.log-entry-right{text-align:right;flex-shrink:0}.log-mins{font-family:Fredoka One,cursive;font-size:clamp(20px,2.2vw,28px);color:#ff6b6b}.log-mins-label{font-weight:600;font-size:clamp(10px,.9vw,13px);color:#6a7282}.log-entry.highlight .log-mins{color:#fff}.log-entry.highlight .log-mins-label{color:#fffc}.log-error{color:#ef4444;font-size:13px;font-weight:700;text-align:center;margin-top:8px}@media (max-width: 600px){.log-split{flex-direction:column;overflow-y:visible}.log-panel,.log-form-card{flex:none}.log-list-scroll{max-height:none;overflow-y:visible}}.progress-bg{background:linear-gradient(180deg,#e6f7ff 0%,#ffffff 100%)}.donut-card{border:4px solid #ffd43b;border-radius:28px;padding:clamp(16px,2vw,24px);box-shadow:0 16px 24px #0000001a;display:flex;align-items:center;justify-content:center;position:relative;background:white}.donut-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}.donut-percent{font-family:Fredoka One,cursive;font-size:clamp(28px,3.5vw,40px);color:#ff6b6b;line-height:1.3}.donut-label{font-weight:700;font-size:clamp(11px,1vw,14px);color:#4a5565;white-space:nowrap}.motivate-banner{border-radius:24px;padding:clamp(16px,2vw,20px);text-align:center;font-family:Fredoka One,cursive;font-size:clamp(16px,1.8vw,22px);color:#fff;box-shadow:0 8px 16px #0000001a;line-height:1.4;margin-top:clamp(12px,1.5vw,24px)}.power-meter-card{border:3px solid #4ecdc4;border-radius:24px;padding:clamp(16px,2vw,20px);box-shadow:0 3px 6px #00000014;background:white;margin-top:clamp(12px,1.5vw,24px)}.power-meter-title{display:flex;align-items:center;gap:8px;margin-bottom:16px}.power-meter-title span{font-family:Fredoka One,cursive;font-size:clamp(14px,1.5vw,19px);color:#333}.progress-bar-track{background:#e5e7eb;border-radius:9999px;height:28px;overflow:hidden;margin-bottom:10px}.progress-bar-fill{height:100%;border-radius:9999px;background:linear-gradient(to right,#ff6b6b,#ffd43b);transition:width .6s ease}.progress-bar-labels{display:flex;justify-content:space-between;padding:0 2px}.progress-bar-label{display:flex;flex-direction:column;align-items:center;gap:2px;font-weight:700;font-size:clamp(10px,.9vw,12px);color:#364153}.progress-bar-label .inactive{color:#99a1af}.star-icon{font-size:12px}.streak-card{border:3px solid #c084fc;border-radius:24px;padding:clamp(16px,2vw,20px);box-shadow:0 3px 6px #00000014;background:white}.streak-title{display:flex;align-items:center;gap:8px;margin-bottom:4px}.streak-title span{font-family:Fredoka One,cursive;font-size:clamp(14px,1.5vw,19px);color:#333}.streak-month{font-weight:600;font-size:clamp(12px,1vw,14px);color:#4a5565;margin-bottom:12px}.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}.cal-day-label{font-weight:700;font-size:clamp(10px,.9vw,12px);color:#6a7282;text-align:center;padding:3px 0}.cal-day{width:100%;aspect-ratio:1;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:clamp(10px,.9vw,12px);color:#364153;box-sizing:border-box}.cal-day.is-today{border:2px solid #4ecdc4}.streak-legend{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:10px;font-weight:600;font-size:clamp(10px,.9vw,12px);color:#999}.legend-box{width:14px;height:14px;border-radius:3px;flex-shrink:0}.profile-bg{background:linear-gradient(180deg,#f5e6ff 0%,#ffffff 100%)}.profile-card{border:4px solid #ffd43b;border-radius:28px;padding:clamp(20px,2.5vw,32px);box-shadow:0 16px 24px #0000001a;display:flex;flex-direction:column;align-items:center;text-align:center;background:white}.avatar-circle{width:clamp(72px,8vw,96px);height:clamp(72px,8vw,96px);border-radius:50%;background:linear-gradient(135deg,#ff6b6b 0%,#ffd43b 100%);display:flex;align-items:center;justify-content:center;margin-bottom:12px}.avatar-letter{font-family:Fredoka One,cursive;font-size:clamp(32px,4vw,48px);color:#fff;line-height:1}.profile-username{font-family:Fredoka One,cursive;font-size:clamp(22px,2.5vw,30px);color:#333;margin-bottom:12px}.profile-badge{background:#ffd43b;border-radius:9999px;padding:6px 18px;font-weight:800;font-size:clamp(11px,1vw,14px);color:#fff}.keep-it-up-card{background:linear-gradient(to bottom,#ffd43b,#ff6b6b);border-radius:24px;padding:clamp(16px,2vw,22px);box-shadow:0 8px 16px #0000001a;margin-top:clamp(12px,1.5vw,20px)}.keep-title{font-family:Fredoka One,cursive;font-size:clamp(18px,1.8vw,22px);color:#fff;margin-bottom:8px}.keep-text{font-weight:600;font-size:clamp(12px,1.1vw,15px);color:#ffffffe6;line-height:1.6}.profile-edit-card{background:white;border:3px solid #e5e7eb;border-radius:24px;padding:clamp(16px,2vw,22px);box-shadow:0 4px 6px #00000012;margin-top:clamp(12px,1.5vw,20px)}.profile-edit-label{font-weight:700;font-size:14px;color:#364153;display:block;margin-bottom:8px}.profile-edit-input{width:100%;height:50px;border:3px solid #e5e7eb;border-radius:14px;padding:0 16px;font-family:Nunito,sans-serif;font-size:15px;font-weight:600;color:#333;outline:none;margin-bottom:10px;transition:border-color .2s}.profile-edit-input:focus{border-color:#c084fc}.btn-save-username{width:100%;height:46px;border-radius:14px;border:none;cursor:pointer;font-weight:800;font-size:15px;color:#fff;background:linear-gradient(135deg,#c084fc 0%,#4ecdc4 100%);box-shadow:0 4px 8px #0000001a;transition:opacity .2s}.btn-save-username:hover:not(:disabled){opacity:.88}.btn-save-username:disabled{opacity:.6;cursor:not-allowed}.profile-edit-success{font-size:13px;font-weight:700;color:#22c55e;text-align:center;margin-top:6px}.profile-stat-card{background:white;border-radius:20px;box-shadow:0 3px 6px #00000014;padding:0 clamp(14px,1.8vw,24px);height:clamp(80px,9vw,110px);display:flex;align-items:center;gap:12px;border:3px solid transparent;margin-bottom:clamp(10px,1.5vw,20px)}.profile-stat-icon{width:clamp(44px,5vw,56px);height:clamp(44px,5vw,56px);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:clamp(20px,2.2vw,26px)}.profile-stat-label{font-weight:600;font-size:clamp(11px,1vw,14px);color:#4a5565;margin-bottom:2px}.profile-stat-value{font-family:Fredoka One,cursive;font-size:clamp(22px,2.5vw,28px)}.btn-logout{width:100%;height:clamp(52px,6vw,64px);border-radius:20px;border:3px solid #e0e0e0;background:white;cursor:pointer;font-weight:800;font-size:clamp(14px,1.4vw,17px);color:#364153;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 3px 6px #00000014;transition:background .2s}.btn-logout:hover{background:#f9f9f9}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Nunito,sans-serif;background:#e8e8e8;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}