/*
 * MY TOURN UP — official visual identity.
 *
 * This compatibility layer is intentionally loaded after the existing public,
 * modern and legacy stylesheets. It changes presentation only: routes, form
 * contracts, data attributes and the established motion system stay intact.
 */

@font-face {
    font-family: "Cormorant Garamond";
    src: url("../fonts/cormorant-garamond-latin-ext.woff2") format("woff2");
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Cormorant Garamond";
    src: url("../fonts/cormorant-garamond-latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 400 600;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Cormorant Garamond";
    src: url("../fonts/cormorant-garamond-italic-latin-ext.woff2") format("woff2");
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Cormorant Garamond";
    src: url("../fonts/cormorant-garamond-italic-latin.woff2") format("woff2");
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Manrope";
    src: url("../fonts/manrope-latin-ext.woff2") format("woff2");
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Manrope";
    src: url("../fonts/manrope-latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    color-scheme: light;
    --brand-court: #1f3d2e;
    --brand-court-deep: #102b20;
    --brand-court-soft: #dfe7e1;
    --brand-clay: #c4633a;
    --brand-clay-deep: #9f4527;
    --brand-clay-soft: #f1ded4;
    --brand-off-white: #f2efe9;
    --brand-paper: #fbfaf7;
    --brand-white: #ffffff;
    --brand-ink: #16271f;
    --brand-muted: #44534b;
    --brand-line: #d8d2c8;
    --brand-line-strong: #b9b1a6;
    --brand-success: #276b48;
    --brand-danger: #9f3830;
    --brand-warning: #9a5c20;
    --brand-focus: #9f4527;
    --brand-clay-texture: url("../images/brand-clay-texture.jpg");
    --brand-shadow: 0 18px 46px rgb(31 61 46 / 10%);
    --brand-shadow-raised: 0 24px 70px rgb(16 43 32 / 15%);

    /* Modern UI aliases */
    --m-ink: var(--brand-ink);
    --m-ink-2: #30463a;
    --m-muted: var(--brand-muted);
    --m-canvas: var(--brand-off-white);
    --m-surface: var(--brand-paper);
    --m-surface-2: #e9e5dd;
    --m-line: var(--brand-line);
    --m-line-strong: var(--brand-line-strong);
    --m-green: var(--brand-court);
    --m-green-soft: var(--brand-court-soft);
    --m-clay: var(--brand-clay-deep);
    --m-clay-soft: var(--brand-clay-soft);
    --m-yellow: var(--brand-clay);
    --m-danger: var(--brand-danger);
    --m-danger-soft: #f3dcd8;
    --m-focus: var(--brand-focus);
    --m-shadow: var(--brand-shadow);
    --m-sidebar: clamp(260px, 19vw, 304px);

    /* Public UI aliases */
    --p-ink: var(--brand-ink);
    --p-ink-2: #30463a;
    --p-muted: var(--brand-muted);
    --p-canvas: var(--brand-off-white);
    --p-surface: var(--brand-paper);
    --p-surface-2: #e9e5dd;
    --p-line: var(--brand-line);
    --p-line-strong: var(--brand-line-strong);
    --p-green: var(--brand-court);
    --p-green-soft: var(--brand-court-soft);
    --p-clay: var(--brand-clay-deep);
    --p-clay-soft: var(--brand-clay-soft);
    --p-yellow: var(--brand-clay);
    --p-danger: var(--brand-danger);
    --p-focus: var(--brand-focus);
    --p-shadow: var(--brand-shadow);

    /* Legacy UI aliases */
    --color-primary: var(--brand-court);
    --color-secondary: var(--brand-clay-deep);
    --color-gradient-start: var(--brand-court-deep);
    --color-gradient-end: var(--brand-clay);
    --color-surface: var(--brand-off-white);
    --color-text-primary: var(--brand-ink);
    --color-text-secondary: var(--brand-muted);
    --color-card: var(--brand-paper);
    --color-border: rgb(31 61 46 / 14%);
    --shadow-soft: var(--brand-shadow);
    --shadow-hover: var(--brand-shadow-raised);
    --radius-large: 20px;
    --radius-medium: 14px;
    --radius-small: 9px;
    --app-pattern-gradient:
        radial-gradient(100% 80% at 88% 10%, rgb(196 99 58 / 18%), transparent 55%),
        linear-gradient(150deg, var(--brand-court-deep), var(--brand-court));
}

html {
    background: var(--brand-off-white);
}

body,
button,
input,
select,
textarea {
    font-family: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

:is(h1, h2, h3, h4, .section-title, .plan-title, .admin-header__title) {
    font-family: "Cormorant Garamond", Georgia, "Times New Roman", serif;
    font-weight: 500;
}

::selection {
    color: var(--brand-white);
    background: var(--brand-clay);
}

/* Official responsive lockup */
.brand-lockup {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    line-height: 0;
}

.brand-lockup__image {
    display: block;
    width: 112px;
    height: auto;
    object-fit: contain;
}

.brand-lockup--vertical .brand-lockup__image {
    width: 180px;
}

.brand-lockup--compact .brand-lockup__image {
    width: 108px;
}

/* Shared controls and surfaces */
:is(.modern-app, .public-site, .dashboard-shell) :focus-visible {
    outline-color: var(--brand-focus);
}

:is(
    .m-menu-button,
    .m-nav-close,
    .m-icon-button,
    .app-nav-toggle,
    .app-sidebar__close
) {
    min-width: 44px !important;
    min-height: 44px !important;
}

:is(.modern-app, .public-site, .dashboard-shell) :is(input, select, textarea) {
    border-color: var(--brand-line-strong);
    border-radius: 9px;
    color: var(--brand-ink);
    background: var(--brand-paper);
}

:is(.modern-app, .public-site) gmp-place-autocomplete {
    display: block;
    width: 100%;
}

:is(.modern-app, .public-site, .dashboard-shell) :is(input, select, textarea):focus {
    border-color: var(--brand-court);
    box-shadow: 0 0 0 3px rgb(31 61 46 / 28%);
    outline: 3px solid var(--brand-focus);
    outline-offset: 2px;
}

@media (forced-colors: active) {
    :is(.modern-app, .public-site, .dashboard-shell) :focus-visible {
        outline: 3px solid CanvasText !important;
        outline-offset: 3px;
    }
}

:is(.modern-app, .public-site, .dashboard-shell) :is(.m-button--primary, .btn--primary, .btn-primary) {
    border-color: var(--brand-clay-deep) !important;
    color: var(--brand-white) !important;
    background:
        linear-gradient(rgb(91 34 14 / 34%), rgb(91 34 14 / 34%)),
        var(--brand-clay-texture) center / cover no-repeat,
        var(--brand-clay-deep) !important;
}

:is(.modern-app, .public-site, .dashboard-shell) :is(.m-button--primary, .btn--primary, .btn-primary):hover {
    border-color: var(--brand-clay-deep) !important;
    background:
        linear-gradient(rgb(76 27 10 / 46%), rgb(76 27 10 / 46%)),
        var(--brand-clay-texture) center / cover no-repeat,
        var(--brand-clay-deep) !important;
}

:is(.modern-app, .public-site, .dashboard-shell) :is(.m-button--quiet, .btn--ghost, .btn-ghost) {
    border-color: var(--brand-line-strong) !important;
    color: var(--brand-court) !important;
    background: transparent !important;
}

/* Public site */
body.public-site {
    color: var(--brand-ink);
    background: var(--brand-off-white) !important;
    font-family: "Manrope", system-ui, sans-serif;
}

.public-site :is(h1, h2, h3, h4, .section-title, .plan-title, .plans-hero h1, .hero h1) {
    color: var(--brand-court);
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-weight: 500 !important;
    letter-spacing: -.035em;
}

.public-site :is(.site-header, .landing-header) {
    border-bottom: 1px solid rgb(242 239 233 / 13%) !important;
    color: var(--brand-off-white) !important;
    background:
        linear-gradient(rgb(255 255 255 / 2%) 1px, transparent 1px) 0 78px / 100% 78px,
        rgb(31 61 46 / 97%) !important;
    box-shadow: 0 8px 28px rgb(16 43 32 / 10%);
}

body.public-site.landing--v2 .landing-header {
    background:
        linear-gradient(rgb(11 31 23 / 12%), rgb(11 31 23 / 12%)),
        url("../images/brand-header-texture.jpg") center / cover no-repeat,
        var(--brand-court) !important;
}

.public-site :is(.site-header__inner, .landing-header .nav) {
    min-height: 82px;
}

.public-site :is(.site-logo, .landing-header .logo) {
    display: inline-flex;
    align-items: center;
    color: var(--brand-off-white);
}

.public-site :is(.site-logo, .landing-header .logo) .brand-lockup {
    color: var(--brand-off-white);
}

.public-site :is(.site-logo, .landing-header .logo) .brand-lockup__image {
    width: 112px;
}

.public-site :is(.site-logo, .landing-header .logo) .brand-lockup__tagline {
    color: #e29a79;
}

.public-site :is(.site-logo, .landing-header .logo) .brand-lockup__mark {
    width: 39px;
}

.public-site :is(.site-logo, .landing-header .logo) .brand-lockup__name {
    font-size: 23px;
}

.public-site :is(.landing-header .menu a:not(.btn), .site-header__actions a) {
    color: rgb(242 239 233 / 80%);
    font-family: "Manrope", sans-serif;
}

.public-site :is(.landing-header .menu a:not(.btn), .site-header__actions a):hover {
    color: var(--brand-white);
    background: rgb(255 255 255 / 8%);
}

.public-site .landing-header .btn-primary--nav {
    border-color: var(--brand-clay-deep) !important;
    color: var(--brand-white) !important;
    background:
        linear-gradient(rgb(91 34 14 / 34%), rgb(91 34 14 / 34%)),
        var(--brand-clay-texture) center / cover no-repeat,
        var(--brand-clay-deep) !important;
}

.public-site .landing-header .btn-primary--nav:hover {
    background:
        linear-gradient(rgb(76 27 10 / 46%), rgb(76 27 10 / 46%)),
        var(--brand-clay-texture) center / cover no-repeat,
        var(--brand-clay-deep) !important;
}

body.public-site.landing--v2 {
    color: var(--brand-ink) !important;
    background:
        radial-gradient(circle at 82% 12%, rgb(196 99 58 / 12%), transparent 28%),
        var(--brand-off-white) !important;
}

.public-site .hero {
    min-height: min(720px, calc(100vh - 82px));
    padding-block: clamp(62px, 8vw, 112px) !important;
}

.public-site .hero::before {
    position: absolute;
    z-index: -1;
    top: 128px;
    left: max(24px, calc((100vw - 1240px) / 2));
    width: 52px;
    height: 3px;
    background: var(--brand-clay);
    content: "";
}

.public-site .hero h1 {
    max-width: 750px;
    color: var(--brand-court) !important;
    font-size: clamp(52px, 6vw, 88px) !important;
    line-height: .88 !important;
}

.public-site .hero p,
.public-site .hero-meta {
    color: var(--brand-muted) !important;
}

.public-site .hero-text small {
    padding: 0 !important;
    color: var(--brand-clay) !important;
    background: transparent !important;
    font-family: "Manrope", sans-serif;
    font-weight: 700 !important;
    letter-spacing: .15em;
    text-transform: uppercase;
}

.public-site :is(.hero-screen, .notif-img-block, .notif-preview) {
    border: 1px solid rgb(242 239 233 / 14%) !important;
    background-color: var(--brand-court) !important;
    box-shadow: var(--brand-shadow-raised) !important;
}

.public-site .hero-screen {
    border-radius: 24px !important;
    background:
        linear-gradient(145deg, rgb(255 255 255 / 6%), transparent 42%),
        var(--brand-court) !important;
}

body.public-site.landing--v2 .hero-screen::before,
body.public-site.landing--v2 .hero-screen::after {
    display: none;
}

body.public-site.landing--v2 .hero-screen-inner {
    border-radius: 17px !important;
    background-color: var(--brand-court-deep) !important;
    background-image: url("../images/brand-landing-hero.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    filter: none;
}

body.public-site.landing--v2 .hero-product-preview {
    display: none !important;
}

body.public-site.landing--v2 .notif-img-block .notif-preview {
    background-color: var(--brand-court-deep) !important;
    background-image: url("../images/brand-instant-alerts.jpg") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    filter: none;
}

body.public-site.landing--v2 .notif-img-block .notif-preview::after {
    display: none;
}

.public-site :is(.notif-floating, .hero-product-preview) {
    border-color: rgb(196 99 58 / 58%) !important;
    color: var(--brand-off-white) !important;
    background: rgb(16 43 32 / 96%) !important;
    box-shadow: var(--brand-shadow-raised) !important;
}

.public-site .section {
    border-top: 1px solid var(--brand-line);
    border-radius: 32px 32px 0 0 !important;
    color: var(--brand-ink) !important;
    background:
        radial-gradient(circle at 100% 0, rgb(196 99 58 / 10%), transparent 30%),
        var(--brand-paper) !important;
}

.public-site :is(.feature-card, .step, .plan, .plan-card, .form-card, .legal-card, .auth-card) {
    border: 1px solid var(--brand-line) !important;
    border-radius: 18px !important;
    color: var(--brand-ink) !important;
    background: var(--brand-paper) !important;
    box-shadow: none !important;
}

.public-site :is(.feature-card, .step, .plan, .plan-card, .form-card, .legal-card, .auth-card):hover {
    border-color: var(--brand-line-strong);
}

.public-site :is(.feature-card, .step, .plan, .plan-card) h3 {
    color: var(--brand-court) !important;
}

.public-site :is(.plan.recommended, .plan-card.is-selected) {
    border-color: var(--brand-clay) !important;
    box-shadow: 0 0 0 1px var(--brand-clay) !important;
}

.public-site :is(.step-num, .plan-icon, .notif-icon) {
    color: var(--brand-white) !important;
    background: var(--brand-clay-deep) !important;
}

.public-site .faq-item {
    border-color: var(--brand-line) !important;
}

.public-site :is(.landing-footer, .footer) {
    color: rgb(242 239 233 / 76%) !important;
    background: var(--brand-court-deep) !important;
}

.public-site :is(.landing-footer, .footer) .brand-lockup {
    color: var(--brand-off-white);
}

.public-site :is(.landing-footer, .footer) .brand-lockup__tagline {
    color: #e29a79;
}

/* Authentication and account states */
body.public-site.auth--login,
body.public-site.auth {
    color: var(--brand-ink) !important;
    background:
        linear-gradient(90deg, var(--brand-court) 0 50%, var(--brand-off-white) 50%),
        var(--brand-off-white) !important;
}

body.public-site.auth--login main,
body.public-site.auth main {
    background:
        linear-gradient(90deg, var(--brand-court) 0 50%, var(--brand-off-white) 50%),
        var(--brand-off-white) !important;
}

.public-site.auth--login .hero-text {
    color: var(--brand-off-white);
}

.public-site.auth--login .hero-text :is(h1, p, small, .hero-meta) {
    color: var(--brand-off-white) !important;
}

.public-site.auth--login .hero-text small {
    width: fit-content;
    justify-self: start;
}

.public-site.auth--login .hero-actions .btn-ghost {
    border-color: rgb(242 239 233 / 72%) !important;
    color: var(--brand-off-white) !important;
    background: transparent !important;
}

.public-site.auth--login .hero-actions .btn-ghost:hover {
    border-color: var(--brand-off-white) !important;
    background: rgb(242 239 233 / 10%) !important;
}

@media (max-width: 992px) {
    body.public-site.auth--login,
    body.public-site.auth,
    body.public-site.auth--login main,
    body.public-site.auth main {
        background: var(--brand-off-white) !important;
    }

    .public-site.auth--login .hero-text {
        padding: 1.5rem;
        border-radius: var(--brand-radius-lg);
        background: var(--brand-court);
    }
}

.public-site .auth-switch {
    border: 1px solid var(--brand-line);
    background: #e8e3da !important;
}

.public-site .auth-switch__btn.is-active {
    color: var(--brand-white) !important;
    background: var(--brand-court) !important;
}

.public-site .password-meter {
    background: var(--brand-court-soft);
}

.public-site :is(.alert--success, .alert[data-state="success"]) {
    border-color: var(--brand-success);
    color: var(--brand-success);
    background: #e1eee6;
}

.public-site .alert--error {
    border-color: var(--brand-danger);
    color: var(--brand-danger);
    background: #f4dfdc;
}

/* Modern authenticated application */
body.modern-app {
    color: var(--brand-ink);
    background: var(--brand-off-white);
    font-family: "Manrope", system-ui, sans-serif;
}

.modern-app :is(h1, h2, h3, .section-title) {
    color: var(--brand-court);
    font-family: "Cormorant Garamond", Georgia, serif !important;
    font-weight: 500 !important;
    letter-spacing: -.035em;
}

.modern-app strong,
.modern-app .m-topbar__title :is(strong, h1) {
    font-family: "Manrope", system-ui, sans-serif;
}

.modern-app .m-shell {
    grid-template-columns: var(--m-sidebar) minmax(0, 1fr);
}

.modern-app .m-sidebar {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
    color: var(--brand-off-white);
    background:
        linear-gradient(rgb(11 31 23 / 12%), rgb(11 31 23 / 12%)),
        url("../images/brand-sidebar-texture.png") center / cover no-repeat,
        var(--brand-court);
}

.modern-app .m-sidebar::after {
    display: none;
}

.modern-app .m-sidebar__top {
    flex: 0 0 auto;
    min-height: 142px;
    padding: 20px 28px;
    border-bottom: 1px solid rgb(242 239 233 / 10%);
}

.modern-app .m-brand {
    color: var(--brand-off-white);
}

.modern-app .m-brand .brand-lockup {
    color: var(--brand-off-white);
}

.modern-app .m-brand .brand-lockup__image {
    width: 180px;
}

.modern-app .m-brand .brand-lockup__mark {
    width: 48px;
}

.modern-app .m-brand .brand-lockup__name {
    font-size: 27px;
}

.modern-app .m-brand .brand-lockup__tagline {
    color: #e29a79;
}

/* Installable web app */
[data-pwa-install][hidden] {
    display: none !important;
}

.pwa-install-link {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    place-items: center;
    padding: 0 !important;
    border-radius: 12px !important;
    color: inherit;
    text-decoration: none;
}

.pwa-install-link svg,
.pwa-footer-cta__button svg,
.pwa-legacy-install-link svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.9;
}

.public-site .landing-header .menu .pwa-install-link,
.public-site .site-header__actions .pwa-install-link {
    display: grid;
}

.pwa-footer-cta {
    display: flex;
    width: 100%;
    grid-column: 1 / -1;
    align-items: center;
    justify-content: space-between;
    gap: 28px;
    padding: 24px 26px;
    border: 1px solid rgb(255 255 255 / 12%);
    border-radius: 18px;
    color: #f2efe9;
    background: rgb(255 255 255 / 6%);
}

.pwa-footer-cta h2 {
    margin: 0;
    color: var(--brand-off-white) !important;
    font-size: clamp(20px, 2.5vw, 27px);
}

.pwa-footer-cta p {
    margin: 7px 0 0;
    color: rgb(242 239 233 / 72%);
    font-size: 14px;
}

.pwa-footer-cta__button {
    display: inline-flex;
    min-height: 44px;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 999px;
    color: #1f3d2e !important;
    background: #f2efe9;
    font-size: 14px;
    font-weight: 750;
    text-decoration: none;
}

.pwa-footer-cta__button:hover {
    color: #1f3d2e !important;
    background: #fff;
}

.pwa-legacy-install-link {
    gap: 7px;
}

@media (max-width: 720px) {
    .public-site .landing-header .menu .pwa-install-link {
        display: grid !important;
    }

    .pwa-footer-cta {
        align-items: flex-start;
        flex-direction: column;
    }
}

.modern-app .m-nav {
    min-height: 0;
    flex: 1 1 auto;
    padding: 12px 18px 24px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-color: rgb(242 239 233 / 28%) transparent;
    scrollbar-gutter: stable;
    scrollbar-width: thin;
}

.modern-app .m-nav::-webkit-scrollbar {
    width: 5px;
}

.modern-app .m-nav::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgb(242 239 233 / 28%);
}

.modern-app .m-nav__eyebrow {
    color: rgb(242 239 233 / 52%);
    font-family: "Manrope", sans-serif;
}

.modern-app .m-nav__eyebrow--second {
    margin-top: 26px;
    padding-top: 22px;
    border-top: 1px solid rgb(242 239 233 / 10%);
}

.modern-app .m-nav__link {
    min-height: 50px;
    margin: 4px 0;
    padding-inline: 15px;
    border-radius: 12px;
    color: rgb(242 239 233 / 80%);
    font-weight: 500;
}

.modern-app .m-nav__link:hover {
    color: var(--brand-white);
    background: rgb(255 255 255 / 8%);
}

.modern-app .m-nav__link.is-current {
    color: var(--brand-court);
    background: var(--brand-off-white);
    box-shadow: 0 10px 30px rgb(10 31 22 / 14%);
}

.modern-app .m-nav__link.is-current::before {
    display: none;
}

.modern-app .m-sidebar__footer {
    flex: 0 0 auto;
    margin-top: 0;
    border-top: 0;
}

.modern-app .m-user__avatar {
    border-color: rgb(242 239 233 / 34%);
    background: var(--brand-clay);
}

.modern-app .m-user__identity span {
    color: rgb(242 239 233 / 58%);
}

.modern-app .m-workspace {
    background:
        radial-gradient(circle at 90% 0, rgb(196 99 58 / 8%), transparent 22%),
        var(--brand-off-white);
}

.modern-app .m-topbar {
    min-height: 84px;
    border-color: var(--brand-line);
    background: rgb(242 239 233 / 92%);
}

.modern-app .m-topbar__title > span {
    color: var(--brand-clay);
}

.modern-app .m-topbar__heading {
    margin: 0;
    color: var(--brand-ink);
}

.modern-app .m-topbar__actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.modern-app .m-topbar__icon-link {
    display: grid;
    width: 44px;
    height: 44px;
    place-items: center;
    border: 1px solid transparent;
    border-radius: 50%;
    color: var(--brand-court);
    text-decoration: none;
}

.modern-app .m-topbar__icon-link:hover {
    border-color: var(--brand-line);
    background: var(--brand-paper);
}

.modern-app .m-topbar__icon-link svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.modern-app .m-topbar__profile {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 9px;
    padding: 4px 7px 4px 4px;
    border-radius: 999px;
    color: var(--brand-ink);
    text-decoration: none;
}

.modern-app .m-topbar__profile:hover {
    background: rgb(31 61 46 / 6%);
}

.modern-app .m-topbar__profile .m-user__avatar {
    width: 36px;
    height: 36px;
}

.modern-app .m-topbar__profile span:last-child {
    max-width: 132px;
    overflow: hidden;
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.modern-app .m-page {
    padding-top: clamp(42px, 5vw, 72px);
}

.modern-app .m-page-intro h1 {
    max-width: 920px;
    color: var(--brand-court);
    font-size: clamp(50px, 5vw, 76px);
    line-height: .9;
}

.modern-app .m-kicker {
    color: var(--brand-clay-deep);
    font-family: "Manrope", sans-serif;
}

.public-site .notif-label {
    color: var(--brand-white) !important;
}

.modern-app :is(.m-panel, .m-signal-strip, .card, .preferences-card, .plans-shell) {
    border-color: var(--brand-line);
    border-radius: 18px;
    background: var(--brand-paper);
    box-shadow: none;
}

.modern-app .m-panel--priority {
    border-top-color: var(--brand-clay);
}

.modern-app .m-signal + .m-signal {
    border-color: var(--brand-line);
}

.modern-app :is(.m-signal strong, .m-ranking strong, .m-stats dd, .m-subscription__name) {
    color: var(--brand-court);
}

.modern-app .m-ranking strong,
.modern-app .m-subscription__name {
    font-family: "Cormorant Garamond", Georgia, serif;
    font-weight: 500;
}

.modern-app :is(.m-tournament-row, .m-compact-tournaments li, .m-saved-list li, .m-alert-list li) {
    border-color: var(--brand-line);
}

.modern-app :is(.m-tournament-row:hover, .m-compact-tournaments li:hover, .m-saved-list li:hover) {
    background: rgb(31 61 46 / 3%);
}

.modern-app .m-tournament-row__date {
    color: var(--brand-off-white);
    background: var(--brand-court);
}

.modern-app .m-filter-panel,
.modern-app .m-tournament-detail__frame {
    border-color: var(--brand-line);
    background: var(--brand-paper);
}

.modern-app .m-save-button[aria-pressed="true"] {
    color: var(--brand-clay);
    background: var(--brand-clay-soft);
}

.modern-app .m-tabs button.is-selected,
.modern-app .m-tabs button[aria-selected="true"] {
    color: var(--brand-white);
    background: var(--brand-court);
}

.modern-app .m-footer {
    border-top: 1px solid var(--brand-line);
}

.modern-app .m-bottom-nav {
    display: none;
}

@media (min-width: 841px) and (max-height: 840px) {
    .modern-app .m-sidebar__top {
        min-height: clamp(94px, 15vh, 124px);
        padding: 12px 24px;
    }

    .modern-app .m-brand .brand-lockup__image {
        width: clamp(132px, 21vh, 164px);
    }

    .modern-app .m-nav {
        padding: 8px 18px 12px;
    }

    .modern-app .m-nav__eyebrow {
        margin-bottom: 6px;
    }

    .modern-app .m-nav__eyebrow--second {
        margin-top: 14px;
        padding-top: 14px;
    }

    .modern-app .m-nav__link {
        min-height: 44px;
        margin-block: 0;
    }

    .modern-app .m-sidebar__footer {
        padding-block: 10px 12px;
    }
}

@media (min-width: 841px) and (max-height: 650px) {
    .modern-app .m-sidebar__top {
        min-height: 88px;
        padding: 8px 22px;
    }

    .modern-app .m-brand .brand-lockup__image {
        width: 120px;
    }

    .modern-app .m-nav {
        padding-block: 6px;
    }

    .modern-app .m-nav__eyebrow {
        margin-bottom: 2px;
    }

    .modern-app .m-nav__eyebrow--second {
        margin-top: 8px;
        padding-top: 8px;
    }

    .modern-app .m-sidebar__footer {
        padding-block: 4px;
    }

    .modern-app .m-user {
        padding-block: 6px;
    }
}

/* Legacy authenticated shell */
body.dashboard-shell {
    color: var(--brand-ink);
    background: var(--brand-off-white);
    font-family: "Manrope", system-ui, sans-serif;
}

.dashboard-shell .app-shell {
    background: var(--brand-off-white);
}

.dashboard-shell .app-sidebar {
    color: var(--brand-off-white);
    background:
        linear-gradient(rgb(11 31 23 / 12%), rgb(11 31 23 / 12%)),
        url("../images/brand-sidebar-texture.png") center / cover no-repeat,
        var(--brand-court);
}

.dashboard-shell .app-sidebar__brand {
    min-height: 138px;
    padding: 22px 26px;
}

.dashboard-shell .app-sidebar__logo .brand-lockup {
    color: var(--brand-off-white);
}

.dashboard-shell .app-sidebar__logo .brand-lockup__image {
    width: 164px;
}

.dashboard-shell .app-sidebar__logo .brand-lockup__tagline {
    color: #e29a79;
}

.dashboard-shell .app-nav__item {
    min-height: 48px;
    margin: 4px 14px;
    border-radius: 12px;
    color: rgb(242 239 233 / 80%);
}

.dashboard-shell .app-nav__item:hover {
    color: var(--brand-white);
    background: rgb(255 255 255 / 8%);
}

.dashboard-shell .app-nav__item.is-active {
    color: var(--brand-court);
    background: var(--brand-off-white);
}

.dashboard-shell .app-header {
    border-color: var(--brand-line);
    background: rgb(242 239 233 / 94%);
}

.dashboard-shell .app-header__title {
    color: var(--brand-court);
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(28px, 3vw, 42px);
    font-weight: 500;
}

.dashboard-shell :is(.card, .table-like, .preferences-card, .plan-card) {
    border-color: var(--brand-line);
    border-radius: 18px;
    background: var(--brand-paper);
    box-shadow: none;
}

.dashboard-shell .app-bottom-nav {
    display: none;
}

/* Admin keeps its dense operational structure */
.public-site.admin-dashboard {
    background: var(--brand-off-white) !important;
}

.public-site .admin-shell {
    max-width: 1480px;
}

.public-site .admin-header {
    border: 0;
    border-radius: 20px;
    color: var(--brand-off-white);
    background:
        radial-gradient(circle at 90% 0, rgb(196 99 58 / 22%), transparent 30%),
        var(--brand-court);
    box-shadow: var(--brand-shadow);
}

.public-site .admin-header__brand {
    margin-bottom: 22px;
}

.public-site .admin-header__brand .brand-lockup {
    color: var(--brand-off-white);
}

.public-site .admin-header__brand .brand-lockup__image {
    width: 190px;
}

.public-site .admin-header__brand .brand-lockup__tagline {
    color: #e29a79;
}

.public-site .admin-header__title {
    color: var(--brand-off-white) !important;
}

.public-site .admin-header__subtitle {
    color: rgb(242 239 233 / 76%) !important;
}

.public-site :is(.admin-actions__card, .metric-card) {
    border-color: var(--brand-line);
    border-radius: 14px;
    background: var(--brand-paper);
}

/* Responsive app navigation */
@media (max-width: 840px) {
    .modern-app .m-sidebar {
        z-index: 60;
    }

    :root {
        --m-sidebar: 286px;
    }

    .modern-app .m-shell {
        display: block;
    }

    .modern-app .m-sidebar {
        width: min(var(--m-sidebar), calc(100vw - 42px));
    }

    .modern-app .m-sidebar__top {
        min-height: 112px;
        padding: 16px 22px;
    }

    .modern-app .m-menu-button,
    .modern-app .m-nav-close {
        display: grid !important;
    }

    .modern-app .m-topbar {
        min-height: 68px;
        padding: max(8px, env(safe-area-inset-top)) 14px 8px;
        border-color: rgb(242 239 233 / 12%);
        color: var(--brand-off-white);
        background: var(--brand-court);
    }

    .modern-app .m-topbar__title {
        display: none;
    }

    .modern-app .m-topbar__mobile-brand {
        display: inline-flex;
        margin-right: auto;
        margin-left: 4px;
        color: var(--brand-off-white);
        text-decoration: none;
    }

    .modern-app .m-topbar__mobile-brand .brand-lockup__image {
        width: 104px;
    }

    .modern-app .m-topbar :is(.m-menu-button, .m-topbar__icon-link) {
        color: var(--brand-off-white);
    }

    .modern-app .m-topbar .m-topbar__icon-link:hover {
        border-color: rgb(242 239 233 / 18%);
        background: rgb(242 239 233 / 8%);
    }

    .modern-app .m-topbar__actions {
        gap: 2px;
    }

    .modern-app .m-topbar__action {
        width: 44px;
        height: 44px;
        justify-content: center;
    }

    .modern-app .m-topbar__profile span:last-child {
        display: none;
    }

    .modern-app .m-main {
        padding-bottom: calc(84px + env(safe-area-inset-bottom));
    }

    .modern-app .m-page {
        padding: 30px 18px 42px;
    }

    .modern-app .m-page-intro h1 {
        font-size: clamp(43px, 13vw, 60px);
    }

    .modern-app :is(.m-panel, .m-signal-strip) {
        border-radius: 14px;
    }

    .modern-app .m-footer {
        margin-bottom: calc(74px + env(safe-area-inset-bottom));
    }

    .modern-app .m-bottom-nav {
        position: fixed;
        z-index: 55;
        right: 0;
        bottom: 0;
        left: 0;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        padding: 7px 4px max(7px, env(safe-area-inset-bottom));
        border-top: 1px solid rgb(242 239 233 / 13%);
        color: rgb(242 239 233 / 64%);
        background: rgb(16 43 32 / 97%);
        box-shadow: 0 -14px 36px rgb(16 43 32 / 14%);
        backdrop-filter: blur(16px);
    }

    .modern-app .m-bottom-nav__item {
        display: flex;
        min-width: 0;
        min-height: 52px;
        align-items: center;
        justify-content: center;
        gap: 3px;
        flex-direction: column;
        border-radius: 9px;
        color: inherit;
        font-size: 9px;
        font-weight: 600;
        line-height: 1;
        text-decoration: none;
    }

    .modern-app .m-bottom-nav__item svg {
        width: 21px;
        height: 21px;
        fill: none;
        stroke: currentColor;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-width: 1.7;
    }

    .modern-app .m-bottom-nav__item.is-current {
        color: #e99773;
        background: rgb(196 99 58 / 12%);
    }

    .dashboard-shell .app-header__mobile-logo {
        display: inline-flex;
        align-items: center;
    }

    .dashboard-shell .app-header {
        border-color: rgb(242 239 233 / 12%);
        color: var(--brand-off-white);
        background: var(--brand-court);
    }

    .dashboard-shell .app-header__mobile-logo .brand-lockup {
        color: var(--brand-off-white);
    }

    .dashboard-shell .app-header__mobile-logo .brand-lockup__image {
        width: 104px;
    }

    .dashboard-shell .app-header :is(.app-nav-toggle, .app-header__actions, a, button) {
        color: var(--brand-off-white);
    }

    .dashboard-shell .app-main {
        padding-bottom: calc(80px + env(safe-area-inset-bottom));
    }

    .dashboard-shell .app-bottom-nav {
        position: fixed;
        z-index: 120;
        right: 0;
        bottom: 0;
        left: 0;
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        padding: 7px 4px max(7px, env(safe-area-inset-bottom));
        border-top: 1px solid rgb(242 239 233 / 13%);
        color: rgb(242 239 233 / 64%);
        background: rgb(16 43 32 / 97%);
        box-shadow: 0 -14px 36px rgb(16 43 32 / 14%);
    }

    .dashboard-shell .app-bottom-nav__item {
        display: flex;
        min-height: 52px;
        align-items: center;
        justify-content: center;
        gap: 3px;
        flex-direction: column;
        border-radius: 9px;
        color: inherit;
        font-size: 9px;
        font-weight: 600;
        text-decoration: none;
    }

    .dashboard-shell .app-bottom-nav__item svg {
        width: 21px;
        height: 21px;
        fill: none;
        stroke: currentColor;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-width: 1.7;
    }

    .dashboard-shell .app-bottom-nav__item.is-current {
        color: #e99773;
        background: rgb(196 99 58 / 12%);
    }

    .public-site .hero {
        min-height: auto;
        padding-block: 54px !important;
    }

    .public-site .hero::before {
        display: none;
    }

    .public-site .hero h1 {
        font-size: clamp(48px, 15vw, 68px) !important;
    }

    body.public-site.auth--login,
    body.public-site.auth {
        background:
            linear-gradient(180deg, var(--brand-court) 0 270px, transparent 270px),
            var(--brand-off-white) !important;
    }
}

@media (min-width: 841px) {
    .modern-app .m-topbar__mobile-brand {
        display: none;
    }
}

.preferences-guidance {
    width: min(92vw, 560px);
    max-width: 560px;
    margin: auto;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 24px;
    color: #173126;
    background: #fffdf8;
    box-shadow: 0 32px 90px rgb(8 35 25 / 28%);
}

.preferences-guidance::backdrop {
    background: rgb(8 35 25 / 58%);
    backdrop-filter: blur(4px);
}

.preferences-guidance__panel {
    position: relative;
    padding: 36px;
    overflow: hidden;
    border: 1px solid rgb(31 61 46 / 12%);
    border-radius: inherit;
    background:
        radial-gradient(circle at 100% 0, rgb(158 228 71 / 20%), transparent 34%),
        #fffdf8;
}

.preferences-guidance__close {
    position: absolute;
    top: 16px;
    right: 16px;
    display: inline-flex;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 0;
    border-radius: 999px;
    color: #29493a;
    background: rgb(31 61 46 / 8%);
    cursor: pointer;
}

.preferences-guidance__close svg,
.preferences-guidance__icon svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.8;
}

.preferences-guidance__icon {
    display: inline-flex;
    width: 52px;
    height: 52px;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    border-radius: 16px;
    color: #fff;
    background: #1f5a43;
    box-shadow: 0 14px 30px rgb(31 90 67 / 24%);
}

.preferences-guidance__eyebrow {
    margin: 0 0 8px;
    color: #a94f32;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.preferences-guidance h2 {
    margin: 0;
    color: #173126;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(34px, 7vw, 46px);
    line-height: 0.98;
}

.preferences-guidance__description,
.preferences-guidance__note {
    color: #4d6258;
    line-height: 1.6;
}

.preferences-guidance__description {
    margin: 18px 0 0;
    font-size: 16px;
}

.preferences-guidance__note {
    margin: 12px 0 0;
    font-size: 14px;
}

.preferences-guidance__actions {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 26px;
}

.preferences-guidance__primary,
.preferences-guidance__dismiss {
    display: inline-flex;
    min-height: 46px;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: 11px 18px;
    border-radius: 999px;
    font: inherit;
    font-size: 14px;
    font-weight: 750;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
}

.preferences-guidance__primary {
    border: 1px solid #1f5a43;
    color: #fff;
    background: #1f5a43;
}

.preferences-guidance__dismiss {
    border: 1px solid rgb(31 61 46 / 22%);
    color: #29493a;
    background: transparent;
}

.preferences-guidance__primary:hover,
.preferences-guidance__primary:focus-visible {
    color: #fff;
    background: #174633;
}

.preferences-guidance__dismiss:hover,
.preferences-guidance__dismiss:focus-visible,
.preferences-guidance__close:hover,
.preferences-guidance__close:focus-visible {
    color: #173126;
    background: rgb(31 61 46 / 14%);
}

.preferences-guidance :focus-visible {
    outline: 3px solid #e08a62;
    outline-offset: 3px;
}

.preferences-guidance__dismiss:disabled {
    cursor: wait;
    opacity: 0.62;
}

.preferences-guidance__error {
    margin: 14px 0 0;
    color: #9c2f24;
    font-size: 14px;
    font-weight: 650;
}

@media (max-width: 620px) {
    .preferences-guidance {
        width: min(92vw, 520px);
        border-radius: 20px;
    }

    .preferences-guidance__panel {
        padding: 30px 22px 24px;
    }

    .preferences-guidance__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .preferences-guidance__primary,
    .preferences-guidance__dismiss {
        width: 100%;
    }
}

@media (max-width: 620px) {
    .brand-lockup__name {
        font-size: 23px;
    }

    .public-site :is(.site-header__inner, .landing-header .nav) {
        width: min(100% - 28px, var(--p-max));
        min-height: 70px;
    }

    .public-site :is(.site-logo, .landing-header .logo) .brand-lockup__mark {
        width: 30px;
    }

    .public-site :is(.site-logo, .landing-header .logo) .brand-lockup__image {
        width: 100px;
    }

    .public-site :is(.site-logo, .landing-header .logo) .brand-lockup__name {
        font-size: 19px;
    }

    .public-site :is(.site-logo, .landing-header .logo) .brand-lockup__tagline {
        display: none;
    }

    .public-site .section {
        border-radius: 24px 24px 0 0 !important;
    }

    .modern-app .m-topbar__profile {
        padding-right: 2px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .brand-lockup *,
    .m-bottom-nav *,
    .app-bottom-nav *,
    .preferences-guidance * {
        animation: none !important;
        transition: none !important;
    }
}
