/* ==========================================================================
   LANCEON — OPORTUNIDADES EM CADA LANCE
   Official Design System (Extracted from Brand Identity Logo)
   Supports Dark Mode & Light Mode with CSS Custom Properties
   ========================================================================== */

:root,
[data-theme="dark"] {
    /* LANCEON graphite and neon green brand palette */
    --bg-primary: #020503;
    --bg-secondary: #070b08;
    --bg-card: #0b120d;
    --bg-card-hover: #101a13;
    --bg-elevated: #141f17;
    --bg-input: #070b08;
    --bg-glass: rgba(11, 18, 13, 0.92);

    /* Brand accents from the LANCEON reference */
    --brand-primary: #39ff14;
    --brand-primary-hover: #2bd90d;
    --brand-primary-soft: rgba(57, 255, 20, 0.12);
    --brand-primary-glow: rgba(57, 255, 20, 0.28);
    --brand-secondary: #4a4a4a;
    --brand-silver: #aeb6b0;
    --brand-silver-bright: #f4f7f4;
    --brand-gradient: linear-gradient(135deg, #39ff14 0%, #20c900 100%);
    --silver-gradient: linear-gradient(180deg, #f4f7f4 0%, #aeb6b0 100%);

    /* Text Colors */
    --text-primary: #f1f5f9;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;
    --text-on-brand: #041206;

    /* Status Semantic Colors */
    --status-success: #39ff14;
    --status-success-bg: rgba(57, 255, 20, 0.12);
    --status-warning: #f59e0b;
    --status-warning-bg: rgba(245, 158, 11, 0.14);
    --status-danger: #ef4444;
    --status-danger-bg: rgba(239, 68, 68, 0.14);
    --status-info: #38bdf8;
    --status-info-bg: rgba(56, 189, 248, 0.14);

    /* Borders & Shadows */
    --border-subtle: rgba(148, 163, 184, 0.14);
    --border-strong: rgba(57, 255, 20, 0.42);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.35);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.5);
    --shadow-glow: 0 0 24px rgba(57, 255, 20, 0.2);

    /* Layout Metrics */
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;
    --sidebar-width: 268px;
    --topbar-height: 68px;
    --font-sans: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-display: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --font-mono: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

[data-theme="light"] {
    --bg-primary: #f4f7f5;
    --bg-secondary: #ffffff;
    --bg-card: #ffffff;
    --bg-card-hover: #f8faf9;
    --bg-elevated: #eef3f0;
    --bg-input: #ffffff;
    --bg-glass: rgba(255, 255, 255, 0.92);

    --brand-primary: #138a00;
    --brand-primary-hover: #0d6900;
    --brand-primary-soft: rgba(19, 138, 0, 0.12);
    --brand-primary-glow: rgba(19, 138, 0, 0.2);
    --brand-secondary: #4a4a4a;
    --brand-silver: #334155;
    --brand-silver-bright: #0f172a;
    --brand-gradient: linear-gradient(135deg, #39e916 0%, #138a00 100%);
    --silver-gradient: linear-gradient(180deg, #0f172a 0%, #4a4a4a 100%);

    --text-primary: #0f172a;
    --text-secondary: #475569;
    --text-muted: #64748b;
    --text-on-brand: #041206;

    --status-success: #138a00;
    --status-success-bg: rgba(19, 138, 0, 0.12);
    --status-warning: #d97706;
    --status-warning-bg: rgba(217, 119, 6, 0.12);
    --status-danger: #dc2626;
    --status-danger-bg: rgba(220, 38, 38, 0.12);
    --status-info: #0284c7;
    --status-info-bg: rgba(2, 132, 199, 0.12);

    --border-subtle: rgba(15, 23, 42, 0.11);
    --border-strong: rgba(19, 138, 0, 0.42);
    --shadow-sm: 0 2px 6px rgba(15, 23, 42, 0.06);
    --shadow-md: 0 10px 25px rgba(15, 23, 42, 0.09);
    --shadow-glow: 0 0 16px rgba(19, 138, 0, 0.16);
}

/* Reset & Base */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 15px;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: rgba(57, 255, 20, 0.32) var(--bg-secondary);
}

/* Custom Sleek Scrollbars (Dark & Light Mode) */
* {
    scrollbar-width: thin;
    scrollbar-color: rgba(148, 163, 184, 0.28) transparent;
}

*::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

*::-webkit-scrollbar-track {
    background: rgba(12, 19, 14, 0.4);
    border-radius: 999px;
}

*::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.28);
    border-radius: 999px;
    transition: background-color 0.2s ease;
}

*::-webkit-scrollbar-thumb:hover {
    background: var(--brand-primary);
}

body {
    font-family: var(--font-sans);
    background-color: var(--bg-primary);
    color: var(--text-primary);
    line-height: 1.55;
    min-height: 100vh;
    transition: background-color 0.2s ease, color 0.2s ease;
    -webkit-font-smoothing: antialiased;
}

button, input, select, textarea {
    font: inherit;
}

a {
    color: var(--brand-primary);
    text-decoration: none;
    transition: color 0.15s ease;
}

a:hover {
    color: var(--brand-primary-hover);
}

/* App Shell Layout */
.app-shell {
    display: flex;
    min-height: 100vh;
}

.sidebar {
    width: var(--sidebar-width);
    background: var(--bg-secondary);
    border-right: 1px solid var(--border-subtle);
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 100;
    transition: transform 0.25s ease, background-color 0.2s ease;
}

.sidebar-brand {
    padding: 1.15rem 1.25rem;
    border-bottom: 1px solid var(--border-subtle);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.85rem;
}

.sidebar-brand img {
    width: 100%;
    max-width: 216px;
    height: auto;
    max-height: 124px;
    object-fit: contain;
    border-radius: 0;
    border: 0;
    box-shadow: none;
}

.sidebar-brand-text { display: none; }

.sidebar-brand-text {
    display: flex;
    flex-direction: column;
}

.sidebar-brand-title {
    font-family: var(--font-display);
    font-weight: 800;
    font-size: 1.05rem;
    letter-spacing: 0.08em;
    color: var(--text-primary);
}

.sidebar-brand-title span {
    color: var(--brand-primary);
}

.sidebar-brand-sub {
    font-size: 0.68rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-secondary);
}

.sidebar-nav {
    flex: 1;
    overflow-y: auto;
    padding: 1rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.nav-section-label {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--text-muted);
    padding: 0.75rem 0.75rem 0.35rem;
}

.nav-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.68rem 0.85rem;
    border-radius: var(--radius-sm);
    color: var(--text-secondary);
    font-weight: 500;
    font-size: 0.92rem;
    transition: all 0.15s ease;
}

.nav-item:hover {
    background: var(--bg-card-hover);
    color: var(--text-primary);
}

.nav-item.active {
    background: var(--brand-primary-soft);
    color: var(--brand-primary);
    font-weight: 600;
    border-left: 3px solid var(--brand-primary);
}

.nav-item .nav-icon {
    width: 20px;
    text-align: center;
    font-size: 1rem;
}

.sidebar-footer {
    padding: 1rem;
    border-top: 1px solid var(--border-subtle);
    font-size: 0.8rem;
    color: var(--text-muted);
}

/* Main Content Wrapper */
.main-wrapper {
    flex: 1;
    margin-left: var(--sidebar-width);
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* Sidebar Backdrop for Mobile */
.sidebar-backdrop {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.65);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    z-index: 95;
    opacity: 0;
    transition: opacity 0.25s ease;
}

.sidebar-backdrop.active {
    display: block;
    opacity: 1;
}

.topbar {
    height: var(--topbar-height);
    background: var(--bg-glass);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border-subtle);
    padding: 0 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 90;
}

.topbar-left {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    min-width: 0;
    flex: 1;
}

.topbar-heading {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    min-width: 0;
}

.topbar-title-text {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.topbar-badge-desktop {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    white-space: nowrap;
}

.mobile-menu-btn {
    display: none;
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    color: var(--text-primary);
    padding: 0.45rem 0.65rem;
    border-radius: var(--radius-sm);
    cursor: pointer;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.topbar-right {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-shrink: 0;
}

.topbar-profile-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Language & Theme Controls */
.lang-selector {
    position: relative;
}

.lang-select-input {
    background: var(--bg-elevated);
    color: var(--text-primary);
    border: 1px solid var(--border-subtle);
    padding: 0.42rem 0.65rem;
    border-radius: var(--radius-sm);
    font-size: 0.84rem;
    font-weight: 500;
    cursor: pointer;
}

.theme-toggle-btn {
    background: var(--bg-elevated);
    color: var(--text-primary);
    border: 1px solid var(--border-subtle);
    padding: 0.42rem 0.75rem;
    border-radius: var(--radius-sm);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.84rem;
    font-weight: 500;
    transition: border-color 0.15s ease, background-color 0.15s ease;
}

.theme-toggle-btn:hover {
    border-color: var(--brand-primary);
}

.content-container {
    padding: 1.75rem;
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
    flex: 1;
}

/* Typography & Headers */
.page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1.5rem;
    flex-wrap: wrap;
}

.page-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--text-primary);
    letter-spacing: -0.01em;
}

.page-subtitle {
    font-size: 0.9rem;
    color: var(--text-secondary);
    margin-top: 0.2rem;
}

.dashboard-shortcuts {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* Grid Systems */
.grid {
    display: grid;
    gap: 1.15rem;
}

.grid-2 { grid-template-columns: repeat(auto-fit, minmax(310px, 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); }

/* Plans Grid & Plan Card Layout */
.plans-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(265px, 1fr));
    gap: 1.25rem;
}

.plan-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1.35rem;
}

.plan-card-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.85rem;
}

.plan-duration-badge {
    font-size: 0.76rem;
    font-weight: 600;
    color: var(--text-secondary);
    white-space: nowrap;
}

.plan-price {
    font-family: var(--font-mono);
    font-size: 1.65rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 1rem;
    letter-spacing: -0.02em;
}

.plan-spec-list {
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    margin-bottom: 1.15rem;
    padding: 0.85rem 0.95rem;
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
}

.plan-spec-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.82rem;
    min-width: 0;
}

.plan-spec-label {
    color: var(--text-secondary);
    flex: 0 1 40%;
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.plan-spec-val {
    flex: 1 1 58%;
    min-width: 0;
    text-align: right;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
}

/* Chat Responsive Layout */
.chat-layout-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr);
    gap: 1.25rem;
    align-items: start;
}

/* Official WhatsApp Community Banner */
.whatsapp-hero-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem;
    border-radius: var(--radius-md);
    background: linear-gradient(135deg, rgba(37, 211, 102, 0.14) 0%, var(--bg-card) 100%);
    border: 1px solid rgba(37, 211, 102, 0.45);
    box-shadow: 0 6px 22px rgba(37, 211, 102, 0.14);
    flex-wrap: wrap;
}

[data-theme="light"] .whatsapp-hero-badge {
    color: var(--brand-primary);
}

.whatsapp-hero-content {
    display: flex;
    align-items: center;
    gap: 1.1rem;
    flex: 1;
    min-width: 260px;
}

.whatsapp-hero-icon {
    width: 54px;
    height: 54px;
    border-radius: 14px;
    background: #25D366;
    color: #041206;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.85rem;
    flex-shrink: 0;
    box-shadow: 0 0 18px rgba(37, 211, 102, 0.45);
}

.whatsapp-hero-badge {
    display: inline-block;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    color: #25D366;
    text-transform: uppercase;
    margin-bottom: 0.15rem;
}

.whatsapp-hero-title {
    font-size: 1.12rem;
    font-weight: 700;
    color: var(--text-primary);
    margin-bottom: 0.2rem;
}

.whatsapp-hero-sub {
    font-size: 0.84rem;
    color: var(--text-secondary);
}

.btn-whatsapp {
    background: #25D366;
    color: #041206;
    font-weight: 700;
    padding: 0.72rem 1.35rem;
    border-radius: var(--radius-sm);
    box-shadow: 0 0 16px rgba(37, 211, 102, 0.35);
    white-space: nowrap;
}

.btn-whatsapp:hover {
    background: #1ebe5d;
    color: #041206;
    transform: translateY(-1px);
}

/* Financial Market News Feed Cards */
.market-news-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0.9rem 1rem;
    background: var(--bg-elevated);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    transition: border-color 0.15s ease, transform 0.15s ease;
}

.market-news-item:hover {
    border-color: var(--brand-primary);
    transform: translateY(-2px);
    color: var(--brand-primary);
}

.market-news-title {
    font-size: 0.88rem;
    font-weight: 600;
    line-height: 1.45;
}

/* Financial Cards */
.card {
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 1.25rem;
    box-shadow: var(--shadow-sm);
    transition: border-color 0.2s ease, transform 0.15s ease;
}

.card-interactive:hover {
    border-color: var(--border-strong);
    transform: translateY(-2px);
}

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

.card-title {
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary);
}

.stat-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
}

.stat-card::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 3px;
    height: 100%;
    background: var(--brand-primary);
    opacity: 0.75;
}

.stat-label {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
    margin-bottom: 0.45rem;
}

.stat-value {
    font-family: var(--font-mono);
    font-size: 1.38rem;
    font-weight: 700;
    color: var(--text-primary);
}

.stat-sub {
    font-size: 0.78rem;
    color: var(--text-muted);
    margin-top: 0.35rem;
}

/* Badges */
.badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.22rem 0.62rem;
    border-radius: 999px;
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.badge-success {
    background: var(--status-success-bg);
    color: var(--status-success);
    border: 1px solid rgba(57, 255, 20, 0.28);
}

.badge-warning {
    background: var(--status-warning-bg);
    color: var(--status-warning);
    border: 1px solid rgba(245, 158, 11, 0.28);
}

.badge-danger {
    background: var(--status-danger-bg);
    color: var(--status-danger);
    border: 1px solid rgba(239, 68, 68, 0.28);
}

.badge-info {
    background: var(--status-info-bg);
    color: var(--status-info);
    border: 1px solid rgba(56, 189, 248, 0.28);
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.62rem 1.15rem;
    border-radius: var(--radius-sm);
    font-weight: 600;
    font-size: 0.9rem;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.15s ease;
    text-decoration: none;
}

.btn-primary {
    background: var(--brand-primary);
    color: var(--text-on-brand);
    box-shadow: var(--shadow-glow);
}

.btn-primary:hover {
    background: var(--brand-primary-hover);
    color: var(--text-on-brand);
}

.btn-secondary {
    background: var(--bg-elevated);
    color: var(--text-primary);
    border-color: var(--border-subtle);
}

.btn-secondary:hover {
    border-color: var(--brand-primary);
    color: var(--brand-primary);
}

.btn-danger {
    background: var(--status-danger-bg);
    color: var(--status-danger);
    border-color: rgba(239, 68, 68, 0.35);
}

.btn-danger:hover {
    background: var(--status-danger);
    color: #fff;
}

.btn-sm {
    padding: 0.38rem 0.75rem;
    font-size: 0.8rem;
}

.btn-block {
    width: 100%;
}

/* Forms & Inputs */
.form-group {
    margin-bottom: 1.1rem;
}

.form-label {
    display: block;
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--text-secondary);
    margin-bottom: 0.4rem;
}

.form-control {
    width: 100%;
    background: var(--bg-input);
    color: var(--text-primary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    padding: 0.68rem 0.9rem;
    font-size: 0.94rem;
    font-family: var(--font-sans);
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.form-control:focus {
    outline: none;
    border-color: var(--brand-primary);
    box-shadow: 0 0 0 3px var(--brand-primary-soft);
}

.form-control[readonly],
.form-control.input-locked {
    background: var(--bg-elevated);
    color: var(--brand-primary);
    border-color: var(--border-strong);
    cursor: not-allowed;
    font-weight: 700;
    letter-spacing: 0.06em;
}

.form-control.is-invalid {
    border-color: var(--status-danger);
    box-shadow: 0 0 0 3px var(--status-danger-bg);
}

.field-error-msg {
    font-size: 0.76rem;
    color: var(--status-danger);
    margin-top: 0.3rem;
    display: none;
}

.field-error-msg.visible {
    display: block;
}

/* International phone input (country flag, calling code and formatted number). */
.iti {
    width: 100%;
    --iti-country-selector-bg: var(--bg-input);
    --iti-border-color: var(--border-subtle);
    --iti-hover-color: var(--bg-elevated);
    --iti-icon-color: var(--text-secondary);
}

.iti input[type="tel"] {
    width: 100%;
}

.iti__dropdown-content,
.iti__country-list {
    z-index: 1200;
    background-color: var(--bg-card) !important;
    color: var(--text-primary) !important;
}

.iti__country,
.iti__country-name {
    color: var(--text-primary) !important;
}

.iti__dial-code {
    color: var(--text-secondary) !important;
}

.iti__search-input {
    color: var(--text-primary) !important;
    background-color: var(--bg-input) !important;
    border-color: var(--border-subtle) !important;
}

.iti__search-input::placeholder {
    color: var(--text-muted) !important;
}

/* Password Eye Toggle Wrapper */
.password-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.password-wrapper .form-control {
    padding-right: 2.75rem;
}

.password-toggle-btn {
    position: absolute;
    right: 0.65rem;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    color: var(--text-secondary);
    cursor: pointer;
    padding: 0.3rem;
    font-size: 0.98rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s ease;
    z-index: 2;
}

.password-toggle-btn:hover {
    color: var(--brand-primary);
}

.locked-badge-icon {
    position: absolute;
    right: 0.85rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--brand-primary);
    pointer-events: none;
    font-size: 0.9rem;
}

.form-hint {
    font-size: 0.76rem;
    color: var(--text-muted);
    margin-top: 0.3rem;
}

/* Alerts & Banners */
.alert {
    padding: 0.9rem 1.15rem;
    border-radius: var(--radius-sm);
    margin-bottom: 1.25rem;
    font-size: 0.9rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.alert-success {
    background: var(--status-success-bg);
    color: var(--status-success);
    border: 1px solid rgba(57, 255, 20, 0.35);
}

.registration-success-notice {
    justify-content: flex-start;
    align-items: flex-start;
    padding: 1rem 1.15rem;
}
.registration-success-notice > i {
    flex: 0 0 auto;
    margin-top: .12rem;
    font-size: 1.15rem;
}

.alert-danger {
    background: var(--status-danger-bg);
    color: var(--status-danger);
    border: 1px solid rgba(239, 68, 68, 0.35);
}

.alert-warning {
    background: var(--status-warning-bg);
    color: var(--status-warning);
    border: 1px solid rgba(245, 158, 11, 0.35);
}

.alert-info {
    background: var(--status-info-bg);
    color: var(--status-info);
    border: 1px solid rgba(56, 189, 248, 0.35);
}

/* Tables */
.table-responsive {
    width: 100%;
    overflow-x: auto;
}

.admin-users-scroll {
    max-height: min(72vh, 900px);
    overflow: auto;
    overscroll-behavior: contain;
}

.admin-users-scroll .data-table thead {
    position: sticky;
    top: 0;
    z-index: 2;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
}

.data-table th,
.data-table td {
    padding: 0.82rem 0.95rem;
    text-align: left;
    border-bottom: 1px solid var(--border-subtle);
}

.data-table th {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-secondary);
    background: var(--bg-elevated);
}

.data-table tbody tr:hover {
    background: var(--bg-card-hover);
}

.mono {
    font-family: var(--font-mono);
}

/* Auth / Guest Layout */
.auth-wrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 1.5rem;
    background: radial-gradient(circle at 50% 0%, var(--brand-primary-soft) 0%, var(--bg-primary) 65%);
}

/* Login page inspired by the supplied open, split-screen reference. */
.auth-page-login .auth-wrapper {
    position: relative;
    overflow: hidden;
    align-items: flex-start;
    justify-content: center;
    padding: 2rem 2rem 2rem clamp(1.5rem, 16.4vw, 20rem);
    background: var(--bg-primary);
}

.auth-brand-hero {
    position: absolute;
    z-index: 1;
    top: 50%;
    right: clamp(2rem, 8vw, 9rem);
    width: clamp(340px, 34vw, 620px);
    transform: translateY(-50%);
    pointer-events: none;
}
.auth-brand-hero img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    filter: drop-shadow(0 16px 42px rgba(57, 255, 20, .18));
}

.auth-page-login .auth-wrapper::before {
    content: "";
    position: absolute;
    inset: 0 0 0 34%;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(2,5,3,.98) 0%, rgba(2,5,3,.78) 20%, rgba(2,5,3,.22) 100%), url("../images/lanceon-auth-background.jpeg") center / cover no-repeat;
    opacity: .52;
}

.auth-page-login .auth-wrapper::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 67%;
    height: 34%;
    pointer-events: none;
    clip-path: polygon(0 80%, 12% 70%, 24% 84%, 38% 55%, 53% 78%, 68% 63%, 81% 84%, 92% 57%, 100% 73%, 100% 100%, 0 100%);
    background: linear-gradient(165deg, rgba(57,255,20,.08), rgba(2,5,3,.96) 72%);
    border-top: 1px solid rgba(57,255,20,.16);
}

.auth-page-login .auth-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 390px;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.auth-page-login .auth-logo-box { display: none; }
.auth-page-login .auth-card > form,
.auth-page-login .auth-form-title,
.auth-page-login .auth-form-subtitle,
.auth-page-login .auth-card > div:last-child { max-width: 315px; }
.auth-page-login .auth-form-title {
    margin: 0 0 2.25rem !important;
    color: var(--text-primary);
    text-align: left !important;
    font-size: clamp(2rem, 2.55vw, 2.55rem) !important;
    line-height: 1.15;
    font-weight: 500;
    letter-spacing: -.045em;
}
.auth-title-dot { color: var(--brand-primary); }
.auth-page-login .auth-form-subtitle {
    margin: -1.65rem 0 1.8rem !important;
    text-align: left !important;
    color: var(--text-secondary);
    line-height: 1.5;
}
.auth-page-login .form-label { color: var(--text-secondary); font-weight: 500; }
.auth-page-login .form-group { margin-bottom: 1.15rem; }
.auth-page-login .form-control {
    min-height: 44px;
    background: var(--bg-input);
    border-color: transparent;
}
.auth-page-login .form-control:-webkit-autofill,
.auth-page-login .form-control:-webkit-autofill:hover,
.auth-page-login .form-control:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--text-primary);
    -webkit-box-shadow: 0 0 0 1000px var(--bg-input) inset;
    transition: background-color 9999s ease-out 0s;
}
.auth-page-login .form-hint { margin-top: .45rem; }
.auth-forgot-link { text-align: right; margin-top: .5rem; font-size: .8rem; }
.auth-page-login .btn-primary { min-height: 46px; font-size: .95rem; }
.auth-page-login .auth-card > div:last-child {
    margin-top: 1.45rem !important;
    padding-top: 1rem !important;
    text-align: left !important;
}

/* The registration form shares the login composition but starts higher because it is taller. */
.auth-page-register .auth-wrapper {
    justify-content: flex-start;
    padding-top: clamp(2rem, 6vh, 4rem);
}
.auth-page-register .iti { width: 100%; }
.auth-page-register .sponsor-card { align-items: flex-start; }

@media (max-width: 768px) {
    .auth-page-login .auth-wrapper {
        min-height: 100svh;
        align-items: stretch;
        justify-content: flex-start;
        padding: max(5rem, calc(env(safe-area-inset-top) + 4rem)) 1.15rem 2rem;
        background: var(--bg-primary);
    }
    .auth-page-login .auth-wrapper::before,
    .auth-page-login .auth-wrapper::after { display: none; }
    .auth-page-login .auth-card { width: 100%; max-width: 480px; margin: 0 auto; }
    .auth-page-login .auth-form-title { font-size: clamp(1.9rem, 8vw, 2.35rem) !important; margin-bottom: 1.85rem !important; }
    .auth-page-login .auth-form-subtitle { margin: -1.35rem 0 1.45rem !important; }
    .auth-page-login .auth-card > form,
    .auth-page-login .auth-form-title,
    .auth-page-login .auth-form-subtitle,
    .auth-page-login .auth-card > div:last-child { max-width: 480px; }
    .auth-page-login .auth-topbar { z-index: 60; }
    .auth-page-login .auth-brand-hero {
        position: relative;
        top: auto;
        right: auto;
        align-self: center;
        width: min(66vw, 260px);
        margin: 0 auto 1.5rem;
        transform: none;
    }
    .auth-page-register .auth-brand-hero {
        position: relative;
        top: auto;
        right: auto;
        align-self: center;
        width: min(54vw, 210px);
        margin: 0 auto 1.25rem;
        transform: none;
    }
    .auth-page-register .auth-wrapper { padding-top: max(5rem, calc(env(safe-area-inset-top) + 4rem)); }
}

@media (min-width: 769px) and (max-width: 1040px) {
    .auth-page-login .auth-brand-hero,
    .auth-page-register .auth-brand-hero { display: none; }
}

@media (max-width: 360px) {
    .auth-page-login .auth-wrapper { padding-left: .9rem; padding-right: .9rem; }
    .auth-page-login .auth-form-title { font-size: 1.85rem !important; }
    .auth-page-login .auth-card > form,
    .auth-page-login .auth-form-title,
    .auth-page-login .auth-form-subtitle,
    .auth-page-login .auth-card > div:last-child { max-width: 100%; }
}

/* Open, simplified user dashboard using the same visual restraint as the login page. */
.user-dashboard-simple {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}
.user-dashboard-simple .dashboard-welcome {
    align-items: center;
    padding: .25rem 0 1.15rem;
    margin-bottom: 1.1rem;
    border-bottom: 1px solid var(--border-subtle);
}
.user-dashboard-simple .page-title { font-size: clamp(1.55rem, 2.6vw, 2rem); letter-spacing: -.04em; }
.user-dashboard-simple .page-subtitle { margin-top: .45rem; }
.user-dashboard-simple .card:not(.stat-card):not(.plan-card) {
    background: transparent;
    border: 0;
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
    box-shadow: none;
    padding: 1rem 0;
}
.user-dashboard-simple > .liquidity-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    gap: .2rem 1.25rem;
    padding: .35rem 0 .9rem 1rem;
    margin: 0 0 1rem !important;
    background: transparent;
    border: 0;
    border-left: 3px solid var(--brand-primary);
    border-radius: 0;
    box-shadow: none;
}
.user-dashboard-simple .liquidity-hero .stat-label { grid-column: 1; margin: 0; }
.user-dashboard-simple .liquidity-value {
    grid-column: 2;
    grid-row: 1 / span 2;
    font-size: clamp(2rem, 4vw, 3rem);
    text-shadow: none;
    margin: 0;
}
.user-dashboard-simple .liquidity-hero .stat-sub {
    grid-column: 1 / -1;
    max-width: 82ch;
    margin-top: .25rem;
    line-height: 1.45;
}
.user-dashboard-simple > .grid-4 { margin-bottom: 1.2rem !important; }
.user-dashboard-simple .grid-4 .stat-card {
    min-width: 0;
    padding: .8rem .85rem;
    background: var(--bg-card);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    box-shadow: none;
}
.user-dashboard-simple .grid-4 .stat-card::after { display: none; }
.user-dashboard-simple .promo-carousel { margin-bottom: 1rem; }
.user-dashboard-simple .promo-slot {
    min-height: 88px;
    padding: .75rem .9rem;
    background: transparent;
    border: 0;
    border-left: 2px solid var(--brand-primary);
    border-radius: 0;
}
.user-dashboard-simple .dashboard-shortcuts .btn { border-radius: 999px; }
.user-dashboard-simple .grid-2 { gap: 1.5rem; }
.user-dashboard-simple .grid-2 .card-header { padding-bottom: .6rem; }
.user-dashboard-simple .grid-2 .card-title { font-size: 1rem; }
.user-dashboard-simple .whatsapp-hero-banner { box-shadow: none; }

@media (max-width: 640px) {
    .user-dashboard-simple .dashboard-welcome {
        padding: .1rem 0 .75rem;
        margin-bottom: .75rem;
    }
    .user-dashboard-simple .page-title { font-size: 1.3rem; }
    .user-dashboard-simple .page-subtitle { line-height: 1.5; }
    .user-dashboard-simple > .liquidity-hero {
        grid-template-columns: 1fr;
        gap: .2rem;
        padding: .25rem 0 .6rem .75rem;
        margin-bottom: .65rem !important;
    }
    .user-dashboard-simple .liquidity-hero .stat-label { grid-column: 1; }
    .user-dashboard-simple .liquidity-value { grid-column: 1; grid-row: auto; font-size: 2rem; }
    .user-dashboard-simple .liquidity-hero .stat-sub { grid-column: 1; font-size: .65rem; }
    .user-dashboard-simple .grid-4 .stat-card { padding: .68rem .6rem; }
    .user-dashboard-simple > .grid-4 { margin-bottom: .75rem !important; }
    .user-dashboard-simple .grid-2 { gap: .85rem; }
    .user-dashboard-simple .grid-2 .card { padding: .85rem 0; }
    .user-dashboard-simple .promo-slot { min-height: 82px; }
}

.auth-topbar {
    position: fixed;
    top: 1rem;
    right: 1.5rem;
    display: flex;
    gap: 0.6rem;
    z-index: 50;
}

.auth-card {
    width: 100%;
    max-width: 440px;
    background: var(--bg-card);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-lg);
    padding: 2rem;
    box-shadow: var(--shadow-md), var(--shadow-glow);
}

.auth-logo-box {
    text-align: center;
    margin-bottom: 1.5rem;
}

.auth-logo-box img {
    max-width: 190px;
    width: 100%;
    height: auto;
    border-radius: 0;
    border: 0;
    box-shadow: none;
    margin-bottom: 0.75rem;
}

/* Progress Bar */
.progress-track {
    width: 100%;
    height: 10px;
    background: var(--bg-elevated);
    border-radius: 999px;
    overflow: hidden;
    border: 1px solid var(--border-subtle);
}

.progress-fill {
    height: 100%;
    background: var(--brand-gradient);
    border-radius: 999px;
    transition: width 0.35s ease;
}

/* Chat Container */
.chat-box {
    height: 460px;
    overflow-y: auto;
    padding: 1rem;
    background: var(--bg-input);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-sm);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.chat-msg {
    padding: 0.7rem 0.95rem;
    border-radius: var(--radius-sm);
    background: var(--bg-card);
    border-left: 4px solid var(--brand-primary);
}

.chat-msg-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.3rem;
    font-size: 0.78rem;
}

/* Tabs Navigation (Wrapped Pill Design — No Ugly Scrollbar) */
.tabs-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    background: var(--bg-secondary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-md);
    padding: 0.55rem;
    margin-bottom: 1.5rem;
}

.tab-link {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.52rem 0.9rem;
    border-radius: var(--radius-sm);
    font-size: 0.83rem;
    font-weight: 600;
    color: var(--text-secondary);
    white-space: nowrap;
    border: 1px solid transparent;
    transition: all 0.15s ease;
}

.tab-link:hover {
    background: var(--bg-elevated);
    color: var(--text-primary);
}

.tab-link.active {
    background: var(--brand-primary-soft);
    color: var(--brand-primary);
    border-color: var(--border-strong);
    box-shadow: var(--shadow-sm);
}

/* Responsive Breakpoints */
@media (max-width: 1100px) {
    .chat-layout-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 992px) {
    .sidebar {
        transform: translateX(-100%);
        box-shadow: var(--shadow-md);
        z-index: 100;
    }
    .sidebar.open {
        transform: translateX(0);
    }
    .main-wrapper {
        margin-left: 0;
    }
    .mobile-menu-btn {
        display: inline-flex;
    }
    .content-container {
        padding: 1.15rem;
    }
    .topbar {
        padding: 0 1rem;
    }
}

@media (max-width: 768px) {
    :root {
        --topbar-height: 56px;
    }
    .topbar {
        height: 56px;
        padding: 0 0.85rem;
    }
    .topbar-badge-desktop {
        display: none !important;
    }
    .topbar-profile-phone {
        display: none !important;
    }
    .topbar-profile-btn {
        padding: 0.42rem 0.65rem;
        min-width: 36px;
        justify-content: center;
    }
    .topbar-title-text {
        max-width: 155px;
        font-size: 0.95rem;
    }
    .lang-select-input {
        max-width: 68px;
        padding: 0.38rem 0.45rem;
        font-size: 0.78rem;
    }
    .theme-toggle-btn {
        padding: 0.42rem 0.65rem;
    }
    .topbar-right {
        gap: 0.4rem;
    }
    .topbar-left {
        gap: 0.5rem;
    }
}

@media (max-width: 640px) {
    html, body {
        overflow-x: hidden;
    }
    .main-wrapper {
        overflow-x: hidden;
    }
    .content-container {
        padding: 0.85rem 0.75rem 2rem;
    }
    .grid-2,
    .grid-3,
    .grid-4,
    .plans-grid {
        grid-template-columns: 1fr;
    }
    .page-header {
        flex-direction: column;
        align-items: stretch;
        gap: 0.85rem;
    }
    .dashboard-shortcuts {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.45rem;
        width: 100%;
    }
    .dashboard-shortcuts .btn {
        justify-content: center;
        padding: 0.55rem 0.65rem;
        font-size: 0.8rem;
    }
    .dashboard-shortcuts .btn:last-child:nth-child(odd) {
        grid-column: span 2;
    }
    .alert {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
        padding: 0.85rem 1rem;
    }
    .alert > .btn {
        width: 100%;
        text-align: center;
        justify-content: center;
    }
    .whatsapp-hero-banner {
        flex-direction: column;
        align-items: stretch;
        padding: 1rem;
        gap: 1rem;
    }
    .whatsapp-hero-content {
        min-width: 0;
        gap: 0.75rem;
    }
    .whatsapp-hero-action,
    .whatsapp-hero-action .btn-whatsapp {
        width: 100%;
        text-align: center;
        justify-content: center;
        display: flex;
    }
    .topbar-title-text {
        max-width: 130px;
        font-size: 0.88rem;
    }
    .tabs-nav {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 0.35rem;
    }
    .tab-link {
        justify-content: center;
        font-size: 0.78rem;
        padding: 0.48rem 0.5rem;
        white-space: normal;
        text-align: center;
    }
    .auth-card {
        padding: 1.35rem;
    }
    .card {
        padding: 1rem;
    }
    .plan-card {
        padding: 1.15rem;
    }
}

.mobile-bottom-nav { display:none; }
@media (max-width: 768px) {
    .mobile-bottom-nav {
        position:fixed; left:0; right:0; bottom:0; z-index:110;
        display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
        padding:.42rem .3rem calc(.42rem + env(safe-area-inset-bottom));
        background:var(--bg-glass); border-top:1px solid var(--border-subtle);
        backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
        box-shadow:0 -8px 24px rgba(0,0,0,.18);
    }
    .mobile-bottom-link {
        min-height:3.15rem; display:flex; flex-direction:column; align-items:center; justify-content:center;
        gap:.22rem; color:var(--text-secondary); font-size:.65rem; font-weight:700;
        border-radius:var(--radius-sm); text-decoration:none; -webkit-tap-highlight-color:transparent;
    }
    .mobile-bottom-link i { font-size:1.12rem; }
    .mobile-bottom-link.active { color:var(--brand-primary); background:var(--brand-primary-soft); }
    .content-container { padding-bottom:calc(6rem + env(safe-area-inset-bottom)); }
    .sidebar { display:none; }
    .mobile-menu-btn, .sidebar-backdrop { display:none !important; }
}


.liquidity-hero {
    background: radial-gradient(ellipse at 90% 5%, rgba(57,255,20,.12), transparent 48%), var(--bg-card);
    border: 1px solid var(--brand-primary);
    box-shadow: 0 0 28px rgba(57,255,20,.16);
}
.liquidity-value { color:var(--brand-primary); font:800 clamp(2.1rem,5vw,4rem)/1.08 var(--font-mono); letter-spacing:-.06em; margin:.45rem 0 .8rem; text-shadow:0 0 24px var(--brand-primary-glow); }
.liquidity-breakdown > div { color:var(--text-secondary); display:flex; flex-direction:column; gap:.3rem; }
.liquidity-breakdown strong { color:var(--text-primary); font:700 .9rem var(--font-mono); }
.promo-carousel { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(260px,1fr); gap:.85rem; overflow-x:auto; margin:0 0 1.5rem; padding:.1rem .1rem .5rem; scroll-snap-type:x mandatory; }
.promo-slot { min-height:128px; padding:1rem 1.15rem; background:linear-gradient(145deg,var(--bg-card),var(--bg-elevated)); border:1px solid var(--border-subtle); border-left:3px solid var(--brand-primary); border-radius:var(--radius-md); display:flex; flex-direction:column; gap:.35rem; scroll-snap-align:start; }
.promo-slot strong { color:var(--text-primary); font-size:1.05rem; }
.promo-slot span:last-child { color:var(--text-secondary); font-size:.82rem; }
.promo-slot-kicker { color:var(--brand-primary); font-size:.67rem; font-weight:800; letter-spacing:.12em; }
.sponsor-card { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.65rem; padding:.8rem; margin:0 0 1rem; background:var(--bg-elevated); border:1px solid var(--border-subtle); border-radius:var(--radius-sm); }
.admin-activity-wrap { position:relative; }
.activity-count { position:absolute; top:-.35rem; right:-.35rem; min-width:1.1rem; height:1.1rem; padding:0 .2rem; border-radius:50px; background:var(--brand-primary); color:#fff; font-size:.65rem; font-weight:800; text-align:center; }
.admin-activity-panel { position:absolute; top:calc(100% + .65rem); right:0; z-index:150; width:min(360px,calc(100vw - 2rem)); max-height:420px; overflow:auto; padding:1rem; background:var(--bg-card); border:1px solid var(--border-strong); border-radius:var(--radius-md); box-shadow:var(--shadow-md); }
.admin-activity-item { display:flex; flex-direction:column; gap:.2rem; padding:.7rem 0; border-bottom:1px solid var(--border-subtle); font-size:.78rem; }
.admin-activity-item span { color:var(--text-secondary); }
.operation-capital { margin:.5rem 0 .8rem; color:var(--text-secondary); font-size:.8rem; }
.operation-capital strong { color:var(--brand-primary); font-family:var(--font-mono); }

/* Mobile composition follows the compact, card-based reference in the LANCEON identity. */
.dashboard-shortcuts-mobile { display: none; }
@media (max-width: 640px) {
    .content-container { padding: .7rem .65rem calc(6rem + env(safe-area-inset-bottom)); }
    .page-header { gap: .6rem; margin-bottom: .85rem; }
    .page-title { font-size: 1.2rem; line-height: 1.25; }
    .page-subtitle { font-size: .78rem; }
    .whatsapp-hero-banner {
        flex-direction: column; align-items: stretch; gap: .7rem;
        padding: .9rem; margin-bottom: 1rem !important;
    }
    .whatsapp-hero-content { align-items: center; gap: .75rem; width: 100%; min-width: 0; }
    .whatsapp-hero-copy { min-width: 0; }
    .whatsapp-hero-icon { width: 44px; height: 44px; flex: 0 0 44px; font-size: 1.3rem; }
    .whatsapp-hero-badge { font-size: .62rem; margin-bottom: .12rem; }
    .whatsapp-hero-title { font-size: .9rem; line-height: 1.3; overflow-wrap: anywhere; }
    .whatsapp-hero-sub { display: block; margin-top: .2rem; font-size: .72rem; line-height: 1.4; }
    .whatsapp-hero-banner > .btn-whatsapp { width: 100%; justify-content: center; padding: .68rem .8rem; font-size: .8rem; }
    .whatsapp-hero-banner > .btn-whatsapp i { font-size: 1rem !important; }
    .promo-carousel { grid-auto-columns: 84%; gap: .55rem; margin-bottom: .85rem; }
    .promo-slot { min-height: 92px; padding: .75rem .85rem; }
    .promo-slot strong { font-size: .9rem; }
    .promo-slot span:last-child { font-size: .72rem; }
    .liquidity-hero { padding: .85rem; margin-bottom: .75rem !important; }
    .liquidity-value { font-size: clamp(1.8rem, 9vw, 2.5rem); margin: .3rem 0 .45rem; }
    .liquidity-hero .stat-sub { font-size: .68rem; line-height: 1.35; }
    .grid-4, .grid-3, .plans-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .55rem; }
    form.grid-3 { grid-template-columns: 1fr !important; }
    .grid-4[style], .grid-3[style] { margin-bottom: .85rem !important; }
    .stat-card { padding: .78rem .72rem; min-width: 0; }
    .stat-label { font-size: .62rem; line-height: 1.3; letter-spacing: .025em; }
    .stat-value { font-size: 1rem; overflow-wrap: anywhere; }
    .stat-sub { font-size: .68rem; overflow-wrap: anywhere; }
    .dashboard-shortcuts {
        display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: .4rem; margin-bottom: .9rem !important;
    }
    .dashboard-shortcuts-desktop { display: none !important; }
    .dashboard-shortcuts-mobile { display: grid !important; }
    .dashboard-shortcuts .btn {
        min-width: 0; min-height: 68px; padding: .5rem .2rem;
        display: flex; flex-direction: column; justify-content: center; gap: .3rem;
        text-align: center; white-space: normal; font-size: .62rem; line-height: 1.15;
    }
    .dashboard-shortcuts .btn i { font-size: 1rem; }
    .dashboard-shortcuts .btn:last-child:nth-child(odd) { grid-column: auto; }
    .plan-card { padding: .65rem; gap: .55rem; min-width: 0; }
    .plan-card-top { flex-direction: column; align-items: flex-start; gap: .3rem; margin-bottom: .55rem; }
    .plan-card-top .badge { max-width: 100%; font-size: .62rem; }
    .plan-duration-badge { font-size: .6rem; white-space: normal; }
    .plan-price { font-size: clamp(1rem, 4.4vw, 1.35rem); margin-bottom: .5rem; overflow-wrap: anywhere; }
    .plan-spec-list { gap: .4rem; padding: .55rem; margin-bottom: .65rem; }
    .plan-spec-row { align-items: flex-start; flex-direction: column; gap: .08rem; font-size: .65rem; }
    .plan-spec-label { flex: 0 0 auto; width: 100%; white-space: normal; font-size: .62rem; line-height: 1.25; }
    .plan-spec-val { flex: 0 0 auto; width: 100%; text-align: left; white-space: normal; font-size: .66rem; line-height: 1.3; }
    .plan-card .form-group { margin-bottom: .45rem !important; }
    .plan-card .btn { min-height: 40px; padding: .55rem .35rem; font-size: .68rem; }
    .card-header { gap: .45rem; align-items: flex-start; }
    .card-title { font-size: .9rem; }
    .auth-wrapper {
        min-height: 100svh; justify-content: flex-start; align-items: stretch;
        padding: max(4.4rem, calc(env(safe-area-inset-top) + 3.5rem)) .9rem 1rem;
        background: var(--bg-primary);
    }
    .auth-card {
        max-width: none; padding: .55rem .15rem 1rem;
        background: transparent; border: 0; border-radius: 0; box-shadow: none;
    }
    .auth-logo-box { text-align: left; margin-bottom: 1.15rem; }
    .auth-logo-box img { max-width: 116px; margin-bottom: .45rem; }
    .auth-logo-box .sidebar-brand-title { font-size: 1.08rem !important; }
    .auth-card > h2 { text-align: left !important; font-size: 1.35rem !important; margin-bottom: .35rem !important; }
    .auth-card > p { text-align: left !important; margin-bottom: 1.2rem !important; }
    .auth-topbar { top: max(.65rem, env(safe-area-inset-top)); right: .75rem; }
    .form-control { min-height: 46px; font-size: .92rem; }
    .btn { min-height: 44px; }
    .card-interactive:hover { transform: none; }
}

/* Compact user dashboard and consolidated referral commission report. */
.dashboard-balance-summary { margin: 0 0 1.1rem; padding: 1.15rem 1.25rem; }
.dashboard-balance-heading, .dashboard-operation-heading { display:flex; align-items:center; justify-content:space-between; gap:.8rem; }
.dashboard-balance-caption { color:var(--text-muted); font-size:.78rem; margin-top:.25rem; }
.dashboard-balance-values { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-top:.9rem; }
.dashboard-balance-item { display:flex; flex-direction:column; gap:.25rem; padding:.8rem 0 0; border-top:1px solid var(--border-subtle); }
.dashboard-balance-item span { color:var(--text-secondary); font-size:.78rem; }
.dashboard-balance-item strong { font-size:clamp(1.1rem,2vw,1.45rem); overflow-wrap:anywhere; }
.dashboard-market-activity { margin-bottom:1.25rem; }
.dashboard-operation-list { display:flex; flex-direction:column; gap:.65rem; }
.dashboard-operation-item { padding:.75rem .85rem; border:1px solid var(--border-subtle); border-radius:var(--radius-sm); background:var(--bg-elevated); }
.dashboard-operation-heading strong { min-width:0; }
.dashboard-operation-meta { margin-top:.35rem; color:var(--text-secondary); font-size:.78rem; }
.dashboard-empty-state { color:var(--text-secondary); font-size:.88rem; }
.dashboard-simple-actions { display:flex !important; }
.network-level-summary { background:var(--bg-elevated); font-weight:700; }
.network-client-phone { display:block; color:var(--text-muted); font-size:.72rem; margin-top:.15rem; }
.whatsapp-hero-copy { min-width:0; }

/* Community access lives in the navigation and the dashboard keeps a polished compact callout. */
.whatsapp-community-nav {
    position: relative;
    margin: .5rem .15rem .35rem;
    padding: .85rem .8rem;
    color: var(--text-primary);
    background: linear-gradient(110deg, rgba(57,255,20,.16), rgba(57,255,20,.035));
    border: 1px solid rgba(57,255,20,.48);
    box-shadow: 0 6px 18px rgba(57,255,20,.09);
}
.whatsapp-community-nav .nav-icon { color: var(--brand-primary); font-size: 1.25rem; }
.whatsapp-community-nav > span:nth-child(2) { display:flex; flex-direction:column; gap:.15rem; font-weight:800; line-height:1.2; }
.whatsapp-community-nav small { color:var(--text-secondary); font-size:.66rem; font-weight:600; }
.whatsapp-community-external { margin-left:auto; color:var(--brand-primary); font-size:.72rem; }
.whatsapp-community-nav:hover { color:var(--text-primary); border-color:var(--brand-primary); background:linear-gradient(110deg,rgba(57,255,20,.23),rgba(57,255,20,.07)); }

.user-dashboard-simple .whatsapp-hero-banner {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    min-height:142px;
    padding:1.3rem 1.5rem;
    border:1px solid rgba(57,255,20,.52);
    border-radius:18px;
    background:
        radial-gradient(ellipse at 82% 0%, rgba(57,255,20,.22), transparent 42%),
        linear-gradient(112deg, #0b170e 0%, #101c13 55%, #061009 100%);
    box-shadow:0 12px 32px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.05);
}
[data-theme="light"] .user-dashboard-simple .whatsapp-hero-banner {
    background:radial-gradient(ellipse at 84% 0%,rgba(57,255,20,.16),transparent 45%),linear-gradient(112deg,#fff 0%,#f2f8f2 58%,#e8f4e9 100%);
}
.whatsapp-hero-orbit { position:absolute; z-index:-1; pointer-events:none; border:1px solid rgba(57,255,20,.17); border-radius:50%; }
.whatsapp-hero-orbit-one { width:300px; height:300px; right:9%; top:-205px; box-shadow:0 0 0 20px rgba(57,255,20,.025),0 0 0 42px rgba(57,255,20,.02); }
.whatsapp-hero-orbit-two { width:190px; height:190px; right:20%; bottom:-155px; border-color:rgba(57,255,20,.12); }
.user-dashboard-simple .whatsapp-hero-content { position:relative; z-index:1; gap:1rem; }
.user-dashboard-simple .whatsapp-hero-icon { width:60px; height:60px; border-radius:18px; box-shadow:0 0 30px rgba(37,211,102,.32); }
.user-dashboard-simple .whatsapp-hero-badge { display:flex; align-items:center; gap:.42rem; letter-spacing:.12em; }
.whatsapp-live-dot { width:7px; height:7px; border-radius:50%; background:#39ff14; box-shadow:0 0 10px rgba(57,255,20,.8); }
.user-dashboard-simple .whatsapp-hero-title { max-width:720px; margin:.18rem 0 .28rem; font-size:clamp(1rem,2vw,1.28rem); letter-spacing:-.025em; }
.user-dashboard-simple .whatsapp-hero-sub { max-width:700px; margin:0; font-size:.82rem; line-height:1.55; }
.whatsapp-hero-footnote { display:flex; align-items:center; gap:.4rem; margin-top:.55rem; color:var(--text-muted); font-size:.68rem; font-weight:600; }
.whatsapp-hero-footnote i { color:var(--brand-primary); }
.user-dashboard-simple .btn-whatsapp { position:relative; z-index:1; display:inline-flex; align-items:center; justify-content:space-between; gap:1rem; min-width:210px; padding:.82rem 1rem; border:1px solid rgba(255,255,255,.1); border-radius:12px; background:linear-gradient(135deg,#2bdc68,#19ba51); box-shadow:0 8px 24px rgba(37,211,102,.2); }
.user-dashboard-simple .btn-whatsapp > span { display:inline-flex; align-items:center; gap:.55rem; }
.whatsapp-hero-arrow { transition:transform .2s ease; }
.user-dashboard-simple .btn-whatsapp:hover .whatsapp-hero-arrow { transform:translateX(4px); }

.referral-mobile-levels { display:none; }
@media (max-width: 768px) {
    .referral-mobile-levels { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.55rem; }
    .referral-level-block { align-self:start; min-width:0; overflow:visible; border:1px solid var(--border-subtle); border-radius:13px; background:linear-gradient(145deg,var(--bg-card),var(--bg-secondary)); box-shadow:var(--shadow-sm); }
    .referral-level-block[open] { grid-column:1 / -1; border-color:var(--border-strong); box-shadow:0 8px 22px rgba(0,0,0,.15); }
    .referral-level-summary { display:grid; grid-template-columns:35px minmax(0,1fr) 15px; grid-template-rows:auto auto; align-items:center; gap:.4rem .55rem; min-height:83px; padding:.62rem; list-style:none; cursor:pointer; }
    .referral-level-summary::-webkit-details-marker { display:none; }
    .referral-level-number { grid-row:1 / span 2; display:grid; place-items:center; width:34px; height:38px; border-radius:10px; color:var(--brand-primary); background:var(--brand-primary-soft); font:800 .85rem var(--font-sans); }
    .referral-level-main { display:flex; min-width:0; flex-direction:column; gap:.12rem; }
    .referral-level-main strong { color:var(--text-primary); font-size:.77rem; }
    .referral-level-main small { color:var(--text-secondary); font-size:.6rem; line-height:1.3; }
    .referral-level-generated { grid-column:2; display:flex; align-items:baseline; gap:.32rem; min-width:0; }
    .referral-level-generated strong { color:var(--brand-primary); font-size:.68rem; }
    .referral-level-generated small { color:var(--text-muted); font-size:.57rem; }
    .referral-level-chevron { grid-column:3; grid-row:1 / span 2; color:var(--text-muted); font-size:.68rem; transition:transform .2s ease; }
    .referral-level-block[open] .referral-level-chevron { transform:rotate(180deg); color:var(--brand-primary); }
    .referral-level-content { padding:.65rem; border-top:1px solid var(--border-subtle); }
    .referral-level-overview { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.45rem; margin-bottom:.65rem; }
    .referral-level-overview > span, .referral-client-metrics > span { display:flex; min-width:0; flex-direction:column; gap:.1rem; padding:.48rem; border-radius:8px; background:var(--bg-elevated); }
    .referral-level-overview small, .referral-client-metrics small { color:var(--text-muted); font-size:.57rem; }
    .referral-level-overview strong, .referral-client-metrics strong { color:var(--text-primary); font-size:.64rem; overflow-wrap:anywhere; }
    .referral-client-list { display:grid; gap:.5rem; }
    .referral-client-card { padding:.65rem; border:1px solid var(--border-subtle); border-radius:10px; background:var(--bg-secondary); }
    .referral-client-heading { display:flex; align-items:center; gap:.5rem; min-width:0; margin-bottom:.55rem; }
    .referral-client-avatar { display:grid; place-items:center; flex:0 0 30px; width:30px; height:30px; border-radius:50%; color:var(--brand-primary); background:var(--brand-primary-soft); font-size:.72rem; }
    .referral-client-heading > span:nth-child(2) { display:flex; min-width:0; flex:1; flex-direction:column; }
    .referral-client-heading strong { overflow:hidden; color:var(--text-primary); font-size:.72rem; text-overflow:ellipsis; white-space:nowrap; }
    .referral-client-heading small { color:var(--text-secondary); font-size:.59rem; }
    .referral-client-rate { padding:.2rem .4rem; border:1px solid var(--border-strong); border-radius:999px; color:var(--brand-primary); background:var(--brand-primary-soft); font-size:.6rem; font-weight:800; white-space:nowrap; }
    .referral-client-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.4rem; }
    .referral-level-empty { padding:.65rem; color:var(--text-secondary); font-size:.72rem; text-align:center; }
    .referral-commission-report { display:none; }
    .referral-link-card { padding:.85rem; }
    .referral-link-actions .btn { width:100%; justify-content:center; }
    .user-dashboard-simple .whatsapp-hero-banner { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:.8rem; min-height:0; padding:.9rem; }
    .user-dashboard-simple .whatsapp-hero-content { grid-column:1 / -1; align-items:flex-start; }
    .user-dashboard-simple .whatsapp-hero-icon { width:44px; height:44px; flex-basis:44px; border-radius:13px; font-size:1.3rem; }
    .user-dashboard-simple .whatsapp-hero-title { font-size:.88rem; }
    .user-dashboard-simple .whatsapp-hero-sub { font-size:.69rem; }
    .whatsapp-hero-footnote { margin-top:.35rem; font-size:.59rem; }
    .user-dashboard-simple .btn-whatsapp { grid-column:1 / -1; width:100%; min-width:0; padding:.68rem .8rem; font-size:.76rem; }
}
@media (max-width: 420px) {
    .referral-mobile-levels { grid-template-columns:1fr; }
    .referral-level-block[open] { grid-column:auto; }
}
@media (max-width: 640px) {
    .dashboard-balance-summary { padding:.95rem; }
    .dashboard-balance-heading .btn { min-height:36px; padding:.45rem .6rem; font-size:.72rem; }
    .dashboard-balance-values { gap:.7rem; }
    .dashboard-balance-item { min-width:0; }
    .dashboard-balance-item strong { font-size:1rem; }
    .dashboard-operation-heading { align-items:flex-start; flex-direction:column; }
    .dashboard-operation-heading .badge { white-space:normal; }
    .dashboard-simple-actions { display:none !important; }
}
.referral-link-card { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,1.1fr); align-items:center; gap:1.25rem; margin-bottom:1.1rem; }
.referral-link-code { margin:.25rem 0; font-size:1.05rem; font-weight:700; }
.referral-link-code strong { color:var(--brand-primary); }
.referral-link-help, .referral-report-caption { color:var(--text-secondary); font-size:.8rem; }
.referral-link-actions { display:flex; gap:.55rem; min-width:0; }
.referral-link-actions .form-control { min-width:0; flex:1; }
.referral-commission-report .card-header { align-items:flex-start; }
.referral-commission-report .card-title { margin-bottom:.2rem; }
.referral-empty-row { padding:1.5rem !important; text-align:center; color:var(--text-secondary); }
@media (max-width: 768px) {
    .referral-link-card { grid-template-columns:1fr; gap:.8rem; }
    .referral-link-actions { flex-wrap:wrap; }
    .referral-link-actions .form-control { flex-basis:100%; }
}

/* LANCEON reference refresh: split auth screens, neon auction brand and mobile app shell. */
.auth-page-login .auth-wrapper {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(410px, .92fr);
    align-items: center;
    justify-content: stretch;
    gap: clamp(2rem, 5vw, 5rem);
    padding: 2.5rem clamp(2rem, 5.4vw, 6.5rem);
    background: #020503;
}
.auth-page-login .auth-wrapper::before {
    inset: 0 43% 0 0;
    background: linear-gradient(90deg, rgba(2,5,3,.2), rgba(2,5,3,.34) 62%, #020503 100%), url("../images/lanceon-gavel-background.jpeg") center 55% / cover no-repeat;
    opacity: .78;
}
.auth-page-login .auth-wrapper::after {
    left: -12%; right: auto; bottom: -8%; width: 62%; height: 116%;
    clip-path: none; border: 0; pointer-events: none;
    background: linear-gradient(132deg, transparent 0 48%, rgba(57,255,20,.13) 48.2% 49.1%, transparent 49.3% 55%, rgba(57,255,20,.09) 55.2% 56%, transparent 56.2%);
}
.auth-page-login .auth-brand-hero {
    position: relative; z-index: 1; inset: auto; top: auto; right: auto;
    grid-column: 1; grid-row: 1; width: min(100%, 680px); transform: none;
    pointer-events: none;
}
.auth-brand-hero img { width: min(70%, 420px); margin-bottom: clamp(2rem, 6vh, 5rem); filter: drop-shadow(0 12px 30px rgba(57,255,20,.15)); }
.auth-brand-message h1 { color: #f5f7f5; font-size: clamp(2.8rem, 5.2vw, 5.2rem); line-height: .99; letter-spacing: -.055em; font-weight: 800; }
.auth-brand-message h1 span { color: var(--brand-primary); }
.auth-brand-message p { max-width: 560px; margin-top: 1.25rem; color: #e0e6e1; font-size: clamp(1.1rem, 1.8vw, 1.6rem); line-height: 1.45; }
.auth-brand-points { margin-top: 2.2rem; color: #e0e6e1; font-size: .78rem; letter-spacing: .2em; text-transform: uppercase; }
.auth-brand-points i, .auth-brand-points b { color: var(--brand-primary); margin-right: .45rem; }
.auth-page-login .auth-card {
    grid-column: 2; grid-row: 1; z-index: 2; width: 100%; max-width: 680px;
    padding: clamp(1.5rem, 3.4vw, 3.2rem);
    color: #f5f7f5; background: rgba(2,5,3,.9); border: 1px solid rgba(226,232,240,.64);
    border-radius: 18px; box-shadow: 0 24px 70px rgba(0,0,0,.35); backdrop-filter: blur(10px);
}
.auth-page-login .auth-logo-box { display: none; }
.auth-page-login .auth-form-title { max-width: none; margin: 0 0 .25rem !important; text-align: center !important; color:#f8faf9; font-size: clamp(1.85rem, 3vw, 2.7rem) !important; font-weight:800; letter-spacing:-.04em; }
.auth-page-login .auth-form-subtitle { max-width:none; margin:0 0 1.55rem !important; text-align:center !important; color:#cbd5d1; font-size:1rem; }
.auth-page-login .auth-card > form, .auth-page-login .auth-card > div:last-child { max-width:none; }
.auth-page-login .form-label { color:#f5f7f5; font-weight:700; }
.auth-page-login .form-group { margin-bottom:1rem; }
.auth-page-login .form-control { min-height:52px; padding:.75rem .95rem; color:#f8faf9; background:#101310; border:1px solid rgba(226,232,240,.7); border-radius:11px; }
.auth-page-login .form-control::placeholder { color:#aeb6b0; }
.auth-page-login .form-hint { color:#94a3a0; }
.auth-page-login .btn-primary { min-height:54px; color:#061004; background:var(--brand-gradient); border:1px solid var(--brand-primary); border-radius:11px; font-weight:800; box-shadow:0 8px 24px rgba(57,255,20,.18); }
.auth-page-login .auth-submit-btn { display:flex; align-items:center; justify-content:center; gap:.7rem; }
.auth-page-login .auth-submit-btn:hover { color:#061004; filter:brightness(1.06); transform:translateY(-1px); }
.auth-page-login .auth-forgot-link a, .auth-page-login .auth-form-footer a, .auth-page-register .auth-terms-check a { color:var(--brand-primary); font-weight:700; text-decoration:underline; text-underline-offset:3px; }
.auth-page-login .auth-form-footer { margin-top:1.35rem !important; padding-top:1rem !important; border-top:1px solid rgba(226,232,240,.15); text-align:center !important; color:#cbd5d1; font-size:.92rem; }
.auth-page-register .auth-wrapper { justify-content:stretch; padding-top:2.5rem; }
.auth-page-register .auth-card { max-width:680px; }
.auth-page-register .auth-card > form { max-width:none; }
.auth-page-register .form-group { margin-bottom:.8rem; }
.auth-page-register .sponsor-card { margin:.4rem 0 .9rem; }
.auth-page-register .auth-terms-check { display:flex; align-items:flex-start; gap:.7rem; margin:.75rem 0 1rem; color:#d8dfda; font-size:.84rem; line-height:1.45; }
.auth-page-register .auth-terms-check input { flex:0 0 auto; width:19px; height:19px; margin-top:.05rem; accent-color:var(--brand-primary); }
.auth-page-register .iti { width:100%; }
.lanceon-admin-welcome { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin:0 0 1rem; padding:.78rem 1rem; color:#f4f7f4; background:linear-gradient(105deg,rgba(57,255,20,.16),rgba(7,11,8,.95) 56%,rgba(57,255,20,.1)); border:1px solid var(--brand-primary); border-radius:12px; }
.lanceon-admin-welcome > div { display:flex; align-items:center; gap:.7rem; }
.lanceon-admin-welcome i, .lanceon-admin-welcome span strong { color:var(--brand-primary); }
.lanceon-admin-page-heading { align-items:center; }
.lanceon-admin-page-heading .page-title { font-size:clamp(1.55rem,2.5vw,2.3rem); font-weight:800; }
.lanceon-admin-tabs { border-color:rgba(148,163,184,.36); border-radius:15px; background:rgba(7,11,8,.78); }
.lanceon-admin-tabs .tab-link.active { color:var(--brand-primary); background:rgba(57,255,20,.12); border-color:var(--brand-primary); box-shadow:0 0 16px rgba(57,255,20,.12); }
.lanceon-admin-liquidity { position:relative; overflow:hidden; padding:1.25rem; background:linear-gradient(115deg,rgba(57,255,20,.13),transparent 60%),var(--bg-card); }
.lanceon-admin-liquidity::after { content:""; position:absolute; inset:0 0 0 auto; width:38%; pointer-events:none; background:linear-gradient(132deg,transparent 0 42%,rgba(57,255,20,.1) 42.3% 44%,transparent 44.3% 55%,rgba(57,255,20,.08) 55.3% 57%,transparent 57.3%); }
.lanceon-admin-liquidity > * { position:relative; z-index:1; }
.mobile-topbar-brand { display:none; }
@media (max-width: 1040px) and (min-width: 769px) {
    .auth-page-login .auth-wrapper { grid-template-columns:minmax(0,1fr) minmax(380px,.95fr); gap:2rem; padding:2rem; }
    .auth-brand-message h1 { font-size:clamp(2.5rem,5vw,4rem); }
    .auth-brand-hero img { width:min(82%,360px); margin-bottom:2rem; }
}
@media (max-width: 768px) {
    .auth-page-login .auth-wrapper { display:flex; min-height:100svh; flex-direction:column; align-items:stretch; justify-content:flex-start; gap:0; padding:max(5rem,calc(env(safe-area-inset-top) + 4rem)) 1rem 2rem; background:#020503; }
    .auth-page-login .auth-wrapper::before { inset:0 0 auto; height:40vh; background:linear-gradient(180deg,rgba(2,5,3,.12),#020503 95%),url("../images/lanceon-gavel-background.jpeg") center 34% / cover no-repeat; opacity:.36; }
    .auth-page-login .auth-wrapper::after { left:-32%; bottom:auto; top:-16%; width:130%; height:40vh; background:linear-gradient(132deg,transparent 0 39%,rgba(57,255,20,.18) 39.2% 40.5%,transparent 40.7% 48%,rgba(57,255,20,.11) 48.2% 49.2%,transparent 49.4%); }
    .auth-page-login .auth-brand-hero { width:100%; max-width:480px; margin:0 auto 1rem; text-align:center; }
    .auth-brand-hero img { width:min(62vw,230px); margin:0 auto; }
    .auth-brand-message, .auth-brand-points { display:none; }
    .auth-page-login .auth-card { width:100%; max-width:480px; margin:0 auto; padding:1rem .25rem 1.25rem; background:transparent; border:0; border-radius:0; box-shadow:none; backdrop-filter:none; }
    .auth-page-login .auth-form-title { font-size:clamp(1.85rem,7vw,2.35rem) !important; }
    .auth-page-login .auth-form-subtitle { margin-bottom:1.25rem !important; font-size:.95rem; }
    .auth-page-login .auth-topbar { z-index:60; }
    .auth-page-register .auth-wrapper { padding-top:max(5rem,calc(env(safe-area-inset-top) + 4rem)); }
    .auth-page-register .auth-brand-hero { width:100%; margin-bottom:.65rem; }
    .auth-page-register .auth-card { padding-top:.35rem; }
    .auth-page-register .auth-form-title { margin-bottom:.2rem !important; }
    .auth-page-register .auth-form-subtitle { margin-bottom:1rem !important; }
    .auth-page-register .auth-terms-check { font-size:.78rem; }
    .mobile-menu-btn { display:inline-flex !important; }
    .mobile-topbar-brand { position:absolute; left:50%; top:50%; display:block; width:38px; height:38px; transform:translate(-50%,-50%); }
    .mobile-topbar-brand img { display:block; width:100%; height:100%; object-fit:contain; }
    .topbar-title-text { max-width:130px; }
    .topbar-heading { visibility:hidden; }
    .sidebar { display:flex !important; position:fixed; top:0; bottom:0; left:0; width:min(310px,86vw); z-index:130; transform:translateX(-105%); box-shadow:18px 0 48px rgba(0,0,0,.5); }
    .sidebar.open { transform:translateX(0); }
    .sidebar-backdrop { display:block !important; position:fixed; inset:0; z-index:120; background:rgba(0,0,0,.65); opacity:0; visibility:hidden; transition:opacity .2s ease,visibility .2s ease; }
    .sidebar-backdrop.active { opacity:1; visibility:visible; }
    .mobile-bottom-nav { grid-template-columns:repeat(4,minmax(0,1fr)); }
    .mobile-menu-shortcut { padding:0; color:var(--text-secondary); background:transparent; border:0; cursor:pointer; font-family:inherit; }
    .lanceon-admin-welcome { align-items:flex-start; flex-direction:column; gap:.2rem; padding:.72rem .8rem; font-size:.82rem; }
    .lanceon-admin-page-heading { align-items:stretch; }
    .lanceon-admin-page-heading > div:last-child { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)); }
    .lanceon-admin-page-heading > div:last-child .btn { min-width:0; white-space:normal; font-size:.67rem; }
    .lanceon-admin-tabs { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; }
    .lanceon-admin-tabs::-webkit-scrollbar { display:none; }
    .lanceon-admin-tabs .tab-link { flex:0 0 auto; }
}
@media (max-width: 420px) {
    .auth-page-login .auth-wrapper { padding-left:.9rem; padding-right:.9rem; }
    .auth-page-login .form-label { font-size:.85rem; }
    .auth-page-login .form-control { min-height:49px; }
    .lanceon-admin-page-heading > div:last-child { grid-template-columns:1fr; }
}
/* Reverse auctions */
.auction-product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(245px,1fr));gap:1rem;align-items:stretch}
.auction-product-card{overflow:hidden;border:1px solid rgba(57,255,20,.35);border-radius:18px;background:linear-gradient(155deg,rgba(7,36,20,.96),rgba(5,13,10,.98));box-shadow:0 10px 32px rgba(0,0,0,.25);display:flex;flex-direction:column}
.auction-product-image{width:100%;height:190px;object-fit:cover;background:#07120c;border-bottom:1px solid rgba(57,255,20,.22)}
.auction-image-placeholder{display:grid;place-items:center;color:var(--brand-primary);font-size:3rem}
.auction-product-content{padding:1rem;display:flex;flex-direction:column;flex:1}
.auction-tag{align-self:flex-start;color:var(--brand-primary);text-transform:uppercase;font-size:.7rem;font-weight:800;letter-spacing:.09em}
.auction-product-content h2{font-size:1.1rem;line-height:1.35;margin:.45rem 0}.auction-product-content>p{font-size:.84rem;color:var(--text-secondary);line-height:1.55;flex:1}
.auction-price-label,.auction-meta,.auction-current-bid{font-size:.8rem;color:var(--text-secondary)}.auction-price{font-size:1.55rem;margin:.15rem 0 .6rem;color:var(--text-primary)}
.auction-meta{display:flex;justify-content:space-between;gap:.6rem;margin:.45rem 0}.auction-current-bid{display:flex;justify-content:space-between;padding:.6rem;border-radius:9px;background:rgba(57,255,20,.07);margin:.45rem 0}.auction-current-bid strong{color:var(--brand-primary)}
.auction-bid-form{margin-top:.55rem}.auction-bid-row,.auction-pay-row{display:flex;gap:.55rem;align-items:center}.auction-bid-row .form-control,.auction-pay-row .form-control{min-width:0;flex:1}.auction-bid-row .btn{white-space:nowrap}
.auction-carousel-track{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.75rem}.auction-mini-card{display:flex;min-width:0;flex-direction:column;gap:.35rem;padding:.65rem;border:1px solid var(--border-subtle);border-radius:12px;background:var(--surface-card);color:var(--text-primary);text-decoration:none}.auction-mini-card img,.auction-mini-card .auction-image-placeholder{width:100%;height:100px;object-fit:cover;border-radius:8px}.auction-mini-title{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.auction-mini-card>strong{color:var(--brand-primary)}.auction-mini-card>small{color:var(--text-secondary)}
.auction-awards-card{margin-bottom:1.25rem}.auction-award-row{padding:1rem 0;border-top:1px solid var(--border-subtle)}.auction-award-row>div:first-child p{color:var(--text-secondary);margin:.25rem 0 .8rem}.auction-address-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}.auction-pay-row{margin-top:.7rem}.auction-payment-box{margin-top:.8rem;padding:.8rem;border:1px solid var(--border-subtle);border-radius:10px;background:rgba(57,255,20,.04)}.auction-payment-box small{display:block;color:var(--text-secondary);margin-top:.45rem;line-height:1.5}.auction-payment-box textarea{margin-top:.5rem}
@media(max-width:900px){.auction-carousel-track{grid-template-columns:repeat(2,minmax(0,1fr))}.auction-carousel-track>.auction-mini-card:nth-child(n+5){display:none}}
@media(max-width:600px){.auction-product-grid{grid-template-columns:1fr}.auction-product-image{height:215px}.auction-address-grid{grid-template-columns:1fr}.auction-pay-row,.auction-bid-row{align-items:stretch;flex-direction:column}.auction-pay-row>* ,.auction-bid-row>*{width:100%}.auction-carousel-track{grid-template-columns:repeat(2,minmax(0,1fr))}}