*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
        html, body {
            min-height:100%;
            font-family:'Segoe UI',system-ui,sans-serif;
            overflow-x:hidden;
            overflow-y:auto;
            scroll-behavior:smooth;
        }
        a { text-decoration:none; color:inherit; }

        body { background:#f5f5f5; display:flex; flex-direction:column; }

        /* HEADER */
        .header {
            height:80px; flex-shrink:0;
            background:linear-gradient(135deg,#0f2440 0%,#1a3a5c 55%,#2e6da4 100%);
            border-bottom:3px solid #f39c12;
            display:flex; align-items:center; padding:0 32px; gap:16px;
            box-shadow:0 2px 12px rgba(0,0,0,0.35);
        }
        .header-logo { width:50px; height:50px; border-radius:50%; object-fit:contain; border:2px solid rgba(255,255,255,0.3); }
        .header-brand { font-size:28px; font-weight:900; letter-spacing:6px; color:#fff; }
        .header-brand span { color:#f39c12; }
        .header-sub { font-size:13px; color:rgba(255,255,255,0.8); letter-spacing:2px; text-transform:uppercase; margin-top:3px; }
        .header-right {
            margin-left:auto;
            font-size:14px;
            color:rgba(255,255,255,0.75);
            display:flex;
            align-items:center;
            gap:16px;
        }
        .lang-switch {
            display:inline-flex;
            align-items:center;
            gap:.55rem;
            color:#fff;
            font-size:.78rem;
            font-weight:700;
            letter-spacing:.04em;
            text-transform:uppercase;
        }
        .lang-switch select {
            border:1px solid rgba(255,255,255,.24);
            background:rgba(255,255,255,.12);
            color:#fff;
            border-radius:999px;
            padding:7px 12px;
            font-size:.8rem;
            font-weight:700;
            outline:none;
            cursor:pointer;
        }
        .lang-switch select option {
            color:#0f172a;
            background:#fff;
        }

        /* MAIN */
        .main {
            flex:1 0 auto;
            min-height:calc(100vh - 80px);
            display:flex;
            align-items:flex-start;
            justify-content:center;
            padding:12px 32px 96px;
            overflow:visible;
        }

        .dashboard-shell {
            width:min(1240px, 100%);
            margin:0 auto;
        }

        /* GRILLE style tiroir Odoo */
        .apps-grid {
            display:flex; flex-wrap:wrap;
            justify-content:center; align-content:center;
            gap:26px 36px;
            max-width:1240px; width:100%;
        }

        .dashboard-scroll-down {
            position:fixed;
            right:28px;
            bottom:24px;
            width:52px;
            height:52px;
            display:inline-flex;
            align-items:center;
            justify-content:center;
            border:none;
            border-radius:999px;
            background:rgba(15,36,64,.92);
            color:#fff;
            box-shadow:0 16px 36px rgba(15,36,64,.24);
            cursor:pointer;
            z-index:40;
            transition:transform .18s ease, opacity .18s ease, background .18s ease;
        }

        .dashboard-scroll-down:hover {
            transform:translateY(-2px);
            background:rgba(23,56,95,.98);
        }

        .dashboard-scroll-down[hidden] {
            display:none;
        }

        .dashboard-scroll-down span {
            font-size:24px;
            line-height:1;
            transform:translateY(1px);
        }

        /* TILE */
        .app-tile {
            display:flex; flex-direction:column; align-items:center;
            gap:10px; width:117px; cursor:pointer;
            border-radius:13px; padding:13px 5px 10px;
            transition:background 0.15s, transform 0.15s;
        }
        .app-tile:hover { background:rgba(0,0,0,0.05); transform:translateY(-2px); }
        .app-tile:active { transform:scale(0.96); }

        /* Icone carree coloree */
        .app-icon {
            width:83px; height:83px; border-radius:21px;
            background:var(--ac,#6366f1);
            display:flex; align-items:center; justify-content:center;
            font-size:36px; flex-shrink:0;
            box-shadow:0 4px 14px rgba(0,0,0,0.18);
            transition:box-shadow 0.15s, transform 0.15s;
        }
        .app-tile:hover .app-icon { box-shadow:0 6px 22px rgba(0,0,0,0.28); transform:scale(1.04); }

        /* Nom */
        .app-name {
            font-size:14px; font-weight:800;
            color:#1e293b; text-align:center; line-height:1.3;
        }

        /* ── AUTH MODAL ──────────────────────────────────────────── */
        .auth-overlay {
            position:fixed; inset:0; z-index:9999;
            background:linear-gradient(135deg,#0f2440 0%,#1a3a5c 60%,#2e6da4 100%);
            display:flex; align-items:center; justify-content:center;
            transition:opacity 0.35s;
        }
        .auth-overlay.hidden { opacity:0; pointer-events:none; }

        .auth-card {
            background:#fff; border-radius:18px;
            padding:40px 44px 36px;
            width:480px; max-width:96vw;
            max-height:92vh; overflow-y:auto;
            box-shadow:0 20px 60px rgba(0,0,0,0.4);
            animation:authSlideIn .35s cubic-bezier(.2,.8,.3,1);
        }
        @keyframes authSlideIn { from{ transform:translateY(32px);opacity:0; } to{ transform:translateY(0);opacity:1; } }

        .auth-logo-row { text-align:center; margin-bottom:28px; }
        .auth-logo-row .logo-img {
            width:160px; height:auto;
            margin-bottom:2px; display:block; margin-left:auto; margin-right:auto;
        }
        .auth-logo-row h2 { font-size:14px; font-weight:700; color:#1a237e; margin:0; letter-spacing:.5px; }
        .auth-logo-row p  { font-size:12px; color:#78909c; margin:4px 0 0; }

        .auth-field { margin-bottom:18px; }
        .auth-field label { display:block; font-size:12px; font-weight:700; color:#455a64; margin-bottom:6px; text-transform:uppercase; letter-spacing:.5px; }
        .auth-field input {
            width:100%; padding:12px 14px; border:2px solid #e0e7ef;
            border-radius:9px; font-size:15px; outline:none;
            transition:border-color .2s;
        }
        .auth-field input:focus { border-color:#3f51b5; }

        /* ── Eye toggle password ── */
        .pwd-wrapper { position:relative; }
        .pwd-wrapper input { padding-right:44px; }
        .pwd-eye {
            position:absolute; right:12px; top:50%; transform:translateY(-50%);
            cursor:pointer; color:#90a4ae; font-size:18px; user-select:none;
            line-height:1; transition:color .15s;
        }
        .pwd-eye:hover { color:#3f51b5; }

        .auth-btn {
            width:100%; padding:14px; border:none; border-radius:9px;
            background:linear-gradient(135deg,#1a237e,#283593);
            color:#fff; font-size:15px; font-weight:700;
            cursor:pointer; transition:opacity .2s;
            margin-top:4px;
        }
        .auth-btn:hover { opacity:.9; }
        .auth-btn:disabled { opacity:.6; cursor:not-allowed; }

        .auth-error {
            background:#ffeaea; border:1px solid #ffbdbd;
            color:#c62828; padding:11px 14px; border-radius:8px;
            font-size:13px; margin-bottom:16px; display:none;
        }
        .auth-error.visible { display:block; }

        .auth-warning {
            background:#fff8e1; border:1px solid #ffe082;
            color:#e65100; padding:10px 14px; border-radius:8px;
            font-size:12px; margin-bottom:14px;
        }

        .otp-label { font-size:13px; color:#546e7a; text-align:center; margin-bottom:20px; line-height:1.5; }
        .otp-input {
            text-align:center !important; font-size:28px !important;
            letter-spacing:12px !important; font-family:'Courier New',monospace !important;
            font-weight:700 !important;
        }
        .otp-countdown { text-align:center; font-size:12px; color:#78909c; margin-top:12px; }
        .otp-countdown span { color:#e53935; font-weight:700; }
        .auth-back { display:block; text-align:center; margin-top:14px; font-size:13px; color:#78909c; cursor:pointer; }
        .auth-back:hover { color:#283593; }

        /* Dev hint */
        .dev-otp-hint {
            background:#e8f5e9; border:1px solid #a5d6a7;
            color:#1b5e20; padding:10px 14px; border-radius:8px;
            font-size:12px; margin-top:12px; text-align:center; display:none;
        }
        .dev-otp-hint.visible { display:block; }

        /* ── Auth Tabs ── */
        .auth-tabs { display:flex; border-bottom:2px solid #e8eef7; margin:0 0 20px; }
        .auth-tab {
            flex:1; padding:9px 4px 11px; border:none; background:none;
            font-size:11px; font-weight:700; color:#90a4ae; cursor:pointer;
            border-bottom:2px solid transparent; margin-bottom:-2px;
            transition:color .2s,border-color .2s; line-height:1.3; text-align:center;
        }
        .auth-tab:hover { color:#3f51b5; }
        .auth-tab.active { color:#1a237e; border-bottom-color:#3f51b5; }

        /* ── Form extras ── */
        .auth-field select {
            width:100%; padding:12px 34px 12px 14px; border:2px solid #e0e7ef;
            border-radius:9px; font-size:14px; outline:none; background:#fff;
            -webkit-appearance:none; appearance:none; cursor:pointer;
            background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23455a64' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");
            background-repeat:no-repeat; background-position:right 13px center;
            transition:border-color .2s;
        }
        .auth-field select:focus { border-color:#3f51b5; }
        .auth-row { display:flex; gap:12px; }
        .auth-row .auth-field { flex:1; min-width:0; }
        .pwd-strength { height:4px; border-radius:2px; margin-top:6px; background:#e0e7ef; }
        .pwd-strength.level-1 { background:#ef5350; }
        .pwd-strength.level-2 { background:#ff9800; }
        .pwd-strength.level-3 { background:#4caf50; }
        .auth-separator {
            display:flex; align-items:center; gap:10px;
            color:#90a4ae; font-size:11px; font-weight:700; text-transform:uppercase;
            letter-spacing:.5px; margin:16px 0 14px;
        }
        .auth-separator::before,.auth-separator::after { content:''; flex:1; height:1px; background:#e0e7ef; }
        .auth-success { text-align:center; padding:6px 0 2px; }
        .auth-success .suc-icon { font-size:52px; display:block; margin-bottom:12px; }
        .auth-success h3 { font-size:18px; font-weight:800; color:#2e7d32; margin:0 0 10px; }
        .auth-success p  { font-size:13px; color:#546e7a; line-height:1.6; margin:0 0 8px; }
        .auth-btn-secondary {
            width:100%; padding:12px; border:2px solid #c5cae9; border-radius:9px;
            background:transparent; color:#455a64; font-size:14px; font-weight:600;
            cursor:pointer; transition:all .2s; margin-top:10px;
        }
        .auth-btn-secondary:hover { border-color:#3f51b5; color:#1a237e; }

        /* ── CGU / Politique de confidentialité ──────────────────────── */
        .legal-check-row {
            display:flex; align-items:flex-start; gap:10px;
            margin:16px 0 14px; padding:14px 16px;
            background:#f0f4ff; border:1.5px solid #c7d2fe;
            border-radius:9px; font-size:13px; color:#374151;
            line-height:1.55;
        }
        .legal-check-row input[type=checkbox] {
            width:18px; height:18px; min-width:18px; cursor:pointer;
            accent-color:#3f51b5; margin-top:1px;
        }
        .legal-check-row a {
            color:#3f51b5; text-decoration:underline; font-weight:600;
            cursor:pointer;
        }
        .legal-check-row a:hover { color:#1a237e; }
        /* Modal légale */
        .legal-modal-overlay {
            display:none; position:fixed; inset:0;
            background:rgba(0,0,0,.55); z-index:99999;
            align-items:center; justify-content:center;
            animation:fadeIn .18s ease;
        }
        .legal-modal-overlay.open { display:flex; }
        @keyframes fadeIn { from{opacity:0} to{opacity:1} }
        .legal-modal-box {
            background:#fff; border-radius:14px;
            width:min(680px,94vw); max-height:82vh;
            display:flex; flex-direction:column;
            box-shadow:0 20px 60px rgba(0,0,0,.3);
            overflow:hidden;
        }
        .legal-modal-head {
            display:flex; justify-content:space-between; align-items:center;
            padding:18px 22px 16px;
            border-bottom:2px solid #e8eaf6;
            background:linear-gradient(135deg,#1a237e,#3949ab);
            color:#fff; flex-shrink:0;
        }
        .legal-modal-head h2 { font-size:1.05rem; font-weight:700; margin:0; }
        .legal-modal-head .lm-version {
            font-size:.72rem; background:rgba(255,255,255,.22);
            border-radius:20px; padding:2px 10px; margin-left:10px;
        }
        .legal-modal-close {
            background:rgba(255,255,255,.18); border:none; color:#fff;
            width:30px; height:30px; border-radius:50%;
            font-size:18px; cursor:pointer; display:flex;
            align-items:center; justify-content:center;
            transition:background .15s;
        }
        .legal-modal-close:hover { background:rgba(255,80,80,.55); }
        .legal-modal-scroll-hint {
            font-size:.78rem; color:#6b7280; background:#fef9c3;
            padding:7px 22px; border-bottom:1px solid #fde68a;
            flex-shrink:0; display:none;
        }
        .legal-modal-scroll-hint.visible { display:block; }
        .legal-modal-body {
            padding:22px 26px 28px; overflow-y:auto; flex:1;
            font-size:.88rem; color:#374151; line-height:1.75;
        }
        .legal-modal-body h3 {
            font-size:.95rem; font-weight:700; color:#1a237e;
            margin:1.4em 0 .4em; border-bottom:1px solid #e8eaf6;
            padding-bottom:.3em;
        }
        .legal-modal-body h3:first-child { margin-top:0; }
        .legal-modal-body p { margin:.4em 0 .9em; }
        .legal-modal-body ul { padding-left:1.3em; margin:.3em 0 .9em; }
        .legal-modal-body ul li { margin-bottom:.35em; }
        .legal-modal-foot {
            padding:14px 22px; border-top:1px solid #e8eaf6;
            display:flex; justify-content:flex-end; gap:10px;
            flex-shrink:0; background:#f9fafb;
        }
        .legal-accept-btn {
            background:linear-gradient(135deg,#1a237e,#3949ab);
            color:#fff; border:none; border-radius:8px;
            padding:9px 22px; font-size:.88rem; font-weight:700;
            cursor:pointer; transition:opacity .2s;
        }
        .legal-accept-btn:hover { opacity:.88; }
        .legal-accept-btn:disabled { opacity:.5; cursor:not-allowed; }
        .legal-close-btn {
            background:#fff; color:#374151; border:1.5px solid #d1d5db;
            border-radius:8px; padding:9px 18px; font-size:.88rem;
            font-weight:600; cursor:pointer; transition:border-color .2s;
        }
        .legal-close-btn:hover { border-color:#9ca3af; }

        /* Header user pill */
        .header-user-pill {
            display:none; align-items:center; gap:10px;
            background:rgba(255,255,255,.12); border-radius:24px;
            padding:6px 14px 6px 10px;
        }
        .header-user-pill.visible { display:flex; }
        .user-avatar {
            width:32px; height:32px; border-radius:50%;
            background:#f39c12; display:flex; align-items:center; justify-content:center;
            font-weight:800; font-size:14px; color:#fff;
        }
        .user-nom { font-size:13px; color:#fff; font-weight:600; }
        .user-role { font-size:11px; color:rgba(255,255,255,.65); }
        .btn-logout {
            background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.3);
            color:#fff; padding:5px 12px; border-radius:16px;
            font-size:12px; cursor:pointer; transition:background .2s;
            margin-left:6px;
        }
        .btn-logout:hover { background:rgba(255,80,80,.5); }

        /* Reset-success toast */
        .reset-success-toast {
            position:fixed; bottom:28px; left:50%; transform:translateX(-50%); z-index:8888;
            background:#2e7d32; color:#fff; padding:14px 24px; border-radius:10px;
            font-size:14px; box-shadow:0 4px 18px rgba(0,0,0,.3);
            display:none; text-align:center; white-space:nowrap;
        }
        .reset-success-toast.visible { display:block; }

        /* ── PREMIUM SAAS OVERRIDES ───────────────────────────── */
        body {
            background:
                radial-gradient(circle at top left, rgba(40, 93, 150, 0.22), transparent 26%),
                radial-gradient(circle at 85% 10%, rgba(243, 156, 18, 0.20), transparent 20%),
                linear-gradient(180deg, #eef3f9 0%, #f7f9fc 54%, #edf2f8 100%);
            color:#132238;
        }

        body::before {
            content:'';
            position:fixed;
            inset:0;
            background-image:linear-gradient(rgba(15,36,64,.03) 1px, transparent 1px),linear-gradient(90deg, rgba(15,36,64,.03) 1px, transparent 1px);
            background-size:40px 40px;
            pointer-events:none;
            opacity:.3;
        }

        .header {
            height:88px;
            margin:18px 18px 0;
            border:1px solid rgba(15,36,64,.08);
            border-bottom:none;
            border-radius:28px;
            background:linear-gradient(135deg, rgba(14,36,63,.94), rgba(28,61,102,.92));
            backdrop-filter:blur(18px);
            box-shadow:0 24px 60px rgba(15,36,64,.18);
        }

        .header::after {
            content:'';
            position:absolute;
            right:-70px;
            bottom:-60px;
            width:220px;
            height:220px;
            border-radius:50%;
            background:radial-gradient(circle, rgba(243,156,18,.38), transparent 68%);
            pointer-events:none;
        }

        .main {
            padding:22px 24px 28px;
            align-items:flex-start;
        }

        .dashboard-shell {
            width:100%;
            max-width:1320px;
            display:flex;
            flex-direction:column;
            gap:18px;
        }

        .dashboard-monetization-banner {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:1rem;
            padding:1.1rem 1.25rem;
            border-radius:24px;
            border:1px solid rgba(15,36,64,.08);
            background:linear-gradient(135deg, rgba(255,255,255,.94), rgba(241,245,249,.96));
            box-shadow:0 18px 40px rgba(15,36,64,.08);
        }

        .dashboard-monetization-banner[hidden] {
            display:none;
        }

        .dashboard-monetization-banner[data-state="trial-active"] {
            border-color:rgba(37,99,235,.2);
            background:linear-gradient(135deg, rgba(239,246,255,.96), rgba(255,255,255,.94));
        }

        .dashboard-monetization-banner[data-state="trial-ending"] {
            border-color:rgba(245,158,11,.35);
            background:linear-gradient(135deg, rgba(255,247,237,.98), rgba(255,255,255,.94));
        }

        .dashboard-monetization-banner[data-state="expired"] {
            border-color:rgba(220,38,38,.24);
            background:linear-gradient(135deg, rgba(254,242,242,.98), rgba(255,255,255,.94));
        }

        .dashboard-monetization-copy {
            display:flex;
            flex-direction:column;
            gap:.35rem;
            min-width:0;
        }

        .dashboard-monetization-eyebrow {
            font-size:.72rem;
            font-weight:800;
            letter-spacing:.08em;
            text-transform:uppercase;
            color:#64748b;
        }

        .dashboard-monetization-title {
            margin:0;
            font-size:1.15rem;
            color:#0f172a;
        }

        .dashboard-monetization-message {
            margin:0;
            color:#475569;
            line-height:1.55;
        }

        .dashboard-monetization-meta {
            display:flex;
            flex-wrap:wrap;
            gap:.55rem;
            margin-top:.2rem;
        }

        .dashboard-monetization-pill {
            display:inline-flex;
            align-items:center;
            min-height:32px;
            padding:.35rem .75rem;
            border-radius:999px;
            background:rgba(15,36,64,.06);
            color:#334155;
            font-size:.78rem;
            font-weight:700;
        }

        .dashboard-monetization-cta {
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-width:200px;
            min-height:48px;
            padding:.8rem 1.1rem;
            border-radius:16px;
            background:linear-gradient(135deg,#1a237e,#3949ab);
            color:#fff;
            font-weight:800;
            box-shadow:0 14px 28px rgba(37,99,235,.18);
        }

        .dashboard-monetization-banner[data-state="trial-ending"] .dashboard-monetization-cta {
            background:linear-gradient(135deg,#d97706,#f59e0b);
        }

        .dashboard-monetization-banner[data-state="expired"] .dashboard-monetization-cta {
            background:linear-gradient(135deg,#b91c1c,#dc2626);
        }

        .dashboard-subscription-limited .apps-grid {
            opacity:.92;
        }

        .dashboard-subscription-limited .app-tile::after {
            content:'Paiement requis';
            position:absolute;
            top:14px;
            right:14px;
            padding:.22rem .55rem;
            border-radius:999px;
            background:rgba(220,38,38,.12);
            color:#b91c1c;
            font-size:.7rem;
            font-weight:800;
            letter-spacing:.04em;
            text-transform:uppercase;
        }

        .apps-grid {
            display:flex;
            flex-direction:column;
            gap:18px;
            max-width:none;
            align-content:start;
        }

        .package-section {
            display:flex;
            flex-direction:column;
            gap:14px;
            padding:20px;
            border:1px solid rgba(15,36,64,.08);
            border-radius:28px;
            background:rgba(255,255,255,.72);
            box-shadow:0 18px 40px rgba(15,36,64,.06);
            backdrop-filter:blur(10px);
        }

        .package-section.package-section-locked {
            border-style:dashed;
            background:rgba(248,250,252,.9);
        }

        .package-section.package-section-current {
            border-color:rgba(37,99,235,.24);
            background:linear-gradient(135deg, rgba(232,242,255,.94), rgba(255,255,255,.94));
            box-shadow:0 22px 48px rgba(37,99,235,.12);
        }

        .package-section-head {
            display:flex;
            align-items:flex-start;
            justify-content:space-between;
            gap:1rem;
        }

        .package-section-eyebrow {
            display:inline-flex;
            align-items:center;
            min-height:28px;
            padding:.22rem .65rem;
            border-radius:999px;
            background:rgba(37,99,235,.08);
            color:#1d4ed8;
            font-size:.72rem;
            font-weight:800;
            letter-spacing:.06em;
            text-transform:uppercase;
        }

        .package-section-title {
            margin:.55rem 0 .3rem;
            color:#0f172a;
            font-size:1.22rem;
        }

        .package-section-copy {
            margin:0;
            color:#64748b;
            line-height:1.55;
            max-width:72ch;
        }

        .package-upgrade-btn {
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-height:46px;
            padding:.78rem 1rem;
            border-radius:16px;
            background:linear-gradient(135deg,#17385f,#285d96);
            color:#fff;
            font-weight:800;
            box-shadow:0 14px 26px rgba(23,56,95,.18);
            white-space:nowrap;
        }

        .package-section-status-badge {
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-height:38px;
            padding:.68rem .95rem;
            border-radius:999px;
            background:linear-gradient(135deg,#17385f,#285d96);
            color:#fff;
            font-size:.78rem;
            font-weight:900;
            letter-spacing:.04em;
            text-transform:uppercase;
            box-shadow:0 14px 26px rgba(23,56,95,.18);
        }

        .package-section-empty {
            padding:1rem 1.15rem;
            border:1px dashed rgba(148,163,184,.55);
            border-radius:18px;
            background:rgba(248,250,252,.88);
            color:#64748b;
            line-height:1.6;
            font-weight:600;
        }

        .package-section-grid,
        .gold-dashboard-group-grid {
            display:grid;
            grid-template-columns:repeat(6, minmax(0, 1fr));
            gap:16px;
        }

        .gold-dashboard-grid {
            display:flex;
            flex-direction:column;
            gap:22px;
        }

        .gold-dashboard-group {
            display:flex;
            flex-direction:column;
            gap:14px;
            padding:22px;
            border:1px solid rgba(15,36,64,.08);
            border-radius:24px;
            background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(244,248,255,.92));
            box-shadow:0 20px 45px rgba(15,36,64,.08);
        }

        .gold-dashboard-group-head {
            display:flex;
            align-items:flex-start;
            justify-content:space-between;
            gap:14px;
        }

        .gold-dashboard-group-title {
            margin:0;
            font-size:1.05rem;
            font-weight:900;
            color:#17385f;
        }

        .gold-dashboard-group-copy {
            margin:.35rem 0 0;
            color:#64748b;
            line-height:1.55;
        }

        .package-section-locked .app-tile {
            border-style:dashed;
        }

        .app-tile {
            width:auto;
            min-height:168px;
            align-items:flex-start;
            justify-content:flex-start;
            padding:18px;
            border:1px solid rgba(15,36,64,.08);
            border-radius:24px;
            background:rgba(255,255,255,.82);
            box-shadow:0 20px 45px rgba(15,36,64,.08);
            backdrop-filter:blur(12px);
            position:relative;
            overflow:hidden;
        }

        .app-tile::before {
            content:'';
            position:absolute;
            inset:-30% auto auto 55%;
            width:120px;
            height:120px;
            border-radius:32px;
            background:radial-gradient(circle, rgba(255,255,255,.38), transparent 68%);
            opacity:.8;
            pointer-events:none;
        }

        .app-tile:hover {
            background:rgba(255,255,255,.92);
            transform:translateY(-4px);
            box-shadow:0 24px 52px rgba(15,36,64,.14);
        }

        .package-section-grid .app-name {
            width:100%;
            overflow-wrap:anywhere;
            word-break:break-word;
        }

        .app-tile.app-tile-locked {
            opacity:.72;
            cursor:pointer;
            border-style:dashed;
            filter:grayscale(.18);
        }

        .app-tile.app-tile-locked::after {
            content:'Upgrade';
            position:absolute;
            top:14px;
            right:14px;
            padding:.22rem .55rem;
            border-radius:999px;
            background:rgba(250,204,21,.18);
            color:#854d0e;
            font-size:.72rem;
            font-weight:800;
            letter-spacing:.04em;
            text-transform:uppercase;
        }

        .upgrade-tiles-banner {
            grid-column:1 / -1;
            margin:.35rem 0 -.35rem;
            padding:1rem 1.15rem;
            border-radius:18px;
            border:1px solid rgba(250,204,21,.45);
            background:linear-gradient(135deg, rgba(250,204,21,.16), rgba(255,255,255,.92));
            color:#854d0e;
            font-weight:700;
            box-shadow:0 10px 22px rgba(250,204,21,.12);
        }

        .upgrade-required-modal {
            position:fixed;
            inset:0;
            display:none;
            align-items:center;
            justify-content:center;
            padding:1.5rem;
            background:rgba(15,23,42,.46);
            z-index:12000;
        }

        .upgrade-required-modal.visible {
            display:flex;
        }

        .upgrade-required-dialog {
            width:min(100%,460px);
            padding:1.4rem;
            border-radius:22px;
            background:#fff;
            box-shadow:0 30px 60px rgba(15,23,42,.22);
        }

        .upgrade-required-dialog h3 {
            margin:0 0 .65rem;
            color:#0f172a;
            font-size:1.15rem;
        }

        .upgrade-required-dialog p {
            margin:0;
            color:#475569;
            line-height:1.6;
        }

        .upgrade-required-actions {
            display:flex;
            gap:.8rem;
            margin-top:1.2rem;
        }

        .upgrade-required-primary,
        .upgrade-required-secondary {
            display:inline-flex;
            align-items:center;
            justify-content:center;
            min-height:46px;
            padding:.75rem 1rem;
            border-radius:14px;
            font-weight:700;
            text-decoration:none;
            border:none;
            cursor:pointer;
        }

        .upgrade-required-primary {
            flex:1;
            background:linear-gradient(135deg,#0f172a,#1d4ed8);
            color:#fff;
        }

        .upgrade-required-secondary {
            background:#f8fafc;
            color:#334155;
        }

        .app-icon {
            width:74px;
            height:74px;
            border-radius:24px;
            font-size:32px;
            box-shadow:0 18px 28px rgba(15,36,64,.18);
        }

        .app-name {
            font-size:15px;
            font-weight:800;
            text-align:left;
            margin-top:2px;
            max-width:16ch;
        }

        .auth-overlay {
            background:
                radial-gradient(circle at top left, rgba(40, 93, 150, 0.28), transparent 28%),
                radial-gradient(circle at top right, rgba(243, 156, 18, 0.24), transparent 24%),
                linear-gradient(135deg,#0f2440 0%,#17385f 45%,#244b79 100%);
        }

        .auth-card {
            width:min(560px, 96vw);
            padding:36px 38px 32px;
            border:1px solid rgba(15,36,64,.08);
            border-radius:30px;
            background:rgba(255,255,255,.94);
            backdrop-filter:blur(16px);
            box-shadow:0 30px 70px rgba(15,36,64,.24);
        }

        .auth-logo-row {
            margin-bottom:24px;
        }

        .auth-logo-row .logo-img {
            width:124px;
            margin-bottom:8px;
        }

        .auth-logo-row h2 {
            font-size:16px;
            letter-spacing:.04em;
            color:#11233b;
        }

        .auth-tabs {
            padding:6px;
            background:#eff4fb;
            border:1px solid rgba(15,36,64,.08);
            border-radius:18px;
            gap:6px;
            border-bottom:none;
        }

        .auth-tab {
            border-radius:14px;
            margin-bottom:0;
            font-size:12px;
            padding:11px 8px 12px;
        }

        .auth-tab.active {
            background:#fff;
            color:#17385f;
            border-bottom-color:transparent;
            box-shadow:0 10px 22px rgba(15,36,64,.08);
        }

        .auth-field input,
        .auth-field select {
            min-height:48px;
            border-radius:14px;
            border:1px solid rgba(15,36,64,.12);
            background:#f9fbfe;
            box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
        }

        .auth-field input:focus,
        .auth-field select:focus {
            border-color:#285d96;
            box-shadow:0 0 0 4px rgba(40,93,150,.12);
        }

        .auth-btn,
        .auth-btn-secondary,
        .comp-logo-btn,
        .legal-accept-btn,
        .legal-close-btn,
        .btn-logout {
            min-height:46px;
            border-radius:14px;
            font-weight:700;
        }

        .auth-btn,
        .legal-accept-btn {
            background:linear-gradient(135deg,#17385f,#285d96);
            box-shadow:0 16px 28px rgba(23,56,95,.2);
        }

        .auth-btn-secondary,
        .legal-close-btn,
        .comp-logo-btn {
            background:#fff;
            border:1px solid rgba(15,36,64,.12);
            color:#17385f;
        }

        .legal-check-row {
            border-radius:16px;
            background:#f7f9fc;
            border:1px solid rgba(15,36,64,.08);
        }

        .header-user-pill {
            border:1px solid rgba(255,255,255,.12);
            border-radius:18px;
            background:rgba(255,255,255,.10);
            padding:8px 10px 8px 8px;
        }

        .btn-logout {
            padding:0 14px;
            background:rgba(255,255,255,.12);
            border:1px solid rgba(255,255,255,.2);
        }

        @media (max-width: 1023px) {
            .header {
                margin:14px 14px 0;
                padding:0 18px;
            }

            .main {
                min-height:calc(100vh - 108px);
                padding-left:18px;
                padding-right:18px;
            }

            .dashboard-monetization-banner {
                flex-direction:column;
                align-items:flex-start;
            }

            .dashboard-monetization-cta {
                width:100%;
                min-width:0;
            }

            .package-section-head {
                flex-direction:column;
            }

            .package-upgrade-btn {
                width:100%;
            }

            .apps-grid {
                gap:16px;
            }

            .dashboard-scroll-down {
                right:18px;
                bottom:18px;
            }
        }

        @media (max-width: 600px) {
            .header {
                height:auto;
                padding:18px;
                flex-wrap:wrap;
            }

            .header-right {
                width:100%;
                justify-content:space-between;
                flex-wrap:wrap;
            }

            .main {
                min-height:calc(100vh - 124px);
                padding:16px 14px 88px;
            }

            .apps-grid {
                gap:14px;
            }

            .package-section-grid,
            .gold-dashboard-group-grid {
                grid-template-columns:repeat(4, minmax(0, 1fr));
                gap:12px;
            }

            .gold-dashboard-group {
                padding:16px;
            }

            .app-tile {
                min-height:132px;
                padding:12px 10px;
                border-radius:18px;
                gap:8px;
            }

            .app-icon {
                width:58px;
                height:58px;
                border-radius:16px;
                font-size:26px;
            }

            .app-name {
                font-size:12px;
                line-height:1.2;
            }

            .dashboard-scroll-down {
                right:14px;
                bottom:14px;
                width:48px;
                height:48px;
            }

            .auth-card {
                padding:28px 22px 24px;
                border-radius:24px;
            }

            .auth-row {
                flex-direction:column;
                gap:0;
            }
        }

        /* Inactivity warning toast */
        .inactivity-toast {
            position:fixed; bottom:28px; right:28px; z-index:8888;
            background:#e53935; color:#fff; padding:14px 20px; border-radius:10px;
            font-size:14px; box-shadow:0 4px 18px rgba(0,0,0,.3);
            display:none; max-width:320px;
        }
        .inactivity-toast.visible { display:block; }

        /* ── Formulaire création entreprise complet ──────────────── */
        .comp-logo-zone {
            display:flex; align-items:center; gap:14px;
            background:#f8f9ff; border:2px dashed #667eea;
            border-radius:10px; padding:12px 14px; margin-bottom:14px;
        }
        .comp-logo-preview {
            flex-shrink:0; width:68px; height:68px; border-radius:10px;
            border:2px solid #e1e5e9; background:#fff;
            display:flex; align-items:center; justify-content:center;
            overflow:hidden; font-size:28px;
        }
        .comp-logo-preview img { max-width:100%; max-height:100%; object-fit:contain; display:none; }
        .comp-logo-info { flex:1; min-width:0; }
        .comp-logo-info h5 { font-size:11px; font-weight:700; color:#455a64; margin:0 0 2px; text-transform:uppercase; letter-spacing:.4px; }
        .comp-logo-info p  { font-size:10px; color:#90a4ae; margin:0 0 7px; }
        .comp-logo-actions { display:flex; gap:7px; flex-wrap:wrap; }
        .comp-logo-btn { padding:5px 10px; border:1px solid #667eea; border-radius:6px; background:#fff; color:#667eea; font-size:11px; font-weight:600; cursor:pointer; transition:all .2s; }
        .comp-logo-btn:hover { background:#667eea; color:#fff; }
        .comp-logo-btn-del { border-color:#ef5350; color:#ef5350; display:none; }
        .comp-logo-btn-del:hover { background:#ef5350; color:#fff; }
        .comp-section-title {
            font-size:10px; font-weight:700; color:#667eea;
            text-transform:uppercase; letter-spacing:.6px;
            margin:16px 0 8px; padding-bottom:5px;
            border-bottom:2px solid #e8eef7;
        }