:root {
    --pt-bg: #fbfaf7;
    --pt-ink: #212529;
    --pt-muted: #6f6a63;
    --pt-line: #e8e2d8;
    --pt-primary: #256f68;
    --pt-primary-dark: #1d5a54;
    --pt-accent: #d97a3f;
    --pt-soft: #f4efe7;
}

/* App-style mobile screens inspired by the Pattounya store visuals */
.app-discovery-head,
.app-search-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
}

.app-discovery-head h2,
.app-search-head h1 {
    margin: 0;
    color: #14243a;
    font-family: "Nunito", var(--pt-font-sans, sans-serif);
    font-size: clamp(1.9rem, 4vw, 2.8rem);
    font-weight: 900;
    line-height: .96;
}

.app-icon-button {
    width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(20, 36, 58, .12);
    border-radius: 16px;
    background: rgba(255, 252, 248, .86);
    color: #14243a;
    text-decoration: none;
    box-shadow: 0 12px 26px rgba(20, 36, 58, .08);
}

.petsitter-app-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.15rem;
}

.petsitter-app-grid.is-search {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.petsitter-app-card {
    overflow: hidden;
    border: 1px solid rgba(20, 36, 58, .1);
    border-radius: 18px;
    background: #fffdfa;
    box-shadow: 0 16px 34px rgba(20, 36, 58, .1);
}

.petsitter-app-cover {
    position: relative;
    display: block;
    aspect-ratio: 1.78;
    overflow: hidden;
    color: inherit;
}

.petsitter-app-cover img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.petsitter-cover-badges {
    position: absolute;
    top: .65rem;
    left: .65rem;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: .35rem;
}

.petsitter-favorite-badge,
.petsitter-certified-badge,
.petsitter-new-badge {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    padding: .28rem .75rem;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(20, 36, 58, .14);
    backdrop-filter: blur(10px);
}

.petsitter-favorite-badge {
    background: rgba(203, 169, 132, .95);
    color: #fffaf4;
}

.petsitter-certified-badge {
    background: rgba(20, 36, 58, .92);
    color: #fff;
}

.petsitter-new-badge {
    background: rgba(255, 250, 246, .96);
    color: #9e4f36;
}

.petsitter-certified-badge .material-symbols-rounded,
.petsitter-new-badge .material-symbols-rounded {
    color: #8fe8ff;
    font-size: 1rem;
    line-height: 1;
    font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 20;
}

.petsitter-new-badge .material-symbols-rounded {
    color: #e48e73;
}

.petsitter-heart {
    position: absolute;
    top: .65rem;
    right: .65rem;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: rgba(20, 36, 58, .18);
    backdrop-filter: blur(8px);
}

.petsitter-heart .material-symbols-rounded {
    font-variation-settings: "FILL" 0, "wght" 500, "GRAD" 0, "opsz" 24;
}

.petsitter-app-body {
    position: relative;
    padding: .9rem 1rem 1rem;
}

.petsitter-card-avatar {
    width: 66px;
    height: 66px;
    position: relative;
    z-index: 2;
    display: block;
    margin: -42px 0 .58rem .12rem;
    border: 4px solid #fffdfa;
    border-radius: 50%;
    background: #fff;
    color: inherit;
    text-decoration: none;
    box-shadow: 0 14px 28px rgba(20, 36, 58, .16);
}

.petsitter-card-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: inherit;
    object-fit: cover;
}

.petsitter-card-avatar.is-certified {
    box-shadow: 0 14px 30px rgba(20, 36, 58, .18), 0 0 0 2px rgba(74, 186, 222, .34);
}

.petsitter-avatar-check {
    position: absolute;
    right: -4px;
    bottom: 1px;
    width: 23px;
    height: 23px;
    display: inline-grid;
    place-items: center;
    border: 2px solid #fffdfa;
    border-radius: 50%;
    background: #14243a;
    color: #8fe8ff;
    font-size: 1rem;
    line-height: 1;
    font-variation-settings: "FILL" 1, "wght" 800, "GRAD" 0, "opsz" 20;
}

.petsitter-card-main {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
    align-items: start;
    padding-bottom: .7rem;
    border-bottom: 1px solid rgba(20, 36, 58, .08);
}

.petsitter-card-main h3 {
    margin: 0 0 .12rem;
    color: #14243a;
    font-size: 1.12rem;
    font-weight: 900;
}

.petsitter-card-main p {
    margin: 0;
    color: #626977;
    font-size: .9rem;
}

.petsitter-rating-pill {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    white-space: nowrap;
    color: #9a7150;
    font-size: .88rem;
    font-weight: 900;
}

.petsitter-rating-pill .material-symbols-rounded {
    color: #f2a64c;
    font-size: 1.1rem;
    font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 24;
}

.petsitter-stars {
    display: inline-flex;
    align-items: center;
    gap: .02rem;
}

.petsitter-rating-pill .petsitter-stars .material-symbols-rounded {
    font-size: 1rem;
}

.petsitter-rating-pill .material-symbols-rounded.is-full {
    color: #f2a64c;
    font-variation-settings: "FILL" 1, "wght" 750, "GRAD" 0, "opsz" 20;
}

.petsitter-rating-pill .material-symbols-rounded.is-empty {
    color: rgba(154, 113, 80, .28);
    font-variation-settings: "FILL" 0, "wght" 650, "GRAD" 0, "opsz" 20;
}

.petsitter-rate-row {
    display: grid;
    grid-template-columns: auto repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: .6rem;
    padding-top: .75rem;
}

.animal-mini-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #fff3e8;
    color: #c28d62;
}

.pet-rate-mini {
    display: grid;
    gap: .08rem;
    color: #14243a;
}

.pet-rate-mini strong {
    font-size: .88rem;
    font-weight: 900;
}

.pet-rate-mini small {
    font-size: .82rem;
    font-weight: 800;
}

.petsitter-card-actions {
    display: grid;
    gap: .55rem;
    margin-top: .85rem;
}

.petsitter-card-actions .compact-message-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .5rem;
}

.app-profile-container,
.payment-app-screen,
.care-request-app-screen {
    max-width: 520px;
}

.app-profile-card,
.payment-app-screen,
.care-request-app-screen {
    border: 1px solid rgba(20, 36, 58, .1);
    border-radius: 28px;
    background: linear-gradient(180deg, #fffdf9, #fff8f0);
    box-shadow: 0 22px 50px rgba(20, 36, 58, .12);
}

.app-profile-card {
    padding: 1.25rem;
}

.app-screen-topbar {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    align-items: center;
    gap: .5rem;
    padding: 1rem 1rem .65rem;
    color: #14243a;
}

.app-screen-topbar strong {
    text-align: center;
    font-weight: 900;
}

.app-back-link {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    color: #14243a;
    text-decoration: none;
}

.app-profile-hero {
    position: relative;
    display: grid;
    justify-items: center;
    text-align: center;
    padding: .75rem 0 1rem;
}

.app-profile-hero .guardian-public-avatar {
    width: 118px;
    height: 118px;
}

.profile-verified-dot {
    position: absolute;
    top: 92px;
    right: calc(50% - 62px);
    width: 28px;
    height: 28px;
    display: grid;
    place-items: center;
    border: 3px solid #fffdfa;
    border-radius: 50%;
    background: #14243a;
    color: #fff;
    font-size: 1rem;
    font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 24;
}

.app-profile-hero h1 {
    margin: .75rem 0 .2rem;
    color: #14243a;
    font-family: "Nunito", var(--pt-font-sans, sans-serif);
    font-size: 1.55rem;
    font-weight: 900;
}

.app-profile-location {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .2rem;
    margin: 0;
    color: #4f5b6f;
    font-size: .9rem;
}

.app-profile-hero small {
    color: #687386;
    font-weight: 700;
}

.profile-stat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: .5rem 0 1.05rem;
    overflow: hidden;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 16px;
    background: rgba(255, 255, 255, .7);
}

.profile-stat-grid article {
    display: grid;
    justify-items: center;
    gap: .12rem;
    padding: .75rem .6rem;
}

.profile-stat-grid article + article {
    border-left: 1px solid rgba(20, 36, 58, .08);
}

.profile-stat-grid strong {
    color: #14243a;
    font-weight: 900;
}

.profile-stat-grid small {
    color: #687386;
    font-size: .78rem;
    font-weight: 800;
}

.profile-stat-grid .material-symbols-rounded {
    color: #f2a64c;
    font-size: 1rem;
    font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 24;
}

.profile-stat-stars {
    display: inline-flex;
    align-items: center;
    gap: .03rem;
}

.profile-stat-grid .profile-stat-stars .material-symbols-rounded {
    font-size: 1.05rem;
}

.profile-stat-grid .material-symbols-rounded.is-full {
    color: #f2a64c;
    font-variation-settings: "FILL" 1, "wght" 750, "GRAD" 0, "opsz" 20;
}

.profile-stat-grid .material-symbols-rounded.is-empty {
    color: rgba(154, 113, 80, .28);
    font-variation-settings: "FILL" 0, "wght" 650, "GRAD" 0, "opsz" 20;
}

.app-profile-section {
    padding: 1rem 0;
    border-top: 1px solid rgba(20, 36, 58, .08);
}

.app-profile-section h2 {
    margin: 0 0 .65rem;
    color: #14243a;
    font-size: 1rem;
    font-weight: 900;
}

.app-rate-list {
    display: grid;
    gap: .55rem;
}

.app-rate-list article {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: .65rem;
    padding: .72rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 14px;
    background: rgba(255, 255, 255, .7);
}

.app-rate-list .material-symbols-rounded {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #fff1e7;
    color: #c28d62;
}

.app-rate-list strong,
.app-rate-list b {
    color: #14243a;
    font-size: .92rem;
    font-weight: 900;
}

.app-profile-actions {
    display: grid;
    gap: .65rem;
    padding: .65rem 0 1rem;
}

.care-request-app-screen,
.payment-app-screen {
    padding-bottom: 1rem;
}

.care-request-app-form,
.payment-app-screen > .payment-card,
.payment-app-screen > form,
.payment-cancel-link {
    margin-inline: 1rem;
}

.request-pet-hero {
    display: grid;
    justify-items: center;
    text-align: center;
    padding: .3rem 1rem .9rem;
}

.request-pet-avatar {
    width: 92px;
    height: 92px;
    display: grid;
    place-items: center;
    overflow: hidden;
    border: 4px solid #fff;
    border-radius: 50%;
    background: linear-gradient(135deg, #ead5bd, #f4a48d);
    color: #fff;
    font-size: 2rem;
    font-weight: 900;
    box-shadow: 0 12px 24px rgba(20, 36, 58, .14);
}

.request-pet-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.request-pet-hero h1 {
    margin: .6rem 0 .15rem;
    color: #14243a;
    font-size: 1.1rem;
    font-weight: 900;
}

.request-pet-hero p {
    margin: 0;
    color: #7a8290;
    font-size: .85rem;
    font-weight: 700;
}

.request-summary-card,
.payment-card {
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 18px;
    background: rgba(255, 255, 255, .72);
    box-shadow: 0 12px 28px rgba(20, 36, 58, .08);
}

.request-summary-card {
    padding: .9rem;
}

.request-summary-row,
.fee-line {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .7rem 0;
    border-bottom: 1px solid rgba(20, 36, 58, .08);
}

.request-summary-row span,
.fee-line span {
    color: #566175;
    font-size: .88rem;
    font-weight: 800;
}

.request-summary-row strong,
.fee-line strong {
    color: #14243a;
    text-align: right;
    font-size: .9rem;
    font-weight: 900;
}

.request-summary-row small {
    display: block;
    color: #8a92a0;
    font-size: .72rem;
}

.request-summary-row.is-total,
.fee-line.is-total {
    border-bottom: 0;
}

.request-form-shell [data-care-request-form] > .row {
    margin: 0;
}

.request-form-shell [data-care-request-form] > .row > [class*="col-"] {
    padding-inline: .25rem;
}

.request-form-shell hr {
    margin: .8rem 0 !important;
}

.request-form-shell h2 {
    font-size: .95rem !important;
}

.care-request-pet-picker,
.care-pet-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: .8rem;
}

.care-request-pet-card {
    display: grid;
    justify-items: center;
    gap: .35rem;
    padding: 1rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 18px;
    background: #fffdfa;
    color: #14243a;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 12px 28px rgba(20, 36, 58, .08);
}

.care-request-pet-card strong {
    font-weight: 900;
}

.care-request-pet-card small {
    color: #737d8f;
    font-weight: 700;
}

.payment-card {
    padding: 1rem;
    margin-top: .8rem;
}

.payment-card h1,
.payment-card h2 {
    margin: 0 0 .75rem;
    color: #14243a;
    font-size: .98rem;
    font-weight: 900;
}

.payment-card > small {
    display: block;
    margin-top: .55rem;
    color: #7e8795;
    text-align: center;
    font-size: .78rem;
    font-weight: 700;
}

.payment-card.is-secure p {
    margin: -.25rem 0 .75rem;
    color: #536073;
    font-size: .86rem;
    font-weight: 700;
}

.stripe-ribbon {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .55rem .75rem;
    border-radius: 12px;
    background: #635bff;
    color: #fff;
    font-size: .86rem;
    font-weight: 900;
}

.payment-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    margin-top: 1rem;
    border-radius: 14px;
}

.payment-cancel-link {
    display: block;
    margin-top: .8rem;
    color: #14243a;
    text-align: center;
    text-decoration: none;
    font-weight: 900;
}

@media (max-width: 767.98px) {
    .petsitter-app-grid,
    .petsitter-app-grid.is-search {
        grid-template-columns: 1fr;
        gap: .9rem;
    }

    .app-discovery-panel {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .app-discovery-title {
        padding: .2rem .1rem .7rem;
    }

    .petsitter-app-card {
        border-radius: 16px;
    }

    .petsitter-card-main {
        grid-template-columns: minmax(0, 1fr);
    }

    .petsitter-rating-pill {
        justify-self: start;
    }

    .petsitter-card-actions .compact-message-form {
        grid-template-columns: 1fr;
    }

    .app-profile-container,
    .payment-app-screen,
    .care-request-app-screen {
        max-width: none;
    }

    .app-profile-card,
    .payment-app-screen,
    .care-request-app-screen {
        border-radius: 24px;
    }
}

body {
    background: var(--pt-bg);
    color: var(--pt-ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a {
    color: var(--pt-primary);
}

.navbar {
    border-bottom: 1px solid var(--pt-line);
    background: rgba(251, 250, 247, .94);
    backdrop-filter: blur(12px);
}

.btn-primary {
    --bs-btn-bg: transparent;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-bg: transparent;
    --bs-btn-active-border-color: transparent;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    border: 0;
    box-shadow: 0 10px 24px rgba(15, 5, 107, .16);
}

.btn-outline-primary {
    --bs-btn-color: #0f056b;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: transparent;
    --bs-btn-hover-border-color: transparent;
    position: relative;
    z-index: 0;
    border-color: transparent;
    background:
        linear-gradient(var(--pt-bg), var(--pt-bg)) padding-box,
        linear-gradient(152deg, #00e9ff, #0f056b) border-box;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-check:checked + .btn-outline-primary,
.btn-check:active + .btn-outline-primary,
.btn-check:focus + .btn-outline-primary {
    color: #fff !important;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    border-color: transparent;
    box-shadow: 0 10px 24px rgba(15, 5, 107, .16);
}

.btn-check:checked + .btn-outline-primary:hover,
.btn-check:checked + .btn-outline-primary:focus {
    color: #fff !important;
    filter: saturate(1.08);
}

.btn-outline-primary:disabled,
.btn-outline-primary.disabled {
    color: #7d7a86;
    background:
        linear-gradient(var(--pt-bg), var(--pt-bg)) padding-box,
        linear-gradient(152deg, rgba(0, 233, 255, .35), rgba(15, 5, 107, .28)) border-box;
    box-shadow: none;
}

.text-muted {
    color: var(--pt-muted) !important;
}

.surface {
    background: #fff;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
}

.hero {
    position: relative;
    isolation: isolate;
    min-height: 74vh;
    display: grid;
    align-items: center;
    padding: 4rem 0 2rem;
    overflow: hidden;
    background: var(--pt-bg);
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background: url("/images/hero-animals-pattounya.png") 55% center/cover;
}

.hero::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, rgba(251, 250, 247, .82), rgba(251, 250, 247, .32), rgba(251, 250, 247, .06));
}

.hero h1 {
    font-size: clamp(2.35rem, 9vw, 5rem);
    line-height: .96;
    letter-spacing: 0;
    color: #102f2c;
    text-shadow: 0 2px 16px rgba(255, 255, 255, .82);
}

.hero-copy {
    text-shadow: 0 1px 14px rgba(255, 255, 255, .74);
}

.hero-copy .lead {
    max-width: 620px;
    color: #2c3734 !important;
    font-weight: 500;
}

.hero-copy .btn {
    box-shadow: 0 10px 24px rgba(16, 47, 44, .14);
}

@media (max-width: 991.98px) {
    .hero::before {
        background-position: 68% center;
    }
}

@media (max-width: 575.98px) {
    .hero::before {
        background-position: 76% center;
    }
}

.section-band {
    border-top: 1px solid var(--pt-line);
    padding: 3rem 0;
}

.registration-choice-page {
    min-height: calc(100vh - 73px);
    display: grid;
    align-items: center;
    background:
        radial-gradient(circle at 10% 8%, rgba(0, 233, 255, .14), transparent 28%),
        radial-gradient(circle at 95% 18%, rgba(15, 5, 107, .10), transparent 30%),
        var(--pt-bg);
}

.registration-choice-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2rem;
    align-items: center;
    margin-bottom: 2rem;
}

.registration-choice-copy {
    max-width: 720px;
}

.registration-choice-copy h1 {
    max-width: 680px;
    font-size: clamp(2rem, 6vw, 4.2rem);
    line-height: 1;
    letter-spacing: 0;
}

.registration-choice-copy p {
    max-width: 600px;
    font-size: 1.05rem;
}

.registration-choice-visual {
    display: flex;
    gap: .65rem;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 999px;
    background: rgba(255, 255, 255, .78);
    box-shadow: 0 18px 42px rgba(33, 37, 41, .08);
}

.registration-choice-visual span {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: #fff;
    font-size: 1.75rem;
}

.registration-choice-visual img {
    width: 112px;
    height: 112px;
    display: block;
    object-fit: contain;
}

.registration-choice-stack {
    display: grid;
    gap: .9rem;
    max-width: 920px;
}

.registration-choice-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1.15rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: rgba(255, 255, 255, .9);
    color: var(--pt-ink);
    text-decoration: none;
    box-shadow: 0 18px 42px rgba(33, 37, 41, .07);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.registration-choice-card:hover {
    transform: translateY(-2px);
    border-color: rgba(15, 5, 107, .20);
    box-shadow: 0 24px 54px rgba(33, 37, 41, .10);
    color: var(--pt-ink);
}

.registration-choice-card-primary {
    padding: 1.45rem;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(152deg, #00e9ff, #0f056b) border-box;
    border-color: transparent;
}

.registration-choice-icon {
    display: grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 8px;
    background: #eef9fb;
    font-size: 1.8rem;
}

.registration-choice-card-primary .registration-choice-icon {
    background: linear-gradient(152deg, rgba(0, 233, 255, .18), rgba(15, 5, 107, .10));
}

.registration-choice-content {
    display: grid;
    gap: .2rem;
}

.registration-choice-label {
    font-weight: 800;
    font-size: clamp(1.15rem, 3vw, 1.6rem);
}

.registration-choice-text {
    color: var(--pt-muted);
}

.registration-choice-arrow {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    color: #fff;
    font-weight: 800;
}

.registration-choice-divider {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: var(--pt-muted);
    font-weight: 700;
}

.registration-choice-divider::before,
.registration-choice-divider::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--pt-line);
}

.avatar {
    width: 76px;
    height: 76px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px var(--pt-line);
}

.profile-upload {
    cursor: pointer;
    text-align: center;
}

.profile-upload img {
    width: min(100%, 220px);
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 50%;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px var(--pt-line), 0 10px 28px rgba(33, 37, 41, .08);
}

.profile-upload-placeholder {
    display: grid;
    place-items: center;
    width: min(100%, 220px);
    aspect-ratio: 1;
    margin-inline: auto;
    border-radius: 50%;
    border: 2px solid #fff;
    background: var(--pt-soft);
    color: var(--pt-primary);
    box-shadow: 0 0 0 1px var(--pt-line), 0 10px 28px rgba(33, 37, 41, .08);
    font-size: 3.2rem;
}

.file-drop {
    min-height: 58px;
    display: grid;
    align-content: center;
    gap: .1rem;
    padding: .75rem 1rem;
    border: 1px dashed #cfc7ba;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}

.file-drop:hover {
    border-color: var(--pt-primary);
    background: #e8f4f1;
}

.cover-upload {
    min-height: 0;
    gap: .45rem;
}

.cover-upload-preview {
    width: 100%;
    aspect-ratio: 16 / 9;
    display: block;
    border-radius: 12px;
    border: 1px solid rgba(20, 36, 58, .08);
    background:
        linear-gradient(135deg, rgba(201, 173, 141, .16), rgba(228, 142, 115, .11)),
        #fbf1ea;
    background-position: center;
    background-size: cover;
}

.cover-upload-preview:not(.has-image)::before {
    content: "Couverture 16:9";
    height: 100%;
    display: grid;
    place-items: center;
    color: #687282;
    font-size: .82rem;
    font-weight: 850;
}

.square-upload {
    min-height: 172px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .35rem;
    padding: 1rem;
    border: 1px dashed #cfc7ba;
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    text-align: center;
    transition: border-color .15s ease, background .15s ease;
}

.square-upload:hover {
    border-color: var(--pt-primary);
    background: #e8f4f1;
}

.square-upload.has-files {
    border-color: var(--pt-primary);
    background: #f1fbfd;
    box-shadow: inset 0 0 0 1px rgba(0, 233, 255, .18);
}

.square-upload-feature {
    min-height: 240px;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(152deg, rgba(0, 233, 255, .7), rgba(15, 5, 107, .55)) border-box;
    border-color: transparent;
    border-style: solid;
}

.square-upload-preview {
    display: grid;
    place-items: center;
    width: 88px;
    height: 88px;
    border-radius: 8px;
    background: var(--pt-soft);
    color: var(--pt-primary);
    font-size: 2rem;
    font-weight: 700;
}

.square-upload-feature .square-upload-preview {
    width: 104px;
    height: 104px;
    background: #eef9fb;
    box-shadow: inset 0 0 0 1px #d8eef2;
}

.square-upload-preview.has-image {
    color: #fff;
    background-position: center;
    background-size: cover;
    box-shadow:
        inset 0 0 0 999px rgba(15, 5, 107, .22),
        inset 0 0 0 1px rgba(255, 255, 255, .7);
    text-shadow: 0 1px 6px rgba(0, 0, 0, .35);
}

.photo-strip {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(94px, 1fr));
    gap: .5rem;
}

.photo-strip img {
    aspect-ratio: 1;
    width: 100%;
    object-fit: cover;
    border-radius: 8px;
}

.image-cropper-body {
    display: grid;
    gap: 1rem;
}

.image-cropper-stage {
    display: grid;
    place-items: center;
    padding: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background:
        linear-gradient(45deg, rgba(255, 255, 255, .06) 25%, transparent 25%),
        linear-gradient(-45deg, rgba(255, 255, 255, .06) 25%, transparent 25%),
        #172033;
    overflow: hidden;
}

.image-cropper-stage canvas {
    display: block;
    width: 100%;
    max-width: 560px;
    aspect-ratio: 1;
    border-radius: 8px;
    cursor: grab;
    touch-action: none;
}

.image-cropper-modal.is-wide .modal-dialog {
    max-width: min(920px, calc(100vw - 1rem));
}

.image-cropper-modal.is-wide .image-cropper-stage canvas {
    max-width: 720px;
    aspect-ratio: 16 / 9;
}

.image-cropper-stage canvas:active {
    cursor: grabbing;
}

.image-cropper-zoom {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: .9rem;
    align-items: center;
    margin: 0;
    font-weight: 700;
}

.price-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem 0;
    border-bottom: 1px solid var(--pt-line);
}

.price-row:last-child {
    border-bottom: 0;
}

.form-control,
.form-select {
    border-color: var(--pt-line);
    min-height: 46px;
}

.input-group .age-unit-select {
    flex: 0 0 130px;
}

textarea.form-control {
    resize: none;
    border-radius: 8px;
}

.health-toggle {
    min-height: 68px;
    display: grid;
    align-content: center;
    padding: .75rem .9rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.btn-check:checked + .health-toggle {
    border-color: var(--pt-primary);
    background: #e8f4f1;
    box-shadow: inset 0 0 0 1px var(--pt-primary);
}

.pet-modal-body {
    background: #fcfbf8;
}

.account-modal-body {
    background: #fcfbf8;
}

@media (min-width: 1200px) {
    .modal-xxl {
        --bs-modal-width: min(1180px, calc(100vw - 2rem));
    }
}

@media (min-width: 1400px) {
    .modal-xxl {
        --bs-modal-width: min(1320px, calc(100vw - 3rem));
    }
}

.account-modal-dialog .modal-content {
    overflow: hidden;
}

.account-modal-body .modal-form-section {
    min-width: 0;
}

.pet-profile-form .modal-form-section {
    box-shadow: 0 8px 22px rgba(33, 37, 41, .035);
}

.pet-photo-panel {
    display: grid;
    align-content: start;
    gap: .9rem;
}

.modal-form-section {
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.modal-form-section-compact {
    padding: .75rem;
}

.address-lookup-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
}

.address-field-with-action .form-control {
    padding-right: 3.35rem;
}

.address-geolocate-button {
    position: absolute;
    top: 50%;
    right: .45rem;
    z-index: 5;
    width: 2.15rem;
    height: 2.15rem;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--pt-muted);
    transform: translateY(-50%);
    box-shadow: none;
}

.address-geolocate-button:hover,
.address-geolocate-button:focus {
    background: #eef9fb;
    color: var(--pt-primary);
    box-shadow: none;
}

.address-geolocate-button:focus-visible {
    outline: 2px solid rgba(0, 233, 255, .45);
    outline-offset: 2px;
}

.address-geolocate-button:disabled {
    background: transparent;
    color: #a8b3b5;
    opacity: .8;
}

.address-suggestions {
    position: absolute;
    z-index: 20;
    inset-inline: 0;
    top: calc(100% + .35rem);
    display: grid;
    gap: .25rem;
    max-height: 260px;
    overflow: auto;
    padding: .4rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 40px rgba(33, 37, 41, .12);
}

.address-suggestion-item {
    display: grid;
    gap: .1rem;
    width: 100%;
    padding: .65rem .75rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--pt-ink);
    text-align: left;
}

.address-suggestion-item:hover,
.address-suggestion-item:focus {
    background: #f1fbfd;
}

.address-suggestion-item span {
    color: var(--pt-muted);
    font-size: .84rem;
}

.verification-code-input {
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: .18rem;
    text-align: center;
}

.section-kicker {
    display: block;
    margin-bottom: .75rem;
    color: var(--pt-primary-dark);
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
}

.badge-soft {
    color: var(--pt-primary-dark);
    background: #e8f4f1;
    border: 1px solid #cae3de;
}

.pet-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: .9rem;
}

.pet-card {
    min-height: 230px;
    width: 100%;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    padding: .9rem;
    transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.pet-card:hover,
.pet-card:focus {
    border-color: var(--pt-primary);
    box-shadow: 0 10px 26px rgba(33, 37, 41, .08);
    transform: translateY(-1px);
}

.care-pet-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: .85rem;
}

.care-pet-choice {
    position: relative;
    isolation: isolate;
    min-height: 172px;
    width: 100%;
    display: grid;
    align-items: end;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 10px;
    background:
        linear-gradient(180deg, rgba(15, 5, 107, .06), rgba(15, 5, 107, .28)),
        var(--pet-bg, linear-gradient(135deg, #e8f7f8, #f6f0e8));
    background-position: center;
    background-size: cover;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(33, 37, 41, .06);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.care-pet-choice::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 66%;
    z-index: -1;
    background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .66));
}

.care-pet-choice::before {
    content: "\2713";
    position: absolute;
    top: .6rem;
    right: .6rem;
    z-index: 1;
    width: 2rem;
    height: 2rem;
    display: grid;
    place-items: center;
    border: 2px solid rgba(255, 255, 255, .82);
    border-radius: 50%;
    background: rgba(255, 255, 255, .22);
    color: transparent;
    font-weight: 900;
    backdrop-filter: blur(7px);
}

.care-pet-choice:hover,
.care-pet-choice:focus {
    transform: translateY(-1px);
    box-shadow: 0 14px 30px rgba(15, 5, 107, .14);
}

.btn-check:checked + .care-pet-choice {
    border-color: #00d5ec;
    transform: translateY(-2px) scale(1.015);
    box-shadow:
        0 16px 34px rgba(15, 5, 107, .22),
        inset 0 0 0 3px rgba(255, 255, 255, .95),
        inset 0 0 0 999px rgba(0, 233, 255, .12);
}

.btn-check:checked + .care-pet-choice::before {
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    color: #fff;
}

.care-pet-initial {
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: rgba(15, 5, 107, .25);
    font-size: 4rem;
    font-weight: 800;
}

.care-pet-overlay {
    display: grid;
    gap: .1rem;
    padding: .9rem;
    color: #fff;
}

.care-pet-overlay strong,
.care-pet-overlay small {
    text-shadow: 0 1px 8px rgba(0, 0, 0, .35);
}

.care-request-empty {
    grid-column: 1 / -1;
    min-height: 180px;
}

.pet-card img,
.pet-card-placeholder {
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 8px;
    object-fit: cover;
}

.pet-card-placeholder {
    display: grid;
    place-items: center;
    background: var(--pt-soft);
    color: var(--pt-primary);
    font-size: 2rem;
    font-weight: 700;
}

.pet-card-empty {
    display: grid;
    place-items: center;
    align-content: center;
    gap: .6rem;
    border: 2px dashed #cfc7ba;
    color: var(--pt-primary);
}

.pet-plus {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    background: #e8f4f1;
    font-size: 2rem;
    line-height: 1;
}

.animal-rate-card {
    min-height: 210px;
    width: 100%;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    padding: 1rem;
    transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.animal-rate-card:hover,
.animal-rate-card:focus {
    border-color: var(--pt-primary);
    box-shadow: 0 10px 26px rgba(33, 37, 41, .08);
    transform: translateY(-1px);
}

.animal-rate-icon {
    display: grid;
    place-items: center;
    width: 64px;
    height: 64px;
    border-radius: 8px;
    background: var(--pt-soft);
    color: var(--pt-primary);
    font-size: 1.8rem;
    font-weight: 800;
}

.choice-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(112px, 1fr));
    gap: .65rem;
}

.choice-card-grid-sm {
    grid-template-columns: repeat(auto-fit, minmax(96px, 1fr));
}

.choice-card {
    min-height: 112px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .4rem;
    padding: .85rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    text-align: center;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.choice-card-grid-sm .choice-card {
    min-height: 86px;
    padding: .65rem;
}

.btn-check:checked + .choice-card,
.choice-card:hover {
    border-color: var(--pt-primary);
    background: #e8f4f1;
    box-shadow: inset 0 0 0 1px var(--pt-primary);
}

.btn-check:disabled + .choice-card,
.choice-card.is-disabled {
    opacity: .38;
    cursor: not-allowed;
    background: #f8f7f4;
}

.choice-card-grid.is-invalid .choice-card {
    border-color: var(--bs-danger);
}

.choice-icon {
    font-size: 2rem;
    line-height: 1;
}

.choice-card-grid-sm .choice-icon {
    font-size: 1.55rem;
}

.sociability-grid {
    display: grid;
    gap: .65rem;
}

.sociability-card {
    padding: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fcfbf8;
}

.dashboard-hub {
    scroll-margin-top: 88px;
}

.dashboard-category-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .9rem;
}

.dashboard-collapse-toggle {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    color: var(--pt-ink);
    text-decoration: none;
}

.action-tile-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: .75rem;
}

.action-tile {
    position: relative;
    min-height: 168px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .25rem;
    width: 100%;
    padding: 1rem;
    border: 0;
    border-radius: 8px;
    color: #fff;
    overflow: visible;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 10px 24px rgba(33, 37, 41, .08);
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}

.action-tile:hover,
.action-tile:focus {
    color: #fff;
    filter: saturate(1.06);
    transform: translateY(-2px);
    box-shadow: 0 14px 30px rgba(33, 37, 41, .12);
}

.action-tile-icon {
    display: grid;
    place-items: center;
    min-height: 70px;
    font-size: 3.5rem;
    font-weight: 800;
    line-height: 1;
}

.action-tile-title {
    display: block;
    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.05;
}

.action-tile-subtitle {
    display: block;
    max-width: 140px;
    color: rgba(255, 255, 255, .9);
    font-size: .86rem;
    font-weight: 600;
    line-height: 1.1;
}

.action-tile-badge {
    position: absolute;
    top: -.45rem;
    right: -.45rem;
    min-width: 1.85rem;
    min-height: 1.85rem;
    display: inline-grid;
    place-items: center;
    border: 2px solid #fff;
    font-size: .78rem;
}

.action-tile-pets {
    background: linear-gradient(135deg, #ff725e, #d95543);
}

.action-tile-account {
    background: linear-gradient(135deg, #6a8fdd, #3f5fae);
}

.action-tile-request {
    background: linear-gradient(135deg, #2aa8d2, #287f9c);
}

.action-tile-calendar {
    background: linear-gradient(135deg, #fa3d75, #d72e68);
}

.action-tile-rates {
    background: linear-gradient(135deg, #f48a36, #cf6426);
}

.action-tile-payout {
    background: linear-gradient(135deg, #5168d9, #27328f);
}

.action-tile-demands {
    background: linear-gradient(135deg, #3aa0bb, #226f88);
}

.action-tile-search {
    background: linear-gradient(135deg, #34b7c8, #24758d);
}

.action-tile-history {
    background: linear-gradient(135deg, #5e877c, #35675f);
}

.client-current-requests {
    scroll-margin-top: 88px;
}

.client-current-request-list {
    display: grid;
    gap: .75rem;
}

.client-current-request-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: .9rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.client-current-request-main {
    display: grid;
    gap: .45rem;
    min-width: 0;
}

.client-current-request-date {
    display: flex;
    align-items: baseline;
    gap: .6rem;
    flex-wrap: wrap;
}

.client-current-request-date span {
    color: var(--pt-muted);
    font-size: .9rem;
}

.client-current-request-pets {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.client-current-request-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .55rem;
    flex-wrap: wrap;
}

.client-current-request-actions form {
    margin: 0;
}

.client-current-request-empty {
    padding: 1rem;
    border: 1px dashed var(--pt-line);
    border-radius: 8px;
    background: rgba(255, 255, 255, .7);
}

@media (max-width: 767.98px) {
    .guardian-billing-grid {
        grid-template-columns: 1fr;
    }

    .client-current-request-item {
        grid-template-columns: 1fr;
    }

    .client-current-request-actions {
        justify-content: flex-start;
    }
}

.history-shell {
    display: grid;
    gap: 1rem;
}

.history-hero,
.history-filters,
.history-card,
.history-empty {
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(33, 37, 41, .045);
}

.history-hero {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 1.15rem;
}

.history-filters {
    display: grid;
    grid-template-columns: minmax(240px, 1fr) minmax(150px, 210px) minmax(170px, 230px) minmax(210px, 280px) auto;
    align-items: center;
    gap: .9rem;
    padding: 1rem;
    background:
        linear-gradient(180deg, rgba(0, 233, 255, .06), rgba(255, 255, 255, 0)),
        #fff;
}

.history-filter-intro {
    min-width: 0;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    align-items: center;
    gap: .75rem;
}

.history-filter-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #eef9fb;
    color: var(--pt-primary-dark);
    font-size: 1.25rem;
}

.history-filter-intro strong,
.history-filter-intro small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.history-filter-intro small {
    color: var(--pt-muted);
}

.history-filter {
    display: grid;
    gap: .3rem;
    min-width: 0;
    padding: .55rem .65rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfc;
}

.history-filter span {
    color: var(--pt-muted);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase;
}

.history-filter .form-select {
    min-height: 36px;
    padding: 0 2rem 0 0;
    border: 0;
    background-color: transparent;
    box-shadow: none;
    font-weight: 800;
}

.history-reset {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.history-timeline {
    display: grid;
    gap: .75rem;
}

.history-card {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: .9rem;
    padding: .9rem;
}

.history-card.is-client {
    border-left: 4px solid #00e9ff;
}

.history-card.is-guardian {
    border-left: 4px solid #35675f;
}

.history-card.history-type-request {
    border-left-color: #00e9ff;
}

.history-card.history-type-booking {
    border-left-color: #42b978;
}

.history-card.history-type-proposal_received {
    border-left-color: #f48a36;
}

.history-card.history-type-proposal_sent {
    border-left-color: #5168d9;
}

.history-card-icon {
    width: 56px;
    height: 56px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #eef9fb;
    font-size: 1.45rem;
}

.history-card-main {
    min-width: 0;
}

.history-card-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .75rem;
    margin-bottom: .35rem;
}

.history-card-title {
    min-width: 0;
}

.history-person {
    display: block;
    margin-bottom: .35rem;
    color: var(--pt-muted);
    font-size: .9rem;
    font-weight: 600;
}

.history-date {
    display: block;
    color: var(--pt-muted);
    font-size: .82rem;
    font-weight: 700;
}

.history-labels,
.history-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.history-label {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: .18rem .5rem;
    border: 1px solid transparent;
    border-radius: 999px;
    color: #475155;
    background: #f3f6f6;
    font-size: .74rem;
    font-weight: 800;
}

.history-label-role {
    color: #566266;
    background: #f4f6f6;
    border-color: #e4eaea;
}

.history-label-type {
    color: #27328f;
    background: #eef3ff;
    border-color: #cad6ff;
}

.history-type-request .history-label-type {
    color: #075d66;
    background: #e6fcff;
    border-color: rgba(0, 233, 255, .55);
}

.history-type-booking .history-label-type {
    color: #276248;
    background: #eaf9f0;
    border-color: rgba(66, 185, 120, .42);
}

.history-type-proposal_received .history-label-type {
    color: #8a4d10;
    background: #fff1e2;
    border-color: rgba(244, 138, 54, .46);
}

.history-type-proposal_sent .history-label-type {
    color: #27328f;
    background: #eef2ff;
    border-color: rgba(81, 104, 217, .42);
}

.history-label-status {
    color: #5f5648;
    background: #fbf8f2;
    border-color: #ece3d3;
}

.history-status-draft {
    color: #343a40;
    background: #e2e6ea;
    border-color: #c8d0d6;
}

.history-status-open {
    color: #004e58;
    background: #bdf7ff;
    border-color: #00d8ef;
}

.history-status-pending,
.history-status-pending_payment {
    color: #6b4300;
    background: #ffe08a;
    border-color: #ffc531;
}

.history-status-accepted,
.history-status-paid,
.history-status-confirmed,
.history-status-in_progress,
.history-status-completed {
    color: #0f5132;
    background: #b9f3cf;
    border-color: #45c77a;
}

.history-status-declined,
.history-status-canceled,
.history-status-expired {
    color: #842029;
    background: #ffc9cf;
    border-color: #f06a78;
}

.history-card-tools {
    display: flex;
    justify-content: flex-end;
    flex: 0 0 auto;
}

.history-message-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 34px;
    padding: .32rem .55rem;
    border: 1px solid transparent;
    border-radius: 999px;
    color: var(--pt-muted);
    font-size: .82rem;
    font-weight: 800;
    text-decoration: none;
    transition: color .15s ease, background .15s ease, border-color .15s ease;
}

.history-message-link:hover,
.history-message-link:focus {
    color: #0f056b;
    border-color: rgba(15, 5, 107, .10);
    background: #f4fbfc;
}

.history-facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: .7rem;
}

.history-fact {
    min-width: 0;
    min-height: 72px;
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    align-items: center;
    gap: .7rem;
    padding: .78rem .85rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background:
        linear-gradient(180deg, rgba(0, 233, 255, .035), rgba(255, 255, 255, 0)),
        #fff;
    color: var(--pt-muted);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .65);
}

.history-fact-icon {
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #eef9fb;
    color: var(--pt-primary-dark);
    font-size: 1.1rem;
    font-weight: 900;
}

.history-fact-copy {
    min-width: 0;
    display: grid;
    gap: .12rem;
}

.history-fact-copy strong {
    color: var(--pt-ink);
    font-size: .74rem;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.history-fact-copy span {
    overflow: hidden;
    color: #3d4647;
    font-size: .95rem;
    font-weight: 750;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.history-actions {
    margin-top: .85rem;
}

.star-rating {
    display: flex;
    align-items: center;
    gap: .65rem;
    flex-wrap: wrap;
}

.star-rating-label {
    color: var(--pt-muted);
    font-size: .82rem;
    font-weight: 850;
}

.star-rating-buttons {
    display: inline-flex;
    flex-direction: row;
    gap: .12rem;
}

.star-rating-button {
    width: 2rem;
    height: 2rem;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: #d2c7b7;
    font-size: 1.65rem;
    line-height: 1;
    transition: color .12s ease, transform .12s ease;
}

.star-rating-button:hover,
.star-rating-button:focus,
.star-rating-button.is-active {
    color: #f4a51c;
}

.star-rating-button:focus-visible {
    outline: 2px solid rgba(15, 5, 107, .32);
    outline-offset: 2px;
    border-radius: 8px;
}

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

.action-tile-info {
    background: linear-gradient(135deg, #fb8444, #d8682d);
}

.dashboard-notification-panel {
    overflow: hidden;
    border: 1px solid #ffd0c6;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 10px 24px rgba(33, 37, 41, .06);
}

.dashboard-notification-header {
    min-height: 54px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .75rem 1rem;
    background: #ff6653;
    color: #fff;
    font-size: 1.1rem;
    font-weight: 800;
}

.dashboard-notification-body {
    min-height: 112px;
    display: grid;
    align-content: center;
    padding: 1rem;
}

.dashboard-notification-body .list-group-item {
    padding-inline: 0;
    border-color: var(--pt-line);
}

.message-thread {
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.message-list {
    display: grid;
    gap: .55rem;
    max-height: 260px;
    overflow: auto;
    padding: .75rem;
    border-radius: 8px;
    background: #f7f9fa;
}

.message-bubble {
    max-width: min(88%, 520px);
    padding: .7rem .85rem;
    border-radius: 8px;
}

.message-bubble.is-mine {
    justify-self: end;
    color: #fff;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
}

.message-bubble.is-theirs {
    justify-self: start;
    background: #fff;
    border: 1px solid var(--pt-line);
}

.message-bubble.is-blocked-delivery {
    color: #7a4b12;
    background: #fff7e8;
    border: 1px dashed #f0b35b;
}

.search-panel,
.contact-result-card,
.privacy-box {
    padding: .9rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.search-panel {
    background: #f7fbfc;
}

.contact-result-card {
    box-shadow: 0 8px 20px rgba(33, 37, 41, .035);
}

.privacy-panel {
    padding: .75rem;
    border-radius: 8px;
    background: #fcfbf8;
}

.bank-connect-card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: .9rem;
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(0, 233, 255, .08), rgba(15, 5, 107, .04)),
        #fff;
}

.bank-connect-card-compact {
    grid-template-columns: 46px minmax(0, 1fr);
    gap: .7rem;
    padding: .75rem;
}

.guardian-billing-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.guardian-billing-grid .bank-connect-card {
    align-content: start;
    min-height: 100%;
}

@media (max-width: 767.98px) {
    .guardian-billing-grid {
        grid-template-columns: 1fr;
    }
}

.bank-connect-icon {
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #eef9fb;
    color: #0f056b;
    font-size: 1.7rem;
}

.bank-connect-card-compact .bank-connect-icon {
    width: 46px;
    height: 46px;
    font-size: 1.35rem;
}

.bank-connect-card-compact .bank-connect-status span {
    padding: .25rem .45rem;
    font-size: .74rem;
}

.bank-connect-main {
    min-width: 0;
}

.bank-connect-status {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
}

.bank-connect-status span {
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    padding: .35rem .55rem;
    border: 1px solid var(--pt-line);
    border-radius: 999px;
    background: #fff;
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 700;
}

.bank-connect-status span::before {
    content: "";
    width: .45rem;
    height: .45rem;
    border-radius: 50%;
    background: #e68a8a;
}

.bank-connect-status span.is-ok {
    border-color: #b9ddc7;
    color: #276248;
    background: #effaf3;
}

.bank-connect-status span.is-ok::before {
    background: #42b978;
}

.messenger-shell {
    display: grid;
    grid-template-columns: minmax(0, 390px) minmax(0, 1fr);
    gap: 1rem;
    min-height: calc(100vh - 180px);
}

.messenger-list-panel,
.messenger-empty-panel,
.messenger-conversation {
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(33, 37, 41, .045);
}

.messenger-list-panel {
    padding: 1rem;
}

.messenger-filter-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem;
}

.messenger-thread-list {
    display: grid;
    gap: .55rem;
}

.messenger-thread-link {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: .75rem;
    padding: .75rem;
    border: 1px solid transparent;
    border-radius: 8px;
    color: var(--pt-ink);
    text-decoration: none;
    transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.messenger-thread-link:hover,
.messenger-thread-link:focus,
.messenger-thread-link.has-unread {
    color: var(--pt-ink);
    border-color: #cae3de;
    background: #f4fbfc;
}

.messenger-thread-link.has-unread {
    font-weight: 800;
}

.messenger-thread-link.has-unread .thread-meta {
    color: #263638;
    font-weight: 700;
}

.messenger-thread-link.is-active {
    border-color: transparent;
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(152deg, #00e9ff, #0f056b) border-box;
    box-shadow: 0 12px 28px rgba(15, 5, 107, .12);
}

.messenger-thread-link.is-pinned .thread-avatar {
    background: #eef3ff;
    color: #0f056b;
}

.messenger-thread-link.has-unread strong::after {
    content: "";
    display: inline-block;
    width: .48rem;
    height: .48rem;
    margin-left: .35rem;
    border-radius: 50%;
    background: #dc3545;
    vertical-align: middle;
}

.messenger-thread-link:hover,
.messenger-thread-link:focus {
    transform: translateY(-1px);
}

.thread-avatar,
.search-row-icon,
.compact-icon,
.messenger-empty-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 8px;
    background: #e8f4f1;
    color: var(--pt-primary-dark);
    font-weight: 800;
}

.thread-avatar {
    width: 46px;
    height: 46px;
    overflow: hidden;
}

.thread-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.thread-main,
.search-row-main {
    min-width: 0;
}

.thread-headline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
}

.thread-headline strong {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.thread-badges {
    display: inline-flex;
    flex: 0 0 auto;
    gap: .25rem;
}

.thread-meta {
    display: block;
    overflow: hidden;
    color: var(--pt-muted);
    font-size: .84rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.messenger-empty-panel {
    display: grid;
    place-items: center;
    align-content: center;
    min-height: 420px;
    padding: 2rem;
    text-align: center;
}

.messenger-empty-icon {
    width: 78px;
    height: 78px;
    margin-bottom: 1rem;
    font-size: 2rem;
}

.messenger-detail-panel {
    min-width: 0;
}

.conversation-mobile-back {
    display: none;
}

.messenger-conversation {
    overflow: hidden;
}

.messenger-conversation.is-embedded {
    height: 100%;
    min-height: calc(100vh - 180px);
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
}

.conversation-header,
.conversation-context,
.conversation-composer {
    padding: 1rem;
    border-bottom: 1px solid var(--pt-line);
}

.conversation-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
}

.conversation-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .45rem;
    flex-wrap: wrap;
}

.conversation-title {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-width: 0;
}

.context-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.proposal-action-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-top: .75rem;
    padding: .75rem;
    border: 1px solid #cae3de;
    border-radius: 8px;
    background: #f4fbfc;
}

.proposal-action-bar.is-muted {
    justify-content: flex-start;
    color: var(--pt-muted);
    background: #fcfbf8;
    border-color: var(--pt-line);
}

.conversation-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 290px;
    min-height: 0;
}

.conversation-chat {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    min-width: 0;
    min-height: 0;
}

.conversation-messages {
    display: grid;
    align-content: start;
    gap: .65rem;
    min-height: 430px;
    max-height: calc(100vh - 360px);
    overflow: auto;
    padding: 1rem;
    background: #f7f9fa;
}

.messenger-conversation.is-embedded .conversation-messages {
    min-height: 0;
    max-height: none;
}

.conversation-side {
    padding: 1rem;
    border-left: 1px solid var(--pt-line);
    background: #fcfbf8;
}

.conversation-composer {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
    border-bottom: 0;
    border-top: 1px solid var(--pt-line);
    background: #fff;
}

.conversation-composer .btn {
    min-width: 56px;
}

.conversation-delivery-warning {
    padding: .65rem 1rem;
    color: #7a4b12;
    background: #fff7e8;
    border-top: 1px solid #f0d39d;
}

.conversation-report-box summary {
    cursor: pointer;
    font-weight: 700;
    color: var(--pt-primary);
}

/* Mobile-first app-like messenger */
.messenger-page {
    height: calc(100dvh - 72px);
    min-height: 560px;
    overflow: hidden;
    padding: .75rem;
}

.messenger-page + .site-footer {
    display: none;
}

.messenger-page .messenger-shell {
    height: 100%;
    min-height: 0;
    gap: .75rem;
}

.messenger-page .messenger-list-panel,
.messenger-page .messenger-detail-panel,
.messenger-page .messenger-conversation {
    min-height: 0;
}

.messenger-page .messenger-list-panel {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    overflow: hidden;
}

.messenger-page .messenger-thread-list {
    min-height: 0;
    overflow: auto;
    padding-right: .15rem;
    scrollbar-width: thin;
}

.messenger-page .messenger-detail-panel {
    overflow: hidden;
}

.messenger-page .messenger-conversation.is-embedded {
    height: 100%;
    min-height: 0;
    grid-template-rows: auto auto minmax(0, 1fr);
}

.messenger-page .conversation-header {
    grid-template-columns: minmax(0, 1fr) auto;
    padding: .7rem .8rem;
}

.messenger-page .conversation-title h1 {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .98rem;
}

.messenger-page .conversation-title p {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}

.messenger-page .conversation-actions {
    flex-wrap: nowrap;
}

.conversation-icon-button {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(20, 36, 58, .1);
    border-radius: 999px;
    background: #fff;
    color: #14243a;
}

.conversation-icon-button:hover,
.conversation-icon-button:focus {
    border-color: rgba(226, 135, 104, .32);
    color: #9e4f36;
}

.conversation-icon-button.is-primary {
    background: #17263d;
    color: #fff;
}

.conversation-icon-button .material-symbols-rounded {
    font-size: 1.22rem;
}

.messenger-page .conversation-context {
    padding: .55rem .8rem;
}

.messenger-page .context-pill-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .1rem;
    scrollbar-width: none;
}

.messenger-page .context-pill-row::-webkit-scrollbar {
    display: none;
}

.messenger-page .proposal-action-bar {
    margin-top: .45rem;
    padding: .55rem;
}

.messenger-page .conversation-chat {
    grid-template-rows: minmax(0, 1fr) auto auto;
    min-height: 0;
}

.messenger-page .conversation-messages {
    min-height: 0;
    max-height: none;
    overflow: auto;
    padding: .75rem;
    background:
        linear-gradient(180deg, rgba(255, 250, 246, .62), rgba(247, 249, 250, .94)),
        #f7f9fa;
    scrollbar-width: thin;
}

.messenger-page .conversation-delivery-warning {
    padding: .5rem .75rem;
    font-size: .82rem;
}

.messenger-page .conversation-composer {
    position: static;
    grid-template-columns: minmax(0, 1fr) 46px;
    gap: .55rem;
    padding: .62rem;
    border-radius: 0;
    box-shadow: none;
}

.messenger-page .conversation-composer textarea {
    min-height: 44px;
    max-height: 92px;
    resize: none;
    border-radius: 999px;
    padding: .62rem .9rem;
}

.messenger-page .conversation-composer .btn {
    min-width: 46px;
    width: 46px;
    height: 46px;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border-radius: 999px;
}

.conversation-settings-panel {
    width: min(420px, 100vw);
    border-left: 1px solid rgba(20, 36, 58, .08);
}

.conversation-settings-body {
    display: grid;
    align-content: start;
    gap: .75rem;
    background: #fffaf6;
}

.conversation-settings-card {
    display: grid;
    gap: .55rem;
    padding: .75rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 16px;
    background: #fff;
}

.conversation-settings-card-head {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    align-items: center;
    gap: .6rem;
}

.conversation-settings-card-head .material-symbols-rounded {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(226, 135, 104, .14);
    color: #9e4f36;
}

.conversation-settings-card-head strong,
.conversation-settings-card-head small {
    display: block;
}

.conversation-settings-card-head small {
    color: #687282;
    font-size: .78rem;
    font-weight: 760;
}

.conversation-settings-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .45rem;
}

.conversation-settings-actions .btn,
.conversation-settings-actions form {
    width: 100%;
}

[id$="-section"],
#requests-section {
    scroll-margin-top: 92px;
}

.search-workspace {
    background:
        linear-gradient(180deg, rgba(0, 233, 255, .06), rgba(255, 255, 255, 0) 42%),
        #fff;
}

.search-page-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.compact-panel {
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(33, 37, 41, .045);
}

[data-search-page] {
    transition: opacity .15s ease;
}

[data-search-page].is-searching {
    cursor: progress;
}

[data-search-page].is-searching .compact-panel {
    opacity: .72;
}

.compact-panel-title {
    display: flex;
    align-items: center;
    gap: .75rem;
    margin-bottom: .9rem;
}

.compact-icon {
    width: 48px;
    height: 48px;
    font-size: 1.4rem;
}

.search-toolbar {
    display: grid;
    grid-template-columns: minmax(150px, 1.25fr) 112px auto 48px;
    align-items: center;
    gap: .6rem;
    margin-bottom: 1rem;
    padding: .75rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #f7fbfc;
}

.search-request-select {
    min-width: 210px;
}

.search-radius {
    min-width: 104px;
}

.animal-filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.icon-choice {
    min-width: 40px;
    min-height: 40px;
    display: inline-grid;
    place-items: center;
    padding: .35rem .55rem;
    font-size: 1rem;
}

.search-submit {
    min-height: 46px;
    padding-inline: .8rem;
}

.search-actions .btn-sm,
.compact-proposal-form .btn-sm,
.compact-message-form .btn-sm {
    min-height: 34px;
}

@supports selector(:has(*)) {
    .search-toolbar:has(.search-request-select) {
        grid-template-columns: minmax(180px, 1.1fr) minmax(150px, 1fr) 112px auto 48px;
    }
}

.search-list {
    display: grid;
    gap: .55rem;
}

.search-row {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    padding: .8rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.search-row-icon {
    width: 46px;
    height: 46px;
    font-size: 1.2rem;
}

.search-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: .45rem;
}

.search-actions-wide {
    min-width: min(100%, 390px);
}

.compact-proposal-form,
.compact-message-form {
    display: grid;
    align-items: center;
    gap: .4rem;
}

.compact-proposal-form {
    grid-template-columns: 104px minmax(120px, 1fr) auto;
}

.compact-message-form {
    grid-template-columns: minmax(140px, 1fr) auto;
}

.proposal-price {
    min-width: 104px;
}

.proposal-message {
    min-width: 120px;
}

.request-result-group {
    padding: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fcfbf8;
}

.request-result-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    margin-bottom: .6rem;
}

.search-hero-panel {
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #f7fbfc;
}

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

.search-result-card,
.empty-state {
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(33, 37, 41, .045);
}

.search-result-card {
    padding: 1rem;
}

.empty-state {
    min-height: 220px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .35rem;
    padding: 2rem;
    text-align: center;
}

.empty-state-icon {
    width: 58px;
    height: 58px;
    display: inline-grid;
    place-items: center;
    border-radius: 50%;
    background: #f1f7f8;
    font-size: 1.75rem;
}

.pricing-form {
    --pricing-card-bg: #fff;
}

.pricing-hero-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(0, 233, 255, .10), rgba(15, 5, 107, .04)),
        #fff;
}

.pricing-hero-copy {
    min-width: 0;
}

.pricing-capacity-card {
    padding: .85rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: rgba(255, 255, 255, .82);
}

.pricing-summary-strip {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.pricing-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 310px), 1fr));
    gap: 1rem;
}

.pricing-rate-card {
    position: relative;
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: var(--pricing-card-bg);
    box-shadow: 0 14px 32px rgba(33, 37, 41, .06);
}

.pricing-rate-card.is-active {
    border-color: rgba(25, 135, 84, .24);
}

.pricing-rate-card.is-available {
    background: #fbfcfd;
}

.pricing-rate-head {
    display: flex;
    align-items: flex-start;
    gap: .9rem;
}

.pricing-rate-head.compact {
    gap: .75rem;
}

.pricing-animal-icon {
    width: 58px;
    height: 58px;
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #f7fbfc;
    font-size: 2rem;
}

.pricing-add-panel {
    padding: 1rem;
    border: 1px dashed rgba(15, 5, 107, .18);
    border-radius: 8px;
    background: #fcfbf8;
}

.btn-group-flex {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.pricing-form textarea {
    resize: none;
}

.pricing-form-light {
    display: grid;
    gap: .25rem;
}

.pricing-light-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(160px, 220px);
    gap: 1rem;
    align-items: end;
}

.pricing-capacity-mini .form-control {
    min-height: 38px;
}

.accepted-animal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 245px), 1fr));
    gap: .75rem;
}

.accepted-animal-grid-compact {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}

.accepted-animal-card,
.accepted-animal-add,
.accepted-empty-state {
    min-height: 186px;
    padding: .85rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.accepted-animal-card {
    position: relative;
    box-shadow: 0 10px 24px rgba(33, 37, 41, .045);
}

.accepted-animal-card.is-new {
    background: #fcfbf8;
}

.accepted-animal-remove {
    position: absolute;
    top: -.45rem;
    right: -.45rem;
    width: 30px;
    height: 30px;
    display: inline-grid;
    place-items: center;
    border: 1px solid rgba(220, 53, 69, .18);
    border-radius: 50%;
    background: #fff;
    color: #b4232f;
    font-size: 1.1rem;
    line-height: 1;
    box-shadow: 0 8px 18px rgba(33, 37, 41, .08);
    transition: background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}

.accepted-animal-remove:hover,
.accepted-animal-remove:focus {
    border-color: rgba(220, 53, 69, .45);
    background: #fff5f5;
    color: #8f1723;
    transform: translateY(-1px);
}

.accepted-animal-title {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr);
    gap: .65rem;
    align-items: center;
}

.accepted-animal-icon {
    width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #eef9fb;
    font-size: 1.55rem;
}

.accepted-animal-card .form-label {
    margin-bottom: .25rem;
    color: var(--pt-muted);
    font-weight: 700;
}

.accepted-animal-add,
.accepted-empty-state {
    display: grid;
    place-items: center;
    align-content: center;
    gap: .45rem;
    border: 2px dashed #cfc7ba;
    color: var(--pt-primary);
    text-align: center;
}

.accepted-animal-add {
    cursor: pointer;
}

.accepted-animal-add:hover,
.accepted-animal-add:focus {
    border-color: var(--pt-primary);
    background: #f1fbfd;
}

.pricing-add-drawer {
    padding: .85rem;
    border: 1px dashed rgba(15, 5, 107, .20);
    border-radius: 8px;
    background: #fbfcfd;
}

.support-page {
    min-height: calc(100vh - 73px);
}

.support-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.support-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(0, 233, 255, .10), rgba(15, 5, 107, .04)),
        #fff;
}

.support-hero-icon,
.support-ticket-icon {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 8px;
    background: #eef9fb;
    color: #0f056b;
}

.support-hero-icon {
    width: 72px;
    height: 72px;
    font-size: 2rem;
}

.support-choice-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
    gap: .55rem;
}

.support-choice {
    min-height: 92px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .35rem;
    padding: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    text-align: center;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease;
}

.support-choice:hover,
.btn-check:checked + .support-choice {
    border-color: var(--pt-primary);
    background: #f1fbfc;
    box-shadow: inset 0 0 0 1px var(--pt-primary);
}

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

.support-choice span {
    font-size: 1.55rem;
    line-height: 1;
}

.support-message-field {
    min-height: 180px;
}

.support-ticket-card {
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.support-ticket-card {
    padding: .9rem;
}

.support-ticket-button {
    width: 100%;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: .8rem;
    color: var(--pt-ink);
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.support-ticket-button:hover,
.support-ticket-button:focus {
    border-color: var(--pt-primary);
    box-shadow: 0 10px 24px rgba(33, 37, 41, .08);
    transform: translateY(-1px);
}

.support-ticket-card-main {
    min-width: 0;
    display: grid;
    gap: .1rem;
}

.support-ticket-badges {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .35rem;
}

.support-ticket-list {
    display: grid;
    gap: .8rem;
}

.support-ticket-icon {
    width: 46px;
    height: 46px;
    font-size: 1.25rem;
}

.support-team-note {
    padding: .65rem .75rem;
    border: 1px solid #cae3de;
    border-radius: 8px;
    background: #f4fbfc;
    color: #263a37;
    font-size: .9rem;
}

.support-status-card {
    padding: .75rem;
    border: 1px solid #cae3de;
    border-radius: 8px;
    background: #f4fbfc;
}

.support-ticket-dialog {
    width: min(1480px, calc(100vw - 2rem));
    max-width: none;
}

.support-ticket-modal {
    min-height: min(860px, calc(100vh - 2rem));
    overflow: hidden;
}

.support-ticket-modal form {
    min-height: 0;
    display: grid;
}

.support-ticket-body {
    min-height: 0;
    padding: 1rem;
}

.support-ticket-layout {
    min-height: min(680px, calc(100vh - 160px));
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 360px);
    gap: 1rem;
}

.support-chat-panel {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: .75rem;
}

.support-conversation {
    display: grid;
    align-content: start;
    gap: .65rem;
    min-height: 340px;
    max-height: min(58vh, 560px);
    overflow: auto;
    padding: .9rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #f7f9fa;
}

.support-conversation-team {
    min-height: 0;
    max-height: none;
    padding: 0;
    overflow: hidden;
}

.support-conversation-scroll {
    display: grid;
    align-content: start;
    gap: .8rem;
    overflow: auto;
    padding: 1rem;
}

.support-message-bubble {
    max-width: min(88%, 560px);
    padding: .75rem .9rem;
    border-radius: 8px;
    box-shadow: 0 8px 20px rgba(33, 37, 41, .04);
}

.support-message-bubble.is-user {
    justify-self: end;
    color: #fff;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
}

.support-message-bubble.is-team {
    justify-self: start;
    background: #fff;
    border: 1px solid var(--pt-line);
}

.support-message-meta {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .35rem;
    font-size: .78rem;
    opacity: .82;
}

.support-attachment-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(118px, 1fr));
    gap: .6rem;
}

.support-attachment-card {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
    background: #101828;
}

.support-attachment-card a {
    color: inherit;
    text-decoration: none;
}

.support-attachment-card img {
    width: 100%;
    aspect-ratio: 1;
    display: block;
    object-fit: cover;
    opacity: .92;
}

.support-attachment-card span {
    position: absolute;
    left: .45rem;
    right: .45rem;
    top: .45rem;
    bottom: auto;
    padding: .25rem .45rem;
    border-radius: 999px;
    background: rgba(15, 5, 107, .82);
    font-size: .72rem;
    font-weight: 800;
    text-align: center;
}

.support-attachment-card .vstack {
    padding: .6rem;
    background: #fff;
}

.billing-hero {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid rgba(15, 5, 107, .1);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(0, 233, 255, .08), rgba(15, 5, 107, .06));
}

.billing-connect-panel {
    display: grid;
    gap: 1.25rem;
}

.billing-connect-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.billing-connect-heading > div:first-child {
    min-width: 0;
}

.billing-connect-badges {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: .5rem;
    min-width: 150px;
}

.billing-status-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 1rem;
}

.billing-status-card {
    min-width: 0;
    min-height: 132px;
    display: grid;
    align-content: start;
    gap: .45rem;
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .12);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(33, 37, 41, .05);
}

.billing-status-label {
    color: var(--pt-muted);
    font-size: .84rem;
    font-weight: 800;
    line-height: 1.25;
    text-transform: uppercase;
}

.billing-status-value {
    color: var(--pt-ink);
    font-size: 1.35rem;
    line-height: 1.15;
    overflow-wrap: anywhere;
}

.billing-status-note {
    color: var(--pt-muted);
    font-size: .92rem;
    line-height: 1.35;
}

.billing-plan-card {
    position: relative;
    overflow: hidden;
}

.billing-plan-card.is-premium {
    border-color: rgba(255, 193, 7, .55);
    box-shadow: 0 20px 50px rgba(15, 5, 107, .08);
}

.billing-price-row {
    display: flex;
    align-items: baseline;
    gap: .35rem;
}

.billing-price-row strong {
    font-size: clamp(1.8rem, 4vw, 2.5rem);
    line-height: 1;
}

.billing-benefits {
    display: grid;
    gap: .75rem;
    padding-left: 0;
    margin: 0;
    list-style: none;
}

.billing-benefits li {
    display: flex;
    gap: .6rem;
    align-items: flex-start;
    color: #475467;
}

.billing-benefits li::before {
    content: "✓";
    display: inline-grid;
    place-items: center;
    width: 1.3rem;
    height: 1.3rem;
    flex: 0 0 auto;
    border-radius: 999px;
    color: #0f056b;
    background: rgba(0, 233, 255, .22);
    font-weight: 900;
}

.support-reply-form {
    display: block;
}

.support-chat-composer {
    display: grid;
    gap: .65rem;
    padding: .85rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.support-chat-input {
    min-height: 112px;
    resize: none;
}

.support-chat-actions {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    flex-wrap: wrap;
}

.support-management-panel {
    min-width: 0;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto auto minmax(0, 1fr);
    gap: .85rem;
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfc;
}

.support-internal-note {
    min-height: 0;
    display: grid;
    align-self: stretch;
}

.support-internal-note > .form-control {
    min-height: 260px;
    height: 100%;
    resize: none;
}

.team-dashboard {
    min-height: calc(100vh - 73px);
}

.team-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.team-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .8rem;
}

.team-stat-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: .3rem .75rem;
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(33, 37, 41, .05);
}

.team-stat-icon {
    width: 44px;
    height: 44px;
    display: inline-grid;
    grid-row: span 2;
    place-items: center;
    border-radius: 8px;
    background: #f1fbfc;
    font-size: 1.35rem;
}

.team-stat-label {
    color: var(--pt-muted);
    font-size: .82rem;
    font-weight: 700;
    text-transform: uppercase;
}

.team-stat-card strong {
    font-size: 1.55rem;
    line-height: 1;
}

.team-section {
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 18px 46px rgba(33, 37, 41, .06);
}

.team-section-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 320px);
    align-items: start;
    gap: 1rem;
    margin-bottom: 1rem;
}

.team-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: .5rem;
    padding: .35rem .45rem .35rem .7rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #f8fbfb;
}

.team-search .form-control {
    min-height: 38px;
    padding-inline: .25rem;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.team-search-compact {
    max-width: 290px;
}

.team-list {
    display: grid;
    gap: .65rem;
}

.team-user-list {
    max-height: 720px;
    overflow: auto;
    padding-right: .25rem;
}

.team-user-card,
.team-mini-card {
    width: 100%;
    display: grid;
    align-items: center;
    gap: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    color: var(--pt-ink);
    text-align: left;
    text-decoration: none;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}

.team-user-card {
    grid-template-columns: 54px minmax(0, 1fr) auto;
    padding: .75rem;
}

.team-user-card:hover,
.team-user-card:focus,
.team-mini-card:hover,
.team-mini-card:focus {
    border-color: var(--pt-primary);
    background: #fbfeff;
    box-shadow: 0 12px 30px rgba(33, 37, 41, .07);
    transform: translateY(-1px);
}

.team-user-avatar {
    width: 54px;
    height: 54px;
    display: inline-grid;
    place-items: center;
    overflow: hidden;
    border-radius: 50%;
    background: linear-gradient(152deg, rgba(0, 233, 255, .22), rgba(15, 5, 107, .10));
    color: #0f056b;
    font-weight: 800;
}

.team-user-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-user-avatar-lg {
    width: 68px;
    height: 68px;
    flex: 0 0 auto;
    font-size: 1.6rem;
}

.team-user-main,
.team-user-side {
    min-width: 0;
    display: grid;
    gap: .15rem;
}

.team-user-name {
    overflow: hidden;
    font-weight: 800;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-user-meta {
    overflow: hidden;
    color: var(--pt-muted);
    font-size: .88rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-user-side {
    justify-items: end;
}

.team-grade-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .3rem;
}

.team-grade-pill {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: .2rem .5rem;
    border: 1px solid rgba(15, 5, 107, .10);
    border-radius: 999px;
    background: #f3f8f9;
    color: #273638;
    font-size: .76rem;
    font-weight: 800;
}

.team-mini-card {
    grid-template-columns: 42px minmax(0, 1fr) auto;
    padding: .75rem;
}

.team-mini-icon {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #f1fbfc;
}

.team-mini-link {
    color: inherit;
}

.team-empty {
    margin-top: .8rem;
    padding: .85rem;
    border: 1px dashed var(--pt-line);
    border-radius: 8px;
    color: var(--pt-muted);
    text-align: center;
}

.team-user-modal .modal-content,
.team-user-modal {
    border-radius: 8px;
}

.team-modal-grid {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 1rem;
}

.team-modal-panel {
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfc;
}

.team-detail-list {
    display: grid;
    gap: .65rem;
    margin: 0;
}

.team-detail-list div {
    display: grid;
    grid-template-columns: 120px minmax(0, 1fr);
    gap: .8rem;
    padding-bottom: .65rem;
    border-bottom: 1px solid rgba(33, 37, 41, .06);
}

.team-detail-list div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.team-detail-list dt {
    color: var(--pt-muted);
    font-size: .8rem;
    font-weight: 800;
    text-transform: uppercase;
}

.team-detail-list dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.team-status-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
}

.team-status-choice {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: .12rem .65rem;
    min-height: 86px;
    padding: .9rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    cursor: pointer;
    color: var(--pt-ink);
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, color .15s ease;
}

.team-status-choice span {
    font-weight: 800;
}

.team-status-icon {
    grid-row: span 2;
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(15, 5, 107, .08);
    color: #0f056b;
    font-weight: 900;
}

.team-status-choice small {
    color: var(--pt-muted);
}

.btn-check:checked + .team-status-choice {
    border-color: transparent;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    color: #fff;
    box-shadow: 0 12px 24px rgba(15, 5, 107, .18);
}

.btn-check:checked + .team-status-choice small {
    color: rgba(255, 255, 255, .82);
}

.btn-check:checked + .team-status-choice .team-status-icon {
    background: rgba(255, 255, 255, .22);
    color: #fff;
}

.team-grade-editor {
    display: grid;
    gap: .75rem;
    padding: .9rem;
    border: 1px solid rgba(0, 233, 255, .28);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(0, 233, 255, .07), #fff);
}

.team-grade-editor-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
}

.team-grade-choice {
    display: grid;
    gap: .12rem;
    min-height: 70px;
    padding: .72rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    color: var(--pt-ink);
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, color .15s ease, transform .15s ease;
}

.team-grade-choice:hover,
.team-grade-choice:focus {
    border-color: var(--pt-primary);
    transform: translateY(-1px);
}

.team-grade-choice strong {
    font-size: .92rem;
}

.team-grade-choice small {
    color: var(--pt-muted);
}

.btn-check:checked + .team-grade-choice {
    border-color: transparent;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    color: #fff;
    box-shadow: 0 12px 24px rgba(15, 5, 107, .18);
}

.btn-check:checked + .team-grade-choice small {
    color: rgba(255, 255, 255, .84);
}

.team-user-modal-refined {
    overflow: hidden;
    border: 0;
    box-shadow: 0 30px 90px rgba(15, 5, 107, .18);
    max-height: calc(100vh - 1.5rem);
}

.team-user-modal-refined > form {
    min-height: 0;
    max-height: calc(100vh - 1.5rem);
    display: flex;
    flex-direction: column;
}

.team-user-modal-refined .modal-body {
    min-height: 0;
    overflow-y: auto;
}

.team-user-modal-refined .modal-header,
.team-user-modal-refined .modal-footer {
    flex: 0 0 auto;
}

.team-user-modal-hero {
    position: relative;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 1.25rem 1.25rem 1rem;
    background: linear-gradient(135deg, rgba(0, 233, 255, .16), rgba(15, 5, 107, .08));
}

.team-user-modal-profile {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.team-user-modal-metrics {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: .55rem;
    margin-left: auto;
}

.team-user-modal-metrics span {
    min-width: 82px;
    display: grid;
    place-items: center;
    padding: .55rem .75rem;
    border: 1px solid rgba(15, 5, 107, .1);
    border-radius: 8px;
    background: rgba(255, 255, 255, .72);
    text-align: center;
}

.team-user-modal-metrics strong {
    color: var(--pt-ink);
    font-size: 1rem;
    line-height: 1.1;
}

.team-user-modal-metrics small {
    color: var(--pt-muted);
    font-size: .72rem;
    font-weight: 800;
}

.team-grade-pill.is-success {
    background: rgba(25, 135, 84, .12);
    color: #146c43;
}

.team-grade-pill.is-warning {
    background: rgba(255, 193, 7, .2);
    color: #8a6500;
}

.team-grade-pill.is-danger {
    background: rgba(220, 53, 69, .12);
    color: #b02a37;
}

.team-user-tabs {
    padding: .35rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #f8fafc;
}

.team-user-tabs .nav-link {
    color: var(--pt-muted);
    border-radius: 7px;
    font-weight: 900;
}

.team-user-tabs .nav-link.active {
    color: #fff;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    box-shadow: 0 12px 24px rgba(15, 5, 107, .14);
}

.team-user-tab-content .team-modal-panel {
    min-height: 360px;
}

.team-user-modal-dialog {
    max-width: min(1180px, calc(100vw - 1.5rem));
}

.team-profile-overview,
.team-history-panel {
    background:
        radial-gradient(circle at top right, rgba(0, 233, 255, .08), transparent 22rem),
        #fbfcfd;
}

.team-profile-grid,
.team-history-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

@media (min-width: 1100px) {
    .team-history-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.team-profile-card,
.team-history-card {
    min-width: 0;
    display: grid;
    gap: .75rem;
    align-content: start;
    padding: .95rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 5, 107, .045);
}

.team-profile-card {
    grid-template-columns: 42px minmax(0, 1fr);
}

.team-profile-card-compact {
    grid-template-columns: minmax(0, 1fr);
}

.team-profile-card-wide,
.team-history-card {
    grid-template-columns: 1fr;
}

.team-profile-icon {
    width: 42px;
    height: 42px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    color: #0f056b;
    background: rgba(0, 233, 255, .12);
    font-weight: 950;
}

.team-mini-detail-list {
    display: grid;
    gap: .45rem;
    margin: .65rem 0 0;
}

.team-mini-detail-list div {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: .65rem;
}

.team-mini-detail-list-stacked div {
    grid-template-columns: minmax(0, 1fr);
    gap: .15rem;
    padding-bottom: .45rem;
    border-bottom: 1px solid rgba(15, 5, 107, .06);
}

.team-mini-detail-list-stacked div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.team-mini-detail-list dt {
    color: var(--pt-muted);
    font-size: .74rem;
    font-weight: 900;
    text-transform: uppercase;
}

.team-mini-detail-list dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
}

.team-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.team-card-title-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: .75rem;
}

.team-card-title-row > * {
    min-width: 0;
}

.team-card-title-row strong,
.team-card-title-row small {
    display: block;
}

.team-card-title-row small {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 800;
}

.team-pet-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: .65rem;
}

.team-pet-summary-card {
    min-width: 0;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: .7rem;
    padding: .7rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: linear-gradient(180deg, #fff, #fbfcfd);
}

.team-pet-summary-photo {
    width: 58px;
    height: 58px;
    display: inline-grid;
    place-items: center;
    overflow: hidden;
    border-radius: 8px;
    background: rgba(0, 233, 255, .12);
    color: #0f056b;
    font-weight: 950;
}

.team-pet-summary-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-pet-summary-card strong,
.team-pet-summary-card span,
.team-pet-summary-card small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.team-pet-summary-card span,
.team-pet-summary-card small {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 700;
}

.team-rate-summary-list,
.team-history-list {
    display: grid;
    gap: .5rem;
}

.team-rate-summary-list-scroll,
.team-history-list-scroll,
.team-stripe-list-scroll {
    max-height: 330px;
    overflow-y: auto;
    padding-right: .25rem;
    scrollbar-width: thin;
}

.team-rate-summary-item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .25rem .7rem;
    align-items: center;
    padding: .62rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfd;
}

.team-rate-summary-item span {
    font-weight: 900;
}

.team-rate-summary-item small {
    grid-column: 1 / -1;
    color: var(--pt-muted);
}

.team-empty-line {
    padding: .8rem;
    border: 1px dashed var(--pt-line);
    border-radius: 8px;
    color: var(--pt-muted);
    background: rgba(255, 255, 255, .72);
    font-weight: 800;
}

.team-history-counters {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .35rem;
}

.team-history-counters span {
    padding: .28rem .55rem;
    border-radius: 999px;
    background: rgba(15, 5, 107, .06);
    color: #0f056b;
    font-size: .74rem;
    font-weight: 900;
}

.team-history-item {
    min-width: 0;
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr);
    gap: .6rem;
    padding: .62rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: linear-gradient(180deg, #fff, #fbfcfd);
}

.team-history-card {
    min-height: 0;
}

.team-history-card .team-card-title-row {
    position: sticky;
    top: 0;
    z-index: 1;
    margin: -.15rem -.15rem .1rem;
    padding: .15rem;
    background: #fff;
}

.team-history-dot {
    width: 10px;
    height: 10px;
    margin-top: .38rem;
    border-radius: 999px;
    background: #00cfe8;
}

.team-history-dot.is-proposal {
    background: #ffc107;
}

.team-history-dot.is-thread {
    background: #0f056b;
}

.team-history-dot.is-review {
    background: #20c997;
}

.team-history-item strong,
.team-history-item small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
}

.team-history-item small {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 700;
}

.team-stripe-panel {
    background:
        radial-gradient(circle at top right, rgba(0, 233, 255, .08), transparent 22rem),
        linear-gradient(180deg, #fff, #fbfcfd);
}

.team-stripe-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .7rem;
}

.team-stripe-card {
    min-width: 0;
    display: grid;
    gap: .62rem;
    align-content: start;
    padding: .78rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 5, 107, .035);
}

.team-stripe-subsection {
    display: grid;
    gap: .45rem;
    padding-top: .55rem;
    border-top: 1px solid var(--pt-line);
}

.team-stripe-subsection > strong {
    font-size: .86rem;
}

.team-stripe-list {
    display: grid;
    gap: .5rem;
}

.team-stripe-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .55rem;
    align-items: start;
    padding: .58rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: linear-gradient(180deg, #fff, #fbfcfd);
}

.team-stripe-row > div {
    min-width: 0;
}

.team-stripe-row strong,
.team-stripe-row small {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.team-stripe-row small {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.3;
}

.team-stripe-id-line {
    margin-top: .15rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: .72rem !important;
    word-break: break-all;
}

.team-stripe-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.team-stripe-tags span {
    max-width: 100%;
    padding: .28rem .5rem;
    border-radius: 999px;
    background: rgba(15, 5, 107, .06);
    color: #0f056b;
    font-size: .72rem;
    font-weight: 900;
    overflow-wrap: anywhere;
}

.team-detail-list-airy {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.team-detail-list-airy div {
    display: grid;
    grid-template-columns: 1fr;
    gap: .25rem;
    padding: .85rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.team-billing-state {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: .9rem;
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .1);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(0, 233, 255, .12), rgba(15, 5, 107, .06));
}

.team-billing-state > span:not(.badge) {
    display: none;
}

.team-billing-state-icon {
    width: 46px;
    height: 46px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    color: #fff;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    font-weight: 900;
}

.team-section-heading,
.team-guided-block-head {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
}

.team-section-heading > *,
.team-guided-block-head > * {
    min-width: 0;
}

.team-guided-block {
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.team-guided-block-head {
    justify-content: flex-start;
    gap: .55rem;
    margin-bottom: .6rem;
}

.team-inline-step {
    margin-bottom: .8rem;
}

.team-step-badge {
    width: 24px;
    height: 24px;
    display: inline-grid;
    flex: 0 0 auto;
    place-items: center;
    border-radius: 999px;
    color: #0f056b;
    background: rgba(0, 233, 255, .2);
    font-size: .82rem;
    font-weight: 900;
}

.team-guided-block-head strong {
    display: block;
    font-weight: 900;
}

.team-guided-block-head small,
.team-switch-row small {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 700;
}

.team-switch-row {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .62rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.team-billing-wizard > [class*="col-"] {
    min-width: 0;
}

.team-billing-step-duration,
.team-billing-step-pricing {
    margin-top: .25rem;
}

.team-billing-editor textarea,
.team-user-tab-content textarea {
    resize: none;
}

.team-moderation-panel,
.team-billing-panel-polished {
    background:
        radial-gradient(circle at top right, rgba(0, 233, 255, .08), transparent 20rem),
        linear-gradient(180deg, #fff, #fbfcfd);
}

.team-section-heading-hero {
    padding: 1.05rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(0, 233, 255, .12), rgba(15, 5, 107, .05)),
        #fff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
}

.team-decision-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
    gap: 1rem;
}

.team-decision-card,
.team-billing-section {
    padding: .82rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 5, 107, .04);
}

.team-decision-card.is-main {
    background: linear-gradient(180deg, #fff, rgba(0, 233, 255, .035));
}

.team-status-grid-polished {
    grid-template-columns: 1fr;
}

.team-status-grid-polished .team-status-choice {
    min-height: 74px;
    align-items: center;
    border-color: rgba(15, 5, 107, .09);
    background: linear-gradient(180deg, #fff, #fbfcfd);
}

.team-role-grid-polished {
    display: grid;
    gap: .6rem;
}

.team-role-choice {
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr);
    gap: .05rem .65rem;
    align-items: center;
    padding: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: linear-gradient(180deg, #fff, #fbfcfd);
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}

.team-role-choice:hover,
.team-role-choice:focus {
    border-color: var(--pt-primary);
    box-shadow: 0 12px 24px rgba(15, 5, 107, .08);
    transform: translateY(-1px);
}

.team-role-choice strong,
.team-role-choice small {
    grid-column: 2;
}

.team-role-choice small {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 700;
}

.team-role-dot {
    grid-row: span 2;
    width: 12px;
    height: 12px;
    border: 2px solid rgba(15, 5, 107, .28);
    border-radius: 999px;
}

.btn-check:checked + .team-role-choice {
    border-color: transparent;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    color: #fff;
    box-shadow: 0 14px 28px rgba(15, 5, 107, .16);
}

.btn-check:checked + .team-role-choice small {
    color: rgba(255, 255, 255, .82);
}

.btn-check:checked + .team-role-choice .team-role-dot {
    border-color: #fff;
    background: #fff;
}

.team-billing-command {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    align-items: center;
    gap: 1rem;
    padding: 1.15rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background:
        radial-gradient(circle at top right, rgba(0, 233, 255, .18), transparent 18rem),
        linear-gradient(135deg, rgba(15, 5, 107, .06), #fff);
    box-shadow: 0 18px 42px rgba(15, 5, 107, .075);
}

.team-billing-command > * {
    min-width: 0;
}

.team-billing-command-compact {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: .75rem;
    padding: .75rem;
    box-shadow: none;
    background:
        linear-gradient(135deg, rgba(0, 233, 255, .08), rgba(15, 5, 107, .035)),
        #fff;
}

.team-billing-command-icon {
    width: 58px;
    height: 58px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    font-size: 1.35rem;
    font-weight: 900;
}

.team-billing-command-compact .team-billing-command-icon {
    width: 40px;
    height: 40px;
    font-size: .98rem;
}

.team-billing-command h3 {
    font-size: 1.05rem;
    line-height: 1.2;
}

.team-billing-command .badge,
.team-stripe-card .badge,
.team-history-counters span {
    max-width: 100%;
    white-space: normal;
    text-align: center;
}

.team-billing-flow {
    display: grid;
    gap: 1rem;
}

.team-billing-flow-compact {
    grid-template-columns: minmax(0, 1fr);
    gap: .7rem;
}

.team-billing-section-main {
    grid-row: auto;
}

.team-plan-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(138px, 1fr));
    gap: .5rem;
}

.team-plan-choice {
    min-height: 76px;
    display: grid;
    align-content: start;
    gap: .2rem;
    padding: .62rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: linear-gradient(180deg, #fff, #fbfcfd);
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}

.team-plan-topline {
    display: flex;
    align-items: center;
    gap: .42rem;
}

.team-plan-choice span:not(.team-plan-mark):not(.team-plan-chip) {
    font-weight: 950;
}

.team-plan-mark {
    width: 24px;
    height: 24px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    border-radius: 8px;
    color: #0f056b;
    background: rgba(0, 233, 255, .12);
    font-size: .82rem;
    font-weight: 950;
}

.team-plan-choice small {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.25;
}

.team-plan-chip {
    width: fit-content;
    margin-top: .1rem;
    padding: .22rem .48rem;
    border-radius: 999px;
    color: #0f056b;
    background: rgba(15, 5, 107, .07);
    font-size: .7rem;
    font-weight: 900;
}

.team-plan-choice.is-premium {
    border-color: rgba(255, 193, 7, .42);
    background: linear-gradient(180deg, rgba(255, 193, 7, .12), #fff);
}

.team-plan-choice:hover,
.team-plan-choice:focus {
    border-color: var(--pt-primary);
    box-shadow: 0 8px 18px rgba(15, 5, 107, .08);
    transform: translateY(-1px);
}

.btn-check:checked + .team-plan-choice {
    border-color: transparent;
    color: #fff;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    box-shadow: 0 16px 32px rgba(15, 5, 107, .18);
}

.btn-check:checked + .team-plan-choice small {
    color: rgba(255, 255, 255, .84);
}

.btn-check:checked + .team-plan-choice .team-plan-mark,
.btn-check:checked + .team-plan-choice .team-plan-chip {
    color: #fff;
    background: rgba(255, 255, 255, .2);
}

.team-compact-control-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: .55rem;
}

.team-compact-control-grid > div {
    min-width: 0;
}

.team-note-wide {
    grid-column: 1 / -1;
}

.team-billing-section .form-control,
.team-billing-section .form-select {
    min-height: 38px;
    border-color: rgba(15, 5, 107, .12);
    background-color: #fff;
}

.team-safety-panel {
    min-height: 0 !important;
    display: grid;
    gap: .85rem;
}

.team-photo-actions {
    padding: .75rem;
    background: #fff;
}

.team-photo-action-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.team-photo-action-grid .team-grade-choice {
    min-height: 58px;
    padding: .62rem;
}

.team-safety-note {
    display: grid;
    gap: .35rem;
    width: 100%;
    font-weight: 900;
}

.team-subscription-panel,
.team-stripe-panel {
    min-height: 0 !important;
}

.team-subscription-board {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.team-subscription-card,
.team-stripe-control-card,
.team-payment-ledger-card {
    min-width: 0;
    display: grid;
    gap: .8rem;
    align-content: start;
    padding: .9rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(15, 5, 107, .035);
}

.team-subscription-card-head,
.team-stripe-control-card > header,
.team-payment-ledger-card > header {
    min-width: 0;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .75rem;
}

.team-subscription-card-head > div,
.team-stripe-control-card > header > div {
    min-width: 0;
    display: grid;
    gap: .05rem;
}

.team-subscription-card-head strong,
.team-stripe-control-card > header strong,
.team-payment-ledger-card > header strong {
    min-width: 0;
    overflow-wrap: anywhere;
    font-size: 1rem;
    line-height: 1.2;
}

.team-subscription-card-head small,
.team-stripe-control-card > header small {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 800;
}

.team-subscription-kind {
    color: var(--pt-primary-dark);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-subscription-mini-plans {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .35rem;
    padding: .3rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #f8fafc;
}

.team-subscription-mini-plans.is-four {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.team-subscription-mini-plans label {
    min-width: 0;
    display: grid;
    gap: .08rem;
    min-height: 54px;
    align-content: center;
    padding: .45rem;
    border-radius: 7px;
    color: var(--pt-ink);
    cursor: pointer;
    text-align: center;
    transition: background .15s ease, box-shadow .15s ease, color .15s ease;
}

.team-subscription-mini-plans label strong,
.team-subscription-mini-plans label span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-subscription-mini-plans label strong {
    font-size: .82rem;
}

.team-subscription-mini-plans label span {
    color: var(--pt-muted);
    font-size: .72rem;
    font-weight: 900;
}

.team-subscription-mini-plans .btn-check:checked + label {
    color: #fff;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    box-shadow: 0 8px 18px rgba(15, 5, 107, .16);
}

.team-subscription-mini-plans .btn-check:checked + label span {
    color: rgba(255, 255, 255, .86);
}

.team-subscription-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
}

.team-subscription-fields > * {
    min-width: 0;
}

.team-subscription-fields .form-control,
.team-subscription-fields .form-select {
    min-height: 38px;
}

.team-inline-check {
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .62rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfd;
    font-weight: 900;
}

.team-inline-check span {
    min-width: 0;
    display: grid;
    gap: .08rem;
}

.team-inline-check small {
    color: var(--pt-muted);
    font-size: .72rem;
    font-weight: 800;
}

.team-field-span {
    grid-column: 1 / -1;
}

.team-stripe-status-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .55rem;
}

.team-stripe-status-tile {
    min-width: 0;
    display: grid;
    gap: .12rem;
    padding: .72rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
}

.team-stripe-status-tile span {
    color: var(--pt-muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-stripe-status-tile strong {
    overflow-wrap: anywhere;
    font-size: 1rem;
}

.team-stripe-admin-layout,
.team-payment-ledger {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .85rem;
}

.team-stripe-kv {
    display: grid;
    gap: .38rem;
    margin: 0;
}

.team-stripe-kv div {
    min-width: 0;
    display: grid;
    grid-template-columns: 110px minmax(0, 1fr);
    gap: .65rem;
    padding: .46rem .55rem;
    border-radius: 7px;
    background: #fbfcfd;
}

.team-stripe-kv dt {
    color: var(--pt-muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-stripe-kv dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    font-weight: 800;
}

.team-stripe-health {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .4rem;
}

.team-stripe-health span {
    min-width: 0;
    padding: .45rem .55rem;
    border-radius: 999px;
    background: #eef2f4;
    color: #344043;
    font-size: .72rem;
    font-weight: 950;
    text-align: center;
}

.team-stripe-health .is-ok {
    background: rgba(25, 135, 84, .12);
    color: #146c43;
}

.team-stripe-health .is-waiting {
    background: rgba(255, 193, 7, .22);
    color: #806000;
}

.team-stripe-health .is-blocked {
    background: rgba(220, 53, 69, .12);
    color: #b02a37;
}

.team-payment-ledger-card > header span {
    min-width: 30px;
    min-height: 28px;
    display: inline-grid;
    place-items: center;
    padding: .12rem .45rem;
    border-radius: 999px;
    background: rgba(15, 5, 107, .07);
    color: #0f056b;
    font-size: .78rem;
    font-weight: 950;
}

.team-payment-list {
    display: grid;
    gap: .45rem;
    max-height: 360px;
    overflow-y: auto;
    padding-right: .25rem;
    scrollbar-width: thin;
}

.team-payment-row {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .65rem;
    align-items: start;
    padding: .62rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: linear-gradient(180deg, #fff, #fbfcfd);
}

.team-payment-row > div {
    min-width: 0;
    display: grid;
    gap: .08rem;
}

.team-payment-row strong,
.team-payment-row small {
    min-width: 0;
    overflow-wrap: anywhere;
}

.team-payment-row small {
    color: var(--pt-muted);
    font-size: .76rem;
    font-weight: 750;
    line-height: 1.25;
}

.team-cockpit {
    background:
        radial-gradient(circle at top left, rgba(0, 233, 255, .11), transparent 34rem),
        linear-gradient(180deg, #fbfaf7 0%, #f4f7f7 100%);
}

.team-shell {
    display: grid;
    grid-template-columns: minmax(260px, 330px) minmax(0, 1fr);
    gap: 1rem;
    align-items: start;
}

.team-rail {
    position: sticky;
    top: 92px;
    display: grid;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background:
        linear-gradient(152deg, rgba(0, 233, 255, .14), rgba(15, 5, 107, .06)),
        rgba(255, 255, 255, .92);
    box-shadow: 0 18px 45px rgba(33, 37, 41, .07);
}

.team-rail-brand {
    display: flex;
    align-items: center;
    gap: .8rem;
}

.team-rail-mark {
    width: 54px;
    height: 54px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: linear-gradient(152deg, #00e9ff, #0f056b);
    color: #fff;
    font-weight: 900;
    letter-spacing: 0;
}

.team-rail-copy {
    margin: 0;
    color: var(--pt-muted);
}

.team-module-menu {
    display: grid;
    gap: .55rem;
}

.team-rail-nav-item {
    width: 100%;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    padding: .75rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
    color: var(--pt-ink);
    text-align: left;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease, background .15s ease;
}

.team-rail-nav-item:hover,
.team-rail-nav-item:focus,
.team-rail-nav-item.active {
    border-color: rgba(0, 233, 255, .45);
    background: #f5fcfd;
    box-shadow: 0 12px 26px rgba(33, 37, 41, .07);
    color: var(--pt-ink);
    transform: translateY(-1px);
}

.team-rail-nav-item:disabled {
    cursor: not-allowed;
    opacity: .72;
    transform: none;
}

.team-rail-nav-icon {
    width: 44px;
    height: 44px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #eef9fb;
    font-size: 1.2rem;
}

.team-rail-nav-copy {
    min-width: 0;
    display: grid;
    gap: .05rem;
}

.team-rail-nav-copy strong,
.team-rail-nav-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-rail-nav-copy small {
    color: var(--pt-muted);
}

.team-rail-nav-count {
    min-width: 34px;
    min-height: 28px;
    display: inline-grid;
    place-items: center;
    padding: .2rem .45rem;
    border-radius: 999px;
    background: #f1f4f5;
    color: #263638;
    font-size: .85rem;
    font-weight: 900;
}

.team-rail-nav-count.has-alert {
    background: #dc3545;
    color: #fff;
}

.team-kpi-stack {
    display: grid;
    gap: .6rem;
}

.team-kpi-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    padding: .85rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
}

.team-kpi-card.is-primary {
    background: #f3fbfc;
}

.team-kpi-card span {
    color: var(--pt-muted);
    font-size: .86rem;
    font-weight: 800;
}

.team-kpi-card strong {
    font-size: 1.55rem;
    line-height: 1;
}

.team-support-cta {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    padding: .85rem;
    border: 1px solid rgba(15, 5, 107, .10);
    border-radius: 8px;
    background: #fff;
    color: var(--pt-ink);
    text-decoration: none;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.team-support-cta:hover,
.team-support-cta:focus {
    border-color: var(--pt-primary);
    box-shadow: 0 14px 30px rgba(33, 37, 41, .08);
    color: var(--pt-ink);
    transform: translateY(-1px);
}

.team-support-cta small {
    display: block;
    color: var(--pt-muted);
}

.team-support-icon {
    width: 44px;
    height: 44px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #eef9fb;
}

.team-workspace {
    min-width: 0;
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 22px 60px rgba(33, 37, 41, .08);
}

.team-workspace-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
}

.team-date-chip {
    display: inline-flex;
    align-items: center;
    min-height: 38px;
    padding: .35rem .65rem;
    border: 1px solid var(--pt-line);
    border-radius: 999px;
    background: #fbfaf7;
    color: var(--pt-muted);
    font-size: .85rem;
    font-weight: 800;
    white-space: nowrap;
}

.team-module-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
    margin-bottom: 1rem;
    padding: .35rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #f6f8f8;
}

.team-module-tabs .nav-item {
    min-width: 0;
}

.team-module-tab {
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: .55rem .75rem;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #344043;
    font-weight: 900;
    transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}

.team-module-tab.active,
.team-module-tab:hover,
.team-module-tab:focus {
    background: #fff;
    color: #0f056b;
    box-shadow: 0 10px 22px rgba(33, 37, 41, .06);
}

.team-command-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 360px);
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfc;
}

.team-command-search {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: .45rem;
    padding: .35rem .45rem .35rem .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 999px;
    background: #fff;
}

.team-command-search .form-control {
    min-height: 38px;
    padding-inline: .25rem;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.team-person-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 310px), 1fr));
    gap: .6rem;
}

.team-person-card {
    min-width: 0;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: .7rem;
    padding: .68rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    color: var(--pt-ink);
    text-align: left;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.team-person-card:hover,
.team-person-card:focus {
    border-color: var(--pt-primary);
    box-shadow: 0 16px 34px rgba(33, 37, 41, .08);
    transform: translateY(-1px);
}

.team-person-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
}

.team-person-card .team-user-avatar {
    width: 46px;
    height: 46px;
}

.team-person-main {
    min-width: 0;
    display: grid;
    gap: .08rem;
}

.team-person-name {
    overflow: hidden;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-person-email,
.team-person-city {
    overflow: hidden;
    color: var(--pt-muted);
    font-size: .86rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-person-card .team-grade-list {
    justify-content: flex-start;
    margin-top: .2rem;
}

.team-person-state {
    justify-self: end;
}

.team-person-state .badge {
    white-space: nowrap;
}

.team-activity-feed {
    display: grid;
    gap: .65rem;
}

.team-activity-item {
    width: 100%;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) auto;
    align-items: center;
    gap: .8rem;
    padding: .85rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    color: var(--pt-ink);
    text-decoration: none;
    text-align: left;
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.team-activity-item:hover,
.team-activity-item:focus {
    border-color: var(--pt-primary);
    box-shadow: 0 14px 30px rgba(33, 37, 41, .07);
    color: var(--pt-ink);
    transform: translateX(2px);
}

.team-activity-icon {
    width: 46px;
    height: 46px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #eef9fb;
}

.team-activity-main {
    min-width: 0;
    display: grid;
    gap: .12rem;
}

.team-activity-main strong,
.team-activity-main span,
.team-activity-main small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-activity-main span,
.team-activity-main small {
    color: var(--pt-muted);
}

.team-request-modal {
    border: 0;
    border-radius: 14px;
    box-shadow: 0 24px 70px rgba(15, 5, 107, .18);
}

.team-request-grid {
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
    gap: 1rem;
}

.team-request-panel {
    padding: 1rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfc;
}

.team-request-pet-list {
    display: grid;
    gap: .65rem;
}

.team-request-pet-card {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: .8rem;
    padding: .75rem;
    border: 1px solid rgba(33, 37, 41, .08);
    border-radius: 8px;
    background: #fff;
}

.team-request-pet-avatar {
    width: 64px;
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 8px;
    background: linear-gradient(152deg, rgba(0, 233, 255, .18), rgba(15, 5, 107, .12));
    color: var(--pt-primary-dark);
    font-size: 1.25rem;
    font-weight: 900;
}

.team-request-pet-avatar img,
.team-request-photo-grid img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.team-request-note {
    padding: .75rem;
    border: 1px solid rgba(0, 233, 255, .2);
    border-radius: 8px;
    background: #fff;
    color: var(--pt-ink);
}

.team-request-photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
    gap: .6rem;
}

.team-request-photo-grid img {
    aspect-ratio: 1;
    border-radius: 8px;
    border: 1px solid var(--pt-line);
    background: #fff;
}

.min-w-0 {
    min-width: 0;
}

@media (min-width: 992px) {
    .pricing-hero-panel {
        grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
        align-items: center;
    }
}

/* Team cockpit user management refresh */
.team-record-list {
    gap: .85rem;
}

.team-record[data-team-item="users"] {
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 20px;
    background: rgba(255, 253, 250, .86);
    box-shadow: 0 16px 34px rgba(20, 36, 58, .07);
    overflow: hidden;
}

.team-record[data-team-item="users"] .team-record-summary {
    grid-template-columns: auto minmax(220px, 1.4fr) minmax(180px, .9fr) auto;
    gap: 1rem;
    align-items: center;
    padding: 1rem;
}

.team-record[data-team-item="users"][open] .team-record-summary {
    border-bottom: 1px solid rgba(20, 36, 58, .08);
    background: linear-gradient(180deg, rgba(255, 247, 239, .72), rgba(255, 253, 250, .92));
}

.team-record[data-team-item="users"] .team-user-avatar {
    width: 58px;
    height: 58px;
}

.team-user-card-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem .7rem;
    margin-top: .25rem;
    color: #6f7788;
    font-size: .78rem;
    font-weight: 800;
}

.team-user-card-meta .material-symbols-rounded {
    margin-right: .1rem;
    color: #c28d62;
    font-size: .95rem;
    vertical-align: -.18rem;
}

.team-record[data-team-item="users"] .team-record-badges {
    justify-content: flex-start;
}

.team-status-badge {
    justify-self: end;
    min-width: 112px;
    padding: .48rem .7rem;
    text-align: center;
}

.team-row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
    align-items: center;
}

.team-report-message {
    padding: 1rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 16px;
    background: rgba(255, 248, 240, .74);
}

.team-report-message strong {
    display: block;
    margin-bottom: .45rem;
    color: #14243a;
}

.team-report-message p {
    margin: 0;
    color: #364256;
}

@media (max-width: 991.98px) {
    .team-record[data-team-item="users"] .team-record-summary {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .team-record[data-team-item="users"] .team-record-badges,
    .team-record[data-team-item="users"] .team-status-badge {
        grid-column: 1 / -1;
        justify-self: stretch;
    }
}

.availability-badge {
    border: 1px solid transparent;
    color: #25322f;
    font-weight: 600;
}

.availability-badge-available,
.availability-dot-available,
.availability-day.is-available {
    background: #dff3e7;
    border-color: #b9ddc7;
}

.availability-badge-unavailable,
.availability-dot-unavailable,
.availability-day.is-unavailable {
    background: #f8dddd;
    border-color: #ecc0c0;
}

.availability-badge-booked,
.availability-dot-booked,
.availability-day.is-booked {
    background: #fff2bd;
    border-color: #ead88f;
}

.availability-badge-full,
.availability-dot-full,
.availability-day.is-full {
    background: #ffd9b3;
    border-color: #edb77c;
}

.availability-month {
    text-align: center;
    text-transform: capitalize;
}

.availability-calendar-nav {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) 42px;
    align-items: center;
    gap: .75rem;
}

.availability-calendar-nav .btn {
    width: 42px;
    min-height: 38px;
    padding-inline: 0;
}

.availability-calendar {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: .45rem;
}

.availability-weekday {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

.availability-empty {
    min-height: 74px;
}

.availability-day {
    min-height: 74px;
    display: grid;
    align-content: space-between;
    justify-items: start;
    padding: .55rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    color: #21312e;
    text-align: left;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.availability-day:not(:disabled):hover,
.availability-day:not(:disabled):focus {
    border-color: var(--pt-primary);
    box-shadow: 0 8px 20px rgba(33, 37, 41, .08);
    transform: translateY(-1px);
}

.availability-day:disabled {
    cursor: not-allowed;
    opacity: 1;
}

.availability-day-number {
    font-weight: 800;
}

.availability-day-status {
    justify-self: stretch;
    font-size: .72rem;
    font-weight: 700;
    text-align: right;
    text-transform: uppercase;
}

.availability-legend {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem 1rem;
    color: var(--pt-muted);
    font-size: .86rem;
}

.availability-legend span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

.availability-dot {
    width: .7rem;
    height: .7rem;
    display: inline-block;
    border: 1px solid transparent;
    border-radius: 50%;
}

@media (min-width: 768px) {
    .section-band {
        padding: 4.5rem 0;
    }

    .sociability-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .container.py-5,
    main.container {
        padding-top: 1.5rem !important;
        padding-bottom: 1.5rem !important;
    }

    .surface.p-4,
    .modal-form-section {
        padding: 1rem !important;
    }

    .modal-header,
    .modal-footer {
        padding-inline: 1rem;
    }

    .profile-upload img,
    .profile-upload-placeholder {
        width: min(100%, 176px);
    }

    .pet-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .7rem;
    }

    .pet-card {
        min-height: 0;
        padding: .7rem;
    }

    .pet-card img,
    .pet-card-placeholder {
        aspect-ratio: 1;
    }

    .pet-card .small,
    .pet-card .text-muted {
        font-size: .78rem;
    }

    .pet-card-empty {
        min-height: 168px;
    }

    .pet-plus {
        width: 46px;
        height: 46px;
        font-size: 1.7rem;
    }

    .square-upload-feature {
        min-height: 190px;
    }

    .square-upload-feature .square-upload-preview {
        width: 92px;
        height: 92px;
    }

    .sociability-grid {
        gap: .55rem;
    }

    .registration-choice-card {
        grid-template-columns: 1fr auto;
    }

    .registration-choice-icon {
        grid-column: 1 / -1;
    }

    .registration-choice-text {
        font-size: .95rem;
    }

    .input-group .age-unit-select {
        flex-basis: 112px;
    }

    .availability-calendar {
        gap: .25rem;
    }

    .availability-empty,
    .availability-day {
        min-height: 58px;
    }

    .availability-day {
        padding: .35rem;
    }

    .availability-day-status {
        font-size: .62rem;
    }

    .support-hero {
        grid-template-columns: 1fr;
    }

    .support-hero-icon {
        width: 58px;
        height: 58px;
    }
}

@media (max-width: 991.98px) {
    .team-shell {
        grid-template-columns: 1fr;
    }

    .team-decision-layout,
    .team-billing-command,
    .team-billing-flow-compact,
    .team-plan-grid,
    .team-compact-control-grid,
    .team-stripe-grid,
    .team-profile-grid,
    .team-history-grid,
    .team-photo-action-grid,
    .team-subscription-board,
    .team-subscription-fields,
    .team-stripe-status-grid,
    .team-stripe-admin-layout,
    .team-payment-ledger,
    .team-stripe-health {
        grid-template-columns: 1fr;
    }

    .team-rail {
        position: static;
    }

    .team-kpi-stack {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .team-workspace-head,
    .team-command-bar {
        grid-template-columns: 1fr;
        display: grid;
    }

    .team-date-chip,
    .team-command-search {
        width: 100%;
    }

    .team-page-head,
    .team-section-head {
        grid-template-columns: 1fr;
        display: grid;
    }

    .team-page-head .btn,
    .team-search,
    .team-search-compact {
        width: 100%;
        max-width: none;
    }

    .team-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .team-modal-grid {
        grid-template-columns: 1fr;
    }

    .team-grade-editor-grid,
    .team-request-grid {
        grid-template-columns: 1fr;
    }

    .team-request-pet-card {
        grid-template-columns: 54px minmax(0, 1fr);
    }

    .team-request-pet-avatar {
        width: 54px;
    }

    .registration-choice-hero {
        grid-template-columns: 1fr;
    }

    .registration-choice-visual {
        justify-self: start;
    }

    .messenger-shell,
    .conversation-layout {
        grid-template-columns: 1fr;
    }

    .messenger-shell.has-selected-thread .messenger-list-panel {
        display: none;
    }

    .messenger-shell.has-selected-thread .messenger-detail-panel {
        display: block;
    }

    .messenger-shell.has-selected-thread {
        min-height: 0;
    }

    .conversation-mobile-back {
        display: inline-flex;
        align-items: center;
        gap: .4rem;
        padding: .85rem 1rem;
        border-bottom: 1px solid var(--pt-line);
        color: var(--pt-primary-dark);
        font-size: .9rem;
        font-weight: 800;
        text-decoration: none;
        background: #fff;
    }

    .conversation-mobile-back:hover,
    .conversation-mobile-back:focus {
        color: var(--pt-primary);
    }

    .messenger-conversation.is-embedded {
        min-height: calc(100vh - 120px);
    }

    .conversation-layout {
        grid-template-rows: auto auto;
    }

    .conversation-chat {
        min-height: 62vh;
    }

    .messenger-empty-panel {
        display: none;
    }

    .conversation-side {
        border-left: 0;
        border-top: 1px solid var(--pt-line);
    }

    .search-toolbar,
    .search-toolbar:has(.search-request-select),
    .search-row,
    .history-filters,
    .history-card-head,
    .compact-proposal-form,
    .compact-message-form {
        grid-template-columns: 1fr;
    }

    .history-card-head {
        display: grid;
    }

    .history-filter,
    .history-reset {
        width: 100%;
    }

    .history-facts {
        grid-template-columns: 1fr;
    }

    .history-actions {
        justify-content: flex-start;
    }

    .history-card-tools {
        justify-content: flex-start;
    }

    .search-row {
        align-items: start;
    }

    .search-actions,
    .search-actions-wide {
        justify-content: stretch;
        min-width: 0;
    }

    .search-actions .btn,
    .compact-proposal-form .btn,
    .compact-message-form .btn {
        width: 100%;
    }

    .support-ticket-button {
        grid-template-columns: 1fr;
        align-items: start;
    }

    .support-ticket-badges {
        justify-content: flex-start;
    }

    .support-ticket-dialog {
        width: min(960px, calc(100vw - 1rem));
    }

    .support-ticket-modal {
        min-height: calc(100vh - 1rem);
    }

    .support-ticket-layout {
        min-height: 0;
        grid-template-columns: 1fr;
    }

    .support-chat-panel {
        min-height: 560px;
    }

    .support-management-panel {
        grid-template-rows: auto;
    }

    .support-internal-note textarea {
        min-height: 180px;
    }

    .support-page-head {
        display: grid;
    }

    .support-page-head .btn {
        width: 100%;
    }

    .support-message-bubble {
        max-width: 94%;
    }
}

@media (max-width: 767.98px) {
    .billing-hero,
    .billing-connect-heading {
        display: grid;
    }

    .billing-connect-badges {
        justify-content: flex-start;
        min-width: 0;
    }

    .billing-status-grid {
        grid-template-columns: 1fr;
    }

    .billing-status-card {
        min-height: 0;
    }
}

@media (max-width: 575.98px) {
    .support-ticket-dialog {
        width: calc(100vw - .5rem);
        margin: .25rem auto;
    }

    .support-ticket-body {
        padding: .75rem;
    }

    .support-chat-panel {
        min-height: 500px;
    }

    .support-chat-actions .btn {
        width: 100%;
    }
}

@media (max-width: 575.98px) {
    .team-workspace,
    .team-rail {
        padding: .85rem;
    }

    .team-subscription-mini-plans,
    .team-subscription-mini-plans.is-four {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .team-rail-brand {
        align-items: flex-start;
    }

    .team-kpi-stack,
    .team-module-tabs,
    .team-activity-item,
    .history-card,
    .history-hero {
        grid-template-columns: 1fr;
    }

    .history-hero {
        display: grid;
    }

    .team-person-card {
        grid-template-columns: 46px minmax(0, 1fr);
    }

    .team-person-state {
        grid-column: 2;
        justify-self: start;
    }

    .team-module-tab {
        justify-content: flex-start;
    }

    .team-activity-item .badge {
        justify-self: start;
    }

    .team-stat-grid,
    .team-user-card,
    .team-mini-card,
    .team-status-grid,
    .team-detail-list div {
        grid-template-columns: 1fr;
    }

    .team-user-side,
    .team-grade-list {
        justify-items: start;
        justify-content: flex-start;
    }
}

.team-cockpit-dense {
    min-height: calc(100vh - 73px);
}

.team-shell-dense {
    grid-template-columns: minmax(250px, 310px) minmax(0, 1fr);
    gap: .85rem;
}

.team-workspace-dense {
    min-height: calc(100vh - 8.5rem);
    padding: .85rem;
}

.team-workspace-head-dense {
    margin-bottom: .75rem;
}

.team-dashboard-board {
    display: grid;
    gap: .75rem;
}

.team-dashboard-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(0, 233, 255, .08), rgba(15, 5, 107, .035)),
        #fff;
}

.team-dashboard-topline strong {
    display: block;
    line-height: 1;
}

.team-dashboard-health {
    min-height: 34px;
    display: inline-grid;
    place-items: center;
    padding: .32rem .68rem;
    border-radius: 999px;
    background: rgba(25, 135, 84, .12);
    color: #146c43;
    font-size: .78rem;
    font-weight: 950;
}

.team-dashboard-health.is-warning {
    background: rgba(255, 193, 7, .22);
    color: #806000;
}

.team-dashboard-health.is-danger {
    background: rgba(220, 53, 69, .12);
    color: #b02a37;
}

.team-ops-kpi-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .55rem;
    margin-bottom: .75rem;
}

.team-ops-kpi-grid article {
    min-width: 0;
    display: grid;
    gap: .05rem;
    padding: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfc;
}

.team-ops-kpi-grid span,
.team-ops-kpi-grid small {
    color: var(--pt-muted);
    font-size: .76rem;
    font-weight: 850;
}

.team-ops-kpi-grid strong {
    font-size: 1.45rem;
    line-height: 1;
}

.team-module-content-dense {
    min-width: 0;
}

.team-command-bar-dense {
    grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
    margin-bottom: .65rem;
    padding: .75rem;
}

.team-command-bar-compact {
    grid-template-columns: minmax(240px, 460px) auto;
    justify-content: space-between;
    padding: .5rem;
    margin-bottom: .5rem;
}

.team-command-bar-compact .team-command-search {
    max-width: 460px;
}

.team-command-bar-compact > .badge {
    justify-self: end;
    align-self: center;
}

.team-dashboard-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .95fr) minmax(0, .95fr);
    gap: .75rem;
}

.team-dashboard-panel {
    min-width: 0;
    display: grid;
    gap: .62rem;
    align-content: start;
    padding: .75rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.team-dashboard-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .65rem;
}

.team-dashboard-panel-head strong {
    font-size: .95rem;
    line-height: 1.2;
}

.team-dashboard-panel-head > span {
    min-width: 30px;
    min-height: 28px;
    display: inline-grid;
    place-items: center;
    padding: .12rem .45rem;
    border-radius: 999px;
    background: rgba(15, 5, 107, .07);
    color: #0f056b;
    font-size: .78rem;
    font-weight: 950;
}

.team-dashboard-action-list,
.team-dashboard-mini-list {
    display: grid;
    gap: .45rem;
}

.team-dashboard-action {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .75rem;
    padding: .62rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfd;
    color: var(--pt-ink);
    text-align: left;
}

.team-dashboard-action:hover,
.team-dashboard-action:focus {
    border-color: var(--pt-primary);
    background: #f1fbfd;
}

.team-dashboard-action span {
    color: var(--pt-muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-dashboard-action strong {
    font-size: .88rem;
}

.team-dashboard-mini-list {
    max-height: 300px;
    overflow-y: auto;
    padding-right: .2rem;
    scrollbar-width: thin;
}

.team-dashboard-mini-list > div {
    min-width: 0;
    display: grid;
    gap: .06rem;
    padding: .55rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfd;
}

.team-dashboard-mini-list strong,
.team-dashboard-mini-list small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-dashboard-mini-list small {
    color: var(--pt-muted);
    font-size: .76rem;
    font-weight: 750;
}

.team-record-list {
    display: grid;
    gap: .48rem;
    max-height: calc(100vh - 18rem);
    overflow: auto;
    padding-right: .25rem;
    scrollbar-width: thin;
}

.team-record {
    min-width: 0;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 8px 18px rgba(33, 37, 41, .035);
}

.team-record[open] {
    border-color: rgba(0, 233, 255, .35);
    box-shadow: 0 14px 32px rgba(15, 5, 107, .075);
}

.team-record-summary {
    min-width: 0;
    display: grid;
    grid-template-columns: 42px minmax(210px, 1.2fr) minmax(120px, .7fr) minmax(92px, .45fr) minmax(160px, .75fr) auto;
    gap: .65rem;
    align-items: center;
    padding: .62rem .72rem;
    cursor: pointer;
    list-style: none;
}

.team-record-summary::-webkit-details-marker {
    display: none;
}

.team-record-summary::after {
    content: "+";
    justify-self: end;
    width: 26px;
    height: 26px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: #eef9fb;
    color: #0f056b;
    font-weight: 950;
}

.team-record[open] > .team-record-summary::after {
    content: "-";
}

.team-record-summary-request {
    grid-template-columns: minmax(220px, 1.1fr) minmax(180px, .8fr) minmax(100px, .45fr) minmax(110px, .45fr) auto;
}

.team-record-main {
    min-width: 0;
    display: grid;
    gap: .05rem;
}

.team-record-main strong,
.team-record-main small,
.team-record-meta {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-record-main small,
.team-record-meta {
    color: var(--pt-muted);
    font-size: .82rem;
    font-weight: 750;
}

.team-record-badges {
    min-width: 0;
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
}

.team-record-body {
    display: grid;
    gap: .7rem;
    padding: .75rem;
    border-top: 1px solid var(--pt-line);
    background: #fbfcfc;
}

.team-inline-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .65rem;
}

.team-inline-panel {
    min-width: 0;
    display: grid;
    gap: .55rem;
    align-content: start;
    padding: .72rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
}

.team-inline-panel h4 {
    margin: 0;
    font-size: .9rem;
    font-weight: 950;
}

.team-inline-details {
    display: grid;
    gap: .32rem;
    margin: 0;
}

.team-inline-details div {
    min-width: 0;
    display: grid;
    grid-template-columns: 88px minmax(0, 1fr);
    gap: .55rem;
    padding-bottom: .32rem;
    border-bottom: 1px solid rgba(33, 37, 41, .06);
}

.team-inline-details div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.team-inline-details dt {
    color: var(--pt-muted);
    font-size: .68rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-inline-details dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    font-size: .82rem;
    font-weight: 750;
}

.team-inline-controls {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .55rem;
}

.team-inline-controls > * {
    min-width: 0;
}

.team-inline-controls .form-control,
.team-inline-controls .form-select {
    min-height: 38px;
}

.team-inline-roles,
.team-inline-checks {
    display: grid;
    gap: .28rem;
}

.team-inline-roles {
    max-height: 146px;
    overflow: auto;
    padding: .52rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfd;
}

.team-inline-roles .form-check,
.team-inline-checks .form-check {
    margin: 0;
}

.team-inline-checks {
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.team-inline-switch {
    min-height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .55rem;
    padding: .45rem .55rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfd;
    font-size: .82rem;
    font-weight: 850;
}

.team-record-actions {
    display: flex;
    justify-content: flex-end;
}

.team-inline-pet-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: .45rem;
}

.team-inline-pet-grid article {
    min-width: 0;
    display: grid;
    gap: .08rem;
    padding: .52rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfd;
}

.team-inline-pet-grid strong,
.team-inline-pet-grid small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-inline-pet-grid small {
    color: var(--pt-muted);
    font-size: .76rem;
    font-weight: 750;
}

.team-inline-note {
    max-height: 120px;
    overflow: auto;
    margin: 0;
    padding: .62rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fbfcfd;
}

.team-inline-photo-strip {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
    gap: .4rem;
}

.team-inline-photo-strip img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 8px;
}

.team-data-table-wrap {
    max-height: calc(100vh - 18rem);
    overflow: auto;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.team-data-table {
    width: 100%;
    min-width: 880px;
    border-collapse: collapse;
}

.team-data-table th,
.team-data-table td {
    padding: .68rem .78rem;
    border-bottom: 1px solid var(--pt-line);
    vertical-align: middle;
}

.team-data-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    color: var(--pt-muted);
    background: #f8fafc;
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-data-table td small {
    display: block;
    color: var(--pt-muted);
    font-size: .76rem;
}

.team-mono-cell {
    max-width: 280px;
    overflow-wrap: anywhere;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: .72rem;
}

.team-maintenance-console {
    display: grid;
    gap: .75rem;
    padding: .85rem;
    border: 1px solid var(--pt-line);
    border-radius: 8px;
    background: #fff;
}

.team-maintenance-state {
    min-width: 0;
    display: grid;
    grid-template-columns: 14px minmax(0, 1fr);
    gap: .75rem;
    align-items: start;
    padding: .85rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fbfcfd;
}

.team-maintenance-state > span {
    width: 12px;
    height: 12px;
    margin-top: .34rem;
    border-radius: 999px;
    background: #20c997;
    box-shadow: 0 0 0 5px rgba(32, 201, 151, .12);
}

.team-maintenance-state > span.is-warning {
    background: #ffc107;
    box-shadow: 0 0 0 5px rgba(255, 193, 7, .16);
}

.team-maintenance-state > span.is-danger {
    background: #dc3545;
    box-shadow: 0 0 0 5px rgba(220, 53, 69, .14);
}

.team-maintenance-state strong,
.team-maintenance-state small {
    display: block;
    min-width: 0;
    overflow-wrap: anywhere;
}

.team-maintenance-state small {
    color: var(--pt-muted);
    font-weight: 750;
}

.team-maintenance-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.team-maintenance-form > * {
    min-width: 0;
}

.team-maintenance-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    justify-content: flex-end;
}

@media (max-width: 1199.98px) {
    .team-inline-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .team-dashboard-grid {
        grid-template-columns: 1fr;
    }

    .team-ops-kpi-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .team-record-summary,
    .team-record-summary-request {
        grid-template-columns: 42px minmax(0, 1fr) auto;
    }

    .team-record-summary-request {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .team-record-summary > .team-record-meta,
    .team-record-summary > .team-record-badges {
        display: none;
    }
}

@media (max-width: 991.98px) {
    .team-shell-dense {
        grid-template-columns: 1fr;
    }

    .team-workspace-dense {
        min-height: 0;
    }

    .team-record-list,
    .team-data-table-wrap {
        max-height: none;
    }
}

@media (max-width: 575.98px) {
    .team-ops-kpi-grid,
    .team-inline-grid,
    .team-inline-controls,
    .team-inline-checks,
    .team-maintenance-form {
        grid-template-columns: 1fr;
    }

    .team-command-bar-dense {
        grid-template-columns: 1fr;
    }

    .team-command-bar-compact {
        justify-content: stretch;
    }

    .team-command-bar-compact .team-command-search {
        max-width: none;
    }

    .team-dashboard-topline {
        display: grid;
    }

    .team-record-summary,
    .team-record-summary-request {
        padding: .58rem;
    }
}

.login-help-link {
    opacity: .82;
    transition: opacity .18s ease, color .18s ease;
}

.login-help-link:hover,
.login-help-link:focus {
    color: var(--bs-primary) !important;
    opacity: 1;
}

.login-help-icon {
    display: inline-grid;
    width: 1.1rem;
    height: 1.1rem;
    place-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1;
}

.password-field {
    position: relative;
}

.password-field .form-control {
    padding-right: 3rem;
}

.password-toggle-btn {
    position: absolute;
    top: 50%;
    right: .55rem;
    display: inline-grid;
    width: 2.15rem;
    height: 2.15rem;
    place-items: center;
    padding: 0;
    color: #6f6a63;
    background: transparent;
    border: 0;
    border-radius: 999px;
    transform: translateY(-50%);
    transition: color .18s ease, background-color .18s ease;
}

.password-toggle-btn:hover,
.password-toggle-btn:focus {
    color: var(--pt-primary);
    background: rgba(37, 111, 104, .09);
}

/* Production polish */
body {
    background:
        radial-gradient(circle at 12% 0%, rgba(0, 207, 232, .10), transparent 30rem),
        radial-gradient(circle at 88% 12%, rgba(217, 122, 63, .08), transparent 28rem),
        linear-gradient(180deg, #fbfaf7 0%, #f8fbfc 48%, #fbfaf7 100%);
    background-attachment: fixed;
}

.navbar {
    box-shadow: 0 12px 32px rgba(15, 5, 107, .055);
}

.navbar-brand {
    color: #102f2c;
    letter-spacing: .01em;
}

.brand-mark {
    width: 2.35rem;
    height: 2.35rem;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .22), transparent 42%),
        linear-gradient(152deg, #00cfe8, #256f68 48%, #0f056b);
    box-shadow: 0 12px 26px rgba(15, 5, 107, .18);
}

.brand-mark svg {
    width: 1.45rem;
    height: 1.45rem;
    fill: currentColor;
}

.brand-mark-sm {
    width: 1.95rem;
    height: 1.95rem;
}

.brand-mark-sm svg {
    width: 1.15rem;
    height: 1.15rem;
}

.brand-logo {
    display: block;
    width: auto;
    height: 42px;
    max-width: min(220px, 52vw);
    object-fit: contain;
}

.footer-brand-icon {
    width: 2rem;
    height: 2rem;
    object-fit: contain;
    border-radius: 8px;
}

.nav-link {
    display: inline-flex;
    align-items: center;
    gap: .38rem;
    border-radius: 8px;
    font-weight: 700;
}

.nav-link:hover,
.nav-link:focus {
    background: rgba(0, 207, 232, .09);
    color: #0f056b;
}

.nav-link-icon {
    width: 1.42rem;
    height: 1.42rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    place-items: center;
    border-radius: 7px;
    color: #0f056b;
    background: rgba(0, 207, 232, .12);
    font-size: 1rem;
    line-height: 1;
    font-variation-settings: "FILL" 0, "wght" 500, "GRAD" 0, "opsz" 24;
}

.surface {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .96), rgba(255, 255, 255, .9)) padding-box,
        linear-gradient(135deg, rgba(0, 207, 232, .18), rgba(15, 5, 107, .08)) border-box;
    border-color: transparent;
    box-shadow: 0 18px 42px rgba(15, 5, 107, .055);
}

.section-kicker {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    letter-spacing: .08em;
}

.section-kicker::before {
    content: "";
    width: .55rem;
    height: .55rem;
    border-radius: 3px;
    background: linear-gradient(152deg, #00cfe8, #0f056b);
    box-shadow: 0 0 0 4px rgba(0, 207, 232, .12);
}

.badge-soft {
    color: #0f3f4b;
    background: linear-gradient(135deg, rgba(0, 207, 232, .14), rgba(217, 122, 63, .10));
    border-color: rgba(0, 207, 232, .28);
}

.btn {
    font-weight: 800;
}

.btn-primary,
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-check:checked + .btn-outline-primary {
    box-shadow: 0 14px 30px rgba(15, 5, 107, .18);
}

.hero {
    min-height: min(760px, 78vh);
}

.hero::after {
    background:
        linear-gradient(90deg, rgba(251, 250, 247, .88), rgba(251, 250, 247, .45), rgba(251, 250, 247, .08)),
        linear-gradient(180deg, transparent 70%, var(--pt-bg) 100%);
}

.hero-signal-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    gap: .65rem;
    max-width: 640px;
}

.hero-signal-grid span {
    display: grid;
    gap: .1rem;
    min-height: 66px;
    padding: .72rem .85rem;
    border: 1px solid rgba(15, 5, 107, .1);
    border-radius: 8px;
    background: rgba(255, 255, 255, .68);
    box-shadow: 0 16px 34px rgba(15, 5, 107, .075);
    backdrop-filter: blur(10px);
}

.hero-signal-grid strong {
    color: #123d38;
    font-size: .88rem;
}

.feature-ribbon {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
}

.feature-ribbon article,
.billing-proof-grid article {
    display: grid;
    gap: .35rem;
    min-width: 0;
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .09);
    border-radius: 8px;
    background: rgba(255, 255, 255, .88);
    box-shadow: 0 16px 34px rgba(15, 5, 107, .055);
}

.feature-ribbon-icon,
.billing-proof-grid article > span {
    width: 2.15rem;
    height: 2.15rem;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(152deg, #00cfe8, #256f68 52%, #0f056b);
    font-size: .82rem;
    font-weight: 900;
}

.feature-ribbon strong,
.billing-proof-grid strong {
    color: #172033;
    font-size: 1rem;
}

.feature-ribbon small,
.billing-proof-grid small {
    color: var(--pt-muted);
    line-height: 1.4;
}

.dashboard-hub {
    padding: 1rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: rgba(255, 255, 255, .72);
    box-shadow: 0 18px 42px rgba(15, 5, 107, .055);
    backdrop-filter: blur(10px);
}

.dashboard-category-header h2::after {
    content: "";
    display: block;
    width: 2.6rem;
    height: 3px;
    margin-top: .45rem;
    border-radius: 999px;
    background: linear-gradient(90deg, #00cfe8, #d97a3f);
}

.action-tile {
    isolation: isolate;
    overflow: hidden;
}

.action-tile::after {
    content: "";
    position: absolute;
    inset: auto -20% -40% 30%;
    height: 82%;
    z-index: -1;
    background: linear-gradient(135deg, rgba(255, 255, 255, .28), transparent 66%);
    transform: rotate(-8deg);
}

.action-tile-icon {
    width: 4.7rem;
    min-height: 4.7rem;
    border-radius: 8px;
    background: rgba(255, 255, 255, .16);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28);
    font-size: 2.45rem;
}

.dashboard-notification-panel {
    border-color: rgba(217, 122, 63, .24);
}

.dashboard-notification-header {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .18), transparent),
        linear-gradient(135deg, #d97a3f, #ff6653);
}

.billing-hero {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .88), rgba(255, 255, 255, .66)) padding-box,
        linear-gradient(135deg, rgba(0, 207, 232, .35), rgba(217, 122, 63, .22), rgba(15, 5, 107, .25)) border-box;
    box-shadow: 0 18px 42px rgba(15, 5, 107, .06);
}

.billing-plan-card::before {
    content: "";
    position: absolute;
    inset: 0 0 auto;
    height: 4px;
    background: linear-gradient(90deg, #00cfe8, #d97a3f, #0f056b);
}

.billing-benefits li::before {
    background: linear-gradient(152deg, #00cfe8, #256f68);
    color: #fff;
}

.billing-proof-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
}

.site-footer {
    padding: 1.5rem 0;
    border-top: 1px solid rgba(15, 5, 107, .08);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, .76)),
        #f8fbfc;
}

.site-footer-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: var(--pt-muted);
    font-size: .92rem;
}

.site-footer-brand,
.site-footer-links {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .85rem;
}

.site-footer a {
    color: #314642;
    font-weight: 700;
    text-decoration: none;
}

.site-footer a:hover,
.site-footer a:focus {
    color: #0f056b;
    text-decoration: underline;
}

.avatar-frame,
.subscription-frame {
    position: relative;
    isolation: isolate;
    border-radius: 50%;
}

.avatar-frame {
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    width: 86px;
    height: 86px;
    overflow: hidden;
}

.avatar-frame > .avatar {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

.subscription-frame {
    overflow: hidden !important;
}

.subscription-frame > img,
.avatar-frame > img {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    border-radius: 50%;
}

.avatar-frame::after,
.subscription-frame::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    pointer-events: none;
    background-position: center;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-radius: 50%;
}

.avatar-frame.is-premium::after,
.subscription-frame.is-premium::after {
    background-image: url("/images/brand/avatar-ornament-premium.png");
}

.avatar-frame.is-vip::after,
.subscription-frame.is-vip::after {
    background-image: url("/images/brand/avatar-ornament-vip.png");
}

.search-row-icon.profile-avatar {
    overflow: hidden;
    border-radius: 50%;
}

.search-row-icon.profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.thread-avatar.subscription-frame img,
.team-user-avatar.subscription-frame img {
    border-radius: 50%;
}

.rating-stars {
    display: inline-flex;
    align-items: center;
    gap: .42rem;
    min-width: 0;
    color: #5c5142;
    font-size: .9rem;
    font-weight: 850;
    line-height: 1.15;
    vertical-align: middle;
}

.rating-stars-icons {
    display: inline-flex;
    align-items: center;
    gap: .04rem;
    color: #d9d3c8;
    letter-spacing: 0;
    white-space: nowrap;
}

.rating-stars-icons .material-symbols-rounded {
    font-size: 1.05em;
    line-height: 1;
    font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 20;
}

.rating-stars-icons .is-filled {
    color: #f5b928;
    text-shadow: 0 1px 0 rgba(73, 52, 9, .18);
}

.rating-stars-icons .is-half {
    color: transparent;
    background: linear-gradient(90deg, #f5b928 0 50%, #d9d3c8 50% 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none;
}

.rating-stars-icons .is-empty {
    color: #d9d3c8;
    font-variation-settings: "FILL" 0, "wght" 700, "GRAD" 0, "opsz" 20;
}

.rating-stars-label {
    overflow: hidden;
    color: var(--pt-muted);
    font-size: .86em;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.rating-stars-compact {
    gap: .28rem;
    font-size: .82rem;
}

.team-record-badges .rating-stars {
    max-width: 156px;
    padding: .12rem .45rem;
    border: 1px solid rgba(245, 185, 40, .26);
    border-radius: 999px;
    background: rgba(255, 247, 216, .72);
}

.guardian-public-page {
    background:
        radial-gradient(circle at 12% 12%, rgba(0, 207, 232, .10), transparent 28rem),
        radial-gradient(circle at 88% 10%, rgba(239, 125, 103, .10), transparent 30rem);
}

.guardian-public-hero {
    padding: 3rem 0 1.25rem;
}

.guardian-public-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.15rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 18px 42px rgba(15, 5, 107, .06);
    backdrop-filter: blur(12px);
}

.guardian-public-identity {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.guardian-public-avatar {
    width: 112px;
    height: 112px;
}

.guardian-public-identity h1 {
    margin: 0 0 .35rem;
    color: #102f2c;
    font-size: clamp(2rem, 5vw, 3.5rem);
    line-height: 1;
}

.guardian-public-meta {
    display: inline-flex;
    align-items: center;
    gap: .28rem;
    margin-bottom: .45rem;
    color: var(--pt-muted);
    font-weight: 780;
}

.guardian-public-meta .material-symbols-rounded {
    font-size: 1.1rem;
}

.guardian-public-cta {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .55rem;
}

.guardian-public-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 360px);
    gap: 1rem;
    align-items: start;
}

.guardian-public-main,
.guardian-public-side {
    display: grid;
    gap: 1rem;
}

.guardian-public-copy {
    display: grid;
    gap: .8rem;
}

.guardian-public-copy h3 {
    margin: .35rem 0 0;
    font-size: 1rem;
    font-weight: 950;
}

.guardian-public-copy p {
    margin: 0;
    color: #314642;
    line-height: 1.65;
}

.guardian-rate-list,
.guardian-review-list,
.guardian-facts {
    display: grid;
    gap: .65rem;
}

.guardian-rate-item {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
    align-items: center;
    padding: .8rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fbfcfd;
}

.guardian-rate-item strong,
.guardian-rate-item small {
    display: block;
}

.guardian-rate-item small {
    color: var(--pt-muted);
    font-weight: 750;
}

.guardian-rate-item p {
    grid-column: 1 / -1;
    margin: 0;
    color: #455350;
    font-size: .9rem;
}

.guardian-rate-price {
    text-align: right;
}

.guardian-rate-price strong {
    color: #102f2c;
    font-size: 1.05rem;
}

.guardian-rate-price span {
    color: var(--pt-muted);
    font-size: .78rem;
    font-weight: 800;
}

.guardian-review-item {
    display: grid;
    gap: .4rem;
    padding: .82rem;
    border: 1px solid rgba(15, 5, 107, .08);
    border-radius: 8px;
    background: #fff;
}

.guardian-review-item p {
    margin: 0;
    color: #314642;
}

.guardian-review-item small {
    color: var(--pt-muted);
    font-weight: 750;
}

.guardian-facts {
    margin: 0;
}

.guardian-facts div {
    display: grid;
    gap: .1rem;
    padding-bottom: .52rem;
    border-bottom: 1px solid rgba(33, 37, 41, .07);
}

.guardian-facts div:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.guardian-facts dt {
    color: var(--pt-muted);
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.guardian-facts dd {
    margin: 0;
    color: #102f2c;
    font-weight: 850;
}

.guardian-public-gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .45rem;
}

.guardian-public-gallery img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 8px;
}

@media (max-width: 767.98px) {
    .feature-ribbon,
    .billing-proof-grid {
        grid-template-columns: 1fr;
    }

    .hero {
        min-height: 72vh;
    }

    .hero-signal-grid {
        grid-template-columns: 1fr;
    }

    .site-footer-inner {
        align-items: flex-start;
        flex-direction: column;
    }

    .brand-logo {
        height: 34px;
        max-width: min(180px, 58vw);
    }

    .guardian-public-header,
    .guardian-public-identity {
        align-items: flex-start;
        flex-direction: column;
    }

    .guardian-public-avatar {
        width: 96px;
        height: 96px;
    }

    .guardian-public-cta,
    .guardian-public-cta .btn {
        width: 100%;
    }

    .guardian-public-grid {
        grid-template-columns: 1fr;
    }

    .guardian-rate-item {
        grid-template-columns: 1fr;
    }

    .guardian-rate-price {
        text-align: left;
    }
}

.app-container {
    width: min(100% - 2rem, 1680px);
    max-width: 1680px;
}

@media (min-width: 1400px) {
    .app-container {
        width: min(100% - 3rem, 1760px);
        max-width: 1760px;
    }
}

.app-container .dashboard-hub {
    padding: .85rem;
}

.app-container .action-tile-grid {
    grid-template-columns: repeat(auto-fill, minmax(132px, 1fr));
    gap: .65rem;
}

.app-container .action-tile {
    min-height: 128px;
    padding: .75rem;
}

.app-container .action-tile-icon {
    width: 3.55rem;
    min-height: 3.55rem;
    font-size: 1.9rem;
}

.app-container .action-tile-title {
    font-size: .98rem;
}

@media (max-width: 575.98px) {
    .app-container {
        width: min(100% - 1rem, 100%);
    }

    .app-container .action-tile-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Presentation theme inspired by the Pattounya app showcase */
:root {
    --pt-bg: #fffaf4;
    --pt-bg-warm: #fbf3e9;
    --pt-ink: #14243a;
    --pt-ink-soft: #243951;
    --pt-muted: #756d66;
    --pt-line: #eadfd2;
    --pt-primary: #14243a;
    --pt-primary-dark: #0c1726;
    --pt-accent: #e48e73;
    --pt-accent-dark: #ad513e;
    --pt-gold: #c9ad8d;
    --pt-soft: #f7efe6;
    --pt-card: rgba(255, 252, 248, .92);
    --pt-shadow: 0 18px 48px rgba(35, 28, 22, .085);
    --pt-shadow-soft: 0 10px 28px rgba(35, 28, 22, .055);
}

html {
    min-height: 100%;
    background: var(--pt-bg);
}

body {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    color: var(--pt-ink);
    background:
        radial-gradient(circle at 4% 12%, rgba(228, 142, 115, .13), transparent 28%),
        radial-gradient(circle at 92% 4%, rgba(201, 173, 141, .18), transparent 30%),
        linear-gradient(180deg, #fffaf5 0%, #fffdf9 42%, #fbf3e9 100%);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: 0;
}

body > main {
    flex: 1 0 auto;
}

body::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(20, 36, 58, .025) 1px, transparent 1px),
        linear-gradient(180deg, rgba(20, 36, 58, .018) 1px, transparent 1px);
    background-size: 52px 52px;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, .55), transparent 78%);
}

h1,
h2,
.display-1,
.display-2,
.display-3,
.display-4 {
    color: var(--pt-ink);
    letter-spacing: 0;
}

.hero h1,
.registration-choice-copy h1,
.history-hero h1,
.legal-hero h1,
.support-hero h1,
.guardian-public-title {
    font-family: Fraunces, Georgia, serif;
    font-weight: 800;
}

a {
    color: var(--pt-primary);
}

a:hover,
a:focus {
    color: var(--pt-accent-dark);
}

.navbar {
    border-bottom: 1px solid rgba(234, 223, 210, .72);
    background: rgba(255, 250, 244, .88);
    box-shadow: 0 8px 28px rgba(35, 28, 22, .04);
    backdrop-filter: blur(18px);
}

.navbar .container {
    max-width: min(100% - 2rem, 1760px);
}

.brand-logo {
    height: 42px;
    max-width: min(230px, 56vw);
    object-fit: contain;
}

.nav-link {
    color: rgba(20, 36, 58, .78);
    font-weight: 800;
}

.nav-link:hover,
.nav-link:focus,
.nav-link.active {
    color: var(--pt-primary);
}

.nav-link-icon {
    color: var(--pt-accent);
}

.btn,
.form-control,
.form-select,
.modal-content,
.dropdown-menu,
.alert,
.badge,
.surface,
.card {
    border-radius: 8px;
}

.btn {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    font-weight: 900;
    letter-spacing: 0;
}

.btn-primary {
    --bs-btn-bg: var(--pt-primary);
    --bs-btn-border-color: var(--pt-primary);
    --bs-btn-hover-bg: var(--pt-primary-dark);
    --bs-btn-hover-border-color: var(--pt-primary-dark);
    --bs-btn-active-bg: var(--pt-primary-dark);
    --bs-btn-active-border-color: var(--pt-primary-dark);
    color: #fff;
    background: linear-gradient(180deg, #1d324f, #13243a);
    border: 1px solid rgba(20, 36, 58, .92);
    box-shadow: 0 14px 26px rgba(20, 36, 58, .18);
}

.btn-primary:hover,
.btn-primary:focus {
    color: #fff;
    background: linear-gradient(180deg, #263e60, #0c1726);
    box-shadow: 0 16px 34px rgba(20, 36, 58, .22);
}

.btn-outline-primary {
    --bs-btn-color: var(--pt-primary);
    --bs-btn-border-color: rgba(20, 36, 58, .16);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--pt-primary);
    --bs-btn-hover-border-color: var(--pt-primary);
    color: var(--pt-primary);
    background: rgba(255, 252, 248, .86);
    border: 1px solid rgba(20, 36, 58, .16);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75), 0 8px 20px rgba(35, 28, 22, .045);
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active,
.btn-check:checked + .btn-outline-primary,
.btn-check:active + .btn-outline-primary,
.btn-check:focus + .btn-outline-primary {
    color: #fff !important;
    background: linear-gradient(180deg, #1d324f, #13243a);
    border-color: var(--pt-primary);
    box-shadow: 0 14px 26px rgba(20, 36, 58, .16);
}

.btn-outline-secondary,
.btn-outline-danger,
.btn-outline-success,
.btn-outline-warning {
    background: rgba(255, 252, 248, .84);
    box-shadow: 0 8px 20px rgba(35, 28, 22, .04);
}

.text-muted {
    color: var(--pt-muted) !important;
}

.surface,
.compact-panel,
.search-panel,
.contact-result-card,
.privacy-box,
.bank-connect-card,
.support-ticket-card,
.billing-status-card,
.billing-plan-card,
.team-dashboard-panel,
.team-inline-panel,
.team-record,
.team-data-table-wrap,
.pet-card,
.history-card,
.search-result-card,
.guardian-public-card,
.modal-content {
    border: 1px solid rgba(234, 223, 210, .95);
    background: var(--pt-card);
    box-shadow: var(--pt-shadow-soft);
}

.surface:hover,
.pet-card:hover,
.search-result-card:hover,
.team-record[open] {
    border-color: rgba(228, 142, 115, .42);
    box-shadow: var(--pt-shadow);
}

.form-control,
.form-select {
    min-height: 44px;
    color: var(--pt-ink);
    border: 1px solid rgba(20, 36, 58, .13);
    background-color: rgba(255, 253, 250, .94);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9);
}

.form-control:focus,
.form-select:focus {
    border-color: rgba(228, 142, 115, .68);
    box-shadow: 0 0 0 .22rem rgba(228, 142, 115, .14);
}

.badge-soft,
.badge.text-bg-light,
.badge.bg-light {
    color: var(--pt-ink) !important;
    border: 1px solid rgba(201, 173, 141, .48);
    background: rgba(255, 247, 237, .9) !important;
}

.section-kicker,
.eyebrow {
    color: var(--pt-accent-dark);
    font-weight: 950;
    letter-spacing: .08em;
}

.hero {
    min-height: calc(100vh - 72px);
    display: block;
    padding: clamp(2.2rem, 5vw, 5rem) 0 0;
    background:
        radial-gradient(circle at 88% 12%, rgba(228, 142, 115, .12), transparent 24%),
        linear-gradient(180deg, #fffaf4 0%, #fffdf9 62%, #fbf1e8 100%);
}

.hero::before {
    inset: auto auto 0 0;
    width: min(44vw, 760px);
    height: min(34vw, 520px);
    z-index: -1;
    background: url("/images/hero-animals-pattounya.png") left bottom/cover no-repeat;
    opacity: .98;
}

.hero::after {
    background:
        radial-gradient(circle at 95% 10%, rgba(201, 173, 141, .18), transparent 22%),
        linear-gradient(90deg, rgba(255, 250, 244, .8), rgba(255, 250, 244, .24) 52%, rgba(255, 250, 244, .06));
}

.hero-presentation-grid {
    min-height: min(74vh, 780px);
    display: grid;
    grid-template-columns: minmax(360px, .92fr) minmax(520px, 1.08fr);
    gap: clamp(2rem, 4vw, 4.5rem);
    align-items: center;
}

.hero-copy {
    max-width: 700px;
    padding-bottom: clamp(5rem, 12vw, 12rem);
}

.hero-brand-lockup {
    width: min(430px, 80vw);
    height: auto;
    display: block;
    margin-bottom: .55rem;
}

.hero-divider {
    width: min(230px, 70vw);
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: .9rem;
    margin: .25rem 0 1.1rem;
    color: var(--pt-accent);
}

.hero-divider span {
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--pt-gold), transparent);
}

.hero h1 {
    max-width: 760px;
    color: var(--pt-primary);
    font-family: Nunito, Inter, ui-sans-serif, system-ui, sans-serif;
    font-weight: 900;
    font-size: clamp(3rem, 5.9vw, 6.2rem);
    line-height: .9;
    text-shadow: none;
}

.hero h1 span {
    display: block;
    color: var(--pt-accent);
}

.hero-copy .lead {
    max-width: 650px;
    color: var(--pt-ink-soft) !important;
    font-size: clamp(1.08rem, 1.55vw, 1.45rem);
    line-height: 1.42;
}

.hero-feature-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .9rem;
}

.hero-feature-grid article {
    min-height: 132px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: .6rem;
    padding: 1rem;
    text-align: center;
    border: 1px solid rgba(201, 173, 141, .35);
    border-radius: 8px;
    background: rgba(255, 253, 250, .74);
    box-shadow: var(--pt-shadow-soft);
    backdrop-filter: blur(10px);
}

.hero-feature-grid .material-symbols-rounded {
    color: var(--pt-gold);
    font-size: 2.5rem;
}

.hero-feature-grid strong {
    color: var(--pt-primary);
    font-size: 1.05rem;
    line-height: 1.12;
}

.hero-phone-stage {
    min-height: 560px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    isolation: isolate;
}

.hero-phone-stage::before {
    content: "♡";
    position: absolute;
    top: 0;
    right: 2%;
    color: var(--pt-accent);
    font-family: Fraunces, Georgia, serif;
    font-size: clamp(3rem, 5vw, 5.5rem);
    opacity: .78;
    transform: rotate(14deg);
}

.phone-preview {
    width: 208px;
    min-height: 440px;
    display: grid;
    align-content: start;
    gap: .78rem;
    padding: 1.55rem .9rem 1rem;
    border: 7px solid #161a20;
    border-radius: 34px;
    color: var(--pt-primary);
    background: linear-gradient(180deg, #fffdfa, #f8f2eb);
    box-shadow: 0 30px 60px rgba(20, 36, 58, .18), inset 0 0 0 1px rgba(255, 255, 255, .7);
}

.phone-preview > strong {
    font-size: 1rem;
    line-height: 1.15;
}

.phone-top {
    width: 74px;
    height: 20px;
    justify-self: center;
    margin-top: -1.2rem;
    border-radius: 999px;
    background: #111;
}

.phone-preview-search {
    transform: rotate(-2deg) translateX(16px);
}

.phone-preview-profile {
    z-index: 2;
    width: 236px;
    min-height: 492px;
    transform: translateY(-12px);
}

.phone-preview-payment {
    transform: rotate(3deg) translateX(-16px) scale(.9);
}

.phone-search,
.phone-rating,
.phone-card,
.phone-preview dl {
    border: 1px solid rgba(20, 36, 58, .1);
    border-radius: 8px;
    background: rgba(255, 255, 255, .78);
}

.phone-search {
    padding: .58rem .65rem;
    color: var(--pt-muted);
    font-size: .72rem;
}

.phone-card {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr);
    gap: .55rem;
    padding: .55rem;
}

.phone-card span,
.phone-avatar {
    border-radius: 8px;
    background:
        linear-gradient(135deg, rgba(228, 142, 115, .35), rgba(201, 173, 141, .45)),
        url("/images/hero-animals-pattounya.png") center/cover;
}

.phone-card span {
    width: 58px;
    height: 58px;
}

.phone-card small,
.phone-preview small {
    color: var(--pt-muted);
    font-size: .68rem;
}

.phone-avatar {
    width: 88px;
    height: 88px;
    justify-self: center;
    border-radius: 50%;
}

.phone-rating {
    padding: .62rem;
    color: var(--pt-accent-dark);
    font-size: .78rem;
    font-weight: 900;
}

.phone-preview p {
    margin: 0;
    font-size: .76rem;
    line-height: 1.35;
}

.phone-preview button {
    min-height: 42px;
    border: 0;
    border-radius: 8px;
    color: #fff;
    background: linear-gradient(180deg, #1d324f, #13243a);
    font-weight: 900;
}

.phone-preview dl {
    display: grid;
    gap: .55rem;
    margin: 0;
    padding: .7rem;
}

.phone-preview dl div {
    display: flex;
    justify-content: space-between;
    gap: .5rem;
    font-size: .72rem;
}

.phone-preview dt,
.phone-preview dd {
    margin: 0;
}

.phone-preview dd {
    font-weight: 900;
}

.hero-trust-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
    margin-left: auto;
    padding: 1rem 0 1.35rem;
    max-width: 990px;
}

.hero-trust-strip article {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: .9rem;
    padding: .4rem 1.4rem;
    border-left: 1px solid rgba(201, 173, 141, .4);
}

.hero-trust-strip article:first-child {
    border-left: 0;
}

.hero-trust-strip .material-symbols-rounded {
    grid-row: span 2;
    color: var(--pt-gold);
    font-size: 2.2rem;
}

.hero-trust-strip strong {
    color: var(--pt-primary);
}

.hero-trust-strip small {
    color: var(--pt-muted);
}

.home-confidence-band {
    background: linear-gradient(180deg, rgba(255, 255, 255, .72), rgba(251, 243, 233, .7));
}

.home-confidence-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}

.home-confidence-grid article {
    min-height: 220px;
    display: grid;
    align-content: start;
    gap: .75rem;
    padding: 1.35rem;
    border: 1px solid rgba(234, 223, 210, .95);
    border-radius: 8px;
    background: rgba(255, 252, 248, .84);
    box-shadow: var(--pt-shadow-soft);
}

.home-confidence-grid .material-symbols-rounded {
    width: 52px;
    height: 52px;
    display: grid;
    place-items: center;
    color: var(--pt-primary);
    border-radius: 8px;
    background: linear-gradient(180deg, rgba(201, 173, 141, .22), rgba(228, 142, 115, .12));
    font-size: 2rem;
}

.home-confidence-grid h2 {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 900;
}

.home-confidence-grid p {
    margin: 0;
    color: var(--pt-muted);
}

.section-band {
    border-top: 1px solid rgba(234, 223, 210, .78);
    background: rgba(255, 252, 248, .38);
}

.avatar-frame,
.team-user-avatar,
.thread-avatar {
    background: linear-gradient(135deg, rgba(201, 173, 141, .34), rgba(228, 142, 115, .18));
    color: var(--pt-primary);
    border: 1px solid rgba(201, 173, 141, .4);
}

.action-tile {
    border-color: rgba(234, 223, 210, .95);
    background: rgba(255, 252, 248, .9);
    box-shadow: var(--pt-shadow-soft);
}

.action-tile:hover,
.action-tile:focus {
    border-color: rgba(228, 142, 115, .5);
    background: #fffdf9;
    transform: translateY(-2px);
}

.action-tile-icon {
    color: var(--pt-primary);
    background: linear-gradient(180deg, rgba(201, 173, 141, .22), rgba(228, 142, 115, .12));
}

.dashboard-hub,
.messenger-shell,
.team-shell,
.team-workspace,
.team-rail,
.support-chat-panel,
.legal-page,
.registration-form-page {
    background: transparent;
}

.messenger-list-panel,
.messenger-empty-panel,
.messenger-conversation,
.team-rail,
.team-workspace,
.support-chat-panel,
.support-ticket-sidebar {
    border: 1px solid rgba(234, 223, 210, .95);
    background: rgba(255, 252, 248, .9);
    box-shadow: var(--pt-shadow-soft);
}

.conversation-messages,
.conversation-side,
.team-record-body,
.team-dashboard-topline,
.team-ops-kpi-grid article,
.team-dashboard-action,
.team-dashboard-mini-list > div,
.team-inline-controls .form-control,
.team-inline-controls .form-select,
.team-inline-roles,
.team-inline-switch,
.team-inline-pet-grid article,
.team-data-table th {
    background: rgba(255, 248, 240, .66);
}

.message-bubble.is-mine {
    color: #fff;
    background: linear-gradient(180deg, #1d324f, #13243a);
    box-shadow: 0 10px 20px rgba(20, 36, 58, .14);
}

.message-bubble.is-theirs {
    border-color: rgba(234, 223, 210, .95);
    background: rgba(255, 253, 250, .94);
}

.team-rail-mark {
    background: linear-gradient(180deg, #1d324f, #13243a);
    color: #fff;
}

.team-rail-nav-item {
    border-color: rgba(234, 223, 210, .8);
    background: rgba(255, 252, 248, .62);
}

.team-rail-nav-item.active,
.team-rail-nav-item:hover,
.team-rail-nav-item:focus {
    border-color: rgba(228, 142, 115, .45);
    background: rgba(255, 247, 239, .96);
}

.team-rail-nav-icon,
.team-dashboard-panel-head > span,
.team-record-summary::after {
    color: var(--pt-primary);
    background: rgba(201, 173, 141, .18);
}

.team-rail-nav-count.has-alert,
.action-tile-badge,
.dashboard-notification-header .badge {
    color: #fff;
    background: var(--pt-accent);
}

.team-data-table tbody tr:hover,
.team-record-summary:hover {
    background: rgba(255, 247, 239, .86);
}

.site-footer {
    margin-top: auto !important;
    flex-shrink: 0;
    border-top: 1px solid rgba(234, 223, 210, .85);
    background: linear-gradient(180deg, rgba(255, 252, 248, .68), rgba(251, 243, 233, .95));
}

.site-footer-inner {
    padding-block: 1.25rem;
}

.footer-brand-icon {
    width: 34px;
    height: 34px;
    object-fit: contain;
}

.alert-info {
    color: #17324f;
    border-color: rgba(201, 173, 141, .5);
    background: rgba(255, 248, 240, .9);
}

.alert-warning {
    color: #765133;
    border-color: rgba(228, 142, 115, .45);
    background: rgba(255, 238, 225, .92);
}

@media (min-width: 1400px) {
    .container {
        max-width: 1540px;
    }
}

@media (max-width: 1199.98px) {
    .hero-presentation-grid {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .hero-copy {
        padding-bottom: 2rem;
    }

    .hero::before {
        width: min(72vw, 680px);
        height: min(54vw, 520px);
        opacity: .72;
    }

    .hero-phone-stage {
        min-height: 500px;
        margin-top: -1rem;
    }
}

@media (max-width: 991.98px) {
    .hero-feature-grid,
    .hero-trust-strip,
    .home-confidence-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero-trust-strip article {
        border-left: 0;
        border-top: 1px solid rgba(201, 173, 141, .3);
    }

    .phone-preview {
        width: 188px;
        min-height: 398px;
    }

    .phone-preview-profile {
        width: 214px;
    }
}

@media (max-width: 767.98px) {
    .navbar .container {
        max-width: 100%;
    }

    .hero {
        padding-top: 2rem;
    }

    .hero h1 {
        font-size: clamp(2.7rem, 15vw, 4.8rem);
    }

    .hero-feature-grid,
    .hero-trust-strip,
    .home-confidence-grid {
        grid-template-columns: 1fr;
    }

    .hero-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hero-phone-stage {
        min-height: 420px;
        justify-content: flex-start;
        overflow: hidden;
    }

    .phone-preview {
        transform: none;
    }

    .phone-preview-search,
    .phone-preview-payment {
        display: none;
    }

    .phone-preview-profile {
        width: min(280px, 86vw);
        margin-inline: auto;
    }

    .hero::before {
        width: 100vw;
        height: 42vh;
        opacity: .54;
    }
}

@media (max-width: 575.98px) {
    .brand-logo {
        height: 36px;
        max-width: min(180px, 58vw);
    }

    .hero-feature-grid {
        gap: .65rem;
    }

    .hero-feature-grid article {
        min-height: 112px;
        padding: .85rem;
    }

    .hero-feature-grid .material-symbols-rounded {
        font-size: 2rem;
    }

    .hero-feature-grid strong {
        font-size: .92rem;
    }
}

/* User-requested adjustment: full-screen animal hero, no phone mockups */
.hero {
    min-height: calc(100vh - 72px);
    display: grid;
    align-items: center;
    padding: clamp(2.2rem, 5vw, 5rem) 0 clamp(2rem, 4vw, 3rem);
    overflow: hidden;
}

.hero::before {
    inset: 0;
    width: auto;
    height: auto;
    background: url("/images/hero-animals-pattounya.png") 58% center/cover no-repeat;
    opacity: 1;
}

.hero::after {
    background:
        linear-gradient(90deg, rgba(255, 250, 244, .9) 0%, rgba(255, 250, 244, .72) 34%, rgba(255, 250, 244, .28) 62%, rgba(255, 250, 244, .04) 100%),
        linear-gradient(180deg, rgba(255, 250, 244, .06), rgba(255, 250, 244, .28));
}

.hero-presentation-grid {
    min-height: min(78vh, 820px);
    grid-template-columns: minmax(320px, 760px);
    align-items: center;
}

.hero-copy {
    padding-bottom: clamp(4rem, 11vw, 10rem);
}

.hero-phone-stage,
.phone-preview {
    display: none !important;
}

/* User-requested adjustment: keep clear labels but restore colorful dashboard action cards */
.action-tile {
    position: relative;
    overflow: hidden;
    min-height: 128px;
    align-content: start;
    border-color: rgba(255, 255, 255, .64);
    color: var(--pt-primary);
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .86), rgba(255, 255, 255, .54)),
        var(--action-tile-bg, linear-gradient(135deg, #fff6ec, #f7efe6));
    box-shadow: 0 16px 34px rgba(35, 28, 22, .075);
}

.action-tile::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        radial-gradient(circle at 18% 12%, rgba(255, 255, 255, .82), transparent 28%),
        radial-gradient(circle at 86% 86%, var(--action-tile-glow, rgba(228, 142, 115, .18)), transparent 38%);
}

.action-tile > * {
    position: relative;
    z-index: 1;
}

.action-tile-icon {
    color: var(--action-tile-icon, var(--pt-primary));
    background: rgba(255, 255, 255, .74);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95), 0 10px 22px rgba(35, 28, 22, .07);
}

.action-tile-title {
    color: var(--pt-primary);
}

.action-tile-pets {
    --action-tile-bg: linear-gradient(135deg, #fff1df, #f8d6b9);
    --action-tile-glow: rgba(201, 173, 141, .34);
    --action-tile-icon: #ad8155;
}

.action-tile-account {
    --action-tile-bg: linear-gradient(135deg, #eef4ff, #cfdcf2);
    --action-tile-glow: rgba(20, 36, 58, .22);
    --action-tile-icon: #243951;
}

.action-tile-request {
    --action-tile-bg: linear-gradient(135deg, #ffe8dc, #f2b299);
    --action-tile-glow: rgba(228, 142, 115, .34);
    --action-tile-icon: #c6634d;
}

.action-tile-search {
    --action-tile-bg: linear-gradient(135deg, #eefaf6, #bdded2);
    --action-tile-glow: rgba(88, 151, 131, .28);
    --action-tile-icon: #347865;
}

.action-tile-favorites {
    --action-tile-bg: linear-gradient(135deg, #fff0f3, #f3b6c1);
    --action-tile-glow: rgba(214, 92, 115, .26);
    --action-tile-icon: #c24d66;
}

.action-tile-calendar {
    --action-tile-bg: linear-gradient(135deg, #f3edff, #d7c9ef);
    --action-tile-glow: rgba(116, 88, 151, .24);
    --action-tile-icon: #604a88;
}

.action-tile-rates {
    --action-tile-bg: linear-gradient(135deg, #fff7d9, #ead08e);
    --action-tile-glow: rgba(201, 173, 141, .42);
    --action-tile-icon: #a98739;
}

.action-tile-demands {
    --action-tile-bg: linear-gradient(135deg, #ffecee, #f0b4bd);
    --action-tile-glow: rgba(214, 92, 115, .24);
    --action-tile-icon: #b94d63;
}

.action-tile-history {
    --action-tile-bg: linear-gradient(135deg, #f2f5f8, #d5dde5);
    --action-tile-glow: rgba(55, 72, 92, .22);
    --action-tile-icon: #37485c;
}

.action-tile-info {
    --action-tile-bg: linear-gradient(135deg, #eaf7ff, #b8dcec);
    --action-tile-glow: rgba(54, 132, 166, .24);
    --action-tile-icon: #2b7898;
}

@media (max-width: 1199.98px) {
    .hero-presentation-grid {
        grid-template-columns: minmax(0, 720px);
    }

    .hero::before {
        background-position: 68% center;
    }
}

@media (max-width: 767.98px) {
    .hero::before {
        background-position: 74% center;
    }

    .hero::after {
        background: linear-gradient(180deg, rgba(255, 250, 244, .88), rgba(255, 250, 244, .52), rgba(255, 250, 244, .18));
    }
}

/* Home hero trust strip: keep the claims readable over the full-screen animal photo. */
.hero > .container {
    position: relative;
    z-index: 1;
    min-height: min(78vh, 820px);
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    align-items: center;
}

.hero-presentation-grid {
    min-height: 0;
}

.hero-copy {
    padding-bottom: clamp(2rem, 6vw, 6rem);
}

.hero-trust-strip {
    width: min(100%, 980px);
    max-width: none;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .45rem;
    margin: clamp(.6rem, 1.8vw, 1.2rem) auto 0 0;
    padding: .58rem;
    border: 1px solid rgba(255, 255, 255, .66);
    border-radius: 24px;
    background:
        linear-gradient(135deg, rgba(255, 253, 249, .92), rgba(255, 246, 238, .78)),
        rgba(255, 255, 255, .72);
    box-shadow: 0 22px 56px rgba(20, 36, 58, .12);
    backdrop-filter: blur(16px) saturate(1.08);
}

.hero-trust-strip article {
    min-width: 0;
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    align-items: center;
    column-gap: .78rem;
    padding: .78rem .9rem;
    border: 0;
    border-radius: 18px;
    background: rgba(255, 255, 255, .52);
}

.hero-trust-strip article:first-child {
    border-left: 0;
}

.hero-trust-strip .material-symbols-rounded {
    width: 44px;
    height: 44px;
    display: inline-grid;
    grid-row: span 2;
    place-items: center;
    border-radius: 999px;
    color: #a6784d;
    font-size: 1.65rem;
    background: linear-gradient(180deg, rgba(201, 173, 141, .24), rgba(228, 142, 115, .13));
}

.hero-trust-strip strong {
    min-width: 0;
    color: #14243a;
    font-size: .98rem;
    font-weight: 900;
    line-height: 1.15;
}

.hero-trust-strip small {
    min-width: 0;
    color: #5f6876;
    font-size: .78rem;
    font-weight: 760;
    line-height: 1.25;
}

@media (max-width: 1199.98px) {
    .hero > .container {
        min-height: auto;
    }

    .hero-trust-strip {
        width: min(100%, 760px);
        grid-template-columns: 1fr;
        margin-top: 1rem;
    }
}

@media (max-width: 767.98px) {
    .hero {
        align-items: start;
    }

    .hero-copy {
        padding-bottom: .35rem;
    }

    .hero-trust-strip {
        padding: .48rem;
        border-radius: 20px;
        background:
            linear-gradient(135deg, rgba(255, 253, 249, .95), rgba(255, 246, 238, .84)),
            rgba(255, 255, 255, .82);
    }

    .hero-trust-strip article {
        grid-template-columns: 40px minmax(0, 1fr);
        padding: .68rem .72rem;
        border-radius: 15px;
    }

    .hero-trust-strip .material-symbols-rounded {
        width: 40px;
        height: 40px;
        font-size: 1.45rem;
    }
}

/* Mobile app shell: bottom navigation and phone-like screens */
.mobile-bottom-nav,
.mobile-screen-bar {
    display: none;
}

@media (max-width: 767.98px) {
    body {
        padding-top: env(safe-area-inset-top);
        padding-bottom: calc(86px + env(safe-area-inset-bottom));
    }

    .navbar {
        display: none;
    }

    .site-footer {
        display: none;
    }

    .container,
    .app-container {
        width: min(100% - 1rem, 100%) !important;
        max-width: none;
    }

    main.container,
    main.container.py-5,
    .guardian-public-page,
    .search-workspace {
        padding-top: .8rem !important;
    }

    .mobile-bottom-nav {
        position: fixed;
        left: 50%;
        bottom: max(.55rem, env(safe-area-inset-bottom));
        z-index: 1050;
        width: min(calc(100vw - 1rem), 430px);
        min-height: 68px;
        display: grid;
        gap: .12rem;
        padding: .45rem;
        border: 1px solid rgba(20, 36, 58, .12);
        border-radius: 24px;
        background: rgba(255, 253, 250, .94);
        box-shadow: 0 22px 60px rgba(20, 36, 58, .2);
        backdrop-filter: blur(18px);
        transform: translateX(-50%);
    }

    .mobile-bottom-nav.is-user {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .mobile-bottom-nav.is-guest {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .mobile-bottom-nav-item {
        min-width: 0;
        display: grid;
        place-items: center;
        align-content: center;
        gap: .08rem;
        padding: .35rem .2rem;
        border-radius: 18px;
        color: rgba(20, 36, 58, .62);
        text-decoration: none;
        transition: color .15s ease, background .15s ease, transform .15s ease;
    }

    .mobile-bottom-nav-item .material-symbols-rounded {
        font-size: 1.38rem;
        line-height: 1;
    }

    .mobile-bottom-nav-item small {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: .64rem;
        font-weight: 900;
    }

    .mobile-bottom-nav-item.is-active,
    .mobile-bottom-nav-item:hover,
    .mobile-bottom-nav-item:focus {
        color: var(--pt-primary);
        background: linear-gradient(180deg, rgba(255, 239, 228, .98), rgba(246, 220, 205, .8));
    }

    .mobile-bottom-nav-item.is-active .material-symbols-rounded {
        color: var(--pt-accent);
        font-variation-settings: "FILL" 1, "wght" 600, "GRAD" 0, "opsz" 24;
    }

    .mobile-screen-bar {
        position: sticky;
        top: 0;
        z-index: 30;
        min-height: 52px;
        display: grid;
        grid-template-columns: 72px minmax(0, 1fr) 72px;
        align-items: center;
        gap: .5rem;
        padding: .45rem .75rem;
        color: var(--pt-primary);
        background: rgba(255, 250, 244, .94);
        border-bottom: 1px solid rgba(234, 223, 210, .82);
        backdrop-filter: blur(14px);
    }

    .mobile-screen-bar > strong {
        min-width: 0;
        overflow: hidden;
        text-align: center;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: .95rem;
    }

    .mobile-screen-back {
        display: inline-flex;
        align-items: center;
        gap: .18rem;
        color: var(--pt-primary);
        font-size: .82rem;
        font-weight: 900;
        text-decoration: none;
    }

    .mobile-screen-back .material-symbols-rounded {
        font-size: 1.25rem;
    }

    .dashboard-hub {
        padding: .65rem;
        border-radius: 18px;
    }

    .dashboard-category-header {
        padding-inline: .15rem;
    }

    .action-tile-grid,
    .app-container .action-tile-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: .65rem;
    }

    .action-tile,
    .app-container .action-tile {
        min-height: 118px;
        padding: .72rem;
        border-radius: 18px;
    }

    .action-tile-icon,
    .app-container .action-tile-icon {
        width: 42px;
        min-height: 42px;
        font-size: 1.45rem;
        border-radius: 15px;
    }

    .action-tile-title,
    .app-container .action-tile-title {
        font-size: .92rem;
        line-height: 1.1;
    }

    .client-current-requests,
    .guardian-current-requests,
    .surface,
    .compact-panel,
    .messenger-list-panel,
    .messenger-conversation,
    .guardian-public-main > .surface,
    .guardian-public-side > .surface {
        border-radius: 18px;
    }

    .client-current-request-item {
        padding: .85rem;
        border-radius: 16px;
    }

    .client-current-request-actions,
    .client-current-request-actions .btn,
    .client-current-request-actions form {
        width: 100%;
    }

    .search-page-head {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: .8rem;
        align-items: start;
        margin-bottom: .9rem !important;
    }

    .search-page-head h1 {
        font-size: 1.45rem;
    }

    .search-page-head p {
        display: none;
    }

    .compact-panel {
        padding: .85rem;
    }

    .compact-panel-title {
        align-items: start;
    }

    .search-toolbar {
        grid-template-columns: 1fr;
        padding: .65rem;
        border-radius: 16px;
    }

    .animal-filter-row {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .icon-choice {
        min-width: 0;
        width: 100%;
    }

    .search-submit {
        width: 100%;
    }

    .search-row {
        grid-template-columns: 52px minmax(0, 1fr);
        align-items: start;
        gap: .75rem;
        padding: .82rem;
        border-radius: 18px;
    }

    .search-row-icon,
    .profile-avatar {
        width: 52px;
        height: 52px;
    }

    .search-row-main {
        min-width: 0;
    }

    .search-actions,
    .search-actions-wide {
        grid-column: 1 / -1;
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
        gap: .55rem;
        justify-items: stretch;
    }

    .search-actions .btn,
    .search-actions form,
    .compact-message-form,
    .compact-proposal-form {
        width: 100%;
    }

    .compact-message-form,
    .compact-proposal-form {
        grid-template-columns: 1fr;
    }

    .request-result-group {
        border-radius: 18px;
    }

    .guardian-public-hero {
        padding-top: 1rem;
    }

    .guardian-public-header {
        display: grid;
        gap: 1rem;
        padding: .95rem;
        border: 1px solid rgba(234, 223, 210, .95);
        border-radius: 22px;
        background: rgba(255, 252, 248, .9);
        box-shadow: var(--pt-shadow-soft);
    }

    .guardian-public-identity {
        align-items: center;
        text-align: center;
    }

    .guardian-public-avatar {
        width: 112px;
        height: 112px;
    }

    .guardian-public-identity h1 {
        font-size: 1.85rem;
    }

    .guardian-public-meta {
        justify-content: center;
    }

    .guardian-public-cta {
        display: grid;
        grid-template-columns: 1fr;
        gap: .55rem;
    }

    .guardian-public-grid {
        gap: .85rem;
    }

    .guardian-rate-item {
        padding: .85rem;
        border-radius: 16px;
    }

    .messenger-shell {
        min-height: calc(100vh - 98px);
        border: 0;
        box-shadow: none;
        background: transparent;
    }

    .messenger-list-panel,
    .messenger-conversation {
        border-radius: 20px;
    }

    .messenger-list-panel {
        padding: .85rem;
    }

    .messenger-thread-link {
        border-radius: 18px;
    }

    .conversation-header {
        grid-template-columns: 1fr;
        gap: .7rem;
        padding: .85rem;
    }

    .conversation-actions {
        justify-content: stretch;
    }

    .conversation-actions form,
    .conversation-actions .btn {
        width: 100%;
    }

    .conversation-context {
        padding: .85rem;
    }

    .conversation-messages {
        min-height: 46vh;
        padding: .85rem;
    }

    .conversation-composer {
        position: sticky;
        bottom: calc(82px + env(safe-area-inset-bottom));
        z-index: 15;
        grid-template-columns: minmax(0, 1fr) 48px;
        padding: .75rem;
        border-radius: 18px 18px 0 0;
        box-shadow: 0 -12px 30px rgba(20, 36, 58, .1);
    }

    .conversation-side {
        border-left: 0;
        border-top: 1px solid var(--pt-line);
    }
}

/* Final app-screen overrides kept late so legacy mobile rules do not flatten the mockup layout. */
.app-discovery-searchbar {
    display: flex;
    align-items: center;
    gap: .6rem;
    max-width: 520px;
    margin: 0 0 1rem;
    padding: .82rem 1rem;
    border: 1px solid rgba(20, 36, 58, .12);
    border-radius: 16px;
    background: rgba(255, 255, 255, .72);
    color: #7a8290;
    text-decoration: none;
    font-weight: 800;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72), 0 12px 28px rgba(20, 36, 58, .06);
}

.app-discovery-searchbar .material-symbols-rounded {
    color: #14243a;
}

@media (max-width: 767.98px) {
    .app-search-head.search-page-head h1 {
        font-family: "Nunito", var(--pt-font-sans, sans-serif);
        font-size: 2rem;
        line-height: .96;
    }

    .app-search-head.search-page-head p {
        display: none;
    }

    .compact-panel.app-discovery-panel {
        padding: 0;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    .app-discovery-searchbar {
        max-width: none;
        margin-bottom: .85rem;
    }

    .care-request-app-screen .care-pet-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.petsitter-app-card {
    position: relative;
}

.petsitter-favorite-form {
    position: absolute;
    top: .65rem;
    right: .65rem;
    z-index: 3;
    margin: 0;
}

.petsitter-heart {
    border: 0;
    text-decoration: none;
}

.petsitter-heart.is-favorite {
    color: #fff;
    background: rgba(228, 92, 110, .94);
}

.petsitter-heart.is-favorite .material-symbols-rounded {
    font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 24;
}

.mobile-nav-logo {
    width: 24px;
    height: 24px;
    object-fit: contain;
}

.care-extra-pets {
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 16px;
    background: rgba(255, 255, 255, .62);
    padding: .75rem;
}

.care-extra-pets summary {
    cursor: pointer;
    color: #14243a;
    font-weight: 900;
}

@media (min-width: 992px) {
    .petsitter-app-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: .95rem;
    }

    .petsitter-app-grid.is-search {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    }

    .petsitter-app-body {
        padding: .72rem .78rem .82rem;
    }

    .petsitter-card-main h3 {
        font-size: 1rem;
    }

    .petsitter-card-main p,
    .petsitter-rating-pill,
    .pet-rate-mini strong,
    .pet-rate-mini small {
        font-size: .78rem;
    }

    .app-profile-container,
    .payment-app-screen,
    .care-request-app-screen {
        max-width: 760px;
    }

    .app-profile-card {
        padding: 1rem;
    }

    .app-profile-hero .guardian-public-avatar {
        width: 96px;
        height: 96px;
    }

    .profile-verified-dot {
        top: 76px;
        right: calc(50% - 52px);
    }
}

/* Team user dossier */
.team-users-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .65rem;
    margin-bottom: .65rem;
}

.team-users-overview article {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: .7rem;
    padding: .72rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 8px;
    background: linear-gradient(135deg, rgba(255, 250, 244, .96), rgba(255, 255, 255, .92));
    box-shadow: 0 10px 24px rgba(20, 36, 58, .055);
}

.team-users-overview .material-symbols-rounded {
    width: 38px;
    height: 38px;
    display: inline-grid;
    place-items: center;
    border-radius: 8px;
    background: #17263d;
    color: #fff;
    font-size: 1.25rem;
}

.team-users-overview small {
    display: block;
    color: #7b6f67;
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.team-users-overview strong {
    display: block;
    color: #14243a;
    font-size: 1.45rem;
    line-height: 1;
}

.team-users-record-list {
    max-height: calc(100vh - 17rem);
}

.team-record[data-team-item="users"] {
    border-color: rgba(20, 36, 58, .1);
    border-radius: 14px;
}

.team-record[data-team-item="users"] .team-record-summary {
    min-height: 78px;
    background: #fff;
}

.team-record[data-team-item="users"] .team-record-body {
    gap: .85rem;
    padding: .85rem;
    background: linear-gradient(180deg, rgba(255, 249, 243, .74), rgba(255, 255, 255, .96));
}

.team-record[data-team-item="users"] .team-inline-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.team-record[data-team-item="users"] .team-inline-panel {
    border-radius: 12px;
    box-shadow: 0 10px 24px rgba(20, 36, 58, .045);
}

.team-user-command-center {
    position: relative;
    display: grid;
    grid-template-columns: minmax(260px, .9fr) minmax(0, 1.45fr);
    gap: .85rem;
    overflow: hidden;
    padding: .8rem;
    border: 1px solid rgba(20, 36, 58, .1);
    border-radius: 16px;
    background:
        radial-gradient(circle at top right, rgba(226, 135, 104, .18), transparent 32%),
        linear-gradient(135deg, #fffaf5, #fff);
    box-shadow: 0 18px 40px rgba(20, 36, 58, .07);
}

.team-user-command-cover {
    min-height: 210px;
    overflow: hidden;
    border-radius: 12px;
    background:
        linear-gradient(135deg, rgba(20, 36, 58, .2), rgba(226, 135, 104, .18)),
        url("/images/brand/logo-short.png") center / 42% no-repeat,
        #f9efe7;
}

.team-user-command-cover img {
    width: 100%;
    height: 100%;
    min-height: 210px;
    display: block;
    object-fit: cover;
}

.team-user-command-profile {
    min-width: 0;
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    align-items: center;
    gap: .9rem;
}

.team-user-avatar-lg {
    width: 92px;
    height: 92px;
    font-size: 2rem;
}

.team-user-command-profile h3 {
    margin: .05rem 0 .15rem;
    color: #14243a;
    font-size: clamp(1.25rem, 2vw, 1.75rem);
    line-height: 1.08;
}

.team-user-command-profile p {
    margin: 0;
    color: #6e7480;
    font-size: .9rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.team-user-command-tags,
.team-user-command-alerts {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
}

.team-user-command-tags {
    margin-top: .55rem;
}

.team-user-command-tags span,
.team-user-command-alerts span {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: .2rem .55rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 950;
}

.team-user-command-tags span {
    background: rgba(20, 36, 58, .08);
    color: #14243a;
}

.team-user-command-kpis {
    grid-column: 2;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .5rem;
}

.team-user-command-kpis article {
    min-width: 0;
    display: grid;
    gap: .05rem;
    padding: .62rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 10px;
    background: rgba(255, 255, 255, .82);
}

.team-user-command-kpis span {
    color: #7b6f67;
    font-size: .68rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-user-command-kpis strong {
    color: #14243a;
    font-size: 1.25rem;
    line-height: 1;
}

.team-user-command-alerts {
    grid-column: 1 / -1;
}

.team-user-command-alerts .is-warning {
    background: rgba(255, 193, 7, .18);
    color: #7a5700;
}

.team-user-command-alerts .is-danger {
    background: rgba(220, 53, 69, .12);
    color: #a52834;
}

.team-user-command-alerts .is-info {
    background: rgba(23, 38, 61, .1);
    color: #17263d;
}

.team-user-deep-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .7rem;
}

.team-user-data-panel {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: .6rem;
    padding: .75rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 12px;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 10px 24px rgba(20, 36, 58, .045);
}

.team-user-data-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .7rem;
}

.team-user-data-head h4 {
    margin: 0;
    color: #14243a;
    font-size: .9rem;
    font-weight: 950;
}

.team-user-data-head span {
    min-width: 28px;
    min-height: 26px;
    display: inline-grid;
    place-items: center;
    padding: .12rem .48rem;
    border-radius: 999px;
    background: rgba(226, 135, 104, .16);
    color: #9e4f36;
    font-size: .75rem;
    font-weight: 950;
}

.team-user-data-list {
    display: grid;
    gap: .45rem;
    max-height: 310px;
    overflow: auto;
    padding-right: .18rem;
    scrollbar-width: thin;
}

.team-user-data-list article {
    min-width: 0;
    display: grid;
    gap: .08rem;
    padding: .55rem;
    border: 1px solid rgba(20, 36, 58, .07);
    border-radius: 10px;
    background: #fbfcfd;
}

.team-user-data-list strong,
.team-user-data-list small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-user-data-list strong {
    color: #14243a;
    font-size: .84rem;
    font-weight: 950;
}

.team-user-data-list small {
    color: #687282;
    font-size: .76rem;
    font-weight: 760;
}

.team-user-data-list p {
    margin: .18rem 0 0;
    color: #4e5968;
    font-size: .78rem;
    line-height: 1.35;
}

.team-user-data-list a {
    justify-self: start;
    margin-top: .15rem;
    font-weight: 850;
}

.team-user-data-note {
    padding: .5rem .6rem;
    border-radius: 10px;
    background: rgba(23, 38, 61, .07);
    color: #253047;
    font-size: .78rem;
    font-weight: 850;
}

.team-review-admin-panel {
    border-color: rgba(226, 135, 104, .18);
}

.team-review-admin-create {
    display: grid;
    gap: .45rem;
    padding: .6rem;
    border: 1px solid rgba(226, 135, 104, .18);
    border-radius: 10px;
    background: rgba(255, 248, 242, .74);
}

.team-review-admin-create label,
.team-review-admin-controls {
    min-width: 0;
}

.team-review-admin-create label {
    display: grid;
    gap: .22rem;
}

.team-review-admin-create label > span {
    color: #7b6f67;
    font-size: .7rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-review-admin-item {
    border-color: rgba(226, 135, 104, .14) !important;
}

.team-review-admin-note {
    padding: .42rem .5rem;
    border-radius: 8px;
    background: rgba(20, 36, 58, .06);
    color: #354158 !important;
    font-weight: 800;
}

.team-review-admin-controls {
    display: grid;
    grid-template-columns: 86px minmax(120px, 1fr) minmax(120px, 1fr) auto auto;
    gap: .35rem;
    margin-top: .35rem;
}

.team-new-users-head {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .75rem;
    padding: .85rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 12px;
    background:
        radial-gradient(circle at top right, rgba(226, 135, 104, .16), transparent 34%),
        #fff;
}

.team-new-users-head h2 {
    margin: .05rem 0 .2rem;
    color: #14243a;
    font-size: 1.25rem;
    font-weight: 950;
}

.team-new-users-head p {
    max-width: 760px;
    margin: 0;
    color: #687282;
    font-size: .9rem;
    font-weight: 750;
}

.team-new-users-alert {
    flex: 0 0 auto;
    min-height: 34px;
    display: inline-flex;
    align-items: center;
    padding: .35rem .75rem;
    border-radius: 999px;
    background: rgba(226, 135, 104, .16);
    color: #9e4f36;
    font-size: .78rem;
    font-weight: 950;
}

.team-new-user-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
    gap: .7rem;
    max-height: calc(100vh - 17rem);
    overflow: auto;
    padding-right: .25rem;
    scrollbar-width: thin;
}

.team-new-user-card {
    min-width: 0;
    display: grid;
    align-content: start;
    gap: .65rem;
    padding: .72rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 14px;
    background: rgba(255, 255, 255, .94);
    box-shadow: 0 12px 26px rgba(20, 36, 58, .055);
}

.team-new-user-card.has-matches {
    border-color: rgba(226, 135, 104, .34);
    background: linear-gradient(180deg, rgba(255, 249, 244, .96), #fff);
}

.team-new-user-card header {
    min-width: 0;
    display: grid;
    grid-template-columns: 54px minmax(0, 1fr) auto;
    gap: .65rem;
    align-items: center;
}

.team-new-user-card header > img {
    width: 54px;
    height: 54px;
    border: 2px solid #fff;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: 0 4px 14px rgba(20, 36, 58, .12);
}

.team-new-user-card header > div {
    min-width: 0;
}

.team-new-user-card header a {
    color: inherit;
    text-decoration: none;
}

.team-new-user-card header span {
    display: block;
    color: #7a8390;
    font-size: .7rem;
    font-weight: 750;
}

.team-new-user-card header strong,
.team-new-user-card header small {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-new-user-card header strong {
    color: #14243a;
    font-weight: 950;
}

.team-new-user-card header small {
    color: #687282;
    font-size: .76rem;
    font-weight: 760;
}

.team-new-user-score {
    min-width: 32px;
    min-height: 32px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: #17263d;
    color: #fff;
    font-size: .84rem;
    font-weight: 950;
}

.team-new-user-signals {
    display: flex;
    flex-wrap: wrap;
    gap: .32rem;
}

.team-new-user-signals span {
    min-height: 24px;
    display: inline-flex;
    align-items: center;
    padding: .18rem .5rem;
    border-radius: 999px;
    background: rgba(255, 193, 7, .18);
    color: #7a5700;
    font-size: .7rem;
    font-weight: 950;
}

.team-new-user-signals .is-ok {
    background: rgba(25, 135, 84, .12);
    color: #146c43;
}

.team-new-user-matches {
    display: grid;
    gap: .38rem;
}

.team-new-user-matches > strong {
    color: #14243a;
    font-size: .82rem;
    font-weight: 950;
}

.team-new-user-matches > div {
    display: grid;
    gap: .2rem;
    padding: .48rem;
    border: 1px solid rgba(20, 36, 58, .07);
    border-radius: 9px;
    background: #fbfcfd;
}

.team-new-user-match-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.team-new-user-match-row a {
    min-width: 0;
    color: inherit;
    text-decoration: none;
}

.team-new-user-match-row .btn {
    min-height: 0;
    padding: .28rem .55rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 900;
}

.team-new-user-matches span,
.team-new-user-matches small {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-new-user-matches span {
    color: #14243a;
    font-size: .8rem;
    font-weight: 950;
}

.team-new-user-matches small,
.team-new-user-more {
    color: #687282;
    font-size: .74rem;
    font-weight: 800;
}

.team-record[data-team-item="users"] .team-record-actions {
    position: sticky;
    z-index: 2;
    bottom: -.85rem;
    gap: .45rem;
    padding-top: .7rem;
    border-top: 1px solid rgba(20, 36, 58, .08);
    background: linear-gradient(180deg, rgba(255, 255, 255, .76), rgba(255, 255, 255, .98));
    backdrop-filter: blur(10px);
}

@media (max-width: 1199.98px) {
    .team-users-overview,
    .team-user-deep-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .team-user-command-center {
        grid-template-columns: 1fr;
    }

    .team-user-command-kpis {
        grid-column: auto;
    }
}

@media (max-width: 767.98px) {
    .team-users-overview,
    .team-record[data-team-item="users"] .team-inline-grid,
    .team-user-deep-grid,
    .team-user-command-kpis {
        grid-template-columns: 1fr;
    }

    .team-review-admin-controls {
        grid-template-columns: 1fr;
    }

    .team-new-users-head {
        display: grid;
    }

    .team-new-user-grid {
        grid-template-columns: 1fr;
        max-height: none;
        overflow: visible;
    }

    .team-users-record-list {
        max-height: none;
        overflow: visible;
    }

    .team-user-command-center {
        padding: .65rem;
    }

    .team-user-command-cover,
    .team-user-command-cover img {
        min-height: 150px;
    }

    .team-user-command-profile {
        grid-template-columns: 64px minmax(0, 1fr);
    }

    .team-user-avatar-lg {
        width: 64px;
        height: 64px;
        font-size: 1.35rem;
    }

    .team-user-data-list {
        max-height: none;
    }

    .team-record[data-team-item="users"] .team-record-actions {
        position: static;
        justify-content: stretch;
    }

    .team-record[data-team-item="users"] .team-record-actions .btn {
        width: 100%;
    }
}

/* Dedicated team user module */
.team-admin-page {
    width: min(100%, 1480px);
    margin: 0 auto;
    padding: clamp(1rem, 2vw, 1.5rem);
    color: #14243a;
    background:
        radial-gradient(circle at top left, rgba(226, 135, 104, .08), transparent 28%),
        linear-gradient(180deg, rgba(255, 250, 246, .72), rgba(255, 255, 255, 0));
}

.team-admin-topbar {
    position: sticky;
    z-index: 20;
    top: calc(var(--navbar-height, 72px) + .35rem);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .45rem;
    overflow-x: auto;
    margin-bottom: .9rem;
    padding: .42rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 18px;
    background: rgba(255, 255, 255, .86);
    box-shadow: 0 16px 34px rgba(20, 36, 58, .08);
    backdrop-filter: blur(16px);
    scrollbar-width: none;
}

.team-admin-topbar::-webkit-scrollbar {
    display: none;
}

.team-admin-topbar a {
    min-width: 0;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .38rem;
    padding: .45rem .6rem;
    border-radius: 14px;
    color: #536071;
    font-size: .82rem;
    font-weight: 950;
    text-decoration: none;
}

.team-admin-topbar a.is-active,
.team-admin-topbar a:hover,
.team-admin-topbar a:focus {
    background: #17263d;
    color: #fff;
}

.team-admin-topbar .material-symbols-rounded {
    font-size: 1.2rem;
}

.team-admin-hero,
.team-user-detail-hero {
    position: relative;
    overflow: hidden;
    display: grid;
    gap: 1rem;
    margin-bottom: .9rem;
    padding: clamp(1rem, 2vw, 1.35rem);
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 22px;
    background:
        radial-gradient(circle at 100% 0, rgba(226, 135, 104, .18), transparent 34%),
        linear-gradient(135deg, rgba(255, 250, 246, .96), #fff);
    box-shadow: 0 18px 46px rgba(20, 36, 58, .08);
}

.team-admin-hero h1,
.team-user-detail-identity h1 {
    margin: .08rem 0 .25rem;
    font-family: "Fraunces", serif;
    color: #14243a;
    font-size: clamp(2rem, 4vw, 3.4rem);
    line-height: .96;
}

.team-admin-hero p,
.team-user-detail-identity p,
.team-admin-section-head p {
    margin: 0;
    color: #687282;
    font-weight: 760;
}

.team-admin-hero-metrics,
.team-user-detail-kpis {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
}

.team-admin-hero-metrics article,
.team-user-detail-kpis article {
    min-width: 0;
    padding: .72rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 16px;
    background: rgba(255, 255, 255, .76);
}

.team-admin-hero-metrics span,
.team-user-detail-kpis span {
    display: block;
    color: #7b6f67;
    font-size: .7rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-admin-hero-metrics strong,
.team-user-detail-kpis strong {
    display: block;
    color: #14243a;
    font-size: 1.55rem;
    line-height: 1;
}

.team-admin-toolbar,
.team-admin-section,
.team-admin-card {
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 18px;
    background: rgba(255, 255, 255, .9);
    box-shadow: 0 14px 34px rgba(20, 36, 58, .055);
}

.team-admin-toolbar {
    margin-bottom: .9rem;
    padding: .65rem;
}

.team-admin-search {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.team-admin-search .material-symbols-rounded {
    color: #c28d62;
}

.team-admin-search .form-control {
    border: 0;
    box-shadow: none;
    font-weight: 850;
}

.team-admin-section {
    display: grid;
    gap: .75rem;
    margin-bottom: .9rem;
    padding: .85rem;
}

.team-admin-section-head,
.team-admin-card-head {
    display: flex;
    align-items: start;
    justify-content: space-between;
    gap: .8rem;
}

.team-admin-section-head h2,
.team-admin-card-head h2 {
    margin: 0;
    color: #14243a;
    font-size: 1rem;
    font-weight: 950;
}

.team-admin-section-head > span,
.team-admin-card-head > span {
    flex: 0 0 auto;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    padding: .24rem .62rem;
    border-radius: 999px;
    background: rgba(226, 135, 104, .15);
    color: #9e4f36;
    font-size: .76rem;
    font-weight: 950;
}

.team-new-review-strip {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: .6rem;
}

.team-new-review-card,
.team-user-row,
.team-linked-user {
    color: inherit;
    text-decoration: none;
}

.team-new-review-card {
    display: grid;
    gap: .12rem;
    padding: .65rem;
    border: 1px solid rgba(226, 135, 104, .2);
    border-radius: 14px;
    background: #fffaf6;
}

.team-new-review-card strong,
.team-new-review-card small,
.team-new-review-card span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-new-review-card strong {
    font-weight: 950;
}

.team-new-review-card small,
.team-new-review-card span {
    color: #687282;
    font-size: .76rem;
    font-weight: 800;
}

.team-users-directory {
    display: grid;
    gap: .55rem;
}

.team-user-row {
    min-width: 0;
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) auto;
    gap: .7rem;
    align-items: center;
    padding: .72rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 16px;
    background: #fff;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.team-user-row:hover,
.team-user-row:focus {
    border-color: rgba(226, 135, 104, .32);
    box-shadow: 0 16px 34px rgba(20, 36, 58, .075);
    transform: translateY(-1px);
}

.team-user-row-main {
    min-width: 0;
    display: grid;
    gap: .04rem;
}

.team-user-row-main strong,
.team-user-row-main small,
.team-user-row-main span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.team-user-row-main strong {
    color: #14243a;
    font-weight: 950;
}

.team-user-row-main small,
.team-user-row-main span {
    color: #687282;
    font-size: .78rem;
    font-weight: 760;
}

.team-user-row-badges {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    gap: .32rem;
}

.team-user-row-badges em,
.team-user-detail-tags span,
.team-soft-chip {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: .18rem .52rem;
    border-radius: 999px;
    background: rgba(20, 36, 58, .07);
    color: #253047;
    font-size: .72rem;
    font-style: normal;
    font-weight: 950;
}

.team-user-row-badges em.is-success {
    background: rgba(25, 135, 84, .12);
    color: #146c43;
}

.team-user-row-badges em.is-warning {
    background: rgba(255, 193, 7, .18);
    color: #7a5700;
}

.team-user-row-badges em.is-muted {
    background: rgba(20, 36, 58, .08);
    color: #526173;
}

.team-user-row-status {
    grid-column: 1 / -1;
    justify-self: start;
    padding: .22rem .58rem;
    border-radius: 999px;
    font-size: .72rem;
    font-weight: 950;
}

.team-user-row-open {
    grid-row: 1;
    grid-column: 3;
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    border-radius: 999px;
    background: rgba(20, 36, 58, .06);
    color: #14243a;
    font-size: 1.25rem;
}

.team-user-row-status.is-ok,
.team-soft-chip.is-ok {
    background: rgba(25, 135, 84, .12);
    color: #146c43;
}

.team-user-row-status.is-warning,
.team-soft-chip.is-warning {
    background: rgba(255, 193, 7, .18);
    color: #7a5700;
}

.team-user-row-status.is-danger {
    background: rgba(220, 53, 69, .12);
    color: #a52834;
}

.team-admin-back {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    margin-bottom: .7rem;
    color: #536071;
    font-weight: 900;
    text-decoration: none;
}

.team-user-detail-hero {
    min-height: 260px;
    align-content: end;
}

.team-user-detail-cover {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .1), rgba(255, 250, 246, .95)),
        url("/images/brand/logo-short.png") center / 220px no-repeat,
        #fbf1ea;
}

.team-user-detail-cover img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}

.team-user-detail-cover::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, .22), rgba(255, 250, 246, .94));
}

.team-user-detail-identity {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: .85rem;
    align-items: end;
}

.team-user-detail-save {
    position: relative;
    z-index: 1;
    justify-self: end;
    align-self: end;
    display: grid;
    gap: .45rem;
    justify-items: end;
    padding: .75rem;
    border: 1px solid rgba(255, 255, 255, .68);
    border-radius: 18px;
    background: rgba(255, 253, 250, .76);
    box-shadow: 0 16px 34px rgba(20, 36, 58, .12);
    backdrop-filter: blur(12px);
}

.team-user-detail-save span:not(.material-symbols-rounded) {
    color: #687282;
    font-size: .75rem;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.team-user-detail-save .btn {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    white-space: nowrap;
}

.team-user-detail-save .material-symbols-rounded {
    font-size: 1.12rem;
}

.team-user-detail-tags {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem;
    margin-top: .5rem;
}

.team-user-detail-kpis {
    margin-bottom: .9rem;
}

.team-user-detail-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: .85rem;
}

.team-admin-card {
    min-width: 0;
    display: grid;
    gap: .75rem;
    padding: .85rem;
}

.team-admin-card.is-priority {
    border-color: rgba(226, 135, 104, .2);
    background: linear-gradient(135deg, rgba(255, 250, 246, .95), #fff);
}

.team-admin-form,
.team-admin-form-split,
.team-detail-list,
.team-review-standalone,
.team-review-edit-line {
    display: grid;
    gap: .55rem;
}

.team-admin-form label,
.team-review-standalone label {
    min-width: 0;
}

.team-admin-form label > span {
    display: block;
    margin-bottom: .2rem;
    color: #7b6f67;
    font-size: .72rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-admin-form-split {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.team-admin-check-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: .42rem;
}

.team-admin-check-grid .form-check {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0;
    padding: .42rem .55rem .42rem 1.95rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 12px;
    background: #fbfcfd;
    font-weight: 850;
}

.team-admin-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .45rem;
    padding-top: .4rem;
    border-top: 1px solid rgba(20, 36, 58, .08);
}

.team-admin-dl {
    display: grid;
    gap: .42rem;
    margin: 0;
}

.team-admin-dl div {
    display: grid;
    grid-template-columns: 118px minmax(0, 1fr);
    gap: .6rem;
    padding-bottom: .42rem;
    border-bottom: 1px solid rgba(20, 36, 58, .06);
}

.team-admin-dl dt {
    color: #7b6f67;
    font-size: .7rem;
    font-weight: 950;
    text-transform: uppercase;
}

.team-admin-dl dd {
    min-width: 0;
    margin: 0;
    overflow-wrap: anywhere;
    font-weight: 800;
}

.team-detail-list > article,
.team-linked-user {
    min-width: 0;
    display: grid;
    gap: .08rem;
    padding: .58rem;
    border: 1px solid rgba(20, 36, 58, .07);
    border-radius: 12px;
    background: #fbfcfd;
}

.team-link-review-item {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
}

.team-link-review-target {
    min-width: 0;
    display: grid;
    gap: .08rem;
    color: inherit;
    text-decoration: none;
}

.team-link-review-target:hover strong,
.team-link-review-target:focus strong {
    color: var(--pt-accent);
}

.team-link-review-item .btn {
    min-height: 0;
    padding: .32rem .7rem;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 900;
}

.team-detail-list strong,
.team-detail-list small,
.team-detail-list p {
    min-width: 0;
}

.team-detail-list strong {
    color: #14243a;
    font-weight: 950;
}

.team-detail-list small {
    color: #687282;
    font-size: .76rem;
    font-weight: 780;
}

.team-detail-list p {
    margin: .12rem 0 0;
    color: #4e5968;
    font-size: .82rem;
    line-height: 1.35;
}

.team-review-standalone {
    grid-template-columns: 94px minmax(140px, 1fr) minmax(140px, 1fr) auto;
}

.team-review-edit-line {
    grid-template-columns: 82px minmax(120px, 1fr) minmax(120px, 1fr) auto auto;
    margin-top: .35rem;
}

@media (min-width: 760px) {
    .team-admin-hero,
    .team-user-detail-hero {
        grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
        align-items: end;
    }

    .team-user-row {
        grid-template-columns: 58px minmax(0, 1.25fr) minmax(280px, 1fr) auto auto;
    }

    .team-user-row-badges,
    .team-user-row-status {
        grid-column: auto;
    }

    .team-user-row-open {
        grid-row: auto;
        grid-column: auto;
    }

    .team-user-detail-kpis {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .team-user-detail-grid {
        grid-template-columns: minmax(360px, .8fr) minmax(0, 1fr);
        align-items: start;
    }

    .team-admin-card.is-priority {
        grid-column: 1 / -1;
    }
}

@media (min-width: 1180px) {
    .team-user-detail-grid {
        grid-template-columns: minmax(400px, .7fr) repeat(2, minmax(0, 1fr));
    }

    .team-admin-card.is-priority {
        grid-column: span 1;
        grid-row: span 3;
        position: sticky;
        top: calc(var(--navbar-height, 72px) + 5rem);
    }
}

@media (max-width: 640px) {
    .team-admin-page {
        padding: .75rem;
    }

    .team-admin-topbar {
        top: .5rem;
        grid-template-columns: repeat(4, minmax(82px, 1fr));
        border-radius: 16px;
    }

    .team-admin-topbar a {
        min-height: 48px;
        flex-direction: column;
        gap: .1rem;
        padding: .35rem .2rem;
        font-size: .68rem;
    }

    .team-admin-hero-metrics,
    .team-user-detail-kpis,
    .team-review-standalone,
    .team-review-edit-line,
    .team-admin-dl div {
        grid-template-columns: 1fr;
    }

    .team-user-row {
        padding: .65rem;
    }

    .team-user-row-badges {
        padding-left: calc(58px + .7rem);
    }

    .team-user-row-status {
        margin-left: calc(58px + .7rem);
    }

    .team-user-detail-identity {
        grid-template-columns: 70px minmax(0, 1fr);
    }

    .team-user-detail-save {
        justify-self: stretch;
        justify-items: stretch;
    }

    .team-user-avatar-lg {
        width: 70px;
        height: 70px;
    }

    .team-admin-section-head,
    .team-admin-card-head,
    .team-admin-actions {
        display: grid;
        justify-content: stretch;
    }

    .team-admin-actions .btn {
        width: 100%;
    }
}

@media (max-width: 991.98px) {
    .messenger-page {
        height: calc(100dvh - 82px - env(safe-area-inset-bottom));
        min-height: 0;
        padding: .45rem;
    }

    .messenger-page .messenger-shell,
    .messenger-page .conversation-layout {
        grid-template-columns: 1fr;
    }

    .messenger-page .messenger-shell.has-selected-thread .messenger-list-panel {
        display: none;
    }

    .messenger-page .messenger-shell.has-selected-thread .messenger-detail-panel {
        display: block;
        height: 100%;
    }

    .messenger-page .messenger-shell:not(.has-selected-thread) .messenger-detail-panel {
        display: none;
    }

    .messenger-page .messenger-list-panel,
    .messenger-page .messenger-conversation {
        height: 100%;
        border-radius: 18px;
    }

    .messenger-page .messenger-list-panel {
        padding: .7rem;
    }

    .messenger-page .conversation-mobile-back {
        display: inline-flex;
        align-items: center;
        gap: .35rem;
        padding: .58rem .75rem;
        border-bottom: 1px solid var(--pt-line);
        background: #fff;
        color: #14243a;
        font-size: .84rem;
        font-weight: 900;
        text-decoration: none;
    }

    .messenger-page .messenger-conversation.is-embedded {
        min-height: 0;
    }

    .messenger-page .conversation-header {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: .45rem;
        padding: .6rem .7rem;
    }

    .messenger-page .conversation-title {
        gap: .55rem;
    }

    .messenger-page .thread-avatar {
        width: 40px;
        height: 40px;
    }

    .messenger-page .conversation-actions form,
    .messenger-page .conversation-actions .btn {
        width: auto;
    }

    .messenger-page .conversation-context {
        padding: .45rem .7rem;
    }

    .messenger-page .proposal-action-bar {
        display: grid;
        gap: .45rem;
    }

    .messenger-page .conversation-messages {
        min-height: 0;
        padding: .65rem;
    }

    .messenger-page .conversation-composer {
        bottom: auto;
        padding: .55rem;
        border-radius: 0;
    }

    .conversation-settings-panel {
        width: min(92vw, 390px);
    }
}

/* Hard lock the conversation page to an app viewport: no document scroll. */
html:has(.messenger-page),
body:has(.messenger-page),
html:has(.messenger-body),
body.messenger-body {
    height: 100%;
    overflow: hidden;
}

body:has(.messenger-page),
body.messenger-body {
    padding-bottom: 0;
}

body:has(.messenger-page) .mobile-bottom-nav,
body:has(.messenger-page) .site-footer {
    display: none;
}

.messenger-page {
    height: calc(100dvh - 72px);
    min-height: 0;
    max-height: calc(100dvh - 72px);
}

.messenger-page .messenger-empty-panel {
    min-height: 0;
    height: 100%;
}

.messenger-page .message-bubble {
    padding: .58rem .72rem;
    border-radius: 16px;
}

.messenger-page .message-bubble p {
    overflow-wrap: anywhere;
}

.messenger-page .empty-state {
    min-height: 0;
    padding: 1rem;
    box-shadow: none;
}

@media (max-width: 767.98px) {
    body:has(.messenger-page),
    body.messenger-body {
        padding-top: env(safe-area-inset-top);
    }

    .messenger-page {
        height: calc(100dvh - env(safe-area-inset-top));
        max-height: calc(100dvh - env(safe-area-inset-top));
        padding: .35rem;
    }

    .messenger-page .messenger-filter-tabs {
        margin-bottom: .55rem !important;
    }

    .messenger-page .messenger-list-panel > .d-flex {
        margin-bottom: .55rem !important;
    }

    .messenger-page .messenger-list-panel h1 {
        font-size: 1.25rem;
    }

    .messenger-page .messenger-thread-link {
        padding: .58rem;
        border-radius: 15px;
    }

    .messenger-page .thread-meta {
        font-size: .76rem;
    }

    .messenger-page .conversation-context .badge {
        flex: 0 0 auto;
        max-width: 180px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .messenger-page .proposal-action-bar {
        max-height: 112px;
        overflow: auto;
    }

    .messenger-page .message-bubble {
        max-width: min(92%, 520px);
        font-size: .88rem;
    }
}

/* Conversation app shell: final overrides for a no-document-scroll mobile-first inbox. */
html:has(.messenger-page),
body:has(.messenger-page),
html:has(.messenger-body),
body.messenger-body {
    width: 100%;
    height: 100%;
    min-height: 100%;
    overflow: hidden;
}

body:has(.messenger-page),
body.messenger-body {
    overscroll-behavior: none;
}

body:has(.messenger-page) > .navbar,
body:has(.messenger-page) .site-header,
body:has(.messenger-page) .mobile-bottom-nav,
body:has(.messenger-page) .site-footer,
body.messenger-body > .navbar,
body.messenger-body .site-header,
body.messenger-body .mobile-bottom-nav,
body.messenger-body .site-footer {
    display: none;
}

body:has(.messenger-page) > .container.mt-3,
body.messenger-body > .container.mt-3 {
    position: fixed;
    top: calc(.65rem + env(safe-area-inset-top));
    left: 50%;
    z-index: 2055;
    width: min(94vw, 520px);
    margin: 0 !important;
    padding: 0;
    transform: translateX(-50%);
    pointer-events: none;
}

body:has(.messenger-page) > .container.mt-3 .alert,
body.messenger-body > .container.mt-3 .alert {
    margin-bottom: .45rem;
    border-radius: 16px;
    box-shadow: 0 18px 42px rgba(20, 36, 58, .18);
    pointer-events: auto;
}

.messenger-page {
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    min-height: 0;
    padding: clamp(.45rem, 1.4vw, .9rem);
    overflow: hidden;
    background:
        radial-gradient(circle at 12% 0, rgba(226, 135, 104, .14), transparent 34%),
        linear-gradient(180deg, #fffaf6, #f7f9fa 72%);
}

.messenger-page .messenger-shell {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    display: grid;
    grid-template-columns: minmax(300px, 380px) minmax(0, 1fr);
    gap: clamp(.55rem, 1.2vw, .9rem);
    overflow: hidden;
}

.messenger-list-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin-bottom: .75rem;
}

.messenger-page .messenger-list-panel,
.messenger-page .messenger-detail-panel,
.messenger-page .messenger-conversation {
    min-height: 0;
    max-height: 100%;
}

.messenger-page .messenger-list-panel {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    overflow: hidden;
    padding: .85rem;
    border-radius: 22px;
}

.messenger-page .messenger-filter-tabs {
    margin-bottom: .7rem !important;
}

.messenger-page .messenger-thread-list {
    min-height: 0;
    overflow: auto;
    overscroll-behavior: contain;
    padding-right: .15rem;
}

.messenger-page .messenger-detail-panel {
    overflow: hidden;
}

.messenger-page .messenger-conversation.is-embedded {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    overflow: hidden;
    border-radius: 22px;
}

.messenger-page .conversation-mobile-back {
    display: none;
}

.messenger-page .conversation-header {
    min-height: 66px;
    padding: .72rem .85rem;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .65rem;
}

.messenger-page .conversation-title {
    min-width: 0;
    gap: .62rem;
}

.messenger-page .conversation-title > div {
    min-width: 0;
}

.messenger-page .conversation-title h1,
.messenger-page .conversation-title p {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.messenger-page .conversation-title h1 {
    font-size: clamp(.96rem, 1.8vw, 1.08rem);
}

.messenger-page .conversation-actions {
    flex: 0 0 auto;
    flex-wrap: nowrap;
}

.messenger-page .conversation-context {
    max-height: 132px;
    overflow: auto;
    padding: .55rem .85rem;
    overscroll-behavior: contain;
}

.messenger-page .context-pill-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: .1rem;
    scrollbar-width: none;
}

.messenger-page .context-pill-row::-webkit-scrollbar {
    display: none;
}

.messenger-page .proposal-action-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: .55rem;
    margin-top: .45rem;
    padding: .55rem;
    border-radius: 16px;
}

.messenger-page .conversation-chat {
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto auto;
    overflow: hidden;
}

.messenger-page .conversation-messages {
    min-height: 0;
    max-height: none;
    overflow: auto;
    overscroll-behavior: contain;
    padding: .75rem;
    scroll-behavior: smooth;
}

.conversation-load-older {
    justify-self: center;
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    min-height: 34px;
    padding: .4rem .72rem;
    border: 1px solid rgba(20, 36, 58, .1);
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    color: #425067;
    font-size: .78rem;
    font-weight: 800;
    text-decoration: none;
    box-shadow: 0 5px 14px rgba(20, 36, 58, .06);
}

.conversation-load-older:hover,
.conversation-load-older:focus-visible {
    border-color: rgba(226, 135, 104, .45);
    color: #8f432e;
}

.conversation-load-older .material-symbols-rounded {
    font-size: 1rem;
}

.messenger-page .conversation-composer {
    position: static;
    z-index: auto;
    grid-template-columns: minmax(0, 1fr) 46px;
    align-items: end;
    gap: .55rem;
    padding: .58rem;
    border-radius: 0;
    box-shadow: none;
}

.messenger-page .conversation-composer textarea {
    min-height: 44px;
    max-height: 92px;
    overflow: auto;
    resize: none;
}

.messenger-page .conversation-composer .btn {
    width: 46px;
    min-width: 46px;
    height: 46px;
    padding: 0;
}

.messenger-page .messenger-empty-panel {
    height: 100%;
    min-height: 0;
}

.conversation-settings-panel {
    max-width: 100vw;
}

.conversation-settings-panel .offcanvas-body {
    overflow: auto;
    overscroll-behavior: contain;
}

@media (max-width: 991.98px) {
    .messenger-page {
        padding: calc(.35rem + env(safe-area-inset-top)) .35rem calc(.35rem + env(safe-area-inset-bottom));
    }

    .messenger-page .messenger-shell {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .messenger-page .messenger-shell.has-selected-thread .messenger-list-panel {
        display: none;
    }

    .messenger-page .messenger-shell:not(.has-selected-thread) .messenger-detail-panel {
        display: none;
    }

    .messenger-page .messenger-list-panel,
    .messenger-page .messenger-conversation.is-embedded {
        border-radius: 20px;
    }

    .messenger-page .conversation-mobile-back {
        display: inline-flex;
        align-items: center;
        gap: .35rem;
        min-height: 38px;
        padding: .5rem .72rem;
        color: #14243a;
        font-size: .82rem;
        font-weight: 900;
        text-decoration: none;
        background: #fff;
        border-bottom: 1px solid rgba(20, 36, 58, .08);
    }

    .messenger-page .messenger-conversation.is-embedded {
        grid-template-rows: auto auto auto minmax(0, 1fr);
    }

    .messenger-page .conversation-header {
        min-height: 58px;
        padding: .55rem .65rem;
    }

    .messenger-page .thread-avatar {
        width: 38px;
        height: 38px;
    }

    .messenger-page .conversation-icon-button {
        width: 36px;
        height: 36px;
    }

    .messenger-page .conversation-context {
        max-height: 116px;
        padding: .45rem .65rem;
    }

    .messenger-page .proposal-action-bar {
        grid-template-columns: 1fr;
        max-height: 96px;
        overflow: auto;
    }

    .messenger-page .conversation-messages {
        padding: .62rem;
    }

    .messenger-page .message-bubble {
        max-width: min(92%, 560px);
        padding: .56rem .68rem;
        font-size: .88rem;
    }

    .conversation-settings-panel {
        width: min(94vw, 410px) !important;
    }
}

@media (max-width: 575.98px) {
    .messenger-list-head {
        margin-bottom: .55rem;
    }

    .messenger-page .messenger-list-panel {
        padding: .68rem;
    }

    .messenger-page .messenger-list-panel h1 {
        font-size: 1.22rem;
    }

    .messenger-page .messenger-thread-link {
        grid-template-columns: 42px minmax(0, 1fr);
        gap: .58rem;
        padding: .56rem;
    }

    .messenger-page .thread-meta {
        font-size: .74rem;
    }

    .messenger-page .conversation-title h1 {
        font-size: .95rem;
    }

    .messenger-page .conversation-title p {
        font-size: .72rem !important;
    }

    .messenger-page .conversation-actions .badge {
        display: none;
    }

    .messenger-page .conversation-composer {
        grid-template-columns: minmax(0, 1fr) 44px;
        gap: .48rem;
        padding: .5rem;
    }

    .messenger-page .conversation-composer textarea {
        min-height: 42px;
        max-height: 74px;
        font-size: .88rem;
    }

    .messenger-page .conversation-composer .btn {
        width: 44px;
        min-width: 44px;
        height: 44px;
    }
}

/* Team users module lives inside the standard cockpit rail. */
.team-workspace .team-admin-page {
    width: 100%;
    margin: 0;
    padding: 0;
    background: none;
}

.team-rail-nav-item.is-disabled {
    cursor: not-allowed;
    opacity: .62;
}

.team-user-detail-page .team-user-detail-grid {
    align-items: start;
}

.team-user-detail-page .team-admin-card {
    align-self: start;
}

@media (min-width: 1180px) {
    .team-user-detail-page .team-user-detail-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .team-user-detail-page .team-admin-card.is-priority {
        position: static;
        grid-row: auto;
    }
}

.team-user-admin-form-grid {
    display: contents;
}

.team-user-detail-page .team-admin-card-head {
    min-height: auto;
}

.team-card-help {
    margin: 0;
    color: #687282;
    font-size: .82rem;
    font-weight: 760;
    line-height: 1.35;
}

.team-compact-check {
    min-height: 38px;
    display: flex;
    align-items: center;
    gap: .45rem;
    margin: 0;
    padding: .45rem .6rem .45rem 1.95rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 12px;
    background: #fbfcfd;
    font-weight: 850;
}

.team-admin-save-card {
    display: grid;
    gap: .85rem;
    align-content: center;
    background: linear-gradient(135deg, rgba(255, 250, 246, .98), #fff);
}

.team-admin-save-card p {
    margin: .2rem 0 0;
    color: #687282;
    font-size: .82rem;
    font-weight: 760;
}

@media (min-width: 1500px) {
    .team-user-detail-page .team-user-detail-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* User management: resilient cards and forms at every content length. */
.team-user-detail-page,
.team-user-detail-page .team-user-detail-grid,
.team-user-detail-page .team-admin-card,
.team-user-detail-page .team-detail-list,
.team-user-detail-page .team-detail-list > article,
.team-user-detail-page form,
.team-user-detail-page label {
    min-width: 0;
}

.team-user-detail-page .team-admin-card {
    overflow: hidden;
    align-content: start;
}

.team-user-detail-page .team-admin-card-head {
    flex-wrap: wrap;
}

.team-user-detail-page .team-admin-card-head > span {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
}

.team-user-detail-page .form-control,
.team-user-detail-page .form-select,
.team-user-detail-page textarea,
.team-user-detail-page .btn {
    min-width: 0;
    max-width: 100%;
}

.team-user-detail-page .form-control,
.team-user-detail-page .form-select,
.team-user-detail-page textarea {
    width: 100%;
}

.team-user-detail-page .team-detail-list strong,
.team-user-detail-page .team-detail-list small,
.team-user-detail-page .team-detail-list p,
.team-user-detail-page .team-user-detail-identity p,
.team-user-detail-page .team-card-help {
    overflow-wrap: anywhere;
}

.team-user-detail-page .team-review-standalone,
.team-user-detail-page .team-review-edit-line {
    grid-template-columns: minmax(82px, .35fr) repeat(2, minmax(160px, 1fr));
    align-items: end;
}

.team-user-detail-page .team-review-standalone .btn,
.team-user-detail-page .team-review-edit-line .btn {
    width: max-content;
    max-width: 100%;
}

.team-user-detail-page .team-review-edit-line .btn:first-of-type {
    grid-column: 2;
}

@media (max-width: 1399px) {
    .team-user-detail-page .team-user-detail-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    .team-user-detail-page .team-user-detail-grid,
    .team-user-detail-page .team-review-standalone,
    .team-user-detail-page .team-review-edit-line {
        grid-template-columns: 1fr;
    }

    .team-user-detail-page .team-review-edit-line .btn:first-of-type {
        grid-column: auto;
    }

    .team-user-detail-page .team-review-standalone .btn,
    .team-user-detail-page .team-review-edit-line .btn {
        width: 100%;
    }
}

/* Petsitter directory cards: fixed visual rhythm and content-safe sections. */
.petsitter-app-grid {
    align-items: stretch;
}

.petsitter-app-card {
    position: relative;
    min-width: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto 1fr;
}

.petsitter-app-body {
    min-width: 0;
    height: 100%;
    display: grid;
    grid-template-rows: auto auto minmax(284px, 1fr) auto;
    align-content: start;
}

.petsitter-card-main {
    min-width: 0;
    min-height: 112px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(92px, auto);
    grid-template-rows: minmax(64px, auto);
    gap: .45rem;
    align-content: start;
}

.petsitter-card-main > div,
.petsitter-card-main h3,
.petsitter-card-main p {
    min-width: 0;
}

.petsitter-card-main h3,
.petsitter-card-main p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.petsitter-rating-pill {
    min-width: 0;
    min-height: 48px;
    display: block;
    align-self: start;
    justify-self: end;
    white-space: normal;
}

.petsitter-rating-pill .rating-stars {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: .2rem;
}

.petsitter-rating-pill .rating-stars-icons {
    min-height: 20px;
    font-size: 1rem;
}

.petsitter-rating-pill .rating-stars-label {
    display: block;
    overflow: hidden;
    font-size: .74rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.petsitter-rate-row {
    min-width: 0;
    min-height: 284px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-flow: row;
    grid-auto-rows: minmax(50px, auto);
    gap: .5rem;
    align-content: start;
    padding-top: .75rem;
}

.petsitter-rate-row .animal-mini-icon {
    display: none;
}

.pet-rate-mini {
    min-width: 0;
    display: grid;
    grid-template-columns: 32px minmax(0, 1fr);
    gap: .45rem;
    align-items: center;
    padding: .55rem .62rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 12px;
    background: rgba(255, 248, 240, .72);
}

.pet-rate-mini-icon {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #fff0e2;
    font-size: 1.05rem;
    line-height: 1;
}

.pet-rate-mini-copy {
    min-width: 0;
    display: grid;
    gap: .08rem;
}

.pet-rate-mini-copy strong,
.pet-rate-mini-copy small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Keep the numeric rating below the five paws, including in narrow cards. */
.petsitter-rating-pill > .rating-stars {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .18rem;
}

@media (max-width: 380px) {
    .petsitter-card-main {
        grid-template-columns: minmax(0, 1fr) minmax(88px, auto);
    }
}

.petsitter-rating-pill .rating-stars-label {
    width: 100%;
    line-height: 1.2;
}

.petsitter-card-actions {
    align-self: end;
}

@media (max-width: 380px) {
    .petsitter-rate-row {
        min-height: 284px;
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Guided registration */
.registration-page {
    min-height: calc(100dvh - var(--app-header-height, 72px));
    padding: 1.25rem 1rem 6rem;
    background: #f8f6f2;
}

.registration-shell {
    width: min(100%, 980px);
    margin-inline: auto;
}

.registration-heading {
    max-width: 720px;
    margin-bottom: 1.25rem;
}

.registration-heading h1 {
    margin: .25rem 0 .45rem;
    color: #14243a;
    font-family: "Nunito", var(--pt-font-sans, sans-serif);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1.08;
    letter-spacing: 0;
}

.registration-heading p {
    margin: 0;
    color: #687282;
    line-height: 1.55;
}

.registration-back-link,
.registration-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .78rem;
    font-weight: 850;
}

.registration-back-link {
    min-height: 44px;
    margin-bottom: 1.1rem;
    padding: .35rem 0;
    color: #14243a;
    text-decoration: none;
}

.registration-back-link .material-symbols-rounded {
    font-size: 1.05rem;
}

.registration-eyebrow {
    color: #9b4836;
    text-transform: uppercase;
}

.registration-wizard {
    position: relative;
    padding: 1rem;
    border-color: rgba(20, 36, 58, .1);
    background: #fffdfa;
    box-shadow: 0 18px 44px rgba(20, 36, 58, .08);
}

.registration-resume-notice {
    align-items: center;
    gap: .6rem;
    margin-bottom: 1rem;
    border: 1px solid #bde2df;
    background: #eff9f7;
    color: #285d59;
}

.registration-resume-notice:not(.d-none) {
    display: flex;
}

.registration-progress {
    position: relative;
    display: grid;
    grid-template-columns: repeat(var(--registration-step-count, 5), minmax(0, 1fr));
    gap: .25rem;
    margin: 0 0 1.5rem;
}

.registration-progress:has(.registration-progress-step:nth-child(4):last-child) {
    --registration-step-count: 4;
}

.registration-progress::before {
    content: none;
}

.registration-progress-line {
    position: absolute;
    top: 17px;
    right: 8%;
    left: 8%;
    height: 3px;
    overflow: hidden;
    border-radius: 999px;
    background: #e3e6e8;
}

.registration-progress-line > span {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: inherit;
    background: #5ba8a1;
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform .24s ease;
}

.registration-progress-step {
    position: relative;
    z-index: 1;
    min-width: 0;
    display: grid;
    justify-items: center;
    gap: .35rem;
    padding: 0;
    border: 0;
    background: transparent;
    color: #8a929d;
    font-size: .68rem;
    font-weight: 800;
    line-height: 1.15;
}

.registration-progress-step:disabled {
    opacity: 1;
    cursor: default;
}

.registration-progress-index {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border: 2px solid #e3e6e8;
    border-radius: 50%;
    background: #fffdfa;
    transition: border-color .18s ease, background-color .18s ease, color .18s ease, transform .18s ease;
}

.registration-progress-index .material-symbols-rounded {
    font-size: 1.05rem;
}

.registration-progress-step.is-complete,
.registration-progress-step.is-active {
    color: #14243a;
}

.registration-progress-step.is-complete .registration-progress-index {
    border-color: #70b9b3;
    background: #e9f6f4;
    color: #256f68;
}

.registration-progress-step.is-active .registration-progress-index {
    border-color: #14243a;
    background: #14243a;
    color: #fff;
    transform: translateY(-1px);
}

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

.registration-panel.is-active {
    animation: registration-panel-in .2s ease-out both;
}

.registration-panel-heading {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: .75rem;
    align-items: start;
    margin-bottom: 1.25rem;
}

.registration-panel-heading > .material-symbols-rounded {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: #fcece5;
    color: #c75f44;
    font-size: 1.35rem;
}

.registration-panel-heading h2,
.registration-subsection-heading h3 {
    margin: 0;
    color: #14243a;
    font-family: "Nunito", var(--pt-font-sans, sans-serif);
    font-weight: 900;
    letter-spacing: 0;
}

.registration-panel-heading h2 {
    font-size: 1.35rem;
}

.registration-panel-heading p,
.registration-subsection-heading p {
    margin: .2rem 0 0;
    color: #596474;
    font-size: .88rem;
    line-height: 1.45;
}

.registration-step-kicker {
    margin: 0 0 .15rem !important;
    color: #256f68 !important;
    font-size: .68rem !important;
    font-weight: 900;
    text-transform: uppercase;
}

.registration-profile-grid {
    display: grid;
    gap: 1rem;
    align-items: start;
}

.registration-profile-photo {
    width: min(180px, 65vw);
    margin-inline: auto;
}

.registration-profile-details {
    min-width: 0;
}

.registration-wizard .profile-upload img,
.registration-wizard .profile-upload-placeholder {
    width: 148px;
    max-width: 100%;
}

.registration-wizard .profile-upload-placeholder .material-symbols-rounded {
    font-size: 2rem;
}

.registration-wizard .file-drop {
    gap: .3rem;
}

.registration-wizard .file-drop > .material-symbols-rounded {
    color: #c75f44;
}

.registration-subsection-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin: .25rem 0 1rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(20, 36, 58, .09);
}

.registration-subsection-heading h3 {
    font-size: 1.05rem;
}

.registration-consent {
    margin-top: 1.25rem;
}

.registration-consent-item {
    margin: 0;
    padding: .9rem .9rem .9rem 2.7rem;
    border: 1px solid rgba(20, 36, 58, .1);
    border-radius: 8px;
    background: #fff;
    color: #344052;
    line-height: 1.45;
}

.registration-consent-item .form-check-input {
    margin-left: -1.75rem;
}

.registration-recap {
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr);
    gap: .75rem;
    align-items: start;
    padding: 1rem;
    border: 1px solid #d7e8e5;
    border-radius: 8px;
    background: #f1f8f7;
    color: #3c5553;
    font-size: .86rem;
}

.registration-recap > .material-symbols-rounded {
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #fff;
    color: #256f68;
}

.registration-inline-error {
    margin: .75rem 0 0;
    color: #a83f34;
    font-size: .85rem;
    font-weight: 750;
}

.registration-email-feedback {
    display: flex;
    align-items: center;
    gap: .4rem;
    margin-top: .55rem;
    padding: .6rem .7rem;
    border: 1px solid rgba(168, 63, 52, .22);
    border-radius: 8px;
    background: #fff3ef;
    color: #8d332b;
    font-size: .82rem;
    font-weight: 750;
}

.registration-email-feedback .material-symbols-rounded {
    flex: 0 0 auto;
    font-size: 1.1rem;
}

.registration-email-feedback a {
    margin-left: auto;
    color: #14243a;
    font-weight: 900;
    white-space: nowrap;
}

.registration-wizard-actions {
    position: sticky;
    z-index: 4;
    bottom: calc(68px + env(safe-area-inset-bottom, 0px));
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: .6rem;
    align-items: center;
    margin: 1.5rem -1rem -1rem;
    padding: .85rem 1rem calc(.85rem + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(20, 36, 58, .09);
    background: rgba(255, 253, 250, .96);
    backdrop-filter: blur(12px);
}

.registration-wizard-actions .btn {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .35rem;
}

.registration-step-status {
    color: #596474;
    font-size: .72rem;
    font-weight: 800;
    text-align: center;
}

.registration-wizard .form-floating > label,
.registration-wizard .form-floating > label .text-muted,
.registration-wizard .form-text {
    color: #4f5968 !important;
    opacity: 1;
}

.registration-wizard-actions .is-loading::before {
    content: "";
    width: 16px;
    height: 16px;
    border: 2px solid rgba(255, 255, 255, .45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: registration-spin .65s linear infinite;
}

@keyframes registration-panel-in {
    from { transform: translateY(6px); }
    to { transform: translateY(0); }
}

@keyframes registration-spin {
    to { transform: rotate(1turn); }
}

@media (min-width: 768px) {
    .registration-page {
        padding: 2.25rem 1.5rem 5rem;
    }

    .registration-heading h1 {
        font-size: 2.65rem;
    }

    .registration-wizard {
        padding: 1.5rem;
    }

    .registration-progress {
        margin-bottom: 2rem;
    }

    .registration-progress-step {
        font-size: .76rem;
    }

    .registration-panel {
        min-height: 410px;
    }

    .registration-profile-grid {
        grid-template-columns: 190px minmax(0, 1fr);
        gap: 1.4rem;
    }

    .registration-profile-photo {
        width: 100%;
    }

    .registration-wizard-actions {
        position: static;
        margin: 1.75rem -1.5rem -1.5rem;
        padding: 1rem 1.5rem;
    }
}

@media (min-width: 992px) {
    .registration-wizard {
        padding: 2rem;
    }

    .registration-wizard-actions {
        margin: 2rem -2rem -2rem;
        padding-inline: 2rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .registration-panel.is-active,
    .registration-wizard-actions .is-loading::before {
        animation: none;
    }

    .registration-progress-line > span {
        transition: none;
    }
}

/* Final production pass: content-safe home and directory layouts. */
@media (max-width: 767.98px) {
    .hero h1 {
        max-width: 100%;
        font-size: 3.35rem;
        line-height: .98;
        overflow-wrap: normal;
    }

    .hero h1 span {
        font-size: .9em;
    }
}

@media (max-width: 430px) {
    .hero h1 {
        font-size: 3rem;
    }
}

@media (max-width: 360px) {
    .hero h1 {
        font-size: 2.65rem;
    }
}

.petsitter-app-body {
    height: auto;
    display: flex;
    flex-direction: column;
}

.petsitter-card-main {
    min-height: 0;
    grid-template-rows: auto;
}

.petsitter-rate-row {
    min-height: 0;
    margin-top: auto;
}

/* Team control center: scalable filters, records and dedicated case screens. */
.team-directory-filters,
.team-audit-filters {
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(150px, 210px) auto auto;
    gap: .55rem;
    align-items: center;
    margin-bottom: .75rem;
}

.team-directory-filters-wide {
    grid-template-columns: minmax(220px, 1fr) repeat(2, minmax(150px, 210px)) auto auto;
}

.team-command-search {
    min-width: 0;
    position: relative;
    display: block;
}

.team-command-search > .material-symbols-rounded {
    position: absolute;
    top: 50%;
    left: .8rem;
    z-index: 1;
    color: #687282;
    font-size: 1.15rem;
    transform: translateY(-50%);
    pointer-events: none;
}

.team-command-search .form-control {
    width: 100%;
    padding-left: 2.45rem;
}

.team-pagination {
    min-height: 48px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    gap: .75rem;
    align-items: center;
    margin-top: .8rem;
    color: #687282;
    font-size: .82rem;
    font-weight: 800;
}

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

.team-case-page {
    min-width: 0;
}

.team-case-hero {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
}

.team-case-hero h1,
.team-case-hero p {
    overflow-wrap: anywhere;
}

.team-case-status {
    display: grid;
    gap: .35rem;
    justify-items: end;
    text-align: right;
}

.team-case-status small {
    color: #687282;
    font-size: .76rem;
    font-weight: 800;
}

.team-case-layout {
    min-width: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(310px, 390px);
    gap: .85rem;
    align-items: start;
}

.team-case-thread,
.team-case-management {
    min-width: 0;
    align-content: start;
}

.team-case-management {
    position: sticky;
    top: calc(var(--navbar-height, 72px) + 1rem);
}

.team-case-messages {
    min-width: 0;
    display: grid;
    gap: .65rem;
}

.team-case-messages .support-message-bubble {
    max-width: min(88%, 760px);
    margin: 0;
}

.team-case-messages .support-message-bubble.is-team {
    justify-self: end;
}

.team-case-messages .support-message-bubble p {
    margin: .35rem 0 0;
    overflow-wrap: anywhere;
}

.team-case-form,
.team-attachment-decision {
    display: grid;
    gap: .6rem;
}

.team-case-form label > span {
    display: block;
    margin-bottom: .25rem;
    color: #687282;
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.team-case-actions {
    display: grid;
    gap: .5rem;
}

.team-advanced-settings {
    padding-top: .45rem;
    border-top: 1px solid rgba(20, 36, 58, .08);
}

.team-advanced-settings summary {
    margin-bottom: .55rem;
    cursor: pointer;
    color: #14243a;
    font-size: .8rem;
    font-weight: 900;
}

.team-attachment-decision {
    margin-top: .45rem;
}

.team-report-parties {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: .65rem;
    align-items: center;
}

.team-report-parties > a,
.team-report-parties > div {
    min-width: 0;
    display: grid;
    gap: .12rem;
    padding: .75rem;
    border: 1px solid rgba(20, 36, 58, .09);
    border-radius: 8px;
    color: #14243a;
    background: #fbfcfd;
    text-decoration: none;
}

.team-report-parties span,
.team-report-parties small {
    color: #687282;
    font-size: .74rem;
    font-weight: 800;
}

.team-report-message {
    display: grid;
    gap: .4rem;
    padding: .85rem;
    border-left: 4px solid #e48e73;
    background: #fff8f3;
}

.team-report-message p {
    margin: 0;
    overflow-wrap: anywhere;
}

/* Legal publication and immutable audit history. */
.team-legal-form,
.team-audit-list {
    display: grid;
    gap: .75rem;
}

.team-legal-group .team-admin-form-split {
    align-items: start;
}

.team-legal-group label > span {
    display: block;
    margin-bottom: .25rem;
    color: #687282;
    font-size: .72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.team-legal-group label > small {
    display: block;
    margin-top: .25rem;
    color: #687282;
    font-size: .75rem;
}

.team-admin-span {
    grid-column: 1 / -1;
}

.team-sticky-actions {
    position: sticky;
    z-index: 5;
    bottom: .75rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .75rem;
    border: 1px solid rgba(20, 36, 58, .12);
    border-radius: 8px;
    background: rgba(255, 253, 250, .96);
    box-shadow: 0 14px 34px rgba(20, 36, 58, .12);
    backdrop-filter: blur(12px);
}

.team-sticky-actions p,
.team-sticky-actions small {
    display: block;
    margin: 0;
}

.team-sticky-actions small {
    color: #687282;
}

.team-admin-table-wrap,
.team-data-table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

.team-admin-table {
    width: 100%;
    border-collapse: collapse;
}

.team-admin-table th,
.team-admin-table td {
    padding: .65rem;
    border-bottom: 1px solid rgba(20, 36, 58, .08);
    text-align: left;
    vertical-align: middle;
}

.legal-plain-content {
    color: #344052;
    line-height: 1.7;
    overflow-wrap: anywhere;
}

.team-audit-row {
    min-width: 0;
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: .7rem;
    align-items: start;
    padding: .7rem;
    border: 1px solid rgba(20, 36, 58, .08);
    border-radius: 8px;
    background: #fff;
}

.team-audit-marker {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    color: #14243a;
    background: #f5ede4;
}

.team-audit-main,
.team-audit-meta {
    min-width: 0;
    display: grid;
    gap: .12rem;
}

.team-audit-main span,
.team-audit-main small,
.team-audit-meta small,
.team-audit-meta time {
    color: #687282;
    font-size: .74rem;
    overflow-wrap: anywhere;
}

.team-audit-meta {
    justify-items: end;
    text-align: right;
}

.team-audit-details {
    margin-top: .3rem;
}

.team-audit-details summary {
    cursor: pointer;
    color: #14243a;
    font-size: .76rem;
    font-weight: 900;
}

.team-audit-details dl {
    display: grid;
    gap: .25rem;
    margin: .4rem 0 0;
}

.team-audit-details dl div {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr);
    gap: .45rem;
}

.team-audit-details dt,
.team-audit-details dd {
    margin: 0;
    font-size: .73rem;
    overflow-wrap: anywhere;
}

@media (max-width: 991.98px) {
    .team-directory-filters,
    .team-directory-filters-wide,
    .team-audit-filters {
        grid-template-columns: minmax(0, 1fr) minmax(140px, 190px);
    }

    .team-case-layout {
        grid-template-columns: 1fr;
    }

    .team-case-management {
        position: static;
    }
}

@media (max-width: 575.98px) {
    .team-directory-filters,
    .team-directory-filters-wide,
    .team-audit-filters,
    .team-case-hero,
    .team-report-parties,
    .team-audit-row {
        grid-template-columns: 1fr;
    }

    .team-directory-filters .btn,
    .team-audit-filters .btn,
    .team-sticky-actions .btn {
        width: 100%;
    }

    .team-case-status,
    .team-audit-meta {
        justify-items: start;
        text-align: left;
    }

    .team-case-messages .support-message-bubble {
        max-width: 94%;
    }

    .team-report-parties > .material-symbols-rounded {
        transform: rotate(90deg);
    }

    .team-sticky-actions {
        display: grid;
        bottom: calc(72px + env(safe-area-inset-bottom, 0px));
    }

    .team-audit-marker {
        display: none;
    }
}

/* Compact user cockpit: prioritize actions and live information without dead columns. */
.dashboard-page {
    --dashboard-card-line: rgba(20, 36, 58, .1);
}

.dashboard-overview {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 1.25rem;
    padding: 1rem 1.15rem;
    overflow: visible;
}

.dashboard-user-summary {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: .9rem;
}

.dashboard-user-avatar,
.dashboard-user-avatar .avatar {
    width: 68px;
    height: 68px;
    flex: 0 0 68px;
}

.dashboard-user-copy {
    min-width: 0;
}

.dashboard-user-copy h1 {
    margin: 0 0 .15rem;
    color: var(--pt-primary);
    font-size: 1.3rem;
    font-weight: 900;
}

.dashboard-user-location {
    display: flex;
    align-items: center;
    gap: .2rem;
    margin: 0;
    color: #687282;
    font-size: .84rem;
}

.dashboard-user-location .material-symbols-rounded {
    font-size: 1rem;
}

.dashboard-user-bio {
    display: -webkit-box;
    max-width: 720px;
    margin: .35rem 0 0;
    overflow: hidden;
    color: #465163;
    font-size: .86rem;
    line-height: 1.35;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.dashboard-user-roles,
.dashboard-overview-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.dashboard-overview-actions {
    justify-content: flex-end;
}

.dashboard-notification-button {
    position: relative;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--dashboard-card-line);
    border-radius: 50%;
    background: #fff;
    color: var(--pt-primary);
    box-shadow: 0 8px 20px rgba(20, 36, 58, .08);
}

.dashboard-notification-button:hover,
.dashboard-notification-button:focus-visible,
.dashboard-notification-button[aria-expanded="true"] {
    border-color: rgba(228, 142, 115, .7);
    color: #a94f3c;
    background: #fff8f4;
}

.dashboard-notification-count {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 20px;
    height: 20px;
    display: grid;
    place-items: center;
    padding: 0 .3rem;
    border: 2px solid #fff;
    border-radius: 999px;
    background: #d75649;
    color: #fff;
    font-size: .65rem;
    font-weight: 900;
}

.dashboard-account-button {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    white-space: nowrap;
}

.dashboard-account-button .material-symbols-rounded {
    font-size: 1.15rem;
}

.dashboard-notification-menu {
    width: min(370px, calc(100vw - 2rem));
    margin-top: .55rem !important;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--dashboard-card-line);
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 20px 55px rgba(20, 36, 58, .16);
}

.dashboard-notification-menu-head {
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .75rem .9rem;
    border-bottom: 1px solid var(--dashboard-card-line);
}

.dashboard-notification-menu-head span,
.dashboard-notification-list b {
    min-width: 23px;
    height: 23px;
    display: inline-grid;
    place-items: center;
    padding: 0 .35rem;
    border-radius: 999px;
    background: #fbe7df;
    color: #a94f3c;
    font-size: .72rem;
}

.dashboard-notification-list {
    display: grid;
    padding: .35rem;
}

.dashboard-notification-list a {
    min-width: 0;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) auto;
    align-items: center;
    gap: .65rem;
    padding: .7rem;
    border-radius: 6px;
    color: var(--pt-primary);
    text-decoration: none;
}

.dashboard-notification-list a:hover,
.dashboard-notification-list a:focus-visible {
    background: #fff7f1;
}

.dashboard-notification-list a > .material-symbols-rounded {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #eef7f5;
    color: #256f68;
    font-size: 1.05rem;
}

.dashboard-notification-list a > span:nth-child(2) {
    min-width: 0;
    display: grid;
    gap: .1rem;
}

.dashboard-notification-list small {
    color: #737b87;
    line-height: 1.3;
}

.dashboard-notification-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    padding: 1.1rem;
    color: #687282;
}

.dashboard-actions-panel {
    padding: 1rem;
}

.dashboard-actions-heading {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .8rem;
}

.dashboard-actions-heading h2 {
    margin: .1rem 0 0;
    color: var(--pt-primary);
    font-size: 1.25rem;
    font-weight: 900;
}

.dashboard-actions-panel .action-tile-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: .65rem;
}

.dashboard-actions-panel .action-tile {
    --action-tile-solid: #f7f4ef;
    min-height: 96px;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: .45rem;
    padding: .7rem .45rem;
    border-color: rgba(20, 36, 58, .08);
    background: var(--action-tile-solid);
    box-shadow: none;
}

.dashboard-actions-panel .action-tile::before,
.dashboard-actions-panel .action-tile::after {
    display: none;
}

.dashboard-actions-panel .action-tile:hover,
.dashboard-actions-panel .action-tile:focus-visible {
    border-color: rgba(20, 36, 58, .18);
    background: var(--action-tile-solid);
    box-shadow: 0 10px 24px rgba(20, 36, 58, .08);
}

.dashboard-actions-panel .action-tile-icon {
    width: 38px;
    min-height: 38px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: rgba(255, 255, 255, .82);
    font-size: 1.35rem;
    box-shadow: 0 4px 12px rgba(20, 36, 58, .06);
}

.dashboard-actions-panel .action-tile-title {
    font-size: .78rem;
    line-height: 1.15;
    text-align: center;
}

.dashboard-actions-panel .action-tile-pets { --action-tile-solid: #fff3e8; }
.dashboard-actions-panel .action-tile-request { --action-tile-solid: #feeee8; }
.dashboard-actions-panel .action-tile-search { --action-tile-solid: #eaf6f2; }
.dashboard-actions-panel .action-tile-favorites { --action-tile-solid: #fbecef; }
.dashboard-actions-panel .action-tile-calendar { --action-tile-solid: #f1edf8; }
.dashboard-actions-panel .action-tile-rates { --action-tile-solid: #fbf4dc; }
.dashboard-actions-panel .action-tile-demands { --action-tile-solid: #faebed; }
.dashboard-actions-panel .action-tile-history { --action-tile-solid: #edf1f4; }
.dashboard-actions-panel .action-tile-info { --action-tile-solid: #eaf4f8; }

.dashboard-actions-panel .action-tile-badge {
    top: .4rem;
    right: .4rem;
}

@media (max-width: 1199.98px) {
    .dashboard-actions-panel .action-tile-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {
    .dashboard-overview {
        grid-template-columns: minmax(0, 1fr) auto;
    }

    .dashboard-user-summary {
        grid-column: 1 / -1;
    }

    .dashboard-user-roles {
        grid-column: 1;
    }

    .dashboard-overview-actions {
        grid-column: 2;
    }
}

@media (max-width: 575.98px) {
    .dashboard-page {
        padding-inline: .7rem;
    }

    .dashboard-overview {
        gap: .75rem;
        padding: .85rem;
    }

    .dashboard-user-summary {
        gap: .7rem;
    }

    .dashboard-user-avatar,
    .dashboard-user-avatar .avatar {
        width: 56px;
        height: 56px;
        flex-basis: 56px;
    }

    .dashboard-user-copy h1 {
        font-size: 1.08rem;
    }

    .dashboard-user-bio {
        -webkit-line-clamp: 1;
    }

    .dashboard-account-button {
        width: 46px;
        padding: 0;
        justify-content: center;
    }

    .dashboard-account-button > span:last-child {
        display: none;
    }

    .dashboard-actions-panel {
        padding: .8rem;
    }

    .dashboard-actions-panel .action-tile-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: .5rem;
    }

    .dashboard-actions-panel .action-tile {
        min-height: 88px;
    }

    .dashboard-page .client-current-requests {
        padding: 1rem !important;
    }

    .dashboard-page .client-current-requests h2 {
        font-size: 1.08rem;
    }
}

@media (max-width: 350px) {
    .dashboard-actions-panel .action-tile-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Messaging behaves like a native inbox: fixed viewport, familiar back placement. */
.messenger-page {
    background: #f5f7f8;
}

.messenger-page .messenger-shell {
    gap: .65rem;
}

.messenger-page .messenger-list-panel,
.messenger-page .messenger-conversation.is-embedded,
.messenger-page .messenger-empty-panel {
    border-radius: 8px;
    background: #fffdfa;
}

.messenger-list-head {
    justify-content: flex-start;
}

.messenger-list-head > div {
    min-width: 0;
}

.messenger-home-back {
    flex: 0 0 auto;
}

.messenger-page .messenger-filter-tabs {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .4rem;
}

.messenger-page .messenger-filter-tabs .btn {
    min-height: 40px;
    display: grid;
    place-items: center;
}

.messenger-page .messenger-thread-list {
    align-content: start;
    grid-auto-rows: max-content;
}

.messenger-page .messenger-thread-link {
    min-height: 64px;
    align-items: center;
}

.messenger-page .conversation-icon-button,
.messenger-page .conversation-icon-button:hover,
.messenger-page .conversation-icon-button:focus,
.messenger-page .conversation-icon-button .material-symbols-rounded {
    line-height: 1;
    text-decoration: none;
}

.registration-honeypot {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

.petsitter-species-row {
    min-height: 49px;
    margin-top: auto;
    padding-top: .7rem;
    border-top: 1px solid rgba(20, 36, 58, .1);
    display: flex;
    align-items: center;
    gap: .45rem;
    flex-wrap: wrap;
}

.petsitter-species-icon {
    width: 36px;
    height: 36px;
    display: inline-grid;
    place-items: center;
    flex: 0 0 36px;
    border: 1px solid rgba(194, 141, 98, .16);
    border-radius: 10px;
    background: #fff3e8;
    font-size: 1.18rem;
    line-height: 1;
}

.petsitter-species-icon.is-empty {
    filter: grayscale(.45);
    opacity: .68;
}

.team-user-detail-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .45rem;
    flex-wrap: wrap;
}

.team-erasure-modal {
    overflow: hidden;
    border: 1px solid rgba(20, 36, 58, .12);
    border-radius: 8px;
}

.team-erasure-modal .modal-header,
.team-erasure-modal .modal-footer {
    padding: .9rem 1rem;
    border-color: rgba(20, 36, 58, .1);
    background: #fffdfa;
}

.team-erasure-modal .modal-body {
    padding: 1rem;
    background: #f7f9fa;
}

.team-erasure-modal-title,
.team-erasure-column-head,
.team-erasure-preserved-note {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
}

.team-erasure-modal-title > .material-symbols-rounded {
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    flex: 0 0 42px;
    border-radius: 50%;
    background: #ffe8e3;
    color: #a63f31;
}

.team-erasure-modal-title .modal-title {
    margin: .08rem 0 0;
    color: #14243a;
    font-size: 1.08rem;
    font-weight: 900;
}

.team-erasure-blockers {
    margin-bottom: .85rem;
    padding: .85rem;
    border-left: 4px solid #c54838;
    border-radius: 6px;
    background: #fff0ed;
    color: #702a22;
}

.team-erasure-blockers h3,
.team-erasure-column h3 {
    margin: 0;
    font-size: .98rem;
    font-weight: 900;
}

.team-erasure-blockers p,
.team-erasure-column-head p {
    margin: .2rem 0 0;
    font-size: .82rem;
}

.team-erasure-blockers ul,
.team-erasure-column ul {
    margin: .65rem 0 0;
    padding-left: 1.2rem;
}

.team-erasure-summary {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
}

.team-erasure-column {
    min-width: 0;
    padding: .9rem;
    border: 1px solid rgba(20, 36, 58, .1);
    border-radius: 8px;
    background: #fff;
}

.team-erasure-column.is-erased .team-erasure-column-head > .material-symbols-rounded {
    color: #b44d3d;
}

.team-erasure-column.is-preserved .team-erasure-column-head > .material-symbols-rounded {
    color: #24796e;
}

.team-erasure-column li {
    margin-bottom: .38rem;
    color: #495768;
    font-size: .82rem;
    line-height: 1.35;
}

.team-erasure-preserved-note {
    margin: .7rem 0 0;
    padding-top: .65rem;
    border-top: 1px solid rgba(20, 36, 58, .1);
    color: #24796e;
    font-size: .8rem;
    font-weight: 800;
}

.team-erasure-preserved-note .material-symbols-rounded {
    font-size: 1.05rem;
}

.team-erasure-confirmation {
    display: grid;
    gap: .75rem;
    margin-top: .85rem;
    padding: .9rem;
    border: 1px solid rgba(166, 63, 49, .2);
    border-radius: 8px;
    background: #fffdfa;
}

.team-erasure-confirmation label:not(.form-check) > span {
    display: block;
    margin-bottom: .35rem;
    color: #25364d;
    font-size: .82rem;
    font-weight: 850;
}

.team-erasure-modal .modal-footer .btn-danger {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

@media (max-width: 720px) {
    .team-user-detail-actions,
    .team-erasure-summary {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }

    .team-user-detail-actions .btn,
    .team-erasure-modal .modal-footer .btn {
        justify-content: center;
        width: 100%;
    }

    .team-erasure-modal .modal-footer {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }
}

.messenger-page .messenger-thread-list > .empty-state {
    height: 100%;
    align-content: center;
    border: 0;
    background: transparent;
}

.messenger-page .conversation-header {
    background: #fffdfa;
}

.messenger-page .conversation-context {
    background: #fbf8f4;
}

.messenger-page .conversation-composer {
    padding-bottom: calc(.58rem + env(safe-area-inset-bottom, 0px));
    background: #fffdfa;
}

.messenger-page .conversation-composer textarea {
    transition: height .12s ease;
}

@media (max-width: 991.98px) {
    body:has(.messenger-page),
    body.messenger-body {
        padding-top: 0;
    }

    .messenger-page {
        padding: env(safe-area-inset-top, 0px) 0 env(safe-area-inset-bottom, 0px);
    }

    .messenger-page .messenger-list-panel,
    .messenger-page .messenger-conversation.is-embedded {
        border: 0;
        border-radius: 0;
    }

    .messenger-page .messenger-list-panel {
        padding: .75rem;
    }

    .messenger-page .messenger-conversation.is-embedded {
        grid-template-rows: auto auto minmax(0, 1fr);
    }

    .messenger-page .conversation-header {
        grid-template-columns: 38px minmax(0, 1fr) auto;
        gap: .5rem;
    }

    .messenger-page .conversation-mobile-back {
        width: 38px;
        height: 38px;
        display: grid;
        place-items: center;
        padding: 0;
        border: 1px solid rgba(20, 36, 58, .1);
        border-radius: 50%;
        background: #fff;
        color: var(--pt-primary);
        text-decoration: none;
    }

    .messenger-page .conversation-mobile-back .material-symbols-rounded {
        font-size: 1.2rem;
    }

    .messenger-page .conversation-composer {
        padding-bottom: calc(.5rem + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 575.98px) {
    .messenger-list-head {
        gap: .6rem;
    }

    .messenger-page .messenger-list-panel h1 {
        font-size: 1.18rem;
    }

    .messenger-page .conversation-header {
        padding-inline: .55rem;
    }

    .messenger-page .conversation-title {
        gap: .45rem;
    }

    .messenger-page .conversation-title .thread-avatar {
        width: 36px;
        height: 36px;
    }
}

/* Consistent screen navigation: back on the left, page actions on the right. */
.user-page-header,
.search-page-head.app-search-head {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: start;
    gap: .8rem;
}

.user-page-header > div,
.search-page-title {
    min-width: 0;
}

.user-page-header .app-back-link,
.search-page-back {
    border: 1px solid rgba(20, 36, 58, .1);
    background: #fff;
}

.search-filter-jump {
    width: 42px;
    height: 42px;
    border-radius: 8px;
}

#client-search-filters,
#guardian-search-filters {
    scroll-margin-top: 1rem;
}

.history-card-icon.material-symbols-rounded,
.history-filter-icon.material-symbols-rounded,
.history-fact-icon.material-symbols-rounded,
.history-message-link .material-symbols-rounded {
    line-height: 1;
}

.registration-choice-visual {
    width: 144px;
    height: 144px;
    padding: .75rem;
    border-radius: 8px;
}

.registration-choice-icon.material-symbols-rounded {
    color: var(--pt-primary);
    font-size: 1.8rem;
}

.registration-choice-arrow.material-symbols-rounded {
    font-size: 1.2rem;
}

@media (max-width: 767.98px) {
    .user-page-header,
    .search-page-head.app-search-head {
        grid-template-columns: 38px minmax(0, 1fr) 38px;
        gap: .55rem;
        padding: .8rem;
    }

    .search-page-head.app-search-head {
        padding: 0;
    }

    .user-page-header .app-back-link,
    .search-page-back,
    .search-filter-jump {
        width: 38px;
        height: 38px;
    }

    .user-page-header h1,
    .search-page-title h1 {
        overflow-wrap: anywhere;
    }

    .user-page-header p {
        font-size: .84rem;
        line-height: 1.4;
    }

    .registration-choice-visual {
        width: 108px;
        height: 108px;
    }

    .registration-choice-visual img {
        width: 82px;
        height: 82px;
    }
}

@media (min-width: 576px) {
    .dashboard-actions-panel .action-tile-grid {
        grid-template-columns: repeat(auto-fit, minmax(118px, 1fr));
    }
}

@media (min-width: 992px) {
    .registration-choice-page .container {
        max-width: 1200px;
    }

    .registration-choice-stack {
        max-width: none;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
        align-items: stretch;
    }

    .registration-choice-card {
        min-height: 156px;
    }

    .registration-choice-divider {
        flex-direction: column;
    }

    .registration-choice-divider::before,
    .registration-choice-divider::after {
        width: 1px;
        height: auto;
    }
}