.app{max-width:480px;margin:0 auto;min-height:100dvh;padding:env(safe-area-inset-top,0) 20px calc(env(safe-area-inset-bottom,0) + 24px);display:flex;flex-direction:column}.app-header{padding:26px 0 6px}.app-header--row{display:flex;align-items:flex-start;justify-content:space-between}.app-eyebrow{margin:0;font-family:var(--font-body);font-size:12px;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--text-soft)}.app-title{margin:2px 0 0;font-family:var(--font-display);font-size:38px;font-weight:560;font-style:italic;line-height:1.05;color:var(--text)}.app-date{margin:8px 0 0;font-size:13px;font-weight:600;color:var(--text-soft)}.logout-button{appearance:none;border:none;background:transparent;color:var(--text-soft);font-family:var(--font-body);font-size:13px;font-weight:700;padding:8px 0;cursor:pointer}.hamburger-menu{position:relative}.hamburger-button{appearance:none;border:none;background:transparent;width:40px;height:40px;margin-top:2px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:12px;cursor:pointer}.hamburger-button span{display:block;width:18px;height:2px;border-radius:1px;background:var(--text)}.hamburger-button span:nth-child(2){width:12px;align-self:flex-end;margin-right:11px}.hamburger-dropdown{position:absolute;top:calc(100% + 6px);right:0;z-index:10;min-width:170px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow-md);padding:6px;display:flex;flex-direction:column}.hamburger-dropdown-item{appearance:none;border:none;background:transparent;color:var(--text);font-family:var(--font-body);font-size:15px;font-weight:600;text-align:left;padding:10px 12px;border-radius:10px;cursor:pointer}.hamburger-dropdown-item:hover{background:var(--bg)}.app-main{flex:1;display:flex;flex-direction:column;gap:18px;padding-bottom:12px}.app-loading,.app-error{color:var(--text-soft);font-size:15px}.login-screen{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:20px}.login-card{width:100%;max-width:360px;display:flex;flex-direction:column;gap:16px}.login-card .app-title{margin-bottom:12px}.login-field{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:800;color:var(--text-soft);text-transform:uppercase;letter-spacing:.08em}.login-field input{font-family:var(--font-body);font-size:16px;font-weight:600;text-transform:none;letter-spacing:normal;color:var(--text);background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px}.login-error{margin:0;color:var(--danger);font-size:14px;font-weight:600}.status-card{position:relative;overflow:hidden;border-radius:var(--r-lg);padding:22px 24px 24px;background:var(--mood-sky);color:var(--mood-ink);box-shadow:var(--shadow-md);transition:color .6s ease}.status-card-orb{position:absolute;top:20px;right:22px;width:44px;height:44px;border-radius:50%}.status-card--awake .status-card-orb{background:radial-gradient(circle at 35% 35%,#fff8e6,#ffe9b8);box-shadow:0 0 0 14px #ffffff29,0 0 0 28px #ffffff12}.status-card--sleeping .status-card-orb{background:radial-gradient(circle at 35% 35%,#fff,#d9dcff);box-shadow:0 0 0 14px #ffffff24,0 0 0 28px #ffffff0f}.status-card-star{position:absolute;border-radius:50%;background:#fff}.status-card-star--1{top:30px;right:104px;width:4px;height:4px;opacity:.85;animation:star-twinkle 2.8s ease-in-out infinite alternate}.status-card-star--2{top:66px;right:138px;width:3px;height:3px;opacity:.6}.status-card-star--3{top:88px;right:92px;width:3px;height:3px;opacity:.45;animation:star-twinkle 3.6s .8s ease-in-out infinite alternate}@keyframes star-twinkle{0%{opacity:.25}to{opacity:.9}}.status-card-label{font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;opacity:.85}.status-card-duration{margin-top:6px;font-family:var(--font-display);font-size:40px;font-weight:560;line-height:1.05;font-variant-numeric:tabular-nums}.status-card-since{margin-top:8px;font-size:14px;font-weight:600;opacity:.8;font-variant-numeric:tabular-nums}.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.info-tile{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:16px;box-shadow:var(--shadow-sm)}.info-tile-label{font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--text-soft);text-transform:uppercase}.info-tile-value{margin-top:8px;font-family:var(--font-display);font-size:26px;font-weight:500;line-height:1.1;font-variant-numeric:tabular-nums}.info-tile-unit{font-family:var(--font-body);font-size:13px;font-weight:700;color:var(--text-soft)}.info-tile-approx{color:var(--text-soft);font-weight:400}.info-tile-sub{margin-top:4px;font-size:12px;font-weight:600;color:var(--text-soft)}.info-tile-progress{margin-top:10px;height:6px;border-radius:999px;background:var(--line);overflow:hidden}.info-tile-progress-bar{height:100%;border-radius:inherit;background:linear-gradient(90deg,#ef8a66,#de6440);transition:width .4s ease}.info-tile-progress-bar--done{background:var(--sage)}.action-buttons{display:flex;flex-direction:column;gap:10px}.action-buttons-row{display:flex;gap:10px}.action-buttons-row .action-button{flex:1}.action-button{appearance:none;border:1px solid var(--line);border-radius:var(--r-md);padding:15px 20px;font-family:var(--font-body);font-size:16px;font-weight:700;background:var(--card);color:var(--text);box-shadow:var(--shadow-sm);cursor:pointer;transition:transform .15s ease,opacity .15s ease,background-color .6s ease}.action-button--primary{background:var(--mood);color:var(--mood-ink);border-color:transparent;padding:19px 20px;font-size:17px}.action-button:active:not(:disabled){transform:scale(.98)}.action-button:disabled{opacity:.4;cursor:default;box-shadow:none}.quick-log{background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:16px;box-shadow:var(--shadow-sm)}.quick-log-input{width:100%;margin-top:4px;font-family:var(--font-body);font-size:16px;color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 14px;resize:none}.quick-log-actions{display:flex;gap:10px;margin-top:10px}.quick-log-mic{position:relative;appearance:none;border:1px solid var(--line);background:var(--bg);color:var(--text);width:48px;height:48px;border-radius:50%;font-size:15px;flex-shrink:0;cursor:pointer}.quick-log-mic--active{background:var(--danger);color:#fff;border-color:transparent}.quick-log-mic-pulse{position:absolute;inset:0;border-radius:inherit;background:var(--danger);animation:mic-pulse 1.4s ease-out infinite;pointer-events:none}@keyframes mic-pulse{0%{transform:scale(1);opacity:.6}to{transform:scale(1.7);opacity:0}}.quick-log-recognized-label{margin:4px 0 8px;font-size:13px;font-weight:700;color:var(--sage)}.quick-log-recognized .events-list{margin-bottom:12px}.quick-log-skipped-list{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:8px}.quick-log-skipped-item{display:flex;gap:14px;font-size:13px;color:var(--text-soft)}.quick-log-skipped-time{font-variant-numeric:tabular-nums;min-width:44px;flex-shrink:0}.quick-log-recognized-actions{display:flex;gap:10px}.events-section{margin-top:4px}.events-title{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--text-soft);margin:0 0 10px}.events-empty{color:var(--text-soft);font-size:14px}.events-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}.events-item-wrapper{position:relative}.events-row{position:relative;overflow:hidden}.events-item-delete-bg{position:absolute;inset:0;display:flex;justify-content:flex-end;align-items:stretch}.events-item-delete-button{appearance:none;border:none;width:88px;display:flex;align-items:center;justify-content:center;background:var(--danger);color:#fff;font-family:var(--font-body);font-size:13px;font-weight:700;cursor:pointer}.events-item-delete-button:disabled{cursor:default}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.events-item{display:flex;align-items:center;gap:12px;padding:11px 0;font-size:14px;background:var(--row-bg, var(--bg));position:relative;touch-action:pan-y;-webkit-user-select:none;user-select:none}.events-item:before{content:"";position:absolute;left:60px;top:0;bottom:0;width:2px;background:var(--line)}.events-list>li:first-child .events-row:first-child .events-item:before{top:50%}.events-list>li:last-child .events-row:last-child .events-item:before{bottom:50%}.events-item--settled{transition:transform .2s ease}.quick-log-recognized{--row-bg: var(--card)}.events-item-time{font-variant-numeric:tabular-nums;color:var(--text-soft);min-width:44px;flex-shrink:0}.events-item-dot{position:relative;z-index:1;width:10px;height:10px;border-radius:50%;flex-shrink:0;box-shadow:0 0 0 3px var(--row-bg, var(--bg))}.events-item-dot--feeding{background:var(--coral)}.events-item-dot--sleep_start{background:var(--periwinkle)}.events-item-dot--sleep_end{background:var(--row-bg, var(--bg));border:2px solid var(--periwinkle)}.events-item-text{font-weight:600}.events-sleep-pair{position:relative}.events-sleep-pair-badge{position:absolute;z-index:2;right:12px;top:50%;transform:translateY(-50%);background:var(--periwinkle);color:var(--periwinkle-ink);font-size:11px;font-weight:700;font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap;padding:4px 8px;border-radius:999px;box-shadow:0 2px 6px -2px #2b244059}.events-item-feeding-badge{margin-left:auto;margin-right:12px;flex-shrink:0;background:var(--sage);color:#fff;font-size:11px;font-weight:700;line-height:1;white-space:nowrap;padding:4px 8px;border-radius:999px}.modal-overlay{position:fixed;inset:0;background:#17142b80;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:flex-end;justify-content:center;padding:16px;z-index:10}.modal{width:100%;max-width:420px;background:var(--card);border-radius:var(--r-lg) var(--r-lg) var(--r-md) var(--r-md);padding:26px 24px calc(env(safe-area-inset-bottom,0) + 20px);box-shadow:var(--shadow-md)}.modal-title{margin:0;font-family:var(--font-display);font-size:28px;font-weight:560;font-style:italic}.modal-subtitle{margin:4px 0 20px;color:var(--text-soft);font-size:14px;font-weight:600}.stepper{display:flex;align-items:center;justify-content:space-between;gap:12px}.stepper-button{appearance:none;width:62px;height:62px;border-radius:var(--r-md);background:var(--bg);border:1px solid var(--line);color:var(--text);font-size:28px;line-height:1;cursor:pointer}.stepper-button:active:not(:disabled){transform:scale(.95)}.stepper-button:disabled{opacity:.35;cursor:default}.stepper-value{font-family:var(--font-display);font-size:38px;font-weight:560;font-variant-numeric:tabular-nums}.modal-actions{display:flex;gap:10px;margin-top:28px}.button{flex:1;appearance:none;border:none;border-radius:14px;padding:15px;font-size:15px;font-weight:700;cursor:pointer;transition:transform .15s ease,opacity .15s ease}.button:active:not(:disabled){transform:scale(.98)}.button-secondary{background:var(--bg);color:var(--text);border:1px solid var(--line)}.button-primary{background:var(--mood);color:var(--mood-ink)}.button:disabled{opacity:.5;cursor:default}.settings-form{display:flex;flex-direction:column;gap:20px}.settings-interval-row{display:flex;gap:10px}.settings-interval-row input{flex:1;min-width:0}.settings-unit-toggle{display:flex;border:1px solid var(--line);border-radius:14px;overflow:hidden;flex-shrink:0}.settings-unit-button{appearance:none;border:none;background:var(--card);color:var(--text-soft);font-family:var(--font-body);font-size:14px;font-weight:700;padding:0 16px;cursor:pointer}.settings-unit-button--active{background:var(--mood);color:var(--mood-ink)}.settings-theme-toggle{display:flex;border:1px solid var(--line);border-radius:14px;overflow:hidden}.settings-theme-toggle .settings-unit-button{flex:1;padding:12px 0}.toast{position:fixed;left:50%;bottom:calc(env(safe-area-inset-bottom,0) + 20px);transform:translate(-50%);background:var(--sage);color:#fff;padding:12px 20px;border-radius:999px;font-size:14px;font-weight:700;box-shadow:var(--shadow-md);z-index:20;animation:toast-in .25s ease}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}:root{--cream: #faf3e8;--ink: #2e2540;--ink-soft: #8a8098;--surface: #ffffff;--coral: #ec7d5c;--coral-ink: #5a2410;--periwinkle: #7c83fd;--periwinkle-ink: #ffffff;--sage: #4f9471;--danger: #c0524a;--line: rgba(46, 37, 64, .09);--mood: var(--coral);--mood-ink: var(--coral-ink);--mood-sky: linear-gradient(140deg, #f49a76 0%, #e97950 55%, #de6440 100%);--bg: var(--cream);--text: var(--ink);--text-soft: var(--ink-soft);--card: var(--surface);--shadow-sm: 0 1px 2px rgba(46, 37, 64, .04), 0 6px 16px -8px rgba(46, 37, 64, .08);--shadow-md: 0 2px 6px -2px rgba(46, 37, 64, .12), 0 18px 36px -16px rgba(46, 37, 64, .3);--r-lg: 26px;--r-md: 18px;--r-sm: 12px;--font-display: "Piazzolla", "Georgia", serif;--font-body: "Manrope", system-ui, sans-serif;color-scheme:light dark}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg: #17142b;--text: #f2ede4;--text-soft: #a79fc2;--card: #241f3d;--line: rgba(242, 237, 228, .1);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .2), 0 6px 16px -8px rgba(0, 0, 0, .3);--shadow-md: 0 2px 6px -2px rgba(0, 0, 0, .3), 0 18px 40px -16px rgba(0, 0, 0, .55);--coral-ink: #3f1608}}:root[data-theme=dark]{--bg: #17142b;--text: #f2ede4;--text-soft: #a79fc2;--card: #241f3d;--line: rgba(242, 237, 228, .1);--shadow-sm: 0 1px 2px rgba(0, 0, 0, .2), 0 6px 16px -8px rgba(0, 0, 0, .3);--shadow-md: 0 2px 6px -2px rgba(0, 0, 0, .3), 0 18px 40px -16px rgba(0, 0, 0, .55);--coral-ink: #3f1608}:root[data-theme=light]{color-scheme:light}:root[data-theme=dark]{color-scheme:dark}:root:has([data-status=sleeping]){--mood: var(--periwinkle);--mood-ink: var(--periwinkle-ink);--mood-sky: linear-gradient(140deg, #8b90ff 0%, #6f75f3 55%, #5d63e6 100%)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--font-body);-webkit-font-smoothing:antialiased;transition:background-color .6s ease}button{font-family:inherit}:focus-visible{outline:2px solid var(--mood);outline-offset:2px}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}
