/* Native-app chrome on phones. Desktop layouts stay unchanged.
   Safe-area: env() with constant() fallback via cascade (do NOT put constant() inside max()). */
:root {
    --app-tab-h: 50px;
    --app-safe-t: 0px;
    --app-safe-b: 0px;
    --app-safe-l: 0px;
    --app-safe-r: 0px;
    --app-sheet-peek: 52px;
    --app-bottom-chrome: calc(var(--app-tab-h) + var(--app-safe-b));
}

@supports (padding: constant(safe-area-inset-top)) {
    :root {
        --app-safe-t: constant(safe-area-inset-top);
        --app-safe-b: constant(safe-area-inset-bottom);
        --app-safe-l: constant(safe-area-inset-left);
        --app-safe-r: constant(safe-area-inset-right);
        --app-bottom-chrome: calc(var(--app-tab-h) + constant(safe-area-inset-bottom));
    }
}

@supports (padding: env(safe-area-inset-top)) {
    :root {
        --app-safe-t: env(safe-area-inset-top, 0px);
        --app-safe-b: env(safe-area-inset-bottom, 0px);
        --app-safe-l: env(safe-area-inset-left, 0px);
        --app-safe-r: env(safe-area-inset-right, 0px);
        --app-bottom-chrome: calc(var(--app-tab-h) + env(safe-area-inset-bottom, 0px));
    }
}

@media (max-width: 860px) {
    html {
        height: 100%;
        height: -webkit-fill-available;
        touch-action: manipulation;
        background: #ffffff;
    }
    html, body {
        height: 100%;
        overscroll-behavior: none;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
        background: #ffffff;
    }
    body {
        min-height: 100%;
        min-height: -webkit-fill-available;
        padding-bottom: var(--app-bottom-chrome);
    }
    a, button, summary, label,
    .app-tab, .app-grab, .map-search-fab, .search-go,
    .rsel-btn, .city-chip, .matrix-cell {
        touch-action: manipulation;
    }
    /* iOS zooms focused fields under 16px — keep readable size, no double-tap zoom */
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="image"]),
    select,
    textarea,
    .form-control,
    .filter-input,
    .rsel-type,
    .sort-select {
        font-size: 16px !important;
        line-height: 1.25;
        touch-action: manipulation;
        box-sizing: border-box !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    /* width:100% + padding overflow in flex/grid parents */
    .form-group,
    .form-row > *,
    .widget-date-col,
    .widget-guest-input,
    .widget-date-inputs,
    .mb-modal .form-group,
    .modal-body .form-group,
    .host-calc .form-group,
    .panel-card,
    .page-hero,
    .tx-tools,
    .tax-period-box {
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }
    .form-control,
    .filter-input,
    select,
    select.form-control,
    select.filter-input,
    .sort-select,
    textarea.form-control,
    .rsel,
    .rsel-btn,
    .rsel-type {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }
    .rsel {
        display: block;
    }
    .rsel-menu {
        left: 0 !important;
        right: 0 !important;
        min-width: 0 !important;
        max-width: 100%;
        width: auto;
        box-sizing: border-box;
    }
    .tax-period-box .form-control,
    .tax-period-box .rsel,
    .tx-tools .form-control,
    .tx-tools .rsel,
    .sort-selector,
    .sort-selector .rsel {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    body.is-marketplace .guest-search-dock .rsel-type,
    body.is-marketplace .guest-search-dock .rsel-btn,
    body.is-marketplace .search-pill .filter-input {
        font-size: 16px !important;
        height: 24px;
        width: auto !important;
        max-width: 100% !important;
    }
    body.is-marketplace .guest-search-dock .rsel {
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    /*
      iOS Safari: input[type=date|time|month] ignore width:100% and keep a huge
      intrinsic min-width, so the field spills out of padded parents.
    */
    .form-group:has(> input[type="date"]),
    .form-group:has(> input[type="time"]),
    .form-group:has(> input[type="datetime-local"]),
    .form-group:has(> input[type="month"]),
    .form-group:has(> input[type="week"]),
    .widget-date-col,
    label:has(> input[type="date"]),
    label:has(> input[type="time"]),
    label:has(> input[type="datetime-local"]) {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
        box-sizing: border-box;
    }
    input[type="date"],
    input[type="time"],
    input[type="datetime-local"],
    input[type="month"],
    input[type="week"] {
        display: block;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        -webkit-appearance: none;
        appearance: none;
        height: 44px;
        line-height: normal;
        padding: 10px 12px !important;
        vertical-align: middle;
    }
    input[type="date"]::-webkit-date-and-time-value,
    input[type="time"]::-webkit-date-and-time-value,
    input[type="datetime-local"]::-webkit-date-and-time-value,
    input[type="month"]::-webkit-date-and-time-value {
        text-align: left;
        min-width: 0;
        margin: 0;
        padding: 0;
        line-height: 1.25;
        vertical-align: middle;
    }
    input[type="date"]::-webkit-datetime-edit,
    input[type="time"]::-webkit-datetime-edit,
    input[type="datetime-local"]::-webkit-datetime-edit,
    input[type="month"]::-webkit-datetime-edit {
        display: inline-flex;
        align-items: center;
        min-width: 0;
        max-width: 100%;
        padding: 0;
        margin: 0;
        line-height: 1.25;
        height: 100%;
    }
    input[type="date"]::-webkit-datetime-edit-fields-wrapper,
    input[type="time"]::-webkit-datetime-edit-fields-wrapper,
    input[type="datetime-local"]::-webkit-datetime-edit-fields-wrapper,
    input[type="month"]::-webkit-datetime-edit-fields-wrapper {
        display: flex;
        align-items: center;
        padding: 0;
    }
    body.is-marketplace .search-pill input[type="date"],
    body.is-marketplace .search-pill input[type="time"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 22px !important;
        line-height: 22px !important;
        padding: 0 !important;
        border: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }
    body.is-marketplace .search-pill input[type="date"]::-webkit-datetime-edit,
    body.is-marketplace .search-pill input[type="time"]::-webkit-datetime-edit,
    body.is-marketplace .search-pill input[type="date"]::-webkit-date-and-time-value,
    body.is-marketplace .search-pill input[type="time"]::-webkit-date-and-time-value {
        line-height: 22px;
        height: 22px;
        display: flex;
        align-items: center;
    }
    .leaflet-container {
        touch-action: pan-x pan-y;
    }

    /* ---- Tab bar + more sheet ---- */
    .app-tabbar {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 5000;
        box-sizing: border-box;
        height: var(--app-bottom-chrome);
        min-height: var(--app-bottom-chrome);
        padding: 4px max(6px, var(--app-safe-r)) max(6px, var(--app-safe-b)) max(6px, var(--app-safe-l));
        background: #ffffff;
        background-clip: padding-box;
        border-top: 1px solid rgba(15, 23, 42, 0.08);
        box-shadow: none;
    }
    .app-tab {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        min-width: 0;
        border: 0;
        background: none;
        color: #94a3b8;
        text-decoration: none;
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .01em;
        cursor: pointer;
        -webkit-user-select: none;
        user-select: none;
    }
    .app-tab i { font-size: 20px; line-height: 1; }
    .app-tab.is-on { color: #0f172a; }
    .app-tab span {
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .app-sheet {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 5200;
    }
    .app-sheet.is-open { display: block; }
    .app-sheet-dim {
        position: absolute;
        inset: 0;
        background: rgba(15, 23, 42, 0.45);
    }
    .app-sheet-panel {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        max-height: min(82vh, 640px);
        overflow: auto;
        padding: 10px 16px calc(18px + var(--app-safe-b));
        background: #f8fafc;
        border-radius: 22px 22px 0 0;
        box-shadow: 0 -18px 50px rgba(15, 23, 42, 0.22);
    }
    .app-sheet-grab {
        display: block;
        width: 40px;
        height: 5px;
        margin: 4px auto 14px;
        border-radius: 99px;
        background: #cbd5e1;
    }
    .app-sheet-panel h3 {
        margin: 0 0 10px;
        font-size: 18px;
        font-weight: 800;
        letter-spacing: -.03em;
    }
    .app-sheet-list {
        display: flex;
        flex-direction: column;
        gap: 6px;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 16px;
        overflow: hidden;
    }
    .app-sheet-item {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 14px;
        color: #0f172a;
        text-decoration: none;
        font-size: 15px;
        font-weight: 650;
        border: 0;
        background: #fff;
        width: 100%;
        text-align: left;
        cursor: pointer;
        border-bottom: 1px solid #f1f5f9;
    }
    .app-sheet-item:last-child { border-bottom: 0; }
    .app-sheet-item i {
        width: 28px;
        text-align: center;
        color: #2563eb;
        font-size: 18px;
    }
    .app-sheet-item.is-danger { color: #b91c1c; }
    .app-sheet-item.is-danger i { color: #ef4444; }

    /* ---- Public chrome ---- */
    .header {
        height: 52px;
        padding: 0;
        position: sticky;
        top: 0;
        z-index: 1000;
        background: #ffffff;
        border-bottom: 1px solid #e2e8f0;
    }
    .header .container.header-container,
    .header-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        height: 52px;
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 0 14px;
        box-sizing: border-box;
    }
    .header .logo {
        flex: 0 1 auto;
        min-width: 0;
    }
    .header .nav-links {
        flex: 0 0 auto;
        display: flex;
        align-items: center;
        gap: 6px;
        margin-left: auto;
    }
    .logo-badge, .nav-links .nav-chip, .nav-links .nav-cta, .nav-links .user-menu { display: none !important; }
    body:has(.property-detail-page) .header,
    body:has(.guest-portal-page) .header,
    body:has(.bookings-page) .header { display: none; }
    .logo-text { font-size: 16px; }
    .logo-mark { width: 28px; height: 28px; }
    .footer { display: none !important; }
    .main-content {
        min-height: 0;
        width: 100%;
        max-width: 100%;
        overflow-x: clip;
    }

    body.is-marketplace {
        padding-bottom: 0;
        background: #fff;
    }
    body.is-marketplace .header { display: none; }
    body.is-marketplace .main-content {
        height: 100vh;
        height: 100dvh;
        height: 100svh;
        max-height: 100svh;
    }
    body.is-marketplace .marketplace-body {
        display: block;
        position: relative;
        height: 100%;
        flex-direction: unset;
    }
    body.is-marketplace .map-column {
        position: absolute;
        inset: 0 0 var(--app-bottom-chrome) 0;
        flex: none;
        height: auto;
        min-height: 0;
        z-index: auto;
    }
    body.is-marketplace .map-container {
        inset: 0;
        z-index: 1;
        isolation: isolate;
    }
    body.is-marketplace .guest-search-dock {
        position: absolute;
        top: max(10px, calc(8px + var(--app-safe-t)));
        left: max(12px, var(--app-safe-l));
        right: max(12px, var(--app-safe-r));
        z-index: 50;
        padding: 0;
        background: none;
        box-shadow: none;
        border-radius: 0;
        pointer-events: none;
    }
    body.is-marketplace .guest-search-dock > * {
        pointer-events: auto;
    }
    body.is-marketplace .map-search-fab {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        height: 44px;
        padding: 0 16px 0 14px;
        border: 0;
        border-radius: 999px;
        background: #fff;
        box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
        color: #0f172a;
        font-size: 14px;
        font-weight: 800;
        cursor: pointer;
    }
    body.is-marketplace .map-search-fab i { font-size: 16px; line-height: 1; }
    body.is-marketplace .guest-search-panel {
        display: none;
        margin-top: 0;
    }
    body.is-marketplace .guest-search-dock:not(.is-open) .search-pills,
    body.is-marketplace .guest-search-dock:not(.is-open) .hero-chips {
        display: none !important;
    }
    body.is-marketplace .guest-search-dock.is-open .map-search-fab {
        display: none;
    }
    body.is-marketplace .guest-search-dock.is-open .guest-search-panel {
        display: block;
    }
    body.is-marketplace .guest-search-dock.is-open .search-pills {
        display: grid;
    }
    body.is-marketplace .properties-column {
        position: absolute;
        left: 0;
        right: 0;
        bottom: var(--app-bottom-chrome);
        width: 100%;
        max-width: none;
        height: var(--app-sheet-peek);
        flex: none;
        z-index: 60;
        border-radius: 22px 22px 0 0;
        border: 0;
        box-shadow: 0 -16px 40px rgba(15, 23, 42, 0.2);
        padding-bottom: 0;
        transition: height .28s cubic-bezier(.2, .8, .2, 1);
        overflow: hidden;
        -webkit-overflow-scrolling: touch;
        background: #fff;
    }
    body.is-marketplace .properties-column:not(.is-expanded) .avail-dock,
    body.is-marketplace .properties-column:not(.is-expanded) .avail-count,
    body.is-marketplace .properties-column:not(.is-expanded) .sort-selector,
    body.is-marketplace .properties-column:not(.is-expanded) .properties-grid,
    body.is-marketplace .properties-column:not(.is-expanded) .properties-pagination {
        display: none !important;
    }
    body.is-marketplace .properties-column:not(.is-expanded) .app-grab {
        padding: 10px 16px 12px;
    }
    body.is-marketplace .properties-column:not(.is-expanded) .app-grab::after {
        content: "Смотреть квартиры";
        display: block;
        margin-top: 6px;
        font-size: 14px;
        font-weight: 800;
        letter-spacing: -.02em;
        color: #0f172a;
        line-height: 1.2;
    }
    body.is-marketplace .properties-column.is-expanded {
        height: min(92dvh, calc(100% - var(--app-bottom-chrome) - 8px - var(--app-safe-t)));
        z-index: 70;
        overflow: auto;
        padding-bottom: 8px;
    }
    body.is-marketplace .properties-column.is-expanded #listings-sheet-title {
        font-size: inherit;
        font-weight: inherit;
    }
    body.is-marketplace:has(.properties-column.is-expanded) .guest-search-dock {
        z-index: 45;
        opacity: .35;
    }
    body.is-marketplace:has(.properties-column.is-expanded) .guest-search-dock .map-search-fab,
    body.is-marketplace:has(.properties-column.is-expanded) .guest-search-dock .search-pills,
    body.is-marketplace:has(.properties-column.is-expanded) .guest-search-dock .search-go {
        pointer-events: none;
    }
    body.is-marketplace .search-pills {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0;
        background: #fff;
        border: 1px solid #e2e8f0;
        border-radius: 22px;
        box-shadow: 0 10px 32px rgba(15, 23, 42, 0.18);
        padding: 6px;
        flex-wrap: unset;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
    body.is-marketplace .map-search-fab,
    body.is-marketplace .guest-search-dock,
    body.is-marketplace .guest-search-panel {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    body.is-marketplace .search-pill-city { grid-column: 1 / -1; }
    body.is-marketplace .search-pill {
        min-width: 0;
        border-right: 0;
        padding: 8px 10px;
    }
    body.is-marketplace .search-pill span { font-size: 10px; }
    body.is-marketplace .search-go {
        grid-column: 1 / -1;
        width: 100%;
        height: 42px;
        margin: 4px 0 0;
        border-radius: 16px;
    }
    body.is-marketplace .hero-chips { display: none; }
    body.is-marketplace .search-pill {
        min-width: 0;
        overflow: hidden;
    }
    body.is-marketplace .guest-search-dock .rsel-btn,
    body.is-marketplace .guest-search-dock .rsel-type {
        height: 26px;
        padding: 0 18px 0 0;
        border: 0;
        box-shadow: none;
        font-size: 16px;
        font-weight: 800;
        background: transparent;
        border-radius: 0;
    }
    body.is-marketplace .guest-search-dock .rsel { width: auto; min-width: 0; }
    body.is-marketplace .map-hud {
        left: max(10px, var(--app-safe-l));
        right: max(10px, var(--app-safe-r));
        bottom: calc(var(--app-sheet-peek) + 8px);
        z-index: 20;
        pointer-events: none;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        max-width: none;
        width: auto;
    }
    body.is-marketplace .map-hud .map-zoom {
        flex: 0 0 auto;
        flex-direction: row;
        height: 40px;
        width: auto;
        border-radius: 14px;
    }
    body.is-marketplace .map-hud .map-zoom button + button {
        border-left: 1px solid #e2e8f0;
        border-top: 0;
    }
    /* Предложение геолокации над нижней панелью и листом списка */
    body.is-marketplace .geo-prompt {
        left: max(12px, var(--app-safe-l));
        right: max(12px, var(--app-safe-r));
        bottom: calc(var(--app-sheet-peek) + 56px);
        max-width: none;
        padding: 11px 12px;
        gap: 10px;
    }
    body.is-marketplace .geo-prompt .btn { padding: 6px 12px; font-size: 12.5px; }
    body.is-marketplace .map-hud .map-legend {
        flex: 1 1 auto;
        min-width: 0;
        height: 40px;
        min-height: 40px;
        padding: 0 12px;
        border-radius: 14px;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 12px;
        font-size: 11px;
        line-height: 1.1;
        overflow: hidden;
    }
    body.is-marketplace .map-hud .map-legend span {
        width: auto;
        flex: 0 1 auto;
        min-width: 0;
        white-space: nowrap;
    }
    body.is-marketplace .map-hud .map-zoom,
    body.is-marketplace .map-hud .map-legend { pointer-events: auto; }
    body.is-marketplace:has(.properties-column.is-expanded) .map-hud {
        opacity: 0;
        pointer-events: none;
    }
    body.is-marketplace .map-made { display: none; }
    .app-grab {
        display: block;
        width: 100%;
        border: 0;
        background: transparent;
        padding: 10px 0 4px;
        cursor: pointer;
    }
    .app-grab::before {
        content: "";
        display: block;
        width: 40px;
        height: 5px;
        margin: 0 auto;
        border-radius: 99px;
        background: #cbd5e1;
    }
    body.is-marketplace .avail-dock { padding: 12px 14px 12px; }
    body.is-marketplace .avail-count { margin-top: 0; }

    /* Property as listing detail in an app */
    .property-detail-page {
        padding: 0 0 calc(var(--app-bottom-chrome) + 84px);
        max-width: none;
        min-width: 0;
        overflow-x: clip;
    }
    .property-detail-page .detail-section.sibling-block {
        margin-bottom: 12px;
        padding-bottom: 8px;
    }
    .property-detail-page .sibling-grid {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        padding-bottom: 4px;
    }
    .property-breadcrumb {
        position: sticky;
        top: 0;
        z-index: 20;
        margin: 0;
        padding: 10px 12px;
        background: #ffffff;
        border-bottom: 1px solid #e2e8f0;
        font-size: 14px;
    }
    .property-breadcrumb .bc-desktop { display: none; }
    .property-breadcrumb .bc-mobile { display: inline; }
    .property-breadcrumb .breadcrumb-sep,
    .property-breadcrumb .breadcrumb-current { display: none; }
    .amenities-grouped { gap: 14px; padding: 0 2px; }
    .amenity-group-title { font-size: 12px; margin-bottom: 8px; }
    .amenities-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    .amenity-item {
        padding: 8px 10px;
        font-size: 13px;
        gap: 8px;
    }
    .route-links {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 6px;
        margin: 10px 0 12px;
    }
    .route-link {
        padding: 8px 4px;
        font-size: 11px;
        justify-content: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .property-detail-header {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        padding: 14px 16px 12px;
        margin: 0;
        min-width: 0;
    }
    .property-detail-header > div { min-width: 0; width: 100%; }
    .property-headline {
        font-size: 22px;
        line-height: 1.25;
        overflow-wrap: anywhere;
    }
    .property-subline {
        align-items: flex-start;
        gap: 6px 8px;
    }
    .property-subline .subline-dot { display: none; }
    .property-header-actions { width: 100%; }
    .property-header-actions .badge {
        display: inline-flex;
        align-items: flex-start;
        gap: 8px;
        width: 100%;
        white-space: normal;
        line-height: 1.35;
        font-size: 12px;
        padding: 8px 12px;
        box-sizing: border-box;
    }
    .gallery-mosaic, .gallery-grid { margin: 0; border-radius: 0; }
    .gallery-hero { height: 280px; }
    .detail-columns { display: block; padding: 0 16px; gap: 0; }
    .booking-widget { display: none; }
    .app-book-dock {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        position: fixed;
        left: 0;
        right: 0;
        bottom: var(--app-bottom-chrome);
        z-index: 40;
        padding: 10px 16px 12px;
        background: #ffffff;
        border-top: 1px solid #e2e8f0;
        box-shadow: 0 -10px 28px rgba(15, 23, 42, 0.08);
    }
    .app-book-dock strong { display: block; font-size: 18px; font-weight: 800; }
    .app-book-dock span { font-size: 12px; color: #64748b; }
    .app-book-dock .btn { height: 46px; padding: 0 18px; border-radius: 14px; font-weight: 800; }
    .spec-bar { flex-wrap: nowrap; overflow-x: auto; gap: 16px; padding: 14px; }
    .spec-item { flex: 0 0 auto; }

    /* Модалки на весь экран; tabbar прячем — иначе снизу «дыра» / меню в тёмном фоне */
    .modal-backdrop {
        position: fixed !important;
        inset: 0;
        z-index: 6000;
        align-items: flex-end;
        justify-content: center;
        padding: 0;
        padding-top: max(10px, var(--app-safe-t));
        padding-bottom: 0;
        width: 100%;
        height: 100%;
        height: 100dvh;
        max-height: 100dvh;
        overflow: hidden;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        background: rgba(15, 23, 42, 0.55);
    }
    /* jQuery .show() sets display:block and breaks flex centering */
    .modal-backdrop[style*="display: block"],
    .modal-backdrop[style*="display:block"],
    .modal-backdrop[style*="display: flex"],
    .modal-backdrop[style*="display:flex"] {
        display: flex !important;
    }
    .modal-dialog {
        width: 100%;
        max-width: none !important;
        margin: 0 !important;
        border-radius: 18px 18px 0 0;
        max-height: min(88dvh, calc(100dvh - max(10px, var(--app-safe-t)) - 8px));
        display: flex;
        flex-direction: column;
        overflow: hidden;
        box-shadow: 0 -18px 50px rgba(15, 23, 42, 0.28);
    }
    .modal-dialog > form {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        min-height: 0;
        max-height: inherit;
        overflow: hidden;
    }
    .modal-header {
        flex-shrink: 0;
        padding: 14px 16px;
    }
    .modal-body {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        padding: 14px 16px;
    }
    .modal-footer {
        flex-shrink: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        padding: 12px 16px max(14px, var(--app-safe-b));
        border-top: 1px solid #e2e8f0;
        background: #fff;
    }
    .modal-footer .btn {
        flex: 1 1 auto;
        min-width: 0;
    }
    .modal-dialog.book-sheet .modal-footer {
        padding: 8px 16px max(14px, var(--app-safe-b));
    }
    /* Compact confirm / pin dialogs stay centered cards */
    .modal-backdrop:has(.ui-dialog) {
        align-items: center;
        padding: 16px;
        padding-bottom: max(16px, var(--app-safe-b));
        overflow-y: auto;
    }
    .modal-dialog.ui-dialog {
        width: calc(100% - 24px);
        max-width: 420px !important;
        margin: auto !important;
        border-radius: 18px;
        max-height: min(80dvh, calc(100dvh - 32px - var(--app-safe-b)));
        box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.35);
    }
    body.modal-open {
        overflow: hidden;
    }
    body.modal-open .app-tabbar {
        visibility: hidden;
        pointer-events: none;
    }

    /* Guest trips / key — отступ под фиксированный tabbar */
    .bookings-page,
    .guest-portal-page {
        padding: 12px 14px calc(28px + var(--app-bottom-chrome));
        box-sizing: border-box;
    }
    body:has(.guest-portal-page),
    body:has(.bookings-page) {
        padding-bottom: 0;
    }
    .bookings-shell { gap: 12px; }
    .bookings-profile { padding: 16px; border-radius: 20px; }
    .guest-avatar { width: 52px; height: 52px; font-size: 18px; }
    .bookings-page h1 { font-size: 22px; }
    .keycard-box { border-radius: 24px; }
    .keycard-pin span { width: 40px; height: 52px; font-size: 24px; }
    .keycard-pin.is-long span { width: 32px; height: 44px; font-size: 18px; }
    .keycard-pin.is-xlong span { width: 28px; height: 40px; font-size: 16px; }
    .portal-header { padding-top: 8px; }
    .portal-grid {
        gap: 14px;
        padding-bottom: 8px;
    }
    .info-card > .info-foot:last-child {
        padding-bottom: calc(16px + 4px);
    }
    .host-page {
        width: 100%;
        max-width: 100%;
        margin: 0;
        padding: 12px 14px calc(24px + var(--app-bottom-chrome));
        box-sizing: border-box;
        overflow-x: clip;
    }
    .host-page.is-cabinet-tax {
        padding: 0 0 calc(16px + var(--app-bottom-chrome));
    }
    .host-hero {
        max-width: none;
        width: 100%;
        margin: 0 0 14px;
        padding: 0;
        box-sizing: border-box;
    }
    .host-hero h1 {
        font-size: 24px;
        overflow-wrap: anywhere;
    }
    .host-hero p {
        font-size: 14px;
    }
    .host-layout {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
        grid-template-columns: 1fr !important;
    }
    .host-board,
    .host-calc {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
        margin: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        position: static !important;
        top: auto !important;
        justify-self: stretch;
        align-self: stretch;
    }
    .host-board {
        padding: 16px;
        border-radius: 18px;
    }
    .host-calc {
        order: -1;
        padding: 16px;
        border-radius: 18px;
    }
    .host-steps {
        display: flex;
        flex-wrap: nowrap;
        gap: 8px;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 2px;
        margin-bottom: 14px;
    }
    .host-step {
        flex: 0 0 auto;
    }
    .host-nav {
        flex-wrap: wrap;
    }
    .host-nav .btn {
        flex: 1 1 auto;
        min-width: 0;
    }
    .calc-row {
        gap: 8px;
        min-width: 0;
    }
    .calc-row > span {
        min-width: 0;
        overflow-wrap: anywhere;
    }
    .calc-row b {
        min-width: 0;
        flex-shrink: 0;
    }
    .form-row {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .auth-page,
    .login-page,
    .bookings-page,
    .guest-portal-page,
    .error-shell {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        margin-left: 0;
        margin-right: 0;
    }

    /* Auth: не центрируем по вертикали — длинная карточка иначе уходит под tabbar */
    .auth-page,
    .login-page {
        align-items: stretch;
        justify-content: flex-start;
        flex: 1 0 auto;
        min-height: 0;
        padding: 20px 16px calc(28px + var(--app-bottom-chrome));
    }
    body:has(.auth-page),
    body:has(.login-page) {
        /* отступ даёт сама .auth-page, чтобы карточка не сидела под tabbar */
        padding-bottom: 0;
    }
    .auth-card {
        width: 100%;
        max-width: 100%;
        margin: 0 auto;
        padding: 24px 18px;
        box-sizing: border-box;
    }
    .demo-access-list {
        gap: 8px;
    }
    .demo-access-card {
        padding: 12px;
    }

    /* Cabinet */
    .cabinet-body { padding-bottom: 0; }
    .cabinet-wrapper { display: block; min-height: 100dvh; }
    .sidebar { display: none; }
    .cabinet-main { min-height: 100dvh; padding-bottom: var(--app-bottom-chrome); }
    .cabinet-topbar {
        position: sticky;
        top: 0;
        z-index: 30;
        padding: 10px 16px 12px;
    }
    .topbar-title h2 { font-size: 18px; }
    .topbar-meta { display: none; }
    .cabinet-content, .admin-content {
        padding: 14px 14px 24px;
        min-width: 0;
        overflow-x: visible;
        overflow-y: visible;
    }
    .panel-card.card,
    .dashboard-panels-grid .panel-card,
    .dashboard-panels-grid .card {
        overflow: visible;
    }

    .plan-banner {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        padding: 16px;
        border-radius: 20px;
        background:
            radial-gradient(120% 90% at 100% 0%, rgba(56, 189, 248, 0.28), transparent 55%),
            linear-gradient(145deg, #0b1220 0%, #111827 55%, #0f172a 100%);
        box-shadow: 0 14px 36px rgba(15, 23, 42, 0.18);
    }
    .plan-banner-glow {
        display: block;
        position: absolute;
        width: 160px;
        height: 160px;
        right: -40px;
        top: -50px;
        border-radius: 50%;
        background: radial-gradient(circle, rgba(59, 130, 246, 0.35), transparent 70%);
        pointer-events: none;
    }
    .plan-banner-main .section-kicker {
        color: #93c5fd;
        font-size: 10px;
        letter-spacing: .08em;
    }
    .plan-banner-main strong {
        font-size: 24px;
        margin-top: 2px;
    }
    .plan-banner-main p {
        margin-top: 6px;
        font-size: 13px;
        color: #cbd5e1;
        line-height: 1.4;
    }
    .plan-banner-meter { display: block; }
    .plan-banner-side {
        width: 100%;
        align-items: stretch;
        flex-direction: row;
        justify-content: space-between;
        gap: 10px;
        padding-top: 2px;
    }
    .plan-banner-side span {
        align-self: center;
        font-size: 12px;
        color: #e2e8f0;
        white-space: nowrap;
    }
    .plan-banner-side .btn {
        flex: 1 1 auto;
        min-width: 0;
        height: 42px;
        border-radius: 12px;
        font-weight: 800;
    }
    .plan-banner.is-expiring {
        background:
            radial-gradient(120% 90% at 100% 0%, rgba(251, 191, 36, 0.28), transparent 55%),
            linear-gradient(145deg, #422006 0%, #78350f 100%);
    }
    .plan-banner.is-expired {
        background:
            radial-gradient(120% 90% at 100% 0%, rgba(248, 113, 113, 0.28), transparent 55%),
            linear-gradient(145deg, #450a0a 0%, #7f1d1d 100%);
    }

    .page-hero {
        flex-direction: column;
        align-items: stretch;
        margin-bottom: 14px;
        min-width: 0;
    }
    .page-hero > div { min-width: 0; max-width: 100%; }
    .page-hero h2 { font-size: 22px; }
    .page-hero p { font-size: 13px; max-width: none; }

    .chess-toolbar {
        display: grid;
        grid-template-columns: 42px minmax(0, 1fr) 42px;
        gap: 8px;
        width: 100%;
        min-width: 0;
        align-items: center;
    }
    .chess-month {
        width: 100%;
        min-width: 0;
        grid-column: 2;
    }
    .chess-search, .chess-toolbar .chess-search {
        width: 100%;
        max-width: none;
        grid-column: 1 / -1;
    }
    .chess-toolbar .btn-primary {
        grid-column: 1 / -1;
        width: 100%;
        height: 42px;
    }
    .chess-legend {
        flex-wrap: wrap;
        gap: 8px 12px;
        font-size: 11px;
        margin-bottom: 10px;
    }
    .chess-board-wrap {
        border-radius: 14px;
        -webkit-overflow-scrolling: touch;
    }
    .matrix-table {
        font-size: 11px;
    }
    .matrix-table th,
    .matrix-table td {
        padding: 4px 2px;
    }
    .matrix-prop-col,
    .matrix-prop-title {
        min-width: 96px;
        max-width: 104px;
        width: 96px;
        padding: 6px 8px !important;
        box-sizing: border-box;
        vertical-align: middle;
    }
    .matrix-prop-col {
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .02em;
        text-transform: uppercase;
        color: #64748b;
    }
    .matrix-prop-title strong {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
        font-size: 11px;
        line-height: 1.25;
        font-weight: 700;
        letter-spacing: -.01em;
        word-break: break-word;
    }
    .matrix-prop-title span {
        display: block;
        margin-top: 2px;
        font-size: 9px;
        line-height: 1.2;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }
    .matrix-day-header {
        min-width: 26px;
        padding: 4px 1px;
    }
    .matrix-day-header small {
        font-size: 8px;
    }
    .matrix-day-header .day-num {
        font-size: 11px;
    }
    .matrix-cell {
        height: 30px;
        min-width: 26px;
        font-size: 10px;
        border-radius: 4px;
    }
    .dashboard-panels-grid {
        grid-template-columns: 1fr;
        gap: 14px;
    }
    .partner-pick { grid-template-columns: 1fr; }
    .tax-period-box, .tax-period-box .form-control, .tax-period-box .rsel { width: 100%; min-width: 0; }
    .debt-strip { flex-direction: column; align-items: stretch; }

    /* Admin */
    .admin-body { padding-bottom: 0; }
    .admin-wrapper { display: block; }
    .admin-sidebar { display: none; }
    .admin-main { min-height: 100dvh; padding-bottom: var(--app-bottom-chrome); }
    .admin-topbar {
        position: sticky;
        top: 0;
        z-index: 30;
        padding: 10px 16px 12px;
    }
    .admin-topbar-meta { display: none; }
    .admin-toolbar h2 { font-size: 20px; }
    .admin-kpis { grid-template-columns: 1fr 1fr; }

    body.app-sheet-open { overflow: hidden; }
}

@media (min-width: 861px) {
    .app-tabbar, .app-sheet, .app-book-dock, .app-grab { display: none !important; }
}