/* manrope-cyrillic-ext-wght-normal */
@font-face {
  font-family: 'Manrope Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(data:font/woff2;base64,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) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* manrope-cyrillic-wght-normal */
@font-face {
  font-family: 'Manrope Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(/assets/manrope-cyrillic-wght-normal-Dvxsihut.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* manrope-greek-wght-normal */
@font-face {
  font-family: 'Manrope Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(/assets/manrope-greek-wght-normal-DL7QRZyv.woff2) format('woff2-variations');
  unicode-range: U+0370-0377,U+037A-037F,U+0384-038A,U+038C,U+038E-03A1,U+03A3-03FF;
}

/* manrope-vietnamese-wght-normal */
@font-face {
  font-family: 'Manrope Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(/assets/manrope-vietnamese-wght-normal-usUDDRr7.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* manrope-latin-ext-wght-normal */
@font-face {
  font-family: 'Manrope Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(/assets/manrope-latin-ext-wght-normal-Ch3YOpNY.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* manrope-latin-wght-normal */
@font-face {
  font-family: 'Manrope Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 800;
  src: url(/assets/manrope-latin-wght-normal-DHIcAJRg.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/* unbounded-cyrillic-ext-wght-normal */
@font-face {
  font-family: 'Unbounded Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(data:font/woff2;base64,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) format('woff2-variations');
  unicode-range: U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F;
}

/* unbounded-cyrillic-wght-normal */
@font-face {
  font-family: 'Unbounded Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/assets/unbounded-cyrillic-wght-normal-C627f1f8.woff2) format('woff2-variations');
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

/* unbounded-vietnamese-wght-normal */
@font-face {
  font-family: 'Unbounded Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/assets/unbounded-vietnamese-wght-normal-rat7GD3o.woff2) format('woff2-variations');
  unicode-range: U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

/* unbounded-latin-ext-wght-normal */
@font-face {
  font-family: 'Unbounded Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/assets/unbounded-latin-ext-wght-normal-D6H-S6MW.woff2) format('woff2-variations');
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* unbounded-latin-wght-normal */
@font-face {
  font-family: 'Unbounded Variable';
  font-style: normal;
  font-display: swap;
  font-weight: 200 900;
  src: url(/assets/unbounded-latin-wght-normal-D5afBTBx.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
  font-family: 'Manrope Variable', sans-serif; color: #222; background: #fbf8fc;
  font-synthesis: none; text-rendering: optimizeLegibility;
  --ink: #222; --muted: #62616a; --paper: #fff; --paper-raised: rgb(255 255 255 / 78%);
  --paper-deep: #ece8f1; --line: #d5d0da; --green: #087a4b; --neon: #26ff95;
  --neon-soft: #d8ffe9; --violet: #8f7bc5; --violet-soft: #f1edfb; --amber: #c77a00;
  --amber-soft: #fff2d4; --danger: #a44956; --danger-soft: #fff0f2;
  --font-display: 'Unbounded Variable', sans-serif; --shadow: 0 18px 50px rgb(34 34 34 / 9%);
  --mobile-nav-clearance: calc(86px + env(safe-area-inset-bottom));
}
* { box-sizing: border-box; }
html { min-height: 100%; color-scheme: light; background: var(--paper-deep); }
body { min-height: 100vh; margin: 0; background: radial-gradient(circle at 94% 4%, rgb(38 255 149 / 19%), transparent 28rem), radial-gradient(circle at 72% 2%, rgb(143 123 197 / 14%), transparent 34rem), radial-gradient(circle at 6% 52%, rgb(174 191 210 / 13%), transparent 30rem), var(--paper-deep); }
button, input, textarea, select { font: inherit; }
button, a, input, textarea, select { -webkit-tap-highlight-color: transparent; }
button { cursor: pointer; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
::selection { color: var(--ink); background: var(--neon); }

.app-shell { min-height: 100vh; padding-bottom: calc(92px + env(safe-area-inset-bottom)); }
.topbar { position: sticky; top: 0; z-index: 10; display: flex; min-height: 76px; align-items: center; justify-content: space-between; padding: 12px max(24px, env(safe-area-inset-left)); border-bottom: 1px solid var(--line); background: rgb(243 240 250 / 90%); backdrop-filter: blur(20px) saturate(125%); }
.wordmark { display: flex; align-items: center; gap: 12px; color: var(--ink); font-family: var(--font-display); font-size: 13px; font-weight: 650; letter-spacing: -.025em; text-decoration: none; }
.wordmark-mark { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; background: var(--neon); color: var(--ink); font-size: 11px; font-weight: 800; letter-spacing: -.05em; text-transform: uppercase; box-shadow: inset 0 0 0 1px rgb(34 34 34 / 8%); }
.wordmark-mark img { display: block; width: 100%; height: 100%; }
.topbar-meta { display: flex; min-width: 0; align-items: center; gap: 12px; }
.connection-state { display: inline-flex; min-height: 32px; align-items: center; gap: 7px; padding: 0 11px; border: 1px solid var(--line); border-radius: 999px; background: rgb(255 255 255 / 82%); color: var(--green); font-size: 12px; font-weight: 750; letter-spacing: 0; text-transform: none; box-shadow: 0 8px 24px rgb(34 34 34 / 6%); }
.connection-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 3px rgb(8 122 75 / 12%); }
.connection-state.offline { color: var(--muted); background: rgb(255 255 255 / 92%); }
.connection-state.offline .connection-dot { background: #ffb84d; box-shadow: 0 0 0 3px rgb(255 184 77 / 14%); }
.current-user { display: flex; min-width: 0; align-items: center; gap: 8px; padding: 4px 10px 4px 4px; border: 1px solid var(--line); border-radius: 999px; background: var(--paper-raised); }
.current-user-avatar { display: grid; flex: 0 0 auto; width: 30px; height: 30px; place-items: center; border-radius: 50%; background: var(--neon); color: var(--ink); font-size: 10px; font-weight: 900; }
.current-user-name { overflow: hidden; max-width: min(30vw, 230px); color: var(--ink); font-size: 12px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }

.page-frame { width: min(880px, 100%); margin: 0 auto; padding: 54px 24px 30px; animation: surface-arrival 480ms cubic-bezier(.16, 1, .3, 1) both; }
.page-frame-wide { width: min(1600px, 100%); }
.page-stack { display: grid; gap: 24px; }
.page-heading { max-width: 680px; }
.page-heading h1 { max-width: 760px; margin: 8px 0 10px; font-family: var(--font-display); font-size: clamp(34px, 7vw, 58px); font-weight: 540; line-height: .98; letter-spacing: -.04em; }
.page-heading p:last-child { max-width: 590px; margin-bottom: 0; color: var(--muted); font-size: 15px; line-height: 1.6; }
.eyebrow { margin: 0; color: var(--green); font-size: 10px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.empty-card { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper-raised); box-shadow: var(--shadow); }
.empty-card h2 { margin: 1px 0 7px; font-family: var(--font-display); font-size: 16px; font-weight: 580; letter-spacing: -.03em; }
.empty-card p { margin: 0; color: var(--muted); line-height: 1.5; }
.empty-index, .state-symbol { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 12px; background: var(--neon-soft); color: var(--green); font-size: 18px; font-weight: 800; }
.primary-action { grid-column: 2; justify-self: start; padding: 10px 15px; border: 0; border-radius: 10px; background: var(--neon); color: var(--ink); font-weight: 800; opacity: .65; }

.bottom-nav { position: fixed; right: 12px; bottom: max(18px, env(safe-area-inset-bottom)); left: 12px; z-index: 20; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; width: min(620px, calc(100% - 24px)); margin: auto; padding: 6px; border: 1px solid var(--ink); border-radius: 16px; background: rgb(255 255 255 / 90%); box-shadow: 0 18px 48px rgb(34 34 34 / 16%); backdrop-filter: blur(16px); }
.bottom-nav a { position: relative; display: flex; align-items: center; justify-content: center; padding: 11px 8px; border-radius: 10px; color: var(--muted); text-align: center; text-decoration: none; font-size: 14px; font-weight: 800; line-height: 1.2; transition: background-color 160ms ease, color 160ms ease; }
.bottom-nav a.active { background: var(--neon); color: var(--ink); }
.bottom-nav-icon { display: none; width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }

.update-banner { position: fixed; right: 20px; bottom: 96px; z-index: 24; display: inline-flex; min-height: 58px; align-items: center; gap: 12px; padding: 9px 16px 9px 10px; border: 1px solid var(--ink); border-radius: 14px; appearance: none; background: var(--ink); color: white; text-align: left; box-shadow: 0 18px 40px rgb(34 34 34 / 20%); transition: transform 160ms ease, box-shadow 160ms ease; }
.update-banner-icon { display: grid; flex: 0 0 auto; width: 38px; height: 38px; place-items: center; border-radius: 10px; background: var(--neon); color: var(--ink); font-size: 22px; font-weight: 900; line-height: 1; }
.update-banner-copy { display: grid; gap: 2px; }
.update-banner-copy strong { font-size: 13px; line-height: 1.2; }
.update-banner-copy small { color: #c9cec8; font-size: 10px; font-weight: 650; }
.ios-install-prompt { position: fixed; right: 12px; bottom: calc(96px + env(safe-area-inset-bottom)); left: 12px; z-index: 24; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: start; max-width: 620px; margin: auto; padding: 16px; border: 1px solid var(--ink); border-radius: 16px; background: var(--paper); box-shadow: var(--shadow); }
.ios-install-share { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 11px; background: var(--neon); color: var(--ink); font-size: 23px; font-weight: 900; }
.ios-install-copy { display: grid; min-width: 0; gap: 5px; }
.ios-install-copy .eyebrow { font-size: 9px; }
.ios-install-copy strong { font-size: 14px; line-height: 1.3; }
.ios-install-copy > p:last-child { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.45; }
.ios-share-inline { display: inline-grid; min-width: 18px; height: 18px; place-items: center; margin-right: 2px; border: 1px solid var(--line); border-radius: 5px; color: var(--green); font-weight: 900; }
.ios-install-prompt > button { width: 34px; height: 34px; padding: 0; border: 1px solid var(--line); border-radius: 9px; background: transparent; color: var(--muted); font-size: 22px; line-height: 1; }

.session-banner { display: flex; justify-content: space-between; gap: 16px; margin-bottom: 24px; padding: 13px 15px; border: 1px solid #d3a23e; border-radius: 12px; background: var(--amber-soft); color: #634009; font-size: 13px; }
.session-banner a { color: inherit; font-weight: 800; }
.session-banner.quiet { border-color: var(--line); background: var(--paper-raised); color: var(--muted); }
.form-card, .pairing-state, .settings-card { padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper-raised); box-shadow: 0 12px 34px rgb(34 34 34 / 6%); }
.form-card { display: grid; gap: 12px; }
.form-card label, .reminder-composer > label, .reminder-schedule-fields label { font-size: 12px; font-weight: 800; }
.form-card input:not([type='radio']):not([type='checkbox']), .reminder-composer input:not([type='radio']):not([type='checkbox']), .reminder-composer textarea, .reminder-composer select, .reschedule-form input, .section-rename-input, .quick-add input, .add-section-card input, .setting-field select { width: 100%; min-height: 46px; padding: 10px 12px; border: 1px solid #bcb6c4; border-radius: 10px; outline: 0; background: white; color: var(--ink); }
.form-card input:not([type='radio']):not([type='checkbox']):focus, .reminder-composer input:not([type='radio']):not([type='checkbox']):focus, .reminder-composer textarea:focus, .reminder-composer select:focus, .reschedule-form input:focus, .section-rename-input:focus, .quick-add input:focus, .add-section-card input:focus, .setting-field select:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgb(38 255 149 / 18%); }
.form-note { margin: 2px 0 0; color: var(--muted); font-size: 12px; line-height: 1.5; }
.primary-button, .text-button { min-height: 42px; padding: 9px 15px; border-radius: 10px; font-weight: 800; }
.primary-button { display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--neon); background: var(--neon); color: var(--ink); text-decoration: none; }
.primary-button:hover { border-color: var(--ink); }
.primary-button:disabled, .text-button:disabled { cursor: default; opacity: .45; }
.text-button { border: 1px solid var(--line); background: var(--paper-raised); color: var(--green); }
.text-button:hover { border-color: var(--green); background: var(--neon-soft); }
.pairing-state { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start; }
.pairing-state h2 { margin: 2px 0 8px; font-family: var(--font-display); font-size: 18px; font-weight: 580; letter-spacing: -.035em; }
.pairing-state p { margin: 0; color: var(--muted); line-height: 1.55; }
.pairing-state .primary-button, .pairing-state .text-button { grid-column: 2; justify-self: start; }
.pairing-state.danger { border-color: #e0b9bf; background: var(--danger-soft); }
.settings-title { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.settings-title h2 { margin: 0; font-family: var(--font-display); font-size: 17px; font-weight: 580; letter-spacing: -.035em; }
.device-list { display: grid; gap: 0; margin: 16px 0 0; padding: 0; list-style: none; }
.device-list li { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 0; border-top: 1px solid var(--line); }
.device-list li div { display: grid; gap: 4px; }
.device-list small { color: var(--muted); }
.danger-text { color: var(--danger); }
.sign-out { justify-self: start; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.plans-heading, .plan-title-line, .todo-section-heading, .quick-add, .add-section-card > div { display: flex; align-items: center; gap: 10px; }
.plans-heading { justify-content: space-between; }
.day-heading { max-width: none; }
.day-title-row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 24px; }
.day-heading-copy { display: grid; min-width: 0; gap: 7px; }
.day-heading .day-period-label { margin: 0; color: var(--green); font-family: inherit; font-size: 10px; font-weight: 850; line-height: 1.2; letter-spacing: .13em; text-transform: uppercase; }
.day-date { margin: 0; font-family: var(--font-display); font-size: clamp(25px, 4.5vw, 38px); font-weight: 560; line-height: 1.08; letter-spacing: -.045em; }
.date-nav { display: flex; flex: 0 0 auto; flex-wrap: nowrap; justify-content: flex-end; gap: 3px; max-width: 100%; padding: 4px; border: 1px solid var(--line); border-radius: 13px; background: var(--paper-raised); box-shadow: 0 8px 24px rgb(34 34 34 / 6%); }
.date-nav button { display: grid; min-width: 38px; min-height: 38px; place-items: center; padding: 0 11px; border: 1px solid transparent; border-radius: 9px; background: transparent; color: var(--green); font-weight: 850; transition: border-color 140ms ease, background-color 140ms ease; }
.date-nav .date-nav-arrow { flex: 0 0 38px; padding-inline: 0; font-size: 17px; }
.date-nav .date-nav-today { min-width: 78px; }
.date-nav button:hover { border-color: var(--line); background: var(--neon-soft); }
.date-nav-picker { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); flex: 0 1 8.5rem; width: 8.5rem; min-width: 0; cursor: pointer; }
.date-nav-picker input, .date-nav-picker-value { grid-area: 1 / 1; }
.date-nav-picker input { display: block; appearance: none; inline-size: 100%; min-width: 0; min-height: 38px; max-width: 100%; margin: 0; padding: 0 7px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); color: transparent; cursor: pointer; font-size: 12px; font-weight: 800; }
.date-nav-picker input::-webkit-datetime-edit { opacity: 0; }
.date-nav-picker input::-webkit-calendar-picker-indicator { position: relative; z-index: 2; cursor: pointer; }
.date-nav-picker-value { z-index: 1; align-self: center; justify-self: center; color: var(--green); font-size: 12px; font-weight: 800; line-height: 1; pointer-events: none; }
.reorder-actions, .item-actions, .section-edit-actions { display: flex; gap: 4px; }
.reorder-actions button, .item-actions button, .section-rename-form button, .section-edit-actions button { display: grid; min-width: 34px; min-height: 34px; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); color: var(--green); font-weight: 850; }
.reorder-actions button:hover, .item-actions button:hover, .section-edit-actions button:hover { border-color: var(--green); background: var(--neon-soft); }
.reorder-actions button:disabled, .item-actions button:disabled { cursor: default; opacity: .28; }
.todo-board { display: grid; gap: 16px; }
.todo-section-card, .add-section-card, .carry-card, .plan-card { border: 1px solid var(--line); border-radius: 16px; background: var(--paper-raised); box-shadow: 0 12px 34px rgb(34 34 34 / 6%); }
.todo-section-card { overflow: hidden; }
.todo-section-heading { min-height: 60px; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.section-number { color: var(--green); font-family: var(--font-display); font-size: 9px; font-weight: 800; letter-spacing: .08em; }
.section-title-input, .todo-text-input, .plan-title-input { min-width: 0; border: 0; outline: none; background: transparent; color: var(--ink); }
.section-title { flex: 1; min-width: 0; margin: 0; overflow: hidden; font-family: var(--font-display); font-size: 14px; font-weight: 580; line-height: 1.25; letter-spacing: -.035em; text-overflow: ellipsis; white-space: nowrap; }
.section-rename-form { display: flex; flex: 1; min-width: 0; align-items: center; gap: 5px; }
.section-rename-input { min-width: 0; min-height: 36px; flex: 1; padding-block: 5px; font-weight: 800; }
.section-title-input:focus, .todo-text-input:focus, .plan-title-input:focus { box-shadow: inset 0 -2px 0 var(--neon); }
.todo-items { margin: 0; padding: 0; list-style: none; }
.todo-item { border-bottom: 1px solid #e7e3eb; transition: background-color 140ms ease; }
.todo-item:hover { background: rgb(216 255 233 / 28%); }
.todo-item.is-important { background: rgb(255 246 218 / 42%); }
.todo-item.is-important:hover { background: rgb(255 242 202 / 58%); }
.todo-item:last-child { border-bottom: 0; }
.todo-item-mainline { display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto auto; gap: 8px; align-items: center; min-height: 44px; padding: 6px 12px; }
.todo-check { display: grid; width: 24px; height: 24px; place-items: center; padding: 0; border: 1.5px solid #97919e; border-radius: 7px; background: white; color: var(--ink); font-size: 13px; font-weight: 900; }
.todo-important-toggle { display: grid; width: 24px; height: 24px; place-items: center; padding: 0; border: 1px solid transparent; border-radius: 7px; background: transparent; color: #8c7f63; font-size: 18px; line-height: 1; }
.todo-important-toggle[aria-pressed='true'] { border-color: rgb(181 134 27 / 22%); background: rgb(255 224 130 / 35%); color: #946c00; }
.todo-item.is-completed .todo-check { border-color: var(--neon); background: var(--neon); }
.todo-item.is-carried .todo-check { border-color: var(--line); background: var(--paper-deep); color: var(--muted); }
.todo-text-input { field-sizing: content; width: 100%; max-width: 100%; min-height: 30px; padding: 4px 2px; overflow: hidden; resize: none; line-height: 1.4; overflow-wrap: anywhere; white-space: pre-wrap; }
.todo-item.is-important .todo-text-input { font-weight: 650; }
.todo-item.is-completed .todo-text-input, .todo-item.is-carried .todo-text-input { color: var(--muted); text-decoration: line-through; }
.item-actions { justify-content: flex-end; opacity: .55; transition: opacity 140ms ease; }
.todo-item:focus-within .item-actions, .todo-item:hover .item-actions { opacity: 1; }
.todo-item-mainline .item-actions button { min-width: 30px; min-height: 30px; }
.item-actions .copy-action { width: auto; padding: 0 9px; font-size: 11px; font-weight: 800; }
.item-actions .danger-icon, .section-edit-actions .danger-icon { border-color: #e5c5ca; color: var(--danger); }
.copy-confirmation { display: inline-flex; min-height: 30px; align-items: center; padding: 0 8px; color: var(--green); font-size: 11px; font-weight: 850; white-space: nowrap; }
.quick-add { padding: 11px 14px; border-top: 1px dashed var(--line); background: rgb(236 232 241 / 35%); }
.quick-add input, .add-section-card input { flex: 1; min-width: 0; min-height: 40px; }
.quick-add button { width: 40px; height: 40px; padding: 0; border: 1px solid var(--neon); border-radius: 10px; background: var(--neon); color: var(--ink); font-size: 21px; font-weight: 700; }
.quick-add button:hover { border-color: var(--ink); }
.quick-add button:disabled { opacity: .35; }
.add-section-card { display: grid; gap: 10px; padding: 17px; border-style: dashed; box-shadow: none; }
.add-section-card label { color: var(--green); font-size: 10px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.sync-badge, .archive-badge { display: inline-flex; align-items: center; width: max-content; padding: 3px 7px; border-radius: 999px; font-size: 9px; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.sync-badge.pending { background: var(--amber-soft); color: #76510c; }
.sync-badge.conflict { background: #f8dfe3; color: #893441; }
.archive-badge { background: var(--paper-deep); color: var(--muted); }
.conflict-panel { grid-column: 1 / -1; display: grid; gap: 8px; margin: 10px 14px; padding: 12px; border: 1px solid #d59aa4; border-radius: 11px; background: var(--danger-soft); color: #6f2b36; }
.todo-board > .conflict-panel { margin: 0; }
.conflict-panel strong { font-size: 13px; }
.conflict-panel p { display: grid; gap: 2px; margin: 0; overflow-wrap: anywhere; font-size: 13px; }
.conflict-panel p span { color: #99616a; font-size: 9px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.conflict-panel small { color: #7d4c55; }
.conflict-panel div { display: flex; flex-wrap: wrap; gap: 7px; }
.conflict-panel button { min-height: 34px; padding: 6px 10px; border: 1px solid #ca8c96; border-radius: 9px; background: white; color: #79303b; font-size: 12px; font-weight: 800; }
.inline-error { margin: 0; padding: 10px 12px; border: 1px solid #e2bac0; border-radius: 10px; background: var(--danger-soft); color: #843440; font-size: 13px; }
.delete-dialog-backdrop { position: fixed; z-index: 80; inset: 0; display: grid; place-items: center; padding: 20px; background: rgb(34 34 34 / 42%); backdrop-filter: blur(4px); }
.todo-delete-dialog { width: min(100%, 430px); padding: 24px; border: 1px solid var(--ink); border-radius: 16px; background: var(--paper); box-shadow: 0 24px 70px rgb(34 34 34 / 24%); }
.todo-delete-dialog h2 { margin: 7px 0 10px; font-family: var(--font-display); font-size: 22px; font-weight: 580; letter-spacing: -.04em; }
.todo-delete-dialog > p:not(.eyebrow) { margin: 0; color: var(--muted); line-height: 1.5; }
.delete-dialog-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 22px; }
.delete-dialog-actions button { min-height: 42px; padding: 9px 14px; border-radius: 10px; font-weight: 800; }
.danger-button { border: 1px solid var(--danger); background: var(--danger); color: white; }

.carry-card { display: grid; grid-template-columns: 1fr auto; gap: 14px 20px; padding: 20px; border-color: #d6ba7b; background: #fffbf1; }
.carry-card h2 { margin: 4px 0 0; font-family: var(--font-display); font-size: 18px; font-weight: 580; letter-spacing: -.035em; }
.carry-card .carry-summary { max-width: 540px; font-size: 15px; line-height: 1.35; }
.carry-heading { grid-column: 1 / -1; display: flex; min-width: 0; align-items: end; justify-content: space-between; gap: 16px; }
.carry-card .carry-source-field { display: grid; min-width: min(100%, 230px); gap: 5px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.carry-card .carry-source-field select { min-width: 0; min-height: 40px; padding: 8px 34px 8px 11px; border: 1px solid #c9b57e; border-radius: 10px; outline: 0; background: white; color: var(--ink); cursor: pointer; font-size: 12px; font-weight: 750; letter-spacing: 0; text-transform: none; }
.carry-card .carry-source-field select:focus { border-color: var(--green); box-shadow: 0 0 0 3px rgb(38 255 149 / 18%); }
.carry-card ul { grid-column: 1 / -1; display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.carry-card label { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; }
.carry-card li { display: flex; align-items: center; gap: 12px; min-width: 0; }
.carry-card li > label { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.carry-item-copy { display: flex; min-width: 0; flex-wrap: wrap; align-items: baseline; gap: 3px 8px; }
.carry-group { color: var(--accent-strong); font-size: 10px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.carry-card .inline-error { grid-column: 1 / -1; }
.plans-heading { max-width: none; align-items: end; }
.plans-heading > div { max-width: 570px; }
.plan-form { max-width: 660px; }
.segmented-control { display: flex; gap: 5px; margin: 0; padding: 4px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper-deep); }
.segmented-control label { flex: 1; padding: 9px; border-radius: 9px; text-align: center; }
.plan-form .segmented-control { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.segmented-control .segment-button { display: flex; min-height: 44px; align-items: center; justify-content: center; padding: 8px 10px; border: 1px solid transparent; color: var(--ink); background: transparent; cursor: pointer; font-size: 13px; font-weight: 800; line-height: 1.15; transition: background-color 140ms ease, border-color 140ms ease; }
.segmented-control .segment-button:hover { border-color: var(--green); background: rgb(255 255 255 / 60%); }
.segmented-control .segment-button.active { border-color: var(--neon); background: var(--neon); color: var(--ink); }
.segmented-control .segment-button:has(input:focus-visible) { outline: 3px solid rgb(8 122 75 / 25%); outline-offset: 2px; }
.today-plan-note { margin: 0; padding: 12px 14px; border-radius: 10px; background: var(--neon-soft); color: var(--green); }
.month-plan-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.month-plan-fields label { min-width: 0; }
.month-picker-field, .month-picker-field input { cursor: pointer; }
.date-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.date-fields .form-note { grid-column: 1 / -1; }
.plan-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.plan-card { display: grid; gap: 9px; min-height: 166px; padding: 20px; color: var(--ink); text-decoration: none; transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease; }
.plan-card:hover { border-color: var(--green); transform: translateY(-3px); box-shadow: var(--shadow); }
.plan-card h2 { margin: 0; font-family: var(--font-display); font-size: 21px; font-weight: 560; line-height: 1.15; letter-spacing: -.04em; }
.plan-card p { margin: auto 0 0; color: var(--muted); font-size: 12px; }
.plan-card > div { display: flex; gap: 8px; }
.plan-kind { color: var(--green); font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.plan-detail-heading { max-width: none; }
.plan-title-line { margin: 7px 0 10px; }
.plan-title-input { width: min(100%, 680px); font-family: var(--font-display); font-size: clamp(30px, 7vw, 52px); font-weight: 540; line-height: 1.03; letter-spacing: -.04em; }
.plan-detail-heading .text-button { margin-top: 12px; }

.reminders-page { --reminder-accent: var(--green); }
.reminder-composer { display: grid; gap: 12px; padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper-raised); box-shadow: 0 12px 34px rgb(34 34 34 / 6%); }
.reminder-composer > label, .reminder-schedule-fields label { display: grid; gap: 7px; }
.reminder-composer textarea { min-height: 104px; resize: vertical; }
.reminder-composer select { padding-right: 38px; cursor: pointer; }
.reminder-schedule-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.reminder-schedule-fields.timezone-only { grid-template-columns: 1fr; }
.reminder-schedule-fields label, .reminder-schedule-fields input, .reminder-schedule-fields select { min-width: 0; }
.reminder-composer .primary-button { justify-self: start; }
.offline-compose-note { margin: 0; color: #76510c; font-size: 12px; }
.reminder-list { display: grid; gap: 13px; }
.reminder-card { position: relative; display: grid; gap: 11px; overflow: hidden; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: var(--paper-raised); box-shadow: 0 12px 34px rgb(34 34 34 / 6%); }
.reminder-card::before { position: absolute; top: 0; right: 0; left: 0; height: 3px; content: ''; background: var(--neon); }
.reminder-card > header { display: flex; align-items: center; gap: 8px; }
.reminder-status { color: var(--green); font-size: 9px; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.reminder-card h2 { margin: 0; font-size: 17px; line-height: 1.4; white-space: pre-wrap; overflow-wrap: anywhere; }
.reminder-due { margin: 0; color: var(--muted); font-size: 13px; font-weight: 750; }
.reminder-image-frame { display: grid; min-height: 140px; margin: 0; overflow: hidden; aspect-ratio: 16 / 9; border: 1px solid var(--line); border-radius: 12px; background: var(--paper-deep); }
.reminder-image { width: 100%; height: 100%; object-fit: cover; }
.reminder-image-placeholder { display: grid; min-height: 140px; place-items: center; padding: 20px; color: var(--muted); font-size: 12px; font-weight: 700; text-align: center; }
.reminder-missed::before { background: #ffb84d; }
.reminder-delivery_unknown::before { background: var(--danger); }
.reminder-completed, .reminder-cancelled { opacity: .7; }
.reminder-completed::before, .reminder-cancelled::before { background: #aaa4ae; }
.reminder-completed h2, .reminder-cancelled h2 { text-decoration: line-through; }
.reminder-notice { margin: 0; padding: 10px 12px; border-radius: 9px; background: var(--amber-soft); color: #67430b; font-size: 12px; line-height: 1.45; }
.reminder-notice.danger { background: var(--danger-soft); color: #74303a; }
.reminder-actions, .snooze-actions { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; }
.reminder-actions .text-button { min-height: 36px; padding: 7px 11px; }
.snooze-actions { padding-top: 11px; border-top: 1px solid var(--line); }
.snooze-actions span { margin-right: 3px; color: var(--muted); font-size: 9px; font-weight: 850; letter-spacing: .07em; text-transform: uppercase; }
.snooze-actions button { min-height: 34px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 9px; background: white; color: var(--green); font-size: 11px; font-weight: 800; }
.snooze-actions button:hover { border-color: var(--green); background: var(--neon-soft); }
.reschedule-form { display: grid; grid-template-columns: 1fr auto auto; gap: 8px; align-items: end; padding: 12px; border-radius: 12px; background: var(--violet-soft); }
.reschedule-form label { display: grid; gap: 5px; font-size: 11px; font-weight: 800; }
.retry-delivery { justify-self: start; border-color: var(--danger); background: var(--danger); color: white; }

.channel-settings { display: grid; gap: 0; }
.setting-toggle, .setting-field { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px 0; border-top: 1px solid var(--line); }
.setting-toggle { cursor: pointer; }
.setting-toggle:first-of-type { margin-top: 14px; }
.setting-toggle span, .setting-field span { display: grid; gap: 4px; }
.setting-toggle small, .setting-field small { color: var(--muted); line-height: 1.4; }
.setting-field small { max-width: 450px; }
.setting-toggle input { position: relative; flex: 0 0 auto; width: 48px; height: 28px; border: 1px solid #aaa4ae; border-radius: 999px; appearance: none; background: #dcd8e1; transition: background-color 150ms ease; }
.setting-toggle input::after { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; content: ''; background: white; box-shadow: 0 2px 6px rgb(34 34 34 / 22%); transition: transform 180ms cubic-bezier(.16, 1, .3, 1); }
.setting-toggle input:checked { border-color: var(--neon); background: var(--neon); }
.setting-toggle input:checked::after { transform: translateX(20px); background: var(--ink); }
.setting-toggle input:disabled, .setting-field select:disabled { cursor: default; opacity: .5; }
.setting-field select { width: auto; min-width: 150px; font-weight: 750; }
.setting-warning { margin: 8px 0; padding: 10px 12px; border-radius: 9px; background: var(--amber-soft); color: #67430b; font-size: 12px; line-height: 1.45; }

@media (hover: hover) {
  .update-banner:hover { transform: translateY(-2px); box-shadow: 0 22px 46px rgb(34 34 34 / 25%); }
  .bottom-nav a:hover:not(.active) { background: var(--paper-deep); color: var(--ink); }
}
@media (max-width: 900px) {
  .bottom-nav { right: max(12px, env(safe-area-inset-right)); bottom: calc(10px + env(safe-area-inset-bottom)); left: max(12px, env(safe-area-inset-left)); gap: 0; width: auto; min-height: 64px; margin: 0; padding: 7px; border: 1px solid var(--line); border-radius: 18px; background: rgb(255 255 255 / 94%); box-shadow: 0 18px 48px rgb(34 34 34 / 16%); backdrop-filter: blur(24px) saturate(125%); }
  .bottom-nav a { min-width: 0; min-height: 50px; flex-direction: column; gap: 3px; margin: 0; padding: 4px 2px; border-radius: 10px; font-size: 12px; line-height: 1; }
  .bottom-nav a + a::before { content: none; }
  .bottom-nav-icon { display: block; width: 20px; height: 20px; flex: 0 0 auto; }
}
@media (max-width: 620px) {
  .app-shell { padding-bottom: var(--mobile-nav-clearance); }
  .topbar { min-height: calc(64px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) max(14px, env(safe-area-inset-right)) 0 max(14px, env(safe-area-inset-left)); }
  .wordmark { gap: 10px; font-size: 12px; }
  .wordmark-mark { width: 34px; height: 34px; border-radius: 10px; }
  .topbar-meta { gap: 8px; }
  .connection-state { min-height: 30px; padding-inline: 8px; font-size: 12px; box-shadow: none; }
  .current-user { padding: 3px; }
  .current-user-name { display: none; }
  .page-frame { padding: 38px 16px 26px; }
  .page-stack { gap: 20px; }
  .page-heading h1 { font-size: clamp(31px, 10vw, 44px); }
  .update-banner { right: 12px; bottom: var(--mobile-nav-clearance); max-width: calc(100vw - 24px); }
  .ios-install-prompt { bottom: calc(var(--mobile-nav-clearance) + 12px); }
  .plans-heading { align-items: flex-start; }
  .plans-heading { display: grid; }
  .day-title-row { flex-direction: column; align-items: flex-start; gap: 14px; }
  .day-date { font-size: clamp(24px, 8vw, 34px); }
  .date-nav { align-self: flex-start; }
  .date-nav button { min-width: 38px; min-height: 38px; }
  .todo-item-mainline { grid-template-columns: auto auto minmax(0, 1fr) auto; padding-inline: 10px; }
  .todo-item-mainline > .sync-badge { display: none; }
  .todo-section-heading { flex-wrap: wrap; }
  .reorder-actions { margin-left: auto; }
  .item-actions { grid-column: 3 / -1; justify-content: flex-start; }
  .carry-card { grid-template-columns: 1fr; }
  .carry-card ul, .carry-card .inline-error { grid-column: 1; }
  .carry-heading { align-items: stretch; flex-direction: column; }
  .carry-source-field { width: 100%; }
  .date-fields { grid-template-columns: 1fr; }
  .date-fields .form-note { grid-column: 1; }
  .plan-form .segmented-control { grid-template-columns: 1fr; }
  .reschedule-form { grid-template-columns: 1fr; }
  .reminder-schedule-fields select { padding-right: 24px; font-size: 11px; }
  .setting-field { align-items: flex-start; flex-direction: column; }
  .setting-field select { width: 100%; }
  .ios-install-prompt { padding: 14px; }
}
@keyframes surface-arrival { from { opacity: .65; filter: blur(5px); transform: translateY(10px); } to { opacity: 1; filter: blur(0); transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }

.toast-host[data-v-4a4c303d] { position: fixed; right: 16px; bottom: calc(100px + env(safe-area-inset-bottom)); z-index: 70; display: grid; gap: 8px; width: min(390px, calc(100vw - 32px)); pointer-events: none;
}
.toast-message[data-v-4a4c303d] { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: center; width: 100%; padding: 12px 14px; border: 1px solid var(--ink); border-radius: 13px; background: var(--paper); color: var(--ink); text-align: left; box-shadow: var(--shadow); pointer-events: auto;
}
.toast-message span[data-v-4a4c303d] { display: grid; width: 26px; height: 26px; place-items: center; border-radius: 8px; background: var(--neon); font-weight: 900;
}
.toast-error[data-v-4a4c303d] { border-color: var(--danger); background: var(--danger-soft);
}
.toast-error span[data-v-4a4c303d] { background: var(--danger); color: white;
}
.toast-info span[data-v-4a4c303d] { background: var(--violet-soft); color: var(--violet);
}
@media (max-width: 620px) {
.toast-host[data-v-4a4c303d] { right: 12px; bottom: calc(var(--mobile-nav-clearance) + 16px); width: calc(100vw - 24px);
}
}