#block-nexus-profilenavigation,
.profile-navigation-block {
    inset-block-start: 0;
    z-index: 4;
    inline-size: fit-content;
    margin-inline: auto;
}

#block-nexus-profilenavigation,
.profile-navigation-block {
    position: sticky;
}

body:has(#profile-stage) {
    padding-right: 0 !important;
}

#block-nexus-profilenavigation.scrolled #profile-navigation,
.profile-navigation-block.scrolled #profile-navigation {
    background: #fff;
    padding-block: 0.5rem;
    padding-inline: 1rem;
    border-radius: 14px;
    transform: translateY(32px);
}

#block-nexus-profilenavigation.scrolled-settled #profile-navigation,
.profile-navigation-block.scrolled-settled #profile-navigation {
    border-color: rgb(32 129 148 / 22%);
    box-shadow: 0 12px 28px rgb(32 129 148 / 10%);
}

#block-nexus-content {
    position: relative;
}

#profile-navigation {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 1px solid transparent;
    box-shadow: none;
    margin-inline: auto;
    transform: translateY(0);
    transition:
        transform 300ms ease-in,
        background-color 300ms ease-in,
        padding-block 300ms ease-in,
        padding-inline 300ms ease-in,
        border-color 180ms ease,
        box-shadow 180ms ease;
    will-change: transform;
}

#nav-logo {
    max-block-size: 50px;
}

.nav__list {
    --profile-nav-highlight-radius: 12px;
    --profile-nav-highlight-squircle-radius: 50%;
    --profile-nav-highlight-squircle-cap: 999px;

    display: flex;
    justify-content: space-evenly;
    font-size: var(--font-Xsmall);
    list-style: none;
    padding-block-end: 1rem;
    margin: 0;
    padding-inline-start: 0;
    isolation: isolate;

     anchor-name: --active-link;

    a {
        transition: 300ms;
    }

    &:not(:has(li:hover)) li:focus-within,
    li:is(:hover) {
        anchor-name: --active-link;

        a {
            color: #fff;
        }
    }

    &:has(li:is(.profile-dashboard, .profile-resources, .profile-calendar, .profile-comments):is(:hover, :focus-within)) {
        --profile-nav-highlight-squircle-cap: 2.25rem;
    }

    &::after {
        content: "";
        position: absolute;
        z-index: -1;

        inset-block-start: calc(anchor(bottom) - 20px);
        inset-block-end: calc(anchor(bottom) + 16px);
        inset-inline-start: anchor(left);
        inset-inline-end: anchor(right);
        background: linear-gradient(45deg, transparent, #208194 15% 85%, transparent);

        position-anchor: --active-link;

        transition: 650ms linear(0, 0.029 1.3%, 0.119 2.8%, 0.659 8.7%, 0.871 11.6%, 1.009 14.6%, 1.052 16.2%, 1.078 17.9%, 1.088 19.7%, 1.085 21.7%, 1.014 31.4%, 0.993 38%, 1.001 57.6%, 1);
    }

    &:has(li:focus-within)::after,
    &:has(li:hover)::after {
        inset-block-start: calc(anchor(top) + 0.5rem);
        inset-block-end: calc(anchor(bottom) + 0.5rem);
        inset-inline-start: calc(anchor(left) + 1rem);
        inset-inline-end: calc(anchor(right) + 1rem);
        background: #208194;

        border-radius: var(--profile-nav-highlight-radius);

        @supports (corner-shape: squircle) {
            border-radius: min(var(--profile-nav-highlight-squircle-radius), var(--profile-nav-highlight-squircle-cap));
            corner-shape: squircle;
        }
    }

    li {
        padding-block: 0.75rem;
        padding-inline: 1.5rem;
        text-transform: lowercase;
    }
}

#profile-stage {
    display: flex;
    align-items: flex-start;

    max-inline-size: 1280px;
    inline-size: 100%;

    transition: transform 400ms ease, height 300ms ease;
    scrollbar-width: none;

    container-name: staging;
    container-type: inline-size;
    margin-inline: auto;

    &>section {
        flex: 0 0 100%;
        align-self: flex-start;
        inline-size: 100%;
        min-inline-size: 0;
        padding-block: 1rem;
        padding-inline: 2rem;
        box-sizing: border-box;
        scroll-snap-align: start;
        opacity: 0;
        transition: 500ms ease-in-out;

        h3 {
            margin-block: .5rem 1rem;
        }

        &.is-active {
            opacity: 1;
        }
    }
}

#profile-stage:not(:has(> section.is-active)) > section:first-child {
    opacity: 1;
}

#profile-stage:not(:has(#profile-dashboard.is-active)) {
    overflow: hidden;

    &>section {
        max-inline-size: 100%;
        overflow-x: clip;
        overflow-wrap: anywhere;
    }

    &>section>* {
        max-inline-size: 100%;
        box-sizing: border-box;
    }
}

#profile-stage:has(#profile-dashboard.is-active) {
    overflow: visible;

    &>section:not(#profile-dashboard) {
        display: none;
    }
}

#profile-dashboard {
    --profile-dashboard-surface: rgb(255 255 255 / 94%);
    --profile-dashboard-divider: rgb(32 129 148 / 14%);
    --profile-dashboard-shadow: 0 18px 42px rgb(32 129 148 / 16%);
    --profile-dashboard-ink: #14303d;
    --profile-dashboard-accent-text: #00748a;
    --profile-dashboard-accent-text-hover: #005c6d;
    --profile-dashboard-icon-accent: #208194;
    --profile-dashboard-status-active: #2f9b62;
    --profile-dashboard-status-stopped: #bf5248;
}

body:has(#profile-dashboard) .page-title.title {
    display: none;
}

#profile-dashboard .profile-dashboard--staff {
    inline-size: 100%;
    margin-inline: auto;
    box-sizing: border-box;
}

#profile-dashboard .profile-dashboard--staff .profile-dashboard__stack {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    max-inline-size: 1700px;
    margin-inline: auto;
}

#profile-dashboard .profile-dashboard--staff .profile-dashboard__block {
    position: relative;
    flex: 0 0 100%;
    max-inline-size: 100%;
    min-inline-size: 0;
    z-index: 2;
}

#profile-dashboard .profile-dashboard--staff .profile-dashboard__block > * {
    min-inline-size: 0;
}

:is(.profile-dashboard__block--nexus-views-block__session-counts-ls-count-block,
.profile-dashboard__block--nexus-views-block__session-counts-wb-count-block) table:not(.table-responsive) {
    overflow: visible;
}
.profile-dashboard__block--nexus-views-block__session-counts-wb-count-block table tr {
    border-radius: 0 0 var(--b-rad) var(--b-rad);

    &>td:first-child {
        border-radius: 0 0 0 var(--b-rad);
    }
    &>td:last-child {
        border-radius: 0 0 var(--b-rad) 0;    
    }
}

@media (min-width: 1200px) {
    #profile-dashboard.is-active {
        padding-inline: 0;
    }

    #profile-dashboard.is-active>.profile-dashboard {
        inline-size: 100vw;
        max-inline-size: none;
        padding-inline: clamp(1rem, 2.2vw, 2.75rem);
        margin-inline: calc(50% - 50vw);
    }

    #profile-dashboard.is-active>.profile-dashboard.profile-dashboard--staff {
        padding-inline: clamp(1.5rem, 5vw, 5.5rem);
    }

    #profile-dashboard .profile-dashboard--staff .profile-dashboard__block--user-log-stage-counts-block,
    #profile-dashboard .profile-dashboard--staff .profile-dashboard__block--user-log-status-counts-block {
        flex: 0 0 50%;
        max-inline-size: 50%;
    }

    #profile-dashboard.is-active .profile-dashboard__grid {
        grid-template-columns: repeat(12, minmax(0, 1fr));
        max-inline-size: 1700px;
        margin-inline: auto;
        gap: 0.85rem;
        align-items: stretch;
    }

    #profile-dashboard.is-active .profile-dashboard__column {
        display: contents;
    }

    #profile-dashboard.is-active .profile-dashboard__card {
        block-size: 100%;
        align-content: start;
    }

    #profile-dashboard.is-active .profile-dashboard__card--details {
        grid-column: 1 / span 3;
        grid-row: 1;
    }

    #profile-dashboard.is-active .profile-dashboard__card--overview {
        grid-column: 1 / span 4;
        grid-row: 2;
    }

    #profile-dashboard.is-active .profile-dashboard__card--review {
        grid-column: 10 / -1;
        grid-row: 1;
    }

    #profile-dashboard.is-active .profile-dashboard__card--goal {
        grid-column: 9 / -1;
        grid-row: 2 / span 2;
        min-block-size: 0;
    }

    #profile-dashboard.is-active .profile-dashboard__card--sessions {
        grid-column: 5 / span 4;
        grid-row: 2;
    }

    #profile-dashboard.is-active .profile-dashboard__card--targets {
        grid-column: 4 / span 6;
        grid-row: 1;
    }

    #profile-dashboard.is-active .profile-dashboard__card--assistive {
        grid-column: 1 / span 4;
        grid-row: 3;
    }

    #profile-dashboard.is-active .profile-dashboard__card--resources {
        grid-column: 5 / span 4;
        grid-row: 3;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--details {
        grid-column: 1 / span 4;
        grid-row: 1;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--progress {
        grid-column: 5 / -1;
        grid-row: 1;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--overview {
        grid-column: 1 / span 4;
        grid-row: 2;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--goal {
        grid-column: 5 / -1;
        grid-row: 2;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--sessions {
        grid-column: 1 / span 4;
        grid-row: 3 / span 2;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--targets {
        grid-column: 5 / span 5;
        grid-row: 3;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--review {
        grid-column: 10 / -1;
        grid-row: 3;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--assistive {
        grid-column: 5 / span 4;
        grid-row: 4;
    }

    #profile-dashboard.is-active .profile-dashboard__grid:has(.profile-dashboard__card--progress) .profile-dashboard__card--resources {
        grid-column: 9 / -1;
        grid-row: 4;
    }
}

.profile-dashboard {
    display: grid;
    gap: 1.15rem;
}

:is(.profile-dashboard__eyebrow, .profile-dashboard__kicker) {
    margin: 0;
    font-weight: 800;
    line-height: 0.98;
    letter-spacing: -0.02em;
    text-transform: none;
    color: var(--profile-dashboard-ink);
}

.profile-dashboard__kicker {
    font-size: clamp(1.2rem, 1.45vw, 1.65rem);
    margin-bottom: 0.8rem;
}

.profile-dashboard__eyebrow {
    font-size: clamp(1.4rem, 1.9vw, 2.1rem);
    margin-bottom: 1rem;
}

.profile-dashboard__stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: minmax(0, 1fr) minmax(2.25rem, 0.6fr) min-content;
    gap: 0;
    align-items: stretch;
    align-self: stretch;
    block-size: 100%;
    min-block-size: 0;
    overflow: hidden;
}

.profile-dashboard__stat {
    position: relative;
    display: grid;
    grid-row: span 3;
    grid-template-rows: subgrid;
    align-items: stretch;
    gap: 0;
    block-size: 100%;
    min-block-size: 0;
    padding-block: 1.2rem 1.15rem;
    padding-inline: 1rem;
    text-align: center;
}

.profile-dashboard__stat:not(:nth-child(3n + 1))::before {
    content: "";
    position: absolute;
    inset-block: 0.8rem;
    inset-inline-start: 0;
    inline-size: 1px;
    background: var(--profile-dashboard-divider);
}

.profile-dashboard__stat-icon {
    display: grid;
    place-content: center;
    justify-self: center;
    inline-size: 3.7rem;
    block-size: 3.7rem;
    border-radius: 999px;
    background: rgb(32 129 148 / 10%);
    color: var(--profile-dashboard-icon-accent);
    font-size: clamp(1.65rem, 1.2rem + 1vw, 2.2rem);
    font-weight: 800;
    line-height: 1;
}

.profile-dashboard__stat-value {
    display: grid;
    place-content: start center;
    inline-size: 100%;
    padding-block: 0;
    color: var(--profile-dashboard-ink);
    font-size: clamp(1.35rem, 1.6vw, 1.75rem);
    font-weight: 800;
    line-height: 1;
}

.profile-dashboard__stat-label {
    display: grid;
    place-content: center;
    inline-size: 100%;
    min-block-size: 1.95rem;
    color: var(--profile-dashboard-accent-text);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.profile-dashboard__grid {
    display: grid;
    grid-template-columns: minmax(520px, 0.95fr) minmax(0, 1.05fr);
    gap: 1rem;
    align-items: start;
}

.profile-dashboard__column {
    display: grid;
    gap: 1rem;
    align-content: start;
    min-inline-size: 0;
}

.profile-dashboard__card {
    display: grid;
    gap: 0.95rem;
    padding: 1.15rem 1.2rem 1.25rem;
    border-radius: 1.25rem;
    background: var(--profile-dashboard-surface);
    border: 0;
    box-shadow: var(--profile-dashboard-shadow);
    min-inline-size: 0;
}

.profile-dashboard__card--overview {
    grid-template-rows: auto 1fr;
}

.profile-dashboard__card--details {
    grid-template-rows: 1fr;
}

.profile-dashboard__card--goal {
    grid-template-rows: auto minmax(0, 1fr) auto;
    min-block-size: 0;
}

.profile-dashboard__card-top {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.9rem;
}

.profile-dashboard__section-metric {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    gap: 0.45rem;
    color: var(--profile-dashboard-ink);
}

.profile-dashboard__section-metric--divided {
    margin-block-start: 0.25rem;
    padding-block-start: 0.85rem;
    border-top: 1px solid var(--profile-dashboard-divider);
}

.profile-dashboard__section-metric-label {
    color: rgb(20 47 60 / 76%);
    font-size: 0.82rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.35;
    text-transform: uppercase;
}

.profile-dashboard__section-metric-value {
    color: var(--profile-dashboard-accent-text);
    font-size: 1.25rem;
    font-weight: 800;
    line-height: 1;
}

.profile-dashboard__jump {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.35rem 0.75rem;
    margin: -0.35rem -0.75rem;
    border-radius: 999px;
    color: var(--profile-dashboard-accent-text);
    font-size: 0.95rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    transition: color 180ms ease, background-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.profile-dashboard__jump span {
    display: inline-flex;
    align-items: center;
}

.profile-dashboard__jump-icon {
    color: var(--profile-dashboard-icon-accent);
    font-size: 0.95rem;
    transition: transform 180ms ease;
}

.profile-dashboard__jump:hover,
.profile-dashboard__jump:focus {
    color: var(--profile-dashboard-accent-text-hover);
    background: rgb(15 122 167 / 10%);
    box-shadow: inset 0 0 0 1px rgb(15 122 167 / 14%);
}

.profile-dashboard__jump:focus-visible {
    outline: 3px solid rgb(15 122 167 / 20%);
    outline-offset: 3px;
}

.profile-dashboard__jump:hover .profile-dashboard__jump-icon,
.profile-dashboard__jump:focus .profile-dashboard__jump-icon {
    transform: translateX(3px);
}

.profile-dashboard__jump--mini {
    padding: 0.2rem 0.5rem;
    font-size: 0.85rem;
    line-height: 1.15;
}

.profile-dashboard__resource-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.4rem;
}

.profile-dashboard__list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.profile-dashboard__list-item {
    display: grid;
    gap: 0.34rem;
    padding: 0.9rem 0;
    border-radius: 0;
    background: transparent;
    border: 0;
}

.profile-dashboard__list-item:not(:last-child) {
    border-bottom: 1px solid var(--profile-dashboard-divider);
}

.profile-dashboard__list-item:first-child {
    padding-block-start: 0.15rem;
}

.profile-dashboard__list-item:last-child {
    padding-block-end: 0.15rem;
}

.profile-dashboard__list-item:is(.profile-dashboard__list-item--session, .profile-dashboard__list-item--target) {
    grid-template-columns: auto minmax(0, 1fr);
    column-gap: 0.9rem;
    align-items: center;
}

.profile-dashboard__entry-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 2.75rem;
    block-size: 2.75rem;
    border-radius: 999px;
    background: rgb(32 129 148 / 10%);
    color: var(--profile-dashboard-icon-accent);
    font-size: 1.34rem;
    line-height: 1;
}

.profile-dashboard__entry-icon :is(i, svg) {
    transition: opacity 320ms cubic-bezier(.22, .61, .36, 1), transform 320ms cubic-bezier(.22, .61, .36, 1);
    will-change: opacity, transform;
}

.profile-dashboard__entry-icon:is(.is-fading-out, .is-fading-in) :is(i, svg) {
    opacity: 0;
    transform: scale(0.86);
}

.profile-dashboard__list-item--target .profile-dashboard__entry-icon {
    background: rgb(32 129 148 / 13%);
}

.profile-dashboard__entry-body {
    display: grid;
    gap: 0.34rem;
    min-inline-size: 0;
}

.profile-dashboard__list-header {
    display: block;
    align-items: baseline;
}

.profile-dashboard__target-heading {
    display: grid;
    gap: 0.16rem;
    min-inline-size: 0;
}

.profile-dashboard__list-title {
    color: var(--profile-dashboard-ink);
    font-weight: 500;
    line-height: 1.4;
}

.profile-dashboard__target-date {
    color: rgb(20 47 60 / 78%);
    font-size: 0.95rem;
    font-weight: 400;
    line-height: 1.4;
}

.profile-dashboard__target-date::before {
    content: none;
}

.profile-dashboard__target-percent {
    color: var(--profile-dashboard-accent-text);
    font-size: 0.9rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    line-height: 1.3;
}

.profile-dashboard__target-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.55rem;
    margin-block-start: 0.2rem;
}

.profile-dashboard__target-summary .profile-dashboard__chip {
    justify-self: start;
}

.profile-dashboard__target-summary .profile-dashboard__target-percent {
    justify-self: end;
}

.profile-dashboard__list-item--target .profile-dashboard__entry-body {
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "header summary"
        "progress progress";
    column-gap: 0.85rem;
    row-gap: 0.35rem;
    align-items: start;
}

.profile-dashboard__list-item--target .profile-dashboard__list-header {
    grid-area: header;
}

.profile-dashboard__list-item--target .profile-dashboard__target-summary {
    grid-area: summary;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-self: end;
    gap: 0.22rem;
    margin-block-start: 0;
    text-align: right;
}

.profile-dashboard__list-item--target .profile-dashboard__target-summary .profile-dashboard__chip,
.profile-dashboard__list-item--target .profile-dashboard__target-summary .profile-dashboard__target-percent {
    justify-self: auto;
}

.profile-dashboard__list-item--target .profile-dashboard__target-progress {
    grid-area: progress;
}

.profile-dashboard__assistive-layout {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: center;
    min-inline-size: 0;
}

.profile-dashboard__donut {
    --assistive-complete: 0%;
    --assistive-progress: 0%;
    --assistive-bleed: 0%;
    --assistive-complete-color: #1d5f86;
    --assistive-progress-color: #56c6d2;
    --assistive-remaining-color: rgb(223 237 240);
    --assistive-progress-blend-color: color-mix(in srgb, var(--assistive-progress-color) 56%, var(--assistive-remaining-color) 44%);
    position: relative;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 0.28rem;
    inline-size: clamp(7.4rem, 10vw, 9rem);
    aspect-ratio: 1;
    border-radius: 50%;
    background:
        conic-gradient(
            var(--assistive-complete-color) 0 var(--assistive-complete),
            var(--assistive-progress-color) var(--assistive-complete) calc(var(--assistive-progress) - var(--assistive-bleed)),
            var(--assistive-progress-blend-color) var(--assistive-progress),
            var(--assistive-remaining-color) calc(var(--assistive-progress) + var(--assistive-bleed)) 100%
        );
    isolation: isolate;
}

.profile-dashboard__donut::after {
    content: "";
    position: absolute;
    inset: 1.15rem;
    z-index: 0;
    border-radius: inherit;
    background: rgb(250 254 255 / 98%);
}

.profile-dashboard__donut :is(span, small) {
    position: relative;
    z-index: 1;
}

.profile-dashboard__donut span {
    color: var(--profile-dashboard-ink);
    font-size: clamp(1.55rem, 2.2vw, 2.15rem);
    font-weight: 850;
    line-height: 1;
}

.profile-dashboard__donut small {
    display: block;
    color: rgb(20 47 60 / 66%);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.15;
    max-inline-size: 4.5rem;
    text-align: center;
    text-transform: uppercase;
}

.profile-dashboard__assistive-content {
    display: grid;
    gap: 0.85rem;
    min-inline-size: 0;
}

.profile-dashboard__assistive-legend {
    display: grid;
    gap: 0;
    margin: 0;
}

.profile-dashboard__assistive-legend-item {
    position: relative;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.85rem;
    padding-block: 0.45rem;
    padding-inline-start: 1.05rem;
}

.profile-dashboard__assistive-legend-item:not(:last-child) {
    border-bottom: 1px solid var(--profile-dashboard-divider);
}

.profile-dashboard__assistive-legend-item::before {
    content: "";
    position: absolute;
    inset-block-start: 0.88rem;
    inset-inline-start: 0;
    inline-size: 0.55rem;
    block-size: 0.55rem;
    border-radius: 999px;
    background: rgb(32 129 148 / 14%);
}

.profile-dashboard__assistive-legend-item--completed::before {
    background: #1d5f86;
}

.profile-dashboard__assistive-legend-item--progress::before {
    background: #56c6d2;
}

.profile-dashboard__assistive-legend dt {
    color: rgb(20 47 60 / 76%);
    font-size: 0.8rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    line-height: 1.25;
    text-transform: uppercase;
}

.profile-dashboard__assistive-legend dd {
    margin: 0;
    color: var(--profile-dashboard-ink);
    font-size: 1.12rem;
    font-weight: 850;
    line-height: 1;
}

.profile-dashboard__assistive-focus {
    display: grid;
    gap: 0.35rem;
    padding-block-start: 0.1rem;
}

.profile-dashboard__assistive-focus p {
    margin: 0;
    color: var(--profile-dashboard-ink);
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.3;
}

.profile-dashboard__assistive-focus ul,
.profile-dashboard__resource-list {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
    list-style: none;
}

.profile-dashboard__assistive-focus li {
    color: rgb(20 47 60 / 78%);
    font-size: 0.92rem;
    line-height: 1.45;
}

.profile-dashboard__resource-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.75rem;
    align-items: center;
    padding-block: 0.8rem;
}

.profile-dashboard__resource-item:not(:last-child) {
    border-bottom: 1px solid var(--profile-dashboard-divider);
}

.profile-dashboard__resource-item:first-child {
    padding-block-start: 0.1rem;
}

.profile-dashboard__resource-item:last-child {
    padding-block-end: 0.1rem;
}

.profile-dashboard__resource-icon {
    background: rgb(32 129 148 / 13%);
}

.profile-dashboard__resource-body {
    display: grid;
    gap: 0.18rem;
    min-inline-size: 0;
}

.profile-dashboard__resource-title {
    min-inline-size: 0;
    color: var(--profile-dashboard-ink);
    font-weight: 500;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.profile-dashboard__resource-type {
    color: var(--profile-dashboard-accent-text);
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.25;
    text-transform: uppercase;
}

.profile-dashboard__target-progress {
    position: relative;
    block-size: 0.52rem;
    overflow: hidden;
    border-radius: 999px;
    background: rgb(32 129 148 / 10%);
}

.profile-dashboard__target-progress-bar {
    display: block;
    inline-size: var(--profile-dashboard-target-progress, 0%);
    block-size: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #208194 0%, #55c7d4 88%, #55c7d4 100%);
    -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 90%, transparent 100%);
    mask-image: linear-gradient(90deg, #000 0%, #000 90%, transparent 100%);
}

:is(.profile-dashboard__list-meta, .profile-dashboard__meta, .profile-dashboard__card-copy, .profile-dashboard__empty) {
    margin: 0;
    color: rgb(20 47 60 / 78%);
    line-height: 1.7;
}

.profile-dashboard__list-item--session .profile-dashboard__list-meta {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.48rem;
}

.profile-dashboard__meta-dot {
    display: inline-flex;
    flex: 0 0 auto;
    inline-size: 0.24rem;
    block-size: 0.24rem;
    margin-inline: 0.08rem;
    border-radius: 999px;
    background: rgb(20 47 60 / 42%);
    transform: translateY(0.02rem);
}

.profile-dashboard__goal-copy {
    display: grid;
    align-content: start;
    gap: 0.35rem;
    block-size: 100%;
    padding: 1rem 1.15rem;
    min-block-size: 0;
    overflow: hidden;
    border-radius: 1rem;
    background: linear-gradient(135deg, rgb(238 249 252 / 88%), rgb(255 255 255 / 96%));
    box-shadow: inset 0 0 0 1px rgb(32 129 148 / 9%), 0 10px 24px rgb(32 129 148 / 8%);
}

.profile-dashboard__card--goal .profile-dashboard__card-copy,
.profile-dashboard__card--goal .profile-dashboard__empty {
    color: rgb(20 47 60 / 82%);
}

.profile-dashboard__card--goal .profile-dashboard__goal-content {
    min-block-size: 0;
}

.profile-dashboard__card--goal .profile-dashboard__goal-content > :first-child {
    margin-block-start: 0;
}

.profile-dashboard__card--goal .profile-dashboard__goal-content > :last-child {
    margin-block-end: 0;
}

.profile-dashboard__card--goal .profile-dashboard__goal-content :is(p, ul, ol) {
    margin-block: 0 0.85rem;
}

.profile-dashboard__card--goal .profile-dashboard__goal-content :is(ul, ol) {
    padding-inline-start: 1.2rem;
}

.profile-dashboard__detail-shell {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    flex: 1 1 auto;
    block-size: 100%;
    min-inline-size: 0;
}

.profile-dashboard__detail-identity {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 1rem;
    align-items: stretch;
    min-inline-size: 0;
}

.profile-dashboard__avatar {
    position: relative;
    align-self: center;
    inline-size: 7.5rem;
    block-size: 7.5rem;
    overflow: hidden;
    border-radius: 50%;
    background: linear-gradient(135deg, rgb(255 255 255 / 94%), rgb(208 240 245 / 92%));
    box-shadow: inset 0 0 0 1px rgb(32 129 148 / 12%), 0 12px 28px rgb(32 129 148 / 10%);
}

.profile-dashboard__avatar-image,
.profile-dashboard__avatar-fallback {
    inline-size: 100%;
    block-size: 100%;
}

.profile-dashboard__avatar-image {
    display: block;
    object-fit: cover;
}

.profile-dashboard__avatar-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--profile-dashboard-icon-accent);
    font-size: 2.45rem;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
}

.profile-dashboard__detail-primary {
    display: flex;
    flex-direction: column;
    gap: 0.28rem;
    justify-content: flex-start;
    min-block-size: 100%;
    min-inline-size: 0;
}

.profile-dashboard__detail-provider {
    margin-block-start: auto;
    padding-block-start: 0.9rem;
}

:is(.profile-dashboard__identity-name, .profile-dashboard__identity-email, .profile-dashboard__detail-provider, .profile-dashboard__detail-support, .profile-dashboard__detail-stage-status) {
    margin: 0;
    min-inline-size: 0;
}

.profile-dashboard__identity-name {
    color: var(--profile-dashboard-ink);
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.02;
    letter-spacing: -0.02em;
}

.profile-dashboard__identity-email {
    color: rgb(20 47 60 / 76%);
    font-size: 1rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}

.profile-dashboard__detail-meta {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    gap: 0.75rem;
    align-items: stretch;
    min-inline-size: 0;
    padding-block-start: 0.45rem;
}

.profile-dashboard__detail-group {
    display: grid;
    gap: 0.72rem;
    inline-size: 100%;
    padding-block: 0;
}

.profile-dashboard__detail-support,
.profile-dashboard__detail-course-end,
.profile-dashboard__detail-mentoring {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 0.68rem;
    row-gap: 0.18rem;
    margin: 0;
    color: rgb(20 47 60 / 84%);
    font-size: 0.95rem;
    line-height: 1.4;
}

.profile-dashboard__detail-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 1rem;
    block-size: 1rem;
    color: var(--profile-dashboard-icon-accent);
    font-size: 0.92rem;
    line-height: 1;
}

.profile-dashboard__detail-label {
    color: inherit;
    min-inline-size: 0;
}

.profile-dashboard__detail-value {
    color: var(--profile-dashboard-accent-text);
    font-weight: 700;
    justify-self: end;
}

.profile-dashboard__detail-provider {
    color: var(--profile-dashboard-accent-text);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
}

.profile-dashboard__detail-support {
    color: rgb(20 47 60 / 80%);
    font-size: 0.94rem;
    line-height: 1.35;
}

.profile-dashboard__detail-stage-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    align-self: stretch;
    margin-block-start: auto;
    padding: 0.42rem 0.78rem;
    border-radius: 999px;
    background: rgb(32 129 148 / 10%);
    color: var(--profile-dashboard-accent-text);
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.1;
    text-align: center;
    text-transform: uppercase;
}

.profile-dashboard__detail-stage-status-indicator {
    inline-size: 0.5rem;
    block-size: 0.5rem;
    border-radius: 999px;
    background: currentColor;
    flex: 0 0 auto;
}

.profile-dashboard__detail-stage-status-indicator--active {
    background: var(--profile-dashboard-status-active);
}

.profile-dashboard__detail-stage-status-indicator--stopped {
    background: var(--profile-dashboard-status-stopped);
}

.profile-dashboard__card--progress {
    gap: 1.15rem;
    background: var(--profile-dashboard-surface);
}

.profile-dashboard__progress-list {
    position: relative;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.65rem;
    margin: 0;
    padding: 0.2rem 0 0;
    list-style: none;
}

.profile-dashboard__progress-list::before {
    content: "";
    position: absolute;
    top: 1.05rem;
    inset-inline: 7%;
    block-size: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgb(32 129 148 / 36%), rgb(32 129 148 / 14%));
}

.profile-dashboard__progress-step {
    position: relative;
    z-index: 1;
    display: grid;
    justify-items: center;
    gap: 0.38rem;
    min-inline-size: 0;
    color: rgb(20 47 60 / 66%);
    text-align: center;
}

.profile-dashboard__progress-marker {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 2.1rem;
    block-size: 2.1rem;
    border: 2px solid rgb(32 129 148 / 32%);
    border-radius: 999px;
    background: rgb(246 253 254 / 96%);
    color: #208194;
    font-size: 0.9rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: 0 0 0 0.35rem rgb(245 253 254 / 88%);
}

.profile-dashboard__progress-marker::before {
    content: "";
    display: block;
    inline-size: 0.55rem;
    block-size: 0.55rem;
    border-radius: 999px;
    background: transparent;
}

.profile-dashboard__progress-marker::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.profile-dashboard__progress-step--complete .profile-dashboard__progress-marker {
    border-color: #208194;
    background: #208194;
    color: #fff;
}

.profile-dashboard__progress-step--complete .profile-dashboard__progress-marker::before,
.profile-dashboard__progress-step--complete .profile-dashboard__progress-marker::after,
.profile-dashboard__progress-step--stopped .profile-dashboard__progress-marker::before,
.profile-dashboard__progress-step--stopped .profile-dashboard__progress-marker::after {
    display: none;
}

.profile-dashboard__progress-step--active .profile-dashboard__progress-marker {
    border-color: #208194;
    background: #fff;
    color: #208194;
    box-shadow: 0 0 0 0.35rem rgb(32 129 148 / 14%), 0 0 0 0.65rem rgb(32 129 148 / 8%);
}

.profile-dashboard__progress-step--active .profile-dashboard__progress-marker::before {
    inline-size: 1.25rem;
    block-size: 1.25rem;
    border-radius: 999px;
    background:
        radial-gradient(circle, #fff 0 47%, transparent 49%),
        conic-gradient(from 0deg, transparent 0 205deg, rgb(32 129 148 / 8%) 230deg, rgb(32 129 148 / 58%) 282deg, #208194 318deg 360deg);
    animation: profile-dashboard-progress-spin 1.45s linear infinite;
}

.profile-dashboard__progress-step--upcoming .profile-dashboard__progress-marker {
    border-color: rgb(32 129 148 / 20%);
    background: #f8feff;
    color: transparent;
}

.profile-dashboard__progress-step--upcoming .profile-dashboard__progress-marker::before {
    inline-size: 0.34rem;
    block-size: 0.34rem;
    border-radius: 999px;
    background: #208194;
    opacity: 0;
    box-shadow: 0.46rem 0 0 #208194, 0.92rem 0 0 #208194;
    transform: translateX(-0.46rem);
    animation: profile-dashboard-progress-dots 2.65s ease-in-out infinite;
}

.profile-dashboard__progress-step--stopped .profile-dashboard__progress-marker {
    border-color: #a5473d;
    background: #a5473d;
    color: #fff;
}

.profile-dashboard__progress-step.is-current .profile-dashboard__progress-caption {
    color: var(--profile-dashboard-ink);
}

.profile-dashboard__progress-caption {
    color: rgb(20 47 60 / 84%);
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.2;
}

.profile-dashboard__progress-meta {
    color: rgb(20 47 60 / 62%);
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.25;
}

.profile-dashboard__progress-step--active .profile-dashboard__progress-meta {
    color: var(--profile-dashboard-accent-text);
}

.profile-dashboard__progress-step--stopped .profile-dashboard__progress-meta {
    color: #8d3b32;
}

.profile-dashboard__progress-note {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.85rem;
    align-items: start;
    padding: 1rem 0 0;
    border: 0;
    border-top: 1px solid var(--profile-dashboard-divider);
    border-radius: 0;
    background: transparent;
}

.profile-dashboard__card--progress-stopped .profile-dashboard__progress-note {
    border-color: rgb(165 71 61 / 20%);
    background: transparent;
}

.profile-dashboard__progress-note-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    inline-size: 2rem;
    block-size: 2rem;
    border-radius: 999px;
    background: rgb(32 129 148 / 10%);
    color: #208194;
    font-weight: 900;
}

.profile-dashboard__card--progress-stopped .profile-dashboard__progress-note-icon {
    background: rgb(165 71 61 / 12%);
    color: #8d3b32;
}

.profile-dashboard__progress-note-copy {
    display: grid;
    gap: 0.25rem;
    min-inline-size: 0;
}

.profile-dashboard__progress-note-copy p {
    margin: 0;
    color: rgb(20 47 60 / 82%);
    line-height: 1.55;
}

.profile-dashboard__progress-note-title {
    color: var(--profile-dashboard-ink) !important;
    font-weight: 800;
}

@keyframes profile-dashboard-progress-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes profile-dashboard-progress-dots {
    0%,
    8% {
        background: rgb(32 129 148 / 0);
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 rgb(32 129 148 / 0), 0.92rem 0 0 rgb(32 129 148 / 0);
    }

    16% {
        background: #208194;
        opacity: 1;
        transform: translate(-0.46rem, -0.15rem);
        box-shadow: 0.46rem 0 0 rgb(32 129 148 / 0), 0.92rem 0 0 rgb(32 129 148 / 0);
    }

    26% {
        background: #208194;
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 rgb(32 129 148 / 0), 0.92rem 0 0 rgb(32 129 148 / 0);
    }

    38% {
        background: #208194;
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem -0.15rem 0 #208194, 0.92rem 0 0 rgb(32 129 148 / 0);
    }

    48% {
        background: #208194;
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 #208194, 0.92rem 0 0 rgb(32 129 148 / 0);
    }

    60% {
        background: #208194;
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 #208194, 0.92rem -0.15rem 0 #208194;
    }

    70% {
        background: #208194;
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 #208194, 0.92rem 0 0 #208194;
    }

    86% {
        background: #208194;
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 #208194, 0.92rem 0 0 #208194;
    }

    91% {
        background: rgb(32 129 148 / 0);
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 #208194, 0.92rem 0 0 #208194;
    }

    96% {
        background: rgb(32 129 148 / 0);
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 rgb(32 129 148 / 0), 0.92rem 0 0 #208194;
    }

    100% {
        background: rgb(32 129 148 / 0);
        opacity: 1;
        transform: translate(-0.46rem, 0);
        box-shadow: 0.46rem 0 0 rgb(32 129 148 / 0), 0.92rem 0 0 rgb(32 129 148 / 0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .profile-dashboard__progress-step--active .profile-dashboard__progress-marker::before,
    .profile-dashboard__progress-step--upcoming .profile-dashboard__progress-marker::before {
        animation: none;
    }

    .profile-dashboard__progress-step--active .profile-dashboard__progress-marker::before {
        background: #208194;
        inline-size: 0.55rem;
        block-size: 0.55rem;
    }

    .profile-dashboard__progress-step--upcoming .profile-dashboard__progress-marker::before {
        opacity: 1;
        transform: translateX(-0.46rem);
        box-shadow: 0.46rem 0 0 #208194, 0.92rem 0 0 #208194;
    }
}

.profile-dashboard__meta {
    font-size: 0.92rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--profile-dashboard-accent-text);
}

.profile-dashboard__chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    background: rgb(32 129 148 / 12%);
    color: var(--profile-dashboard-accent-text);
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.profile-dashboard__list-item--more {
    background: transparent;
}

@container staging (max-width: 1083px) {
    .profile-dashboard__stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-dashboard__stat:not(:nth-child(3n + 1))::before {
        content: none;
    }

    .profile-dashboard__stat:not(:nth-child(2n + 1))::before {
        content: "";
        position: absolute;
        inset-block: 0.8rem;
        inset-inline-start: 0;
        inline-size: 1px;
        background: var(--profile-dashboard-divider);
    }

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

@container staging (max-width: 760px) {
    .profile-dashboard__stats {
        grid-template-columns: 1fr;
        grid-template-rows: none;
        block-size: auto;
    }

    .profile-dashboard__stat:not(:nth-child(2n + 1))::before {
        content: none;
    }

    .profile-dashboard__stat:not(:last-child) {
        border-bottom: 1px solid var(--profile-dashboard-divider);
    }

    .profile-dashboard__progress-list {
        grid-template-columns: repeat(5, minmax(8.5rem, 1fr));
        overflow-x: auto;
        padding-block-end: 0.45rem;
    }

    .profile-dashboard__progress-list::before {
        inset-inline: 4.25rem;
    }

    .profile-dashboard__card {
        padding: 0.9rem;
    }

    .profile-dashboard__kicker {
        font-size: 1rem;
        margin-bottom: 0;
    }

    .profile-dashboard__card-top {
        gap: 0.5rem;
    }

    .profile-dashboard__jump {
        font-size: 0.88rem;
    }

    .profile-dashboard__section-metric-label,
    .profile-dashboard__meta,
    .profile-dashboard__resource-type,
    .profile-dashboard__assistive-legend dt,
    .profile-dashboard__progress-caption,
    .profile-dashboard__progress-meta,
    .profile-dashboard__detail-stage-status {
        font-size: 0.74rem;
    }

    .profile-dashboard__section-metric-value {
        font-size: 1.05rem;
    }

    .profile-dashboard__list-title,
    .profile-dashboard__resource-title,
    .profile-dashboard__assistive-focus p {
        font-size: 0.95rem;
        line-height: 1.3;
    }

    :is(.profile-dashboard__list-meta, .profile-dashboard__card-copy, .profile-dashboard__empty) {
        font-size: 0.9rem;
        line-height: 1.46;
    }

    .profile-dashboard__goal-copy {
        padding: 0.85rem 0.95rem;
    }

    .profile-dashboard__card--goal .profile-dashboard__goal-content :is(p, ul, ol) {
        margin-block-end: 0.75rem;
    }

    .profile-dashboard__stat {
        grid-row: auto;
        grid-template-columns: auto minmax(0, 1fr);
        grid-template-rows: auto auto;
        align-items: center;
        column-gap: 0.85rem;
        row-gap: 0.12rem;
        min-block-size: auto;
        padding-block: 1.05rem;
        padding-inline: 0;
        text-align: left;
    }

    .profile-dashboard__stat-icon {
        grid-column: 1;
        grid-row: 1 / span 2;
        place-content: center;
        inline-size: 3.05rem;
        block-size: 3.05rem;
        font-size: clamp(1.4rem, 4.2vw, 1.7rem);
    }

    .profile-dashboard__stat-value {
        grid-column: 2;
        grid-row: 1;
        place-content: end start;
        justify-self: start;
        font-size: clamp(1.4rem, 5vw, 1.7rem);
    }

    .profile-dashboard__stat-label {
        grid-column: 2;
        grid-row: 2;
        place-content: start;
        justify-self: start;
        min-block-size: 0;
        font-size: 0.72rem;
        letter-spacing: 0.08em;
        text-align: left;
    }

    .profile-dashboard__detail-identity {
        grid-template-columns: 1fr;
        justify-items: start;
    }

    .profile-dashboard__avatar {
        inline-size: 5.25rem;
        block-size: 5.25rem;
    }

    .profile-dashboard__jump {
        inline-size: max-content;
        max-inline-size: 100%;
    }

    .profile-dashboard__identity-name {
        font-size: 1.08rem;
        line-height: 1.06;
    }

    .profile-dashboard__identity-email,
    .profile-dashboard__detail-provider,
    .profile-dashboard__detail-support,
    .profile-dashboard__detail-course-end,
    .profile-dashboard__detail-mentoring {
        font-size: 0.9rem;
        line-height: 1.34;
    }

    .profile-dashboard__detail-group {
        gap: 0.32rem;
    }

    .profile-dashboard__assistive-layout {
        grid-template-columns: 1fr;
        justify-items: start;
    }

    .profile-dashboard__donut {
        inline-size: 7.4rem;
    }

    .profile-dashboard__donut span {
        font-size: 1.75rem;
    }

    .profile-dashboard__donut small {
        font-size: 0.68rem;
    }

    .profile-dashboard__assistive-legend dd {
        font-size: 0.94rem;
    }

    .profile-dashboard__assistive-focus li {
        font-size: 0.9rem;
        line-height: 1.38;
    }

    .profile-dashboard__list-item--session .profile-dashboard__entry-icon,
    .profile-dashboard__resource-icon {
        inline-size: 2.4rem;
        block-size: 2.4rem;
        font-size: 1.08rem;
    }

    .profile-dashboard__list-item--session .profile-dashboard__entry-body,
    .profile-dashboard__resource-body {
        gap: 0.24rem;
    }

    .profile-dashboard__card--targets .profile-dashboard__card-top {
        gap: 0.5rem;
    }

    .profile-dashboard__card--targets .profile-dashboard__jump {
        margin-inline-start: 0;
    }

    .profile-dashboard__list-item--target {
        column-gap: 0.75rem;
        align-items: start;
    }

    .profile-dashboard__list-item--target .profile-dashboard__entry-icon {
        inline-size: 2.4rem;
        block-size: 2.4rem;
        font-size: 1.08rem;
        margin-block-start: 0.15rem;
    }

    .profile-dashboard__list-item--target .profile-dashboard__entry-body {
        grid-template-columns: 1fr;
        grid-template-areas:
            "header"
            "summary"
            "progress";
        row-gap: 0.42rem;
    }

    .profile-dashboard__list-item--target .profile-dashboard__target-heading {
        gap: 0.24rem;
    }

    .profile-dashboard__list-item--target .profile-dashboard__list-title {
        font-size: 0.95rem;
        line-height: 1.24;
    }

    .profile-dashboard__list-item--target .profile-dashboard__target-date {
        font-size: 0.9rem;
        line-height: 1.3;
    }

    .profile-dashboard__list-item--target .profile-dashboard__target-summary {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        justify-self: stretch;
        gap: 0.65rem;
        text-align: left;
    }

    .profile-dashboard__list-item--target .profile-dashboard__target-percent {
        font-size: 0.92rem;
        line-height: 1.1;
    }

    .profile-dashboard__list-item--target .profile-dashboard__chip {
        padding: 0.28rem 0.6rem;
        font-size: 0.72rem;
    }

    .profile-dashboard__list-item--target .profile-dashboard__target-progress {
        margin-block-start: 0.06rem;
    }
}

@container staging (max-width: 1083px) {
    .grid-auto {
        --min-col: 250px;
    }
}

@container staging (max-width: 870px) {
    .grid-auto {
        --min-col: 200px;
    }
}
  
#support-info :is(
    .field--name-field-type-of-support, 
    .field--name-field-evidence, 
    .field--name-field-type-of-support > .field__items, 
    .field--name-field-evidence > .field__items) {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: subgrid;

    .field__label {
        grid-column: 1 / -1;
    }
}

.field--name-field-case-manager,
.field--name-field-specialist-learning-mentor,
.field--name-field-wellbeing-mentor {
    grid-column: 1;
}  

.field--name-field-learning-mentoring-pm,
.field--name-field-wellbeing-mentoring-pm {
    grid-column: 2 / 4;
}

@media (max-width: 472px) {
    .field--name-field-learning-mentoring-pm,
    .field--name-field-wellbeing-mentoring-pm {
        grid-column: 1;
    }
}


body:not(.path-create-learner) .field--name-learner-profiles>.field__label {
    display: none;
}

article.profile .field--name-support-connect-profiles > .field__label {
    display: none;
}

#profile-session-records,
#profile-review-records {
    min-inline-size: 0;
    align-self: start;
}

#profile-session-records .view-content,
#profile-review-records .view-content {
    display: grid;
    gap: clamp(0.85rem, 1vw, 1.25rem);
}

:is(#block-learner-profile-records-support-sessions,
#block-learner-profile-records-support-reviews) {
    .view-content.row {
        margin-inline: 0;
    }

    table.views-table {
        inline-size: 100%;
        margin-block: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    table.views-table tbody tr:not(:last-child) td {
        border-bottom: 0;
    }

    table.views-table tbody tr::before {
        transition: color 180ms ease, transform 180ms ease;
    }

    td.views-field-view-node {
        padding-block: .22rem;
        padding-inline: .5rem 0;
        border: 0;
    }

    td.views-field-view-node a {
        display: block;
        padding-block: 0.9rem;
        padding-inline: 1rem;
        border: 1px solid rgb(32 129 148 / 12%);
        border-radius: .9rem;
        background: rgb(255 255 255 / 74%);
        box-shadow: inset 0 1px 0 rgb(255 255 255 / 45%);
        line-height: 1.45;
        text-decoration: none;
        word-break: normal;
        overflow-wrap: anywhere;
        transition: border-color 180ms ease, background-color 180ms ease, box-shadow 180ms ease;
    }

    tbody tr:is(:hover, :focus-within) td.views-field-view-node a {
        border-color: rgb(32 129 148 / 22%);
        background: rgb(244 251 252 / 92%);
        box-shadow: 0 4px 12px rgb(32 129 148 / 6%);
    }

    tbody tr:is(:hover, :focus-within)::before {
        color: #208194;
        transform: translateX(-2px);
    }
}

.profile-subsection {
    gap: 0.5rem 1rem;
    margin-block-end: 20px;

    h3 {
        grid-column: 1 / -1;
    }

    .contact-grouping {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: subgrid;
        gap: 0.5rem 1rem;
    }


    .field--name-field-contact-method .field__items {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem;
    }

    .field--name-field-type-of-support .field__items {
        flex-wrap: wrap;

        .field__item {
            flex-grow: 1;
            flex-basis: 100%;
        }
    }
}

.field--name-learning-provider-profiles {
    margin-block: 0.75rem 1.5rem;

    & > .field__label {
        display: none !important;
    }

    & > :is(.field__item, .field-item) {
        padding: 1rem;
        border: 1px solid rgb(32 129 148 / 12%);
        border-radius: 1rem;
        background: rgb(255 255 255 / 42%);
        box-shadow: 0 12px 28px rgb(32 129 148 / 8%);
    }

    & > :is(.field__item, .field-item) > .profile {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.85rem 1rem;
        align-items: start;
    }

    & > :is(.field__item, .field-item) > .profile > .field {
        min-inline-size: 0;
        margin: 0;
        padding: 0.9rem 1rem;
        border: 1px solid rgb(32 129 148 / 14%);
        border-radius: 0.9rem;
        background: rgb(255 255 255 / 78%);
        box-shadow: inset 0 1px 0 rgb(255 255 255 / 45%);
        display: grid;
        grid-template-columns: max-content minmax(0, 1fr);
        column-gap: 0.45rem;
        align-items: baseline;
    }

    & > :is(.field__item, .field-item) > .profile > .field > .field__label {
        display: block;
        margin: 0;
        padding: 0;
        float: none;
        font-size: 0.74rem;
        font-weight: 700;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #1b6b79;
    }

    & > :is(.field__item, .field-item) > .profile > .field > :is(.field__item, .field__items) {
        min-inline-size: 0;
        margin: 0;
    }

    & > :is(.field__item, .field-item) > .profile > .field--name-field-email > :is(.field__item, .field__items) {
        overflow-wrap: anywhere;
    }
}

#support-connect-profile {
    --support-connect-profile-card-border: rgb(32 129 148 / 14%);
    --support-connect-profile-card-shell: rgb(255 255 255 / 42%);
    --support-connect-profile-card-surface: rgb(255 255 255 / 78%);
    --support-connect-profile-card-shadow: 0 12px 28px rgb(32 129 148 / 8%);
    --support-connect-profile-card-shadow-inset: inset 0 1px 0 rgb(255 255 255 / 45%);
    --support-connect-profile-accent: #1b6b79;
    --support-connect-profile-ink: #23414c;
    --support-connect-profile-table-head-background: rgb(248 252 252 / 90%);

    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.9rem 1rem;
    margin-block: 0.75rem 1.5rem;
    align-items: start;
}

#support-connect-profile > .field {
    min-inline-size: 0;
    margin: 0;
    padding: 0.95rem 1rem;
    border: 1px solid var(--support-connect-profile-card-border);
    border-radius: 0.95rem;
    background: var(--support-connect-profile-card-surface);
    box-shadow: var(--support-connect-profile-card-shadow-inset);
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    column-gap: 0.45rem;
    align-items: baseline;
}

#support-connect-profile > .field > .field__label {
    display: block;
    float: none;
    margin: 0;
    padding: 0;
    font-size: 0.74rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--support-connect-profile-accent);
}

#support-connect-profile > .field > :is(.field__item, .field__items) {
    min-inline-size: 0;
    margin: 0;
    color: var(--support-connect-profile-ink);
    overflow-wrap: anywhere;
}

#support-connect-profile > .field--name-field-name {
    grid-column: 1;
}

#support-connect-profile > .field--name-field-contact-number {
    grid-column: 2;
}

#support-connect-profile > .field--name-field-email {
    grid-column: 1;
}

#support-connect-profile > .field--name-field-provider-name {
    grid-column: 2;
}

#support-connect-profile > .field--name-field-department {
    grid-column: 1 / -1;
}

#support-connect-profile > .views-element-container {
    grid-column: 1 / -1;
    display: grid;
    align-content: center;
    min-inline-size: 0;
    min-block-size: 3.625rem;
    margin: 0 !important;
    padding: 0.95rem 1rem;
    border: 1px solid var(--support-connect-profile-card-border);
    border-radius: 0.95rem;
    background: var(--support-connect-profile-card-surface);
    box-shadow: var(--support-connect-profile-card-shadow-inset);
    transition: opacity 240ms ease, transform 240ms ease;
}

#support-connect-profile > .views-element-container:has(.profile-session-view__toggle:focus-visible) {
    border-color: rgb(32 129 148 / 24%);
    box-shadow:
        0 0 0 3px rgb(32 129 148 / 10%),
        inset 0 1px 0 rgb(255 255 255 / 52%);
}

html.js #support-connect-profile > .views-element-container:not(.is-hydrated) {
    opacity: 0;
    visibility: hidden;
    transform: translateY(0.9rem);
    pointer-events: none;
    will-change: opacity, transform;
}

#support-connect-profile > .views-element-container > [data-contextual-id] {
    inline-size: 0;
    block-size: 0;
    overflow: hidden;
}

#support-connect-profile > .views-element-container > div:not([data-contextual-id]) {
    inline-size: 100%;
    min-inline-size: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) {
    display: grid;
    gap: 0.7rem;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view).is-static {
    gap: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .view-header {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 0.75rem;
    row-gap: 0;
    flex-wrap: nowrap;
    min-block-size: 1.75rem;
    margin: 0;
    padding-block-end: 0.7rem;
    border-bottom: 1px solid rgb(32 129 148 / 12%);
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view).is-collapsible .view-header {
    padding-block-end: 0;
    border-bottom: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view).is-static .view-header {
    padding-block-end: 0;
    border-bottom: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .view-header h5,
#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .view-header h4,
#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .view-header h3 {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-inline-size: 0;
    inline-size: 100%;
    min-block-size: 100%;
    margin: 0;
    color: var(--support-connect-profile-ink);
    font-size: clamp(0.96rem, 1.08vw, 1.1rem);
    font-weight: 700;
    line-height: 1.2;
    text-align: left;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    inline-size: 100%;
    min-block-size: 1.75rem;
    padding: 0;
    border: 0;
    border-radius: 0.7rem;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color 180ms ease, box-shadow 180ms ease;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle:hover {
    background: rgb(244 251 252 / 84%);
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle:is(:focus, :focus-visible) {
    outline: none;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle:focus-visible {
    background: transparent;
    box-shadow: none;
    color: #156070;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle:focus-visible .profile-session-view__toggle-text,
#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle:focus-visible .profile-session-view__count {
    color: #156070;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .view-header:has(.profile-session-view__toggle:focus-visible) {
    color: #156070;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle-label {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    flex: 1 1 auto;
    gap: 0.45rem;
    min-inline-size: 0;
    inline-size: 100%;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle-text {
    min-inline-size: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__count,
#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__status {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: rgb(32 129 148 / 10%);
    color: #1b6b79;
    font-size: 0.74rem;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__count {
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: #00748a;
    font-size: 0.96em;
    font-weight: 700;
    line-height: 1;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__status--empty {
    flex: 0 0 auto;
    align-self: center;
    justify-self: end;
    padding: 0.35rem 0.75rem;
    background: rgb(255 255 255 / 78%);
    border: 1px dashed rgb(32 129 148 / 16%);
    color: rgb(35 65 76 / 86%);
    font-size: 0.82rem;
    line-height: 1.3;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__toggle-icon {
    inline-size: 0.9rem;
    block-size: 0.9rem;
    margin-inline-start: 0;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 180ms ease;
    flex: 0 0 auto;
    justify-self: end;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view).is-expanded .profile-session-view__toggle-icon {
    transform: rotate(225deg);
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__body {
    display: grid;
    gap: 0.75rem;
    max-block-size: 24rem;
    overflow-y: auto;
    overflow-x: hidden;
    min-inline-size: 0;
    box-sizing: border-box;
    margin-block-start: 0.05rem;
    padding-block-start: 0.8rem;
    padding-inline-end: 0;
    border-top: 1px solid rgb(32 129 148 / 12%);
    scrollbar-width: thin;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__body[hidden] {
    display: none;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__body > * {
    min-inline-size: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .view-content.row {
    margin: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table {
    inline-size: 100%;
    max-inline-size: 100%;
    margin: 0;
    table-layout: auto;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid rgb(32 129 148 / 12%);
    border-radius: 0.95rem;
    background: rgb(255 255 255 / 86%);
    overflow: hidden;
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 45%);
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table :is(th, td).views-field-contextual-links {
    display: none;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table thead tr {
    background: var(--support-connect-profile-table-head-background);
    backdrop-filter: blur(12px);
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table thead tr::before {
    padding: 0.85rem 0.75rem;
    border-bottom: 1px solid rgb(32 129 148 / 10%);
    background: var(--support-connect-profile-table-head-background);
    border-top-left-radius: 0.95rem;
    color: #1b6b79;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    box-shadow: inset 0 -1px 0 rgb(32 129 148 / 10%);
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table thead th {
    padding: 0.85rem 1rem;
    border-bottom: 1px solid rgb(32 129 148 / 10%);
    background: var(--support-connect-profile-table-head-background);
    color: #1b6b79;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: normal;
    overflow-wrap: anywhere;
    vertical-align: middle;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table thead th:last-child {
    border-top-right-radius: 0.95rem;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody tr::before {
    inline-size: 3.4rem;
    padding: 0.9rem 0.75rem;
    background: rgb(255 255 255 / 86%);
    color: #4c6c75;
    font-size: 0.84rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    box-shadow: inset 0 -1px 0 rgb(32 129 148 / 8%);
    transition: background-color 180ms ease, color 180ms ease, transform 180ms ease;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody td {
    padding: 0.9rem 1rem;
    border-bottom: 1px solid rgb(32 129 148 / 8%);
    background: rgb(255 255 255 / 86%);
    color: rgb(35 65 76 / 90%);
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: break-word;
    vertical-align: middle;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody tr:last-child td {
    border-bottom: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody tr:last-child::before {
    border-bottom-left-radius: 0.95rem;
    box-shadow: none;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody tr:last-child td:last-child {
    border-bottom-right-radius: 0.95rem;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody td:first-child {
    color: var(--support-connect-profile-ink);
    font-weight: 600;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody td a {
    color: #00748a;
    font-weight: 600;
    text-decoration: none;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody td a:hover,
#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody td a:focus-visible {
    text-decoration: underline;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table td.views-field-dropbutton {
    position: relative;
    overflow: visible;
    white-space: nowrap;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table td.views-field-dropbutton .dropbutton-wrapper,
#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table td.views-field-dropbutton .dropbutton-widget {
    overflow: visible;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table td.views-field-dropbutton .dropbutton-wrapper.open {
    z-index: 30;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody tr:nth-last-child(-n + 2) td.views-field-dropbutton .dropbutton-wrapper.open .dropbutton-widget {
    inset-block-start: auto;
    inset-block-end: 0;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody tr {
    transition: background-color 180ms ease;
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody tr:is(:hover, :focus-within)::before {
    background: rgb(230 245 247 / 78%);
    color: #208194;
    transform: translateX(-2px);
}

#support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) table.views-table tbody tr:is(:hover, :focus-within) td {
    background: rgb(230 245 247 / 78%);
}

#support-connect-profile .profile-session-panel {
    border: 1px solid var(--support-connect-profile-card-border);
    border-radius: 0.95rem;
    background: rgb(255 255 255 / 72%);
    overflow: hidden;
}

#support-connect-profile .profile-session-panel > summary {
    cursor: pointer;
    list-style: none;
    padding: 1rem 1.1rem;
    font-weight: 700;
    color: var(--support-connect-profile-ink);
}

#support-connect-profile .profile-session-panel > summary::-webkit-details-marker {
    display: none;
}

#support-connect-profile .profile-session-panel > .profile-session-panel__body {
    padding: 0 1.1rem 1.1rem;
}

@media (max-width: 700px) {
    .field--name-learning-provider-profiles {
        & > :is(.field__item, .field-item) > .profile {
            grid-template-columns: minmax(0, 1fr);
        }
    }

    #support-connect-profile {
        grid-template-columns: minmax(0, 1fr);
    }

    #support-connect-profile > :is(.field, .views-element-container) {
        grid-column: 1;
    }

    #support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .view-header {
        grid-template-columns: minmax(0, 1fr);
        row-gap: 0.45rem;
    }

    #support-connect-profile :is(.view-sessions-mentor-view, .view-support-plans-case-manager-view) .profile-session-view__status--empty {
        justify-self: start;
    }
}

/******************************
Support connect calendar
******************************/

#support-connect-calendar {
    --support-connect-calendar-card-border: rgb(32 129 148 / 14%);
    --support-connect-calendar-card-surface: rgb(255 255 255 / 80%);
    --support-connect-calendar-card-entry-border: rgb(32 129 148 / 10%);
    --support-connect-calendar-card-entry-surface: rgb(255 255 255 / 92%);
    --support-connect-calendar-card-shadow: 0 12px 28px rgb(32 129 148 / 8%);
    --support-connect-calendar-card-shadow-inset: inset 0 1px 0 rgb(255 255 255 / 45%);
    --support-connect-calendar-accent: #1b6b79;
    --support-connect-calendar-ink: #23414c;
    --support-connect-calendar-divider: rgb(32 129 148 / 10%);
    --support-connect-calendar-scrollbar-track: rgb(32 129 148 / 10%);
    --support-connect-calendar-scrollbar-thumb: #208194;
    --support-connect-calendar-scrollbar-thumb-hover: #156b7b;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) {
    margin: 0;
    padding: 1.15rem;
    border: 1px solid var(--support-connect-calendar-card-border);
    border-radius: 1rem;
    background: var(--support-connect-calendar-card-surface);
    box-shadow: var(--support-connect-calendar-card-shadow-inset);
}

#support-connect-calendar .field--name-field-holiday-abesnce {
    margin-bottom: 1rem;
}

#support-connect-calendar .field--name-field-toil {
    margin-bottom: 3rem;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__label {
    display: block;
    float: none;
    margin: 0;
    padding: 0 0 0.9rem;
    border-bottom: 1px solid var(--support-connect-calendar-divider);
    color: var(--support-connect-calendar-accent);
    font-size: clamp(1rem, 1.1vw, 1.15rem);
    font-weight: 800;
    line-height: 1.2;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil).is-collapsible > .field__label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.9rem;
    cursor: pointer;
    user-select: none;
    transition: color 180ms ease;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil).is-collapsible > .field__label::after {
    content: "";
    flex: 0 0 auto;
    inline-size: 0.8rem;
    block-size: 0.8rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 180ms ease;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil).is-collapsible > .field__label:hover {
    color: #125c69;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil).is-collapsible > .field__label:is(:focus, :focus-visible) {
    outline: none;
    box-shadow: none;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil).is-collapsible:not(.is-expanded) > .field__label {
    padding-bottom: 0;
    border-bottom: 0;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil).is-collapsible.is-expanded > .field__label::after {
    transform: rotate(225deg);
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 0.9rem;
    margin: 0;
    padding: 0.9rem 0 0.35rem;
    overflow-x: auto;
    overflow-y: visible;
    overscroll-behavior-inline: contain;
    scrollbar-color: var(--support-connect-calendar-scrollbar-thumb) var(--support-connect-calendar-scrollbar-track);
    scrollbar-width: thin;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil).is-collapsible:not(.is-expanded) > .field__items,
#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items[hidden] {
    display: none;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items::-webkit-scrollbar {
    block-size: 0.85rem;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items::-webkit-scrollbar-track {
    background: var(--support-connect-calendar-scrollbar-track);
    border-radius: 999px;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items::-webkit-scrollbar-thumb {
    background: linear-gradient(90deg, #72bfcd, var(--support-connect-calendar-scrollbar-thumb));
    border: 2px solid var(--support-connect-calendar-scrollbar-track);
    border-radius: 999px;
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(90deg, #61b0be, var(--support-connect-calendar-scrollbar-thumb-hover));
}

#support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items > .field__item {
    flex: 0 0 calc((100% - 1.8rem) / 3);
    min-inline-size: 0;
    margin: 0;
    padding: 1rem 1.05rem 1.1rem;
    border: 1px solid var(--support-connect-calendar-card-entry-border);
    border-radius: 0.95rem;
    background: var(--support-connect-calendar-card-entry-surface);
    box-shadow: var(--support-connect-calendar-card-shadow);
    scroll-snap-align: start;
    scroll-snap-stop: always;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) {
    display: grid;
    gap: 0;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > .field {
    display: grid;
    grid-template-columns: minmax(9rem, 11.5rem) minmax(0, 1fr);
    gap: 0.3rem 0.9rem;
    align-items: start;
    min-inline-size: 0;
    margin: 0;
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--support-connect-calendar-divider);
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > .field:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > .field.clearfix::after {
    display: none;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > .field > .field__label {
    display: block;
    float: none;
    inline-size: auto;
    margin: 0;
    padding: 0;
    color: var(--support-connect-calendar-accent);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1.25;
    text-transform: uppercase;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > .field > :is(.field__item, .field__items) {
    min-inline-size: 0;
    margin: 0;
    color: var(--support-connect-calendar-ink);
    font-size: 0.98rem;
    font-weight: 600;
    line-height: 1.5;
    overflow-wrap: anywhere;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > :is(.field--name-field-description, .field--name-field-reason) {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.35rem;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > :is(.field--name-field-description, .field--name-field-reason) > .field__item {
    display: block;
    min-inline-size: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-weight: 500;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > :is(.field--name-field-description, .field--name-field-reason) > .field__item > * {
    display: inline;
    margin: 0;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > :is(.field--name-field-description, .field--name-field-reason) > .field__item:is(:hover, :focus-within) {
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > :is(.field--name-field-description, .field--name-field-reason) > .field__item:is(:hover, :focus-within) > * {
    display: block;
}

#support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) .field--name-field-authorisation > .field__item {
    display: inline-flex;
    align-items: center;
    inline-size: fit-content;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    background: rgb(32 129 148 / 10%);
    color: #156070;
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.1;
}

#support-connect-calendar .paragraph--type--time-off-in-lieu :is(.field--name-field-reason, .field--name-field-description) p {
    margin: 0;
}

#support-connect-calendar .paragraph--type--time-off-in-lieu .field--name-field-credited-hours > .field__item {
    font-variant-numeric: tabular-nums;
}

@media (max-width: 1100px) {
    #support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items > .field__item {
        flex-basis: calc((100% - 0.9rem) / 2);
    }
}

@media (max-width: 640px) {
    #support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) {
        padding: 1rem;
    }

    #support-connect-calendar :is(.field--name-field-holiday-abesnce, .field--name-field-toil) > .field__items > .field__item {
        padding: 0.95rem;
        flex-basis: 100%;
    }

    #support-connect-calendar :is(.paragraph--type--holiday-abesnce, .paragraph--type--time-off-in-lieu) > .field {
        grid-template-columns: minmax(0, 1fr);
        gap: 0.3rem;
    }
}

#learner-status {
    margin-block-end: 20px;

    &> .status-bar {
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        gap: 1rem;

        &>.field:not(:first-child, :last-child) {
            display: none;
        }
    }
}

/******************************
    Assitive Technology
******************************/

.field--name-field-software-recommended {

    .field__items {
        display: grid;
        grid-template-columns: repeat(auto-fit,minmax(min(220px,100%),1fr));
        gap: 0.5rem 2rem
    }

    .field__item {

        a::after {
            display: none;
        }
        
        &::before {
            content: "";
            display: inline-block;
            margin-right: .5rem;
            inline-size: 20px;
            block-size: 20px;
            font-weight: bold;
        }

        &.software-state--remaining::before {
            content: "\2B58";
            color: orangered;
        }

        &.software-state--in-progress::before {
            content: "\25D1";
            color: orangered;
        }

        &.software-state--complete::before {
            content: "\2714";
            color: hsl(122, 39%, 49%);
        }
    }
}

/*********************************

Profile and review session counter

**********************************/

.session-count {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 2rem;

    .overview-container {
        display: grid;
        grid-template-columns: 1fr minmax(18px, 38px);
        align-items: start;

        details {
            grid-row: 1;
            grid-column: 1 / -1;
            border: 0;
        }

        details+.field {
            grid-row: 1;
            grid-column: 2;
        }

        summary {
            position: relative;

            &::after {
                content: "";
                position: absolute;
                inset-block-start: 100%;
                inset-inline-start: 0;
                inline-size: 100%;
                block-size: 2px;
                background-color: #208194;
                border-radius: 50vw;
            }
        }

        .details-wrapper {
            display: grid;
            grid-template-columns: 1fr 1fr;
            padding-right: 0;

            .field:nth-child(-n + 2) {
                grid-column: 1 / -1;
            }

            .field:nth-child(2n + 4) {
                justify-self: center;
            }
        }

        &>.field {
            position: relative;
            margin-block-start: 1em;
            padding: 0.2em;
        }

        .field {
            white-space: nowrap;
        }
    }
}

/********************************

upcoming and todays session blocks

********************************/

:is(#block-block-todays-sessions, #block-block-upcoming-sessions) {
    .view-content {
        counter-reset: upcoming-session;

        &>.views-row {
            position: relative;
            display: flex;
            counter-increment: upcoming-session;

                &::before {
                content: counter(upcoming-session);
                display: inline-flex;
                align-items: center;
                justify-content: center;
                width: 2rem;
                margin-right: 0.75rem;
                font-weight: 700;
            }
        }
    }       
    .upcoming-session-entry {
        display: grid;
        grid-template-columns: 325px 235px auto;
        gap: 0.5rem;
        width: fit-content;
        margin-block-end: 0.5rem;

        border: 1px solid rgb(32 129 148 / 12%);
        padding-block: 0.9rem;
        padding-inline: 1rem;
        border-radius: .9rem;
        line-height: 1.45;  
        
        &:hover {
            border-color: rgb(32 129 148 / 22%);
            background: rgb(244 251 252 / 92%);
            box-shadow: 0 4px 12px rgb(32 129 148 / 6%);
        }
    }
}

#block-block-todays-sessions:not(:has(.view-content)) .view-header::after {
        content: "No sessions happening today — enjoy the rest of your day!";
        display: block;
        text-align: center;
}

#block-block-upcoming-sessions:not(:has(.view-content)) .view-header::after {
        content: "No sessions are currently booked. Use the calendar below to choose from available dates.";
        display: block;
        text-align: center;
}

/********************************

staff profile blocks

********************************/


:is(#block-nexus-views-block-session-counts-ls-count-block,
#block-nexus-views-block-session-counts-wb-count-block,
#block-nexus-views-block-session-counts-mentor-counts-block,
#block-nexus-views-block-session-counts-provider-counts-block) 
.views-exposed-form {
    display: none;                  /** Remove exposed filter from all blocks apart from #block-nexus-views-block-session-counts-total-count-block **/
}

:is(
    #block-nexus-views-block-session-counts-total-count-block,
    #block-nexus-views-block-session-counts-ls-count-block,
    #block-nexus-views-block-session-counts-wb-count-block,
    #block-nexus-views-block-session-counts-mentor-counts-block,
    #block-nexus-views-block-session-counts-provider-counts-block,
    #block-support-plan-mentor-counts,
    #block-support-plan-provider-counts,
    #block-user-log-stage-counts-block,
    #block-user-log-status-counts-block,
    #block-views-block-user-created-counts
) {
    --b-rad: 0.75rem;
    padding-bottom: 0;

    table :is(thead, tbody) tr::before {
        display: none;
    }

    .view-content.row {
        margin: 0;
    }
    .view-filters {
        margin-block-end: 0;
    }
}

#block-nexus-views-block-session-counts-total-count-block table {
    border-bottom: 0;
    border-radius: var(--b-rad) var(--b-rad) 0 0;
}

#block-nexus-views-block-session-counts-ls-count-block table {
        border-radius: 0;
}

#block-nexus-views-block-session-counts-wb-count-block table {
        border-top: 0;
        border-radius: 0 0 var(--b-rad) var(--b-rad);
}

:is(
    #block-nexus-views-block-session-counts-mentor-counts-block,
    #block-nexus-views-block-session-counts-provider-counts-block,
    #block-support-plan-mentor-counts,
    #block-support-plan-provider-counts,
    #block-user-log-stage-counts-block,
    #block-user-log-status-counts-block
    ) table {
    margin-block-start: 2rem;    
    border-radius: 12px;

    tbody tr:not(:last-child) td {
        border-bottom: 1px solid var(--mt-table-border-color);
    }
}

:is(
    .session-count-table,
    #block-support-plan-mentor-counts,
    #block-support-plan-provider-counts,
    #block-user-log-stage-counts-block,
    #block-user-log-status-counts-block
    ) .views-table {
        margin-block-end: 0;
}

:is(
    #block-nexus-views-block-session-counts-total-count-block,
    #block-nexus-views-block-session-counts-ls-count-block,
    #block-nexus-views-block-session-counts-wb-count-block,
    #block-nexus-views-block-session-counts-mentor-counts-block,
    #block-nexus-views-block-session-counts-provider-counts-block,
    #block-support-plan-mentor-counts,
    #block-support-plan-provider-counts,
    #block-user-log-stage-counts-block,
    #block-user-log-status-counts-block
    ) .views-table thead th {
    background: rgb(255 255 255 / 72%);
    -webkit-backdrop-filter: blur(14px) saturate(145%);
    backdrop-filter: blur(14px) saturate(145%);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 45%);
}

:is(
    #block-nexus-views-block-session-counts-total-count-block,
    #block-nexus-views-block-session-counts-ls-count-block,
    #block-nexus-views-block-session-counts-wb-count-block,
    #block-nexus-views-block-session-counts-mentor-counts-block,
    #block-nexus-views-block-session-counts-provider-counts-block,
    #block-support-plan-mentor-counts,
    #block-support-plan-provider-counts,
    #block-user-log-stage-counts-block,
    #block-user-log-status-counts-block
    ) .views-table tbody td {
    background: rgb(255 255 255 / 88%);
    transition: background-color 180ms ease;
}

:is(
    #block-nexus-views-block-session-counts-total-count-block,
    #block-nexus-views-block-session-counts-ls-count-block,
    #block-nexus-views-block-session-counts-wb-count-block,
    #block-nexus-views-block-session-counts-mentor-counts-block,
    #block-nexus-views-block-session-counts-provider-counts-block,
    #block-support-plan-mentor-counts,
    #block-support-plan-provider-counts,
    #block-user-log-stage-counts-block,
    #block-user-log-status-counts-block
    ) .views-table tbody tr:is(:hover, :focus-within) td {
    background: rgb(236 244 246 / 94%);
}

#views-exposed-form-session-counts-total-count-block :is(select.form-select, input.form-text, input.form-search, input.form-number) {
    background: rgb(255 255 255 / 84%);
    border-color: rgb(32 129 148 / 18%);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 42%);
}

#views-exposed-form-session-counts-total-count-block input.form-submit {
    box-shadow: 0 12px 28px rgb(32 129 148 / 14%);
}

#block-user-log-stage-counts-block {
    padding-right: 1rem;
}
#block-user-log-status-counts-block {
    padding-left: 1rem;
}

#block-views-block-user-created-counts .view-content.row {
    display: block;
}

#block-views-block-user-created-counts .view-user-counts {
    margin-block-end: 2rem;
    /* padding: 0;
    border: 1px solid var(--mt-table-border-color);
    border-radius: 1rem;
    box-shadow: 0 14px 34px rgb(32 129 148 / 8%);
    overflow: hidden; */
}

#block-views-block-user-created-counts .views-row {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 0.6rem;
    margin: 0;
    padding: 0.75rem;
}

#block-views-block-user-created-counts .views-field-nothing {
    grid-column: 1 / -1;
    margin: -0.75rem -0.75rem 0;
    padding: 20px 10px;
    /* background: var(--mt-table-head-background-color); */
}

#block-views-block-user-created-counts .views-field-nothing .field-content {
    display: block;
    color: var(--mt-color-high-contrast);
    letter-spacing: var(--mt-headings-letter-spacing);
    text-transform: uppercase;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1.2;
}

#block-views-block-user-created-counts .views-row > .views-field:not(.views-field-nothing) {
    inline-size: 100%;
    min-inline-size: 0;
    min-block-size: 4.75rem;
    padding: 0.5rem 0.45rem;
    border: 1px solid var(--mt-table-border-color);
    border-radius: 0.85rem;
    background: rgb(255 255 255 / 78%);
    box-shadow: 0 12px 30px rgb(32 129 148 / 6%), inset 0 1px 0 rgb(255 255 255 / 55%);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    gap: 0.3rem;
    text-align: left;
}

#block-views-block-user-created-counts .views-row > .views-field:not(.views-field-nothing) .views-label,
#block-views-block-user-created-counts .views-row > .views-field:not(.views-field-nothing) .field-content > span:first-child {
    display: block;
    inline-size: 100%;
    min-block-size: calc(2 * 1.2em);
    align-self: flex-start;
    font-size: 0.8rem;
    line-height: 1.2;
    color: #4e6a71;
    font-weight: 600;
    text-align: center;
}

#block-views-block-user-created-counts .views-row > .views-field:not(.views-field-nothing) .field-content:has(span) {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    gap: 0.35rem;
    min-block-size: 100%;
}

#block-views-block-user-created-counts .views-row > .views-field:not(.views-field-nothing) .field-content > span:last-child,
#block-views-block-user-created-counts .views-row > .views-field:not(.views-field-nothing) > .field-content:not(:has(span)) {
    display: block;
    margin-block-start: auto;
    inline-size: 100%;
    font-size: clamp(1.45rem, 1.2rem + 0.45vw, 1.9rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.04em;
    color: #163f47;
    text-align: center;
}

#block-views-block-user-created-counts .views-row > .views-field:not(.views-field-nothing):hover {
    border-color: rgb(32 129 148 / 24%);
    background: rgb(246 251 252 / 92%);
}

@media (max-width: 1400px) {
    #block-views-block-user-created-counts .views-row {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 1180px) {
    #block-views-block-user-created-counts .views-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 820px) {
    #block-views-block-user-created-counts .views-row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    #block-views-block-user-created-counts .views-row {
        grid-template-columns: 1fr;
    }

    #block-views-block-user-created-counts .views-row > .views-field:not(.views-field-nothing) {
        min-block-size: auto;
    }
}



.session-count-title {
    inline-size: 250px;
}

.session-count-capacity,
.session-count-engagement,
.session-count-remaining,
.session-count-total-col {
    inline-size: 100px;
}

.session-count-pending-col {
    inline-size: 100px;
}

.session-count-attended-col {
    inline-size: 200px;
}

.session-count-cancellation-col {
    inline-size: 300px;
}

.session-count-hover {
    opacity: 0;
    position: absolute;
    bottom: 0;
    left: 100%;
    width: 300px;
    z-index: 20;
    padding: 0.75rem 1rem;
    border-radius: 1rem;
    background: rgb(255 255 255 / 98%);
    box-shadow: 0 20px 36px rgb(20 47 60 / 14%);
    pointer-events: none;
    transform: translateY(-0.5rem);
    transition: opacity 0.2s ease, transform 0.2s ease;
}

:is(.session-count-capacity, .session-count-engagement) > span {
    position: relative; 
    cursor: help;
    
    &:hover > .session-count-hover {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
    }
}


/******************

Profile comments

******************/

.view-profile-comments .views-row {
    background: rgba(255, 255, 255, 0.8);
    border-radius: .75rem;
    padding-block: 0.5rem;
    padding-inline: 1rem;
    border: 1px solid #fff;
    margin-block: 10px 20px;  
}

.profile-comments-title {
    display: flex;
    gap: 1rem;   
}

.profile-comments-edit-actions {
    flex: 1;
    display: flex;
    gap: 3rem;
    justify-content: end;
}

#profile-ilp-block-grid {
    display: grid;
    grid-template-areas: 
    "stack"
    "stackmid"
    "stackend";
    gap: 1rem;

    #block-ilp-targets-views-block {
        grid-area: stackend;        
    }

    #block-learner-profile-records-support-plans {
        grid-area: stack; 
        inline-size: fit-content;
    }

    #block-nexus-learnerilptargetlink {
        grid-area: stack; 
        inline-size: fit-content;
        align-self: start;
        justify-self: end;

        .learner-ilp-target-link-block {
            display: flex;
            flex-wrap: wrap;
            justify-content: end;
            align-items: end;
            gap: .75rem;

            > * + * {
                margin-inline-start: .75rem;
            }
        }
    }

    > .field--name-field-long-term-goal {
        grid-area: stackmid;
        padding: 1.25rem 1.5rem 1.6rem;
        border: 1px solid rgb(20 47 60 / 10%);
        border-radius: 1rem;
        background: rgb(255 255 255 / 45%);
        box-shadow: 0 10px 24px rgb(20 47 60 / 6%);

        > .field__label {
            margin-bottom: .5rem;
            font-size: 1.15rem;
            font-weight: 700;
            color: #35515f;
        }

        :is(.field__item, .field__items) {
            color: rgb(53 81 95 / 88%);
            line-height: 1.82;
            max-inline-size: 110ch;
        }

        p {
            margin: 0;
        }
    }
}

#profile-ilp-block-grid:has(> .neurodiversity-report-profile-link-block) {
    grid-template-columns: max-content max-content minmax(0, 1fr) max-content;
    grid-template-areas:
    "plans reports . actions"
    "stackmid stackmid stackmid stackmid"
    "stackend stackend stackend stackend";

    #block-learner-profile-records-support-plans {
        grid-area: plans;
    }

    > .neurodiversity-report-profile-link-block {
        grid-area: reports;
        inline-size: fit-content;
        position: relative;

        :is(.neurodiversity-report-profile-link, .neurodiversity-report-profile-menu__summary) {
            margin-right: 0;
        }
    }

    #block-nexus-learnerilptargetlink {
        grid-area: actions;
    }
}

.neurodiversity-report-profile-menu {
    position: relative;
}

.neurodiversity-report-profile-menu__summary {
    list-style: none;
    cursor: pointer;
    user-select: none;
}

.neurodiversity-report-profile-menu__summary::-webkit-details-marker {
    display: none;
}

.neurodiversity-report-profile-menu__panel {
    position: absolute;
    inset-block-start: calc(100% + 0.55rem);
    inset-inline-start: 0;
    z-index: 30;
    display: grid;
    gap: 0.45rem;
    min-inline-size: 15rem;
    padding: 0.75rem;
    border: 1px solid rgb(20 47 60 / 14%);
    border-radius: 1rem;
    background: rgb(255 255 255 / 98%);
    box-shadow: 0 20px 36px rgb(20 47 60 / 14%);
}

.neurodiversity-report-profile-menu__link {
    display: block;
    padding: 0.8rem 1rem;
    border-radius: 0.85rem;
    color: #145f6d;
    text-decoration: none;
    line-height: 1.35;
    background: rgb(17 136 154 / 6%);
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.neurodiversity-report-profile-menu__link:hover,
.neurodiversity-report-profile-menu__link:focus-visible {
    color: #0c6a79;
    background: rgb(17 136 154 / 12%);
    transform: translateY(-1px);
    text-decoration: none;
}

@media (max-width: 900px) {
    #profile-ilp-block-grid:has(> .neurodiversity-report-profile-link-block) {
        grid-template-columns: max-content minmax(0, 1fr);
        grid-template-areas:
        "plans reports"
        "actions actions"
        "stackmid stackmid"
        "stackend stackend";

        #block-nexus-learnerilptargetlink {
            justify-self: start;
        }
    }
}

@media (max-width: 640px) {
    #profile-ilp-block-grid:has(> .neurodiversity-report-profile-link-block) {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
        "plans"
        "reports"
        "actions"
        "stackmid"
        "stackend";

        > .neurodiversity-report-profile-link-block,
        #block-nexus-learnerilptargetlink,
        #block-learner-profile-records-support-plans {
            inline-size: 100%;
        }

        .neurodiversity-report-profile-menu__panel {
            position: static;
            min-inline-size: 0;
            margin-top: 0.75rem;
        }
    }
}


/******************

Profile Edit mode

******************/

.profile-form {
    --margin-sizing: 1rem;
    --form-bg: rgba(255, 255, 255, 0.6);
    background: oklch(from var(--form-bg) l c h);
    border-radius: 1rem;
    border: 1px solid #208194;
    margin-bottom: 50px;
    padding: var(--margin-sizing);
}

.profile-form #support-connect-profile {
    row-gap: 0;

    #edit-field-contact-number-wrapper {
        grid-column: 1;
    }

    .field--type-text-long {
        grid-column: 1 / -1;
    }
}

.profile-form #support-connect-support {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 1rem;
    align-items: start;
}

.profile-form #support-connect-support :is(.field--name-field-case-manager, .field--name-field-specialist-learning-mentor, .field--name-field-wellbeing-mentor) {
    grid-column: auto;
    grid-row: auto;
}

.profile-form #support-connect-calendar {
    --profile-edit-details-border: rgb(32 129 148 / 14%);
    --profile-edit-details-surface: rgb(255 255 255 / 78%);
    --profile-edit-details-surface-open: rgb(245 251 252 / 92%);
    --profile-edit-details-text: #1c6e80;
}

.profile-form #support-connect-calendar :is(.field-group-details, .calendar-start-times-debug) {
    margin-bottom: 1rem;
    border: 1px solid var(--profile-edit-details-border);
    border-radius: 0.85rem;
    background: var(--profile-edit-details-surface);
    overflow: hidden;
}

.profile-form #support-connect-calendar :is(.field-group-details, .calendar-start-times-debug) > summary {
    cursor: pointer;
    padding: 0.95rem 1.1rem;
    color: var(--profile-edit-details-text);
    font-weight: 700;
    line-height: 1.2;
}

.profile-form #support-connect-calendar :is(.field-group-details, .calendar-start-times-debug) > summary::-webkit-details-marker {
    display: none;
}

.profile-form #support-connect-calendar :is(.field-group-details, .calendar-start-times-debug)[open] > summary {
    border-bottom: 1px solid var(--profile-edit-details-border);
    background: var(--profile-edit-details-surface-open);
}

.profile-form #support-connect-calendar :is(.field-group-details, .calendar-start-times-debug) > :not(summary) {
    padding: 1rem 1.1rem 1.1rem;
}

.profile-form #support-connect-calendar .calendar-start-times-debug__inner {
    padding: 1rem 1.1rem 1.1rem;
}

@media (max-width: 900px) {
    .profile-form #support-connect-support {
        grid-template-columns: minmax(0, 1fr);
    }
}

:is(#block-nexus-content form.profile-form) .smartdate--widget {
    padding: 0.5rem 1rem;
    border-radius: 0.85rem;

    .fieldset-wrapper {
        display: flex;
        flex-wrap: wrap;

        & > .allday-label {
            --input-padding: 0;
            position: relative;
            width: fit-content;
            font-size: inherit;
            padding: var(--input-padding);
            pointer-events: auto;
            transition: none;
        }
    }
}

.profile-form #support-connect-calendar :is(.field-multiple-drag,.tabledrag-toggle-weight-wrapper, td:empty){
    display: none;
}

.profile-form #support-connect-calendar .form-wrapper table tr::before {
    display: none;   
}

.profile-form .field--widget-paragraphs {
    .paragraphs-subform > div {
        margin-bottom: 0.75rem;
    }

    .form-radios {
        display: flex;
        flex-wrap: wrap;
        gap: 0.75rem;
    }
} 

.profile-form :is(.field--name-field-holiday-abesnce, .field--name-field-toil) .paragraphs-subform {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;

    .field--type-list-string:not(.field--name-field-toil-credited):has(select),
    .field--type-string-long,
    .field--type-text-long {
        grid-column: 1 / -1;
    }
}