:root{color-scheme:dark;--bg: #0d0f13;--surface: #171a21;--surface-alt: #1e222b;--surface-raised: #1c2029;--border: #262b35;--border-soft: #1e222b;--text: #e8eaed;--text-muted: #8b93a1;--accent: #38bdf8;--accent-dim: #0ea5cf;--accent-soft: rgba(56, 189, 248, .15);--success: #4ade80;--danger: #f87171;--radius: 18px;--radius-sm: 11px;--shadow-card: 0 1px 2px rgba(0, 0, 0, .3), 0 8px 20px -8px rgba(2, 6, 15, .55);--shadow-accent: 0 8px 24px -6px rgba(56, 189, 248, .35);--ease: cubic-bezier(.2, .7, .3, 1);padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;-webkit-tap-highlight-color:transparent}body{overscroll-behavior-y:none;background:radial-gradient(ellipse 800px 500px at 50% -10%,rgba(56,189,248,.09),transparent 60%),var(--bg);background-attachment:fixed;min-height:100vh}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:9999;pointer-events:none;opacity:.025;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}img{max-width:100%}button,input,select,textarea{font-family:inherit}button{cursor:pointer;transition:transform .15s var(--ease),background-color .15s var(--ease),border-color .15s var(--ease),color .15s var(--ease),opacity .15s var(--ease)}button:active{transform:scale(.96)}a,button,input,select,textarea{outline-offset:2px}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}[hidden]{display:none!important}#root{min-height:100vh}.app-shell{display:flex;flex-direction:column;min-height:100vh;max-width:560px;margin:0 auto}.app-header{padding:calc(env(safe-area-inset-top,0px) + 16px) 20px 14px;position:sticky;top:0;background:linear-gradient(var(--bg) 65%,transparent);z-index:5;display:flex;align-items:center;gap:8px}.app-header__dot{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px 1px #38bdf899;flex-shrink:0}.app-header__title{font-size:1.05rem;font-weight:700;letter-spacing:-.01em}.app-content{flex:1;padding:0 16px 100px}.view{display:flex;flex-direction:column;gap:20px;padding-top:8px}.view-loading{padding:40px 20px;color:var(--text-muted);text-align:center}.empty-hint{color:var(--text-muted);text-align:center;padding:24px 12px}.login-view{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.login-form{width:100%;max-width:320px;display:flex;flex-direction:column;gap:12px}.login-title{text-align:center;font-size:1.4rem;font-weight:800;letter-spacing:-.01em;margin-bottom:8px}.login-form input{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px;color:var(--text);font-size:1rem;text-align:center;box-shadow:var(--shadow-card);transition:border-color .15s var(--ease)}.login-form input:focus-visible{border-color:var(--accent-dim);outline:none}.login-error{color:var(--danger);font-size:.85rem;text-align:center}.today-date{text-align:center;color:var(--text-muted);font-size:.85rem;text-transform:capitalize}.streak-badge{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--surface-raised),var(--surface));border:1px solid var(--border);border-radius:var(--radius);padding:20px 18px;text-align:center;box-shadow:var(--shadow-card)}.streak-badge:before{content:"";position:absolute;top:-60%;left:50%;translate:-50% 0;width:220px;height:220px;background:radial-gradient(circle,rgba(56,189,248,.16),transparent 70%);pointer-events:none}.streak-badge--celebrate{border-color:var(--accent-dim);box-shadow:var(--shadow-card),var(--shadow-accent)}.streak-badge__main{position:relative;display:flex;align-items:baseline;justify-content:center;gap:7px}.streak-badge__flame{font-size:1.4rem}.streak-badge__count{font-size:2.4rem;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums;background:linear-gradient(180deg,#fff,var(--accent) 160%);-webkit-background-clip:text;background-clip:text;color:transparent}.streak-badge__unit{color:var(--text-muted);font-size:.95rem}.streak-badge__meta{position:relative;margin-top:6px;color:var(--text-muted);font-size:.8rem;font-variant-numeric:tabular-nums}.metric-list{display:flex;flex-direction:column;gap:12px}.metric-field{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius);padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;box-shadow:var(--shadow-card);transition:border-color .15s var(--ease)}.metric-field:focus-within{border-color:var(--accent-dim)}.metric-field__label{display:flex;align-items:center;gap:10px;font-weight:600}.metric-field__icon{font-size:1.2rem}.metric-field__number-wrap{display:flex;flex-direction:column;align-items:flex-end;gap:6px}.metric-field__presets{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}.preset-btn{background:var(--surface-alt);border:1px solid var(--border);color:var(--text-muted);border-radius:999px;padding:4px 10px;font-size:.72rem;font-weight:600;white-space:nowrap}.preset-btn:active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}.metric-field__number{display:flex;align-items:center;gap:6px}.metric-field__number input{width:72px;text-align:right;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px 10px;color:var(--text);font-size:1rem;font-variant-numeric:tabular-nums;transition:border-color .15s var(--ease)}.metric-field__number input:focus-visible{border-color:var(--accent-dim);outline:none}.metric-field__unit{color:var(--text-muted);font-size:.85rem;min-width:3ch}.toggle-pill{border:1px solid var(--border);background:var(--surface-alt);color:var(--text-muted);border-radius:999px;padding:8px 18px;font-weight:600;font-size:.9rem}.toggle-pill--on{background:var(--accent-soft);border-color:var(--accent-dim);color:var(--accent);box-shadow:0 0 0 1px #38bdf826 inset}.scale5{display:flex;gap:6px}.scale5__dot{width:26px;height:26px;border-radius:50%;border:1px solid var(--border);background:var(--surface-alt);padding:0}.scale5__dot--filled{background:var(--accent);border-color:var(--accent-dim)}.primary-btn--done{background:var(--success);box-shadow:none}.history-list{display:flex;flex-direction:column;gap:12px}.history-card{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow-card)}.history-card__date{font-weight:700;margin-bottom:8px;text-transform:capitalize}.history-card__chips{display:flex;flex-wrap:wrap;gap:6px}.chip{background:var(--surface-alt);border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:.85rem;display:inline-flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums}.load-more{align-self:center;background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:999px;padding:10px 20px;box-shadow:var(--shadow-card)}.load-more:active{background:var(--surface-alt)}.section-title{font-size:.95rem;color:var(--text-muted);margin:8px 0 0}.metric-manage-list{display:flex;flex-direction:column;gap:8px}.metric-manage-row{display:flex;align-items:center;gap:10px;background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius-sm);padding:10px 14px;box-shadow:var(--shadow-card)}.metric-manage-row__icon{font-size:1.2rem}.metric-manage-row__info{flex:1}.metric-manage-row__meta{color:var(--text-muted);font-size:.8rem}.link-btn{background:none;border:none;color:var(--text-muted);font-size:.85rem;text-decoration:underline}.add-metric-form{display:flex;flex-direction:column;gap:10px;background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow-card)}.add-metric-form__row{display:flex;gap:8px}.add-metric-form input,.add-metric-form select{background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px;color:var(--text);font-size:.95rem;transition:border-color .15s var(--ease)}.add-metric-form input:focus-visible,.add-metric-form select:focus-visible{border-color:var(--accent-dim);outline:none}.add-metric-form__icon{width:48px;text-align:center;flex-shrink:0}.add-metric-form__label,.add-metric-form select{flex:1}.primary-btn{background:linear-gradient(180deg,#52c9fb,var(--accent));color:#04141d;border:none;border-radius:var(--radius-sm);padding:13px;font-weight:700;font-size:.95rem;box-shadow:var(--shadow-accent)}.primary-btn:disabled{opacity:.5;box-shadow:none}.range-selector{display:flex;gap:6px;justify-content:center}.range-btn{background:var(--surface);border:1px solid var(--border);color:var(--text-muted);border-radius:999px;padding:6px 16px;font-size:.85rem;font-weight:600}.range-btn--active{background:var(--accent-soft);border-color:var(--accent-dim);color:var(--accent)}.stat-card{background:var(--surface);border:1px solid var(--border-soft);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow-card)}.stat-card__header{display:flex;align-items:center;gap:8px;font-weight:600;margin-bottom:10px}.stat-card__icon{font-size:1.1rem}.stat-card__summary{margin-top:8px;color:var(--text-muted);font-size:.8rem;text-align:center;font-variant-numeric:tabular-nums}.chart-empty{color:var(--text-muted);font-size:.85rem;text-align:center;padding:20px 0}.trend-chart{position:relative}.trend-chart__svg{width:100%;height:100px;display:block;touch-action:pan-y}.trend-chart__grid{stroke:var(--border);stroke-width:1}.trend-chart__area{fill:var(--accent);opacity:.12;stroke:none}.trend-chart__line{stroke:var(--accent);stroke-width:2;stroke-linejoin:round;stroke-linecap:round}.trend-chart__dot{fill:var(--accent);stroke:var(--surface);stroke-width:2}.trend-chart__dot--hover{r:5}.trend-chart__crosshair{stroke:var(--text-muted);stroke-width:1;opacity:.5}.trend-chart__tooltip{position:absolute;top:0;right:0;background:var(--surface-alt);border:1px solid var(--border);border-radius:8px;padding:4px 10px;font-size:.75rem;display:flex;flex-direction:column;align-items:flex-end;pointer-events:none}.trend-chart__tooltip strong{color:var(--accent)}.trend-chart__tooltip span{color:var(--text-muted)}.presence-grid-wrap{display:flex;flex-direction:column;gap:8px;position:relative}.presence-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(14px,1fr));gap:3px}.presence-cell{aspect-ratio:1;border-radius:3px;padding:0;border:1px solid var(--border);min-width:12px}.presence-cell--on{background:var(--accent);border-color:var(--accent)}.presence-cell--off{background:var(--surface-alt)}.presence-cell--empty{background:transparent;border-style:dashed}.presence-grid__legend{display:flex;flex-wrap:wrap;gap:10px;font-size:.7rem;color:var(--text-muted)}.presence-grid__legend span{display:inline-flex;align-items:center;gap:4px}.presence-grid__legend i{width:10px;height:10px;display:inline-block;aspect-ratio:unset}.tab-bar{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:4px;background:#171a21d9;backdrop-filter:blur(16px) saturate(140%);-webkit-backdrop-filter:blur(16px) saturate(140%);border-top:1px solid var(--border-soft);box-shadow:0 -8px 24px -12px #02060f99;padding:8px 12px calc(env(safe-area-inset-bottom,0px) + 8px);z-index:10}.tab-bar__item{flex:1;max-width:160px;display:flex;flex-direction:column;align-items:center;gap:2px;background:none;border:none;color:var(--text-muted);padding:6px 8px;border-radius:var(--radius-sm);font-size:.7rem}.tab-bar__item--active{color:var(--accent);background:var(--accent-soft)}.tab-bar__item:active{transform:scale(.94)}.tab-bar__icon{font-size:1.2rem}@media(min-width:600px){.app-shell{border-left:1px solid var(--border);border-right:1px solid var(--border)}}