:root {
    --encre: #14182B;
    --sable: #F6F3EC;
    --terre: #C2622D;
    --indigo-mali: #2A2F6B;
    --or-kmt: #D4A331;
    --vert-statut: #3C7A5C;
    --primary: var(--terre);
    --secondary: var(--encre);
    --success: var(--vert-statut);
    --gradient: linear-gradient(135deg, var(--terre) 0%, var(--encre) 100%);
    --gradient-r: linear-gradient(135deg, var(--encre) 0%, var(--vert-statut) 100%);
    --dark: var(--encre);
    --surface: var(--sable);
    --card-bg: #ffffff;
    --shadow-sm: 0 2px 8px rgba(16, 16, 16, 0.08);
    --shadow-md: 0 8px 32px rgba(16, 16, 16, 0.14);
    --shadow-lg: 0 20px 60px rgba(16, 16, 16, 0.18);
    --radius: 16px;
    --radius-lg: 24px;
}

*, *::before, *::after {
    box-sizing: border-box;
}

body {
    font-family: "Inter", sans-serif;
    background: var(--surface);
    color: #2d2d3a;
    -webkit-font-smoothing: antialiased;
}

h1, h2, .km-agent-title {
    font-family: "Fraunces", "Inter", serif;
}

.bg-brand { background: var(--gradient); }
.bg-brand-r { background: var(--gradient-r); }
.text-brand {
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.border-brand { border: 2px solid var(--primary); }

.card {
    background: var(--card-bg);
    border-radius: var(--radius);
    box-shadow: var(--shadow-sm);
    transition: box-shadow .25s, transform .25s;
}

.card:hover {
    box-shadow: var(--shadow-md);
    transform: translateY(-3px);
}

.card-lg { border-radius: var(--radius-lg); }

.glass-card {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(148, 163, 184, 0.15);
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
}

.auth-page {
    background:
        linear-gradient(135deg, rgba(193, 18, 31, .28) 0%, transparent 34%),
        linear-gradient(155deg, #090909 0%, #151515 48%, #063f27 100%);
    color: #fff;
}

.auth-shell {
    background: rgba(15, 23, 42, 0.74);
    border: 1px solid rgba(255, 255, 255, 0.16);
    box-shadow: 0 24px 80px rgba(2, 6, 23, 0.42);
    backdrop-filter: blur(18px);
}

.auth-shell input,
.auth-shell button {
    color-scheme: dark;
}

.auth-shell input {
    caret-color: #fff;
}

.auth-shell input::placeholder {
    color: rgba(255, 255, 255, 0.48);
}

.auth-shell .tab-btn {
    color: rgba(255, 255, 255, 0.72);
}

.auth-shell .tab-btn.active {
    color: #fff;
}

.btn-primary {
    background: var(--gradient);
    color: #fff;
    padding: 12px 28px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 15px;
    border: none;
    cursor: pointer;
    transition: opacity .2s, transform .15s, box-shadow .2s;
    box-shadow: 0 4px 20px rgba(193, 18, 31, .28);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}

.btn-primary:hover {
    opacity: .9;
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(193, 18, 31, .36);
}

.btn-outline {
    background: transparent;
    color: var(--primary);
    padding: 11px 27px;
    border-radius: 50px;
    font-weight: 600;
    font-size: 15px;
    border: 2px solid var(--primary);
    cursor: pointer;
    transition: all .2s;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
}

.btn-outline:hover {
    background: var(--primary);
    color: #fff;
}

.btn-sm {
    padding: 8px 18px;
    font-size: 13px;
}

.navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(16px);
    border-bottom: 1px solid rgba(193, 18, 31, .12);
    box-shadow: 0 2px 20px rgba(0, 0, 0, .06);
    height: 70px;
}

.hero-grid {
    background-image:
        linear-gradient(rgba(194, 98, 45, 0.08) 1px, transparent 1px),
        linear-gradient(90deg, rgba(194, 98, 45, 0.08) 1px, transparent 1px);
    background-size: 28px 28px;
}

.hero-section {
    background: linear-gradient(135deg, var(--encre) 0%, var(--indigo-mali) 52%, #1D2348 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.hero-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23C2622D' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: .4;
}

.stats-band {
    background: #fff;
    box-shadow: 0 -4px 40px rgba(0, 0, 0, .08);
    padding: 32px 0;
}

.stat-item {
    text-align: center;
    padding: 0 32px;
    border-right: 1px solid #f0eeff;
}

.stat-item:last-child { border-right: none; }

.stat-number {
    font-size: 2rem;
    font-weight: 800;
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.catalogue-card {
    background: #fff;
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    transition: all .3s;
    position: relative;
}

.catalogue-card:hover {
    box-shadow: var(--shadow-lg);
    transform: translateY(-6px);
}

.catalogue-card .badge-type {
    position: absolute;
    top: 12px;
    right: 12px;
    background: var(--gradient);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 50px;
    text-transform: uppercase;
    letter-spacing: .5px;
}

.catalogue-card .price-tag,
.price-tag {
    font-size: 1.25rem;
    font-weight: 800;
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.catalogue-card img {
    width: 100%;
    height: 220px;
    object-fit: cover;
    transition: transform .5s;
}

.catalogue-card:hover img {
    transform: scale(1.05);
}

.catalogue-card .card-body {
    padding: 20px;
}

.node-card {
    background: linear-gradient(135deg, var(--encre), var(--indigo-mali));
    border-radius: var(--radius);
    padding: 24px;
    color: #fff;
    position: relative;
    overflow: hidden;
}

.node-card::before {
    content: "";
    position: absolute;
    top: -40px;
    right: -40px;
    width: 120px;
    height: 120px;
    background: rgba(194, 98, 45, .18);
    border-radius: 50%;
}

.node-card .pulse,
.pulse {
    display: inline-block;
    width: 8px;
    height: 8px;
    background: #22c55e;
    border-radius: 50%;
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .6; transform: scale(1.3); }
}

.order-card {
    background: #fff;
    border-radius: var(--radius);
    padding: 20px;
    border: 1px solid #f0eeff;
    transition: all .25s;
    display: flex;
    align-items: center;
    gap: 16px;
}

.order-card:hover {
    border-color: var(--primary);
    box-shadow: var(--shadow-sm);
}

.order-card .seller-avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--gradient);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    flex-shrink: 0;
}

.trust-score {
    display: flex;
    gap: 2px;
}

.trust-score span {
    color: #0f8f4f;
    font-size: 12px;
}

.dash-sidebar {
    background: linear-gradient(180deg, var(--primary), var(--secondary));
    width: 260px;
    min-height: 100vh;
    position: fixed;
    left: 0;
    top: 0;
    overflow-y: auto;
    transition: transform .3s;
    z-index: 50;
}

.dash-main {
    margin-left: 260px;
    min-height: 100vh;
}

.stat-card {
    background: #fff;
    border-radius: var(--radius);
    padding: 24px;
    box-shadow: var(--shadow-sm);
    display: flex;
    align-items: center;
    gap: 16px;
    transition: box-shadow .2s;
}

.stat-card:hover { box-shadow: var(--shadow-md); }

.stat-icon {
    width: 56px;
    height: 56px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    color: #fff;
    flex-shrink: 0;
}

.wallet-card {
    background: linear-gradient(135deg, var(--encre), var(--indigo-mali));
    border-radius: var(--radius-lg);
    padding: 32px;
    color: #fff;
    position: relative;
    overflow: hidden;
}

.wallet-card::after {
    content: "KMT";
    position: absolute;
    right: -20px;
    bottom: -30px;
    font-size: 120px;
    font-weight: 900;
    opacity: .05;
    letter-spacing: -4px;
}

.badge {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 50px;
    font-size: 12px;
    font-weight: 600;
}

.badge-success { background: #dcfce7; color: #16a34a; }
.badge-warning { background: #ffe4e7; color: #c1121f; }
.badge-danger { background: #fee2e2; color: #dc2626; }
.badge-info { background: #e8f8ef; color: #0f8f4f; }
.badge-purple { background: #ffe4e7; color: #c1121f; }
.badge-gray { background: #f3f4f6; color: #6b7280; }

.badge-soft {
    border-radius: 999px;
    padding: 0.35rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 700;
}

.table-km {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.table-km thead th {
    background: #f8f7ff;
    padding: 12px 16px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .8px;
    color: #9ca3af;
    text-align: left;
}

.table-km tbody tr {
    border-bottom: 1px solid #f3f4f6;
    transition: background .15s;
}

.table-km tbody tr:hover {
    background: #fafafa;
}

.table-km td {
    padding: 14px 16px;
    font-size: 14px;
}

.table-shell {
    overflow: hidden;
    border-radius: 1.5rem;
    border: 1px solid rgba(148, 163, 184, 0.14);
    background: rgba(255, 255, 255, 0.92);
}

.pipeline-column {
    min-height: 22rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.85), rgba(248, 250, 252, 0.95));
    border: 1px solid rgba(148, 163, 184, 0.18);
}

.form-input {
    width: 100%;
    padding: 12px 16px;
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    font-size: 14px;
    font-family: "Inter", sans-serif;
    transition: border-color .2s, box-shadow .2s;
    background: #fff;
    outline: none;
}

.form-input:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(194, 98, 45, .12);
}

.form-label {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 6px;
}

.notif-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--primary);
    flex-shrink: 0;
}

.skeleton {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton 1.5s infinite;
    border-radius: 8px;
}

@keyframes skeleton {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.line-clamp-2,
.line-clamp-3 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-2 { -webkit-line-clamp: 2; }
.line-clamp-3 { -webkit-line-clamp: 3; }

@media (max-width: 768px) {
    .dash-sidebar { transform: translateX(-100%); }
    .dash-sidebar.open { transform: translateX(0); }
    .dash-main { margin-left: 0; }
    .order-card {
        flex-direction: column;
        align-items: flex-start;
    }
    .stat-item {
        border-right: none;
        width: 50%;
        padding: 16px;
    }
}

/* KeurMame Hub UI system */
:root {
    --km-primary: #c1121f;
    --km-primary-dark: #8f0d17;
    --km-primary-soft: #ffe4e7;
    --km-secondary: #101010;
    --km-accent: #0f8f4f;
    --km-accent-soft: #e8f8ef;
    --km-bg: #f8fafc;
    --km-surface: #ffffff;
    --km-border: #e5e7eb;
    --km-text: #111827;
    --km-muted: #6b7280;
    --km-success: #16a34a;
    --km-warning: #c1121f;
    --km-danger: #dc2626;
    --km-info: #0f8f4f;
    --km-radius: 12px;
    --km-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
    --km-shadow-lg: 0 22px 60px rgba(15, 23, 42, 0.14);
}

body {
    background: var(--km-bg);
    color: var(--km-text);
}

.km-public-shell {
    min-height: 100vh;
    background:
        linear-gradient(180deg, rgba(15, 143, 79, .08), rgba(248, 250, 252, 0) 340px),
        linear-gradient(90deg, rgba(193, 18, 31, .06), transparent 48%),
        var(--km-bg);
}

.km-public-header {
    position: sticky;
    top: 0;
    z-index: 40;
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--km-border);
}

.km-public-nav {
    max-width: 1180px;
    margin: 0 auto;
    min-height: 72px;
    padding: 12px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.km-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--km-secondary);
    font-weight: 900;
    letter-spacing: .01em;
}

.km-brand-mark,
.km-icon-mark {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, var(--km-primary), var(--km-primary-dark));
    box-shadow: 0 10px 22px rgba(15, 118, 110, .22);
}

.km-mobile-menu-btn {
    display: none;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    padding: 0 14px;
    border: 1px solid var(--km-border);
    border-radius: 999px;
    background: #fff;
    color: var(--km-secondary);
    font-size: 14px;
    font-weight: 800;
}

.km-nav-links {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.km-nav-links a,
.km-nav-link {
    border-radius: 999px;
    padding: 10px 13px;
    color: #374151;
    font-size: 14px;
    font-weight: 700;
    transition: background .2s ease, color .2s ease;
}

.km-nav-links a:hover,
.km-nav-link:hover {
    background: #ecfdf5;
    color: var(--km-primary-dark);
}

.km-nav-links .km-nav-cta {
    background: var(--km-secondary);
    color: #fff;
    box-shadow: 0 10px 24px rgba(17, 24, 39, .12);
}

.km-nav-links .km-nav-cta:hover {
    background: var(--km-primary-dark);
    color: #fff;
}

.km-public-main {
    max-width: 1180px;
    margin: 0 auto;
    padding: 30px 24px 60px;
}

.km-public-shell .btn-primary {
    border-radius: 12px;
    background: linear-gradient(135deg, var(--km-primary), var(--km-primary-dark));
    box-shadow: 0 12px 28px rgba(15, 118, 110, .22);
}

.km-public-shell .btn-primary:hover {
    box-shadow: 0 16px 34px rgba(15, 118, 110, .28);
}

.km-public-shell .btn-outline {
    border-radius: 12px;
    border-color: rgba(15, 118, 110, .36);
    color: var(--km-primary-dark);
    background: #fff;
}

.km-public-shell .btn-outline:hover {
    border-color: var(--km-primary);
    background: #ecfdf5;
    color: var(--km-primary-dark);
}

.km-footer {
    border-top: 1px solid var(--km-border);
    background: #fff;
    color: var(--km-muted);
}

.km-footer-inner {
    max-width: 1180px;
    margin: 0 auto;
    padding: 30px 24px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: start;
    gap: 22px;
    flex-wrap: wrap;
    font-size: 14px;
}

.km-footer-inner strong {
    display: block;
    color: var(--km-text);
    margin-bottom: 8px;
}

.km-footer-inner p {
    margin: 0;
}

@media (max-width: 760px) {
    .km-footer-inner {
        grid-template-columns: 1fr;
    }
}

.km-page-hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(circle at 82% 18%, rgba(193, 18, 31, .34), transparent 21rem),
        linear-gradient(135deg, #101010 0%, #063f27 58%, #c1121f 100%);
    color: #fff;
    border-radius: 18px;
    padding: clamp(24px, 4vw, 44px);
    box-shadow: var(--km-shadow-lg);
    margin-bottom: 28px;
}

.km-page-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px),
        linear-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
    background-size: 42px 42px;
    mask-image: linear-gradient(120deg, rgba(0,0,0,.75), transparent 72%);
    pointer-events: none;
}

.km-page-hero > * {
    position: relative;
    z-index: 1;
}

.km-page-hero h1 {
    font-size: clamp(2rem, 4vw, 3.6rem);
    line-height: .98;
    font-weight: 900;
    margin: 8px 0 10px;
    max-width: 820px;
}

.km-page-hero p {
    color: rgba(255,255,255,.82);
    max-width: 720px;
    font-size: 1.02rem;
    line-height: 1.75;
}

.km-eyebrow {
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: inherit;
    opacity: .74;
}

.km-card,
.km-stat-card,
.km-action-card,
.km-empty,
.km-panel {
    background: var(--km-surface);
    border: 1px solid var(--km-border);
    border-radius: var(--km-radius);
    box-shadow: var(--km-shadow);
}

.km-card,
.km-panel {
    padding: 20px;
}

.km-card {
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.km-card:hover {
    border-color: rgba(15, 118, 110, .22);
    box-shadow: 0 14px 36px rgba(15, 23, 42, .1);
}

.km-stat-grid,
.km-action-grid,
.km-responsive-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    gap: 16px;
}

.km-stat-card {
    padding: 18px;
    min-width: 0;
}

.km-stat-label {
    color: var(--km-muted);
    font-size: 13px;
    font-weight: 700;
}

.km-stat-value {
    font-size: clamp(24px, 3vw, 30px);
    line-height: 1.1;
    font-weight: 900;
    margin-top: 8px;
    color: var(--km-secondary);
}

.km-action-card {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 18px;
    color: var(--km-text);
    transition: transform .2s ease, border-color .2s ease;
}

.km-action-card:hover {
    transform: translateY(-2px);
    border-color: rgba(15, 118, 110, .35);
}

.km-toolbar,
.km-filter-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 18px;
}

.km-filter-panel {
    background: #fff;
    border: 1px solid var(--km-border);
    border-radius: var(--km-radius);
    padding: 16px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .05);
}

.km-side-option {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    border: 1px solid var(--km-border);
    border-radius: 12px;
    background: #f9fafb;
    color: #374151;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
}

.km-side-option:has(input:checked) {
    border-color: rgba(15, 118, 110, .45);
    background: #ecfdf5;
    color: var(--km-primary-dark);
}

.km-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.km-badge-success { background: #dcfce7; color: #166534; }
.km-badge-warning { background: #ffe4e7; color: #991b1b; }
.km-badge-danger { background: #fee2e2; color: #991b1b; }
.km-badge-info { background: #e8f8ef; color: #0f8f4f; }
.km-badge-muted { background: #f3f4f6; color: #4b5563; }
.km-badge-dark { background: #111827; color: #fff; }

.km-table-wrap {
    overflow-x: auto;
    background: #fff;
    border: 1px solid var(--km-border);
    border-radius: var(--km-radius);
    box-shadow: var(--km-shadow);
}

.km-table {
    width: 100%;
    min-width: 720px;
    border-collapse: collapse;
}

.km-table th,
.km-table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--km-border);
    text-align: left;
    vertical-align: top;
}

.km-table th {
    color: var(--km-muted);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .06em;
    background: #f9fafb;
}

.km-empty {
    padding: 36px 24px;
    text-align: center;
    color: var(--km-muted);
}

.km-alert {
    border-radius: var(--km-radius);
    padding: 14px 16px;
    border: 1px solid var(--km-border);
    background: #fff;
    color: var(--km-text);
}

.km-alert-warning { background: #fffbeb; border-color: #fde68a; color: #78350f; }
.km-alert-info { background: #eff6ff; border-color: #bfdbfe; color: #1e3a8a; }
.km-alert-danger { background: #fef2f2; border-color: #fecaca; color: #7f1d1d; }
.km-alert-success { background: #ecfdf5; border-color: #bbf7d0; color: #14532d; }

.km-placeholder {
    min-height: 160px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255,255,255,.86);
    background:
        linear-gradient(135deg, rgba(15, 118, 110, .92), rgba(245, 158, 11, .88)),
        linear-gradient(90deg, rgba(255,255,255,.1) 1px, transparent 1px);
}

.km-market-card {
    overflow: hidden;
    border-radius: var(--km-radius);
    border: 1px solid var(--km-border);
    background: #fff;
    box-shadow: var(--km-shadow);
    display: flex;
    flex-direction: column;
    min-width: 0;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.km-market-card:hover {
    transform: translateY(-3px);
    border-color: rgba(15, 118, 110, .26);
    box-shadow: 0 18px 42px rgba(15, 23, 42, .12);
}

.km-market-card img {
    background: #e5e7eb;
}

.km-market-card .p-4 {
    display: flex;
    flex: 1;
    flex-direction: column;
}

.km-card-footer-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 16px;
}

.km-product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
    gap: 20px;
}

.km-home-hero {
    min-height: 440px;
}

.km-hero-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    max-width: 650px;
    margin-top: 24px;
    padding: 8px;
    border: 1px solid rgba(255,255,255,.2);
    border-radius: 16px;
    background: rgba(255,255,255,.12);
    backdrop-filter: blur(12px);
}

.km-hero-search .form-input {
    border-color: transparent;
    min-height: 48px;
}

.km-hero-visual {
    position: relative;
    min-height: 360px;
}

.km-hero-shop-card,
.km-hero-wallet-card,
.km-hero-stats {
    position: absolute;
    border: 1px solid rgba(255,255,255,.2);
    background: rgba(255,255,255,.94);
    color: var(--km-secondary);
    box-shadow: 0 24px 70px rgba(2, 6, 23, .26);
}

.km-hero-shop-card {
    inset: 18px 70px auto 12px;
    min-height: 210px;
    border-radius: 18px;
    padding: 18px;
}

.km-hero-shop-top {
    display: flex;
    align-items: center;
    gap: 12px;
}

.km-hero-shop-top small,
.km-hero-wallet-card small,
.km-hero-stats span {
    display: block;
    color: var(--km-muted);
    font-size: 12px;
    font-weight: 700;
}

.km-hero-avatar {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    background: linear-gradient(135deg, var(--km-primary), var(--km-accent));
}

.km-hero-product-strip {
    display: grid;
    grid-template-columns: 1.2fr .9fr .75fr;
    gap: 10px;
    margin-top: 22px;
}

.km-hero-product-strip span {
    min-height: 116px;
    border-radius: 14px;
    background:
        linear-gradient(145deg, rgba(255,255,255,.55), rgba(255,255,255,.08)),
        linear-gradient(135deg, #0f8f4f, #c1121f);
}

.km-hero-product-strip span:nth-child(2) {
    background:
        linear-gradient(145deg, rgba(255,255,255,.5), rgba(255,255,255,.1)),
        linear-gradient(135deg, #101010, #0f8f4f);
}

.km-hero-product-strip span:nth-child(3) {
    background:
        linear-gradient(145deg, rgba(255,255,255,.5), rgba(255,255,255,.1)),
        linear-gradient(135deg, #111827, #c1121f);
}

.km-hero-wallet-card {
    right: 8px;
    bottom: 74px;
    width: 245px;
    border-radius: 16px;
    padding: 18px;
}

.km-hero-wallet-card > div {
    color: var(--km-primary-dark);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.km-hero-wallet-card strong {
    display: block;
    margin: 8px 0 4px;
    font-size: 24px;
    line-height: 1.05;
}

.km-hero-stats {
    left: 56px;
    right: 46px;
    bottom: 6px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    border-radius: 16px;
    padding: 14px;
}

.km-hero-stats div {
    padding: 6px 8px;
}

.km-hero-stats strong {
    display: block;
    color: var(--km-secondary);
    font-size: 24px;
    font-weight: 900;
}

.km-compact-hero,
.km-shop-hero,
.km-kmt-hero {
    min-height: 250px;
    display: flex;
    align-items: center;
}

.km-kmt-hero {
    background:
        radial-gradient(circle at 80% 12%, rgba(193, 18, 31, .34), transparent 20rem),
        linear-gradient(135deg, #111827, #063f27 62%, #0f8f4f);
}

.km-product-detail {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
    gap: 28px;
}

.km-media-card {
    padding: 0;
    overflow: hidden;
}

.km-purchase-panel {
    position: sticky;
    top: 96px;
    align-self: start;
}

.km-shop-card {
    min-height: 225px;
}

.km-shop-card::after {
    content: "";
    display: block;
    height: 4px;
    margin-top: 18px;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--km-primary), var(--km-accent));
}

.km-demo-login {
    margin-top: 18px;
    padding: 16px;
    border-radius: 18px;
    background: rgba(15, 118, 110, .14);
    border: 1px solid rgba(45, 212, 191, .32);
}

.km-demo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 10px;
    margin-top: 12px;
}

.km-demo-button {
    text-align: left;
    border: 1px solid rgba(255,255,255,.2);
    background: rgba(255,255,255,.12);
    border-radius: 14px;
    padding: 10px 12px;
    color: #fff;
    transition: background .2s ease, transform .2s ease;
}

.km-demo-button:hover {
    background: rgba(255,255,255,.2);
    transform: translateY(-1px);
}

.km-loading {
    position: relative;
    pointer-events: none;
    opacity: .75;
}

.km-loading::after {
    content: "";
    width: 16px;
    height: 16px;
    border-radius: 999px;
    border: 2px solid currentColor;
    border-top-color: transparent;
    display: inline-block;
    margin-left: 8px;
    animation: km-spin .8s linear infinite;
}

@keyframes km-spin { to { transform: rotate(360deg); } }

.km-dashboard-shell {
    min-height: 100vh;
    display: flex;
    background:
        radial-gradient(circle at 80% 0%, rgba(15, 118, 110, .08), transparent 28rem),
        linear-gradient(180deg, #f8fafc, #eef2f7);
}

.km-dashboard-sidebar {
    width: 272px;
    flex-shrink: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    color: #fff;
    background: linear-gradient(180deg, #10201f 0%, #123633 58%, #0f172a 100%);
    border-right: 1px solid rgba(255,255,255,.08);
    box-shadow: 18px 0 44px rgba(15, 23, 42, .12);
    transition: transform .3s ease;
}

.km-dashboard-main {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.km-dashboard-topbar {
    min-height: 68px;
    background: rgba(255,255,255,.9);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--km-border);
    padding: 14px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.km-sidebar-button {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    border: 1px solid var(--km-border);
    background: #fff;
    color: var(--km-secondary);
}

.km-topbar-icon-button {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    border: 1px solid var(--km-border);
    background: #fff;
    color: #111827;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: 0 10px 28px rgba(15, 23, 42, .08);
}

.km-topbar-icon-button.is-active,
.km-topbar-icon-button:hover {
    color: var(--km-primary-dark);
    border-color: rgba(193, 18, 31, .35);
}

.km-topbar-notif-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    min-width: 18px;
    height: 18px;
    border-radius: 999px;
    background: var(--km-primary);
    color: #fff;
    font-size: 11px;
    font-weight: 900;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
}

.km-wallet-qr svg {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.km-dashboard-content {
    flex: 1;
    overflow: auto;
    padding: clamp(18px, 3vw, 30px);
}

.km-agent-panel {
    position: relative;
    overflow: hidden;
    border-radius: 30px;
    padding: clamp(20px, 3vw, 30px);
    color: #f8fafc;
    background:
        radial-gradient(circle at 12% 12%, rgba(20, 184, 166, .34), transparent 24rem),
        radial-gradient(circle at 92% 18%, rgba(251, 191, 36, .18), transparent 22rem),
        linear-gradient(135deg, #071312 0%, #10201f 45%, #0f172a 100%);
    border: 1px solid rgba(255,255,255,.12);
    box-shadow: 0 26px 70px rgba(15, 23, 42, .22);
}

.km-agent-panel-bg {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
    background-size: 34px 34px;
    mask-image: linear-gradient(135deg, rgba(0,0,0,.9), rgba(0,0,0,.2));
    pointer-events: none;
}

.km-agent-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    color: #99f6e4;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .14em;
}

.km-agent-title {
    font-size: clamp(1.8rem, 3vw, 3rem);
    line-height: .98;
    font-weight: 950;
    letter-spacing: -.04em;
}

.km-agent-copy {
    max-width: 780px;
    margin-top: 10px;
    color: rgba(248, 250, 252, .76);
    font-size: .96rem;
}

.km-agent-status {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid rgba(153, 246, 228, .28);
    background: rgba(255,255,255,.08);
    border-radius: 18px;
    backdrop-filter: blur(12px);
    min-width: 170px;
}

.km-agent-status strong,
.km-agent-status span:not(.km-agent-pulse) {
    display: block;
}

.km-agent-status strong {
    font-size: 12px;
    color: #fff;
}

.km-agent-status span:not(.km-agent-pulse) {
    font-size: 12px;
    color: rgba(248,250,252,.68);
}

.km-agent-pulse {
    width: 11px;
    height: 11px;
    border-radius: 999px;
    background: #2dd4bf;
    box-shadow: 0 0 0 8px rgba(45, 212, 191, .14);
    flex-shrink: 0;
}

.km-agent-mini-card,
.km-agent-command-card {
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(255,255,255,.085);
    border-radius: 22px;
    backdrop-filter: blur(14px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.km-agent-mini-card {
    padding: 14px;
}

.km-agent-mini-card strong,
.km-agent-mini-card small {
    display: block;
}

.km-agent-mini-card strong {
    margin-top: 10px;
    color: #fff;
    font-size: 13px;
}

.km-agent-mini-card small {
    margin-top: 3px;
    color: rgba(248,250,252,.64);
    line-height: 1.35;
}

.km-agent-mini-icon {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(20, 184, 166, .18);
    color: #99f6e4;
}

.km-agent-chip {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 11px;
    border-radius: 999px;
    background: rgba(255,255,255,.1);
    color: rgba(248,250,252,.9);
    border: 1px solid rgba(255,255,255,.12);
    font-size: 12px;
    font-weight: 800;
    text-transform: capitalize;
}

.km-agent-command-card {
    padding: 18px;
    background: rgba(248,250,252,.94);
    color: #0f172a;
}

.km-agent-command-card h3 {
    font-size: 1.05rem;
    font-weight: 950;
    color: #0f172a;
}

.km-agent-command-card p {
    color: #64748b;
    font-size: 12px;
}

.km-agent-action {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 13px;
    border-radius: 16px;
    background: #fff;
    border: 1px solid #e5e7eb;
    color: #0f172a;
    font-size: 13px;
    font-weight: 850;
    text-decoration: none;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.km-agent-action:hover {
    transform: translateY(-1px);
    border-color: rgba(15, 118, 110, .35);
    box-shadow: 0 14px 28px rgba(15, 23, 42, .09);
}

.km-agent-action span {
    display: inline-flex;
    align-items: center;
    gap: 9px;
}

.km-agent-action.muted {
    background: #f8fafc;
    color: #334155;
}

.km-agent-action.danger-soft {
    border-color: #fecdd3;
    background: #fff1f2;
    color: #991b1b;
}

.km-agent-guardrail {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 11px 12px;
    border-radius: 16px;
    background: #ecfdf5;
    color: #065f46;
    font-size: 12px;
    font-weight: 750;
}

.km-agent-topbar-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    border-radius: 999px;
    border: 1px solid rgba(20, 184, 166, .22);
    background: linear-gradient(135deg, #0f172a, #115e59);
    color: #fff;
    font-size: 12px;
    font-weight: 900;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .16);
}

.km-agent-action-button {
    width: 100%;
    cursor: pointer;
    text-align: left;
}

.km-agent-drawer {
    position: fixed;
    inset: 0;
    z-index: 9990;
    pointer-events: none;
}

.km-agent-drawer.is-open {
    pointer-events: auto;
}

.km-agent-drawer-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .46);
    opacity: 0;
    transition: opacity .2s ease;
}

.km-agent-drawer.is-open .km-agent-drawer-backdrop {
    opacity: 1;
}

.km-agent-drawer-sheet {
    position: absolute;
    top: 0;
    right: 0;
    width: min(520px, 100%);
    height: 100%;
    overflow-y: auto;
    padding: clamp(18px, 4vw, 30px);
    background:
        radial-gradient(circle at 10% 0%, rgba(20, 184, 166, .18), transparent 18rem),
        linear-gradient(180deg, #ffffff, #f8fafc);
    box-shadow: -28px 0 70px rgba(15, 23, 42, .25);
    transform: translateX(104%);
    transition: transform .24s ease;
}

.km-agent-drawer.is-open .km-agent-drawer-sheet {
    transform: translateX(0);
}

.km-agent-drawer-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.km-agent-drawer-head h2 {
    font-size: clamp(1.6rem, 4vw, 2.3rem);
    line-height: 1;
    font-weight: 950;
    letter-spacing: -.04em;
    color: #0f172a;
}

.km-agent-drawer-head p {
    margin-top: 8px;
    color: #64748b;
    font-size: 13px;
    font-weight: 700;
}

.km-agent-drawer-close {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: #f1f5f9;
    color: #0f172a;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.km-agent-scope-box,
.km-agent-module-grid,
.km-agent-compose-card {
    border: 1px solid rgba(148, 163, 184, .18);
    background: rgba(255,255,255,.86);
    border-radius: 24px;
    box-shadow: 0 18px 42px rgba(15, 23, 42, .08);
}

.km-agent-scope-box {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1px;
    overflow: hidden;
    margin-bottom: 16px;
}

.km-agent-scope-box div {
    padding: 14px;
    background: #fff;
}

.km-agent-scope-box strong,
.km-agent-scope-box span {
    display: block;
}

.km-agent-scope-box strong {
    color: #0f172a;
    font-size: 12px;
    font-weight: 950;
}

.km-agent-scope-box span {
    margin-top: 4px;
    color: #64748b;
    font-size: 11px;
    font-weight: 750;
}

.km-agent-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 12px;
    margin-bottom: 16px;
}

.km-agent-module-card {
    padding: 13px;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #334155;
}

.km-agent-module-card.is-ready {
    background: #ecfdf5;
    border-color: #99f6e4;
    color: #065f46;
}

.km-agent-module-card i,
.km-agent-module-card strong,
.km-agent-module-card span {
    display: block;
}

.km-agent-module-card strong {
    margin-top: 10px;
    font-size: 12px;
    font-weight: 950;
}

.km-agent-module-card span {
    margin-top: 3px;
    font-size: 11px;
    font-weight: 750;
    opacity: .78;
}

.km-agent-compose-card {
    padding: 16px;
}

.km-agent-compose-card label {
    display: block;
    color: #0f172a;
    font-size: 13px;
    font-weight: 950;
    margin-bottom: 8px;
}

.km-agent-compose-card textarea {
    width: 100%;
    resize: vertical;
    min-height: 104px;
    border: 1px solid #cbd5e1;
    border-radius: 18px;
    padding: 14px;
    outline: none;
    font-size: 14px;
    background: #fff;
}

.km-agent-compose-card textarea:focus {
    border-color: #14b8a6;
    box-shadow: 0 0 0 4px rgba(20, 184, 166, .12);
}

.km-agent-thread {
    display: flex;
    flex-direction: column;
    gap: 9px;
    max-height: 240px;
    overflow: auto;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: linear-gradient(180deg, #f8fafc, #ffffff);
}

.km-agent-bubble {
    max-width: 88%;
    padding: 10px 12px;
    border-radius: 16px;
    font-size: 13px;
    line-height: 1.45;
    font-weight: 700;
    white-space: pre-wrap;
}

.km-agent-bubble-assistant {
    align-self: flex-start;
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.km-agent-bubble-user {
    align-self: flex-end;
    background: #0f172a;
    color: #fff;
}

.km-agent-bubble-system {
    align-self: center;
    max-width: 100%;
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
}

.km-agent-prompt-row,
.km-agent-compose-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.km-agent-prompt-row button {
    padding: 8px 10px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #334155;
    font-size: 12px;
    font-weight: 850;
}

.km-agent-primary,
.km-agent-secondary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 11px 13px;
    border-radius: 14px;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none;
}

.km-agent-primary {
    background: linear-gradient(135deg, #0f766e, #0f172a);
    color: #fff;
}

.km-agent-secondary {
    background: #f8fafc;
    color: #0f172a;
    border: 1px solid #e2e8f0;
}

.km-agent-response {
    margin-top: 13px;
    padding: 12px 13px;
    border-radius: 16px;
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    color: #1e3a8a;
    font-size: 13px;
    line-height: 1.45;
    font-weight: 700;
}

.km-agent-response[data-tone="success"] {
    background: #ecfdf5;
    border-color: #a7f3d0;
    color: #065f46;
}

.km-agent-response[data-tone="warning"] {
    background: #fffbeb;
    border-color: #fde68a;
    color: #92400e;
}

.km-agent-honesty-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 13px;
    color: #475569;
    font-size: 12px;
    line-height: 1.45;
}

@media (max-width: 720px) {
    .km-agent-topbar-button span { display: none; }
    .km-agent-scope-box,
    .km-agent-module-grid { grid-template-columns: 1fr; }
}

.km-screen-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    flex-wrap: wrap;
    margin-bottom: 22px;
}

.km-screen-head h1 {
    margin: 4px 0 4px;
    font-size: clamp(1.85rem, 4vw, 2.8rem);
    line-height: 1.02;
    font-weight: 900;
    color: #0f172a;
}

.km-screen-head p,
.km-card-head p {
    color: var(--km-muted);
}

.km-section-label {
    color: var(--km-primary-dark);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .12em;
}

.km-head-actions,
.km-form-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.km-back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--km-primary-dark);
    font-size: 14px;
    font-weight: 800;
}

.km-card-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.km-card-head h2,
.km-card h2,
.km-empty h2 {
    font-size: 1.15rem;
    font-weight: 900;
    color: #111827;
}

.km-workspace-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(330px, 420px);
    gap: 22px;
    align-items: start;
}

.km-settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.km-compact-input {
    max-width: 320px;
}

.km-table-flat {
    box-shadow: none;
}

.km-row-active {
    background: #ecfdf5;
}

.km-row-media {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 280px;
}

.km-thumb {
    width: 58px;
    height: 58px;
    border-radius: 12px;
    object-fit: cover;
    background: #e5e7eb;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--km-muted);
    flex-shrink: 0;
}

.km-thumb-fallback {
    background: linear-gradient(135deg, #e8f8ef, #ffe4e7);
    color: var(--km-primary-dark);
}

.km-readonly-tile,
.km-meta-grid > div,
.km-guideline {
    border: 1px solid var(--km-border);
    background: #f9fafb;
    border-radius: 12px;
    padding: 14px;
}

.km-readonly-tile span,
.km-meta-grid span {
    display: block;
    color: var(--km-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.km-readonly-tile strong,
.km-meta-grid strong {
    display: block;
    margin-top: 5px;
    color: #111827;
}

.km-check-stack {
    padding-top: 26px;
    display: grid;
    gap: 8px;
    color: #374151;
    font-size: 14px;
    font-weight: 700;
}

.km-check-stack label,
.km-check-list li,
.km-guideline {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.km-check-list {
    display: grid;
    gap: 10px;
    margin-top: 14px;
    color: #374151;
    font-size: 14px;
}

.km-check-list li::before {
    content: "✓";
    color: var(--km-primary-dark);
    font-weight: 900;
}

.km-guideline i {
    color: var(--km-primary-dark);
    margin-top: 3px;
}

.km-offer-preview {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr);
    gap: 22px;
}

.km-offer-image {
    width: 100%;
    aspect-ratio: 4 / 3;
    border-radius: 14px;
    object-fit: cover;
}

.km-meta-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

@media (max-width: 768px) {
    .km-public-nav {
        min-height: auto;
        align-items: center;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .km-mobile-menu-btn {
        display: inline-flex;
    }

    .km-nav-links {
        display: none;
        width: 100%;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        padding: 8px 0 2px;
    }

    .km-nav-links.open {
        display: flex;
    }

    .km-nav-links a,
    .km-nav-link {
        width: 100%;
        border-radius: 12px;
        padding: 12px 14px;
        background: #f8fafc;
    }

    .km-public-main {
        padding: 20px 16px 44px;
    }

    .km-page-hero {
        border-radius: 18px;
        padding: 24px 20px;
    }

    .km-page-hero h1 {
        font-size: clamp(2rem, 12vw, 2.65rem);
        line-height: 1.02;
    }

    .km-hero-search {
        grid-template-columns: 1fr;
        padding: 0;
        background: transparent;
        border: 0;
    }

    .km-hero-visual {
        min-height: 285px;
    }

    .km-hero-shop-card {
        inset: 6px 24px auto 0;
        min-height: 178px;
    }

    .km-hero-product-strip {
        grid-template-columns: repeat(3, 1fr);
    }

    .km-hero-product-strip span {
        min-height: 82px;
    }

    .km-hero-wallet-card {
        right: 0;
        bottom: 68px;
        width: min(230px, 78vw);
    }

    .km-hero-stats {
        left: 0;
        right: 0;
        bottom: 0;
    }

    .km-product-detail {
        grid-template-columns: 1fr;
    }

    .km-purchase-panel {
        position: static;
    }

    .km-card-footer-line {
        align-items: stretch;
        flex-direction: column;
    }

    .km-card-footer-line .btn-primary {
        justify-content: center;
    }

    #sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 50;
        transform: translateX(-100%);
    }

    #sidebar.open {
        transform: translateX(0);
    }

    .km-dashboard-shell {
        display: block;
    }

    .km-dashboard-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 50;
        transform: translateX(-100%);
    }

    .km-workspace-grid,
    .km-settings-grid,
    .km-offer-preview {
        grid-template-columns: 1fr;
    }

    .km-screen-head {
        align-items: flex-start;
    }

    .km-head-actions,
    .km-form-actions {
        width: 100%;
    }

    .km-head-actions > *,
    .km-form-actions > * {
        flex: 1;
        justify-content: center;
    }
}

/* KeurMame professional ecommerce refresh */
:root {
    --primary: #c1121f;
    --secondary: #101010;
    --gradient: linear-gradient(135deg, #c1121f 0%, #101010 100%);
    --gradient-r: linear-gradient(135deg, #c1121f 0%, #0f8f4f 100%);
    --surface: #f5f7f6;
    --km-primary: #c1121f;
    --km-primary-dark: #8f0d17;
    --km-primary-soft: #ffe4e7;
    --km-secondary: #101010;
    --km-accent: #0f8f4f;
    --km-accent-soft: #e8f8ef;
    --km-bg: #f5f7f6;
    --km-surface: #ffffff;
    --km-border: #dfe7e4;
    --km-text: #111827;
    --km-muted: #60706b;
    --km-radius: 8px;
    --km-shadow: 0 12px 32px rgba(16, 24, 32, 0.08);
    --km-shadow-lg: 0 28px 72px rgba(16, 24, 32, 0.18);
}

body {
    background: var(--km-bg);
}

.btn-primary,
.km-public-shell .btn-primary {
    min-height: 42px;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--km-primary), var(--km-primary-dark));
    color: #fff;
    box-shadow: 0 12px 28px rgba(15, 118, 110, .20);
}

.btn-primary:hover,
.km-public-shell .btn-primary:hover {
    box-shadow: 0 16px 36px rgba(15, 118, 110, .28);
}

.btn-outline,
.km-public-shell .btn-outline {
    min-height: 42px;
    border-radius: 8px;
    border: 1px solid rgba(15, 118, 110, .28);
    color: var(--km-primary-dark);
    background: #fff;
}

.btn-outline:hover,
.km-public-shell .btn-outline:hover {
    border-color: var(--km-primary);
    background: #effaf6;
    color: var(--km-primary-dark);
}

.price-tag,
.catalogue-card .price-tag {
    background: none;
    -webkit-text-fill-color: currentColor;
    color: #0f172a;
    letter-spacing: 0;
}

.km-public-shell {
    background:
        linear-gradient(180deg, rgba(15, 118, 110, .06), rgba(245, 247, 246, 0) 360px),
        var(--km-bg);
}

.km-public-header {
    box-shadow: 0 1px 0 rgba(16, 24, 32, .06);
}

.km-brand-mark,
.km-icon-mark {
    border-radius: 8px;
    background: linear-gradient(135deg, #073b37, var(--km-primary));
}

.km-nav-links a,
.km-nav-link {
    border-radius: 8px;
}

.km-home-hero {
    min-height: min(680px, calc(100vh - 140px));
    display: flex;
    align-items: end;
    background-image:
        linear-gradient(90deg, rgba(4, 23, 21, .94) 0%, rgba(4, 23, 21, .76) 42%, rgba(4, 23, 21, .22) 68%, rgba(4, 23, 21, .08) 100%),
        url("/static/img/keurmame-local-commerce-hero.png");
    background-size: cover;
    background-position: center;
}

.km-home-hero::before {
    display: none;
}

.km-home-hero h1 {
    max-width: 680px;
    font-size: clamp(2.65rem, 6vw, 5.5rem);
    letter-spacing: 0;
}

.km-home-hero p {
    max-width: 610px;
    color: rgba(255, 255, 255, .86);
}

.km-hero-copy {
    max-width: 720px;
}

.km-home-hero .km-hero-visual {
    display: none;
}

.km-hero-search {
    max-width: 720px;
    grid-template-columns: minmax(0, 1fr) auto;
    border-radius: 12px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(255, 255, 255, .35);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .22);
}

.km-hero-search .form-input {
    color: var(--km-text);
    background: #fff;
}

.km-hero-proof-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    max-width: 720px;
    margin-top: 18px;
}

.km-hero-proof-row span {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 48px;
    padding: 10px 12px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .18);
    color: rgba(255, 255, 255, .9);
    font-size: 13px;
    font-weight: 800;
}

.km-hero-proof-row i {
    color: #facc15;
}

.km-hero-live-panel {
    width: min(420px, 100%);
    margin-left: auto;
    align-self: end;
    border-radius: 10px;
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(255, 255, 255, .45);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .24);
    color: var(--km-text);
    padding: 16px;
}

.km-hero-live-panel .km-stat-label {
    color: var(--km-primary-dark);
}

.km-commerce-strip {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    padding: 18px;
    border: 1px solid rgba(200, 145, 22, .28);
    border-radius: 10px;
    background: #fff;
    box-shadow: var(--km-shadow);
}

.km-commerce-strip-item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    color: #34413d;
    font-weight: 800;
    font-size: 13px;
}

.km-commerce-strip-item i {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--km-accent-soft);
    color: #a16207;
    flex-shrink: 0;
}

.km-market-card {
    border-radius: 8px;
    box-shadow: 0 10px 26px rgba(16, 24, 32, .07);
}

.km-market-card img,
.km-market-card .km-placeholder {
    height: 210px;
}

.km-product-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
    color: var(--km-muted);
    font-size: 12px;
}

.km-pay-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 12px;
}

.km-pay-chip {
    border-radius: 999px;
    padding: 5px 8px;
    font-size: 11px;
    font-weight: 800;
    color: #24413b;
    background: #edf7f4;
}

.km-pay-chip.online {
    background: #ffe4e7;
    color: #991b1b;
}

.km-pay-chip.kmt {
    background: #dcfce7;
    color: #166534;
}

.km-pay-chip.cash {
    background: #f3f4f6;
    color: #101010;
}

.km-dashboard-sidebar {
    background:
        linear-gradient(180deg, rgba(255,255,255,.04), transparent 28%),
        linear-gradient(180deg, #050505 0%, #101010 58%, #063f27 100%);
}

.km-dash-brand-mark {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, var(--km-primary), var(--km-accent));
    box-shadow: 0 16px 32px rgba(0, 0, 0, .24);
}

.km-role-card {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 8px;
    padding: 10px;
}

.km-role-avatar {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.14);
    color: #fde68a;
    flex-shrink: 0;
}

.km-dash-nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 12px;
    border-radius: 8px;
    color: rgba(255,255,255,.72);
    font-size: 14px;
    font-weight: 800;
    transition: background .18s ease, color .18s ease, transform .18s ease;
}

.km-dash-nav-link i {
    width: 18px;
    text-align: center;
    font-size: 13px;
}

.km-dash-nav-link:hover,
.km-dash-nav-link.is-active {
    background: rgba(255,255,255,.12);
    color: #fff;
}

.km-dash-nav-link.is-active {
    box-shadow: inset 3px 0 0 var(--km-accent);
}

.km-dash-nav-link.danger:hover {
    background: rgba(220, 38, 38, .20);
}

.km-dashboard-topbar {
    min-height: 76px;
}

.km-topbar-title {
    min-width: 0;
}

.km-topbar-title span {
    display: block;
    color: var(--km-muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.km-topbar-title strong {
    display: block;
    color: var(--km-secondary);
    font-size: 16px;
}

.km-screen-head,
.km-toolbar {
    margin-bottom: 24px;
}

.km-card,
.km-panel,
.km-stat-card,
.km-action-card,
.km-empty {
    border-radius: 8px;
}

.km-stat-card {
    position: relative;
    overflow: hidden;
}

.km-stat-card::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, var(--km-primary), var(--km-accent));
    opacity: .72;
}

.km-action-card {
    min-height: 92px;
}

.km-action-card strong {
    color: #101820;
}

.km-table tbody tr[data-href]:hover {
    background: #f2faf7;
}

.km-table tbody tr[data-href] td:first-child {
    border-left: 3px solid transparent;
}

.km-table tbody tr[data-href]:hover td:first-child {
    border-left-color: var(--km-primary);
}

.km-detail-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, 420px);
    gap: 20px;
    align-items: start;
}

.km-task-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
    border: 1px solid var(--km-border);
    border-radius: 8px;
    background: #fff;
}

.km-task-row:hover {
    border-color: rgba(15, 118, 110, .32);
    background: #f8fcfb;
}

.km-delivery-focus {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    padding: 16px;
    border: 1px solid rgba(15, 118, 110, .18);
    border-radius: 8px;
    background: #f8fcfb;
    color: var(--km-text);
}

.km-delivery-focus small {
    display: block;
    color: var(--km-muted);
    margin-top: 3px;
}

.km-delivery-icon {
    width: 48px;
    height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: #0f766e;
    background: #ccfbf1;
}

.km-progress-steps {
    display: grid;
    gap: 10px;
}

.km-progress-step {
    display: flex;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--km-border);
    border-radius: 8px;
    background: #fff;
}

.km-progress-step .dot {
    width: 30px;
    height: 30px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #edf7f4;
    color: var(--km-primary-dark);
    flex-shrink: 0;
}

.km-progress-step.is-active {
    border-color: rgba(15, 118, 110, .38);
    background: #effaf6;
}

.km-runtime-tile {
    display: flex;
    flex-direction: column;
    gap: 8px;
    border: 1px solid var(--km-border);
    border-radius: 8px;
    background: #fff;
    padding: 16px;
    box-shadow: 0 10px 24px rgba(16, 16, 16, .05);
}

.km-runtime-tile div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.km-runtime-tile span {
    color: var(--km-muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.km-runtime-tile strong {
    color: var(--km-secondary);
}

.km-runtime-tile small {
    color: var(--km-muted);
}

.km-runtime-tile.is-ok {
    border-color: rgba(15, 143, 79, .30);
    background: #f4fff8;
}

.km-runtime-tile.is-warning {
    border-color: rgba(193, 18, 31, .24);
    background: #fff7f7;
}

.auth-shell select option,
#register-form select option {
    color: #111;
    background: #fff;
}

.bg-purple-50 {
    background-color: #e8f8ef !important;
}

.bg-blue-50 {
    background-color: #e8f8ef !important;
}

.border-blue-200 {
    border-color: rgba(15, 143, 79, .24) !important;
}

.text-purple-500,
.text-purple-700 {
    color: #0f8f4f !important;
}

.text-purple-300,
.text-teal-200,
.text-teal-600,
.text-teal-700,
.hover\:text-teal-700:hover,
.text-blue-800,
.text-blue-900 {
    color: #0f8f4f !important;
}

.bg-teal-600 {
    background-color: #0f8f4f !important;
}

.focus\:border-purple-400:focus,
.focus\:border-green-400:focus {
    border-color: #0f8f4f !important;
}

.from-purple-500,
.to-indigo-600 {
    --tw-gradient-from: #c1121f var(--tw-gradient-from-position) !important;
    --tw-gradient-to: #101010 var(--tw-gradient-to-position) !important;
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
}

.km-dashboard-sidebar {
    background:
        linear-gradient(180deg, rgba(255,255,255,.04), transparent 28%),
        linear-gradient(180deg, #050505 0%, #101010 58%, #063f27 100%);
}

.km-dash-brand-mark,
.km-brand-mark,
.km-icon-mark {
    background: linear-gradient(135deg, var(--km-primary), var(--km-accent));
}

.km-notification-row,
.km-order-head,
.km-order-actions,
.km-inline-form {
    display: flex;
    align-items: center;
    gap: 12px;
}

.km-notification-row {
    justify-content: space-between;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 14px;
    padding: 16px;
    background: #fff;
}

.km-notification-row.is-unread {
    border-color: rgba(20, 184, 166, .35);
    background: #f0fdfa;
}

.km-order-head {
    justify-content: space-between;
    margin-bottom: 20px;
}

.km-order-actions {
    justify-content: flex-end;
    flex-wrap: wrap;
}

.km-inline-form {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.km-inline-form .form-input {
    min-width: 160px;
}

.km-order-timeline {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
    gap: 8px;
}

.km-order-step {
    display: flex;
    min-height: 74px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(15, 23, 42, .08);
    border-radius: 12px;
    padding: 10px;
    text-align: center;
    color: #64748b;
    background: #f8fafc;
}

.km-order-step span {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #e2e8f0;
    color: #64748b;
    font-size: 11px;
}

.km-order-step strong {
    font-size: 12px;
    line-height: 1.2;
}

.km-order-step.is-current {
    border-color: rgba(13, 148, 136, .35);
    color: #0f766e;
    background: #ecfdf5;
}

.km-order-step.is-current span {
    background: #0f766e;
    color: #fff;
}

@media (max-width: 1024px) {
    .km-home-hero {
        min-height: auto;
        background-position: 60% center;
    }

    .km-hero-live-panel {
        margin-left: 0;
    }

    .km-commerce-strip {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .km-detail-shell {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .km-home-hero {
        min-height: 620px;
        background-image:
            linear-gradient(180deg, rgba(4, 23, 21, .88) 0%, rgba(4, 23, 21, .72) 52%, rgba(4, 23, 21, .48) 100%),
            url("/static/img/keurmame-local-commerce-hero.png");
        background-position: center top;
    }

    .km-hero-proof-row {
        display: none;
    }

    .km-home-hero h1 {
        font-size: clamp(2.45rem, 12vw, 3.25rem);
    }

    .km-hero-search {
        grid-template-columns: 1fr;
        padding: 8px;
    }

    .km-commerce-strip {
        grid-template-columns: 1fr;
    }

    .km-topbar-title {
        display: none;
    }

    .km-notification-row,
    .km-order-head,
    .km-order-actions,
    .km-inline-form {
        align-items: stretch;
        flex-direction: column;
    }

    .km-inline-form .form-input {
        width: 100%;
    }
}

/* UIUX multiprofile rework — Comptoir Numérique */
.km-profile-hero{position:relative;display:flex;justify-content:space-between;gap:1.25rem;align-items:flex-start;margin-bottom:1.5rem;padding:1.5rem;border:1px solid rgba(20,24,43,.10);border-radius:24px;background:var(--sable);box-shadow:0 18px 44px rgba(20,24,43,.08);overflow:hidden}
.km-profile-hero:before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:var(--terre)}
.km-profile-hero h1{font-family:"Fraunces","Inter",serif;font-size:clamp(2rem,4vw,3.25rem);line-height:1;margin:0;color:var(--encre)}
.km-profile-hero p{max-width:760px;margin:.55rem 0 0;color:#5d5f69}.km-profile-hero--admin{background:#111827;color:#fff;border-color:rgba(255,255,255,.12)}.km-profile-hero--admin h1,.km-profile-hero--admin p{color:#fff}.km-profile-hero--admin:before{background:var(--or-kmt)}
.km-profile-hero--supplier:before{background:var(--vert-statut)}.km-profile-hero--client:before{background:var(--terre)}.km-profile-hero--delivery:before{background:var(--indigo-mali)}.km-profile-hero--social:before{background:var(--indigo-mali)}
.km-kmt-ticker{height:32px;display:inline-flex;align-items:center;gap:.45rem;padding:0 .8rem;border-radius:999px;background:var(--encre);color:var(--or-kmt);font-variant-numeric:tabular-nums;border:1px solid rgba(212,163,49,.34);white-space:nowrap}.km-kmt-ticker span{color:#fff;font-size:.74rem;text-transform:uppercase;letter-spacing:.08em}.km-kmt-ticker strong{font-size:.82rem}.km-kmt-ticker em{font-size:.7rem;color:#fff;background:rgba(212,163,49,.18);border-radius:999px;padding:.08rem .45rem;font-style:normal}
.km-profile-brief{border:1px solid rgba(194,98,45,.16);border-radius:24px;padding:1.25rem;background:linear-gradient(180deg,rgba(246,243,236,.92),rgba(255,255,255,.92));box-shadow:0 12px 34px rgba(20,24,43,.06)}
.km-admin-console,.km-supplier-control-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:1rem}.km-console-tile,.km-control-card{display:flex;flex-direction:column;gap:.35rem;padding:1.15rem;border-radius:20px;border:1px solid rgba(20,24,43,.12);background:#fff;box-shadow:0 12px 30px rgba(20,24,43,.06);transition:transform .18s ease,box-shadow .18s ease}.km-console-tile:hover,.km-control-card:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(20,24,43,.10)}.km-console-tile span,.km-control-kicker{text-transform:uppercase;letter-spacing:.08em;font-size:.72rem;color:var(--terre);font-weight:800}.km-console-tile strong,.km-control-card strong{font-size:1.05rem;color:var(--encre)}.km-console-tile small,.km-control-card small{color:#6b7280}.km-control-card--node{background:linear-gradient(135deg,var(--encre),var(--indigo-mali));color:#fff}.km-control-card--node strong,.km-control-card--node small{color:#fff}.km-control-card--social{background:linear-gradient(135deg,#fff,var(--sable))}
.km-order-card,.km-task-row,.km-product-suggestion{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid rgba(20,24,43,.10);border-radius:16px;padding:.95rem;background:#fff}.km-order-card strong,.km-task-row span,.km-product-suggestion strong{color:var(--encre)}.km-order-card small,.km-product-suggestion small{display:block;color:#6b7280}.km-money,.km-icon-mark--kmt{color:var(--or-kmt)!important}.km-help-card{background:linear-gradient(180deg,#fff,var(--sable))}.km-delivery-now{display:grid;gap:1rem}.km-delivery-focus--large{font-size:1.05rem;padding:1.25rem;border:2px solid rgba(42,47,107,.16);background:#fff}.km-delivery-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.85rem}.km-empty--large{padding:2rem;text-align:center}
.km-card--technical{background:#fff;border-top:4px solid var(--or-kmt)}.km-action-card--primary{border-color:rgba(194,98,45,.28);background:linear-gradient(180deg,#fff,var(--sable))}.km-stat-grid--compact{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
@media (max-width:760px){.km-profile-hero{display:block;padding:1.1rem}.km-head-actions{margin-top:1rem}.km-dashboard-topbar{gap:.75rem}.km-kmt-ticker{max-width:100%;overflow:hidden}.km-delivery-focus--large{display:grid}.km-dashboard-content{padding:1rem!important}}

/* UIUX visibility pass — 20260620: force visible profile differentiation after cache-bust */
.km-dashboard-shell .km-profile-hero{
  border:1px solid rgba(15,23,42,.10);
  box-shadow:0 24px 70px rgba(15,23,42,.13);
  overflow:hidden;
}
.km-dashboard-shell .km-profile-hero::before{
  content:""; position:absolute; inset:0 auto 0 0; width:9px; background:var(--km-profile-accent,#0f8f4f);
}
.km-profile-hero--admin{--km-profile-accent:#111827; background:linear-gradient(135deg,#0f172a,#1f2937)!important; color:#fff;}
.km-profile-hero--supplier{--km-profile-accent:#0f8f4f; background:linear-gradient(135deg,#ecfdf5,#fff7ed)!important;}
.km-profile-hero--client{--km-profile-accent:#c1121f; background:linear-gradient(135deg,#fff7ed,#ffffff)!important;}
.km-profile-hero--delivery{--km-profile-accent:#f59e0b; background:linear-gradient(135deg,#fffbeb,#fef3c7)!important;}
.km-profile-hero--social{--km-profile-accent:#2563eb; background:linear-gradient(135deg,#eff6ff,#ffffff)!important;}
.km-profile-hero--admin .km-eyebrow,
.km-profile-hero--admin .km-section-label,
.km-profile-hero--admin p,
.km-profile-hero--admin h1{color:#fff!important;}
.km-admin-console,.km-supplier-control,.km-client-journey,.km-delivery-board{border-top:5px solid var(--km-profile-accent,#0f8f4f);}
.km-dashboard-shell--fournisseur .km-action-card[href*="mamenode"],
.km-dashboard-shell--fournisseur .km-action-card[href*="social"]{
  transform:translateY(-2px); border:2px solid #99f6e4; background:linear-gradient(135deg,#ecfdf5,#fff)!important;
}
.km-social-onboarding{border:2px solid #bfdbfe!important; background:linear-gradient(135deg,#eff6ff,#ffffff)!important;}

/* Panier marketplace — Comptoir Numérique */
.km-cart-nav-btn{display:inline-flex;align-items:center;gap:.45rem;border:1px solid rgba(194,98,45,.26);background:var(--sable);color:var(--encre);border-radius:999px;padding:.62rem .9rem;font-weight:800;transition:background .18s ease,transform .18s ease}.km-cart-nav-btn:hover{background:#fff;transform:translateY(-1px)}.km-cart-count{display:inline-flex;min-width:1.35rem;height:1.35rem;align-items:center;justify-content:center;border-radius:999px;background:var(--terre);color:#fff;font-size:.76rem;font-variant-numeric:tabular-nums}.km-cart-drawer{position:fixed;inset:0;z-index:80;pointer-events:none;background:rgba(20,24,43,0);transition:background .28s ease}.km-cart-drawer.is-open{pointer-events:auto;background:rgba(20,24,43,.34)}.km-cart-drawer-panel{position:absolute;top:0;right:0;height:100%;width:min(420px,100%);background:var(--sable);border-left:1px solid rgba(20,24,43,.12);box-shadow:-22px 0 54px rgba(20,24,43,.22);transform:translateX(100%);transition:transform .32s ease;display:flex;flex-direction:column;padding:1.25rem}.km-cart-drawer.is-open .km-cart-drawer-panel{transform:translateX(0)}.km-cart-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;border-bottom:1px solid rgba(20,24,43,.10);padding-bottom:1rem}.km-cart-head h2{font-family:"Fraunces","Inter",serif;font-size:1.7rem;color:var(--encre);margin:0}.km-cart-close,.km-cart-remove{border:0;background:#fff;color:var(--encre);border-radius:999px;width:2.1rem;height:2.1rem;font-weight:900}.km-cart-drawer-items{overflow:auto;flex:1;padding:1rem 0}.km-cart-shop{border:1px solid rgba(20,24,43,.10);background:#fff;border-radius:18px;padding:.9rem;margin-bottom:.85rem}.km-cart-shop-title{display:flex;align-items:center;gap:.45rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;color:var(--encre);font-weight:900;margin-bottom:.6rem}.km-status-dot{width:.55rem;height:.55rem;border-radius:999px;background:var(--vert-statut);display:inline-block}.km-cart-line{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.65rem;border-top:1px solid rgba(20,24,43,.08);padding:.75rem 0}.km-cart-line:first-of-type{border-top:0}.km-cart-line-main strong{display:block;color:var(--encre)}.km-cart-line-main small{color:#6b7280;font-variant-numeric:tabular-nums}.km-cart-stepper{display:inline-flex;align-items:center;border:1px solid rgba(20,24,43,.12);border-radius:999px;overflow:hidden;background:var(--sable)}.km-cart-stepper button{width:1.9rem;height:1.9rem;border:0;background:transparent;font-weight:900;color:var(--terre)}.km-cart-stepper span{min-width:1.8rem;text-align:center;font-weight:800}.km-cart-drawer-total,.km-cart-summary{border-top:1px solid rgba(20,24,43,.12);padding-top:1rem}.km-cart-drawer-total{display:flex;align-items:center;justify-content:space-between;font-size:1.05rem}.km-cart-drawer-total strong,.km-cart-summary strong{color:var(--or-kmt);font-size:1.8rem;font-variant-numeric:tabular-nums}.km-cart-drawer-actions{display:grid;gap:.75rem;margin-top:1rem}.km-cart-page{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:1.25rem;align-items:start}.km-cart-page-list,.km-cart-summary{background:#fff;border:1px solid rgba(20,24,43,.10);border-radius:24px;padding:1.25rem;box-shadow:0 16px 38px rgba(20,24,43,.07)}.km-cart-summary{position:sticky;top:88px}.km-card-detail-link{display:inline-flex;margin-top:.65rem;font-size:.82rem;font-weight:800;color:var(--terre);text-decoration:underline}.km-cart-hero{border-left:6px solid var(--terre)}
@media (prefers-reduced-motion:reduce){.km-cart-drawer,.km-cart-drawer-panel,.km-cart-nav-btn{transition:none}}
@media (max-width:760px){.km-cart-drawer-panel{width:100%;}.km-cart-page{grid-template-columns:1fr}.km-cart-summary{position:static}.km-cart-line{grid-template-columns:1fr;align-items:stretch}.km-cart-stepper{width:max-content}.km-public-nav{gap:.65rem}.km-cart-nav-btn{width:100%;justify-content:center}}


/* Panier marketplace premium design — Comptoir Numérique 20260621T0850 */
.km-public-shell{
  background:
    radial-gradient(circle at 12% 6%, rgba(212,163,49,.13), transparent 18rem),
    linear-gradient(180deg, rgba(246,243,236,.96), rgba(255,255,255,.76) 46%, rgba(246,243,236,.92));
}
.km-public-header{background:rgba(246,243,236,.92);border-bottom:1px solid rgba(20,24,43,.10)}
.km-public-shell .btn-primary,.km-add-cart-btn{background:var(--terre)!important;color:#fff!important;box-shadow:none!important;border:1px solid rgba(194,98,45,.26)}
.km-public-shell .btn-primary:hover,.km-add-cart-btn:hover{background:#a64f24!important;box-shadow:0 16px 34px rgba(194,98,45,.22)!important}
.km-buy-now-btn{background:var(--indigo-mali)!important;border-color:rgba(42,47,107,.3)!important}
.km-add-cart-btn-secondary{background:#fff!important;color:var(--terre)!important;border:2px solid rgba(194,98,45,.34)!important}.km-add-cart-btn-secondary:hover{background:var(--terre)!important;color:#fff!important}
.km-add-cart-btn:disabled,.km-add-cart-btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;background:#9ca3af!important;border-color:#9ca3af!important}.km-add-cart-btn:disabled:hover{transform:none;box-shadow:none!important}
.km-commerce-search-hero,.km-shop-hero-premium,.km-cart-hero-premium{background:linear-gradient(135deg,var(--encre),#1d2348 58%,var(--terre));border:1px solid rgba(212,163,49,.22);box-shadow:0 22px 54px rgba(20,24,43,.18)}
.km-commerce-mode-panel{background:rgba(246,243,236,.12)!important;border:1px solid rgba(246,243,236,.22)!important;color:#fff;border-radius:22px;padding:1rem;box-shadow:none!important}
.km-comptoir-filter{display:grid;grid-template-columns:minmax(260px,1fr) 2fr auto;align-items:end;gap:1rem;background:var(--encre);border:1px solid rgba(212,163,49,.28);border-radius:24px;padding:1rem;box-shadow:0 18px 44px rgba(20,24,43,.16)}
.km-filter-label{display:block;margin:0 0 .35rem;color:var(--sable);font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.km-filter-search .form-input{min-height:50px;border-color:rgba(246,243,236,.18);background:rgba(255,255,255,.96)}
.km-filter-chips{display:flex;flex-wrap:wrap;gap:.65rem}.km-filter-chip{width:auto;min-width:132px;border-radius:999px;border:1px solid rgba(246,243,236,.22);background:#fff}.km-filter-submit{min-height:50px;border-radius:999px!important;white-space:nowrap}
.km-comptoir-grid{align-items:stretch}.km-comptoir-card{background:var(--sable);border:1px solid rgba(20,24,43,.12);border-radius:24px;box-shadow:none;overflow:hidden}.km-comptoir-card:hover{transform:translateY(-4px);border-color:rgba(194,98,45,.32);box-shadow:0 20px 44px rgba(20,24,43,.12)}
.km-product-media-link{position:relative;display:block;aspect-ratio:4/5;background:#e9e3d6;overflow:hidden}.km-product-image{width:100%;height:100%;object-fit:cover;transition:transform .45s ease}.km-comptoir-card:hover .km-product-image{transform:scale(1.035)}
.km-type-ribbon{position:absolute;left:1rem;top:1rem;border:1px solid rgba(246,243,236,.45);border-radius:999px;background:rgba(20,24,43,.78);color:var(--sable);padding:.35rem .7rem;font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;backdrop-filter:blur(10px)}
.km-product-body{display:flex;flex:1;flex-direction:column;gap:.8rem;padding:1rem}.km-product-title{font-family:"Fraunces","Inter",serif;font-size:1.35rem;line-height:1.05;color:var(--encre);font-weight:900}.km-product-desc{color:#60636f;font-size:.92rem;line-height:1.55}.km-price-stack{display:grid;gap:.1rem;margin-top:auto}.km-price-stack strong,.km-price-hero strong{color:var(--or-kmt);font-variant-numeric:tabular-nums;font-weight:900;letter-spacing:-.02em}.km-price-stack strong{font-size:1.35rem}.km-price-stack span,.km-price-hero span{color:#6b7280;font-size:.86rem}.km-price-hero{border:1px solid rgba(212,163,49,.24);border-radius:20px;background:linear-gradient(135deg,#fff,var(--sable));padding:1rem}.km-price-hero strong{display:block;font-size:clamp(2rem,4vw,3.1rem);line-height:1}.km-supplier-seal{display:inline-flex;align-items:center;gap:.45rem;width:max-content;max-width:100%;border:1px solid rgba(60,122,92,.22);border-radius:12px;background:#fff;color:var(--encre);padding:.45rem .65rem;font-size:.78rem;font-weight:900;text-decoration:none}.km-supplier-seal small{color:#6b7280;font-weight:700}.km-supplier-seal-large{font-size:.9rem;padding:.6rem .8rem}.km-card-actions{align-items:flex-start;gap:.75rem;flex-wrap:wrap}.km-card-detail-link{color:var(--encre);font-weight:900;text-decoration:underline;text-decoration-color:rgba(194,98,45,.35);text-underline-offset:4px}.km-card-payments{margin-top:.25rem}.km-pay-chip{border-radius:999px;padding:.28rem .55rem;font-size:.72rem;font-weight:900;border:1px solid rgba(20,24,43,.08);background:#fff}.km-pay-chip.kmt{color:var(--or-kmt)}.km-pay-chip.cash{color:var(--vert-statut)}.km-pay-chip.online{color:var(--indigo-mali)}
.km-product-detail-premium{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,480px);gap:1.35rem;align-items:start}.km-product-gallery{padding:0;overflow:hidden;background:var(--sable);border-radius:28px;box-shadow:none}.km-product-detail-image{width:100%;min-height:clamp(28rem,58vw,42rem);height:100%;object-fit:cover}.km-purchase-panel-premium{border-radius:28px;background:rgba(255,255,255,.94);border:1px solid rgba(20,24,43,.12);box-shadow:0 22px 50px rgba(20,24,43,.10)}.km-product-detail-title{font-family:"Fraunces","Inter",serif;font-size:clamp(2.35rem,5vw,4.1rem);line-height:.95;color:var(--encre);font-weight:900;margin:0 0 .75rem}.km-product-long-desc{max-width:65ch;color:#555966;line-height:1.75;margin-bottom:1.25rem}.km-product-quantity{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid rgba(20,24,43,.10);border-radius:18px;background:var(--sable);padding:.8rem 1rem;font-weight:900;color:var(--encre)}.km-product-stepper input{width:3.4rem;border:0;background:transparent;text-align:center;font-weight:900;color:var(--encre);font-variant-numeric:tabular-nums}.km-product-stepper input:focus{outline:none}
.km-shop-hero-premium:after{content:"";position:absolute;right:2rem;bottom:-3rem;width:11rem;height:11rem;border-radius:28px;border:1px solid rgba(246,243,236,.16);transform:rotate(12deg);background:rgba(246,243,236,.06)}.km-shop-seal-large{position:relative;z-index:1;border:1px solid rgba(246,243,236,.18);border-radius:22px;padding:1rem;background:rgba(246,243,236,.08)}
.km-cart-proof-strip{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1rem}.km-cart-proof-strip span{border:1px solid rgba(246,243,236,.20);border-radius:999px;background:rgba(246,243,236,.10);color:var(--sable);padding:.35rem .7rem;font-size:.78rem;font-weight:900}.km-cart-page-premium{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:1.25rem;align-items:start}.km-cart-page-list-wrap{border:1px solid rgba(20,24,43,.10);border-radius:28px;background:rgba(255,255,255,.70);padding:1rem}.km-cart-summary-premium{position:sticky;top:94px;border-radius:28px;background:var(--encre);color:#fff;border:1px solid rgba(212,163,49,.24);box-shadow:0 22px 54px rgba(20,24,43,.20)}.km-cart-summary-premium .km-stat-label,.km-cart-summary-premium p{color:rgba(255,255,255,.72)}.km-cart-summary-premium strong[data-cart-page-total]{display:block;color:var(--or-kmt);font-size:clamp(2rem,4vw,3rem);line-height:1;font-variant-numeric:tabular-nums;margin:.4rem 0 .6rem}.km-checkout-btn{width:100%}.km-cart-shop{border-radius:22px;background:#fff;border:1px solid rgba(20,24,43,.10)}.km-cart-line{grid-template-columns:3rem minmax(0,1fr) auto auto auto!important;gap:.75rem!important}.km-cart-line.is-compact{grid-template-columns:2.7rem minmax(0,1fr) auto auto!important}.km-cart-thumb{width:3rem;height:3rem;border-radius:14px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--sable),#fff);border:1px solid rgba(194,98,45,.18);color:var(--terre);font-family:"Fraunces","Inter",serif;font-weight:900}.km-cart-line-total{color:var(--or-kmt);font-variant-numeric:tabular-nums;white-space:nowrap}.km-cart-stepper{border:1px solid rgba(20,24,43,.10);border-radius:999px;background:var(--sable);overflow:hidden}.km-cart-stepper button{background:transparent;color:var(--encre);font-weight:900}.km-empty-cart{border-style:dashed;background:rgba(246,243,236,.62)}
@media (max-width:980px){.km-comptoir-filter{grid-template-columns:1fr}.km-filter-chip{flex:1 1 150px}.km-product-detail-premium,.km-cart-page-premium{grid-template-columns:1fr}.km-cart-summary-premium{position:static}.km-product-detail-image{min-height:24rem}}
@media (max-width:640px){.km-cart-line,.km-cart-line.is-compact{grid-template-columns:2.7rem minmax(0,1fr) auto!important}.km-cart-line-total{grid-column:2 / -1}.km-cart-remove{grid-column:3}.km-product-title{font-size:1.18rem}.km-card-actions .btn-primary{width:100%;justify-content:center}.km-supplier-seal{width:100%}}

/* VISUAL FRONT-OFFICE PREMIUM 20260621T104631Z */
.km-public-shell{
  background:
    radial-gradient(circle at 8% 4%, rgba(212,163,49,.18), transparent 18rem),
    radial-gradient(circle at 88% 12%, rgba(194,98,45,.14), transparent 20rem),
    linear-gradient(180deg,#f6f3ec 0%,#fffaf0 34%,#ffffff 70%,#f6f3ec 100%)!important;
}
.km-public-header{
  position:sticky;top:0;z-index:50;
  background:rgba(246,243,236,.86)!important;
  backdrop-filter:blur(18px);
  border-bottom:1px solid rgba(20,24,43,.12)!important;
  box-shadow:0 14px 34px rgba(20,24,43,.08);
}
.km-brand-mark{background:linear-gradient(135deg,var(--terre),var(--or-kmt))!important;color:#fff!important;box-shadow:0 10px 24px rgba(194,98,45,.22)}
.km-home-hero-premium{
  position:relative;overflow:hidden;
  min-height:clamp(520px,72vh,760px);
  background:
    linear-gradient(135deg,rgba(20,24,43,.96),rgba(29,35,72,.92) 48%,rgba(194,98,45,.90)),
    radial-gradient(circle at 18% 22%,rgba(212,163,49,.30),transparent 18rem)!important;
  border:1px solid rgba(212,163,49,.26)!important;
  box-shadow:0 34px 90px rgba(20,24,43,.24)!important;
}
.km-home-hero-premium:before{
  content:"";position:absolute;right:-5rem;top:-7rem;width:22rem;height:22rem;border-radius:44px;
  transform:rotate(18deg);border:1px solid rgba(246,243,236,.15);background:rgba(246,243,236,.06);
}
.km-home-hero-premium:after{
  content:"Comptoir numérique";position:absolute;right:2rem;bottom:2rem;
  color:rgba(246,243,236,.11);font-family:"Fraunces","Inter",serif;font-size:clamp(3rem,8vw,8rem);font-weight:900;line-height:.85;
  pointer-events:none;
}
.km-home-hero-premium .km-hero-copy{position:relative;z-index:1}.km-home-hero-premium h1{font-size:clamp(3.2rem,7.8vw,6.6rem)!important;line-height:.88!important;letter-spacing:-.055em;color:#fff!important;max-width:11ch}.km-home-hero-premium p{color:rgba(246,243,236,.86)!important;font-size:clamp(1.05rem,2vw,1.28rem)!important;max-width:58ch}.km-hero-kicker{display:inline-flex;align-items:center;gap:.55rem;border:1px solid rgba(212,163,49,.35);border-radius:999px;background:rgba(246,243,236,.10);color:var(--sable);padding:.42rem .72rem;margin-bottom:1rem;font-size:.78rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.km-hero-kicker strong{color:var(--or-kmt);font-weight:900}.km-home-proof-row span{background:rgba(246,243,236,.12)!important;border:1px solid rgba(246,243,236,.22)!important;color:#fff!important}.km-hero-search{background:rgba(255,255,255,.12)!important;border:1px solid rgba(246,243,236,.20);border-radius:22px;padding:.65rem;backdrop-filter:blur(14px);box-shadow:0 18px 44px rgba(20,24,43,.20)}.km-hero-search .form-input{min-height:54px;border-radius:16px;background:#fff!important}.km-hero-search .btn-primary{min-height:54px;border-radius:16px!important}.km-hero-visual{position:relative;z-index:1;filter:drop-shadow(0 26px 54px rgba(20,24,43,.28))}.km-hero-shop-card,.km-hero-wallet-card,.km-hero-stats{border:1px solid rgba(246,243,236,.20)!important;background:rgba(255,255,255,.90)!important;backdrop-filter:blur(16px)}.km-commerce-strip-premium{border-radius:28px;background:var(--encre)!important;border:1px solid rgba(212,163,49,.26)!important;box-shadow:0 24px 60px rgba(20,24,43,.16);padding:1rem}.km-commerce-strip-premium .km-commerce-strip-item{background:rgba(246,243,236,.08)!important;border:1px solid rgba(246,243,236,.14)!important;color:#fff;border-radius:20px}.km-commerce-strip-premium .km-commerce-strip-item small{color:rgba(246,243,236,.70)!important}.km-home-product-card{border-radius:28px!important;border:1px solid rgba(20,24,43,.12)!important;background:#f6f3ec!important;box-shadow:0 18px 48px rgba(20,24,43,.10)!important}.km-home-product-card:hover{transform:translateY(-6px);box-shadow:0 30px 70px rgba(20,24,43,.16)!important}.km-price-pill{border-radius:999px;background:var(--encre)!important;color:var(--or-kmt)!important;border:1px solid rgba(212,163,49,.34)!important;padding:.52rem .76rem;font-weight:900}.km-commerce-search-hero,.km-cart-hero-premium,.km-shop-hero-premium{box-shadow:0 34px 80px rgba(20,24,43,.22)!important}.km-comptoir-card{box-shadow:0 16px 40px rgba(20,24,43,.09)!important}.km-comptoir-card:hover{box-shadow:0 28px 66px rgba(20,24,43,.16)!important}

/* HOME NO PRODUCTS + PRODUCT IMAGE FIX 20260621T1219Z */
.km-home-orientation{
  border:1px solid rgba(20,24,43,.10);
  border-radius:30px;
  background:rgba(255,255,255,.72);
  padding:clamp(1rem,2vw,1.45rem);
  box-shadow:0 22px 54px rgba(20,24,43,.10);
}
.km-home-quick-search{display:grid;grid-template-columns:minmax(220px,1fr) minmax(180px,260px) auto;gap:.75rem;margin:1rem 0 0;padding:.85rem;border-radius:22px;background:rgba(20,24,43,.055);border:1px solid rgba(20,24,43,.08)}.km-home-quick-search .form-input{background:#fff;border-radius:16px}.km-home-quick-search .btn-primary{border-radius:16px!important;justify-content:center}@media (max-width:780px){.km-home-quick-search{grid-template-columns:1fr}}
.km-home-orientation-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem;margin-top:1rem}
.km-home-route-card{display:flex;align-items:center;gap:1rem;border:1px solid rgba(20,24,43,.10);border-radius:24px;background:linear-gradient(180deg,#fff,#f6f3ec);padding:1.15rem;text-decoration:none;color:var(--encre);min-height:118px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.km-home-route-card:hover{transform:translateY(-3px);border-color:rgba(194,98,45,.28);box-shadow:0 18px 38px rgba(20,24,43,.11)}
.km-home-route-card--primary{background:linear-gradient(135deg,var(--encre),#23305d);color:#fff;border-color:rgba(212,163,49,.28)}
.km-home-route-card strong{display:block;font-size:1rem;font-weight:950}.km-home-route-card small{display:block;margin-top:.28rem;color:inherit;opacity:.72;line-height:1.45}
.km-product-media-link{aspect-ratio:1 / 1!important;background:linear-gradient(135deg,#f7f1e4,#ffffff)!important;border-bottom:1px solid rgba(20,24,43,.08)}
.km-product-image{display:block;width:100%!important;height:100%!important;object-fit:contain!important;object-position:center!important;padding:.55rem;background:transparent;filter:saturate(1.02) contrast(1.01)}
.km-comptoir-card:hover .km-product-image{transform:scale(1.012)!important}
.km-product-gallery{display:flex;align-items:center;justify-content:center;aspect-ratio:4 / 3;min-height:auto!important;background:linear-gradient(135deg,#f7f1e4,#fff)!important}
.km-product-detail-image{display:block;width:100%!important;height:100%!important;min-height:0!important;max-height:clamp(360px,64vh,620px);object-fit:contain!important;object-position:center!important;padding:clamp(.7rem,2vw,1.25rem);background:transparent}
@media (max-width:640px){.km-product-media-link{aspect-ratio:4 / 3!important}.km-product-detail-image{max-height:430px}.km-home-orientation{border-radius:22px}.km-home-route-card{border-radius:18px}}