/* 小空间 V2 — editorial warmth, quiet hierarchy, and deliberate interactions. */
:root {
  color-scheme: light dark;
  --paper: #FAF9F7;
  --card: #FFFFFF;
  --ink: #242328;
  --muted: #858087;
  --line: rgba(68,57,64,.09);
  --rose: #C87990;
  --rose-soft: #F7E9EF;
  --green: #BE7990;
  --green-dark: #A75C75;
  --green-soft: #F7E9EF;
  --shadow: 0 8px 28px rgba(54,35,49,.035);
  /* Component radius scale: apply by role, not by arbitrary pixel matching.
     Nested corners obey R(inner) ~= R(outer) - inner spacing. */
  --radius-control: 12px;
  --radius-button: 16px;
  --radius-group: 20px;
  --radius-feature: 24px;
  --radius-dock: 22px;
  --radius-dock-selection: 17px;
  --radius-pill: 999px;
  font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'SF Pro Text', 'PingFang SC', system-ui, sans-serif;
}
html,body { background:var(--paper); color:var(--ink); }
body { background-image:none; letter-spacing:-.12px; }
.ambient { display:none; }
.app-shell { max-width:760px; padding:24px 24px 85px; }
.topbar { margin-bottom:30px; }
.brand-mark { width:40px; height:40px; flex:0 0 40px; border-radius:14px; }
.brand-name { font-size:17px; font-weight:750; }
.brand-subtitle { color:#8E8990; }
.member-pill { background:#F7F2F4; border-color:transparent; color:#8A6372; }
.member-dot { background:#C87990; box-shadow:0 0 0 3px #F8E7ED; }
.icon-button { background:rgba(255,255,255,.74); color:#625D65; border-color:var(--line); }
.navbar { width:fit-content; }
.nav-button.active { background:#F6E7ED; color:#B76F87; }
.nav-button:hover { background:#F8ECF1; color:#B76F87; }
.nav-icon svg { stroke:currentColor; fill:none; }
.btn-primary, .v2-primary { background:#383138; color:#fff; box-shadow:0 6px 15px rgba(36,25,35,.10); }
.btn-primary:hover, .v2-primary:hover { background:#51424E; }
.btn-light { background:#F8F1F4; color:#9B5B74; border-color:transparent; }
.btn-quiet { background:#F8F6F6; color:#686068; }
.text-link { color:#A5687E; }
.section-kicker { color:#91566D; }
.hero { border-color:rgba(255,255,255,.82); background:linear-gradient(135deg,#FFFDFD,#F9EFF3); }
.hero h1 span, .auth-story h1 span { color:#A7637C; }
.hero-copy p { color:#777078; }
.filter-details > summary { color:#A2687D; }
.chip.active { color:#A75C75; background:#F7E9EF; border-color:#EED2DB; }
.member-card { background:#F9F5F6; }
.member-avatar { background:#F8E7ED; }
.member-card:nth-child(2) .member-avatar { background:#F1E8F5; }
.shopping-row input[type=checkbox] { accent-color:#B46A83; }
.steps-list li:before { background:#F7E9EF; color:#A75C75; }
.tag { background:#F5F1F3; color:#8B6E7A; }
.metric { background:#F7F3F5; color:#84737D; }
.status-pill { background:#F7E9EF; color:#A15A75; }
.nav-button, .v2-module,.v2-life-row,.v2-memory-entry,.v2-proposal-actions button { -webkit-tap-highlight-color:transparent; }
.v2-dashboard { animation:v2-in .28s ease both; }
@keyframes v2-in { from {opacity:.7;transform:translateY(5px)} to {opacity:1;transform:none} }
.v2-welcome { margin:5px 0 28px; }
.v2-date { color:#776D76; font-size:12px; letter-spacing:.3px; font-weight:550; }
.v2-welcome h1 { margin:9px 0 6px; font-size:36px; line-height:1.17; letter-spacing:-1.45px; font-weight:780; }
.v2-heart { color:#D48BA0; margin-left:8px; font-weight:360; font-size:32px; vertical-align:2px; }
.v2-welcome p { margin:0; color:#736B73; font-size:13px; line-height:1.75; }
.v2-main-card { position:relative; overflow:hidden; border:1px solid #EEE6E9; border-radius:27px; padding:27px 27px 24px; background:#FFF; box-shadow:0 12px 34px rgba(68,35,51,.035); }
.v2-card-top { display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:22px; }
.v2-meta-label { color:#89566B; font-weight:650; font-size:11px; letter-spacing:.4px; }
.v2-pill { border-radius:999px; background:#F8F2F4; padding:6px 10px; color:#8A5A6D; font-size:10px; font-weight:600; white-space:nowrap; }
.v2-pill-done { background:#F1F5EF; color:#74826F; }
.v2-main-card h2 { margin:0 0 8px; font-size:25px; line-height:1.3; letter-spacing:-.75px; font-weight:750; }
.v2-card-intro { font-size:13px; color:#766D75; line-height:1.75; margin:0 0 22px; }
.v2-dinner-start { text-align:center; }
.v2-dinner-start .v2-card-top { text-align:left; }
.v2-dinner-symbol { width:90px; height:90px; border-radius:28px; display:grid; place-items:center; margin:0 auto 17px; background:linear-gradient(142deg,#FFF4F7,#F9E9EF); border:1px solid rgba(255,255,255,.85); box-shadow:0 8px 18px rgba(198,120,149,.08); }
.v2-dinner-symbol span { color:#CA7891; font-size:51px; line-height:1; font-family:Georgia,serif; margin-top:-2px; }
.v2-primary,.v2-secondary { display:inline-flex; justify-content:center; align-items:center; gap:7px; min-height:47px; padding:12px 17px; border:0; border-radius:15px; font-size:13px; font-weight:690; transition:transform .16s ease,background .16s ease; cursor:pointer; }
.v2-primary:active,.v2-secondary:active { transform:scale(.975); }
.v2-primary.v2-wide { width:100%; }
.v2-secondary { background:#F8F4F5; color:#685D66; }
.v2-subtle-link { width:100%; border:0; padding:16px 6px 2px; color:#756D76; background:transparent; font-size:12px; cursor:pointer; }
.v2-subtle-link span { margin-left:5px; font-size:16px; }
.v2-section { margin-top:32px; }
.v2-section-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 14px; }
.v2-section-head h2 { font-size:19px; letter-spacing:-.5px; margin:0; font-weight:750; }
.v2-section-hint { font-size:11px; color:#766D76; }
.v2-section-head button { color:#B06C83; padding:8px 0; background:none; border:0; font-size:12px; cursor:pointer; }
.v2-module-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.v2-module { position:relative; display:flex; flex-direction:column; align-items:flex-start; text-align:left; min-width:0; min-height:154px; padding:18px 17px; gap:7px; border:1px solid #F1EBEE; border-radius:22px; background:#FFF; box-shadow:0 5px 20px rgba(56,38,49,.025); cursor:pointer; }
.v2-module-icon { width:36px; height:36px; display:grid; place-items:center; background:#FAEEF3; color:#C67C93; font-family:Georgia,serif; font-size:25px; border-radius:12px; margin-bottom:9px; line-height:1; }
.v2-module strong { font-size:14px; color:#393238; font-weight:700; }
.v2-module small { font-size:11px; color:#756C75; line-height:1.5; }
.v2-module-arrow { position:absolute; right:16px; top:16px; color:#C3B7BF; font-size:15px; }
.v2-quiet-strip { margin:26px 0 5px; padding:15px 4px; display:flex; align-items:center; gap:9px; font-size:11px; color:#777078; border-top:1px solid #EFEAED; }
.v2-quiet-strip button { margin-left:auto; white-space:nowrap; color:#A7758B; border:0; background:transparent; font-size:11px; padding:8px; }
.v2-soft-dot { width:7px; height:7px; flex:0 0 7px; border-radius:50%; background:#D5ADB9; }
.v2-food-row { display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 22px; }
.v2-food-mini { display:flex; align-items:center; gap:7px; border-radius:12px; background:#FAF6F7; padding:8px 10px; color:#5F535D; font-size:12px; }
.v2-food-pic { font-size:23px; line-height:1.3; }
.v2-vote-list { display:flex; flex-wrap:wrap; gap:9px; border-top:1px solid #F2EBEF; padding:15px 0 6px; }
.v2-vote { display:flex; align-items:center; gap:7px; font-size:11px; color:#8B8188; }
.v2-vote-avatar { width:26px; height:26px; border-radius:50%; display:grid; place-items:center; font-size:11px; background:#F3E7ED; color:#B66E84; }
.v2-vote.yes { color:#688671; }
.v2-vote.yes .v2-vote-avatar { background:#E9F4E9; color:#64816D; }
.v2-proposal-actions { display:flex; flex-wrap:wrap; gap:9px; align-items:center; margin-top:17px; }
.v2-proposal-actions .v2-primary { flex:1 1 auto; }
.v2-pending-note { flex:1 1 175px; color:#B0788C; font-size:11px; line-height:1.5; }
.v2-subpage { animation:v2-in .25s ease both; padding-top:3px; }
.v2-sub-kicker { font-size:10px; letter-spacing:1.45px; font-weight:750; color:#B78C9A; }
.v2-subpage>h1 { font-size:32px; letter-spacing:-1.05px; margin:7px 0 4px; }
.v2-lead { font-size:13px; color:#988E96; margin:0 0 27px; }
.v2-life-list { border-radius:24px; background:#FFF; border:1px solid #F0EAED; overflow:hidden; padding:2px 18px; }
.v2-life-row { width:100%; display:flex; align-items:center; gap:14px; padding:16px 3px; min-height:77px; background:transparent; border:0; border-bottom:1px solid #F2EDF0; text-align:left; cursor:pointer; }
.v2-life-row:last-child { border-bottom:0; }
.v2-life-icon { width:43px; height:43px; flex:0 0 43px; display:grid; place-items:center; border-radius:15px; background:#FAEDF2; color:#BA718A; font-size:23px; }
.v2-life-row:nth-child(2) .v2-life-icon { background:#F4F1F8; color:#9183AA; }
.v2-life-row:nth-child(3) .v2-life-icon { background:#EDF4EF; color:#83A18A; }
.v2-life-copy { flex:1; display:flex; flex-direction:column; gap:5px; min-width:0; }
.v2-life-copy strong { font-size:14px; color:#3A343B; }
.v2-life-copy small { font-size:11px; color:#766D76; }
.v2-chevron { color:#B8AFB5; font-size:27px; font-weight:300; }
.v2-other-heading { font-size:18px; margin:32px 0 15px; }
.v2-future-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:11px; }
.v2-future { display:flex; flex-direction:column; gap:7px; padding:17px; background:#F5F2F3; border:1px solid #F0EAED; border-radius:21px; opacity:.76; }
.v2-future>span:first-child { font-size:25px; color:#B59CAC; margin-bottom:4px; }
.v2-future div { display:flex; flex-direction:column; gap:6px; }
.v2-future strong { font-size:13px; font-weight:700; }
.v2-future small { font-size:11px; color:#776C76; line-height:1.45; }
.v2-future>span:last-child { align-self:start; color:#886678; font-size:10px; }
.v2-memory-feature { background:linear-gradient(135deg,#FCF0F4,#F6EDF1); border-radius:25px; min-height:187px; padding:23px; display:flex; flex-direction:column; justify-content:center; gap:7px; margin-bottom:31px; color:#9B7183; }
.v2-memory-heart { font-size:38px; font-family:Georgia,serif; line-height:1.2; color:#C88298; }
.v2-memory-feature>span:nth-child(2) { font-size:12px; }
.v2-memory-feature strong { font-size:39px; line-height:1.2; color:#76475C; font-weight:740; }
.v2-memory-feature strong small { font-size:12px; color:#B5879A; font-weight:500; }
.v2-memory-feature p { font-size:11px; margin:0; color:#B18C9D; }
.v2-memory-list { background:#FFF; border-radius:20px; border:1px solid #F0EAED; padding:3px 15px; }
.v2-memory-entry { display:flex; justify-content:space-between; align-items:center; width:100%; padding:17px 3px; background:none; text-align:left; border:0; border-bottom:1px solid #F2EDF0; cursor:pointer; }
.v2-memory-entry:last-child { border-bottom:none; }
.v2-memory-entry div { display:grid; gap:5px; min-width:0; }
.v2-memory-entry strong { color:#413840; font-size:13px; }
.v2-memory-entry div>span { font-size:12px; color:#746A74; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.v2-memory-entry>span { color:#B9A6B1; }
.v2-memory-empty { padding:24px; border-radius:18px; background:#FFF; color:#92868F; font-size:12px; line-height:1.8; }
.v2-memory-empty button { display:block; border:0; background:none; color:#B16D86; margin-top:10px; padding:5px 0; }
.v2-tabs .nav-icon { display:grid; place-items:center; }
.v2-tabs .nav-icon svg { width:21px; height:21px; stroke-width:1.8; }
.v2-tabs .nav-mobile-label, .v2-tabs .nav-desktop-label { font-size:10px; font-weight:630; }
@media (max-width:680px) {
  .app-shell { padding:calc(15px + env(safe-area-inset-top)) 20px calc(115px + env(safe-area-inset-bottom)); }
  .topbar { margin-bottom:28px; }
  .brand-mark { width:36px; height:36px; flex-basis:36px; border-radius:12px; }
  .brand-name { font-size:15px; }
  .brand-subtitle { font-size:10px; max-width:190px; }
  .member-pill { font-size:10px; padding:6px 9px; }
  .topbar .icon-button { width:37px; height:37px; }
  .navbar.v2-tabs { position:fixed; bottom:calc(10px + env(safe-area-inset-bottom)); left:50%; transform:translateX(-50%); width:calc(100% - 34px); max-width:440px; display:flex; margin:0; padding:7px; border-radius:25px; background:rgba(255,255,255,.81); border:1px solid rgba(236,226,232,.85); box-shadow:0 10px 30px rgba(65,38,53,.11),inset 0 1px 0 rgba(255,255,255,.85); -webkit-backdrop-filter:blur(28px) saturate(170%); backdrop-filter:blur(28px) saturate(170%); }
  .v2-tabs .nav-button { min-height:48px; border-radius:18px; padding:5px; color:#A19AA1; }
  .v2-tabs .nav-button.active { background:#F8EAF0; color:#A85F79; }
  .v2-tabs .nav-icon svg { width:22px; height:22px; }
  .v2-welcome { margin:0 0 24px; }
  .v2-welcome h1 { font-size:31px; }
  .v2-main-card { padding:20px 19px 19px; border-radius:24px; }
  .v2-card-top { margin-bottom:19px; }
  .v2-main-card h2 { font-size:23px; }
  .v2-card-intro { font-size:12px; }
  .v2-dinner-symbol { width:79px; height:79px; margin:0 auto 14px; border-radius:24px; }
  .v2-dinner-symbol span { font-size:46px; }
  .v2-primary,.v2-secondary { min-height:47px; }
  .v2-section { margin-top:29px; }
  .v2-section-head h2 { font-size:18px; }
  .v2-module-grid { gap:10px; }
  .v2-module { padding:16px 14px; min-height:147px; border-radius:20px; }
  .v2-quiet-strip { margin-top:22px; }
  .v2-subpage>h1 { font-size:29px; }
  .v2-future { padding:14px; }
  .v2-proposal-actions .v2-secondary { min-height:46px; }
}
@media (max-width:365px) {
  .app-shell { padding-left:14px; padding-right:14px; }
  .brand-subtitle { max-width:120px; }
  .v2-module { padding:13px 12px; }
  .v2-module strong { font-size:13px; }
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper:#111015;--card:#232127;--ink:#F7F3F5;--muted:#A9A0A8;--line:rgba(255,255,255,.10);
    --green:#D8A0B3;--green-dark:#E1AFC0;--green-soft:#3E2934;--rose:#DC9EAF;--rose-soft:#392630;
  }
  html,body { background:#111015; color:#F7F3F5; }
  .brand-name,.v2-welcome h1,.v2-section-head h2,.v2-main-card h2,.v2-subpage h1,.v2-other-heading { color:#F7F3F5; }
  .brand-subtitle,.v2-welcome p,.v2-date,.v2-card-intro,.v2-section-hint,.v2-lead { color:#A69BA5; }
  .member-pill { background:#312831; color:#E5B5C3; }
  .member-dot { background:#D89EB1; box-shadow:0 0 0 3px #49323E; }
  .v2-main-card,.v2-module,.v2-life-list,.v2-memory-list,.v2-memory-empty { background:#232127; border-color:#373039; box-shadow:none; }
  .v2-meta-label { color:#C593A6; }
  .v2-pill,.v2-food-mini,.v2-secondary { background:#352A33; color:#D8B5C3; }
  .v2-pill-done { background:#25382A; color:#AED4B5; }
  .v2-dinner-symbol { background:linear-gradient(145deg,#422B38,#332730); border-color:#50343F; }
  .v2-dinner-symbol span { color:#EDA9C0; }
  .v2-primary,.btn-primary { background:#E3ADC0; color:#271924; }
  .v2-primary:hover { background:#F1C2D1; }
  .v2-subtle-link,.v2-module small,.v2-life-copy small,.v2-future small { color:#A69BA5; }
  .v2-module strong,.v2-life-copy strong,.v2-future strong,.v2-memory-entry strong { color:#F5F0F4; }
  .v2-module-icon,.v2-life-icon { background:#3E2A37; color:#DFA3B7; }
  .v2-module-arrow,.v2-chevron { color:#947C8A; }
  .v2-quiet-strip,.v2-vote-list,.v2-life-row,.v2-memory-entry { border-color:#3B333C; }
  .v2-quiet-strip { color:#A69BA5; }
  .v2-quiet-strip button { color:#DDA4BA; }
  .v2-vote { color:#AFA1AC; }
  .v2-vote-avatar { background:#49313E; color:#E0ADC0; }
  .v2-vote.yes { color:#ACD2B2; }
  .v2-vote.yes .v2-vote-avatar { background:#29402E; color:#ACD2B2; }
  .v2-pending-note { color:#D6A4B6; }
  .v2-future { background:#201D23; border-color:#322B34; }
  .v2-memory-feature { background:linear-gradient(135deg,#402735,#2F2630); }
  .v2-memory-heart,.v2-memory-feature strong { color:#E6ABC0; }
  .v2-memory-feature>span:nth-child(2),.v2-memory-feature p { color:#C49BAD; }
  .v2-memory-feature strong small { color:#BF94A7; }
  .v2-memory-entry div>span { color:#B8ADB5; }
  .navbar.v2-tabs { background:rgba(38,32,39,.83); border-color:rgba(255,255,255,.12); }
  .v2-tabs .nav-button { color:#A99EAA; }
  .v2-tabs .nav-button.active { background:#48303E; color:#E6ADC0; }
  .status-pill { background:#3D2B36; color:#E2A7BB; }
  .chip.active { background:#45303B; color:#E8B2C2; border-color:#624253; }
  .tag,.metric { background:#342B34; color:#D3AEC0; }
  .btn-light { background:#3B2C37; color:#F0BED1; }
  .filter-details > summary,.text-link { color:#E0ADC0; }
  .hero { background:linear-gradient(145deg,#2D242B,#32252F); }
  .hero h1 span,.auth-story h1 span { color:#E4AFC0; }
  .member-card { background:#2C2630; }
}
@media (prefers-reduced-motion:reduce) {
  .v2-dashboard,.v2-subpage { animation:none; }
  .v2-primary,.v2-secondary { transition:none; }
}

/* Focused dinner workspace */
.v2-food-control { padding:23px; border:1px solid #F0E7EC; background:#FFF; border-radius:24px; }
.v2-food-control h2 { font-size:22px; letter-spacing:-.6px; margin:12px 0 7px; }
.v2-food-control p { font-size:12px; color:#999099; margin:0 0 21px; }
.v2-food-page>.filter-details { margin-top:14px; }
.v2-food-page .decision-result { margin-top:16px; }
.v2-food-help,.v2-return-notice { margin:17px 0 0; padding:19px; border-radius:17px; background:#F7F1F3; font-size:12px; color:#9B7185; text-align:center; }
.v2-return-notice button { display:block; margin:8px auto 0; border:0; background:none; color:#A15D79; cursor:pointer; }
.v2-back-home { border:0; background:none; color:#A37E8E; padding:17px 0; font-size:12px; margin-top:9px; }
@media (max-width:680px) {
 .v2-food-control { padding:19px; }
 .v2-food-control h2 { font-size:21px; }
 .v2-food-page .filter-details { border-color:#F0E7EC; }
}
@media (prefers-color-scheme:dark) {
 .v2-food-control { border-color:#3D333C; background:#232127; }
 .v2-food-control h2 { color:#F9F4F6; }
 .v2-food-control p { color:#A69BA5; }
 .v2-food-help,.v2-return-notice { background:#322630; color:#D3AAC0; }
 .v2-back-home,.v2-return-notice button { color:#DDAAC0; }
 .v2-food-page .filter-details { border-color:#3D333C; }
}

/* V2.1 — quiet information-first homepage, retained soft rose palette. */
.v2-dinner-start { text-align:left; }
.v2-dinner-start .v2-dinner-symbol { display:none; }
.v2-dinner-start .v2-card-top { margin-bottom:27px; }
.v2-dinner-start .v2-card-intro { margin-bottom:22px; }
.v2-dinner-start .v2-subtle-link { text-align:center; }
.v2-welcome h1 { letter-spacing:-1.25px; }
.v2-welcome p { font-size:12px; }
.v2-shortcut-list { display:grid; border-radius:18px; overflow:hidden; background:var(--card); border:1px solid #F0EAED; padding:0 17px; }
.v2-shortcut { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:77px; padding:13px 1px; width:100%; background:none; border:0; border-bottom:1px solid #F2EDF0; text-align:left; cursor:pointer; }
.v2-shortcut:last-child { border-bottom:0; }
.v2-shortcut-copy { display:flex; flex-direction:column; gap:5px; min-width:0; }
.v2-shortcut-copy strong { font-size:14px; font-weight:660; color:var(--ink); }
.v2-shortcut-copy small { font-size:11px; color:#847982; }
.v2-shortcut>span:last-child { font-size:25px; font-weight:300; color:#B78C9A; }
.v2-shortcut:active { opacity:.7; }
.v2-main-card { box-shadow:0 5px 20px rgba(68,35,51,.026); }
.v2-main-card h2 { font-weight:720; }
.v2-future { background:#F7F4F5; box-shadow:none; }
.v2-future>span:last-child { font-size:10px; }
.v2-sub-kicker { display:none; }
.v2-meta-label { letter-spacing:0; font-size:12px; }
.v2-main-card .v2-pill { background:#F8F1F4; }

/* iOS installed app: let WebKit draw its own translucent status region.
   The previous painted fixed strip clipped the top of the brand icon.
   Keep a modest optical gap after the real safe-area inset instead. */
@media (display-mode: standalone) {
  .app-shell { padding-top:calc(env(safe-area-inset-top, 0px) + 16px); }
}
@media (max-width:680px) {
  .v2-welcome { margin-bottom:21px; }
  .v2-main-card { padding:22px 20px 18px; }
  .v2-dinner-start .v2-card-top { margin-bottom:24px; }
  .v2-dinner-start .v2-card-intro { font-size:12px; }
  .v2-section { margin-top:25px; }
  .v2-shortcut-list { border-radius:20px; padding:0 17px; }
  .v2-shortcut { min-height:70px; }
  /* Compact floating iOS dock — lower, narrower, and consistent 44pt targets. */
  .navbar.v2-tabs {
    width:min(316px, calc(100vw - 44px));
    max-width:316px;
    height:58px;
    min-height:58px;
    box-sizing:border-box;
    padding:4px 5px;
    gap:1px;
    bottom:max(8px, calc(env(safe-area-inset-bottom, 0px) - 10px));
    border-radius:var(--radius-dock);
    z-index:60;
    box-shadow:0 7px 23px rgba(48,33,42,.10);
  }
  .v2-tabs .nav-button {
    flex:1 1 25%;
    gap:3px;
    height:48px;
    min-height:48px;
    max-height:48px;
    padding:4px 3px;
    border-radius:var(--radius-dock-selection);
    font-size:10px;
  }
  .v2-tabs .nav-icon svg { width:20px; height:20px; }
  .v2-tabs .nav-mobile-label { font-size:10px; line-height:1; }
  .app-shell { padding-bottom:calc(108px + env(safe-area-inset-bottom, 0px)); }
  body:has(input:focus, textarea:focus, select:focus) .navbar.v2-tabs { opacity:0; pointer-events:none; transform:translate(-50%, 110%); }
}
@media (max-width:360px) {
  .navbar.v2-tabs { width:min(300px, calc(100vw - 36px)); }
}

/* V2.4: content follows the finger, revealing a quiet circular loading
   indicator. No overlay card or blur near the iOS status bar. */
html, body { overscroll-behavior-y:contain; -webkit-text-size-adjust:100%; }
@media (pointer:coarse) {
  /* Safari ignores viewport maximum-scale for accessibility: touch-action
     stops page pinch/double tap while preserving normal one-finger scrolling. */
  *, *::before, *::after { touch-action:pan-x pan-y; }
}
.app-shell.ptr-settling {
  transition:padding-top .28s cubic-bezier(.2,.8,.25,1);
}
@media (max-width:680px) {
  .app-shell {
    padding-top:calc(15px + env(safe-area-inset-top, 0px) + var(--ptr-offset, 0px));
  }
  /* Keep at least 16px inputs so Mobile Safari never auto-zooms on focus. */
  input:not([type="checkbox"]):not([type="radio"]),
  select, textarea { font-size:16px !important; }
}
@media (max-width:680px) and (display-mode:standalone) {
  .app-shell {
    padding-top:calc(16px + env(safe-area-inset-top, 0px) + var(--ptr-offset, 0px));
  }
}
.pull-indicator {
  position:fixed;
  z-index:55;
  top:calc(env(safe-area-inset-top, 0px) + 22px);
  left:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  width:max-content;
  min-height:24px;
  padding:0;
  background:transparent;
  border:0;
  box-shadow:none;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  color:#9D637A;
  font-size:12px;
  font-weight:600;
  line-height:22px;
  white-space:nowrap;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transform:translate(-50%, -8px) scale(.9);
  transition:opacity .14s ease, transform .2s ease, visibility .14s;
}
.pull-indicator.is-pulling, .pull-indicator.is-refreshing {
  visibility:visible; opacity:1;
  transform:translate(-50%, 0) scale(1);
}
.pull-icon { width:22px; height:22px; display:block; flex:0 0 22px; }
.pull-icon svg { display:block; width:22px; height:22px; overflow:visible; }
.pull-track { fill:none; stroke:#ECDCE2; stroke-width:2.5; }
.pull-progress {
  fill:none;
  stroke:currentColor;
  stroke-width:2.6;
  stroke-linecap:round;
  stroke-dasharray:50.27;
  stroke-dashoffset:50.27;
  transform-origin:12px 12px;
  transform:rotate(-90deg);
  /* No transition: the ring must track the touch on the same frame. */
  transition:none;
}
.pull-indicator.is-ready .pull-progress { stroke:#B66E88; }
.pull-indicator.is-refreshing .pull-icon svg { animation:ptr-spin .8s linear infinite; }
.pull-indicator.is-refreshing .pull-progress { stroke-dashoffset:14; }
.pull-indicator.is-done .pull-progress { stroke-dashoffset:0; }
@keyframes ptr-spin { to { transform:rotate(360deg); } }
@media (prefers-color-scheme: dark) {
  .v2-shortcut-list { border-color:#383039; background:#232127; }
  .v2-shortcut { border-color:#3A313A; }
  .v2-shortcut-copy small { color:#B0A2AE; }
  .v2-shortcut>span:last-child { color:#C99BAF; }
  .v2-main-card .v2-pill { background:#352A33; }
  .v2-future { background:#201D23; }
  .pull-indicator { color:#EABBC9; }
  .pull-track { stroke:#4C3741; }
}
@media (prefers-reduced-motion: reduce) {
  .pull-indicator { transition:none; }
  .pull-indicator.is-refreshing .pull-icon svg { animation:none; }
}

/* V2.2: keep safe-area clearance precise in iOS standalone, without adding a second faux toolbar gap. */
@media (max-width:680px) {
  

}


/* Tactile pull affordance: immediate ring feedback; only the release springs.
   Avoid easing the in-progress ring or it will visibly trail the finger. */
.pull-indicator.is-pulling:not(.is-refreshing):not(.is-done),
.pull-indicator.is-pulling:not(.is-refreshing):not(.is-done) .pull-progress {
  transition:none !important;
}
.update-notice[hidden] { display:none !important; }
.update-notice {
  position:fixed;
  z-index:90;
  bottom:calc(max(8px, env(safe-area-inset-bottom, 0px)) + 74px);
  left:50%;
  transform:translate(-50%, 12px);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:max-content;
  max-width:calc(100vw - 36px);
  padding:12px 16px;
  border-radius:17px;
  background:#383138;
  color:#fff;
  box-shadow:0 7px 25px rgba(45,30,42,.18);
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:transform .2s ease, opacity .2s ease;
}
.update-notice.visible { opacity:1; transform:translate(-50%,0); }
.update-spinner {
  width:15px; height:15px; flex:0 0 15px;
  border:2px solid rgba(255,255,255,.3);
  border-top-color:#fff;
  border-radius:50%;
  animation:ptr-spin .8s linear infinite;
}
@media (prefers-color-scheme: dark) {
  .update-notice { background:#E2ACC0; color:#281C26; }
  .update-spinner { border-color:rgba(40,28,38,.25); border-top-color:#281C26; }
}
@media (prefers-reduced-motion:reduce) {
  .update-notice { transition:none; }
  .update-spinner { animation:none; }
}

/* V2.5 — A dedicated pushed Settings page, not another primary tab. */
.app-shell.settings-mode {
  max-width:760px;
  padding-bottom:calc(28px + env(safe-area-inset-bottom, 0px));
}
.settings-page { max-width:640px; margin:0 auto; animation:v2-in .24s ease both; }
.settings-header { margin-bottom:24px; }
.settings-back {
  display:inline-flex; align-items:center; gap:4px;
  min-height:44px; padding:3px 12px 3px 0;
  border:0; background:transparent; color:#AA6A81;
  font:inherit; font-size:15px; font-weight:570; cursor:pointer;
}
.settings-back span { font-size:32px; font-weight:300; line-height:.8; margin-bottom:3px; }
.settings-header h1 { margin:14px 0 7px; font-size:32px; font-weight:770; letter-spacing:-1px; }
.settings-header p { margin:0; color:#8E838D; font-size:12px; line-height:1.65; }
.settings-section { margin:0 0 25px; }
.settings-section>h2 { font-size:12px; color:#857681; font-weight:640; margin:0 0 9px 6px; }
.settings-surface {
  border:1px solid #F0E9ED; border-radius:20px;
  background:#FFF; padding:0 17px; overflow:hidden;
}
.settings-name-form { padding:18px 0 17px; }
.settings-name-form label { display:block; margin:0 0 9px; font-size:13px; font-weight:640; color:#423841; }
.settings-name-form input {
  display:block; width:100%; box-sizing:border-box;
  min-height:47px; padding:11px 13px;
  background:#FAF7F8; border:1px solid #EAE1E6; border-radius:12px;
  color:#302B31; font-size:16px; outline:none;
}
.settings-name-form input:focus { border-color:#D29AAF; box-shadow:0 0 0 3px rgba(209,150,173,.13); }
.settings-help { margin:9px 0 13px; font-size:11px; color:#887982; line-height:1.6; }
.settings-save {
  display:block; margin-left:auto; min-width:92px; min-height:39px;
  padding:8px 17px; border:0; border-radius:12px;
  background:#383138; color:white; font-size:12px; font-weight:650; cursor:pointer;
}
.settings-save:disabled { opacity:.55; }
.settings-data-row {
  display:flex; align-items:center; justify-content:space-between;
  min-height:51px; gap:14px; padding:12px 0; box-sizing:border-box;
  border-top:1px solid #F1EBEF; font-size:13px;
}
.settings-data-row:first-child { border-top:0; }
.settings-data-row>span { color:#635A62; flex:0 0 auto; }
.settings-data-row strong { font-size:12px; font-weight:570; color:#8B7D87; text-align:right; overflow-wrap:anywhere; }
.settings-data-row .settings-server { max-width:66%; font-size:11px; }
.settings-security { padding:16px 17px 0; }
.settings-security .passkey-settings {
  padding:0 0 15px; background:transparent; border:0; margin:0; border-radius:0;
}
.settings-security .passkey-title { font-size:14px; }
.settings-security .passkey-settings .btn { width:100%; }
.settings-security .settings-data-row { margin-top:1px; }
.settings-update {
  width:100%; padding:14px 0; display:flex; align-items:center; justify-content:space-between;
  background:none; border:0; border-top:1px solid #F1EBEF; color:#AA6A81;
  font-size:13px; font-weight:630; text-align:left; cursor:pointer;
}
.settings-update span { font-size:16px; }
.settings-footnote { font-size:11px; color:#968A93; line-height:1.65; margin:9px 7px 0; }
.settings-signout {
  display:block; width:100%; min-height:50px;
  border:1px solid #F0E9ED; border-radius:17px; background:#FFF;
  color:#B06479; font-size:13px; font-weight:630; cursor:pointer;
}
.settings-entry { margin-top:17px; padding-top:13px; border-top:1px solid #F0E9ED; }
.settings-link {
  width:100%; display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:7px 0; min-height:57px;
  border:0; background:transparent; cursor:pointer; text-align:left;
}
.settings-link>span:first-child { display:flex; flex-direction:column; gap:5px; }
.settings-link strong { font-size:13px; color:#3C343C; }
.settings-link small { font-size:11px; color:#8C818A; }
.settings-chevron { font-size:26px; font-weight:300; color:#B68C9D; }
@media (max-width:680px) {
  .app-shell.settings-mode { padding-top:calc(14px + env(safe-area-inset-top,0px)); }
  .settings-header { margin-bottom:23px; }
  .settings-header h1 { font-size:30px; }
  .settings-surface { border-radius:19px; }
  .settings-section { margin-bottom:24px; }
  .settings-security .passkey-settings { padding:0 0 14px; }
}
@media (max-width:680px) and (display-mode:standalone) {
  .app-shell.settings-mode { padding-top:calc(16px + env(safe-area-inset-top,0px)); }
}
@media (prefers-color-scheme:dark) {
  .settings-header h1,.settings-name-form label,.settings-link strong { color:#F5F0F4; }
  .settings-header p,.settings-section>h2,.settings-help,.settings-footnote,.settings-link small { color:#B4A6B1; }
  .settings-surface,.settings-signout { background:#232127; border-color:#38313B; }
  .settings-name-form input { background:#302830; color:#F8F3F7; border-color:#50404D; }
  .settings-name-form input:focus { border-color:#E1ADC0; }
  .settings-data-row,.settings-update,.settings-entry { border-color:#3D333D; }
  .settings-data-row>span { color:#DAD0D8; }
  .settings-data-row strong { color:#BBAFBA; }
  .settings-save { background:#E2ACC0; color:#281C26; }
  .settings-back,.settings-update,.settings-signout { color:#E7B2C7; }
  .settings-security .passkey-settings { background:transparent; border:0; }
  .settings-chevron { color:#C993A8; }
}
@media (prefers-reduced-motion:reduce) {
  .settings-page { animation:none; }
}

/* Low-frequency Settings belongs at the very end of We, not in the top bar. */
.settings-entry-bottom {
  margin-top:10px;
  padding:0 16px;
  border:1px solid #F0E9ED;
  border-radius:18px;
  background:rgba(255,255,255,.72);
}
.settings-entry-bottom .settings-link { min-height:69px; }
.settings-entry-bottom .settings-link strong { font-weight:620; }
@media (prefers-color-scheme:dark) {
  .settings-entry-bottom { border-color:#38313B; background:#232127; }
}

/* Anniversary V1 — a quiet secondary module that belongs under Life. */
.anniversary-page { padding-bottom:12px; }
.anniversary-page-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:6px 0 19px; }
.anniversary-page-heading h1 { margin:5px 0 4px; }
.anniversary-page-heading .v2-lead { margin:0; }
.anniversary-add {
  flex:0 0 43px; width:43px; height:43px; border:1px solid #F0E5E9; border-radius:15px;
  background:rgba(255,255,255,.8); color:#A66F80; font-size:26px; font-weight:350; line-height:1; cursor:pointer;
}
.anniversary-hero {
  position:relative; overflow:hidden; display:flex; flex-direction:column; align-items:center;
  padding:23px 18px 17px; margin:0 0 28px; border-radius:25px;
  background:linear-gradient(145deg,#FCF0F4 0%,#F6EDF1 58%,#F2EAED 100%);
  color:#875D6E; text-align:center;
}
.anniversary-hero:after {
  content:""; position:absolute; width:180px; height:180px; border:1px solid rgba(177,126,147,.13);
  border-radius:50%; right:-80px; top:-92px; pointer-events:none;
}
.anniversary-hero-eyebrow { color:#B18A9B; font-size:10px; font-weight:650; letter-spacing:.5px; }
.anniversary-heart { margin:7px 0 0; color:#B77D91; font-size:28px; line-height:1.2; }
.anniversary-hero-label { margin-top:7px; color:#927485; font-size:12px; }
.anniversary-days { color:#784D60; font-size:58px; font-weight:760; letter-spacing:-2px; line-height:1.12; font-variant-numeric:tabular-nums; }
.anniversary-days small { margin-left:5px; font-size:16px; font-weight:550; letter-spacing:0; }
.anniversary-hero-date { margin-top:6px; color:#A78B98; font-size:11px; }
.anniversary-next { margin-top:15px; padding:8px 13px; border:1px solid rgba(183,125,145,.15); border-radius:999px; background:rgba(255,255,255,.48); color:#956C7D; font-size:11px; }
.anniversary-hero-edit { margin-top:13px; border:0; background:transparent; color:#A16F82; font-size:11px; cursor:pointer; }
.anniversary-hero-empty { min-height:205px; justify-content:center; gap:9px; }
.anniversary-hero-empty strong { color:#784D60; font-size:16px; }
.anniversary-hero-empty p { margin:0 0 5px; color:#9C8390; font-size:11px; line-height:1.7; }
.anniversary-list-heading { display:flex; justify-content:space-between; align-items:center; margin:0 4px 10px; }
.anniversary-list-heading h2 { margin:0; font-size:16px; font-weight:700; color:#403740; }
.anniversary-list-heading>span { color:#9A8B94; font-size:10px; }
.anniversary-list { overflow:hidden; border:1px solid #F0E9ED; border-radius:20px; background:rgba(255,255,255,.8); }
.anniversary-row {
  width:100%; min-height:76px; display:flex; align-items:center; gap:12px; padding:12px 14px;
  border:0; border-bottom:1px solid #F3EDF0; background:transparent; text-align:left; cursor:pointer;
}
.anniversary-row:last-child { border-bottom:0; }
.anniversary-row-icon {
  width:39px; height:39px; flex:0 0 39px; display:grid; place-items:center;
  border-radius:13px; background:#F8EEF1; color:#A9788B; font-size:21px;
}
.anniversary-row-copy { min-width:0; flex:1; display:flex; flex-direction:column; gap:5px; }
.anniversary-row-copy strong { color:#443A43; font-size:13px; font-weight:650; }
.anniversary-row-copy small { color:#958792; font-size:10px; line-height:1.5; }
.anniversary-row-count { min-width:39px; display:flex; flex-direction:column; align-items:center; gap:1px; color:#A16F82; }
.anniversary-row-count b { font-size:17px; font-weight:730; font-variant-numeric:tabular-nums; }
.anniversary-row-count small { color:#A08F99; font-size:9px; }
.anniversary-row-count b:only-child { font-size:12px; }
.anniversary-empty { margin-top:0; text-align:center; }
.anniversary-empty p { margin:5px 0 0; }
.anniversary-footnote { margin:13px 5px 0; color:#A0939C; font-size:10px; line-height:1.7; }
.v2-anniversary-today {
  margin:0 0 17px; padding:12px 14px; border:1px solid #F0E5E9; border-radius:19px;
  background:linear-gradient(135deg,rgba(252,240,244,.9),rgba(255,255,255,.88));
}
.v2-anniversary-today-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:4px; color:#A27385; font-size:10px; font-weight:700; }
.v2-anniversary-today-top button { border:0; background:none; color:#A77B8C; font-size:10px; cursor:pointer; }
.v2-anniversary-due { width:100%; display:flex; align-items:center; gap:10px; min-height:48px; border:0; border-top:1px solid rgba(188,147,163,.15); background:transparent; text-align:left; cursor:pointer; }
.v2-anniversary-due-icon { width:30px; color:#B17C90; font-size:19px; text-align:center; }
.v2-anniversary-due-copy { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.v2-anniversary-due-copy strong { color:#735262; font-size:11px; font-weight:680; }
.v2-anniversary-due-copy small { color:#A28A96; font-size:9px; }
.anniversary-modal { max-height:min(86dvh,780px); overflow:auto; }
.anniversary-form-body { display:flex; flex-direction:column; gap:13px; }
.anniversary-form-body .field { margin:0; }
.anniversary-form-body .field input,
.anniversary-form-body .field select,
.anniversary-form-body .field textarea { width:100%; min-height:45px; box-sizing:border-box; font-size:14px; }
.anniversary-form-body .field textarea { min-height:76px; padding:11px 13px; resize:vertical; }
.anniversary-reminders { display:flex; flex-wrap:wrap; gap:7px; margin-top:5px; }
.anniversary-reminder-option { display:inline-flex; align-items:center; gap:6px; padding:8px 10px; border:1px solid #EFE5E9; border-radius:999px; background:#FBF7F8; color:#806D78!important; font-size:10px!important; }
.anniversary-reminder-option input { width:14px!important; min-height:14px!important; height:14px; margin:0; accent-color:#B67D91; }
.anniversary-modal-actions { position:sticky; bottom:0; padding:12px 18px calc(12px + env(safe-area-inset-bottom)); margin:0; border-top:1px solid #F1E9ED; background:rgba(255,255,255,.96); backdrop-filter:blur(16px); }
.anniversary-modal-actions .btn-primary { margin-left:auto; }
@media (max-width:680px) {
  .anniversary-page-heading { margin-top:3px; }
  .anniversary-hero { border-radius:23px; padding:21px 15px 15px; }
  .anniversary-days { font-size:55px; }
  .anniversary-row { padding:11px 12px; gap:10px; }
  .anniversary-row-copy small { font-size:9px; }
  .anniversary-modal { width:calc(100vw - 24px); max-height:calc(88dvh - env(safe-area-inset-top,0px)); border-radius:24px; }
  .anniversary-modal .modal-header { padding:17px 17px 13px; }
  .anniversary-form-body { gap:11px; }
  .anniversary-modal-actions { padding:10px 15px calc(10px + env(safe-area-inset-bottom)); }
}
@media (prefers-color-scheme:dark) {
  .anniversary-page-heading h1,.anniversary-list-heading h2 { color:#F2EBF0; }
  .anniversary-page .v2-lead,.anniversary-footnote { color:#B6A8B2; }
  .anniversary-add { background:#29242C; border-color:#453744; color:#E1AFC2; }
  .anniversary-hero { background:linear-gradient(145deg,#342731,#2B252E 65%,#292630); color:#E8C4D1; }
  .anniversary-hero-label,.anniversary-hero-date,.anniversary-next { color:#D1AFC0; }
  .anniversary-days,.anniversary-hero-empty strong { color:#F1D9E2; }
  .anniversary-next { border-color:#594251; background:rgba(255,255,255,.04); }
  .anniversary-hero-edit { color:#E2B2C4; }
  .anniversary-list { background:#232127; border-color:#403640; }
  .anniversary-row { border-color:#3B333D; }
  .anniversary-row-icon { background:#382B36; color:#D8A5B8; }
  .anniversary-row-copy strong { color:#F0E9EF; }
  .anniversary-row-copy small,.anniversary-row-count small { color:#B5A6B2; }
  .anniversary-row-count,.v2-anniversary-due-copy strong { color:#E2B1C4; }
  .v2-anniversary-today { background:linear-gradient(135deg,#342731,#29252E); border-color:#493744; }
  .v2-anniversary-today-top,.v2-anniversary-today-top button,.v2-anniversary-due-icon { color:#E0B1C4; }
  .v2-anniversary-due { border-color:#4B3946; }
  .v2-anniversary-due-copy small { color:#C0A9B7; }
  .anniversary-modal-actions { background:rgba(35,33,39,.96); border-color:#403640; }
  .anniversary-reminder-option { background:#302830; border-color:#4B3D49; color:#D4C5D1!important; }
}

/* --- V2.6 canonical visual design: consistent semantics / edge rendering --- */
.v2-tabs .nav-icon { position:relative; width:21px; height:21px; }
.v2-tabs .nav-icon svg { width:21px; height:21px; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.v2-tabs .nav-icon .nav-filled { display:none; }
.v2-tabs .nav-button.active .nav-outline { display:none; }
.v2-tabs .nav-button.active .nav-filled { display:block; }
.v2-tabs .nav-button.active { --tab-cutout:#F8EAF0; }
/* Grouped and primary surfaces */
.v2-main-card,.v2-food-control,.anniversary-hero,.v2-memory-feature,.modal {
  border-radius:var(--radius-feature);
}
.v2-shortcut-list,.v2-life-list,.v2-memory-list,.anniversary-list,
.settings-surface,.v2-module,.v2-quiet-strip,.v2-anniversary-today {
  border-radius:var(--radius-group);
}
.v2-primary,.v2-secondary,.btn,.settings-signout,
.settings-entry-bottom,.v2-return-notice,.v2-food-help {
  border-radius:var(--radius-button);
}
.settings-name-form input,.anniversary-add,.v2-module-icon,
.v2-life-icon,.anniversary-row-icon,.v2-food-mini {
  border-radius:var(--radius-control);
}
.v2-pill,.status-pill,.member-pill,.tag,.chip,.anniversary-next {
  border-radius:var(--radius-pill);
}
/* Real dock material: no bright one-pixel inner highlight. */
@media (max-width:680px) {
  .navbar.v2-tabs {
    border-radius:var(--radius-dock);
    border:1px solid rgba(166,135,151,.18);
    box-shadow:0 7px 23px rgba(48,33,42,.10);
    background:rgba(255,253,254,.88);
    -webkit-backdrop-filter:blur(22px) saturate(145%);
    backdrop-filter:blur(22px) saturate(145%);
    overflow:hidden; /* Stable matching outer/inner curves */
    isolation:isolate;
  }
  .v2-tabs .nav-button {
    border-radius:var(--radius-dock-selection);
    transition:background .16s ease,color .16s ease;
  }
}
@media (prefers-color-scheme:dark) {
  .v2-tabs .nav-button.active { --tab-cutout:#48303E; }
}
@media (max-width:680px) and (prefers-color-scheme:dark) {
  .navbar.v2-tabs {
    background:rgba(36,31,38,.94);
    border-color:rgba(214,176,193,.11);
    box-shadow:0 9px 24px rgba(0,0,0,.26);
  }
  .v2-tabs .nav-button.active { background:#48303E; color:#E6ADC0; }
}
@media (prefers-reduced-motion:reduce) {
  .v2-tabs .nav-button { transition:none; }
}

/* --- V0.4.0 navigation hierarchy & modal presentation --- */
.app-shell.child-page-mode {
  padding-top:calc(16px + env(safe-area-inset-top,0px));
  padding-bottom:calc(108px + env(safe-area-inset-bottom,0px));
}
.app-shell.settings-mode {
  max-width:760px;
  padding-bottom:calc(108px + env(safe-area-inset-bottom,0px));
}
.v2-page-header {
  margin:0 0 24px;
  animation:v2-in .2s ease both;
}
.v2-page-back {
  display:inline-flex;align-items:center;gap:3px;
  min-width:44px;min-height:44px;margin:0 0 7px;padding:0 10px 0 0;
  border:0;background:transparent;color:#A66D83;
  font:inherit;font-size:14px;font-weight:590;cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.v2-page-back svg { width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round; }
.v2-page-heading-row { display:flex;align-items:flex-end;justify-content:space-between;gap:14px; }
.v2-page-heading-copy { min-width:0;flex:1; }
.v2-page-heading-copy h1 { margin:0;font-size:30px;line-height:1.2;font-weight:760;letter-spacing:-.85px;color:#29252B;overflow-wrap:anywhere; }
.v2-page-heading-copy p { margin:7px 0 0;color:#8E838D;font-size:12px;line-height:1.65; }
.v2-page-action { flex:0 0 auto; }
.v2-list-page .content-panel { margin-top:2px; }
.v2-detail-page { padding-bottom:6px; }
.v2-detail-hero,.v2-plan-detail {
  display:flex;align-items:center;gap:15px;padding:20px;margin:0 0 16px;
  border:1px solid #F0E9ED;border-radius:24px;background:#FFF;
}
.v2-detail-hero .detail-emoji { flex:0 0 64px;width:64px;height:64px;display:grid;place-items:center;border-radius:18px;background:#F8EEF1;font-size:34px; }
.v2-detail-hero>div:last-child { min-width:0; }
.v2-detail-hero .detail-title { font-size:19px;font-weight:730;color:#342D34; }
.v2-detail-hero .detail-subtitle { margin-top:5px;color:#8E818B;font-size:11px;line-height:1.6; }
.v2-detail-hero .chips { margin-top:9px; }
.v2-detail-section { margin:0 0 14px;padding:18px;border-radius:20px; }
.v2-detail-section h2 { margin:0 0 13px;font-size:16px; }
.v2-detail-actions { display:flex;flex-wrap:wrap;gap:9px;margin:17px 0 4px; }
.v2-detail-actions .btn { min-height:44px; }
.v2-plan-detail { display:block;padding:20px; }
.v2-plan-dishes { display:grid;gap:0;margin-top:14px; }
.v2-plan-dish { display:flex;align-items:center;gap:12px;min-height:66px;border-top:1px solid #F1EBEF; }
.v2-plan-dish-emoji { width:42px;height:42px;display:grid;place-items:center;border-radius:13px;background:#F8EEF1;font-size:23px; }
.v2-plan-dish>div { display:flex;flex-direction:column;gap:4px; }
.v2-plan-dish strong { font-size:14px;color:#3D343C; }
.v2-plan-dish small { font-size:11px;color:#92858F; }
.settings-page .v2-page-header { margin-bottom:24px; }
.anniversary-page .v2-page-heading-copy h1 { font-size:29px; }
.anniversary-page .v2-page-heading-row { align-items:center; }
.anniversary-delete-area { display:flex;align-items:center; }
.anniversary-delete-confirm { display:flex;align-items:center;flex-wrap:wrap;gap:7px; }
.anniversary-delete-confirm[hidden] { display:none; }
.anniversary-delete-confirm span { flex:1 0 100%;font-size:11px;color:#A45F70; }
.btn-danger { min-height:40px;padding:9px 14px;border:0;border-radius:16px;background:#B75B70;color:#FFF;font-size:12px;font-weight:650;cursor:pointer; }
.v2-page-back:focus-visible,.modal button:focus-visible,.v2-page-action:focus-visible { outline:3px solid rgba(190,121,144,.35);outline-offset:2px; }

/* Sheets are scoped tasks. They cover the tab bar and keep the form's
   Cancel / primary action visible while the content scrolls independently. */
#modal-root { position:relative;z-index:120; }
body.modal-open { overflow:hidden;overscroll-behavior:none; }
.modal-backdrop {
  z-index:120;display:grid;place-items:end center;padding:0;
  background:rgba(35,27,34,.34);
  -webkit-backdrop-filter:blur(13px) saturate(125%);
  backdrop-filter:blur(13px) saturate(125%);
}
.modal {
  position:relative;display:flex;flex-direction:column;
  width:min(620px,100%);max-height:min(89dvh,820px);margin:0 auto;
  overflow:hidden;border:1px solid rgba(239,228,234,.95);
  border-bottom:0;border-radius:24px 24px 0 0;
  background:#FFFEFD;box-shadow:0 -12px 50px rgba(45,29,40,.16);
}
.modal::before {
  content:"";position:absolute;z-index:2;top:8px;left:50%;width:34px;height:4px;
  border-radius:999px;background:rgba(145,127,139,.28);transform:translateX(-50%);
}
.modal-header {
  flex:0 0 auto;display:flex;align-items:center;gap:12px;
  padding:24px 18px 13px;border-bottom:1px solid #F0E9ED;
}
.modal-header>div { min-width:0;flex:1;text-align:center; }
.modal-header h2 { font-size:17px;line-height:1.3;font-weight:720;color:#342D34; }
.modal-header p { margin-top:4px;font-size:10px;line-height:1.5; }
.modal-cancel {
  order:-1;flex:0 0 44px;min-width:44px;min-height:44px;padding:0;
  border:0;background:transparent;color:#A36A80;font:inherit;font-size:13px;font-weight:560;cursor:pointer;
}
.modal-header::after { content:"";flex:0 0 44px; }
.modal-body { min-height:0;flex:1 1 auto;overflow-y:auto;overscroll-behavior:contain;padding:17px 18px 22px; }
.modal-actions { flex:0 0 auto;align-items:center; }
.modal-editor { max-height:94dvh; }
.modal-editor .modal-body { padding-bottom:calc(20px + env(safe-area-inset-bottom)); }
.anniversary-modal { max-height:91dvh; }
.anniversary-modal-actions { position:sticky;bottom:0;z-index:1;display:flex;flex-wrap:wrap;gap:9px;margin:0;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(255,254,253,.97);border-top:1px solid #F0E9ED; }
.anniversary-modal-actions>.btn-primary { margin-left:auto; }
.modal-alert {
  align-self:center;width:calc(100% - 44px);max-width:360px;max-height:none;
  margin:auto;padding:25px 22px 20px;border:1px solid rgba(239,228,234,.95);
  border-radius:24px;background:#FFFEFD;box-shadow:0 22px 70px rgba(35,24,33,.22);
  text-align:center;
}
.modal-alert::before { display:none; }
.modal-alert-mark { width:38px;height:38px;display:grid;place-items:center;margin:0 auto 13px;border-radius:50%;background:#F8E9ED;color:#A75B70;font-size:20px;font-weight:700; }
.modal-alert h2 { margin:0;font-size:18px;color:#302831; }
.modal-alert p { margin:9px 0 20px;color:#887C86;font-size:12px;line-height:1.7; }
.modal-alert-actions { display:grid;grid-template-columns:1fr 1fr;gap:9px; }
.modal-alert-actions .btn { min-height:44px; }
@media (prefers-color-scheme:dark) {
  .v2-page-heading-copy h1 { color:#F3EDF2; }
  .v2-page-heading-copy p { color:#B8ABB6; }
  .v2-page-back { color:#E1AFC2; }
  .v2-detail-hero,.v2-detail-section,.v2-plan-detail { background:#25222A;border-color:#403640; }
  .v2-detail-hero .detail-emoji,.v2-plan-dish-emoji { background:#3B2C37; }
  .v2-detail-hero .detail-title,.v2-plan-dish strong,.v2-detail-section h2 { color:#F3EDF2; }
  .v2-detail-hero .detail-subtitle,.v2-plan-dish small { color:#B8ABB6; }
  .v2-plan-dish { border-color:#403640; }
  .anniversary-delete-confirm span { color:#E1AFC2; }
  .modal-backdrop { background:rgba(0,0,0,.56); }
  .modal { background:#25222A;border-color:#443944;box-shadow:0 -12px 50px rgba(0,0,0,.35); }
  .modal::before { background:rgba(205,188,202,.32); }
  .modal-header { border-color:#403640; }
  .modal-header h2 { color:#F3EDF2; }
  .modal-header p { color:#B8ABB6; }
  .modal-cancel { color:#E1AFC2; }
  .anniversary-modal-actions { background:rgba(37,34,42,.97);border-color:#403640; }
  .modal-alert { background:#25222A;border-color:#443944; }
  .modal-alert h2 { color:#F3EDF2; }
  .modal-alert p { color:#B8ABB6; }
  .modal-alert-mark { background:#49303D;color:#E7B0C3; }
}
@media (max-width:380px) {
  .v2-page-heading-copy h1 { font-size:27px; }
  .v2-page-heading-row { gap:9px; }
  .v2-page-action { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  .v2-page-header { animation:none; }
}
.modal-discard-confirm {
  position:absolute;z-index:5;inset:auto 12px calc(12px + env(safe-area-inset-bottom)) 12px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:15px;border:1px solid #EADDE4;border-radius:18px;
  background:rgba(255,254,253,.98);box-shadow:0 8px 28px rgba(45,29,40,.14);
}
.modal-discard-confirm>div:first-child { display:flex;flex-direction:column;gap:4px; }
.modal-discard-confirm strong { font-size:13px;color:#392F37; }
.modal-discard-confirm span { font-size:10px;color:#8E7F8A; }
.modal-discard-confirm>div:last-child { display:flex;gap:7px; }
.modal-discard-confirm .btn { min-height:38px;padding:8px 12px;font-size:11px; }
@media (prefers-color-scheme:dark) {
  .modal-discard-confirm { background:rgba(42,36,44,.98);border-color:#594654; }
  .modal-discard-confirm strong { color:#F4EDF2; }
  .modal-discard-confirm span { color:#C2B3BE; }
}
.modal-editor .pref-form>.btn-full {
  position:sticky;bottom:0;z-index:1;
  margin-top:12px;padding-top:14px;padding-bottom:14px;
  box-shadow:0 -8px 18px rgba(255,254,253,.92);
}
@media (prefers-color-scheme:dark) {
  .modal-editor .pref-form>.btn-full { box-shadow:0 -8px 18px rgba(37,34,42,.94); }
}

/* v0.4.1: visual feedback should happen in the first animation frame.
   The old 250-280ms translation/opacity delays felt like a slow tap. */
@keyframes v2-fast-enter { from {opacity:.94} to {opacity:1} }
.v2-dashboard,.v2-subpage,.settings-page,.v2-page-header {
  animation:v2-fast-enter .11s ease-out both;
}
@media (prefers-reduced-motion:reduce) {
  .v2-dashboard,.v2-subpage,.settings-page,.v2-page-header {animation:none;}
}

/* v0.4.1: buttons should acknowledge touch immediately, without introducing
   additional delay on the interactive scrolling / pull-to-refresh surfaces. */
button, [role="button"], summary {
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
@media (hover:none) and (pointer:coarse) {
  .navbar.v2-tabs .nav-button:active { filter:brightness(.94); }
  .v2-shortcut:active,.v2-life-row:active,.v2-memory-entry:active,
  .v2-plan-dish:active,.anniversary-row:active { background:rgba(193,133,155,.065); }
  .btn:active,.v2-primary:active,.v2-secondary:active { filter:brightness(.94); }
}
.request-busy { position:relative;cursor:progress;opacity:.78; }
.request-busy::after {
  content:"";display:inline-block;vertical-align:middle;
  width:12px;height:12px;margin-left:7px;
  border:2px solid currentColor;border-right-color:transparent;
  border-radius:50%;animation:v2-request-spin .75s linear infinite;
}
@keyframes v2-request-spin { to { transform:rotate(360deg) } }
@media (prefers-reduced-motion:reduce) {
  .request-busy::after { animation:none; }
}