:root { color-scheme: light; --brand-rgb: 16 185 129; --panel-blur: 14px; }
        body {
            background:
                radial-gradient(circle at 8% 0%, rgb(var(--brand-rgb) / 0.13), transparent 28rem),
                radial-gradient(circle at 92% 18%, rgba(56,189,248,0.09), transparent 24rem),
                linear-gradient(135deg, #070809 0%, #101215 50%, #08090b 100%);
        }
        .lux-panel {
            background: linear-gradient(145deg, rgba(22,25,30,0.88), rgba(12,14,17,0.78));
            border: 1px solid rgba(255,255,255,0.08);
            box-shadow: 0 4px 12px rgba(0,0,0,0.14);
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }
        .lux-card {
            background: rgba(12,14,17,0.72);
            border: 1px solid rgba(255,255,255,0.08);
            box-shadow: none;
        }
        .fade-in { animation: fadeIn 180ms ease-out forwards; }
        .slide-up { animation: slideUp 180ms ease-out forwards; }
        .no-scrollbar::-webkit-scrollbar { display: none; }
        .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
        ::-webkit-scrollbar { width: 7px; height: 7px; }
        ::-webkit-scrollbar-track { background: #08090b; }
        ::-webkit-scrollbar-thumb { background: #303640; border-radius: 999px; }
        .brand-logo-img { object-fit: cover; }
        .progress-track { background: rgba(255,255,255,0.08); }
        .progress-fill { background: linear-gradient(90deg, rgb(var(--brand-rgb)), #f7c46c); transition: none; }
        :root {
            color-scheme: light;
            --app-bg: #f6f8fb;
            --panel-bg: rgba(255,255,255,0.94);
            --panel-soft: #eef2f7;
            --line: rgba(15,23,42,0.10);
            --ink: #0f172a;
            --muted-ink: #64748b;
        }
        body {
            color: var(--ink) !important;
            background:
                radial-gradient(circle at 10% -10%, rgb(var(--brand-rgb) / 0.14), transparent 28rem),
                radial-gradient(circle at 92% 10%, rgba(56,189,248,0.13), transparent 24rem),
                linear-gradient(135deg, #f8fafc 0%, #f6f8fb 48%, #eef2f7 100%) !important;
        }
        .lux-panel {
            background: var(--panel-bg) !important;
            border: 1px solid var(--line) !important;
            box-shadow: 0 4px 14px rgba(15,23,42,0.045) !important;
            backdrop-filter: none;
            -webkit-backdrop-filter: none;
        }
        .lux-card {
            background: rgba(248,250,252,0.88) !important;
            border: 1px solid var(--line) !important;
            box-shadow: none !important;
        }
        .premium-bg { background: linear-gradient(135deg, #f8fafc, #eef2f7) !important; }
        .progress-track { background: rgba(15,23,42,0.09) !important; }
        ::-webkit-scrollbar-track { background: #eef2f7 !important; }
        ::-webkit-scrollbar-thumb { background: #cbd5e1 !important; border-radius: 999px; }
        .text-white, .text-gray-300, .text-neutral-300 { color: var(--ink) !important; }
        .text-neutral-400, .text-neutral-500, .text-muted, .text-slate-300 { color: var(--muted-ink) !important; }
        .bg-black\/25, .bg-black\/30, .bg-black\/35, .bg-black\/40, .bg-black\/45, .bg-black\/60, .bg-black\/65, .bg-black\/75, .bg-black\/80, .bg-black\/85, .bg-black\/90, .bg-black\/95, .bg-\[\#08090b\] { background-color: rgba(248,250,252,0.92) !important; }
        .bg-white\/5, .bg-white\/10 { background-color: rgba(255,255,255,0.76) !important; }
        .border-white\/10, .border-white\/20 { border-color: var(--line) !important; }
        .divide-white\/10 > :not([hidden]) ~ :not([hidden]) { border-color: var(--line) !important; }
        input, textarea, select {
            background-color: rgba(255,255,255,0.94) !important;
            border-color: var(--line) !important;
            color: var(--ink) !important;
            box-shadow: none;
        }
        input::placeholder, textarea::placeholder { color: #94a3b8 !important; }
        option { color: var(--ink); background: #ffffff; }
        thead, .mini-label { color: var(--muted-ink) !important; }
        #project-modal, #payment-modal, #revision-modal, #refund-modal, #chat-modal, #chat-overlay, #support-overlay, #freelancer-modal { background: rgba(15,23,42,0.38) !important; }
        #chat-drawer, #support-drawer { background: rgba(255,255,255,0.98) !important; }
        #chat-box, #admin-chat-box, #support-message-list { background: #f8fafc !important; }
        #toast-notification { color: var(--ink) !important; }
        .select-mini { background: rgba(255,255,255,0.95) !important; border-color: var(--line) !important; color: var(--ink) !important; }
        .mobile-chat-drawer { overflow: hidden; }
        .chat-header { flex-shrink: 0; }
        .chat-messages { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
        .chat-composer { flex-shrink: 0; }
        @media (max-width: 639px) {
            html.chat-scroll-locked, body.chat-scroll-locked { height: 100dvh; overflow: hidden !important; }
            .mobile-chat-drawer {
                inset: 0 !important;
                width: 100vw !important;
                max-width: 100vw !important;
                height: 100dvh !important;
                max-height: 100dvh !important;
                border-left: 0 !important;
                border-radius: 0 !important;
                overflow: hidden !important;
            }
            .chat-header { position: sticky; top: 0; z-index: 10; padding: max(1rem, env(safe-area-inset-top)) 1rem 1rem !important; }
            .chat-messages { padding: 1rem !important; }
            .chat-composer { position: sticky; bottom: 0; padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)) !important; }
            .chat-composer textarea { min-height: 3rem !important; }
        }

        .app-card {
            background: rgba(255,255,255,0.92) !important;
            border: 1px solid var(--line) !important;
            border-radius: 1.25rem;
            box-shadow: 0 3px 10px rgba(15,23,42,0.04) !important;
        }
        .app-card-soft {
            background: rgba(248,250,252,0.86) !important;
            border: 1px solid rgba(15,23,42,0.08) !important;
            border-radius: 1rem;
        }
        .btn-primary, .btn-secondary, .btn-danger, .btn-ghost {
            min-height: 2.75rem;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: .5rem;
            border-radius: .9rem;
            padding: .7rem 1rem;
            font-size: .875rem;
            font-weight: 900;
            line-height: 1;
            transition: border-color .16s ease, background-color .16s ease, color .16s ease, opacity .16s ease;
        }
        .btn-primary { background: rgb(var(--brand-rgb)) !important; color: #020617 !important; box-shadow: 0 5px 12px rgb(var(--brand-rgb) / .12); }
        .btn-secondary { background: rgb(var(--brand-rgb) / .10) !important; color: rgb(var(--brand-rgb)) !important; border: 1px solid rgb(var(--brand-rgb) / .22) !important; }
        .btn-danger { background: rgba(251,113,133,.10) !important; color: #e11d48 !important; border: 1px solid rgba(251,113,133,.22) !important; }
        .btn-ghost { background: rgba(255,255,255,.72) !important; color: var(--ink) !important; border: 1px solid var(--line) !important; }
        .btn-primary:disabled, .btn-secondary:disabled, .btn-danger:disabled, .btn-ghost:disabled { opacity: .55; cursor: not-allowed; }
        .badge-success, .badge-warning, .badge-danger, .badge-neutral {
            display: inline-flex;
            align-items: center;
            width: fit-content;
            border-radius: 999px;
            padding: .35rem .65rem;
            font-size: .68rem;
            font-weight: 900;
            line-height: 1;
            text-transform: uppercase;
            letter-spacing: .04em;
            border: 1px solid transparent;
            white-space: nowrap;
        }
        .badge-success { background: rgb(var(--brand-rgb) / .10) !important; color: rgb(var(--brand-rgb)) !important; border-color: rgb(var(--brand-rgb) / .22) !important; }
        .badge-warning { background: rgba(247,196,108,.14) !important; color: #b7791f !important; border-color: rgba(247,196,108,.28) !important; }
        .badge-danger { background: rgba(251,113,133,.12) !important; color: #e11d48 !important; border-color: rgba(251,113,133,.25) !important; }
        .badge-neutral { background: rgba(15,23,42,.06) !important; color: var(--muted-ink) !important; border-color: rgba(15,23,42,.09) !important; }
        .tab-btn {
            min-height: 2.5rem;
            border-radius: .85rem;
            padding: .65rem .9rem;
            color: var(--muted-ink) !important;
            font-size: .78rem;
            font-weight: 900;
            white-space: nowrap;
        }
        .tab-btn.active { background: rgb(var(--brand-rgb) / .12) !important; color: rgb(var(--brand-rgb)) !important; border: 1px solid rgb(var(--brand-rgb) / .22) !important; }
        .empty-state { border: 1px dashed rgba(15,23,42,.14); border-radius: 1.25rem; padding: 1.25rem; color: var(--muted-ink); text-align: center; background: rgba(248,250,252,.72); }
        .more-menu-panel {
            position: absolute;
            right: 0;
            top: calc(100% + .5rem);
            z-index: 45;
            min-width: 13rem;
            padding: .45rem;
            border-radius: 1rem;
            border: 1px solid var(--line);
            background: rgba(255,255,255,.98);
            box-shadow: 0 6px 16px rgba(15,23,42,.08);
        }
        .more-menu-panel button {
            width: 100%;
            min-height: 2.4rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: .75rem;
            border-radius: .75rem;
            padding: .65rem .75rem;
            color: var(--ink);
            font-size: .78rem;
            font-weight: 850;
            text-align: left;
        }
        .more-menu-panel button:hover { background: rgba(15,23,42,.05); }
        .project-action-menu {
            width: min(92vw, 15rem);
            border-radius: 1.1rem;
            border: 1px solid var(--line);
            background: rgba(255,255,255,.98);
            box-shadow: 0 8px 18px rgba(15,23,42,.10);
            overflow: hidden;
        }
        .project-action-menu button {
            width: 100%;
            min-height: 3rem;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: .75rem;
            border-radius: .8rem;
            padding: .72rem .85rem;
            color: var(--ink);
            font-size: .82rem;
            font-weight: 900;
            text-align: left;
        }
        .project-action-menu button:hover { background: rgba(15,23,42,.055); }
        .project-action-menu button:disabled { opacity: .52; cursor: not-allowed; }
        .project-action-backdrop { background: rgba(15,23,42,.44); }
        .client-room-ready-panel {
            position: fixed;
            right: 1.25rem;
            bottom: 1.25rem;
            z-index: 92;
            width: min(92vw, 28rem);
            border: 1px solid rgba(15,23,42,.12);
            border-radius: 1.25rem;
            background: rgba(255,255,255,.98);
            box-shadow: 0 18px 46px rgba(15,23,42,.16);
            padding: 1rem;
            color: var(--ink);
        }
        .client-room-ready-panel.hidden { display: none !important; }
        .client-room-ready-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: .9rem;
            margin-bottom: .85rem;
        }
        .client-room-ready-kicker {
            margin: 0 0 .25rem;
            color: rgb(var(--brand-rgb));
            font-size: .66rem;
            font-weight: 950;
            letter-spacing: .18em;
            text-transform: uppercase;
        }
        .client-room-ready-head h3 {
            margin: 0;
            font-size: 1rem;
            line-height: 1.2;
            font-weight: 950;
            color: var(--ink);
        }
        .client-room-ready-close {
            width: 2.75rem;
            height: 2.75rem;
            min-width: 2.75rem;
            min-height: 2.75rem;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1px solid rgba(15,23,42,.1);
            border-radius: .9rem;
            color: var(--muted-ink);
            background: #fff;
        }
        .client-room-ready-message {
            max-height: 14rem;
            margin: 0;
            overflow: auto;
            white-space: pre-wrap;
            word-break: break-word;
            border: 1px solid rgba(15,23,42,.1);
            border-radius: 1rem;
            background: rgba(248,250,252,.9);
            padding: .9rem;
            color: #334155;
            font: 800 .82rem/1.55 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
        }
        .client-room-ready-actions {
            display: grid;
            grid-template-columns: 1fr;
            gap: .55rem;
            margin-top: .85rem;
        }
        .client-room-ready-actions .btn-primary,
        .client-room-ready-actions .btn-secondary {
            width: 100%;
            min-height: 48px;
            border-radius: 1rem;
            justify-content: center;
            text-align: center;
        }
        @media (max-width: 639px) {
            .project-action-menu {
                width: 100vw !important;
                max-width: 100vw !important;
                left: 0 !important;
                right: 0 !important;
                top: auto !important;
                bottom: 0 !important;
                border-radius: 1.5rem 1.5rem 0 0;
                padding-bottom: env(safe-area-inset-bottom);
            }
            .project-action-menu button {
                min-height: 48px;
                padding: .8rem .95rem;
                font-size: .9rem;
            }
            .client-room-ready-panel {
                left: 0;
                right: 0;
                bottom: 0;
                width: 100vw;
                max-width: 100vw;
                border-right: 0;
                border-bottom: 0;
                border-left: 0;
                border-radius: 1.35rem 1.35rem 0 0;
                padding: 1rem;
                padding-bottom: calc(1rem + env(safe-area-inset-bottom));
                box-shadow: none;
            }
            .client-room-ready-message {
                max-height: 34vh;
            }
        }
        .detail-section { border-radius: 1.25rem; border: 1px solid var(--line); background: rgba(248,250,252,.74); padding: 1rem; }
        @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
        @keyframes slideUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
        }

/* Product UX polish */
:root {
    --focus-ring: rgba(37, 99, 235, .32);
    --press-shadow: 0 7px 16px rgba(15, 23, 42, .08);
    --press-shadow-soft: 0 4px 10px rgba(15, 23, 42, .06);
}

html, body { max-width: 100%; overflow-x: hidden; }

button, a, input, textarea, select { -webkit-tap-highlight-color: transparent; }

.btn-primary, .btn-secondary, .btn-danger, .btn-ghost, .nav-btn, .nav-btn-mobile, button.bg-brand {
    transition: transform .14s ease, border-color .14s ease, background-color .14s ease, color .14s ease, opacity .14s ease;
}

@media (hover: hover) and (pointer: fine) {
    .btn-primary:not(:disabled):hover, .btn-secondary:not(:disabled):hover, .btn-danger:not(:disabled):hover, .btn-ghost:not(:disabled):hover,
    .nav-btn:not(:disabled):hover, .nav-btn-mobile:not(:disabled):hover, button.bg-brand:not(:disabled):hover {
        transform: translateY(-1px);
    }
}

.btn-primary:not(:disabled):active, .btn-secondary:not(:disabled):active, .btn-danger:not(:disabled):active, .btn-ghost:not(:disabled):active,
.nav-btn:not(:disabled):active, .nav-btn-mobile:not(:disabled):active, button.bg-brand:not(:disabled):active {
    transform: translateY(2px) scale(.98);
}

button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
    outline: 3px solid var(--focus-ring) !important;
    outline-offset: 3px;
}

.btn-primary, .btn-secondary, .btn-danger, .btn-ghost {
    min-height: 48px;
    border-radius: 12px;
    padding: .8rem 1.05rem;
    font-size: .9rem;
    box-shadow: 0 3px 8px rgba(15, 23, 42, .04);
}

button.bg-brand {
    min-height: 48px;
    border-radius: 12px !important;
}

.btn-primary { box-shadow: 0 5px 12px rgb(var(--brand-rgb) / .12); }
.btn-danger { box-shadow: 0 4px 10px rgba(225, 29, 72, .06); }

.transition-all {
    transition-property: transform, background-color, border-color, color, opacity !important;
}

.shadow-premium, .shadow-glass {
    box-shadow: 0 5px 14px rgba(15, 23, 42, .06) !important;
}

.shadow-brand {
    box-shadow: 0 5px 12px rgb(var(--brand-rgb) / .12) !important;
}

.backdrop-blur-xl { --tw-backdrop-blur: blur(0px) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.backdrop-blur-sm { --tw-backdrop-blur: blur(0px) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }

.nav-btn, .nav-btn-mobile {
    border-radius: 12px !important;
}

.ux-onboarding {
    background:
        linear-gradient(135deg, rgba(255,255,255,.96), rgba(248,250,252,.90)),
        radial-gradient(circle at top right, rgb(var(--brand-rgb) / .16), transparent 18rem) !important;
}

.ux-step {
    display: flex;
    align-items: flex-start;
    gap: .8rem;
    border: 1px solid rgba(15,23,42,.08);
    border-radius: 16px;
    background: rgba(255,255,255,.74);
    padding: .9rem;
}

.ux-step > span {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgb(var(--brand-rgb));
    background: rgb(var(--brand-rgb) / .10);
    border: 1px solid rgb(var(--brand-rgb) / .18);
    flex-shrink: 0;
}

.ux-step p {
    color: var(--ink);
    font-size: .9rem;
    font-weight: 900;
    line-height: 1.25;
}

.ux-step small {
    display: block;
    color: var(--muted-ink);
    font-size: .78rem;
    line-height: 1.35;
    margin-top: .18rem;
}

#project-list-section table th, #project-list-section table td { vertical-align: middle; }

@media (max-width: 639px) {
    .btn-primary, .btn-secondary, .btn-danger, .btn-ghost, button.bg-brand { min-height: 50px; font-size: .92rem; }
    main { padding-left: 1rem !important; padding-right: 1rem !important; }
    #project-modal .tab-btn { min-height: 44px; }
    .backdrop-blur-xl, .backdrop-blur-sm {
        --tw-backdrop-blur: blur(0) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .btn-primary, .btn-secondary, .btn-danger, .btn-ghost, .nav-btn, .nav-btn-mobile, button.bg-brand { transition: none !important; }
    .btn-primary:hover, .btn-primary:active, .btn-secondary:hover, .btn-secondary:active, .btn-danger:hover, .btn-danger:active, .btn-ghost:hover, .btn-ghost:active, .nav-btn:hover, .nav-btn:active, .nav-btn-mobile:hover, .nav-btn-mobile:active, button.bg-brand:hover, button.bg-brand:active { transform: none !important; }
}
/* Shamno smoothness pass */
:root {
    --panel-blur: 0px;
    --focus-ring: rgba(37, 99, 235, .32);
    --surface-shadow: 0 4px 14px rgba(15, 23, 42, .045);
    --surface-shadow-soft: 0 3px 10px rgba(15, 23, 42, .035);
}

.lux-panel {
    background: rgba(255,255,255,.96) !important;
    border: 1px solid var(--line) !important;
    box-shadow: var(--surface-shadow) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

.lux-card,
.app-card-soft,
.detail-section,
.empty-state {
    background: rgba(248,250,252,.86) !important;
    border: 1px solid var(--line) !important;
    box-shadow: none !important;
}

.app-card {
    background: rgba(255,255,255,.94) !important;
    border: 1px solid var(--line) !important;
    box-shadow: var(--surface-shadow-soft) !important;
}

input, textarea, select { box-shadow: none !important; }
.shadow-premium,
.shadow-glass { box-shadow: 0 5px 14px rgba(15, 23, 42, .06) !important; }
.shadow-brand { box-shadow: 0 5px 12px rgb(var(--brand-rgb) / .12) !important; }
.backdrop-blur-xl,
.backdrop-blur-sm {
    --tw-backdrop-blur: blur(0px) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.transition-all { transition-property: transform, background-color, border-color, color, opacity !important; }
.duration-300 { transition-duration: 180ms !important; }
.fade-in { animation: fadeIn 180ms ease-out forwards; }
.slide-up { animation: slideUp 180ms ease-out forwards; }
.animate-pulse { animation: none !important; }
.progress-fill { transition: none !important; }

.btn-primary,
.btn-secondary,
.btn-danger,
.btn-ghost,
.nav-btn,
.nav-btn-mobile,
.client-tab-btn,
#mobile-chat-cta,
button.bg-brand {
    transition: transform 140ms ease, background-color 140ms ease, color 140ms ease, border-color 140ms ease, opacity 140ms ease !important;
    will-change: auto;
}

.btn-primary,
.btn-secondary,
.btn-danger,
.btn-ghost { box-shadow: none !important; }
.btn-primary,
button.bg-brand { box-shadow: 0 5px 12px rgb(var(--brand-rgb) / .12) !important; }
.btn-danger { box-shadow: 0 4px 10px rgba(225, 29, 72, .06) !important; }

@media (hover: hover) and (pointer: fine) {
    .btn-primary:not(:disabled):hover,
    .btn-secondary:not(:disabled):hover,
    .btn-danger:not(:disabled):hover,
    .btn-ghost:not(:disabled):hover,
    .nav-btn:not(:disabled):hover,
    .nav-btn-mobile:not(:disabled):hover,
    .client-tab-btn:not(:disabled):hover,
    #mobile-chat-cta:not(:disabled):hover,
    button.bg-brand:not(:disabled):hover {
        transform: translateY(-1px);
    }
}

.btn-primary:not(:disabled):active,
.btn-secondary:not(:disabled):active,
.btn-danger:not(:disabled):active,
.btn-ghost:not(:disabled):active,
.nav-btn:not(:disabled):active,
.nav-btn-mobile:not(:disabled):active,
.client-tab-btn:not(:disabled):active,
#mobile-chat-cta:not(:disabled):active,
button.bg-brand:not(:disabled):active {
    transform: translateY(2px) scale(.98);
}

@media (hover: none), (pointer: coarse) {
    .btn-primary:not(:disabled):hover,
    .btn-secondary:not(:disabled):hover,
    .btn-danger:not(:disabled):hover,
    .btn-ghost:not(:disabled):hover,
    .nav-btn:not(:disabled):hover,
    .nav-btn-mobile:not(:disabled):hover,
    .client-tab-btn:not(:disabled):hover,
    #mobile-chat-cta:not(:disabled):hover,
    button.bg-brand:not(:disabled):hover {
        transform: none !important;
    }
    .btn-primary:not(:disabled):active,
    .btn-secondary:not(:disabled):active,
    .btn-danger:not(:disabled):active,
    .btn-ghost:not(:disabled):active,
    .nav-btn:not(:disabled):active,
    .nav-btn-mobile:not(:disabled):active,
    .client-tab-btn:not(:disabled):active,
    #mobile-chat-cta:not(:disabled):active,
    button.bg-brand:not(:disabled):active {
        transform: translateY(2px) scale(.98) !important;
    }
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 3px solid var(--focus-ring) !important;
    outline-offset: 3px;
}

@media (max-width: 639px) {
    .lux-panel,
    .lux-card,
    .app-card,
    .app-card-soft,
    .detail-section,
    .empty-state,
    .shadow-premium,
    .shadow-glass,
    .shadow-brand {
        box-shadow: none !important;
    }
    .duration-300 { transition-duration: 160ms !important; }
    .btn-primary,
    .btn-secondary,
    .btn-danger,
    .btn-ghost,
    button.bg-brand { min-height: 48px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .animate-pulse,
    .fa-spin { animation: none !important; }
    .btn-primary:hover,
    .btn-primary:active,
    .btn-secondary:hover,
    .btn-secondary:active,
    .btn-danger:hover,
    .btn-danger:active,
    .btn-ghost:hover,
    .btn-ghost:active,
    .nav-btn:hover,
    .nav-btn:active,
    .nav-btn-mobile:hover,
    .nav-btn-mobile:active,
    .client-tab-btn:hover,
    .client-tab-btn:active,
    #mobile-chat-cta:hover,
    #mobile-chat-cta:active,
    button.bg-brand:hover,
    button.bg-brand:active { transform: none !important; }
}
/* Admin smoothness targets */
#subscription-gate,
#auth-wrapper,
#activity-overlay,
#support-overlay,
#project-modal,
#chat-modal,
.project-action-backdrop {
    background: rgba(15,23,42,.42) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#activity-center,
#support-drawer,
.mobile-chat-drawer { box-shadow: 0 6px 18px rgba(15,23,42,.08) !important; }
.more-menu-panel,
.project-action-menu { box-shadow: 0 6px 16px rgba(15,23,42,.08) !important; }
#project-list-section tbody tr { transition: background-color 140ms ease, color 140ms ease; }

@media (max-width: 639px) {
    #activity-center,
    #support-drawer,
    .mobile-chat-drawer,
    .more-menu-panel,
    .project-action-menu { box-shadow: none !important; }
}
/* Admin compact dashboard top area */
#section-overview > header {
    margin-bottom: 1rem !important;
}

.admin-status-strip {
    padding: .75rem 1rem !important;
    margin-bottom: .75rem !important;
    border-radius: 1rem !important;
    box-shadow: 0 3px 10px rgba(15,23,42,.04) !important;
}

.admin-status-strip .admin-strip-icon {
    width: 2rem !important;
    height: 2rem !important;
    border-radius: .75rem !important;
    font-size: .85rem;
}

.admin-status-title {
    font-size: .9rem;
    line-height: 1.15;
}

.admin-status-detail,
.admin-status-meta {
    line-height: 1.35;
}

.admin-status-detail {
    white-space: normal;
}

.admin-status-actions .btn-primary,
.admin-status-actions .btn-secondary,
.admin-strip-action {
    min-height: 42px !important;
    border-radius: 12px !important;
    padding: .65rem .9rem !important;
    white-space: nowrap;
}

.admin-first-room {
    padding: 1rem !important;
    margin-bottom: 1rem !important;
    border-radius: 1rem !important;
}

.admin-first-room h3 {
    line-height: 1.2;
}

.admin-onboarding-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .9rem;
}

.admin-onboarding-controls {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    flex-shrink: 0;
}

.admin-onboarding-icon-btn {
    width: 2.75rem;
    min-width: 2.75rem;
    height: 2.75rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .85rem;
    border: 1px solid var(--line);
    background: rgba(255,255,255,.82);
    color: var(--muted-ink);
}

.admin-onboarding-body {
    margin-top: .9rem;
}

.admin-onboarding-checklist {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: .55rem;
}

.admin-onboarding-item {
    min-width: 0;
    min-height: 3.1rem;
    display: flex;
    align-items: center;
    gap: .55rem;
    border: 1px solid var(--line);
    border-radius: .95rem;
    background: rgba(255,255,255,.76);
    padding: .65rem .7rem;
    color: var(--ink);
}

.admin-onboarding-item span {
    width: 1.45rem;
    min-width: 1.45rem;
    height: 1.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: rgba(15,23,42,.06);
    color: var(--muted-ink);
    font-size: .45rem;
}

.admin-onboarding-item p {
    min-width: 0;
    color: var(--ink);
    font-size: .78rem;
    font-weight: 900;
    line-height: 1.2;
}

.admin-onboarding-item.is-complete {
    border-color: rgb(var(--brand-rgb) / .22);
    background: rgb(var(--brand-rgb) / .07);
}

.admin-onboarding-item.is-complete span {
    background: rgb(var(--brand-rgb));
    color: #022c22;
    font-size: .68rem;
}

.admin-onboarding-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .55rem;
    margin-top: .75rem;
}

.admin-onboarding-actions .btn-primary,
.admin-onboarding-actions .btn-secondary,
.admin-onboarding-actions .btn-ghost {
    min-height: 48px !important;
    border-radius: .95rem !important;
}

.admin-onboarding-chips {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.admin-onboarding-chips .ux-step {
    min-height: 2.25rem;
    width: auto;
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    border-radius: 999px;
    padding: .45rem .7rem;
    background: rgb(var(--brand-rgb) / .08) !important;
    border: 1px solid rgb(var(--brand-rgb) / .16) !important;
    color: var(--ink);
    font-size: .78rem;
    font-weight: 900;
    line-height: 1;
    box-shadow: none !important;
}

.admin-onboarding-chips .ux-step i {
    color: rgb(var(--brand-rgb));
    font-size: .78rem;
}

.admin-primary-create-cta.hidden,
#first-room-onboarding.hidden,
#subscription-banner.hidden,
#free-tier-banner.hidden,
#expired-tier-banner.hidden {
    display: none !important;
}

#project-card-body,
#project-card-body .app-card,
#project-card-body .app-card * {
    min-width: 0;
}

#project-card-body .app-card h3,
#project-card-body .app-card p {
    overflow-wrap: anywhere;
}

#project-card-body [data-more] {
    min-width: 48px;
    min-height: 48px;
}

@media (max-width: 639px) {
    #section-overview > header {
        gap: .75rem !important;
        margin-bottom: .75rem !important;
    }

    #section-overview > header h2 {
        font-size: 1.75rem !important;
    }

    #section-overview > header p {
        margin-top: .35rem !important;
    }

    .admin-status-strip {
        padding: .75rem !important;
        margin-bottom: .65rem !important;
    }

    .admin-status-detail {
        white-space: normal;
    }

    .admin-status-actions {
        width: 100%;
    }

    .admin-status-actions .btn-primary,
    .admin-status-actions .btn-secondary,
    .admin-strip-action {
        width: 100%;
        min-height: 48px !important;
    }

    .admin-first-room {
        padding: .85rem !important;
    }

    .admin-onboarding-top {
        gap: .7rem;
    }

    .admin-onboarding-controls {
        gap: .35rem;
    }

    .admin-onboarding-icon-btn {
        width: 2.65rem;
        min-width: 2.65rem;
        height: 2.65rem;
    }

    .admin-onboarding-checklist {
        grid-template-columns: 1fr;
        gap: .45rem;
    }

    .admin-onboarding-item {
        min-height: 2.8rem;
        padding: .55rem .65rem;
    }

    .admin-onboarding-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .admin-onboarding-actions .btn-primary,
    .admin-onboarding-actions .btn-secondary,
    .admin-onboarding-actions .btn-ghost {
        width: 100%;
    }

    .admin-onboarding-chips {
        gap: .4rem;
    }

    .admin-onboarding-chips .ux-step {
        min-height: 2rem;
        padding: .42rem .6rem;
        font-size: .74rem;
    }
}

/* Admin More Options cleanup */
.admin-top-actions {
    justify-content: flex-end;
}

.admin-more-trigger {
    position: relative;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    border-radius: 1rem;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.06);
    color: var(--muted);
    padding: .7rem .9rem;
    font-size: .84rem;
    font-weight: 950;
    transition: transform .16s ease, background-color .16s ease, color .16s ease, border-color .16s ease, opacity .16s ease;
}

.admin-more-trigger:hover {
    color: rgb(var(--brand-rgb));
    border-color: rgb(var(--brand-rgb) / .32);
    background: rgb(var(--brand-rgb) / .08);
}

.admin-more-trigger:focus-visible,
.admin-more-row:focus-visible,
.admin-more-close:focus-visible {
    outline: 3px solid rgb(var(--brand-rgb) / .24);
    outline-offset: 3px;
}

.admin-more-trigger:not(:disabled):active,
.admin-more-row:not(:disabled):active,
.admin-more-close:not(:disabled):active,
.admin-more-full-action:not(:disabled):active {
    transform: translateY(2px) scale(.98);
}

.admin-mobile-more-trigger {
    width: 44px;
    padding: 0;
}

.admin-more-attention-badge,
.admin-more-mini-badge {
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 .28rem;
    border-radius: 999px;
    background: #e11d48;
    color: #fff;
    font-size: .62rem;
    font-weight: 950;
    line-height: 1.15rem;
    text-align: center;
}

.admin-more-attention-badge {
    position: absolute;
    top: -.35rem;
    right: -.35rem;
    border: 2px solid var(--bgDark);
}

.admin-more-drawer {
    background: rgba(255,255,255,.98) !important;
    color: var(--ink);
    border-left: 1px solid var(--line);
    box-shadow: 0 10px 26px rgba(15,23,42,.14) !important;
}

.admin-more-header {
    padding: 1.25rem;
    border-bottom: 1px solid var(--line);
    background: #fff;
}

.admin-more-drawer .text-white {
    color: var(--ink) !important;
}

.admin-more-drawer .text-muted {
    color: var(--muted-ink) !important;
}

.admin-more-close {
    width: 44px;
    min-width: 44px;
    height: 44px;
    border-radius: .9rem;
    border: 1px solid var(--line);
    color: var(--muted-ink);
    background: rgba(248,250,252,.86);
}

.admin-more-content {
    padding: 1rem;
    background: linear-gradient(180deg, #fff, rgba(248,250,252,.96));
}

.admin-more-card {
    margin: 0 0 .85rem !important;
    padding: 1rem !important;
    border-radius: 1rem !important;
    border: 1px solid var(--line) !important;
    background: rgba(255,255,255,.92) !important;
    box-shadow: 0 4px 12px rgba(15,23,42,.05) !important;
}

.admin-more-icon {
    width: 2.35rem;
    min-width: 2.35rem;
    height: 2.35rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .85rem;
}

.admin-more-button-row {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-top: .85rem;
}

.admin-more-button-row .btn-secondary,
.admin-more-button-row .btn-ghost,
.admin-more-full-action {
    min-height: 44px !important;
}

.admin-more-full-action {
    width: 100%;
    margin-top: .85rem;
}

.admin-more-action-list {
    display: grid;
    gap: .45rem;
}

.admin-more-row {
    width: 100%;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    border-radius: .9rem;
    border: 1px solid var(--line);
    background: rgba(248,250,252,.82);
    color: var(--ink);
    padding: .75rem .85rem;
    font-size: .86rem;
    font-weight: 900;
    transition: transform .16s ease, background-color .16s ease, color .16s ease, border-color .16s ease, opacity .16s ease;
}

.admin-more-row span:first-child {
    display: inline-flex;
    align-items: center;
    gap: .7rem;
}

.admin-more-row i {
    color: rgb(var(--brand-rgb));
}

.admin-more-row:hover {
    border-color: rgb(var(--brand-rgb) / .22);
    background: rgb(var(--brand-rgb) / .06);
}

.admin-more-row.danger i,
.admin-more-row.danger:hover {
    color: var(--danger);
}

.admin-more-insights {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .55rem;
}

.admin-more-insight {
    border-radius: .9rem;
    border: 1px solid var(--line);
    background: rgba(248,250,252,.86);
    padding: .75rem;
}

.admin-more-insight p {
    color: var(--muted-ink);
    font-size: .64rem;
    line-height: 1.2;
    font-weight: 950;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.admin-more-insight h3 {
    margin-top: .35rem;
    color: rgb(var(--brand-rgb));
    font-size: 1.25rem;
    font-weight: 950;
}

#section-overview .admin-strip-action,
#section-overview .admin-status-actions {
    display: none !important;
}

@media (max-width: 639px) {
    .admin-top-actions {
        width: 100%;
    }

    .admin-top-actions .admin-primary-create-cta,
    .admin-top-actions .admin-more-trigger {
        flex: 1 1 0;
        min-height: 48px;
    }

    .admin-more-drawer {
        top: auto !important;
        right: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        height: auto !important;
        max-width: 100vw !important;
        max-height: 88dvh;
        border-left: 0;
        border-radius: 1.4rem 1.4rem 0 0;
        transform: translateY(0) !important;
    }

    .admin-more-drawer.translate-x-full {
        transform: translateY(100%) !important;
    }

    .admin-more-header {
        padding: 1rem;
    }

    .admin-more-close {
        width: 48px;
        min-width: 48px;
        height: 48px;
    }

    .admin-more-content {
        padding: .85rem .85rem calc(.85rem + env(safe-area-inset-bottom));
    }

    .admin-more-insights {
        grid-template-columns: 1fr;
    }
}

@media (hover: none), (pointer: coarse) {
    .admin-more-trigger:hover,
    .admin-more-row:hover {
        transform: none;
    }
}
@media (prefers-reduced-motion: reduce) {
    .admin-more-trigger,
    .admin-more-row,
    .admin-more-drawer,
    #admin-more-overlay {
        transition: none !important;
    }

    .admin-more-trigger:active,
    .admin-more-row:active,
    .admin-more-close:active,
    .admin-more-full-action:active {
        transform: none !important;
    }
}

/* Final admin mobile polish: card-first dashboard, safe drawers, resilient text */
#section-overview,
#project-list-section,
#project-card-body,
#project-card-body .app-card {
    min-width: 0;
}

#action-center-list [data-title],
#action-center-list [data-task],
#project-card-body .app-card h3,
#project-card-body .app-card p,
.admin-status-title,
.admin-status-detail,
.admin-more-row,
.admin-more-card {
    overflow-wrap: anywhere;
}

@media (max-width: 639px) {
    main {
        padding: .85rem !important;
        padding-bottom: calc(1rem + env(safe-area-inset-bottom)) !important;
    }

    .admin-top-actions {
        gap: .5rem !important;
    }

    .admin-top-actions .admin-primary-create-cta,
    .admin-top-actions .admin-more-trigger {
        border-radius: .95rem !important;
        white-space: normal;
        text-align: center;
    }

    .admin-status-strip .flex {
        min-width: 0;
    }

    #action-center-list > div {
        padding: .85rem !important;
    }

    #action-center-list [data-action] {
        width: 100%;
        min-height: 48px;
        border-radius: .95rem;
    }

    #project-search,
    #stage-filter,
    #payment-filter {
        min-height: 48px;
        border-radius: .95rem !important;
    }

    #project-list-section {
        border-radius: 1.1rem !important;
    }

    #project-list-section > div:first-child {
        padding: .95rem !important;
    }

    #project-card-body {
        padding: .75rem !important;
        gap: .65rem;
    }

    #project-card-body .app-card {
        border-radius: 1rem !important;
        padding: .85rem !important;
        box-shadow: none !important;
    }

    #project-card-body .app-card h3 {
        font-size: .98rem;
        line-height: 1.2;
    }

    #project-card-body .app-card [data-payment] {
        max-width: 42%;
        white-space: normal;
        text-align: center;
    }

    #project-card-body [data-edit],
    #project-card-body [data-more] {
        min-height: 48px !important;
        border-radius: .95rem !important;
    }

    .project-action-menu {
        max-height: min(82dvh, 34rem);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    .project-action-menu > div:first-child {
        position: sticky;
        top: 0;
        z-index: 2;
        background: #fff;
    }
}