:root {
    --ink: #183153;
    --muted: #74666c;
    --surface: #ffffff;
    --background: #fff7f9;
    --theme-glow: #fde7ee;
    --line: #ecdde3;
    --primary: #ad3f64;
    --primary-dark: #8f2f50;
    --primary-soft: #fae7ed;
    --primary-bright: #e36f86;
    --primary-rgb: 173 63 100;
    --accent: #a4483e;
    --accent-soft: #fff0ec;
    --warm: #ef7f68;
    --shadow: 0 18px 45px rgb(111 44 68 / 12%);
    --shadow-soft: 0 10px 28px rgb(111 44 68 / 8%);
    --radius: 22px;
}

body[data-theme="orange"] {
    --muted: #74675f;
    --background: #fff8f3;
    --theme-glow: #ffe5d5;
    --line: #efded2;
    --primary: #c45b32;
    --primary-dark: #99401f;
    --primary-soft: #fde9dd;
    --primary-bright: #eb8658;
    --primary-rgb: 196 91 50;
    --accent: #b24d3d;
    --accent-soft: #fff0ea;
    --warm: #e98b55;
    --shadow: 0 18px 45px rgb(117 66 41 / 12%);
    --shadow-soft: 0 10px 28px rgb(117 66 41 / 8%);
}

body[data-theme="sky"] {
    --muted: #61717b;
    --background: #f5fbfe;
    --theme-glow: #dff3fb;
    --line: #d9e8ef;
    --primary: #347fa3;
    --primary-dark: #245f7c;
    --primary-soft: #e1f2f8;
    --primary-bright: #68b4d3;
    --primary-rgb: 52 127 163;
    --accent: #566fa7;
    --accent-soft: #edf1ff;
    --warm: #df8969;
    --shadow: 0 18px 45px rgb(42 79 99 / 12%);
    --shadow-soft: 0 10px 28px rgb(42 79 99 / 8%);
}

* {
    box-sizing: border-box;
}

html {
    min-width: 320px;
    background: var(--background);
}

body {
    min-height: 100vh;
    margin: 0;
    color: var(--ink);
    background-color: var(--background);
    background-image: linear-gradient(
        to bottom,
        var(--theme-glow) 0,
        var(--background) 34rem
    );
    font-family:
        Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
        "Segoe UI", sans-serif;
    line-height: 1.5;
}

a {
    color: var(--primary-dark);
    text-decoration-thickness: 0.08em;
    text-underline-offset: 0.18em;
}

button,
input,
select,
textarea {
    font: inherit;
}

.shell {
    width: min(1120px, calc(100% - 32px));
    margin-inline: auto;
}

.skip-link {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 100;
    padding: 10px 14px;
    color: white;
    background: var(--ink);
    border-radius: 10px;
    transform: translateY(-150%);
}

.skip-link:focus {
    transform: translateY(0);
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 20;
    border-bottom: 1px solid var(--line);
    background: rgb(255 255 255 / 88%);
    backdrop-filter: blur(14px);
}

.header-inner {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--ink);
    font-size: 1.05rem;
    font-weight: 800;
    text-decoration: none;
}

.brand-mark {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    color: white;
    background: linear-gradient(
        135deg,
        var(--primary),
        var(--primary-bright)
    );
    border-radius: 13px;
    box-shadow:
        0 8px 20px
        rgb(var(--primary-rgb) / 24%);
    font-size: 0.78rem;
}

.header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.header-actions form {
    margin: 0;
}

.account-menu {
    position: relative;
}

.account-menu-trigger {
    box-sizing: border-box;
    width: 120px;
    height: 42px;
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 14px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: var(--surface);
    border-radius: 13px;
    cursor: pointer;
    font-size: 0.9rem;
    font-weight: 750;
    list-style: none;
}

.account-menu-trigger::-webkit-details-marker {
    display: none;
}

.account-menu-trigger:hover,
.account-menu[open] .account-menu-trigger {
    border-color: var(--primary);
    background: var(--primary-soft);
}

.account-menu-trigger:focus-visible {
    outline: 3px solid var(--primary-soft);
    outline-offset: 3px;
}

.account-menu-panel {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 40;
    width: min(290px, calc(100vw - 24px));
    overflow: hidden;
    padding: 8px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 17px;
    box-shadow: var(--shadow);
}

.account-menu-identity {
    display: grid;
    gap: 2px;
    padding: 12px 13px 14px;
    border-bottom: 1px solid var(--line);
}

.account-menu-identity span,
.account-menu-identity small {
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.78rem;
}

.account-menu-identity strong {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.account-menu-link,
.account-menu-logout button {
    width: 100%;
    display: flex;
    padding: 11px 13px;
    border: 0;
    color: var(--ink);
    background: transparent;
    border-radius: 11px;
    cursor: pointer;
    font: inherit;
    font-size: 0.9rem;
    font-weight: 700;
    text-align: left;
    text-decoration: none;
}

.account-menu-link:hover,
.account-menu-logout button:hover {
    color: var(--primary-dark);
    background: var(--primary-soft);
}

.account-menu-logout {
    margin: 4px 0 0;
    padding-top: 4px;
    border-top: 1px solid var(--line);
}

.account-menu-logout button {
    color: var(--primary-dark);
}

@media (max-width: 640px) {
    .account-menu-trigger {
        min-height: 40px;
        padding: 8px 12px;
    }

    .account-menu-panel {
        position: fixed;
        top: 70px;
        right: 12px;
    }
}

.user-chip {
    max-width: 190px;
    overflow: hidden;
    padding: 8px 12px;
    color: var(--muted);
    background: var(--background);
    border-radius: 999px;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.88rem;
}

.main-content {
    padding-block: 48px 72px;
}

.button {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 11px 18px;
    border: 1px solid transparent;
    border-radius: 13px;
    cursor: pointer;
    font-weight: 750;
    text-decoration: none;
    transition:
        transform 160ms ease,
        background 160ms ease,
        border-color 160ms ease;
}

.button:hover {
    transform: translateY(-1px);
}

.button--primary {
    color: white;
    background: var(--primary);
}

.button--primary:hover {
    background: var(--primary-dark);
}

.button--secondary {
    color: var(--accent);
    background: var(--accent-soft);
}

.button--ghost {
    color: var(--ink);
    background: white;
    border-color: var(--line);
}

.button--small {
    min-height: 38px;
    padding: 8px 13px;
    font-size: 0.88rem;
}

.button--icon {
    width: 44px;
    min-width: 44px;
    padding: 0;
}

.button-icon {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
}

.messages {
    padding-top: 18px;
}

.message {
    padding: 13px 16px;
    border: 1px solid var(--line);
    color: var(--primary-dark);
    background: var(--primary-soft);
    border-radius: 14px;
}

@media (max-width: 640px) {
    .shell {
        width: min(100% - 24px, 1120px);
    }

    .header-inner {
        min-height: 64px;
    }

    .user-chip {
        display: none;
    }

    .main-content {
        padding-block: 32px 56px;
    }

    .brand span:last-child {
        font-size: 0.96rem;
    }
}

.page-hero {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 34px;
}

.eyebrow {
    margin: 0 0 8px;
    color: var(--primary);
    font-size: 0.78rem;
    font-weight: 850;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.page-hero h1 {
    margin: 0;
    font-size: clamp(2.1rem, 6vw, 3.7rem);
    line-height: 1.02;
    letter-spacing: -0.045em;
}

.page-intro {
    max-width: 650px;
    margin: 16px 0 0;
    color: var(--muted);
    font-size: 1.08rem;
}

.family-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr));
    gap: 20px;
}

.family-card {
    position: relative;
    min-height: 245px;
    overflow: hidden;
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.family-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 5px;
    background: var(--primary);
}

.family-card:nth-child(3n + 2)::before {
    background: var(--accent);
}

.family-card:nth-child(3n + 3)::before {
    background: var(--warm);
}

.family-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.family-avatar {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    color: var(--primary-dark);
    background: var(--primary-soft);
    border-radius: 17px;
    font-size: 1.15rem;
    font-weight: 850;
}

.badge {
    padding: 7px 10px;
    color: var(--muted);
    background: var(--background);
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 750;
}

.family-card h2 {
    margin: 26px 0 8px;
    font-size: 1.35rem;
}

.family-card p {
    min-height: 48px;
    margin: 0;
    color: var(--muted);
}

.card-actions {
    margin-top: 24px;
}

.empty-state {
    max-width: 620px;
    padding: 44px 28px;
    border: 1px dashed var(--line);
    background: rgb(255 255 255 / 70%);
    border-radius: var(--radius);
    text-align: center;
}

.empty-state h2 {
    margin: 16px 0 8px;
}

.empty-state p {
    max-width: 470px;
    margin: 0 auto 24px;
    color: var(--muted);
}

.empty-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    margin-inline: auto;
    color: white;
    background: var(--primary);
    border-radius: 20px;
    font-size: 1.8rem;
}

@media (max-width: 640px) {
    .page-hero {
        align-items: stretch;
        flex-direction: column;
    }

    .page-hero .button {
        width: 100%;
    }

    .family-card {
        min-height: auto;
    }
}

.back-link {
    display: inline-flex;
    margin-bottom: 28px;
    color: var(--muted);
    font-weight: 700;
    text-decoration: none;
}

.back-link:hover {
    color: var(--primary);
}

.form-layout {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(320px, 1.15fr);
    align-items: start;
    gap: clamp(32px, 7vw, 90px);
}

.form-intro h1 {
    margin: 0;
    font-size: clamp(2.1rem, 5vw, 3.4rem);
    line-height: 1.04;
    letter-spacing: -0.04em;
}

.form-intro > p:last-child {
    max-width: 480px;
    margin-top: 18px;
    color: var(--muted);
    font-size: 1.04rem;
}

.form-card {
    padding: clamp(24px, 5vw, 38px);
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.field label {
    display: block;
    margin-bottom: 8px;
    font-weight: 800;
}

.field input,
.field select,
.field textarea {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    color: var(--ink);
    background: white;
    border-radius: 13px;
    outline: none;
}

.field input:focus,
.field select:focus,
.field textarea:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgb(var(--primary-rgb) / 14%);
}

.field-help {
    margin: 9px 0 0;
    color: var(--muted);
    font-size: 0.86rem;
}

.errorlist {
    margin: 9px 0 0;
    padding: 10px 12px;
    color: #8a2432;
    background: #fff0f2;
    border-radius: 10px;
    list-style: none;
    font-size: 0.88rem;
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 30px;
}

@media (max-width: 760px) {
    .form-layout {
        grid-template-columns: 1fr;
    }

    .form-actions {
        align-items: stretch;
        flex-direction: column-reverse;
    }

    .form-actions .button {
        width: 100%;
    }
}

.login-layout {
    min-height: calc(100vh - 190px);
    display: grid;
    grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.75fr);
    align-items: center;
    gap: clamp(38px, 8vw, 110px);
}

.login-copy h1 {
    max-width: 680px;
    margin: 0;
    font-size: clamp(2.5rem, 7vw, 5rem);
    line-height: 0.98;
    letter-spacing: -0.055em;
}

.login-copy > p:not(.eyebrow) {
    max-width: 620px;
    margin: 22px 0 0;
    color: var(--muted);
    font-size: 1.1rem;
}

.trust-list {
    display: grid;
    gap: 10px;
    margin: 28px 0 0;
    padding: 0;
    list-style: none;
}

.trust-list li {
    position: relative;
    padding-left: 30px;
    color: var(--ink);
    font-weight: 650;
}

.trust-list li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: var(--primary);
    font-weight: 900;
}

.login-card {
    padding: clamp(26px, 5vw, 40px);
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 26px;
    box-shadow: var(--shadow);
}

.login-card h2 {
    margin: 0;
    font-size: 2rem;
    letter-spacing: -0.03em;
}

.login-intro {
    margin: 6px 0 24px;
    color: var(--muted);
}

.login-card .field + .field {
    margin-top: 18px;
}

.login-submit {
    width: 100%;
    margin-top: 24px;
}

.login-note {
    margin: 18px 0 0;
    color: var(--muted);
    font-size: 0.8rem;
    text-align: center;
}

.error-banner {
    margin-bottom: 20px;
    padding: 12px 14px;
    color: #8a2432;
    background: #fff0f2;
    border-radius: 11px;
    font-size: 0.9rem;
}

@media (max-width: 800px) {
    .login-layout {
        min-height: auto;
        grid-template-columns: 1fr;
    }

    .login-copy h1 {
        font-size: clamp(2.4rem, 12vw, 4rem);
    }
}

.family-home {
    padding-bottom: 110px;
}

.family-home-hero {
    align-items: flex-end;
}

.button--disabled,
.button:disabled {
    cursor: not-allowed;
    opacity: 0.58;
}

.section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin: 38px 0 18px;
}

.section-heading h2 {
    margin: 2px 0 0;
    font-size: clamp(1.65rem, 4vw, 2.2rem);
    letter-spacing: -0.035em;
}

.profile-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 18px;
}

.profile-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 132px;
    padding: 22px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 22px;
    box-shadow: var(--shadow-soft);
}

.profile-avatar {
    display: grid;
    flex: 0 0 68px;
    width: 68px;
    height: 68px;
    place-items: center;
    color: white;
    background: linear-gradient(145deg, var(--primary), var(--accent));
    border-radius: 22px;
    font-size: 1.7rem;
    font-weight: 850;
}

.profile-card-body {
    min-width: 0;
}

.profile-card-body h3 {
    overflow: hidden;
    margin: 2px 0 5px;
    font-size: 1.25rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-card-body p {
    margin: 0;
    color: var(--muted);
}

.profile-relationship {
    color: var(--primary) !important;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.profile-card-arrow {
    margin-left: auto;
    color: var(--muted);
    font-size: 1.4rem;
}

.home-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
    margin-top: 42px;
}

.summary-card {
    min-height: 180px;
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 22px;
}

.summary-card h2 {
    margin: 5px 0 18px;
    font-size: 1.25rem;
}

.summary-empty {
    margin: 0;
    color: var(--muted);
}

.summary-card-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.summary-card-heading h2 {
    margin-bottom: 18px;
}

.summary-count {
    min-width: 32px;
    min-height: 32px;
    display: inline-grid;
    place-items: center;
    padding: 5px 9px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 800;
}

.family-followup {
    display: grid;
    gap: 14px;
}

.family-followup-person {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
}

.family-followup-person .profile-avatar {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 15px;
    font-size: 1.25rem;
}

.family-followup-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.family-followup-copy strong,
.family-followup-copy span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.family-followup-copy strong {
    color: var(--ink);
}

.family-followup-copy span {
    color: var(--muted);
    font-size: 0.9rem;
}

.family-followup-date {
    margin: 0;
    color: var(--muted);
    font-size: 0.88rem;
}

.family-followup .button {
    width: fit-content;
}

.family-followup-more {
    margin: 16px 0 0;
    padding-top: 14px;
    color: var(--muted);
    border-top: 1px solid var(--line);
    font-size: 0.88rem;
}

.family-followup-all {
    width: fit-content;
    margin-top: 16px;
}

.follow-up-list-page {
    display: grid;
    gap: 32px;
}

.follow-up-list-hero {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    padding: 32px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: var(--radius);
    box-shadow: var(--shadow-soft);
}

.follow-up-list-hero h1 {
    margin: 6px 0 10px;
    font-size: clamp(2rem, 5vw, 3.4rem);
    line-height: 1.05;
}

.follow-up-list-hero p:last-child {
    max-width: 680px;
    margin: 0;
    color: var(--muted);
}

.follow-up-list {
    display: grid;
    gap: 16px;
}

.follow-up-list-card {
    display: grid;
    grid-template-columns:
        minmax(220px, 1fr)
        minmax(260px, 1.2fr)
        auto;
    align-items: center;
    gap: 24px;
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 20px;
}

.follow-up-list-person {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
}

.follow-up-list-person .profile-avatar {
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    border-radius: 18px;
    font-size: 1.5rem;
}

.follow-up-list-copy {
    min-width: 0;
}

.follow-up-list-copy .eyebrow {
    margin-bottom: 3px;
}

.follow-up-list-copy h2 {
    overflow: hidden;
    margin: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.15rem;
}

.follow-up-list-copy > p:last-child {
    overflow: hidden;
    margin: 3px 0 0;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
}

.follow-up-list-data {
    display: grid;
    gap: 10px;
    margin: 0;
}

.follow-up-list-data div {
    display: grid;
    gap: 2px;
}

.follow-up-list-data dt {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.follow-up-list-data dd {
    margin: 0;
    color: var(--ink);
    font-size: 0.92rem;
}

.follow-up-list-card > .button {
    white-space: nowrap;
}

@media (max-width: 800px) {
    .follow-up-list-hero {
        align-items: flex-start;
        flex-direction: column;
        padding: 24px;
    }

    .follow-up-list-card {
        grid-template-columns: 1fr;
        align-items: stretch;
        gap: 18px;
    }

    .follow-up-list-card > .button {
        width: 100%;
    }
}

.upload-dock {
    position: fixed;
    z-index: 20;
    bottom: 24px;
    left: 50%;
    transform: translateX(-50%);
}

.upload-button {
    min-width: 250px;
    min-height: 58px;
    justify-content: center;
    border-radius: 999px;
    box-shadow: 0 16px 38px rgb(37 65 76 / 24%);
    font-size: 1rem;
}

.upload-button-icon {
    font-size: 1.45rem;
    line-height: 1;
}

@media (max-width: 800px) {
    .family-home-hero,
    .section-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .home-summary {
        grid-template-columns: 1fr;
    }

    .upload-dock {
        right: 18px;
        bottom: 18px;
        left: 18px;
        transform: none;
    }

    .upload-button {
        width: 100%;
    }
}

.form-card .field + .field {
    margin-top: 18px;
}

.profile-avatar--teal {
    background: linear-gradient(145deg, #167c68, #35a58c);
}

.profile-avatar--violet {
    background: linear-gradient(145deg, #6245b5, #8b70df);
}

.profile-avatar--blue {
    background: linear-gradient(145deg, #3176ad, #63a7d8);
}

.profile-avatar--coral {
    background: linear-gradient(145deg, #d96250, #ef917d);
}

.profile-avatar--amber {
    background: linear-gradient(145deg, #b56a13, #e8a73c);
}

.profile-avatar--rose {
    background: linear-gradient(145deg, #b94e76, #df83a3);
}

.profile-card--current {
    border-color: rgb(var(--primary-rgb) / 45%);
    box-shadow:
        0 0 0 3px rgb(var(--primary-rgb) / 10%),
        var(--shadow-soft);
}

.profile-card {
    color: inherit;
    text-decoration: none;
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.profile-card:hover {
    border-color: rgb(var(--primary-rgb) / 38%);
    box-shadow: var(--shadow);
    transform: translateY(-2px);
}

.profile-detail {
    padding-bottom: 110px;
}

.profile-detail-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 24px;
    margin-top: 24px;
    padding: clamp(24px, 5vw, 38px);
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 28px;
    box-shadow: var(--shadow);
}

.profile-detail-avatar {
    width: 92px;
    height: 92px;
    flex-basis: 92px;
    border-radius: 28px;
    font-size: 2.5rem;
}

.profile-detail-identity h1 {
    margin: 2px 0 4px;
    font-size: clamp(2.2rem, 6vw, 4rem);
    line-height: 1;
    letter-spacing: -0.05em;
}

.profile-detail-identity > p:last-child {
    margin: 10px 0 0;
    color: var(--muted);
}

.profile-detail-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 10px;
}

.status-pill {
    display: inline-flex;
    min-height: 40px;
    align-items: center;
    padding: 8px 14px;
    color: var(--primary-dark);
    background: var(--primary-soft);
    border-radius: 999px;
    font-size: 0.86rem;
    font-weight: 800;
}

.status-pill--pending {
    color: var(--accent);
    background: var(--accent-soft);
}

.profile-tabs {
    display: flex;
    gap: 8px;
    margin: 28px 0 18px;
    padding-bottom: 2px;
    overflow-x: auto;
}

.profile-tab {
    flex: 0 0 auto;
    padding: 10px 16px;
    color: var(--muted);
    background: transparent;
    border-radius: 999px;
    font-weight: 750;
}

.profile-tab--active {
    color: white;
    background: var(--primary);
}

.profile-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.profile-panel {
    min-height: 180px;
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 22px;
}

.profile-panel--wide {
    grid-column: 1 / -1;
}

.profile-panel h2 {
    margin: 5px 0 18px;
    font-size: 1.35rem;
}

.profile-data-list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
}

.profile-data-list div {
    padding: 16px;
    background: var(--background);
    border-radius: 14px;
}

.profile-data-list dt {
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 750;
    text-transform: uppercase;
}

.profile-data-list dd {
    margin: 5px 0 0;
    font-weight: 800;
}

@media (max-width: 820px) {
    .profile-detail-header {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .profile-detail-actions {
        grid-column: 1 / -1;
        justify-content: flex-start;
    }

    .profile-detail-grid {
        grid-template-columns: 1fr;
    }

    .profile-panel--wide {
        grid-column: auto;
    }

    .profile-data-list {
        grid-template-columns: 1fr;
    }
}

.family-home-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 12px;
}

.invitation-share-card h2 {
    margin-top: 0;
}

.invitation-share-card input[readonly] {
    width: 100%;
    cursor: text;
    background: var(--background);
}

.invitation-expiry {
    color: var(--muted);
}

.invitation-feedback {
    min-height: 24px;
    margin: 0;
    color: var(--primary-dark);
    font-weight: 700;
}

.invitation-public {
    align-items: start;
}

@media (max-width: 720px) {
    .family-home-actions {
        width: 100%;
        justify-content: stretch;
    }

    .family-home-actions .button {
        flex: 1 1 100%;
    }
}

.pending-invitations {
    margin-top: 40px;
}

.invitation-list {
    display: grid;
    gap: 12px;
}

.invitation-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 22px 24px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
}

.invitation-row h3 {
    margin: 2px 0 4px;
}

.invitation-row-meta {
    margin: 0;
    color: var(--muted);
}

.invitation-row form {
    flex: 0 0 auto;
    margin: 0;
}

.invitation-revoke-button {
    color: #9f4134;
    border-color: #efc6bf;
}

@media (max-width: 720px) {
    .invitation-row {
        align-items: stretch;
        flex-direction: column;
    }

    .invitation-row form,
    .invitation-row .button {
        width: 100%;
    }
}

.document-list {
    display: grid;
    gap: 0;
    margin: 22px 0 0;
    padding: 0;
    list-style: none;
}

.document-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 18px 0;
    border-top: 1px solid var(--line);
}

.document-list-copy {
    min-width: 0;
}

.document-list-copy h3 {
    margin: 3px 0;
    color: var(--ink);
    font-size: 1.05rem;
}

.document-type {
    margin: 0;
    color: var(--primary);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.document-meta {
    margin: 0;
    color: var(--muted);
    font-size: 0.92rem;
}

@media (max-width: 640px) {
    .document-list-item {
        align-items: stretch;
        flex-direction: column;
        gap: 14px;
    }

    .document-list-item .button {
        justify-content: center;
        width: 100%;
    }
}

.document-detail-page {
    padding-bottom: 7rem;
}

.document-detail-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    margin-top: 32px;
    padding: 38px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

.document-detail-copy {
    min-width: 0;
}

.document-detail-title {
    margin: 6px 0 8px;
    overflow-wrap: anywhere;
    font-size: clamp(2.2rem, 6vw, 4rem);
    line-height: 1.05;
}

.document-detail-subtitle {
    margin: 0;
    color: var(--muted);
}

.document-detail-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 12px;
}

.document-detail-actions .button {
    text-align: center;
}

.document-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr);
    gap: 20px;
    margin-top: 28px;
}

.document-data-list {
    display: grid;
    gap: 0;
    margin: 24px 0 0;
}

.document-data-list > div {
    display: grid;
    grid-template-columns: minmax(130px, 0.7fr) minmax(0, 1.3fr);
    gap: 20px;
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
}

.document-data-list > div:last-child {
    border-bottom: 0;
}

.document-data-list dt {
    color: var(--muted);
    font-weight: 700;
}

.document-data-list dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    font-weight: 750;
}

.document-list-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
}

.document-privacy-note {
    margin: 24px 0 0;
    padding: 16px;
    color: var(--muted);
    background: var(--primary-soft);
    border-radius: 16px;
}

@media (max-width: 760px) {
    .document-detail-hero {
        align-items: stretch;
        flex-direction: column;
        padding: 26px;
    }

    .document-detail-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .document-detail-actions .button {
        width: 100%;
    }

    .document-detail-grid {
        grid-template-columns: 1fr;
    }

    .document-data-list > div {
        grid-template-columns: 1fr;
        gap: 5px;
    }

    .document-list-actions {
        align-items: stretch;
        flex-direction: column;
        width: 100%;
    }
}

.document-detail-action-group {
    display: grid;
    justify-items: end;
    gap: 10px;
}

.document-share-status {
    max-width: 360px;
    margin: 0;
    color: var(--muted);
    font-size: 0.9rem;
    text-align: right;
}

@media (max-width: 760px) {
    .document-detail-action-group {
        justify-items: stretch;
        width: 100%;
    }

    .document-share-status {
        max-width: none;
        text-align: left;
    }
}

.button--danger {
    color: #983a32;
    background: #fff4f1;
    border-color: #efc3bb;
}

.button--danger:hover {
    color: #76281f;
    background: #ffe6e0;
    border-color: #e8a99e;
}

.danger-note {
    margin-top: 24px;
    padding: 16px;
    color: #76281f;
    background: #fff0ec;
    border: 1px solid #efc3bb;
    border-radius: 16px;
}

a.profile-tab {
    text-decoration: none;
}

.profile-tab[aria-disabled="true"] {
    cursor: default;
    opacity: 0.65;
}

.document-library {
    margin-top: 28px;
}

.document-filters {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) minmax(220px, 0.7fr) auto;
    align-items: end;
    gap: 16px;
    padding-bottom: 28px;
    border-bottom: 1px solid var(--line);
}

.document-filter-field {
    display: grid;
    gap: 7px;
}

.document-filter-field label {
    font-weight: 750;
}

.document-filter-field input,
.document-filter-field select {
    width: 100%;
    min-height: 48px;
    padding: 10px 14px;
    color: var(--ink);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: 14px;
}

.document-filter-actions {
    display: flex;
    gap: 10px;
}

.document-library-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 20px;
    margin: 28px 0 18px;
}

.document-library-heading h2,
.document-library-heading p {
    margin-bottom: 0;
}

.document-empty-state {
    padding: 48px 20px;
    color: var(--muted);
    text-align: center;
    background: var(--background);
    border: 1px dashed var(--line);
    border-radius: 18px;
}

.document-empty-state h3 {
    margin-top: 0;
    color: var(--ink);
}

.pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    margin-top: 28px;
}

.pagination > :last-child {
    justify-self: end;
}

.pagination-status {
    color: var(--muted);
    text-align: center;
}

@media (max-width: 760px) {
    .document-filters {
        grid-template-columns: 1fr;
    }

    .document-filter-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .document-library-heading {
        align-items: start;
        flex-direction: column;
    }

    .pagination {
        grid-template-columns: 1fr;
    }

    .pagination > * {
        justify-self: stretch;
        text-align: center;
    }
}

.account-status {
    margin-top: 24px;
    padding: 18px;
    color: var(--muted);
    background: var(--background);
    border: 1px solid var(--line);
    border-radius: 16px;
}

.account-status strong {
    display: block;
    margin-bottom: 7px;
    color: var(--ink);
}

.account-status p {
    margin-top: 0;
}

.account-status .button {
    margin-top: 8px;
}

.profile-data-note {
    margin-top: 24px;
    padding: 20px;
    color: var(--muted);
    background: var(--primary-soft);
    border-radius: 18px;
}

.profile-data-note p:first-child {
    margin-top: 0;
}

.profile-data-note p:last-child {
    margin-bottom: 0;
}

.section-heading-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

.relationship-page {
    display: grid;
    gap: 28px;
}

.relationship-page-hero {
    max-width: 780px;
}

.relationship-page-hero h1 {
    margin: 8px 0 12px;
    font-size: clamp(2.4rem, 6vw, 4.4rem);
    line-height: 0.98;
    letter-spacing: -0.045em;
}

.relationship-page-hero .page-intro {
    max-width: 700px;
    margin-bottom: 0;
}

.relationship-perspective-card,
.relationship-editor-card {
    padding: 28px;
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.relationship-perspective-list {
    display: grid;
    grid-template-columns: repeat(
        auto-fit,
        minmax(210px, 1fr)
    );
    gap: 12px;
    margin-top: 22px;
}

.relationship-perspective-option {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 18px;
    color: var(--ink);
    background: var(--surface);
    text-decoration: none;
    transition:
        border-color 160ms ease,
        background-color 160ms ease,
        transform 160ms ease;
}

.relationship-perspective-option:hover {
    border-color: var(--primary);
    background: var(--primary-soft);
    transform: translateY(-1px);
}

.relationship-perspective-option--active {
    border-color: var(--primary);
    background: var(--primary-soft);
}

.relationship-perspective-option .profile-avatar {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border-radius: 16px;
}

.relationship-perspective-copy {
    min-width: 0;
    display: grid;
    gap: 3px;
}

.relationship-perspective-copy strong {
    overflow: hidden;
    font-size: 1rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.relationship-editor-card {
    display: grid;
    gap: 24px;
}

.relationship-editor-heading h2 {
    margin: 5px 0 8px;
}

.relationship-editor-heading p:last-child {
    max-width: 720px;
    margin-bottom: 0;
    color: var(--muted);
}

.relationship-editor-list {
    display: grid;
    border-top: 1px solid var(--line);
}

.relationship-editor-row {
    display: grid;
    grid-template-columns:
        minmax(220px, 0.75fr)
        minmax(360px, 1.25fr);
    align-items: center;
    gap: 32px;
    padding: 24px 0;
    border-bottom: 1px solid var(--line);
}

.relationship-editor-person {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
}

.relationship-editor-person .profile-avatar {
    width: 68px;
    height: 68px;
    flex: 0 0 68px;
}

.relationship-editor-person-copy {
    min-width: 0;
}

.relationship-editor-person-copy h3 {
    margin: 3px 0 0;
    overflow-wrap: anywhere;
    font-size: 1.1rem;
}

.relationship-editor-controls {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(240px, 1fr) auto;
    align-items: end;
    gap: 16px;
}

.relationship-editor-field {
    min-width: 0;
    margin: 0;
}

.relationship-editor-field select {
    width: 100%;
}

.relationship-editor-controls .button {
    min-width: 110px;
}

.relationship-editor-card .form-actions {
    margin-top: 0;
}

@media (max-width: 760px) {
    .section-heading-actions {
        width: 100%;
        justify-content: flex-start;
    }

    .relationship-perspective-card,
    .relationship-editor-card {
        padding: 20px;
        border-radius: 20px;
    }

    .relationship-perspective-list {
        grid-template-columns: 1fr;
    }

    .relationship-editor-row {
        grid-template-columns: 1fr;
        gap: 18px;
        padding: 22px 0;
    }

    .relationship-editor-controls {
        grid-template-columns: 1fr;
    }

    .relationship-editor-controls .button {
        width: 100%;
    }
}

.preference-fieldset {
    margin: 0;
    padding: 0;
    border: 0;
}

.preference-fieldset + .preference-fieldset {
    margin-top: 32px;
    padding-top: 32px;
    border-top: 1px solid var(--line);
}

.preference-fieldset legend {
    padding: 0;
    color: var(--ink);
    font-size: 1.15rem;
    font-weight: 800;
}

.preference-fieldset > .field-help {
    max-width: 680px;
    margin: 8px 0 18px;
}

.theme-choice-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.theme-choice {
    position: relative;
    min-width: 0;
    min-height: 100px;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 18px;
    cursor: pointer;
    transition:
        border-color 160ms ease,
        background-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.theme-choice:hover {
    border-color: var(--primary);
    transform: translateY(-1px);
}

.theme-choice:has(input:checked) {
    border-color: var(--primary);
    background: var(--primary-soft);
    box-shadow:
        0 0 0 3px
        rgb(var(--primary-rgb) / 10%);
}

.theme-choice:has(input:focus-visible) {
    outline: 3px solid var(--primary-soft);
    outline-offset: 3px;
}

.theme-choice input {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.theme-choice > span:last-child {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.theme-choice strong,
.theme-choice small {
    display: block;
}
.profile-follow-up-history {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}

.profile-follow-up-history > .eyebrow {
    margin-bottom: 0;
}

.profile-follow-up-history .document-list {
    margin-top: 10px;
}

.profile-follow-up-history .document-list-item {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
}

.profile-follow-up-history .document-list-actions {
    justify-content: flex-start;
}
.theme-choice small {
    color: var(--muted);
    font-size: 0.82rem;
}

.theme-swatch {
    width: 48px;
    min-width: 48px;
    aspect-ratio: 1;
    border: 4px solid white;
    border-radius: 15px;
    box-shadow: 0 0 0 1px var(--line);
}

.theme-swatch--rose {
    background: linear-gradient(
        135deg,
        #ad3f64 0 50%,
        #fae7ed 50% 100%
    );
}

.theme-swatch--orange {
    background: linear-gradient(
        135deg,
        #c45b32 0 50%,
        #fde9dd 50% 100%
    );
}

.theme-swatch--sky {
    background: linear-gradient(
        135deg,
        #347fa3 0 50%,
        #e1f2f8 50% 100%
    );
}

.preference-toggle {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 18px;
    cursor: pointer;
}

.preference-toggle:has(input:checked) {
    border-color: var(--primary);
    background: var(--primary-soft);
}

.preference-toggle input {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
    margin-top: 2px;
    accent-color: var(--primary);
}

.preference-toggle span {
    display: grid;
    gap: 4px;
}

.preference-toggle small {
    max-width: 680px;
    color: var(--muted);
    line-height: 1.5;
}

.preference-section-heading {
    margin-bottom: 24px;
}

.preference-section-heading h2 {
    margin: 0;
}

.preference-section-heading .field-help {
    max-width: 720px;
    margin-top: 8px;
}

.family-email-preference-list {
    display: grid;
    gap: 18px;
}

.family-email-preference-list .family-email-preference {
    margin: 0;
    padding: 22px;
    border: 1px solid var(--line);
    background: rgb(255 255 255 / 72%);
    border-radius: 18px;
}

.family-email-preference-list
.family-email-preference:has(
    .preference-toggle input:checked
) {
    border-color: rgb(var(--primary-rgb) / 34%);
    box-shadow:
        0 0 0 3px
        rgb(var(--primary-rgb) / 7%);
}

.family-email-preference legend {
    padding-inline: 4px;
}

.family-email-preference .preference-toggle {
    margin-top: 14px;
}

.family-email-preference .field {
    margin-top: 18px;
}

.family-email-preference .field[hidden] {
    display: none;
}

@media (max-width: 720px) {
    .theme-choice-grid {
        grid-template-columns: 1fr;
    }

    .theme-choice {
        min-height: 82px;
    }
    .family-email-preference-list
    .family-email-preference {
        padding: 18px;
    }
}

.follow-up-history {
    display: grid;
    gap: 18px;
    padding-top: 8px;
}

.follow-up-history-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.follow-up-history-heading h2 {
    margin: 4px 0 6px;
    font-size: clamp(1.5rem, 3vw, 2rem);
}

.follow-up-list-empty {
    padding: 24px;
    color: var(--muted);
    background: rgb(255 255 255 / 72%);
    border: 1px dashed var(--line);
    border-radius: 18px;
}

.follow-up-list-empty strong {
    display: block;
    margin-bottom: 5px;
    color: var(--ink);
}

.follow-up-list-empty p {
    margin: 0;
}

.follow-up-list-card--history {
    background: rgb(255 255 255 / 82%);
}

.follow-up-list-card--history .follow-up-list-copy h3 {
    overflow: hidden;
    margin: 0;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.15rem;
}

.follow-up-result {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: end;
    padding: 8px 13px;
    color: var(--muted);
    background: var(--background);
    border: 1px solid var(--line);
    border-radius: 999px;
    white-space: nowrap;
    font-size: 0.84rem;
    font-weight: 800;
}

.follow-up-result--attended {
    color: var(--primary-dark);
    background: var(--primary-soft);
    border-color: var(--line);
}

.follow-up-result--missed {
    color: var(--accent);
    background: var(--accent-soft);
}

@media (max-width: 800px) {
    .follow-up-history-heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .follow-up-result {
        justify-self: start;
    }
}

.profile-follow-up-history {
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--line);
}

.profile-follow-up-history > .eyebrow {
    margin-bottom: 0;
}

.profile-follow-up-history .document-list {
    margin-top: 10px;
}

.profile-follow-up-history .document-list-item {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
}

.profile-follow-up-history .document-list-actions {
    justify-content: flex-start;
}

.family-agenda-page {
    display: grid;
    gap: 32px;
}

.family-agenda-page > .back-link {
    width: fit-content;
}

.family-agenda-item {
    display: grid;
    grid-template-columns:
        minmax(210px, 0.9fr)
        minmax(240px, 1.1fr)
        auto;
    align-items: center;
    gap: 24px;
}

.family-agenda-person {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
}

.family-agenda-person .profile-avatar {
    width: 56px;
    height: 56px;
    flex: 0 0 56px;
    border-radius: 18px;
    font-size: 1.45rem;
}

.family-agenda-person-copy {
    min-width: 0;
}

.family-agenda-person-copy h3 {
    margin: 3px 0 0;
    overflow: hidden;
    color: var(--ink);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1.05rem;
}

.family-agenda-details {
    min-width: 0;
    display: grid;
    gap: 3px;
}

@media (max-width: 880px) {
    .family-agenda-item {
        grid-template-columns: 1fr;
        align-items: stretch;
        gap: 16px;
    }

    .family-agenda-person-copy h3 {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }

    .family-agenda-item .document-list-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 640px) {
    .family-agenda-page {
        gap: 24px;
    }

    .family-agenda-person .profile-avatar {
        width: 50px;
        height: 50px;
        flex-basis: 50px;
        border-radius: 16px;
        font-size: 1.3rem;
    }
}

.appointment-detail-page .document-detail-hero {
    flex-wrap: wrap;
}

.appointment-detail-page .document-detail-copy {
    min-width: 280px;
    flex: 1 1 320px;
}

.appointment-detail-page .document-detail-actions {
    max-width: 720px;
    flex: 1 1 520px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

@media (max-width: 760px) {
    .appointment-detail-page .document-detail-copy {
        width: 100%;
        min-width: 0;
        flex: 0 1 auto;
    }

    .appointment-detail-page .document-detail-actions {
        width: 100%;
        max-width: none;
        flex: 0 1 auto;
        justify-content: flex-start;
    }

    .appointment-detail-page .document-detail-actions .status-pill {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}
.activity-timeline {
    position: relative;
    display: grid;
    margin: 0;
    padding: 0;
    list-style: none;
}

.activity-timeline::before {
    content: "";
    position: absolute;
    top: 16px;
    bottom: 16px;
    left: 11px;
    width: 2px;
    background: var(--line);
}

.activity-timeline-item {
    position: relative;
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: 16px;
}

.activity-timeline-item:not(:last-child) {
    padding-bottom: 18px;
}

.activity-timeline-marker {
    position: relative;
    z-index: 1;
    width: 24px;
    height: 24px;
    margin-top: 24px;
    border: 5px solid var(--background);
    background: var(--primary);
    border-radius: 999px;
    box-shadow:
        0 0 0 1px
        rgb(var(--primary-rgb) / 22%);
}

.activity-timeline-card {
    min-width: 0;
    padding: 22px;
    border: 1px solid var(--line);
    background: rgb(255 255 255 / 86%);
    border-radius: 18px;
    box-shadow: var(--shadow-soft);
}

.activity-timeline-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
}

.activity-timeline-heading .eyebrow {
    margin-bottom: 5px;
}

.activity-timeline-heading h2 {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 1.2rem;
}

.activity-timeline-heading time {
    flex: 0 0 auto;
    color: var(--muted);
    white-space: nowrap;
    font-size: 0.88rem;
}

.activity-timeline-meta {
    margin: 12px 0 0;
    color: var(--muted);
    font-size: 0.92rem;
}

.activity-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-top: 26px;
}

.activity-pagination > span {
    color: var(--muted);
    font-size: 0.9rem;
    font-weight: 700;
}

@media (max-width: 640px) {
    .activity-timeline-heading {
        flex-direction: column;
        gap: 8px;
    }

    .activity-timeline-heading time {
        white-space: normal;
    }

    .activity-timeline-card {
        padding: 18px;
    }

    .activity-pagination {
        align-items: stretch;
        flex-direction: column;
        text-align: center;
    }

    .activity-pagination .button {
        width: 100%;
    }
}

/* Document extraction review */

.document-detail-actions {
    flex-wrap: wrap;
}

.document-review-page {
    display: grid;
    gap: 24px;
    margin: 0 auto;
    max-width: 1120px;
}

.document-review-hero,
.document-review-card {
    background: #ffffff;
    border: 1px solid #d6e5ec;
    border-radius: 24px;
}

.document-review-hero {
    padding: clamp(24px, 5vw, 48px);
}

.document-review-hero h1 {
    margin: 8px 0 12px;
}

.document-review-hero p:last-child {
    color: #536979;
    margin-bottom: 0;
    max-width: 720px;
}

.document-review-form,
.document-review-list {
    display: grid;
    gap: 18px;
}

.document-review-card {
    padding: 24px;
}

.document-review-card__header {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 18px;
}

.document-review-card__header h2 {
    font-size: 1.1rem;
    margin: 0;
}

.document-review-confidence {
    background: #e7f4f8;
    border-radius: 999px;
    color: #176282;
    font-size: 0.85rem;
    font-weight: 700;
    padding: 6px 10px;
}

.document-review-comparison {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.document-review-comparison > div {
    border: 1px solid #dbe8ee;
    border-radius: 16px;
    min-width: 0;
    padding: 16px;
}

.document-review-suggestion {
    background: #f0f8fb;
}

.document-review-label {
    color: #607482;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin: 0 0 8px;
    text-transform: uppercase;
}

.document-review-value {
    color: #0e2d53;
    font-weight: 700;
    margin: 0;
    overflow-wrap: anywhere;
}

.document-review-choice {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-weight: 700;
    gap: 10px;
    margin-top: 16px;
}

.document-review-choice input {
    height: 20px;
    width: 20px;
}

.document-review-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

@media (max-width: 700px) {
    .document-review-comparison {
        grid-template-columns: 1fr;
    }

    .document-review-card__header {
        align-items: flex-start;
        flex-direction: column;
    }

    .document-review-actions .button {
        text-align: center;
        width: 100%;
    }
}

.document-action-menu {
    position: relative;
}

.document-action-menu__trigger {
    min-width: 150px;
    list-style: none;
}

.document-action-menu__trigger::-webkit-details-marker {
    display: none;
}

.document-action-menu[open] .document-action-menu__trigger {
    background: var(--primary-dark);
}

.document-action-menu__panel {
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 35;
    width: min(260px, calc(100vw - 32px));
    display: grid;
    gap: 3px;
    padding: 8px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 17px;
    box-shadow: var(--shadow);
}

.document-action-menu__link {
    width: 100%;
    display: flex;
    padding: 12px 13px;
    border: 0;
    color: var(--ink);
    background: transparent;
    border-radius: 11px;
    cursor: pointer;
    font: inherit;
    font-weight: 750;
    text-align: left;
    text-decoration: none;
}

.document-action-menu__link:hover {
    color: var(--primary-dark);
    background: var(--primary-soft);
}

.document-action-menu__link--danger {
    margin-top: 3px;
    border-top: 1px solid var(--line);
    color: var(--danger);
}

.document-decision-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    margin-top: 24px;
    padding: 24px 28px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 22px;
    box-shadow: var(--shadow-soft);
}

.document-decision-card--profile {
    border-color: var(--primary);
    background: var(--primary-soft);
}

.document-decision-card h2,
.document-decision-card p {
    margin-top: 0;
}

.document-decision-card p:last-child {
    margin-bottom: 0;
}

.document-decision-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 10px;
}

.document-intelligence-state {
    margin: 14px 0 0;
    color: var(--primary-dark);
    font-weight: 750;
}

.document-intelligence-state--pending {
    color: var(--accent);
}

@media (max-width: 760px) {
    .document-action-menu__panel {
        position: fixed;
        top: 76px;
        right: 12px;
    }

    .document-decision-card {
        align-items: stretch;
        flex-direction: column;
    }

    .document-decision-actions {
        flex-direction: column;
    }

    .document-decision-actions .button {
        width: 100%;
    }
}

.document-metadata-editor {
    margin: 1.5rem 0;
    padding: clamp(1.35rem, 3vw, 2rem);
    border: 1px solid #cfe0e8;
    border-radius: 1.5rem;
    background: #ffffff;
}

.document-metadata-editor__heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.9fr);
    gap: 1.5rem;
    align-items: end;
    margin-bottom: 1.5rem;
}

.document-metadata-editor__heading h2 {
    margin: 0.35rem 0 0;
}

.document-metadata-editor__heading > p {
    margin: 0;
    color: #526a7a;
    line-height: 1.6;
}

.document-metadata-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}

.document-metadata-field {
    min-width: 0;
}

.document-metadata-field--wide {
    grid-column: 1 / -1;
}

.document-metadata-field label {
    display: block;
    margin-bottom: 0.45rem;
    color: #17365d;
    font-weight: 800;
}

.document-metadata-field input,
.document-metadata-field select {
    box-sizing: border-box;
    width: 100%;
    min-height: 3rem;
    padding: 0.75rem 0.9rem;
    border: 1px solid #c8dce6;
    border-radius: 0.8rem;
    background: #ffffff;
    color: #17365d;
    font: inherit;
}

.document-metadata-field input:focus,
.document-metadata-field select:focus {
    border-color: #2e86aa;
    outline: 3px solid rgba(46, 134, 170, 0.16);
}

.document-metadata-field > p {
    margin: 0.45rem 0 0;
    color: #617786;
    font-size: 0.9rem;
    line-height: 1.45;
}

.document-metadata-field .errorlist {
    margin: 0.45rem 0 0;
    padding-left: 1.1rem;
    color: #a3362b;
}

@media (max-width: 720px) {
    .document-metadata-editor__heading,
    .document-metadata-form-grid {
        grid-template-columns: 1fr;
    }

    .document-metadata-field--wide {
        grid-column: auto;
    }
}

/* Document pagination with numbered pages */
.profile-panel-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 24px;
}

.pagination-edge {
    min-width: 124px;
}

.pagination-edge--next {
    display: flex;
    justify-content: flex-end;
}

.pagination-pages {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}

.pagination-page {
    min-width: 42px;
    justify-content: center;
    padding-inline: 12px;
}

.pagination-ellipsis {
    display: inline-flex;
    min-width: 24px;
    align-items: center;
    justify-content: center;
    color: inherit;
}

@media (max-width: 700px) {
    .pagination {
        grid-template-columns: 1fr 1fr;
    }

    .pagination-pages {
        grid-column: 1 / -1;
        grid-row: 1;
    }

    .pagination-edge--next {
        justify-self: end;
    }

    .profile-panel-footer {
        justify-content: stretch;
    }

    .profile-panel-footer .button {
        width: 100%;
    }
}

/* Automatic document processing and pending family decisions */
.document-processing-card {
    align-items: center;
}

.document-processing-status {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    flex-wrap: wrap;
}

.document-processing-spinner {
    width: 24px;
    height: 24px;
    border: 3px solid rgba(41, 132, 170, 0.22);
    border-top-color: var(--color-primary);
    border-radius: 50%;
    animation: document-processing-spin 0.9s linear infinite;
}

.family-document-alerts {
    margin-bottom: 36px;
}

.family-document-alert-list {
    display: grid;
    gap: 16px;
}

.document-alert-detail-link {
    display: inline-block;
    margin-top: 10px;
    color: var(--color-primary);
    font-weight: 700;
}

@keyframes document-processing-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .document-processing-spinner {
        animation: none;
        border-color: var(--color-primary);
    }
}

@media (max-width: 700px) {
    .document-processing-status {
        justify-content: flex-start;
    }
}

.notification-header-link {
    box-sizing: border-box;
    display: inline-flex;
    width: 120px;
    height: 42px;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 14px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface);
    color: var(--ink);
    font-size: 0.9rem;
    font-weight: 750;
    text-decoration: none;
}

.notification-header-link:hover {
    border-color: var(--accent);
    color: var(--accent-strong);
}

.notification-header-link:focus-visible {
    outline: 3px solid rgba(50, 139, 177, 0.25);
    outline-offset: 2px;
}

.notification-header-count {
    display: inline-flex;
    min-width: 1.65rem;
    min-height: 1.65rem;
    align-items: center;
    justify-content: center;
    padding: 0.15rem 0.45rem;
    border-radius: 999px;
    background: var(--accent);
    color: #fff;
    font-size: 0.78rem;
    line-height: 1;
}

.notification-page {
    display: grid;
    gap: 1.5rem;
}

.notification-page-header,
.notification-empty {
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
}

.notification-page-header h1,
.notification-empty h2 {
    margin: 0.35rem 0 0.65rem;
}

.notification-page-header p:last-child,
.notification-empty p:last-child {
    margin-bottom: 0;
    color: var(--muted);
}

.notification-list {
    display: grid;
    gap: 1rem;
}

.notification-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.35rem 1.5rem;
    border: 1px solid var(--line);
    border-radius: 20px;
    background: var(--surface);
}

.notification-card--new {
    border-color: var(--accent);
    background: var(--accent-soft);
}

.notification-card__content {
    min-width: 0;
}

.notification-card__heading {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.notification-card h2 {
    margin: 0.35rem 0 0.5rem;
    overflow-wrap: anywhere;
}

.notification-card p {
    margin-top: 0;
}

.notification-card small {
    color: var(--muted);
}

.notification-card__state {
    display: inline-flex;
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    background: var(--surface-muted);
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.notification-card__state--new {
    background: var(--accent);
    color: #fff;
}

.notification-card form {
    flex: 0 0 auto;
    margin: 0;
}

.notification-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.notification-pagination a {
    font-weight: 800;
}

@media (max-width: 720px) {
    .header-actions {
        gap: 0.5rem;
    }

    .notification-header-link {
        padding-inline: 0.8rem;
    }

    .notification-card {
        align-items: stretch;
        flex-direction: column;
    }

    .notification-card form,
    .notification-card .button {
        width: 100%;
    }
}

.notification-status {
    margin-top: 1.5rem;
    padding: 1.75rem 2rem;
    border: 1px solid #cfe0e8;
    border-radius: 1.25rem;
    background: #ffffff;
}

.notification-status h2,
.notification-history-heading h2 {
    margin: 0.35rem 0 0.65rem;
}

.notification-status p:last-child,
.notification-history-heading p:last-child,
.notification-history-empty p {
    margin-bottom: 0;
}

.notification-history-heading {
    margin: 2.25rem 0 1.25rem;
}

.notification-history-empty {
    margin-top: 1rem;
    padding: 1.25rem 0;
    color: #536b7c;
}

.document-metadata-confirmation {
    margin-top: 1.5rem;
    padding: 1.4rem;
    border: 1px solid var(--color-border);
    border-radius: 18px;
    background: var(--color-surface-soft);
}

.document-metadata-confirmation h3 {
    margin: 0.35rem 0 0.55rem;
}

.document-metadata-confirmation p {
    max-width: 760px;
}

.document-metadata-confirmation form {
    margin: 1rem 0 0;
}

/* Global private search */

.global-search {
    position: relative;
    flex: 1 1 480px;
    max-width: 610px;
    margin-inline: auto;
}

.global-search-form {
    position: relative;
    margin: 0;
}

.global-search-label {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.global-search-leading-icon {
    position: absolute;
    top: 50%;
    left: 15px;
    z-index: 1;
    display: inline-flex;
    color: var(--muted);
    transform: translateY(-50%);
    pointer-events: none;
}

.global-search-input {
    box-sizing: border-box;
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 52px 0 46px;
    border: 1px solid var(--line);
    border-radius: 15px;
    background: var(--surface);
    color: var(--ink);
    font: inherit;
    font-size: 0.94rem;
    outline: none;
}

.global-search-input::placeholder {
    color: var(--muted);
}

.global-search-input:focus {
    border-color: var(--primary);
    box-shadow:
        0 0 0 4px
        rgb(var(--primary-rgb) / 13%);
}

.global-search-submit {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 11px;
    background: transparent;
    color: var(--ink);
    cursor: pointer;
}

.global-search-submit:hover {
    background: var(--primary-soft);
    color: var(--primary);
}

.global-search-submit:focus-visible {
    outline: 3px solid var(--primary-soft);
    outline-offset: 1px;
}

.global-search-panel {
    position: absolute;
    top: calc(100% + 9px);
    left: 0;
    z-index: 60;
    width: 100%;
    max-height: min(68vh, 600px);
    overflow-y: auto;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 18px;
    background: var(--surface);
    box-shadow: var(--shadow);
}

.global-search-panel[hidden] {
    display: none;
}

.global-search-group + .global-search-group {
    margin-top: 6px;
    padding-top: 6px;
    border-top: 1px solid var(--line);
}

.global-search-group-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 10px 6px;
    color: var(--muted);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.global-search-group-heading span {
    min-width: 1.55rem;
    padding: 0.15rem 0.4rem;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    text-align: center;
    letter-spacing: normal;
}

.global-search-result-list {
    display: grid;
    gap: 2px;
}

.global-search-result {
    box-sizing: border-box;
    width: 100%;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) auto 18px;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--ink);
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    font: inherit;
}

.global-search-result:hover,
.global-search-result:focus-visible {
    background: var(--primary-soft);
    outline: none;
}

.global-search-result-icon,
.search-result-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: var(--primary-soft);
    font-size: 1rem;
}

.global-search-result-copy,
.search-result-copy {
    min-width: 0;
    display: grid;
    gap: 2px;
}

.global-search-result-copy strong,
.global-search-result-copy span,
.search-result-copy strong,
.search-result-copy span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.global-search-result-copy strong {
    font-size: 0.9rem;
}

.global-search-result-copy span {
    color: var(--muted);
    font-size: 0.78rem;
}

.global-search-result-location {
    max-width: 125px;
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.74rem;
}

.global-search-result-arrow {
    color: var(--muted);
}

.global-search-all-results {
    width: 100%;
    margin-top: 7px;
    padding: 11px 12px;
    border: 0;
    border-top: 1px solid var(--line);
    background: transparent;
    color: var(--primary);
    cursor: pointer;
    font: inherit;
    font-size: 0.86rem;
    font-weight: 800;
}

.global-search-all-results:hover,
.global-search-all-results:focus-visible {
    color: var(--primary-bright);
    outline: none;
}

.global-search-message {
    display: grid;
    gap: 5px;
    padding: 18px;
}

.global-search-message-eyebrow {
    color: var(--primary);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.1em;
}

.global-search-message small {
    color: var(--muted);
}

.search-page {
    display: grid;
    gap: 24px;
}

.search-page-header,
.search-page-message,
.search-result-group {
    border: 1px solid var(--line);
    border-radius: 24px;
    background: var(--surface);
}

.search-page-header {
    padding: clamp(24px, 5vw, 48px);
}

.search-page-header h1,
.search-page-message h2,
.search-results-heading h2 {
    margin: 0.35rem 0 0.65rem;
}

.search-page-header > p:not(.eyebrow),
.search-page-message p:last-child {
    color: var(--muted);
}

.search-page-form {
    display: grid;
    gap: 9px;
    margin-top: 28px;
}

.search-page-form label {
    font-weight: 800;
}

.search-page-control {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
}

.search-page-control input {
    min-width: 0;
    height: 50px;
    padding: 0 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    color: var(--ink);
    background: var(--surface);
    font: inherit;
}

.search-page-control input:focus {
    border-color: var(--primary);
    box-shadow:
        0 0 0 4px
        rgb(var(--primary-rgb) / 13%);
    outline: none;
}

.search-page-message {
    padding: clamp(24px, 4vw, 36px);
}

.search-results {
    display: grid;
    gap: 16px;
}

.search-results-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
}

.search-results-count {
    flex: 0 0 auto;
    padding: 7px 11px;
    border-radius: 999px;
    background: var(--primary-soft);
    color: var(--primary);
    font-size: 0.8rem;
    font-weight: 800;
}

.search-result-group {
    overflow: hidden;
}

.search-result-group-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 17px 20px;
    border-bottom: 1px solid var(--line);
}

.search-result-group-heading h3 {
    margin: 0;
}

.search-result-group-heading span {
    color: var(--muted);
    font-size: 0.82rem;
}

.search-result-list {
    display: grid;
}

.search-result-row-form {
    margin: 0;
}

.search-result-row {
    box-sizing: border-box;
    width: 100%;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto 20px;
    align-items: center;
    gap: 14px;
    padding: 15px 20px;
    border: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    color: var(--ink);
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    font: inherit;
}

.search-result-list > :last-child .search-result-row,
.search-result-list > .search-result-row:last-child {
    border-bottom: 0;
}

.search-result-row:hover,
.search-result-row:focus-visible {
    background: var(--primary-soft);
    outline: none;
}

.search-result-copy span {
    color: var(--muted);
    font-size: 0.86rem;
}

.search-result-location {
    max-width: 210px;
    overflow: hidden;
    color: var(--muted);
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.8rem;
}

.search-result-arrow {
    color: var(--primary);
    font-weight: 900;
}

.search-results-note {
    margin: 0;
    color: var(--muted);
    font-size: 0.86rem;
}

@media (max-width: 980px) {
    .header-inner {
        flex-wrap: wrap;
        padding-block: 12px;
    }

    .global-search {
        order: 3;
        flex-basis: 100%;
        max-width: none;
        margin: 0;
    }
}

@media (max-width: 700px) {
    .global-search-result,
    .search-result-row {
        grid-template-columns: 38px minmax(0, 1fr) 18px;
    }

    .global-search-result-location,
    .search-result-location {
        display: none;
    }

    .search-page-control {
        grid-template-columns: 1fr;
    }

    .search-page-control .button {
        width: 100%;
    }

    .search-results-heading {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 460px) {
    .header-actions {
        gap: 8px;
    }

    .notification-header-link,
    .account-menu-trigger {
        width: 96px;
        padding-inline: 9px;
    }

    .global-search-panel {
        width: calc(100vw - 24px);
    }
}

.coverage-page {
    display: grid;
    gap: 28px;
}

.coverage-section {
    display: grid;
    gap: 18px;
}

.coverage-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
}

.coverage-section-heading h2,
.coverage-card h3,
.coverage-empty h3 {
    margin: 0;
}

.coverage-section-heading p:not(.eyebrow) {
    margin: 8px 0 0;
}

.coverage-card-list {
    display: grid;
    gap: 14px;
}

.coverage-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 24px;
    border: 1px solid var(--line);
    border-radius: 22px;
    background: var(--surface);
}

.coverage-card--suggestion {
    border-color: var(--primary);
    background: var(--primary-soft);
}

.coverage-card--ended {
    opacity: 0.78;
}

.coverage-card-copy {
    min-width: 0;
}

.coverage-card-copy h3 {
    margin-top: 6px;
}

.coverage-card-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.coverage-card-actions form,
.coverage-card > form {
    margin: 0;
}

.coverage-source,
.coverage-verification {
    margin: 10px 0 0;
    color: var(--muted);
}

.coverage-verification {
    font-weight: 700;
    color: var(--primary);
}

.coverage-empty {
    padding: 26px;
    border: 1px dashed var(--line);
    border-radius: 22px;
    background: var(--surface);
}

.coverage-empty p:last-child {
    margin-bottom: 0;
}

.coverage-form-panel {
    width: 100%;
}

.coverage-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
    margin-top: 24px;
}

.coverage-form-grid .form-field:first-child {
    grid-column: 1 / -1;
}

.coverage-form-grid input,
.coverage-form-grid select {
    width: 100%;
}

@media (max-width: 760px) {
    .coverage-section-heading,
    .coverage-card {
        align-items: stretch;
        flex-direction: column;
    }

    .coverage-card-actions {
        display: grid;
    }

    .coverage-card-actions .button,
    .coverage-card > form .button {
        width: 100%;
    }

    .coverage-form-grid {
        grid-template-columns: 1fr;
    }

    .coverage-form-grid .form-field:first-child {
        grid-column: auto;
    }
}

/* Coverage form visual refresh */

.profile-data-list > .profile-data-coverage {
    grid-column: 1 / -1;
    display: grid;
    gap: 10px;
    padding: 20px;
    border: 1px solid var(--line);
    background: linear-gradient(
        135deg,
        var(--primary-soft),
        var(--surface)
    );
}

.profile-data-coverage dd {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    margin: 0;
}

.profile-data-coverage-values {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.profile-data-coverage-name,
.profile-data-coverage-more {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    background: var(--surface);
    color: var(--ink);
    font-weight: 800;
    line-height: 1.25;
}

.profile-data-coverage-more {
    color: var(--primary);
}

.profile-data-coverage-pending {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    background: #fff4d8;
    color: #76500c;
    font-weight: 800;
    line-height: 1.25;
}

.profile-data-coverage-empty {
    color: var(--muted);
    font-weight: 700;
}

.profile-data-coverage-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 8px 16px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface);
    color: var(--ink);
    font-weight: 800;
    text-decoration: none;
    transition:
        border-color 160ms ease,
        color 160ms ease,
        transform 160ms ease;
}

.profile-data-coverage-link:hover {
    border-color: var(--primary);
    color: var(--primary);
    transform: translateY(-1px);
}

.coverage-form-panel {
    position: relative;
    overflow: hidden;
    padding: clamp(26px, 4vw, 42px);
    border-color: var(--line);
    background: linear-gradient(
        180deg,
        var(--primary-soft) 0,
        var(--surface) 170px
    );
}

.coverage-form-panel::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 5px;
    background: var(--primary);
    content: "";
}

.coverage-form-heading {
    display: flex;
    align-items: flex-start;
    gap: 18px;
}

.coverage-form-heading h2 {
    margin: 4px 0 0;
}

.coverage-form-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 52px;
    width: 52px;
    height: 52px;
    border-radius: 17px;
    background: var(--primary);
    color: var(--surface);
    font-size: 30px;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 12px 28px
        rgba(32, 111, 150, 0.2);
}

.coverage-form-lead {
    max-width: 720px;
    margin: 10px 0 0;
    color: var(--muted);
    line-height: 1.65;
}

.coverage-create-form {
    display: grid;
    gap: 24px;
    margin-top: 28px;
    padding-top: 28px;
    border-top: 1px solid var(--line);
}

.coverage-form-grid {
    padding: clamp(20px, 3vw, 30px);
    border: 1px solid var(--line);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 14px 38px
        rgba(22, 63, 85, 0.06);
}

.coverage-form-field {
    display: grid;
    align-content: start;
    gap: 9px;
}

.coverage-form-field label {
    color: var(--ink);
    font-size: 0.96rem;
    font-weight: 800;
    line-height: 1.35;
}

.coverage-form-grid input,
.coverage-form-grid select {
    width: 100%;
    min-height: 52px;
    padding: 12px 15px;
    border: 1px solid var(--line);
    border-radius: 14px;
    outline: none;
    background: var(--surface);
    color: var(--ink);
    font: inherit;
    transition:
        border-color 160ms ease,
        box-shadow 160ms ease;
}

.coverage-form-grid input:hover,
.coverage-form-grid select:hover {
    border-color: var(--primary);
}

.coverage-form-grid input:focus,
.coverage-form-grid select:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px
        rgba(47, 135, 173, 0.14);
}

.coverage-form-grid input::placeholder {
    color: var(--muted);
}

.coverage-form-field--provider_name {
    grid-column: 1 / -1;
}

.coverage-form-field .help-text {
    margin: 0;
    color: var(--muted);
    font-size: 0.88rem;
    line-height: 1.5;
}

.coverage-form-field--member_number_last4
.help-text {
    padding: 10px 12px;
    border-radius: 12px;
    background: var(--primary-soft);
    color: var(--ink);
}

.coverage-form-field .field-errors {
    color: #a43f3f;
    font-size: 0.9rem;
    font-weight: 700;
}

.coverage-create-form .form-errors {
    padding: 15px 17px;
    border: 1px solid #e5a4a4;
    border-radius: 14px;
    background: #fff3f3;
    color: #8b3030;
}

.coverage-create-form .form-actions {
    display: flex;
    justify-content: flex-end;
    margin: 0;
}

.coverage-create-form .form-actions .button {
    min-width: 210px;
    min-height: 50px;
    border-radius: 15px;
}

@media (max-width: 760px) {
    .coverage-form-heading {
        align-items: center;
    }

    .coverage-form-grid {
        padding: 18px;
    }

    .coverage-form-field--provider_name {
        grid-column: auto;
    }

    .coverage-create-form .form-actions,
    .coverage-create-form .form-actions .button {
        width: 100%;
    }

    .profile-data-coverage dd {
        align-items: stretch;
        flex-direction: column;
    }

    .profile-data-coverage-link {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .coverage-form-panel {
        padding: 24px 18px;
    }

    .coverage-form-heading {
        align-items: flex-start;
    }

    .coverage-form-icon {
        flex-basis: 44px;
        width: 44px;
        height: 44px;
        border-radius: 14px;
        font-size: 26px;
    }
}

.privacy-center-page {
    display: grid;
    gap: 24px;
}

.privacy-hero {
    margin-bottom: 0;
}

.privacy-status-card,
.privacy-information-card,
.privacy-revoke-card {
    display: flex;
    gap: 22px;
    align-items: flex-start;
    padding: 28px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 24px;
    box-shadow: var(--shadow-soft);
}

.privacy-status-card h2,
.privacy-information-card h2,
.privacy-revoke-card h2,
.privacy-section h2 {
    margin: 4px 0 8px;
}

.privacy-status-card p,
.privacy-information-card p,
.privacy-revoke-card p {
    margin-bottom: 0;
    color: var(--muted);
}

.privacy-status-card--active {
    border-color: var(--primary);
    background: var(--primary-soft);
}

.privacy-status-icon {
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    display: grid;
    place-items: center;
    border-radius: 16px;
    color: white;
    background: var(--primary);
    font-size: 1.08rem;
    font-weight: 850;
}

.privacy-status-icon--safe {
    color: var(--primary-dark);
    background: var(--primary-soft);
    border: 1px solid var(--primary);
}

.privacy-section {
    display: grid;
    gap: 18px;
}

.privacy-section-heading {
    display: flex;
    gap: 16px;
    align-items: end;
    justify-content: space-between;
}

.privacy-section-heading h2 {
    margin-bottom: 0;
}

.privacy-count,
.privacy-state {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 6px 12px;
    border-radius: 999px;
    color: var(--muted);
    background: var(--surface);
    font-size: 0.8rem;
    font-weight: 800;
}

.privacy-state--active {
    color: var(--primary-dark);
    background: var(--primary-soft);
}

.privacy-consent-list,
.privacy-history-list {
    display: grid;
    gap: 14px;
}

.privacy-consent-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 24px;
    align-items: center;
    padding: 24px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 22px;
}

.privacy-consent-heading {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    justify-content: space-between;
}

.privacy-consent-heading h3 {
    margin: 3px 0 0;
    font-size: 1.25rem;
}

.privacy-consent-details {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 34px;
    margin: 20px 0 0;
}

.privacy-consent-details div {
    display: grid;
    gap: 3px;
}

.privacy-consent-details dt {
    color: var(--muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.privacy-consent-details dd {
    margin: 0;
    font-weight: 750;
}

.privacy-scope-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.privacy-scope-list span {
    padding: 7px 10px;
    border: 1px solid var(--line);
    background: var(--page);
    border-radius: 999px;
    font-size: 0.82rem;
    font-weight: 700;
}

.privacy-consent-actions {
    max-width: 230px;
    text-align: right;
}

.privacy-empty-card {
    padding: 28px;
    border: 1px dashed var(--line-strong);
    background: color-mix(
        in srgb,
        var(--surface) 78%,
        transparent
    );
    border-radius: 22px;
}

.privacy-empty-card p {
    max-width: 720px;
    margin: 7px 0 0;
    color: var(--muted);
}

.privacy-empty-card--compact {
    padding-block: 22px;
}

.privacy-history-item {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px;
    border: 1px solid var(--line);
    background: var(--surface);
    border-radius: 18px;
}

.privacy-history-item > div:first-child {
    display: grid;
    gap: 4px;
}

.privacy-history-item span {
    color: var(--muted);
}

.privacy-history-state {
    display: grid;
    gap: 4px;
    justify-items: end;
}

.privacy-history-state small {
    color: var(--muted);
}

.privacy-information-card {
    display: block;
}

.privacy-information-card ul {
    display: grid;
    gap: 10px;
    margin: 18px 0 0;
    padding-left: 22px;
}

.privacy-revoke-card {
    display: block;
    max-width: 880px;
}

.privacy-revoke-warning {
    margin: 24px 0;
    padding: 18px;
    border: 1px solid var(--warning-line, var(--line));
    background: var(--warning-soft, var(--primary-soft));
    border-radius: 17px;
}

.privacy-revoke-warning p {
    margin-top: 6px;
}

.privacy-entry-card {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: space-between;
}

.privacy-entry-card h2 {
    margin: 4px 0 8px;
}

@media (max-width: 760px) {
    .privacy-status-card,
    .privacy-information-card,
    .privacy-revoke-card {
        padding: 21px;
        border-radius: 20px;
    }

    .privacy-consent-card {
        grid-template-columns: 1fr;
        padding: 20px;
    }

    .privacy-consent-actions {
        max-width: none;
        text-align: left;
    }

    .privacy-consent-actions .button {
        width: 100%;
    }

    .privacy-section-heading,
    .privacy-history-item,
    .privacy-entry-card {
        align-items: stretch;
        flex-direction: column;
    }

    .privacy-history-state {
        justify-items: start;
    }

    .privacy-entry-card .button {
        width: 100%;
    }
}

/* Private family data export */

.privacy-export-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 22px;
    align-items: center;
    padding: 30px;
    border: 1px solid #cfe1e9;
    border-radius: 24px;
    background: linear-gradient(
        135deg,
        #e9f8fc,
        #ffffff
    );
    box-shadow: 0 18px 45px rgba(22, 60, 85, 0.08);
}

.privacy-export-icon,
.data-export-summary-icon {
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border-radius: 16px;
    background: #328aad;
    color: #ffffff;
    font-size: 1.7rem;
    font-weight: 800;
    box-shadow: 0 12px 28px rgba(31, 126, 164, 0.2);
}

.privacy-export-copy h2,
.data-export-summary h2,
.data-export-warning h2 {
    margin: 4px 0 10px;
}

.privacy-export-copy > p:not(.eyebrow),
.data-export-warning > p {
    margin: 0;
    color: #526d7e;
    line-height: 1.65;
}

.privacy-export-history {
    margin-top: 12px !important;
    font-size: 0.92rem;
}

.privacy-export-actions {
    display: flex;
    justify-content: flex-end;
}

.data-export-page {
    display: grid;
    gap: 24px;
}

.data-export-hero {
    margin-bottom: 0;
}

.data-export-summary,
.data-export-warning {
    padding: 30px;
    border: 1px solid #cfe1e9;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 18px 45px rgba(22, 60, 85, 0.08);
}

.data-export-summary {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 22px;
    align-items: start;
}

.data-export-list {
    display: grid;
    gap: 12px;
    margin: 20px 0 0;
    padding-left: 22px;
    line-height: 1.55;
}

.data-export-warning {
    border-top: 5px solid #328aad;
}

.data-export-warning > p + p {
    margin-top: 10px;
}

.data-export-form {
    display: grid;
    gap: 22px;
    margin-top: 26px;
    padding-top: 24px;
    border-top: 1px solid #cfe1e9;
}

.data-export-confirmation {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 18px;
    border: 1px solid #cfe1e9;
    border-radius: 16px;
    background: #f1f9fc;
    cursor: pointer;
    font-weight: 700;
    line-height: 1.45;
}

.data-export-confirmation input {
    width: 20px;
    height: 20px;
    margin: 1px 0 0;
    accent-color: #328aad;
}

.data-export-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    flex-wrap: wrap;
}

@media (max-width: 760px) {
    .privacy-export-card {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 24px;
    }

    .privacy-export-actions {
        grid-column: 1 / -1;
        justify-content: stretch;
    }

    .privacy-export-actions .button,
    .data-export-form-actions .button {
        width: 100%;
    }

    .data-export-summary {
        grid-template-columns: 1fr;
        padding: 24px;
    }

    .data-export-warning {
        padding: 24px;
    }

    .data-export-form-actions {
        flex-direction: column-reverse;
    }
}

/* Account erasure request */

.privacy-erasure-card,
.erasure-hero,
.erasure-summary-card,
.erasure-status-card,
.erasure-wait-card,
.erasure-form-card,
.erasure-information-card,
.erasure-blocked-card {
    border: 1px solid var(--color-border);
    border-radius: 24px;
    background: var(--color-surface);
}

.privacy-erasure-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
    margin-top: 24px;
    padding: 30px 34px;
}

.privacy-erasure-copy {
    max-width: 720px;
}

.privacy-erasure-copy h2,
.erasure-page h1,
.erasure-page h2 {
    color: var(--color-ink);
}

.privacy-erasure-copy h2 {
    margin: 6px 0 10px;
}

.privacy-erasure-copy p:last-child {
    margin-bottom: 0;
    color: var(--color-muted);
}

.privacy-erasure-actions {
    flex: 0 0 auto;
}

.erasure-page {
    width: min(1120px, calc(100% - 40px));
    margin: 0 auto;
    padding: 0 0 48px;
}

.erasure-page > .back-link {
    margin-bottom: 0;
}

.erasure-page > * + * {
    margin-top: 24px;
}

.erasure-page > .back-link + .erasure-hero {
    margin-top: 12px;
}

.erasure-hero {
    padding: 28px 32px 24px;
}

.erasure-hero + .erasure-summary-card,
.erasure-hero + .erasure-status-card {
    margin-top: 12px;
}

.erasure-hero h1 {
    margin: 8px 0 12px;
    font-size: clamp(2.2rem, 5vw, 4rem);
    line-height: 1;
}

.erasure-hero > p:last-child {
    max-width: 760px;
    margin-bottom: 0;
    color: var(--color-muted);
    font-size: 1.05rem;
}

.erasure-summary-card,
.erasure-wait-card,
.erasure-information-card,
.erasure-blocked-card {
    padding: 32px 36px;
}

.erasure-summary-card h2,
.erasure-wait-card h2,
.erasure-information-card h2,
.erasure-blocked-card h2 {
    margin: 7px 0 12px;
}

.erasure-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 24px 0;
}

.erasure-summary-grid > div {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 112px;
    padding: 20px;
    border-radius: 18px;
    background: var(--color-surface-soft);
}

.erasure-summary-grid span {
    color: var(--color-muted);
    font-size: 0.9rem;
}

.erasure-summary-grid strong {
    color: var(--color-ink);
    font-size: 1.65rem;
}

.erasure-wait-card {
    border-color: #bddce8;
    background: #eff9fc;
}

.erasure-blocked-card {
    border-color: #ead29e;
    background: #fff8e8;
}

.erasure-form-card {
    overflow: hidden;
}

.erasure-warning {
    padding: 30px 36px;
    border-bottom: 1px solid var(--color-border);
    background: var(--color-surface-soft);
}

.erasure-warning h2 {
    margin: 7px 0 10px;
}

.erasure-form {
    display: grid;
    gap: 24px;
    padding: 34px 36px;
}

.erasure-form .form-field {
    display: grid;
    gap: 9px;
}

.erasure-form input[type="password"],
.erasure-form input[type="text"] {
    width: 100%;
    min-height: 52px;
    padding: 12px 15px;
    border: 1px solid var(--color-border-strong);
    border-radius: 14px;
    background: #fff;
    color: var(--color-ink);
    font: inherit;
}

.erasure-form input:focus {
    border-color: var(--color-primary);
    outline: 3px solid rgba(49, 137, 174, 0.16);
}

.erasure-form .errorlist {
    margin: 0;
    padding: 0;
    list-style: none;
    color: #a13939;
    font-weight: 700;
}

.erasure-acknowledgement {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 18px;
    border: 1px solid var(--color-border);
    border-radius: 16px;
    background: var(--color-surface-soft);
    cursor: pointer;
}

.erasure-acknowledgement input {
    width: 20px;
    height: 20px;
    margin-top: 2px;
}

.erasure-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 8px;
}

.erasure-request-button {
    border-color: #b24b4b;
    background: #b24b4b;
    color: #fff;
}

.erasure-request-button:hover {
    border-color: #963d3d;
    background: #963d3d;
}

.erasure-status-card {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 24px;
    padding: 34px 36px;
    border-color: #abd8c9;
    background: #f0fbf7;
}

.erasure-status-icon {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    border-radius: 16px;
    background: #d7f2e8;
    color: #176d57;
    font-size: 1.5rem;
    font-weight: 800;
}

.erasure-status-copy h2 {
    margin: 7px 0 12px;
}

.erasure-status-copy p {
    margin: 6px 0;
}

.erasure-safe-note {
    color: #176d57;
    font-weight: 700;
}

.erasure-cancel-form {
    margin: 0;
}

.erasure-information-card {
    color: var(--color-muted);
}

.erasure-information-card h2 {
    color: var(--color-ink);
}

@media (max-width: 760px) {
    .privacy-erasure-card,
    .erasure-status-card {
        align-items: stretch;
        grid-template-columns: 1fr;
        flex-direction: column;
    }

    .privacy-erasure-actions,
    .privacy-erasure-actions .button,
    .erasure-cancel-form,
    .erasure-cancel-form .button {
        width: 100%;
    }

    .erasure-summary-grid {
        grid-template-columns: 1fr;
    }

    .erasure-page {
        width: min(100% - 24px, 1120px);
        padding-top: 28px;
    }

    .erasure-hero,
    .erasure-summary-card,
    .erasure-wait-card,
    .erasure-information-card,
    .erasure-blocked-card,
    .erasure-warning,
    .erasure-form,
    .erasure-status-card {
        padding: 24px;
    }

    .erasure-form-actions {
        flex-direction: column-reverse;
    }

    .erasure-form-actions .button {
        width: 100%;
    }
}

.erasure-account-field input[readonly] {
    background: rgba(255, 255, 255, 0.72);
    color: var(--color-ink);
    cursor: default;
    font-weight: 700;
}

/* Family guidance chat panel */

.guidance-workspace {
    width: 100%;
    margin-top: 38px;
    padding: clamp(26px, 4vw, 44px);
    border: 1px solid #b9dce9;
    background:
        linear-gradient(
            145deg,
            #e8f7fb,
            #ffffff 72%
        );
    border-radius: 28px;
    box-shadow: var(--shadow-soft);
}

.guidance-workspace-header {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: start;
    gap: 22px;
    max-width: 940px;
}

.guidance-workspace-icon {
    display: grid;
    width: 62px;
    height: 62px;
    place-items: center;
    color: white;
    background:
        linear-gradient(
            145deg,
            var(--primary),
            var(--accent)
        );
    border-radius: 20px;
    box-shadow: 0 12px 28px rgb(37 123 157 / 22%);
    font-size: 1.6rem;
}

.guidance-workspace-copy h2 {
    margin: 4px 0 8px;
    font-size: clamp(1.65rem, 3vw, 2.15rem);
}

.guidance-workspace-copy > p:last-child {
    max-width: 760px;
    margin: 0;
    color: var(--muted);
    font-size: 1rem;
    line-height: 1.6;
}

.guidance-message-list {
    display: grid;
    gap: 18px;
    margin-top: 32px;
    padding-top: 30px;
    border-top: 1px solid rgb(52 105 126 / 16%);
}

.guidance-message {
    width: fit-content;
    max-width: min(82%, 820px);
    padding: 17px 20px;
    border: 1px solid var(--line);
    background: #f5fafc;
    border-radius: 20px 20px 20px 7px;
}

.guidance-message--user {
    margin-left: auto;
    border-color: #b9dce9;
    background: #dff2f8;
    border-radius: 20px 20px 7px 20px;
}

.guidance-message--clarification {
    border-color: #ead8aa;
    background: #fff8e7;
}

.guidance-message-author {
    margin: 0 0 7px;
    color: var(--primary-dark);
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.guidance-message-body {
    line-height: 1.6;
}

.guidance-citations {
    margin-top: 15px;
    padding-top: 13px;
    border-top: 1px solid rgb(52 105 126 / 16%);
}

.guidance-citations > p {
    margin: 0 0 8px;
    color: var(--muted);
    font-size: 0.78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.guidance-citations ul {
    display: grid;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.guidance-citations li {
    display: grid;
    gap: 3px;
}

.guidance-citations a {
    color: var(--primary-dark);
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.guidance-citations span {
    color: var(--muted);
    font-size: 0.84rem;
}

.guidance-question-form {
    margin-top: 32px;
    padding-top: 30px;
    border-top: 1px solid rgb(52 105 126 / 16%);
}

.guidance-question-form > label {
    display: block;
    margin-bottom: 12px;
    color: var(--ink);
    font-size: 1.12rem;
    font-weight: 850;
}

.guidance-question-form textarea {
    width: 100%;
    min-height: 170px;
    padding: 18px 20px;
    resize: vertical;
    border: 1px solid #b8d5e0;
    background: white;
    border-radius: 18px;
    color: var(--ink);
    font: inherit;
    font-size: 1rem;
    line-height: 1.55;
    box-shadow: inset 0 1px 2px rgb(27 72 91 / 5%);
}

.guidance-question-form textarea:focus {
    border-color: var(--primary);
    box-shadow:
        0 0 0 4px rgb(48 142 179 / 14%),
        inset 0 1px 2px rgb(27 72 91 / 5%);
    outline: none;
}

.guidance-question-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-top: 16px;
}

.guidance-question-actions p,
.guidance-disabled-note {
    margin: 0;
    color: var(--muted);
    font-size: 0.86rem;
    line-height: 1.5;
}

.guidance-question-actions p {
    max-width: 560px;
}

.guidance-question-actions .button {
    min-width: 148px;
}

.guidance-disabled-note {
    margin-top: 12px;
    color: #765c1f;
}

@media (max-width: 720px) {
    .guidance-workspace {
        margin-top: 28px;
        padding: 22px 18px;
        border-radius: 23px;
    }

    .guidance-workspace-header {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 15px;
    }

    .guidance-workspace-icon {
        width: 48px;
        height: 48px;
        border-radius: 16px;
        font-size: 1.3rem;
    }

    .guidance-workspace-copy h2 {
        font-size: 1.55rem;
    }

    .guidance-message {
        width: auto;
        max-width: 100%;
    }

    .guidance-question-form textarea {
        min-height: 150px;
    }

    .guidance-question-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .guidance-question-actions p {
        max-width: none;
    }

    .guidance-question-actions .button {
        width: 100%;
    }
}

/* Chat documental compartido dentro de cada perfil. */
.profile-detail-grid > .guidance-workspace {
    grid-column: 1 / -1;
    margin-top: 0;
}

.guidance-message-retry {
    display: flex;
    justify-content: flex-end;
    margin-top: 0.75rem;
}

.guidance-retry-button {
    min-height: 2.5rem;
    padding: 0.55rem 1rem;
    border-color: rgba(28, 112, 151, 0.28);
    background: rgba(255, 255, 255, 0.72);
    color: var(--ink);
    box-shadow: none;
}


.guidance-response-feedback {
    align-items: center;
    border-top: 1px solid rgba(35, 104, 139, 0.16);
    display: flex;
    gap: 0.45rem;
    margin-top: 0.9rem;
    padding-top: 0.75rem;
}

.guidance-response-feedback p {
    color: var(--color-text-muted);
    font-size: 0.82rem;
    font-weight: 700;
    margin: 0 0.25rem 0 0;
}

.guidance-feedback-option {
    background: transparent;
    border: 1px solid rgba(35, 104, 139, 0.24);
    border-radius: 999px;
    color: var(--color-brand-strong);
    cursor: pointer;
    font: inherit;
    font-size: 0.8rem;
    font-weight: 700;
    min-width: 2.7rem;
    padding: 0.35rem 0.7rem;
}

.guidance-feedback-option:hover,
.guidance-feedback-option:focus-visible,
.guidance-feedback-option--selected {
    background: rgba(52, 137, 177, 0.12);
    border-color: rgba(35, 104, 139, 0.45);
}

/* Fixed-height guidance conversation workspace. */

.guidance-workspace {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    height: clamp(
        620px,
        calc(100dvh - 136px),
        900px
    );
    min-height: 0;
    overflow: hidden;
}

.guidance-workspace-header {
    max-width: none;
    min-height: 0;
    padding-bottom: 24px;
    border-bottom:
        1px solid rgb(52 105 126 / 16%);
}

.guidance-conversation-scroll {
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-gutter: stable;
    scroll-behavior: smooth;
}

.guidance-message-list {
    align-content: start;
    margin-top: 0;
    padding: 24px 8px 24px 0;
    border-top: 0;
}

.guidance-question-form {
    margin-top: 0;
    padding-top: 22px;
}

.guidance-question-form textarea {
    min-height: 118px;
    max-height: 150px;
    resize: none;
}

@media (max-width: 720px) {
    .guidance-workspace {
        height: calc(100dvh - 96px);
        min-height: 540px;
        max-height: none;
    }

    .guidance-workspace-header {
        padding-bottom: 18px;
    }

    .guidance-message-list {
        padding:
            18px
            4px
            18px
            0;
    }

    .guidance-question-form {
        padding-top: 18px;
    }

    .guidance-question-form textarea {
        min-height: 96px;
        max-height: 124px;
    }
}

/* Compact guidance workspace and subtle upload action. */
.guidance-workspace {
    padding:
        20px
        34px
        18px;
}

.guidance-workspace-header {
    align-items: center;
    gap: 12px;
    padding-bottom: 12px;
}

.guidance-workspace-icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    font-size: 1.15rem;
    box-shadow:
        0 8px 20px
        rgb(37 123 157 / 16%);
}

.guidance-workspace-copy {
    display: grid;
    gap: 3px;
}

.guidance-workspace-copy .eyebrow {
    margin: 0;
    font-size: 0.7rem;
    line-height: 1.1;
}

.guidance-workspace-copy h2 {
    margin: 0;
    font-size:
        clamp(
            1.35rem,
            2vw,
            1.55rem
        );
    font-weight: 800;
    line-height: 1.08;
}

.guidance-message-list {
    padding:
        16px
        8px
        16px
        0;
}

.guidance-question-form {
    padding-top: 14px;
}

.guidance-question-form > label {
    margin-bottom: 8px;
    font-size: 1rem;
}

.guidance-question-form textarea {
    min-height: 96px;
    max-height: 110px;
    padding: 14px 16px;
    border-radius: 15px;
}

.guidance-question-actions {
    margin-top: 10px;
}

.upload-dock {
    opacity: 0.56;
    transition:
        opacity 160ms ease,
        filter 160ms ease;
    filter: saturate(0.78);
}

.upload-dock:hover,
.upload-dock:focus-within {
    opacity: 0.94;
    filter: saturate(1);
}

.upload-button {
    box-shadow:
        0 10px 28px
        rgb(37 65 76 / 14%);
}

@media (max-width: 720px) {
    .guidance-workspace {
        padding:
            16px
            14px
            14px;
    }

    .guidance-workspace-header {
        grid-template-columns:
            38px
            minmax(0, 1fr);
        gap: 10px;
        padding-bottom: 10px;
    }

    .guidance-workspace-icon {
        width: 38px;
        height: 38px;
        border-radius: 12px;
        font-size: 1rem;
    }

    .guidance-workspace-copy h2 {
        font-size: 1.22rem;
    }

    .guidance-message-list {
        padding:
            12px
            4px
            12px
            0;
    }

    .guidance-question-form {
        padding-top: 12px;
    }

    .guidance-question-form textarea {
        min-height: 82px;
        max-height: 96px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .upload-dock {
        transition: none;
    }
}

/* Compact visible guidance citations. */
.guidance-citations {
    margin-top: 12px;
    padding-top: 10px;
}

.guidance-citations > p {
    margin: 0 0 6px;
    font-size: 0.68rem;
    line-height: 1.2;
    letter-spacing: 0.045em;
}

.guidance-citations ul {
    display: flex;
    flex-wrap: wrap;
    gap:
        7px
        16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.guidance-citations li {
    display: grid;
    min-width: 0;
    max-width: min(230px, 100%);
    gap: 1px;
    margin: 0;
}

.guidance-citations a {
    overflow-wrap: anywhere;
    font-size: 0.82rem;
    line-height: 1.25;
    text-underline-offset: 2px;
}

.guidance-citations span {
    font-size: 0.65rem;
    line-height: 1.2;
}

@media (max-width: 720px) {
    .guidance-citations {
        margin-top: 10px;
        padding-top: 8px;
    }

    .guidance-citations ul {
        gap:
            6px
            12px;
    }

    .guidance-citations li {
        max-width: min(200px, 100%);
    }
}

/* Recent guidance conversations. */
.guidance-chat-body {
    display: grid;
    grid-template-columns:
        minmax(156px, 190px)
        minmax(0, 1fr);
    min-height: 0;
    overflow: hidden;
    border-bottom:
        1px solid
        rgb(42 120 151 / 18%);
}

.guidance-conversation-menu {
    min-width: 0;
    min-height: 0;
    padding:
        12px
        12px
        12px
        0;
    overflow-x: hidden;
    overflow-y: auto;
    border-right:
        1px solid
        rgb(42 120 151 / 16%);
}

.guidance-conversation-menu::-webkit-scrollbar {
    width: 0;
    height: 0;
}

.guidance-new-conversation {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 38px;
    padding: 8px 10px;
    border:
        1px solid
        rgb(42 120 151 / 22%);
    border-radius: 11px;
    color: inherit;
    font-size: 0.78rem;
    font-weight: 750;
    line-height: 1.2;
    text-decoration: none;
    background:
        rgb(255 255 255 / 46%);
}

.guidance-new-conversation:hover,
.guidance-new-conversation:focus-visible,
.guidance-new-conversation--active {
    border-color:
        rgb(42 120 151 / 38%);
    background:
        rgb(218 241 249 / 70%);
}

.guidance-new-conversation > span:first-child {
    font-size: 1rem;
    line-height: 1;
}

.guidance-conversation-menu-title {
    margin:
        14px
        8px
        6px;
    color:
        rgb(25 77 99 / 68%);
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    line-height: 1.2;
    text-transform: uppercase;
}

.guidance-conversation-menu ol {
    display: grid;
    gap: 3px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.guidance-conversation-link {
    display: block;
    padding: 8px 9px;
    overflow: hidden;
    border-radius: 9px;
    color:
        rgb(15 55 88);
    font-size: 0.75rem;
    font-weight: 650;
    line-height: 1.3;
    text-decoration: none;
    white-space: normal;
    overflow-wrap: anywhere;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.guidance-conversation-link:hover,
.guidance-conversation-link:focus-visible,
.guidance-conversation-link--active {
    background:
        rgb(218 241 249 / 72%);
}

.guidance-conversation-link--active {
    box-shadow:
        inset 3px 0 0
        rgb(48 139 177 / 70%);
}

.guidance-chat-body
> .guidance-conversation-scroll {
    min-width: 0;
    min-height: 0;
    padding-left: 16px;
    border-bottom: 0;
}

@media (max-width: 720px) {
    .guidance-chat-body {
        grid-template-columns:
            minmax(0, 1fr);
        grid-template-rows:
            auto
            minmax(0, 1fr);
    }

    .guidance-conversation-menu {
        display: flex;
        align-items: center;
        gap: 7px;
        padding:
            7px
            0
            8px;
        overflow-x: auto;
        overflow-y: hidden;
        border-right: 0;
        border-bottom:
            1px solid
            rgb(42 120 151 / 16%);
        scrollbar-width: none;
    }

    .guidance-new-conversation {
        flex: 0 0 auto;
        min-height: 34px;
        padding: 7px 9px;
        font-size: 0.72rem;
    }

    .guidance-conversation-menu-title {
        display: none;
    }

    .guidance-conversation-menu ol {
        display: flex;
        flex: 0 0 auto;
        gap: 5px;
    }

    .guidance-conversation-menu li {
        flex: 0 0 auto;
    }

    .guidance-conversation-link {
        width: min(152px, 42vw);
        padding: 7px 9px;
        font-size: 0.7rem;
    }

    .guidance-conversation-link--active {
        box-shadow:
            inset 0 -3px 0
            rgb(48 139 177 / 70%);
    }

    .guidance-chat-body
    > .guidance-conversation-scroll {
        padding-left: 0;
    }
}

/* Coverage suggestion review. */

.coverage-review-page {
    max-width: 980px;
}

.coverage-review-header {
    margin-bottom: 1rem;
}

.coverage-review-state {
    display: grid;
    gap: 0.25rem;
    margin-bottom: 1rem;
    padding: 0.9rem 1rem;
    border: 1px solid #c7dfea;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.76);
}

.coverage-review-state--warning {
    border-color: #dca85b;
    background: #fff8e9;
}

.coverage-review-state--matching {
    border-color: #83b89b;
    background: #effaf3;
}

.coverage-review-state--new {
    border-color: #91bfd5;
    background: #f1f9fc;
}

.coverage-review-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.coverage-review-panel,
.coverage-review-conflicts,
.coverage-review-source {
    padding: 1.1rem;
    border: 1px solid #c7dfea;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.76);
}

.coverage-review-panel--proposal {
    border-color: #8fc1d8;
    background: #f1f9fc;
}

.coverage-review-current-list {
    display: grid;
    gap: 0.65rem;
    margin-top: 0.8rem;
}

.coverage-review-current {
    display: grid;
    gap: 0.2rem;
    padding: 0.75rem;
    border-radius: 12px;
    background: rgba(229, 242, 248, 0.72);
}

.coverage-review-current--matching {
    background: #eaf7ef;
}

.coverage-review-empty {
    margin-top: 0.8rem;
    color: #587184;
}

.coverage-review-details {
    display: grid;
    gap: 0.7rem;
    margin: 0.8rem 0 0;
}

.coverage-review-details div {
    display: grid;
    gap: 0.15rem;
}

.coverage-review-details dt {
    color: #587184;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.coverage-review-details dd {
    margin: 0;
    font-weight: 700;
}

.coverage-review-conflicts,
.coverage-review-source {
    margin-top: 1rem;
}

.coverage-review-conflicts ul {
    margin: 0.75rem 0 0;
    padding-left: 1.25rem;
}

.coverage-review-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: flex-end;
    margin-top: 1rem;
}

@media (max-width: 720px) {
    .coverage-review-grid {
        grid-template-columns: 1fr;
    }

    .coverage-review-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .coverage-review-actions form,
    .coverage-review-actions .button {
        width: 100%;
    }
}

/* Human review of structured document results. */
.document-result-review-section {
    margin-top: 1.5rem;
    padding: clamp(1rem, 2vw, 1.5rem);
    border: 1px solid var(--color-border);
    border-radius: 1.25rem;
    background: rgba(255, 255, 255, 0.72);
}

.document-result-review-section__heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1rem;
}

.document-result-review-section__heading h2 {
    margin: 0.2rem 0 0;
}

.document-result-review-section__heading > p {
    max-width: 38rem;
    margin: 0;
    color: var(--color-text-muted);
}

.document-result-review-list {
    display: grid;
    gap: 1rem;
}

.document-result-review-card {
    padding: 1rem;
    border: 1px solid var(--color-border);
    border-radius: 1rem;
    background: var(--color-surface);
}

.document-result-review-card__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.document-result-review-card__header h3 {
    margin: 0.15rem 0 0;
}

.document-result-state {
    display: inline-flex;
    align-items: center;
    min-height: 1.8rem;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 800;
}

.document-result-state--pending {
    color: #6d4c00;
    background: #fff2c7;
}

.document-result-state--confirmed {
    color: #145c3d;
    background: #dff4e9;
}

.document-result-state--rejected {
    color: #7a2731;
    background: #f8e2e5;
}

.document-result-detected {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.75rem;
    margin-top: 1rem;
    padding: 0.85rem;
    border-radius: 0.85rem;
    background: var(--color-surface-soft);
}

.document-result-detected div,
.document-result-confirmed dl div {
    min-width: 0;
}

.document-result-detected span,
.document-result-confirmed dt {
    display: block;
    margin-bottom: 0.2rem;
    color: var(--color-text-muted);
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.document-result-detected strong,
.document-result-confirmed dd {
    overflow-wrap: anywhere;
}

.document-result-review-form {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid var(--color-border);
}

.document-result-review-form__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}

.document-result-review-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 1rem;
}

.document-result-confirmed,
.document-result-rejected {
    margin-top: 1rem;
    padding: 0.9rem;
    border-radius: 0.85rem;
}

.document-result-confirmed {
    background: #f0faf5;
}

.document-result-confirmed dl {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.75rem;
    margin: 0.65rem 0 0;
}

.document-result-confirmed dd {
    margin: 0;
    font-weight: 700;
}

.document-result-rejected {
    color: #6b333b;
    background: #fff3f4;
}

.document-result-rejected p {
    margin: 0;
}

.document-result-state--high {
    color: #145c3d;
    background: #dff4e9;
}

.document-result-review-required,
.document-result-automatic {
    margin-top: 1rem;
    padding: 0.9rem;
    border-radius: 0.85rem;
}

.document-result-review-required {
    color: #654700;
    background: #fff7dc;
}

.document-result-automatic {
    color: #145c3d;
    background: #f0faf5;
}

.document-result-review-required p,
.document-result-automatic p {
    margin: 0.35rem 0 0;
}

.document-result-optional-review {
    margin-top: 0.85rem;
    color: var(--color-text);
}

.document-result-optional-review summary {
    cursor: pointer;
    font-weight: 700;
}

.document-result-optional-review[open] summary {
    margin-bottom: 0.75rem;
}

@media (max-width: 780px) {
    .document-result-review-section__heading {
        display: block;
    }

    .document-result-review-section__heading > p {
        margin-top: 0.65rem;
    }

    .document-result-detected,
    .document-result-confirmed dl,
    .document-result-review-form__grid {
        grid-template-columns: 1fr;
    }

    .document-result-review-actions .button {
        width: 100%;
    }
}

/* Visible global search traceability. */
.search-result-traceability {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.3rem 0.55rem;
    margin-top: 0.3rem;
    color: var(--color-text-muted);
    font-size: 0.72rem;
    line-height: 1.35;
}

.search-result-record-type,
.search-result-status {
    display: inline-flex;
    align-items: center;
    min-height: 1.35rem;
    padding: 0.08rem 0.45rem;
    border: 1px solid var(--color-border);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.55);
    font-weight: 700;
}

.search-result-provenance {
    min-width: 0;
    overflow-wrap: anywhere;
}

/* Global search autocomplete traceability. */
.global-search-result-traceability {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.2rem 0.4rem;
    margin-top: 0.15rem;
    white-space: normal;
}

.global-search-result-copy
.global-search-result-traceability span {
    display: inline-flex;
    overflow: visible;
    white-space: normal;
    font-size: 0.66rem;
    line-height: 1.25;
}

.global-search-result-record-type,
.global-search-result-status {
    padding: 0.04rem 0.32rem;
    border: 1px solid var(--line);
    border-radius: 999px;
}

.global-search-result-provenance {
    flex-basis: 100%;
    min-width: 0;
    color: var(--muted);
}

/* SEARCH-04: paginación privada por grupo. */
.search-result-pagination {
    align-items: center;
    border-top: 1px solid var(--border-color, #d7dee8);
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
    margin-top: 0.75rem;
    padding-top: 0.75rem;
}

.search-result-pagination-form {
    margin: 0;
}

.search-result-pagination-button {
    align-items: center;
    appearance: none;
    background: var(--surface-color, #fff);
    border: 1px solid var(--border-color, #c9d2df);
    border-radius: 0.65rem;
    color: var(--text-color, #1f2937);
    cursor: pointer;
    display: inline-flex;
    font: inherit;
    font-weight: 600;
    justify-content: center;
    min-height: 2.5rem;
    padding: 0.55rem 0.85rem;
}

.search-result-pagination-button:hover,
.search-result-pagination-button:focus-visible {
    border-color: var(--primary-color, #2563eb);
    color: var(--primary-color, #1d4ed8);
}

.search-result-pagination-button:focus-visible {
    outline: 3px solid rgb(37 99 235 / 20%);
    outline-offset: 2px;
}

.search-result-pagination-page {
    color: var(--muted-color, #667085);
    font-size: 0.9rem;
    font-weight: 600;
    white-space: nowrap;
}

@media (max-width: 640px) {
    .search-result-pagination {
        flex-wrap: wrap;
        justify-content: stretch;
    }

    .search-result-pagination-form {
        flex: 1 1 0;
    }

    .search-result-pagination-button {
        width: 100%;
    }

    .search-result-pagination-page {
        flex: 1 0 100%;
        order: -1;
        text-align: center;
    }
}

/* Visible status of automated guidance responses. */
.guidance-response-status {
    display: grid;
    gap: 3px;
    margin: 0 0 12px;
    padding: 10px 12px;
    border: 1px solid rgb(52 105 126 / 18%);
    border-left: 4px solid var(--primary);
    border-radius: 10px;
    background: rgb(225 243 249 / 62%);
}

.guidance-response-status--clarification {
    border-color: rgb(190 147 48 / 26%);
    border-left-color: #ad7a16;
    background: rgb(255 248 231 / 78%);
}

.guidance-response-status-label {
    margin: 0;
    color: var(--primary-dark);
    font-size: 0.75rem;
    font-weight: 850;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.guidance-response-status-description {
    margin: 0;
    color: var(--muted);
    font-size: 0.78rem;
    line-height: 1.4;
}

.guidance-response-feedback-note {
    flex-basis: 100%;
    margin: 0 0 6px;
    color: var(--muted);
    font-size: 0.72rem;
    line-height: 1.35;
}

@media (max-width: 720px) {
    .guidance-response-status {
        margin-bottom: 10px;
        padding: 9px 10px;
    }

    .guidance-response-status-description {
        font-size: 0.74rem;
    }
}