:root{--color-primary: #c17a5c;--color-primary-dark: #a65d43;--color-primary-light: #d89a82;--color-secondary: #8b9e7d;--color-secondary-dark: #6d7d5f;--color-secondary-light: #a8b89c;--color-gray-50: #f5f1ed;--color-gray-100: #e8e3dd;--color-gray-200: #d1cbc3;--color-gray-300: #9a9189;--color-gray-400: #9a9189;--color-gray-500: #5c574f;--color-gray-600: #5c574f;--color-gray-700: #2c2822;--color-gray-800: #2c2822;--color-gray-900: #2c2822;--color-success: #6b8e5e;--color-success-light: #8aa67c;--color-success-bg: #e8f0e5;--color-warning: #d4a76a;--color-warning-light: #e0bb8a;--color-warning-bg: #f8f3eb;--color-error: #c17a5c;--color-error-light: #d89a82;--color-error-bg: #f9f0ed;--color-info: #7d9ba6;--color-info-light: #9db3bc;--color-info-bg: #edf2f4;--bg-primary: #ffffff;--bg-secondary: #f5f1ed;--bg-card: #ffffff;--text-primary: #2c2822;--text-secondary: #5c574f;--text-muted: #9a9189;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: 1rem;--radius-xl: 1.5rem;--radius-full: 9999px;--border-subtle: 1px solid #e8e3dd;--border-light: 1px solid #d1cbc3;--border-medium: 1px solid #9a9189;--z-base: 1;--z-dropdown: 1000;--z-sticky: 1020;--z-fixed: 1030;--z-modal: 1040;--z-popover: 1050;--z-tooltip: 1060}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior-y:contain}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background-color:var(--bg-secondary);color:var(--text-primary);line-height:1.6;padding-bottom:80px;overscroll-behavior-y:contain}.container{max-width:390px;margin:0 auto;padding:var(--spacing-lg);padding-bottom:120px}h1,h2,h3,h4{font-weight:700;line-height:1.2;color:var(--text-primary)}h1{font-size:2rem;font-weight:800;letter-spacing:-.02em;margin-bottom:var(--spacing-sm)}h2{font-size:1.75rem;font-weight:700;letter-spacing:-.01em;margin-bottom:var(--spacing-lg)}h3{font-size:1.125rem;font-weight:700;margin-bottom:var(--spacing-md)}p{margin-bottom:var(--spacing-lg);line-height:1.7}.subtitle{font-size:.875rem;color:var(--text-secondary);margin-top:-.5rem}.date{font-size:.875rem;color:var(--text-muted);margin-bottom:var(--spacing-lg)}.app-header{text-align:center;margin-bottom:var(--spacing-2xl);padding-top:var(--spacing-lg)}.app-header-compact{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md) 0;margin-bottom:var(--spacing-md)}.app-header-compact .header-left h1{font-size:1.25rem;font-weight:700;color:var(--text-primary);margin:0}.app-header-compact .header-left .date{display:none}.date-selector{display:flex;align-items:center;gap:4px;margin-top:4px}.date-nav-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:none;background:var(--surface-elevated);border-radius:6px;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.date-nav-btn:hover{background:var(--color-primary-light);color:var(--color-primary)}.date-nav-btn:active{transform:scale(.95)}.date-picker-input{font-size:.8rem;padding:4px 8px;border:1px solid var(--border-light);border-radius:6px;background:var(--surface-elevated);color:var(--text-primary);cursor:pointer;max-width:130px}.date-picker-input:focus{outline:none;border-color:var(--color-primary)}.today-btn{font-size:.75rem;padding:4px 10px;border:none;background:var(--color-primary);color:#fff;border-radius:12px;cursor:pointer;font-weight:600;transition:all .15s ease}.today-btn:hover{background:var(--color-primary-dark)}.today-btn.hidden{display:none}.date-indicator{display:inline-block;font-size:.7rem;padding:2px 8px;background:var(--warning-bg, #fff3cd);color:var(--warning-text, #856404);border-radius:10px;margin-left:8px;font-weight:500}.date-indicator.hidden{display:none}.app-header-compact.editing-past{background:linear-gradient(135deg,#ffc1071a,#ffc1070d);border-radius:12px;padding:var(--spacing-md);margin:calc(-1 * var(--spacing-md));margin-bottom:var(--spacing-md)}.header-score{flex-shrink:0}.score-mini{width:56px;height:56px}.score-message-compact{text-align:center;font-size:.9rem;color:var(--text-secondary);margin-bottom:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-secondary);border-radius:var(--radius-md)}.quick-stats-inline{display:flex;justify-content:space-around;padding:var(--spacing-sm) 0;margin-bottom:var(--spacing-md);background:var(--bg-card);border-radius:var(--radius-md);border:var(--border-subtle)}.stat-inline{display:flex;align-items:center;gap:4px;font-size:.85rem}.stat-inline .stat-icon{font-size:1rem}.stat-inline .stat-value{font-weight:600;color:var(--text-primary)}.health-score-section{background:var(--bg-card);border-radius:var(--radius-xl);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg);text-align:center;border:var(--border-subtle)}.score-container{width:140px;height:140px;margin:0 auto var(--spacing-sm)}.health-circle{width:140px;height:140px}#progress-circle{transition:stroke-dashoffset 1s ease-in-out}#svg-score-value{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.score-message{font-size:.875rem;color:var(--text-secondary);font-weight:500;margin-bottom:var(--spacing-md)}.quick-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-lg);margin-bottom:var(--spacing-xl)}.stat-card{background:var(--bg-card);border-radius:var(--radius-xl);padding:var(--spacing-lg);text-align:center;border:var(--border-subtle);display:flex;flex-direction:column;align-items:center;min-height:160px;position:relative}.stat-card:nth-child(2){background:linear-gradient(135deg,#7a8b6e,#6d7d5f)}.stat-card:nth-child(2) .stat-label,.stat-card:nth-child(2) .stat-value{color:#fff}.stat-label{font-size:.875rem;color:var(--text-secondary);font-weight:600;margin-bottom:var(--spacing-md);order:1}.stat-progress{width:100%;max-width:120px;height:auto;margin-bottom:var(--spacing-sm);order:2}.stat-value{font-size:2rem;font-weight:800;color:var(--text-primary);order:3;margin-top:auto}.tracking-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg);border:var(--border-light);position:relative;overflow:hidden}.tracking-card h3{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);color:#fff;padding:var(--spacing-md);margin:calc(-1 * var(--spacing-lg));margin-bottom:var(--spacing-lg);border-radius:var(--radius-lg) var(--radius-lg) 0 0;font-size:1.125rem;font-weight:700}.tracking-card:nth-child(3) h3{background:linear-gradient(135deg,#7a8b6e,#6d7d5f)}.settings-card{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--spacing-lg);margin-bottom:var(--spacing-lg);border:var(--border-light)}.form-group{margin-bottom:var(--spacing-xl)}.form-group.checkbox{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}label{display:block;font-size:.875rem;font-weight:500;color:var(--text-secondary);margin-bottom:var(--spacing-sm)}.form-group.checkbox label{margin-bottom:0;cursor:pointer}input[type=number],input[type=text]{width:100%;padding:var(--spacing-md);border:2px solid var(--color-gray-200);border-radius:var(--radius-md);font-size:1rem;transition:border-color .2s}input[type=number]:focus,input[type=text]:focus{border-color:var(--color-primary);outline:2px solid var(--color-primary);outline-offset:2px}.water-glasses{display:flex;gap:var(--spacing-xs);justify-content:center;margin-bottom:var(--spacing-md);flex-wrap:wrap}.glass-icon{font-size:2rem;opacity:.2;transition:all .3s ease;filter:grayscale(100%)}.glass-icon.filled{opacity:1;filter:grayscale(0%);transform:scale(1.1)}.water-control{display:flex;gap:var(--spacing-md);align-items:center;justify-content:center;background:var(--bg-secondary);padding:var(--spacing-md);border-radius:var(--radius-lg)}.water-control input{width:80px;text-align:center;font-size:1.5rem;font-weight:700;border:none;background:transparent;color:var(--text-primary);pointer-events:none}.btn-control{width:64px;height:64px;min-width:64px;min-height:64px;padding:0;background:var(--color-primary);color:#fff;font-size:2rem;font-weight:600;border-radius:var(--radius-lg);border:none;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #c17a5c33}.btn-control:hover{background:var(--color-primary-dark);transform:translateY(-2px);box-shadow:0 4px 12px #c17a5c4d}.btn-control:active{transform:translateY(0);box-shadow:0 1px 4px #c17a5c33}.btn-minus{background:var(--color-gray-300);color:var(--text-primary);box-shadow:0 2px 8px #5c574f26}.btn-minus:hover{background:var(--color-gray-500);color:#fff;box-shadow:0 4px 12px #5c574f40}.label-with-value{display:flex;align-items:baseline;gap:var(--spacing-xs);margin-bottom:var(--spacing-sm)}.label-with-value output{background:none;border:none;min-width:auto;height:auto;padding:0;font-size:1rem;font-weight:600;color:var(--color-primary)}.label-with-value .value-max{font-size:.875rem;color:var(--text-muted);font-weight:400}.slider{-webkit-appearance:none;appearance:none;width:100%;height:8px;border-radius:var(--radius-full);background:var(--color-gray-200)}.slider:focus{outline:2px solid var(--color-primary);outline-offset:4px}.slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:24px;height:24px;border-radius:var(--radius-full);background:var(--color-primary);cursor:pointer;border:2px solid var(--color-primary-dark)}.slider::-moz-range-thumb{width:24px;height:24px;border-radius:var(--radius-full);background:var(--color-primary);cursor:pointer;border:2px solid var(--color-primary-dark)}output{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:32px;padding:var(--spacing-xs) var(--spacing-sm);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);font-size:.9375rem;font-weight:600;text-align:center;transition:transform .15s ease}output.pulse{animation:output-pulse .2s ease}@keyframes output-pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.form-group.checkbox{display:flex;align-items:center;gap:var(--spacing-sm)}.form-group.checkbox input[type=checkbox]{-webkit-appearance:none;appearance:none;width:24px;height:24px;border:2px solid var(--color-gray-300);border-radius:var(--radius-sm);background:#fff;cursor:pointer;position:relative;transition:all .2s ease;flex-shrink:0}.form-group.checkbox input[type=checkbox]:checked{background:var(--color-success);border-color:var(--color-success)}.form-group.checkbox input[type=checkbox]:checked:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:14px;font-weight:700}.form-group.checkbox input[type=checkbox]:focus{outline:2px solid var(--color-primary);outline-offset:2px}.form-group.checkbox label{margin:0;cursor:pointer;font-weight:500}select{width:100%;padding:var(--spacing-md);border:2px solid var(--color-gray-200);border-radius:var(--radius-md);font-size:1rem;background:#fff;cursor:pointer;transition:border-color .2s}select:focus{border-color:var(--color-primary);outline:2px solid var(--color-primary);outline-offset:2px}.alcohol-pills{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md);margin-top:var(--spacing-md)}.pill-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-sm);padding:var(--spacing-lg);background:var(--bg-secondary);border:2px solid var(--color-gray-200);border-radius:var(--radius-xl);cursor:pointer;transition:all .2s;min-height:100px;box-shadow:0 1px 3px #0000001a}.pill-button:hover{background:var(--color-gray-100);border-color:var(--color-primary-light);transform:translateY(-2px)}.pill-button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.pill-button.active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.pill-button.active .pill-label{color:#fff}.pill-icon{font-size:2.5rem;line-height:1}.pill-label{font-size:1rem;font-weight:600;color:var(--text-primary);text-align:center}button{font-family:inherit;cursor:pointer;border:none;transition:all .2s}button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.btn-primary{width:100%;padding:var(--spacing-md) var(--spacing-xl);background:var(--color-primary);color:#fff;font-size:1rem;font-weight:600;border-radius:var(--radius-lg);border:2px solid var(--color-primary)}.btn-primary:hover{background:var(--color-primary-dark);border-color:var(--color-primary-dark)}.btn-primary:active{transform:translateY(0)}.btn-large{padding:var(--spacing-lg) var(--spacing-xl);font-size:1.125rem}.action-buttons{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.action-buttons .btn-primary{width:100%}.action-buttons .btn-secondary{width:100%;padding:var(--spacing-md)}.btn-secondary{width:100%;padding:var(--spacing-md) var(--spacing-xl);background:var(--bg-card);color:var(--text-primary);font-size:.875rem;font-weight:500;border:2px solid var(--color-gray-200);border-radius:var(--radius-md);margin-bottom:var(--spacing-md)}.btn-secondary:hover{border-color:var(--color-primary);color:var(--color-primary)}.btn-danger{width:100%;padding:var(--spacing-md) var(--spacing-xl);background:var(--color-error);color:#fff;font-size:.875rem;font-weight:500;border-radius:var(--radius-md);margin-bottom:var(--spacing-md)}.btn-danger:hover{background:#dc2626}.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:var(--bg-card);border-top:2px solid var(--color-gray-200);display:flex;justify-content:space-around;padding:var(--spacing-sm) 0;z-index:var(--z-fixed)}.nav-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm);background:transparent;color:var(--text-muted);font-size:.75rem;font-weight:500;border:none}.nav-item.active{color:var(--color-primary)}.nav-item:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px;border-radius:var(--radius-md)}.nav-icon{width:24px;height:24px;stroke:currentColor}.nav-label{font-size:.625rem}.view{display:none}.view.active{display:block}.privacy-screen{text-align:center;padding-top:var(--spacing-2xl)}.privacy-screen h1{font-size:1.75rem;margin-bottom:var(--spacing-sm)}.privacy-card{background:var(--bg-card);border-radius:var(--radius-xl);padding:var(--spacing-xl);margin:var(--spacing-xl) 0;border:var(--border-subtle);text-align:left}.privacy-list{list-style:none;padding:0;margin:var(--spacing-md) 0}.privacy-list li{margin-bottom:var(--spacing-sm);padding-left:var(--spacing-xs)}.link{display:block;color:var(--color-primary);text-decoration:none;font-size:.875rem;margin-top:var(--spacing-md)}.link:hover{text-decoration:underline}.hidden{display:none!important}.text-center{text-align:center}.mt-md{margin-top:var(--spacing-md)}.mb-md{margin-bottom:var(--spacing-md)}@media(min-width:768px){.container{max-width:500px;padding:var(--spacing-xl)}.quick-stats{grid-template-columns:repeat(3,1fr)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.tracking-card,.stat-card{animation:fadeIn .3s ease-out}.emoji-picker{background:var(--bg-card);border:var(--border-subtle);border-radius:var(--radius-lg);padding:var(--spacing-md);margin:var(--spacing-md) 0}.emoji-tabs{display:flex;gap:var(--spacing-xs);overflow-x:auto;padding-bottom:var(--spacing-sm);margin-bottom:var(--spacing-md);border-bottom:var(--border-subtle)}.emoji-tab{flex-shrink:0;padding:var(--spacing-xs) var(--spacing-sm);background:transparent;border:none;border-radius:var(--radius-md);font-size:.75rem;color:var(--text-secondary);cursor:pointer;transition:all .2s;white-space:nowrap}.emoji-tab:hover{background:var(--bg-secondary)}.emoji-tab.active{background:var(--color-primary);color:#fff}.emoji-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--spacing-xs)}.emoji-option{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:1.5rem;background:var(--bg-secondary);border:2px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:all .2s}.emoji-option:hover{background:var(--color-gray-100);transform:scale(1.1)}.emoji-option.selected{background:var(--color-primary-light);border-color:var(--color-primary)}.emoji-option:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.habits-list{margin-bottom:var(--spacing-md)}.no-habits{color:var(--text-muted);font-size:.875rem;text-align:center;padding:var(--spacing-md)}.habit-item{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-secondary);border-radius:var(--radius-md);margin-bottom:var(--spacing-sm);transition:background .2s}.habit-item.confirm-delete{background:var(--color-error-bg)}.habit-info{display:flex;align-items:center;gap:var(--spacing-sm)}.habit-emoji{font-size:1.25rem}.habit-name{font-size:.9375rem;color:var(--text-primary)}.habit-actions{display:flex;gap:var(--spacing-xs)}.btn-habit-edit,.btn-habit-delete{padding:var(--spacing-xs) var(--spacing-sm);background:transparent;border:none;font-size:1rem;cursor:pointer;border-radius:var(--radius-sm);transition:background .2s}.btn-habit-edit:hover,.btn-habit-delete:hover{background:var(--color-gray-100)}.btn-add-habit{width:100%;padding:var(--spacing-md);background:var(--bg-secondary);border:2px dashed var(--color-gray-200);border-radius:var(--radius-md);color:var(--text-secondary);font-size:.9375rem;cursor:pointer;transition:all .2s}.btn-add-habit:hover{border-color:var(--color-primary);color:var(--color-primary);background:var(--color-gray-50)}.habits-limit-reached{color:var(--text-muted);font-size:.875rem;text-align:center;padding:var(--spacing-sm)}.habit-form-container{margin-top:var(--spacing-md)}.habit-form{background:var(--bg-secondary);border-radius:var(--radius-lg);padding:var(--spacing-md)}.habit-form h4{font-size:1rem;font-weight:600;margin-bottom:var(--spacing-md);color:var(--text-primary)}.habit-name-input{width:100%;padding:var(--spacing-sm) var(--spacing-md);border:var(--border-light);border-radius:var(--radius-md);font-size:1rem;background:var(--bg-card)}.habit-name-input:focus{outline:none;border-color:var(--color-primary)}.char-count{display:block;text-align:right;font-size:.75rem;color:var(--text-muted);margin-top:var(--spacing-xs)}.habit-form-actions{display:flex;gap:var(--spacing-sm);margin-top:var(--spacing-md)}.habit-form-actions button{flex:1}.custom-habits-tracker{margin-top:var(--spacing-md);padding-top:var(--spacing-md);border-top:var(--border-subtle)}.habits-checkboxes{display:flex;flex-direction:column;gap:var(--spacing-sm)}.habit-checkbox-item{display:flex;align-items:center;gap:var(--spacing-sm)}.habit-checkbox-item input[type=checkbox]{width:1.25rem;height:1.25rem;accent-color:var(--color-primary)}.habit-checkbox-item label{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.9375rem;color:var(--text-primary);cursor:pointer}.habit-checkbox-item label .habit-emoji{font-size:1.125rem}.settings-card{background:var(--bg-card);border:var(--border-subtle);border-radius:var(--radius-lg);padding:var(--spacing-md);margin-bottom:var(--spacing-md)}.settings-card h3{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.settings-desc{font-size:.875rem;color:var(--text-secondary);margin-bottom:var(--spacing-md)}.settings-buttons{display:flex;flex-wrap:wrap;gap:var(--spacing-sm)}.settings-buttons .btn-secondary,.settings-buttons .btn-danger{flex:1;min-width:140px}.file-input-label{cursor:pointer;text-align:center}.settings-note{font-size:.8125rem;color:var(--text-muted);margin-top:var(--spacing-sm)}.settings-note.success{color:var(--color-success)}.settings-note.error{color:var(--color-error)}.data-stats{display:flex;flex-wrap:wrap;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--bg-secondary);border-radius:var(--radius-md);margin-bottom:var(--spacing-md);font-size:.875rem}.data-stats-item{display:flex;flex-direction:column;gap:2px}.data-stats-value{font-weight:600;color:var(--text-primary)}.data-stats-label{font-size:.75rem;color:var(--text-muted)}.settings-card-muted{background:var(--bg-secondary);border:none}.version-info{display:flex;flex-direction:column;gap:var(--spacing-xs)}.version-row{display:flex;justify-content:space-between;align-items:center}.version-label{font-size:.875rem;color:var(--text-secondary)}.version-value{font-size:.875rem;font-weight:600;color:var(--text-primary);font-family:ui-monospace,SF Mono,Monaco,monospace}.update-status{font-size:.8125rem;margin-top:var(--spacing-sm);min-height:1.2em}.update-status.checking{color:var(--text-secondary)}.update-status.success{color:var(--color-success)}.update-status.info{color:var(--color-primary)}.update-status.error{color:var(--color-error)}.btn-spinner{display:inline-block;width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite;margin-left:var(--spacing-xs);vertical-align:middle}.btn-spinner.hidden{display:none}.period-selector{display:flex;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg);overflow-x:auto;padding-bottom:var(--spacing-xs)}.period-btn{flex:1;min-width:50px;padding:var(--spacing-sm) var(--spacing-md);border:var(--border-light);border-radius:var(--radius-full);background:var(--bg-card);color:var(--text-secondary);font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease}.period-btn:hover{border-color:var(--color-primary);color:var(--color-primary)}.period-btn.active{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.stats-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.summary-card{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md);background:var(--bg-card);border:var(--border-subtle);border-radius:var(--radius-lg)}.summary-icon{font-size:1.5rem}.summary-data{display:flex;flex-direction:column}.summary-value{font-size:1.25rem;font-weight:700;color:var(--text-primary)}.summary-label{font-size:.75rem;color:var(--text-muted)}.stats-card{background:var(--bg-card);border:var(--border-subtle);border-radius:var(--radius-lg);padding:var(--spacing-md);margin-bottom:var(--spacing-md)}.stats-card h3{font-size:1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-md)}.chart-container{width:100%;min-height:150px;position:relative}.chart-container .no-data{display:flex;align-items:center;justify-content:center;height:150px;color:var(--text-muted);font-size:.875rem}.bar-chart{display:flex;align-items:flex-end;justify-content:space-between;height:120px;gap:2px;padding-top:var(--spacing-sm)}.bar-chart-bar{flex:1;min-width:8px;max-width:24px;background:var(--color-primary);border-radius:var(--radius-sm) var(--radius-sm) 0 0;transition:height .3s ease;position:relative}.bar-chart-bar:hover{background:var(--color-primary-dark)}.bar-chart-bar:after{content:attr(data-value);position:absolute;bottom:100%;left:50%;transform:translate(-50%);font-size:.625rem;color:var(--text-muted);white-space:nowrap;opacity:0;transition:opacity .2s}.bar-chart-bar:hover:after{opacity:1}.line-chart{width:100%;height:120px}.line-chart-path{fill:none;stroke:var(--color-secondary);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.line-chart-area{fill:var(--color-secondary);opacity:.1}.line-chart-dot{fill:var(--color-secondary)}.weight-summary{display:flex;align-items:baseline;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.weight-current{font-size:1.5rem;font-weight:700;color:var(--text-primary)}.weight-change{font-size:.875rem;font-weight:600}.weight-change.down{color:var(--color-success)}.weight-change.up{color:var(--color-warning)}.weight-change.stable{color:var(--text-muted)}.metric-bars{display:flex;flex-direction:column;gap:var(--spacing-md)}.metric-bar-item{display:flex;flex-direction:column;gap:var(--spacing-xs)}.metric-bar-header{display:flex;justify-content:space-between;align-items:center;font-size:.875rem}.metric-bar-value{font-weight:600;color:var(--text-primary)}.metric-bar-track{height:8px;background:var(--color-gray-100);border-radius:var(--radius-full);overflow:hidden}.metric-bar-fill{height:100%;background:var(--color-primary);border-radius:var(--radius-full);transition:width .5s ease}.metric-bar-fill.water{background:var(--color-secondary)}.metric-bar-fill.pain{background:var(--color-warning)}.consumption-stats{display:flex;flex-direction:column;gap:var(--spacing-md)}.consumption-item{display:flex;align-items:center;gap:var(--spacing-md)}.consumption-icon{font-size:1.5rem;width:40px;text-align:center}.consumption-data{flex:1}.consumption-label{font-size:.875rem;font-weight:500;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.consumption-bar-track{height:6px;background:var(--color-gray-100);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--spacing-xs)}.consumption-bar-fill{height:100%;border-radius:var(--radius-full);transition:width .5s ease}.consumption-bar-fill.sugar{background:var(--color-error)}.consumption-bar-fill.alcohol{background:var(--color-warning)}.consumption-bar-fill.caffeine{background:var(--color-info)}.consumption-detail{font-size:.75rem;color:var(--text-muted)}.consumption-bar-fill.sugar,.consumption-bar-fill.alcohol{background:var(--color-success)}.trend-indicator{display:inline-block;font-weight:700;font-size:.875em;margin-left:var(--spacing-xs)}.trend-indicator.trend-positive{color:var(--color-success)}.trend-indicator.trend-negative{color:var(--color-error)}.trend-indicator.trend-stable{color:var(--text-muted)}.streak-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-xs)}.streak-current{font-weight:600;color:var(--text-primary)}.streak-best{font-size:.75rem;color:var(--text-muted)}.streak-dots{display:flex;gap:2px;flex-wrap:wrap;line-height:1}.streak-dot{font-size:.625rem;cursor:default}.streak-dot-clean{color:var(--color-success)}.streak-dot-consumed{color:var(--color-error)}.streak-dot-today{color:var(--color-primary)}.streak-dot-nodata{color:var(--color-gray-300)}.energy-mood-simple{display:flex;flex-direction:column;gap:var(--spacing-sm)}.stat-row{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-sm) 0;border-bottom:var(--border-subtle)}.stat-row:last-child{border-bottom:none}.stat-label{font-size:.9375rem;color:var(--text-secondary)}.stat-value-emoji,.stat-value{font-size:1rem;font-weight:600;color:var(--text-primary)}.caffeine-stats{padding:var(--spacing-xs) 0}.custom-habits-stats-list{display:flex;flex-direction:column;gap:var(--spacing-md)}.habit-stat-item{display:flex;flex-direction:column;gap:var(--spacing-xs)}.habit-stat-header{display:flex;align-items:center;gap:var(--spacing-xs)}.habit-stat-emoji{font-size:1.125rem}.habit-stat-name{font-size:.9375rem;font-weight:500;color:var(--text-primary)}.habit-stat-bar-track{height:8px;background:var(--bg-muted);border-radius:4px;overflow:hidden}.habit-stat-bar-fill{height:100%;border-radius:4px;transition:width .3s ease-out}.habit-stat-bar-fill.high{background:var(--color-success)}.habit-stat-bar-fill.medium{background:var(--color-warning, #f59e0b)}.habit-stat-bar-fill.low{background:var(--color-error, #ef4444)}.habit-stat-details{display:flex;justify-content:space-between;align-items:center;font-size:.8125rem}.habit-stat-pct{font-weight:600;color:var(--text-primary)}.habit-stat-streak{color:var(--text-secondary)}.pull-refresh{position:fixed;top:0;left:0;right:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-md);padding-top:calc(var(--spacing-md) + env(safe-area-inset-top,0px));background:var(--bg-secondary);transform:translateY(-100%);transition:transform .2s ease-out;z-index:var(--z-sticky);opacity:0}.pull-refresh.pulling{opacity:1}.pull-refresh.refreshing{transform:translateY(0);opacity:1}.pull-refresh-icon{width:32px;height:32px;color:var(--color-primary);transition:transform .3s ease}.pull-refresh.pulling .pull-refresh-icon{animation:none}.pull-refresh.refreshing .pull-refresh-icon{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.pull-refresh-text{font-size:.85rem;color:var(--text-muted);margin-top:var(--spacing-xs)}.pull-refresh.refreshing .pull-refresh-text:after{content:"Verversen..."}.pull-refresh.refreshing .pull-refresh-text{font-size:0}.pull-refresh.refreshing .pull-refresh-text:after{font-size:.85rem}.picker-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--spacing-md);background:var(--bg-primary);border:1px solid var(--border-color);border-radius:var(--radius-md);font-size:1rem;color:var(--text-primary);cursor:pointer;transition:border-color .2s ease}.picker-trigger:focus{outline:none;border-color:var(--color-primary)}.picker-value{font-weight:500}.picker-value:empty:before,.picker-trigger .picker-value:first-child:not(:empty){color:var(--text-primary)}.picker-trigger[data-empty=true] .picker-value{color:var(--text-muted)}.picker-arrow{font-size:1.2rem;color:var(--text-muted);transform:rotate(90deg)}.picker-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:flex-end;justify-content:center;z-index:var(--z-modal);opacity:1;transition:opacity .3s ease}.picker-overlay.hidden{display:none}.picker-container{width:100%;max-width:400px;background:var(--bg-primary);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding-bottom:env(safe-area-inset-bottom,0px);animation:slideUp .3s ease-out}.picker-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md);border-bottom:1px solid var(--border-color)}.picker-title{font-weight:600;font-size:1rem}.picker-btn{background:none;border:none;font-size:1rem;color:var(--color-primary);cursor:pointer;padding:var(--spacing-xs) var(--spacing-sm)}.picker-btn-primary{font-weight:600}.picker-wheels{display:flex;align-items:center;justify-content:center;height:200px;position:relative;overflow:hidden;padding:0 var(--spacing-lg)}.picker-wheel{height:100%;width:80px;overflow:hidden;position:relative;mask-image:linear-gradient(to bottom,transparent 0%,black 35%,black 65%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 35%,black 65%,transparent 100%)}.picker-wheel-inner{display:flex;flex-direction:column;transition:transform .1s ease-out}.picker-wheel-item{height:40px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;color:var(--text-secondary);transition:all .2s ease;cursor:pointer}.picker-wheel-item.selected{font-size:1.4rem;font-weight:600;color:var(--text-primary)}.picker-separator{font-size:1.4rem;font-weight:600;color:var(--text-primary);margin:0 var(--spacing-xs)}.picker-unit{font-size:1.1rem;color:var(--text-secondary);margin-left:var(--spacing-sm)}.picker-highlight{position:absolute;left:var(--spacing-md);right:var(--spacing-md);top:50%;transform:translateY(-50%);height:40px;background:var(--bg-secondary);border-radius:var(--radius-sm);pointer-events:none;z-index:-1}.install-banner{position:fixed;bottom:calc(70px + env(safe-area-inset-bottom,0px));left:var(--spacing-md);right:var(--spacing-md);background:var(--bg-card);border:var(--border-light);border-radius:var(--radius-lg);padding:var(--spacing-md);z-index:var(--z-modal);animation:slideUp .3s ease-out}.install-banner.hidden{display:none}.install-content{display:flex;align-items:center;gap:var(--spacing-md)}.install-icon img{border-radius:var(--radius-md)}.install-text{flex:1;display:flex;flex-direction:column;gap:2px}.install-text strong{font-size:.9375rem;color:var(--text-primary)}.install-text span{font-size:.8125rem;color:var(--text-secondary)}.install-actions{display:flex;align-items:center;gap:var(--spacing-sm)}.btn-dismiss{background:none;border:none;font-size:1.5rem;color:var(--text-muted);cursor:pointer;padding:var(--spacing-xs);line-height:1}.btn-dismiss:hover{color:var(--text-secondary)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.skip-link{position:fixed;top:-100px;left:50%;transform:translate(-50%);background:var(--color-primary);color:#fff;padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);font-weight:600;text-decoration:none;z-index:var(--z-tooltip);transition:top .2s ease}.skip-link:focus,.skip-link:focus-visible{top:var(--spacing-md);outline:2px solid white;outline-offset:2px}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible,.pill-button:focus-visible{scroll-margin-bottom:100px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}*:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media(prefers-contrast:high){:root{--color-gray-200: #c0c0c0;--color-gray-300: #a0a0a0}}.time-section{transition:opacity .3s ease,max-height .4s ease,margin .3s ease,padding .3s ease;overflow:hidden}.time-section.hidden{opacity:0;max-height:0;margin:0;padding:0;border:none;pointer-events:none}.fallback-banner{background:linear-gradient(135deg,#fef3c7,#fde68a);border:1px solid #f59e0b;border-radius:var(--radius-lg);padding:var(--spacing-md);margin-bottom:var(--spacing-lg);display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);text-align:center}.fallback-banner p{margin:0;font-size:.875rem;color:#92400e;font-weight:500}.fallback-banner .btn-secondary{width:100%}.water-card{background:linear-gradient(135deg,#7a8b6e,#6d7d5f);color:#fff;text-align:center}.water-card h3{background:transparent!important;color:#fff!important;margin:0 0 var(--spacing-md) 0!important;padding:0!important;border-radius:0!important}.water-display{display:flex;align-items:baseline;justify-content:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.water-count{font-size:4rem;font-weight:800;line-height:1}.water-label{font-size:1.25rem;opacity:.9}.btn-water-add{background:#fff;color:#5a6b4e;font-size:1.125rem;font-weight:700;padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-full);border:none;margin-bottom:var(--spacing-md);cursor:pointer;transition:transform .2s,box-shadow .2s}.btn-water-add:hover{transform:scale(1.05);box-shadow:0 4px 12px #00000026}.btn-water-add:active{transform:scale(.98)}.water-progress{height:8px;background:#ffffff4d;border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--spacing-sm)}.water-progress-fill{height:100%;background:#fff;border-radius:var(--radius-full);transition:width .3s ease;width:0%}.water-goal{font-size:.875rem;opacity:.8;margin:0}.counter-control{display:flex;align-items:center;justify-content:center;gap:var(--spacing-md);background:var(--bg-input);padding:var(--spacing-sm);border-radius:var(--radius-lg)}.counter-control input{width:60px;text-align:center;font-size:1.5rem;font-weight:700;border:none;background:transparent;color:var(--text-primary)}.btn-counter{width:48px;height:48px;border-radius:var(--radius-md);border:none;font-size:1.5rem;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.btn-counter.btn-plus{background:var(--color-primary);color:#fff}.btn-counter.btn-plus:hover{background:var(--color-primary-dark)}.btn-counter.btn-minus{background:var(--color-gray-200);color:var(--text-primary)}.btn-counter.btn-minus:hover{background:var(--color-gray-300)}.option-pills{display:flex;gap:var(--spacing-sm)}.pill-option{flex:1;padding:var(--spacing-md);background:var(--bg-input);border:2px solid var(--color-gray-200);border-radius:var(--radius-lg);font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s;color:var(--text-primary)}.pill-option:hover{border-color:var(--color-primary)}.pill-option[aria-checked=true]{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.input-number{width:100%;padding:var(--spacing-md);font-size:1.25rem;font-weight:600;border:2px solid var(--color-gray-200);border-radius:var(--radius-lg);background:var(--bg-input);color:var(--text-primary);transition:all .2s}.input-number:focus{outline:none;border-color:var(--color-primary)}.input-number::placeholder{color:var(--text-muted);font-weight:400}.form-hint{display:block;margin-top:var(--spacing-xs);font-size:.8rem;color:var(--text-muted)}.edit-today-row{text-align:center;padding:var(--spacing-sm) 0;margin-bottom:var(--spacing-sm)}.btn-link{background:none;border:none;color:var(--color-primary);font-size:.9rem;font-weight:500;cursor:pointer;padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all .2s}.btn-link:hover{background:var(--color-gray-100)}.mood-picker{display:flex;justify-content:space-between;gap:var(--spacing-sm)}.mood-option{flex:1;aspect-ratio:1;max-width:56px;display:flex;align-items:center;justify-content:center;font-size:1.75rem;background:var(--bg-input);border:2px solid var(--color-gray-200);border-radius:var(--radius-lg);cursor:pointer;transition:all .2s}.mood-option:hover{transform:scale(1.1);border-color:var(--color-primary)}.mood-option[aria-checked=true]{background:var(--color-primary-light);border-color:var(--color-primary);transform:scale(1.15)}.energy-picker{display:flex;justify-content:space-between;gap:var(--spacing-sm)}.energy-option{flex:1;aspect-ratio:1;max-width:56px;display:flex;align-items:center;justify-content:center;font-size:1.75rem;background:var(--bg-input);border:2px solid var(--color-gray-200);border-radius:var(--radius-lg);cursor:pointer;transition:transform .15s ease,border-color .15s ease}.energy-option:hover{transform:scale(1.1);border-color:var(--color-primary)}.energy-option[aria-checked=true]{background:var(--color-primary-light);border-color:var(--color-primary);transform:scale(1.15)}.btn-small{padding:var(--spacing-sm) var(--spacing-md);font-size:.875rem}.btn-secondary{background:#fff;color:var(--color-primary);border:2px solid var(--color-primary);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);font-weight:600;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:var(--color-primary);color:#fff}.toast-container{position:fixed;bottom:calc(70px + env(safe-area-inset-bottom,0px));left:50%;transform:translate(-50%);z-index:var(--z-tooltip);display:flex;flex-direction:column;gap:var(--spacing-sm);pointer-events:none;width:90%;max-width:360px}.toast{display:flex;align-items:center;gap:var(--spacing-sm);padding:var(--spacing-md);background:var(--color-gray-700);color:#fff;border-radius:var(--radius-lg);font-size:.9375rem;font-weight:500;pointer-events:auto;animation:toast-in .3s ease-out;box-shadow:0 4px 12px #00000026}.toast.toast-out{animation:toast-out .2s ease-in forwards}.toast-success{background:var(--color-success)}.toast-error{background:var(--color-error)}.toast-warning{background:var(--color-warning);color:var(--color-gray-700)}.toast-info{background:var(--color-info)}.toast-icon{flex-shrink:0;font-size:1.25rem}.toast-message{flex:1}@keyframes toast-in{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-out{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}.offline-banner{position:fixed;top:0;left:0;right:0;background:var(--color-warning);color:var(--color-gray-700);padding:var(--spacing-sm) var(--spacing-md);text-align:center;font-size:.875rem;font-weight:600;z-index:var(--z-fixed);transform:translateY(-100%);transition:transform .3s ease}.offline-banner.visible{transform:translateY(0)}.offline-banner-icon{margin-right:var(--spacing-xs)}.toggle-list{display:flex;flex-direction:column;gap:var(--spacing-xs)}.toggle-item{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sm) var(--spacing-md);background:var(--color-gray-50);border-radius:var(--radius-md);cursor:pointer;transition:background-color .15s ease}.toggle-item:hover{background:var(--color-gray-100)}.toggle-label{font-weight:500;color:var(--text-primary)}.toggle-item input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}.toggle-switch{position:relative;width:48px;height:28px;background:var(--color-gray-300);border-radius:var(--radius-full);transition:background-color .2s ease;flex-shrink:0}.toggle-switch:after{content:"";position:absolute;top:2px;left:2px;width:24px;height:24px;background:#fff;border-radius:50%;transition:transform .2s ease;box-shadow:0 1px 3px #0003}.toggle-item input[type=checkbox]:checked+.toggle-switch{background:var(--color-success)}.toggle-item input[type=checkbox]:checked+.toggle-switch:after{transform:translate(20px)}.toggle-item input[type=checkbox]:focus+.toggle-switch{outline:2px solid var(--color-primary);outline-offset:2px}
