*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg:#f8f9fc;--color-surface:#fff;--color-primary:#6366f1;--color-primary-hover:#4f46e5;--color-primary-light:#e0e7ff;--color-text:#1e293b;--color-text-secondary:#64748b;--color-border:#e2e8f0;--color-success:#22c55e;--color-danger:#ef4444;--color-danger-hover:#dc2626;--color-warning:#f59e0b;--radius:12px;--radius-sm:8px;--shadow:0 1px 3px #0000000f, 0 1px 2px #0000000a;--shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -2px #0000000d;--shadow-lg:0 10px 15px -3px #00000014, 0 4px 6px -4px #0000000a}body{background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.6}input,button,select{font-family:inherit;font-size:inherit}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}.auth-container{justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.auth-card{background:var(--color-surface);border-radius:var(--radius);box-shadow:var(--shadow-lg);width:100%;max-width:420px;padding:2.5rem}.auth-card h1{color:var(--color-text);margin-bottom:.25rem;font-size:1.75rem;font-weight:700}.auth-card .subtitle{color:var(--color-text-secondary);margin-bottom:2rem;font-size:.95rem}.form-group{margin-bottom:1.25rem}.form-group label{color:var(--color-text);margin-bottom:.375rem;font-size:.875rem;font-weight:500;display:block}.form-group input,.form-group select{border:1.5px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-surface);width:100%;color:var(--color-text);padding:.625rem .875rem;font-size:.95rem;transition:border-color .15s,box-shadow .15s}.form-group input:focus,.form-group select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.btn{border-radius:var(--radius-sm);cursor:pointer;border:none;justify-content:center;align-items:center;gap:.5rem;padding:.625rem 1.25rem;font-size:.95rem;font-weight:600;transition:background-color .15s,transform .1s;display:inline-flex}.btn:active{transform:scale(.98)}.btn-primary{background:var(--color-primary);color:#fff;width:100%}.btn-primary:hover{background:var(--color-primary-hover)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-danger{color:var(--color-danger);background:0 0;padding:.375rem .625rem;font-size:.85rem}.btn-danger:hover{background:#fef2f2}.btn-ghost{color:var(--color-text-secondary);background:0 0;padding:.375rem .625rem;font-size:.85rem}.btn-ghost:hover{background:var(--color-bg);color:var(--color-text)}.error-message{color:var(--color-danger);border-radius:var(--radius-sm);background:#fef2f2;border:1px solid #fecaca;margin-bottom:1rem;padding:.75rem 1rem;font-size:.875rem}.dashboard{max-width:720px;margin:0 auto;padding:1.5rem 1rem 3rem}.dashboard-header{justify-content:space-between;align-items:flex-start;margin-bottom:2rem;display:flex}.dashboard-header h1{font-size:1.5rem;font-weight:700}.welcome-text{color:var(--color-text);margin-top:.25rem;font-size:1.05rem;font-weight:600}.today-date{color:var(--color-text-secondary);margin-top:.125rem;font-size:.85rem}.header-actions{flex-shrink:0;align-items:center;gap:.5rem;display:flex}.team-btn{background:var(--color-primary-light);color:var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;border:none;padding:.375rem .75rem;font-size:.8rem;font-weight:600;transition:all .15s}.team-btn:hover{background:var(--color-primary);color:#fff}.logout-btn{border:1px solid var(--color-border);color:var(--color-text-secondary);border-radius:var(--radius-sm);cursor:pointer;background:0 0;padding:.375rem .75rem;font-size:.8rem;font-weight:500;transition:all .15s}.logout-btn:hover{border-color:var(--color-danger);color:var(--color-danger)}.card{background:var(--color-surface);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1.25rem;padding:1.5rem}.card-title{color:var(--color-text);margin-bottom:1rem;font-size:1rem;font-weight:600}.add-habit-form{gap:.5rem;margin-bottom:1rem;display:flex}.add-habit-form input{border:1.5px solid var(--color-border);border-radius:var(--radius-sm);flex:1;padding:.5rem .75rem;font-size:.9rem}.add-habit-form input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.add-habit-form button{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;padding:.5rem 1rem;font-size:.9rem;font-weight:600;transition:background-color .15s}.add-habit-form button:hover{background:var(--color-primary-hover)}.add-habit-form-extended{margin-bottom:1rem}.habit-input-row{gap:.5rem;margin-bottom:.5rem;display:flex}.habit-input-row input{border:1.5px solid var(--color-border);border-radius:var(--radius-sm);flex:1;padding:.5rem .75rem;font-size:.9rem}.habit-input-row input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.habit-input-row button{background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;white-space:nowrap;border:none;padding:.5rem 1rem;font-size:.9rem;font-weight:600;transition:background-color .15s}.habit-input-row button:hover{background:var(--color-primary-hover)}.habit-options-row{gap:.5rem;display:flex}.frequency-select,.day-select{border:1.5px solid var(--color-border);border-radius:var(--radius-sm);color:var(--color-text);background:var(--color-surface);cursor:pointer;padding:.375rem .625rem;font-size:.85rem}.frequency-select:focus,.day-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light);outline:none}.team-panel{border:1.5px solid var(--color-primary-light)}.team-msg{color:var(--color-primary);background:var(--color-primary-light);border-radius:var(--radius-sm);margin-bottom:.75rem;padding:.5rem .75rem;font-size:.85rem}.team-name-display{margin-bottom:.5rem;font-size:1rem;font-weight:600}.team-members{flex-wrap:wrap;gap:.375rem;margin-bottom:.5rem;display:flex}.team-member{background:var(--color-bg);color:var(--color-text-secondary);border-radius:999px;padding:.25rem .625rem;font-size:.8rem}.member-tabs{background:var(--color-surface);border-radius:var(--radius);box-shadow:var(--shadow);gap:0;margin-bottom:1.25rem;display:flex;overflow:hidden}.member-tab{color:var(--color-text-secondary);cursor:pointer;white-space:nowrap;text-overflow:ellipsis;background:0 0;border:none;flex:1;padding:.625rem .75rem;font-size:.85rem;font-weight:600;transition:all .15s;position:relative;overflow:hidden}.member-tab:hover{background:var(--color-bg);color:var(--color-text)}.member-tab-active{color:var(--color-primary);background:var(--color-primary-light)}.member-tab-active:hover{background:var(--color-primary-light);color:var(--color-primary)}.member-tab+.member-tab{border-left:1px solid var(--color-border)}.habit-checkbox-readonly{opacity:.7;cursor:default!important}.habit-checkbox-readonly:hover{border-color:var(--color-border)!important}.summary-toggle{color:#fff;border-radius:var(--radius);cursor:pointer;width:100%;box-shadow:var(--shadow-md);background:linear-gradient(135deg,#6366f1 0%,#818cf8 100%);border:none;margin-bottom:1.25rem;padding:.875rem;font-size:.9rem;font-weight:600;transition:opacity .15s}.summary-toggle:hover{opacity:.9}.summary-header-row{justify-content:space-between;align-items:center;display:flex}.summary-close{color:#fffc;cursor:pointer;background:0 0;border:none;padding:0 .25rem;font-size:1.25rem;line-height:1}.summary-close:hover{color:#fff}.habit-list{list-style:none}.habit-item{border-bottom:1px solid var(--color-border);align-items:center;gap:.75rem;padding:.75rem 0;transition:background-color .1s;display:flex}.habit-item:last-child{border-bottom:none}.habit-checkbox{appearance:none;border:2px solid var(--color-border);cursor:pointer;border-radius:6px;flex-shrink:0;width:22px;height:22px;transition:all .2s;position:relative}.habit-checkbox:checked{background:var(--color-primary);border-color:var(--color-primary)}.habit-checkbox:checked:after{content:"";border:2.5px solid #fff;border-width:0 2.5px 2.5px 0;width:6px;height:11px;position:absolute;top:2px;left:6px;transform:rotate(45deg)}.habit-checkbox:hover{border-color:var(--color-primary)}.habit-name{font-size:.95rem;transition:all .2s}.habit-name.completed{color:var(--color-text-secondary);text-decoration:line-through}.habit-info{flex-direction:column;flex:1;gap:.125rem;min-width:0;display:flex}.habit-creator{color:var(--color-text-secondary);font-size:.7rem;font-style:italic}.habit-frequency{color:var(--color-text-secondary);background:var(--color-bg);border-radius:999px;flex-shrink:0;padding:.125rem .5rem;font-size:.75rem}.habit-team-badge{text-transform:uppercase;letter-spacing:.04em;color:var(--color-primary);background:var(--color-primary-light);border-radius:999px;flex-shrink:0;padding:.125rem .5rem;font-size:.65rem;font-weight:600}.team-toggle{color:var(--color-text-secondary);cursor:pointer;white-space:nowrap;-webkit-user-select:none;user-select:none;align-items:center;gap:.375rem;font-size:.85rem;display:inline-flex}.team-toggle input[type=checkbox]{width:16px;height:16px;accent-color:var(--color-primary);cursor:pointer}.empty-state{text-align:center;color:var(--color-text-secondary);padding:2rem 1rem}.empty-state p{font-size:.95rem}.progress-container{margin-bottom:1.25rem}.progress-stats{justify-content:space-between;align-items:baseline;margin-bottom:.5rem;display:flex}.progress-label{color:var(--color-text-secondary);font-size:.875rem;font-weight:500}.progress-percentage{color:var(--color-primary);font-size:1.5rem;font-weight:700}.progress-bar{background:var(--color-bg);border-radius:999px;width:100%;height:10px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--color-primary), #818cf8);border-radius:999px;min-width:0;height:100%;transition:width .4s}.summary-card{color:#fff;border-radius:var(--radius);box-shadow:var(--shadow-md);background:linear-gradient(135deg,#6366f1 0%,#818cf8 100%);margin-bottom:1.25rem;padding:1.5rem}.summary-card .card-title{color:#ffffffe6;text-transform:uppercase;letter-spacing:.05em;font-size:.85rem}.summary-stats{gap:1.5rem;margin-bottom:1rem;display:flex}.summary-stat{text-align:center}.summary-stat .value{font-size:1.75rem;font-weight:700;line-height:1.2}.summary-stat .label{opacity:.85;font-size:.75rem}.summary-insight{opacity:.95;border-top:1px solid #fff3;margin-top:.5rem;padding-top:1rem;font-size:.9rem;line-height:1.5}.loading-skeleton{background:linear-gradient(90deg, var(--color-bg) 25%, #e2e8f0 50%, var(--color-bg) 75%);border-radius:var(--radius-sm);background-size:200% 100%;height:1rem;margin-bottom:.5rem;animation:1.5s infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.brand-logo{background:linear-gradient(135deg,#6366f1,#818cf8);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1.5rem;font-weight:700}@media (width<=640px){.auth-card{padding:1.5rem}.dashboard{padding:1rem .75rem 2rem}.dashboard-header{flex-direction:column;gap:.75rem}.header-actions{align-self:flex-end}.summary-stats,.habit-options-row{flex-wrap:wrap}}