/* MERIVA · Cinematic edition. Shared presentation layer for all five layouts.
   Existing data, permissions, routes and interaction hooks remain authoritative. */
html[data-meriva-theme], html:not([data-meriva-theme]) {
    --mp-accent: #e8c879;
    --mp-accent-ink: #18140c;
    --mp-line: rgba(223, 206, 166, .15);
    --mp-glow: rgba(219, 182, 103, .12);
    --mp-panel: #15171d;
    --mp-panel-raised: #1d2028;
    --mp-ink: #f5f2eb;
    --mp-muted: #b7b8c2;
    --mp-canvas: #0c0e13;
    --mp-shadow: 0 18px 50px -26px rgba(0, 0, 0, .72);
    --mp-radius: 20px;
    --mp-ease: cubic-bezier(.2, .7, .2, 1);
}
html[data-meriva-theme="white"] {
    --mp-accent: #916319;
    --mp-accent-ink: #fff;
    --mp-line: rgba(60, 45, 22, .14);
    --mp-glow: rgba(171, 129, 54, .09);
    --mp-panel: #fffdf9;
    --mp-panel-raised: #f3f0e9;
    --mp-ink: #252831;
    --mp-muted: #636773;
    --mp-canvas: #f5f3ee;
    --mp-shadow: 0 18px 45px -26px rgba(67, 54, 32, .22);
}
html[data-meriva-theme="gray"] {
    --mp-panel: #262a31;
    --mp-panel-raised: #313640;
    --mp-canvas: #1a1e25;
    --mp-line: rgba(239, 226, 196, .18);
}
body.m-premium {
    --m-bg: var(--mp-canvas);
    --m-surface: var(--mp-panel);
    --m-surface-elevated: var(--mp-panel-raised);
    --m-surface-soft: var(--mp-panel-raised);
    --m-input-bg: var(--mp-canvas);
    --m-text: var(--mp-ink);
    --m-text-secondary: var(--mp-muted);
    --m-text-muted: var(--mp-muted);
    --m-border: var(--mp-line);
    --m-divider: var(--mp-line);
    --m-placeholder: var(--mp-muted);
    --m-gold: var(--mp-accent);
    --m-gold-soft: var(--mp-glow);
    --meriva-font-display: "Plus Jakarta Sans", system-ui, sans-serif;
    --meriva-v4-sidebar-width: 236px;
    --meriva-v4-bg: var(--mp-canvas);
    --meriva-v4-surface: var(--mp-panel);
    --meriva-v4-white: var(--mp-panel);
    --meriva-v4-sidebar: var(--mp-panel);
    --meriva-v4-text: var(--mp-ink);
    --meriva-v4-text-muted: var(--mp-muted);
    --meriva-v4-gold: var(--mp-accent);
    --meriva-text: var(--mp-ink);
    --meriva-text-muted: var(--mp-muted);
    --meriva-surface: var(--mp-panel);
    --meriva-v4-border: var(--mp-line);
    background: radial-gradient(ellipse at 80% 0%, var(--mp-glow), transparent 48rem), var(--mp-canvas);
    color: var(--mp-ink);
    font-family: "Plus Jakarta Sans", system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
}
body.m-premium :is(h1, h2, h3, .v4-context-title, .v4-hero-lines, .v4-auth-slogan) {
    font-family: var(--meriva-font-display);
    letter-spacing: -.035em;
    text-wrap: balance;
}
body.m-premium :is(h1, h2) { line-height: 1.2; }
body.m-premium :is(p, li, label, button, a) { overflow-wrap: break-word; }
body.m-premium ::selection { background: #d6b56b; color: #15120b; }
body.m-premium :is(a, button, input, select, textarea, summary):focus-visible {
    outline: 2px solid var(--mp-accent);
    outline-offset: 4px;
}
body.m-premium :is(.m-app-main, .m-app-container) { min-width: 0; }
body.m-premium .m-app-main { padding: clamp(18px, 2.7vw, 40px); }
body.m-premium .m-app-main > :is(.v4-page, .v4-explore, .v4-content, .mp-page, .m-profile-hub) {
    width: 100%; max-width: 1400px; margin-inline: auto;
}
/* Navigation: quiet chrome, clear current location, usable touch targets. */
body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar,
body.m-premium .m-app-sidebar:not(.v4-sidebar) {
    background: linear-gradient(170deg, var(--mp-panel), var(--mp-canvas)) !important;
    border-right: 1px solid var(--mp-line) !important;
}
body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar .v4-sidebar-inner { background: transparent; }
body.m-premium .v4-sidebar-header { padding-block: 16px 26px; }
body.m-premium .v4-sidebar-brand-copy { gap: 5px; }
body.m-premium .v4-sidebar-wordmark { font-size: 15px; letter-spacing: .08em; line-height: 1.15; max-width: 8.4rem; color: var(--mp-ink); }
@media (max-width: 1099.98px) {
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar:not(.show-mobile) {
        position: fixed;
        left: 0;
        top: 0;
        transform: translateX(-105%) !important;
    }

    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.show-mobile {
        transform: translateX(0) !important;
    }

    body.m-premium .m-app-sidebar.v4-sidebar .v4-sidebar-brand {
        max-width: 100%;
        min-width: 0;
        overflow: hidden;
    }

    body.m-premium .m-app-sidebar.v4-sidebar .v4-sidebar-wordmark {
        display: block;
        width: auto;
        max-width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        overflow-wrap: normal;
        word-break: keep-all;
        font-size: 12px !important;
        letter-spacing: 0.02em;
        line-height: 1.15;
    }
}
body.m-premium .v4-sidebar-tagline { color: var(--mp-muted); font-size: 9px; letter-spacing: .06em; }
body.m-premium .v4-nav-group { padding-block: 12px; border-color: var(--mp-line); }
body.m-premium :is(.v4-nav-link, .m-nav-item) {
    position: relative; min-height: 46px; margin-block: 3px; border-radius: 12px;
    color: var(--mp-muted) !important; font-weight: 600;
    transition: background 180ms, color 180ms, box-shadow 180ms;
}
body.m-premium :is(.v4-nav-link.is-active, .m-nav-item.active, .m-nav-item.is-active) {
    color: var(--mp-accent) !important;
    background: linear-gradient(100deg, var(--mp-glow), transparent) !important;
    box-shadow: inset 3px 0 var(--mp-accent);
}
body.m-premium :is(.v4-nav-link, .m-nav-item):hover { background: var(--mp-glow) !important; color: var(--mp-ink) !important; }
body.m-premium.m-ui-v4 .v4-context,
body.m-premium .v4-pub-top {
    background: color-mix(in srgb, var(--mp-canvas) 88%, transparent);
    border-bottom: 1px solid var(--mp-line); backdrop-filter: blur(18px);
    padding-inline: clamp(16px, 2.7vw, 40px);
}
body.m-premium .v4-context-title { font-size: clamp(19px, 1.8vw, 25px); font-weight: 750; }
body.m-premium .v4-context-lead { color: var(--mp-muted); font-size: 12px; margin-top: 5px; }
body.m-premium :is(.v4-city-chip, .v4-icon-btn, .v4-user-trigger) {
    background: var(--mp-panel); border: 1px solid var(--mp-line); box-shadow: none;
}
body.m-premium .v4-pub-join { background: var(--mp-glow); border-radius: 16px; padding: 16px !important; max-width: 100% !important; color: var(--mp-ink); }
body.m-premium .v4-pub-join :is(p, strong) { color: var(--mp-ink); }
body.m-premium .v4-pub-join p { white-space: normal; }
body.m-premium :is(.dropdown-menu, .v4-user-panel, .m-plus-sheet, .modal-content, .m-dialog-card) {
    background: var(--mp-panel); color: var(--mp-ink); border: 1px solid var(--mp-line);
    border-radius: 20px; box-shadow: var(--mp-shadow);
}
body.m-premium .dropdown-item { color: var(--mp-ink); border-radius: 8px; }
body.m-premium .dropdown-item:hover { background: var(--mp-glow); }
body.m-premium .v4-dock { background: color-mix(in srgb, var(--mp-panel) 94%, transparent); backdrop-filter: blur(18px); border-top-color: var(--mp-line); }
/* One family of tactile controls across member, public and staff screens. */
body.m-premium :is(.m-btn, .btn) {
    min-height: 44px; border-radius: 12px; font-weight: 650; letter-spacing: -.01em;
    padding: 11px 18px; line-height: 1.35;
    transition: background 180ms, border-color 180ms, box-shadow 180ms, transform 180ms var(--mp-ease);
}
body.m-premium :is(.m-btn-gold, .m-btn-primary, .btn-primary, .btn-warning) {
    background: linear-gradient(115deg, #f0d898, #d9b66b) !important;
    color: #201a0d !important; border: 1px solid #efce86 !important;
    box-shadow: inset 0 1px rgba(255,255,255,.5), 0 5px 16px -9px #e2be70;
}
body.m-premium :is(.m-btn-gold, .m-btn-primary, .btn-primary, .btn-warning):hover:not(:disabled) {
    background: linear-gradient(115deg, #f7e6bb, #e7c680) !important;
    box-shadow: 0 8px 24px -10px #d7b15e; transform: translateY(-1px);
}
body.m-premium :is(.m-btn-secondary, .m-btn-ghost, .btn-secondary, .m-btn-outline-gold) {
    background: var(--mp-panel-raised); color: var(--mp-ink); border: 1px solid var(--mp-line);
}
body.m-premium :is(.m-btn, .btn):active:not(:disabled) { transform: translateY(1px); }
body.m-premium :is(.m-btn, .btn):disabled { opacity: .45; transform: none; box-shadow: none; cursor: not-allowed; }
body.m-premium :is(.m-btn-icon, .v4-icon-btn) { padding: 10px; min-width: 44px; }
body.m-premium :is(.m-input, .m-select, .m-textarea, .form-control, .form-select) {
    border: 1px solid var(--mp-line); border-radius: 12px; min-height: 46px;
    background-color: var(--mp-canvas); color: var(--mp-ink); box-shadow: inset 0 1px 2px rgba(0,0,0,.08);
    padding: 12px 14px; transition: border-color 160ms, box-shadow 160ms;
}
body.m-premium :is(.m-input, .m-select, .m-textarea, .form-control, .form-select):focus {
    border-color: var(--mp-accent); box-shadow: 0 0 0 3px var(--mp-glow);
    background-color: var(--mp-panel); color: var(--mp-ink);
}
body.m-premium :is(input, textarea)::placeholder { color: var(--mp-muted); opacity: .85; }
body.m-premium :is(.field-validation-error, .invalid-feedback) { color: #e89191; }
body.m-premium .v4-content-filters {
    padding: 18px; gap: 12px; border: 1px solid var(--mp-line); border-radius: 18px;
    background: var(--mp-panel); margin-bottom: 26px;
}
/* Shared surfaces. Rounded text containers deliberately retain visible overflow. */
body.m-premium :is(.m-card, .card, .v4-profile-card, .v4-content-panel, .v4-composer-card,
 .v4-comments, .v4-post, .v4-market-card, .v4-mission, .v4-event, .v4-biz,
 .mp-wallet, .mp-section, .mp-card, .m-profile-hub__stat, .m-profile-hub__hero,
 .m-profile-hub__aside-card, .m-profile-edit__card) {
    background: linear-gradient(150deg, var(--mp-panel-raised), var(--mp-panel) 65%);
    color: var(--mp-ink); border: 1px solid var(--mp-line); border-radius: var(--mp-radius);
    box-shadow: var(--mp-shadow);
}
body.m-premium :is(.v4-profile-card, .v4-content-panel, .v4-composer-card, .v4-comments) { padding: clamp(18px, 2.2vw, 30px); }
body.m-premium :is(.v4-market-body, .v4-post-body) { padding: 20px; }
body.m-premium .v4-biz { overflow: hidden; }
body.m-premium .v4-biz-copy { padding: 20px; }
body.m-premium .v4-esnaf-head { gap: 24px; padding-block: 10px; }
body.m-premium .v4-esnaf-logo { border: 1px solid var(--mp-line); border-radius: 20px; box-shadow: 0 8px 30px var(--mp-glow); }
body.m-premium :is(.v4-market-media, .v4-biz-media) { border-radius: 19px 19px 0 0; overflow: hidden; }
body.m-premium :is(.v4-market-media, .v4-biz-media) img { transition: transform 450ms var(--mp-ease); }
body.m-premium :is(.v4-sec-nav, .m-profile-hub__tabs) { gap: 8px; padding-block: 8px 18px; border-bottom-color: var(--mp-line); }
body.m-premium :is(.v4-pill, .m-profile-hub__tab) { padding: 11px 17px; border-radius: 11px; min-height: 44px; }
body.m-premium .v4-pill.is-on { background: var(--mp-glow); color: var(--mp-accent); border-color: var(--mp-line); }
body.m-premium :is(.v4-section-head, .m-section-header) { margin-bottom: 20px; gap: 16px; }
body.m-premium :is(.v4-section-head h2, .m-section-title) { font-size: clamp(20px, 2.2vw, 28px); font-weight: 700; }
body.m-premium .v4-section-head::after { content: ""; height: 1px; background: linear-gradient(90deg, var(--mp-line), transparent); flex: 1; order: 1; min-width: 15px; }
body.m-premium .v4-section-head > a { order: 2; }
body.m-premium .v4-empty,
body.m-premium .m-profile-hub__empty {
    padding: clamp(28px, 5vw, 64px) 24px; border: 1px dashed var(--mp-line); border-radius: 22px;
    background: radial-gradient(ellipse at 50% 0, var(--mp-glow), transparent 70%), var(--mp-panel);
    color: var(--mp-muted); text-align: center;
}
body.m-premium :is(.v4-board-row, .v4-ledger-item) { border-radius: 14px; border-color: var(--mp-line); background: var(--mp-panel); padding: 16px; }
body.m-premium :is(.table, .m-table) { --bs-table-bg: transparent; --bs-table-color: var(--mp-ink); --bs-table-border-color: var(--mp-line); }
body.m-premium :is(.table, .m-table) th { padding-block: 16px; color: var(--mp-muted); font-size: 12px; letter-spacing: .04em; }
body.m-premium :is(.table, .m-table) td { padding-block: 16px; vertical-align: middle; }
body.m-premium .alert { border-radius: 14px; }
body.m-premium.m-role-panel :is(.m-hero-card-dark, .m-admin-quick-card, .m-stat-card, .m-panel-card) {
    background: radial-gradient(ellipse at 100% 0, var(--mp-glow), transparent 70%), var(--mp-panel);
    border: 1px solid var(--mp-line); border-radius: 22px; box-shadow: var(--mp-shadow);
}
body.m-premium.m-role-panel .m-panel-actions {
    flex: 0 1 100%; width: 100%; align-content: start; grid-auto-rows: auto; margin-top: 22px;
}
body.m-premium.m-role-panel .m-app-container {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    max-width: 100%;
}
body.m-premium.m-role-panel .m-panel-actions > .m-btn { align-self: start; min-height: 48px; max-width: 100%; min-width: 0; }
@media (max-width: 767.98px) {
    body.m-premium.m-role-panel .m-app-main .row {
        margin-left: 0;
        margin-right: 0;
        max-width: 100%;
    }
    body.m-premium.m-role-panel .m-hero-card-dark .m-panel-actions {
        grid-template-columns: minmax(0, 1fr);
    }
}
body.m-premium.m-role-panel .m-esnaf-hero .m-panel-actions { flex: 1 1 100%; width: 100%; margin-top: 8px; }
@media (min-width: 992px) {
    body.m-premium.m-role-panel .m-app-sidebar .m-sidebar-brand > div,
    body.m-premium.m-role-panel .m-app-sidebar .m-nav-group-heading,
    body.m-premium.m-role-panel .m-app-sidebar .m-sidebar-user-card .fw-bold,
    body.m-premium.m-role-panel .m-app-sidebar .m-sidebar-user-card .text-secondary,
    body.m-premium.m-role-panel .m-app-sidebar .m-sidebar-user-card .bi-chevron-right,
    body.m-premium.m-role-panel .m-app-sidebar .m-sidebar-footer form {
        opacity: 1 !important; width: auto !important; height: auto !important; pointer-events: auto !important;
    }
    body.m-premium.m-role-panel .m-app-sidebar .m-sidebar-brand { justify-content: flex-start !important; gap: 12px !important; }
    body.m-premium.m-role-panel .m-app-sidebar .m-nav-item { justify-content: flex-start !important; padding: 12px !important; }
    body.m-premium.m-role-panel .m-app-sidebar .m-nav-item span { font-size: 12px !important; gap: 10px !important; }
    body.m-premium.m-role-panel .m-app-sidebar .m-nav-group-heading { padding: 16px 12px 8px !important; }
}
/* Discovery stage: existing copy and interactive map become the centerpiece. */
body.m-premium.m-ui-v4 .v4-explore { display: grid; gap: clamp(28px, 3.3vw, 48px); }
body.m-premium.m-ui-v4 .v4-explore-hero {
    position: relative; isolation: isolate; display: grid; grid-template-columns: 1.05fr 1fr;
    gap: 24px; align-items: center; min-height: 430px; padding: clamp(24px, 3.4vw, 54px);
    border: 1px solid var(--mp-line); border-radius: 28px; overflow: hidden;
    background: radial-gradient(ellipse at 85% 60%, rgba(194,146,56,.2), transparent 52%),
      radial-gradient(ellipse at 10% 0%, rgba(126,141,174,.1), transparent 60%), #101319;
    box-shadow: 0 22px 65px -35px #000;
}
body.m-premium .v4-explore-hero::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background-image: linear-gradient(rgba(237,218,175,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(237,218,175,.035) 1px, transparent 1px);
    background-size: 64px 64px; mask-image: linear-gradient(90deg, transparent, #000);
}
body.m-premium .v4-explore-hero::after {
    content: ""; position: absolute; inset: auto -15% -110% 32%; aspect-ratio: 1;
    border: 1px solid rgba(232,200,121,.16); border-radius: 50%; box-shadow: 0 0 0 65px rgba(232,200,121,.03), 0 0 0 130px rgba(232,200,121,.02);
    pointer-events: none; z-index: -1;
}
body.m-premium.m-ui-v4 .v4-hero-copy { min-width: 0; padding: 0; gap: 0; }
body.m-premium.m-ui-v4 .v4-hero-lines {
    font-size: clamp(26px, 3.2vw, 54px); line-height: 1.13; font-weight: 800;
    letter-spacing: -.055em; color: #f7f2e9; margin-bottom: 28px;
}
body.m-premium.m-ui-v4 .v4-hero-lines span { display: block; padding-block: 2px; }
body.m-premium.m-ui-v4 .v4-hero-lines span:last-child { color: #e8c879; }
body.m-premium.m-ui-v4 .v4-hero-verbs { color: #d1cec7; gap: 22px; margin-bottom: 30px; font-size: 13px; }
body.m-premium.m-ui-v4 .v4-hero-verbs li { color: #d1cec7 !important; }
body.m-premium.m-ui-v4 .v4-hero-verbs svg { color: #e8c879; }
body.m-premium.m-ui-v4 .v4-hero-search { gap: 8px; max-width: 440px; }
body.m-premium.m-ui-v4 .v4-hero-search .m-input { background: rgba(0,0,0,.25) !important; border-color: rgba(232,200,121,.22) !important; color: #fff !important; min-width: 0; }
body.m-premium.m-ui-v4 .v4-hero-search .m-input::placeholder { color: #b9b6b0; }
body.m-premium.m-ui-v4 .v4-hero-map { min-width: 0; width: 100%; background: transparent; border: 0; box-shadow: none; }
body.m-premium.m-ui-v4 .v4-hero-map .m-tr-map { filter: drop-shadow(0 18px 22px rgba(0,0,0,.45)); }
body.m-premium.m-ui-v4 .v4-actions { gap: 12px; }
body.m-premium.m-ui-v4 .v4-action {
    background: var(--mp-panel); border: 1px solid var(--mp-line); border-radius: 16px;
    padding: 20px; min-height: 100px; box-shadow: var(--mp-shadow);
}
body.m-premium.m-ui-v4 .v4-action-icon { padding: 11px; width: 44px; height: 44px; border: 1px solid var(--mp-line); border-radius: 13px; background: var(--mp-glow); color: var(--mp-accent); }
body.m-premium.m-ui-v4 .v4-navcards { gap: 12px; }
body.m-premium.m-ui-v4 .v4-navcard {
    padding: 22px 18px; border: 1px solid var(--mp-line); border-radius: 16px;
    background: linear-gradient(135deg, var(--mp-panel-raised), var(--mp-panel)); min-height: 120px;
}
body.m-premium.m-ui-v4 .v4-navcard > .v4-icon { color: var(--mp-accent); width: 25px; height: 25px; margin-bottom: 12px; }
body.m-premium :is(.v4-daily, .v4-today, .v4-safety, .v4-mp-hero, .mp-hero, .m-profile-hub__hero) {
    border: 1px solid var(--mp-line); border-radius: 24px;
    background: radial-gradient(ellipse at 100% 0, var(--mp-glow), transparent 60%), var(--mp-panel);
    padding: clamp(22px, 3vw, 40px);
}
body.m-premium .m-profile-hub__avatar { border: 3px solid var(--mp-panel); box-shadow: 0 0 0 1px var(--mp-accent), 0 8px 30px var(--mp-glow); }
body.m-premium .m-site-footer { border-top: 1px solid var(--mp-line); padding-top: 36px; }
body.m-premium :is(.m-site-footer-bar, .v4-pub-foot) { color: var(--mp-muted); border-color: var(--mp-line); }
body.m-premium.m-auth-page .v4-auth-brand {
    background: radial-gradient(ellipse at 0 10%, #65533260, transparent 65%), linear-gradient(150deg, #1a202d, #0c0e13);
}
body.m-premium.m-auth-page .v4-auth-card { background: var(--mp-panel); border: 1px solid var(--mp-line); border-radius: 24px; padding: 32px; box-shadow: var(--mp-shadow); }
/* Chat: a luminous lounge, with existing live transport and moderation intact. */
body.m-premium.m-ui-v4 .v4-chat .m-chat-wrapper {
    --mx-chat-line: var(--mp-line); --mx-chat-panel: var(--mp-panel);
    background: var(--mp-canvas); color: var(--mp-ink);
}
body.m-premium.m-ui-v4 .v4-chat :is(.m-chat-sidebar, .m-chat-aside) {
    background: linear-gradient(175deg, var(--mp-panel-raised), var(--mp-panel) 45%); border-color: var(--mp-line);
}
body.m-premium.m-ui-v4 .v4-chat :is(.m-chat-sidebar-head, .m-chat-aside-head) { background: transparent; border-color: var(--mp-line); padding: 22px 18px 16px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-sidebar-title { color: var(--mp-ink); font-size: 22px; font-weight: 750; letter-spacing: -.04em; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-sidebar-title { text-transform: none; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-sidebar { position: relative; }
.mp-chat-aurora { position: relative; height: 65px; flex: 0 0 65px; overflow: hidden; border-bottom: 1px solid var(--mp-line); background: #101319; }
.mp-chat-aurora span { position: absolute; width: 150px; height: 150px; border-radius: 50%; filter: blur(27px); opacity: .5; top: -100px; left: -20px; background: #d6ae5d; }
.mp-chat-aurora span:nth-child(2) { left: 35%; top: -95px; background: #717baa; }
.mp-chat-aurora span:nth-child(3) { left: 65%; top: -70px; background: #7b6744; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-room-list { padding: 8px 12px 20px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-section-label { color: var(--mp-muted); font-size: 10px; letter-spacing: .13em; padding: 14px 7px 8px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-room { padding: 14px 12px; margin-block: 5px; border: 1px solid transparent; border-radius: 15px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-room.is-active {
    background: linear-gradient(105deg, var(--mp-glow), transparent); border-color: var(--mp-line);
    box-shadow: inset 3px 0 var(--mp-accent), 0 8px 20px -16px #000;
}
body.m-premium.m-ui-v4 .v4-chat :is(.m-chat-room-ico, .m-chat-avatar, .mp-chat-emblem) {
    display: grid; place-items: center; flex-shrink: 0;
    background: linear-gradient(140deg, var(--mp-glow), var(--mp-panel-raised));
    color: var(--mp-accent); border: 1px solid var(--mp-line); border-radius: 14px;
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-room-ico { width: 42px; height: 42px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-room-ico { min-width: 42px; }
body.m-premium.m-ui-v4 .v4-chat .mp-chat-emblem { width: 46px; height: 46px; font-size: 22px; font-weight: 700; box-shadow: 0 0 25px var(--mp-glow); }
body.m-premium.m-ui-v4 .v4-chat .m-chat-main {
    background: radial-gradient(ellipse at 100% 0, var(--mp-glow), transparent 45%),
      radial-gradient(ellipse at 0 100%, rgba(113,123,170,.08), transparent 55%), var(--mp-canvas);
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-header {
    padding: 20px 24px; gap: 14px; background: color-mix(in srgb, var(--mp-panel) 88%, transparent);
    border-bottom: 1px solid var(--mp-line); backdrop-filter: blur(14px);
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-header-title { font-size: 23px; font-weight: 750; letter-spacing: -.035em; color: var(--mp-ink); }
body.m-premium.m-ui-v4 .v4-chat .mx-chat-kicker { color: var(--mp-accent); letter-spacing: .15em; font-size: 9px; margin-bottom: 5px; }
body.m-premium.m-ui-v4 .v4-chat :is(.m-chat-header-sub, .m-chat-muted, .m-chat-aside-copy, .m-chat-aside-meta, .m-chat-time) { color: var(--mp-muted); }
body.m-premium.m-ui-v4 .v4-chat :is(.m-chat-room-name, .m-chat-name, .m-chat-member-name, .m-chat-aside-name, .m-chat-bubble-text, .m-chat-empty) { color: var(--mp-ink); }
body.m-premium.m-ui-v4 .v4-chat .m-chat-feed { padding: 28px; gap: 18px; background: transparent; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-row { padding: 2px 0; gap: 12px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-bubble,
body.m-premium.m-ui-v4 .v4-chat .m-chat-bubble:not(.is-mine) {
    background: linear-gradient(140deg, var(--mp-panel-raised), var(--mp-panel)) !important;
    border: 1px solid var(--mp-line) !important; border-radius: 4px 20px 20px 20px !important;
    padding: 14px 18px; color: var(--mp-ink) !important; box-shadow: 0 8px 24px -18px #000 !important;
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-row.is-mine .m-chat-bubble,
body.m-premium.m-ui-v4 .v4-chat .m-chat-bubble.is-mine {
    background: linear-gradient(130deg, var(--mp-glow), var(--mp-panel)) !important;
    border-color: color-mix(in srgb, var(--mp-accent) 30%, transparent) !important;
    border-radius: 20px 4px 20px 20px !important;
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-bubble-text { font-size: 14px; line-height: 1.8; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-bubble { min-height: 0; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-meta { gap: 10px; margin-bottom: 7px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-time { font-size: 10px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-composer { background: transparent; padding: 16px 24px 20px; border-top: 1px solid var(--mp-line); }
body.m-premium.m-ui-v4 .v4-chat .m-chat-composer-row { gap: 10px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-composer textarea {
    background: var(--mp-panel); color: var(--mp-ink); border: 1px solid var(--mp-line);
    border-radius: 16px; padding: 16px; min-height: 54px; box-shadow: 0 4px 20px -16px #000;
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-composer textarea:focus { border-color: var(--mp-accent); box-shadow: 0 0 0 3px var(--mp-glow); }
body.m-premium.m-ui-v4 .v4-chat .m-chat-send { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 54px; border-radius: 16px; }
body.m-premium.m-ui-v4 .v4-chat :is(.m-chat-attach, .m-chat-member-mod-select) { color: var(--mp-ink); border: 1px solid var(--mp-line); background: var(--mp-panel); border-radius: 10px; min-height: 44px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-pin { background: var(--mp-glow); border: 1px solid var(--mp-line); border-radius: 12px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-pin-text { color: var(--mp-ink); }
body.m-premium.m-ui-v4 .v4-chat .m-chat-search input { background: var(--mp-canvas); color: var(--mp-ink); border-color: var(--mp-line); border-radius: 12px; min-height: 44px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-aside-body { padding: 20px; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-aside-name { font-size: 23px; line-height: 1.3; letter-spacing: -.04em; padding-bottom: 14px; border-bottom: 1px solid var(--mp-line); }
body.m-premium.m-ui-v4 .v4-chat .m-chat-member-row { padding: 12px 0; border-color: var(--mp-line); }
body.m-premium.m-ui-v4 .v4-chat .m-chat-empty { border: 1px dashed var(--mp-line); border-radius: 20px; background: var(--mp-glow); padding: 32px 22px; margin: 16px 0; }
/* Motion is finite and decorative; no content is hidden while JavaScript loads. */
@keyframes mp-arrive { from { opacity: .45; transform: translateY(9px); } to { opacity: 1; transform: none; } }
@keyframes mp-light { from { transform: translateX(-20px); opacity: .25; } to { transform: translateX(20px); opacity: .6; } }
@media (prefers-reduced-motion: no-preference) {
    body.m-premium .v4-explore-hero, body.m-premium .mp-hero { animation: mp-arrive 550ms var(--mp-ease) both; }
    body.m-premium .mp-chat-aurora span { animation: mp-light 2s ease-in-out 2 alternate; }
    body.m-premium .m-chat-row.mp-message-arrive { animation: mp-arrive 260ms var(--mp-ease); }
}
@media (hover: hover) {
    body.m-premium :is(.v4-navcard, .v4-action, .v4-market-card, .v4-biz) { transition: transform 220ms var(--mp-ease), border-color 220ms, box-shadow 220ms; }
    body.m-premium :is(a.v4-navcard, a.v4-action, a.v4-market-card, a.v4-biz):hover { transform: translateY(-3px); border-color: var(--mp-accent); box-shadow: var(--mp-shadow); }
    body.m-premium :is(.v4-market-card, .v4-biz):hover img { transform: scale(1.025); }
}
@media (min-width: 1400px) {
    body.m-premium.m-ui-v4 .v4-chat .m-chat-wrapper { grid-template-columns: 280px minmax(0,1fr) 270px; }
}
@media (max-width: 1199px) {
    body.m-premium.m-ui-v4 .v4-explore-hero { grid-template-columns: 1fr; gap: 10px; }
    body.m-premium.m-ui-v4 .v4-hero-map { max-width: 620px; margin-inline: auto; }
    body.m-premium.m-ui-v4 .v4-hero-lines { font-size: clamp(28px, 4.8vw, 48px); }
}
@media (max-width: 767px) {
    body.m-premium .m-app-main { padding: 16px; }
    body.m-premium.m-ui-v4 .v4-explore-hero { border-radius: 22px; padding: 26px 20px 16px; min-height: 0; gap: 20px; }
    body.m-premium.m-ui-v4 .v4-hero-lines { font-size: clamp(23px, 6.8vw, 42px); line-height: 1.17; margin-bottom: 22px; letter-spacing: -.055em; }
    body.m-premium.m-ui-v4 .v4-hero-verbs { gap: 18px; font-size: 12px; margin-bottom: 22px; }
    body.m-premium.m-ui-v4 .v4-action { padding: 16px; min-height: 96px; }
    body.m-premium.m-ui-v4 .v4-navcard { padding: 18px 16px; min-height: 105px; }
    body.m-premium .v4-section-head::after { display: none; }
    body.m-premium .v4-content-filters { padding: 14px; }
    body.m-premium :is(.m-input, .m-select, .m-textarea, .form-control, .form-select) { font-size: 16px; }
    body.m-premium.m-ui-v4 .v4-chat .m-chat-header { padding: 12px; gap: 10px; }
    body.m-premium.m-chat-immersive .v4-context { flex-wrap: nowrap; gap: 8px; }
    body.m-premium.m-chat-immersive .v4-context-actions { flex: 0 0 auto; width: auto; gap: 6px; }
    body.m-premium.m-chat-immersive .v4-context .v4-city-chip { display: none; }
    body.m-premium.m-ui-v4 .v4-chat .m-chat-header-title { font-size: 18px; }
    body.m-premium.m-ui-v4 .v4-chat .mp-chat-emblem { width: 36px; height: 36px; border-radius: 12px; font-size: 17px; }
    body.m-premium.m-ui-v4 .v4-chat .m-chat-feed { padding: 16px 12px; gap: 14px; }
    body.m-premium.m-ui-v4 .v4-chat .m-chat-bubble { padding: 12px 14px; }
    body.m-premium.m-ui-v4 .v4-chat .m-chat-composer { padding: 10px 12px 14px; }
    body.m-premium.m-ui-v4 .v4-chat .m-chat-composer textarea { padding: 12px; min-height: 48px; font-size: 16px; }
    body.m-premium.m-ui-v4 .v4-chat .m-chat-send { min-height: 48px; min-width: 48px; padding: 12px; }
    body.m-premium.m-ui-v4 .v4-chat .m-chat-send span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); }
    body.m-premium.m-auth-page .v4-auth-card { padding: 24px; }
}
@media (max-width: 359px) {
    body.m-premium.m-ui-v4 .v4-chat .mp-chat-emblem { display: none; }
    body.m-premium.m-ui-v4 .v4-hero-verbs { gap: 10px; font-size: 11px; }
    body.m-premium .m-btn { padding-inline: 12px; }
}
/* Cinematic depth: a contained light stage, never an overlay over controls. */
body.m-premium .v4-register-business-choice {
    margin-block: 12px 24px; padding: 18px; border: 1px solid var(--mp-line); border-radius: 16px;
    background: linear-gradient(120deg, var(--mp-glow), var(--mp-panel));
}
body.m-premium .v4-register-business-choice:has(input:checked) { border-color: var(--mp-accent); }
body.m-premium .v4-register-business-choice .v4-check { min-height: 44px; align-items: center; font-weight: 700; gap: 12px; }
body.m-premium .v4-register-business-choice input { width: 20px; height: 20px; flex-shrink: 0; accent-color: var(--mp-accent); }
body.m-premium .v4-register-business-choice p { margin: 8px 0 0; }
body.m-premium.m-ui-v4 .v4-chat .m-chat-header {
    position: relative; isolation: isolate; overflow: hidden;
    background: linear-gradient(110deg, var(--mp-panel-raised), var(--mp-panel) 58%);
    box-shadow: 0 10px 32px -24px #000;
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-header::before {
    content: ""; position: absolute; z-index: -1; pointer-events: none;
    width: 65%; height: 220px; right: -10%; top: -120px; border-radius: 50%;
    background: radial-gradient(ellipse, rgba(215,174,86,.27), rgba(116,131,184,.12) 45%, transparent 70%);
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-header::after {
    content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 1px; pointer-events: none;
    background: linear-gradient(90deg, transparent, var(--mp-accent), transparent); opacity: .65;
}
body.m-premium.m-ui-v4 .v4-chat .mp-chat-emblem {
    background: linear-gradient(140deg, #e9d197, #a47c36); color: #211a0b;
    border: 1px solid #efd799; box-shadow: inset 0 1px 1px #fff8, 0 0 30px var(--mp-glow);
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-main {
    background: radial-gradient(ellipse at 95% 15%, var(--mp-glow), transparent 48%),
        radial-gradient(ellipse at 5% 90%, rgba(112,133,190,.1), transparent 50%), var(--mp-canvas);
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-composer {
    background: linear-gradient(0deg, var(--mp-panel), transparent);
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-composer textarea {
    box-shadow: inset 0 1px 0 var(--mp-line), 0 8px 26px -20px #000;
}
body.m-premium.m-ui-v4 .v4-chat .m-chat-row.is-mine .m-chat-bubble,
body.m-premium.m-ui-v4 .v4-chat .m-chat-bubble.is-mine {
    background: linear-gradient(135deg, color-mix(in srgb, var(--mp-accent) 19%, var(--mp-panel)), var(--mp-panel)) !important;
    box-shadow: inset 0 1px 0 var(--mp-line), 0 10px 26px -22px #000 !important;
}
body.m-premium.m-ui-v4 :is(.v4-action, .v4-navcard) {
    background: radial-gradient(ellipse at 0 0, var(--mp-glow), transparent 68%),
        linear-gradient(145deg, var(--mp-panel-raised), var(--mp-panel));
    box-shadow: inset 0 1px 0 var(--mp-line), var(--mp-shadow);
}
body.m-premium :is(.v4-section-head, .m-section-header) h2 { border-left: 3px solid var(--mp-accent); padding-left: 12px; }
body.m-premium :is(.m-btn-gold, .m-btn-primary, .btn-primary, .btn-warning) {
    background: linear-gradient(115deg, #f4dfab, #dfbb70 52%, #f4dfab) !important;
    background-size: 200% 100%;
    transition: background-position 450ms, box-shadow 220ms, transform 220ms;
}
@media (hover: hover) {
    body.m-premium :is(.m-btn-gold, .m-btn-primary, .btn-primary, .btn-warning):hover:not(:disabled) {
        background-position: 100% 0 !important; box-shadow: 0 8px 28px -9px #d7b15e;
    }
    body.m-premium.m-ui-v4 :is(.v4-action, .v4-navcard):is(:hover, :focus-within) {
        border-color: var(--mp-accent); box-shadow: inset 0 1px 0 var(--mp-line), 0 16px 38px -22px var(--mp-accent);
    }
}
@keyframes mp-ambient { from { transform: translate3d(-12%,0,0); opacity: .55; } to { transform: translate3d(5%,12px,0); opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
    body.m-premium.m-ui-v4 .v4-chat .m-chat-header::before { animation: mp-ambient 9s ease-in-out infinite alternate; }
    body.m-premium .mp-chat-aurora span { animation: mp-ambient 10s ease-in-out infinite alternate; }
    body.m-premium .mp-chat-aurora span:nth-child(2) { animation-delay: -4s; }
    body.m-premium .mp-chat-aurora span:nth-child(3) { animation-delay: -7s; }
}
@media (prefers-reduced-motion: reduce) {
    body.m-premium *, body.m-premium *::before, body.m-premium *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

@media (min-width: 1100px) {
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned {
        position: sticky;
        top: 0;
        flex: 0 0 var(--meriva-v4-sidebar-width);
        width: var(--meriva-v4-sidebar-width);
        min-width: var(--meriva-v4-sidebar-width);
        max-width: var(--meriva-v4-sidebar-width);
        align-self: flex-start;
        height: 100dvh;
    }

    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned .v4-sidebar-inner,
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned:hover .v4-sidebar-inner,
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned:focus-within .v4-sidebar-inner,
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned.is-hover-open .v4-sidebar-inner {
        width: var(--meriva-v4-sidebar-width);
        height: 100dvh;
        overflow-x: hidden;
        overflow-y: auto;
        box-shadow: none;
    }

    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned .v4-nav-label,
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned .v4-sidebar-brand-copy,
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned .v4-sidebar-foot-copy,
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned .v4-pub-join,
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned .v4-theme-switch,
    body.m-premium.m-ui-v4 .m-app-sidebar.v4-sidebar.is-pinned .v4-sidebar-footer legend {
        opacity: 1;
        max-width: 12rem;
        transform: none;
        pointer-events: auto;
    }
}

.v4-city-picker { position: relative; max-width: 100%; }
.v4-city-picker > summary { list-style: none; cursor: pointer; }
.v4-city-picker > summary::-webkit-details-marker { display: none; }
.v4-city-picker:not([open]) > .v4-city-panel { display: none !important; }
.v4-city-picker[open] > .v4-city-panel {
    display: flex;
    flex-direction: column;
    position: fixed;
    z-index: 40;
    left: 0.5rem;
    right: 0.5rem;
    bottom: 4.75rem;
    top: auto;
    width: auto;
    max-width: calc(100vw - 1rem);
    max-height: min(22rem, calc(100vh - 9.5rem));
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
    padding: 0.6rem;
    border-radius: 14px;
    background: #060608;
    border: 1px solid rgba(212, 175, 55, 0.35);
}
@media (min-width: 768px) {
    .v4-city-picker[open] > .v4-city-panel {
        position: absolute;
        left: auto;
        right: 0;
        bottom: auto;
        top: calc(100% + 0.4rem);
        width: min(18rem, calc(100vw - 1rem));
        max-height: 22rem;
    }
}
.v4-city-picker .v4-city-panel .m-input {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}
.v4-city-list { display: grid; gap: 0.2rem; margin-top: 0.45rem; min-width: 0; }
.v4-city-option {
    display: flex;
    gap: 0.55rem;
    align-items: center;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    text-align: left;
    border: 0;
    border-radius: 8px;
    padding: 0.4rem 0.5rem;
    background: transparent;
    color: #f7f3ec;
    overflow: hidden;
}
.v4-city-option.is-current,
.v4-city-option:hover { background: rgba(212, 175, 55, 0.16); color: #D4AF37; }
.v4-city-plate { flex: 0 0 1.6rem; width: 1.6rem; font-variant-numeric: tabular-nums; color: #D4AF37; }
.v4-city-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
