/* Final refinements to the existing palette and component system. */
#application .page-heading > *,
#application .section-heading > *,
#application .invitation-row > div { min-width:0; }
#application :is(.page-heading,.section-heading,.modal-actions) { flex-wrap:wrap; }
#application .button { max-width:100%; white-space:normal; text-align:center; line-height:1.35; }
#application .tree-toolbar { gap:12px; }
#application .tree-search { min-width:0; flex:1; }
#application .tree-search input { width:100%; min-width:0; }
#application :is(.tree-filter > button,.tree-zoom button) { min-height:44px; }
#application .tree-zoom button { width:44px; }
#application .tree-legend { gap:5px; line-height:1.6; }
#application .tree-branches { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; z-index:1; }
#application .tree-branch { fill:none; stroke:#6f9b7d; stroke-width:2; stroke-linecap:round; vector-effect:non-scaling-stroke; }
#application .tree-branch.is-uncertain { stroke:#b9874e; stroke-dasharray:7 6; }
#application .tree-branch.is-divergent { stroke:#985b55; stroke-dasharray:3 5; }
#application .tree-node[data-sibling-tone="0"] { --sibling-ring:#6f9b7d; }
#application .tree-node[data-sibling-tone="1"] { --sibling-ring:#b9874e; }
#application .tree-node[data-sibling-tone="2"] { --sibling-ring:#6b8793; }
#application .tree-node[data-sibling-tone="3"] { --sibling-ring:#997969; }
/* An outer ring leaves the existing self/unknown/priority border intact. */
#application .tree-node[data-sibling-group] .tree-avatar { outline:2px solid var(--sibling-ring); outline-offset:5px; }
#application .tree-sibling-label { margin-top:5px; color:#3d5148; background:#fff8eb; border-left:3px solid var(--sibling-ring); border-radius:5px; padding:3px 7px; font:600 10px/1.3 Manrope,sans-serif; }
#application .tree-evidence { font-size:10px; line-height:1.35; }
#application .tree-name { font-size:12px; }
#application .tree-status { font-size:10px; }
@media(max-width:760px) {
  #application .invitation-row { flex-wrap:wrap; }
  #application .invitation-row .button { margin-left:0!important; }
  #application .tree-lineage-anchor .button { color:#fff8eb!important; background:rgba(255,255,255,.08)!important; border:1px solid rgba(255,255,255,.34)!important; box-shadow:none!important; }
}
/* Only two small composited layers move, behind the heading, on the active page. */
@media(prefers-reduced-motion:no-preference) {
  #application #page-home.active .home-hero::before {
    content:""!important; position:absolute; inset:-5%; z-index:0!important;
    pointer-events:none; opacity:.12;
    background:radial-gradient(ellipse at 72% 58%,#dfded4,transparent 55%);
    animation:mgl-mist 24s ease-in-out infinite alternate;
  }
  #application #page-home.active .home-hero::after { animation:mgl-atmosphere 30s ease-in-out infinite alternate; pointer-events:none; }
}
@keyframes mgl-mist { from { transform:translate3d(-1%,0,0); } to { transform:translate3d(1%,1%,0); } }
@keyframes mgl-atmosphere { from { transform:translate3d(0,0,0); opacity:1; } to { transform:translate3d(1%,0,0); opacity:.9; } }

/* Mission 09: filled phone layouts, with the same components on desktop. */
:is(#add-intent-dialog,#add-method-dialog) { width:min(560px,calc(100vw - 24px)); }
:is(#add-intent-dialog,#add-method-dialog) .modal-content { padding:28px; }
:is(#add-intent-dialog,#add-method-dialog) h2 { font-size:24px; padding-right:30px; }
:is(#add-intent-dialog,#add-method-dialog) .choice-card-stack { display:grid; gap:10px; margin-top:20px; }
:is(#add-intent-dialog,#add-method-dialog) .choice-card { display:grid; grid-template-columns:34px minmax(0,1fr) 18px; width:100%; min-height:76px; padding:14px; gap:12px; border-radius:16px; }
:is(#add-intent-dialog,#add-method-dialog) .choice-card strong { font-size:15px; line-height:1.3; }
:is(#add-intent-dialog,#add-method-dialog) .choice-card small { font-size:13px; line-height:1.45; color:#55665e; }
:is(#add-intent-dialog,#add-method-dialog) .modal-close { width:44px; height:44px; }
#application #page-profile > .page-heading { min-height:0!important; padding:24px!important; margin:0 0 16px!important; border-radius:20px!important; }
#application #page-profile > .page-heading::before { content:none!important; }
#application #page-profile > .page-heading > div { display:block!important; }
#application #page-profile > .page-heading h1 { display:block!important; margin:6px 0!important; font:700 34px/1.15 Georgia,serif!important; color:#fff8eb!important; }
#application #page-profile > .page-heading .eyebrow { display:block!important; color:#e5d5bd!important; }
#application #page-profile > .page-heading .page-intro { display:block!important; margin:0!important; color:#e5d5bd!important; font-size:14px!important; }
#application .profile-journey-copy { min-width:0; }
#application .profile-journey-copy h2 { overflow-wrap:anywhere; }
#application #page-heritage-library .heritage-subpage-shell { border:1px solid #e1d1b5; border-radius:24px; background:#f8efdf; overflow:hidden; }
#application #page-heritage-library .heritage-subpage-head { padding:24px; }
#application #page-heritage-library .heritage-subpage-head h1 { margin:8px 0; color:#173f35; font:700 32px/1.15 Georgia,serif; }
#application #page-heritage-library .heritage-subpage-head p { margin:0; font-size:14px; line-height:1.5; color:#55665e; max-width:640px; }
#application #page-heritage-library .heritage-subpage-back { display:inline-flex; align-items:center; min-height:44px; margin-bottom:12px; padding:0; border:0; background:transparent; color:#173f35; font-weight:700; }
#application #page-heritage-library .heritage-primary-actions { display:flex; flex-wrap:wrap; gap:10px; padding:0 24px 18px; }
#application #archive-workspace { margin:0 24px 24px; padding:20px; gap:16px; box-shadow:none; }
#application .archive-heading { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; }
#application .archive-heading h2 { font:700 25px/1.15 Georgia,serif; }
#application #archive-breadcrumb { display:flex; align-items:center; flex-wrap:wrap; gap:4px; font-size:13px; border-bottom:1px solid #e1d1b5; }
#application #archive-ancestors { display:contents; }
#application #archive-breadcrumb .text-button { overflow-wrap:anywhere; text-align:left; }
#application #archive-folders { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); padding:0; margin:0; gap:10px; }
#application .archive-folder-card { display:grid; grid-template-columns:32px minmax(0,1fr) 16px; gap:10px; align-items:center; width:100%; min-height:76px; padding:14px; border:1px solid #e1d1b5; border-radius:16px; background:#fffdf8; color:#173f35; text-align:left; }
#application .archive-folder-card > span:nth-child(2) { display:grid; gap:5px; min-width:0; }
#application .archive-folder-card strong { font-size:15px; overflow-wrap:anywhere; }
#application .archive-folder-card small { font-size:12px; color:#55665e; }
#application #archive-items { display:grid; gap:10px; }
#application #archive-items-title { margin:0; font:700 20px/1.2 Georgia,serif; color:#173f35; }
#application #archive-items .archive-item-card { display:grid; grid-template-columns:24px 36px minmax(0,1fr) auto; align-items:center; gap:12px; min-height:84px; padding:14px; border:1px solid #e1d1b5; border-radius:16px; background:#fffdf8; }
#application #archive-items .archive-item-select { display:grid; min-width:24px; min-height:44px; padding:0; place-items:center; }
#application .archive-item-select input[type="checkbox"] { width:20px; height:20px; margin:0; accent-color:#173f35; }
#application .archive-item-icon { display:grid; place-items:center; width:36px; height:40px; border-radius:10px; background:#edf0e6; color:#173f35; font-size:22px; }
#application .archive-item-copy { display:grid; gap:5px; min-width:0; }
#application .archive-item-copy strong { font-size:15px; line-height:1.4; overflow-wrap:anywhere; }
#application .archive-item-copy small { font-size:12px; line-height:1.4; color:#55665e; overflow-wrap:anywhere; }
#application .archive-empty { font-size:14px; line-height:1.5; color:#55665e; margin:0; }
#application #archive-move-form { border-top:1px solid #e1d1b5; padding-top:16px; }
#application #archive-move-form[hidden] { display:none; }
#application .archive-add-shortcuts { margin:0 24px 24px; border:1px solid #e1d1b5; border-radius:16px; padding:16px; }
#application .archive-add-shortcuts > summary { min-height:44px; cursor:pointer; color:#173f35; font-weight:700; }
#application .archive-add-shortcuts .heritage-library-folders { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:12px 0 0; }
#application .archive-add-shortcuts .heritage-section-label { display:none; }
#application .archive-add-shortcuts .heritage-folder { display:flex; align-items:center; gap:12px; min-height:80px; padding:14px; border:1px solid #e1d1b5; border-radius:16px; background:#fffdf8; color:#173f35; text-align:left; }
#application .heritage-folder > div { display:grid; gap:5px; min-width:0; }
#application .heritage-folder strong { font-size:15px; }
#application .heritage-folder small { font-size:12px; line-height:1.4; color:#55665e; }
@media(max-width:760px) {
  :is(#add-intent-dialog,#add-method-dialog) .modal-content { padding:24px 18px; }
  #application .page-section.active > .page-heading { min-height:0!important; padding:18px!important; }
  #application .page-section.active > .page-heading h1 { font-size:30px!important; }
  #application #page-profile > .page-heading { margin:0 14px 14px!important; padding:20px!important; }
  #application #page-profile > .profile-journey { display:grid!important; margin:0 14px!important; grid-template-columns:64px minmax(0,1fr)!important; gap:12px!important; min-height:0!important; padding:18px!important; }
  #application .profile-journey-avatar { width:64px!important; height:64px!important; }
  #application .profile-journey-copy h2 { font-size:24px!important; line-height:1.2!important; }
  #application .profile-journey-copy p { font-size:14px!important; line-height:1.5!important; }
  #application #page-home .home-hero { min-height:280px!important; padding:28px 26px 72px!important; }
  #application #page-home .hero-kicker { font-size:26px!important; margin-bottom:28px!important; }
  #application #page-home .hero-copy h2 { font-size:42px!important; }
  #application #page-home .companion-moment { margin-top:-40px!important; }
  #application #page-home .companion-focus-copy h2 { font-size:28px!important; }
  #application #page-home .companion-focus-actions .button-primary { min-height:52px!important; padding:14px 18px!important; font-size:18px!important; }
  #application #page-heritage-library .heritage-subpage-head { padding:20px 18px 16px; }
  #application #page-heritage-library .heritage-primary-actions { padding:0 18px 16px; }
  #application #archive-workspace { margin:0 12px 18px; padding:14px; }
  #application #archive-folders { grid-template-columns:1fr; }
  #application #archive-items .archive-item-card { grid-template-columns:24px 30px minmax(0,1fr); gap:8px; padding:12px; }
  #application .archive-item-icon { width:30px; height:36px; }
  #application .archive-item-card > .text-button { grid-column:3; justify-self:start; min-height:44px; }
  #application .archive-add-shortcuts { margin:0 12px 18px; padding:14px; }
  #application .archive-add-shortcuts .heritage-library-folders { grid-template-columns:1fr; }
}

@media(max-width:760px) {
 #application #page-profile .profile-journey-avatar { width:64px!important; height:64px!important; position:relative!important; inset:auto!important; margin:0!important; grid-column:1; grid-row:1; align-self:start!important; }
 #application #page-profile .profile-journey-copy { width:auto!important; padding:0!important; grid-column:2; grid-row:1; }
 #application #page-profile .profile-private-label { white-space:normal; font-size:12px!important; padding:7px 10px!important; }
 #application #page-profile .profile-hub-grid { grid-template-columns:1fr!important; gap:10px!important; }
 #application #page-profile .profile-hub-card { display:grid!important; grid-template-columns:38px minmax(0,1fr) 18px!important; grid-template-rows:auto auto!important; align-items:center!important; column-gap:12px!important; min-height:84px!important; padding:14px!important; }
 #application #page-profile .profile-hub-card > span { grid-column:1!important; grid-row:1/3!important; margin:0!important; }
 #application #page-profile .profile-hub-card > strong { grid-column:2!important; grid-row:1!important; font-size:16px!important; }
 #application #page-profile .profile-hub-card > small { grid-column:2!important; grid-row:2!important; font-size:13px!important; line-height:1.4!important; }
 #application #page-profile .profile-hub-card > b { position:static!important; grid-column:3!important; grid-row:1/3!important; }
}

#application #page-profile[data-profile-view]:not([data-profile-view="hub"]) > .profile-journey { display:none!important; }
#application #page-heritage-library .heritage-primary-actions > .button { flex:1; }

#application #page-heritage-library #archive-folders { display:grid; padding:0; grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:760px) { #application #page-heritage-library #archive-folders { grid-template-columns:1fr; } }

/* Mission 11: the audited secondary screens share the same readable controls. */
#application #page-profile .profile-area-back {
  display:inline-flex; align-items:center; min-height:44px; margin:0 14px 14px;
  padding:10px 14px; color:#173f35!important; font-size:14px!important;
  text-decoration:underline; text-underline-offset:4px;
}
#application #page-profile .profile-area-back[hidden] { display:none!important; }
#application #page-profile > .content-card[data-profile-area="identite"] {
  padding:20px!important; margin:0 14px 16px!important; border:1px solid #e1d1b5;
  border-radius:20px!important; background:#fffaf0!important;
}
#application #page-profile > .content-card[data-profile-area="identite"] h2 {
  margin:0 0 16px!important; font-size:24px!important; line-height:1.2;
}
#application #page-profile > .content-card[data-profile-area="identite"] .modal-actions {
  display:grid; grid-template-columns:1fr; gap:10px; margin:0;
}
#application #page-profile > .content-card[data-profile-area="identite"] .button { min-height:48px; padding:12px; }
#application #page-family .family-tree { margin-top:0!important; }
#application #page-family .family-details { margin-top:16px; }
#application #page-family .family-tools { margin:16px 0; }
#application :is(.story-back,.knowledge-back) {
  display:inline-flex; align-items:center; min-height:44px; padding:8px 14px;
  color:#173f35!important; font-size:14px!important;
}
#application :is(.heritage-subpage-back,.heritage-category-action,#kinship-swap,[data-question-filter],[data-knowledge-tab],[data-knowledge-filter]) { min-height:44px!important; }
#application .heritage-subpage-back { display:inline-flex; align-items:center; padding:8px 0!important; font-size:14px!important; }
#application :is(.heritage-category-action,#kinship-swap) { width:44px!important; min-width:44px!important; }
#application .heritage-category-copy small { font-size:13px!important; line-height:1.45!important; }
#application :is(.page-heading .eyebrow,.heritage-heading .eyebrow,.stat-strip .eyebrow,.tree-legend,.tree-guidance,.testimony-meta,.profile-timeline-copy > span) { font-size:12px!important; line-height:1.45!important; }
.modal-dialog { max-width:calc(100vw - 24px); max-height:calc(100vh - 24px); max-height:calc(100dvh - 24px); }
.modal-dialog .modal-content { min-width:0; gap:16px; padding:24px; }
.modal-dialog .modal-content h2 { margin:0 40px 0 0; font-size:24px; line-height:1.25; letter-spacing:-.4px; }
.modal-dialog .modal-content label { font-size:14px; line-height:1.4; }
.modal-dialog .modal-content :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea) { min-width:0; max-width:100%; font-size:16px; }
.modal-dialog .modal-content :is(input:not([type="checkbox"]):not([type="radio"]),select) { min-height:44px; }
.modal-dialog .modal-content :is(.helper,.muted,.optional) { font-size:13px; line-height:1.5; }
.modal-dialog .modal-close { width:44px; height:44px; top:12px; right:12px; }
.modal-dialog .modal-actions { gap:10px; margin-top:8px; }
.modal-dialog .modal-actions .button { min-height:48px; white-space:normal; }
@media(max-width:760px) {
  #application #page-profile .profile-area-back, #application .page-section.active:not(#page-home):not(#page-profile) > :is(.story-back,.knowledge-back) { color:#fff8eb!important; }
  #application #page-family > .page-heading { display:grid!important; grid-template-columns:minmax(0,1fr) auto!important; align-items:center; gap:12px; margin-bottom:12px!important; }
  #application #page-family > .page-heading .page-intro { display:none!important; }
  #application #page-family > .page-heading .button { min-height:44px; padding:10px 14px!important; }
  #application #page-family .family-card { padding:12px!important; margin:0!important; }
  #application #page-family .family-card > .card-title-row { margin-bottom:10px!important; }
  #application #page-family .family-card > .card-title-row > div { display:none; }
  #application #page-family .tree-toolbar { display:grid!important; grid-template-columns:minmax(0,1fr); gap:8px!important; padding:0!important; }
  #application #page-family .tree-filter > button { width:100%; font-size:14px!important; }
  #application #page-family .tree-guidance { padding:10px 0!important; gap:4px!important; }
  #application #page-family .tree-guidance > span:first-child { display:none; }
  #application #page-family .tree-viewport { min-height:360px!important; height:52vh!important; max-height:470px; }
  #application #page-origins .heritage-spotlight {
    display:grid!important; grid-template-columns:minmax(0,1fr)!important; gap:16px!important;
    min-height:0!important; padding:20px!important; margin-bottom:16px!important;
  }
  #application #page-origins .heritage-spotlight-copy { width:100%!important; min-width:0; }
  #application #page-origins .heritage-spotlight h2 { max-width:none!important; margin:8px 0!important; font-size:26px!important; line-height:1.15!important; }
  #application #page-origins .heritage-spotlight p { max-width:none!important; color:#3d5148!important; font-size:14px!important; line-height:1.5!important; overflow-wrap:anywhere; }
  #application #page-origins .heritage-spotlight p strong { color:#173f35!important; }
  #application #page-origins .heritage-spotlight .eyebrow { font-size:12px!important; color:#55665e!important; }
  #application #page-origins .heritage-spotlight-branch { display:none!important; }
  #application #page-origins .heritage-spotlight-actions { display:flex!important; flex-wrap:wrap; gap:10px!important; }
  #application #page-origins .heritage-spotlight-actions > :is(button,a) { min-height:44px!important; white-space:normal; }
  #application #page-origins .heritage-spotlight-actions .light-text { color:#173f35!important; }
}
@media(max-width:480px) {
  .modal-dialog .modal-content { padding:22px 18px; }
  .modal-dialog .modal-content > .form-grid { grid-template-columns:minmax(0,1fr); }
  .modal-dialog .modal-actions { display:grid; grid-template-columns:minmax(0,1fr); }
}

/* Mission 14: recurring visual defects found in real browser journeys. */
.modal-dialog .modal-content > .eyebrow {
  padding-right:44px; min-width:0; overflow-wrap:anywhere; line-height:1.5;
}
.modal-dialog .modal-content :is(.button,.text-button) {
  min-height:44px; font-size:14px; line-height:1.4; white-space:normal;
}
.modal-dialog .choice-card .choice-symbol { width:34px; height:34px; }
.modal-dialog .choice-card .choice-arrow { justify-self:end; }
#application .page-wrap { overflow-anchor:none; }
#application :is(.story-section-head,.kinship-entry,.heritage-family-link) { gap:16px; flex-wrap:wrap; }
#application .person-story-hero { margin-bottom:16px; }
#application .story-identity { max-width:100%; min-width:0; }
#application .story-identity .eyebrow { padding-right:80px; line-height:1.5; }
#application :is(.story-identity .eyebrow,.story-private,.story-section-head .eyebrow,.story-facts dt,.story-origin-tags,.story-private-note p) { font-size:12px; line-height:1.5; }
#application :is(.story-hero-actions .button,.story-section-head .text-button,.story-remove-photo,.story-facts .text-button) { font-size:14px; min-height:44px; }
#application .story-hero-actions { gap:12px; }
#application #page-profile .profile-hub-card small { font-size:13px!important; line-height:1.5!important; }
#application :is(.heritage-memory-summary p,.question-feature p,.knowledge-entry p,.discovery-form .eyebrow,.discovery-code .eyebrow) { font-size:13px!important; line-height:1.5!important; }
#application :is(.heritage-family-link .text-button,.heritage-spotlight-actions .text-button) { min-width:44px; font-size:14px; }
@media(max-width:760px) {
  #application .story-identity .eyebrow { padding-right:0; }
  #application .person-story-hero { padding-top:44px; }
  #application .story-hero-actions > .button { flex:1 1 140px; }
}

.modal-dialog .file-audio { display:grid; gap:8px; min-width:0; font-size:13px!important; }
.modal-dialog .file-audio input[type="file"] { width:100%; min-width:0; font-size:14px; }

.modal-dialog .restitution-content { padding:0; gap:0; min-height:0; align-content:start; }
.restitution-dialog .modal-close { z-index:6; }
.restitution-toolbar > div { min-width:0; padding-right:44px; }
.restitution-toolbar h2 { overflow-wrap:anywhere; }

.restitution-hero > div { min-width:0; }
.restitution-hero h3 { overflow-wrap:anywhere; }
@media(max-width:480px) { .restitution-hero { grid-template-columns:minmax(0,1fr); } .restitution-hero h3 { font-size:24px; line-height:1.25; } }

.restitution-toolbar { padding-right:68px; }
