main > .container {
    padding: 70px 15px 20px;
    display: flex;
    flex-direction: column;
    min-height: 100%;
}

.main-full-width {
    min-height: 100%;
}

.not-set {
    color: var(--bs-danger);
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    content: '';
    left: 3px;
    display: inline-block;
    width: 0;
    height: 0;
    border: solid 5px transparent;
    margin: 4px 4px 2px 4px;
    background: transparent;
}

a.asc:after {
    border-bottom: solid 7px var(--bs-body-color);
    border-top-width: 0;
}

a.desc:after {
    border-top: solid 7px var(--bs-body-color);
    border-bottom-width: 0;
}

.grid-view th {
    white-space: nowrap;
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: var(--bs-secondary-color);
}

.error-summary {
    color: var(--bs-danger-text-emphasis);
    background: var(--bs-danger-bg-subtle);
    border-left: 3px solid var(--bs-danger-border-subtle);
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

/* align navbar brand baseline with nav links */
.navbar > .container,
.navbar > .container-fluid {
    align-items: baseline;
}

/* align the logout "link" (button in form) of the navbar */
.nav li > form > button.logout {
    color: var(--bs-navbar-color);
}

@media (max-width: 767.98px) {
    .navbar-nav .nav-link.logout {
        display: block;
        text-align: left;
        width: 100%;
        padding: 10px 0;
    }
}

.navbar-nav .nav-link.logout:focus,
.navbar-nav .nav-link.logout:hover {
    color: var(--bs-navbar-hover-color);
}

.landing-page-body {
    min-height: 100%;
    margin: 0;
    background: #020607;
    color: var(--fm-text-primary);
}

.landing-page {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    position: relative;
}

.landing-header,
.landing-main,
.landing-footer {
    width: min(100%, 1280px);
    margin: 0 auto;
    padding-left: clamp(1.25rem, 4vw, 3rem);
    padding-right: clamp(1.25rem, 4vw, 3rem);
}

.landing-header {
    position: relative;
    z-index: 30;
    isolation: isolate;
    overflow: visible;
    min-height: 86px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    background: rgba(5, 8, 7, .94);
}

.landing-header::before {
    content: '';
    position: absolute;
    inset: 0;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    z-index: -1;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    background: rgba(5, 8, 7, .94);
    pointer-events: none;
}

.landing-brand {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
    color: var(--fm-text-primary);
    text-decoration: none;
    font-size: 1.4rem;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1;
}

.landing-brand-flame {
    width: 2.25rem;
    height: 2.25rem;
    display: block;
    object-fit: contain;
}

.landing-nav,
.landing-header-actions,
.landing-hero-actions,
.landing-footer nav,
.landing-footer-socials {
    display: flex;
    align-items: center;
}

.landing-nav {
    gap: clamp(1.25rem, 3vw, 2.4rem);
    margin-left: auto;
}

.landing-header-actions {
    gap: .75rem;
}

.landing-nav a,
.landing-footer a {
    color: rgba(255, 255, 255, .88);
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
}

.landing-nav a:hover,
.landing-footer a:hover {
    color: var(--fm-accent);
}

.landing-login-button {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-color: rgba(var(--fm-accent-rgb), .55);
    border-radius: 8px;
    color: var(--fm-accent);
    padding-inline: 1.2rem;
    font-weight: 650;
    line-height: 1;
}

.landing-login-button:hover {
    border-color: var(--fm-accent);
    background: rgba(var(--fm-accent-rgb), .08);
    color: var(--fm-accent);
}

.landing-create-button {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    padding-inline: 1.15rem;
    font-weight: 700;
    line-height: 1;
}

.landing-user-menu {
    position: relative;
    z-index: 2000;
}

.landing-user-menu .dashboard-user-button {
    min-height: 42px;
    gap: .6rem;
    padding: .25rem .75rem .25rem .25rem;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 999px;
    background: rgba(255, 255, 255, .025);
    color: rgba(255, 255, 255, .9);
    box-shadow: none;
}

.landing-user-menu .dashboard-user-button:hover,
.landing-user-menu .dashboard-user-button:focus-visible {
    border-color: rgba(var(--fm-accent-rgb), .34);
    background: rgba(255, 255, 255, .045);
}

.landing-user-menu .dropdown-menu {
    z-index: 2100;
}

.landing-user-menu .dashboard-user-avatar {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
}

.landing-user-menu .dashboard-user-name {
    max-width: 140px;
    color: rgba(255, 255, 255, .9);
    font-weight: 600;
}

.language-switcher {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.language-switcher-toggle {
    height: 40px;
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: 0 14px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 10px;
    background: rgba(255, 255, 255, .035);
    color: rgba(255, 255, 255, .9);
    font-weight: 700;
    line-height: 1;
    transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, color .18s ease;
}

.language-switcher-toggle:hover,
.language-switcher-toggle:focus-visible,
.language-switcher.is-open .language-switcher-toggle {
    border-color: rgba(var(--fm-accent-rgb), .45);
    background: rgba(var(--fm-accent-rgb), .06);
    color: var(--fm-text-primary);
    outline: 0;
    box-shadow: 0 0 0 1px rgba(var(--fm-accent-rgb), .08);
}

.language-switcher-icon,
.language-switcher-chevron {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.language-switcher-chevron {
    transition: transform .18s ease;
}

.language-switcher.is-open .language-switcher-chevron {
    transform: rotate(180deg);
}

.language-switcher-menu {
    position: absolute;
    z-index: 2200;
    top: calc(100% + .7rem);
    right: 0;
    min-width: 220px;
    padding: .45rem;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 14px;
    background: rgba(10, 16, 18, .96);
    box-shadow: 0 24px 80px rgba(0, 0, 0, .45);
    backdrop-filter: blur(18px);
}

.language-switcher-options,
.language-switcher-menu-options {
    display: grid;
    gap: .2rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.language-switcher-option {
    min-height: 44px;
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .7rem .85rem;
    border-radius: 9px;
    color: rgba(255, 255, 255, .84);
    text-decoration: none;
    font-weight: 650;
}

.language-switcher-option:hover,
.language-switcher-option:focus-visible {
    background: rgba(var(--fm-accent-rgb), .08);
    color: var(--fm-text-primary);
    outline: 0;
}

.language-switcher-option.is-active {
    color: var(--fm-accent);
}

.language-switcher-check {
    width: 1rem;
    height: 1rem;
    display: inline-flex;
    margin-left: auto;
    opacity: 0;
}

.language-switcher-check svg {
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.language-switcher-option.is-active .language-switcher-check {
    opacity: 1;
}

.language-switcher-menu-title {
    padding: .25rem .85rem .55rem;
    color: rgba(255, 255, 255, .55);
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0;
}

.dashboard-user-language-wrap {
    padding: .25rem;
}

.dashboard-user-language {
    display: block;
}

.landing-mobile-menu {
    position: relative;
    display: none;
}

.landing-mobile-menu summary {
    width: 42px;
    height: 42px;
    display: grid;
    place-content: center;
    gap: .32rem;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 10px;
    background: rgba(255, 255, 255, .035);
    list-style: none;
}

.landing-mobile-menu summary::-webkit-details-marker {
    display: none;
}

.landing-mobile-menu summary span {
    width: 1.1rem;
    height: 2px;
    display: block;
    border-radius: 999px;
    background: rgba(255, 255, 255, .88);
}

.landing-mobile-menu-panel {
    position: absolute;
    top: calc(100% + .7rem);
    right: 0;
    z-index: 2200;
    width: min(82vw, 280px);
    display: grid;
    gap: .75rem;
    padding: .75rem;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 14px;
    background: rgba(10, 16, 18, .96);
    box-shadow: 0 24px 80px rgba(0, 0, 0, .45);
    backdrop-filter: blur(18px);
}

.landing-mobile-nav {
    display: grid;
    gap: .2rem;
}

.landing-mobile-nav a {
    padding: .75rem .85rem;
    border-radius: 9px;
    color: rgba(255, 255, 255, .86);
    text-decoration: none;
    font-weight: 750;
}

.landing-mobile-nav a:hover,
.landing-mobile-nav a:focus-visible {
    background: rgba(var(--fm-accent-rgb), .08);
    color: var(--fm-text-primary);
    outline: 0;
}

.landing-language-switcher--mobile,
.landing-language-switcher--mobile .language-switcher-toggle,
.landing-mobile-login-button,
.landing-mobile-create-button {
    width: 100%;
}

.landing-language-switcher--mobile .language-switcher-toggle,
.landing-mobile-login-button,
.landing-mobile-create-button {
    justify-content: center;
}

.landing-main {
    flex: 1;
}

.landing-hero {
    position: relative;
    isolation: isolate;
    min-height: calc(100vh - 86px);
    display: grid;
    grid-template-columns: minmax(0, 46%) minmax(390px, 44%);
    align-items: center;
    justify-content: space-between;
    gap: clamp(4rem, 7vw, 6rem);
    padding: clamp(2rem, 5vw, 3.2rem) 0 2.5rem;
}

.landing-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    left: 50%;
    width: 100vw;
    transform: translateX(-50%);
    background: #020607;
    z-index: -1;
}

.landing-hero h1 {
    max-width: 650px;
    margin: 0;
    font-size: clamp(56px, 7vw, 92px);
    line-height: .98;
    font-weight: 700;
    letter-spacing: -.04em;
}

.landing-hero h1 span {
    display: block;
}

.landing-hero-accent {
    color: var(--fm-accent);
}

.landing-hero-text {
    max-width: 620px;
    margin: 1.75rem 0 0;
    color: rgba(255, 255, 255, .86);
    font-size: clamp(1.08rem, 1.5vw, 1.25rem);
    line-height: 1.55;
}

.landing-hero-actions {
    margin-top: 2.35rem;
}

.landing-hero-actions .btn,
.landing-final-cta .btn {
    min-width: 258px;
    min-height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    border-radius: 8px;
    font-size: 1.08rem;
    font-weight: 650;
}

.landing-preview-wrap {
    display: flex;
    justify-content: flex-end;
    min-width: 0;
}

.landing-phone-image {
    width: min(100%, 430px);
    height: auto;
    display: block;
    transform: translateX(.5rem);
    filter: drop-shadow(0 34px 90px rgba(0, 0, 0, .52));
}

.landing-footer p {
    color: rgba(255, 255, 255, .78);
}

.landing-hero-audience {
    max-width: 820px;
    margin: .75rem auto 0;
    color: rgba(255, 255, 255, .72);
    font-size: clamp(1rem, 1.45vw, 1.12rem);
    font-weight: 650;
    line-height: 1.55;
    text-align: center;
}

.landing-middleman-card {
    width: min(100%, 1040px);
    margin-top: 1.75rem;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .75rem;
    padding: clamp(1.25rem, 2.8vw, 1.75rem);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .018));
    box-shadow: 0 22px 70px rgba(0, 0, 0, .26);
    color: rgba(255, 255, 255, .82);
    text-align: center;
}

.landing-middleman-card strong {
    color: var(--fm-text-primary);
    font-weight: 700;
}

.landing-middleman-card span {
    color: rgba(255, 255, 255, .72);
}

.landing-section {
    position: relative;
    margin-top: 80px;
    padding: 0;
    background: #020607;
    box-shadow: 0 0 0 100vmax #020607;
    clip-path: inset(0 -100vmax);
}

.landing-section-heading {
    text-align: center;
}

.landing-section-heading h2,
.landing-final-cta h2 {
    margin: 0;
    font-size: clamp(2rem, 3.4vw, 2.8rem);
    line-height: 1.08;
    font-weight: 700;
}

.landing-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.35rem;
    margin-top: 1.7rem;
}

.landing-feature-card,
.landing-final-cta {
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .018));
    box-shadow: 0 22px 70px rgba(0, 0, 0, .26);
}

.landing-feature-card {
    min-height: 255px;
    padding: 2.05rem 2.15rem;
}

.landing-feature-icon {
    width: 76px;
    height: 76px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: rgba(var(--fm-accent-rgb), .13);
}

.landing-feature-icon::before,
.landing-feature-icon::after {
    content: none;
}

.landing-feature-icon svg {
    width: 42px;
    height: 42px;
    display: block;
    overflow: visible;
    fill: none;
    stroke: var(--fm-accent);
    stroke-width: 5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.landing-feature-icon-qr svg {
    fill: none;
    stroke-width: 4;
}

.landing-feature-card h3 {
    margin: 1.2rem 0 .8rem;
    font-size: 1.2rem;
    font-weight: 650;
}

.landing-feature-card p {
    max-width: 295px;
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-size: 1.02rem;
    line-height: 1.45;
}

.landing-final-cta {
    margin-top: clamp(6rem, 8vw, 7.5rem);
    padding: clamp(3rem, 5.6vw, 4.4rem);
    text-align: center;
    background:
        radial-gradient(ellipse at 50% 72%, rgba(var(--fm-accent-rgb), .34), rgba(var(--fm-accent-rgb), .12) 28%, transparent 62%),
        linear-gradient(145deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .02));
    min-height: 214px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 1.6rem;
}

.landing-final-cta p {
    max-width: 580px;
    margin: -.75rem auto 0;
    color: rgba(255, 255, 255, .76);
    font-size: clamp(1rem, 1.4vw, 1.12rem);
    line-height: 1.55;
}

.site-error-page {
    overflow: hidden;
}

.site-error-main {
    flex: 1;
    min-height: clamp(520px, 66vh, 760px);
    display: grid;
    place-items: center;
    padding-top: clamp(3rem, 7vw, 6rem);
    padding-bottom: clamp(3rem, 7vw, 6rem);
}

.site-error-panel {
    width: min(100%, 760px);
    display: grid;
    justify-items: center;
    gap: 1.1rem;
    padding: clamp(2.2rem, 5vw, 4.2rem);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 16px;
    background:
        radial-gradient(circle at 50% 0%, rgba(var(--fm-accent-rgb), .16), transparent 18rem),
        linear-gradient(145deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .02));
    text-align: center;
    box-shadow: 0 32px 90px rgba(0, 0, 0, .42);
}

.site-error-code {
    color: var(--fm-accent);
    font-size: clamp(4.8rem, 12vw, 9rem);
    font-weight: 900;
    letter-spacing: 0;
    line-height: .86;
}

.site-error-panel h1 {
    margin: .35rem 0 0;
    color: var(--fm-text-primary);
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 900;
    line-height: 1.02;
}

.site-error-panel p {
    max-width: 560px;
    margin: 0;
    color: rgba(255, 255, 255, .72);
    font-size: clamp(1rem, 2vw, 1.22rem);
    line-height: 1.5;
}

.site-error-message {
    color: rgba(255, 255, 255, .58) !important;
    font-size: .95rem !important;
}

.site-error-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: .9rem;
    margin-top: .8rem;
}

.landing-footer {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
        "brand nav"
        "desc copy"
        ". socials";
    align-items: start;
    gap: .7rem 2.2rem;
    padding-top: 2.2rem;
    padding-bottom: 2.2rem;
    margin-top: 2.4rem;
    background: #050807;
    box-shadow: 0 0 0 100vmax #050807;
    clip-path: inset(0 -100vmax);
}

.landing-footer-brand-block {
    grid-area: brand;
    min-width: 0;
    align-self: center;
}

.landing-footer-description {
    grid-area: desc;
    margin: 0;
}

.landing-footer nav {
    grid-area: nav;
    align-self: center;
    flex-wrap: wrap;
    gap: clamp(1rem, 3vw, 2.2rem);
    justify-content: flex-end;
}

.landing-footer-socials {
    grid-area: socials;
    align-self: end;
    justify-self: end;
    gap: 1.2rem;
    justify-content: flex-end;
}

.landing-footer-socials a {
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    color: rgba(255, 255, 255, .72);
    font-size: 1.08rem;
    font-weight: 700;
}

.landing-footer-social {
    overflow: hidden;
}

.landing-footer-social::before {
    content: '';
    width: 22px;
    height: 22px;
    display: block;
    background-color: rgba(255, 255, 255, .58);
    -webkit-mask: var(--landing-footer-social-mask) center / contain no-repeat;
    mask: var(--landing-footer-social-mask) center / contain no-repeat;
}

.landing-footer-social--discord::before {
    --landing-footer-social-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M18.6 5.4A14.6 14.6 0 0 0 15 4.3l-.4.8a13 13 0 0 0-5.2 0L9 4.3a14.6 14.6 0 0 0-3.6 1.1C3.1 8.8 2.5 12.1 2.8 15.4A14.8 14.8 0 0 0 7.2 17.6l.9-1.5c-.5-.2-1-.4-1.4-.7l.3-.2a10.6 10.6 0 0 0 10 0l.3.2c-.5.3-.9.5-1.4.7l.9 1.5a14.8 14.8 0 0 0 4.4-2.2c.4-3.8-.7-7-2.6-10ZM8.7 13.8c-.8 0-1.4-.7-1.4-1.5s.6-1.5 1.4-1.5 1.4.7 1.4 1.5-.6 1.5-1.4 1.5Zm6.6 0c-.8 0-1.4-.7-1.4-1.5s.6-1.5 1.4-1.5 1.4.7 1.4 1.5-.6 1.5-1.4 1.5Z'/%3E%3C/svg%3E");
}

.landing-footer-social--instagram::before,
.landing-footer-social--x::before {
    background-color: transparent;
    background-image: var(--dashboard-support-icons, url("../img/support-icons-for-dashboard.png"));
    background-repeat: no-repeat;
    background-size: 506px 59.125px;
    background-position: var(--landing-footer-social-x, 0) -37.125px;
    -webkit-mask: none;
    mask: none;
}

.landing-footer-social--instagram::before { --landing-footer-social-x: -22px; }
.landing-footer-social--x::before { --landing-footer-social-x: -66px; }

.landing-footer-copy {
    grid-area: copy;
    align-self: start;
    justify-self: end;
    margin: 0;
    color: rgba(255, 255, 255, .48);
    white-space: nowrap;
}

.text-page {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background:
        radial-gradient(circle at 72% 4%, rgba(var(--fm-accent-rgb), .08), transparent 24rem),
        #020607;
    color: var(--fm-text-primary);
}

.text-page-header {
    width: min(100%, 1280px);
    margin-inline: auto;
}

.text-page-header-actions {
    gap: .75rem;
}

.text-page-create-button {
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    padding-inline: 1.15rem;
    color: #071012;
    font-weight: 700;
    line-height: 1;
}

.text-page-main {
    flex: 1;
    width: min(100%, 1280px);
    margin-inline: auto;
    padding: clamp(3.2rem, 7vw, 6.5rem) clamp(1.25rem, 4vw, 3rem);
}

.text-page-article {
    width: min(100%, 860px);
}

.text-page-title {
    margin-bottom: clamp(2rem, 4vw, 3.25rem);
}

.text-page-title h1 {
    margin: 0;
    color: rgba(255, 255, 255, .96);
    font-size: clamp(2.2rem, 4.2vw, 3.4rem);
    font-weight: 700;
    letter-spacing: -.02em;
    line-height: 1.04;
}

.text-page-title p {
    margin: 1rem 0 0;
    color: rgba(255, 255, 255, .58);
    font-size: .96rem;
}

.text-page-content {
    display: grid;
    gap: 2rem;
    color: rgba(255, 255, 255, .74);
    font-size: 1.05rem;
    line-height: 1.72;
}

.text-page-content section {
    display: grid;
    gap: .75rem;
}

.text-page-content h2 {
    margin: 0;
    color: rgba(255, 255, 255, .94);
    font-size: clamp(1.18rem, 1.7vw, 1.38rem);
    font-weight: 650;
    letter-spacing: -.01em;
    line-height: 1.22;
}

.text-page-content p {
    margin: 0;
}

.text-page-content ul {
    display: grid;
    gap: .45rem;
    margin: 0;
    padding-left: 1.2rem;
}

.text-page-content li::marker {
    color: var(--fm-accent);
}

.text-page-footer {
    grid-template-areas:
        "brand nav"
        "desc copy";
    margin-top: auto;
}

.dashboard-shell-body {
    min-height: 100%;
    background:
        radial-gradient(circle at 68% 0%, rgba(var(--fm-accent-rgb), .055), transparent 30rem),
        #020607;
    color: var(--fm-text-primary);
}

.dashboard-save-progress {
    position: fixed;
    z-index: 1200;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    overflow: hidden;
    pointer-events: none;
    opacity: 0;
    transform: translateY(-3px);
    transition: opacity .16s ease, transform .16s ease;
}

.dashboard-save-progress span {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    background: var(--fm-accent);
    box-shadow: 0 0 18px rgba(var(--fm-accent-rgb), .72);
    transform: scaleX(0);
    transform-origin: left center;
}

.dashboard-save-progress.is-active {
    opacity: 1;
    transform: translateY(0);
}

.dashboard-save-progress.is-active span {
    animation: dashboard-save-progress 1.1s ease-in-out infinite;
}

.dashboard-save-progress.is-finishing span {
    animation: none;
    transform: scaleX(1);
    transition: transform .18s ease;
}

.dashboard-save-progress.is-error span {
    background: #ff7a7a;
    box-shadow: 0 0 18px rgba(255, 122, 122, .58);
}

@keyframes dashboard-save-progress {
    0% {
        transform: translateX(-42%) scaleX(.28);
    }

    50% {
        transform: translateX(24%) scaleX(.64);
    }

    100% {
        transform: translateX(104%) scaleX(.32);
    }
}

.dashboard-shell {
    --dashboard-sidebar-width: 292px;
    min-height: 100vh;
    display: grid;
    grid-template-columns: var(--dashboard-sidebar-width) minmax(0, 1fr);
    margin: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background:
        radial-gradient(circle at 62% 0%, rgba(255, 255, 255, .04), transparent 34rem),
        #05090d;
    transition: grid-template-columns .22s ease;
}

.dashboard-shell.is-sidebar-collapsed {
    --dashboard-sidebar-width: 72px;
}

.dashboard-sidebar {
    position: sticky;
    top: 0;
    min-height: 100vh;
    flex-direction: column;
    gap: 1.4rem;
    padding: 0 1.25rem 1.15rem;
    border-right: 1px solid rgba(255, 255, 255, .13);
    background:
        linear-gradient(180deg, rgba(8, 17, 22, .92), rgba(3, 9, 11, .96)),
        radial-gradient(circle at 0 0, rgba(var(--fm-accent-rgb), .06), transparent 20rem);
    overflow: hidden;
    transition: padding .22s ease;
}

.dashboard-sidebar-brand {
    position: relative;
    min-height: 82px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.brand-logo {
    display: block;
    width: auto;
    max-width: 100%;
    object-fit: contain;
}

.brand-logo-navbar,
.brand-logo-dashboard,
.brand-logo-dashboard-mobile,
.brand-logo-mobile-nav,
.brand-logo-public {
    height: 52px;
}

.brand-logo-landing {
    height: 78px;
}

.brand-logo-auth {
    height: 48px;
}

.brand-logo-auth-mobile {
    height: 54px;
    margin-inline: auto;
}

.brand-logo-dashboard,
.brand-logo-dashboard-mobile,
.brand-logo-mobile-nav,
.brand-logo-public,
.brand-logo-landing,
.brand-logo-navbar,
.brand-logo-auth,
.brand-logo-auth-mobile {
    box-sizing: border-box;
}

.dashboard-brand-link,
.dashboard-mobile-brand {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    color: var(--fm-text-primary);
    font-size: 1.62rem;
    font-weight: 850;
    letter-spacing: 0;
    text-decoration: none;
}

.dashboard-brand-mark {
    width: 2.6rem;
    height: 2.6rem;
    object-fit: contain;
}

.dashboard-brand-name {
    line-height: 1;
    white-space: nowrap;
}

.dashboard-brand-link:hover,
.dashboard-mobile-brand:hover {
    color: var(--fm-text-primary);
}

.dashboard-sidebar .dashboard-brand-link {
    width: 100%;
    justify-content: flex-start;
    padding-left: 1.025rem;
    font-size: 1.48rem;
}

.dashboard-sidebar .dashboard-brand-name {
    position: absolute;
    left: 4.125rem;
    top: 50%;
    transform: translateY(-50%);
}

.dashboard-sidebar .dashboard-brand-mark {
    width: 2.35rem;
    height: 2.35rem;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-sidebar {
    padding-inline: 1.25rem;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-sidebar-brand {
    justify-content: flex-start;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-sidebar .dashboard-brand-link {
    width: max-content;
    justify-content: flex-start;
    gap: .75rem;
    padding-left: 0;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-sidebar .dashboard-brand-name {
    opacity: 1;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-sidebar .dashboard-brand-mark {
    width: 2.25rem;
    height: 2.25rem;
    transform: translateX(-2.5px);
}

.dashboard-nav {
    display: grid;
    gap: 1rem;
}

.dashboard-nav-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1.1rem;
    min-height: 80px;
    padding: .9rem 1rem .9rem 1.15rem;
    color: var(--fm-text-secondary);
    text-decoration: none;
    border-radius: 8px;
    border: 0;
    font-weight: 650;
    overflow: hidden;
    transition: min-height .22s ease, padding .22s ease, gap .22s ease, background .16s ease, color .16s ease;
}

.dashboard-nav-icon {
    width: 34px;
    height: 34px;
    display: grid;
    place-items: center;
    flex: 0 0 34px;
    color: currentColor;
}

.dashboard-nav-icon svg {
    width: 28px;
    height: 28px;
    display: block;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.dashboard-nav-copy {
    position: absolute;
    left: 4.35rem;
    top: 50%;
    width: 10.75rem;
    min-width: 0;
    display: grid;
    gap: .3rem;
    pointer-events: none;
    transform: translateY(-50%);
    transition: color .16s ease;
}

.dashboard-nav-copy strong {
    color: var(--fm-text-primary);
    font-size: 1rem;
    line-height: 1.15;
}

.dashboard-nav-copy small {
    color: rgba(255, 255, 255, .72);
    font-size: .86rem;
    line-height: 1.25;
}

.dashboard-nav-link:hover {
    color: var(--fm-text-primary);
    background: rgba(255, 255, 255, .04);
}

.dashboard-nav-link.active {
    color: var(--fm-accent);
    background:
        linear-gradient(90deg, rgba(var(--fm-accent-rgb), .18), rgba(var(--fm-accent-rgb), .065)),
        rgba(255, 255, 255, .035);
}

.dashboard-nav-link.active::before {
    content: "";
    position: absolute;
    left: 0;
    top: 18px;
    bottom: 18px;
    width: 3px;
    border-radius: 999px;
    background: var(--fm-accent);
}

.dashboard-nav-link.active .dashboard-nav-copy strong {
    color: var(--fm-accent);
}

.dashboard-shell.is-sidebar-collapsed .dashboard-nav {
    gap: .75rem;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-nav-link {
    min-height: 48px;
    justify-content: center;
    gap: 0;
    padding: .45rem 0;
    overflow: visible;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-nav-link.active::before {
    top: 10px;
    bottom: 10px;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-nav-icon {
    flex-basis: 34px;
    transform: translateX(-1.5px);
}

.dashboard-shell.is-sidebar-collapsed .dashboard-nav-copy {
    opacity: 1;
    white-space: nowrap;
}

.dashboard-live-card {
    margin-top: auto;
    margin-bottom: 0;
    position: relative;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    grid-template-areas:
        "icon title"
        "icon url"
        "icon hint";
    align-items: start;
    column-gap: .85rem;
    padding: 1rem;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 14px;
    background:
        radial-gradient(circle at 20% 20%, rgba(var(--fm-accent-rgb), .1), transparent 42%),
        rgba(255, 255, 255, .035);
    color: inherit;
    text-decoration: none;
    transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease, padding .22s ease;
}

.dashboard-live-card:hover,
.dashboard-live-card:focus-visible {
    border-color: rgba(var(--fm-accent-rgb), .24);
    color: inherit;
    box-shadow: 0 0 32px rgba(var(--fm-accent-rgb), .08);
    transform: translateY(-1px);
}

.dashboard-live-icon {
    grid-area: icon;
    width: 2.875rem;
    height: 2.875rem;
    display: grid;
    place-items: center;
    border-radius: 14px;
    background: rgba(var(--fm-accent-rgb), .12);
    color: var(--fm-accent);
}

.dashboard-live-icon svg,
.dashboard-share-button svg,
.dashboard-menu-button svg,
.dashboard-top-menu-button svg {
    width: 1.2rem;
    height: 1.2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.dashboard-live-title,
.dashboard-live-url,
.dashboard-live-hint {
    display: block;
}

.dashboard-live-title {
    grid-area: title;
    margin-bottom: .32rem;
    color: rgba(255, 255, 255, .94);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
}

.dashboard-live-url {
    grid-area: url;
    color: var(--fm-accent);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-live-hint {
    grid-area: hint;
    margin-top: .78rem;
    color: rgba(255, 255, 255, .5);
    font-size: .8125rem;
    line-height: 1.4;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-live-card {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border-color: transparent;
    background: transparent;
    overflow: visible;
    transform: translateX(-5.5px);
}

.dashboard-shell.is-sidebar-collapsed .dashboard-live-icon {
    width: 40px;
    height: 40px;
    margin: 0;
    border-radius: 12px;
    transform: none;
}

.dashboard-shell.is-sidebar-collapsed .dashboard-live-title,
.dashboard-shell.is-sidebar-collapsed .dashboard-live-url,
.dashboard-shell.is-sidebar-collapsed .dashboard-live-hint {
    display: none;
}

.dashboard-workspace {
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.dashboard-header {
    position: sticky;
    top: 0;
    z-index: 1020;
    min-height: 82px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .75rem 1.5rem .75rem 1.75rem;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    background: rgba(5, 9, 13, .88);
    backdrop-filter: blur(18px);
}

.dashboard-header-main,
.dashboard-header-actions {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-width: 0;
}

.dashboard-header-actions {
    gap: 1.15rem;
}

.dashboard-share-button {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    gap: .65rem;
    padding-inline: 1.35rem;
    border-radius: 8px;
    font-weight: 850;
    --bs-btn-bg: transparent;
    --bs-btn-border-color: rgba(var(--fm-accent-rgb), .78);
    --bs-btn-color: var(--fm-accent);
    --bs-btn-hover-bg: rgba(var(--fm-accent-rgb), .1);
    --bs-btn-hover-border-color: var(--fm-accent);
    --bs-btn-hover-color: var(--fm-accent);
    --bs-btn-active-bg: rgba(var(--fm-accent-rgb), .14);
    --bs-btn-active-border-color: var(--fm-accent);
    --bs-btn-active-color: var(--fm-accent);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: rgba(var(--fm-accent-rgb), .28);
    --bs-btn-disabled-color: rgba(var(--fm-accent-rgb), .45);
}

.dashboard-menu-button,
.dashboard-top-menu-button {
    width: 48px;
    height: 48px;
    display: inline-grid;
    place-items: center;
    border: 0;
    color: rgba(255, 255, 255, .9);
    background: transparent;
    padding: 0;
}

.dashboard-top-menu-button svg,
.dashboard-menu-button svg {
    width: 1.65rem;
    height: 1.65rem;
    stroke-width: 1.65;
}

.dashboard-user-button {
    min-height: 50px;
    display: flex;
    align-items: center;
    gap: 1rem;
    border: 0;
    border-radius: 999px;
    color: var(--fm-text-primary);
    background: transparent;
    padding: .15rem 0;
}

.dashboard-user-button:hover,
.dashboard-user-button:focus {
    background: transparent;
    color: var(--fm-text-primary);
}

.dashboard-user-avatar {
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    padding: .55rem;
    border: 1px solid rgba(var(--fm-accent-rgb), .86);
    border-radius: 50%;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: #030705;
    color: var(--fm-accent);
    font-weight: 800;
    font-size: .9rem;
}

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

.dashboard-user-avatar:has(img) {
    padding: 0;
}

.dashboard-user-name {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 780;
}

.dashboard-user-caret {
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-2px);
    opacity: .72;
}

.dashboard-header-actions .dropdown-menu {
    min-width: 220px;
    margin-top: .75rem;
    padding: .55rem;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .015)),
        #071014;
    box-shadow: 0 22px 64px rgba(0, 0, 0, .42);
}

.dashboard-header-actions .dropdown-item {
    min-height: 42px;
    display: flex;
    align-items: center;
    padding: .65rem .8rem;
    border-radius: 6px;
    color: rgba(255, 255, 255, .82);
    font-weight: 700;
}

.dashboard-header-actions .dropdown-item:hover,
.dashboard-header-actions .dropdown-item:focus {
    color: var(--fm-text-primary);
    background: rgba(var(--fm-accent-rgb), .1);
}

.dashboard-header-actions .dropdown-divider {
    margin: .45rem .25rem;
    border-color: rgba(255, 255, 255, .1);
}

.dashboard-mobile-nav {
    background: #05090d;
    color: var(--fm-text-primary);
}

.dashboard-main {
    flex: 1;
}

.dashboard-content {
    width: min(100%, 1210px);
    margin: 0;
    padding: 1.75rem 2rem 3rem;
}

.dashboard-content .breadcrumb {
    margin-bottom: .5rem;
}

.public-profile-body {
    background: var(--fm-background);
    color: var(--fm-text-primary);
}

.public-profile {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

.public-profile-topbar {
    width: min(100%, 1100px);
    min-height: 72px;
    margin: 0 auto;
    padding: 1rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    background: #050807;
    border-bottom: 1px solid var(--fm-border);
    box-shadow: 0 0 0 100vmax #050807;
    clip-path: inset(0 -100vmax);
}

.public-profile-brand {
    display: inline-flex;
    align-items: center;
    color: var(--fm-text-primary);
    font-weight: 800;
    text-decoration: none;
}

.public-profile-brand:hover {
    color: var(--fm-accent);
}

.public-profile-topbar-actions {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.public-profile-main {
    width: min(100%, 980px);
    margin: 0 auto;
    padding: 0 1.5rem 2rem;
    flex: 1;
}

.public-profile-hero {
    overflow: hidden;
    border: 1px solid var(--fm-border);
    border-radius: 24px;
    background: var(--fm-surface-1);
    box-shadow: var(--fm-shadow-soft);
}

.public-profile-cover {
    min-height: 190px;
    aspect-ratio: 16 / 4.5;
    background:
        radial-gradient(circle at 78% 10%, rgba(var(--fm-accent-rgb), .28), transparent 30%),
        linear-gradient(135deg, var(--fm-surface-1), var(--fm-surface-3) 58%, rgba(var(--fm-accent-rgb), .16));
}

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

.public-profile-identity {
    display: grid;
    grid-template-columns: 132px minmax(0, 1fr);
    gap: 1.25rem;
    padding: 0 1.5rem 1.5rem;
}

.public-profile-avatar {
    width: 132px;
    height: 132px;
    margin-top: -66px;
    border: 5px solid var(--fm-surface-1);
    border-radius: 50%;
    background: var(--fm-accent);
    color: var(--fm-background);
    display: grid;
    place-items: center;
    overflow: hidden;
    font-size: 2rem;
    font-weight: 900;
}

.public-profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.public-profile-intro {
    min-width: 0;
    padding-top: 1.25rem;
}

.public-profile-intro h1 {
    margin: 0 0 .55rem;
    font-size: clamp(2rem, 4vw, 3.25rem);
    line-height: 1;
    font-weight: 800;
}

.public-profile-bio {
    max-width: 720px;
    color: var(--fm-text-secondary);
    font-size: 1rem;
}

.public-profile-bio p:last-child {
    margin-bottom: 0;
}

.public-profile-url-row {
    display: inline-flex;
    align-items: center;
    gap: .6rem;
    max-width: 100%;
    margin-top: 1rem;
    padding: .35rem .4rem .35rem .75rem;
    border: 1px solid var(--fm-border);
    border-radius: 999px;
    background: var(--fm-surface-2);
    color: var(--fm-text-secondary);
}

.public-profile-url-row span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.public-profile-section {
    margin-top: 1rem;
}

.public-section-heading {
    display: flex;
    flex-direction: column;
    gap: .25rem;
    margin-bottom: .9rem;
}

.public-section-heading h2 {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 800;
}

.public-section-heading p {
    margin: 0;
    color: var(--fm-text-secondary);
}

.public-social-list {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
}

.public-social-link {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    min-height: 46px;
    padding: .55rem .8rem;
    border: 1px solid var(--fm-border);
    border-radius: 999px;
    color: var(--fm-text-primary);
    background: var(--fm-surface-1);
    text-decoration: none;
    font-weight: 700;
}

.public-social-link:hover {
    color: var(--fm-accent);
    border-color: rgba(var(--fm-accent-rgb), .35);
    background: var(--fm-surface-2);
}

.public-social-link span {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--fm-accent);
    color: var(--fm-background);
    font-size: .72rem;
    font-weight: 900;
}

.public-support-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: .85rem;
}

.public-support-card {
    min-height: 190px;
    display: flex;
    flex-direction: column;
    gap: .9rem;
    border: 1px solid var(--fm-border);
    border-radius: 20px;
    background: var(--fm-surface-1);
    box-shadow: var(--fm-shadow-soft);
    padding: 1rem;
}

.public-support-card-header {
    display: flex;
    gap: .85rem;
    align-items: center;
}

.public-support-icon {
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--fm-accent);
    color: var(--fm-background);
    font-weight: 900;
}

.public-support-card h3 {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
}

.public-support-card p {
    margin: .15rem 0 0;
    color: var(--fm-text-secondary);
    font-size: .875rem;
}

.public-support-value {
    color: var(--fm-text-secondary);
}

.public-support-action {
    margin-top: auto;
}

.public-support-detail {
    display: grid;
    gap: .25rem;
    min-width: 0;
}

.public-support-detail span {
    color: var(--fm-text-muted);
    font-size: .78rem;
    text-transform: uppercase;
    font-weight: 800;
}

.public-support-detail strong {
    min-width: 0;
    overflow-wrap: anywhere;
}

.public-support-copy-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: auto;
}

.public-copy-button.is-copied {
    border-color: rgba(var(--fm-accent-rgb), .45);
    color: var(--fm-accent);
}

.public-profile-footer {
    width: min(100%, 980px);
    margin: 0 auto;
    padding: 1rem 1.5rem 2rem;
    color: var(--fm-text-muted);
    font-size: .875rem;
    text-align: center;
}

.public-profile-footer a {
    color: var(--fm-text-secondary);
}

/* auth screens */
.auth-page-body {
    min-height: 100%;
    margin: 0;
    background:
        radial-gradient(circle at 50% 0%, rgba(var(--fm-accent-rgb), .08), transparent 30rem),
        #020607;
    color: var(--fm-text-primary);
}

.auth-page {
    min-height: 100vh;
}

.auth-page > .alert {
    position: fixed;
    z-index: 20;
    top: 1rem;
    left: 50%;
    width: min(92vw, 620px);
    transform: translateX(-50%);
}

.auth-shell {
    min-height: 100vh;
    display: grid;
    align-content: center;
    justify-items: center;
    gap: 2rem;
    padding: clamp(1.25rem, 3vw, 3.25rem) clamp(1rem, 3vw, 2rem) 2.4rem;
}

.auth-card {
    width: min(100%, 1210px);
    min-height: min(86vh, 1400px);
    display: grid;
    grid-template-columns: minmax(0, .94fr) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 34px;
    background: #050b0f;
    box-shadow: 0 28px 90px rgba(0, 0, 0, .55);
}

.auth-brand-panel {
    position: relative;
    min-height: 720px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 3rem;
    padding: clamp(2.1rem, 4vw, 4rem);
    background:
        linear-gradient(180deg, rgba(2, 6, 8, .16), rgba(2, 6, 8, .92) 82%),
        linear-gradient(90deg, rgba(2, 6, 8, .34), rgba(2, 6, 8, .04) 48%, rgba(2, 6, 8, .5)),
        image-set(
            url("../img/auth-login-hero.avif") type("image/avif"),
            url("../img/auth-login-hero.webp") type("image/webp"),
            url("../img/auth-login-hero.jpg") type("image/jpeg")
        ) center / cover no-repeat;
    isolation: isolate;
}

.auth-brand-panel::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, .13);
}

.auth-brand-link {
    display: inline-flex;
    align-items: center;
    gap: .85rem;
    color: var(--fm-text-primary);
    font-size: 1.55rem;
    font-weight: 850;
    letter-spacing: 0;
    text-decoration: none;
}

.auth-brand-mark {
    width: 2.65rem;
    height: 2.65rem;
    object-fit: contain;
}

.auth-brand-name {
    color: var(--fm-text-primary);
    line-height: 1;
}

.auth-brand-copy {
    margin-top: auto;
}

.login-brand-title {
    margin: 0 0 1.35rem;
    color: var(--fm-text-primary);
    font-size: clamp(2.45rem, 4vw, 3.2rem);
    font-weight: 800;
    line-height: .98;
    letter-spacing: 0;
}

.login-brand-title span {
    color: var(--fm-accent);
}

.login-brand-text {
    margin: 0;
    color: rgba(255, 255, 255, .9);
    font-size: clamp(1rem, 1.5vw, 1.22rem);
    line-height: 1.55;
}

.auth-feature-list {
    display: grid;
    gap: 1.5rem;
    margin-top: 2rem;
}

.auth-feature-item {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    color: rgba(255, 255, 255, .9);
    font-size: 1.02rem;
}

.auth-feature-icon {
    width: 3.35rem;
    height: 3.35rem;
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(var(--fm-accent-rgb), .14);
    color: var(--fm-accent);
}

.auth-feature-icon svg {
    width: 1.55rem;
    height: 1.55rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-feature-icon-link svg {
    width: 1.9rem;
    height: 1.9rem;
    transform: rotate(-45deg);
    stroke-width: 2.25;
}

.auth-form-panel {
    min-height: 720px;
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 2rem;
    padding: clamp(2rem, 4.4vw, 4.35rem) clamp(2rem, 4.4vw, 4.35rem) clamp(1.6rem, 3vw, 3rem);
    background:
        radial-gradient(circle at 88% 12%, rgba(255, 255, 255, .035), transparent 19rem),
        linear-gradient(180deg, #081015, #03080b);
}

.auth-form-topline {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 1.35rem;
    color: rgba(255, 255, 255, .9);
    font-size: 1.02rem;
}

.auth-outline-button {
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 1.45rem;
    border: 1px solid rgba(var(--fm-accent-rgb), .78);
    border-radius: 8px;
    color: var(--fm-accent);
    font-weight: 750;
    text-decoration: none;
}

.auth-outline-button:hover {
    border-color: var(--fm-accent);
    color: var(--fm-accent);
    background: rgba(var(--fm-accent-rgb), .08);
}

.auth-form-wrap {
    width: min(100%, 530px);
    align-self: start;
    justify-self: center;
    margin-top: clamp(3.8rem, 7vh, 5.4rem);
}

.auth-register-wrap {
    width: min(100%, 540px);
}

.auth-forgot-wrap {
    width: min(100%, 530px);
}

.auth-reset-wrap {
    width: min(100%, 530px);
}

.auth-mobile-logo {
    display: none;
    margin-bottom: 2rem;
    text-align: center;
}

.auth-form-header {
    margin-bottom: 2.5rem;
}

.auth-form-header h1 {
    margin: 0 0 1.05rem;
    color: var(--fm-text-primary);
    font-size: clamp(2rem, 3.3vw, 2.65rem);
    font-weight: 800;
    line-height: 1.08;
    letter-spacing: 0;
}

.auth-form-header p {
    margin: 0;
    color: rgba(255, 255, 255, .7);
    font-size: 1.13rem;
}

.auth-form {
    display: grid;
    gap: 1.45rem;
}

.auth-register-form {
    gap: 1.18rem;
}

.auth-disabled-message {
    display: grid;
    grid-template-columns: 4rem minmax(0, 1fr);
    align-items: center;
    gap: 1.15rem;
    padding: 1.25rem;
    border: 1px solid rgba(var(--fm-accent-rgb), .26);
    border-radius: 10px;
    background:
        linear-gradient(145deg, rgba(var(--fm-accent-rgb), .12), rgba(255, 255, 255, .045)),
        rgba(7, 14, 18, .72);
    color: rgba(255, 255, 255, .78);
    line-height: 1.5;
}

.auth-disabled-icon {
    width: 4rem;
    height: 4rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(var(--fm-accent-rgb), .14);
    color: var(--fm-accent);
}

.auth-disabled-icon svg {
    width: 2rem;
    height: 2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-disabled-message strong,
.auth-disabled-message div > span {
    display: block;
}

.auth-disabled-message strong {
    margin-bottom: .25rem;
    color: var(--fm-text-primary);
    font-size: 1.08rem;
}

.auth-submit.auth-disabled-action {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2.25rem;
    text-decoration: none;
}

.auth-forgot-form {
    gap: 1.45rem;
}

.auth-reset-form {
    gap: 1.25rem;
}

.auth-field {
    margin: 0;
}

.auth-form-label {
    margin-bottom: .8rem;
    color: var(--fm-text-primary);
    font-size: 1rem;
    font-weight: 650;
}

.login-split-card .input-group {
    min-height: 78px;
    align-items: center;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 10px;
    background: rgba(7, 14, 18, .68);
    overflow: hidden;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.login-split-card .input-group .input-group-text {
    width: 4.2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    padding: 0;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, .78);
}

.login-split-card .input-group .input-group-text svg,
.auth-password-toggle svg {
    width: 1.55rem;
    height: 1.55rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.login-split-card .input-group .auth-input {
    height: 76px;
    padding: 0 .5rem 0 0;
    border: 0;
    background: transparent;
    color: var(--fm-text-primary);
    font-size: 1.08rem;
}

.login-split-card .input-group .auth-input::placeholder {
    color: rgba(255, 255, 255, .56);
}

.login-split-card .input-group .auth-input:focus {
    box-shadow: none;
}

.login-split-card .input-group .auth-input.is-invalid,
.was-validated .login-split-card .input-group .auth-input:invalid {
    background-image: none !important;
    padding-right: .5rem;
}

.login-split-card .input-group .auth-input:-webkit-autofill,
.login-split-card .input-group .auth-input:-webkit-autofill:hover,
.login-split-card .input-group .auth-input:-webkit-autofill:focus,
.login-split-card .input-group .auth-input:-webkit-autofill:active {
    border: 0;
    box-shadow: 0 0 0 1000px rgba(7, 14, 18, .68) inset !important;
    -webkit-box-shadow: 0 0 0 1000px rgba(7, 14, 18, .68) inset !important;
    -webkit-text-fill-color: var(--fm-text-primary) !important;
    caret-color: var(--fm-text-primary);
    transition: background-color 9999s ease-out, color 9999s ease-out;
}

.login-split-card .input-group .auth-input::selection {
    background: rgba(var(--fm-accent-rgb), .28);
    color: var(--fm-text-primary);
}

.auth-password-toggle {
    width: 4.05rem;
    height: 76px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, .86);
}

.auth-password-toggle:hover {
    color: var(--fm-accent);
}

.login-split-card .input-group:focus-within {
    border-color: rgba(var(--fm-accent-rgb), .68);
    box-shadow: 0 0 0 .18rem rgba(var(--fm-accent-rgb), .12);
}

.login-split-card .invalid-feedback {
    margin-top: .45rem;
}

.auth-field-hint {
    display: block;
    margin-top: .55rem;
    color: rgba(255, 255, 255, .66);
    font-size: .95rem;
}

.auth-consent-list {
    display: grid;
    gap: .8rem;
    margin-top: -.15rem;
}

.auth-consent-field {
    margin: 0;
}

.auth-consent-checkbox {
    appearance: none;
    -webkit-appearance: none;
    flex: 0 0 auto;
    width: 1.15rem;
    height: 1.15rem;
    margin: .15rem 0 0;
    border: 1px solid rgba(255, 255, 255, .28);
    border-radius: .24rem;
    background-color: rgba(7, 14, 18, .72);
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.2 8.1 6.4 11.3 12.9 4.7' fill='none' stroke='%23050807' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04);
    cursor: pointer;
    transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.auth-consent-checkbox:checked {
    border-color: var(--fm-accent);
    background-color: var(--fm-accent);
    background-size: .82rem .82rem;
    box-shadow: 0 0 0 .12rem rgba(var(--fm-accent-rgb), .12);
}

.auth-consent-checkbox:hover {
    border-color: rgba(var(--fm-accent-rgb), .72);
}

.auth-consent-checkbox:focus-visible {
    border-color: var(--fm-accent);
    box-shadow: 0 0 0 .16rem rgba(var(--fm-accent-rgb), .14);
}

.auth-consent-checkbox:active {
    transform: scale(.96);
}

.auth-consent-row {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    margin: 0;
    cursor: pointer;
}

.auth-consent-label {
    flex: 1 1 0;
    display: block;
    min-width: 0;
    margin: 0;
    color: rgba(255, 255, 255, .76);
    font-size: .92rem;
    line-height: 1.45;
}

.auth-consent-field .invalid-feedback {
    flex: 0 0 100%;
    margin: .3rem 0 0 1.9rem;
}

@supports selector(.input-group:has(.is-invalid)) {
    .login-split-card .input-group:has(.is-invalid) {
        border-color: var(--bs-danger);
    }
}

.auth-form-meta {
    min-height: 1.5rem;
    display: flex;
    justify-content: space-between;
    margin-top: -.35rem;
}

.auth-link {
    color: var(--fm-accent);
    font-weight: 650;
    text-decoration: none;
}

.auth-link:hover {
    color: var(--fm-accent);
    text-decoration: underline;
    text-underline-offset: .22em;
}

.login-btn {
    background: var(--fm-accent);
    border: 1px solid var(--fm-accent);
    color: var(--fm-background);
    font-weight: 800;
    transition: opacity .2s, transform .1s, box-shadow .2s;
}

.login-btn:hover {
    color: var(--fm-background);
    background: var(--fm-accent);
    border-color: var(--fm-accent);
    box-shadow: 0 14px 34px rgba(var(--fm-accent-rgb), .2);
    transform: translateY(-1px);
}

.login-btn:active {
    transform: translateY(0);
}

.auth-submit {
    min-height: 74px;
    margin-top: 1.2rem;
    border-radius: 9px;
    font-size: 1.15rem;
}

.auth-submit span {
    display: inline-block;
    margin-left: .8rem;
    font-size: 1.35rem;
    line-height: 1;
}

.auth-or {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 2rem;
    margin: 2.1rem 0 1.7rem;
    color: rgba(255, 255, 255, .82);
}

.auth-or::before,
.auth-or::after {
    content: '';
    height: 1px;
    background: rgba(255, 255, 255, .15);
}

.auth-create-link {
    margin: 0;
    text-align: center;
    color: rgba(255, 255, 255, .86);
    font-size: 1.02rem;
}

.auth-create-link .auth-link {
    margin-left: .45rem;
}

.auth-back-link {
    margin: 0;
    text-align: center;
}

.auth-back-link .auth-link {
    display: inline-flex;
    align-items: center;
    gap: .8rem;
}

.auth-security-note {
    display: flex;
    align-items: center;
    gap: 1.1rem;
    width: min(100%, 530px);
    justify-self: center;
    margin-bottom: .2rem;
    color: rgba(255, 255, 255, .74);
    line-height: 1.45;
}

.auth-shell-register .auth-card {
    min-height: min(86vh, 1340px);
}

.auth-shell-register .auth-brand-panel,
.auth-shell-register .auth-form-panel {
    min-height: 700px;
}

.auth-shell-register .login-brand-title {
    font-size: clamp(2.25rem, 3.35vw, 2.75rem);
    line-height: 1.05;
}

.auth-shell-register .auth-brand-copy {
    margin-bottom: .3rem;
}

.auth-shell-register .auth-form-panel {
    gap: 2rem;
}

.auth-shell-register .auth-form-header {
    margin-bottom: 2rem;
}

.auth-shell-register .auth-form-header h1 {
    font-size: clamp(2.15rem, 3.1vw, 2.75rem);
}

.auth-shell-register .login-split-card .input-group {
    min-height: 64px;
}

.auth-shell-register .login-split-card .input-group .auth-input,
.auth-shell-register .auth-password-toggle {
    height: 62px;
}

.auth-shell-register .login-split-card .input-group .input-group-text {
    width: 3.8rem;
}

.auth-shell-register .auth-submit {
    min-height: 68px;
    margin-top: .55rem;
}

.auth-shell-register .auth-submit.auth-disabled-action {
    margin-top: 2.25rem;
}

.auth-shell-register .auth-or {
    margin: 1.65rem 0 1.35rem;
}

.auth-shell-forgot .auth-card {
    min-height: min(86vh, 1340px);
}

.auth-shell-forgot .auth-brand-panel,
.auth-shell-forgot .auth-form-panel {
    min-height: 700px;
}

.auth-shell-forgot .auth-brand-copy {
    margin-bottom: .3rem;
}

.auth-shell-forgot .login-brand-title {
    font-size: clamp(2.25rem, 3.35vw, 2.75rem);
    line-height: 1.05;
}

.auth-shell-forgot .auth-form-header {
    margin-bottom: 3rem;
}

.auth-shell-forgot .auth-form-header h1 {
    font-size: clamp(2rem, 2.8vw, 2.55rem);
}

.auth-shell-forgot .auth-submit {
    min-height: 68px;
    margin-top: 1.2rem;
}

.auth-shell-forgot .auth-or {
    margin: 2.1rem 0 1.8rem;
}

.auth-shell-reset .auth-card {
    min-height: min(86vh, 1340px);
}

.auth-shell-reset .auth-brand-panel,
.auth-shell-reset .auth-form-panel {
    min-height: 700px;
}

.auth-shell-reset .auth-brand-copy {
    margin-bottom: .3rem;
}

.auth-shell-reset .login-brand-title {
    font-size: clamp(2.25rem, 3.35vw, 2.75rem);
    line-height: 1.05;
}

.auth-shell-reset .auth-form-header {
    margin-bottom: 2.4rem;
}

.auth-shell-reset .auth-form-header h1 {
    font-size: clamp(2rem, 2.8vw, 2.55rem);
}

.auth-shell-reset .login-split-card .input-group {
    min-height: 68px;
}

.auth-shell-reset .login-split-card .input-group .auth-input,
.auth-shell-reset .auth-password-toggle {
    height: 66px;
}

.auth-shell-reset .auth-submit {
    min-height: 68px;
    margin-top: .95rem;
}

.auth-shell-check-email .auth-card {
    min-height: min(86vh, 1340px);
}

.auth-shell-check-email .auth-brand-panel,
.auth-shell-check-email .auth-form-panel {
    min-height: 700px;
}

.auth-shell-check-email .auth-brand-copy {
    margin-bottom: .3rem;
}

.auth-shell-check-email .login-brand-title {
    font-size: clamp(2.25rem, 3.35vw, 2.75rem);
    line-height: 1.05;
}

.auth-check-email-wrap {
    width: min(100%, 520px);
    margin-top: clamp(2.5rem, 5.2vh, 4.15rem);
    text-align: center;
}

.auth-confirmation-icon {
    position: relative;
    width: 9.4rem;
    height: 9.4rem;
    display: inline-grid;
    place-items: center;
    margin-bottom: 2rem;
    border-radius: 50%;
    background: rgba(var(--fm-accent-rgb), .09);
    color: var(--fm-accent);
}

.auth-confirmation-icon > svg {
    width: 5.4rem;
    height: 5.4rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-confirmation-icon span {
    position: absolute;
    right: 1.55rem;
    bottom: 1.85rem;
    width: 2.4rem;
    height: 2.4rem;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--fm-accent);
    color: #071014;
}

.auth-confirmation-icon span svg {
    width: 1.3rem;
    height: 1.3rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-check-email-header {
    margin-bottom: 1.45rem;
}

.auth-check-email-header h1 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .7rem;
    font-size: clamp(2.1rem, 3vw, 2.7rem);
}

.auth-title-envelope {
    width: 2.35rem;
    height: 1.75rem;
    display: inline-flex;
    flex: 0 0 auto;
    color: #d9dee2;
    filter: drop-shadow(0 1px 0 rgba(255, 255, 255, .22));
}

.auth-title-envelope svg {
    width: 100%;
    height: 100%;
    display: block;
}

.auth-title-envelope-body {
    fill: #e8ebee;
    stroke: #aeb5bb;
    stroke-width: 2;
}

.auth-title-envelope-fold {
    fill: none;
    stroke: #8f989f;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-title-envelope-check {
    fill: none;
    stroke: #31b64b;
    stroke-width: 5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-email-display {
    min-height: 62px;
    display: grid;
    grid-template-columns: 3.85rem minmax(0, 1fr);
    align-items: center;
    width: min(100%, 340px);
    margin: 0 auto 1.45rem;
    overflow: hidden;
    border-radius: 10px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .045)),
        rgba(20, 29, 36, .9);
    color: var(--fm-text-primary);
    text-align: left;
}

.auth-email-display span {
    height: 100%;
    display: grid;
    place-items: center;
    border-right: 1px solid rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .9);
}

.auth-email-display svg {
    width: 1.55rem;
    height: 1.55rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.auth-email-display strong {
    min-width: 0;
    padding: 0 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1rem;
    font-weight: 650;
}

.auth-confirmation-copy {
    margin: 0;
    color: rgba(255, 255, 255, .75);
    font-size: 1.02rem;
    line-height: 1.5;
}

.auth-check-email-form {
    margin-top: 2.1rem;
    padding-top: 2.1rem;
    border-top: 1px solid rgba(255, 255, 255, .12);
}

.auth-check-email-actions {
    display: grid;
    gap: 1.35rem;
}

.auth-check-email-actions .auth-submit {
    min-height: 68px;
    margin-top: 0;
}

.auth-secondary-action {
    min-height: 68px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .95rem;
    border: 1px solid rgba(var(--fm-accent-rgb), .78);
    border-radius: 8px;
    color: var(--fm-accent);
    font-size: 1.12rem;
    font-weight: 800;
    text-decoration: none;
}

.auth-secondary-action:hover {
    border-color: var(--fm-accent);
    color: var(--fm-accent);
    background: rgba(var(--fm-accent-rgb), .08);
}

.auth-shell-reset .auth-or {
    margin: 1.9rem 0 1.55rem;
}

.auth-security-icon {
    width: 3.25rem;
    height: 3.25rem;
}

.auth-footer {
    display: grid;
    justify-items: center;
    gap: 1.5rem;
    color: rgba(255, 255, 255, .58);
}

.auth-footer nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.25rem 2.7rem;
}

.auth-footer a {
    color: rgba(255, 255, 255, .62);
    text-decoration: none;
}

.auth-footer a:hover {
    color: var(--fm-accent);
}

.auth-footer-mark {
    width: 42px;
    height: 42px;
    object-fit: contain;
}

.auth-page .site-register,
.auth-page .site-forgot-password,
.auth-page .site-login,
.auth-page .py-5 {
    min-height: 100vh;
    padding: 2rem 1rem !important;
}

.auth-page .site-register .login-split-card,
.auth-page .site-forgot-password .login-split-card {
    width: min(100%, 980px);
    border: 1px solid rgba(255, 255, 255, .16) !important;
    border-radius: 24px;
    background: #050b0f;
    box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
}

.auth-page .site-register .login-brand-panel,
.auth-page .site-forgot-password .login-brand-panel {
    min-height: 560px;
}

.auth-page .site-register .form-control,
.auth-page .site-forgot-password .form-control,
.auth-page .py-5 .form-control {
    min-height: 52px;
    border-color: rgba(255, 255, 255, .18);
    border-radius: 10px;
    background: rgba(7, 14, 18, .68);
}

.auth-page .site-register .card:not(.login-split-card),
.auth-page .site-forgot-password .card:not(.login-split-card),
.auth-page .py-5 .card {
    border: 1px solid rgba(255, 255, 255, .16) !important;
    border-radius: 24px;
    background: #050b0f;
    box-shadow: 0 28px 90px rgba(0, 0, 0, .48);
}

/* centered page layout */
.site-login,
.site-index,
.site-error,
.site-about {
    flex: 1;
}

.site-error .site-error-content,
.site-about .site-about-content {
    width: 100%;
    max-width: 90%;
}

@media (min-width: 576px) {
    .site-error .site-error-content,
    .site-about .site-about-content {
        max-width: 80%;
    }
}

@media (min-width: 768px) {
    .site-error .site-error-content,
    .site-about .site-about-content {
        max-width: 60%;
    }
}

@media (min-width: 992px) {
    .site-error .site-error-content,
    .site-about .site-about-content {
        max-width: 50%;
    }
}

.dashboard-profile,
.dashboard-support,
.dashboard-social,
.dashboard-appearance,
.dashboard-settings {
    --profile-accent: var(--fm-accent);
    --profile-panel: var(--fm-surface-1);
    --profile-panel-soft: var(--fm-surface-2);
    --profile-border: var(--fm-border);
}

.profile-preview,
.profile-editor-card,
.support-info-card,
.support-editor-card,
.support-method-card,
.support-empty-state,
.appearance-panel,
.appearance-theme-card,
.settings-placeholder-card {
    background: var(--profile-panel);
    border: 1px solid var(--profile-border);
    border-radius: 18px;
    color: var(--fm-text-primary);
    box-shadow: var(--fm-shadow-soft);
}

.dashboard-profile .btn-fm-primary,
.dashboard-support .btn-fm-primary,
.dashboard-social .btn-fm-primary,
.dashboard-appearance .btn-fm-primary,
.dashboard-settings .btn-fm-primary {
    --bs-btn-bg: var(--fm-accent);
    --bs-btn-border-color: var(--fm-accent);
    --bs-btn-color: var(--fm-background);
    --bs-btn-hover-bg: var(--fm-accent);
    --bs-btn-hover-border-color: var(--fm-accent);
    --bs-btn-hover-color: var(--fm-background);
    --bs-btn-disabled-bg: rgba(var(--fm-accent-rgb), .18);
    --bs-btn-disabled-border-color: rgba(var(--fm-accent-rgb), .18);
    --bs-btn-disabled-color: rgba(255, 255, 255, .44);
    font-weight: 750;
}

.dashboard-profile .btn-primary,
.dashboard-support .btn-primary,
.dashboard-social .btn-primary,
.dashboard-appearance .btn-primary,
.dashboard-settings .btn-primary,
.dashboard-share-button {
    font-weight: 750;
}

.dashboard-profile .btn-outline-secondary,
.dashboard-support .btn-outline-secondary,
.dashboard-social .btn-outline-secondary,
.dashboard-appearance .btn-outline-secondary,
.dashboard-settings .btn-outline-secondary {
    background: rgba(255, 255, 255, .035);
    border-color: rgba(255, 255, 255, .1);
}

.dashboard-profile .btn-outline-secondary:hover,
.dashboard-support .btn-outline-secondary:hover,
.dashboard-social .btn-outline-secondary:hover,
.dashboard-appearance .btn-outline-secondary:hover,
.dashboard-settings .btn-outline-secondary:hover {
    background: rgba(255, 255, 255, .07);
    border-color: rgba(var(--fm-accent-rgb), .28);
}

.profile-preview {
    position: relative;
    overflow: visible;
}

.profile-preview-cover {
    position: relative;
    aspect-ratio: 16 / 5;
    min-height: 180px;
    overflow: hidden;
    border-radius: var(--fm-radius-card) var(--fm-radius-card) 0 0;
    background: linear-gradient(135deg, var(--fm-surface-1), var(--fm-surface-3) 65%, rgba(var(--fm-accent-rgb), .18));
}

.profile-preview-cover-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.profile-cover-placeholder {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, var(--fm-surface-1), var(--fm-surface-3) 65%, rgba(var(--fm-accent-rgb), .18));
}

.profile-preview-body {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 1.25rem;
    padding: 0 1.5rem 1.5rem;
}

.profile-preview-avatar {
    position: relative;
    z-index: 2;
    width: 108px;
    height: 108px;
    flex: 0 0 108px;
    border-radius: 50%;
    border: 4px solid var(--profile-panel);
    margin-top: -54px;
    background: var(--profile-accent);
    display: grid;
    place-items: center;
    overflow: hidden;
    color: var(--fm-background);
    font-weight: 800;
    font-size: 1.75rem;
}

.profile-preview-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.profile-preview-content {
    min-width: 0;
    padding-top: 1.25rem;
}

.profile-preview-bio {
    color: var(--fm-text-secondary);
    max-width: 760px;
}

.profile-preview-bio p:last-child {
    margin-bottom: 0;
}

.profile-preview-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: 1rem;
}

.profile-preview-meta span {
    border: 1px solid var(--fm-border);
    border-radius: 999px;
    padding: .35rem .65rem;
    color: var(--fm-text-secondary);
    background: var(--fm-surface-2);
    font-size: .875rem;
}

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

.profile-public-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 1.45fr);
    align-items: center;
    gap: 1.25rem;
}

.profile-url-control {
    display: flex;
    align-items: stretch;
    gap: .6rem;
    min-width: 0;
}

.profile-url-control .form-control {
    min-width: 0;
}

.profile-url-control .btn {
    white-space: nowrap;
}

.support-info-card,
.support-editor-card,
.support-empty-state,
.support-method-body,
.appearance-panel,
.appearance-theme-body,
.settings-card,
.settings-placeholder-card {
    padding: 1.25rem;
}

.profile-editor-card .form-control,
.profile-editor-card .form-select,
.settings-card .form-control,
.settings-card .form-select,
.support-editor-card .form-control,
.support-editor-card .form-select,
.support-method-card .form-control,
.support-method-card .form-select {
    background-color: var(--profile-panel-soft);
    border-color: var(--fm-border);
    color: var(--fm-text-primary);
}

.profile-editor-card .form-control:focus,
.profile-editor-card .form-select:focus,
.settings-card .form-control:focus,
.settings-card .form-select:focus,
.support-editor-card .form-control:focus,
.support-editor-card .form-select:focus,
.support-method-card .form-control:focus,
.support-method-card .form-select:focus {
    border-color: var(--profile-accent);
    box-shadow: 0 0 0 .25rem rgba(var(--fm-accent-rgb), .16);
}

.dashboard-support .form-control.is-valid,
.support-method-create-modal .form-control.is-valid,
.was-validated .dashboard-support .form-control:valid,
.was-validated .support-method-create-modal .form-control:valid {
    border-color: var(--fm-border);
    background-image: none;
}

.dashboard-support .form-select.is-valid:not([multiple]):not([size]),
.support-method-create-modal .form-select.is-valid:not([multiple]):not([size]),
.was-validated .dashboard-support .form-select:valid:not([multiple]):not([size]),
.was-validated .support-method-create-modal .form-select:valid:not([multiple]):not([size]) {
    background-image: var(--bs-form-select-bg-img);
    background-position: right .75rem center;
    background-size: 16px 12px;
    border-color: var(--fm-border);
}

.dashboard-support .form-control.is-valid:focus,
.dashboard-support .form-select.is-valid:focus,
.support-method-create-modal .form-control.is-valid:focus,
.support-method-create-modal .form-select.is-valid:focus,
.was-validated .dashboard-support .form-control:valid:focus,
.was-validated .dashboard-support .form-select:valid:focus,
.was-validated .support-method-create-modal .form-control:valid:focus,
.was-validated .support-method-create-modal .form-select:valid:focus {
    border-color: var(--profile-accent);
    box-shadow: 0 0 0 .25rem rgba(var(--fm-accent-rgb), .16);
}

.dashboard-support .form-control.is-invalid,
.support-method-create-modal .form-control.is-invalid,
.was-validated .dashboard-support .form-control:invalid,
.was-validated .support-method-create-modal .form-control:invalid {
    background-image: none;
}

.dashboard-support .form-select.is-invalid:not([multiple]):not([size]),
.support-method-create-modal .form-select.is-invalid:not([multiple]):not([size]),
.was-validated .dashboard-support .form-select:invalid:not([multiple]):not([size]),
.was-validated .support-method-create-modal .form-select:invalid:not([multiple]):not([size]) {
    background-image: var(--bs-form-select-bg-img);
    background-position: right .75rem center;
    background-size: 16px 12px;
}

.dashboard-support .invalid-feedback,
.support-method-create-modal .invalid-feedback {
    display: none;
}

.profile-editor-card .form-text,
.profile-editor-card .text-body-secondary,
.settings-card .text-body-secondary,
.support-info-card .text-body-secondary,
.support-editor-card .text-body-secondary,
.support-method-card .text-body-secondary,
.support-empty-state .text-body-secondary {
    color: var(--fm-text-secondary) !important;
}

.settings-screen-header {
    margin-bottom: 1.25rem;
}

.settings-screen-header h1 {
    margin: 0 0 .45rem;
    color: var(--fm-text-primary);
    font-size: clamp(2rem, 3.2vw, 2.7rem);
    font-weight: 780;
    line-height: 1.02;
    letter-spacing: 0;
}

.settings-screen-header p {
    margin: 0;
    color: var(--fm-text-primary);
    font-size: 1.05rem;
}

.settings-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: 0;
    max-width: 1180px;
}

.settings-section-list {
    display: grid;
    gap: 1rem;
    min-width: 0;
}

.settings-section-card {
    display: grid;
    grid-template-columns: minmax(190px, 220px) minmax(320px, 1fr) 210px;
    align-items: start;
    gap: 1.35rem;
    min-height: 118px;
    padding: 1.05rem 1.2rem;
    border: 1px solid var(--profile-border);
    border-radius: 7px;
    background:
        radial-gradient(circle at 96% 10%, rgba(255, 255, 255, .04), transparent 15rem),
        linear-gradient(180deg, rgba(17, 25, 31, .94), rgba(8, 14, 18, .94));
    color: var(--fm-text-primary);
}

.settings-section-intro {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
    gap: .9rem;
    min-width: 0;
}

.settings-section-icon,
.settings-help-icon,
.settings-meta-icon {
    display: inline-grid;
    place-items: center;
    color: var(--fm-text-primary);
}

.settings-section-icon {
    width: 28px;
    height: 28px;
}

.settings-section-icon svg,
.settings-help-icon svg,
.settings-meta-icon svg,
.settings-outline-action svg,
.settings-danger-action svg,
.settings-password-toggle svg,
.settings-danger-note svg,
.settings-support-link svg {
    width: 1.2rem;
    height: 1.2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.settings-section-intro h2,
.settings-help-panel h2 {
    margin: 0;
    color: var(--fm-text-primary);
    font-size: 1.08rem;
    font-weight: 680;
    line-height: 1.15;
}

.settings-section-intro p,
.settings-help-panel p,
.settings-help-panel li,
.settings-username-meta span,
.settings-field-group p,
.settings-secure-note {
    color: var(--fm-text-secondary);
}

.settings-section-intro p {
    margin: .55rem 0 0;
    line-height: 1.35;
}

.settings-field-group {
    display: grid;
    gap: .5rem;
    min-width: 0;
}

.settings-field-group label {
    color: var(--fm-text-primary);
    font-size: .92rem;
    font-weight: 520;
}

.settings-input {
    width: 100%;
    min-height: 44px;
    padding: .65rem 3.2rem .65rem .85rem;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 5px;
    background: rgba(3, 8, 11, .66);
    color: var(--fm-text-primary);
    font: inherit;
    line-height: 1.2;
}

.settings-input:focus {
    outline: 0;
    border-color: rgba(var(--fm-accent-rgb), .72);
    box-shadow: 0 0 0 .2rem rgba(var(--fm-accent-rgb), .12);
}

.settings-inline-error {
    display: block;
    margin-top: .45rem;
    color: #ff9a9a;
    font-size: .82rem;
    font-weight: 620;
    line-height: 1.3;
}

.settings-inline-error[data-state="success"] {
    color: rgb(var(--fm-accent-rgb));
}

.settings-inline-error[data-state="error"] {
    color: #ff9a9a;
}

.settings-password-fields {
    display: grid;
    gap: .75rem;
}

.settings-password-control {
    position: relative;
}

.settings-password-control .settings-input {
    padding-right: 3rem;
}

.settings-password-toggle {
    position: absolute;
    right: .9rem;
    top: 50%;
    width: 1.8rem;
    height: 1.8rem;
    display: inline-grid;
    place-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, .76);
    transform: translateY(-50%);
}

.settings-password-toggle:hover,
.settings-password-toggle:focus-visible,
.settings-password-toggle.is-visible {
    color: var(--fm-accent);
}

.settings-public-profile-card {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    min-height: 174px;
    padding: 1.35rem 1.45rem;
    gap: 1.35rem;
}

.settings-public-profile-content {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: start;
    gap: .9rem;
    min-width: 0;
}

.settings-public-profile-icon {
    width: 28px;
    height: 28px;
    display: inline-grid;
    place-items: center;
    color: var(--fm-text-primary);
}

.settings-public-profile-icon svg {
    width: 1.2rem;
    height: 1.2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.settings-public-profile-body {
    min-width: 0;
}

.settings-public-profile-body h2 {
    margin: 0;
    color: var(--fm-text-primary);
    font-size: 1.08rem;
    font-weight: 680;
    line-height: 1.15;
}

.settings-public-profile-body p {
    max-width: 390px;
    margin: .55rem 0 0;
    color: var(--fm-text-secondary);
    line-height: 1.35;
}

.settings-public-url-block {
    display: grid;
    gap: .36rem;
    margin-top: 1.35rem;
    min-width: 0;
}

.settings-public-url-label {
    color: var(--fm-text-secondary);
    font-size: .88rem;
    font-weight: 720;
}

.settings-public-url-link {
    display: inline-flex;
    align-items: center;
    gap: .72rem;
    width: fit-content;
    max-width: 100%;
    color: var(--fm-accent);
    font-size: .98rem;
    font-weight: 760;
    line-height: 1.2;
    text-decoration: none;
}

.settings-public-url-link:hover,
.settings-public-url-link:focus-visible {
    color: var(--fm-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.settings-public-url-link span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-public-url-link svg {
    flex: 0 0 auto;
    width: 1rem;
    height: 1rem;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 2.2;
}

.settings-public-url-help {
    color: var(--fm-text-secondary);
    font-size: .82rem;
    line-height: 1.35;
}

.settings-public-profile-action {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    align-self: end;
    min-width: 260px;
}

.settings-public-access-form {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 2rem;
    margin: 0;
}

.settings-switch-label {
    color: var(--fm-text-primary);
    font-size: .95rem;
    font-weight: 720;
    line-height: 1;
}

.settings-switch {
    position: relative;
    width: 55px;
    height: 31px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(3, 8, 11, .66);
}

.settings-switch::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 3px 12px rgba(0, 0, 0, .4);
    transition: transform .18s ease, background-color .18s ease;
}

.settings-switch.is-enabled {
    border-color: rgba(var(--fm-accent-rgb), .52);
    background: rgba(var(--fm-accent-rgb), .12);
}

.settings-switch.is-enabled::after {
    background: var(--fm-accent);
    transform: translateX(24px);
}

.settings-username-fields {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: .75rem;
    min-width: 0;
}

.settings-field-group p {
    margin: .12rem 0 0;
    font-size: .88rem;
    min-width: 0;
}

.settings-field-group p span {
    display: inline-block;
    max-width: 100%;
    color: var(--fm-accent);
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: bottom;
    white-space: nowrap;
}

.settings-username-meta {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: .65rem;
    max-width: 100%;
    padding: .65rem .75rem;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 5px;
    background: rgba(3, 8, 11, .46);
}

.settings-meta-icon {
    color: var(--fm-text-primary);
}

.settings-username-meta strong,
.settings-username-meta span {
    display: block;
}

.settings-username-meta strong {
    color: var(--fm-text-primary);
    font-size: .84rem;
    font-weight: 560;
}

.settings-username-meta span {
    margin-top: .35rem;
    font-size: .8rem;
    line-height: 1.35;
}

.settings-action-cell {
    display: flex;
    align-self: end;
    justify-content: flex-end;
    width: 210px;
}

.settings-outline-action,
.settings-danger-action {
    min-height: 48px;
    width: 210px;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: .75rem 1.05rem;
    border-radius: 7px;
    background: transparent;
    font-weight: 720;
    line-height: 1;
    white-space: nowrap;
}

.settings-outline-action {
    border: 1px solid rgba(var(--fm-accent-rgb), .78);
    color: var(--fm-accent);
}

.settings-outline-action:hover,
.settings-outline-action:focus-visible {
    background: rgba(var(--fm-accent-rgb), .1);
}

.settings-section-card--danger {
    border-color: rgba(255, 64, 64, .22);
}

.settings-section-card--danger .settings-section-icon,
.settings-danger-note,
.settings-danger-action {
    color: #ff4038;
}

.settings-danger-note {
    padding: .8rem .95rem;
    border: 1px solid rgba(255, 64, 64, .32);
    border-radius: 5px;
    background: rgba(255, 64, 64, .055);
}

.settings-danger-note strong {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin-bottom: .65rem;
    font-weight: 560;
}

.settings-danger-note p {
    margin: .25rem 0 0;
    color: rgba(255, 255, 255, .82);
    font-size: .88rem;
}

.settings-danger-action {
    border: 1px solid rgba(255, 64, 64, .76);
}

.settings-danger-action:hover,
.settings-danger-action:focus-visible {
    background: rgba(255, 64, 64, .09);
}

.settings-delete-modal .modal-dialog {
    width: min(92vw, 560px);
    max-width: 560px;
}

.settings-delete-modal-content {
    border: 1px solid rgba(255, 64, 64, .28);
    border-radius: 12px;
    background:
        radial-gradient(circle at 92% 0%, rgba(255, 64, 64, .08), transparent 14rem),
        linear-gradient(180deg, #11191f 0%, #070d11 100%);
    color: var(--fm-text-primary);
    box-shadow: 0 28px 90px rgba(0, 0, 0, .58);
}

.settings-delete-modal .modal-header {
    align-items: flex-start;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    padding: 1.2rem 1.25rem 1rem;
}

.settings-delete-modal .modal-title {
    color: var(--fm-text-primary);
    font-weight: 760;
}

.settings-delete-modal-subtitle {
    margin: .4rem 0 0;
    color: var(--fm-text-secondary);
    font-size: .95rem;
}

.settings-delete-modal-close {
    width: 2.25rem;
    height: 2.25rem;
    display: inline-grid;
    place-items: center;
    flex: 0 0 auto;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 7px;
    background: rgba(255, 255, 255, .04);
    color: rgba(255, 255, 255, .78);
}

.settings-delete-modal-close svg {
    width: 1.05rem;
    height: 1.05rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.settings-delete-modal .modal-body {
    display: grid;
    gap: 1rem;
    padding: 1.2rem 1.25rem;
}

.settings-delete-confirm-text {
    display: grid;
    gap: .35rem;
    padding: .85rem .95rem;
    border: 1px solid rgba(255, 64, 64, .28);
    border-radius: 7px;
    background: rgba(255, 64, 64, .055);
    color: rgba(255, 255, 255, .82);
    font-size: .92rem;
}

.settings-delete-confirm-text strong {
    color: var(--fm-text-primary);
    font-size: 1rem;
    font-weight: 760;
}

.settings-delete-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: .75rem;
    padding: 0 1.25rem 1.25rem;
}

.settings-delete-cancel {
    min-height: 48px;
    width: 140px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .75rem 1rem;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 7px;
    background: rgba(5, 10, 13, .72);
    color: var(--fm-text-primary);
    font-weight: 720;
}

.settings-delete-cancel:hover,
.settings-delete-cancel:focus-visible {
    border-color: rgba(255, 255, 255, .26);
    background: rgba(5, 10, 13, .86);
    color: var(--fm-text-primary);
}

.settings-secure-note {
    margin: .55rem 0 0;
    text-align: center;
    font-size: .88rem;
}

.settings-help-panel {
    display: grid;
    gap: 1.2rem;
    padding: 1.3rem;
    border: 1px solid var(--profile-border);
    border-radius: 7px;
    background:
        radial-gradient(circle at 95% 0, rgba(255, 255, 255, .04), transparent 12rem),
        linear-gradient(180deg, rgba(17, 25, 31, .94), rgba(8, 14, 18, .94));
}

.settings-help-panel section {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    gap: .85rem;
    padding-bottom: 1.15rem;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.settings-help-panel section:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.settings-help-icon {
    width: 24px;
    height: 24px;
    color: var(--fm-accent);
}

.settings-help-panel p {
    margin: 1rem 0 0;
    font-size: .92rem;
    line-height: 1.55;
}

.settings-help-panel ul {
    display: grid;
    gap: .85rem;
    margin: 1rem 0 0;
    padding: 0;
    list-style: none;
}

.settings-help-panel li {
    position: relative;
    padding-left: 1.4rem;
    font-size: .9rem;
    line-height: 1.45;
}

.settings-help-panel li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: .05rem;
    width: .9rem;
    height: .9rem;
    display: grid;
    place-items: center;
    border: 1px solid var(--fm-accent);
    border-radius: 50%;
    color: var(--fm-accent);
    font-size: .62rem;
    font-weight: 900;
    line-height: 1;
}

.settings-support-link {
    min-height: 46px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    width: 100%;
    margin-top: 1rem;
    padding: .75rem 1rem;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 5px;
    color: var(--fm-text-primary);
    text-decoration: none;
    font-weight: 560;
}

.settings-support-link:hover,
.settings-support-link:focus-visible {
    border-color: rgba(var(--fm-accent-rgb), .5);
    color: var(--fm-accent);
}

.profile-media-control {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.dashboard-profile-screen {
    padding: 0 0 2.5rem;
}

.dashboard-profile-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.25rem;
}

.dashboard-profile-head h1 {
    margin: 0 0 .45rem;
    color: var(--fm-text-primary);
    font-size: clamp(2rem, 3.2vw, 2.7rem);
    line-height: 1.02;
    font-weight: 780;
    letter-spacing: 0;
}

.dashboard-profile-head p {
    margin: 0;
    color: var(--fm-text-primary);
    font-size: 1.05rem;
}

.dashboard-profile-form {
    display: block;
}

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

.dashboard-profile-main {
    width: min(100%, 1040px);
    display: grid;
    gap: 1rem;
}

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

.dashboard-card {
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 8px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .015)),
        rgba(12, 18, 23, .92);
    color: var(--fm-text-primary);
    box-shadow: 0 22px 80px rgba(0, 0, 0, .23);
}

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

.dashboard-card h2 {
    margin: 0;
    color: var(--fm-text-primary);
    font-size: 1.05rem;
    line-height: 1.2;
    font-weight: 760;
}

.profile-images-card {
    padding: 1.5rem;
}

.dashboard-icon-button-label,
.profile-image-edit-button,
.profile-image-delete-button {
    cursor: pointer;
}

.dashboard-icon-button-label {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    padding: .65rem 1rem;
    border-radius: 8px;
    color: var(--fm-text-primary);
    font-weight: 750;
}

.dashboard-icon-button-label svg,
.profile-image-edit-button svg,
.profile-image-delete-button svg {
    width: 1.05rem;
    height: 1.05rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.profile-images-editor {
    display: grid;
    grid-template-columns: 148px minmax(0, 1fr);
    gap: 1.55rem;
    align-items: center;
}

.profile-avatar-editor {
    display: grid;
    justify-items: center;
    gap: .85rem;
}

.profile-media-help {
    display: grid;
    justify-items: center;
    gap: .28rem;
    max-width: 148px;
    margin: 0;
    color: rgba(255, 255, 255, .78);
    font-size: .88rem;
    line-height: 1.35;
    text-align: center;
}

.profile-media-help strong {
    color: var(--fm-text-primary);
    font-size: .92rem;
    font-weight: 700;
}

.profile-media-help span {
    display: block;
}

.profile-avatar-preview {
    position: relative;
    width: 126px;
    height: 126px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .18);
    background: #020607;
    color: var(--fm-accent);
    overflow: visible;
    font-size: 1.6rem;
    font-weight: 850;
}

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

.profile-cover-editor {
    position: relative;
    min-height: 208px;
    overflow: hidden;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, .1);
    background:
        radial-gradient(circle at 50% 45%, rgba(var(--fm-accent-rgb), .28), transparent 36%),
        linear-gradient(145deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .01)),
        #071014;
}

.profile-cover-editor img,
.profile-cover-editor .profile-cover-placeholder {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.profile-cover-editor img {
    object-fit: cover;
}

.profile-cover-editor .profile-cover-placeholder {
    background:
        linear-gradient(140deg, transparent 0 26%, rgba(var(--fm-accent-rgb), .22) 26.4% 27%, transparent 27.4%),
        linear-gradient(24deg, transparent 0 42%, rgba(var(--fm-accent-rgb), .17) 42.4% 43%, transparent 43.4%),
        radial-gradient(circle at 50% 50%, rgba(var(--fm-accent-rgb), .22), transparent 42%),
        #071014;
}

.profile-image-edit-button {
    position: absolute;
    right: -4px;
    bottom: -4px;
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 0;
    color: var(--fm-text-primary);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .12), rgba(255, 255, 255, .04)),
        #1b2228;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .35);
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease;
}

.profile-image-edit-button:hover,
.profile-image-edit-button:focus-visible {
    color: var(--fm-accent);
    background:
        linear-gradient(145deg, rgba(var(--fm-accent-rgb), .2), rgba(255, 255, 255, .055)),
        #20282e;
    box-shadow:
        0 16px 36px rgba(0, 0, 0, .42),
        0 0 0 1px rgba(var(--fm-accent-rgb), .32);
    transform: translateY(-1px);
}

.profile-image-edit-button-cover {
    right: 1rem;
    bottom: 1rem;
}

.profile-image-delete-button {
    position: absolute;
    width: 42px;
    height: 42px;
    padding: 0;
    display: block;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, .14);
    color: rgba(255, 255, 255, .86);
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .035)),
        #161d22;
    box-shadow: 0 12px 30px rgba(0, 0, 0, .32);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
}

.profile-image-delete-button svg {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 1.2rem;
    height: 1.2rem;
    display: block;
    transform: translate(-50%, -50%);
}

.profile-image-delete-button:hover,
.profile-image-delete-button:focus-visible {
    color: #ff8a8a;
    border-color: rgba(255, 138, 138, .42);
    background:
        linear-gradient(145deg, rgba(255, 92, 92, .18), rgba(255, 255, 255, .045)),
        #251d20;
    box-shadow:
        0 16px 36px rgba(0, 0, 0, .42),
        0 0 0 1px rgba(255, 92, 92, .22);
    transform: translateY(-1px);
}

.profile-image-delete-button-cover {
    right: 4.65rem;
    bottom: 1.18rem;
}

.profile-image-delete-button-avatar {
    left: -4px;
    bottom: -4px;
    width: 48px;
    height: 48px;
}

.profile-cover-help {
    position: absolute;
    left: 1rem;
    bottom: .9rem;
    max-width: min(360px, calc(100% - 9rem));
    margin: 0;
    padding: .45rem .65rem;
    border-radius: 7px;
    background: rgba(2, 6, 7, .62);
    color: rgba(255, 255, 255, .76);
    font-size: .86rem;
    line-height: 1.35;
    backdrop-filter: blur(8px);
}

.profile-field-row {
    display: grid;
    grid-template-columns: minmax(190px, .42fr) minmax(0, 1fr);
    gap: 1.5rem;
    align-items: center;
    padding: 1.35rem 1.5rem;
}

.profile-field-row-bio {
    align-items: start;
}

.profile-details-card {
    overflow: hidden;
}

.profile-details-card .profile-field-row {
    padding: 1.5rem;
}

.profile-details-card .profile-field-row + .profile-field-row {
    border-top: 1px solid rgba(255, 255, 255, .08);
}

.profile-field-copy h2 {
    margin: 0 0 .65rem;
    font-size: 1.05rem;
    font-weight: 760;
}

.profile-field-copy p {
    margin: 0;
    max-width: 230px;
    color: rgba(255, 255, 255, .68);
    line-height: 1.45;
}

.profile-field-control,
.profile-public-url {
    position: relative;
    min-width: 0;
}

.dashboard-profile-screen .form-control,
.dashboard-profile-screen .form-select {
    min-height: 58px;
    border-radius: 8px;
    border-color: rgba(255, 255, 255, .14);
    background-color: rgba(14, 22, 29, .94);
    color: var(--fm-text-primary);
    font-weight: 650;
    box-shadow: none;
}

.dashboard-profile-screen .form-control.is-valid,
.dashboard-profile-screen .form-select.is-valid,
.was-validated .dashboard-profile-screen .form-control:valid,
.was-validated .dashboard-profile-screen .form-select:valid {
    border-color: rgba(255, 255, 255, .14);
    background-image: none;
}

.dashboard-profile-screen .form-control.is-invalid,
.dashboard-profile-screen .form-select.is-invalid,
.was-validated .dashboard-profile-screen .form-control:invalid,
.was-validated .dashboard-profile-screen .form-select:invalid {
    background-image: none;
}

.profile-field-control .form-control {
    padding-right: 4.85rem;
}

.dashboard-profile-screen .form-control.is-valid:focus,
.dashboard-profile-screen .form-select.is-valid:focus,
.was-validated .dashboard-profile-screen .form-control:valid:focus,
.was-validated .dashboard-profile-screen .form-select:valid:focus {
    border-color: var(--profile-accent);
    box-shadow: 0 0 0 .25rem rgba(var(--fm-accent-rgb), .16);
}

.dashboard-profile-screen textarea.form-control {
    min-height: 126px;
    padding-right: 4.85rem;
    padding-bottom: 2.15rem;
    resize: vertical;
}

.profile-field-count {
    position: absolute;
    right: 1rem;
    top: 29px;
    min-width: 3.35rem;
    color: rgba(255, 255, 255, .58);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.35;
    text-align: right;
    pointer-events: none;
    background: transparent;
    transform: translateY(-50%);
    z-index: 2;
}

.profile-field-control:has(textarea) .profile-field-count {
    top: auto;
    right: 1rem;
    bottom: .85rem;
    transform: none;
}

.profile-public-url {
    display: grid;
    gap: .7rem;
}

.profile-public-url-box {
    min-height: 72px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .9rem;
    padding: 0 1rem 0 1.2rem;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .012)),
        rgba(5, 12, 14, .72);
    cursor: default;
}

.profile-public-url-icon {
    width: 2.15rem;
    height: 2.15rem;
    display: inline-grid;
    place-items: center;
    color: var(--fm-accent);
}

.profile-public-url-icon svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.profile-public-url-value {
    min-width: 0;
    color: rgba(255, 255, 255, .94);
    font-size: .98rem;
    font-weight: 700;
    line-height: 1.2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-public-url-copy {
    height: 44px;
    min-width: 86px;
    padding: 0 1.2rem;
    border: 1px solid rgba(var(--fm-accent-rgb), .64);
    border-radius: 10px;
    background: rgba(var(--fm-accent-rgb), .08);
    color: var(--fm-accent);
    font: inherit;
    font-weight: 800;
    line-height: 1;
    transition: background .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.profile-public-url-copy:hover,
.profile-public-url-copy:focus-visible {
    border-color: var(--fm-accent);
    background: rgba(var(--fm-accent-rgb), .14);
    color: var(--fm-accent);
    transform: translateY(-1px);
}

.profile-public-url-copy.is-copied {
    background: var(--fm-accent);
    color: #071006;
}

.profile-public-url-help {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    color: rgba(255, 255, 255, .62);
    font-size: .88rem;
    line-height: 1.35;
}

.profile-public-url-settings {
    flex: 0 0 auto;
    color: var(--fm-accent);
    font-weight: 760;
    text-decoration: none;
}

.profile-public-url-settings:hover,
.profile-public-url-settings:focus-visible {
    color: var(--fm-accent);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.profile-save-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .75rem 1rem;
    justify-content: flex-start;
    padding: 0 1.5rem 1.5rem;
    margin-top: 0;
}

.profile-save-actions .btn {
    min-height: 52px;
    min-width: 150px;
    border-radius: 8px;
    font-weight: 850;
}

.profile-save-actions .dashboard-save-status {
    min-width: 0;
    max-width: 100%;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.support-screen-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    margin-bottom: 1.2rem;
}

.support-screen-header h1 {
    margin: 0 0 .35rem;
    color: var(--fm-text-primary);
    font-size: clamp(2rem, 3.2vw, 2.7rem);
    font-weight: 780;
    line-height: 1.02;
    letter-spacing: 0;
}

.support-screen-header p {
    margin: 0;
    color: var(--fm-text-secondary);
    font-size: 1.05rem;
}

.support-header-actions {
    display: grid;
    justify-items: end;
    gap: .55rem;
}

.support-add-button,
.support-method-save-button {
    min-height: 52px;
    min-width: 142px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: .9rem 1.35rem;
    border: 0;
    border-radius: 7px;
    background: linear-gradient(180deg, #d9ff1c, var(--fm-accent));
    color: #050805;
    font-weight: 850;
    line-height: 1;
    box-shadow: 0 14px 36px rgba(var(--fm-accent-rgb), .18);
}

.support-method-save-button:disabled {
    cursor: wait;
    opacity: .82;
}

.support-method-save-button[data-state="error"] {
    opacity: 1;
}

.support-add-button svg,
.support-method-save-button svg {
    width: 1.15rem;
    height: 1.15rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.support-add-button:not(:disabled):hover,
.support-add-button:not(:disabled):focus-visible,
.support-method-save-button:hover,
.support-method-save-button:focus-visible {
    background: #d7ff2a;
    color: #050805;
}

.support-add-button:disabled,
.support-add-button.is-disabled {
    cursor: not-allowed;
    border: 1px solid rgba(255, 255, 255, .18);
    background: rgba(255, 255, 255, .08);
    color: rgba(255, 255, 255, .46);
    box-shadow: none;
}

.support-add-button:disabled svg,
.support-add-button.is-disabled svg {
    opacity: .62;
}

.support-limit-note {
    width: fit-content;
    max-width: 330px;
    display: inline-flex;
    align-items: flex-start;
    justify-self: end;
    gap: .3rem;
    color: var(--fm-text-secondary);
    font-size: .86rem;
    line-height: 1.35;
    text-align: right;
}

.support-limit-note svg {
    width: .98rem;
    height: .98rem;
    flex: 0 0 .98rem;
    margin-top: .08rem;
    fill: none;
    stroke: rgba(var(--fm-accent-rgb), .72);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.support-method-inline-error {
    margin-top: .5rem;
    color: #ff9a9a;
    font-size: .84rem;
    font-weight: 620;
    line-height: 1.3;
}

.support-method-create-modal .modal-dialog {
    width: min(92vw, 720px);
    max-width: 720px;
}

.support-method-create-content {
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 18px;
    background:
        radial-gradient(circle at 50% 0%, rgba(255, 255, 255, .05), transparent 19rem),
        linear-gradient(180deg, #11191f 0%, #070d11 100%);
    color: var(--fm-text-primary);
    box-shadow: 0 32px 100px rgba(0, 0, 0, .62);
}

.support-method-create-modal .modal-header {
    position: relative;
    align-items: flex-start;
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    padding: 1.35rem 4rem 1.1rem 1.35rem;
}

.support-method-create-modal .modal-title {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 820;
}

.support-method-create-modal .modal-header p {
    margin: .45rem 0 0;
    color: var(--fm-text-secondary);
}

.support-method-create-modal .modal-body {
    padding: 1.35rem;
}

.support-method-modal-close {
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 2.35rem;
    height: 2.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: rgba(255, 255, 255, .92);
}

.support-method-modal-close svg {
    width: 1.2rem;
    height: 1.2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

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

.support-method-field-wide {
    grid-column: 1 / -1;
}

.dashboard-support .support-method-form-grid--username {
    grid-template-columns: minmax(260px, 52%) minmax(0, 1fr);
}

.dashboard-support .support-method-form-grid--username .support-method-field-wide {
    grid-column: 1;
}

.dashboard-support .support-method-form-grid--wallet {
    grid-template-columns: minmax(0, 1fr);
}

.dashboard-support .support-method-form-grid--wallet .support-method-field-wide {
    grid-column: 1;
}

.dashboard-support .support-method-form-grid--pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.dashboard-support .support-method-form-grid--pair .support-method-field-wide {
    grid-column: auto;
}

.dashboard-support .support-method-form-grid--card {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, .85fr);
}

.dashboard-support .support-method-form-grid--card .support-method-field-wide {
    grid-column: auto;
}

.support-method-create-modal .support-method-form-grid {
    align-items: end;
}

.support-method-create-modal .support-method-type-field {
    grid-column: 1 / -1;
}

.support-method-create-modal .support-method-form-grid--pair {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.support-method-create-modal .support-method-form-grid--username .support-method-field-wide,
.support-method-create-modal .support-method-form-grid--wallet .support-method-field-wide {
    grid-column: 1 / -1;
}

.support-method-create-modal .support-method-form-grid--pair .support-method-field-wide {
    grid-column: auto;
}

.support-method-create-modal .support-method-form-grid--card {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.support-method-create-modal .support-method-form-grid--card .support-method-field-wide {
    grid-column: auto;
}

.support-method-create-toggle {
    display: flex;
    align-items: center;
    gap: .8rem;
    align-self: end;
    justify-content: flex-start;
    min-height: 44px;
    padding-bottom: .25rem;
}

.support-method-create-switch-status {
    color: var(--fm-text-primary);
    font-size: .95rem;
    font-weight: 720;
    line-height: 1;
}

.support-method-create-switch {
    position: relative;
    width: 55px;
    height: 31px;
    display: inline-flex;
    flex: 0 0 auto;
    margin: 0;
    cursor: pointer;
}

.support-method-create-switch input[type="checkbox"] {
    position: absolute;
    inset: 0;
    opacity: 0;
    cursor: pointer;
}

.support-method-create-switch-track {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(3, 8, 11, .66);
}

.support-method-create-switch-track::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 3px 12px rgba(0, 0, 0, .4);
    transition: transform .18s ease, background-color .18s ease;
}

.support-method-create-switch.is-enabled .support-method-create-switch-track,
.support-method-create-switch input[type="checkbox"]:checked + .support-method-create-switch-track {
    border-color: rgba(var(--fm-accent-rgb), .52);
    background: rgba(var(--fm-accent-rgb), .12);
}

.support-method-create-switch.is-enabled .support-method-create-switch-track::after,
.support-method-create-switch input[type="checkbox"]:checked + .support-method-create-switch-track::after {
    background: var(--fm-accent);
    transform: translateX(24px);
}

.support-method-create-switch input[type="checkbox"]:focus-visible + .support-method-create-switch-track {
    outline: 0;
    box-shadow: 0 0 0 .2rem rgba(var(--fm-accent-rgb), .14);
}

.support-method-modal-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    margin-top: 1.1rem;
}

.support-method-modal-actions .support-method-save-status {
    margin-right: auto;
}

.support-method-modal-actions .support-method-secondary-button {
    min-height: 48px;
    width: 140px;
    padding: .75rem 1rem;
}

.support-method-modal-actions .support-method-save-button {
    min-height: 48px;
    width: 210px;
    min-width: 0;
    padding: .75rem 1.05rem;
    border: 1px solid rgba(var(--fm-accent-rgb), .78);
    background: transparent;
    color: var(--fm-accent);
    font-weight: 720;
    white-space: nowrap;
    box-shadow: none;
}

.support-method-modal-actions .support-method-save-button:hover,
.support-method-modal-actions .support-method-save-button:focus-visible {
    background: rgba(var(--fm-accent-rgb), .1);
    color: var(--fm-accent);
    box-shadow: none;
}

.support-method-list {
    display: grid;
    gap: .62rem;
}

.dashboard-support .support-method-card {
    overflow: hidden;
    border-radius: 7px;
    background:
        radial-gradient(circle at 96% 12%, rgba(255, 255, 255, .04), transparent 15rem),
        linear-gradient(180deg, rgba(17, 25, 31, .94), rgba(8, 14, 18, .94));
    box-shadow: none;
}

.dashboard-support .support-method-summary {
    display: grid;
    grid-template-columns: 22px 48px minmax(0, 1fr) auto auto 34px;
    align-items: center;
    gap: 1rem;
    min-height: 76px;
    padding: .9rem 1.05rem;
    cursor: pointer;
    list-style: none;
}

.dashboard-support .support-method-summary::-webkit-details-marker {
    display: none;
}

.dashboard-support .support-method-handle {
    display: grid;
    place-items: center;
    color: rgba(255, 255, 255, .42);
    cursor: grab;
    touch-action: none;
}

.dashboard-support .support-method-handle:active {
    cursor: grabbing;
}

.dashboard-support .support-method-handle svg {
    width: 18px;
    height: 25px;
    fill: currentColor;
}

.dashboard-support .support-method-icon {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    overflow: hidden;
    background-image: var(--dashboard-support-icons, url("../img/support-icons-for-dashboard.png"));
    background-repeat: no-repeat;
    background-size: 736px 86px;
    background-position: var(--support-icon-x, 0) 0;
}

.dashboard-support .support-method-icon > * {
    display: none;
}

.support-method-icon--custom,
.support-method-icon--paypal-me {
    --support-icon-x: 0;
}

.support-method-icon--buy-me-a-coffee {
    --support-icon-x: -46px;
}

.support-method-icon--kofi {
    --support-icon-x: -92px;
}

.support-method-icon--patreon {
    --support-icon-x: -138px;
}

.support-method-icon--card {
    --support-icon-x: -414px;
}

.support-method-icon--btc {
    --support-icon-x: -230px;
}

.support-method-icon--eth {
    --support-icon-x: -276px;
}

.support-method-icon--usdt-trc20 {
    --support-icon-x: -322px;
}

.support-method-icon--bank {
    --support-icon-x: -460px;
}

.support-method-icon--donationalerts {
    --support-icon-x: -184px;
}

.support-method-icon--sbp {
    --support-icon-x: -506px;
}

.support-method-icon--gcash {
    --support-icon-x: -552px;
}

.support-method-icon--maya {
    --support-icon-x: -598px;
}

.support-method-icon--ton {
    --support-icon-x: -368px;
}

.support-method-icon--custom {
    --support-icon-x: -644px;
}

.support-method-icon--lavatop {
    --support-icon-x: -690px;
}

.dashboard-support .support-method-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: .1rem;
}

.dashboard-support .support-method-copy strong {
    color: var(--fm-text-primary);
    font-size: 1.02rem;
    font-weight: 780;
    line-height: 1.1;
}

.dashboard-support .support-method-copy small {
    color: var(--fm-text-secondary);
    font-size: .94rem;
    font-weight: 520;
    line-height: 1.32;
}

.support-method-status {
    color: var(--fm-text-secondary);
    font-size: .92rem;
}

.dashboard-save-status,
.support-method-save-status {
    color: var(--fm-text-secondary);
    font-size: .9rem;
    font-weight: 620;
}

.dashboard-save-status[data-state="success"],
.support-method-save-status[data-state="success"],
[data-social-save-status][data-state="success"],
[data-support-order-status][data-state="success"] {
    color: var(--fm-accent);
}

.dashboard-save-status[data-state="error"],
.support-method-save-status[data-state="error"],
[data-social-save-status][data-state="error"],
[data-support-order-status][data-state="error"] {
    color: #ff7a7a;
}

.support-method-toggle-form {
    display: flex;
    margin: 0;
}

.support-method-toggle {
    position: relative;
    width: 55px;
    height: 31px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(3, 8, 11, .66);
}

.support-method-toggle::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 3px 12px rgba(0, 0, 0, .4);
    transition: transform .18s ease, background-color .18s ease;
}

.support-method-toggle.is-enabled::after {
    background: var(--fm-accent);
    transform: translateX(24px);
}

.support-method-toggle.is-enabled {
    border-color: rgba(var(--fm-accent-rgb), .52);
    background: rgba(var(--fm-accent-rgb), .12);
}

.support-method-chevron {
    display: grid;
    place-items: center;
    color: var(--fm-text-primary);
}

.support-method-chevron svg {
    width: 1.25rem;
    height: 1.25rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: transform .18s ease;
}

.dashboard-support .support-method-card[open] .support-method-chevron svg {
    transform: rotate(180deg);
}

.dashboard-support .support-method-body {
    border-top: 1px solid var(--fm-border);
    padding: .85rem 4.15rem 1rem 4.95rem;
}

.dashboard-support .support-method-card.is-dragging {
    opacity: .9;
    transform: scale(.995);
    border-color: rgba(var(--fm-accent-rgb), .55);
    box-shadow:
        0 0 0 1px rgba(var(--fm-accent-rgb), .18),
        0 18px 48px rgba(0, 0, 0, .34);
}

.dashboard-support .support-method-card.is-dragging .support-method-summary {
    background: rgba(var(--fm-accent-rgb), .045);
}

.dashboard-support .support-method-card.is-dragging .support-method-handle {
    color: var(--fm-accent);
}

.dashboard-support .support-method-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .75rem;
    justify-content: flex-end;
    align-items: center;
}

.dashboard-support .support-method-actions {
    margin-top: .95rem;
}

.support-method-secondary-button,
.support-method-delete-button {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: .65rem 1rem;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 7px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .045), rgba(255, 255, 255, .02)),
        rgba(5, 10, 13, .72);
    color: var(--fm-text-primary);
    font-weight: 720;
}

.support-method-delete-button::after {
    content: '';
    width: 1rem;
    height: 1rem;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M9 3h6l1 2h4v2H4V5h4l1-2Zm1 6v9h2V9h-2Zm4 0v9h2V9h-2ZM6 9h2v10h8V9h2v10a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2V9Z'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='black' d='M9 3h6l1 2h4v2H4V5h4l1-2Zm1 6v9h2V9h-2Zm4 0v9h2V9h-2ZM6 9h2v10h8V9h2v10a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2V9Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.support-method-delete-button:hover,
.support-method-delete-button:focus-visible {
    border-color: rgba(255, 255, 255, .26);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .03)),
        rgba(5, 10, 13, .8);
    color: var(--fm-text-primary);
}

.support-method-secondary-button:hover,
.support-method-secondary-button:focus-visible {
    border-color: rgba(255, 255, 255, .26);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, .03)),
        rgba(5, 10, 13, .8);
    color: var(--fm-text-primary);
}

.support-reorder-note {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.1rem;
    margin-top: .75rem;
    padding: 1rem;
    border: 1px dashed rgba(255, 255, 255, .25);
    border-radius: 7px;
    color: var(--fm-text-secondary);
    background: rgba(255, 255, 255, .018);
    text-align: left;
}

.support-reorder-note svg {
    width: 18px;
    height: 25px;
    flex: 0 0 auto;
    fill: rgba(255, 255, 255, .42);
}

.support-reorder-note strong,
.support-reorder-note span {
    display: block;
}

.support-reorder-note strong {
    color: var(--fm-text-secondary);
    font-weight: 640;
}

.support-reorder-note span[data-state="saving"] {
    color: var(--fm-text-primary);
}

.support-reorder-note span[data-state="success"] {
    color: var(--fm-accent);
}

.support-reorder-note span[data-state="error"] {
    color: #ff6b6b;
}

.support-tip-card {
    min-height: 54px;
    display: flex;
    align-items: center;
    gap: .8rem;
    margin-top: .75rem;
    padding: .8rem 1rem;
    border: 1px solid var(--profile-border);
    border-radius: 7px;
    background: var(--profile-panel);
    color: var(--fm-text-secondary);
}

.support-tip-card svg {
    width: 1.2rem;
    height: 1.2rem;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.social-screen-header {
    margin-bottom: 1.25rem;
}

.social-screen-header h1 {
    margin: 0 0 .45rem;
    color: var(--fm-text-primary);
    font-size: clamp(2rem, 3.2vw, 2.7rem);
    font-weight: 780;
    line-height: 1.02;
    letter-spacing: 0;
}

.social-screen-header p {
    margin: 0;
    color: var(--fm-text-primary);
    font-size: 1.05rem;
}

.social-links-panel {
    max-width: 1180px;
    padding: 1.2rem;
    border: 1px solid var(--profile-border);
    border-radius: 7px;
    background:
        radial-gradient(circle at 96% 10%, rgba(255, 255, 255, .04), transparent 15rem),
        linear-gradient(180deg, rgba(17, 25, 31, .94), rgba(8, 14, 18, .94));
}

.social-links-panel-head {
    margin-bottom: 1rem;
}

.social-links-panel-head h2 {
    margin: 0 0 .5rem;
    color: var(--fm-text-primary);
    font-size: 1.25rem;
    font-weight: 760;
}

.social-links-panel-head p {
    margin: 0;
    color: var(--fm-text-secondary);
}

.social-link-list {
    display: grid;
    gap: .62rem;
}

.social-link-row {
    display: grid;
    grid-template-columns: 22px 44px 120px minmax(180px, 260px) minmax(180px, 1fr) auto 55px 34px;
    align-items: center;
    gap: .9rem;
    min-height: 68px;
    margin: 0;
    padding: .8rem .9rem;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 7px;
    background: rgba(3, 8, 11, .34);
}

.social-link-handle {
    display: grid;
    place-items: center;
    color: rgba(255, 255, 255, .42);
}

.social-link-handle svg {
    width: 14px;
    height: 24px;
    fill: currentColor;
}

.social-link-icon {
    width: 40px;
    height: 40px;
    display: inline-grid;
    place-items: center;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 50%;
    background: rgba(3, 8, 11, .34);
}

.social-link-icon::before {
    content: '';
    width: 28px;
    height: 28px;
    display: block;
    background-image: var(--dashboard-support-icons, url("../img/support-icons-for-dashboard.png"));
    background-repeat: no-repeat;
    background-size: 644px 75.25px;
    background-position: var(--social-icon-x, 0) -47.25px;
}

.social-link-icon--youtube {
    --social-icon-x: 0;
}

.social-link-icon--instagram {
    --social-icon-x: -28px;
}

.social-link-icon--tiktok {
    --social-icon-x: -56px;
}

.social-link-icon--x {
    --social-icon-x: -84px;
}

.social-link-icon--telegram {
    --social-icon-x: -112px;
}

.social-link-icon--custom-link {
    --social-icon-x: -140px;
}

.social-link-copy {
    min-width: 0;
    display: grid;
    gap: .12rem;
}

.social-link-copy strong {
    color: var(--fm-text-primary);
    font-size: 1rem;
    font-weight: 660;
    line-height: 1.1;
}

.social-link-copy small {
    color: var(--fm-text-secondary);
    font-size: .86rem;
    line-height: 1.2;
}

.social-link-input {
    width: 100%;
    min-height: 44px;
    padding: .65rem .85rem;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 5px;
    background: rgba(3, 8, 11, .66);
    color: var(--fm-text-primary);
    font: inherit;
    line-height: 1.2;
}

.social-link-input:focus {
    outline: 0;
    border-color: rgba(var(--fm-accent-rgb), .72);
    box-shadow: 0 0 0 .2rem rgba(var(--fm-accent-rgb), .12);
}

.social-link-input.is-valid,
.was-validated .social-link-input:valid {
    border-color: rgba(255, 255, 255, .16);
    background-image: none;
}

.social-link-input.is-valid:focus,
.was-validated .social-link-input:valid:focus {
    border-color: rgba(var(--fm-accent-rgb), .72);
    box-shadow: 0 0 0 .2rem rgba(var(--fm-accent-rgb), .12);
}

.social-link-url {
    min-width: 0;
    color: var(--fm-text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.social-link-status {
    color: var(--fm-text-secondary);
    font-size: .92rem;
    justify-self: end;
    white-space: nowrap;
}

.social-link-toggle {
    position: relative;
    width: 55px;
    height: 31px;
    display: inline-flex;
    justify-self: center;
    margin: 0;
    cursor: pointer;
}

.social-link-toggle input {
    position: absolute;
    inset: 0;
    opacity: 0;
}

.social-link-toggle span {
    position: absolute;
    inset: 0;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    background: rgba(3, 8, 11, .66);
}

.social-link-toggle span::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 23px;
    height: 23px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .82);
    box-shadow: 0 3px 12px rgba(0, 0, 0, .4);
    transition: transform .18s ease, background-color .18s ease;
}

.social-link-toggle.is-enabled span {
    border-color: rgba(var(--fm-accent-rgb), .52);
    background: rgba(var(--fm-accent-rgb), .12);
}

.social-link-toggle.is-enabled span::after {
    background: var(--fm-accent);
    transform: translateX(24px);
}

.social-link-delete {
    width: 34px;
    height: 34px;
    display: inline-grid;
    place-items: center;
    justify-self: end;
    padding: 0;
    border: 0;
    background: transparent;
    color: rgba(255, 255, 255, .86);
}

.social-link-delete.is-placeholder {
    opacity: .32;
}

.social-link-delete svg,
.social-add-link svg,
.social-save-button svg {
    width: 1.2rem;
    height: 1.2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.social-link-delete:hover,
.social-link-delete:focus-visible {
    color: #ff4038;
}

.social-add-row {
    display: grid;
    gap: .45rem;
    margin-top: .9rem;
}

.social-add-link {
    min-height: 58px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .8rem;
    width: 100%;
    border: 1px dashed rgba(255, 255, 255, .24);
    border-radius: 7px;
    background: transparent;
    color: var(--fm-accent);
    font-weight: 680;
}

.social-add-link:not(:disabled):hover,
.social-add-link:not(:disabled):focus-visible {
    border-color: rgba(var(--fm-accent-rgb), .62);
    background: rgba(var(--fm-accent-rgb), .08);
}

.social-add-link:disabled,
.social-add-link.is-disabled {
    cursor: not-allowed;
    border-style: solid;
    border-color: rgba(255, 255, 255, .14);
    background: rgba(255, 255, 255, .05);
    color: rgba(255, 255, 255, .42);
}

.social-add-link:disabled svg,
.social-add-link.is-disabled svg {
    opacity: .62;
}

.social-limit-note {
    width: fit-content;
    justify-self: center;
    display: inline-flex;
    align-items: flex-start;
    gap: .3rem;
    color: var(--fm-text-secondary);
    font-size: .88rem;
    line-height: 1.35;
}

.social-limit-note svg {
    width: 1rem;
    height: 1rem;
    flex: 0 0 1rem;
    margin-top: .08rem;
    fill: none;
    stroke: rgba(var(--fm-accent-rgb), .72);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.social-save-row {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    max-width: 1180px;
    margin-top: 1.25rem;
}

.social-save-button {
    min-height: 52px;
    width: 210px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: .9rem 1.35rem;
    border: 0;
    border-radius: 7px;
    background: linear-gradient(180deg, #d9ff1c, var(--fm-accent));
    color: #050805;
    font-weight: 850;
    line-height: 1;
    box-shadow: 0 14px 36px rgba(var(--fm-accent-rgb), .18);
}

.social-save-button:disabled {
    cursor: wait;
    opacity: .82;
}

.social-save-button[data-state="error"] {
    opacity: 1;
}

.social-save-row > span {
    color: var(--fm-text-secondary);
    font-size: .95rem;
}

.social-save-row > .social-save-error {
    color: #ff9a9a;
    font-size: .88rem;
    font-weight: 620;
}

.appearance-screen-header {
    margin-bottom: 1.35rem;
}

.appearance-screen-header h1 {
    margin: 0 0 .45rem;
    color: var(--fm-text-primary);
    font-size: clamp(2rem, 3.2vw, 2.7rem);
    font-weight: 780;
    line-height: 1.02;
    letter-spacing: 0;
}

.appearance-screen-header p {
    margin: 0;
    color: var(--fm-text-secondary);
    font-size: 1.05rem;
}

.appearance-current-card {
    margin-bottom: 1.45rem;
    padding: 1.25rem;
    border: 1px solid var(--profile-border);
    border-radius: 7px;
    background:
        radial-gradient(circle at 96% 10%, rgba(255, 255, 255, .04), transparent 15rem),
        linear-gradient(180deg, rgba(17, 25, 31, .94), rgba(8, 14, 18, .94));
    color: var(--fm-text-primary);
}

.appearance-current-label,
.appearance-section-title {
    margin: 0 0 .9rem;
    color: var(--fm-text-primary);
    font-size: 1rem;
    font-weight: 640;
}

.appearance-current-content {
    display: flex;
    align-items: center;
    gap: 1.05rem;
}

.appearance-current-preview {
    width: 132px;
    aspect-ratio: 16 / 9;
    flex: 0 0 132px;
    overflow: hidden;
    border: 1px solid rgba(var(--fm-accent-rgb), .46);
    border-radius: 5px;
    background: var(--profile-panel-soft);
}

.appearance-current-preview img,
.appearance-theme-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.appearance-current-content h2 {
    margin: 0 0 .45rem;
    color: var(--fm-text-primary);
    font-size: 1.1rem;
    font-weight: 780;
}

.appearance-current-content p {
    margin: 0;
    color: var(--fm-text-secondary);
}

.appearance-theme-form {
    display: block;
}

.appearance-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
}

.appearance-theme-card {
    position: relative;
    display: grid;
    gap: .85rem;
    padding: .8rem;
    overflow: hidden;
    border: 1px solid var(--profile-border);
    border-radius: 7px;
    background:
        radial-gradient(circle at 92% 10%, rgba(255, 255, 255, .04), transparent 12rem),
        linear-gradient(180deg, rgba(17, 25, 31, .94), rgba(8, 14, 18, .94));
    color: var(--fm-text-primary);
    cursor: pointer;
    box-shadow: none;
}

.appearance-theme-card:hover {
    border-color: rgba(255, 255, 255, .18);
    background:
        radial-gradient(circle at 92% 10%, rgba(255, 255, 255, .06), transparent 12rem),
        linear-gradient(180deg, rgba(19, 28, 34, .96), rgba(9, 15, 19, .96));
}

.appearance-theme-card:has(.appearance-theme-radio:focus-visible),
.appearance-theme-card:has(.appearance-theme-radio:checked) {
    border-color: rgba(var(--fm-accent-rgb), .78);
    box-shadow: 0 0 0 1px rgba(var(--fm-accent-rgb), .28);
}

.appearance-theme-radio {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.appearance-theme-preview {
    aspect-ratio: 16 / 7.4;
    overflow: hidden;
    border-radius: 5px;
    background: var(--profile-panel-soft);
}

.appearance-theme-footer {
    display: flex;
    align-items: center;
    gap: .75rem;
    min-height: 34px;
}

.appearance-theme-state {
    width: 22px;
    height: 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    border: 1.5px solid rgba(255, 255, 255, .72);
    border-radius: 50%;
    color: transparent;
}

.appearance-theme-state svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.appearance-theme-card:has(.appearance-theme-radio:checked) .appearance-theme-state {
    border-color: var(--fm-accent);
    background: var(--fm-accent);
    color: #061007;
}

.appearance-theme-card:has(.appearance-theme-radio:checked)::after {
    content: '✓';
    position: absolute;
    top: .7rem;
    right: .7rem;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: var(--fm-accent);
    color: #061007;
    font-size: .92rem;
    font-weight: 900;
    line-height: 1;
}

.appearance-theme-name {
    color: var(--fm-text-primary);
    font-size: 1rem;
    font-weight: 680;
}

.appearance-save-row {
    display: flex;
    align-items: center;
    gap: 1.2rem;
    margin-top: 1.8rem;
}

.appearance-save-button {
    min-height: 52px;
    min-width: 178px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: .9rem 1.35rem;
    border: 0;
    border-radius: 7px;
    background: linear-gradient(180deg, #d9ff1c, var(--fm-accent));
    color: #050805;
    font-weight: 850;
    line-height: 1;
    box-shadow: 0 14px 36px rgba(var(--fm-accent-rgb), .18);
}

.appearance-save-button svg {
    width: 1.12rem;
    height: 1.12rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.appearance-save-button:hover,
.appearance-save-button:focus-visible {
    background: #d7ff2a;
    color: #050805;
}

.appearance-save-button:disabled {
    cursor: wait;
    opacity: .82;
}

.appearance-save-button[data-state="error"] {
    opacity: 1;
}

.appearance-save-row > span {
    color: var(--fm-text-secondary);
    font-size: .95rem;
}

.appearance-save-row > .dashboard-save-status {
    font-size: .88rem;
    font-weight: 620;
}

.dashboard-profile .profile-save-actions .btn,
.dashboard-support .support-method-actions .support-method-save-button,
.dashboard-social .social-save-button,
.dashboard-appearance .appearance-save-button {
    min-height: 48px;
    width: 210px;
    min-width: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
    padding: .75rem 1.05rem;
    border: 1px solid rgba(var(--fm-accent-rgb), .78);
    border-radius: 7px;
    background: transparent;
    color: var(--fm-accent);
    font-weight: 720;
    line-height: 1;
    white-space: nowrap;
    box-shadow: none;
}

.dashboard-profile .profile-save-actions .btn:hover,
.dashboard-profile .profile-save-actions .btn:focus-visible,
.dashboard-support .support-method-actions .support-method-save-button:hover,
.dashboard-support .support-method-actions .support-method-save-button:focus-visible,
.dashboard-social .social-save-button:hover,
.dashboard-social .social-save-button:focus-visible,
.dashboard-appearance .appearance-save-button:hover,
.dashboard-appearance .appearance-save-button:focus-visible {
    background: rgba(var(--fm-accent-rgb), .1);
    color: var(--fm-accent);
    box-shadow: none;
}

.dashboard-profile .profile-save-actions .btn:disabled,
.dashboard-support .support-method-actions .support-method-save-button:disabled,
.dashboard-social .social-save-button:disabled,
.dashboard-appearance .appearance-save-button:disabled {
    cursor: wait;
    opacity: .82;
}

.dashboard-support .support-method-actions .support-method-delete-button {
    min-height: 48px;
    width: 210px;
    min-width: 0;
    gap: .65rem;
    padding: .75rem 1.05rem;
    border: 1px solid rgba(255, 64, 64, .76);
    background: transparent;
    color: #ff4038;
    font-weight: 720;
    line-height: 1;
    box-shadow: none;
}

.dashboard-support .support-method-actions .support-method-delete-button:hover,
.dashboard-support .support-method-actions .support-method-delete-button:focus-visible {
    border-color: rgba(255, 64, 64, .86);
    background: rgba(255, 64, 64, .09);
    color: #ff4038;
    box-shadow: none;
}

@media (max-width: 991.98px) {
    .auth-shell {
        justify-items: stretch;
        padding: 1rem;
    }

    .auth-card {
        min-height: 0;
        grid-template-columns: 1fr;
        border-radius: 24px;
    }

    .auth-brand-panel {
        min-height: 430px;
        padding: 2rem;
    }

    .auth-form-panel {
        min-height: auto;
        padding: 2rem;
    }

    .auth-form-wrap,
    .auth-security-note {
        width: 100%;
    }

    .landing-header {
        min-height: 72px;
    }

    .landing-nav {
        display: none;
    }

    .landing-desktop-actions {
        display: none;
    }

    .landing-mobile-menu {
        display: block;
    }

    .landing-hero {
        min-height: auto;
        grid-template-columns: 1fr;
        gap: 2.6rem;
        padding-top: 2.5rem;
    }

    .landing-preview-wrap {
        justify-content: center;
    }

    .landing-phone-image {
        width: min(100%, 440px);
        transform: none;
    }

    .landing-feature-grid {
        grid-template-columns: 1fr;
    }

    .landing-section {
        margin-top: 64px;
    }

    .dashboard-shell {
        display: block;
    }

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

}

@media (max-width: 767.98px) {
    .support-screen-header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(128px, auto);
        align-items: center;
        gap: .8rem;
    }

    .support-screen-header h1 {
        font-size: clamp(2rem, 10vw, 2.35rem);
    }

    .support-screen-header p {
        font-size: .98rem;
        line-height: 1.45;
    }

    .support-header-actions {
        justify-items: stretch;
    }

    .support-add-button {
        min-height: 74px;
        max-width: 140px;
        padding: .65rem .8rem;
        white-space: normal;
        text-align: center;
        line-height: 1.05;
    }

    .support-limit-note {
        max-width: 140px;
        justify-self: start;
        text-align: left;
        font-size: .78rem;
    }

    .support-limit-note svg {
        display: none;
    }

    .dashboard-support .support-method-summary {
        grid-template-columns: 18px 44px minmax(0, 1fr) 55px 24px;
        gap: .55rem;
        min-height: 76px;
        padding: .8rem .75rem;
    }

    .dashboard-support .support-method-handle svg {
        width: 15px;
    }

    .dashboard-support .support-method-icon {
        width: 42px;
        height: 42px;
    }

    .dashboard-support .support-method-copy strong,
    .dashboard-support .support-method-copy small {
        display: block;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .dashboard-support .support-method-copy strong {
        font-size: .98rem;
        line-height: 1.05;
    }

    .dashboard-support .support-method-copy small {
        font-size: .84rem;
        white-space: nowrap;
    }

    .dashboard-support .support-method-status {
        display: none;
    }

    .dashboard-support .support-method-body {
        padding: .9rem 1rem 1rem;
    }

    .support-method-form-grid,
    .dashboard-support .support-method-form-grid--username,
    .dashboard-support .support-method-form-grid--wallet,
    .dashboard-support .support-method-form-grid--pair,
    .dashboard-support .support-method-form-grid--card {
        grid-template-columns: minmax(0, 1fr);
    }

    .support-method-field-wide,
    .dashboard-support .support-method-form-grid--username .support-method-field-wide,
    .dashboard-support .support-method-form-grid--wallet .support-method-field-wide,
    .dashboard-support .support-method-form-grid--pair .support-method-field-wide,
    .dashboard-support .support-method-form-grid--card .support-method-field-wide {
        grid-column: auto;
    }

    .support-method-modal-actions,
    .dashboard-support .support-method-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .support-method-save-button,
    .support-method-secondary-button,
    .support-method-delete-button {
        width: 100%;
    }

    .support-method-modal-actions .support-method-save-status {
        margin-right: 0;
    }

    .support-method-modal-actions .support-method-save-button,
    .support-method-modal-actions .support-method-secondary-button {
        width: 100%;
    }

    .social-screen-header {
        margin-bottom: 1rem;
    }

    .social-screen-header h1 {
        font-size: clamp(2rem, 10vw, 2.35rem);
    }

    .social-screen-header p {
        font-size: .98rem;
        line-height: 1.45;
    }

    .social-links-panel {
        max-width: none;
        padding: 1rem;
    }

    .social-link-row {
        grid-template-columns: 18px 40px minmax(0, 1fr) 55px 34px;
        gap: .65rem;
        padding: .8rem .75rem;
    }

    .social-link-input {
        grid-column: 3 / -1;
        grid-row: 3;
    }

    .social-link-url {
        grid-column: 3 / -1;
        grid-row: 4;
    }

    .social-link-copy {
        grid-column: 3;
        grid-row: 1;
    }

    .social-link-status {
        grid-column: 3;
        grid-row: 2;
        font-size: .84rem;
        justify-self: start;
    }

    .social-link-toggle {
        grid-column: 4;
        grid-row: 2;
    }

    .social-link-delete {
        grid-column: 5;
        grid-row: 1;
    }

    .social-link-url {
        font-size: .86rem;
    }

    .social-link-toggle {
        justify-self: end;
    }

    .social-add-link {
        min-height: 54px;
    }

    .social-limit-note {
        justify-self: start;
        font-size: .82rem;
    }

    .social-save-row {
        align-items: stretch;
        flex-direction: column;
        gap: .75rem;
        max-width: none;
    }

    .social-save-button {
        width: 100%;
    }

    .support-method-create-modal .modal-dialog {
        width: calc(100vw - 1rem);
        margin: .5rem auto;
    }

    .support-method-create-modal .modal-header {
        padding: 1.1rem 3.3rem .95rem 1rem;
    }

    .support-method-create-modal .modal-body {
        padding: 1rem;
    }

    .auth-shell {
        gap: .85rem;
        align-content: start;
        padding: .5rem .5rem 1rem;
    }

    .auth-card {
        display: flex;
        flex-direction: column;
        gap: .65rem;
        min-height: 0;
        overflow: visible;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }

    .auth-shell-register .auth-card,
    .auth-shell-forgot .auth-card,
    .auth-shell-reset .auth-card,
    .auth-shell-check-email .auth-card {
        min-height: 0;
    }

    .auth-brand-panel {
        min-height: 0;
        justify-content: flex-start;
        gap: .55rem;
        padding: .75rem 1rem .85rem;
        overflow: hidden;
        border: 1px solid rgba(255, 255, 255, .1);
        border-radius: 14px;
        background-position: center 52%;
    }

    .auth-shell-register .auth-brand-panel,
    .auth-shell-register .auth-form-panel,
    .auth-shell-forgot .auth-brand-panel,
    .auth-shell-forgot .auth-form-panel,
    .auth-shell-reset .auth-brand-panel,
    .auth-shell-reset .auth-form-panel,
    .auth-shell-check-email .auth-brand-panel,
    .auth-shell-check-email .auth-form-panel {
        min-height: 0;
    }

    .auth-brand-panel::after {
        box-shadow: none;
    }

    .auth-brand-link {
        gap: .55rem;
        font-size: 1rem;
    }

    .auth-brand-mark {
        width: 1.7rem;
        height: 1.7rem;
    }

    .auth-brand-copy {
        margin-top: .4rem;
    }

    .brand-logo-auth {
        height: 34px;
    }

    .login-brand-title {
        margin-bottom: .42rem;
        font-size: clamp(1.38rem, 6.2vw, 1.65rem);
        line-height: 1.04;
    }

    .auth-shell-register .login-brand-title,
    .auth-shell-forgot .login-brand-title,
    .auth-shell-reset .login-brand-title,
    .auth-shell-check-email .login-brand-title {
        margin-bottom: .42rem;
        font-size: clamp(1.38rem, 6.2vw, 1.65rem);
        line-height: 1.04;
    }

    .auth-shell-register .auth-brand-copy,
    .auth-shell-forgot .auth-brand-copy,
    .auth-shell-reset .auth-brand-copy,
    .auth-shell-check-email .auth-brand-copy {
        margin-bottom: 0;
    }

    .login-brand-text {
        font-size: .8rem;
        line-height: 1.3;
    }

    .auth-feature-list {
        display: none;
    }

    .auth-form-panel {
        display: flex;
        flex-direction: column;
        min-height: 0;
        gap: 1.05rem;
        padding: 1.05rem 1.25rem 1.25rem;
        border: 1px solid rgba(255, 255, 255, .1);
        border-radius: 14px;
    }

    .auth-form-topline {
        justify-content: space-between;
        gap: .75rem;
        font-size: .94rem;
    }

    .auth-outline-button {
        min-height: 44px;
        padding-inline: 1rem;
        font-size: .9rem;
    }

    .auth-form-wrap {
        margin-top: .8rem;
    }

    .auth-register-wrap,
    .auth-forgot-wrap,
    .auth-reset-wrap,
    .auth-check-email-wrap {
        width: 100%;
    }

    .auth-form-header {
        margin-bottom: 1.35rem;
    }

    .auth-shell-register .auth-form-header,
    .auth-shell-forgot .auth-form-header,
    .auth-shell-reset .auth-form-header {
        margin-bottom: 1.35rem;
    }

    .auth-form-header h1 {
        font-size: 2rem;
    }

    .auth-shell-register .auth-form-header h1,
    .auth-shell-forgot .auth-form-header h1,
    .auth-shell-reset .auth-form-header h1 {
        font-size: clamp(2rem, 9vw, 2.35rem);
    }

    .auth-form-header p {
        font-size: 1rem;
        line-height: 1.45;
    }

    .login-split-card .input-group {
        min-height: 58px;
    }

    .login-split-card .input-group .input-group-text {
        width: 3.15rem;
    }

    .login-split-card .input-group .auth-input,
    .auth-password-toggle {
        height: 56px;
    }

    .auth-submit {
        min-height: 58px;
        margin-top: .75rem;
    }

    .auth-or {
        gap: 1rem;
        margin: 1.2rem 0 1rem;
    }

    .auth-security-note {
        align-items: flex-start;
        gap: .85rem;
        margin-top: .35rem;
        margin-bottom: 0;
        font-size: .9rem;
    }

    .auth-security-note .auth-feature-icon {
        width: 2.5rem;
        height: 2.5rem;
    }

    .auth-shell-check-email .auth-form-panel {
        gap: .85rem;
    }

    .auth-shell-check-email .auth-form-topline {
        margin-bottom: 0;
    }

    .auth-check-email-wrap {
        margin-top: 0;
    }

    .auth-confirmation-icon {
        width: 4.9rem;
        height: 4.9rem;
        margin-bottom: .55rem;
    }

    .auth-confirmation-icon > svg {
        width: 2.9rem;
        height: 2.9rem;
    }

    .auth-confirmation-icon span {
        right: .66rem;
        bottom: .76rem;
        width: 1.55rem;
        height: 1.55rem;
    }

    .auth-check-email-header {
        margin-bottom: .75rem;
    }

    .auth-check-email-header h1 {
        gap: .45rem;
        font-size: clamp(1.72rem, 7.6vw, 2.05rem);
    }

    .auth-title-envelope {
        width: 2rem;
        height: 1.48rem;
    }

    .auth-email-display {
        min-height: 54px;
        grid-template-columns: 3.55rem minmax(0, 1fr);
        width: 100%;
        margin-bottom: .85rem;
    }

    .auth-email-display strong {
        font-size: .98rem;
    }

    .auth-confirmation-copy {
        font-size: .9rem;
        line-height: 1.4;
    }

    .auth-check-email-form {
        margin-top: .9rem;
        padding-top: .9rem;
    }

    .auth-check-email-actions {
        gap: .7rem;
    }

    .auth-check-email-actions .auth-submit,
    .auth-secondary-action {
        min-height: 58px;
    }

    .auth-secondary-action {
        font-size: 1rem;
    }

    .auth-footer {
        gap: .75rem;
        padding-bottom: .7rem;
    }

    .auth-footer nav {
        gap: .45rem 1rem;
        font-size: .82rem;
    }

    .auth-footer-mark {
        width: 2.25rem;
        height: 2.25rem;
    }

    .landing-header,
    .landing-main,
    .landing-footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .landing-header {
        align-items: center;
        min-height: 0;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .landing-header-actions {
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    .landing-brand {
        min-height: 42px;
    }

    .landing-login-button {
        min-height: 40px;
        padding-inline: .75rem;
        font-size: .9rem;
    }

    .landing-create-button {
        min-height: 40px;
        padding-inline: .8rem;
        font-size: .9rem;
    }

    .landing-hero {
        gap: 1.25rem;
        padding-top: 1rem;
    }

    .landing-hero h1 {
        font-size: clamp(2.65rem, 15vw, 4.05rem);
    }

    .landing-hero-actions .btn {
        min-width: 0;
        width: 100%;
    }

    .landing-preview-wrap {
        justify-content: center;
    }

    .landing-phone-image {
        width: min(100%, 370px);
    }

    .landing-hero-audience {
        margin-top: 1rem;
        text-align: left;
    }

    .landing-middleman-card {
        display: grid;
        gap: .35rem;
        margin-top: 1.25rem;
        text-align: left;
    }

    .landing-feature-card {
        min-height: 0;
        padding: 1.6rem;
    }

    .landing-section {
        margin-top: 48px;
    }

    .landing-final-cta {
        margin-top: 4.5rem;
    }

    .landing-final-cta p {
        margin-top: -.55rem;
    }

    .landing-footer {
        grid-template-columns: 1fr;
        grid-template-areas:
            "brand"
            "desc"
            "nav"
            "socials"
            "copy";
        align-items: start;
        gap: 1.25rem;
        padding-bottom: 1.6rem;
    }

    .text-page-footer {
        grid-template-areas:
            "brand"
            "desc"
            "nav"
            "copy";
    }

    .landing-footer nav {
        justify-content: flex-start;
        gap: 1rem;
    }

    .landing-footer-socials {
        justify-self: start;
        justify-content: flex-start;
    }

    .landing-footer-copy {
        justify-self: start;
        white-space: normal;
    }

    .dashboard-header {
        min-height: 64px;
        padding: .65rem .75rem;
        gap: .65rem;
    }

    .dashboard-header-actions {
        gap: .5rem;
    }

    .dashboard-mobile-brand {
        gap: .45rem;
        font-size: .98rem;
        white-space: nowrap;
    }

    .dashboard-mobile-brand .dashboard-brand-mark {
        width: 2rem;
        height: 2rem;
    }

    .dashboard-share-button {
        width: 54px;
        height: 54px;
        min-height: 54px;
        display: inline-grid;
        place-items: center;
        padding: 0;
        line-height: 1;
    }

    .dashboard-share-button svg {
        display: block;
        margin: 0;
    }

    .dashboard-share-button span {
        display: none;
    }

    .dashboard-user-button {
        padding: 0;
    }

    .dashboard-user-avatar {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }

    .dashboard-user-caret {
        display: none;
    }

    .dashboard-content {
        padding: 1rem 1rem 2rem;
    }

    .dashboard-profile-head h1 {
        font-size: 1.85rem;
    }

    .profile-images-card {
        padding: 1rem;
    }

    .dashboard-card-header,
    .profile-images-editor,
    .profile-field-row {
        grid-template-columns: 1fr;
    }

    .dashboard-card-header {
        display: grid;
    }

    .profile-cover-editor {
        min-height: 150px;
    }

    .profile-field-row {
        gap: 1rem;
        padding: 1rem;
    }

    .profile-field-copy p {
        max-width: none;
    }

    .profile-public-url-box {
        grid-template-columns: auto minmax(0, 1fr);
        padding: .9rem 1rem;
    }

    .profile-public-url-copy {
        grid-column: 1 / -1;
        width: 100%;
    }

    .profile-public-url-help {
        display: grid;
        gap: .45rem;
        justify-content: stretch;
    }

    .profile-public-url-settings {
        width: fit-content;
    }

    .profile-save-actions {
        display: grid;
        gap: .75rem;
        justify-content: stretch;
    }

    .profile-save-actions .btn {
        width: 100%;
    }

    .public-profile-topbar,
    .public-profile-main,
    .public-profile-footer {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .public-profile-topbar {
        min-height: 64px;
    }

    .public-profile-cover {
        min-height: 150px;
        aspect-ratio: 4 / 2.3;
    }

    .public-profile-identity {
        grid-template-columns: 1fr;
        gap: .75rem;
        padding: 0 1rem 1rem;
    }

    .public-profile-avatar {
        width: 112px;
        height: 112px;
        margin-top: -56px;
    }

    .public-profile-intro {
        padding-top: 0;
    }

    .public-profile-url-row {
        display: flex;
        width: 100%;
    }

    .public-profile-url-row .btn {
        flex: 0 0 auto;
    }

    .profile-preview-cover {
        aspect-ratio: 4 / 3;
        min-height: 150px;
    }

    .profile-preview-body {
        flex-direction: column;
        padding: 0 1rem 1rem;
    }

    .profile-preview-content {
        padding-top: 0;
    }

    .profile-media-control {
        flex-direction: column;
    }

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

    .profile-url-control {
        flex-direction: column;
    }

    .profile-url-control .btn {
        width: 100%;
    }

    .settings-danger-row {
        align-items: stretch;
        flex-direction: column;
    }

    .settings-screen-header {
        margin-bottom: 1rem;
    }

    .settings-screen-header h1 {
        font-size: clamp(2rem, 10vw, 2.35rem);
    }

    .settings-screen-header p {
        font-size: .98rem;
        line-height: 1.45;
    }

    .settings-layout {
        max-width: none;
    }

    .settings-section-card {
        grid-template-columns: minmax(0, 1fr);
        gap: 1rem;
        min-height: 0;
        padding: 1rem;
    }

    .settings-public-profile-card,
    .settings-public-profile-content {
        grid-template-columns: minmax(0, 1fr);
    }

    .settings-public-profile-card {
        min-height: 0;
        padding: 1rem;
        gap: 1rem;
    }

    .settings-public-profile-content {
        gap: 1rem;
    }

    .settings-public-profile-icon {
        width: 38px;
        height: 38px;
    }

    .settings-public-profile-icon svg {
        width: 1.35rem;
        height: 1.35rem;
    }

    .settings-public-profile-body h2 {
        font-size: 1.22rem;
    }

    .settings-public-profile-body p {
        margin-top: .55rem;
        font-size: .98rem;
        line-height: 1.35;
    }

    .settings-public-url-block {
        gap: .42rem;
        margin-top: 1rem;
    }

    .settings-public-url-label {
        font-size: .9rem;
    }

    .settings-public-url-link {
        font-size: 1rem;
    }

    .settings-public-url-help {
        font-size: .88rem;
    }

    .settings-public-profile-action,
    .settings-public-access-form {
        justify-content: flex-start;
    }

    .settings-public-profile-action {
        min-width: 0;
    }

    .settings-public-access-form {
        gap: .9rem;
    }

    .settings-switch-label {
        font-size: 1rem;
        font-weight: 720;
    }

    .settings-section-intro {
        grid-template-columns: 28px minmax(0, 1fr);
        gap: .8rem;
    }

    .settings-section-intro h2 {
        font-size: 1.05rem;
    }

    .settings-section-intro p {
        margin-top: .45rem;
        font-size: .92rem;
    }

    .settings-password-fields,
    .settings-username-fields {
        grid-template-columns: minmax(0, 1fr);
        gap: .85rem;
    }

    .settings-input {
        min-height: 48px;
    }

    .settings-action-cell {
        align-self: auto;
        justify-content: stretch;
    }

    .settings-outline-action,
    .settings-danger-action {
        width: 100%;
        min-width: 0;
    }

    .settings-danger-note {
        padding: .85rem;
    }

    .settings-delete-modal-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .settings-delete-cancel {
        width: 100%;
    }

    .settings-secure-note {
        padding-inline: .5rem;
        line-height: 1.4;
    }

    .support-method-summary {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .support-method-handle,
    .support-method-summary .badge {
        display: none;
    }

    .appearance-screen-header {
        margin-bottom: 1rem;
    }

    .appearance-screen-header h1 {
        font-size: clamp(2rem, 10vw, 2.35rem);
    }

    .appearance-screen-header p {
        font-size: .98rem;
        line-height: 1.45;
    }

    .appearance-current-card {
        margin-bottom: 1rem;
        padding: 1rem;
    }

    .appearance-current-content {
        align-items: flex-start;
        gap: .85rem;
    }

    .appearance-current-preview {
        width: 112px;
        flex-basis: 112px;
    }

    .appearance-current-content h2 {
        font-size: 1.02rem;
    }

    .appearance-current-content p {
        font-size: .9rem;
        line-height: 1.35;
    }

    .appearance-grid {
        grid-template-columns: 1fr;
        gap: .9rem;
    }

    .appearance-theme-card {
        gap: .72rem;
        padding: .7rem;
    }

    .appearance-theme-preview {
        aspect-ratio: 16 / 8.2;
    }

    .appearance-save-row {
        align-items: stretch;
        flex-direction: column;
        gap: .75rem;
        margin-top: 1.2rem;
    }

    .appearance-save-button {
        width: 100%;
    }
}
