:root { --green:#1c8074; --aqua:#30aea2; --coral:#f26c52; --deep:#194a44; --paper:#f8f7f2; --mint:#dff3eb; --ink:#243a35; --muted:#71807a; --line:#dde5e0; --yellow:#f6b83d; }
html {
  min-height:100%;
  color-scheme:light;
  background-color:#eee7db;
}
* { box-sizing:border-box; }
body {
  min-height:100%;
  margin:0;
  color:var(--ink);
  background-color:#eee7db;
  background:var(--paper);
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-print-color-adjust:exact;
  print-color-adjust:exact;
}
button,input,textarea,select { font:inherit; }
button { cursor:pointer; }
.dismissible-panel { position:relative; }
.panel-close-button {
  position:sticky;
  z-index:8;
  top:8px;
  display:grid;
  width:40px;
  height:40px;
  min-height:40px;
  margin:0 0 -40px auto;
  padding:0;
  place-items:center;
  border:1px solid rgba(38,83,73,.12);
  border-radius:50%;
  color:#45645c;
  background:rgba(255,253,248,.94);
  box-shadow:0 5px 16px rgba(43,72,64,.12);
  font:400 25px/1 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.panel-close-button:active { transform:scale(.94); }
.dismissible-panel > h3:first-of-type,
.dismissible-panel > header:first-of-type { padding-right:48px; }
form[aria-busy="true"] button:disabled { cursor:wait; opacity:.68; }
#app { width:min(100%,620px); min-height:100vh; margin:auto; padding-bottom:104px; background:#fbfcfa; }
.site-compliance-footer {
  width:min(100%,620px);
  min-height:74px;
  margin:0 auto;
  padding:18px 22px calc(104px + env(safe-area-inset-bottom));
  color:#8b938f;
  background:#fbfcfa;
  text-align:center;
  font-size:11px;
  line-height:1.6;
}
.site-compliance-footer:empty { display:none; }
#app.tab-tree + .site-compliance-footer { display:none; }
.site-compliance-footer p { margin:0 0 7px; }
.site-compliance-footer nav { display:flex; flex-wrap:wrap; justify-content:center; gap:5px 14px; }
.site-compliance-footer a { color:#6c7f79; text-decoration:none; }
.login-screen + .site-compliance-footer { padding-bottom:26px; }
.loading { padding:80px 24px; color:var(--muted); text-align:center; }
.welcome { min-height:100vh; display:flex; flex-direction:column; padding:72px 26px 36px; color:white; background:radial-gradient(circle at 80% 13%,rgba(242,189,62,.9) 0 34px,transparent 35px),linear-gradient(155deg,#248a7c,#124c45 74%); }
.brand { display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:.08em; }
.brand-sign { gap:7px; }
.brand-sign img { display:block; width:34px; height:34px; object-fit:contain; }
.brand-sign span { color:white; font-family:Georgia,"Songti SC",serif; font-size:18px; font-weight:600; letter-spacing:.08em; }
.welcome-copy { margin:auto 0 34px; }
.eyebrow { margin:0 0 12px; color:#f4d991; font-size:12px; letter-spacing:.12em; }
h1 { margin:0; font-family:Georgia,"Songti SC",serif; font-size:40px; font-weight:500; line-height:1.25; }
.welcome-copy > p:last-child { max-width:390px; color:rgba(255,255,255,.74); line-height:1.7; }
.login-card { padding:20px; border-radius:20px; color:var(--ink); background:#fff; box-shadow:0 18px 50px rgba(9,39,34,.22); }
.registration-consent { margin:16px 0 5px; padding:14px 0 0; border:0; border-top:1px solid rgba(43,83,75,.12); }
.registration-consent legend { padding:0; color:var(--muted); font-size:12px; font-weight:700; }
.registration-consent label { display:grid; grid-template-columns:24px 1fr; gap:9px; align-items:start; margin-top:11px; color:#4e625c; font-size:13px; line-height:1.65; }
.registration-consent input[type="checkbox"] { width:22px; height:22px; margin:1px 0 0; accent-color:var(--teal); }
.registration-consent a { display:inline; margin:0 3px; color:var(--teal-dark); font-weight:700; text-decoration:underline; text-underline-offset:2px; }
.pilot-fallback { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
.pilot-fallback summary { color:var(--muted); font-size:11px; cursor:pointer; }
.pilot-fallback label { margin-top:12px; }
.pilot-fallback .text-button { min-width:44px; min-height:44px; }
.returning-login > span { display:block; color:var(--green); font-size:11px; font-weight:750; letter-spacing:.06em; }
.returning-login h2 { margin:4px 0 18px; color:var(--deep); font-family:Georgia,"Songti SC",serif; font-size:23px; font-weight:500; }
.first-pilot-entry { margin-top:11px; border:1px solid rgba(255,255,255,.24); border-radius:16px; background:rgba(255,255,255,.08); }
.first-pilot-entry > summary { min-height:48px; padding:14px 16px; color:white; cursor:pointer; font-size:13px; text-align:center; list-style:none; }
.first-pilot-entry > summary::-webkit-details-marker { display:none; }
.first-pilot-entry .login-card { margin:0 8px 8px; box-shadow:none; }
.code-sent { margin:0 0 16px; color:var(--muted); font-size:12px; line-height:1.6; }
.phone-login-card > span,.phone-verify-card > span { display:block; color:var(--green); font-size:11px; font-weight:750; letter-spacing:.06em; }
.phone-login-card h2,.phone-verify-card h2 { margin:4px 0 7px; color:var(--deep); font:500 23px/1.4 Georgia,"Songti SC",serif; }
.phone-login-card > p,.phone-verify-card > p { margin:0 0 17px; color:var(--muted); font-size:12px; line-height:1.65; }
.phone-verify-card label small { color:#8a938f; font-size:11px; font-weight:400; }
.phone-verify-card input[name="code"] { font-size:22px; font-weight:700; letter-spacing:.24em; text-align:center; }
.otp-resend-actions { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px 18px; margin-top:4px; }
.otp-resend-actions .text-button { min-height:38px; margin:0; padding:7px 5px; }
.otp-resend-actions .text-button:disabled { color:#9da7a2; opacity:1; cursor:default; }
.otp-code-field input[name="code"] { font-variant-numeric:tabular-nums; letter-spacing:.18em; text-align:center; }
.phone-binding-nudge { position:fixed; z-index:1300; right:max(16px,env(safe-area-inset-right)); bottom:calc(88px + env(safe-area-inset-bottom)); left:max(16px,env(safe-area-inset-left)); max-width:520px; margin:auto; padding:20px 20px 17px; border:1px solid rgba(51,116,104,.12); border-radius:22px; color:#31564e; background:radial-gradient(circle at 92% 0,rgba(245,195,83,.24),transparent 125px),rgba(255,252,244,.97); box-shadow:0 18px 55px rgba(39,67,59,.19); opacity:0; transform:translateY(14px); transition:opacity .2s ease,transform .2s ease; }
.phone-binding-nudge.is-visible { opacity:1; transform:none; }
.phone-binding-nudge>span { color:#b27343; font-size:11px; font-weight:800; letter-spacing:.08em; }
.phone-binding-nudge h2 { max-width:390px; margin:5px 38px 5px 0; color:#31564e; font:600 20px/1.45 Georgia,"Songti SC",serif; }
.phone-binding-nudge p { margin:0; color:#74817c; font-size:12px; line-height:1.6; }
.phone-binding-nudge>div { display:flex; align-items:center; gap:13px; margin-top:15px; }
.phone-binding-nudge>div .primary { width:auto; min-width:116px; min-height:44px; margin:0; padding:10px 18px; border-radius:14px; }
.phone-binding-nudge>div .text-button { min-height:40px; margin:0; padding:7px 4px; }
.phone-binding-nudge-close { position:absolute; top:12px; right:12px; width:34px; min-height:34px; padding:0; border:0; border-radius:50%; color:#75837d; background:rgba(255,255,255,.74); font-size:22px; line-height:1; }
.login-method-switch { display:flex; align-items:center; justify-content:center; gap:8px; margin:10px 0 0; color:#8b938f; font-size:11px; }
.login-method-switch button,.login-method-back { min-height:40px; padding:8px 4px; border:0; color:var(--green); background:transparent; font-size:12px; font-weight:750; cursor:pointer; }
.login-method-back { display:block; margin:4px auto 0; }
.login-screen .pilot-fallback { margin-top:11px; padding:0; overflow:hidden; border:1px solid rgba(55,77,69,.1); border-radius:16px; background:rgba(255,253,248,.66); }
.login-screen .pilot-fallback > summary { display:flex; min-height:48px; align-items:center; justify-content:center; padding:12px 16px; color:#65736d; cursor:pointer; font-size:12px; font-weight:700; list-style:none; }
.login-screen .pilot-fallback > summary::-webkit-details-marker { display:none; }
.login-screen .pilot-fallback[open] > summary { border-bottom:1px solid rgba(55,77,69,.08); }
.login-screen .pilot-fallback .login-card { margin:8px; border-color:rgba(55,77,69,.08); box-shadow:none; }
label { display:grid; gap:7px; margin-bottom:14px; color:#59635e; font-size:12px; }
input,textarea,select { width:100%; padding:13px 14px; border:1px solid var(--line); border-radius:12px; color:var(--ink); background:white; outline:none; }
input:focus,textarea:focus,select:focus { border-color:#4b9e91; box-shadow:0 0 0 3px rgba(36,138,124,.12); }
textarea { min-height:118px; resize:vertical; line-height:1.65; }
.media-picker input { padding:10px; background:#f8f7f2; }
.media-picker small { color:var(--muted); line-height:1.5; }
#mediaPreview,.story-media { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4px; margin-top:9px; overflow:hidden; border-radius:13px; }
#mediaPreview:empty { display:none; }
#mediaPreview img,#mediaPreview video,.story-media img,.story-media video { width:100%; height:100%; min-height:88px; max-height:310px; display:block; object-fit:cover; background:#18201d; }
#mediaPreview .pending-media { position:relative; min-width:0; min-height:88px; margin:0; overflow:hidden; background:#18201d; }
#mediaPreview .pending-media.video { grid-column:1/-1; }
#mediaPreview .pending-media-open { position:relative; display:block; width:100%; height:100%; min-height:88px; padding:0; border:0; background:transparent; }
#mediaPreview .pending-media-open img,#mediaPreview .pending-media-open video { pointer-events:none; }
#mediaPreview .pending-media-open i { position:absolute; inset:50% auto auto 50%; display:grid; width:42px; height:42px; place-items:center; border-radius:50%; color:white; background:rgba(18,35,31,.72); transform:translate(-50%,-50%); font-style:normal; }
#mediaPreview .pending-media-remove { position:absolute; z-index:4; top:7px; right:7px; display:grid; width:30px; height:30px; padding:0; place-items:center; border:1px solid rgba(255,255,255,.72); border-radius:50%; color:white; background:rgba(25,35,32,.8); box-shadow:0 3px 10px rgba(0,0,0,.2); font-size:20px; line-height:1; }
#mediaPreview .pending-media-order { position:absolute; z-index:4; right:6px; bottom:6px; left:6px; display:flex; align-items:center; justify-content:center; gap:4px; color:white; }
#mediaPreview .pending-media-order button { display:grid; width:30px; height:28px; padding:0; place-items:center; border:0; border-radius:9px; color:white; background:rgba(18,35,31,.76); font-size:16px; }
#mediaPreview .pending-media-order button:disabled { opacity:.28; }
#mediaPreview .pending-media-order span { padding:4px 7px; border-radius:8px; background:rgba(18,35,31,.76); font-size:12px; }
#mediaPreview .pending-media-remove:active,#mediaPreview .pending-media-order button:active { transform:scale(.94); }
#mediaPreview .pending-media-add { min-height:88px; padding:10px; border:1px dashed rgba(46,126,113,.45); border-radius:12px; color:var(--green); background:rgba(255,255,255,.8); font-size:12px; font-weight:700; }
.story-image-button { display:block; width:100%; height:100%; padding:0; border:0; background:transparent; }
#mediaPreview video,.story-media video { aspect-ratio:16/9; object-fit:contain; }
.story-media { margin:0 0 17px; }
.story-media figure { min-width:0; min-height:110px; display:grid; place-items:center; margin:0; overflow:hidden; color:var(--muted); background:#e9e6dc; font-size:11px; }
.media-retry { width:100%; min-height:52px; padding:10px; border:0; color:var(--green); background:transparent; font-size:11px; font-weight:700; }
.story-media.single { grid-template-columns:1fr; }
.story-media.single figure { aspect-ratio:4/3; }
.story-media.single img { min-height:220px; }
.story-media.count-two,.story-media.count-four { grid-template-columns:repeat(2,minmax(0,1fr)); }
.story-media:not(.single) figure { min-height:0; aspect-ratio:1; }
.story-media:not(.single) img { min-height:0; max-height:none; }
.media-lightbox { position:fixed; z-index:60; inset:0; display:grid; place-items:center; padding:58px 14px 24px; background:rgba(7,16,14,.94); }
.media-lightbox > img,.media-lightbox > video { width:100%; height:100%; object-fit:contain; }
.media-lightbox > button { position:absolute; top:max(14px,env(safe-area-inset-top)); right:14px; display:grid; width:46px; height:46px; place-items:center; padding:0; border:1px solid rgba(255,255,255,.25); border-radius:50%; color:white; background:rgba(0,0,0,.35); font-size:28px; line-height:1; }
.pending-media-viewer { grid-template-rows:minmax(0,1fr) auto; }
.pending-media-viewer > footer { display:flex; width:min(100%,520px); align-items:center; justify-content:space-between; gap:12px; padding-top:12px; color:white; }
.pending-media-viewer > footer button { min-height:42px; padding:8px 12px; border:1px solid rgba(255,255,255,.2); border-radius:12px; color:white; background:rgba(255,255,255,.08); }
.pending-media-viewer > footer button:disabled { opacity:.25; }
.voice-recorder { margin:2px 0 15px; padding:14px; border:1px solid #dce5df; border-radius:14px; background:#f3f8f5; }
.voice-recorder > span { display:block; margin-bottom:9px; color:#59635e; font-size:12px; }
.voice-recorder > button { width:100%; padding:12px; border:1px solid #b9d8d0; border-radius:11px; color:var(--green); background:white; font-weight:700; }
.voice-recorder > button:disabled { opacity:.55; }
.voice-recorder > small { display:block; margin-top:8px; color:var(--muted); line-height:1.5; }
#audioPreview audio,.story-audio audio { width:100%; margin-top:10px; }
.story-audio { margin:0 0 15px; padding:11px 13px; border-radius:12px; color:var(--muted); background:#edf5f1; font-size:11px; }
.primary,.secondary,.text-button { border:0; }
.primary { width:100%; padding:14px 18px; border-radius:13px; color:white; background:var(--green); font-weight:700; }
.secondary { padding:11px 14px; border:1px solid #b7d6cf; border-radius:11px; color:var(--green); background:#edf7f3; font-weight:650; }
.text-button { min-width:44px; min-height:44px; padding:6px; color:var(--muted); background:transparent; }
.top { padding:0 22px 28px; color:white; background:linear-gradient(145deg,#248a7c,#15574f); }
.top nav { display:flex; align-items:center; justify-content:space-between; margin:0 -22px 28px; padding:12px 20px; border-bottom:1px solid rgba(28,128,116,.12); background:rgba(255,254,250,.96); backdrop-filter:blur(14px); }
.top nav .text-button { min-width:44px; min-height:44px; margin:-6px; color:var(--muted); }
.top .brand-sign span { color:var(--deep); }
.top h1 { font-size:34px; }
.top p { margin:8px 0 0; color:rgba(255,255,255,.7); font-size:12px; }

/* Five-tab MVP shell and V10 brand system */
.main-tabbar { position:fixed; z-index:8; right:0; bottom:0; left:0; display:grid; grid-template-columns:repeat(5,1fr); width:min(100%,620px); height:76px; margin:auto; padding:6px 8px max(7px,env(safe-area-inset-bottom)); border-top:1px solid rgba(25,74,68,.12); background:rgba(255,255,255,.96); box-shadow:0 -8px 26px rgba(25,74,68,.08); backdrop-filter:blur(18px); }
.main-tabbar button { display:grid; place-items:center; align-content:center; gap:2px; padding:0; border:0; color:#84918c; background:transparent; }
.main-tabbar button span { display:grid; width:29px; height:29px; place-items:center; border-radius:10px; }
.main-tabbar svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.main-tabbar b { font-size:11px; font-weight:650; }
.main-tabbar button.active { color:var(--green); }
.main-tabbar button.active span { background:var(--mint); }
.main-tabbar button.record { transform:translateY(-11px); }
.main-tabbar button.record span { width:47px; height:47px; border-radius:50%; color:white; background:var(--coral); box-shadow:0 7px 18px rgba(242,108,82,.28); }
.main-tabbar button.record b { margin-top:1px; color:var(--coral); }
.main-tabbar button.record.active span { box-shadow:0 0 0 5px #fde7e2,0 7px 18px rgba(242,108,82,.3); }
.family-scope-filter { display:flex; gap:7px; width:min(100%,620px); margin:0 auto; padding:10px 18px; overflow-x:auto; border-bottom:1px solid var(--line); background:rgba(255,255,255,.96); scrollbar-width:none; }
.family-scope-filter::-webkit-scrollbar { display:none; }
.family-scope-filter button { display:flex; min-width:max-content; min-height:36px; align-items:center; gap:6px; padding:7px 11px; border:1px solid #dfe7e2; border-radius:999px; color:var(--muted); background:white; font-size:11px; }
.family-scope-filter button.active { border-color:#9fc5bb; color:var(--deep); background:#edf7f3; box-shadow:inset 0 0 0 1px rgba(28,128,116,.06); }
.family-scope-filter button i { width:8px; height:8px; flex:none; border-radius:50%; background:var(--family-color); }
.tab-page-head { display:grid; grid-template-columns:1fr auto; align-items:center; gap:11px; padding:18px 22px 21px; border-bottom:1px solid var(--line); background:linear-gradient(160deg,#f5fbf8,#fff); }
.tab-page-head::before { content:"象爷同堂"; display:flex; align-items:center; height:34px; padding-left:42px; color:var(--deep); background:url("/brand-mark.png") left center/34px 34px no-repeat; font-family:Georgia,"Songti SC",serif; font-size:17px; font-weight:600; letter-spacing:.08em; }
.tab-page-head > img { display:none; }
.tab-page-head > div { grid-column:1/-1; grid-row:2; }
.tab-page-head > .text-button { grid-column:2; grid-row:1; }
.tab-page-head p,.tab-page-head h1,.tab-page-head span { margin:0; }
.tab-page-head p { color:var(--green); font-size:11px; font-weight:700; }
.tab-page-head h1 { margin-top:2px; font-size:28px; }
.tab-page-head span { color:var(--muted); font-size:11px; }

.tab-home .record-panel,.tab-home .family-tools { display:none; }
.tab-home .family-summary-panel { display:flex; flex-direction:column; padding:0 0 16px; border-bottom:1px solid var(--line); background:transparent; box-shadow:none; }
.tab-home .family-summary-panel .member-strip { order:-1; margin:0; padding:0; border:0; }
.tab-home .family-head { justify-content:flex-start; gap:6px; margin-top:12px; padding-top:10px; border-top:1px solid var(--line); }
.tab-home .family-head > div:first-child { display:none; }
.tab-record .family-summary-panel,.tab-record .pilot-progress,.tab-record .home-story-heading,.tab-record .home-story-list,.tab-record .family-tools,.tab-record .consent-module { display:none; }
.tab-record > .family-scope-filter { display:none; }
.tab-tree .family-summary-panel,.tab-tree .pilot-progress,.tab-tree .record-panel,.tab-tree .home-story-heading,.tab-tree .home-story-list,.tab-tree .consent-module { display:none; }
.tab-moments .family-summary-panel,.tab-moments .pilot-progress,.tab-moments .record-panel,.tab-moments .home-story-heading,.tab-moments .home-story-list { display:none; }
.tab-tree .family-tools,.tab-moments .family-tools { display:block; border:0; background:transparent; }
.tab-tree .family-tools > summary,.tab-moments .family-tools > summary { display:none; }
.tab-tree .family-tools > div,.tab-moments .family-tools > div { padding:0; }
.tab-tree .relay-module,.tab-tree .activity-module { display:none; }
.tab-moments .network-module { display:none; }
.tab-record .record-panel { margin-top:2px; border:0; box-shadow:none; }
.tab-record .record-panel::before { content:"留下一段真实记忆"; display:block; margin-bottom:18px; color:var(--deep); font-family:Georgia,\"Songti SC\",serif; font-size:23px; }
.tab-record .story-options { background:#f4f8f5; }
.tab-home .top [data-logout],.tab-tree .top [data-logout],.tab-record .top [data-logout],.tab-moments .top [data-logout] { display:none; }
.tab-tree { height:100dvh; overflow:hidden; padding-bottom:76px; background:#e5f4ed; }
.tab-tree .top { height:59px; padding:0; background:#fffefa; }
.tab-tree .top > p,.tab-tree .top > h1 { display:none; }
.tab-tree .top nav { height:59px; margin:0; padding:10px 18px; }
.tab-tree .content { height:calc(100dvh - 135px); padding:0; overflow:hidden; }
.tab-tree .family-tools { position:relative; height:100%; margin:0; }
.tab-tree .family-tools > div { position:absolute; inset:0; margin:0; }
.tab-tree .network-module { position:absolute; inset:0; margin:0; padding:0; border:0; box-shadow:none; background:transparent; }
.tab-tree .network-tree-actions { position:absolute; z-index:8; top:12px; right:13px; display:flex; align-items:center; gap:7px; }
.tab-tree .network-tree-add { display:grid; width:46px; height:46px; min-height:46px; place-items:center; padding:0; border:1px solid rgba(255,255,255,.86); border-radius:50%; color:var(--green); background:rgba(255,254,250,.92); box-shadow:0 6px 18px rgba(47,88,77,.11); font-size:28px; font-weight:300; line-height:1; backdrop-filter:blur(10px); }
.tab-tree .network-tree-share { min-height:40px; padding:8px 13px; border:1px solid rgba(255,255,255,.86); border-radius:999px; color:#286f65; background:rgba(255,254,250,.92); box-shadow:0 6px 18px rgba(47,88,77,.1); font-size:12px; font-weight:720; backdrop-filter:blur(10px); }
.tab-tree #networkBody,.tab-tree .spatial-map-shell { position:absolute; inset:0; }
.tab-tree .spatial-map-shell { margin:0; border:0; border-radius:0; box-shadow:none; }
.tab-tree .spatial-map-shell .family-map-scroll { height:100%; }
.tab-tree .network-boundary,.tab-tree .external-connections { display:none; }
.tab-moments .relay-module { margin-top:0; }
.content { padding:22px; }
.invite-banner { margin-bottom:18px; padding:18px; border:1px solid #efd68b; border-radius:16px; background:#fff7d8; }
.invite-banner h2,.section-title h2 { margin:0; font-size:19px; }
.invite-banner p { color:#76683d; line-height:1.55; }
.invite-decision { padding:22px 2px; text-align:center; }
.invite-decision > span { color:var(--green); font-size:11px; font-weight:700; letter-spacing:.08em; }
.invite-decision h2 { margin:10px 0; font-family:Georgia,"Songti SC",serif; font-size:27px; font-weight:500; line-height:1.45; }
.invite-decision > p { margin:0 auto 22px; max-width:390px; color:var(--muted); font-size:13px; line-height:1.75; }
.invite-decision > .text-button { min-width:44px; min-height:44px; margin-top:10px; }
.invite-identity { display:flex; align-items:center; gap:12px; margin:0 0 20px; padding:14px; border-radius:15px; text-align:left; background:#eef5f1; }
.invite-identity i { display:grid; width:44px; height:44px; flex:none; place-items:center; border-radius:50%; color:white; background:var(--green); font-style:normal; }
.invite-identity small,.invite-identity b { display:block; }
.invite-identity small { margin-bottom:3px; color:var(--muted); font-size:11px; }
.invite-identity b { font-size:15px; }
.family-empty { padding:34px 0; }
.family-empty h2 { font-family:Georgia,"Songti SC",serif; font-size:27px; font-weight:500; }
.family-empty p { color:var(--muted); line-height:1.65; }
.panel { margin-bottom:18px; padding:18px; border:1px solid #e4e2db; border-radius:18px; background:white; box-shadow:0 7px 24px rgba(40,48,43,.04); }
.family-head { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.family-head > div:first-child { min-width:0; flex:1; }
.family-head > .secondary { flex:none; padding:9px 11px; white-space:nowrap; }
.family-head span { display:block; color:var(--muted); font-size:11px; }
.family-head h2 { margin:4px 0 0; font-family:Georgia,"Songti SC",serif; font-size:25px; font-weight:500; }
.share-box { margin-top:15px; padding-top:15px; border-top:1px solid var(--line); }
.member-strip { display:flex; align-items:center; gap:6px; margin-top:15px; padding-top:15px; border-top:1px solid var(--line); }
.member-strip > span { margin-right:3px; color:var(--muted); font-size:11px; }
.member-strip i { display:grid; width:29px; height:29px; place-items:center; border:2px solid white; border-radius:50%; color:white; background:var(--member-family-ring,var(--green)); box-shadow:0 0 0 1px rgba(25,74,68,.08); font-style:normal; font-size:12px; }
.member-strip b { min-width:0; margin-left:3px; overflow:hidden; color:#66706b; font-size:11px; font-weight:500; text-overflow:ellipsis; white-space:nowrap; }
.activity-module { margin:18px 0; padding:18px; border:1px solid #e1e5df; border-radius:18px; background:white; }
.activity-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.activity-heading span { color:var(--green); font-size:11px; font-weight:700; letter-spacing:.08em; }
.activity-heading h2 { margin:4px 0 0; font-family:Georgia,"Songti SC",serif; font-size:21px; font-weight:500; }
.activity-item { position:relative; display:grid; grid-template-columns:34px 1fr auto; align-items:center; gap:10px; padding:13px 0; border-top:1px solid var(--line); }
.activity-item:first-child { margin-top:12px; }
.activity-item > i { display:grid; width:34px; height:34px; place-items:center; border-radius:50%; color:#617069; background:#eef1ed; font-size:11px; font-style:normal; }
.activity-item.unread > i { color:white; background:var(--green); }
.activity-item.unread::after { content:""; position:absolute; right:-4px; top:17px; width:6px; height:6px; border-radius:50%; background:#e3a927; }
.activity-item span { color:var(--muted); font-size:11px; }
.activity-item p { margin:3px 0 0; color:#3f4944; font-size:12px; line-height:1.45; }
.activity-item time { padding-right:8px; color:#8a9690; font-size:11px; }
.activity-empty { margin:18px 0 0; color:var(--muted); font-size:11px; line-height:1.6; }
.share-box input { font-size:12px; }
.share-actions { display:flex; gap:8px; margin-top:9px; }
.share-ready {
  margin-top:14px;
  padding:14px;
  border:1px solid rgba(43,103,93,.1);
  border-radius:16px;
  background:linear-gradient(145deg,rgba(242,249,246,.96),rgba(255,251,242,.9));
}
.share-ready > p { margin:0 2px 12px; color:#65766f; font-size:12px; line-height:1.6; }
.share-ready > .primary { width:100%; min-height:50px; }
.share-ready > details { margin-top:7px; text-align:center; }
.share-ready > details > summary { display:inline-grid; min-height:36px; padding:0 8px; place-items:center; color:#7d8984; font-size:11px; cursor:pointer; list-style:none; }
.share-ready > details > summary::-webkit-details-marker { display:none; }
.share-ready > details > .text-button { min-height:40px; color:#527068; font-size:12px; }
.share-result-note { margin:10px 3px 0; color:#74827d; font-size:11px; line-height:1.55; text-align:center; }
.person-invite-ready { display:grid; gap:8px; margin-top:12px; padding:12px 14px; border-radius:14px; background:rgba(255,255,255,.66); }
.person-invite-ready p { margin:0; color:#62736c; font-size:11px; line-height:1.6; }
.person-invite-ready .danger-text { justify-self:start; min-height:32px; padding:0; font-size:11px; }
.export-box { padding-top:2px; }
.export-box > span { color:var(--green); font-size:11px; font-weight:700; letter-spacing:.08em; }
.export-box h3 { margin:6px 0; font-family:Georgia,"Songti SC",serif; font-size:20px; font-weight:500; }
.export-box p { color:var(--muted); font-size:11px; line-height:1.65; }
.export-box button { margin:5px 6px 5px 0; }
.export-box small { display:block; margin-top:8px; color:var(--muted); font-size:11px; line-height:1.55; }
.section-title { position:relative; display:flex; align-items:end; justify-content:space-between; margin:28px 2px 13px; }
.section-title span { color:var(--muted); font-size:11px; }
.section-title.has-pending-sync::after { content:"家人有新内容 · 看完后更新"; position:absolute; right:22px; margin-top:24px; color:var(--green); font-size:11px; }
.home-story-heading > span { margin-left:auto; }
.home-story-heading > .text-button { min-height:36px; margin:-6px -6px -6px 4px; color:var(--green); font-size:11px; }
.story { padding:22px 2px; border-bottom:1px solid var(--line); }
.story:first-child { padding-top:4px; }
.story h3 { margin:0 0 9px; font-family:Georgia,"Songti SC",serif; font-size:22px; font-weight:500; }
.story p { margin:0 0 14px; color:#414943; font-family:Georgia,"Songti SC",serif; font-size:16px; line-height:1.85; }
.story footer { display:flex; justify-content:space-between; color:var(--muted); font-size:11px; }
.story footer b { color:var(--green); font-weight:600; }
.story footer button { padding:2px 0; border:0; color:var(--green); background:transparent; font-size:11px; font-weight:700; }
.story-owner-actions { display:flex; justify-content:flex-end; gap:16px; margin-top:12px; }
.story-owner-actions button { padding:4px 0; border:0; color:var(--muted); background:transparent; font-size:11px; }
.story-owner-actions .danger-text { color:#a34f47; }
.processing-review { margin:18px 0; padding:15px; border-radius:14px; background:#f1f6f3; }
.processing-review > small { color:var(--muted); font-size:11px; line-height:1.6; }
.processing-review textarea { min-height:90px; }
.processing-review textarea[data-auto-grow-story-draft] { overflow-y:hidden; resize:none; }
.processing-review > span { display:block; margin-bottom:12px; color:var(--green); font-size:11px; font-weight:700; }
.processing-review fieldset { margin:0 0 12px; padding:12px; border:1px solid #d6e3dc; border-radius:12px; }
.processing-review legend { color:var(--muted); font-size:11px; }
.processing-review fieldset label { display:flex; grid:unset; align-items:center; gap:7px; margin:8px 0; }
.processing-review fieldset input { width:auto; margin:0; }
.story-additions { margin:16px 0 4px; padding:4px 0 4px 14px; border-left:2px solid #c8ddd6; }
.story-additions blockquote { margin:8px 0; color:#505b55; font-size:13px; line-height:1.65; }
.story-additions b { display:block; margin-bottom:2px; color:var(--green); font-size:11px; }
.story-social-actions { margin-top:12px; }
.story-social-actions button { padding:5px 0; border:0; color:var(--green); background:transparent; font-size:11px; font-weight:700; }
.addition-form { margin-top:13px; padding:13px; border-radius:13px; background:#f1f6f3; }
.addition-form textarea { min-height:82px; }
.addition-form > div { display:flex; align-items:center; gap:8px; }
.addition-form .primary { width:auto; padding:10px 14px; }
.revision-form { margin-top:13px; padding:14px; border:1px solid #e2ded3; border-radius:14px; background:#faf8f1; }
.revision-form > p { margin:0 0 12px; color:#776f61; font-size:11px; line-height:1.6; }
.revision-form textarea { min-height:110px; }
.revision-form > div { display:flex; align-items:center; gap:8px; }
.revision-form .primary { width:auto; padding:10px 14px; }
.relay-module { margin:22px 0; padding:20px; border-radius:20px; color:#263b35; background:linear-gradient(145deg,#edf7f2,#fff9df); }
.relay-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.relay-heading span { color:var(--green); font-size:11px; font-weight:700; letter-spacing:.08em; }
.relay-heading .relay-availability { flex:none; color:var(--muted); font-weight:500; letter-spacing:0; }
.relay-heading h2 { margin:4px 0 0; font-family:Georgia,"Songti SC",serif; font-size:22px; font-weight:500; }
#questionComposer form { margin-top:16px; padding:16px; border:1px solid rgba(33,105,91,.14); border-radius:18px; background:rgba(255,255,255,.62); box-shadow:0 10px 28px rgba(51,78,69,.06); }
#questionComposer form > p { margin:9px 2px 13px; color:var(--muted); font-size:11px; line-height:1.6; }
#questionComposer textarea { min-height:82px; margin-top:7px; background:rgba(255,255,255,.88); }
.question-family-picker { min-width:0; margin:0 0 15px; padding:0; border:0; }
.question-family-picker legend { margin-bottom:8px; color:#50645d; font-size:12px; font-weight:700; }
.question-family-picker > div { display:flex; gap:8px; margin:0 -3px; padding:3px; overflow-x:auto; scrollbar-width:none; scroll-snap-type:x proximity; }
.question-family-picker > div::-webkit-scrollbar { display:none; }
.question-family-picker label { position:relative; flex:0 0 min(148px,44vw); margin:0; scroll-snap-align:start; }
.question-family-picker input { position:absolute; opacity:0; pointer-events:none; }
.question-family-picker label > span { position:relative; display:grid; grid-template-columns:7px minmax(0,1fr) 18px; grid-template-rows:auto auto; column-gap:9px; min-height:62px; padding:11px 10px; border:1px solid #e1e8e3; border-radius:15px; background:rgba(255,255,255,.82); transition:border-color .18s ease,background .18s ease,transform .18s ease; }
.question-family-picker label > span > i { grid-row:1/3; align-self:stretch; width:4px; margin-left:1px; border-radius:999px; background:var(--family-color,#52a695); opacity:.72; }
.question-family-picker label > span > b { align-self:end; overflow:hidden; color:#29473f; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.question-family-picker label > span > small { align-self:start; overflow:hidden; color:#8a958f; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.question-family-picker label > span > em { grid-column:3; grid-row:1/3; align-self:center; color:var(--green); font-size:14px; font-style:normal; opacity:0; }
.question-family-picker input:checked + span { border-color:rgba(42,145,127,.48); background:#f0faf6; box-shadow:0 5px 16px rgba(42,116,102,.08); transform:translateY(-1px); }
.question-family-picker input:checked + span > em { opacity:1; }
.question-family-picker .question-family-all { flex-basis:176px; }
.question-family-picker .question-family-all > span { grid-template-columns:32px minmax(0,1fr) 16px; column-gap:8px; }
.question-family-picker .question-family-all > span > b { font-size:12px; }
.question-family-picker .question-family-all > span > i { align-self:center; width:32px; height:32px; margin:0; border-radius:11px; color:#277c6d; background:#dff3ec; font-size:11px; font-style:normal; font-weight:800; line-height:32px; text-align:center; opacity:1; }
.question-person-picker { margin:0 0 14px; }
.question-person-picker > span { display:block; margin-bottom:7px; color:#50645d; font-size:12px; font-weight:700; }
.question-person-picker > small { display:block; margin:7px 2px 0; color:#8a958f; font-size:11px; line-height:1.5; }
.question-person-picker .person-combobox-trigger { min-height:56px; border-color:#dce7e1; background:rgba(255,255,255,.88); box-shadow:none; }
.question-person-picker .person-combobox-panel { margin-top:7px; }
.question-all-audience { display:grid; grid-template-columns:40px minmax(0,1fr); gap:11px; align-items:center; margin:0 0 14px; padding:12px; border:1px solid #dce8e2; border-radius:15px; background:linear-gradient(135deg,rgba(239,249,245,.94),rgba(255,252,237,.88)); }
.question-all-audience > i { width:40px; height:40px; border-radius:13px; color:#287d6e; background:#dff3ec; font-size:13px; font-style:normal; font-weight:800; line-height:40px; text-align:center; }
.question-all-audience span,.question-all-audience b,.question-all-audience small { display:block; min-width:0; }
.question-all-audience b { color:#29473f; font-size:13px; }
.question-all-audience small { margin-top:3px; color:#7d8c85; font-size:11px; line-height:1.45; }
.question-copy-field { display:block; margin:0; color:#50645d; font-size:12px; font-weight:700; }
.question-form-actions { display:flex; align-items:center; gap:9px; }
#questionComposer .question-form-actions .primary { width:auto; min-width:112px; padding:11px 16px; }
.relay-question { margin-top:16px; padding:17px; border:1px solid rgba(43,104,91,.14); border-radius:16px; background:rgba(255,255,255,.78); }
.relay-question > header { display:flex; justify-content:space-between; gap:12px; }
.relay-question header span { color:var(--muted); font-size:11px; }
.relay-question h3 { margin:4px 0 0; font-family:Georgia,"Songti SC",serif; font-size:19px; font-weight:500; line-height:1.45; }
.relay-question header em { flex:none; color:var(--green); font-size:11px; font-style:normal; }
.relay-answers { margin-top:13px; }
.relay-answers article { padding:12px 0; border-top:1px solid #e2e6df; }
.relay-answers article > span { color:var(--green); font-size:11px; font-weight:700; }
.relay-answers article > p { margin:5px 0; color:#44514b; line-height:1.7; }
.relay-answers footer { display:flex; gap:14px; }
.relay-answers footer button { min-height:44px; padding:3px 0; border:0; color:var(--green); background:transparent; font-size:11px; }
.relay-answers footer .danger-text { color:#a34f47; }
.relay-answers footer b { color:var(--muted); font-size:11px; }
.relay-answer-form { margin-top:13px; }
.relay-answer-form textarea { min-height:80px; }
.relay-answer-form .primary { padding:10px 14px; }
.relay-close { min-height:44px; margin-top:12px; padding:4px 0; border:0; color:var(--muted); background:transparent; font-size:11px; }
.relay-followups { margin:10px 0 0 18px; padding-left:11px; border-left:2px solid #d9e5dd; }
.relay-followups p { margin:7px 0; color:#55615b; font-size:11px; line-height:1.55; }
.relay-followups b { margin-right:6px; color:var(--green); }
.relay-question [data-followup-form] { margin-top:11px; padding:11px; border-radius:12px; background:#f6f8f4; }
.relay-question [data-followup-form] textarea { min-height:58px; }
.relay-owner-actions { display:flex; align-items:center; gap:14px; }
.relay-owner-actions .text-button,.relay-owner-actions .relay-close { min-height:44px; margin-top:12px; padding:4px 0; font-size:11px; }
.relay-owner-actions .danger-text { min-height:44px; margin-top:12px; padding:4px 0; border:0; color:#a65b50; background:transparent; font-size:11px; }
.relay-question-edit { margin-top:4px; padding:13px; border-radius:14px; background:rgba(238,247,243,.76); }
.relay-question-edit label { color:#496159; font-size:12px; font-weight:700; }
.relay-question-edit textarea { min-height:74px; margin-top:7px; }
.relay-question-edit > div { display:flex; align-items:center; gap:9px; }
.relay-question-edit .primary { width:auto; min-width:104px; padding:10px 15px; }
.relay-empty,.relay-empty-module { color:var(--muted); font-size:12px; line-height:1.65; }
.relay-empty-module { padding:24px 4px 5px; text-align:center; }
.network-module { margin:22px 0; padding:20px; border:1px solid #e0e6e1; border-radius:20px; background:#fff; }
.network-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.network-heading span { color:#8a7560; font-size:11px; font-weight:700; letter-spacing:.08em; }
.network-heading h2 { margin:4px 0 0; font-family:Georgia,"Songti SC",serif; font-size:22px; font-weight:500; }
.network-actions { display:flex; align-items:center; gap:4px; }
.network-actions .text-button { font-size:11px; }
#personComposer form { margin-top:16px; padding:16px; border-radius:14px; background:#f5f7f3; }
#connectionComposer form { margin-top:16px; padding:16px; border-radius:14px; background:#eef5f1; }
#connectionComposer form > p,.relationship-first-space > p { color:var(--muted); font-size:11px; line-height:1.6; }
#connectionComposer form > div { display:flex; gap:8px; }
#connectionComposer .primary { width:auto; padding:10px 14px; }
.external-connections { margin-top:14px; padding:13px; border-radius:13px; background:#f2f5f2; }
.external-connections > b { color:var(--green); font-size:11px; }
.external-connections p { margin:9px 0 0; color:#4c5852; font-size:11px; }
.external-connections small { display:block; margin-top:3px; color:var(--muted); font-size:11px; }
.duplicate-review { margin-top:12px; padding-top:12px; border-top:1px solid var(--line); }
.duplicate-review > p { color:var(--muted); font-size:11px; line-height:1.6; }
.duplicate-review form,.duplicate-review article { padding:9px 0; border-top:1px solid var(--line); font-size:11px; }
.duplicate-review form > span small { display:block; margin-top:4px; color:var(--muted); font-size:11px; }
.conflict-page { min-height:100vh; background:#f8f6ef; }
.conflict-page > header { padding:28px 24px 34px; color:white; background:linear-gradient(150deg,#6c5f52,#234e47); }
.conflict-page > header .text-button { color:#fff; }
.conflict-page > header p { margin:24px 0 6px; color:#e8ce92; font-size:11px; }
.conflict-page > header span { display:block; margin-top:12px; color:rgba(255,255,255,.7); font-size:11px; line-height:1.6; }
.conflict-content { padding:22px; }
.conflict-content h2 { margin-top:28px; font-size:19px; }
.memory-principle { display:flex; align-items:flex-start; gap:10px; margin:-5px 0 18px; padding:13px 14px; border-radius:14px; color:#f7f4eb; background:#315a51; }
.memory-principle b { flex:none; font-size:12px; }
.memory-principle span { color:rgba(255,255,255,.72); font-size:11px; line-height:1.55; }
.memory-sides { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.memory-sides article { position:relative; min-width:0; padding:14px; border:1px solid #e4e0d7; border-radius:15px; background:white; }
.memory-sides i { position:absolute; top:11px; right:11px; display:grid; width:22px; height:22px; place-items:center; border-radius:50%; color:#fff; background:#7d9c91; font-size:11px; font-style:normal; }
.memory-sides span,.memory-sides b,.memory-sides small { display:block; padding-right:20px; overflow-wrap:anywhere; }
.memory-sides span { color:#8a7560; font-size:11px; font-weight:700; }
.memory-sides b { margin-top:5px; font-size:15px; }
.memory-sides small { margin-top:8px; color:var(--muted); font-size:11px; line-height:1.5; }
.memory-topic { margin:12px 0; padding:15px; border:1px solid #e5e0d7; border-radius:17px; background:rgba(255,255,255,.55); }
.memory-topic > header span { color:#8a7560; font-size:11px; font-weight:700; letter-spacing:.08em; }
.memory-topic > header h3 { margin:3px 0 10px; font-size:16px; }
.conflict-content blockquote { margin:8px 0; padding:13px 14px; border-left:3px solid #7ca89d; border-radius:0 12px 12px 0; background:white; }
.conflict-content blockquote.side-2 { border-left-color:#b99a72; }
.conflict-content blockquote b { color:var(--green); font-size:11px; }
.conflict-content blockquote p { margin:5px 0 0; line-height:1.7; }
.conflict-content blockquote small { display:block; margin-top:8px; color:var(--muted); font-size:11px; }
.conflict-content form,.reconciliation { margin:14px 0; padding:15px; border-radius:14px; background:white; }
.conflict-content form h3 { margin-top:0; font-size:15px; }
.conflict-content form > small,.reconciliation > small { display:block; margin-top:10px; color:var(--muted); font-size:11px; line-height:1.55; }
.memory-claim-origin { margin:0 0 12px; padding:9px 11px; border-radius:10px; color:var(--green); background:#edf5f1; font-size:11px; }
.reconciliation header { display:flex; justify-content:space-between; gap:10px; }
.reconciliation header span { flex:none; color:#8a7560; font-size:11px; font-weight:700; }
.reconciliation.disputed { border-left:3px solid #b67962; }
.reconciliation.confirmed { border-left:3px solid var(--green); }
#personComposer form > div { display:flex; gap:8px; }
#personComposer .primary { width:auto; padding:10px 14px; }
.person-family-scopes { margin:14px 0; padding:0; border:0; }
.person-family-scopes legend { margin-bottom:8px; color:var(--ink); font-size:12px; font-weight:700; }
.person-family-scopes > div { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px !important; }
.person-family-scopes label { display:flex; min-height:44px; align-items:center; gap:8px; margin:0; padding:9px 10px; border:1px solid #dfe7e2; border-radius:13px; color:var(--muted); background:white; font-size:11px; }
.person-family-scopes label:has(input:checked) { border-color:color-mix(in srgb,var(--family-color) 45%,#dfe7e2); color:var(--deep); background:#f5faf8; box-shadow:inset 0 0 0 1px rgba(28,128,116,.05); }
.person-family-scopes label.unavailable { opacity:.42; background:#f4f1ea; }
.person-family-scopes input { width:18px; height:18px; margin:0; accent-color:var(--green); }
.person-family-scopes label > i { width:9px; height:9px; flex:none; border-radius:50%; background:var(--family-color); }
.person-family-scopes label > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.person-family-scopes > p { margin:8px 1px 0 !important; color:var(--muted); font-size:11px; line-height:1.55; }
.family-map-scroll { position:relative; overflow:hidden; margin:0 -12px; padding:0 12px 14px; cursor:grab; overscroll-behavior:contain; touch-action:none; user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; contain:layout paint; }
html.browser-page-zoomed .family-map-scroll { touch-action:pinch-zoom; }
.family-map-scroll.dragging { cursor:grabbing; }
.family-map-scroll::-webkit-scrollbar { display:none; }
.spatial-map-shell { position:relative; overflow:hidden; margin-top:14px; border:1px solid rgba(28,128,116,.18); border-radius:27px; background-color:#e5f4ed; background-image:radial-gradient(circle at 50% 50%,rgba(255,255,255,.94),rgba(229,244,237,.45) 46%,rgba(188,229,216,.62)),radial-gradient(circle,rgba(28,128,116,.11) .8px,transparent .8px); background-size:auto,24px 24px; box-shadow:0 12px 32px rgba(47,88,77,.1); }
.spatial-map-shell .family-map-scroll { height:480px; margin:0; padding:0; }
.network-recenter { position:fixed; z-index:12; right:max(14px,calc((100vw - 620px)/2 + 14px)); bottom:calc(76px + max(14px,env(safe-area-inset-bottom))); display:flex; min-height:44px; align-items:center; gap:5px; padding:8px 13px; border:1px solid rgba(28,128,116,.18); border-radius:999px; color:var(--green); background:rgba(255,254,250,.9); box-shadow:0 5px 16px rgba(47,88,77,.1); font-size:14px; backdrop-filter:blur(10px); }
.network-recenter span { font-size:11px; font-weight:650; }
.network-recenter[hidden] { display:none; }
.network-zoom-controls { position:absolute; z-index:11; right:14px; bottom:14px; display:none; overflow:hidden; border:1px solid rgba(80,99,91,.12); border-radius:14px; background:rgba(255,252,246,.92); box-shadow:0 8px 22px rgba(48,67,60,.1); backdrop-filter:blur(16px) saturate(1.12); }
.network-zoom-controls button { display:grid; width:40px; height:40px; min-height:40px; place-items:center; padding:0; border:0; border-radius:0; color:#45665e; background:transparent; font:400 23px/1 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; }
.network-zoom-controls button + button { border-top:1px solid rgba(80,99,91,.1); }
.network-zoom-controls button:hover { background:rgba(49,118,106,.08); }
.network-zoom-controls button:active { background:rgba(49,118,106,.13); }
@media (hover:hover) and (pointer:fine),(min-width:700px) {
  .network-zoom-controls { display:flex; flex-direction:column; }
  .tab-tree .network-recenter { position:absolute; right:66px; bottom:14px; }
}
.network-find { position:absolute; z-index:6; top:74px; right:12px; min-height:38px; padding:7px 12px; border:1px solid rgba(255,255,255,.84); border-radius:999px; color:var(--deep); background:rgba(255,254,250,.9); box-shadow:0 5px 16px rgba(47,88,77,.1); font-size:12px; backdrop-filter:blur(10px); }
.family-map-stage { position:absolute; inset:0; }
.family-map { position:absolute; top:0; left:0; overflow:visible; border:0; border-radius:0; background:transparent; box-shadow:none; transform-origin:0 0; will-change:transform; backface-visibility:hidden; }
.family-map svg { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.family-map path { fill:none; stroke:#90aaa2; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 1px 0 white); vector-effect:non-scaling-stroke; }
.family-map path.parent-under {
  stroke:rgba(255,254,250,.9);
  stroke-width:8;
  filter:none;
}
.family-map path.spouse { stroke:#d1ad79; stroke-dasharray:4 4; }
.family-map path.spouse-bond-under {
  stroke:rgba(255,254,250,.94);
  stroke-width:11;
  stroke-linecap:round;
  filter:none;
}
.family-map path.spouse {
  stroke-width:3;
  stroke-linecap:round;
  stroke-dasharray:none;
  filter:none;
}
.family-map .spouse-joint {
  fill:#fffaf1;
  stroke-width:2;
}
.family-map path.couple-child { stroke-width:2.4; }
.family-map path.sibling,
.family-map path.sibling-rail,
.family-map path.sibling-stem { stroke:#789b92; }
.family-map path.sibling-rail { stroke-width:2.1; }
.family-map path.sibling-stem { stroke-width:1.7; }
.family-map path.sibling-rail.neutral,
.family-map path.sibling-stem.neutral { stroke:#91a59f; }
.family-map path.sibling-rail.neutral { stroke-dasharray:3 3; }
.family-map path.sibling-parent { stroke-width:2.2; }
.family-map path.clue-path { stroke:#8d877d; stroke-width:1.5; stroke-dasharray:5 7; opacity:.72; }
.family-map path.relationship-conflict { stroke:#9a6559; stroke-width:2; stroke-dasharray:3 7; filter:none; }
.network-person { position:absolute; z-index:2; display:flex; width:68px; min-height:82px; flex-direction:column; align-items:center; gap:4px; padding:4px 0 6px; overflow:visible; border:0; border-radius:14px; color:var(--ink); background:transparent; box-shadow:none; transform:translate(-50%,-50%); text-align:center; transition:transform .32s cubic-bezier(.22,.78,.18,1),filter .24s ease; -webkit-tap-highlight-color:transparent; }
.network-person.partnered {
  width:68px;
  padding:4px 0 6px;
  border:0;
  box-shadow:none;
}
.network-person.partnered > i { width:44px; height:44px; }
.network-person:active { transform:translate(-50%,-50%) scale(.95); }
.network-person i { display:grid; width:44px; height:44px; flex:none; place-items:center; border:3px solid #d8eee6; border-radius:50%; color:white; background:#819087; box-shadow:none; font-style:normal; font-weight:700; }
.network-person-copy { display:block; width:100%; min-width:0; padding:3px 2px 4px; border-radius:9px; background:rgba(255,253,248,.88); box-shadow:0 3px 9px rgba(44,70,61,.06); text-align:center; }
.network-person-copy b,.network-person-copy small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.network-person-copy b { color:#263e37; font-size:13px; line-height:1.2; }
.network-person-copy small { margin-top:2px; color:var(--muted); font-size:11px; line-height:1.2; }
.network-person-copy em { display:none; }
.network-person > i { overflow:hidden; }
.network-person > i img { width:100%; height:100%; object-fit:cover; }
.network-person.me { filter:drop-shadow(0 7px 10px rgba(242,108,82,.13)); }
.network-person.me i { border-color:#ffd8ca; background:linear-gradient(145deg,var(--coral),#d8513e); box-shadow:0 0 0 4px rgba(242,108,82,.12); }
.network-person:not(.me) > i { box-shadow:0 0 0 3px #e4ece8; }
.network-person.unclaimed:not(.me) > i { border:2px dashed #9daca6; box-shadow:none; }
.network-person.multi-family > i { color:var(--deep); background:linear-gradient(145deg,#fff,#e8f2ee); }
.network-person.paternal i { background:#667f9c; }
.network-person.maternal i { background:#a87676; }
.network-person.own i { background:#9a7e55; }
.network-person.clue { opacity:.72; }
.network-person.clue i { color:#71695e; border:2px dashed #9d9488; background:#f3eee5; box-shadow:none; }
.network-person.focused i { animation:network-focus 1.2s ease; }
@keyframes network-focus { 40% { box-shadow:0 0 0 9px rgba(42,139,126,.2); transform:scale(1.12); } }
.network-legend { display:flex; flex-wrap:wrap; gap:12px; margin-top:2px; color:var(--muted); font-size:11px; }
.spatial-map-shell .network-legend { position:absolute; z-index:5; bottom:12px; left:12px; max-width:calc(100% - 24px); margin:0; padding:7px 10px; overflow-x:auto; border:1px solid rgba(255,255,255,.76); border-radius:999px; background:rgba(255,254,250,.82); box-shadow:0 4px 12px rgba(47,88,77,.08); backdrop-filter:blur(10px); white-space:nowrap; scrollbar-width:none; }
.tab-tree .spatial-map-shell .network-legend { bottom:14px; max-width:calc(100% - 128px); }
.spatial-map-shell .network-legend::-webkit-scrollbar { display:none; }
.branch-zones .branch-zone { stroke-width:2; }
.branch-zones .family-zone { stroke-width:0; opacity:0; }
.branch-zones .family-zone-shape { opacity:.06; }
.branch-zones .family-zone-bridge { fill:none; stroke-width:24; stroke-linecap:round; stroke-linejoin:round; opacity:.045; }
.branch-zones .family-zone-mark { opacity:.72; }
.branch-zones .family-zone-label { font-size:12px; font-weight:700; letter-spacing:.04em; opacity:.58; }
.branch-zones .paternal { fill:rgba(28,128,116,.085); stroke:rgba(28,128,116,.13); }
.branch-zones .maternal { fill:rgba(242,108,82,.075); stroke:rgba(242,108,82,.12); }
.branch-zones .own { fill:rgba(246,184,61,.085); stroke:rgba(233,169,31,.14); }
.network-legend span,.network-legend button { display:flex; align-items:center; gap:5px; }
.network-legend button { min-height:0; padding:0; border:0; color:inherit; background:none; font:inherit; }
.network-legend .family-legend-toggle { min-height:28px; padding:3px 7px; border-radius:999px; opacity:.42; transition:opacity .18s ease,background .18s ease; }
.network-legend .family-legend-toggle.active { color:var(--deep); background:rgba(28,128,116,.09); opacity:1; }
.network-legend .family-legend-toggle:not(.active) i { filter:grayscale(.7); }
.network-legend i { width:8px; height:8px; border-radius:50%; background:#819087; }
.network-legend .paternal i { background:#667f9c; }
.network-legend .maternal i { background:#a87676; }
.network-legend .own i { background:#9a7e55; }
.network-legend .clue i { border:1px dashed #71695e; background:#f3eee5; }
.network-legend .conflict { color:#8b574e; cursor:pointer; }
.network-legend .conflict i { border:1px dashed #9a6559; background:#f7e8e3; }
.clue-review { margin-top:15px; padding:16px; border-radius:15px; background:#f7f3ea; }
.clue-review > span { color:#8a7560; font-size:11px; font-weight:700; letter-spacing:.08em; }
.clue-review h3 { margin:5px 0 8px; font-size:20px; }
.clue-review blockquote { margin:0; padding:10px 12px; border-left:2px solid #cbbca4; color:#5e5a52; background:rgba(255,255,255,.6); font-size:11px; line-height:1.6; }
.clue-review > p { color:var(--muted); font-size:11px; line-height:1.6; }
.clue-review form { margin-top:10px !important; padding:12px !important; background:#fff !important; }
.clue-review .primary { width:100% !important; }
.kinship-path { margin:0 0 11px; padding:11px 12px; border:1px dashed #9f9689; border-radius:12px; background:#fffdfa; }
.kinship-path small,.kinship-path b { display:block; }
.kinship-path small { margin-bottom:5px; color:var(--muted); font-size:11px; font-weight:500; }
.kinship-path b { color:#4c635b; font-size:11px; line-height:1.6; }
.processing-review fieldset label { grid-template-columns:auto 1fr; align-items:start; }
.processing-review fieldset label input { margin-top:3px; }
.processing-review fieldset label span,.processing-review fieldset label small { display:block; }
.processing-review fieldset label small { margin-top:4px; color:#7a8b84; font-size:11px; line-height:1.55; }
.clue-light-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:12px; }
.clue-light-actions .text-button { min-height:44px; padding:2px 0; font-size:11px; }
.network-empty { color:var(--muted); font-size:11px; text-align:center; }
.network-boundary { margin:15px 0 0; padding-top:12px; border-top:1px solid var(--line); color:var(--muted); font-size:11px; line-height:1.6; }
.tab-tree #personComposer:not(:empty),.tab-tree #connectionComposer:not(:empty),.tab-tree #relationshipConflictComposer:not(:empty),.tab-tree #networkSearchComposer:not(:empty) { position:fixed; z-index:20; inset:0 0 76px; display:flex; align-items:flex-end; justify-content:center; padding-top:58px; touch-action:pan-x pan-y pinch-zoom; background:rgba(18,38,33,.32); backdrop-filter:blur(3px); }
.tab-tree #personComposer > form,.tab-tree #personComposer > .clue-review,.tab-tree #connectionComposer > form,.tab-tree #relationshipConflictComposer > .relationship-conflict-sheet,.tab-tree #networkSearchComposer > .network-search-sheet { width:min(100%,620px); max-height:calc(100dvh - 146px - env(safe-area-inset-bottom)); min-height:0; margin:0 !important; padding:18px 20px max(20px,env(safe-area-inset-bottom)) !important; overflow-x:auto; overflow-y:auto; overscroll-behavior:contain; touch-action:pan-x pan-y pinch-zoom; -webkit-overflow-scrolling:touch; scroll-padding-bottom:92px; border:0; border-radius:24px 24px 0 0; background:#fffefa; box-shadow:0 -16px 42px rgba(25,74,68,.18); }
html.browser-page-zoomed #app.tab-tree:has(#personComposer:not(:empty)) { height:auto; min-height:100dvh; overflow:visible; }
html.browser-page-zoomed .tab-tree:has(#personComposer:not(:empty)) .content { height:auto; min-height:calc(100dvh - 128px - env(safe-area-inset-bottom)); overflow:visible; }
html.browser-page-zoomed .tab-tree #personComposer:not(:empty) { position:relative; inset:auto; min-height:calc(100dvh - 128px - env(safe-area-inset-bottom)); align-items:flex-start; padding-top:0; overflow:visible; touch-action:auto; }
html.browser-page-zoomed .tab-tree #personComposer:not(:empty) > form { max-height:none; overflow:visible; overscroll-behavior:auto; touch-action:auto; -webkit-overflow-scrolling:auto; }
html.browser-page-zoomed .tab-tree #personComposer:not(:empty) + #networkBody { display:none; }
.tab-tree #personComposer > form h3 { margin:2px 0 6px; font-family:Georgia,"Songti SC",serif; font-size:23px; font-weight:500; }
.tab-tree #personComposer > form > p { margin:0 0 16px; color:var(--muted); font-size:11px; line-height:1.6; }
.sheet-handle { display:block; width:38px; height:4px; margin:-8px auto 14px; border-radius:999px; background:#d3dbd6; }
.relationship-conflict-sheet > span { color:#9a6559; font-size:11px; font-weight:700; letter-spacing:.08em; }
.relationship-conflict-sheet h3 { margin:5px 0 7px; font-family:Georgia,"Songti SC",serif; font-size:23px; font-weight:500; }
.relationship-conflict-sheet > p,.relationship-conflict-sheet > small { display:block; color:var(--muted); font-size:11px; line-height:1.65; }
.relationship-conflict-sheet article { margin:14px 0; padding:12px 14px; border-left:2px solid #c68a7c; background:#faf4f0; }
.relationship-conflict-sheet h4 { margin:0 0 8px; font-size:14px; }
.relationship-conflict-sheet ul { display:grid; gap:8px; margin:0; padding:0; list-style:none; }
.relationship-conflict-sheet li b,.relationship-conflict-sheet li small { display:block; }
.relationship-conflict-sheet li b { color:#4d514e; font-size:12px; font-weight:600; }
.relationship-conflict-sheet li small { margin-top:2px; color:#8a756f; font-size:11px; }
.relationship-conflict-sheet footer { margin:15px 0 10px; }
.relationship-conflict-sheet footer .primary { width:100%; }
.network-search-sheet > span { color:var(--green); font-size:11px; font-weight:700; letter-spacing:.08em; }
.network-search-sheet h3 { margin:5px 0 15px; font-family:Georgia,"Songti SC",serif; font-size:23px; font-weight:500; }
.network-search-field { margin-bottom:8px; }
.network-search-results { display:grid; max-height:42dvh; overflow:auto; }
.network-search-results > button { display:grid; grid-template-columns:38px 1fr; min-height:58px; align-items:center; gap:11px; padding:8px 2px; border:0; border-bottom:1px solid var(--line); color:var(--ink); background:transparent; text-align:left; }
.network-search-results > button[hidden] { display:none; }
.network-search-results > button > i { display:grid; width:38px; height:38px; place-items:center; border-radius:50%; color:var(--deep); background:var(--mint); font-style:normal; }
.network-search-results > button b,.network-search-results > button small { display:block; }
.network-search-results > button b { font-size:13px; }
.network-search-results > button small { margin-top:2px; color:var(--muted); font-size:11px; }
.network-search-results > p { color:var(--muted); font-size:12px; line-height:1.6; text-align:center; }
.network-search-sheet > .text-button { width:100%; margin-top:6px; }
.story-people-tags { display:flex; flex-wrap:wrap; gap:5px; margin:-2px 0 9px; }
.story-people-tags span { padding:4px 8px; border-radius:999px; color:var(--green); background:#e7f3ed; font-size:11px; }
.story-fact-details,.asset-provenance { margin:10px 0; border-radius:14px; background:#f3f6f2; }
.story-fact-details > summary,.asset-provenance > summary { min-height:44px; padding:12px 13px; color:var(--green); cursor:pointer; font-size:12px; font-weight:650; }
.story-fact-details > div,.asset-provenance > div { padding:2px 13px 13px; }
.story-fact-fields { display:grid; grid-template-columns:1fr 1fr; gap:0 10px; }
.story-fact-fields label:last-child { grid-column:1/-1; }
.story-facts { display:flex; flex-wrap:wrap; gap:10px; margin:-2px 0 9px; color:#8a7560; font-size:11px; }
.story-facts span + span::before { content:"·"; margin-right:10px; color:#b7aea1; }
.person-page { min-height:100vh; background:#fbfaf6; }
.detail-view { min-height:100vh; height:auto; overflow:visible; padding-bottom:0; background:#fbfaf6; }
.person-page > header { padding:24px 24px 34px; color:white; text-align:center; background:linear-gradient(150deg,#2a8b7e,#174e47); }
.person-page > header .text-button { display:block; margin-bottom:25px; color:rgba(255,255,255,.8); }
.person-avatar { display:grid; width:76px; height:76px; margin:auto; place-items:center; border:2px solid rgba(255,255,255,.55); border-radius:50%; color:#22564f; background:#f2c75a; font-size:28px; }
.person-avatar { overflow:hidden; }
.person-avatar img { width:100%; height:100%; object-fit:cover; }
.person-account-profile { margin:0 18px 18px; padding:17px 18px; border-radius:16px; background:#eef6f1; }
.person-account-profile > span { color:var(--green); font-size:11px; font-weight:750; }
.person-account-profile p { margin:7px 0 10px; color:#36574f; font-size:14px; line-height:1.6; }
.person-account-profile > div { display:flex; flex-wrap:wrap; gap:7px; }
.person-account-profile small { padding:5px 9px; border-radius:999px; color:#597069; background:rgba(255,255,255,.75); font-size:11px; }
.person-account-profile > em { display:block; margin-top:9px; color:#7b8984; font-size:11px; font-style:normal; }
.person-page > header p { margin:13px 0 3px; color:#cbe1db; font-size:11px; }
.person-page > header h1 { font-size:36px; }
.person-page > header em { display:block; margin-top:10px; color:rgba(255,255,255,.72); font-size:11px; font-style:normal; }
.protected-child-message { margin:28px 22px; padding:30px 24px; border:1px solid rgba(52,103,93,.09); border-radius:24px; text-align:center; background:linear-gradient(145deg,rgba(232,247,241,.86),rgba(255,247,226,.78)); box-shadow:0 18px 38px rgba(60,86,75,.07); }
.protected-child-message > span { display:grid; width:48px; height:48px; margin:0 auto 15px; place-items:center; border-radius:50%; color:#327a6f; background:rgba(255,255,255,.78); font-size:25px; }
.protected-child-message h2 { margin:0 0 10px; color:#31574f; font-size:20px; }
.protected-child-message p { margin:0; color:#5f706a; font-size:14px; line-height:1.75; }
.protected-child-message small { display:block; margin-top:14px; color:#89938f; font-size:11px; line-height:1.6; }
.person-profile-status {
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin-top:10px;
}
.person-page > header .person-profile-status em { margin:0; }
.person-profile-status button {
  min-height:30px;
  padding:5px 10px;
  border:1px solid rgba(41,103,93,.16);
  border-radius:999px;
  color:#277a6e;
  background:rgba(255,255,255,.7);
  font-size:11px;
  font-weight:800;
  backdrop-filter:blur(8px);
}
.person-summary { display:grid; grid-template-columns:repeat(2,1fr); margin:0 20px; padding:19px 0; border-bottom:1px solid var(--line); }
.person-summary.has-status { grid-template-columns:repeat(3,1fr); }
.person-summary > * { text-align:center; }
.person-summary > * + * { border-left:1px solid var(--line); }
.person-summary button { min-height:48px; padding:0; border:0; border-radius:12px; color:inherit; background:transparent; cursor:pointer; }
.person-summary button:active { color:var(--green); background:rgba(45,140,128,.07); }
.person-summary b,.person-summary span { display:block; }
.person-summary b { font-size:17px; }
.person-summary span { margin-top:4px; color:var(--muted); font-size:11px; }
.person-viewer-path { margin:20px 22px 0; padding:15px 0 17px; border-bottom:1px solid var(--line); }
.person-viewer-path > span { color:var(--green); font-size:11px; font-weight:700; letter-spacing:.08em; }
.person-viewer-path p { display:flex; flex-wrap:wrap; align-items:center; gap:7px; margin:7px 0 5px; color:var(--deep); font-size:13px; font-weight:650; }
.person-viewer-path p i { color:#9aa7a1; font-style:normal; font-weight:400; }
.person-viewer-path small { color:var(--muted); font-size:11px; line-height:1.55; }
.person-relations,.person-edit-entry,.person-stories,.identity-actions,.person-source-records { padding:22px; }
.person-stories-focus-header { display:none; margin:-4px 0 18px; }
.person-page.stories-focused > :not(.person-stories) { display:none !important; }
.person-page.stories-focused .person-stories { min-height:calc(100dvh - 92px); padding-top:18px; border-radius:0; }
.person-page.stories-focused .person-stories-focus-header { display:block; }
.identity-actions { margin:18px 20px 0; padding:18px; border-radius:18px; background:#edf5f0; }
.identity-actions-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; }
.identity-actions-heading > div { min-width:0; }
.identity-actions h2 { margin:0; font-size:18px; }
.identity-actions-heading p { margin:6px 0 0; color:var(--muted); font-size:11px; line-height:1.6; }
.identity-actions-heading > span {
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:999px;
  color:#39746b;
  background:rgba(255,255,255,.68);
  font-size:11px;
  font-weight:650;
}
.identity-invite-list {
  margin-top:14px;
  overflow:hidden;
  border:1px solid rgba(42,115,103,.11);
  border-radius:14px;
  background:rgba(255,255,255,.62);
}
.identity-invite-list article {
  display:grid;
  grid-template-columns:7px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  min-height:62px;
  padding:8px 9px 8px 13px;
}
.identity-invite-list article + article { border-top:1px solid rgba(42,115,103,.1); }
.identity-invite-list article > i {
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--family-color,#2d9587);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--family-color,#2d9587) 14%,transparent);
}
.identity-invite-list article > span { min-width:0; }
.identity-invite-list b,.identity-invite-list small { display:block; }
.identity-invite-list b {
  overflow:hidden;
  color:var(--deep);
  font-size:13px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.identity-invite-list small { margin-top:3px; color:var(--muted); font-size:11px; }
.identity-invite-button {
  min-width:82px;
  min-height:40px;
  padding:0 12px;
  border:0;
  border-radius:12px;
  color:white;
  background:#319486;
  box-shadow:0 5px 12px rgba(38,119,107,.13);
  font:inherit;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
}
.identity-invite-button:active { transform:scale(.97); }
.identity-actions details { margin-top:15px; padding-top:13px; border-top:1px solid rgba(33,105,91,.15); }
.identity-actions summary { color:var(--green); font-size:11px; cursor:pointer; }
.identity-actions form { margin-top:12px; }
.identity-actions form > small,.identity-actions .share-box p { display:block; margin-top:8px; color:var(--muted); font-size:11px; line-height:1.55; }
.person-relations h2 { margin:0 0 12px; font-size:17px; }
.person-edit-entry > small { display:block; margin-top:8px; color:var(--muted); font-size:11px; }
.person-source-records { border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.person-source-records > div:first-child { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:8px; }
.person-source-records > div:first-child span { font-size:17px; font-weight:650; }
.person-source-records > div:first-child small,.person-source-records > p { color:var(--muted); font-size:11px; line-height:1.6; }
.person-source-records article { display:grid; grid-template-columns:9px 1fr auto; min-height:56px; align-items:center; gap:10px; border-bottom:1px solid var(--line); }
.person-source-records article > i { width:9px; height:9px; border-radius:50%; background:var(--family-color); }
.person-source-records article b,.person-source-records article small { display:block; }
.person-source-records article b { font-size:13px; }
.person-source-records article small { margin-top:3px; color:var(--muted); font-size:11px; line-height:1.45; }
.person-source-records article .text-button { color:var(--green); font-size:11px; }
.person-source-records > p { margin:12px 0 0; }
.person-family-manager { margin:18px 20px 0; padding:17px; border:1px solid #dbe7e1; border-radius:16px; background:#f3f8f5; }
.person-family-manager > span { color:var(--deep); font-size:16px; font-weight:650; }
.person-family-manager > p { margin:7px 0 13px; color:var(--muted); font-size:11px; line-height:1.6; }
.person-family-manager > button { width:100%; min-height:44px; margin-top:7px; }
#personEditComposer form { margin-top:13px; padding:15px; border-radius:14px; background:#f4f3ed; }
#personEditComposer form p { color:var(--muted); font-size:11px; line-height:1.6; }
.gentle-check { display:flex; align-items:center; gap:8px; color:var(--muted); font-size:11px; }
.gentle-check input { width:auto; margin:0; }
.timeline-page { min-height:100vh; background:#f8f6ef; }
.timeline-page > header { padding:28px 24px 36px; color:white; background:linear-gradient(155deg,#695f52,#2f4f48); }
.timeline-page > header .text-button { color:rgba(255,255,255,.8); }
.timeline-page > header p { margin:28px 0 8px; color:#e5c985; font-size:11px; letter-spacing:.12em; }
.timeline-page > header h1 { font-size:34px; }
.timeline-page > header > span { display:block; margin-top:14px; color:rgba(255,255,255,.72); font-size:11px; }
.timeline-list { padding:24px 20px 50px; }
.timeline-event { display:grid; grid-template-columns:62px 1fr; gap:10px; position:relative; }
.timeline-event::before { content:""; position:absolute; top:30px; bottom:0; left:27px; width:1px; background:#d6d8d0; }
.timeline-event > aside { position:relative; z-index:1; padding-top:21px; text-align:center; background:#f8f6ef; }
.timeline-event > aside b,.timeline-event > aside span { display:block; }
.timeline-event > aside b { color:var(--green); font-family:Georgia,serif; font-size:20px; }
.timeline-event > aside span { color:var(--muted); font-size:11px; }
.timeline-event .story { padding-top:18px; }
.timeline-undated { margin-top:25px; padding-top:22px; border-top:1px solid var(--line); }
.timeline-undated h2 { margin:0; font-size:18px; }
.timeline-undated > p { color:var(--muted); font-size:11px; }
.empty-stories { padding:34px 0; color:var(--muted); text-align:center; line-height:1.7; }
.empty-stories > p { margin:0 0 18px; }
.empty-stories > .primary { width:min(100%,320px); }
.load-recovery { margin-top:6px; text-align:center; }
.load-recovery > span { display:grid; width:48px; height:48px; margin:2px auto 15px; place-items:center; border-radius:50%; color:var(--green); background:#e5f3ed; font-weight:700; }
.load-recovery h2 { margin:0; font-family:Georgia,"Songti SC",serif; font-size:23px; font-weight:500; line-height:1.45; }
.load-recovery p { margin:10px 0 18px; color:var(--muted); line-height:1.65; }
.switch-family { display:flex; gap:7px; overflow:auto; margin:0 -22px; padding:0 22px 14px; }
.switch-family button { flex:none; padding:8px 12px; border:1px solid var(--line); border-radius:999px; color:var(--muted); background:white; }
.switch-family button.active { border-color:var(--green); color:white; background:var(--green); }
#toast { position:fixed; left:50%; bottom:24px; z-index:300; transform:translateX(-50%) translateY(20px); max-width:calc(100% - 36px); padding:11px 16px; border-radius:999px; color:white; background:rgba(27,39,34,.92); opacity:0; pointer-events:none; transition:.2s; font-size:13px; }
#toast.show { transform:translateX(-50%) translateY(0); opacity:1; }
#connectivity { position:fixed; top:max(10px,env(safe-area-inset-top)); left:50%; z-index:30; width:max-content; max-width:calc(100% - 28px); padding:10px 15px; border:1px solid rgba(117,76,31,.18); border-radius:14px; color:#65451f; background:#fff4d9; box-shadow:0 7px 22px rgba(55,43,25,.16); transform:translateX(-50%); font-size:12px; line-height:1.45; text-align:center; }
#connectivity[hidden] { display:none; }
.consent-note,.consent-module { padding:14px; border:1px solid #ead9af; border-radius:16px; background:#fff8e8; }
.story-consent-status { display:grid; gap:5px; margin:20px 0 0; }
.story-consent-status b { color:var(--ink); font-size:14px; }
.story-consent-status p,.story-consent-status small { margin:0; line-height:1.55; }
.story-consent-status small { color:var(--muted); }
.story-consent-status.is-different { border-color:rgba(217,132,104,.25); background:rgba(255,244,237,.82); }
.consent-module { margin:18px 0; }
.consent-module article { display:grid; gap:6px; padding:14px 0; border-top:1px solid #ead9af; }
.consent-module article span { color:var(--muted); }
.consent-module article > .secondary { justify-self:start; margin-top:5px; }
.consent-audience { margin:22px 0; padding:16px; border-radius:15px; background:#fff3d8; }
.consent-audience p { margin:7px 0; color:var(--deep); font-size:15px; font-weight:650; }
.consent-audience small { color:var(--muted); font-size:11px; line-height:1.6; }
.consent-review-actions { display:grid; gap:6px; }
.purpose-list label { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:16px 0; border-top:1px solid var(--line); }
.my-families > button { display:grid; grid-template-columns:40px 1fr auto; align-items:center; gap:10px; width:100%; padding:12px 0; border:0; border-top:1px solid var(--line); color:inherit; background:transparent; text-align:left; }
.my-families > button > i { display:grid; width:38px; height:38px; place-items:center; border-radius:50%; color:white; background:#82928a; font-style:normal; }
.my-families > button.active > i { background:var(--green); }
.my-families b,.my-families small { display:block; }
.my-families small { margin-top:3px; color:var(--muted); font-size:11px; }
.my-families em { color:var(--green); font-size:11px; font-style:normal; }
.purpose-list label span { display:grid; gap:4px; }
.purpose-list input { width:24px; height:24px; }
[data-selected-viewers][hidden] { display:none; }
.pilot-progress { margin:0 0 18px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.pilot-progress > summary { display:flex; justify-content:space-between; padding:12px 15px; color:var(--muted); cursor:pointer; list-style:none; font-size:12px; }
.pilot-progress > summary::-webkit-details-marker { display:none; }
.pilot-progress > summary b { color:var(--green); }
.pilot-progress > div { padding:0 15px 14px; border-top:1px solid var(--line); }
.pilot-progress p { display:flex; gap:9px; margin:7px 0; color:var(--muted); font-size:12px; }
.pilot-progress p i { width:18px; color:#a5aaa7; font-style:normal; text-align:center; }
.pilot-progress p.done { color:var(--ink); }
.pilot-progress p.done i,.pilot-progress.complete > div b { color:var(--green); }
.story-options,.family-tools { margin:14px 0; border:1px solid var(--line); border-radius:15px; background:#fafbf9; }
.story-options > summary,.family-tools > summary { padding:14px; color:var(--green); cursor:pointer; list-style:none; }
.story-options > summary::-webkit-details-marker,.family-tools > summary::-webkit-details-marker,.family-more > summary::-webkit-details-marker { display:none; }
.story-options > summary::after,.family-tools > summary::after,.family-more > summary::after { content:"＋"; float:right; font-weight:400; }
.story-options[open] > summary::after,.family-tools[open] > summary::after,.family-more[open] > summary::after { content:"－"; }
.story-options > :not(summary) { margin:0 14px 14px; }
.family-tools { margin-top:22px; background:white; }
.family-tools > summary { display:grid; gap:2px; color:var(--ink); }
.family-tools > summary span { color:var(--muted); font-size:11px; font-weight:400; }
.family-tools > div > section { margin:0; border:0; border-top:1px solid var(--line); border-radius:0; box-shadow:none; }
.family-more { position:relative; }
.family-more > summary { padding:8px 4px; color:var(--green); cursor:pointer; list-style:none; font-size:12px; }
.family-more > div { position:absolute; right:0; z-index:5; display:grid; min-width:130px; padding:7px; border:1px solid var(--line); border-radius:12px; background:white; box-shadow:0 12px 28px rgba(32,49,41,.14); }
.family-more > div button { min-height:44px; text-align:left; white-space:nowrap; }
.family-invite-picker {
  margin-top:14px;
  padding:16px 0 0;
  border-top:1px solid rgba(31,75,67,.1);
}
.family-invite-picker > header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.family-invite-picker > header span { color:var(--muted); font-size:11px; letter-spacing:.08em; }
.family-invite-picker > header h3 { margin:4px 0 0; color:var(--deep); font-family:Georgia,"Songti SC",serif; font-size:20px; font-weight:500; }
.family-invite-picker > header button {
  width:36px;
  min-width:36px;
  height:36px;
  padding:0;
  border:0;
  border-radius:50%;
  color:#73817b;
  background:#edf2ef;
  font-size:22px;
  font-weight:300;
}
.family-invite-picker > div { display:grid; gap:8px; margin-top:14px; }
.family-invite-picker > div > button {
  position:relative;
  overflow:hidden;
  width:100%;
  min-height:62px;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:12px;
  padding:11px 13px 11px 17px;
  border:1px solid rgba(31,75,67,.11);
  border-radius:14px;
  color:var(--deep);
  background:#fff;
  text-align:left;
  box-shadow:none;
}
.family-invite-picker > div > button::before {
  content:"";
  position:absolute;
  top:16px;
  bottom:16px;
  left:0;
  width:3px;
  border-radius:0 999px 999px 0;
  background:color-mix(in srgb,var(--family-color) 58%,white);
}
.family-invite-picker > div > button:active { background:#edf6f2; transform:scale(.99); }
.family-invite-picker > div > button span { min-width:0; }
.family-invite-picker > div > button b { display:block; overflow:hidden; font-size:15px; text-overflow:ellipsis; white-space:nowrap; }
.family-invite-picker > div > button small { display:block; margin-top:3px; color:var(--muted); font-size:11px; font-weight:400; }
.family-invite-picker > div > button em { color:var(--green); font-size:18px; font-style:normal; }
.family-invite-picker > p { margin:12px 2px 0; color:var(--muted); font-size:11px; line-height:1.55; }
.first-light { min-height:100vh; padding:30px 22px max(32px,env(safe-area-inset-bottom)); background:linear-gradient(165deg,#f8f6ef 0%,#eef6f2 100%); }
.first-light.intro { display:flex; flex-direction:column; }
.first-light.intro .brand { margin-bottom:auto; }
.first-light .brand-sign span { color:var(--deep); }
.first-light.intro > div:nth-child(2) { margin:60px 0 34px; }
.first-light h1 { margin:10px 0 16px; font-family:Georgia,"Songti SC",serif; font-size:34px; font-weight:500; line-height:1.35; letter-spacing:-.5px; }
.first-light > p,.first-light.intro > div p:last-child { color:var(--muted); line-height:1.75; }
.first-light > .primary,.first-light form > .primary { width:100%; margin-top:18px; }
.first-light > .text-button { min-width:44px; min-height:44px; align-self:center; margin-top:12px; }
.first-light form { margin-top:30px; }
.first-light textarea { min-height:180px; font-size:17px; line-height:1.7; }
.person-choice-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-bottom:24px; }
.person-choice-grid label { position:relative; }
.person-choice-grid input { position:absolute; opacity:0; pointer-events:none; }
.person-choice-grid span { display:grid; min-height:58px; place-items:center; border:1px solid var(--line); border-radius:15px; background:white; }
.person-choice-grid input:checked + span { border-color:var(--green); color:var(--green); background:#eaf5f1; box-shadow:0 0 0 1px var(--green); }
.story-preview-copy > p { margin:0; }
.story-preview.story-unread { border-color:#b8d9d1; box-shadow:0 9px 28px rgba(28,128,116,.09); }
.story-gift-label { display:inline-flex; margin:0 0 12px; padding:5px 9px; border-radius:999px; color:var(--green); background:var(--mint); font-size:11px; font-weight:700; }
.story-read-button { width:100%; margin-top:12px; padding:10px; border:0; border-top:1px solid var(--line); color:var(--green); background:transparent; font-weight:650; }
.reading-top { padding:16px 20px; border-bottom:1px solid var(--line); background:#f8f6ef; }
.reading-page { min-height:calc(100vh - 55px); padding:0 0 60px; background:#f8f6ef; }
.story-reading { padding:0 22px; }
.story-reading > .story-media { margin:0 -22px 28px; border-radius:0; }
.story-reading > header > p { margin:0 0 7px; color:var(--green); font-size:12px; }
.story-reading > header h1 { margin:0 0 15px; font-family:Georgia,"Songti SC",serif; font-size:34px; font-weight:500; line-height:1.3; }
.story-reading-text { margin:25px 0; font-family:Georgia,"Songti SC",serif; font-size:19px; line-height:1.9; }
.story-reading-actions { display:grid; gap:10px; margin:24px 0; }
.story-reading-actions > span { color:var(--muted); font-size:12px; text-align:center; }
.story-reading-actions:has(.story-inline-edit) { grid-template-columns:minmax(0,1fr) auto; align-items:center; }
.story-reading-actions .story-confirm-sharing { grid-column:1/-1; }
.story-reading-actions:has(.story-inline-edit) > .secondary { grid-column:1/-1; }
.story-reading-actions .story-inline-edit { display:grid; width:44px; min-width:44px; height:44px; min-height:44px; padding:0; place-items:center; border:1px solid rgba(43,110,97,.2); border-radius:50%; color:var(--green); background:#f5faf7; }
.story-inline-edit svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.story-records,.story-owner-tools { margin-top:14px; border:1px solid var(--line); border-radius:15px; background:white; }
.story-records > summary,.story-owner-tools > summary { padding:14px; color:var(--green); cursor:pointer; list-style:none; }
.story-records > summary::-webkit-details-marker,.story-owner-tools > summary::-webkit-details-marker { display:none; }
.story-records > section { padding:0 14px 14px; border-top:1px solid var(--line); }
.story-records blockquote { margin:10px 0; padding:12px; border-left:3px solid #b7d6cf; background:#f2f7f5; }
.story-records p { color:var(--muted); font-size:12px; }
.asset-source-explainer { margin:5px 0 10px; color:var(--muted); font-size:12px; line-height:1.6; }
.asset-source-list { margin:9px 0 17px; border-top:1px solid var(--line); }
.asset-source-list article { border-bottom:1px solid var(--line); }
.asset-source-list p { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:3px 10px; margin:0; padding:10px 0; }
.asset-source-list p span { color:var(--green); font-size:11px; }
.asset-source-list p strong { color:var(--ink); font-size:12px; }
.asset-source-list p small { grid-column:2; color:var(--muted); }
.asset-source-list p button { grid-column:3; grid-row:1/4; align-self:center; min-width:44px; min-height:40px; padding:7px 9px; border:0; color:var(--green); background:transparent; font-size:12px; font-weight:700; }
.asset-source-form { margin:0 0 12px; padding:13px; border-radius:13px; background:#f4f8f5; }
.asset-source-form > div { display:flex; gap:8px; }
.asset-source-form > div .primary { flex:1; }
.story-owner-tools > div { display:grid; gap:4px; padding:8px; border-top:1px solid var(--line); }
.story-owner-tools button { min-height:44px; padding:11px; border:0; color:var(--green); background:transparent; text-align:left; }
.story-owner-tools .story-withdraw-slot:empty { display:none; }
.story-withdraw-confirm {
  display:grid;
  gap:8px;
  margin:3px 4px 5px;
  padding:15px;
  border:1px solid rgba(174,91,74,.2);
  border-radius:15px;
  background:#fff3ed;
}
.story-withdraw-confirm b { color:#824a40; font-size:14px; }
.story-withdraw-confirm p { margin:0; color:#785e57; font-size:12px; line-height:1.65; }
.story-withdraw-confirm > div { display:flex; flex-wrap:wrap; gap:8px; margin-top:2px; }
.story-owner-tools .story-withdraw-confirm button {
  min-height:42px;
  padding:9px 13px;
  border-radius:999px;
  font-size:12px;
  font-weight:720;
  text-align:center;
}
.story-owner-tools .story-withdraw-confirm [data-confirm-withdraw-story] { color:white; background:#a65f52; }
.story-owner-tools .story-withdraw-confirm [data-cancel-withdraw-story] { color:#755f59; background:rgba(255,255,255,.72); }
.story-poster-composer {
  margin:18px 0 4px;
  padding:20px;
  border:1px solid rgba(47,138,127,.16);
  border-radius:24px 8px 24px 8px;
  background:
    radial-gradient(circle at 92% 4%,rgba(243,197,87,.2),transparent 180px),
    linear-gradient(155deg,#fffaf0,#edf6ef);
  box-shadow:0 15px 34px rgba(62,83,71,.09);
}
.story-poster-composer > span { color:#a16f38; font-size:11px; font-weight:760; letter-spacing:.08em; }
.story-poster-composer h3 { margin:7px 0 6px; color:#254d44; font-size:23px; line-height:1.35; }
.story-poster-composer > p { margin:0 0 16px; color:#6e7c75; font-size:12px; line-height:1.65; }
.story-poster-composer textarea { min-height:94px; color:#284c44; font:500 17px/1.75 "Songti SC","STSong",serif; background:rgba(255,253,248,.9); }
.story-poster-composer > details { margin-top:10px; }
.story-poster-composer > details > summary { min-height:44px; padding:12px 2px; color:#60756d; font-size:12px; cursor:pointer; }
.story-poster-result { margin-top:18px; padding-top:18px; border-top:1px solid rgba(47,91,80,.13); }
.story-poster-result > img { display:block; width:100%; border-radius:16px; background:#f2ecdf; box-shadow:0 12px 30px rgba(48,62,54,.16); }
.story-poster-result > p { color:#6c7972; font-size:11px; line-height:1.6; text-align:center; }
.story-poster-result > div { display:block; }
.story-poster-result .primary,.story-poster-result .secondary { width:100%; min-height:48px; }
.family-poster-sheet {
  position:relative;
  display:grid;
  gap:13px;
}
.tab-home #shareBox .family-poster-sheet {
  margin-top:8px;
  padding:20px;
  border:1px solid rgba(47,138,127,.15);
  border-radius:24px 8px 24px 8px;
  background:
    radial-gradient(circle at 96% 2%,rgba(244,193,73,.22),transparent 210px),
    linear-gradient(155deg,#fffaf0,#edf7f1);
  box-shadow:0 14px 34px rgba(53,78,67,.09);
}
.family-poster-sheet.invitation textarea {
  color:#28564d;
  background:rgba(255,253,247,.92);
  font-size:17px;
}
.family-poster-sheet header > span { color:#a16f38; font-size:11px; font-weight:760; letter-spacing:.08em; }
.family-poster-sheet header { padding-right:44px; }
.family-poster-sheet header h3 { margin:5px 0; color:#254d44; font-size:23px; line-height:1.35; }
.family-poster-sheet header p { margin:0; color:#6e7c75; font-size:12px; line-height:1.65; }
.family-poster-sheet textarea { min-height:86px; font:500 16px/1.7 "Songti SC","STSong",serif; }
.family-poster-sheet fieldset { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:0; padding:13px; border:1px solid rgba(47,91,80,.13); border-radius:15px; }
.family-poster-sheet fieldset legend { padding:0 5px; color:#576e66; font-size:12px; font-weight:700; }
.family-poster-sheet fieldset label { display:flex; min-height:42px; align-items:center; gap:8px; margin:0; padding:8px 9px; border-radius:12px; background:#f1f7f2; }
.family-poster-sheet fieldset input { width:20px; height:20px; margin:0; accent-color:#2f8a7f; }
.family-poster-sheet fieldset small { grid-column:1/-1; color:#77847e; font-size:11px; line-height:1.55; }
.family-poster-sheet .family-poster-families { grid-template-columns:1fr; }
.family-poster-families > div { display:grid; gap:8px; }
.family-poster-sheet .family-poster-families > div > label {
  position:relative;
  display:grid;
  grid-template-columns:24px minmax(0,1fr);
  gap:10px;
  min-height:60px;
  padding:11px 34px 11px 12px;
  border:1px solid rgba(47,91,80,.1);
  background:rgba(255,255,255,.74);
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.family-poster-families > div > label > input {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.family-poster-families > div > label > i {
  display:grid;
  width:24px;
  height:24px;
  place-items:center;
  border:1.5px solid #b6c8c1;
  border-radius:8px;
  background:white;
  font-style:normal;
}
.family-poster-families > div > label > i::after { content:"✓"; color:transparent; font-size:15px; font-weight:800; }
.family-poster-families > div > label > input:checked + i { border-color:#2b8e7f; background:#2b8e7f; box-shadow:0 3px 9px rgba(43,142,127,.2); }
.family-poster-families > div > label > input:checked + i::after { color:white; }
.family-poster-families > div > label::after {
  content:"";
  position:absolute;
  top:50%;
  right:14px;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--family-color);
  transform:translateY(-50%);
}
.family-poster-families > div > label:has(input:checked) { border-color:color-mix(in srgb,var(--family-color) 42%,#dce5df); background:#f2f8f5; box-shadow:inset 3px 0 0 var(--family-color); }
.family-poster-families > div > label:has(input:focus-visible) { outline:3px solid rgba(43,142,127,.16); outline-offset:2px; }
.family-poster-families > div > label > span { display:grid; gap:3px; min-width:0; }
.family-poster-families > div > label > span b { color:#294b43; font-size:14px; }
.family-poster-families > div > label > span small { color:#7a8982; font-size:11px; line-height:1.4; }
.family-poster-result { margin-top:5px; padding-top:16px; border-top:1px solid rgba(47,91,80,.13); }
.family-poster-result > img { display:block; width:100%; border-radius:15px; box-shadow:0 12px 28px rgba(46,66,56,.16); }
.family-poster-result > p { color:#6c7972; font-size:11px; line-height:1.6; text-align:center; }
.family-poster-result > div { display:block; }
.family-poster-result .primary,.family-poster-result .secondary { width:100%; min-height:48px; }
.poster-share-action > .primary { width:100%; min-height:50px; }
.poster-share-action > details { margin-top:7px; text-align:center; }
.poster-share-action > details > summary { display:inline-grid; min-height:36px; padding:0 10px; place-items:center; color:#7d8984; font-size:11px; cursor:pointer; list-style:none; }
.poster-share-action > details > summary::-webkit-details-marker { display:none; }
.poster-share-action > details > .text-button { min-height:40px; color:#527068; font-size:12px; }
.family-poster-result > .family-poster-actions {
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:10px;
  align-items:stretch;
}
.share-revoke { margin-top:8px; text-align:center; }
.share-revoke > summary { display:inline-grid; min-height:36px; padding:0 10px; place-items:center; color:#7d8984; font-size:11px; cursor:pointer; list-style:none; }
.share-revoke > summary::-webkit-details-marker { display:none; }
.share-revoke > button { display:block; min-height:38px; margin:0 auto; }
.share-revoke > small { display:block; color:#87918d; font-size:11px; line-height:1.5; }
.share-ended { margin:0; padding:18px; border-radius:14px; color:#5d7069; background:#f2f6f2; text-align:center; }
.family-poster-actions > .family-poster-share-primary,
.family-poster-actions > .family-poster-save-secondary {
  display:flex;
  width:100%;
  min-width:0;
  min-height:52px;
  align-items:center;
  justify-content:center;
  gap:7px;
  margin:0;
  padding:11px 13px;
  border-radius:15px;
  font-size:13px;
  font-weight:800;
  line-height:1.2;
}
.family-poster-actions > .family-poster-share-primary {
  border:1px solid #287f73;
  color:white;
  background:linear-gradient(145deg,#3ba093,#287f73);
  box-shadow:0 10px 22px rgba(40,127,115,.22);
}
.family-poster-actions > .family-poster-save-secondary {
  border:1px solid rgba(202,147,66,.3);
  color:#94642b;
  background:linear-gradient(145deg,#fff8e8,#f9e9c9);
  box-shadow:0 7px 16px rgba(151,105,43,.1);
}
.family-poster-actions button svg {
  flex:none;
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.family-poster-actions > .family-poster-share-primary:active { transform:translateY(1px); box-shadow:0 5px 12px rgba(40,127,115,.18); }
.family-poster-actions > .family-poster-save-secondary:active { background:#f6e5c5; }
.image-save-guide {
  position:fixed;
  z-index:140;
  inset:0;
  display:grid;
  padding:max(18px,env(safe-area-inset-top)) 14px max(18px,env(safe-area-inset-bottom));
  place-items:center;
  overflow:auto;
  background:rgba(20,37,33,.68);
  opacity:0;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
  transition:opacity .18s ease;
}
.image-save-guide.show { opacity:1; }
.image-save-guide-open { overflow:hidden; }
.image-save-guide-card {
  width:min(100%,430px);
  max-height:calc(100dvh - 36px);
  padding:12px;
  overflow:auto;
  border:1px solid rgba(255,255,255,.72);
  border-radius:24px;
  background:#fffaf0;
  box-shadow:0 24px 70px rgba(13,37,31,.3);
}
.image-save-guide-card > header {
  display:flex;
  min-height:58px;
  padding:3px 3px 11px 8px;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.image-save-guide-card > header > div { display:grid; gap:3px; }
.image-save-guide-card > header b { color:#234e46; font-size:18px; }
.image-save-guide-card > header span { color:#728078; font-size:12px; }
.image-save-guide-card > header button {
  flex:none;
  width:42px;
  min-width:42px;
  height:42px;
  min-height:42px;
  padding:0;
  border:1px solid rgba(45,91,80,.12);
  border-radius:50%;
  color:#49665e;
  background:#fff;
  font-size:27px;
  font-weight:300;
  line-height:1;
  box-shadow:0 5px 14px rgba(35,70,61,.1);
}
.image-save-guide-card > img {
  display:block;
  width:100%;
  height:auto;
  border-radius:15px;
  box-shadow:0 8px 22px rgba(38,67,59,.12);
  -webkit-touch-callout:default;
  user-select:auto;
  -webkit-user-select:auto;
}
.image-save-guide-card > p {
  margin:11px 7px 3px;
  color:#6c7972;
  font-size:12px;
  line-height:1.55;
  text-align:center;
}
@media (max-width:340px) {
  .family-poster-result > .family-poster-actions { gap:8px; }
  .family-poster-actions > .family-poster-share-primary,
  .family-poster-actions > .family-poster-save-secondary { padding-right:9px; padding-left:9px; font-size:12px; }
}

/* V39 — inviting is one clear action; the family tree is the invitation carrier. */
.family-invite-picker > header {
  align-items:center;
}
.family-invite-picker > header h3 {
  margin:0;
  font-size:22px;
  line-height:1.35;
}
.family-invite-picker > div > button {
  min-height:58px;
  grid-template-columns:minmax(0,1fr) auto;
  padding:12px 14px 12px 18px;
}
.family-invite-picker > div > button b {
  font-size:16px;
}
.family-invite-picker > p {
  margin-top:14px;
  color:#64766f;
  font-size:13px;
  text-align:center;
}
.tab-home #shareBox .invite-simple-sheet {
  gap:12px;
  padding:22px 18px 18px;
  border-radius:22px;
  background:
    radial-gradient(circle at 98% 0,rgba(249,195,96,.2),transparent 170px),
    linear-gradient(155deg,#fffaf1,#edf7f2);
}
.invite-simple-sheet > header {
  padding:0 44px 2px 0;
}
.invite-simple-sheet > input[name="familyIds"] {
  display:none !important;
}
.invite-simple-sheet > header h3 {
  margin:0;
  font-size:24px;
  line-height:1.4;
}
.invite-poster-explainer {
  display:grid;
  grid-template-columns:76px minmax(0,1fr);
  align-items:center;
  gap:14px;
  padding:16px;
  border:1px solid rgba(47,138,127,.13);
  border-radius:18px;
  background:rgba(255,255,255,.74);
}
.invite-poster-explainer > span {
  display:grid;
  width:72px;
  height:72px;
  place-items:center;
  border-radius:20px;
  color:#2d8d81;
  background:linear-gradient(145deg,#d9f2ea,#fff0cf);
}
.invite-poster-explainer svg {
  width:60px;
  height:54px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.invite-poster-explainer svg path:last-child {
  fill:currentColor;
  stroke:none;
}
.invite-poster-explainer b {
  color:#274d44;
  font-size:17px;
}
.invite-poster-explainer p {
  margin:5px 0 0;
  color:#65766f;
  font-size:14px;
  line-height:1.55;
}
.invite-simple-sheet .invite-generate-primary {
  width:100%;
  min-height:52px;
  margin-top:4px;
  font-size:16px;
}
.family-poster-is-dirty [data-family-poster-status] { color:#9b6840; font-weight:650; }
.invite-approval-note {
  margin:0;
  color:#667870;
  font-size:13px;
  text-align:center;
}
.invite-customize {
  border-top:1px solid rgba(47,91,80,.12);
}
.invite-customize > summary {
  min-height:46px;
  padding:14px 2px 10px;
  color:#416f65;
  font-size:14px;
  font-weight:650;
  cursor:pointer;
  list-style:none;
}
.invite-customize > summary::-webkit-details-marker { display:none; }
.invite-customize > summary::after {
  content:"＋";
  float:right;
  font-weight:400;
}
.invite-customize[open] > summary::after { content:"－"; }
.invite-customize > div {
  display:grid;
  gap:12px;
  padding-top:5px;
}
.invite-customize > div > label > span {
  display:block;
  margin-bottom:7px;
  color:#4c655d;
  font-size:14px;
  font-weight:650;
}
.invite-simple-sheet .invite-customize textarea {
  min-height:92px;
  font-size:16px;
}
.invite-simple-sheet .invite-customize fieldset {
  border:0;
  padding:0;
}
.invite-customize > div > small {
  color:#718079;
  font-size:12px;
  line-height:1.5;
}
.asset-provenance label { margin:0 0 10px; }
.asset-provenance label:last-child { margin-bottom:0; }
.deceased-governance { margin:18px 20px; padding:18px; border:1px solid #e5d9c4; border-radius:18px; background:#fffaf0; }
.deceased-governance > span { color:#8a6847; font-size:11px; font-weight:700; letter-spacing:.1em; }
.deceased-governance h2 { margin:6px 0; font-family:Georgia,"Songti SC",serif; font-size:21px; font-weight:500; }
.deceased-governance p { color:var(--muted); font-size:12px; line-height:1.7; }
.deceased-governance form { margin-top:13px; padding-top:13px; border-top:1px solid #eadfcf; }
.personal-activity > div > p { display:flex; gap:11px; margin:0; padding:12px 0; border-top:1px solid var(--line); }
.personal-activity > div > p i { width:8px; height:8px; margin-top:5px; border-radius:50%; background:#9bc6bc; }
.personal-activity > div > p span { display:grid; gap:3px; }
.personal-activity > div > p b { font-size:12px; }
.personal-activity > div > p small { color:var(--muted); font-size:11px; }
.contribution-manager > .section-title { align-items:flex-start; }
.contribution-manager > .section-title p { margin:5px 0 0; color:var(--muted); font-size:11px; }
.contribution-manager > .section-title > .text-button { min-width:44px; min-height:44px; margin-top:-6px; }
.contribution-group { border-top:1px solid var(--line); }
.contribution-group > summary { display:flex; justify-content:space-between; padding:14px 0; cursor:pointer; list-style:none; }
.contribution-group > summary::-webkit-details-marker { display:none; }
.contribution-group > summary span { color:var(--muted); font-size:11px; }
.contribution-group article { display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px; padding:11px 0; border-top:1px solid #edf0ec; }
.contribution-main { display:grid; gap:4px; min-width:0; padding:0; border:0; color:var(--ink); background:transparent; text-align:left; }
.contribution-main b { overflow:hidden; font-size:13px; font-weight:600; text-overflow:ellipsis; white-space:nowrap; }
.contribution-main small { color:var(--muted); font-size:11px; }
.contribution-main:disabled { opacity:1; }
.contribution-group article > .danger-text { min-width:44px; min-height:44px; margin:-7px; padding:7px; border:0; color:#a34f47; background:transparent; font-size:11px; }
.delete-preview-slot { padding-bottom:6px; }
.delete-preview { margin-top:14px; padding:17px; border:1px solid #e3c9c2; border-radius:16px; background:#fff6f3; }
.delete-preview > span { color:#a34f47; font-size:11px; font-weight:700; letter-spacing:.08em; }
.delete-preview h3 { margin:6px 0; font-family:Georgia,"Songti SC",serif; font-size:19px; font-weight:500; }
.delete-preview p { color:#634f4b; font-size:12px; line-height:1.65; }
.delete-preview small { color:var(--muted); font-size:11px; }
.delete-preview > div { display:flex; align-items:center; gap:10px; margin-top:13px; }
.delete-preview .danger,.delete-preview .text-button { min-height:44px; }
.delete-preview .danger { padding:10px 14px; border:0; border-radius:12px; color:white; background:#a34f47; }
.family-hub > header { display:grid; grid-template-columns:46px 1fr; gap:13px; align-items:center; }
.family-hub > header > i { display:grid; width:46px; height:46px; place-items:center; border-radius:50%; color:white; background:linear-gradient(145deg,var(--green),#3aa99b); font-family:Georgia,"Songti SC",serif; font-size:20px; font-style:normal; }
.family-hub > header span,.family-bridges > span,.family-shared-people > span,.identity-opportunity-list > span,.identity-claim-inbox > span { color:#8a7560; font-size:11px; font-weight:700; letter-spacing:.08em; }
.family-hub > header h2 { margin:3px 0; font-family:Georgia,"Songti SC",serif; font-size:21px; font-weight:500; }
.identity-opportunity-list,.identity-claim-inbox { margin:18px -2px 0; padding:15px; border-radius:16px; background:#edf6f2; }
.identity-claim-inbox { background:#f7f2e8; }
.family-join-inbox { margin:18px -2px 0; padding:15px; border-radius:16px; background:#fff1dc; }
.family-join-inbox > span { color:#8a653f; font-size:11px; font-weight:700; letter-spacing:.08em; }
.family-join-inbox > p { margin:5px 0 10px; color:var(--muted); font-size:11px; line-height:1.55; }
.family-join-inbox article { padding:12px 0; border-top:1px solid rgba(138,101,63,.15); }
.family-join-inbox article b,.family-join-inbox article small { display:block; }
.family-join-inbox article small { margin-top:4px; color:var(--muted); font-size:11px; line-height:1.55; }
.family-join-inbox footer { display:flex; gap:8px; margin-top:10px; }
.family-join-inbox footer button { min-height:40px; }
.family-join-person-choice {
  display:grid;
  gap:8px;
  margin:12px 0 4px;
  padding:12px;
  border:1px solid rgba(138,101,63,.14);
  border-radius:15px;
  background:rgba(255,255,255,.58);
}
.family-join-person-choice legend {
  padding:0 5px;
  color:#76573c;
  font-size:12px;
  font-weight:750;
}
.family-join-person-choice > p {
  margin:0 0 2px;
  color:#7a817d;
  font-size:11px;
  line-height:1.5;
}
.family-join-person-choice label {
  display:flex;
  min-height:52px;
  align-items:center;
  gap:10px;
  margin:0;
  padding:9px 10px;
  border:1px solid rgba(73,105,94,.11);
  border-radius:13px;
  background:rgba(255,255,255,.72);
}
.family-join-person-choice input[type="radio"] {
  -webkit-appearance:none;
  appearance:none;
  display:block;
  align-self:center;
  flex:0 0 22px !important;
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  min-height:22px !important;
  max-width:22px !important;
  max-height:22px !important;
  inline-size:22px !important;
  block-size:22px !important;
  aspect-ratio:1;
  margin:0 !important;
  padding:0 !important;
  box-sizing:border-box;
  border:1.5px solid #acc1b9;
  border-radius:50%;
  background:#fff;
}
.family-join-person-choice input[type="radio"]:checked {
  border:6px solid #2f8d7f;
}
.family-join-person-choice label:has(input:checked) {
  border-color:rgba(47,141,127,.32);
  background:#eff8f4;
}
.family-join-person-choice label > span {
  display:grid;
  min-width:0;
  gap:2px;
}
.family-join-person-choice label > span b { color:#405c54; font-size:12px; }
.family-join-person-choice label > span small { margin:0; }
.identity-opportunity-list > p,.identity-claim-inbox > p { margin:5px 0 10px; color:var(--muted); font-size:11px; line-height:1.55; }
.identity-opportunity-list article { display:grid; grid-template-columns:38px minmax(0,1fr) auto; align-items:center; gap:9px; padding:11px 0; border-top:1px solid rgba(33,105,91,.12); }
.identity-opportunity-list article > i { display:grid; width:38px; height:38px; place-items:center; border-radius:50%; color:white; background:var(--green); font-style:normal; font-weight:700; }
.identity-opportunity-list article div,.identity-claim-inbox article > div { display:grid; min-width:0; gap:3px; }
.identity-opportunity-list article b,.identity-claim-inbox article b { font-size:12px; }
.identity-opportunity-list article small,.identity-claim-inbox article small { color:var(--muted); font-size:11px; line-height:1.45; }
.identity-opportunity-list article > em { color:var(--muted); font-size:11px; font-style:normal; }
.identity-opportunity-list article > button { min-height:40px; padding:8px 10px; white-space:nowrap; }
.identity-claim-inbox article { padding:12px 0; border-top:1px solid rgba(138,117,96,.15); }
.identity-claim-inbox footer { display:flex; gap:7px; margin-top:9px; }
.identity-claim-inbox footer button { min-height:40px; }
.family-hub-list { margin-top:18px; border-top:1px solid var(--line); }
.family-hub-list > article { display:grid; min-height:62px; align-content:center; gap:5px; padding:13px 4px; border-bottom:1px solid var(--line); color:var(--ink); }
.family-hub-list > article b { font-size:13px; }
.family-list-dot { display:inline-block; width:9px; height:9px; margin-right:7px; border-radius:50%; }
.family-hub-list > article small { overflow:hidden; color:var(--muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.family-archive-button {
  width:max-content;
  min-height:40px;
  margin-left:-8px;
  padding:8px;
  border:0;
  color:var(--green);
  background:transparent;
  text-align:left;
  font-size:11px;
  font-weight:700;
}
.family-archive-slot:empty { display:none; }
.family-archive-slot .export-box { margin:4px 0 8px; padding:14px; border-radius:14px; background:#f2f7f4; }
.family-archive-slot .export-box p,.family-archive-slot .export-box small { white-space:normal; }
.family-member-manager { margin-top:7px; padding-top:7px; border-top:1px solid var(--line); }
.family-member-manager summary { color:var(--green); font-size:11px; cursor:pointer; }
.family-member-state { margin-top:12px; }
.family-member-state > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 0 5px; }
.family-member-state > header b { font-size:12px; }
.family-member-state > header small { color:var(--muted); font-size:11px; }
.family-member-pending { padding-top:10px; border-top:1px solid rgba(27,91,80,.08); }
.family-member-manager article { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid rgba(27,91,80,.08); }
.family-member-manager article > span { display:grid; gap:2px; min-width:72px; }
.family-member-manager article > span b { font-size:13px; }
.family-member-manager article > span small { color:var(--muted); font-size:11px; }
.family-member-manager article > div { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:2px 8px; }
.family-member-manager article button { min-height:36px; padding:4px 2px; font-size:11px; }
.family-member-manager .danger-text { min-width:72px; min-height:40px; }
.family-member-manager > small { display:block; white-space:normal !important; line-height:1.55; }
.family-unregistered-people { margin:10px 0; padding-top:9px; border-top:1px solid rgba(27,91,80,.08); }
.family-unregistered-people > summary { display:flex; align-items:center; justify-content:space-between; min-height:38px; color:var(--ink); font-size:12px; font-weight:700; list-style:none; }
.family-unregistered-people > summary small { color:var(--muted); font-weight:500; }
.family-member-manager [data-family-invite-output]:empty { display:none; }
.family-member-manager [data-family-invite-output] { margin:8px 0; }
.family-create-button,.family-connect-button { width:100%; min-height:48px; padding:12px 4px; border:0; color:var(--green); background:transparent; text-align:left; font-size:12px; font-weight:700; }
.family-create-button { margin-top:4px; }
.profile-support { margin:8px 0 28px; padding-top:8px; border-top:1px solid var(--line); }
.profile-support > .text-button { min-height:44px; padding:8px 2px; color:var(--muted); }
.profile-support form { margin-top:10px; padding:18px; border-radius:16px; background:#f2f7f4; }
.family-create-guidance { display:block; padding:0 4px 12px; border-bottom:1px solid var(--line); color:var(--muted); font-size:11px; line-height:1.55; }
.family-connect-button { border-bottom:1px solid var(--line); }
#newFamilyComposer form { margin:10px 0 14px; padding:16px; border-radius:14px; background:#f5f1e8; }
#newFamilyComposer form h3 { margin:0 0 6px; font-size:16px; }
#newFamilyComposer form p { margin:0 0 14px; color:var(--muted); font-size:11px; line-height:1.6; }
#newFamilyComposer form > div { display:flex; gap:8px; }
#newFamilyComposer .primary { width:auto; padding:10px 14px; }
.family-bridges,.family-shared-people { margin-top:18px; padding-left:12px; border-left:2px solid #b9d8cf; }
.family-bridge-group { margin-top:12px; padding:13px 14px 2px; border-radius:15px; background:#f1f7f4; }
.family-bridge-group > header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid #dce9e4; }
.family-bridge-group > header b { min-width:0; font-size:13px; overflow-wrap:anywhere; }
.family-bridge-group > header small { width:min(42%,132px); flex:none; color:var(--muted); font-size:11px; line-height:1.45; text-align:right; }
.family-bridges p,.family-shared-people p { display:grid; gap:3px; margin:10px 0 0; }
.family-bridge-group > p + p { padding-top:10px; border-top:1px solid #dce9e4; }
.family-bridges b,.family-shared-people b { font-size:13px; }
.family-bridges small,.family-shared-people small { color:var(--muted); font-size:11px; }
.family-bridges button,.family-shared-people button { justify-self:start; min-height:44px; margin-left:-6px; color:var(--green); font-size:11px; font-weight:700; }
.family-identity-group { margin-top:12px; padding:14px; border-radius:15px; background:#f1f7f4; }
.family-identity-group > header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:10px; border-bottom:1px solid #dce9e4; }
.family-identity-group > header b { min-width:0; overflow-wrap:anywhere; }
.family-identity-group > header small { width:min(42%,132px); flex:none; line-height:1.45; text-align:right; }
.family-identity-group > div p { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; margin:0; padding:9px 0; border-bottom:1px solid #dce9e4; }
.family-identity-group > div p span { overflow:hidden; color:var(--muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.family-identity-group > div p b { font-size:12px; }
.family-identity-group > small { display:block; margin-top:10px; line-height:1.55; }

/* Mobile visual rhythm: fewer boxes, four clear type levels, generous touch targets. */
body { font-size:14px; }
.content { padding:20px 20px 28px; }
.top { padding:0 20px 24px; }
.top nav { margin:0 -20px 24px; padding:10px 18px; }
.top h1 { font-size:32px; line-height:1.22; }
.top p { font-size:11px; }
input,textarea,select { min-height:46px; border-radius:14px; font-size:14px; }
textarea { min-height:132px; }
.primary { min-height:48px; border-radius:15px; font-size:14px; }
.secondary { min-height:44px; border-radius:13px; }
.panel { margin-bottom:28px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
.family-summary-panel { padding:18px; border-radius:20px; background:linear-gradient(145deg,#fff,#f0f8f4); box-shadow:0 8px 25px rgba(36,77,67,.06); }
.family-head h2 { font-size:23px; }
.family-head > .secondary { min-height:44px; }
.member-strip { margin-top:13px; padding-top:13px; }
.pilot-progress { margin-bottom:26px; border:0; border-radius:14px; background:#f0f5f2; }
.pilot-progress > summary { min-height:44px; align-items:center; padding:10px 14px; font-size:11px; }
.section-title { margin:30px 0 12px; }
.section-title h2 { font-family:Georgia,"Songti SC",serif; font-size:21px; font-weight:500; }
.story { padding:24px 0; }
.story h3 { font-size:22px; line-height:1.4; }
.story p { font-size:16px; line-height:1.85; }
.story-read-button { min-height:44px; margin-top:10px; }
.tab-record .content { padding-top:8px; }
.tab-record .record-panel { margin:0; padding:12px 0 30px; }
.tab-record .record-panel::before { display:none; }
.capture-first { margin-bottom:14px; }
.capture-intro { padding:2px 2px 12px; }
.capture-intro > span { color:#8a7560; font-size:11px; font-weight:700; letter-spacing:.08em; }
.capture-intro h2 { margin:5px 0 4px; font-family:Georgia,"Songti SC",serif; font-size:25px; font-weight:500; }
.capture-intro p { margin:0; color:var(--muted); font-size:12px; line-height:1.6; }
.record-mode-switch { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:2px 0 14px; padding:5px; border:1px solid rgba(73,113,102,.12); border-radius:18px; background:rgba(255,253,248,.72); }
.record-mode-switch > button { display:grid; min-width:0; min-height:68px; grid-template-columns:28px minmax(0,1fr); align-items:center; gap:9px; padding:11px 10px; border:1px solid transparent; border-radius:13px; color:#68756f; background:transparent; text-align:left; }
.record-mode-switch > button.is-active { border-color:rgba(47,145,132,.2); color:#236f65; background:#fffdf8; box-shadow:0 5px 16px rgba(38,94,82,.09); }
.record-mode-switch svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.record-mode-switch span { min-width:0; display:grid; gap:2px; }
.record-mode-switch b { font-size:14px; line-height:1.25; }
.record-mode-switch small { color:#8a948f; font-size:11px; line-height:1.35; }
.capture-text-entry { margin:8px 0 12px; padding:18px; border:1px solid rgba(69,145,132,.2); border-radius:18px 6px 18px 6px; color:#43665e; background:linear-gradient(145deg,#fffdf8,#edf8f3); font-size:13px; font-weight:750; }
.capture-text-entry[hidden],.voice-recorder[data-record-voice][hidden] { display:none; }
.capture-text-entry textarea { min-height:190px; margin-top:3px; border-color:rgba(55,124,111,.16); background:rgba(255,255,255,.9); font-size:16px; line-height:1.75; }
.capture-text-entry textarea::placeholder { color:#98a29d; }
.record-draft-note { display:inline-flex; margin-top:9px; padding:5px 9px; border-radius:999px; color:var(--green); background:var(--mint); font-size:11px; font-style:normal; font-weight:700; }
.record-family-target { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:2px 2px 12px; color:var(--muted); font-size:11px; }
.record-family-target select { width:auto; max-width:68%; min-height:40px; padding:8px 30px 8px 11px; border-radius:999px; color:var(--deep); font-size:11px; }
.voice-recorder.voice-primary { margin:8px 0 12px; padding:20px; border:0; border-radius:22px; color:white; background:linear-gradient(150deg,#227f72,#174f49); box-shadow:0 12px 26px rgba(25,74,68,.18); }
.voice-recorder.voice-primary > span { color:rgba(255,255,255,.72); font-size:11px; font-weight:700; letter-spacing:.08em; }
.voice-recorder.voice-primary > button { display:flex; min-height:70px; align-items:center; justify-content:center; gap:12px; border:1px solid rgba(255,255,255,.24); border-radius:18px; color:white; background:rgba(255,255,255,.12); font-size:17px; }
.voice-recorder.voice-primary > button i { display:block; width:23px; height:31px; border:3px solid currentColor; border-radius:14px; }
.voice-recorder.voice-primary > button i::after { content:""; display:block; width:31px; height:18px; margin:17px 0 0 -7px; border:3px solid currentColor; border-top:0; border-radius:0 0 17px 17px; }
.voice-recorder.voice-primary > button b { font-weight:700; }
.voice-recorder.voice-primary .record-mic-icon {
  width:34px;
  height:34px;
  flex:none;
  overflow:visible;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.voice-recorder.voice-primary > small { color:rgba(255,255,255,.68); font-size:11px; text-align:center; }
.voice-recorder.voice-primary audio { filter:invert(1) hue-rotate(180deg); }
.capture-media { position:relative; min-height:112px; align-content:center; padding:18px 18px 18px 82px; border:1px dashed #a8c8bf; border-radius:19px; background:#f3f8f5; }
.capture-media::before { content:"＋"; position:absolute; top:22px; left:20px; display:grid; width:48px; height:48px; place-items:center; border-radius:16px; color:var(--green); background:white; box-shadow:0 5px 14px rgba(25,74,68,.08); font-size:26px; }
.capture-media > span { color:var(--deep); font-size:15px; font-weight:700; }
.capture-media input { position:absolute; inset:0; z-index:1; height:100%; opacity:0; cursor:pointer; }
.capture-media small { font-size:11px; }
.capture-media #mediaPreview { position:relative; z-index:2; grid-column:1/-1; margin:14px 0 0 -62px; }
.capture-next { display:flex; align-items:center; justify-content:center; gap:5px; margin:16px 0 4px; color:var(--muted); font-size:11px; }
.capture-next i { display:grid; width:20px; height:20px; flex:none; place-items:center; border-radius:50%; color:var(--green); background:var(--mint); font-size:11px; font-style:normal; font-weight:700; }
.capture-next span:not(:last-child)::after { content:"→"; margin-left:5px; color:#aab6b1; }
.tab-record .story-options { border:0; border-radius:16px; background:#f0f6f3; }
.story-options > summary { position:relative; display:grid; min-height:58px; align-content:center; gap:3px; padding:12px 44px 12px 15px; }
.story-options > summary::after { position:absolute; top:18px; right:16px; }
.story-options > summary b { color:var(--green); font-size:13px; }
.story-options > summary span { color:var(--muted); font-size:11px; font-weight:400; }
.story-options > :not(summary) { margin-right:15px; margin-left:15px; }
.story-family-label,.relay-family-label { display:flex; width:max-content; align-items:center; gap:6px; margin:0 0 9px; color:#7b6d5d; font-size:11px; font-weight:700; }
.story-family-label i,.relay-family-label i { width:8px; height:8px; border-radius:50%; }
.related-person-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-bottom:16px; padding:0; border:0; }
.related-person-picker legend { grid-column:1/-1; margin-bottom:7px; color:#59635e; font-size:12px; }
.related-person-picker label { display:flex; min-height:48px; align-items:center; gap:9px; margin:0; padding:9px 11px; border:1px solid var(--line); border-radius:13px; background:white; }
.related-person-picker input { width:20px; min-height:20px; margin:0; accent-color:var(--green); }
.related-person-picker span { display:grid; min-width:0; color:var(--ink); font-size:13px; }
.related-person-picker small { overflow:hidden; color:var(--muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.related-person-picker > p { grid-column:1/-1; margin:2px 2px 0; color:#6d7c76; font-size:11px; line-height:1.55; }
.record-person-family-filter { display:grid; grid-column:1/-1; gap:7px; min-width:0; }
.record-person-family-filter > span { color:#708079; font-size:11px; font-weight:700; }
.record-person-family-filter > div { display:flex; gap:7px; overflow-x:auto; padding:1px 1px 3px; scrollbar-width:none; }
.record-person-family-filter > div::-webkit-scrollbar { display:none; }
.record-person-family-filter button { display:flex; min-height:36px; flex:0 0 auto; align-items:center; gap:6px; padding:7px 10px; border:1px solid #dce5e0; border-radius:999px; background:#fff; color:#5e6e67; font:600 12px/1.2 inherit; box-shadow:none; }
.record-person-family-filter button > i { width:7px; height:7px; border-radius:50%; background:var(--family-color); }
.record-person-family-filter button > small { min-width:20px; padding:2px 5px; border-radius:999px; background:#f0f4f1; color:#78847f; font-size:11px; text-align:center; }
.record-person-family-filter button.active { border-color:rgba(35,135,119,.55); background:#edf8f4; color:#176e61; }
.record-person-family-filter button.active > small { background:#d9eee7; color:#176e61; }
.related-person-picker > .record-person-family-note { grid-column:1/-1; margin:-1px 2px 2px; color:#7b8782; font-size:11px; line-height:1.5; }
.related-person-picker > .record-person-family-empty { padding:12px; border:1px dashed #d7e1dc; border-radius:12px; text-align:center; }
[data-story-family-shares] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0 0 16px; padding:12px; border:1px solid var(--line); border-radius:14px; background:#f7faf8; }
[data-story-family-shares][hidden] { display:none; }
[data-story-family-shares] legend { padding:0 5px; color:#59635e; font-size:12px; }
[data-story-family-shares] label { display:flex; min-height:44px; align-items:center; gap:8px; margin:0; padding:8px 10px; border:1px solid #e0e8e3; border-radius:11px; background:white; }
[data-story-family-shares] input { width:19px; min-height:19px; margin:0; accent-color:var(--green); }
[data-story-family-shares] small { grid-column:1/-1; color:var(--muted); line-height:1.5; }
.tab-moments .content { padding-top:12px; }
.tab-moments .family-tools { margin:0; }
.tab-moments .relay-module,.tab-moments .activity-module { margin:0; padding:20px 0 28px; border:0; border-radius:0; background:transparent; }
.tab-moments .activity-module { border-top:1px solid var(--line); }
.tab-moments .relay-heading h2,.tab-moments .activity-heading h2 { font-size:21px; }
.tab-moments .relay-question { padding:16px 0; border:0; border-top:1px solid var(--line); border-radius:0; background:transparent; }
.tab-moments .relay-question:first-child { margin-top:18px; }
.tab-profile .content { padding-top:0; }
.tab-profile .panel { margin:0; padding:24px 0; border-bottom:1px solid var(--line); }
.tab-profile .panel:last-child { border-bottom:0; }
.account-profile { padding-top:15px !important; }
.account-profile > header { display:grid; grid-template-columns:76px minmax(0,1fr); align-items:center; gap:16px; padding:2px 0 19px; }
.account-profile > header > div > span { color:var(--green); font-size:11px; font-weight:750; }
.account-profile > header h2 { margin:3px 0 4px; font-family:Georgia,"Songti SC",serif; font-size:25px; font-weight:500; }
.account-profile > header p { margin:0; color:var(--muted); font-size:12px; }
.account-avatar-picker { position:relative; display:block; width:76px; margin:0; cursor:pointer; text-align:center; }
.account-avatar-picker input { position:absolute; width:1px; min-height:1px; opacity:0; pointer-events:none; }
.account-avatar-picker > span { display:grid; width:68px; height:68px; margin:auto; place-items:center; overflow:hidden; border:2px solid rgba(43,142,127,.2); border-radius:50%; color:#276e63; background:linear-gradient(145deg,#e8f6f0,#f8d990); font-family:Georgia,"Songti SC",serif; font-size:26px; box-shadow:0 7px 18px rgba(42,91,80,.1); }
.account-avatar-picker img { width:100%; height:100%; object-fit:cover; }
.account-avatar-picker > i { display:block; margin-top:5px; color:var(--green); font-size:11px; font-style:normal; }
.account-avatar-picker:has(input:focus-visible) > span { outline:3px solid rgba(43,142,127,.2); outline-offset:2px; }
.avatar-cropper {
  position:fixed;
  z-index:90;
  inset:0;
  display:grid;
  align-items:end;
  padding:24px 16px max(16px,env(safe-area-inset-bottom));
  background:rgba(20,31,28,.7);
  backdrop-filter:blur(8px);
}
.avatar-cropper > section {
  width:min(100%,420px);
  max-height:calc(100dvh - 32px);
  margin:auto;
  overflow:auto;
  padding:20px;
  border-radius:24px;
  background:#fffaf1;
  box-shadow:0 24px 70px rgba(15,28,24,.28);
}
.avatar-cropper header { display:flex; align-items:start; justify-content:space-between; gap:14px; }
.avatar-cropper header span { color:var(--green); font-size:11px; font-weight:750; }
.avatar-cropper h2 { margin:4px 0 17px; font-family:Georgia,"Songti SC",serif; font-size:21px; font-weight:500; line-height:1.4; }
.avatar-cropper header button { width:40px; min-width:40px; height:40px; padding:0; border:0; border-radius:50%; color:#607069; background:#edf2ed; font-size:25px; }
.avatar-crop-stage {
  position:relative;
  width:min(280px,calc(100vw - 72px));
  aspect-ratio:1;
  margin:auto;
  overflow:hidden;
  touch-action:none;
  border-radius:18px;
  background:#dfe6e1;
}
.avatar-crop-stage img { position:absolute; top:50%; left:50%; max-width:none; user-select:none; pointer-events:none; will-change:transform; }
.avatar-crop-stage::after {
  content:"";
  position:absolute;
  inset:0;
  border:2px solid rgba(255,255,255,.92);
  border-radius:50%;
  box-shadow:0 0 0 90px rgba(17,28,25,.48);
  pointer-events:none;
}
.cover-crop-stage { width:min(360px,calc(100vw - 72px)); aspect-ratio:2/1; border-radius:16px; }
.cover-crop-stage::after { border-radius:16px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.5); }
.cover-cropper label + label { margin-top:8px; }
.avatar-cropper > section > p { margin:13px 0 15px; color:var(--muted); font-size:12px; text-align:center; }
.avatar-cropper > section > p.error { color:#a84f3d; }
.avatar-cropper label { margin:0; font-size:12px; }
.avatar-cropper input[type="range"] { min-height:38px; padding:0; border:0; box-shadow:none; accent-color:var(--green); }
.avatar-cropper footer { display:grid; grid-template-columns:1fr 1.5fr; gap:10px; margin-top:13px; }
.avatar-reviewing,
.avatar-review-result {
  position:fixed;
  inset:0;
  z-index:130;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(24,48,43,.28);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
}
.avatar-reviewing > section,
.avatar-review-result > section {
  width:min(100%,360px);
  padding:26px 24px;
  border:1px solid rgba(255,255,255,.8);
  border-radius:25px;
  background:#fffaf1;
  box-shadow:0 20px 55px rgba(32,66,58,.2);
  text-align:center;
}
.avatar-reviewing i {
  width:34px;
  height:34px;
  display:block;
  margin:0 auto 14px;
  border:3px solid rgba(47,153,137,.18);
  border-top-color:#2f9989;
  border-radius:50%;
  animation:spin .8s linear infinite;
}
.avatar-reviewing h2,
.avatar-review-result h2 { margin:4px 0 9px; font-family:Georgia,"Songti SC",serif; font-size:20px; font-weight:500; }
.avatar-reviewing p,
.avatar-review-result p { margin:0; color:var(--muted); font-size:13px; line-height:1.7; }
.avatar-review-result > section { position:relative; }
.avatar-review-result > section > button[aria-label] {
  position:absolute; top:10px; right:10px; width:38px; height:38px; padding:0; border:0; border-radius:50%; color:#61736c; background:#edf2ed; font-size:24px;
}
.avatar-review-result > section > i { display:block; margin-bottom:7px; color:#dd775f; font-size:11px; font-style:normal; font-weight:750; }
.avatar-review-result .primary { width:100%; margin-top:20px; }
.avatar-cropper footer button { min-height:48px; }
.account-profile-editor,.account-security { margin-top:9px; border-top:1px solid var(--line); }
.account-profile-editor > summary,.account-security > summary { min-height:50px; padding:15px 2px; color:#36574f; cursor:pointer; font-size:14px; font-weight:700; list-style:none; }
.account-profile-editor > summary::after,.account-security > summary::after { content:"＋"; float:right; color:var(--green); font-weight:400; }
.account-profile-editor[open] > summary::after,.account-security[open] > summary::after { content:"－"; }
.account-profile-editor form,.account-security form { padding:15px; border-radius:16px; background:rgba(241,247,243,.8); }
.account-profile-editor form > div { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.account-profile-editor .secondary { width:100%; min-height:47px; }
.account-security form > p { margin:0 0 15px; color:var(--muted); font-size:12px; line-height:1.6; }
@media (max-width:390px) {
  .account-profile-editor form > div { grid-template-columns:1fr; gap:0; }
}
.tab-profile .family-hub > header { padding:4px 0; }
.tab-profile .purpose-list h2,.tab-profile .contribution-manager h2,.tab-profile .personal-activity h2 { margin:0; font-family:Georgia,"Songti SC",serif; font-size:20px; font-weight:500; }
.tab-profile .purpose-list > summary,.tab-profile .personal-activity > summary { display:flex; min-height:52px; align-items:center; justify-content:space-between; cursor:pointer; list-style:none; }
.tab-profile .purpose-list > summary::-webkit-details-marker,.tab-profile .personal-activity > summary::-webkit-details-marker { display:none; }
.tab-profile .purpose-list > summary span,.tab-profile .personal-activity > summary span { color:var(--muted); font-size:11px; }
.tab-profile .purpose-list > summary span::after,.tab-profile .personal-activity > summary span::after { content:"＋"; margin-left:8px; color:var(--green); }
.tab-profile .purpose-list[open] > summary span::after,.tab-profile .personal-activity[open] > summary span::after { content:"－"; }
.tab-profile .purpose-list label { min-height:54px; margin:0; padding:12px 0; border-top:1px solid var(--line); }
.tab-profile .purpose-list input { min-height:0; }
.main-tabbar { height:74px; }
.main-tabbar button { min-height:54px; }
.main-tabbar button.record { transform:translateY(-9px); }

/* V11 visual refinement: one calm brand surface, clearer type, fewer faint fragments. */
:root {
  --green:#23786e;
  --aqua:#36a99c;
  --coral:#e96f58;
  --deep:#173f3a;
  --paper:#f4f1e9;
  --mint:#e0f0ea;
  --ink:#24342f;
  --muted:#68756f;
  --line:rgba(31,75,67,.13);
}
body {
  background:
    radial-gradient(circle at 50% -120px,rgba(63,139,125,.12),transparent 390px),
    var(--paper);
  font-size:15px;
}
#app { background:#fbfaf6; }
.brand-sign { gap:10px; }
.brand-sign .brand-emblem {
  display:grid;
  width:42px;
  height:42px;
  flex:none;
  place-items:center;
  border:1px solid rgba(31,75,67,.13);
  border-radius:14px;
  background:#fffaf0;
  box-shadow:0 5px 14px rgba(28,64,57,.1),inset 0 0 0 1px rgba(255,255,255,.7);
}
.brand-sign .brand-emblem img { width:31px; height:31px; object-fit:contain; }
.brand-sign .brand-name {
  color:var(--deep);
  font-family:"Songti SC","STSong",Georgia,serif;
  font-size:19px;
  font-weight:650;
  letter-spacing:.1em;
}
.welcome .brand-emblem { border-color:rgba(255,255,255,.45); background:rgba(255,250,240,.94); box-shadow:0 7px 22px rgba(7,41,36,.22); }
.welcome .brand-name { color:white; text-shadow:0 1px 10px rgba(5,40,35,.24); }
.welcome {
  background:
    radial-gradient(circle at 82% 13%,rgba(239,184,77,.88) 0 34px,transparent 35px),
    radial-gradient(circle at 4% 80%,rgba(61,178,163,.24),transparent 220px),
    linear-gradient(155deg,#2b877b,#153f3b 76%);
}
.top {
  padding:0 22px 29px;
  background:
    radial-gradient(circle at 91% 18%,rgba(75,169,153,.25),transparent 180px),
    linear-gradient(145deg,#28756c,#174a45 76%);
  box-shadow:inset 0 -1px rgba(255,255,255,.08);
}
.top nav {
  min-height:66px;
  margin:0 -22px 25px;
  padding:11px 20px;
  border-bottom:1px solid rgba(28,72,64,.12);
  background:rgba(255,252,246,.97);
  box-shadow:0 5px 18px rgba(23,63,58,.06);
}
.top h1 { font-size:31px; line-height:1.24; letter-spacing:-.025em; }
.top p { color:rgba(255,255,255,.76); font-size:12px; line-height:1.5; }
.top > p:first-of-type { color:rgba(255,255,255,.88); font-weight:650; }
.family-scope-filter {
  gap:8px;
  padding:11px 20px;
  border-bottom:1px solid var(--line);
  background:rgba(255,252,247,.97);
}
.family-scope-filter button {
  min-height:38px;
  padding:8px 13px;
  border-color:rgba(31,75,67,.13);
  color:#65716c;
  background:#fffdfa;
  font-size:12px;
}
.family-scope-filter button.active {
  border-color:rgba(35,120,110,.3);
  color:var(--deep);
  background:#e8f3ef;
  box-shadow:0 3px 10px rgba(31,90,80,.07);
}
.content { padding:23px 22px 32px; }
.tab-home .family-summary-panel {
  margin:0 0 22px;
  padding:16px;
  border:1px solid rgba(31,75,67,.1);
  border-radius:20px;
  background:rgba(255,255,255,.78);
  box-shadow:0 10px 28px rgba(31,69,61,.055);
}
.tab-home .family-summary-panel .member-strip { min-height:38px; }
.member-strip > span,.member-strip b { font-size:12px; }
.member-strip i { width:32px; height:32px; }
.tab-home .family-head {
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--line);
}
.pilot-progress {
  margin-bottom:28px;
  border:1px solid rgba(31,75,67,.08);
  border-radius:16px;
  background:#edf4f0;
}
.pilot-progress > summary { min-height:48px; padding:12px 15px; font-size:12px; }
.section-title { margin:32px 0 15px; }
.section-title h2 { color:#253a34; font-size:23px; letter-spacing:-.015em; }
.section-title span { font-size:12px; }
.empty-stories {
  min-height:220px;
  display:grid;
  align-content:center;
  justify-items:center;
  padding:34px 0 44px;
}
.empty-stories > p { color:#69756f; font-size:15px; line-height:1.75; }
.empty-stories > .primary {
  max-width:330px;
  min-height:52px;
  box-shadow:0 9px 22px rgba(35,120,110,.18);
}
.primary {
  background:linear-gradient(145deg,#2a8378,#1d695f);
  box-shadow:0 6px 16px rgba(35,120,110,.14);
}
.secondary { border-color:rgba(35,120,110,.24); background:#edf6f2; }
.panel { border-color:var(--line); }
.story { border-color:var(--line); }
.story h3 { color:#213a34; }
.main-tabbar {
  height:78px;
  padding-top:7px;
  border-top:1px solid rgba(26,72,64,.12);
  background:rgba(255,253,249,.97);
  box-shadow:0 -10px 30px rgba(25,66,58,.09);
}
.main-tabbar button { color:#75817c; }
.main-tabbar b { font-size:12px; }
.main-tabbar button.active { color:#176b61; }
.main-tabbar button.active span { background:#deeee8; box-shadow:inset 0 0 0 1px rgba(35,120,110,.06); }
.main-tabbar button.record span {
  background:linear-gradient(145deg,#ef7c64,#d95845);
  box-shadow:0 8px 20px rgba(218,83,65,.3),0 0 0 4px #fbfaf6;
}
.tab-page-head {
  grid-template-columns:42px 1fr auto;
  gap:0 10px;
  padding:14px 22px 23px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(160deg,#f7fbf8,#fffaf3);
}
.tab-page-head::before {
  content:"象爷同堂";
  grid-column:2;
  grid-row:1;
  display:block;
  height:auto;
  padding:0;
  color:var(--deep);
  background:none;
  font-size:19px;
  line-height:42px;
  letter-spacing:.1em;
}
.tab-page-head > img {
  grid-column:1;
  grid-row:1;
  display:block;
  width:42px;
  height:42px;
  padding:5px;
  border:1px solid rgba(31,75,67,.13);
  border-radius:14px;
  background:#fffaf0;
  box-shadow:0 5px 14px rgba(28,64,57,.1);
  object-fit:contain;
}
.tab-page-head > .text-button { grid-column:3; grid-row:1; }
.tab-page-head > div { grid-column:1/-1; grid-row:2; margin-top:20px; }
.tab-page-head p { font-size:12px; }
.tab-page-head h1 { margin-top:3px; color:#203a34; font-size:30px; letter-spacing:-.025em; }
.tab-page-head span { font-size:12px; }
.tab-profile .panel { padding:26px 0; }
.tab-profile .family-hub > header { grid-template-columns:50px 1fr; gap:14px; }
.family-hub > header > i { width:50px; height:50px; font-size:21px; }
.family-hub > header span,.family-bridges > span,.family-shared-people > span { font-size:12px; }
.family-hub > header h2 { margin-top:4px; font-size:23px; }
.family-hub-list > article { min-height:66px; padding:15px 4px; }
.family-hub-list > article b { font-size:14px; }
.family-hub-list > article small,.family-create-guidance { font-size:12px; line-height:1.6; }
.tab-profile .purpose-list h2,.tab-profile .contribution-manager h2,.tab-profile .personal-activity h2 { font-size:22px; }
.tab-record .capture-intro h2 { font-size:27px; }
.tab-record .capture-intro p,.capture-media small,.voice-recorder.voice-primary > small { font-size:12px; }
.tab-moments .relay-heading h2,.tab-moments .activity-heading h2 { font-size:23px; }
.tab-tree .top { background:#fffaf3; }
.tab-tree .top nav { box-shadow:0 4px 16px rgba(22,65,57,.07); }
.tab-tree .network-heading {
  border-color:rgba(255,255,255,.8);
  background:rgba(255,252,246,.91);
  box-shadow:0 8px 22px rgba(35,76,67,.1);
}
@media (max-width:390px) {
  .content { padding-right:18px; padding-left:18px; }
  .top { padding-right:18px; padding-left:18px; }
  .top nav { margin-right:-18px; margin-left:-18px; }
  .tab-page-head { padding-right:18px; padding-left:18px; }
  .family-hub-list > article small { max-width:235px; }
}
@media (max-width:350px) { .related-person-picker { grid-template-columns:1fr; } }
@media (min-width:700px) { #app { margin:18px auto; min-height:calc(100vh - 36px); overflow:hidden; border-radius:25px; box-shadow:0 20px 60px rgba(32,49,41,.13); } }

button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible {
  outline:3px solid rgba(48,174,162,.38);
  outline-offset:2px;
}

@media (prefers-reduced-motion:reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior:auto !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}

.person-source-records article {
  grid-template-columns:42px minmax(0,1fr) auto;
  gap:11px;
  padding:9px 0;
}
.source-person-portrait {
  display:grid;
  width:38px;
  height:38px;
  place-items:center;
  overflow:hidden;
  border:1px solid rgba(48,112,96,.15);
  border-radius:50%;
  color:#356b60;
  background:#edf5ef;
  font-size:14px;
  font-weight:720;
}
.source-person-portrait img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.person-source-records article > div:nth-child(2) {
  min-width:0;
}
.person-source-records article em {
  display:block;
  margin-top:3px;
  color:#a07748;
  font-size:11px;
  font-style:normal;
}
.person-source-actions {
  display:flex;
  align-items:center;
  gap:7px;
}
.person-source-actions label,
.person-source-actions .person-source-edit {
  position:relative;
  display:grid;
  min-width:76px;
  min-height:36px;
  place-items:center;
  padding:0 11px;
  border:1px solid rgba(40,116,103,.13);
  border-radius:11px;
  color:#287467;
  background:#f8fbf8;
  box-shadow:0 3px 9px rgba(38,95,84,.04);
  font:inherit;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
}
.person-source-actions label {
  border-color:transparent;
  background:#e8f5f0;
}
.person-source-actions label:active,
.person-source-actions .person-source-edit:active { transform:scale(.97); }
.person-source-actions label input {
  position:absolute;
  width:1px;
  min-height:1px;
  opacity:0;
  pointer-events:none;
}
.person-source-actions .person-source-edit { appearance:none; }
@media (max-width:430px) {
  .person-source-records article {
    grid-template-columns:38px minmax(0,1fr);
  }
  .person-source-actions {
    grid-column:2;
    justify-content:flex-start;
    margin-top:3px;
  }
}

/* V27 — “我的”是安静的个人入口：身份在前，管理按需展开。 */
.tab-profile .profile-content {
  padding:18px 18px 112px;
  background:
    radial-gradient(circle at 100% 4%,rgba(245,193,73,.13),transparent 230px),
    linear-gradient(180deg,#f8f2e7,#f4eee5);
}
.profile-hero {
  overflow:hidden;
  margin-bottom:14px;
  padding:24px 20px 0;
  border:1px solid rgba(255,255,255,.78);
  border-radius:26px 9px 26px 9px;
  background:
    radial-gradient(circle at 92% 12%,rgba(246,190,65,.33),transparent 105px),
    linear-gradient(145deg,#fff8e8,#e8f5ef);
  box-shadow:0 14px 34px rgba(56,78,67,.08);
}
.profile-hero,
.person-page > header {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 88% 10%,color-mix(in srgb,var(--person-cover-b,#f2bd63) 28%,transparent),transparent 150px),
    linear-gradient(145deg,color-mix(in srgb,var(--person-cover-a,#58ae9f) 20%,#fff9ed),color-mix(in srgb,var(--person-cover-c,#82cbbb) 17%,#eef7f2));
}
.profile-hero::before,
.person-page > header::before {
  content:"";
  position:absolute;
  z-index:-2;
  inset:0;
  opacity:0;
  background-image:var(--person-cover-image);
  background-position:center;
  background-size:cover;
  transition:opacity .3s ease;
}
.profile-hero.has-person-cover::before,
.person-page > header.has-person-cover::before { opacity:.82; }
.profile-hero.has-person-cover::after,
.person-page > header.has-person-cover::after {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:linear-gradient(110deg,rgba(255,250,239,.86),rgba(246,249,239,.58) 58%,rgba(40,82,73,.2));
  pointer-events:none;
}
.profile-cover-actions {
  display:flex;
  position:relative;
  z-index:3;
  justify-content:flex-end;
  gap:7px;
  min-height:31px;
  margin:-10px 0 8px;
}
.profile-cover-actions label { position:relative; margin:0; cursor:pointer; }
.profile-cover-actions input { position:absolute; width:1px; min-height:1px; opacity:0; pointer-events:none; }
.profile-cover-actions span,
.profile-cover-actions button {
  display:grid;
  min-height:31px;
  place-items:center;
  margin:0;
  padding:6px 10px;
  border:1px solid rgba(44,94,84,.13);
  border-radius:999px;
  color:#2f7267;
  background:rgba(255,253,247,.78);
  box-shadow:none;
  font-size:11px;
  font-weight:650;
}
.profile-cover-actions button { width:auto; }
.profile-cover-actions label:has(input:focus-visible) span { outline:3px solid rgba(43,142,127,.2); outline-offset:2px; }
.profile-hero > header {
  display:grid;
  grid-template-columns:88px minmax(0,1fr);
  align-items:center;
  gap:17px;
  padding-bottom:22px;
}
.profile-hero .account-avatar-picker { width:88px; }
.profile-hero .account-avatar-picker > span {
  width:82px;
  height:82px;
  border:3px solid rgba(255,255,255,.92);
  color:#2d6f65;
  background:linear-gradient(145deg,#dff3ec,#ffda78);
  box-shadow:0 10px 24px rgba(45,100,88,.14);
  font-size:31px;
}
.profile-hero .account-avatar-picker > i { margin-top:7px; font-size:12px; }
.profile-hero > header > div > span { color:#32887c; font-size:12px; font-weight:750; letter-spacing:.06em; }
.profile-hero h1 { margin:3px 0 5px; color:#294b44; font-size:30px; line-height:1.25; }
.profile-hero header p { margin:0; color:#536a63; font-size:14px; line-height:1.55; }
.profile-hero header small { display:block; margin-top:7px; color:#7b877f; font-size:12px; }
.profile-overview {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin:0 -20px;
  border-top:1px solid rgba(54,91,80,.1);
  background:rgba(255,255,255,.42);
}
.profile-overview > div,.profile-overview > button { display:grid; gap:2px; padding:14px 8px 15px; text-align:center; }
.profile-overview > button { border:0; border-radius:0; color:inherit; background:transparent; font:inherit; cursor:pointer; }
.profile-overview > button:active { background:rgba(47,114,103,.07); }
.profile-overview > * + * { border-left:1px solid rgba(54,91,80,.09); }
.profile-overview b { color:#315f56; font-family:Georgia,"Songti SC",serif; font-size:22px; font-weight:500; }
.profile-overview span { color:#7a8881; font-size:11px; }
.profile-security-nudge {
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  width:100%;
  align-items:center;
  gap:11px;
  margin:0 0 14px;
  padding:13px 14px;
  border:0;
  border-radius:16px;
  color:#594d3c;
  background:#fff1cf;
  text-align:left;
}
.profile-security-nudge > i { display:grid; width:38px; height:38px; place-items:center; border-radius:12px; color:#8c642b; background:rgba(255,255,255,.7); font-style:normal; }
.profile-security-nudge > span { display:grid; gap:3px; }
.profile-security-nudge b { font-size:13px; }
.profile-security-nudge small { color:#8a7760; font-size:11px; }
.profile-security-nudge > em { color:#a26b27; font-size:12px; font-style:normal; font-weight:700; }
.profile-settings {
  overflow:hidden;
  border:1px solid rgba(59,79,70,.08);
  border-radius:22px;
  background:rgba(255,253,248,.9);
  box-shadow:0 9px 28px rgba(56,70,62,.055);
}
.profile-setting { margin:0; border:0; background:transparent; }
.profile-setting + .profile-setting { border-top:1px solid rgba(58,78,69,.09); }
.profile-setting > summary {
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 20px;
  min-height:73px;
  align-items:center;
  gap:13px;
  padding:12px 16px;
  cursor:pointer;
  list-style:none;
}
.profile-setting > summary::-webkit-details-marker { display:none; }
.profile-setting > summary > span { display:grid; min-width:0; gap:4px; }
.profile-setting > summary b { color:#334e47; font-size:15px; }
.profile-setting > summary small { overflow:hidden; color:#89918c; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.profile-setting > summary > em { color:#a3ada7; font-size:25px; font-style:normal; font-weight:300; transition:transform .2s ease; }
.profile-setting[open] > summary > em { transform:rotate(90deg); }
.profile-setting[open] > summary { background:rgba(236,245,240,.54); }
.profile-setting-icon {
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:14px;
  color:#31877b;
  background:#e4f3ed;
  font-style:normal;
}
.profile-setting-icon svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.profile-setting:nth-child(2) .profile-setting-icon { color:#9b7135; background:#fff0cf; }
.profile-setting:nth-child(3) .profile-setting-icon { color:#d36d56; background:#ffebe2; }
.profile-setting:nth-child(4) .profile-setting-icon { color:#577fa0; background:#e8f1f6; }
.profile-setting:nth-child(5) .profile-setting-icon { color:#7b6aa2; background:#efeaf7; }
.profile-setting:nth-child(6) .profile-setting-icon { color:#71827a; background:#edf0ed; }
.profile-setting-body {
  padding:6px 16px 20px 73px;
  border-top:1px solid rgba(58,78,69,.07);
}
.profile-setting-body form { margin:12px 0 0; padding:17px; border-radius:17px; background:#f5f7f3; }
.profile-setting-body form > div { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.profile-setting-body input,.profile-setting-body select,.profile-setting-body textarea { min-height:48px; font-size:15px; }
.profile-setting-body .primary,.profile-setting-body .secondary { min-height:48px; }
.profile-setting-actions { display:flex; justify-content:flex-end; margin:2px 0 8px; }
.profile-setting-actions .text-button { color:var(--green); font-size:13px; font-weight:700; }
.profile-family-setting .profile-setting-body { padding-right:12px; padding-left:12px; }
.profile-family-setting .family-hub-list { margin:0; border:0; }
.profile-family-setting .family-hub-list > article { display:block; min-height:0; padding:14px 5px; }
.profile-family-setting .family-hub-list > article > header { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.profile-family-setting .family-hub-list > article > header b { display:flex; min-width:0; align-items:center; gap:8px; }
.profile-family-setting .family-hub-list > article > header small { flex:none; font-size:12px; }
.family-row-manage { margin:8px 0 0 20px; }
.family-row-manage > summary,.family-cross-manager > summary {
  min-height:40px;
  padding:9px 0;
  color:#6d7c75;
  cursor:pointer;
  font-size:12px;
  font-weight:700;
  list-style:none;
}
.family-row-manage > summary::after,.family-cross-manager > summary::after {
  content:"›";
  float:right;
  color:#8aa198;
  font-size:18px;
  line-height:1;
  transform:rotate(0);
  transition:transform .18s ease;
}
.family-row-manage[open] > summary::after,.family-cross-manager[open] > summary::after {
  content:"›";
  transform:rotate(90deg);
}
.family-row-manage > p { margin:3px 0 10px; color:var(--muted); font-size:12px; }
.family-manage-actions { display:flex; flex-wrap:wrap; gap:8px; }
.family-row-manage .family-archive-button,.family-row-manage .family-name-button { min-height:42px; margin:0; padding:8px 12px; border-radius:12px; font-size:12px; }
.family-row-manage .family-name-button { border:1px solid rgba(35,125,115,.18); background:rgba(232,246,242,.7); color:var(--green); font-weight:700; }
.family-name-slot:empty { display:none; }
.family-name-form { margin:10px 0 2px; padding:12px; border:1px solid rgba(35,125,115,.13); border-radius:14px; background:rgba(250,253,249,.78); }
.family-name-form label { display:grid; gap:6px; color:var(--ink); font-size:12px; font-weight:700; }
.family-name-form input { width:100%; min-height:46px; margin:0; }
.family-name-form > small { display:block; margin:7px 0 10px; color:var(--muted); font-size:11px; line-height:1.55; }
.profile-setting-body .family-name-actions { display:flex; grid-template-columns:none; align-items:center; gap:10px; }
.family-name-actions .secondary { min-height:42px; margin:0; padding:8px 14px; }
.family-name-actions .text-button { min-height:42px; margin:0; }
.family-hub-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:14px; }
.family-hub-actions > button { min-height:46px; margin:0; padding:10px; border-radius:14px; font-size:12px; }
.family-hub-actions > small { grid-column:1/-1; }
.family-hub-actions > div { grid-column:1/-1; }
.family-cross-manager { margin-top:14px; padding-top:4px; border-top:1px solid var(--line); }
.profile-setting .network-boundary { margin:14px 0 0; padding:12px 0 0; font-size:11px; line-height:1.55; }
.profile-setting.contribution-manager > .profile-setting-body { padding-right:16px; }
.profile-setting .contribution-group { border-top:1px solid rgba(58,78,69,.08); }
.profile-setting .contribution-group summary { min-height:48px; padding:12px 0; }
.profile-setting.purpose-list .profile-setting-body { padding-bottom:8px; }
.profile-setting.purpose-list label { min-height:62px; margin:0; padding:13px 0; }
.profile-setting.purpose-list label b { font-size:13px; }
.profile-setting.purpose-list label small { font-size:11px; line-height:1.5; }
.profile-setting.personal-activity > .profile-setting-body > p { padding:13px 0; }
.profile-support {
  margin:14px 0 0;
  padding:0;
  border:1px solid rgba(59,79,70,.08);
  border-radius:17px;
  background:rgba(255,253,248,.82);
}
.profile-support > button {
  display:flex;
  width:100%;
  min-height:54px;
  align-items:center;
  justify-content:space-between;
  padding:10px 16px;
  border:0;
  color:#64756e;
  background:transparent;
  font-size:13px;
}
.profile-support > button em { color:#a3ada7; font-size:23px; font-style:normal; }
.profile-support form { margin:0 14px 14px; }
.profile-signout { padding:22px 0 0; border:0; }
.profile-signout > button { color:#9b7e70; font-size:13px; }
@media (max-width:390px) {
  .tab-profile .profile-content { padding-right:14px; padding-left:14px; }
  .profile-hero { padding-right:16px; padding-left:16px; }
  .profile-hero > header { grid-template-columns:78px minmax(0,1fr); gap:14px; }
  .profile-hero .account-avatar-picker { width:78px; }
  .profile-hero .account-avatar-picker > span { width:74px; height:74px; }
  .profile-setting-body { padding-right:13px; padding-left:13px; }
  .profile-setting-body form > div { grid-template-columns:1fr; gap:0; }
  .family-hub-actions { grid-template-columns:1fr; }
}

/* V13: 家传负责沉淀，同堂负责回应。 */
.main-tabbar button > span { position:relative; }
.tab-attention { position:absolute; z-index:2; top:-5px; right:-8px; display:grid; place-items:center; margin:0; border:2px solid white; border-radius:999px; background:var(--coral); box-shadow:0 2px 7px rgba(126,55,43,.2); font-family:-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif; font-style:normal; font-weight:750; line-height:1; }
.tab-attention.count { min-width:20px; height:20px; padding:0 4px; color:white; font-size:11px; }
.tab-attention.dot { top:-1px; right:-3px; width:9px; height:9px; border-width:2px; }

.tab-home .top {
  background:
    radial-gradient(circle at 84% 20%,rgba(246,184,61,.28),transparent 150px),
    linear-gradient(145deg,#28756c,#174a45 78%);
}
.tab-home .family-summary-panel {
  min-height:44px;
  margin:0 0 4px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}
.tab-home .family-head { width:100%; min-height:44px; align-items:center; gap:14px; margin:0; padding:0 2px; border:0; }
.tab-home .family-head > .secondary {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0;
  padding:0;
  border:0;
  color:var(--green);
  background:transparent;
  box-shadow:none;
  line-height:1;
}
.tab-home .family-more > summary {
  min-width:44px;
  min-height:44px;
  display:flex;
  align-items:center;
  padding:0;
  line-height:1;
}
.tab-home .family-more > summary::after { margin-left:4px; }
.tab-home .home-story-heading { margin:12px 0 12px; }
.tab-home .home-story-heading h2 { font-size:25px; }
.legacy-featured { margin:0 -2px 30px; padding:18px 16px 10px; border-radius:22px; background:linear-gradient(155deg,#edf6f1,#fffaf1); box-shadow:0 8px 24px rgba(30,76,66,.055); }
.legacy-featured > header { padding:0 2px 7px; }
.legacy-featured > header span { color:#9b7040; font-size:11px; font-weight:750; letter-spacing:.08em; }
.legacy-featured .story { padding:10px 2px 4px; border:0; }
.legacy-featured .story h3 { font-size:24px; }
.legacy-featured .story > p { font-size:16px; line-height:1.75; }
.family-light-card {
  position:relative;
  overflow:hidden;
  margin:4px 0 28px;
  padding:20px;
  border:1px solid rgba(210,157,83,.2);
  border-radius:24px;
  background:
    radial-gradient(circle at 92% 12%,rgba(255,207,108,.3),transparent 28%),
    linear-gradient(145deg,#fff9e9 0%,#fffdf8 58%,#eef8f3 100%);
  box-shadow:0 12px 32px rgba(118,87,42,.07);
}
.family-light-card > header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.family-light-card > header span { display:block; margin-bottom:4px; color:#a87436; font-size:11px; font-weight:750; letter-spacing:.12em; }
.family-light-card > header h2 { margin:0; color:var(--ink); font-size:20px; line-height:1.3; }
.family-light-card > header > i { color:#e4a847; font-size:25px; font-style:normal; filter:drop-shadow(0 4px 7px rgba(222,165,69,.25)); }
.family-light-card blockquote { margin:22px 0 12px; color:#385f55; font-family:serif; font-size:24px; font-weight:700; line-height:1.5; }
.family-light-card > p { margin:0; color:#596760; font-size:14px; line-height:1.75; }
.family-light-card > footer { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:19px; padding-top:14px; border-top:1px solid rgba(126,111,76,.12); }
.family-light-card > footer span,.family-light-seed small,.family-light-review small { color:#7d857f; font-size:12px; line-height:1.6; }
.family-light-card button { min-height:38px; padding:8px 13px; border:0; border-radius:18px; color:#fff; background:#e59455; font-size:12px; font-weight:750; }
.family-light-loading { display:grid; align-content:center; gap:9px; min-height:70px; }
.family-light-loading i { display:block; height:10px; border-radius:999px; background:linear-gradient(90deg,rgba(47,112,99,.05),rgba(47,112,99,.12),rgba(47,112,99,.05)); background-size:220% 100%; animation:family-light-shimmer 1.25s ease-in-out infinite; }
.family-light-loading i:nth-child(1) { width:42%; }
.family-light-loading i:nth-child(2) { width:82%; }
.family-light-loading i:nth-child(3) { width:63%; }
@keyframes family-light-shimmer { to { background-position:-120% 0; } }
.family-light-seed,.family-light-review { padding-top:18px; }
.family-light-seed p,.family-light-review p { margin:0 0 8px; color:#45665d; font-size:17px; font-weight:700; line-height:1.45; }
.family-light-seed small,.family-light-review small { display:block; margin-bottom:15px; }
.family-light-progress { overflow:hidden; height:5px; margin:15px 0 10px; border-radius:10px; background:rgba(202,167,104,.16); }
.family-light-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#efb257,#ec8b61); transition:width .45s ease; }
.story-preview-copy {
  margin-bottom:13px;
  color:var(--ink-soft);
}
.story-preview-copy > p {
  margin:0;
  line-height:1.72;
}
.story-preview-copy.is-expandable {
  cursor:pointer;
  border-radius:10px;
  -webkit-tap-highlight-color:transparent;
}
.story-preview-copy.is-expandable > p {
  display:-webkit-box;
  overflow:hidden;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.story-preview-copy.is-expandable.expanded > p {
  display:block;
  overflow:visible;
}
.story-preview-copy > span {
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:30px;
  margin-top:2px;
  color:#347f74;
  font-size:12px;
}
.story-preview-copy > span b { font-weight:650; }
.story-preview-copy > span i {
  font-size:14px;
  font-style:normal;
  transition:transform .2s ease;
}
.story-preview-copy.expanded > span i { transform:rotate(180deg); }
.story-preview-copy:focus-visible {
  outline:2px solid rgba(48,174,162,.34);
  outline-offset:3px;
}
.story-preview .story-family-label { margin-bottom:8px; font-weight:650; }
.story-preview .story-media { margin-bottom:14px; border-radius:18px; }
.story-preview .story-media figure { position:relative; }
.story-preview .story-media.single figure {
  min-height:0;
  aspect-ratio:var(--media-natural-ratio,4/3);
  background:transparent;
}
.story-preview .story-media.single .story-image-button { height:auto; }
.story-preview .story-media.single img {
  width:100%;
  height:auto;
  min-height:0;
  max-height:none;
  object-fit:contain;
  background:transparent;
}
.story-preview h3 { margin-bottom:7px; }
.story-preview-audio {
  min-height:52px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:10px;
  margin:2px 0 10px;
  padding:7px 10px;
  border-radius:14px;
  color:var(--muted);
  background:rgba(226,240,234,.72);
  font-size:11px;
}
.story-preview-audio::before { content:"原声"; color:var(--green); font-size:11px; font-weight:750; letter-spacing:.04em; }
.story-preview-audio audio { width:100%; height:38px; }
.story-preview-bottom { min-height:44px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.story-preview-bottom > span { min-width:0; overflow:hidden; color:var(--muted); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.story-preview .story-read-button {
  width:auto;
  min-width:64px;
  min-height:44px;
  display:inline-flex;
  flex:none;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  margin:0 -8px 0 0;
  padding:8px;
  border:0;
  color:var(--green);
  background:transparent;
  font-size:12px;
}
.story-preview .story-read-button i { font-size:15px; font-style:normal; font-weight:400; }
.story-preview .story-read-button.needs-confirmation { color:var(--coral); }
.story-preview.story-unread { border-color:var(--line); box-shadow:none; }
.legacy-more { margin-top:4px; }
.legacy-more > div { padding:0 0 7px; border-bottom:1px solid var(--line); }
.legacy-more > div h2 { margin:0; font-family:Georgia,"Songti SC",serif; font-size:21px; font-weight:500; }
.legacy-more .story:last-child { border-bottom:0; }
.legacy-tail {
  min-height:68px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-top:10px;
  padding:12px 2px 2px;
  border-top:1px solid var(--line);
}
.legacy-tail span { color:var(--muted); font-family:Georgia,"Songti SC",serif; font-size:13px; }
.legacy-tail button {
  min-width:72px;
  min-height:44px;
  padding:8px;
  border:0;
  color:var(--green);
  background:transparent;
  font-size:12px;
  font-weight:700;
}
.empty-stories > span { margin-bottom:8px; color:#987044; font-size:11px; font-weight:750; letter-spacing:.08em; }
.public-story-share { margin-top:18px; border-color:rgba(35,120,110,.18); background:linear-gradient(145deg,#edf6f1,#fffaf1); }
.public-story-share > span { display:block; margin-bottom:8px; color:#92734e; font-size:11px; font-weight:750; letter-spacing:.08em; }
.public-story-share p { margin:7px 0 12px; color:var(--muted); font-size:11px; line-height:1.6; }

.tab-moments .content { padding-top:16px; }
.tab-moments .relay-module,.tab-moments .activity-module,.tab-moments .consent-module { margin:0; padding:22px 0 28px; border:0; border-radius:0; background:transparent; box-shadow:none; }
.tab-moments .relay-module { padding-top:4px; }
.tab-moments .relay-heading { align-items:flex-start; padding-bottom:20px; }
.tab-moments .relay-heading > div { max-width:70%; }
.tab-moments .relay-heading span,.moments-awaiting > div:first-child span,.moments-running > div:first-child span { color:#92734e; font-size:11px; font-weight:750; letter-spacing:.08em; }
.tab-moments .relay-heading h2 { margin:5px 0; font-size:25px; }
.tab-moments .relay-heading p { margin:0; color:var(--muted); font-size:12px; line-height:1.55; }
.moments-awaiting { margin:0 0 26px; padding:15px 16px 4px; border-radius:20px; background:#fff4e9; }
.moments-awaiting > div:first-child,.moments-running > div:first-child { display:flex; align-items:center; justify-content:space-between; }
.moments-awaiting > div b { display:grid; min-width:24px; height:24px; place-items:center; border-radius:999px; color:white; background:var(--coral); font-size:11px; }
.moments-awaiting .relay-question { border-color:rgba(160,104,70,.16); }
.moments-running > div:first-child { min-height:42px; border-bottom:1px solid var(--line); }
.moments-running > div:first-child small { color:var(--muted); font-size:11px; }
#questionList { display:block; width:100%; min-width:0; }
#questionList > .relay-question { width:100%; min-width:0; }
.relay-question > header > div { min-width:0; }
.relay-question h3 { overflow-wrap:anywhere; }
.tab-moments .relay-question { margin:0; padding:18px 0; border:0; border-bottom:1px solid var(--line); border-radius:0; background:transparent; box-shadow:none; }
.moments-awaiting .relay-question:last-child { border-bottom:0; }
.moments-completed { margin-top:24px; border-top:1px solid var(--line); }
.moments-completed > summary { display:flex; min-height:54px; align-items:center; justify-content:space-between; color:var(--muted); cursor:pointer; list-style:none; }
.moments-completed > summary::-webkit-details-marker { display:none; }
.moments-completed > summary span { font-size:12px; font-weight:700; }
.moments-completed > summary b { font-size:11px; font-weight:500; }
.tab-moments .activity-module { border-top:1px solid var(--line); }
.tab-moments .activity-heading > div span { color:#92734e; }
.tab-moments .consent-module { padding:16px; margin-bottom:22px; border-radius:20px; background:#fff4e9; }
.tab-tree .content { position:relative; }

/* Login and onboarding are full-page flows; the tab bar clearance must not create a blank tail. */
#app.login-screen,
#app.onboarding-screen {
  min-height:100dvh;
  padding-bottom:0;
}
.login-screen .welcome {
  min-height:100dvh;
  padding-top:max(36px,env(safe-area-inset-top));
  padding-bottom:max(22px,env(safe-area-inset-bottom));
}
@media (max-height:720px) {
  .login-screen .welcome {
    padding-top:max(22px,env(safe-area-inset-top));
    padding-right:22px;
    padding-left:22px;
  }
  .login-screen .welcome-copy { margin:28px 0 20px; }
  .login-screen .welcome-copy h1 { font-size:34px; }
  .login-screen .welcome-copy > p:last-child { margin-bottom:0; line-height:1.55; }
  .login-screen .login-card { padding:17px; }
}

/* V14 — warm documentary system: one action, fewer boxes, mobile-safe pages. */
:root {
  --canvas:#f3efe6;
  --canvas-green:#edf3ed;
  --canvas-coral:#f6eee8;
  --surface:#fffdf8;
  --surface-soft:#f8f4eb;
  --sage:#637b68;
  --sun:#e4b85e;
  --display:"Songti SC","STSong",Georgia,serif;
  --ui:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
}
html { background:#e9e4da; }
body {
  color:#292d2a;
  background:
    radial-gradient(circle at 50% -90px,rgba(228,184,94,.14),transparent 310px),
    #e9e4da;
  font-family:var(--ui);
}
#app {
  min-height:100dvh;
  padding-bottom:calc(92px + env(safe-area-inset-bottom));
  background:var(--canvas);
}
h1,h2,h3 { text-wrap:balance; }
p { text-wrap:pretty; }
label { color:#59635e; font-size:13px; }
input,textarea,select {
  border-color:rgba(49,70,63,.16);
  border-radius:12px;
  background:rgba(255,253,248,.94);
  box-shadow:inset 0 1px rgba(255,255,255,.8);
}
.primary {
  min-height:52px;
  border-radius:13px;
  background:linear-gradient(145deg,#2b7f73,#1d665d);
  box-shadow:0 9px 22px rgba(35,104,94,.18);
  font-size:15px;
}
.secondary { border-radius:12px; font-size:13px; }
.text-button { font-size:13px; }

/* First light — a brand moment, not a white form page. */
#app.onboarding-screen {
  min-height:100svh;
  padding-bottom:0;
  background:#183f3a;
}
.first-light {
  min-height:100svh;
  padding:
    max(24px,env(safe-area-inset-top))
    22px
    max(20px,env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 88% 10%,rgba(228,184,94,.18),transparent 170px),
    linear-gradient(165deg,#f5f0e5,#eaf2ec);
}
.first-light.intro {
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:18px;
  overflow:hidden;
  color:white;
  background:
    radial-gradient(circle at 82% 17%,rgba(228,184,94,.95) 0 37px,transparent 38px),
    radial-gradient(circle at 7% 84%,rgba(48,174,162,.22),transparent 190px),
    linear-gradient(155deg,#2b8074 0%,#194a44 64%,#153b37 100%);
}
.first-light.intro::before {
  content:"";
  position:absolute;
  z-index:-1;
  right:-94px;
  bottom:132px;
  width:250px;
  height:250px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:48% 52% 42% 58%;
  transform:rotate(-18deg);
}
.first-light.intro::after {
  content:"";
  position:absolute;
  z-index:-1;
  right:-45px;
  bottom:195px;
  width:150px;
  height:1px;
  background:rgba(255,255,255,.18);
  transform:rotate(-28deg);
  box-shadow:0 18px rgba(255,255,255,.1),0 36px rgba(255,255,255,.07);
}
.first-light.intro .brand {
  position:relative;
  z-index:1;
  margin:0;
}
.first-light.intro .brand-emblem {
  border-color:rgba(255,255,255,.5);
  background:#fffaf0;
}
.first-light.intro .brand-name { color:white; text-shadow:none; }
.first-light-message {
  position:relative;
  z-index:1;
  align-self:center;
  max-width:350px;
  margin:12px 0;
}
.first-light-message .eyebrow {
  margin-bottom:14px;
  color:#f3d58d;
  font-size:12px;
  font-weight:700;
  letter-spacing:.1em;
}
.first-light-message h1 {
  margin:0 0 18px;
  color:#fffdf8;
  font-family:var(--display);
  font-size:37px;
  font-weight:500;
  line-height:1.32;
  letter-spacing:-.035em;
}
.first-light.intro .first-light-message > p:last-child {
  max-width:330px;
  margin:0;
  color:rgba(255,255,255,.86);
  font-size:15px;
  line-height:1.75;
}
.first-light-actions {
  position:relative;
  z-index:1;
  display:grid;
  gap:4px;
}
.first-light-actions .primary {
  margin:0;
  color:#194a44;
  background:#fffaf0;
  box-shadow:0 10px 28px rgba(8,36,32,.22);
}
.first-light-actions .text-button {
  min-height:46px;
  margin:0;
  color:rgba(255,255,255,.76);
}
.first-light:not(.intro) h1 { color:#253b35; font-size:34px; }
.first-light:not(.intro) > .eyebrow { margin-top:30px; color:#9a7442; }
.first-light:not(.intro) form {
  margin-top:24px;
  padding:20px;
  border-radius:20px;
  background:rgba(255,253,248,.72);
  box-shadow:0 12px 34px rgba(41,61,53,.07);
}
.first-light.memory form { padding:0; background:transparent; box-shadow:none; }
.person-choice-grid span { border-radius:12px; background:#fffdf8; }

/* Shared application shell and safe tab bar. */
.main-tabbar {
  height:calc(70px + env(safe-area-inset-bottom));
  padding:5px 9px max(6px,env(safe-area-inset-bottom));
  border-top-color:rgba(32,62,54,.1);
  background:rgba(255,253,248,.94);
  box-shadow:0 -8px 26px rgba(39,64,56,.08);
}
.main-tabbar button { min-height:54px; }
.main-tabbar button span { border-radius:9px; }
.main-tabbar button.record { transform:translateY(-8px); }
.main-tabbar button.record span {
  width:46px;
  height:46px;
  box-shadow:0 8px 20px rgba(218,83,65,.26),0 0 0 5px var(--canvas);
}
.main-tabbar b { font-size:12px; }
#toast { bottom:calc(82px + env(safe-area-inset-bottom)); }
.top {
  padding:0 20px 22px;
  background:
    radial-gradient(circle at 88% 20%,rgba(228,184,94,.22),transparent 145px),
    linear-gradient(145deg,#2b746b,#194a44 78%);
}
.top nav {
  min-height:60px;
  margin:0 -20px 19px;
  padding:8px 18px;
  background:rgba(250,247,240,.97);
  box-shadow:0 4px 15px rgba(32,65,57,.055);
}
.top nav .brand-emblem {
  width:38px;
  height:38px;
  border-radius:12px;
  box-shadow:0 3px 10px rgba(28,64,57,.08);
}
.top nav .brand-emblem img { width:28px; height:28px; }
.top nav .brand-name { font-size:18px; }
.top h1 { font-size:30px; line-height:1.18; }
.top p { font-size:12px; }
.content { padding:22px 20px 34px; }
.tab-home .content {
  background:
    radial-gradient(circle at 100% 15%,rgba(228,184,94,.08),transparent 210px),
    var(--canvas);
}
.tab-record .content { background:linear-gradient(180deg,#edf3ed 0,#f5f1e9 620px); }
.tab-moments .content { background:linear-gradient(180deg,#f7f0e9 0,#f3efe6 520px); }
.tab-profile .content { background:linear-gradient(180deg,#f5f1e9,#efeae1); }
.family-scope-filter {
  padding:10px 18px;
  border-bottom-color:rgba(40,66,58,.09);
  background:rgba(248,245,237,.95);
}
.family-scope-filter button {
  min-height:38px;
  border-color:transparent;
  background:rgba(255,253,248,.72);
  font-size:12px;
}

/* Home: one emotional surface, then quiet reading. */
.tab-home .top {
  background:
    radial-gradient(circle at 84% 24%,rgba(228,184,94,.32),transparent 150px),
    linear-gradient(145deg,#2a746a,#173f3a 80%);
}
.tab-home .family-summary-panel { margin-bottom:8px; }
.tab-home .family-head { min-height:48px; }
.tab-home .home-story-heading { margin:18px 0 14px; }
.tab-home .home-story-heading h2 { font-size:27px; }
.legacy-featured {
  margin:0 0 28px;
  padding:20px 18px 12px;
  border-radius:18px 6px 18px 6px;
  background:
    radial-gradient(circle at 100% 0,rgba(228,184,94,.2),transparent 150px),
    #fffaf0;
  box-shadow:0 12px 30px rgba(57,68,55,.07);
}
.legacy-featured .story h3 { font-size:25px; }
.empty-stories {
  min-height:clamp(250px,calc(100dvh - 390px),430px);
  margin-top:4px;
  padding:42px 22px;
  border-radius:22px 7px 22px 7px;
  background:
    radial-gradient(circle at 85% 18%,rgba(228,184,94,.2) 0 28px,transparent 29px),
    linear-gradient(150deg,#fff9ed,#e9f2ec);
  box-shadow:0 12px 32px rgba(40,70,61,.065);
}
.empty-stories > p { max-width:310px; font-family:var(--display); font-size:18px; line-height:1.75; }
.empty-stories > .primary { min-height:52px; }
.story { padding:25px 0; }
.story h3 { font-size:23px; line-height:1.4; }
.story p { color:#3d4742; font-size:17px; line-height:1.85; }
.story footer,.story-preview-bottom > span { font-size:12px; }
.story-preview .story-media { border-radius:14px 4px 14px 4px; }
.story-preview-audio { border-radius:11px; background:#e5eee8; }

/* Record: raw material is the hero; supporting choices recede. */
.tab-record .record-panel { padding:10px 0 36px; }
.capture-intro > span { color:#8b704d; font-size:12px; }
.capture-intro h2 { font-size:29px; line-height:1.3; }
.capture-intro p { font-size:13px; }
.voice-recorder.voice-primary {
  border-radius:18px 6px 18px 6px;
  background:
    radial-gradient(circle at 92% 18%,rgba(228,184,94,.2),transparent 110px),
    linear-gradient(150deg,#26776d,#174a45);
  box-shadow:0 14px 30px rgba(25,74,68,.16);
}
.voice-recorder.voice-primary > button { border-radius:13px; }
.capture-media {
  border-color:rgba(99,123,104,.42);
  border-radius:16px 5px 16px 5px;
  background:rgba(255,253,248,.68);
}
.capture-media::before { border-radius:12px; background:#fffdf8; }
.capture-next { font-size:12px; }
.tab-record .story-options { border-radius:13px; background:rgba(255,253,248,.62); }

/* Moments: a warm family room with meaningful empty states. */
.tab-moments .relay-module,.tab-moments .activity-module {
  padding:24px 0 30px;
}
.tab-moments .relay-heading h2,.tab-moments .activity-heading h2 { font-size:25px; }
.tab-moments .relay-heading p { max-width:330px; font-size:13px; line-height:1.65; }
.moments-awaiting {
  border-radius:18px 6px 18px 6px;
  background:#f8e9dc;
}
.moments-running {
  min-height:116px;
  display:grid;
  align-content:center;
  padding:18px 0;
}
.moments-running > div:first-child { border-bottom:0; }
.moments-running > div:first-child small,.activity-empty {
  color:#727870;
  font-size:13px;
  line-height:1.7;
}
.relay-empty-module,
.tab-moments .activity-empty {
  margin:10px 0 0;
  padding:17px 18px;
  border-radius:15px 5px 15px 5px;
  color:#66716b;
  background:rgba(255,253,248,.72);
  box-shadow:0 7px 22px rgba(59,68,58,.045);
  font-size:13px;
  line-height:1.7;
}
.tab-moments .activity-module {
  border-top-color:rgba(74,81,72,.12);
}

/* Profile: group by meaning, not by a stack of thin rules. */
.tab-page-head {
  padding:13px 20px 24px;
  border-bottom:0;
  background:
    radial-gradient(circle at 92% 16%,rgba(228,184,94,.17),transparent 130px),
    #f7f2e8;
}
.tab-page-head > img {
  width:40px;
  height:40px;
  border-radius:12px;
  box-shadow:0 3px 10px rgba(28,64,57,.08);
}
.tab-page-head::before { font-size:18px; line-height:40px; }
.tab-page-head > div { margin-top:18px; }
.tab-page-head h1 { font-size:31px; }
.tab-page-head p,.tab-page-head span { font-size:12px; }
.tab-profile .panel {
  margin:0 0 16px;
  padding:22px 18px;
  border:0;
  border-radius:18px 6px 18px 6px;
  background:rgba(255,253,248,.7);
}
.tab-profile .family-hub { background:transparent; }
.family-hub-list { border-top-color:rgba(54,74,67,.11); }
.family-hub-list > article { border-bottom-color:rgba(54,74,67,.1); }
.family-hub-list > article b { font-size:15px; }
.family-hub-list > article small,.family-create-guidance { font-size:12px; }
.tab-profile .purpose-list h2,.tab-profile .contribution-manager h2,.tab-profile .personal-activity h2 { font-size:23px; }
.profile-support { border-top-color:rgba(54,74,67,.1); }

/* Full-screen tree keeps the quiet map, with a lighter chrome. */
.tab-tree {
  height:100dvh;
  padding-bottom:calc(70px + env(safe-area-inset-bottom));
  background:#e9f1eb;
}
.tab-tree .top { height:58px; background:#f8f4eb; }
.tab-tree .top nav { height:58px; background:rgba(248,244,235,.96); }
.tab-tree .content { height:calc(100dvh - 128px - env(safe-area-inset-bottom)); }
.tab-tree .spatial-map-shell {
  background:
    radial-gradient(circle at 50% 38%,rgba(255,253,248,.86),transparent 250px),
    #e5f0e9;
}
.tab-tree .network-tree-add {
  border-color:rgba(255,255,255,.8);
  background:rgba(255,253,248,.9);
  box-shadow:0 7px 20px rgba(47,88,77,.1);
}
.tab-tree #personComposer > form,
.tab-tree #personComposer > .clue-review,
.tab-tree #connectionComposer > form,
.tab-tree #relationshipConflictComposer > .relationship-conflict-sheet,
.tab-tree #networkSearchComposer > .network-search-sheet {
  border-radius:20px 20px 0 0;
  background:#faf7ef;
}

/* Reading, people, timeline and conflict pages share one editorial grammar. */
.detail-view { padding-bottom:0; background:var(--canvas); }
.reading-top {
  min-height:58px;
  padding:7px 16px;
  border-bottom:0;
  background:rgba(246,242,233,.96);
  backdrop-filter:blur(14px);
}
.reading-page { min-height:calc(100dvh - 58px); padding-bottom:64px; background:var(--canvas); }
.story-reading { padding:0 22px; }
.story-reading > .story-media { margin-bottom:30px; }
.story-reading > header h1 { font-size:36px; line-height:1.28; }
.story-reading > header > p { font-size:13px; }
.story-reading-text { color:#303632; font-size:19px; line-height:1.95; }
.story-records,.story-owner-tools {
  border:0;
  border-radius:15px 5px 15px 5px;
  background:rgba(255,253,248,.78);
  box-shadow:0 8px 24px rgba(47,61,53,.055);
}
.story-records > summary,.story-owner-tools > summary { min-height:50px; padding:15px; font-size:13px; }
.person-page,.timeline-page,.conflict-page { min-height:100dvh; background:var(--canvas); }
.person-page > header {
  padding:18px 22px 32px;
  background:
    radial-gradient(circle at 82% 16%,rgba(228,184,94,.23),transparent 140px),
    linear-gradient(150deg,#2a776d,#194a44);
}
.person-page > header h1 { font-size:38px; }
.person-page > header p,.person-page > header em { font-size:12px; }
.person-summary { margin:0 20px; padding:20px 0; }
.person-summary span { font-size:12px; }
.person-relations,.person-edit-entry,.person-stories,.identity-actions,.person-source-records { padding:22px 20px; }
.timeline-page > header {
  padding:20px 22px 34px;
  background:
    radial-gradient(circle at 88% 16%,rgba(228,184,94,.2),transparent 150px),
    linear-gradient(155deg,#665d50,#304d46);
}
.timeline-page > header p,.timeline-page > header > span { font-size:12px; }
.timeline-list { padding:24px 18px 58px; }
.conflict-content { background:var(--canvas); }

/* Dialogs and utilities: quiet overlays, one clear layer. */
.family-invite-picker { padding-top:18px; }
.family-invite-picker > div > button {
  border:0;
  border-radius:13px;
  background:rgba(255,253,248,.78);
  box-shadow:0 5px 16px rgba(45,68,60,.055);
}
.family-invite-picker > p,.family-invite-picker > div > button small { font-size:12px; }
.media-lightbox { padding-bottom:max(24px,env(safe-area-inset-bottom)); }
.network-boundary { font-size:12px; line-height:1.65; }

@media (max-height:620px) {
  .first-light.intro {
    gap:10px;
    padding-top:max(18px,env(safe-area-inset-top));
    padding-bottom:max(12px,env(safe-area-inset-bottom));
  }
  .first-light-message { margin:4px 0; }
  .first-light-message h1 { margin-bottom:10px; font-size:31px; line-height:1.28; }
  .first-light.intro .first-light-message > p:last-child { font-size:13px; line-height:1.55; }
  .first-light-actions .primary { min-height:48px; }
  .first-light-actions .text-button { min-height:42px; }
}
@media (max-width:350px) {
  .first-light-message h1 { font-size:31px; }
  .content { padding-right:16px; padding-left:16px; }
}
@media (min-width:700px) {
  #app.login-screen,#app.onboarding-screen { min-height:calc(100dvh - 36px); padding-bottom:0; }
  .first-light,.welcome { min-height:calc(100dvh - 36px); }
}

/* V15 — let the vibrant 06H mark breathe without an app-icon container. */
.brand-sign .brand-emblem,
.welcome .brand-emblem,
.first-light.intro .brand-emblem,
.top nav .brand-emblem {
  width:44px;
  height:44px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.brand-sign .brand-emblem img,
.top nav .brand-emblem img {
  width:44px;
  height:44px;
  filter:drop-shadow(0 4px 7px rgba(20,70,62,.11));
}
.welcome .brand-emblem img,
.first-light.intro .brand-emblem img {
  filter:drop-shadow(0 5px 9px rgba(4,35,31,.22));
}
.brand-sign .brand-name {
  color:#164f48;
  font-weight:680;
  letter-spacing:.08em;
}
.welcome .brand-name,
.first-light.intro .brand-name { color:white; }
.tab-page-head {
  grid-template-columns:44px 1fr auto;
  column-gap:11px;
}
.tab-page-head > img {
  width:44px;
  height:44px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  filter:drop-shadow(0 4px 7px rgba(20,70,62,.11));
}
.tab-page-head::before { line-height:44px; }

/* V16 — sunlight palette: energetic, warm and light; deep green becomes an accent. */
:root {
  --green:#328f83;
  --aqua:#51b8aa;
  --coral:#ef7b62;
  --deep:#2f514b;
  --paper:#f7f1e6;
  --mint:#dff2eb;
  --ink:#303732;
  --muted:#737c75;
  --yellow:#f3c557;
  --line:rgba(55,77,69,.12);
  --canvas:#f7f1e6;
  --canvas-green:#edf7f2;
  --canvas-coral:#fff0e8;
  --surface:#fffdf8;
  --surface-soft:#fbf6ec;
  --sage:#789281;
  --sun:#f3c557;
}
html { background:#eee7db; }
body {
  background:
    radial-gradient(circle at 52% -70px,rgba(243,197,87,.2),transparent 320px),
    #eee7db;
}
#app { background:var(--canvas); }
.primary {
  background:linear-gradient(145deg,#43a396,#2f8a7f);
  box-shadow:0 9px 22px rgba(50,143,131,.18);
}
.secondary {
  border-color:rgba(50,143,131,.2);
  color:#277e73;
  background:#e7f4ef;
}
.text-button { color:#69756f; }

/* Login and invitation entry share one sunny, confident brand stage. */
.welcome {
  color:var(--ink);
  background:
    radial-gradient(circle at 82% 14%,rgba(243,197,87,.96) 0 38px,transparent 39px),
    radial-gradient(circle at 3% 78%,rgba(81,184,170,.18),transparent 210px),
    radial-gradient(circle at 94% 88%,rgba(239,123,98,.13),transparent 180px),
    linear-gradient(155deg,#fff8e9 0%,#edf7f1 70%,#f9eee7 100%);
}
.welcome::after {
  content:"";
  position:absolute;
  right:-54px;
  bottom:96px;
  width:180px;
  height:180px;
  border:1px solid rgba(50,143,131,.12);
  border-radius:46% 54% 58% 42%;
  transform:rotate(-17deg);
  pointer-events:none;
}
.welcome { position:relative; isolation:isolate; overflow:hidden; }
.welcome .brand-name {
  color:#235d55;
  text-shadow:none;
}
.welcome .brand-emblem img { filter:drop-shadow(0 4px 7px rgba(36,98,88,.12)); }
.welcome .eyebrow { color:#b87932; font-weight:750; }
.welcome h1 { color:#2f514b; }
.login-screen .welcome-copy > p:last-child {
  color:#66746d;
  font-size:14px;
}
.login-card {
  position:relative;
  z-index:1;
  border:1px solid rgba(65,88,79,.08);
  background:rgba(255,253,248,.9);
  box-shadow:0 18px 45px rgba(74,76,59,.1);
  backdrop-filter:blur(12px);
}
.login-card .primary {
  background:linear-gradient(145deg,#ef866d,#e66c54);
  box-shadow:0 9px 22px rgba(220,105,82,.18);
}
.pilot-fallback { border-top-color:rgba(55,77,69,.1); }
.invite-banner {
  border:0;
  background:linear-gradient(145deg,#fff2cf,#fff9ec);
  box-shadow:0 8px 24px rgba(151,112,54,.08);
}
.invite-decision {
  margin:10px 0 20px;
  padding:28px 20px;
  border-radius:22px 7px 22px 7px;
  background:
    radial-gradient(circle at 92% 10%,rgba(243,197,87,.25),transparent 120px),
    rgba(255,253,248,.7);
}
.invite-decision > span { color:#c06f48; }
.invite-identity {
  background:linear-gradient(145deg,#e5f4ee,#fff9eb);
}
.invite-identity i { background:linear-gradient(145deg,#51b8aa,#328f83); }
.family-invite-picker > header span { color:#b56d48; }
.family-invite-picker > div > button {
  background:linear-gradient(145deg,rgba(255,253,248,.9),rgba(238,247,242,.82));
}
.family-invite-picker > div > button em { color:var(--coral); }

/* First light becomes a bright editorial poster instead of a dark tunnel. */
#app.onboarding-screen { background:#f7f1e6; }
.first-light.intro {
  color:var(--ink);
  background:
    radial-gradient(circle at 82% 15%,rgba(243,197,87,.98) 0 38px,transparent 39px),
    radial-gradient(circle at 5% 84%,rgba(81,184,170,.2),transparent 190px),
    radial-gradient(circle at 98% 74%,rgba(239,123,98,.13),transparent 170px),
    linear-gradient(155deg,#fff8e9 0%,#edf7f1 68%,#f8eee6 100%);
}
.first-light.intro::before {
  border-color:rgba(50,143,131,.12);
}
.first-light.intro::after {
  background:rgba(50,143,131,.13);
  box-shadow:0 18px rgba(50,143,131,.08),0 36px rgba(239,123,98,.07);
}
.first-light.intro .brand-name { color:#235d55; }
.first-light.intro .brand-emblem img { filter:drop-shadow(0 4px 7px rgba(36,98,88,.12)); }
.first-light-message .eyebrow { color:#b87932; }
.first-light-message h1 { color:#2f514b; }
.first-light.intro .first-light-message > p:last-child { color:#68766f; }
.first-light-actions .primary {
  color:white;
  background:linear-gradient(145deg,#ef866d,#e66c54);
  box-shadow:0 10px 25px rgba(220,105,82,.2);
}
.first-light-actions .text-button { color:#587068; }
.first-light:not(.intro) {
  background:
    radial-gradient(circle at 92% 6%,rgba(243,197,87,.2),transparent 160px),
    linear-gradient(165deg,#fff8e9 0%,#edf7f1 100%);
}
.first-light:not(.intro) form {
  background:rgba(255,253,248,.82);
  box-shadow:0 12px 34px rgba(82,83,67,.07);
}
.person-choice-grid input:checked + span {
  border-color:#42a295;
  color:#277e73;
  background:#e5f4ee;
  box-shadow:0 0 0 1px #42a295;
}

/* App headers are light family-cover bands; dark text carries the hierarchy. */
.top {
  color:var(--ink);
  background:
    radial-gradient(circle at 88% 22%,rgba(243,197,87,.25),transparent 145px),
    linear-gradient(145deg,#f7e8c4,#e4f3ed 78%);
}
.tab-home .top {
  background:
    radial-gradient(circle at 84% 22%,rgba(243,197,87,.48),transparent 150px),
    linear-gradient(145deg,#fff1cf,#e5f4ee 80%);
}
.tab-record .top {
  background:
    radial-gradient(circle at 88% 20%,rgba(81,184,170,.23),transparent 150px),
    linear-gradient(145deg,#e1f3ec,#fff3dc 80%);
}
.tab-moments .top {
  background:
    radial-gradient(circle at 88% 18%,rgba(239,123,98,.18),transparent 145px),
    linear-gradient(145deg,#ffede3,#f7f1dd 80%);
}
.top h1 { color:#2f514b; }
.top p,
.top > p:first-of-type,
.top > p:last-child { color:#68746e; }
.top > p:first-of-type { color:#318579; }
.top nav {
  background:rgba(255,250,240,.96);
  box-shadow:0 4px 15px rgba(76,77,62,.05);
}
.brand-sign .brand-name { color:#235d55; }
.family-scope-filter { background:rgba(255,250,241,.96); }
.family-scope-filter button.active {
  border-color:rgba(50,143,131,.22);
  color:#277e73;
  background:#e3f2ec;
}

/* Content planes keep warmth; color appears in focused moments, not everywhere. */
.tab-home .content {
  background:
    radial-gradient(circle at 100% 14%,rgba(243,197,87,.1),transparent 220px),
    #f7f1e6;
}
.tab-record .content { background:linear-gradient(180deg,#edf7f2 0,#f8f2e7 620px); }
.tab-moments .content { background:linear-gradient(180deg,#fff1e8 0,#f7f1e6 540px); }
.tab-profile .content { background:linear-gradient(180deg,#f8f2e7,#f1eadf); }
.legacy-featured {
  background:
    radial-gradient(circle at 100% 0,rgba(243,197,87,.28),transparent 150px),
    linear-gradient(150deg,#fff8e9,#eaf6f0);
}
.empty-stories {
  background:
    radial-gradient(circle at 85% 18%,rgba(243,197,87,.34) 0 28px,transparent 29px),
    linear-gradient(150deg,#fff8e9,#e8f5ef);
}
.story-preview-audio { background:#e4f2ec; }
.story-gift-label,.record-draft-note { color:#277e73; background:#dff2eb; }
.story-preview .story-read-button.needs-confirmation { color:#df6a52; }

/* Recording stays vivid, but shifts from forest green to fresh aqua. */
.voice-recorder.voice-primary {
  background:
    radial-gradient(circle at 92% 16%,rgba(243,197,87,.34),transparent 110px),
    linear-gradient(145deg,#54b4a7,#348f84);
  box-shadow:0 14px 30px rgba(50,143,131,.18);
}
.capture-media {
  border-color:rgba(81,184,170,.46);
  background:rgba(255,253,248,.75);
}
.capture-media::before { color:#2f9184; }
.tab-record .story-options { background:rgba(255,253,248,.72); }
.main-tabbar button.record span {
  background:linear-gradient(145deg,#f08a70,#e66d54);
  box-shadow:0 8px 20px rgba(230,109,84,.28),0 0 0 5px var(--canvas);
}

/* Moments and profile use coral/sun accents for human response. */
.moments-awaiting { background:#ffe9dc; }
.moments-awaiting > div b { background:#e9735b; }
.relay-empty-module,
.tab-moments .activity-empty { background:rgba(255,251,242,.85); }
.tab-page-head {
  background:
    radial-gradient(circle at 92% 16%,rgba(243,197,87,.3),transparent 135px),
    linear-gradient(145deg,#fff4dc,#edf6f0);
}
.family-hub > header > i { background:linear-gradient(145deg,#51b8aa,#328f83); }
.identity-opportunity-list { background:#e6f4ee; }
.identity-claim-inbox { background:#fff0df; }
.tab-profile .panel { background:rgba(255,253,248,.76); }

/* Full-page experiences stay fresh and photographic. */
.tab-tree { background:#e9f5ef; }
.tab-tree .spatial-map-shell {
  background:
    radial-gradient(circle at 50% 38%,rgba(255,253,248,.9),transparent 255px),
    linear-gradient(160deg,#e7f5ef,#f5f1df);
}
.tab-tree .top,.tab-tree .top nav { background:rgba(255,249,238,.96); }
.person-page > header {
  color:#214b45;
  background:
    radial-gradient(circle at 84% 15%,color-mix(in srgb,var(--person-cover-b,#f2bd63) 30%,transparent),transparent 145px),
    linear-gradient(150deg,color-mix(in srgb,var(--person-cover-a,#58ae9f) 30%,#fff8e8),color-mix(in srgb,var(--person-cover-c,#82cbbb) 24%,#e8f5ef));
}
.person-page > header .text-button { color:#285e56; }
.person-page > header p { color:#2e6f65; }
.person-page > header em { color:rgba(37,79,72,.74); }
.person-avatar {
  border-color:rgba(255,255,255,.76);
  color:#2f514b;
  background:#ffd46a;
}
.timeline-page > header {
  color:#4d4538;
  background:
    radial-gradient(circle at 88% 16%,rgba(255,255,255,.25),transparent 150px),
    linear-gradient(155deg,#f5d480,#ee9a77);
}
.timeline-page > header .text-button { color:#6c5946; }
.timeline-page > header p { color:#7e5936; }
.timeline-page > header > span { color:rgba(76,61,45,.72); }
.reading-top { background:rgba(255,249,238,.96); }
.story-records,.story-owner-tools { background:rgba(255,253,248,.84); }
.consent-audience { background:#fff0cf; }
.deceased-governance { background:#fff6e5; }

@media (prefers-color-scheme:dark) {
  :root { color-scheme:light; }
}

/* V17 — one stable bilingual lockup across every primary tab. */
.brand-sign { min-width:0; align-items:center; gap:9px; }
.brand-wordmark {
  display:grid;
  min-width:0;
  align-content:center;
  gap:2px;
  line-height:1;
}
.brand-wordmark .brand-name {
  display:block;
  font-size:18px;
  line-height:1.05;
  white-space:nowrap;
}
.brand-wordmark > small {
  display:block;
  color:#de735d;
  font-family:Arial,Helvetica,sans-serif;
  font-size:11px;
  font-weight:700;
  line-height:1;
  letter-spacing:.16em;
  white-space:nowrap;
}
.welcome .brand-wordmark > small,
.first-light.intro .brand-wordmark > small { color:#d96f59; }
.top nav {
  padding-right:20px;
  padding-left:20px;
}
.tab-page-head {
  grid-template-columns:minmax(0,1fr) auto;
  gap:0;
  padding:8px 20px 24px;
}
.tab-page-head::before { content:none; display:none; }
.tab-page-head > img { display:none; }
.tab-page-head > .brand-sign {
  grid-column:1;
  grid-row:1;
  height:44px;
  margin:0;
}
.tab-page-head > .text-button {
  grid-column:2;
  grid-row:1;
  align-self:center;
}
.tab-page-head > .tab-page-title {
  grid-column:1/-1;
  grid-row:2;
  margin-top:18px;
}

/* V18 — use the approved prototype lockup asset; never reconstruct its typography. */
.brand-sign {
  width:132px;
  height:44px;
  display:flex;
  align-items:center;
}
.brand-sign .brand-lockup {
  display:block;
  width:132px;
  height:auto;
  max-height:44px;
  object-fit:contain;
  object-position:left center;
  filter:none;
}
.top nav .brand-sign,
.tab-page-head > .brand-sign {
  width:132px;
  height:44px;
}
.welcome .brand-sign,
.first-light.intro .brand-sign {
  width:146px;
  height:49px;
}
.welcome .brand-sign .brand-lockup,
.first-light.intro .brand-sign .brand-lockup {
  width:146px;
  max-height:49px;
}

/* V19 — calm, non-blocking AI processing feedback. */
.ai-processing-slot:empty { display:none; }
.ai-processing-state {
  display:flex;
  align-items:center;
  gap:12px;
  margin:18px 0;
  padding:14px 15px;
  border:1px solid rgba(34,132,119,.13);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(220,244,237,.74),rgba(255,248,224,.76));
}
.ai-processing-state > i {
  --progress:0%;
  position:relative;
  flex:0 0 34px;
  width:34px;
  height:34px;
  border-radius:50%;
  background:conic-gradient(var(--bright-teal,#279b88) var(--progress),rgba(39,155,136,.14) 0);
}
.ai-processing-state > i::after {
  content:"";
  position:absolute;
  inset:5px;
  border-radius:50%;
  background:#fffaf0;
}
.ai-processing-state > div { min-width:0; flex:1; }
.ai-processing-state b { display:block; color:#245e56; font-size:14px; line-height:1.35; }
.ai-processing-state p { margin:3px 0 0; color:var(--muted); font-size:11px; line-height:1.5; }
.ai-processing-state.failed { border-color:rgba(221,112,86,.18); background:#fff5ed; }
.ai-processing-state.failed > i { background:#df775f; }
.ai-processing-state.failed > i::after { content:"!"; display:grid; place-items:center; inset:0; color:white; background:transparent; font-style:normal; font-weight:800; }
.ai-processing-state .text-button { flex:0 0 auto; padding:7px 0; }
.processing-review { background:linear-gradient(180deg,#f5fbf8,#fffaf1); border:1px solid rgba(34,132,119,.12); }
.processing-review-note { margin:0 0 14px; color:var(--muted); font-size:12px; line-height:1.7; }
.processing-review fieldset { display:grid; gap:8px; padding:0; border:0; }
.processing-review legend { margin-bottom:8px; color:#52645e; font-size:12px; font-weight:700; }
.processing-review fieldset .candidate-choice { position:relative; display:grid; grid-template-columns:26px minmax(0,1fr); gap:10px; min-height:58px; margin:0; padding:12px; align-items:start; border:1px solid rgba(37,105,94,.13); border-radius:14px; background:rgba(255,255,255,.82); cursor:pointer; transition:border-color .16s ease,background .16s ease,transform .16s ease; }
.processing-review .candidate-choice input { position:absolute; width:1px; height:1px; margin:0; opacity:0; pointer-events:none; }
.processing-review .candidate-choice > i { display:grid; width:24px; height:24px; place-items:center; border:1.5px solid #b6c8c1; border-radius:8px; color:transparent; background:white; font-size:15px; font-style:normal; font-weight:800; transition:.16s ease; }
.processing-review .candidate-choice input:checked + i { border-color:#2b8e7f; color:white; background:#2b8e7f; box-shadow:0 3px 9px rgba(43,142,127,.2); }
.processing-review .candidate-choice:has(input:checked) { border-color:rgba(43,142,127,.42); background:#edf8f4; }
.processing-review .candidate-choice:has(input:focus-visible) { outline:3px solid rgba(43,142,127,.18); outline-offset:2px; }
.processing-review .candidate-choice > span { min-width:0; }
.processing-review .candidate-choice b { display:inline-block; margin:0 7px 3px 0; color:#8a7460; font-size:12px; }
.processing-review .candidate-choice strong { color:#29443d; font-size:14px; font-weight:700; }
.processing-review .candidate-choice small { display:block; margin-top:5px; color:#6f817a; font-size:12px; line-height:1.5; }
.candidate-person-match { padding:0; overflow:hidden; border:1px solid rgba(37,105,94,.13); border-radius:16px; background:rgba(255,255,255,.82); }
.processing-review fieldset .candidate-person-match .candidate-choice { border:0; border-radius:0; background:transparent; }
.processing-review fieldset .candidate-person-match .candidate-choice:has(input:checked) { background:#edf8f4; }
/* Keep the editable name as one calm vertical field; the generic fieldset row must not squeeze its label. */
.processing-review fieldset .candidate-name-correction {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  align-items:stretch;
  gap:7px;
  margin:0;
  padding:11px 12px 13px 48px;
  border-top:1px solid rgba(37,105,94,.09);
  color:#52645e;
  font-size:12px;
  line-height:1.4;
}
.processing-review fieldset .candidate-name-correction input {
  width:100%;
  min-width:0;
  min-height:46px;
  margin:0;
  padding:10px 12px;
  border-color:#ded8cb;
  background:#fffdf8;
  color:#29443d;
  font-size:16px;
  font-weight:700;
}
.processing-review fieldset .candidate-person-select {
  display:grid;
  gap:6px;
  margin:0;
  padding:11px 12px 13px 48px;
  border-top:1px solid rgba(37,105,94,.09);
  color:#48655d;
  font-size:12px;
}
.processing-review fieldset .candidate-person-select select { min-height:48px; padding:12px 38px 12px 13px; font-size:15px; }
.processing-review fieldset .candidate-person-select > strong { color:#277c6f; font-size:12px; font-weight:750; }
.processing-review fieldset .candidate-person-select small { margin:0; color:#74857e; font-size:11px; line-height:1.5; }
.processing-family-picker { display:grid; gap:6px; margin:14px 0; padding:13px 14px; border:1px solid rgba(43,142,127,.15); border-radius:15px; color:#29443d; background:rgba(255,255,255,.72); font-weight:700; }
.processing-family-picker select { min-height:48px; font-size:15px; }
.processing-family-picker small { color:#74827d; font-size:12px; font-weight:400; line-height:1.5; }
.manual-person-picker { display:grid; gap:11px; margin:16px 0; padding:14px; border:1px solid rgba(43,142,127,.16); border-radius:15px; background:rgba(255,255,255,.7); }
.manual-person-picker > div:first-child b,.manual-person-picker > div:first-child small { display:block; }
.manual-person-picker > div:first-child b { color:#29443d; font-size:14px; }
.manual-person-picker > div:first-child small { margin-top:3px; color:#74827d; font-size:12px; line-height:1.5; }
.manual-person-entry { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; }
.manual-existing-person { min-width:0; display:grid; gap:7px; padding-bottom:11px; border-bottom:1px solid rgba(43,142,127,.1); }
.manual-existing-person select { min-width:0; min-height:48px; font-size:14px; }
.manual-person-picker .person-combobox-trigger,
.manual-person-picker .person-combobox.open .person-combobox-trigger {
  border-color:#ded8cb;
  color:#304b43;
  background:#fffdf8;
  box-shadow:0 3px 12px rgba(73,66,51,.045);
}
.manual-person-picker .person-combobox-trigger > i,
.manual-person-picker .person-combobox.has-value .person-combobox-trigger > i {
  color:#815f48;
  background:#faeadc;
}
.manual-person-picker .person-combobox-trigger b { color:#2f4942; }
.manual-person-picker .person-combobox-trigger small { color:#7a8580; }
.manual-person-picker .person-combobox-panel {
  border-color:#e2dccf;
  background:#fffdf9;
}
.manual-person-picker .person-combobox-results > button {
  color:#314c44;
  background:transparent;
}
.manual-person-picker .person-combobox-results > button:active,
.manual-person-picker .person-combobox-results > button[aria-current="true"] {
  color:#2e4c44;
  background:#f8efe4;
}
.manual-person-picker .person-combobox-results > button > i {
  color:#805f49;
  background:#faeadc;
}
.person-combobox {
  position:relative;
  width:100%;
  min-width:0;
}
.person-picker-field,
#personComposer form > .person-picker-field {
  min-width:0;
  display:grid !important;
  gap:7px !important;
  color:#5b6e67;
  font-size:12px;
  font-weight:680;
}
.person-picker-field > span {
  color:#5b6e67;
  font-size:12px;
  font-weight:680;
}
.person-picker-field > small {
  margin:0 1px;
  color:#74857e;
  font-size:11px;
  font-weight:500;
  line-height:1.55;
}
[data-person-search-select] {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  min-height:1px !important;
  margin:0 !important;
  padding:0 !important;
  opacity:0;
  pointer-events:none;
}
.person-combobox-trigger {
  width:100%;
  min-height:58px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr) 22px;
  align-items:center;
  gap:11px;
  padding:9px 11px;
  border:1px solid rgba(43,111,96,.16);
  border-radius:15px;
  color:#34534a;
  background:rgba(255,255,255,.88);
  box-shadow:0 4px 14px rgba(53,83,72,.045);
  text-align:left;
  -webkit-tap-highlight-color:transparent;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.person-combobox-trigger > i {
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:50%;
  color:#55736a;
  background:#edf3ef;
  font-size:13px;
  font-style:normal;
  font-weight:750;
}
.person-combobox.has-value .person-combobox-trigger > i {
  color:#fff;
  background:linear-gradient(145deg,#55a899,#2f8276);
}
.person-combobox-trigger > span {
  min-width:0;
  display:grid;
  gap:3px;
}
.person-combobox-trigger b,
.person-combobox-trigger small {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.person-combobox-trigger b {
  color:#304b43;
  font-size:14px;
  font-weight:750;
}
.person-combobox-trigger small {
  color:#84918c;
  font-size:11px;
  font-weight:500;
}
.person-combobox-trigger > svg {
  width:20px;
  height:20px;
  fill:none;
  stroke:#768780;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-width:1.8;
  transition:transform .18s ease;
}
.person-combobox.open .person-combobox-trigger {
  border-color:rgba(43,142,127,.38);
  background:#fff;
  box-shadow:0 0 0 3px rgba(43,142,127,.09);
}
.person-combobox-trigger:disabled {
  color:#89948f;
  background:#f1f2ee;
  box-shadow:none;
  cursor:not-allowed;
}
.person-combobox.open .person-combobox-trigger > svg { transform:rotate(180deg); }
.person-combobox-panel {
  display:grid;
  gap:8px;
  margin-top:8px;
  padding:9px;
  border:1px solid rgba(46,105,91,.13);
  border-radius:17px;
  background:#fffdf9;
  box-shadow:0 14px 32px rgba(45,75,65,.1);
}
.person-combobox-panel[hidden] { display:none; }
.person-combobox-panel > header {
  display:grid;
  grid-template-columns:minmax(0,1fr) 40px;
  align-items:center;
  gap:7px;
}
.person-combobox-panel > header label {
  position:relative;
  display:block;
  margin:0;
}
.person-combobox-panel > header label > svg {
  position:absolute;
  z-index:1;
  top:50%;
  left:13px;
  width:19px;
  height:19px;
  fill:none;
  stroke:#668078;
  stroke-linecap:round;
  stroke-width:1.8;
  transform:translateY(-50%);
  pointer-events:none;
}
.person-select-filter {
  min-height:46px;
  padding:10px 13px 10px 40px;
  border:1px solid rgba(43,142,127,.18);
  border-radius:13px;
  color:#29483f;
  background:#f4f7f3;
  box-shadow:none;
  font-size:14px;
}
.person-select-filter:focus {
  border-color:rgba(43,142,127,.42);
  background:#fff;
  box-shadow:0 0 0 3px rgba(43,142,127,.09);
}
.person-select-filter::-webkit-search-cancel-button { opacity:.58; }
.person-combobox-panel > header > button {
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  padding:0 0 2px;
  border:0;
  border-radius:50%;
  color:#71817b;
  background:#f1f4f1;
  font-size:22px;
  font-weight:300;
  line-height:1;
}
.person-combobox-results {
  max-height:min(310px,42vh);
  display:grid;
  gap:3px;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.person-combobox-results > button {
  width:100%;
  min-height:54px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr) 22px;
  align-items:center;
  gap:10px;
  padding:7px 9px;
  border:0;
  border-radius:13px;
  color:#355149;
  background:transparent;
  text-align:left;
}
.person-combobox-results > button:active,
.person-combobox-results > button[aria-current="true"] { background:#edf7f3; }
.person-combobox-results > button > i {
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:50%;
  color:#2e776c;
  background:#e4f2ed;
  font-size:13px;
  font-style:normal;
  font-weight:750;
}
.person-combobox-trigger > i img,
.person-combobox-results > button > i img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.person-combobox-results > button.person-combobox-empty > i {
  color:#8a9691;
  background:#f0f2ef;
}
.person-combobox-results > button > span {
  min-width:0;
  display:grid;
  gap:3px;
}
.person-combobox-results > button b,
.person-combobox-results > button small {
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.person-combobox-results > button b { font-size:14px; font-weight:730; }
.person-combobox-results > button small { color:#82908b; font-size:11px; font-weight:500; }
.person-combobox-results > button > svg {
  width:19px;
  height:19px;
  fill:none;
  stroke:transparent;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-width:2;
}
.person-combobox-results > button[aria-current="true"] > svg { stroke:#2d877a; }
.person-combobox-grid .person-combobox-panel { padding:10px; }
.person-combobox-grid .person-combobox-results {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  max-height:min(350px,46vh);
}
.person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) {
  min-height:82px;
  grid-template-columns:1fr 18px;
  grid-template-rows:34px auto;
  justify-items:center;
  gap:4px 2px;
  padding:10px 7px 8px;
  border:1px solid rgba(43,111,96,.1);
  border-radius:14px;
  background:rgba(248,250,246,.88);
  text-align:center;
}
.person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > i {
  grid-column:1 / -1;
  width:34px;
  height:34px;
}
.person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > span {
  grid-column:1;
  grid-row:2;
  width:100%;
}
.person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > span b { font-size:14px; }
.person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > span small { display:none; }
.person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > svg {
  grid-column:2;
  grid-row:2;
  align-self:center;
}
.person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty)[aria-current="true"] {
  border-color:rgba(43,142,127,.34);
  background:#edf7f3;
  box-shadow:inset 0 0 0 1px rgba(43,142,127,.08);
}
.person-combobox-grid .person-combobox-no-result,
.person-combobox-grid .person-combobox-empty { grid-column:1 / -1; }
.story-clue-subject-picker .person-combobox-grid .person-combobox-panel {
  gap:12px;
  margin-top:4px;
  padding:4px 0 2px;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-panel > header {
  grid-template-columns:minmax(0,1fr) 38px;
  gap:6px;
}
.story-clue-subject-picker .person-combobox-grid .person-select-filter {
  min-height:44px;
  border:0;
  border-radius:14px;
  background:rgba(255,255,255,.68);
  box-shadow:inset 0 0 0 1px rgba(43,111,96,.08);
}
.story-clue-subject-picker .person-combobox-grid .person-select-filter:focus {
  background:#fff;
  box-shadow:inset 0 0 0 1px rgba(43,142,127,.28),0 0 0 3px rgba(43,142,127,.07);
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-panel > header > button {
  width:38px;
  height:38px;
  background:rgba(255,255,255,.54);
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-results {
  grid-template-columns:repeat(4,minmax(0,1fr));
  column-gap:4px;
  row-gap:8px;
  padding:1px 0 3px;
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) {
  position:relative;
  min-height:70px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  padding:7px 2px 6px;
  border:0;
  border-radius:13px;
  background:transparent;
  text-align:center;
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > i {
  flex:0 0 auto;
  width:36px;
  height:36px;
  overflow:hidden;
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > i img,
.story-clue-subject-picker .person-combobox-trigger > i img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > span {
  width:100%;
  display:block;
  line-height:18px;
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > span b {
  display:block;
  width:100%;
  overflow:hidden;
  color:#304b43;
  font-size:13px;
  font-weight:720;
  line-height:18px;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty) > svg {
  position:absolute;
  top:5px;
  right:5px;
  width:15px;
  height:15px;
}
.story-clue-subject-picker .person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty):active,
.story-clue-subject-picker .person-combobox-grid .person-combobox-results > button:not(.person-combobox-empty)[aria-current="true"] {
  background:rgba(227,243,237,.76);
  box-shadow:none;
}
.person-combobox-no-result {
  min-height:120px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:5px;
  padding:18px;
  color:#7e8c86;
  text-align:center;
}
.moments-feed-more {
  position:relative;
  display:flex;
  min-height:64px;
  align-items:center;
  justify-content:center;
  gap:9px;
  color:#88928d;
  font-size:12px;
}
.moments-feed-more button {
  min-height:42px;
  padding:8px 18px;
  border:0;
  border-radius:999px;
  color:#4d7f75;
  background:rgba(66,139,125,.08);
  font:650 12px/1.4 inherit;
}
.moments-feed-more > i:not([data-moments-feed-sentinel]) {
  width:14px;
  height:14px;
  border:2px solid rgba(54,122,109,.16);
  border-top-color:#4b8d80;
  border-radius:50%;
  animation:family-light-spin .8s linear infinite;
}
.moments-feed-more [data-moments-feed-sentinel] { position:absolute; inset:auto 0 -1px; height:1px; pointer-events:none; }
.moments-feed-more.is-sentinel { min-height:18px; }
.moments-feed-more.is-complete { min-height:52px; opacity:.72; }
@keyframes family-light-spin { to { transform:rotate(360deg); } }
.person-combobox-no-result > i { font-size:22px; font-style:normal; }
.person-combobox-no-result > b { color:#596d66; font-size:13px; }
.person-combobox-no-result > small { font-size:11px; }
.manual-person-entry input { min-width:0; min-height:44px; }
.manual-person-entry button { min-height:44px; padding:8px 13px; border:1px solid rgba(43,142,127,.25); border-radius:12px; color:#277c6f; background:#f2faf7; font-size:13px; font-weight:700; }
.manual-person-list { display:flex; flex-wrap:wrap; gap:7px; }
.manual-person-list:empty { display:none; }
.manual-person-list:not(:empty)::before { content:"已经关联"; width:100%; color:#78837e; font-size:11px; font-weight:650; }
.manual-person-list label { display:flex; align-items:center; gap:7px; margin:0; padding:6px 7px 6px 10px; border:1px solid #ded8cb; border-radius:999px; color:#36534b; background:#fffdf8; box-shadow:0 3px 10px rgba(48,76,67,.04); font-size:13px; }
.manual-person-list label.existing { padding-left:5px; }
.manual-person-list label.existing > i {
  width:28px;
  height:28px;
  display:grid;
  flex:none;
  place-items:center;
  border-radius:50%;
  color:#34766b;
  background:#e5f2ed;
  font-size:11px;
  font-style:normal;
  font-weight:750;
}
.manual-person-list label span { min-width:0; }
.manual-person-list label span b { display:block; color:#36534b; font-size:12px; font-weight:700; }
.manual-person-list label button { display:grid; width:25px; height:25px; min-height:0; padding:0; place-items:center; border:0; border-radius:50%; color:#6d7c77; background:rgba(255,255,255,.7); font-size:17px; line-height:1; }
.manual-person-list label span small { display:block; color:#71827b; font-size:11px; }
.processing-review .processing-discard { width:100%; min-height:44px; margin-top:9px; border:1px solid rgba(179,105,83,.2); border-radius:13px; color:#9b5e4d; background:#fff8f4; font-size:13px; font-weight:700; }
.processing-review .processing-discard-note { display:block; margin:7px 4px 0; color:#8b817b; font-size:11px; line-height:1.55; text-align:center; }
.story-fact-fields { grid-template-columns:1fr; gap:2px; }
.story-fact-fields label:last-child { grid-column:auto; }
.story-fact-fields label { white-space:nowrap; }
.story-time-editor { margin:14px 0 17px; padding:15px; border:1px solid rgba(42,104,93,.13); border-radius:18px; background:rgba(255,255,255,.74); }
.story-time-editor > header { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px; }
.story-time-editor > header b { color:#344d46; font-size:15px; }
.story-time-editor > header small { color:#89938f; font-size:11px; }
.time-precision-choice { display:grid; grid-template-columns:1fr 1fr; gap:4px; margin-bottom:14px; padding:4px; border-radius:13px; background:#edf2ef; }
.time-precision-choice label { position:relative; display:block; margin:0; cursor:pointer; }
.time-precision-choice input { position:absolute; width:1px; min-height:1px; opacity:0; pointer-events:none; }
.time-precision-choice span { display:grid; min-height:38px; place-items:center; border-radius:10px; color:#74827d; font-size:13px; font-weight:650; transition:.16s ease; }
.time-precision-choice input:checked + span { color:#256e63; background:white; box-shadow:0 3px 10px rgba(37,77,68,.09); }
.time-precision-choice label:has(input:focus-visible) span { outline:3px solid rgba(43,142,127,.17); }
.time-editor-panel { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.18fr); gap:10px; }
.time-editor-panel[hidden] { display:none; }
.time-editor-panel label,.time-editor-location {
  display:grid;
  min-width:0;
  gap:7px;
  margin-bottom:12px;
  color:#66736e;
  font-size:12px;
  line-height:1.35;
}
.time-editor-panel input,.time-editor-location input {
  display:block;
  width:100%;
  min-width:0;
  height:48px;
  min-height:48px;
  box-sizing:border-box;
  padding:0 14px;
  border-color:#e0e6e2;
  background:#fff;
  line-height:normal;
}
.time-editor-panel input[type="date"] {
  max-width:100%;
  padding-top:0;
  padding-bottom:0;
}
.time-editor-location { margin-bottom:0; padding-top:13px; border-top:1px solid rgba(42,104,93,.1); }
@media (max-width:540px) {
  .time-editor-panel { grid-template-columns:1fr; gap:0; }
}
.visibility-choice-group { display:grid; gap:9px; margin:0 0 15px; padding:0; border:0; }
.visibility-choice-group legend { margin-bottom:9px; color:#344d46; font-size:16px; font-weight:750; }
.visibility-choice-group > label { position:relative; display:grid; grid-template-columns:26px minmax(0,1fr); gap:12px; min-height:68px; margin:0; padding:13px 14px; align-items:center; border:1px solid rgba(42,104,93,.15); border-radius:16px; background:rgba(255,255,255,.88); cursor:pointer; }
.visibility-choice-group input { position:absolute; width:1px; min-height:1px; opacity:0; pointer-events:none; }
.visibility-choice-group label > i { display:block; width:24px; height:24px; border:2px solid #b7c8c2; border-radius:50%; background:white; box-shadow:inset 0 0 0 5px white; }
.visibility-choice-group input:checked + i { border-color:#2b8e7f; background:#2b8e7f; }
.visibility-choice-group label:has(input:checked) { border-color:rgba(43,142,127,.48); background:#edf8f4; box-shadow:0 5px 16px rgba(43,142,127,.08); }
.visibility-choice-group label:has(input:focus-visible) { outline:3px solid rgba(43,142,127,.18); outline-offset:2px; }
.visibility-choice-group span,.visibility-choice-group b,.visibility-choice-group small { display:block; }
.visibility-choice-group b { color:#29443d; font-size:16px; line-height:1.25; }
.visibility-choice-group small { margin-top:4px; color:#687a74; font-size:13px; line-height:1.45; }
.visibility-form { margin:18px 0 4px; padding:18px; border:1px solid rgba(42,104,93,.14); border-radius:20px; background:linear-gradient(150deg,#f6fbf8,#fff9ef); }
.visibility-form h3 { margin:0 0 5px; color:#29443d; font-family:Georgia,"Songti SC",serif; font-size:22px; font-weight:500; }
.visibility-form > p { margin:0 0 17px; color:#6d7d77; font-size:13px; line-height:1.6; }
.visibility-form-actions { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; }
.visibility-form-actions .text-button { min-width:58px; min-height:48px; font-size:14px; }
.story-confirm-sharing { padding:16px; border:1px solid rgba(42,104,93,.14); border-radius:19px; background:linear-gradient(155deg,rgba(240,249,245,.92),rgba(255,251,242,.86)); }
.story-confirm-sharing > header { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.story-confirm-sharing > header div,.story-confirm-sharing > header b,.story-confirm-sharing > header small { display:block; }
.story-confirm-sharing > header b { color:#29443d; font-size:16px; }
.story-confirm-sharing > header small { margin-top:3px; color:#71807a; font-size:11px; line-height:1.45; }
.confirm-private-switch { position:relative; display:flex; flex:none; align-items:center; gap:7px; margin:0; padding:6px 9px; border:1px solid rgba(42,104,93,.13); border-radius:999px; color:#66766f; background:rgba(255,255,255,.72); cursor:pointer; font-size:12px; }
.confirm-private-switch input,.story-confirm-sharing fieldset input { position:absolute; width:1px; min-height:1px; opacity:0; pointer-events:none; }
.confirm-private-switch i { position:relative; display:block; width:30px; height:18px; border-radius:999px; background:#ccd8d3; transition:.16s ease; }
.confirm-private-switch i::after { content:""; position:absolute; top:3px; left:3px; width:12px; height:12px; border-radius:50%; background:white; box-shadow:0 1px 4px rgba(28,58,51,.22); transition:.16s ease; }
.confirm-private-switch input:checked + i { background:#2b8e7f; }
.confirm-private-switch input:checked + i::after { transform:translateX(12px); }
.confirm-private-switch:has(input:focus-visible) { outline:3px solid rgba(43,142,127,.17); }
.story-confirm-sharing fieldset { margin:14px 0 0; padding:12px 0 0; border:0; border-top:1px solid rgba(42,104,93,.11); }
.story-confirm-sharing fieldset[hidden] { display:none; }
.story-confirm-sharing legend { padding:0; color:#72807b; font-size:11px; }
.story-confirm-sharing fieldset > div { display:flex; flex-wrap:wrap; gap:7px; margin-top:9px; }
.story-confirm-sharing fieldset label { position:relative; display:flex; align-items:center; gap:6px; min-height:36px; margin:0; padding:7px 10px; border:1px solid rgba(42,104,93,.14); border-radius:11px; color:#66766f; background:rgba(255,255,255,.72); cursor:pointer; font-size:12px; }
.story-confirm-sharing fieldset label > i { display:grid; width:17px; height:17px; place-items:center; border:1.5px solid #b5c6bf; border-radius:6px; color:transparent; background:white; font-size:11px; font-style:normal; font-weight:800; }
.story-confirm-sharing fieldset label:has(input:checked) { border-color:rgba(43,142,127,.34); color:#285f56; background:#edf8f4; }
.story-confirm-sharing fieldset input:checked + i { border-color:#2b8e7f; color:white; background:#2b8e7f; }
.story-confirm-sharing fieldset label:has(input:focus-visible) { outline:3px solid rgba(43,142,127,.17); }
.audio-segment{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;margin-top:10px;padding:10px 12px;border:1px solid rgba(38,92,82,.12);border-radius:14px;background:rgba(255,255,255,.72)}
.audio-segment>span{font-size:12px;color:var(--muted)}
.audio-segment audio{width:100%;min-width:0;height:36px}
.story-audio-segments{display:grid;gap:10px;margin:22px 0}
.story-audio-segments>div>small{display:block;margin:0 0 5px 4px;color:var(--muted);font-size:12px}
.story-person-clues{margin:24px 0;padding:20px;border:1px solid rgba(218,151,55,.24);border-radius:22px;background:linear-gradient(145deg,rgba(255,249,231,.92),rgba(255,255,255,.92))}
.story-person-clues>span{color:#9b6a28;font-size:12px;font-weight:700}
.story-person-clues h2{margin:5px 0;font-size:22px}
.story-person-clues>p{margin:0 0 14px;color:var(--muted);font-size:13px}
.story-person-clues form{display:grid;gap:10px;padding:14px 0;border-top:1px solid rgba(38,92,82,.1)}
.story-person-clues form>div{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.story-person-clues form>div small{color:var(--muted)}
.story-person-clues .story-clue-form>header{display:grid;gap:4px}
.story-person-clues .story-clue-form>header>div{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.story-person-clues .story-clue-form>header b{color:var(--deep);font-size:17px}
.story-person-clues .story-clue-form>header small{color:var(--muted);font-size:11px;line-height:1.5}
.story-clue-relation{display:grid;gap:8px;margin:2px 0;padding:13px;border:1px solid rgba(43,142,127,.15);border-radius:15px;background:rgba(238,248,244,.62)}
.story-clue-relation legend{padding:0 5px;color:#4f6e65;font-size:12px;font-weight:700}
.story-clue-relation>label{display:grid;grid-template-columns:auto minmax(0,1fr);gap:7px;align-items:center;margin:0}
.story-clue-relation>label>span{color:#596f68;font-size:13px}
.story-clue-relation select{min-width:0;min-height:46px;font-size:15px}
.story-clue-subject-picker{display:grid!important;gap:7px!important;align-items:stretch!important;width:100%}
.story-clue-subject-picker>span{color:#405f56!important;font-size:13px!important;font-weight:750!important}
.story-clue-subject-picker>small{color:#74857e!important;font-size:11px!important}
.story-clue-kinship-picker select[name="kinshipType"]{grid-column:2}
.story-clue-relation>small{color:#277c6f;font-size:12px;line-height:1.5}
[data-story-clue-path]:empty{display:none}
.story-clue-path-resolution{display:grid;gap:7px;margin:4px 0 2px;padding:15px;border:1px solid rgba(43,142,127,.2);border-radius:17px;background:linear-gradient(145deg,rgba(237,249,244,.96),rgba(255,253,246,.96))}
.story-clue-path-resolution>span{color:#b67532;font-size:11px;font-weight:800;letter-spacing:.08em}
.story-clue-path-resolution>h3{margin:0;color:var(--deep);font-size:18px}
.story-clue-path-resolution>p{margin:0;color:var(--muted);font-size:12px;line-height:1.6}
.story-clue-path-resolution .relationship-path-preview{margin-top:5px;padding:0;background:transparent}
.story-clue-path-resolution .relationship-path-choice{display:grid;gap:8px;padding:11px;border-radius:14px;background:rgba(255,255,255,.82)}
.story-clue-saved{display:flex;align-items:center;gap:11px;margin:10px 0;padding:13px 14px;border-top:1px solid rgba(38,92,82,.1);color:#2b695e}
.story-clue-saved>i{display:grid;flex:0 0 26px;width:26px;height:26px;place-items:center;border-radius:50%;color:white;background:#2b8e7f;font-style:normal;font-weight:800}
.story-clue-saved b,.story-clue-saved small{display:block}.story-clue-saved small{margin-top:3px;color:var(--muted);font-size:11px}
.person-life-timeline{margin:18px 20px 22px;padding:20px 18px;border-radius:22px;background:linear-gradient(145deg,rgba(255,250,237,.96),rgba(239,248,243,.9));box-shadow:0 12px 32px rgba(64,78,65,.06)}
.person-life-timeline>header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:17px}
.person-life-timeline>header span{display:block;margin-bottom:5px;color:#b37431;font-size:11px;font-weight:800;letter-spacing:.1em}
.person-life-timeline>header h2{margin:0;color:var(--deep);font-size:18px;line-height:1.35}
.person-life-timeline>header>small{flex:0 0 auto;color:var(--muted);font-size:11px}
.person-life-list{display:grid;gap:0}
.person-life-list>article{position:relative;padding:0 0 17px 19px;border-left:1.5px solid rgba(45,140,128,.2)}
.person-life-list>article:last-child{padding-bottom:0}
.person-life-list>article>i{position:absolute;top:7px;left:-4.5px;width:8px;height:8px;border:2px solid #f8f4e9;border-radius:50%;background:#43a295;box-shadow:0 0 0 3px rgba(67,162,149,.11)}
.person-life-card{padding:0 0 2px 4px}
.person-life-card>span{display:block;margin-bottom:7px;color:#74827d;font-size:11px;line-height:1.45}
.person-life-card>p{display:flex;align-items:baseline;gap:9px;margin:0;color:var(--deep);line-height:1.5}
.person-life-card>p b{flex:0 0 auto;color:#a96f35;font-size:11px;font-weight:750}
.person-life-card>p strong{font-size:16px;font-weight:720}
.person-life-card>button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;padding:8px 10px;border:0;border-radius:11px;color:#587069;background:rgba(255,255,255,.66);text-align:left}
.person-life-card>button small{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.person-life-card>button em{flex:0 0 auto;color:var(--green);font-size:11px;font-style:normal;font-weight:700}
.person-life-card>small{display:block;margin-top:7px;color:var(--muted);font-size:11px}
.person-life-card details{margin-top:7px}
.person-life-card details summary{color:#687b75;font-size:11px;cursor:pointer}
.person-life-card details button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:12px;margin-top:6px;padding:8px 10px;border:0;border-radius:10px;color:var(--deep);background:rgba(255,255,255,.58);text-align:left}
.person-life-card details button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.person-life-card details button small{flex:0 0 auto;color:var(--muted);font-size:11px}
.person-life-timeline>footer{margin-top:16px;padding-top:13px;border-top:1px solid rgba(38,92,82,.09);color:#7b8984;font-size:11px;line-height:1.6}
.person-life-timeline.is-empty{padding:20px;background:linear-gradient(145deg,rgba(250,247,237,.92),rgba(241,247,242,.8));box-shadow:none}
.person-life-timeline.is-empty>header{margin-bottom:10px}
.person-life-timeline.is-empty>p{margin:0;color:#6f7f79;font-size:13px;line-height:1.65}
.person-life-timeline.is-empty>button{margin-top:11px;padding:0;border:0;color:var(--green);background:transparent;font-size:12px;font-weight:750}

/* V20 — one quiet brand rail; the tab bar already names every page. */
.top.app-brand-header,
.tab-tree .top.app-brand-header {
  height:66px;
  padding:0 !important;
  color:#29443d;
  background:rgba(255,250,240,.97) !important;
  border-bottom:1px solid rgba(42,96,86,.09);
  box-shadow:0 5px 18px rgba(56,76,66,.055);
}
.top.app-brand-header nav,
.tab-tree .top.app-brand-header nav {
  display:grid;
  grid-template-columns:124px minmax(0,1fr) 58px;
  gap:9px;
  width:100%;
  height:66px;
  margin:0;
  padding:8px 16px;
  align-items:center;
  border:0;
  background:transparent;
  box-shadow:none;
}
.app-brand-header .brand-sign,
.top.app-brand-header nav .brand-sign {
  width:124px;
  height:42px;
}
.app-brand-header .brand-sign .brand-lockup {
  width:124px;
  max-height:42px;
}
.top.app-brand-header .brand-slogan {
  min-width:0;
  margin:0;
  padding:4px 0 4px 10px;
  border-left:2px solid rgba(226,114,88,.46);
  color:#7e6a50;
  font-family:Georgia,"Songti SC",serif;
  font-size:11px;
  line-height:1.35;
  letter-spacing:.015em;
}
.brand-slogan span,
.brand-slogan strong { display:block; }
.brand-slogan strong {
  color:#337d72;
  font-weight:650;
}
.app-account {
  display:grid;
  justify-items:end;
  align-content:center;
  gap:1px;
  min-width:0;
}
.app-account > b {
  display:block;
  max-width:58px;
  overflow:hidden;
  color:#38534c;
  font-size:12px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.top .app-account [data-logout],
.tab-home .top .app-account [data-logout],
.tab-tree .top .app-account [data-logout],
.tab-record .top .app-account [data-logout],
.tab-moments .top .app-account [data-logout] {
  display:inline-flex !important;
  min-width:44px;
  min-height:30px;
  padding:2px 0;
  align-items:center;
  justify-content:flex-end;
  border:0;
  color:#8a7566;
  background:transparent;
  font-size:11px;
}
.tab-profile .content { padding-top:10px; }

@media (max-width:350px) {
  .top.app-brand-header nav,
  .tab-tree .top.app-brand-header nav {
    grid-template-columns:102px minmax(0,1fr) 50px;
    gap:6px;
    padding-right:12px;
    padding-left:12px;
  }
  .app-brand-header .brand-sign,
  .top.app-brand-header nav .brand-sign,
  .app-brand-header .brand-sign .brand-lockup { width:102px; }
  .top.app-brand-header .brand-slogan { padding-left:7px; }
  .app-account > b { max-width:50px; }
}

/* V21 — one checkbox language across confirmation, family and privacy screens. */
input[type="checkbox"] {
  -webkit-appearance:none;
  appearance:none;
  display:grid;
  flex:0 0 24px;
  width:24px;
  height:24px;
  min-width:24px;
  min-height:24px;
  margin:0;
  padding:0;
  place-items:center;
  border:1.5px solid #b6c8c1;
  border-radius:8px;
  color:transparent;
  background:#fff;
  box-shadow:none;
  cursor:pointer;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
input[type="checkbox"]::after {
  content:"✓";
  color:transparent;
  font-size:15px;
  font-weight:800;
  line-height:1;
}
input[type="checkbox"]:checked {
  border-color:#2b8e7f;
  color:#fff;
  background:#2b8e7f;
  box-shadow:0 3px 9px rgba(43,142,127,.2);
}
input[type="checkbox"]:checked::after { color:#fff; }
input[type="checkbox"]:disabled { cursor:wait; opacity:.58; }
.related-person-picker label:has(> input:checked),
[data-story-family-shares] label:has(> input:checked),
.person-family-scopes label:has(> input:checked),
.tab-profile .purpose-list label:has(> input:checked),
.gentle-check:has(> input:checked) {
  border-color:rgba(43,142,127,.4);
  background:#edf8f4;
}
.gentle-check {
  min-height:54px;
  margin:6px 0 12px;
  padding:12px 13px;
  border:1px solid rgba(42,104,93,.14);
  border-radius:14px;
  color:#52645e;
  background:rgba(255,255,255,.82);
  font-size:13px;
  cursor:pointer;
}
.person-family-scopes input,
.related-person-picker input,
[data-story-family-shares] input,
.purpose-list input,
.gentle-check input {
  width:24px;
  height:24px;
  min-height:24px;
}

/* V22 — inviting a relative feels collaborative, not administrative. */
.tab-home .family-summary-panel {
  margin:0;
  padding:8px 0 12px;
  border:0;
}
.tab-home .family-head {
  min-height:54px;
  justify-content:flex-end;
  margin:0;
  padding:0;
  border:0;
}
.family-invite-entry {
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:10px;
  min-width:0;
  min-height:52px;
  padding:7px 10px 7px 8px;
  align-items:center;
  border:1px solid rgba(50,143,131,.12);
  border-radius:17px;
  color:#38534c;
  background:linear-gradient(135deg,rgba(255,253,247,.86),rgba(230,245,238,.72));
  text-align:left;
  box-shadow:0 5px 16px rgba(52,92,78,.045);
}
.family-invite-entry:active {
  background:#edf7f2;
  transform:scale(.99);
}
.family-invite-entry .family-invite-icon {
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border-radius:12px;
  color:#318b7f;
  background:#dff2eb;
}
.family-invite-entry svg {
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.family-invite-entry > span:nth-child(2) { min-width:0; }
.family-invite-entry b,
.family-invite-entry small { display:block; }
.family-invite-entry b {
  font-size:13px;
  font-weight:700;
  line-height:1.25;
}
.family-invite-entry small {
  margin-top:2px;
  color:#7a857f;
  font-size:11px;
  font-weight:400;
  line-height:1.3;
  white-space:nowrap;
}
.family-invite-entry > em {
  color:#df775f;
  font-size:21px;
  font-style:normal;
  font-weight:300;
}

/* V23 — fewer controls, larger natural tap targets, and a mobile-native photo viewer. */
.tab-home .family-summary-panel {
  padding:2px 0 8px;
}
.tab-home .family-head {
  min-height:44px;
}
.family-invite-entry {
  display:inline-flex;
  width:auto;
  min-height:44px;
  gap:7px;
  padding:4px 2px 4px 8px;
  align-items:center;
  border:0;
  border-radius:12px;
  color:#347f74;
  background:transparent;
  box-shadow:none;
  font-size:12px;
  text-align:left;
}
.family-invite-entry:active {
  color:#256b62;
  background:rgba(224,241,234,.72);
}
.family-invite-entry .family-invite-icon {
  width:30px;
  height:30px;
  border-radius:10px;
  color:#3b978a;
  background:rgba(220,241,234,.82);
}
.family-invite-entry svg {
  width:21px;
  height:21px;
  stroke-width:1.75;
}
.family-invite-entry > b {
  font-size:12px;
  font-weight:650;
}
.tab-home .home-story-heading {
  min-height:38px;
  align-items:center;
  gap:10px;
}
.tab-home .home-story-heading > h2 { min-width:0; }
.tab-home .home-story-heading > .family-invite-entry {
  flex:none;
  margin-left:auto;
}
.tab-home #shareBox:not(:empty) {
  margin:0 0 18px;
  padding:0 2px;
}
.story-preview {
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.story-preview:active {
  background:rgba(255,250,241,.72);
}
.story-preview:focus-visible {
  outline:3px solid rgba(48,174,162,.3);
  outline-offset:3px;
}
.story-preview-bottom > em {
  display:inline-flex;
  flex:none;
  align-items:center;
  gap:5px;
  color:#347f74;
  font-size:11px;
  font-style:normal;
  font-weight:650;
}
.story-preview-bottom > em.needs-confirmation { color:#df6a52; }
.story-preview-bottom > em i {
  font-size:14px;
  font-style:normal;
  font-weight:400;
}
.profile-signout {
  margin:10px 0 34px;
  padding:18px 0 max(8px,env(safe-area-inset-bottom));
  border-top:1px solid rgba(54,74,67,.1);
  text-align:center;
}
.profile-signout > button {
  min-width:120px;
  min-height:44px;
  padding:8px 18px;
  border:0;
  color:#8b7569;
  background:transparent;
  font-size:13px;
}
.story-image-viewer {
  width:100vw;
  height:100vh;
  height:100dvh;
  padding:0;
  overflow:hidden;
  touch-action:none;
  user-select:none;
}
.media-lightbox-image {
  position:relative;
  display:grid;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  padding:max(54px,calc(env(safe-area-inset-top) + 12px)) 0 max(48px,calc(env(safe-area-inset-bottom) + 12px));
  overflow:hidden;
  place-items:center;
  touch-action:none;
}
.media-lightbox-image::before {
  content:"";
  position:absolute;
  inset:-36px;
  z-index:0;
  opacity:0;
  background-image:var(--viewer-image);
  background-position:center;
  background-size:cover;
  filter:blur(28px) brightness(.42) saturate(.82);
  transform:scale(1.08);
  transition:opacity .2s ease;
}
.story-image-viewer.image-ready .media-lightbox-image::before {
  opacity:.68;
}
.media-lightbox-image > img {
  position:relative;
  z-index:1;
  grid-area:1/1;
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  transform-origin:center;
  will-change:transform;
}
.media-lightbox-image > img[hidden] { display:none; }
.media-lightbox-image > span {
  position:relative;
  z-index:2;
  grid-area:1/1;
  color:rgba(255,255,255,.76);
  font-size:13px;
}
.media-lightbox > .media-lightbox-close {
  z-index:3;
  border:0;
  outline:0;
  background:rgba(0,0,0,.24);
  -webkit-tap-highlight-color:transparent;
}
.media-lightbox > .media-lightbox-nav {
  z-index:2;
  top:50%;
  right:auto;
  width:42px;
  height:56px;
  border:0;
  border-radius:14px;
  color:rgba(255,255,255,.9);
  background:rgba(0,0,0,.2);
  font-size:35px;
  font-weight:300;
  transform:translateY(-50%);
}
.media-lightbox > .media-lightbox-nav.previous { left:8px; }
.media-lightbox > .media-lightbox-nav.next { right:8px; left:auto; }
.media-lightbox > .media-lightbox-nav[hidden] { display:none; }
.media-lightbox-count {
  position:absolute;
  z-index:2;
  bottom:max(20px,env(safe-area-inset-bottom));
  left:50%;
  min-width:48px;
  padding:6px 10px;
  border-radius:999px;
  color:white;
  background:rgba(0,0,0,.32);
  font-size:12px;
  text-align:center;
  transform:translateX(-50%);
}
.media-lightbox-count:empty { display:none; }
@media (max-width:520px) {
  .story-image-viewer { padding:0; }
  .story-image-viewer > .media-lightbox-image { width:100%; height:100%; }
}

/* Story cards stay composed; reading pages preserve the complete photograph. */
.story-reading > .story-media.single figure {
  min-height:0;
  aspect-ratio:auto;
  background:linear-gradient(145deg,#eee9df,#e2ebe6);
}
.story-reading > .story-media.single .story-image-button { height:auto; }
.story-reading > .story-media.single img {
  width:100%;
  height:auto;
  min-height:0;
  max-height:none;
  object-fit:contain;
}

.tab-loading {
  min-height:calc(100dvh - 176px);
  display:grid;
  place-content:center;
  justify-items:center;
  gap:15px;
  padding:24px 24px 110px;
  color:var(--muted);
  background:var(--canvas);
  font-size:12px;
  letter-spacing:.08em;
}
.tab-loading > .opening-light { display:block; width:52px; height:3px; }

/* V24 — 同堂是家庭的回应中心：待办在前，动态居中，聊天在后。 */
.moments-task-module {
  margin:4px 0 28px;
  padding:22px 18px 8px;
  border-radius:20px 7px 20px 7px;
  background:
    radial-gradient(circle at 96% 0,rgba(243,197,87,.24),transparent 135px),
    rgba(255,253,248,.82);
  box-shadow:0 8px 25px rgba(59,68,58,.05);
}
.moments-task-module > header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding-bottom:14px;
}
.moments-task-module > header span {
  color:#b46849;
  font-size:11px;
  font-weight:750;
  letter-spacing:.08em;
}
.moments-task-module > header h2 {
  margin:4px 0 0;
  font-family:Georgia,"Songti SC",serif;
  font-size:25px;
  font-weight:500;
}
.moments-task-module > header > b {
  display:grid;
  flex:0 0 34px;
  width:34px;
  height:34px;
  place-items:center;
  border-radius:50%;
  color:white;
  background:#e6775d;
  font-size:14px;
}
.moments-story-tasks {
  border-top:1px solid rgba(54,74,67,.1);
}
.moments-story-task {
  width:100%;
  min-height:74px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  padding:12px 0;
  border:0;
  border-bottom:1px solid rgba(54,74,67,.09);
  color:#334a43;
  background:transparent;
  text-align:left;
}
.moments-story-task > i {
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border-radius:11px;
  color:#267c70;
  background:#dff1eb;
  font-size:12px;
  font-style:normal;
  font-weight:750;
}
.moments-story-task.confirm > i,
.moments-story-task.attention > i { color:#b75f49; background:#ffeadf; }
.moments-story-task > span { min-width:0; }
.moments-story-task small,
.moments-story-task b,
.moments-story-task em { display:block; }
.moments-story-task small {
  color:#8b8177;
  font-size:11px;
}
.moments-story-task b {
  margin:2px 0;
  overflow:hidden;
  font-family:Georgia,"Songti SC",serif;
  font-size:16px;
  font-weight:500;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.moments-story-task em {
  color:#707c76;
  font-size:11px;
  font-style:normal;
}
.moments-story-task > strong {
  color:#347f74;
  font-size:11px;
  font-weight:650;
  white-space:nowrap;
}
.moments-story-task.processing > strong { color:#8b8177; }
.moments-consent-tasks,
.moments-question-tasks {
  padding:18px 0 8px;
  border-top:1px solid rgba(54,74,67,.1);
}
.moments-consent-tasks > h3,
.moments-question-tasks > h3 {
  margin:0 0 10px;
  color:#6d7771;
  font-size:12px;
}
.moments-consent-tasks > article {
  padding:13px 0;
  border-top:1px solid rgba(54,74,67,.08);
}
.moments-consent-tasks > article:first-of-type { border-top:0; }
.moments-consent-tasks b,
.moments-consent-tasks span { display:block; }
.moments-consent-tasks b { font-family:Georgia,"Songti SC",serif; font-size:16px; font-weight:500; }
.moments-consent-tasks span { margin:5px 0 8px; color:#737d77; font-size:11px; line-height:1.55; }
.moments-consent-tasks .secondary { width:auto; min-height:40px; padding:7px 11px; }
.moments-question-tasks .relay-question {
  margin-top:10px;
  border:0;
  background:#fff9ee;
}
.moments-task-empty {
  margin:0;
  padding:14px 0 18px;
  border-top:1px solid rgba(54,74,67,.1);
  color:#747e78;
  font-size:13px;
  line-height:1.65;
}
.tab-moments .activity-module {
  margin:0;
  padding:24px 0 28px;
}
.tab-moments .activity-heading span { color:#c16c50; }
.tab-moments .relay-module {
  margin:0;
  border-top:1px solid rgba(54,74,67,.1);
}

/* Keep the profile hierarchy authoritative over earlier component revisions. */
.tab-profile .profile-content {
  padding:18px 18px 112px;
  background:
    radial-gradient(circle at 100% 4%,rgba(245,193,73,.13),transparent 230px),
    linear-gradient(180deg,#f8f2e7,#f4eee5);
}
.tab-profile .profile-setting > summary {
  display:grid;
  grid-template-columns:44px minmax(0,1fr) 20px;
  min-height:73px;
  align-items:center;
  justify-content:initial;
  gap:13px;
  padding:12px 16px;
}
.tab-profile .profile-setting > summary::after { content:none !important; }
.tab-profile .profile-setting > summary > span { display:grid; min-width:0; gap:4px; }
.tab-profile .profile-setting > summary > em { display:block; }
@media (max-width:390px) {
  .tab-profile .profile-content { padding-right:14px; padding-left:14px; }
}

/* V28 — 用人物头像表达故事的讲述者和关联人物。 */
.story-preview-people {
  display:flex;
  flex:1 1 auto;
  min-width:0;
  align-items:center;
  gap:9px;
}
.story-person-avatar {
  position:relative;
  display:grid;
  flex:0 0 auto;
  width:34px;
  height:34px;
  overflow:hidden;
  place-items:center;
  border:1px solid rgba(48,118,106,.16);
  border-radius:50%;
  color:#2f756a;
  background:linear-gradient(145deg,#e0f3ed,#f6e7bc);
  font-size:13px;
  font-style:normal;
  font-weight:750;
}
.story-person-avatar.unclaimed {
  border-style:dashed;
  border-color:rgba(80,119,109,.38);
  background:#f2f0e8;
}
.story-person-avatar img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.story-preview-people > span:not(.story-person-avatar):not(.story-people-stack) {
  display:grid;
  min-width:0;
  gap:2px;
}
.story-preview-people b,
.story-preview-people small {
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.story-preview-people b {
  color:#405851;
  font-size:12px;
  font-weight:700;
}
.story-preview-people small {
  color:#89918d;
  font-size:11px;
}
.story-people-stack {
  display:flex;
  flex:0 0 auto;
  align-items:center;
  margin-left:3px;
  padding-left:6px;
}
.story-people-stack .story-person-avatar {
  width:27px;
  height:27px;
  margin-left:-7px;
  border-width:2px;
  border-color:#fffdf8;
  font-size:11px;
  box-shadow:0 2px 7px rgba(47,72,64,.08);
}
.story-people-stack > i {
  display:grid;
  width:27px;
  height:27px;
  margin-left:-7px;
  place-items:center;
  border:2px solid #fffdf8;
  border-radius:50%;
  color:#6e7d77;
  background:#edf1ed;
  font-size:11px;
  font-style:normal;
  font-weight:700;
}
.story-preview-bottom > em { margin-left:auto; }
.story-reading > header h1 { margin-bottom:13px; }
.story-reading-people {
  display:grid;
  gap:13px;
  margin:17px 0 4px;
  padding-top:15px;
  border-top:1px solid rgba(52,91,80,.1);
}
.story-participant {
  display:inline-flex;
  min-width:0;
  min-height:42px;
  align-items:center;
  gap:9px;
  padding:4px 7px 4px 4px;
  border:0;
  border-radius:999px;
  color:#3e554e;
  background:#f4f6f1;
  text-align:left;
}
button.story-participant {
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
button.story-participant:active { background:#e8f2ed; }
button.story-participant:focus-visible {
  outline:3px solid rgba(48,174,162,.22);
  outline-offset:2px;
}
.story-participant .story-person-avatar {
  width:36px;
  height:36px;
}
.story-participant > span:not(.story-person-avatar) {
  display:grid;
  min-width:0;
  gap:1px;
}
.story-participant b,
.story-participant small {
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.story-participant b { font-size:12px; }
.story-participant small { color:#819089; font-size:11px; }
.story-participant.narrator {
  width:max-content;
  max-width:100%;
  padding-right:13px;
  background:#edf7f3;
}
.story-mentioned-people > small {
  display:block;
  margin-bottom:8px;
  color:#87918d;
  font-size:11px;
  font-weight:650;
  letter-spacing:.04em;
}
.story-mentioned-people > div {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}
@media (max-width:390px) {
  .story-people-stack .story-person-avatar:nth-of-type(n+3) { display:none; }
  .story-preview-bottom { gap:7px; }
  .story-preview-bottom > em { font-size:11px; }
}

/* Internal pilot entry must remain obvious on the light login canvas. */
.login-screen .first-pilot-entry {
  overflow:hidden;
  border:1px solid rgba(210,145,42,.26);
  background:linear-gradient(145deg,#fff1c9,#ffe7ad);
  box-shadow:0 8px 22px rgba(173,118,42,.1);
}
.login-screen .first-pilot-entry > summary {
  display:flex;
  min-height:52px;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:#805719;
  font-size:14px;
  font-weight:750;
}
.login-screen .first-pilot-entry > summary::before {
  content:"新";
  display:grid;
  width:25px;
  height:25px;
  place-items:center;
  border-radius:50%;
  color:#fffaf0;
  background:#d79232;
  font-size:11px;
}
.login-screen .first-pilot-entry[open] > summary {
  border-bottom:1px solid rgba(210,145,42,.18);
}
.login-screen .first-pilot-entry .login-card {
  margin:8px;
  border-color:rgba(210,145,42,.14);
  background:#fffdf8;
}

/* Relationship editing stays inside the person page and changes only one family-tree line. */
.person-relations > header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:15px;
}
.person-relations > header h2,
.person-relations > header small {
  display:block;
  margin:0;
}
.person-relations > header small {
  margin-top:3px;
  color:#89938f;
  font-size:11px;
}
.person-relations > header > button,
.person-relation-list article > button {
  min-height:36px;
  padding:0 13px;
  border:1px solid rgba(42,118,104,.16);
  border-radius:999px;
  color:#267869;
  background:#edf8f3;
  font-size:12px;
  font-weight:720;
  white-space:nowrap;
}
.person-relation-list {
  border-top:1px solid rgba(52,91,80,.1);
}
.person-relation-list article {
  display:flex;
  flex-wrap:wrap;
  min-height:58px;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:10px 2px;
  border-bottom:1px solid rgba(52,91,80,.08);
}
.person-relation-list article > span {
  display:grid;
  flex:1 1 150px;
  min-width:0;
  gap:3px;
}
.person-relation-list article b {
  overflow:hidden;
  color:#344c45;
  font-size:14px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.person-relation-list article small {
  color:#8a9691;
  font-size:11px;
}
.person-relations-empty {
  margin:0;
  color:#77847f;
  font-size:13px;
  line-height:1.7;
}
#relationshipManagerComposer:not(:empty) {
  margin-top:17px;
}

/* A person stays one person; family-specific records remain available as quiet provenance. */
.identity-claim-button {
  width:100%;
  min-height:46px;
  margin-top:14px;
  border:0;
  border-radius:14px;
  color:white;
  background:linear-gradient(135deg,#42a99b,#2d8b7f);
  box-shadow:0 8px 18px rgba(42,133,120,.14);
  font:inherit;
  font-size:13px;
  font-weight:750;
}
.identity-claim-button:active { transform:scale(.985); }
.identity-later-note {
  display:block;
  margin:9px 2px 0;
  color:#73827d;
  font-size:11px;
  line-height:1.55;
}
.person-family-overview {
  margin:18px 20px 0;
  padding:17px 18px;
  border:1px solid rgba(42,111,98,.11);
  border-radius:18px;
  background:rgba(249,252,248,.78);
}
.person-family-overview > header {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.person-family-overview > header h2 {
  margin:0;
  color:#31574f;
  font-size:17px;
}
.person-family-overview > header p {
  max-width:260px;
  margin:5px 0 0;
  color:#7a8883;
  font-size:11px;
  line-height:1.55;
}
.person-family-overview > header > span {
  display:grid;
  width:30px;
  height:30px;
  flex:0 0 auto;
  place-items:center;
  border-radius:50%;
  color:#2d776b;
  background:#e6f3ee;
  font-size:12px;
  font-weight:750;
}
.person-family-chips {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:13px;
}
.person-family-chips i {
  display:flex;
  min-height:29px;
  align-items:center;
  gap:6px;
  padding:0 10px;
  border:1px solid rgba(54,91,81,.08);
  border-radius:999px;
  color:#51665f;
  background:rgba(255,255,255,.82);
  font-size:11px;
  font-style:normal;
}
.person-family-chips i::before {
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--family-color);
  content:"";
}
.person-family-overview > details {
  margin-top:13px;
  padding-top:11px;
  border-top:1px solid rgba(47,99,87,.1);
}
.person-family-overview > details > summary,
.person-source-records > details > summary,
.person-relation-sources > summary,
.person-duplicate-tools > summary {
  list-style:none;
  cursor:pointer;
}
.person-family-overview > details > summary::-webkit-details-marker,
.person-source-records > details > summary::-webkit-details-marker,
.person-relation-sources > summary::-webkit-details-marker,
.person-duplicate-tools > summary::-webkit-details-marker { display:none; }
.person-family-overview > details > summary {
  color:#39786d;
  font-size:11px;
  font-weight:700;
}
.person-family-management {
  margin-top:9px;
  overflow:hidden;
  border:1px solid rgba(47,99,87,.09);
  border-radius:13px;
  background:rgba(255,255,255,.58);
}
.person-family-management article {
  display:flex;
  min-height:52px;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:7px 9px 7px 12px;
}
.person-family-management article + article { border-top:1px solid rgba(47,99,87,.08); }
.person-family-management article span,
.person-family-management article b,
.person-family-management article small { display:block; }
.person-family-management article b { color:#405d55; font-size:12px; }
.person-family-management article small { margin-top:2px; color:#8a9691; font-size:11px; }
.person-family-management article > div { display:flex; flex:0 0 auto; flex-wrap:wrap; justify-content:flex-end; gap:6px; }
.person-family-management article button {
  min-height:34px;
  padding:0 11px;
  border:1px solid rgba(43,121,106,.13);
  border-radius:10px;
  color:#2e796d;
  background:#edf7f3;
  font:inherit;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
}
.person-family-management article button.danger-text {
  color:#9a6b61;
  background:#fbf4ef;
}
.person-family-transfer-panel {
  position:relative;
  margin-top:14px;
  padding:20px 16px 16px;
  border:1px solid rgba(47,99,87,.12);
  border-radius:16px;
  background:#fffdf8;
  box-shadow:0 12px 30px rgba(45,81,71,.08);
}
.person-family-transfer-panel > span {
  color:#d58e4f;
  font-size:11px;
  font-weight:750;
  letter-spacing:.08em;
}
.person-family-transfer-panel > h3 {
  margin:6px 38px 12px 0;
  color:#31554d;
  font-size:17px;
  line-height:1.35;
}
.person-family-transfer-panel form > p,
.person-family-transfer-panel form > small {
  display:block;
  margin:0;
  color:#71817b;
  font-size:11px;
  line-height:1.65;
}
.person-family-transfer-panel form > p b { color:#37675d; font-size:13px; }
.person-family-transfer-list {
  display:grid;
  gap:8px;
  margin:13px 0 10px;
}
.person-family-transfer-choice {
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  min-height:58px;
  align-items:center;
  gap:10px;
  margin:0;
  padding:9px 11px;
  border:1px solid rgba(47,99,87,.11);
  border-radius:14px;
  background:rgba(247,251,248,.84);
}
.person-family-transfer-choice:has(input:checked) {
  border-color:rgba(45,142,126,.38);
  background:#edf7f3;
  box-shadow:0 0 0 2px rgba(56,155,138,.08);
}
.person-family-transfer-choice input { width:21px; height:21px; margin:0; accent-color:var(--green); }
.person-family-transfer-choice span,
.person-family-transfer-choice b,
.person-family-transfer-choice small { display:block; min-width:0; }
.person-family-transfer-choice b { color:#3c5b53; font-size:13px; }
.person-family-transfer-choice small { margin-top:2px; color:#7f8d88; font-size:11px; line-height:1.45; }
.person-family-transfer-choice.blocked { opacity:.58; }
.person-family-transfer-empty { margin:0; color:#8b746c; font-size:12px; }
.person-family-transfer-actions { display:flex; align-items:center; gap:10px; margin-top:15px; }
.person-family-transfer-actions .primary { min-height:42px; }
.person-family-transfer-actions .text-button { flex:0 0 auto; white-space:nowrap; }
.descendant-branch-panel {
  position:relative;
  margin-top:14px;
  padding:19px 16px 16px;
  border:1px solid rgba(47,99,87,.12);
  border-radius:16px;
  background:#fffdf8;
  box-shadow:0 12px 30px rgba(45,81,71,.08);
}
.descendant-branch-panel > span { color:#d58e4f; font-size:11px; font-weight:750; letter-spacing:.08em; }
.descendant-branch-panel > h3 { margin:6px 38px 5px 0; color:#31554d; font-size:17px; line-height:1.35; }
.descendant-branch-panel > p { margin:0 0 13px; color:#7b8984; font-size:11px; line-height:1.65; }
.descendant-branch-list { overflow:hidden; border-top:1px solid rgba(47,99,87,.08); }
.descendant-branch-choice {
  display:grid;
  grid-template-columns:22px minmax(0,1fr);
  min-height:55px;
  align-items:center;
  gap:11px;
  margin:0;
  padding:8px 2px;
  border-bottom:1px solid rgba(47,99,87,.08);
  background:transparent;
}
.descendant-branch-choice input { width:22px; height:22px; margin:0; accent-color:var(--green); }
.descendant-branch-choice span,.descendant-branch-choice b,.descendant-branch-choice small { display:block; min-width:0; }
.descendant-branch-choice b { color:#3b5b53; font-size:13px; }
.descendant-branch-choice small { margin-top:3px; color:#84918d; font-size:11px; line-height:1.4; }
.descendant-branch-choice.needs-review small { color:#a47655; }
.descendant-branch-existing,.descendant-branch-empty small { display:block; margin-top:10px; color:#7c8985; font-size:11px; line-height:1.55; }
.descendant-branch-actions { display:flex; align-items:center; gap:10px; margin-top:14px; }
.descendant-branch-actions .primary { min-height:42px; }
.descendant-branch-empty { padding:15px 2px 4px; border-top:1px solid rgba(47,99,87,.08); }
.descendant-branch-empty b { display:block; color:#426057; font-size:13px; }
.person-source-records {
  margin:16px 20px 34px;
  padding:0 !important;
  overflow:hidden;
  border:1px solid rgba(57,91,80,.1);
  border-radius:18px;
  background:rgba(255,253,248,.64);
}
.person-source-records > details > summary {
  display:flex;
  min-height:68px;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 16px;
}
.person-source-records > details > summary span,
.person-source-records > details > summary b,
.person-source-records > details > summary small { display:block; }
.person-source-records > details > summary b { color:#425a53; font-size:14px; }
.person-source-records > details > summary small { margin-top:4px; color:#89948f; font-size:11px; }
.person-source-records > details > summary > em {
  flex:0 0 auto;
  color:#3b7c70;
  font-size:11px;
  font-style:normal;
  font-weight:700;
}
.person-source-records > details[open] > summary {
  border-bottom:1px solid rgba(57,91,80,.09);
  background:rgba(240,247,242,.55);
}
.person-source-record-list { padding:0 15px; }
.person-source-record-list article:last-child { border-bottom:0; }
.person-source-records > details > p {
  margin:0;
  padding:12px 16px 15px;
  border-top:1px solid rgba(57,91,80,.08);
  color:#7e8985;
  font-size:11px;
  line-height:1.65;
}
.person-source-records #personEditComposer:not(:empty) { padding:0 15px 15px; }
.person-duplicate-tools {
  margin:0 15px 15px;
  padding:11px 0 0;
  border-top:1px solid rgba(57,91,80,.08);
}
.person-duplicate-tools > summary { color:#6d7f79; font-size:11px; }
.person-duplicate-tools form { margin-top:11px; }
.person-relation-list article.has-conflict { background:rgba(255,244,220,.48); }
.person-relation-sources { flex:0 0 auto; }
.person-relation-sources > summary {
  min-height:34px;
  padding:9px 11px;
  border:1px solid rgba(42,118,104,.13);
  border-radius:999px;
  color:#2f786c;
  background:#f0f8f4;
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
}
.person-relation-sources[open] {
  display:block;
  width:100%;
  flex-basis:100%;
  margin-top:3px;
}
.person-relation-sources[open] > summary {
  width:max-content;
  margin-left:auto;
}
.person-relation-sources > div {
  margin-top:8px;
  overflow:hidden;
  border:1px solid rgba(48,94,82,.09);
  border-radius:12px;
  background:rgba(247,250,247,.75);
}
.person-relation-sources p {
  display:flex;
  min-height:45px;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0;
  padding:6px 8px 6px 11px;
}
.person-relation-sources p + p { border-top:1px solid rgba(48,94,82,.08); }
.person-relation-sources p span,
.person-relation-sources p b,
.person-relation-sources p small { display:block; }
.person-relation-sources p b { color:#52665f; font-size:11px; }
.person-relation-sources p small { margin-top:2px; color:#929c98; font-size:11px; }
.person-relation-sources p button {
  min-height:32px;
  padding:0 11px;
  border:0;
  border-radius:9px;
  color:#347a6f;
  background:#e8f4ef;
  font:inherit;
  font-size:11px;
  font-weight:700;
}
.relationship-manager-sheet {
  display:grid;
  gap:14px;
  padding:18px;
  border:1px solid rgba(55,112,97,.13);
  border-radius:20px;
  background:linear-gradient(150deg,#fffdf8,#f3faf5);
  box-shadow:0 12px 30px rgba(59,91,78,.08);
}
.relationship-manager-sheet > span {
  color:#d18835;
  font-size:11px;
  font-weight:750;
  letter-spacing:.12em;
}
.relationship-manager-sheet h3,
.relationship-manager-sheet p {
  margin:0;
}
.relationship-manager-sheet h3 {
  color:#304b43;
  font-size:18px;
}
.relationship-manager-sheet p,
.relationship-manager-sheet > small {
  color:#73817c;
  font-size:12px;
  line-height:1.65;
}
.relationship-direction-question {
  display:grid;
  gap:9px;
  padding:14px 15px;
  border:1px solid rgba(54,112,97,.11);
  border-radius:16px;
  background:linear-gradient(135deg,rgba(237,247,242,.96),rgba(255,249,238,.96));
}
.relationship-direction-question > span {
  color:#75877f;
  font-size:11px;
  font-weight:750;
  letter-spacing:.08em;
}
.relationship-direction-question > p {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  color:#425a52;
  font-size:15px;
  line-height:1.55;
}
.relationship-direction-question strong {
  max-width:100%;
  padding:5px 9px;
  overflow:hidden;
  border-radius:9px;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:15px;
  font-weight:760;
}
.relationship-direction-question strong.relative {
  color:#9b503f;
  background:#fff0e9;
}
.relationship-direction-question strong.subject {
  color:#276b60;
  background:#e5f4ee;
}
.relationship-direction-question em {
  color:#66766f;
  font-style:normal;
}
.relationship-manager-sheet label {
  display:grid;
  gap:7px;
  color:#5b6e67;
  font-size:12px;
  font-weight:680;
}
.relationship-manager-sheet select {
  width:100%;
  min-height:48px;
  padding:0 42px 0 14px;
  border:1px solid rgba(55,101,88,.17);
  border-radius:14px;
  color:#304b43;
  background-color:#fff;
  font-size:15px;
}
.relationship-manager-sheet .person-picker-field {
  gap:6px !important;
}
.relationship-manager-sheet .person-combobox-trigger {
  min-height:54px;
  grid-template-columns:36px minmax(0,1fr) 18px;
  gap:10px;
  padding:8px 10px;
  border-color:rgba(52,98,86,.14);
  border-radius:14px;
  background:#fff;
  box-shadow:none;
}
.relationship-manager-sheet .person-combobox.open .person-combobox-trigger {
  border-color:rgba(43,142,127,.3);
  background:#fff;
  box-shadow:none;
}
.relationship-manager-sheet .person-combobox-trigger > span,
.relationship-manager-sheet .person-combobox-results > button > span {
  margin:0;
  padding:0;
  border-radius:0;
  background:transparent;
}
.relationship-manager-sheet .person-combobox-panel {
  gap:3px;
  margin-top:4px;
  padding:4px 0 0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.relationship-manager-sheet .person-combobox-panel > header {
  grid-template-columns:1fr;
  padding:0;
}
.relationship-manager-sheet .person-combobox-panel > header > button {
  display:none;
}
.relationship-manager-sheet .person-select-filter {
  min-height:44px;
  border-color:rgba(52,98,86,.13);
  border-radius:12px;
  background:#fff;
}
.relationship-manager-sheet .person-combobox-results {
  gap:0;
  padding:2px 0 0;
}
.relationship-manager-sheet .person-combobox-results > button {
  min-height:52px;
  grid-template-columns:36px minmax(0,1fr) 18px;
  gap:10px;
  padding:7px 10px;
  border-bottom:1px solid rgba(52,91,80,.07);
  border-radius:0;
}
.relationship-manager-sheet .person-combobox-results > button:last-child {
  border-bottom:0;
}
.relationship-manager-sheet .person-combobox-results > button:active,
.relationship-manager-sheet .person-combobox-results > button[aria-current="true"] {
  background:rgba(232,246,240,.72);
}
.relationship-manager-sheet [data-relationship-path-preview]:empty {
  display:none;
}
.relationship-path-preview {
  display:grid;
  gap:11px;
  padding:14px;
  border-radius:16px;
  background:#edf7f2;
}
.relationship-path-preview > span {
  color:#778780;
  font-size:11px;
  font-weight:740;
  letter-spacing:.08em;
}
.relationship-path-preview > div {
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
}
.relationship-path-preview > div b {
  padding:6px 9px;
  border-radius:999px;
  color:#365d52;
  background:#fff;
  font-size:12px;
  font-weight:720;
}
.relationship-path-preview > div i {
  color:#8ba49b;
  font-size:12px;
  font-style:normal;
}
.relationship-path-preview > p,
.relationship-path-choice small,
.relationship-path-loading {
  margin:0;
  color:#70827b;
  font-size:11px;
  line-height:1.6;
}
.relationship-path-choice {
  padding-top:3px;
}
.relationship-path-choice select {
  background-color:#fffdf9;
}
.parent-scope-sheet fieldset {
  display:grid;
  gap:10px;
  margin:0;
  padding:14px;
  border:1px solid rgba(55,112,97,.12);
  border-radius:16px;
  background:rgba(255,255,255,.72);
}
.parent-scope-sheet legend {
  padding:0 6px;
  color:#a06c35;
  font-size:11px;
  font-weight:750;
}
.parent-scope-sheet fieldset > p {
  color:#52675f;
  font-size:13px;
  line-height:1.65;
}
.parent-scope-sheet fieldset > div {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.parent-scope-sheet .candidate-choice {
  display:flex;
  min-height:54px;
  align-items:center;
  gap:10px;
  padding:10px 11px;
  border:1px solid rgba(55,112,97,.13);
  border-radius:14px;
  color:#40564f;
  background:#fffdf9;
  cursor:pointer;
}
.parent-scope-sheet .candidate-choice:has(input:checked) {
  border-color:rgba(43,142,127,.42);
  background:#edf8f4;
}
.parent-scope-sheet .candidate-choice > span {
  display:grid;
  min-width:0;
  gap:2px;
}
.parent-scope-sheet .candidate-choice b {
  overflow:hidden;
  font-size:14px;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.parent-scope-sheet .candidate-choice small {
  overflow:hidden;
  color:#7e8b86;
  font-size:11px;
  font-weight:500;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.relationship-manager-actions,
.relationship-delete-confirm > div {
  display:flex;
  align-items:center;
  gap:9px;
}
.relationship-delete-entry {
  justify-self:start;
  padding:6px 0;
  border:0;
  color:#a6645b;
  background:transparent;
  font-size:12px;
}
.relationship-delete-confirm {
  display:grid;
  gap:8px;
  padding:14px;
  border-radius:14px;
  background:#fff2ec;
}
.relationship-delete-confirm b {
  color:#7f453f;
  font-size:13px;
}
.relationship-delete-confirm p {
  color:#885f58;
}
.relationship-delete-confirm button[data-confirm-delete-relationship] {
  min-height:38px;
  padding:0 13px;
  border:0;
  border-radius:999px;
  color:#fff;
  background:#b66b5f;
  font-size:12px;
  font-weight:720;
}
@media (max-width:390px) {
  .parent-scope-sheet fieldset > div { grid-template-columns:1fr; }
}
@media (max-width:390px) {
  .person-relations > header {
    align-items:flex-start;
  }
  .person-relations > header > button {
    padding:0 11px;
  }
}

/* V27 — 日光家族光脉：人物是主角，关系退成一张温暖、清晰的光网。 */
.tab-tree {
  background:#f8f5ee;
}
.tab-tree .top,
.tab-tree .top nav {
  background:rgba(255,252,246,.96);
}
.tab-tree .spatial-map-shell {
  background-color:#f8f5ee;
  background-image:
    radial-gradient(ellipse at 12% 4%,rgba(243,197,87,.17),transparent 36%),
    radial-gradient(ellipse at 92% 94%,rgba(81,184,170,.13),transparent 42%),
    linear-gradient(160deg,#fcf9f2 0%,#f7f5ee 52%,#f4f7f1 100%);
}

.tab-tree .network-tree-actions {
  top:12px;
  right:12px;
  gap:2px;
  padding:4px;
  border:1px solid rgba(80,99,91,.1);
  border-radius:16px;
  background:rgba(255,252,246,.88);
  box-shadow:0 10px 28px rgba(48,67,60,.1);
  backdrop-filter:blur(16px) saturate(1.15);
}
.tab-tree .network-tree-actions > button {
  display:flex;
  width:auto;
  height:38px;
  min-height:38px;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:7px 9px;
  border:0;
  border-radius:12px;
  color:#536761;
  background:transparent;
  box-shadow:none;
  font-size:11px;
  font-weight:680;
  line-height:1;
  letter-spacing:0;
  backdrop-filter:none;
}
.tab-tree .network-tree-actions > button:active {
  background:rgba(49,118,106,.08);
  transform:scale(.96);
}
.tab-tree .network-tree-actions svg,
.network-recenter svg {
  width:18px;
  height:18px;
  flex:none;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.tab-tree .network-tree-actions .network-tree-add {
  padding-right:10px;
  color:#fffdf8;
  background:#ef7b62;
  box-shadow:0 5px 13px rgba(214,97,74,.22);
}
.tab-tree .network-tree-actions .network-tree-add:active {
  background:#df6b53;
}

.network-recenter {
  min-height:40px;
  gap:6px;
  padding:7px 11px;
  border:1px solid rgba(80,99,91,.12);
  border-radius:14px;
  color:#45665e;
  background:rgba(255,252,246,.9);
  box-shadow:0 8px 22px rgba(48,67,60,.1);
  backdrop-filter:blur(16px) saturate(1.12);
}
.network-recenter span {
  font-size:11px;
  font-weight:680;
}

.family-map path {
  stroke:#708984;
  stroke-width:1.45;
  opacity:.74;
  filter:none;
}
.family-map path.parent-under {
  stroke:#fffdf8;
  stroke-width:4.8;
  opacity:.94;
  vector-effect:none;
}
.family-map path.parent,
.family-map path.couple-child,
.family-map path.sibling-parent {
  stroke:#59766f;
  stroke-width:1.85;
  opacity:.84;
}
.family-map path.spouse-bond-under {
  stroke:rgba(229,149,116,.18);
  stroke-width:11;
  opacity:1;
  vector-effect:none;
}
.family-map path.spouse {
  stroke:#df8d70;
  stroke-width:2;
  opacity:.96;
}
.family-map .spouse-joint {
  fill:#f3c557;
  stroke:#fffdf8;
  stroke-width:1.5;
}
.family-map path.sibling-rail,
.family-map path.sibling-stem {
  stroke:#81938e;
  opacity:.6;
}
.family-map path.sibling-rail {
  stroke-width:1.4;
}
.family-map path.sibling-stem {
  stroke-width:1.25;
}
.family-map path.family-branch-rail,
.family-map path.sibling-stem.parent-backed {
  stroke:#59766f;
  stroke-width:1.85;
  opacity:.84;
}
.family-map path.parent.adoptive-parent-edge,
.family-map path.sibling-parent.adoptive-parent-edge,
.family-map path.family-branch-rail.adoptive-parent-edge,
.family-map path.sibling-stem.parent-backed.adoptive-parent-edge {
  stroke:#8fa69f;
  opacity:.56;
}
.family-map path.sibling-rail.neutral {
  stroke-dasharray:none;
}
.family-map path.clue-path {
  stroke:#978e81;
  stroke-width:1.1;
  stroke-dasharray:3 5;
  opacity:.55;
}

.family-map .branch-zones .family-zone-group {
  mix-blend-mode:multiply;
  pointer-events:none;
}
.family-map .branch-zones .family-zone-shape {
  opacity:.058;
}
.family-map .branch-zones .family-zone-bridge {
  fill:none;
  stroke-width:24;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.042;
  filter:none;
  vector-effect:none;
}
.family-map[data-layout="cluster"] .branch-zones .family-zone-shape {
  opacity:.058;
}
.family-map[data-layout="cluster"] .branch-zones .family-zone-bridge {
  stroke-width:24;
  opacity:.042;
}
.family-map .branch-zones .family-zone-mark {
  opacity:.72;
}
.family-map .branch-zones .family-zone-label {
  font-family:inherit;
  font-size:12px;
  font-weight:750;
  letter-spacing:.04em;
  opacity:.58;
}

.family-map .network-person,
.family-map .network-person.partnered {
  width:70px;
  min-height:86px;
  gap:4px;
  padding:0;
  border:0;
  border-radius:50%;
  background:transparent;
  box-shadow:none;
  filter:none;
  transform:translate(-50%,-25px);
  transition:left .42s cubic-bezier(.2,.76,.2,1),top .42s cubic-bezier(.2,.76,.2,1),transform .24s cubic-bezier(.2,.76,.2,1),opacity .18s ease,filter .2s ease;
}
::view-transition-group(*) {
  animation-duration:.4s;
  animation-timing-function:cubic-bezier(.2,.76,.2,1);
}
::view-transition-old(root),
::view-transition-new(root) {
  animation-duration:.24s;
}
.family-map .network-person::before {
  content:"";
  position:absolute;
  z-index:-1;
  top:25px;
  left:50%;
  width:var(--node-hit-size,64px);
  height:var(--node-hit-size,64px);
  transform:translate(-50%,-50%);
}
.family-map .network-person:active {
  transform:translate(-50%,-25px) scale(.95);
}
.family-map .network-person > i,
.family-map .network-person.partnered > i {
  position:relative;
  display:grid;
  width:50px;
  height:50px;
  flex:none;
  padding:2px;
  overflow:visible;
  place-items:stretch;
  border:0;
  border-radius:50%;
  color:var(--portrait-ink,#45665e);
  background:var(--family-ring,var(--family-color,#7ea69b));
  box-shadow:0 7px 18px rgba(42,66,58,.12);
  font-style:normal;
  font-weight:650;
}
.family-map .network-person > i > span,
.family-map .network-person > i > img {
  display:grid;
  width:100%;
  height:100%;
  place-items:center;
  overflow:hidden;
  border-radius:50%;
  object-fit:cover;
}
.family-map .network-person > i > span {
  color:var(--portrait-ink,#45665e);
  background:linear-gradient(145deg,var(--portrait-bg,#e7f0ec),#fffaf1);
  font-family:Georgia,"Songti SC","STSong",serif;
  font-size:18px;
  font-style:normal;
  font-weight:650;
}
.family-map .network-person-copy {
  display:block;
  width:72px;
  min-width:0;
  padding:3px 2px 4px;
  border-radius:0;
  background:radial-gradient(ellipse at 50% 48%,rgba(248,245,238,.97) 0 48%,rgba(248,245,238,.76) 65%,transparent 79%);
  box-shadow:none;
  text-align:center;
  transition:opacity .18s ease,transform .18s ease;
}
.family-map .network-person-copy b {
  color:#2b403a;
  font-size:13px;
  font-weight:680;
  line-height:1.25;
  letter-spacing:.01em;
}
.family-map .network-person-copy small {
  max-height:17px;
  margin-top:1px;
  color:#788781;
  font-size:11px;
  font-weight:520;
  line-height:1.35;
  transition:max-height .18s ease,opacity .18s ease,transform .18s ease;
}
.family-map .network-person.me {
  filter:none;
}
.family-map .network-person.me > i {
  color:var(--portrait-ink,#45665e);
  background:var(--family-ring,var(--family-color,#7ea69b));
  box-shadow:0 0 0 2px rgba(239,123,98,.18),0 9px 20px rgba(75,72,52,.16);
}
.family-map .network-person.me > i::after {
  content:"";
  position:absolute;
  top:-4px;
  right:-4px;
  width:9px;
  height:9px;
  border:2px solid #fffdf8;
  border-radius:50%;
  background:#f3c557;
  box-shadow:0 2px 5px rgba(127,94,25,.2);
}
.family-map .network-person.me .network-person-copy::after {
  content:"";
  display:block;
  width:14px;
  height:2px;
  margin:4px auto 0;
  border-radius:999px;
  background:#ef7b62;
}
.family-map .network-person.multi-family > i,
.family-map .network-person:not(.me) > i {
  background:var(--family-ring,var(--family-color,#7ea69b));
  box-shadow:0 7px 18px rgba(42,66,58,.12);
}
.family-map .network-person.unclaimed:not(.me) > i {
  border:0;
  outline:1px dashed rgba(88,108,100,.7);
  outline-offset:3px;
  box-shadow:0 5px 14px rgba(42,66,58,.08);
}
.family-map .network-person.clue {
  opacity:.68;
}
.family-map .network-person.clue > i {
  border:0;
  outline:1px dashed rgba(117,106,92,.72);
  outline-offset:3px;
  color:var(--portrait-ink);
  background:var(--family-ring);
  box-shadow:none;
}
.family-map .network-person.focused > i {
  animation:network-focus-light 1.15s ease;
}
@keyframes network-focus-light {
  42% { box-shadow:0 0 0 7px rgba(81,184,170,.2),0 10px 22px rgba(42,66,58,.15); transform:translateY(-2px); }
}

/* 人物聚焦：保留家谱方位，只在人物周围腾出一小块安静空间。 */
.family-map.is-person-focus svg,
.family-map.is-person-focus .branch-zones {
  opacity:.22;
  transition:opacity .28s ease;
}
.family-map.is-person-focus .network-person:not(.focus-primary) {
  opacity:.28;
  transform:translate(calc(-50% + var(--focus-shift-x,0px)),calc(-25px + var(--focus-shift-y,0px)));
  filter:saturate(.72);
}
.family-map.is-person-focus .network-person.focus-connected {
  opacity:.68;
  filter:saturate(.9);
}
.family-map .network-person.focus-primary {
  z-index:8;
  opacity:1;
  transform:translate(-50%,-25px) scale(1.34);
  filter:none;
}
.family-map .network-person.focus-primary > i {
  box-shadow:0 0 0 6px rgba(255,252,246,.74),0 16px 38px rgba(38,86,76,.24);
}
.family-map .network-person.focus-primary .network-person-copy {
  opacity:0;
  transform:translateY(3px);
}
.network-focus-card {
  position:absolute;
  z-index:10;
  display:grid;
  gap:7px;
  padding:14px 15px 13px;
  border:1px solid rgba(255,255,255,.82);
  border-radius:18px;
  color:#304a43;
  background:rgba(255,252,246,.94);
  box-shadow:0 18px 42px rgba(48,72,63,.16);
  backdrop-filter:blur(18px) saturate(1.12);
  animation:network-focus-card-in .3s cubic-bezier(.2,.76,.2,1) both;
}
.network-focus-card header,
.network-focus-card footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.network-focus-card header > span {
  color:#d06f58;
  font-size:11px;
  font-weight:760;
  letter-spacing:.08em;
}
.network-focus-actions > button {
  display:flex;
  min-width:58px;
  height:32px;
  min-height:30px;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:0 10px;
  border:1px solid rgba(47,118,105,.1);
  border-radius:999px;
  color:#3d6259;
  background:rgba(255,255,255,.56);
  font-size:11px;
  font-weight:760;
  line-height:1;
}
.network-focus-actions > button i { margin-top:-3px; font-style:normal; font-size:14px; transition:transform .18s ease; }
.network-focus-actions > button[aria-expanded="true"] i { transform:rotate(180deg) translateY(-2px); }
.network-focus-actions { position:relative; }
.network-focus-menu {
  position:absolute;
  z-index:3;
  top:36px;
  right:0;
  display:grid;
  width:132px;
  padding:6px;
  border:1px solid rgba(53,91,81,.12);
  border-radius:14px;
  background:rgba(255,253,248,.98);
  box-shadow:0 15px 34px rgba(42,68,60,.18);
}
.network-focus-menu[hidden] { display:none; }
.network-focus-menu button {
  min-height:42px;
  padding:8px 12px;
  border:0;
  border-radius:10px;
  color:#315c54;
  background:transparent;
  font-size:14px;
  font-weight:680;
  text-align:left;
}
.network-focus-menu button + button { border-top:1px solid rgba(53,91,81,.08); }
.network-focus-menu button:active { background:rgba(47,118,105,.08); }
.network-focus-card h2 {
  margin:0;
}
.network-focus-person {
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}
.network-focus-person > div { min-width:0; flex:1; }
.network-focus-person small {
  display:block;
  margin-top:3px;
  overflow:hidden;
  color:#7a8b85;
  font-size:11px;
  line-height:1.35;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.network-focus-avatar {
  display:grid;
  flex:0 0 52px;
  width:52px;
  height:52px;
  place-items:center;
  overflow:hidden;
  border:3px solid rgba(255,255,255,.9);
  border-radius:50%;
  color:#2f7168;
  background:linear-gradient(145deg,#dff2eb,#f8e9c7);
  box-shadow:0 8px 20px rgba(45,91,80,.14);
  font-style:normal;
  font-size:20px;
  font-weight:760;
}
.network-focus-avatar img { width:100%; height:100%; object-fit:cover; }
.network-focus-card .network-focus-name {
  display:block;
  width:100%;
  min-height:38px;
  padding:2px 0;
  border:0;
  border-radius:8px;
  color:#28463f;
  background:transparent;
  font-family:Georgia,"Songti SC","STSong",serif;
  font-size:23px;
  font-weight:560;
  line-height:1.2;
  text-align:left;
  cursor:pointer;
  -webkit-tap-highlight-color:rgba(47,118,105,.08);
}
.network-focus-card .network-focus-name:active {
  color:#17766b;
  background:rgba(47,118,105,.06);
}
.network-focus-card p {
  margin:0;
  color:#536861;
  font-size:13px;
  line-height:1.68;
}
.network-focus-card footer {
  justify-content:flex-start;
  margin-top:2px;
  padding-top:9px;
  border-top:1px solid rgba(64,95,86,.09);
}
.network-focus-card footer span {
  color:#80908a;
  font-size:11px;
  line-height:1.3;
}
.network-focus-card footer span { color:#4d766c; font-weight:680; }
.network-focus-card footer button {
  display:flex;
  min-height:34px;
  align-items:center;
  gap:7px;
  padding:5px 10px;
  border:0;
  border-radius:999px;
  color:#29786d;
  background:rgba(45,140,128,.08);
  font-size:12px;
  font-weight:760;
}
.network-focus-card footer button i { font-style:normal; transition:transform .18s ease; }
.network-focus-card footer button:active i { transform:translateX(3px); }
@keyframes network-focus-card-in {
  from { opacity:0; transform:translateY(8px) scale(.97); }
  to { opacity:1; transform:translateY(0) scale(1); }
}
@media (prefers-reduced-motion:reduce) {
  .network-focus-card { animation:none; }
  .family-map .network-person { transition:none; }
}

.family-map[data-lod="overview"] .network-person-copy small {
  max-height:0;
  margin-top:0;
  opacity:0;
  transform:translateY(-2px);
}
.family-map[data-lod="far"] .network-person-copy {
  opacity:0;
  pointer-events:none;
  transform:translateY(-3px);
}
.family-map[data-lod="far"] .network-person.me .network-person-copy {
  opacity:1;
}
.family-map[data-lod="far"] .network-person.me .network-person-copy small {
  display:none;
}
.family-map[data-lod="far"] .branch-zones {
  opacity:1;
}
.family-map[data-lod="far"] .branch-zones .family-zone-shape {
  opacity:.082;
}
.family-map[data-lod="far"] .branch-zones .family-zone-bridge {
  opacity:.048;
}
.family-map[data-lod="far"] .branch-zones .family-zone-mark,
.family-map[data-lod="far"] .branch-zones .family-zone-label {
  opacity:.66;
}

.spatial-map-shell .network-legend,
.tab-tree .spatial-map-shell .network-legend {
  bottom:14px;
  left:12px;
  max-width:calc(100% - 112px);
  gap:2px;
  padding:4px;
  border:1px solid rgba(80,99,91,.1);
  border-radius:14px;
  background:rgba(255,252,246,.88);
  box-shadow:0 8px 22px rgba(48,67,60,.08);
  backdrop-filter:blur(16px) saturate(1.12);
}
.network-legend .family-legend-toggle {
  min-height:32px;
  gap:6px;
  padding:5px 8px;
  border-radius:10px;
  opacity:.48;
}
.network-legend .family-legend-toggle.active {
  color:#314a43;
  background:rgba(49,118,106,.07);
  opacity:1;
}
.network-legend .family-legend-toggle i {
  width:13px;
  height:3px;
  border-radius:999px;
}
.network-legend .family-legend-create {
  min-height:32px;
  padding:5px 9px;
  border-left:1px solid rgba(61,88,79,.1);
  border-radius:9px;
  color:#28766b;
  font-weight:780;
  opacity:1;
}
.network-legend .family-legend-create:active { background:rgba(49,118,106,.08); }
#treeFamilyComposer:not(:empty) {
  position:fixed;
  z-index:210;
  inset:0;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding-top:80px;
  background:rgba(38,48,44,.2);
  backdrop-filter:blur(3px);
}
#treeFamilyComposer form {
  width:min(100%,620px);
  margin:0;
  padding:24px 22px calc(24px + env(safe-area-inset-bottom));
  border-radius:24px 24px 0 0;
  background:#fffaf1;
  box-shadow:0 -18px 48px rgba(37,55,49,.16);
}
#treeFamilyComposer form h3 { margin:0 0 7px; color:#294c45; font-size:22px; }
#treeFamilyComposer form p { margin:0 42px 17px 0; color:#75817c; font-size:12px; line-height:1.65; }
#treeFamilyComposer form label { display:grid; gap:7px; color:#425a54; font-size:13px; font-weight:750; }
#treeFamilyComposer form input {
  width:100%;
  min-height:50px;
  padding:12px 14px;
  border:1px solid rgba(52,96,87,.14);
  border-radius:15px;
  color:#294039;
  background:#fff;
}
#treeFamilyComposer form > div { display:flex; gap:8px; margin-top:16px; }
#treeFamilyComposer form .primary { width:auto; min-height:44px; padding-inline:18px; }

@media (max-width:390px) {
  .tab-tree .network-tree-actions > button {
    gap:4px;
    padding-inline:7px;
  }
  .tab-tree .network-tree-actions svg {
    width:17px;
    height:17px;
  }
}

/* V29 — 家传是精选展柜；同堂是跨家庭的日常主场。 */
.legacy-selection-heading {
  margin:23px 2px 10px;
  padding-top:20px;
  border-top:1px solid rgba(55,77,69,.1);
}
.legacy-selection-heading > span,
.legacy-selection-empty > span {
  color:#9d7140;
  font-size:11px;
  font-weight:750;
  letter-spacing:.09em;
}
.legacy-selection-heading h2,
.legacy-selection-empty h2 {
  margin:5px 0 4px;
  font-family:Georgia,"Songti SC",serif;
  font-size:23px;
  font-weight:500;
  line-height:1.45;
}
.legacy-selection-heading p,
.legacy-selection-empty p {
  margin:0;
  color:#727d77;
  font-size:12px;
  line-height:1.7;
}
.legacy-selection-empty {
  margin:22px 0 12px;
  padding:24px 20px;
  border-radius:20px 7px 20px 7px;
  background:
    radial-gradient(circle at 94% 10%,rgba(243,197,87,.23),transparent 120px),
    linear-gradient(145deg,#fffaf0,#edf6f1);
}
.legacy-selection-empty button {
  min-height:44px;
  margin:16px 0 0;
  padding:8px 2px;
  border:0;
  color:#2d8276;
  background:transparent;
  font-size:12px;
  font-weight:750;
}
.family-light-card.is-new-legacy {
  border-color:rgba(218,159,75,.28);
  box-shadow:0 13px 34px rgba(123,88,44,.09);
}
.family-light-card.is-new-legacy > header span { color:#c06e3f; }
.legacy-featured { margin-top:0; }
.legacy-more { border-top:1px solid rgba(55,77,69,.09); }
.legacy-more .story { padding-top:22px; }

.tab-moments .content { padding-top:10px; }
.tab-moments .moments-task-module.is-clear {
  margin:0 0 10px;
  padding:13px 2px 11px;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.moments-task-module.is-clear > header { padding:0; }
.moments-task-module.is-clear > header span { color:#7b8983; }
.moments-task-module.is-clear > header h2 {
  margin-top:2px;
  font-size:18px;
}
.moments-task-module.is-clear .moments-task-empty {
  margin:4px 0 0;
  padding:0;
  border:0;
  font-size:11px;
}
.tab-moments .moments-feed {
  margin:0;
  padding:18px 0 28px;
  border-top:0;
}
.moments-feed .activity-heading {
  align-items:flex-start;
  padding:0 2px 15px;
}
.moments-feed .activity-heading > div { min-width:0; flex:1; }
.moments-feed .activity-heading [data-read-events] {
  flex:0 0 auto;
  min-width:max-content;
  padding:6px 2px 6px 10px;
  white-space:nowrap;
}
.moments-feed .activity-heading h2 {
  margin-top:5px;
  font-size:27px;
}
.moments-feed .activity-heading p {
  margin:6px 0 0;
  color:#717d77;
  font-size:12px;
  line-height:1.6;
}
.moments-feed #activityList {
  display:grid;
  gap:0;
}
.moment-story-event {
  position:relative;
  margin:8px 0 20px;
  padding:14px 16px 6px;
  border-radius:21px 7px 21px 7px;
  background:
    radial-gradient(circle at 100% 0,rgba(243,197,87,.17),transparent 145px),
    rgba(255,253,248,.88);
  box-shadow:0 9px 26px rgba(54,66,58,.055);
}
.moment-story-event.unread::after {
  content:"";
  position:absolute;
  top:17px;
  right:14px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#e8795f;
}
.moment-story-event > header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 1px 10px;
}
.moment-story-event > header > div {
  min-width:0;
  display:flex;
  align-items:center;
  gap:7px;
}
.moment-story-event > header i {
  width:8px;
  height:8px;
  flex:none;
  border-radius:50%;
  background:var(--family-color,#3a897d);
}
.moment-story-event > header span {
  overflow:hidden;
  color:#6e7a75;
  font-size:11px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.moment-story-event > header time {
  padding-right:12px;
  color:#8a9690;
  font-size:11px;
  white-space:nowrap;
}
.moment-story-event > .story {
  padding:9px 0 5px;
  border:0;
}
.moment-story-event .story-family-label { display:none; }
.moments-feed > #activityList > .activity-item {
  min-height:70px;
  padding-right:2px;
  padding-left:2px;
}
.moments-feed > #activityList > .activity-item:first-child { margin-top:0; }
.moments-feed + .relay-module {
  border-top:1px solid rgba(55,77,69,.1);
}

/* Story reactions stay quiet until a family member wants to join the conversation. */
.story-engagement {
  margin-top:3px;
  padding-top:9px;
  border-top:1px solid rgba(48,71,64,.09);
}
.story-engagement-actions {
  min-height:44px;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:2px 4px;
}
.story-engagement-actions > button {
  min-width:48px;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:7px;
  padding:7px 10px;
  border:0;
  border-radius:15px;
  color:#6e7e78;
  background:transparent;
  -webkit-tap-highlight-color:transparent;
  transition:color .18s ease,background .18s ease,transform .18s ease;
}
.story-engagement-actions > button:active {
  background:rgba(42,128,116,.075);
  transform:scale(.95);
}
.story-engagement-actions svg {
  width:22px;
  height:22px;
  overflow:visible;
  fill:none;
  stroke:currentColor;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-width:1.7;
}
.story-engagement-actions span {
  min-width:9px;
  font-size:12px;
  font-variant-numeric:tabular-nums;
}
.story-like.liked { color:#e66f58; }
.story-like.liked svg {
  fill:currentColor;
  stroke:currentColor;
  animation:story-heart-in .28s ease;
}
.story-confirm-actions { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:9px; align-items:center; }
.story-confirm-actions > .primary { grid-column:1/-1; }
.story-rerun-ai {
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
}
.story-rerun-ai svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.processing-review > .story-rerun-ai { width:100%; margin-top:9px; }
.story-likers {
  min-width:72px;
  flex:1 1 130px;
  margin:0;
}
.story-likers[hidden] { display:none; }
.story-likers-summary {
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  padding:4px 2px;
  border:0;
  border-radius:12px;
  background:transparent;
  -webkit-tap-highlight-color:transparent;
}
.story-likers-summary:active,
.story-likers.open .story-likers-summary {
  background:rgba(46,124,111,.055);
}
.story-liker-avatar-stack {
  display:flex;
  flex-wrap:wrap;
  gap:4px 3px;
}
.story-liker-avatar {
  width:27px;
  height:27px;
  display:grid;
  overflow:hidden;
  place-items:center;
  border:1.5px solid rgba(255,255,255,.9);
  border-radius:50%;
  color:#286e64;
  background:#dceee7;
  box-shadow:0 1px 5px rgba(45,74,65,.12);
  font-size:11px;
  font-style:normal;
  font-weight:750;
}
.story-liker-avatar img { width:100%; height:100%; display:block; object-fit:cover; }
.story-likers-panel {
  margin:0;
  padding:7px 0 8px;
  border-top:1px solid rgba(48,71,64,.075);
}
.story-likers-panel[hidden] { display:none; }
.story-likers-panel > header {
  min-height:38px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 2px 4px;
}
.story-likers-panel > header b {
  color:#49645b;
  font-size:12px;
  font-weight:750;
}
.story-likers-panel > header button {
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  color:#71807a;
  background:transparent;
  font-size:22px;
  font-weight:300;
  line-height:1;
}
.story-likers-list {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(124px,1fr));
  gap:2px 8px;
}
.story-likers-list > button,
.story-likers-list > div {
  min-width:0;
  min-height:44px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:7px 6px;
  border:0;
  border-radius:10px;
  color:#40584f;
  background:transparent;
  text-align:left;
}
.story-likers-list > button:active { background:rgba(42,128,116,.08); }
.story-likers-list > * > span {
  min-width:0;
  display:grid;
  gap:2px;
}
.story-likers-list > * > span b {
  overflow:hidden;
  font-size:12px;
  font-weight:750;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.story-likers-list > * > span small {
  color:#83908b;
  font-size:11px;
}
@keyframes story-heart-in {
  40% { transform:scale(1.18); }
}
.story-comment-toggle[aria-expanded="true"] {
  color:#257e72;
  background:transparent;
}
.story-comments-panel {
  margin:0 0 5px;
  padding:0;
}
.story-comments-list[hidden] { display:none; }
.story-comments-list > article {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:start;
  gap:4px;
  padding:0;
  border-bottom:1px solid rgba(48,71,64,.08);
}
.story-comment-main {
  min-width:0;
  min-height:52px;
  display:grid;
  grid-template-columns:30px minmax(0,1fr);
  align-items:start;
  gap:9px;
  padding:9px 4px 9px 1px;
  border:0;
  border-radius:0;
  color:inherit;
  background:transparent;
  text-align:left;
}
.story-comment-main:active { background:rgba(45,126,113,.045); }
.story-comment-avatar {
  width:30px;
  height:30px;
  display:grid;
  overflow:hidden;
  place-items:center;
  border-radius:50%;
  color:#286e64;
  background:#dceee7;
  font-size:12px;
  font-style:normal;
  font-weight:750;
}
.story-comment-avatar img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.story-comment-main > span { min-width:0; }
.story-comment-main header {
  display:flex;
  align-items:baseline;
  gap:8px;
  margin:0 0 3px;
}
.story-comment-main header b {
  color:#38564e;
  font-size:12px;
  font-weight:750;
}
.story-comment-main header time {
  color:#87928d;
  font-size:11px;
}
.story-comment-main p {
  margin:0;
  color:#404a46;
  font-size:13px;
  line-height:1.6;
  overflow-wrap:anywhere;
}
.story-comment-main p > em {
  margin-right:5px;
  color:#2e796e;
  font-size:12px;
  font-style:normal;
  font-weight:650;
}
.story-comments-list .story-comment-delete {
  min-width:40px;
  min-height:32px;
  margin:7px -6px 0 0;
  padding:4px 7px;
  border:0;
  color:#9a847d;
  background:transparent;
  font-size:11px;
}
.story-comments-loading {
  margin:0;
  padding:13px 2px 10px;
  color:#78857f !important;
  font-size:12px !important;
  line-height:1.65 !important;
}
.story-comment-form {
  display:grid;
  gap:5px;
  padding:9px 0 2px;
  border-bottom:1px solid rgba(48,71,64,.07);
}
.story-comment-form[hidden] { display:none; }
.story-comment-form > div:last-child {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:end;
  gap:7px;
}
.story-comment-compose-label {
  min-height:26px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  color:#71807a;
  font-size:11px;
}
.story-comment-compose-label[hidden] { display:none; }
.story-comment-compose-label b { color:#2f756a; font-weight:750; }
.story-comment-compose-label button {
  width:28px;
  min-width:28px;
  height:28px;
  min-height:28px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  color:#7b8984;
  background:transparent;
  font-size:18px;
}
.story-comment-form textarea {
  min-height:44px;
  max-height:112px;
  margin:0;
  padding:11px 13px;
  border-color:rgba(57,90,81,.13);
  border-radius:13px;
  background:rgba(255,253,248,.78);
  font-size:14px;
  line-height:1.5;
  resize:vertical;
}
.story-comment-form > div:last-child > button {
  min-width:58px;
  min-height:44px;
  padding:8px 13px;
  border:0;
  border-radius:13px;
  color:white;
  background:#318e81;
  font-size:12px;
  font-weight:750;
}
.story-reading .story-engagement {
  margin:0 0 22px;
  padding-top:12px;
}
button.activity-item {
  width:100%;
  margin:0;
  border-right:0;
  border-bottom:0;
  border-left:0;
  color:inherit;
  background:transparent;
  font:inherit;
  text-align:left;
}
button.activity-item:active { background:rgba(49,142,129,.045); }

/* V28 — Safari full-page capture: never composite the long sheet over transparent black. */
body > #app {
  position:relative;
  background-color:var(--canvas,#f3efe6);
}
@supports (-webkit-touch-callout:none) {
  .top nav,
  .main-tabbar,
  .reading-top,
  .network-recenter,
  .network-find,
  .spatial-map-shell .network-legend,
  .network-person {
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
  .top nav,
  .main-tabbar,
  .reading-top {
    background-color:#fffaf0;
    background-image:none;
  }
  @media (hover:none) and (pointer:coarse) {
    html,
    body {
      background-color:#eee7db;
      background-image:none;
    }
    body > #app,
    #app.tab-home {
      background-color:#f7f1e6 !important;
      background-image:none !important;
    }
    .tab-home .top {
      background-color:#fffaf0 !important;
      background-image:none !important;
    }
    .tab-home .content {
      background-color:#f7f1e6 !important;
      background-image:radial-gradient(circle at 100% 14%,#f6e7bf 0,#f7f1e6 220px) !important;
    }
    .tab-home .legacy-featured {
      background-color:#fff8e9 !important;
      background-image:radial-gradient(ellipse at 100% 0,#f7e4ad 0,#fff8e9 38%,#eaf6f0 100%) !important;
    }
  }
}
@media print {
  html,
  body {
    min-height:100%;
    background:#eee7db !important;
  }
  body > #app {
    width:100%;
    max-width:620px;
    min-height:100%;
    background:#f7f1e6 !important;
  }
  #app.tab-home {
    background:#f7f1e6 !important;
  }
  .tab-home .top {
    background:#fffaf0 !important;
  }
  .tab-home .content {
    background-color:#f7f1e6 !important;
    background-image:radial-gradient(circle at 100% 14%,#f6e7bf 0,#f7f1e6 220px) !important;
  }
  .tab-home .legacy-featured {
    background-color:#fff8e9 !important;
    background-image:radial-gradient(ellipse at 100% 0,#f7e4ad 0,#fff8e9 38%,#eaf6f0 100%) !important;
  }
  .top nav,
  .main-tabbar,
  .reading-top,
  .network-recenter,
  .network-find,
  .spatial-map-shell .network-legend,
  .network-person {
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
  }
}

/* V32 — personal settings stay quiet, consistent and easy to scan. */
.tab-profile .profile-settings {
  border-color:rgba(56,75,67,.1);
  border-radius:18px;
  box-shadow:none;
}
.tab-profile .profile-setting > summary {
  grid-template-columns:34px minmax(0,1fr) 18px;
  min-height:64px;
  gap:11px;
  padding:10px 15px;
}
.tab-profile .profile-setting-icon,
.tab-profile .profile-setting:nth-child(n) .profile-setting-icon {
  width:34px;
  height:34px;
  border-radius:11px;
  color:#5d756d;
  background:#eef2ee;
}
.tab-profile .profile-setting-icon svg { width:19px; height:19px; }
.tab-profile .profile-setting > summary b { font-size:14px; font-weight:700; }
.tab-profile .profile-setting > summary small { color:#8a928e; font-size:11px; }
.tab-profile .profile-setting[open] > summary { background:transparent; }
.tab-profile .profile-setting > summary > em { color:#a1aaa5; font-size:21px; }
.profile-attention-overview {
  margin:14px 0;
  padding:17px;
  border:1px solid rgba(226,112,88,.16);
  border-radius:18px;
  background:linear-gradient(145deg,#fff8ee,#fffdf7);
}
.profile-attention-overview > span { color:#b76854; font-size:11px; font-weight:800; letter-spacing:.08em; }
.profile-attention-overview h2 { margin:3px 0 11px; color:#36524b; font:500 21px/1.4 Georgia,"Songti SC",serif; }
.profile-attention-overview > div { display:grid; gap:7px; }
.profile-attention-overview button { display:grid; grid-template-columns:1fr auto 12px; align-items:center; gap:9px; min-height:46px; padding:9px 12px; border:0; border-radius:13px; color:#36524b; background:rgba(255,255,255,.82); text-align:left; }
.profile-attention-overview button b { font-size:13px; }
.profile-attention-overview button em,.profile-setting-attention { display:grid; min-width:21px; height:21px; padding:0 5px; place-items:center; border-radius:999px; color:white; background:#e36f59; font-size:11px; font-style:normal; font-weight:800; }
.profile-attention-overview button i { color:#a3aaa6; font-size:18px; font-style:normal; }
.tab-profile .profile-setting > summary:has(.profile-setting-attention) { grid-template-columns:34px minmax(0,1fr) auto 18px; }
.profile-setting.attention-arrival { animation:profile-attention-arrival 1.3s ease; }
@keyframes profile-attention-arrival { 0%,35% { box-shadow:0 0 0 3px rgba(226,112,88,.2); } 100% { box-shadow:none; } }
.identity-entry-family { display:grid; gap:7px; margin:14px 0 12px; padding:0; border:0; }
.identity-entry-family legend { margin-bottom:5px; color:#6d7d77; font-size:11px; font-weight:700; }
.identity-entry-family label { position:relative; overflow:hidden; display:grid; grid-template-columns:22px 1fr; align-items:center; gap:10px; min-height:50px; margin:0; padding:8px 11px 8px 14px; border:1px solid rgba(43,103,93,.1); border-radius:13px; background:rgba(255,255,255,.7); transition:border-color .16s ease,background .16s ease,box-shadow .16s ease; }
.identity-entry-family label::before { content:""; position:absolute; top:11px; bottom:11px; left:0; width:3px; border-radius:0 999px 999px 0; background:color-mix(in srgb,var(--family-color) 48%,white); }
.identity-entry-family label:has(input:checked) { border-color:color-mix(in srgb,var(--family-color) 34%,rgba(43,103,93,.1)); background:color-mix(in srgb,var(--family-color) 7%,white); box-shadow:0 5px 14px color-mix(in srgb,var(--family-color) 8%,transparent); }
.identity-entry-family label:has(input:checked)::before { top:8px; bottom:8px; background:var(--family-color); }
.identity-entry-family input { width:20px; height:20px; margin:0; accent-color:#238478; }
.identity-entry-family b,.identity-entry-family small { display:block; }
.identity-entry-family b { color:#36524b; font-size:13px; }
.identity-entry-family small { margin-top:2px; color:#84908b; font-size:11px; }
.tab-profile .account-profile-editor .profile-setting-body,
.tab-profile .account-security .profile-setting-body {
  padding:0 15px 18px;
  border-top:0;
}
.tab-profile .profile-simple-form {
  display:grid;
  gap:0;
  margin:0 !important;
  padding:12px 0 0 !important;
  border-top:1px solid rgba(56,75,67,.08);
  border-radius:0 !important;
  background:transparent !important;
}
.tab-profile .profile-simple-form label {
  gap:6px;
  margin:0;
  padding:9px 0;
  color:#53655f;
  font-size:12px;
}
.tab-profile .profile-simple-form label + label { border-top:1px solid rgba(56,75,67,.065); }
.tab-profile .profile-simple-form label > small {
  color:#9aa09c;
  font-size:11px;
  font-weight:500;
}
.tab-profile .profile-simple-form input {
  min-height:46px;
  padding:11px 12px;
  border-color:#dfe4de;
  border-radius:11px;
  background:#fffdf9;
  font-size:15px;
  box-shadow:none;
}
.tab-profile .profile-form-note {
  margin:1px 0 7px;
  color:#77847e;
  font-size:12px;
  line-height:1.65;
}
.purpose-consent-list label span > em {
  display:block;
  margin-top:5px;
  color:#8d9993;
  font-size:11px;
  font-style:normal;
}
.purpose-version-note {
  margin:8px 15px 4px;
  color:#8a9690;
  font-size:11px;
  line-height:1.6;
}
.purpose-detail-link {
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin:0 15px 15px;
  color:#397f73;
  font-size:12px;
  font-weight:700;
  text-decoration:none;
}
.purpose-detail-link::after { content:"›"; font-size:16px; line-height:1; }
.tab-profile .profile-security-section {
  padding:13px 0;
  border-top:1px solid rgba(56,75,67,.08);
}
.tab-profile .profile-security-section > h3,
.tab-profile .profile-simple-form > h3 {
  margin:0 0 5px;
  color:#415750;
  font-size:12px;
  font-weight:750;
}
.tab-profile .profile-login-methods > p,
.tab-profile .profile-device-sessions > p,
.tab-profile .profile-security-history div > p {
  display:flex;
  min-height:48px;
  margin:0;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid rgba(56,75,67,.06);
}
.tab-profile .profile-login-methods > p:last-child,
.tab-profile .profile-device-sessions > p:last-child,
.tab-profile .profile-security-history div > p:last-child { border-bottom:0; }
.tab-profile .profile-login-methods span,
.tab-profile .profile-device-sessions span,
.tab-profile .profile-security-history p span { display:grid; min-width:0; gap:3px; }
.tab-profile .profile-login-methods b,
.tab-profile .profile-device-sessions b,
.tab-profile .profile-security-history b { color:#425750; font-size:13px; }
.tab-profile .profile-login-methods small,
.tab-profile .profile-device-sessions small,
.tab-profile .profile-security-history small { color:#929a96; font-size:11px; }
.tab-profile .profile-login-methods em,
.tab-profile .profile-device-sessions em {
  flex:none;
  color:#3e897d;
  font-size:11px;
  font-style:normal;
  font-weight:700;
}
.tab-profile .profile-device-sessions .text-button { flex:none; font-size:12px; }
.tab-profile .profile-security-section > footer {
  display:flex;
  margin-top:7px;
  align-items:center;
  justify-content:flex-end;
  gap:16px;
}
.tab-profile .profile-security-section > footer button { padding:7px 0; font-size:11px; }
.tab-profile .profile-security-section > footer .danger-text {
  min-height:0;
  border:0;
  color:#a26052;
  background:transparent;
  box-shadow:none;
  appearance:none;
}
.tab-profile .profile-security-history { border-top:1px solid rgba(56,75,67,.08); }
.tab-profile .profile-security-history > summary {
  display:flex;
  min-height:46px;
  align-items:center;
  justify-content:space-between;
  color:#64736d;
  cursor:pointer;
  font-size:12px;
  list-style:none;
}
.tab-profile .profile-security-history > summary::-webkit-details-marker { display:none; }
.tab-profile .profile-security-history > summary span { color:#a1aaa5; font-size:19px; transition:transform .2s ease; }
.tab-profile .profile-security-history[open] > summary span { transform:rotate(90deg); }
.tab-profile .profile-security-history .is-warning b { color:#a26052; }
.tab-profile .profile-form-save {
  width:auto;
  min-height:44px;
  margin:12px 0 0 auto;
  padding:9px 17px;
  border:1px solid rgba(42,124,111,.18);
  border-radius:11px;
  color:#26776b;
  background:#edf6f2;
  font-size:13px;
  font-weight:700;
}
.tab-profile .profile-setting.purpose-list .profile-setting-body { padding:0 15px 9px; }
.tab-profile .profile-setting.purpose-list label {
  min-height:58px;
  padding:11px 0;
  background:transparent;
}
.tab-profile .profile-setting.purpose-list label:has(> input:checked) { background:transparent; }
.tab-profile .profile-setting.purpose-list label b { color:#3f554e; font-size:13px; }
.tab-profile .profile-setting.purpose-list label small { color:#858f8a; font-size:11px; }
.tab-profile .profile-support form {
  margin:0 14px 14px;
  padding:15px 0 0;
  border-top:1px solid rgba(56,75,67,.08);
  border-radius:0;
  background:transparent;
}
.tab-profile .profile-support form > span {
  color:#3b897d;
  font-size:11px;
  font-weight:750;
  letter-spacing:.08em;
}
.tab-profile .profile-support form h3 {
  margin:4px 0 6px;
  color:#344c45;
  font-size:17px;
}
.tab-profile .profile-support form > p {
  margin:0 0 14px;
  color:#7d8983;
  font-size:11px;
  line-height:1.6;
}
.tab-profile .profile-support form label { margin-bottom:12px; }

.tab-profile .profile-product-share {
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  margin:14px 0 8px;
  padding:13px 14px;
  border:1px solid rgba(52,91,80,.09);
  border-radius:17px;
  background:rgba(255,253,248,.76);
}
.tab-profile .profile-product-share > img {
  width:42px;
  height:42px;
  object-fit:contain;
}
.tab-profile .profile-product-share > span { display:grid; min-width:0; gap:3px; }
.tab-profile .profile-product-share b { color:#3b554e; font-size:13px; }
.tab-profile .profile-product-share small { color:#89918d; font-size:11px; line-height:1.5; }
.tab-profile .profile-product-share > button {
  min-width:58px;
  min-height:38px;
  padding:8px 13px;
  border:1px solid rgba(43,132,119,.14);
  border-radius:999px;
  color:#277b70;
  background:#edf7f2;
  font-size:12px;
  font-weight:750;
}
@media(max-width:360px) {
  .tab-profile .profile-product-share { grid-template-columns:38px minmax(0,1fr) auto; gap:9px; padding:12px; }
  .tab-profile .profile-product-share > img { width:38px; height:38px; }
  .tab-profile .profile-product-share > button { min-width:52px; padding-right:10px; padding-left:10px; }
}

/* V33 — keep question relay available without competing with the family feed. */
.tab-moments .moments-relay-collapsible {
  margin:0;
  padding:0;
  border-top:1px solid rgba(54,74,67,.09);
  border-bottom:1px solid rgba(54,74,67,.09);
  background:transparent;
}
.tab-moments .moments-relay-collapsible > summary {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  min-height:72px;
  align-items:center;
  gap:12px;
  padding:13px 2px;
  cursor:pointer;
  list-style:none;
}

/* V34 — account deletion stays explicit without making the privacy page alarming. */
.tab-profile .account-deletion-entry {
  padding:5px 0 4px;
  border-top:1px solid rgba(56,75,67,.08);
}
.tab-profile .account-deletion-entry > button {
  display:flex;
  width:100%;
  min-height:56px;
  padding:10px 0;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border:0;
  color:inherit;
  background:transparent;
  text-align:left;
}
.tab-profile .account-deletion-entry > button span,
.tab-profile .account-deletion-entry.is-pending > span { display:grid; min-width:0; gap:4px; }
.tab-profile .account-deletion-entry > button b,
.tab-profile .account-deletion-entry.is-pending b { color:#52615c; font-size:13px; }
.tab-profile .account-deletion-entry > button small,
.tab-profile .account-deletion-entry.is-pending small { color:#929a96; font-size:11px; line-height:1.5; }
.tab-profile .account-deletion-entry > button em { color:#a1aaa5; font-size:21px; font-style:normal; }
.tab-profile .account-deletion-entry.is-pending {
  display:flex;
  min-height:64px;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.tab-profile .account-deletion-entry.is-pending > .text-button { flex:none; padding:8px 0; color:#a26052; font-size:12px; }
.tab-profile #accountDeletionSlot { margin:2px -3px 5px; }
.tab-profile .account-deletion-panel {
  padding:18px;
  border:1px solid rgba(120,92,71,.12);
  border-radius:17px;
  background:#fbf8f2;
}
.tab-profile .account-deletion-panel > header { padding-right:45px; }
.tab-profile .account-deletion-panel > header > span {
  color:#a26b55;
  font-size:11px;
  font-weight:750;
  letter-spacing:.1em;
}
.tab-profile .account-deletion-panel h3 { margin:4px 0 7px; color:#3f504b; font-size:18px; }
.tab-profile .account-deletion-panel p { margin:0; color:#76817c; font-size:12px; line-height:1.65; }
.tab-profile .account-deletion-blockers {
  margin-top:14px;
  padding:13px 14px;
  border-radius:13px;
  background:#f8ece6;
}
.tab-profile .account-deletion-blockers > b { color:#8c5746; font-size:13px; }
.tab-profile .account-deletion-blockers p { margin-top:4px; color:#876f66; }
.tab-profile .account-deletion-blockers ul { margin:8px 0 0; padding-left:18px; color:#765e56; font-size:12px; line-height:1.7; }
.tab-profile .account-deletion-note,
.tab-profile .account-deletion-cooling { margin-top:13px !important; }
.tab-profile .account-deletion-form {
  margin:15px 0 0 !important;
  padding:15px 0 0 !important;
  border-top:1px solid rgba(74,74,68,.09);
  border-radius:0 !important;
  background:transparent !important;
}
.tab-profile .account-deletion-form fieldset { display:grid; gap:9px; margin:0; padding:0; border:0; }
.tab-profile .account-deletion-form legend { margin-bottom:8px; color:#4d5f59; font-size:12px; font-weight:750; }
.tab-profile .profile-setting.purpose-list .account-deletion-form .account-deletion-choice {
  display:grid;
  grid-template-columns:20px minmax(0,1fr);
  min-height:0;
  gap:10px;
  margin:0;
  padding:12px;
  align-items:start;
  border:1px solid #e2e1da;
  border-radius:13px;
  background:#fffdf9;
}
.tab-profile .profile-setting.purpose-list .account-deletion-choice:has(input:checked) {
  border-color:rgba(47,132,117,.38);
  background:#f3f8f5;
}
.tab-profile .account-deletion-choice input { width:18px; height:18px; min-height:18px; margin:2px 0 0; accent-color:#2f8879; }
.tab-profile .account-deletion-choice span { display:grid; gap:4px; }
.tab-profile .account-deletion-choice b { color:#42564f; font-size:13px; }
.tab-profile .account-deletion-choice small { color:#818b86; font-size:11px; line-height:1.55; }
.tab-profile .profile-setting.purpose-list .account-deletion-form > label {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  min-height:0;
  gap:7px;
  margin:12px 0 0;
  padding:0;
  align-items:stretch;
  justify-content:stretch;
  border:0;
  color:#586863;
  background:transparent;
  font-size:12px;
}
.tab-profile .account-deletion-form > label input { width:100%; height:auto; min-height:45px; border-color:#dedfd9; background:#fffdf9; }
.tab-profile .account-deletion-submit {
  width:100%;
  min-height:45px;
  margin-top:14px;
  border:1px solid rgba(157,82,60,.18);
  border-radius:11px;
  color:#965844;
  background:#f8eae4;
  font-size:13px;
  font-weight:750;
}
.tab-moments .moments-relay-collapsible > summary::-webkit-details-marker { display:none; }
.tab-moments .moments-relay-collapsible > summary > div {
  max-width:none;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:baseline;
  gap:5px 10px;
}
.tab-moments .moments-relay-collapsible > summary span {
  grid-column:1;
  color:#92734e;
  font-size:11px;
  font-weight:750;
  letter-spacing:.06em;
}
.tab-moments .moments-relay-collapsible > summary h2 {
  grid-column:2;
  margin:0;
  color:#344b44;
  font-size:18px;
}
.tab-moments .moments-relay-collapsible > summary p {
  grid-column:1/-1;
  margin:0;
  color:#87918c;
  font-size:11px;
  line-height:1.45;
}
.tab-moments .moments-relay-collapsible > summary aside {
  display:flex;
  align-items:center;
  gap:8px;
}
.tab-moments .moments-relay-collapsible > summary aside b {
  display:grid;
  min-width:24px;
  height:24px;
  place-items:center;
  border-radius:999px;
  color:#7d654d;
  background:#f3e8d8;
  font-size:11px;
}
.tab-moments .moments-relay-collapsible > summary aside em {
  color:#9da6a1;
  font-size:22px;
  font-style:normal;
  transition:transform .18s ease;
}
.tab-moments .moments-relay-collapsible[open] > summary aside em { transform:rotate(90deg); }
.tab-moments .relay-collapsed-content {
  padding:0 2px 18px;
  border-top:1px solid rgba(54,74,67,.065);
}
.tab-moments .moments-running-head > div {
  display:flex;
  align-items:center;
  gap:10px;
}
.tab-moments .moments-running-head .secondary {
  min-height:40px;
  padding:8px 12px;
  border-color:rgba(43,132,119,.16);
  border-radius:999px;
  background:rgba(237,247,242,.82);
  font-size:12px;
}
.tab-moments .moments-relay-collapsible + .moments-feed {
  border-top:0;
}

/* V34 — “我们家的传奇” grows through meaning, not points or task pressure. */
.family-light-card {
  padding:22px 20px 20px;
  background:
    radial-gradient(circle at 94% 4%,rgba(255,201,91,.28),transparent 29%),
    linear-gradient(148deg,#fffaf0 0%,#fffdf9 55%,#eff8f3 100%);
}
.family-light-card > header span {
  display:flex;
  align-items:center;
  gap:7px;
}
.family-light-card > header span em {
  padding:2px 7px;
  border-radius:999px;
  color:#ad643b;
  background:#ffebd3;
  font-size:11px;
  font-style:normal;
  letter-spacing:0;
}
.family-light-statement blockquote {
  margin:20px 0 9px;
  font-family:Georgia,"Songti SC",serif;
  font-size:25px;
  font-weight:600;
  line-height:1.45;
}
.family-light-statement > p {
  margin:0;
  color:#61706a;
  font-size:13px;
  line-height:1.72;
}
.family-light-discovery,
.family-light-feedback,
.family-light-next,
.family-light-sources {
  min-width:0;
  max-width:100%;
  overflow:hidden;
  margin:18px 0 0;
  padding:17px 0 0;
  border-top:1px solid rgba(70,92,82,.1);
}
.family-light-discovery > span,
.family-light-feedback > span,
.family-light-next > span {
  display:block;
  margin-bottom:6px;
  color:#a8753e;
  font-size:11px;
  font-weight:750;
  letter-spacing:.08em;
}
.family-light-discovery > p {
  margin:0;
  color:#405d55;
  font-size:14px;
  font-weight:650;
  line-height:1.65;
}
.family-light-sources > summary {
  display:flex;
  min-width:0;
  max-width:100%;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:#596a63;
  cursor:pointer;
  font-size:12px;
  font-weight:700;
  list-style:none;
}
.family-light-sources > summary::-webkit-details-marker { display:none; }
.family-light-sources > summary i {
  flex:0 0 auto;
  color:#3a897d;
  font-size:11px;
  font-style:normal;
}
.family-light-sources > div {
  display:grid;
  min-width:0;
  max-width:100%;
  grid-template-columns:minmax(0,1fr);
  gap:0;
  margin-top:9px;
}
.family-light-card .family-light-sources button {
  display:block;
  width:100%;
  min-width:0;
  max-width:100%;
  min-height:0;
  overflow:hidden;
  padding:10px 0;
  border-top:1px solid rgba(70,92,82,.07);
  border-radius:0;
  color:#425750;
  background:transparent;
  text-align:left;
}
.family-light-sources button b,
.family-light-sources button small {
  display:block;
  min-width:0;
  max-width:100%;
  overflow-wrap:anywhere;
}
.family-light-sources button b {
  font-size:12px;
  line-height:1.45;
}
.family-light-sources button small {
  display:-webkit-box;
  overflow:hidden;
  margin-top:3px;
  color:#87918c;
  font-size:11px;
  font-weight:500;
  line-height:1.45;
  overflow-wrap:anywhere;
  white-space:normal;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
@media (max-width:380px) {
  .family-light-card { padding-right:16px; padding-left:16px; }
  .family-light-sources > summary { gap:8px; }
}
.family-light-feedback > div {
  display:flex;
  gap:8px;
}
.family-light-card .family-light-feedback button {
  min-height:38px;
  padding:8px 13px;
  border:1px solid rgba(48,125,113,.18);
  color:#3e746b;
  background:rgba(255,255,255,.65);
  box-shadow:none;
}
.family-light-card .family-light-feedback button[aria-pressed="true"] {
  border-color:#3d9a8d;
  color:#fff;
  background:#3d9a8d;
}
.family-light-feedback > small {
  display:block;
  margin-top:7px;
  color:#8a938f;
  font-size:11px;
}
.family-light-next {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  column-gap:12px;
}
.family-light-next > span { grid-column:1/-1; }
.family-light-next > b {
  color:#3e554e;
  font-size:14px;
  font-weight:650;
  line-height:1.55;
}
.family-light-card .family-light-next > button {
  min-width:92px;
  background:#e88758;
}
.family-light-seed .family-light-next {
  margin-top:16px;
}
.family-light-record-prompt {
  margin:0 0 16px;
  padding:15px 16px;
  border:1px solid rgba(224,155,83,.17);
  border-radius:16px;
  background:linear-gradient(135deg,#fff8e8,#f1f8f4);
}
.family-light-record-prompt span {
  color:#a06e3e;
  font-size:11px;
  font-weight:750;
  letter-spacing:.06em;
}
.family-light-record-prompt p {
  margin:5px 0 0;
  color:#3e5750;
  font-family:Georgia,"Songti SC",serif;
  font-size:17px;
  line-height:1.55;
}
@media (max-width:380px) {
  .family-light-next { grid-template-columns:1fr; }
  .family-light-next > button { justify-self:start; margin-top:10px; }
}

/* V36 — a family light becomes a deliberate, beautiful public artifact. */
.family-light-card .family-light-share-entry {
  display:inline-flex;
  flex:0 0 auto;
  min-height:36px;
  align-items:center;
  gap:5px;
  padding:7px 11px;
  border:1px solid rgba(221,119,90,.18);
  color:#b8684f;
  background:rgba(255,255,255,.65);
  box-shadow:0 7px 18px rgba(136,91,58,.08);
}
.family-light-share-entry i { font-size:15px; font-style:normal; }
.family-light-share-sheet {
  margin:14px 0 26px;
  padding:22px 18px 20px;
  border:1px solid rgba(57,103,91,.1);
  border-radius:25px;
  background:
    radial-gradient(circle at 94% 3%,rgba(255,199,88,.24),transparent 30%),
    linear-gradient(145deg,#fffdf8,#f4f8f3);
  box-shadow:0 20px 46px rgba(49,81,69,.1);
}
.family-light-share-sheet > header {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
}
.family-light-share-sheet > header span,
.family-light-theme-picker legend,
.family-light-visual-picker legend {
  color:#a76d43;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
}
.family-light-share-sheet > header h3 {
  margin:5px 0 0;
  color:#31574f;
  font:600 21px/1.4 Georgia,"Songti SC",serif;
}
.family-light-share-sheet > header > button {
  width:38px;
  min-height:38px;
  padding:0;
  border:1px solid rgba(44,88,78,.11);
  border-radius:50%;
  color:#61756e;
  background:rgba(255,255,255,.72);
  box-shadow:none;
  font-size:23px;
  font-weight:400;
}
.family-light-share-boundary {
  margin:14px 0 19px;
  color:#75817c;
  font-size:12px;
  line-height:1.65;
}
.family-light-share-sheet fieldset {
  min-width:0;
  margin:0 0 18px;
  padding:0;
  border:0;
}
.family-light-share-sheet legend {
  margin-bottom:9px;
}
.family-light-share-sheet legend small {
  color:#9ca49f;
  font-weight:500;
  letter-spacing:0;
}
.family-light-theme-picker {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
}
.family-light-theme-picker legend { grid-column:1/-1; }
.family-light-share-sheet input[type="radio"] {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.family-light-theme-picker label > span {
  position:relative;
  display:grid;
  min-height:92px;
  align-content:end;
  overflow:hidden;
  padding:15px;
  border:1px solid rgba(46,94,83,.1);
  border-radius:19px;
  background:#fff;
  cursor:pointer;
}
.family-light-theme-picker label > span.sunrise {
  background:radial-gradient(circle at 85% 15%,rgba(255,189,61,.64),transparent 42%),linear-gradient(145deg,#fff9e8,#eff8ee);
}
.family-light-theme-picker label > span.bloom {
  background:radial-gradient(circle at 86% 13%,rgba(239,126,108,.43),transparent 42%),linear-gradient(145deg,#fff7ed,#edf8f2);
}
.family-light-theme-picker label b { color:#365d54; font-size:14px; }
.family-light-theme-picker label small { color:#74817b; font-size:11px; }
.family-light-theme-picker input:checked + span,
.family-light-visual-picker input:checked + span {
  border-color:#e58268;
  box-shadow:inset 0 0 0 2px rgba(229,130,104,.16),0 8px 20px rgba(86,94,70,.08);
}
.family-light-theme-picker input:checked + span:after,
.family-light-visual-picker input:checked + span:after {
  content:"✓";
  position:absolute;
  top:9px;
  right:9px;
  display:grid;
  width:20px;
  height:20px;
  place-items:center;
  border-radius:50%;
  color:white;
  background:#e77f66;
  font-size:11px;
  font-weight:800;
}
.family-light-visual-picker {
  display:grid;
  grid-auto-columns:112px;
  grid-auto-flow:column;
  gap:9px;
  overflow-x:auto;
  padding-bottom:4px !important;
  scroll-snap-type:x proximity;
}
.family-light-visual-picker legend {
  position:sticky;
  left:0;
  grid-column:1/-1;
}
.family-light-visual-picker label { min-width:0; scroll-snap-align:start; }
.family-light-visual-picker label > span {
  position:relative;
  display:block;
  min-height:120px;
  overflow:hidden;
  padding:7px;
  border:1px solid rgba(46,94,83,.1);
  border-radius:17px;
  background:rgba(255,255,255,.72);
  cursor:pointer;
}
.family-light-visual-picker figure {
  width:96px;
  height:76px;
  margin:0 0 7px;
  overflow:hidden;
  border-radius:12px;
  background:#eaf3ee;
  pointer-events:none;
}
.family-light-visual-picker figure img {
  width:100%;
  height:100%;
  object-fit:cover;
}
.family-light-visual-picker label b {
  display:-webkit-box;
  overflow:hidden;
  color:#526860;
  font-size:11px;
  font-weight:650;
  line-height:1.35;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.family-light-visual-picker .no-photo > span {
  display:grid;
  min-height:120px;
  place-items:center;
  align-content:center;
  text-align:center;
}
.family-light-visual-picker .no-photo i {
  display:grid;
  width:52px;
  height:52px;
  margin-bottom:8px;
  place-items:center;
  border-radius:50%;
  color:#a97543;
  background:radial-gradient(circle at 40% 35%,#ffe49e,#f4bd57);
  box-shadow:0 9px 22px rgba(218,161,66,.2);
  font:600 18px Georgia,"Songti SC",serif;
}
.family-light-photo-note {
  margin:-10px 1px 18px;
  color:#8c9691;
  font-size:11px;
  line-height:1.55;
}
.family-light-public-confirm {
  display:grid;
  grid-template-columns:24px minmax(0,1fr);
  column-gap:9px;
  align-items:start;
  margin:0 0 16px;
  padding:13px;
  border-radius:16px;
  background:rgba(255,255,255,.6);
}
.family-light-public-confirm input {
  position:absolute;
  opacity:0;
}
.family-light-public-confirm > span {
  display:grid;
  width:23px;
  height:23px;
  place-items:center;
  border:1.5px solid #9bb7ae;
  border-radius:8px;
  background:#fff;
}
.family-light-public-confirm input:checked + span {
  border-color:#e17b63;
  background:#e17b63;
}
.family-light-public-confirm input:checked + span:after {
  content:"✓";
  color:#fff;
  font-size:14px;
  font-weight:900;
}
.family-light-public-confirm b { color:#415e56; font-size:13px; }
.family-light-public-confirm small {
  grid-column:2;
  margin-top:2px;
  color:#86908b;
  font-size:11px;
  line-height:1.5;
}
.family-light-share-sheet .family-light-generate {
  width:100%;
  min-height:50px;
  background:linear-gradient(135deg,#ec856d,#e87560);
  box-shadow:0 12px 26px rgba(220,112,87,.2);
  font-size:14px;
}
.family-light-poster-result {
  margin-top:18px;
  padding-top:18px;
  border-top:1px solid rgba(51,89,80,.1);
}
.family-light-poster-result > img {
  display:block;
  width:100%;
  border-radius:18px;
  box-shadow:0 17px 38px rgba(47,75,63,.14);
}
.family-light-poster-result > p {
  margin:12px 2px;
  color:#76827d;
  font-size:11px;
  line-height:1.55;
}
.family-light-poster-result > div {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:8px;
}
.family-light-poster-result > div button { min-height:45px; }
.family-light-poster-result details { margin-top:10px; color:#87908c; font-size:11px; }
.family-light-poster-result details button { margin-top:6px; color:#a46755; background:transparent; }
.family-light-share-ended {
  margin:15px 0 0;
  padding:14px;
  border-radius:14px;
  color:#687871;
  background:rgba(255,255,255,.68);
  font-size:12px;
}

/* V35 — prevent and resolve duplicate family people in plain language. */
.person-add-duplicate-prompt {
  margin:4px 0 15px;
  padding:16px;
  border:1px solid rgba(222,150,77,.24);
  border-radius:17px;
  background:linear-gradient(140deg,#fff9e9,#f3f9f5);
}
.person-add-duplicate-prompt > span,
.person-duplicate-notice > span {
  color:#a46e37;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
}
.person-add-duplicate-prompt h4 {
  margin:5px 0 4px;
  color:#354f47;
  font-size:16px;
  line-height:1.5;
}
.person-add-duplicate-prompt p {
  margin:0;
  color:#71807a;
  font-size:12px;
  line-height:1.65;
}
.person-add-duplicate-prompt > div,
.person-duplicate-notice > div {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:13px;
}
.person-add-duplicate-prompt button,
.person-duplicate-notice button {
  min-height:41px;
  padding:8px 14px;
  border:0;
  border-radius:999px;
  color:#fff;
  background:#3a9285;
  font-size:12px;
  font-weight:750;
}
.person-add-duplicate-prompt .text-button,
.person-duplicate-notice .text-button {
  color:#6f7e78;
  background:rgba(255,255,255,.7);
}
.person-duplicate-notice {
  margin:18px 20px 8px;
  padding:18px;
  border:1px solid rgba(224,157,81,.2);
  border-radius:18px;
  background:
    radial-gradient(circle at 92% 8%,rgba(255,197,84,.2),transparent 35%),
    linear-gradient(145deg,#fffaf0,#f0f8f4);
}
.person-duplicate-notice h2 {
  margin:5px 0 6px;
  color:#334d46;
  font-size:18px;
  line-height:1.45;
}
.person-duplicate-notice p {
  margin:0;
  color:#71807a;
  font-size:12px;
  line-height:1.65;
}
.empty-person-action {
  margin:16px 20px 4px;
  padding:14px 0;
  border-top:1px solid rgba(57,76,69,.09);
  border-bottom:1px solid rgba(57,76,69,.09);
}
.empty-person-action p {
  display:inline;
  margin:0;
  color:#7f8984;
  font-size:12px;
}
.empty-person-action button {
  float:right;
  min-height:32px;
  padding:4px 0;
  border:0;
  color:#b26858;
  background:transparent;
  font-size:12px;
  font-weight:750;
}
.empty-person-action::after { display:block; clear:both; content:""; }

/* Person correction proposals — calm, traceable and family-readable. */
.person-corrections {
  margin:16px 20px;
  padding:18px;
  border:1px solid rgba(55,108,99,.12);
  border-radius:22px;
  background:rgba(255,255,255,.58);
}
.person-corrections > header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.person-corrections h2,.person-corrections h3 { margin:0; color:#294b45; }
.person-corrections header p { margin:4px 0 0; color:#7b8580; font-size:12px; line-height:1.55; }
.person-corrections > header > button,.person-correction-list footer button:first-child {
  flex:0 0 auto;
  min-height:38px;
  padding:8px 14px;
  border:0;
  border-radius:14px;
  color:#fff;
  background:#3a9b8c;
  font-weight:750;
}
.person-correction-composer {
  position:relative;
  margin-top:16px;
  padding:20px;
  border-radius:18px;
  background:#f4eee2;
}
.person-correction-composer > span { color:#2b8c7e; font-size:12px; font-weight:800; }
.person-correction-composer > h3 { margin-top:6px; font-size:20px; }
.person-correction-composer > p { margin:8px 28px 14px 0; color:#6f7a75; font-size:13px; line-height:1.65; }
.person-correction-composer form { display:grid; gap:12px; }
.person-correction-composer label { display:grid; gap:6px; color:#405b55; font-size:13px; font-weight:750; }
.person-correction-composer label small { color:#8a918d; font-weight:500; }
.person-correction-composer input,.person-correction-composer select,.person-correction-composer textarea {
  box-sizing:border-box;
  width:100%;
  min-height:48px;
  padding:12px 14px;
  border:1px solid rgba(54,94,86,.14);
  border-radius:14px;
  color:#293d38;
  background:#fffdfa;
  font:inherit;
}
.person-correction-composer textarea { min-height:82px; resize:vertical; }
.person-correction-composer form > button {
  min-height:46px;
  border:0;
  border-radius:15px;
  color:#fff;
  background:#3a9b8c;
  font-weight:800;
}
.person-correction-list { display:grid; gap:10px; margin-top:14px; }
.person-correction-list article {
  padding:14px;
  border-radius:16px;
  background:#fffdfa;
}
.person-correction-list article > span { color:#b07b52; font-size:11px; font-weight:800; }
.person-correction-list p { display:flex; align-items:center; gap:9px; margin:8px 0 5px; }
.person-correction-list del { color:#929995; }
.person-correction-list i { color:#c1aaa0; font-style:normal; }
.person-correction-list b { color:#244f47; font-size:17px; }
.person-correction-list small,.person-correction-list em {
  display:block;
  color:#7d8883;
  font-size:12px;
  font-style:normal;
  line-height:1.55;
}
.person-correction-list footer { display:flex; gap:8px; margin-top:12px; }
.person-correction-history { margin-top:12px; color:#667670; font-size:12px; }
.person-correction-history summary { cursor:pointer; }
.person-correction-history p { display:grid; grid-template-columns:auto 1fr; gap:3px 8px; margin:10px 0 0; }
.person-correction-history p span { color:#a07359; }
.person-correction-history p small { grid-column:2; color:#8b938f; }
.person-correction-inbox {
  margin-bottom:14px;
  padding:16px;
  border-radius:18px;
  background:#fff4df;
}
.person-correction-inbox > span { color:#ae704b; font-size:12px; font-weight:800; }
.person-correction-inbox > p { margin:5px 0 12px; color:#7d807c; font-size:12px; }
.person-correction-inbox article { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-top:1px solid rgba(115,87,66,.1); }
.person-correction-inbox article div { display:grid; gap:4px; min-width:0; }
.person-correction-inbox article b { color:#38544e; font-size:14px; }
.person-correction-inbox article small { overflow:hidden; color:#7e8782; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.person-correction-inbox article button { flex:0 0 auto; min-height:36px; padding:7px 12px; border-radius:13px; }

@media (max-width:380px) {
  .person-corrections { margin-inline:14px; padding:15px; }
  .person-corrections > header { align-items:flex-start; }
}

#appUpdate {
  position:fixed;
  z-index:240;
  right:14px;
  bottom:calc(86px + env(safe-area-inset-bottom));
  left:14px;
  max-width:430px;
  margin:auto;
  padding:11px 16px;
  border:1px solid rgba(43,112,101,.12);
  border-radius:16px;
  color:#31534d;
  background:rgba(255,251,241,.96);
  box-shadow:0 12px 32px rgba(51,76,68,.14);
  font-size:12px;
  font-weight:700;
  line-height:1.55;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  text-align:left;
  backdrop-filter:blur(14px);
}
#appUpdate span { min-width:0; }
#appUpdate button {
  flex:0 0 auto;
  min-height:34px;
  padding:6px 11px;
  border:0;
  border-radius:11px;
  color:white;
  background:#2f8d7f;
  font:inherit;
}
#appUpdate[hidden] { display:none; }

/* Family source rows: identity first, secondary actions quiet and aligned. */
.person-source-record-list article {
  grid-template-columns:44px minmax(0,1fr);
  align-items:start;
  gap:0 12px;
  padding:15px 4px;
}
.person-source-record-list .source-person-portrait {
  grid-row:1 / span 2;
  width:42px;
  height:42px;
}
.person-source-copy {
  min-width:0;
  padding-top:1px;
}
.person-source-record-list .person-source-copy b { color:#344f49; font-size:14px; }
.person-source-record-list .person-source-copy small { margin-top:3px; }
.person-source-actions {
  grid-column:2;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:5px;
  margin-top:9px;
}
.person-source-actions label,
.person-source-actions .person-source-edit {
  display:inline-flex;
  min-width:0;
  min-height:31px;
  margin:0;
  align-items:center;
  justify-content:center;
  padding:5px 10px;
  border:0;
  border-radius:999px;
  box-shadow:none;
  font-size:11px;
  font-weight:750;
  line-height:1;
}
.person-source-actions label {
  color:#27776b;
  background:#e8f4ef;
}
.person-source-actions .person-source-edit {
  color:#60736d;
  background:transparent;
}
.person-source-actions .person-source-edit::after {
  margin-left:3px;
  content:"›";
  color:#94a29d;
  font-size:15px;
  line-height:.8;
}

/* Birth details stay truthful when a family only remembers part of a date. */
.birth-editor {
  display:grid;
  gap:9px;
  padding:11px 0;
}
.birth-editor label { margin:0; }
.birth-editor-fields {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.birth-editor [hidden] { display:none !important; }
.birth-editor-note {
  color:#89958f;
  font-size:11px;
  line-height:1.55;
}
.birth-source-note { grid-column:1 / -1; }
.person-source-actions .person-source-birth {
  appearance:none;
  min-height:31px;
  padding:5px 10px;
  border:0;
  border-radius:999px;
  color:#56716a;
  background:#f1f4ef;
  font-size:11px;
  font-weight:750;
}
.person-source-copy .person-birth-summary { color:#5c7770; }
.person-source-records #personBirthComposer:not(:empty),
.person-source-records #personEditComposer:not(:empty) { padding:0 15px 15px; }
.person-birth-form {
  position:relative;
  margin-top:12px;
  padding:18px;
  border:1px solid rgba(45,116,102,.12);
  border-radius:18px;
  background:#fffdf8;
  box-shadow:none;
}
.person-birth-form > span { color:#2c8879; font-size:11px; font-weight:750; }
.person-birth-form > h3 { margin:4px 34px 8px 0; color:#38574f; font-size:18px; }
.person-birth-form select,.person-birth-form input { min-height:44px; font-size:15px; }
@media (max-width:360px) {
  .birth-editor-fields { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

/* Profile forms previously treated the birth editor as a generic two-column div. */
.tab-profile .profile-simple-form > .birth-editor {
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:10px;
  padding:12px 0;
  border-top:1px solid rgba(56,75,67,.065);
}
.tab-profile .birth-editor .birth-precision {
  padding:0;
  border:0;
}
.tab-profile .birth-editor-fields {
  display:grid;
  grid-template-columns:minmax(72px,1fr) minmax(82px,1.22fr) minmax(58px,.78fr) minmax(58px,.78fr);
  align-items:end;
  gap:7px;
}
.tab-profile .birth-editor-fields label,
.tab-profile .birth-editor-fields label + label {
  min-width:0;
  padding:0;
  border-top:0;
}
.tab-profile .birth-editor select,
.tab-profile .birth-editor input {
  width:100%;
  height:48px;
  min-height:48px;
  padding:10px;
  border:1px solid #dfe4de;
  border-radius:11px;
  background:#fffdf9;
  font-size:15px;
  box-shadow:none;
}
.tab-profile .birth-editor-note { margin-top:1px; }
@media (max-width:360px) {
  .tab-profile .birth-editor-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px 8px; }
}

/* Optional life experience stays out of the primary profile path until needed. */
.tab-profile .profile-experience-editor {
  margin-top:4px;
  border-top:1px solid rgba(56,75,67,.065);
}
.tab-profile .profile-experience-editor > summary {
  display:flex;
  min-height:58px;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:11px 0;
  cursor:pointer;
  list-style:none;
}
.tab-profile .profile-experience-editor > summary::-webkit-details-marker { display:none; }
.tab-profile .profile-experience-editor > summary span { display:grid; gap:3px; }
.tab-profile .profile-experience-editor > summary b { color:#486159; font-size:13px; }
.tab-profile .profile-experience-editor > summary small { color:#929b96; font-size:11px; font-weight:500; }
.tab-profile .profile-experience-editor > summary em {
  color:#a1aaa5;
  font-size:20px;
  font-style:normal;
  transition:transform .2s ease;
}
.tab-profile .profile-experience-editor[open] > summary em { transform:rotate(90deg); }
.tab-profile .profile-experience-editor > div { display:grid; grid-template-columns:1fr; gap:0; padding:0 0 4px; }
.tab-profile .profile-experience-editor > div > label,
.tab-profile .profile-experience-editor > div > label + label { padding:9px 0; border-top:0; }
.profile-experience-suggestions {
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:7px !important;
  margin:5px 0 8px;
  padding:10px 11px;
  border-radius:12px;
  background:#f3f7f2;
}
.profile-experience-suggestions > span { color:#75837d; font-size:11px; }
.profile-experience-suggestions > div { display:flex; flex-wrap:wrap; gap:6px; }
.profile-experience-suggestions button {
  display:inline-flex;
  min-height:32px;
  align-items:center;
  gap:5px;
  padding:6px 9px;
  border:1px solid rgba(48,123,109,.11);
  border-radius:999px;
  color:#40665d;
  background:#fffdfa;
  font-size:12px;
}
.profile-experience-suggestions button small { color:#8b9792; font-size:11px; }

/* A private, viewer-specific address sits quietly beside the derived kinship. */
.person-viewer-label {
  display:flex;
  min-height:28px;
  margin:9px 0 0;
  align-items:center;
  justify-content:center;
  gap:7px;
}
.person-page > header .person-viewer-label p {
  margin:0;
  color:#2e6f65;
  font-size:12px;
  font-weight:700;
}
.person-viewer-label button {
  min-height:26px;
  padding:3px 9px;
  border:1px solid rgba(36,112,100,.16);
  border-radius:999px;
  color:#34776d;
  background:rgba(255,255,255,.54);
  font-size:11px;
  font-weight:700;
}

/* Person profile actions follow the object they edit: portrait on portrait, address on address. */
.person-avatar-action {
  position:relative;
  display:block;
  width:76px;
  margin:auto;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.person-avatar-action > input {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  opacity:0;
}
.person-avatar-action .person-avatar { margin:0; }
.person-avatar-edit-badge {
  position:absolute;
  right:-2px;
  bottom:0;
  display:grid;
  width:25px;
  height:25px;
  place-items:center;
  border:2px solid rgba(255,255,255,.9);
  border-radius:50%;
  color:#2c756a;
  background:#fffaf0;
  box-shadow:0 4px 12px rgba(26,72,64,.18);
  font-size:17px;
  font-style:normal;
  font-weight:500;
  line-height:1;
}
.person-avatar-action:focus-within .person-avatar {
  outline:3px solid rgba(255,255,255,.68);
  outline-offset:3px;
}
.person-viewer-label .person-address-chip {
  display:inline-flex;
  min-height:28px;
  align-items:center;
  gap:5px;
  padding:2px 3px;
  border:0;
  border-radius:0;
  color:#2e6f65;
  background:transparent;
  font-size:12px;
  font-weight:750;
}
.person-address-chip i {
  color:rgba(45,111,101,.65);
  font-size:11px;
  font-style:normal;
}
.person-address-chip:focus-visible {
  outline:2px solid rgba(255,255,255,.72);
  outline-offset:3px;
}

/* One calm archive replaces separate correction and source modules. */
.person-family-archive {
  margin:2px 20px 28px;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(54,100,91,.1);
  border-radius:20px;
  background:rgba(255,255,255,.58);
}
.person-family-archive.needs-review {
  border-color:rgba(217,146,84,.22);
  background:linear-gradient(145deg,rgba(255,249,237,.9),rgba(248,252,248,.82));
}
.person-family-archive > details > summary {
  min-height:70px;
  padding:14px 17px;
}
.person-family-archive > details[open] > summary {
  border-bottom:1px solid rgba(54,100,91,.08);
  background:transparent;
}
.person-family-archive.needs-review > details > summary > em {
  color:#a46943;
  background:#fff1dc;
}
.person-archive-intro {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:16px 17px 4px;
}
.person-archive-intro p {
  flex:1;
  margin:0;
  color:#7b8883;
  font-size:11px;
  line-height:1.65;
}
.person-archive-intro button {
  flex:0 0 auto;
  min-height:32px;
  padding:4px 0;
  border:0;
  color:#367e72;
  background:transparent;
  font-size:11px;
  font-weight:750;
  white-space:nowrap;
}
.person-family-archive #personCorrectionComposer:not(:empty) { padding:0 15px 12px; }
.person-family-archive .person-correction-composer { margin-top:12px; }
.person-family-archive .person-correction-list { margin:12px 15px 0; }
.person-family-archive .person-correction-history { margin:14px 17px 0; }
.person-archive-source-title {
  margin:18px 17px 0;
  padding-top:17px;
  border-top:1px solid rgba(54,100,91,.09);
  color:#60736d;
  font-size:12px;
  font-weight:750;
}
.person-family-archive .person-source-record-list { padding:0 13px; }
.person-family-archive > details > p { margin:4px 17px 17px; }
.person-family-archive .person-source-actions:empty { display:none; }
@media (max-width:380px) {
  .person-family-archive { margin-inline:14px; }
  .person-archive-intro { display:block; }
  .person-archive-intro button { margin-top:8px; }
}
#personAliasComposer:empty { display:none; }
#personAliasComposer { margin:18px 22px 0; }
.person-alias-composer {
  padding:20px;
  border:1px solid rgba(40,112,100,.12);
  border-radius:22px;
  background:linear-gradient(145deg,#f4fbf7,#fffaf0);
  box-shadow:0 12px 30px rgba(48,78,68,.07);
}
.person-alias-composer > span {
  color:#2b8074;
  font-size:11px;
  font-weight:800;
  letter-spacing:.1em;
}
.person-alias-composer > h3 {
  margin:7px 46px 5px 0;
  color:#254b44;
  font-family:Georgia,"Songti SC",serif;
  font-size:22px;
  font-weight:600;
}
.person-alias-composer > p {
  margin:0 0 16px;
  color:#71807a;
  font-size:12px;
  line-height:1.65;
}
.person-alias-composer form label {
  display:grid;
  gap:7px;
  color:#4d6861;
  font-size:12px;
  font-weight:700;
}
.person-alias-composer input {
  width:100%;
  min-height:48px;
  padding:0 14px;
  border:1px solid rgba(39,107,96,.16);
  border-radius:14px;
  color:#254b44;
  background:rgba(255,255,255,.88);
  font-size:16px;
  outline:none;
}
.person-alias-composer input:focus {
  border-color:#47a89a;
  box-shadow:0 0 0 3px rgba(71,168,154,.12);
}
.person-alias-composer form > small {
  display:block;
  margin-top:8px;
  color:#78867f;
  font-size:11px;
}
.person-alias-composer form > div {
  display:flex;
  margin-top:15px;
  align-items:center;
  gap:8px;
}
.person-alias-composer form > div .primary {
  width:auto;
  min-height:42px;
  padding:9px 16px;
}
.person-alias-composer form > div .text-button {
  min-height:42px;
  padding:9px 12px;
  color:#71807a;
}

/* Account identity recovery stays inline so people can see what is changing. */
.identity-inline-form { position:relative; margin-top:12px; }
.identity-inline-form .panel-close-button {
  position:absolute;
  top:10px;
  right:10px;
  width:34px;
  height:34px;
  min-height:34px;
  margin:0;
  font-size:21px;
}
.identity-inline-form > h2,
.identity-inline-form > h3 { padding-right:42px; }
.test-code-hint {
  display:block;
  margin:7px 0;
  color:#a56628;
  font-size:12px;
  font-weight:750;
}
.tab-profile .profile-login-methods .profile-method-actions {
  display:flex;
  grid-auto-flow:column;
  align-items:center;
  gap:10px;
}
.tab-profile .profile-login-methods .profile-method-actions .text-button,
.tab-profile .profile-login-methods .profile-method-actions .danger-text {
  min-height:34px;
  margin:0;
  padding:6px 2px;
  border:0;
  background:transparent;
  box-shadow:none;
  color:#397d73;
  font-size:11px;
}
.tab-profile .profile-login-methods .profile-method-actions .danger-text { color:#a26052; }
.tab-profile .profile-inline-action {
  min-height:40px;
  margin-top:7px;
  padding:8px 12px;
  border:1px solid rgba(43,128,116,.15);
  border-radius:12px;
  color:#347b70;
  background:#f1faf6;
  font-size:12px;
  font-weight:750;
}
.tab-profile #identityActionSlot:empty { display:none; }
.tab-profile #identityActionSlot .identity-inline-form {
  padding:15px;
  border:1px solid rgba(43,128,116,.12);
  border-radius:15px;
  background:#f8fbf8;
}
.tab-profile .profile-security-section:has(#identityActionSlot:not(:empty)) > .profile-inline-action { display:none; }
.tab-profile #identityActionSlot .identity-phone-form {
  gap:0;
  margin:14px 0 2px !important;
  padding:18px !important;
  border:0;
  border-radius:20px;
  background:
    radial-gradient(circle at 92% 4%,rgba(243,197,87,.19),transparent 108px),
    linear-gradient(145deg,#f5fbf7,#fffaf0);
  box-shadow:0 10px 28px rgba(45,81,72,.08);
}
.tab-profile .identity-phone-form .panel-close-button {
  top:13px;
  right:13px;
  width:32px;
  height:32px;
  min-height:32px;
  color:#70817a;
  background:rgba(255,255,255,.72);
  box-shadow:0 4px 12px rgba(46,71,63,.08);
}
.identity-phone-head {
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  gap:12px;
  padding:0 42px 15px 0;
  align-items:start;
}
.identity-phone-head > i {
  display:grid;
  width:40px;
  height:40px;
  place-items:center;
  border-radius:13px;
  color:#2f887c;
  background:rgba(218,241,233,.9);
  font-style:normal;
}
.identity-phone-head svg { width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round; }
.identity-phone-head span { display:block;color:#b27643;font-size:11px;font-weight:800;letter-spacing:.08em; }
.tab-profile .identity-phone-head h3 { margin:2px 0 3px;padding:0;color:#35544c;font-size:17px;line-height:1.35; }
.identity-phone-head p { margin:0;color:#77837e;font-size:11px;line-height:1.55; }
.tab-profile .identity-phone-form .identity-phone-field {
  display:grid;
  gap:7px;
  padding:10px 0 0;
  border-top:1px solid rgba(55,83,74,.08);
  color:#53665f;
  font-size:11px;
  font-weight:700;
}
.tab-profile .identity-phone-form .identity-phone-field + .identity-phone-field { margin-top:8px; }
.tab-profile .identity-phone-form .identity-phone-field input {
  width:100%;
  min-height:50px;
  padding:12px 14px;
  border:1px solid rgba(50,118,106,.15);
  border-radius:14px;
  background:rgba(255,255,255,.9);
  font-size:16px;
  box-shadow:0 3px 12px rgba(46,74,65,.04);
}
.tab-profile .identity-phone-form .identity-phone-primary {
  width:100%;
  min-height:50px;
  margin:13px 0 0;
  border:0;
  border-radius:14px;
  color:white;
  background:linear-gradient(145deg,#48aa9d,#318c80);
  box-shadow:0 8px 18px rgba(48,139,127,.17);
  font-size:14px;
}
.identity-phone-privacy { display:block;margin:9px 2px 0;color:#87928d;font-size:11px;line-height:1.5;text-align:center; }
.tab-profile .identity-phone-form .otp-resend-actions { margin-top:8px;justify-content:center; }
.tab-profile .identity-inline-form .danger-button {
  min-height:44px;
  border:1px solid rgba(162,96,82,.2);
  border-radius:12px;
  color:#995949;
  background:#fff8f4;
  font-weight:750;
}
.tab-profile .profile-login-methods {
  display:grid;
  gap:8px;
  margin-top:8px;
}
.tab-profile .profile-login-method {
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto auto;
  min-height:62px;
  padding:9px 9px 9px 11px;
  align-items:center;
  gap:10px;
  border:1px solid rgba(53,83,73,.08);
  border-radius:15px;
  background:#fbfcf9;
}
.tab-profile .profile-login-method > i {
  display:grid;
  width:36px;
  height:36px;
  place-items:center;
  border-radius:12px;
  color:#43877c;
  background:#eaf5f0;
  font-style:normal;
}
.tab-profile .profile-login-method > i svg,
.identity-method-sheet header > i svg {
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.tab-profile .profile-login-method > span { display:grid; min-width:0; gap:3px; }
.tab-profile .profile-login-method > span b { color:#3d554e; font-size:13px; }
.tab-profile .profile-login-method > span small { overflow:hidden; color:#929a96; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.tab-profile .profile-login-method > em {
  padding:4px 7px;
  border-radius:999px;
  color:#3d8277;
  background:#edf7f3;
  font-size:11px;
  font-style:normal;
  font-weight:750;
  white-space:nowrap;
}
.tab-profile .profile-login-method > button {
  display:flex;
  min-height:36px;
  padding:7px 5px 7px 8px;
  align-items:center;
  gap:3px;
  border:0;
  color:#5f706a;
  background:transparent;
  font-size:11px;
  font-weight:700;
}
.tab-profile .profile-login-method > button span { color:#9aa39f; font-size:17px; font-weight:400; }
.identity-action-overlay {
  position:fixed;
  z-index:450;
  inset:0;
  display:flex;
  padding:18px 16px max(22px,env(safe-area-inset-bottom));
  align-items:flex-end;
  justify-content:center;
  background:rgba(33,43,39,.28);
  -webkit-backdrop-filter:blur(5px);
  backdrop-filter:blur(5px);
}
.identity-method-sheet,
.identity-unlink-form {
  position:relative;
  width:min(100%,460px);
  max-height:min(76vh,620px);
  overflow:auto;
  padding:19px;
  border:1px solid rgba(55,82,73,.09);
  border-radius:23px;
  background:#fffdf8;
  box-shadow:0 20px 55px rgba(30,47,41,.2);
}
.identity-method-sheet .panel-close-button,
.identity-unlink-form .panel-close-button {
  position:absolute;
  top:13px;
  right:13px;
  width:34px;
  height:34px;
  min-height:34px;
  margin:0;
  color:#74827d;
  background:#f3f5f1;
  box-shadow:none;
}
.identity-method-sheet > header {
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  padding:3px 42px 16px 0;
  align-items:center;
  gap:11px;
}
.identity-method-sheet header > i {
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:14px;
  color:#38877a;
  background:#e8f5ef;
  font-style:normal;
}
.identity-method-sheet header > span { display:grid; gap:2px; }
.identity-method-sheet header small { color:#a4784d; font-size:11px; font-weight:800; letter-spacing:.08em; }
.identity-method-sheet header h3 { margin:0; color:#344f47; font-size:17px; }
.identity-method-sheet header p { margin:0; color:#8a9590; font-size:11px; }
.identity-method-sheet header > em { padding:5px 8px; border-radius:999px; color:#3c8277; background:#edf7f3; font-size:11px; font-style:normal; font-weight:750; }
.identity-method-sheet-actions { display:grid; border-top:1px solid rgba(55,82,73,.08); }
.identity-method-sheet-actions > button {
  display:grid;
  grid-template-columns:minmax(0,1fr) 16px;
  min-height:61px;
  padding:11px 2px;
  align-items:center;
  gap:8px;
  border:0;
  border-bottom:1px solid rgba(55,82,73,.07);
  color:#38554d;
  background:transparent;
  text-align:left;
}
.identity-method-sheet-actions > button:last-of-type { border-bottom:0; }
.identity-method-sheet-actions > button span { display:grid; gap:3px; }
.identity-method-sheet-actions > button b { font-size:13px; }
.identity-method-sheet-actions > button small { color:#8c9691; font-size:11px; font-weight:500; }
.identity-method-sheet-actions > button > i { color:#a1aaa5; font-size:20px; font-style:normal; }
.identity-method-sheet-actions > button.is-danger b { color:#9c5d50; }
.identity-method-sheet-actions > p { margin:10px 0 1px; color:#89928e; font-size:11px; line-height:1.55; }
.identity-unlink-form > span { color:#ac7456; font-size:11px; font-weight:800; letter-spacing:.1em; }
.identity-unlink-form > h3 { margin:5px 42px 5px 0; color:#40554f; font-size:18px; }
.identity-unlink-form > p { margin:0 36px 14px 0; color:#7d8984; font-size:12px; line-height:1.65; }
.identity-unlink-form > label { display:grid; gap:7px; color:#586a64; font-size:11px; font-weight:700; }
.identity-unlink-form > label input { width:100%; min-height:50px; padding:12px 14px; border:1px solid #dfe4de; border-radius:14px; background:#fff; font-size:16px; box-shadow:none; }
.identity-unlink-form > footer { display:grid; grid-template-columns:1fr 1.25fr; gap:9px; margin-top:14px; }
.identity-unlink-form > footer button { min-height:46px; border:0; border-radius:13px; color:#6d7b76; background:#f2f4f0; font-size:12px; font-weight:750; }
.identity-unlink-form > footer .danger-button { color:#985849; background:#fff1eb; }
@media (min-width:700px) {
  .identity-action-overlay { align-items:center; }
}
.profile-login-name-readonly { display:grid; gap:3px; margin:2px 0 14px; padding:12px 14px; border-radius:14px; color:#53665f; background:#f3f7f3; }
.profile-login-name-readonly span { font-size:11px; font-weight:700; }
.profile-login-name-readonly b { color:#31564e; font-size:15px; font-weight:750; }
.profile-login-name-readonly small { color:#84908b; font-size:11px; line-height:1.5; }
#accountRecoverySlot:empty { display:none; }

.birthday-module { margin:14px 0;padding:18px;border:1px solid rgba(232,157,93,.17);border-radius:20px;background:linear-gradient(135deg,#fffaf0,#f7fbf5); }
.birthday-module>header { display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:13px; }
.birthday-module>header span { color:#bd7654;font-size:11px;font-weight:800;letter-spacing:.08em; }
.birthday-module>header h2 { margin:3px 0 0;font:500 19px/1.4 Georgia,"Songti SC",serif; }
.birthday-module>header small { color:#8a918d;font-size:11px;text-align:right; }
.birthday-module>div { display:grid;gap:2px; }
.birthday-module>div>button { display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:11px;width:100%;padding:10px 3px;border:0;border-top:1px solid rgba(56,105,94,.08);color:var(--ink);background:transparent;text-align:left; }
.birthday-module>div>button:first-child { border-top:0; }
.birthday-module button>i { display:grid;width:36px;height:36px;place-items:center;overflow:hidden;border-radius:50%;color:#397a70;background:#e9f5f0;font-style:normal;font-weight:750;background-size:cover;background-position:center; }
.birthday-module button>span { display:grid;min-width:0; }
.birthday-module button b { overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px; }
.birthday-module button small { color:#89918d;font-size:11px; }
.birthday-module button em { padding:4px 8px;border-radius:999px;color:#a56644;background:#fff0dd;font-size:11px;font-style:normal;font-weight:750;white-space:nowrap; }

.story-moderation-entry { margin:22px 0 4px;text-align:center; }
.story-moderation-entry>.text-button { color:#7a7770;font-size:12px;font-weight:600; }
.story-moderation-state,.story-report-form {
  position:relative;margin:22px 0 4px;padding:17px 18px;border:1px solid rgba(197,145,94,.2);
  border-radius:18px;background:#fffaf1;color:var(--ink);text-align:left;
}
.story-moderation-state b,.story-report-form>b { display:block;margin-bottom:5px;font-size:15px; }
.story-moderation-state p,.story-report-form p { margin:0;color:var(--muted);font-size:13px;line-height:1.65; }
.story-moderation-state.action,.story-report-form { display:grid;gap:12px; }
.story-moderation-state label,.story-report-form label { display:grid;gap:6px;color:var(--muted);font-size:12px;font-weight:700; }
.story-moderation-state textarea,.story-report-form textarea,.story-report-form select {
  width:100%;min-height:46px;padding:11px 12px;border:1px solid rgba(45,105,95,.16);border-radius:12px;
  color:var(--ink);background:#fff;font:inherit;
}
.story-moderation-state textarea,.story-report-form textarea { min-height:82px;resize:vertical; }
.story-moderation-state.action>div { display:flex;gap:9px; }
.story-moderation-state.action>div button { flex:1;min-height:43px; }
.story-moderation-state small,.story-report-form small { color:#8c877d;font-size:11px;line-height:1.55; }
.story-report-form .panel-close-button { position:absolute;top:10px;right:10px; }
.moments-moderation-tasks { display:grid;gap:10px;margin-top:15px; }
.moments-moderation-tasks>h3 { margin:0;color:#806b50;font-size:12px;letter-spacing:.05em; }
.moments-moderation-card { display:grid;gap:6px;padding:15px;border:1px solid rgba(197,145,94,.18);border-radius:16px;background:#fffaf1; }
.moments-moderation-card span { color:var(--muted);font-size:11px; }
.moments-moderation-card b { font-size:15px; }
.moments-moderation-card p { margin:0;color:var(--muted);font-size:12px;line-height:1.55; }
.moments-moderation-card button { justify-self:start;margin-top:3px; }

/* V40 — 首页只保留一个主角、一条行动和一条安静的阅读流。 */
.tab-home .home-story-heading {
  min-height:42px;
  margin:14px 0 12px;
}
.tab-home .home-story-heading h2 {
  font-family:Georgia,"Songti SC",serif;
  font-size:26px;
  font-weight:550;
  line-height:1.28;
}
.tab-home .family-light-card {
  margin:0 0 26px;
}
.family-light-card:not(.is-new-legacy) {
  min-height:154px;
  padding:24px 22px;
  border-color:rgba(211,157,82,.15);
  border-radius:22px;
  background:
    radial-gradient(circle at 92% 13%,rgba(255,199,82,.32),transparent 28%),
    linear-gradient(145deg,#fff9e9 0%,#fffdf8 57%,#edf7f2 100%);
  box-shadow:0 11px 28px rgba(83,76,48,.055);
}
.family-light-card:not(.is-new-legacy)::after {
  content:"✦";
  position:absolute;
  top:18px;
  right:20px;
  color:rgba(221,157,47,.78);
  font-size:22px;
}
.family-light-seed,
.family-light-review {
  position:relative;
  z-index:1;
  max-width:300px;
  padding:0;
}
.family-light-seed > span,
.family-light-review > span {
  display:block;
  margin:0 0 9px;
  color:#a3703d;
  font-size:12px;
  font-weight:700;
}
.family-light-seed > p,
.family-light-review > p {
  margin:0 0 18px;
  color:#315a51;
  font-family:Georgia,"Songti SC",serif;
  font-size:21px;
  font-weight:550;
  line-height:1.48;
}
.family-light-card:not(.is-new-legacy) .family-light-seed > button,
.family-light-card:not(.is-new-legacy) .family-light-review > button {
  min-height:42px;
  padding:9px 16px;
  border-radius:14px;
  background:#e98b5c;
  font-size:13px;
}
.family-light-loading {
  min-height:104px;
  font-size:13px;
}
.family-light-forming {
  position:relative;
  z-index:1;
  display:grid;
  min-height:104px;
  max-width:310px;
  align-content:center;
  gap:7px;
}
.family-light-forming > span { color:#a3703d; font-size:12px; font-weight:750; }
.family-light-forming > p { margin:0; color:#45665d; font-size:14px; line-height:1.65; }
.family-light-formed-header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.family-light-formed-header h2 {
  display:flex;
  min-width:0;
  align-items:center;
  gap:7px;
  margin:0;
  color:#31574f;
  font-size:16px;
  font-weight:750;
}
.family-light-formed-header h2 em {
  display:grid;
  width:18px;
  height:18px;
  place-items:center;
  border-radius:50%;
  color:#b66245;
  background:#ffead6;
  font-size:11px;
  font-style:normal;
}
.family-light-formed-header h2 small {
  padding:4px 7px;
  border-radius:999px;
  color:#7a867f;
  background:rgba(53,112,99,.07);
  font-size:11px;
  font-weight:650;
  white-space:nowrap;
}
.family-light-card.is-new-legacy .family-light-statement blockquote {
  margin:22px 0 9px;
  font-size:24px;
}
.family-light-primary-action {
  display:flex;
  justify-content:flex-start;
  margin-top:17px;
}
.family-light-card .family-light-primary-action button {
  min-height:42px;
  border:1px solid rgba(231,126,86,.15);
  border-radius:14px;
  color:#fff;
  background:#e88758;
  box-shadow:none;
  font-size:13px;
}
.family-light-context {
  margin-top:15px;
  border-top:1px solid rgba(70,92,82,.1);
}
.family-light-context > summary {
  display:flex;
  min-height:44px;
  align-items:center;
  justify-content:space-between;
  color:#66756f;
  cursor:pointer;
  font-size:12px;
  font-weight:650;
  list-style:none;
}
.family-light-context > summary::-webkit-details-marker { display:none; }
.family-light-context > summary i {
  font-size:14px;
  font-style:normal;
  transition:transform .18s ease;
}
.family-light-context[open] > summary i { transform:rotate(180deg); }
.family-light-context > .family-light-discovery {
  margin-top:0;
  padding-top:13px;
}
/* V41 — 家庭的成长来自真实故事、家人回应和被共同确认的光。 */
.family-light-formed-header > div { min-width:0; }
.family-light-formed-header > div > span {
  display:block;
  margin:0 0 4px;
  color:#a57447;
  font-size:11px;
  font-weight:750;
  letter-spacing:.08em;
}
.family-light-growth {
  margin:17px 0 2px;
  padding:13px 0;
  border-top:1px solid rgba(74,106,93,.09);
  border-bottom:1px solid rgba(74,106,93,.09);
}
.family-light-growth > div {
  display:flex;
  flex-wrap:wrap;
  gap:7px 15px;
}
.family-light-growth > div span { color:#79847f; font-size:11px; white-space:nowrap; }
.family-light-growth > div b { color:#2f6f64; font-size:15px; font-weight:750; }
.family-light-growth > p {
  margin:8px 0 0;
  color:#a26e43;
  font-family:Georgia,"Songti SC",serif;
  font-size:13px;
  line-height:1.5;
}
.family-light-seed-progress {
  overflow:hidden;
  width:100%;
  height:4px;
  margin:-7px 0 17px;
  border-radius:999px;
  background:rgba(204,157,79,.15);
}
.family-light-seed-progress > i {
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#efb257,#e98b5c);
}
.family-light-album-hint,
.family-light-next-milestone {
  margin:12px 1px 0;
  color:#7b8680;
  font-size:11px;
  line-height:1.65;
}
.family-light-next-milestone {
  padding-left:13px;
  border-left:2px solid rgba(225,153,75,.36);
  color:#65756e;
}
.family-light-album {
  margin-top:14px;
  border-top:1px solid rgba(70,92,82,.1);
}
.family-light-album > summary {
  display:flex;
  min-height:46px;
  align-items:center;
  gap:8px;
  color:#315a51;
  cursor:pointer;
  list-style:none;
}
.family-light-album > summary::-webkit-details-marker { display:none; }
.family-light-album > summary span { font-size:13px; font-weight:750; }
.family-light-album > summary b { margin-left:auto; color:#9a744a; font-size:11px; }
.family-light-album > summary i { font-size:14px; font-style:normal; transition:transform .18s ease; }
.family-light-album[open] > summary i { transform:rotate(180deg); }
.family-light-album > div {
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(236px,86%);
  gap:10px;
  overflow-x:auto;
  padding:2px 1px 8px;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
}
.family-light-album > div::-webkit-scrollbar { display:none; }
.family-light-album-entry {
  min-width:0;
  padding:15px;
  border:1px solid rgba(54,103,91,.1);
  border-radius:17px;
  background:linear-gradient(145deg,rgba(255,250,237,.84),rgba(235,247,241,.72));
  scroll-snap-align:start;
}
.family-light-album-entry.current { border-color:rgba(230,144,82,.22); }
.family-light-album-entry > span { color:#b67647; font-size:11px; font-weight:750; letter-spacing:.08em; }
.family-light-album-entry blockquote {
  margin:7px 0 5px;
  color:#315a51;
  font-family:Georgia,"Songti SC",serif;
  font-size:17px;
  font-weight:650;
  line-height:1.5;
}
.family-light-album-entry p {
  display:-webkit-box;
  overflow:hidden;
  margin:0 0 8px;
  color:#68766f;
  font-size:11px;
  line-height:1.55;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.family-light-album-entry small { color:#8b928e; font-size:11px; line-height:1.45; }
.family-light-family-overview { padding-right:17px !important; padding-left:17px !important; }
.family-light-family-overview > header { position:relative; z-index:1; display:flex; align-items:flex-end; justify-content:space-between; gap:12px; padding:0 4px 15px; }
.family-light-family-overview > header span { display:block; margin-bottom:5px; color:#a57447; font-size:11px; font-weight:750; letter-spacing:.08em; }
.family-light-family-overview > header h2 { max-width:290px; margin:0; color:#315a51; font-family:Georgia,"Songti SC",serif; font-size:20px; font-weight:600; line-height:1.45; }
.family-light-family-overview > header > small { flex:0 0 auto; padding-bottom:3px; color:#89928d; font-size:11px; }
.family-light-family-carousel {
  position:relative;
  z-index:1;
  display:flex;
  gap:12px;
  margin:0 -17px;
  padding:2px 17px 9px;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-padding:17px;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
.family-light-family-carousel::-webkit-scrollbar { display:none; }
.family-light-glimpse {
  --family-color:#3ba79a;
  position:relative;
  display:flex;
  flex:0 0 calc(100% - 25px);
  min-width:0;
  min-height:255px;
  flex-direction:column;
  padding:18px;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--family-color) 18%,transparent);
  border-radius:22px;
  background:
    radial-gradient(circle at 95% 7%,color-mix(in srgb,var(--family-color) 20%,transparent),transparent 34%),
    linear-gradient(145deg,rgba(255,253,246,.96),rgba(240,248,244,.92));
  box-shadow:0 12px 30px rgba(55,76,68,.07);
  scroll-snap-align:start;
  scroll-snap-stop:always;
}
.family-light-glimpse::after { position:absolute; right:-34px; bottom:-55px; width:132px; height:132px; border-radius:50%; background:color-mix(in srgb,var(--family-color) 10%,transparent); content:""; }
.family-light-glimpse > header { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.family-light-glimpse > header span { display:flex; align-items:center; gap:8px; color:#315a51; font-size:13px; font-weight:760; }
.family-light-glimpse > header span i { width:8px; height:8px; border-radius:50%; background:var(--family-color); box-shadow:0 0 0 5px color-mix(in srgb,var(--family-color) 10%,transparent); }
.family-light-glimpse > header small { color:#8b8f8b; font-size:11px; letter-spacing:.04em; }
.family-light-glimpse-copy { position:relative; z-index:1; display:grid; align-content:center; flex:1; padding:20px 1px 16px; }
.family-light-glimpse-copy blockquote { margin:0; color:#315a51; font-family:Georgia,"Songti SC",serif; font-size:24px; font-weight:650; line-height:1.45; letter-spacing:-.015em; }
.family-light-glimpse-copy p { display:-webkit-box; margin:10px 0 0; overflow:hidden; color:#65756e; font-size:13px; line-height:1.65; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.family-light-glimpse-copy.is-seed { align-content:center; }
.family-light-glimpse-copy.is-seed span { color:#a8754d; font-size:11px; font-weight:750; letter-spacing:.05em; }
.family-light-glimpse-copy.is-seed p { max-width:260px; color:#3c6259; font-family:Georgia,"Songti SC",serif; font-size:18px; font-weight:600; line-height:1.55; -webkit-line-clamp:3; }
.family-light-consent-note { position:relative; z-index:1; margin:-5px 0 13px; padding:9px 11px; border-radius:12px; color:#6f766f; background:rgba(255,255,255,.55); font-size:11px; line-height:1.5; }
.family-light-glimpse > footer { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:10px; padding-top:13px; border-top:1px solid rgba(67,102,90,.1); }
.family-light-glimpse > footer > span { color:#7d8983; font-size:11px; }
.family-light-glimpse > footer button { display:flex; align-items:center; gap:6px; min-height:38px; padding:0 13px; border:1px solid color-mix(in srgb,var(--family-color) 18%,transparent); border-radius:999px; color:#315f55; background:rgba(255,255,255,.7); font-size:12px; font-weight:750; box-shadow:none; }
.family-light-glimpse > footer button i { font-style:normal; transition:transform .18s ease; }
.family-light-glimpse > footer button:active i { transform:translateX(2px); }
.family-light-family-overview > footer { position:relative; z-index:1; margin:10px 4px 0; padding:0; border:0; }
.family-light-family-overview > footer span { color:#7c8781; font-size:11px; line-height:1.55; }
.family-light-statement.is-historical { margin-bottom:15px; }
.family-light-permission-continuation { margin:0 0 15px; padding:14px 15px; border:1px solid rgba(61,119,104,.1); border-radius:16px; background:rgba(255,255,255,.55); }
.family-light-permission-continuation span { color:#a36f49; font-size:11px; font-weight:750; letter-spacing:.05em; }
.family-light-permission-continuation p { margin:6px 0 12px; color:#64746c; font-size:12px; line-height:1.6; }
.family-light-permission-continuation button { min-height:40px; padding:0 15px; border:0; border-radius:999px; color:white; background:#3b9e8f; font-size:12px; font-weight:750; }
@media(max-width:370px) {
  .family-light-growth > div { gap:6px 10px; }
  .family-light-growth > div span { font-size:11px; }
  .family-light-glimpse { flex-basis:calc(100% - 17px); min-height:245px; padding:16px; }
  .family-light-glimpse-copy blockquote { font-size:21px; }
}
.legacy-selection-heading {
  margin:0 2px 12px;
  padding:0;
  border:0;
}
.legacy-selection-heading h2 {
  margin:0;
  font-family:inherit;
  font-size:17px;
  font-weight:750;
  line-height:1.4;
}
.legacy-featured {
  margin:0;
  padding:0;
  border-radius:0;
  background:none;
  box-shadow:none;
}
.legacy-featured .story {
  padding:0 0 25px;
}
.tab-home .legacy-featured .story h3 {
  margin-top:1px;
  font-size:22px;
  font-weight:550;
}
.tab-home .legacy-more .story h3 {
  font-family:Georgia,"Songti SC",serif;
  font-size:20px;
  font-weight:550;
}
.tab-home .story-preview-copy > p {
  color:#46524d;
  font-size:15px;
  line-height:1.72;
}
.legacy-more {
  margin-top:0;
  border-top:1px solid rgba(55,77,69,.09);
}
.legacy-more .story {
  padding:23px 0;
}
.legacy-tail {
  min-height:52px;
  justify-content:flex-end;
  margin-top:1px;
  padding:4px 0 0;
}
.legacy-tail button {
  width:auto;
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:8px 2px 8px 12px;
  font-size:12px;
}
.legacy-tail button i { font-size:15px; font-style:normal; }
.legacy-selection-empty {
  margin:0 0 18px;
  padding:22px 20px;
}
.legacy-selection-empty h2 {
  margin:0 0 5px;
  font-family:inherit;
  font-size:17px;
  font-weight:750;
}
.legacy-selection-empty p {
  font-size:13px;
  line-height:1.6;
}
/* iOS keeps the warm share-safe surface; give it a real inner breathing zone. */
@supports (-webkit-touch-callout:none) {
  @media (hover:none) and (pointer:coarse) {
    .tab-home .legacy-featured {
      margin-right:-8px;
      margin-bottom:26px;
      margin-left:-8px;
      padding:16px 12px 18px;
      border-radius:20px;
    }
    .tab-home .legacy-featured .story { padding-bottom:4px; }
  }
}
@media (max-width:380px) {
  .family-light-card:not(.is-new-legacy) { padding-right:18px; padding-left:18px; }
  .family-light-seed > p,
  .family-light-review > p { font-size:20px; }
}

/* V41 — 同堂是一条家庭动态流：有事才提醒，其余信息退到轻入口。 */
.tab-moments .content { padding-top:8px; }
.moments-task-module[hidden] { display:none !important; }
.tab-moments .moments-task-module:not(.is-clear) {
  margin:7px 0 13px;
  padding:17px 16px 5px;
  border:1px solid rgba(225,126,93,.14);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(255,249,239,.96),rgba(247,250,245,.92));
  box-shadow:none;
}
.moments-task-module > header {
  min-height:30px;
  justify-content:flex-start;
  padding:0 0 11px;
}
.moments-task-module > header h2 {
  margin:0;
  color:#364b44;
  font-family:inherit;
  font-size:18px;
  font-weight:750;
}
.moments-task-module > header > b {
  width:24px;
  height:24px;
  flex-basis:24px;
  font-size:11px;
}
.moments-story-task {
  min-height:66px;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:10px;
  padding:10px 0;
}
.moments-story-task b {
  margin:0 0 3px;
  font-family:inherit;
  font-size:14px;
  font-weight:700;
}
.moments-story-task em { font-size:11px; }
.moments-story-task > strong { font-size:11px; }
.tab-moments .moments-relay-collapsible {
  border-top:0;
  border-bottom:1px solid rgba(54,74,67,.09);
}
.tab-moments .moments-relay-collapsible > summary {
  min-height:64px;
  padding:10px 2px;
}
.tab-moments .moments-relay-collapsible > summary > div {
  display:block;
}
.tab-moments .moments-relay-collapsible > summary h2 {
  margin:0;
  font-family:inherit;
  font-size:16px;
  font-weight:720;
}
.tab-moments .moments-relay-collapsible > summary p {
  margin-top:3px;
  font-size:11px;
  line-height:1.4;
}
.birthday-module {
  margin:0;
  padding:17px 2px 13px;
  border:0;
  border-bottom:1px solid rgba(54,74,67,.09);
  border-radius:0;
  background:transparent;
}
.birthday-module > header {
  align-items:center;
  margin-bottom:7px;
}
.birthday-module > header h2 {
  margin:0;
  color:#364b44;
  font-family:inherit;
  font-size:16px;
  font-weight:720;
}
.birthday-module > header small { color:#9a856d; }
.birthday-module > div > button { padding:9px 2px; }
.tab-moments .moments-feed {
  padding:20px 0 26px;
}
.moments-feed .activity-heading {
  min-height:38px;
  align-items:center;
  padding:0 2px 9px;
}
.moments-feed .activity-heading h2 {
  margin:0;
  color:#2f443d;
  font-family:inherit;
  font-size:18px;
  font-weight:760;
}
.moments-feed .activity-heading [data-read-events] {
  min-height:36px;
  padding:5px 2px 5px 10px;
  color:#4e8b80;
  font-size:11px;
}
.moments-feed .activity-heading p,
.moments-feed .activity-heading span { display:none; }
.moment-story-event {
  margin:0;
  padding:17px 0 22px;
  border-bottom:1px solid rgba(54,74,67,.09);
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.moment-story-event > header { padding:0 1px 8px; }
.moment-story-event > .story { padding-top:7px; }
.moments-feed > #activityList > .activity-item {
  min-height:64px;
  padding:11px 2px;
}
.tab-moments .activity-empty {
  margin:0;
  padding:32px 0 42px;
  border:0;
  border-radius:0;
  color:#89938e;
  background:transparent;
  font-size:13px;
  text-align:center;
}
@media (max-width:380px) {
  .moments-story-task { grid-template-columns:32px minmax(0,1fr); }
  .moments-story-task > strong { grid-column:2; margin-top:-3px; }
}

/* V42 — 同堂动态按内容类型分层：故事是正文，回应是对话，家庭变化是时间线。 */
.moments-feed #activityList {
  display:block;
}
.moments-feed #activityList > .moment-story-event,
.moments-feed #activityList > .activity-note-group {
  content-visibility:auto;
  contain-intrinsic-size:auto 180px;
}
.moments-feed #activityList > .moment-story-event { contain-intrinsic-size:auto 520px; }
.activity-note-group {
  margin:10px 0 18px;
  padding:2px 14px;
  border-radius:18px;
  background:rgba(255,253,248,.62);
}
.activity-note-stack { padding-top:0; padding-bottom:0; }
.activity-note-stack > summary {
  position:relative;
  min-height:54px;
  display:flex;
  align-items:center;
  gap:8px;
  list-style:none;
  color:#53635d;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.activity-note-stack > summary::-webkit-details-marker { display:none; }
.activity-note-stack > summary:focus { outline:none; }
.activity-note-stack > summary:focus-visible {
  outline:2px solid rgba(49,142,129,.28);
  outline-offset:-2px;
  border-radius:12px;
}
.activity-note-stack > summary span {
  min-width:0;
  display:grid;
  gap:2px;
  font-size:13px;
  font-weight:650;
}
.activity-note-stack > summary span strong { font-size:13px; font-weight:680; }
.activity-note-stack > summary span small {
  max-width:min(58vw,300px);
  overflow:hidden;
  color:#8a948f;
  font-size:11px;
  font-weight:500;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.activity-note-stack > summary b {
  margin-left:auto;
  color:#89938e;
  font-size:12px;
  font-weight:560;
}
.activity-note-stack > summary i {
  width:8px;
  height:8px;
  margin:0 4px 4px 3px;
  border-right:1.5px solid #72817b;
  border-bottom:1.5px solid #72817b;
  transform:rotate(45deg);
  transition:transform .18s ease,margin .18s ease;
}
.activity-note-stack[open] > summary {
  border-bottom:1px solid rgba(54,74,67,.075);
}
.activity-note-stack[open] > summary i {
  margin-top:5px;
  margin-bottom:0;
  transform:rotate(225deg);
}
.activity-note-stack.unread > summary strong::after {
  content:"";
  display:inline-block;
  width:6px;
  height:6px;
  margin:0 0 1px 7px;
  border-radius:50%;
  background:#e8795f;
}
.activity-note-stack-body > .activity-entry:last-child { border-bottom:0; }
.activity-entry {
  position:relative;
  width:100%;
  min-height:60px;
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  align-items:center;
  gap:10px;
  margin:0;
  padding:11px 0;
  border:0;
  border-bottom:1px solid rgba(54,74,67,.075);
  color:#34433e;
  background:transparent;
  font:inherit;
  text-align:left;
}
.activity-entry.activity-response { align-items:center; }
.activity-note-group > .activity-entry:last-child { border-bottom:0; }
button.activity-entry {
  min-height:60px;
  border-radius:0;
  box-shadow:none;
  cursor:pointer;
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}
button.activity-entry:active { background:rgba(49,142,129,.035); }
.activity-entry .activity-mark {
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border-radius:50%;
  color:#b75f4c;
  background:#fff0eb;
  font-size:12px;
  font-style:normal;
  font-weight:760;
}
.activity-entry .activity-copy { min-width:0; }
.activity-entry .activity-copy p {
  margin:0;
  color:#34433e;
  font-size:13px;
  font-weight:560;
  line-height:1.48;
}
.activity-entry .activity-copy p strong {
  margin-right:5px;
  color:#234c44;
  font-weight:780;
}
.activity-entry .activity-detail {
  overflow:hidden;
  display:-webkit-box;
  margin-top:3px;
  color:#69756f;
  font-size:13px;
  line-height:1.48;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.activity-entry .activity-copy small {
  display:flex;
  align-items:center;
  gap:5px;
  margin-top:4px;
  color:#929b96;
  font-size:11px;
  line-height:1.3;
}
.activity-entry .activity-copy small i {
  width:6px;
  height:6px;
  flex:none;
  border-radius:50%;
  background:var(--family-color,#3a897d);
}
.activity-entry.unread::after {
  content:"";
  position:absolute;
  top:15px;
  right:0;
  width:6px;
  height:6px;
  border-radius:50%;
  background:#e8795f;
}
.activity-entry.activity-update {
  min-height:50px;
  grid-template-columns:16px minmax(0,1fr);
  gap:6px;
  padding:9px 0;
}
.activity-entry.activity-update .activity-mark {
  width:7px;
  height:7px;
  margin-left:2px;
  border-radius:50%;
  background:var(--family-color,#3a897d);
}
.activity-entry.activity-update .activity-copy p {
  color:#58655f;
  font-size:13px;
  font-weight:520;
}
.activity-entry.activity-update .activity-copy small { margin-top:2px; }
@media (max-width:380px) {
  .activity-note-group { padding-right:12px; padding-left:12px; }
  .activity-entry { grid-template-columns:32px minmax(0,1fr); gap:9px; }
  .activity-entry .activity-mark { width:31px; height:31px; }
}

/* V43 — 儿童信息按家庭一次设置，监护确认与故事核对保持清楚而克制。 */
.tab-profile .child-protection-setting > .profile-setting-body { padding:0 15px 16px; }
.child-protection { display:grid; gap:15px; }
.child-protection-intro {
  margin:0;
  padding:13px 14px;
  border-radius:14px;
  color:#61716b;
  background:linear-gradient(135deg,rgba(230,245,239,.82),rgba(255,249,235,.72));
  font-size:12px;
  line-height:1.65;
}
.child-protection-intro b,.child-protection-intro span { display:block; }
.child-protection-intro b { margin-bottom:3px; color:#3e5b52; font-size:13px; }
.child-consent-inbox {
  display:grid;
  gap:9px;
  padding:14px;
  border:1px solid rgba(222,125,91,.18);
  border-radius:16px;
  background:#fff7f1;
}
.child-consent-inbox > span {
  color:#b0654e;
  font-size:11px;
  font-weight:780;
  letter-spacing:.06em;
}
.child-consent-inbox form { display:grid; gap:10px; padding-top:9px; border-top:1px solid rgba(130,91,72,.09); }
.child-consent-inbox form:first-of-type { border-top:0; padding-top:0; }
.child-consent-inbox form > div { display:grid; gap:3px; }
.child-consent-inbox form b { color:#40534d; font-size:13px; }
.child-consent-inbox form small { color:#7d8984; font-size:11px; line-height:1.5; }
.child-consent-inbox form > label,
.child-ai-option {
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  min-height:0;
  align-items:start;
  gap:8px;
  margin:0;
  padding:0;
  border:0;
  color:#64736e;
  background:transparent;
  font-size:12px;
  line-height:1.5;
}
.child-ai-option[hidden] { display:none; }
.child-consent-inbox input[type="checkbox"],
.child-ai-option input {
  width:18px;
  height:18px;
  min-height:18px;
  margin:0;
  accent-color:#318a7c;
}
.child-consent-inbox footer { display:flex; align-items:center; gap:12px; }
.child-consent-inbox footer .secondary { min-height:39px; padding:8px 13px; }
.child-consent-inbox footer .text-button { min-height:39px; padding:8px 2px; }
.child-family-group {
  overflow:hidden;
  border:1px solid rgba(65,85,77,.1);
  border-radius:16px;
  background:rgba(255,255,255,.52);
}
.child-family-group > summary {
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  min-height:62px;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  cursor:pointer;
  list-style:none;
}
.child-family-group > summary::-webkit-details-marker { display:none; }
.child-family-group > summary span { display:grid; gap:3px; }
.child-family-group > summary b { color:#3e544d; font-size:14px; }
.child-family-group > summary small { color:#8a948f; font-size:11px; }
.child-family-group > summary em { color:#a1aaa6; font-size:20px; font-style:normal; transition:transform .2s ease; }
.child-family-group[open] > summary em { transform:rotate(90deg); }
.child-family-group > div { display:grid; gap:14px; padding:0 14px 15px; border-top:1px solid rgba(65,85,77,.075); }
.child-person-list { display:grid; }
.child-subject-list { padding:2px 2px 0; }
.child-subject-list > span { margin-bottom:2px; color:#7c8984; font-size:11px; font-weight:760; letter-spacing:.05em; }
.child-person-list article {
  display:block;
  min-height:55px;
  padding:10px 0;
  border-bottom:1px solid rgba(65,85,77,.075);
}
.child-subject-summary { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:12px; }
.child-person-list article span { display:grid; min-width:0; gap:3px; }
.child-person-list article b { color:#40534d; font-size:13px; }
.child-person-list article small { color:#818c87; font-size:11px; line-height:1.45; }
.child-person-list article em { color:#538075; font-size:11px; font-style:normal; line-height:1.45; }
.child-person-list article .child-visibility-state { color:#315f57; font-weight:680; }
.child-person-list article button { flex:none; }
.child-authorization-manager { min-width:64px; }
.child-authorization-manager > summary {
  display:flex;
  min-height:36px;
  align-items:center;
  justify-content:flex-end;
  gap:3px;
  padding:4px 0 4px 8px;
  color:#397f74;
  cursor:pointer;
  font-size:12px;
  font-weight:720;
  list-style:none;
}
.child-authorization-manager > summary::-webkit-details-marker { display:none; }
.child-authorization-manager > summary em { font-size:17px; transition:transform .2s ease; }
.child-authorization-manager[open] { grid-column:1/-1; width:100%; }
.child-authorization-manager[open] > summary { width:max-content; margin-left:auto; border-radius:9px; }
.child-authorization-manager > summary:focus-visible { outline-width:2px; outline-offset:0; border-radius:9px; }
.child-authorization-manager[open] > summary em { transform:rotate(90deg); }
.child-authorization-manager > div { display:grid; gap:12px; padding-top:10px; }
.child-guardian-manager,.child-my-authorization {
  display:grid;
  gap:10px;
  padding:12px;
  border-radius:14px;
  background:rgba(244,248,245,.9);
}
.child-guardian-manager > small,.child-my-authorization > small { color:#7d8984; font-size:11px; line-height:1.55; }
.child-guardian-manager .person-combobox-trigger { min-height:52px; border-radius:13px; box-shadow:none; }
.child-guardian-manager .person-combobox-results { max-height:min(236px,32vh); }
.child-guardian-manager > button { width:100%; min-height:40px; }
.child-my-authorization > b { font-size:12px; }
.child-my-authorization > label {
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  min-height:0;
  align-items:start;
  gap:8px;
  color:#64736e;
  font-size:12px;
  line-height:1.5;
}
.child-my-authorization input { width:18px; height:18px; min-height:18px; margin:0; accent-color:#318a7c; }
.child-my-authorization footer { display:flex; align-items:center; gap:12px; }
.child-my-authorization footer .secondary { min-height:39px; padding:8px 13px; }
.child-my-authorization footer .danger-text {
  min-height:39px;
  padding:8px 2px;
  border:0;
  color:#9a5c52;
  background:transparent;
  font-family:inherit;
  font-size:12px;
  font-weight:600;
  line-height:1.4;
}
.child-person-setup { display:grid; gap:11px; padding:14px; border-radius:14px; background:#f5f8f5; }
.child-person-setup h4 { margin:0 0 1px; color:#40564e; font-size:13px; }
.child-person-setup h4 small { margin-left:5px; color:#8a958f; font-size:11px; font-weight:500; }
.child-person-setup > label:not(.child-ai-option) { display:grid; gap:6px; color:#6f7c77; font-size:11px; }
.child-person-setup > label > small { color:#87918d; font-size:11px; line-height:1.5; }
.child-person-setup select { width:100%; min-height:44px; border:1px solid #dce3de; border-radius:11px; color:#3f514b; background:#fff; font-size:14px; }
.child-person-setup > button { width:100%; min-height:42px; }
.child-person-setup > small { color:#87918d; font-size:11px; line-height:1.55; }
.child-person-setup-single { margin-top:14px; padding:0; background:transparent; }
.child-person-setup-single .person-picker-field { gap:7px; }
.child-person-setup-single .person-combobox-trigger { min-height:54px; border-radius:14px; box-shadow:none; }
.child-person-setup-single .person-combobox-panel { margin-top:6px; box-shadow:0 10px 26px rgba(45,75,65,.08); }
.child-person-setup-single .person-combobox-results { max-height:min(248px,34vh); }
.child-person-setup-single .person-combobox-trigger:disabled > i { color:#87928d; background:#e7ebe7; }
@media (max-width:380px) {
  .child-consent-inbox footer { align-items:stretch; flex-direction:column; gap:3px; }
  .child-consent-inbox footer .secondary,.child-consent-inbox footer .text-button { width:100%; }
  .child-my-authorization footer { align-items:stretch; flex-direction:column; gap:3px; }
  .child-my-authorization footer .secondary,.child-my-authorization footer .danger-text { width:100%; }
}

/* V44 — 受邀账号先保存回来的路，邀请链接本身不充当登录凭证。 */
#inviteJoinForm,
#familyJoinRequestForm {
  display:grid;
  width:min(100%,430px);
  gap:13px;
  margin:20px auto 0;
  text-align:left;
}
#familyJoinRequestForm > label {
  display:grid;
  gap:7px;
  color:#62716c;
  font-size:12px;
  font-weight:650;
}
#familyJoinRequestForm > label textarea {
  min-height:82px;
  padding:12px 13px;
  border:1px solid rgba(54,88,77,.14);
  border-radius:13px;
  color:#344e47;
  background:rgba(255,255,255,.8);
  font:inherit;
  font-size:14px;
  line-height:1.6;
  resize:vertical;
  box-shadow:none;
}
#inviteJoinForm > .primary,
#familyJoinRequestForm > .primary { width:100%; min-height:52px; }
.invite-return-access {
  display:grid;
  gap:11px;
  padding:17px;
  border:1px solid rgba(44,132,117,.13);
  border-radius:18px;
  background:linear-gradient(145deg,rgba(230,246,239,.92),rgba(255,249,233,.9));
  box-shadow:0 11px 28px rgba(54,89,77,.07);
}
.invite-return-access header {
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:11px;
}
.invite-return-access header > span,
.return-login-reminder > span {
  display:grid;
  width:42px;
  height:42px;
  place-items:center;
  border-radius:14px;
  color:#277e72;
  background:rgba(255,255,255,.72);
  box-shadow:inset 0 0 0 1px rgba(44,132,117,.1);
}
.invite-return-access svg,
.return-login-reminder svg {
  width:23px;
  height:23px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.invite-return-access header small,
.invite-return-access header h3 { display:block; margin:0; }
.invite-return-access header small { color:#b06d4d; font-size:11px; font-weight:800; letter-spacing:.08em; }
.invite-return-access header h3 { margin-top:2px; color:#34544c; font-size:17px; }
.invite-return-access > p {
  margin:0;
  color:#71817b;
  font-size:12px;
  line-height:1.65;
}
.invite-return-access > label {
  display:grid;
  gap:6px;
  color:#53675f;
  font-size:12px;
  font-weight:650;
}
.invite-return-access > label + label { padding-top:3px; }
.invite-return-access input {
  width:100%;
  min-height:47px;
  padding:11px 12px;
  border:1px solid rgba(54,88,77,.14);
  border-radius:12px;
  color:#304b44;
  background:#fffdf8;
  font-size:16px;
  box-shadow:none;
}
.invite-return-access label small { color:#8d9893; font-size:11px; font-weight:500; }
.invite-return-access > strong {
  color:#6f7f79;
  font-size:11px;
  font-weight:600;
  line-height:1.55;
  text-align:center;
}
.return-login-reminder {
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  margin:0 0 17px;
  padding:14px;
  border:1px solid rgba(48,130,116,.11);
  border-radius:18px;
  background:linear-gradient(140deg,rgba(232,247,241,.9),rgba(255,249,234,.86));
  box-shadow:0 10px 26px rgba(53,84,74,.06);
}
.return-login-reminder > div { display:grid; min-width:0; gap:1px; }
.return-login-reminder small { color:#b06d4d; font-size:11px; font-weight:800; letter-spacing:.05em; }
.return-login-reminder b { color:#36554d; font-size:14px; }
.return-login-reminder p { margin:2px 0 0; color:#7a8883; font-size:11px; line-height:1.5; }
.return-login-reminder > button {
  min-height:38px;
  padding:8px 12px;
  border:0;
  border-radius:12px;
  color:white;
  background:#31877b;
  font-family:inherit;
  font-size:12px;
  font-weight:760;
  white-space:nowrap;
}
.profile-return-login { margin-top:14px; margin-bottom:12px; }
.first-light-return-login { margin:16px 0 0; text-align:left; }
@media (max-width:410px) {
  .return-login-reminder { grid-template-columns:40px minmax(0,1fr); }
  .return-login-reminder > button { grid-column:1/-1; width:100%; }
  .first-light-return-login p { display:none; }
}

/* V45 — 一次性找回原账号，避免再次注册出一个同名账号。 */
.recovery-link-page {
  width:min(100%,620px);
  min-height:100dvh;
  margin:0 auto;
  padding:calc(28px + env(safe-area-inset-top)) 24px calc(72px + env(safe-area-inset-bottom));
  background:radial-gradient(circle at 92% 5%,rgba(246,190,74,.3),transparent 260px),linear-gradient(155deg,#fffaf0,#edf7f1);
}
.recovery-link-page .brand { margin-bottom:72px; }
.recovery-link-heading { max-width:480px; }
.recovery-link-heading > span { color:#b16d4b; font-size:12px; font-weight:800; letter-spacing:.12em; }
.recovery-link-heading h1 { margin:12px 0 14px; color:#214f47; font:500 clamp(34px,10vw,51px)/1.3 Georgia,"Songti SC",serif; }
.recovery-link-heading p { margin:0; color:#687a73; font-size:14px; line-height:1.75; }
.recovery-link-form {
  display:grid;
  gap:14px;
  margin-top:32px;
  padding:22px;
  border:1px solid rgba(49,119,105,.1);
  border-radius:24px;
  background:rgba(255,255,255,.74);
  box-shadow:0 18px 46px rgba(52,80,68,.09);
  backdrop-filter:blur(18px);
}
.recovery-link-form > label { display:grid; gap:7px; color:#526a62; font-size:13px; font-weight:700; }
.recovery-link-form input { min-height:50px; padding:12px 14px; border:1px solid rgba(49,91,78,.14); border-radius:13px; color:#294b43; background:#fffdf8; font-size:16px; box-shadow:none; }
.recovery-link-form label small,.recovery-link-form > small { color:#87928e; font-size:11px; font-weight:500; line-height:1.55; }
.recovery-link-form > small { text-align:center; }
.recovery-link-form .registration-consent { margin:2px 0; }
.recovery-link-page.expired .recovery-link-heading { margin-top:22vh; }
.recovery-home-link { width:100%; margin-top:32px; text-decoration:none; }
@media (max-width:520px) {
  .recovery-link-page { padding-right:18px; padding-left:18px; }
  .recovery-link-page .brand { margin-bottom:52px; }
  .recovery-link-form { padding:18px; border-radius:20px; }
}

/* V46 — multi-family controls stay compact until someone needs them. */
.family-scope-filter.family-scope-filter-compact {
  position:relative;
  z-index:18;
  display:block;
  padding:8px 18px;
  overflow:visible;
}
.family-scope-menu { position:relative; width:100%; }
.family-scope-menu > summary {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) 20px;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:6px 10px 6px 12px;
  border:1px solid rgba(42,96,85,.1);
  border-radius:13px;
  color:#61716b;
  background:rgba(255,253,248,.78);
  cursor:pointer;
  list-style:none;
}
.family-scope-menu > summary::-webkit-details-marker { display:none; }
.family-scope-menu > summary::marker { content:""; }
.family-scope-menu > summary span { font-size:11px; font-weight:650; }
.family-scope-menu > summary b {
  overflow:hidden;
  color:#2e5d54;
  font-size:12px;
  font-weight:760;
  text-align:right;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.family-scope-menu > summary::after {
  content:"";
  width:7px;
  height:7px;
  justify-self:center;
  border-right:1.5px solid #789089;
  border-bottom:1.5px solid #789089;
  transform:translateY(-2px) rotate(45deg);
  transition:transform .18s ease;
}
.family-scope-menu[open] > summary::after { transform:translateY(2px) rotate(225deg); }
.family-scope-options {
  position:absolute;
  z-index:4;
  top:calc(100% + 7px);
  right:0;
  left:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
  padding:10px;
  border:1px solid rgba(42,96,85,.11);
  border-radius:16px;
  background:rgba(255,253,248,.98);
  box-shadow:0 14px 36px rgba(39,67,59,.13);
  backdrop-filter:blur(18px);
}
.family-scope-filter .family-scope-options button {
  min-width:0;
  justify-content:flex-start;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.spatial-map-shell .network-legend.compact-family-legend { overflow:visible; }
.network-family-menu { position:relative; flex:none; }
.network-family-menu > summary {
  display:flex;
  min-height:32px;
  align-items:center;
  gap:5px;
  padding:5px 8px;
  border-radius:10px;
  color:#405a53;
  background:rgba(49,118,106,.07);
  cursor:pointer;
  list-style:none;
}
.network-family-menu > summary::-webkit-details-marker { display:none; }
.network-family-menu > summary::marker { content:""; }
.network-family-menu > summary span { color:#78847f; font-size:11px; }
.network-family-menu > summary b { font-size:11px; font-weight:760; }
.network-family-menu > summary::after {
  content:"";
  width:6px;
  height:6px;
  margin:2px 2px 0 1px;
  border-right:1.5px solid #71847e;
  border-bottom:1.5px solid #71847e;
  transform:rotate(225deg);
  transition:transform .18s ease;
}
.network-family-menu[open] > summary::after { transform:translateY(-2px) rotate(45deg); }
.network-family-menu > div {
  position:absolute;
  bottom:calc(100% + 8px);
  left:-4px;
  display:grid;
  width:190px;
  max-height:min(46dvh,320px);
  gap:3px;
  padding:7px;
  overflow-y:auto;
  border:1px solid rgba(65,92,83,.11);
  border-radius:14px;
  background:rgba(255,252,246,.97);
  box-shadow:0 14px 34px rgba(42,63,56,.14);
  backdrop-filter:blur(18px);
}
.network-family-menu > div .family-legend-toggle {
  width:100%;
  justify-content:flex-start;
}
@media (max-width:380px) {
  .family-scope-options { grid-template-columns:1fr; }
}

/* V48 — contextual, voluntary AI assistance in the recording flow. */
.story-ai-optin {
  position:relative;
  display:grid;
  gap:14px;
  margin:12px 0 16px;
  padding:18px;
  overflow:hidden;
  border:1px solid rgba(229,151,90,.18);
  border-radius:22px;
  color:#3d514b;
  background:
    radial-gradient(circle at 94% 4%,rgba(255,210,112,.34),transparent 34%),
    linear-gradient(145deg,rgba(255,250,238,.98),rgba(235,247,240,.95));
  box-shadow:0 12px 32px rgba(73,92,76,.08);
}
.story-ai-optin::after {
  content:"";
  position:absolute;
  top:-26px;
  right:-18px;
  width:90px;
  height:90px;
  border:1px solid rgba(238,161,91,.15);
  border-radius:50%;
}
.story-ai-optin header { position:relative; z-index:1; }
.story-ai-optin header > span {
  color:#cf7f48;
  font-size:11px;
  font-weight:800;
  letter-spacing:.1em;
}
.story-ai-optin h3 { margin:5px 0 7px; color:#2f5048; font-size:20px; line-height:1.28; }
.story-ai-optin header p { margin:0; color:#697b74; font-size:13px; line-height:1.7; }
.story-ai-optin > div { position:relative; z-index:1; display:flex; align-items:center; gap:9px; }
.story-ai-optin > div .primary {
  width:auto;
  min-height:44px;
  margin:0;
  padding:10px 18px;
  border-radius:14px;
  box-shadow:0 7px 18px rgba(40,132,117,.17);
}
.story-ai-optin > div .text-button { min-height:40px; padding:8px 10px; color:#75817d; }
.story-ai-optin details { position:relative; z-index:1; border-top:1px solid rgba(57,94,82,.08); }
.story-ai-optin details > summary {
  padding-top:11px;
  color:#71817b;
  cursor:pointer;
  font-size:11px;
  list-style:none;
}
.story-ai-optin details > summary::-webkit-details-marker { display:none; }
.story-ai-optin details > summary::after { content:"＋"; margin-left:5px; color:#4d8d81; }
.story-ai-optin details[open] > summary::after { content:"－"; }
.story-ai-optin details p { margin:8px 0 0; color:#78867f; font-size:11px; line-height:1.65; }
.story-ai-optin details a {
  display:inline-flex;
  align-items:center;
  margin-top:7px;
  color:#397f73;
  font-size:11px;
  font-weight:700;
  text-decoration:none;
}
.story-ai-optin details a::after { content:"›"; margin-left:4px; font-size:15px; line-height:1; }
.story-ai-ready,
.story-ai-compact {
  display:flex;
  min-height:58px;
  align-items:center;
  gap:10px;
  margin:11px 0 15px;
  padding:10px 12px;
  border:1px solid rgba(49,126,111,.1);
  border-radius:16px;
  background:rgba(238,247,242,.76);
}
.story-ai-ready > i {
  display:grid;
  flex:0 0 28px;
  width:28px;
  height:28px;
  place-items:center;
  border-radius:50%;
  color:#fff;
  background:#58a596;
  font-style:normal;
  font-size:13px;
}
.story-ai-ready > span,
.story-ai-compact > span { display:grid; min-width:0; flex:1; gap:2px; }
.story-ai-ready b,
.story-ai-compact b { color:#3e5b54; font-size:12px; }
.story-ai-ready small,
.story-ai-compact small { color:#81908a; font-size:11px; line-height:1.4; }
.story-ai-compact button {
  flex:none;
  min-height:38px;
  padding:8px 12px;
  border:1px solid rgba(43,142,127,.18);
  border-radius:12px;
  color:#287c6f;
  background:rgba(255,255,255,.82);
  font-size:11px;
  font-weight:750;
}
.story-reading-actions > .story-ai-optin { margin:0 0 14px; }
@media (max-width:360px) {
  .story-ai-optin { padding:16px; }
  .story-ai-optin > div { align-items:stretch; flex-direction:column; }
  .story-ai-optin > div .primary,
  .story-ai-optin > div .text-button { width:100%; }
  .story-ai-compact { align-items:stretch; flex-direction:column; }
  .story-ai-compact button { width:100%; }
}

/* V49 — quiet story-owner tools with nearby, self-revealing editors. */
.story-reading-actions.confirmed {
  gap:12px;
  margin:22px 0 10px;
}
.story-confirmed-bar {
  display:flex;
  min-height:48px;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:7px 0;
  border-top:1px solid rgba(53,82,73,.1);
  border-bottom:1px solid rgba(53,82,73,.1);
}
.story-confirmed-bar > span {
  flex:none;
  color:#82908a;
  font-size:11px;
}
.story-confirmed-bar > div {
  display:flex;
  min-width:0;
  align-items:center;
  justify-content:flex-end;
  gap:5px;
}
.story-quick-action {
  display:inline-flex;
  min-height:38px;
  align-items:center;
  gap:5px;
  padding:7px 10px;
  border:0;
  border-radius:12px;
  color:#356d62;
  background:transparent;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
  -webkit-tap-highlight-color:transparent;
}
.story-quick-action:active { background:rgba(52,128,113,.08); }
.story-quick-action svg {
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.story-reading-actions.confirmed > .secondary { width:100%; }
.story-action-panel:empty { display:none; }
.story-action-panel {
  scroll-margin-top:14px;
}
.story-action-panel .visibility-form,
.story-action-panel .revision-form {
  margin:12px 0 20px;
  outline:none;
  box-shadow:0 12px 30px rgba(55,79,68,.07);
}
.story-reading.is-story-editing > .ai-processing-slot,
.story-reading.is-story-editing > .story-reading-actions {
  display:none;
}
.story-reading.is-story-editing > .story-action-panel {
  margin-top:20px;
}
.story-action-panel .revision-form {
  position:relative;
  padding:20px;
  border-color:rgba(43,128,113,.14);
  border-radius:20px;
  background:linear-gradient(180deg,#fffdf8,#f5faf6);
}
.revision-form > header {
  display:flex;
  min-height:48px;
  margin:0 0 14px;
  padding:0 48px 12px 0;
  align-items:flex-end;
  justify-content:space-between;
  border-bottom:1px solid rgba(45,88,78,.09);
}
.revision-form > header span {
  color:#ad7658;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
}
.revision-form > header h2 {
  margin:3px 0 0;
  color:#244e47;
  font-size:20px;
}
@media (max-width:360px) {
  .story-confirmed-bar { align-items:flex-start; flex-direction:column; gap:2px; }
  .story-confirmed-bar > div { width:100%; justify-content:flex-start; }
}

/* V51 — the brand rail never leaves the document and does not join page cross-fades. */
.top.app-brand-header,
.tab-tree .top.app-brand-header {
  height:52px;
  view-transition-name:gramphant-brand-rail;
}
.top.app-brand-header nav,
.tab-tree .top.app-brand-header nav {
  height:52px;
  padding-top:2px;
  padding-bottom:2px;
}
.family-scope-filter.family-scope-filter-compact {
  padding-top:3px;
  padding-bottom:3px;
}
.tab-home .content { padding-top:4px; }
.tab-home .home-story-heading { margin-top:0; }
::view-transition-group(gramphant-brand-rail),
::view-transition-old(gramphant-brand-rail),
::view-transition-new(gramphant-brand-rail) {
  animation:none;
}

/* V52 — an emotionally safe first encounter before asking a new visitor to log in. */
.founder-entry-welcome .welcome-copy {
  margin:32px 0 18px;
}
.founder-entry-welcome .welcome-copy h1 {
  max-width:430px;
  font-size:35px;
  line-height:1.3;
  letter-spacing:-.025em;
}
.founder-entry-welcome .welcome-copy > p:last-child { margin-bottom:0; }
.founder-letter-teaser {
  position:relative;
  z-index:1;
  margin:0 0 16px;
  padding:18px 19px 17px;
  overflow:hidden;
  border:1px solid rgba(61,106,94,.1);
  border-radius:20px;
  color:#35564e;
  background:
    radial-gradient(circle at 94% 5%,rgba(239,186,73,.24),transparent 105px),
    linear-gradient(145deg,rgba(255,253,247,.96),rgba(237,247,241,.92));
  box-shadow:0 14px 36px rgba(65,83,70,.09);
}
.founder-letter-teaser::after {
  content:"“";
  position:absolute;
  right:15px;
  bottom:-29px;
  color:rgba(42,132,118,.08);
  font:100px/1 Georgia,serif;
  pointer-events:none;
}
.founder-letter-teaser header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.founder-letter-teaser header span {
  color:#b06f3d;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
}
.founder-letter-teaser header small { color:#939b96; font-size:11px; }
.founder-letter-teaser h2 {
  margin:8px 0 6px;
  color:#31564e;
  font:600 22px/1.35 var(--display);
  letter-spacing:-.015em;
}
.founder-letter-teaser p {
  display:-webkit-box;
  margin:0;
  overflow:hidden;
  color:#6d7974;
  font-size:12px;
  line-height:1.65;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.founder-letter-teaser > button {
  display:flex;
  min-height:40px;
  align-items:center;
  gap:8px;
  margin:9px 0 -7px -9px;
  padding:6px 9px;
  border:0;
  color:#2d8276;
  background:transparent;
  font-size:12px;
  font-weight:800;
}
.founder-letter-teaser > button i { font:400 17px/1 sans-serif; transition:transform .18s ease; }
.founder-letter-teaser > button:active i { transform:translateX(3px); }
.founder-entry-welcome > .login-card { flex:none; }
body.founder-letter-open { overflow:hidden; }
.founder-letter-overlay[hidden] { display:none; }
.founder-letter-overlay {
  position:fixed;
  z-index:2400;
  inset:0;
  display:grid;
  align-items:start;
  justify-items:center;
  padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));
  overflow:auto;
  background:rgba(35,48,43,.46);
  overscroll-behavior:contain;
}
.founder-letter {
  position:relative;
  width:min(100%,680px);
  min-height:calc(100dvh - max(24px,env(safe-area-inset-top) + env(safe-area-inset-bottom)));
  padding:24px clamp(22px,6vw,58px) 36px;
  border:1px solid rgba(69,91,81,.08);
  border-radius:26px;
  color:#40534c;
  background:
    radial-gradient(circle at 91% 5%,rgba(237,187,72,.2),transparent 180px),
    radial-gradient(circle at 0 68%,rgba(64,164,147,.1),transparent 230px),
    #fffcf5;
  box-shadow:0 28px 80px rgba(29,45,39,.22);
  outline:none;
}
.founder-letter-close {
  position:absolute;
  top:17px;
  right:17px;
  width:42px;
  min-height:42px;
  padding:0 0 3px;
  border:0;
  border-radius:50%;
  color:#6d7c76;
  background:rgba(255,255,255,.68);
  box-shadow:0 5px 18px rgba(54,72,64,.08);
  font:300 27px/1 sans-serif;
}
.founder-letter > header {
  display:flex;
  align-items:center;
  gap:10px;
  padding-right:52px;
}
.founder-letter > header img { width:42px; height:42px; object-fit:contain; }
.founder-letter > header span { display:grid; gap:1px; }
.founder-letter > header small { color:#b07040; font-size:11px; font-weight:800; letter-spacing:.1em; }
.founder-letter > header b { color:#426159; font-size:12px; }
.founder-letter-title { margin:52px 0 38px; }
.founder-letter-title > span { color:#ae7448; font-size:11px; font-weight:800; letter-spacing:.1em; }
.founder-letter-title h1 {
  margin-top:9px;
  color:#274f47;
  font:600 clamp(34px,8vw,50px)/1.25 var(--display);
  letter-spacing:-.04em;
}
.founder-letter-body { max-width:540px; margin:auto; }
.founder-letter-body p {
  margin:0 0 1.35em;
  color:#53635d;
  font:400 15px/1.9 var(--ui);
  letter-spacing:.015em;
}
.founder-letter-body p:first-child {
  color:#31564e;
  font-family:var(--display);
  font-size:18px;
  font-weight:600;
}
.founder-letter-body blockquote {
  position:relative;
  margin:34px 0;
  padding:22px 4px 22px 21px;
  border-left:3px solid #dfaa54;
  color:#28564d;
  font:600 22px/1.65 var(--display);
}
.founder-letter > footer {
  max-width:540px;
  margin:45px auto 0;
  padding:26px 0 0;
  border-top:1px solid rgba(56,87,76,.11);
}
.founder-letter > footer p {
  margin:0 0 17px;
  color:#31564e;
  font:600 18px/1.65 var(--display);
}
.founder-letter > footer .primary { margin:0; }
.founder-letter > footer small { display:block; margin-top:10px; color:#89938f; font-size:11px; text-align:center; }
@media (max-width:480px) {
  .founder-entry-welcome { padding-right:20px; padding-left:20px; }
  .founder-entry-welcome .welcome-copy { margin-top:27px; }
  .founder-entry-welcome .welcome-copy h1 { font-size:32px; }
  .founder-letter-overlay { padding:0; }
  .founder-letter { min-height:100dvh; border:0; border-radius:0; }
  .founder-letter-title { margin-top:44px; }
}
@media (max-height:760px) {
  .founder-entry-welcome .welcome-copy { margin:20px 0 14px; }
  .founder-entry-welcome .welcome-copy h1 { font-size:29px; }
  .founder-letter-teaser { padding-top:15px; padding-bottom:14px; }
  .founder-letter-teaser h2 { font-size:20px; }
}