/* ── VARIABLES ───────────────────────────────────────── */
    :root {
      --bg:            #faf7f4;
      --bg-soft:       #f5ede6;
      --surface:       #ffffff;
      --surface-2:     #fffaf7;
      --text:          #3d3040;
      --text-soft:     #7a6b7c;
      --text-xsoft:    #b0a0b2;
      --lavender:      #d9cceb;
      --lavender-mid:  #c4aee0;
      --lavender-deep: #9b7ec8;
      --gold:          #c9a86c;
      --gold-soft:     #edd9b0;
      --gold-pale:     #f7f0e4;
      --blush:         #f0e0d6;
      --line:          rgba(120, 95, 133, 0.10);
      --shadow-sm:     0 4px 16px rgba(100, 80, 120, 0.07);
      --shadow-md:     0 12px 36px rgba(100, 80, 120, 0.11);
      --shadow-lg:     0 24px 64px rgba(100, 80, 120, 0.13);
      --radius-xl:     32px;
      --radius-lg:     22px;
      --radius-md:     14px;
      --radius-sm:     8px;
      --container:     1160px;
      --font-display:  'Cormorant Garamond', Georgia, serif;
      --font-body:     'DM Sans', system-ui, sans-serif;
    }

    /* ── RESET ───────────────────────────────────────────── */
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { scroll-behavior: smooth; }

    body {
      font-family: var(--font-body);
      background: var(--bg);
      color: var(--text);
      line-height: 1.65;
      overflow-x: hidden;
    }

    h1, h2, h3, h4 {
      font-family: var(--font-display);
      line-height: 1.1;
      color: #3a2d44;
      font-weight: 500;
    }

    p { line-height: 1.7; }
    a { color: inherit; text-decoration: none; }
    img { max-width: 100%; display: block; }

    /* ── LAYOUT ──────────────────────────────────────────── */
    .container {
      width: min(var(--container), calc(100% - 40px));
      margin: 0 auto;
    }

    /* ── ANIMATIONS ──────────────────────────────────────── */
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(22px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    @keyframes floatOrb {
      0%, 100% { transform: translateY(0) scale(1); }
      50%       { transform: translateY(-18px) scale(1.04); }
    }
    @keyframes shimmer {
      0%   { background-position: -200% center; }
      100% { background-position: 200% center; }
    }
    @keyframes cardFlip {
      0%   { transform: rotateY(0deg); }
      50%  { transform: rotateY(90deg); }
      100% { transform: rotateY(0deg); }
    }
    @keyframes starPulse {
      0%, 100% { opacity: 0.4; transform: scale(1); }
      50%       { opacity: 1;   transform: scale(1.3); }
    }
    @keyframes revealCard {
      from { opacity: 0; transform: translateY(30px) rotateX(8deg); }
      to   { opacity: 1; transform: translateY(0) rotateX(0deg); }
    }

    .fade-up {
      opacity: 0;
      animation: fadeUp 0.7s ease forwards;
    }
    .fade-up-1 { animation-delay: 0.05s; }
    .fade-up-2 { animation-delay: 0.15s; }
    .fade-up-3 { animation-delay: 0.25s; }
    .fade-up-4 { animation-delay: 0.38s; }

    /* ── TOPBAR ──────────────────────────────────────────── */
    .topbar {
      position: sticky;
      top: 0;
      z-index: 100;
      backdrop-filter: blur(18px) saturate(1.3);
      -webkit-backdrop-filter: blur(18px) saturate(1.3);
      background: rgba(250, 247, 244, 0.86);
      border-bottom: 1px solid var(--line);
      transition: box-shadow 0.3s ease;
    }
    .topbar.scrolled {
      box-shadow: 0 2px 24px rgba(100, 80, 120, 0.08);
    }

    .topbar-inner {
      height: 76px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }

    /* ── BRAND ───────────────────────────────────────────── */
    .brand {
      display: flex;
      align-items: center;
      gap: 14px;
      flex-shrink: 0;
    }

    /* 
      LOGO PLACEHOLDER
      → Remplace le <div class="brand-logo"> par <img src="ton-logo.png" ...>
         quand tu auras ton fichier logo.
    */
    .brand-logo {
      width: 46px;
      height: 46px;
      border-radius: 50%;
      background: radial-gradient(circle at 30% 30%, #fff 0%, #ede0fc 40%, #c8b0e8 100%);
      border: 1px solid rgba(160, 130, 190, 0.2);
      box-shadow: 0 6px 20px rgba(160, 130, 190, 0.25);
      display: grid;
      place-items: center;
      font-size: 20px;
      flex-shrink: 0;
      transition: transform 0.3s ease;
    }
    .brand:hover .brand-logo { transform: rotate(15deg) scale(1.05); }

    .brand-text strong {
      display: block;
      font-family: var(--font-display);
      font-size: 1rem;
      font-weight: 600;
      letter-spacing: 0.01em;
      color: #3d2e4a;
    }
    .brand-text span {
      display: block;
      font-size: 0.72rem;
      color: var(--text-xsoft);
      letter-spacing: 0.02em;
    }

    /* ── NAV ─────────────────────────────────────────────── */
    .nav {
      display: flex;
      align-items: center;
      gap: 28px;
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 22px;
      font-size: 0.83rem;
      color: var(--text-soft);
    }
    .nav-links a {
      position: relative;
      transition: color 0.2s;
    }
    .nav-links a::after {
      content: '';
      position: absolute;
      bottom: -3px;
      left: 0;
      width: 0;
      height: 1px;
      background: var(--gold);
      transition: width 0.3s ease;
    }
    .nav-links a:hover { color: var(--text); }
    .nav-links a:hover::after { width: 100%; }

    /* ── BUTTONS ─────────────────────────────────────────── */
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 11px 22px;
      border-radius: 999px;
      border: none;
      cursor: pointer;
      font-family: var(--font-body);
      font-size: 0.83rem;
      font-weight: 500;
      letter-spacing: 0.01em;
      transition: transform 0.22s ease, box-shadow 0.22s ease, background 0.22s ease, opacity 0.22s ease;
      white-space: nowrap;
    }
    .btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 10px 28px rgba(140, 110, 170, 0.2);
    }
    .btn:active { transform: translateY(0); }

    .btn-primary {
      background: linear-gradient(135deg, #c4aee0 0%, #e8d0a8 100%);
      color: #3d2a4e;
    }

    .btn-secondary {
      background: var(--surface);
      color: var(--text);
      border: 1px solid var(--line);
      box-shadow: var(--shadow-sm);
    }

    .btn-ghost {
      background: transparent;
      color: var(--text-soft);
      border: 1px solid var(--line);
    }

    /* ── EYEBROW ─────────────────────────────────────────── */
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 5px 13px;
      border-radius: 999px;
      background: rgba(210, 192, 238, 0.3);
      color: #7a5c8a;
      font-size: 0.7rem;
      font-weight: 500;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      margin-bottom: 22px;
    }

    /* ── HERO ────────────────────────────────────────────── */
    .hero {
      padding: 80px 0 60px;
      position: relative;
      overflow: hidden;
    }

    /* Arrière-plan décoratif */
    .hero::before {
      content: '';
      position: absolute;
      top: -120px;
      right: -180px;
      width: 600px;
      height: 600px;
      background: radial-gradient(circle, rgba(210, 188, 240, 0.28) 0%, transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
    .hero::after {
      content: '';
      position: absolute;
      bottom: -80px;
      left: -100px;
      width: 400px;
      height: 400px;
      background: radial-gradient(circle, rgba(237, 215, 176, 0.22) 0%, transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }

    .hero-grid {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 56px;
      align-items: center;
      position: relative;
      z-index: 1;
    }

    .hero h1 {
      font-size: clamp(2.4rem, 6vw, 3.4rem);
      font-weight: 500;
      max-width: none;
      margin-bottom: 20px;
      line-height: 1.1;
    }

    .hero h1 em {
      font-style: italic;
      color: var(--lavender-deep);
    }

    .hero p.lead {
      max-width: 54ch;
      color: var(--text-soft);
      font-size: 0.95rem;
      margin-bottom: 32px;
      line-height: 1.75;
    }

    .hero-actions {
      display: flex;
      gap: 14px;
      flex-wrap: wrap;
      margin-bottom: 28px;
    }

    .hero-trust {
      display: flex;
      gap: 20px;
      flex-wrap: wrap;
      color: var(--text-soft);
      font-size: 0.79rem;
    }
    .hero-trust span {
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .hero-trust span::before {
      content: '✓';
      color: var(--gold);
      font-weight: 600;
    }

    /* ── HERO CARD (droite) ──────────────────────────────── */
    .hero-card {
      position: relative;
      border-radius: var(--radius-xl);
      overflow: hidden;
      min-height: 460px;
      background: linear-gradient(160deg, rgba(255,255,255,0.85), rgba(250,244,255,0.92));
      border: 1px solid rgba(190, 170, 220, 0.15);
      box-shadow: var(--shadow-lg);
      padding: 32px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .orb {
      position: absolute;
      border-radius: 50%;
      filter: blur(50px);
      pointer-events: none;
    }
    .orb-1 {
      width: 260px; height: 260px;
      background: rgba(195, 165, 228, 0.45);
      top: -60px; right: -60px;
      animation: floatOrb 7s ease-in-out infinite;
    }
    .orb-2 {
      width: 200px; height: 200px;
      background: rgba(237, 215, 176, 0.4);
      bottom: -40px; left: -40px;
      animation: floatOrb 9s ease-in-out infinite reverse;
    }
    .orb-3 {
      width: 120px; height: 120px;
      background: rgba(200, 220, 255, 0.3);
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      animation: floatOrb 6s ease-in-out infinite 2s;
    }

    .hero-card-inner {
      position: relative;
      z-index: 1;
      display: flex;
      flex-direction: column;
      gap: 20px;
    }

    .hero-mini-card {
      background: rgba(255,255,255,0.75);
      backdrop-filter: blur(8px);
      border: 1px solid rgba(190, 170, 220, 0.12);
      border-radius: var(--radius-lg);
      padding: 20px 22px;
      box-shadow: 0 8px 24px rgba(140, 110, 170, 0.1);
    }

    .hero-mini-card h4 {
      font-size: 0.95rem;
      font-family: var(--font-display);
      font-weight: 600;
      margin-bottom: 6px;
    }
    .hero-mini-card p {
      font-size: 0.82rem;
      color: var(--text-soft);
      line-height: 1.6;
    }

    .hero-tarot-row {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
    }

    .hero-tarot-card {
      aspect-ratio: 0.65;
      border-radius: 16px;
      background: linear-gradient(160deg, #f2e9fc 0%, #ede0c5 100%);
      border: 1px solid rgba(170, 140, 200, 0.15);
      display: grid;
      place-items: center;
      font-size: 1.6rem;
      box-shadow: 0 8px 20px rgba(140, 110, 170, 0.1);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
    .hero-tarot-card:hover {
      transform: translateY(-4px) rotate(1deg);
      box-shadow: 0 14px 30px rgba(140, 110, 170, 0.18);
    }

    /* ── STARS DÉCORATIFS ────────────────────────────────── */
    .deco-stars {
      position: absolute;
      pointer-events: none;
      inset: 0;
      overflow: hidden;
    }
    .star {
      position: absolute;
      width: 4px;
      height: 4px;
      background: var(--gold);
      border-radius: 50%;
      animation: starPulse 3s ease-in-out infinite;
    }

    /* ── SECTIONS ────────────────────────────────────────── */
    .section {
      padding: 56px 0;
    }

    .section-heading {
      text-align: center;
      margin-bottom: 40px;
    }
    .section-heading h2 {
      font-size: clamp(1.5rem, 2.8vw, 2.1rem);
      margin-bottom: 14px;
    }
    .section-heading p {
      max-width: 580px;
      margin: 0 auto;
      color: var(--text-soft);
      font-size: 0.92rem;
    }

    /* ── CARDS ───────────────────────────────────────────── */
    .card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 26px;
      box-shadow: var(--shadow-sm);
      transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    }
    .card:hover {
      transform: translateY(-4px);
      box-shadow: var(--shadow-md);
      border-color: rgba(180, 155, 210, 0.2);
    }

    .card-icon {
      width: 48px; height: 48px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      margin-bottom: 16px;
      background: linear-gradient(135deg, rgba(210, 190, 238, 0.5), rgba(237, 215, 176, 0.5));
      color: #6a4d7a;
      font-size: 1.1rem;
    }

    .card h3 {
      font-size: 1.05rem;
      margin-bottom: 10px;
    }
    .card p {
      color: var(--text-soft);
      font-size: 0.87rem;
    }

    /* ── GRILLES ─────────────────────────────────────────── */
    .trust-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }

    .steps-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
      position: relative;
    }
    .steps-grid::before {
      content: '';
      position: absolute;
      top: 32px;
      left: calc(16.66% + 24px);
      right: calc(16.66% + 24px);
      height: 1px;
      background: linear-gradient(90deg, transparent, var(--lavender-mid), transparent);
      pointer-events: none;
    }

    .step-number {
      width: 48px; height: 48px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      margin-bottom: 16px;
      background: linear-gradient(135deg, rgba(210, 190, 238, 0.5), rgba(237, 215, 176, 0.5));
      font-family: var(--font-display);
      font-size: 1.3rem;
      font-weight: 600;
      color: #6a4d7a;
      position: relative;
      z-index: 1;
    }

    /* ── VOYANTS ─────────────────────────────────────────── */
    .voyants-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
    }

    .voyant-card {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .voyant-top {
      display: flex;
      gap: 16px;
      align-items: flex-start;
    }

    /*
      PHOTO VOYANT
      → Remplace le contenu de .voyant-photo par <img src="..." ...>
         quand tu uploaderas les vraies photos.
    */
    .voyant-photo {
      width: 68px;
      height: 68px;
      border-radius: 50%;
      overflow: hidden;
      flex-shrink: 0;
      background: linear-gradient(135deg, #e8d8f5, #f5e5cc);
      display: grid;
      place-items: center;
      font-family: var(--font-display);
      font-size: 1.5rem;
      color: #7a5c8a;
      border: 2px solid rgba(200, 175, 230, 0.2);
    }
    .voyant-photo img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center top;
    }

    .voyant-meta h3 {
      font-size: 1.05rem;
      margin-bottom: 4px;
    }
    .voyant-meta span {
      font-size: 0.78rem;
      color: var(--text-soft);
    }

    .voyant-bio {
      color: var(--text-soft);
      font-size: 0.86rem;
      line-height: 1.65;
      flex: 1;
    }

    .status-badge {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 5px 12px;
      border-radius: 999px;
      font-size: 0.76rem;
      font-weight: 500;
    }
    .status-badge.dispo {
      background: rgba(210, 238, 210, 0.7);
      color: #4a7050;
    }
    .status-badge.indispo {
      background: rgba(238, 215, 215, 0.7);
      color: #7a5050;
    }
    .status-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
      flex-shrink: 0;
    }
    .status-badge.dispo .status-dot   { background: #5a9060; }
    .status-badge.indispo .status-dot { background: #9a5050; }

    /* ── SECTION TAROT ───────────────────────────────────── */
    .tarot-section {
      padding: 70px 0;
    }

    .tarot-banner {
      background: linear-gradient(135deg, #f8f3ff 0%, #fffbf4 50%, #f8f3ff 100%);
      border: 1px solid rgba(190, 165, 225, 0.15);
      border-radius: var(--radius-xl);
      padding: 48px 44px;
      box-shadow: var(--shadow-md);
      overflow: hidden;
      position: relative;
    }

    .tarot-banner::before {
      content: '';
      position: absolute;
      top: -80px; right: -80px;
      width: 300px; height: 300px;
      background: radial-gradient(circle, rgba(210, 188, 240, 0.3), transparent 70%);
      border-radius: 50%;
    }

    .tarot-layout {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 40px;
      align-items: center;
      position: relative;
      z-index: 1;
    }

    .tarot-intro h2 {
      font-size: clamp(1.5rem, 2.5vw, 2rem);
      margin-bottom: 16px;
    }
    .tarot-intro p {
      color: var(--text-soft);
      font-size: 0.92rem;
      max-width: 44ch;
      margin-bottom: 28px;
      line-height: 1.75;
    }

    /* ── TIRAGE INTERACTIF ───────────────────────────────── */
    .tarot-interactive {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 24px;
    }

    .tarot-deck-area {
      position: relative;
      width: 280px;
      height: 200px;
    }

    /* Cartes empilées (deck) */
    .deck-card {
      position: absolute;
      width: 90px;
      height: 140px;
      border-radius: 14px;
      background: linear-gradient(160deg, #e8d8f8 0%, #d8c4f0 100%);
      border: 1px solid rgba(170, 140, 210, 0.25);
      box-shadow: 0 8px 24px rgba(140, 110, 170, 0.15);
      cursor: pointer;
      transition: transform 0.35s cubic-bezier(.34,1.56,.64,1), box-shadow 0.3s ease;
      display: grid;
      place-items: center;
      overflow: hidden;
      perspective: 600px;
    }

    .deck-card::before {
      content: '✦';
      font-size: 1.4rem;
      color: rgba(160, 130, 200, 0.4);
    }

    /* ornement arrière */
    .deck-card::after {
      content: '';
      position: absolute;
      inset: 6px;
      border: 1px solid rgba(200, 170, 240, 0.3);
      border-radius: 10px;
    }

    .deck-card:nth-child(1) { left: 10px;  top: 10px;  transform: rotate(-8deg); }
    .deck-card:nth-child(2) { left: 50px;  top: 5px;   transform: rotate(-2deg); }
    .deck-card:nth-child(3) { left: 88px;  top: 8px;   transform: rotate(4deg); z-index: 3; }

    .deck-card:hover { transform: rotate(0deg) translateY(-8px) !important; box-shadow: 0 18px 40px rgba(140, 110, 170, 0.22); }

    /* Zone résultat du tirage */
    .tarot-result {
      display: none;
      flex-direction: column;
      align-items: center;
      gap: 16px;
      text-align: center;
    }
    .tarot-result.visible { display: flex; }

    .tarot-drawn-cards {
      display: flex;
      gap: 16px;
      justify-content: center;
    }

    .drawn-card {
      width: 90px;
      height: 140px;
      border-radius: 14px;
      border: 1px solid rgba(170, 140, 210, 0.2);
      box-shadow: 0 10px 28px rgba(140, 110, 170, 0.15);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 10px 6px;
      cursor: default;
      animation: revealCard 0.5s cubic-bezier(.34,1.36,.64,1) forwards;
      opacity: 0;
    }
    .drawn-card:nth-child(2) { animation-delay: 0.15s; }
    .drawn-card:nth-child(3) { animation-delay: 0.30s; }

    .drawn-card .card-sym {
      font-size: 1.6rem;
      line-height: 1;
    }
    .drawn-card .card-name {
      font-family: var(--font-display);
      font-size: 0.72rem;
      color: var(--text-soft);
      text-align: center;
      line-height: 1.3;
    }

    .tarot-message {
      font-family: var(--font-display);
      font-size: 1.05rem;
      font-style: italic;
      color: #5a4068;
      max-width: 36ch;
      line-height: 1.5;
    }

    .tarot-btn-retry {
      font-size: 0.78rem;
      color: var(--text-xsoft);
      background: none;
      border: none;
      cursor: pointer;
      font-family: var(--font-body);
      text-decoration: underline;
      text-underline-offset: 3px;
    }

    /* ── CABINETS ────────────────────────────────────────── */
    .cabinet-banner {
      background: linear-gradient(135deg, #f5f0ea 0%, #faf8f5 100%);
      border: 1px solid rgba(190, 170, 150, 0.15);
      border-radius: var(--radius-xl);
      padding: 36px 40px;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 32px;
      align-items: center;
    }

    .cabinet-banner h2 { font-size: 1.5rem; margin-bottom: 10px; }
    .cabinet-banner p  { color: var(--text-soft); font-size: 0.9rem; max-width: 52ch; }

    /* ── AVIS ────────────────────────────────────────────── */
    .reviews-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
    }

    .review-avatar {
      width: 46px; height: 46px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      margin-bottom: 14px;
      background: linear-gradient(135deg, rgba(210, 190, 238, 0.6), rgba(237, 215, 176, 0.6));
      font-family: var(--font-display);
      font-size: 1.2rem;
      font-weight: 600;
      color: #6a4d7a;
    }

    .review-card h3 { font-size: 0.95rem; margin-bottom: 4px; }
    .review-card .stars {
      color: var(--gold);
      font-size: 0.8rem;
      margin-bottom: 12px;
      letter-spacing: 2px;
    }
    .review-card blockquote {
      font-size: 0.87rem;
      color: var(--text-soft);
      line-height: 1.7;
      border-left: 2px solid rgba(200, 175, 230, 0.4);
      padding-left: 14px;
    }

    /* ── FAQ ─────────────────────────────────────────────── */
    .faq-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 16px;
      max-width: 900px;
      margin: 0 auto;
    }

    .faq-item {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      padding: 22px 24px;
      cursor: pointer;
      transition: border-color 0.2s, box-shadow 0.2s;
    }
    .faq-item:hover { border-color: rgba(180, 155, 210, 0.25); box-shadow: var(--shadow-sm); }
    .faq-item.open  { border-color: rgba(180, 155, 210, 0.3); }

    .faq-q {
      font-family: var(--font-display);
      font-size: 0.97rem;
      font-weight: 600;
      color: #3d2e4a;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 12px;
    }
    .faq-q::after {
      content: '+';
      font-family: var(--font-body);
      font-size: 1.1rem;
      color: var(--text-xsoft);
      flex-shrink: 0;
      transition: transform 0.25s ease;
    }
    .faq-item.open .faq-q::after { transform: rotate(45deg); }

    .faq-a {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.35s ease, padding-top 0.35s ease;
    }
    .faq-item.open .faq-a {
      max-height: 200px;
      padding-top: 12px;
    }
    .faq-a p {
      font-size: 0.87rem;
      color: var(--text-soft);
      line-height: 1.7;
    }

    /* ── FOOTER ──────────────────────────────────────────── */
    .footer {
      margin-top: 0;
      padding: 54px 0 28px;
      border-top: 0;
      background: linear-gradient(160deg, #fdf8f5 0%, #f5eef8 50%, #ede4f5 100%);
      color: #3d3040;
    }

    .footer .container,
    .footer-inner {
      max-width: 1320px;
    }

    .footer-grid,
    .footer-grid-large {
      display: grid;
      grid-template-columns: 1.05fr 1.05fr 1.05fr 1fr;
      gap: clamp(32px, 5vw, 82px);
      align-items: start;
    }

    .footer-stack {
      display: flex;
      flex-direction: column;
      gap: 38px;
    }

    .footer-brand { display: none; }

    .footer-brand p {
      margin-top: 12px;
      font-size: 0.82rem;
      color: var(--text-soft);
      max-width: 34ch;
      line-height: 1.6;
    }

    .footer-col h4 {
      font-family: var(--font-body);
      font-size: 1.02rem;
      font-weight: 800;
      margin-bottom: 16px;
      color: #3a2d44;
      letter-spacing: -0.01em;
    }
    .footer-col a {
      display: block;
      width: fit-content;
      font-size: 0.92rem;
      line-height: 1.45;
      color: var(--text-soft);
      margin-bottom: 11px;
      transition: color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
    }
    .footer-col a:hover {
      color: var(--lavender-deep);
      transform: translateX(3px);
    }
    .footer-world a {
      display: flex;
      align-items: center;
      gap: 7px;
    }
    .footer-world span {
      font-size: 1.06rem;
      line-height: 1;
    }

    .footer-bottom {
      margin-top: 42px;
      padding-top: 18px;
      border-top: 1px solid rgba(120,95,133,.10);
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 18px;
      font-size: 0.76rem;
      color: var(--text-xsoft);
    }

    /* ── RESPONSIVE ──────────────────────────────────────── */
    @media (max-width: 1024px) {
      .hero-grid,
      .tarot-layout,
      .cabinet-banner,
      .footer-grid       { grid-template-columns: 1fr; }
      .trust-grid        { grid-template-columns: repeat(2, 1fr); }
      .steps-grid,
      .voyants-grid,
      .reviews-grid      { grid-template-columns: repeat(2, 1fr); }
      .steps-grid::before { display: none; }
    }

    @media (max-width: 720px) {
      /* Topbar : desktop conservée temporairement, responsive à refaire plus tard */
      .topbar-inner      { height: 64px; }

      .hero              { padding: 40px 0 32px; }
      .hero-grid         { gap: 28px; }
      .hero h1           { font-size: clamp(2rem, 8vw, 2.8rem); }
      .hero p.lead       { font-size: 0.9rem; }
      .hero-card         { min-height: auto; padding: 24px 20px; }
      .hero-tarot-row    { gap: 8px; }

      /* Sections */
      .section           { padding: 36px 0; }
      .tarot-section     { padding: 40px 0; }
      .section-heading h2 { font-size: clamp(1.4rem, 6vw, 1.8rem); }

      /* Grilles → 1 colonne */
      .trust-grid,
      .steps-grid,
      .voyants-grid,
      .reviews-grid,
      .faq-grid          { grid-template-columns: 1fr; }

      /* Tarot */
      .tarot-banner      { padding: 28px 20px; border-radius: var(--radius-lg); }
      .tarot-layout      { gap: 28px; }
      .tarot-deck-area   { width: 100%; max-width: 240px; margin: 0 auto; }

      /* Cabinet */
      .cabinet-banner    { padding: 24px 20px; border-radius: var(--radius-lg); grid-template-columns: 1fr; }

      /* Footer */
      .footer-grid       { grid-template-columns: 1fr; gap: 24px; }
      .footer-bottom     { flex-direction: column; gap: 6px; text-align: center; }

      /* Buttons */
      .hero-actions      { flex-direction: column; }
      .hero-actions .btn { width: 100%; justify-content: center; }

      /* Trust row → colonne */
      .hero-trust        { flex-direction: column; gap: 8px; }

      /* Container padding réduit */
      .container         { width: calc(100% - 28px); }
    }

    @media (max-width: 400px) {
      .hero h1           { font-size: 1.9rem; }
      .drawn-card        { width: 76px; height: 118px; }
      .tarot-drawn-cards { gap: 10px; }
    }

/* ── DROPDOWN NAV ────────────────────────────────────── */
.nav-dropdown {
  position: static; /* pas de position relative pour éviter le stacking context du topbar */
  display: inline-flex;
  align-items: center;
}

.nav-dropdown-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: none;
  border: none;
  font-family: var(--font-body);
  font-size: 0.83rem;
  color: var(--text-soft);
  cursor: pointer;
  padding: 0;
  position: relative;
  transition: color 0.2s;
}
.nav-dropdown-toggle:hover { color: var(--text); }
/* Soulignement doré */
.nav-dropdown-toggle::before {
  content: '';
  position: absolute;
  bottom: -3px;
  left: 0;
  width: 0;
  height: 1px;
  background: var(--gold);
  transition: width 0.3s ease;
}
.nav-dropdown-toggle:hover::before,
.nav-dropdown.open .nav-dropdown-toggle::before { width: calc(100% - 14px); }
/* Annuler l'after hérité */
.nav-dropdown-toggle::after { display: none !important; }

.nav-dropdown-arrow {
  font-size: 0.58rem;
  color: var(--text-xsoft);
  transition: transform 0.25s;
  margin-left: 1px;
}
.nav-dropdown.open .nav-dropdown-arrow { transform: rotate(180deg); }

/* Menu — attaché au body via JS, position fixed */
.nav-dropdown-menu {
  position: fixed;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  box-shadow: 0 16px 48px rgba(80,60,110,.14);
  padding: 6px;
  min-width: 210px;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-6px);
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 9999;
}
.nav-dropdown-menu.open {
  opacity: 1;
  pointer-events: all;
  transform: translateY(0);
}
/* Petite flèche */
.nav-dropdown-menu::before {
  content: '';
  position: absolute;
  top: -5px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 9px; height: 9px;
  background: var(--surface);
  border-left: 1px solid var(--line);
  border-top: 1px solid var(--line);
}

.dropdown-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: var(--radius-sm);
  font-size: 0.82rem;
  color: var(--text-soft);
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
  white-space: nowrap;
}
.dropdown-item::after { display: none !important; }
.dropdown-item:hover { background: var(--bg-soft); color: var(--text); }
.dropdown-item .item-icon { font-size: 1rem; width: 20px; text-align: center; flex-shrink: 0; }
.dropdown-item .item-info strong { display: block; font-weight: 500; color: var(--text); font-size: 0.82rem; }
.dropdown-item .item-info span { font-size: 0.73rem; color: var(--text-xsoft); }

.dropdown-sep { height: 1px; background: var(--line); margin: 5px 6px; }

.dropdown-soon {
  font-size: 0.65rem;
  background: rgba(210,190,238,.3);
  color: #7a5c8a;
  padding: 2px 7px;
  border-radius: 999px;
  margin-left: auto;
  flex-shrink: 0;
}
/* ══ DASHBOARD MEMBRE ══════════════════════════ */
.dash-topbar{position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.dash-topbar h1{font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body);margin:0;}
.dash-topbar-right{display:flex;align-items:center;gap:12px;}
.credits-pill{display:inline-flex;align-items:center;gap:7px;padding:6px 14px;background:linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2));border:1px solid rgba(180,155,210,.2);border-radius:999px;font-size:.82rem;color:#5a3d70;font-weight:500;}
.credits-pill .credit-dot{width:7px;height:7px;background:var(--gold);border-radius:50%;}

/* ══ RESPONSIVE ════════════════════════════════ */
@media(max-width:768px){
  .dashboard-layout{grid-template-columns:1fr!important;}
  .dash-content{padding:20px 16px!important;}
  .dash-topbar{padding:0 16px;}
}
@media(max-width:720px){
  .btn{min-height:46px;}
  input[type=email],input[type=password],input[type=text],input[type=tel],select,textarea{font-size:16px!important;}
}
@media(max-width:860px){
  .hero-v2-inner{grid-template-columns:1fr;gap:24px;}
  .hero-v2-visual{display:none;}
  .hero-v2{padding:48px 0 40px;min-height:auto;}
  .hero-v2-ctas{flex-direction:column;gap:10px;}
  .hero-cta-primary,.hero-cta-secondary{width:100%;justify-content:center;text-align:center;}
  .hero-v2-trust{flex-direction:column;gap:8px;}
}

/* ══ VOYANT CARDS (voyants-loader-fix.js) ═══════ */
#voyantsGrid, .voyants-grid-full {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
@media(max-width:900px){ #voyantsGrid,.voyants-grid-full{grid-template-columns:repeat(2,1fr);} }
@media(max-width:560px){ #voyantsGrid,.voyants-grid-full{grid-template-columns:1fr;} }

a.voyant-card {
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: transform .2s, box-shadow .2s;
  text-decoration: none;
  color: inherit;
}
a.voyant-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-md);
}
.voyant-card-media {
  width: 100%;
  aspect-ratio: 4/3;
  overflow: hidden;
  background: linear-gradient(135deg,#f0e8f8,#fdf5e8);
  flex-shrink: 0;
}
.voyant-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.voyant-card-body {
  padding: 16px 18px 18px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.voyant-card-body h3 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  margin: 0 0 4px;
}
.voyant-card-body p {
  font-size: .82rem;
  color: var(--text-soft);
  margin: 0 0 8px;
}
.status-dot {
  font-size: .75rem;
  font-weight: 500;
}

/* ══ VOYANT CARD BODY DETAILS ════════════════════ */
.vcb-header { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:6px; }
.vcb-name   { font-size:.95rem; font-weight:600; color:var(--text); margin:0; }
.vcb-exp    { font-size:.72rem; color:var(--text-xsoft); margin-top:2px; }
.vcb-status { display:inline-flex; align-items:center; gap:5px; font-size:.72rem; font-weight:500; white-space:nowrap; flex-shrink:0; }
.vcb-status.dispo   { color:#4a7a50; }
.vcb-status.indispo { color:#8a5a5a; }
.vcb-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; }
.vcb-status.dispo   .vcb-dot { background:#56936b; }
.vcb-status.indispo .vcb-dot { background:#c08070; }
.vcb-spec  { font-size:.78rem; color:var(--text-soft); margin-bottom:8px; text-transform:uppercase; letter-spacing:.04em; font-weight:500; }
.vcb-bio   { font-size:.82rem; color:var(--text-soft); line-height:1.55; margin:0 0 10px; flex:1; }
.vcb-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto; padding-top:10px; border-top:1px solid var(--line); }
.vcb-tarif  { font-size:.82rem; color:var(--text-soft); }
.vcb-tarif strong { color:var(--lavender-deep); font-weight:600; }
.vcb-rating { font-size:.78rem; color:var(--text-soft); }


/* ============================================================
   STYLES CONSOLIDÉS DEPUIS LES PAGES (HORS ADMIN)
   ------------------------------------------------------------
   Scoping via :where() pour préserver la spécificité d'origine.
   Cascade et ordre des règles préservés par page.
   @keyframes renommés en cas de conflit (préfixe _<page>__nom).
   ============================================================ */

/* ----- @keyframes (issus des pages) ----- */
@keyframes pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .5; transform: scale(.7); }
  }
@keyframes _auth_forgot_password__spin { to { transform: rotate(360deg); } }
@keyframes _auth_login__spin { to { transform:rotate(360deg); } }
@keyframes _cabinet_profil__spin { to{transform:rotate(360deg)} }
@keyframes _cabinet_reponse_email__spin { to { transform:rotate(360deg); } }
@keyframes _membre_mes_credits__spin { to { transform: rotate(360deg); } }
@keyframes _membre_mon_compte__spin {to{transform:rotate(360deg)}}
@keyframes _voyance_consultation_email__spin { to{transform:rotate(360deg)} }
@keyframes pulseDot { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.7)} }
@keyframes chatSlideIn {
      from { opacity:0; transform: translateY(8px); }
      to   { opacity:1; transform: translateY(0); }
    }
@keyframes toastIn { to { opacity:1; transform:translateY(0); } }
@keyframes _cabinet_emails__shimmer { 0%{{background-position:-200% center}} 100%{{background-position:200% center}} }
@keyframes _cabinet_reponse_email__shimmer { 0%{background-position:-200% center} 100%{background-position:200% center} }
@keyframes tarotAura {
      from { opacity: .55; filter: blur(15px); }
      to   { opacity: 1; filter: blur(28px); }
    }
@keyframes tarotSmokeMove {
      0%   { transform: translateY(80px) scale(.7); opacity: 0; }
      25%  { opacity: .7; }
      100% { transform: translateY(-340px) scale(1.8); opacity: 0; }
    }
@keyframes popIn {
      from { transform: scale(.9) translateY(20px); opacity: 0; }
      to   { transform: scale(1) translateY(0);     opacity: 1; }
    }
@keyframes _contenu_tarot_celibataire__starPulse {
      from { opacity: .25; transform: scale(.75); }
      to { opacity: 1; transform: scale(1.35); }
    }
@keyframes ribbonLine {
      from { opacity: .25; filter: blur(2px); }
      to { opacity: .9; filter: blur(0px); }
    }
@keyframes phonePulse { 0%,100%{transform:scale(1);opacity:1} 50%{transform:scale(1.08);opacity:.4} }
@keyframes _voyance_consultation__pulse-dot { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.7)} }
@keyframes _voyance_voyants__pulse-dot {
      0%, 100% { opacity: 1; transform: scale(1); }
      50% { opacity: 0.5; transform: scale(0.7); }
    }
@keyframes slideMsg {
      from { opacity: 0; transform: translateY(10px); }
      to   { opacity: 1; transform: translateY(0); }
    }
@keyframes typingBounce {
      0%,60%,100% { transform: translateY(0); }
      30% { transform: translateY(-5px); }
    }
@keyframes floatAvatar {
      0% { transform: translateY(-8px); }
      50% { transform: translateY(-12px); }
      100% { transform: translateY(-8px); }
    }

/* === Page : home  (index.html) === */
:where(body[data-page="home"]) .hero-v2 {
    position: relative;
    display: flex;
    align-items: flex-start;
    overflow: hidden;
    background: linear-gradient(160deg, #fdf8f5 0%, #f5eef8 50%, #ede4f5 100%);
    padding: 60px 0 60px;
  }
:where(body[data-page="home"]) .hero-v2::before {
    content: '';
    position: absolute;
    top: -120px; right: -80px;
    width: 600px; height: 600px;
    background: radial-gradient(circle, rgba(196,164,224,.22) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
  }
:where(body[data-page="home"]) .hero-v2::after {
    content: '';
    position: absolute;
    bottom: -80px; left: -60px;
    width: 400px; height: 400px;
    background: radial-gradient(circle, rgba(232,208,168,.2) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
  }
:where(body[data-page="home"]) .hero-v2-inner {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 24px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 60px;
    align-items: center;
    position: relative;
    z-index: 1;
  }
:where(body[data-page="home"]) .hero-v2-left {}
:where(body[data-page="home"]) .hero-v2-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: .76rem;
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #9b7ec8;
    background: rgba(155,126,200,.1);
    border: 1px solid rgba(155,126,200,.2);
    border-radius: 999px;
    padding: 6px 14px;
    margin-bottom: 24px;
  }
:where(body[data-page="home"]) .hero-v2-eyebrow::before { content: '✦'; font-size: .7rem; }
:where(body[data-page="home"]) .hero-v2-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.7rem, 3.2vw, 2.6rem);
    font-weight: 500;
    line-height: 1.1;
    color: #2a1d38;
    margin-bottom: 20px;
  }
:where(body[data-page="home"]) .hero-v2-title em {
    font-style: italic;
    color: #7a52a0;
  }
:where(body[data-page="home"]) .hero-v2-lead {
    font-size: 1rem;
    color: #6a5c75;
    line-height: 1.75;
    max-width: 48ch;
    margin-bottom: 32px;
  }
:where(body[data-page="home"]) .hero-v2-ctas {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 36px;
  }
:where(body[data-page="home"]) .hero-cta-primary {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 26px;
    border-radius: 999px;
    background: linear-gradient(135deg, #9b7ec8, #c4a86e);
    color: #fff;
    font-weight: 600;
    font-size: .9rem;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(155,126,200,.3);
    transition: transform .2s, box-shadow .2s;
  }
:where(body[data-page="home"]) .hero-cta-primary:hover { transform: translateY(-2px); box-shadow: 0 12px 32px rgba(155,126,200,.38); }
:where(body[data-page="home"]) .hero-cta-secondary {
    display: inline-flex;
    align-items: center;
    padding: 14px 26px;
    border-radius: 999px;
    background: rgba(255,255,255,.7);
    border: 1px solid rgba(155,126,200,.25);
    color: #5a3d7a;
    font-weight: 500;
    font-size: .9rem;
    text-decoration: none;
    backdrop-filter: blur(8px);
    transition: background .2s, border-color .2s;
  }
:where(body[data-page="home"]) .hero-cta-secondary:hover { background: rgba(255,255,255,.95); border-color: rgba(155,126,200,.45); }
:where(body[data-page="home"]) .hero-v2-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
  }
:where(body[data-page="home"]) .hero-trust-item {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: .78rem;
    color: #8a7a96;
  }
:where(body[data-page="home"]) .hero-trust-item::before {
    content: '✓';
    width: 18px; height: 18px;
    border-radius: 50%;
    background: rgba(75,194,124,.15);
    color: #3a9a5c;
    display: grid;
    place-items: center;
    font-size: .68rem;
    font-weight: 700;
    flex-shrink: 0;
  }
:where(body[data-page="home"]) .hero-v2-visual {
    position: relative;
  }
:where(body[data-page="home"]) .hero-visual-card {
    background: rgba(255,255,255,.72);
    border: 1px solid rgba(155,126,200,.15);
    border-radius: 28px;
    padding: 28px;
    box-shadow: 0 24px 60px rgba(100,70,140,.12);
    backdrop-filter: blur(16px);
    position: relative;
    overflow: hidden;
  }
:where(body[data-page="home"]) .hero-visual-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 3px;
    background: linear-gradient(90deg, #9b7ec8, #c4a86e, #9b7ec8);
  }
:where(body[data-page="home"]) .hero-vc-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
  }
:where(body[data-page="home"]) .hero-vc-title {
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.1rem;
    font-weight: 600;
    color: #2a1d38;
  }
:where(body[data-page="home"]) .hero-dispo-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: .72rem;
    font-weight: 500;
    color: #2e8b57;
    background: rgba(75,194,124,.1);
    border: 1px solid rgba(75,194,124,.2);
    border-radius: 999px;
    padding: 5px 10px;
  }
:where(body[data-page="home"]) .hero-dispo-dot {
    width: 6px; height: 6px;
    border-radius: 50%;
    background: #4bc27c;
    animation: pulse 2s ease-in-out infinite;
  }
:where(body[data-page="home"]) .hero-voyant-preview {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px;
    background: rgba(155,126,200,.06);
    border-radius: 16px;
    margin-bottom: 12px;
    border: 1px solid rgba(155,126,200,.1);
    text-decoration: none;
    transition: background .2s;
  }
:where(body[data-page="home"]) .hero-voyant-preview:hover { background: rgba(155,126,200,.1); }
:where(body[data-page="home"]) .hvp-avatar {
    width: 46px; height: 46px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(196,174,224,.8), rgba(232,208,168,.6));
    display: grid; place-items: center;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.3rem;
    color: #6a4d7a;
    flex-shrink: 0;
    border: 2px solid rgba(155,126,200,.2);
    object-fit: cover;
  }
:where(body[data-page="home"]) .hvp-info { flex: 1; min-width: 0; }
:where(body[data-page="home"]) .hvp-name { font-weight: 600; font-size: .9rem; color: #2a1d38; }
:where(body[data-page="home"]) .hvp-spec { font-size: .74rem; color: #8a7a96; margin-top: 2px; }
:where(body[data-page="home"]) .hvp-note { font-size: .76rem; color: #c4a86e; font-weight: 500; white-space: nowrap; }
:where(body[data-page="home"]) .hero-tarot-strip {
    display: flex;
    gap: 10px;
    margin-top: 18px;
    justify-content: center;
  }
:where(body[data-page="home"]) .hero-tarot-c {
    flex: 1;
    aspect-ratio: 2/3;
    background: linear-gradient(160deg, rgba(196,164,224,.3), rgba(232,208,168,.2));
    border-radius: 12px;
    border: 1px solid rgba(155,126,200,.18);
    display: grid;
    place-items: center;
    font-size: 1.6rem;
  }
:where(body[data-page="home"]) .hero-floating-badge {
    position: absolute;
    bottom: -16px;
    right: -16px;
    background: linear-gradient(135deg, #9b7ec8, #7a5c8a);
    color: #fff;
    border-radius: 18px;
    padding: 12px 16px;
    box-shadow: 0 12px 30px rgba(122,92,138,.3);
    font-size: .78rem;
    font-weight: 500;
    text-align: center;
  }
:where(body[data-page="home"]) .hero-floating-badge strong { display: block; font-size: 1.2rem; font-family: 'Cormorant Garamond', serif; }
@media (max-width: 860px) {
  :where(body[data-page="home"]) .hero-v2-inner { grid-template-columns: 1fr; gap: 40px; }
  :where(body[data-page="home"]) .hero-v2-visual { display: none; }
  :where(body[data-page="home"]) .hero-v2 { padding: 100px 0 60px; min-height: auto; }
}
:where(body[data-page="home"]) .section-voyants-v2 {
    padding: 80px 0;
    background: #fdf9fc;
  }
:where(body[data-page="home"]) .sv2-container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 24px;
  }
:where(body[data-page="home"]) .sv2-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    margin-bottom: 40px;
    flex-wrap: wrap;
  }
:where(body[data-page="home"]) .sv2-heading { }
:where(body[data-page="home"]) .sv2-heading h2 {
    font-family: 'Cormorant Garamond', serif;
    font-size: clamp(1.8rem, 3.5vw, 2.6rem);
    font-weight: 500;
    color: #2a1d38;
    margin-bottom: 8px;
  }
:where(body[data-page="home"]) .sv2-heading p { font-size: .9rem; color: #8a7a96; max-width: 50ch; }
:where(body[data-page="home"]) .sv2-filters {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-bottom: 32px;
  }
:where(body[data-page="home"]) .sv2-filter-btn {
    padding: 8px 16px;
    border-radius: 999px;
    border: 1px solid rgba(155,126,200,.2);
    background: rgba(255,255,255,.8);
    color: #6a5c75;
    font-size: .8rem;
    font-family: inherit;
    cursor: pointer;
    transition: all .2s;
  }
:where(body[data-page="home"]) .sv2-filter-btn:hover, :where(body[data-page="home"]) .sv2-filter-btn.active {
    background: rgba(155,126,200,.12);
    border-color: rgba(155,126,200,.4);
    color: #5a3d7a;
  }
:where(body[data-page="home"]) .sv2-filter-btn.active { font-weight: 600; }
:where(body[data-page="home"]) .sv2-carousel-wrap {
    position: relative;
  }
:where(body[data-page="home"]) .sv2-carousel-track-outer {
    overflow: hidden;
    border-radius: 0;
  }
:where(body[data-page="home"]) .sv2-grid {
    display: flex;
    gap: 20px;
    transition: transform .4s cubic-bezier(.25,.46,.45,.94);
    will-change: transform;
  }
:where(body[data-page="home"]) .sv2-grid .vcard {
    flex: 0 0 calc((100% - 40px) / 3);
    min-width: 0;
  }
:where(body[data-page="home"]) .sv2-carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px; height: 44px;
    border-radius: 50%;
    border: 1px solid rgba(155,126,200,.25);
    background: rgba(255,255,255,.92);
    color: #7a5c8a;
    cursor: pointer;
    font-size: 1.2rem;
    display: grid;
    place-items: center;
    box-shadow: 0 4px 16px rgba(100,70,140,.1);
    transition: background .2s, box-shadow .2s;
    z-index: 2;
    backdrop-filter: blur(8px);
  }
:where(body[data-page="home"]) .sv2-carousel-btn:hover { background: #fff; box-shadow: 0 6px 24px rgba(100,70,140,.15); }
:where(body[data-page="home"]) .sv2-carousel-btn:disabled { opacity: .35; cursor: not-allowed; }
:where(body[data-page="home"]) .sv2-carousel-btn.prev { left: -22px; }
:where(body[data-page="home"]) .sv2-carousel-btn.next { right: -22px; }
@media (max-width: 860px) {
  :where(body[data-page="home"]) .sv2-grid .vcard { flex: 0 0 calc(100% - 40px); }
  :where(body[data-page="home"]) .sv2-carousel-btn.prev { left: 4px; }
  :where(body[data-page="home"]) .sv2-carousel-btn.next { right: 4px; }
}
@media (min-width: 861px) and (max-width: 1100px) {
  :where(body[data-page="home"]) .sv2-grid .vcard { flex: 0 0 calc((100% - 20px) / 2); }
}
:where(body[data-page="home"]) .vcard {
    background: #fff;
    border: 1px solid rgba(155,126,200,.1);
    border-radius: 22px;
    padding: 22px;
    box-shadow: 0 2px 16px rgba(100,70,140,.05);
    transition: transform .25s, box-shadow .25s, border-color .25s;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 14px;
    text-decoration: none;
    color: inherit;
    position: relative;
    overflow: hidden;
  }
:where(body[data-page="home"]) .vcard::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, #c4aee0, #e8d0a8);
    transform: scaleX(0);
    transition: transform .3s;
  }
:where(body[data-page="home"]) .vcard:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(100,70,140,.12); border-color: rgba(155,126,200,.25); }
:where(body[data-page="home"]) .vcard:hover::before { transform: scaleX(1); }
:where(body[data-page="home"]) .vcard-dispo {
    position: absolute;
    top: 16px; right: 16px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: .68rem;
    font-weight: 600;
    border-radius: 999px;
    padding: 4px 10px;
  }
:where(body[data-page="home"]) .vcard-dispo.online {
    background: rgba(75,194,124,.12);
    color: #2e8b57;
    border: 1px solid rgba(75,194,124,.2);
  }
:where(body[data-page="home"]) .vcard-dispo.offline {
    background: rgba(180,180,180,.1);
    color: #999;
    border: 1px solid rgba(180,180,180,.2);
  }
:where(body[data-page="home"]) .vcard-dispo-dot {
    width: 5px; height: 5px;
    border-radius: 50%;
    flex-shrink: 0;
  }
:where(body[data-page="home"]) .online .vcard-dispo-dot { background: #4bc27c; animation: pulse 2s ease-in-out infinite; }
:where(body[data-page="home"]) .offline .vcard-dispo-dot { background: #bbb; }
:where(body[data-page="home"]) .vcard-top {
    display: flex;
    align-items: center;
    gap: 14px;
    padding-right: 80px;
  }
:where(body[data-page="home"]) .vcard-avatar {
    width: 54px; height: 54px;
    border-radius: 50%;
    border: 2px solid rgba(155,126,200,.2);
    object-fit: cover;
    background: linear-gradient(135deg, rgba(196,174,224,.5), rgba(232,208,168,.3));
    display: grid; place-items: center;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.5rem;
    color: #7a5c8a;
    flex-shrink: 0;
  }
:where(body[data-page="home"]) .vcard-name { font-weight: 600; font-size: 1rem; color: #2a1d38; margin-bottom: 3px; }
:where(body[data-page="home"]) .vcard-spec { font-size: .78rem; color: #9b7ec8; font-weight: 500; }
:where(body[data-page="home"]) .vcard-exp { font-size: .74rem; color: #aaa; margin-top: 2px; }
:where(body[data-page="home"]) .vcard-note {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: .8rem;
  }
:where(body[data-page="home"]) .stars { color: #c4a86e; letter-spacing: 1px; font-size: .72rem; }
:where(body[data-page="home"]) .vcard-note-val { font-weight: 600; color: #4a3d5a; }
:where(body[data-page="home"]) .vcard-note-count { color: #aaa; }
:where(body[data-page="home"]) .vcard-bio {
    font-size: .84rem;
    color: #6a5c75;
    line-height: 1.65;
    flex: 1;
  }
:where(body[data-page="home"]) .vcard-modes {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
  }
:where(body[data-page="home"]) .vcard-mode {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: .72rem;
    border: 1px solid rgba(155,126,200,.2);
    background: rgba(155,126,200,.06);
    color: #7a5c8a;
  }
:where(body[data-page="home"]) .vcard-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding-top: 14px;
    border-top: 1px solid rgba(155,126,200,.08);
  }
:where(body[data-page="home"]) .vcard-tarif { font-size: .8rem; color: #aaa; }
:where(body[data-page="home"]) .vcard-tarif strong { font-size: 1rem; color: #2a1d38; font-weight: 700; }
:where(body[data-page="home"]) .vcard-cta {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 18px;
    border-radius: 999px;
    background: linear-gradient(135deg, #c4aee0, #e8d0a8);
    color: #3d2a4e;
    font-size: .8rem;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: opacity .2s;
  }
:where(body[data-page="home"]) .vcard-cta:hover { opacity: .88; }
:where(body[data-page="home"]) .sv2-loading {
    grid-column: 1/-1;
    text-align: center;
    padding: 48px;
    color: #9b7ec8;
    font-size: .9rem;
  }
:where(body[data-page="home"]) .sv2-empty {
    grid-column: 1/-1;
    text-align: center;
    padding: 48px;
    color: #aaa;
  }
:where(body[data-page="home"]) .sv2-footer {
    text-align: center;
    margin-top: 36px;
  }
:where(body[data-page="home"]) .sv2-voir-tous {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 28px;
    border-radius: 999px;
    border: 1px solid rgba(155,126,200,.3);
    color: #7a5c8a;
    font-size: .88rem;
    font-weight: 500;
    text-decoration: none;
    transition: background .2s, border-color .2s;
  }
:where(body[data-page="home"]) .sv2-voir-tous:hover {
    background: rgba(155,126,200,.08);
    border-color: rgba(155,126,200,.45);
  }
:where(body[data-page="home"]) .fade-up { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }
:where(body[data-page="home"]) .fade-up.visible { opacity: 1; transform: translateY(0); }
:where(body[data-page="home"]) .fade-up-1 { transition-delay: .05s; }
:where(body[data-page="home"]) .fade-up-2 { transition-delay: .15s; }
:where(body[data-page="home"]) .fade-up-3 { transition-delay: .25s; }
:where(body[data-page="home"]) .fade-up-4 { transition-delay: .35s; }

/* === Page : auth-forgot-password  (pages/auth/forgot-password.html) === */
:where(body[data-page="auth-forgot-password"]) .forgot-page {
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
      background: var(--bg);
      padding: 40px 20px;
    }
:where(body[data-page="auth-forgot-password"]) .forgot-bg { position: fixed; inset: 0; pointer-events: none; z-index: 0; }
:where(body[data-page="auth-forgot-password"]) .forgot-bg-orb { position: absolute; border-radius: 50%; filter: blur(70px); }
:where(body[data-page="auth-forgot-password"]) .forgot-bg-orb:nth-child(1) { width: 420px; height: 420px; background: radial-gradient(circle, rgba(195,165,228,.2), transparent 70%); top: -80px; left: -80px; animation: floatOrb 11s ease-in-out infinite; }
:where(body[data-page="auth-forgot-password"]) .forgot-bg-orb:nth-child(2) { width: 340px; height: 340px; background: radial-gradient(circle, rgba(237,215,176,.18), transparent 70%); bottom: -60px; right: -60px; animation: floatOrb 9s ease-in-out infinite reverse; }
:where(body[data-page="auth-forgot-password"]) .forgot-card {
      position: relative;
      z-index: 1;
      width: 100%;
      max-width: 440px;
      background: rgba(255,255,255,.84);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);
      border: 1px solid rgba(190,170,220,.18);
      border-radius: var(--radius-xl);
      box-shadow: 0 32px 80px rgba(100,80,120,.12), 0 2px 0 rgba(255,255,255,.8) inset;
      padding: 48px 44px;
      animation: fadeUp .6s ease forwards;
    }
:where(body[data-page="auth-forgot-password"]) .forgot-header { text-align: center; margin-bottom: 32px; }
:where(body[data-page="auth-forgot-password"]) .forgot-logo {
      width: 64px; height: 64px;
      border-radius: 50%;
      background: radial-gradient(circle at 30% 30%, #fff 0%, #ede0fc 40%, #c8b0e8 100%);
      border: 1px solid rgba(160,130,190,.25);
      box-shadow: 0 10px 30px rgba(160,130,190,.28);
      display: grid; place-items: center;
      font-size: 24px;
      margin: 0 auto 20px;
      transition: transform .4s, box-shadow .4s;
    }
:where(body[data-page="auth-forgot-password"]) .forgot-logo:hover { transform: rotate(15deg) scale(1.06); }
:where(body[data-page="auth-forgot-password"]) .forgot-header h1 { font-size: 1.65rem; margin-bottom: 10px; }
:where(body[data-page="auth-forgot-password"]) .forgot-header p { font-size: .87rem; color: var(--text-soft); line-height: 1.65; max-width: 34ch; margin: 0 auto; }
:where(body[data-page="auth-forgot-password"]) .form-group { margin-bottom: 18px; }
:where(body[data-page="auth-forgot-password"]) label { display: block; font-size: .8rem; font-weight: 500; color: var(--text); margin-bottom: 7px; }
:where(body[data-page="auth-forgot-password"]) .input-wrap { position: relative; }
:where(body[data-page="auth-forgot-password"]) .input-icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-size: .9rem; color: var(--text-xsoft); pointer-events: none; transition: color .2s; }
:where(body[data-page="auth-forgot-password"]) .input-wrap:focus-within .input-icon { color: var(--lavender-deep); }
:where(body[data-page="auth-forgot-password"]) input[type=email] { width: 100%; padding: 13px 14px 13px 40px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); font-family: var(--font-body); font-size: .88rem; color: var(--text); outline: none; transition: border-color .25s, box-shadow .25s; }
:where(body[data-page="auth-forgot-password"]) input:focus { border-color: rgba(180,155,210,.5); box-shadow: 0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="auth-forgot-password"]) .form-alert { padding: 12px 16px; border-radius: var(--radius-md); font-size: .84rem; margin-bottom: 18px; display: none; line-height: 1.55; }
:where(body[data-page="auth-forgot-password"]) .form-alert.error { display: block; background: rgba(238,215,215,.7); color: #7a3535; border: 1px solid rgba(200,150,150,.3); }
:where(body[data-page="auth-forgot-password"]) .form-alert.success { display: block; background: rgba(210,238,210,.7); color: #3a6040; border: 1px solid rgba(150,200,150,.3); }
:where(body[data-page="auth-forgot-password"]) .btn-submit { width: 100%; justify-content: center; padding: 14px 24px; font-size: .9rem; font-weight: 500; position: relative; overflow: hidden; }
:where(body[data-page="auth-forgot-password"]) .btn-submit::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255,255,255,.18), transparent); pointer-events: none; }
:where(body[data-page="auth-forgot-password"]) .btn-submit.loading { pointer-events: none; opacity: .75; }
:where(body[data-page="auth-forgot-password"]) .btn-submit.loading .btn-text { opacity: 0; }
:where(body[data-page="auth-forgot-password"]) .btn-submit .spinner { display: none; position: absolute; width: 18px; height: 18px; border: 2px solid rgba(60,40,80,.2); border-top-color: #3d2a4e; border-radius: 50%; animation: _auth_forgot_password__spin .7s linear infinite; }
:where(body[data-page="auth-forgot-password"]) .btn-submit.loading .spinner { display: block; }
:where(body[data-page="auth-forgot-password"]) .success-state { display: none; text-align: center; }
:where(body[data-page="auth-forgot-password"]) .success-state.visible { display: block; }
:where(body[data-page="auth-forgot-password"]) .success-icon { font-size: 2.8rem; margin-bottom: 18px; display: block; animation: fadeUp .5s ease forwards; }
:where(body[data-page="auth-forgot-password"]) .success-state h2 { font-size: 1.4rem; margin-bottom: 10px; }
:where(body[data-page="auth-forgot-password"]) .success-state p { font-size: .87rem; color: var(--text-soft); line-height: 1.7; margin-bottom: 24px; }
:where(body[data-page="auth-forgot-password"]) .success-email { font-weight: 500; color: var(--lavender-deep); }
:where(body[data-page="auth-forgot-password"]) .form-footer { text-align: center; margin-top: 22px; font-size: .83rem; color: var(--text-soft); }
:where(body[data-page="auth-forgot-password"]) .form-footer a { color: var(--lavender-deep); text-decoration: underline; text-underline-offset: 3px; transition: color .2s; }
:where(body[data-page="auth-forgot-password"]) .form-footer a:hover { color: #7a5fa0; }
:where(body[data-page="auth-forgot-password"]) .back-link { position: fixed; top: 24px; left: 28px; display: inline-flex; align-items: center; gap: 7px; font-size: .81rem; color: var(--text-soft); z-index: 10; background: rgba(255,255,255,.7); backdrop-filter: blur(8px); padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line); box-shadow: var(--shadow-sm); transition: color .2s; }
:where(body[data-page="auth-forgot-password"]) .back-link:hover { color: var(--text); }
:where(body[data-page="auth-forgot-password"]) .back-link::before { content: '←'; }
@media (max-width: 520px) {
  :where(body[data-page="auth-forgot-password"]) .forgot-card { padding: 36px 24px; border-radius: var(--radius-lg); }
  :where(body[data-page="auth-forgot-password"]) .back-link { top: 16px; left: 16px; }
}

/* === Page : auth-login  (pages/auth/login.html) === */
:where(body[data-page="auth-login"]) .login-page { min-height:100vh; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; background:var(--bg); padding:40px 20px; }
:where(body[data-page="auth-login"]) .login-card { position:relative; z-index:1; width:100%; max-width:460px; background:rgba(255,255,255,.82); backdrop-filter:blur(20px); border:1px solid rgba(190,170,220,.18); border-radius:var(--radius-xl); box-shadow:0 32px 80px rgba(100,80,120,.13),0 2px 0 rgba(255,255,255,.8) inset; padding:48px 44px; }
:where(body[data-page="auth-login"]) .login-header { text-align:center; margin-bottom:36px; }
:where(body[data-page="auth-login"]) .login-logo { width:64px; height:64px; border-radius:50%; background:radial-gradient(circle at 30% 30%,#fff 0%,#ede0fc 40%,#c8b0e8 100%); border:1px solid rgba(160,130,190,.25); box-shadow:0 10px 30px rgba(160,130,190,.28); display:grid; place-items:center; font-size:24px; margin:0 auto 20px; }
:where(body[data-page="auth-login"]) .login-header h1 { font-size:1.75rem; margin-bottom:8px; }
:where(body[data-page="auth-login"]) .login-header p { font-size:.87rem; color:var(--text-soft); }
:where(body[data-page="auth-login"]) .login-header p a { color:var(--lavender-deep); text-decoration:underline; text-underline-offset:3px; }
:where(body[data-page="auth-login"]) .form-group { margin-bottom:18px; }
:where(body[data-page="auth-login"]) label { display:block; font-size:.8rem; font-weight:500; color:var(--text); margin-bottom:7px; }
:where(body[data-page="auth-login"]) .input-wrap { position:relative; }
:where(body[data-page="auth-login"]) .input-icon { position:absolute; left:14px; top:50%; transform:translateY(-50%); font-size:.9rem; color:var(--text-xsoft); pointer-events:none; }
:where(body[data-page="auth-login"]) input[type=email], :where(body[data-page="auth-login"]) input[type=password] { width:100%; padding:13px 44px 13px 40px; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--surface); font-family:var(--font-body); font-size:.88rem; color:var(--text); outline:none; transition:border-color .25s,box-shadow .25s,background .25s; }
:where(body[data-page="auth-login"]) input:focus { border-color:rgba(180,155,210,.5); box-shadow:0 0 0 3px rgba(196,174,224,.15); background:#fff; }
:where(body[data-page="auth-login"]) .pw-toggle { position:absolute; right:14px; top:50%; transform:translateY(-50%); background:none; border:none; cursor:pointer; font-size:.85rem; color:var(--text-xsoft); padding:2px; }
:where(body[data-page="auth-login"]) .field-meta { display:flex; justify-content:flex-end; margin-top:6px; }
:where(body[data-page="auth-login"]) .field-meta a { font-size:.78rem; color:var(--text-xsoft); text-decoration:underline; text-underline-offset:3px; }
:where(body[data-page="auth-login"]) .checkbox-group { display:flex; align-items:center; gap:9px; margin:6px 0 22px; }
:where(body[data-page="auth-login"]) .checkbox-group input[type=checkbox] { width:15px; height:15px; flex-shrink:0; accent-color:var(--lavender-deep); cursor:pointer; }
:where(body[data-page="auth-login"]) .checkbox-group label { font-size:.82rem; color:var(--text-soft); margin-bottom:0; cursor:pointer; }
:where(body[data-page="auth-login"]) .form-alert { padding:11px 15px; border-radius:var(--radius-md); font-size:.84rem; margin-bottom:18px; display:none; line-height:1.5; }
:where(body[data-page="auth-login"]) .form-alert.error { display:block; background:rgba(238,215,215,.7); color:#7a3535; border:1px solid rgba(200,150,150,.3); }
:where(body[data-page="auth-login"]) .form-alert.success { display:block; background:rgba(210,238,210,.7); color:#3a6040; border:1px solid rgba(150,200,150,.3); }
:where(body[data-page="auth-login"]) .btn-submit { width:100%; justify-content:center; padding:14px 24px; font-size:.9rem; font-weight:500; position:relative; overflow:hidden; }
:where(body[data-page="auth-login"]) .btn-submit.loading { pointer-events:none; opacity:.75; }
:where(body[data-page="auth-login"]) .btn-submit.loading .btn-text { opacity:0; }
:where(body[data-page="auth-login"]) .btn-submit .spinner { display:none; position:absolute; width:18px; height:18px; border:2px solid rgba(60,40,80,.2); border-top-color:#3d2a4e; border-radius:50%; animation:_auth_login__spin .7s linear infinite; }
:where(body[data-page="auth-login"]) .btn-submit.loading .spinner { display:block; }

/* === Page : auth-register  (pages/auth/register.html) === */
body:where([data-page="auth-register"]) {
      margin: 0;
      font-family: Arial, sans-serif;
      background: #f7f1f2;
      color: #4b3f55;
    }
:where(body[data-page="auth-register"]) .page {
      min-height: 100vh;
      display: grid;
      grid-template-columns: 1fr 1fr;
    }
:where(body[data-page="auth-register"]) .left-panel {
      background: #f3edf4;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 40px;
      box-sizing: border-box;
    }
:where(body[data-page="auth-register"]) .left-content {
      max-width: 420px;
      text-align: center;
    }
:where(body[data-page="auth-register"]) .logo-badge {
      width: 72px;
      height: 72px;
      margin: 0 auto 22px;
      border-radius: 50%;
      background: radial-gradient(circle at 30% 30%, #f3e8ff, #d9c2ff);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
    }
:where(body[data-page="auth-register"]) .brand {
      font-family: Georgia, serif;
      font-size: 38px;
      color: #3f2f4c;
      margin-bottom: 8px;
    }
:where(body[data-page="auth-register"]) .tagline {
      color: #8a7b94;
      margin-bottom: 32px;
      font-size: 17px;
    }
:where(body[data-page="auth-register"]) .cards {
      display: flex;
      gap: 18px;
      justify-content: center;
      margin-bottom: 28px;
    }
:where(body[data-page="auth-register"]) .card-mini {
      width: 82px;
      height: 122px;
      border-radius: 18px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      box-shadow: 0 10px 18px rgba(0, 0, 0, 0.05);
    }
:where(body[data-page="auth-register"]) .card-yellow { background: #f2df98; }
:where(body[data-page="auth-register"]) .card-purple { background: #d6c3ff; }
:where(body[data-page="auth-register"]) .card-pink { background: #efc0cf; }
:where(body[data-page="auth-register"]) .left-title {
      font-family: Georgia, serif;
      font-size: 28px;
      line-height: 1.3;
      margin-bottom: 18px;
      color: #3f2f4c;
    }
:where(body[data-page="auth-register"]) .left-text {
      font-size: 18px;
      line-height: 1.6;
      color: #6d5f77;
    }
:where(body[data-page="auth-register"]) .right-panel {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 32px;
      box-sizing: border-box;
      background: #f8f4f3;
    }
:where(body[data-page="auth-register"]) .form-card {
      width: 100%;
      max-width: 520px;
      background: transparent;
    }
:where(body[data-page="auth-register"]) h1 {
      margin: 0 0 6px;
      font-size: 42px;
      font-family: Georgia, serif;
      font-weight: 500;
      color: #3f2f4c;
    }
:where(body[data-page="auth-register"]) .login-link {
      margin-bottom: 22px;
      color: #6d5f77;
      font-size: 16px;
    }
:where(body[data-page="auth-register"]) .login-link a {
      color: #7f65c4;
      text-decoration: none;
      font-weight: 600;
    }
:where(body[data-page="auth-register"]) .message {
      display: none;
      margin-bottom: 18px;
      padding: 14px 16px;
      border-radius: 16px;
      font-size: 15px;
      line-height: 1.45;
    }
:where(body[data-page="auth-register"]) .message.error {
      display: block;
      background: #fbeaea;
      color: #9a3f3f;
      border: 1px solid #f2c9c9;
    }
:where(body[data-page="auth-register"]) .message.success {
      display: block;
      background: #ecf8ee;
      color: #2f7a45;
      border: 1px solid #cfe8d5;
    }
:where(body[data-page="auth-register"]) .field {
      margin-bottom: 18px;
    }
:where(body[data-page="auth-register"]) .field label {
      display: block;
      margin-bottom: 8px;
      font-size: 16px;
      font-weight: 600;
      color: #4b3f55;
    }
:where(body[data-page="auth-register"]) .field input {
      width: 100%;
      box-sizing: border-box;
      padding: 16px;
      border: 1px solid #e5dbe7;
      border-radius: 18px;
      background: #fcfbfd;
      font-size: 16px;
      color: #3f2f4c;
      outline: none;
      transition: border-color 0.2s ease;
    }
:where(body[data-page="auth-register"]) .field input:focus {
      border-color: #c9a8ff;
    }
:where(body[data-page="auth-register"]) .checkbox-row {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      margin: 18px 0 22px;
      font-size: 15px;
      line-height: 1.5;
      color: #6d5f77;
    }
:where(body[data-page="auth-register"]) .checkbox-row input[type="checkbox"] {
      margin-top: 3px;
      width: 18px;
      height: 18px;
      accent-color: #b894ff;
      flex: 0 0 auto;
    }
:where(body[data-page="auth-register"]) .checkbox-row a {
      color: #7f65c4;
      text-decoration: none;
      font-weight: 600;
    }
:where(body[data-page="auth-register"]) .btn {
      width: 100%;
      border: none;
      border-radius: 999px;
      padding: 17px 20px;
      font-size: 17px;
      font-weight: 700;
      cursor: pointer;
      color: #4a3556;
      background: linear-gradient(90deg, #d8b8ff 0%, #ecd3a7 100%);
      transition: transform 0.15s ease, opacity 0.15s ease;
    }
:where(body[data-page="auth-register"]) .btn:hover {
      transform: translateY(-1px);
    }
:where(body[data-page="auth-register"]) .btn:disabled {
      opacity: 0.65;
      cursor: not-allowed;
      transform: none;
    }
:where(body[data-page="auth-register"]) .hint {
      font-size: 14px;
      color: #8a7b94;
    }
@media (max-width: 980px) {
  :where(body[data-page="auth-register"]) .page {
        grid-template-columns: 1fr;
      }
  :where(body[data-page="auth-register"]) .left-panel {
        display: none;
      }
  :where(body[data-page="auth-register"]) .right-panel {
        min-height: 100vh;
      }
}

/* === Page : auth-reset-password  (pages/auth/reset-password.html) === */
body:where([data-page="auth-reset-password"]) {
      margin: 0;
      font-family: Arial, sans-serif;
      background: #f7f1f2;
      color: #4b3f55;
    }
:where(body[data-page="auth-reset-password"]) .page {
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      box-sizing: border-box;
    }
:where(body[data-page="auth-reset-password"]) .card {
      width: 100%;
      max-width: 520px;
      background: #fff;
      border-radius: 28px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
      padding: 36px 32px;
      box-sizing: border-box;
      text-align: center;
    }
:where(body[data-page="auth-reset-password"]) .logo-badge {
      width: 72px;
      height: 72px;
      margin: 0 auto 20px;
      border-radius: 50%;
      background: radial-gradient(circle at 30% 30%, #f3e8ff, #d9c2ff);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
    }
:where(body[data-page="auth-reset-password"]) h1 {
      margin: 0 0 10px;
      font-size: 38px;
      line-height: 1.1;
      font-family: Georgia, serif;
      font-weight: 500;
      color: #3f2f4c;
    }
:where(body[data-page="auth-reset-password"]) .subtitle {
      margin: 0 0 28px;
      font-size: 17px;
      line-height: 1.5;
      color: #6d5f77;
    }
:where(body[data-page="auth-reset-password"]) .message {
      display: none;
      margin-bottom: 18px;
      padding: 14px 16px;
      border-radius: 16px;
      font-size: 15px;
      line-height: 1.4;
      text-align: left;
    }
:where(body[data-page="auth-reset-password"]) .message.error {
      display: block;
      background: #fbeaea;
      color: #9a3f3f;
      border: 1px solid #f2c9c9;
    }
:where(body[data-page="auth-reset-password"]) .message.success {
      display: block;
      background: #ecf8ee;
      color: #2f7a45;
      border: 1px solid #cfe8d5;
    }
:where(body[data-page="auth-reset-password"]) .field {
      text-align: left;
      margin-bottom: 18px;
    }
:where(body[data-page="auth-reset-password"]) .field label {
      display: block;
      margin-bottom: 8px;
      font-size: 16px;
      font-weight: 600;
      color: #4b3f55;
    }
:where(body[data-page="auth-reset-password"]) .input-wrap {
      position: relative;
    }
:where(body[data-page="auth-reset-password"]) .field input {
      width: 100%;
      box-sizing: border-box;
      padding: 16px 46px 16px 16px;
      border: 1px solid #e5dbe7;
      border-radius: 18px;
      background: #fcfbfd;
      font-size: 16px;
      color: #3f2f4c;
      outline: none;
      transition: border-color 0.2s ease;
    }
:where(body[data-page="auth-reset-password"]) .field input:focus {
      border-color: #c9a8ff;
    }
:where(body[data-page="auth-reset-password"]) .toggle-password {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      background: none;
      border: none;
      cursor: pointer;
      font-size: 18px;
      color: #7c6a88;
    }
:where(body[data-page="auth-reset-password"]) .rules {
      margin: 8px 0 22px;
      padding-left: 18px;
      text-align: left;
      color: #6d5f77;
      font-size: 14px;
      line-height: 1.7;
    }
:where(body[data-page="auth-reset-password"]) .rules li.valid {
      color: #2f7a45;
    }
:where(body[data-page="auth-reset-password"]) .btn {
      width: 100%;
      border: none;
      border-radius: 999px;
      padding: 17px 20px;
      font-size: 17px;
      font-weight: 700;
      cursor: pointer;
      color: #4a3556;
      background: linear-gradient(90deg, #d8b8ff 0%, #ecd3a7 100%);
      transition: transform 0.15s ease, opacity 0.15s ease;
    }
:where(body[data-page="auth-reset-password"]) .btn:hover {
      transform: translateY(-1px);
    }
:where(body[data-page="auth-reset-password"]) .btn:disabled {
      opacity: 0.6;
      cursor: not-allowed;
      transform: none;
    }
:where(body[data-page="auth-reset-password"]) .footer-link {
      margin-top: 22px;
      font-size: 15px;
      color: #6d5f77;
    }
:where(body[data-page="auth-reset-password"]) .footer-link a, :where(body[data-page="auth-reset-password"]) .back-link {
      color: #7f65c4;
      text-decoration: none;
      font-weight: 600;
    }
:where(body[data-page="auth-reset-password"]) .back-link {
      display: inline-block;
      margin-bottom: 22px;
      font-size: 15px;
    }
@media (max-width: 560px) {
  :where(body[data-page="auth-reset-password"]) .card {
        padding: 28px 20px;
        border-radius: 22px;
      }
  :where(body[data-page="auth-reset-password"]) h1 {
        font-size: 32px;
      }
}

/* === Page : cabinet-avis  (pages/cabinet/avis.html) === */
:where(body[data-page="cabinet-avis"]) .dash-topbar { position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
:where(body[data-page="cabinet-avis"]) .dash-topbar h1 { font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body); }
:where(body[data-page="cabinet-avis"]) .dash-content { padding:32px;max-width:1000px; }
:where(body[data-page="cabinet-avis"]) #viewNormal { display:block; }
:where(body[data-page="cabinet-avis"]) #viewConsultation { display:none; }
:where(body[data-page="cabinet-avis"]) .stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px; }
:where(body[data-page="cabinet-avis"]) .stat-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s; }
:where(body[data-page="cabinet-avis"]) .stat-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-avis"]) .stat-card .stat-icon { font-size:1.2rem;margin-bottom:10px;display:block; }
:where(body[data-page="cabinet-avis"]) .stat-card .stat-val { font-family:var(--font-display);font-size:1.8rem;font-weight:600;color:#3d2e4a;display:block;line-height:1;margin-bottom:4px; }
:where(body[data-page="cabinet-avis"]) .stat-card .stat-lbl { font-size:.76rem;color:var(--text-soft); }
:where(body[data-page="cabinet-avis"]) .dash-block { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);margin-bottom:20px; }
:where(body[data-page="cabinet-avis"]) .dash-block-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-avis"]) .dash-block-header h3 { font-size:.97rem; }
:where(body[data-page="cabinet-avis"]) .dash-block-header a { font-size:.78rem;color:var(--lavender-deep);text-decoration:underline;text-underline-offset:3px; }
:where(body[data-page="cabinet-avis"]) .pending-list { display:flex;flex-direction:column;gap:10px; }
:where(body[data-page="cabinet-avis"]) .pending-item { display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--bg-soft);border-radius:var(--radius-md);border:1px solid var(--line);transition:border-color .2s; }
:where(body[data-page="cabinet-avis"]) .pending-item:hover { border-color:rgba(180,155,210,.25); }
:where(body[data-page="cabinet-avis"]) .pending-avatar { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.6),rgba(237,215,176,.6));display:grid;place-items:center;font-family:var(--font-display);font-size:1rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .pending-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-avis"]) .pending-info strong { display:block;font-size:.85rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-avis"]) .pending-info span { font-size:.75rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-avis"]) .pending-badge { font-size:.72rem;padding:4px 10px;border-radius:999px;background:rgba(237,215,176,.5);color:#7a5a20;font-weight:500;white-space:nowrap; }
:where(body[data-page="cabinet-avis"]) .pending-badge.urgent { background:rgba(238,215,215,.7);color:#7a3535; }
:where(body[data-page="cabinet-avis"]) .btn-repondre { padding:7px 14px;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;font-family:var(--font-body);font-size:.76rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-avis"]) .btn-repondre:hover { transform:translateY(-1px);box-shadow:0 4px 12px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-avis"]) .consult-row { display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-avis"]) .consult-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-avis"]) .consult-row .c-avatar { width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:.9rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .consult-row .c-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-avis"]) .consult-row .c-info strong { display:block;font-size:.84rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-avis"]) .consult-row .c-info span { font-size:.74rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-avis"]) .consult-row .c-amount { font-weight:500;color:var(--text);flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .badge-mode { font-size:.68rem;padding:2px 8px;border-radius:999px;margin-left:6px; }
:where(body[data-page="cabinet-avis"]) .badge-chat { background:rgba(210,238,210,.6);color:#3a6040; }
:where(body[data-page="cabinet-avis"]) .badge-tel { background:rgba(210,225,238,.6);color:#3a5070; }
:where(body[data-page="cabinet-avis"]) .badge-email { background:rgba(237,215,176,.5);color:#7a5a20; }
:where(body[data-page="cabinet-avis"]) .avis-row { padding:12px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-avis"]) .avis-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-avis"]) .avis-stars { color:var(--gold);font-size:.78rem;letter-spacing:1px;margin-bottom:4px; }
:where(body[data-page="cabinet-avis"]) .avis-text { color:var(--text-soft);line-height:1.6;font-style:italic; }
:where(body[data-page="cabinet-avis"]) .avis-meta { font-size:.73rem;color:var(--text-xsoft);margin-top:4px; }
:where(body[data-page="cabinet-avis"]) .revenus-bar-wrap { display:flex;flex-direction:column;gap:8px;margin-top:8px; }
:where(body[data-page="cabinet-avis"]) .revenu-day { display:flex;align-items:center;gap:10px;font-size:.78rem; }
:where(body[data-page="cabinet-avis"]) .revenu-day .day { color:var(--text-soft);min-width:28px; }
:where(body[data-page="cabinet-avis"]) .revenu-bar-bg { flex:1;height:8px;background:var(--bg-soft);border-radius:4px;overflow:hidden; }
:where(body[data-page="cabinet-avis"]) .revenu-bar-fill { height:100%;border-radius:4px;background:linear-gradient(90deg,#c4aee0,#e8d0a8);transition:width .6s ease; }
:where(body[data-page="cabinet-avis"]) .revenu-day .amount { color:var(--text);font-weight:500;min-width:48px;text-align:right; }
:where(body[data-page="cabinet-avis"]) .consult-active-view {
      background: linear-gradient(160deg,#1a1228 0%,#2a1840 100%);
      border-radius:var(--radius-xl);
      padding:24px;
      color:#e8dff5;
      margin-bottom:20px;
      position:relative;
      overflow:hidden;
    }
:where(body[data-page="cabinet-avis"]) .consult-active-view::before { content:'';position:absolute;top:-60px;right:-60px;width:260px;height:260px;background:radial-gradient(circle,rgba(155,126,200,.2),transparent 70%);border-radius:50%;pointer-events:none; }
:where(body[data-page="cabinet-avis"]) .active-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:16px; }
:where(body[data-page="cabinet-avis"]) .active-title { font-family:var(--font-display);font-size:1.2rem;color:#e8dff5; }
:where(body[data-page="cabinet-avis"]) .active-mode-badge { display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:rgba(155,126,200,.2);border:1px solid rgba(155,126,200,.3);border-radius:999px;font-size:.78rem;color:rgba(200,180,230,.9); }
:where(body[data-page="cabinet-avis"]) .live-dot { width:7px;height:7px;background:#72b872;border-radius:50%;animation:pulseDot 1.5s ease-in-out infinite;flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .client-info-row { display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:14px;background:rgba(255,255,255,.05);border-radius:14px;border:1px solid rgba(155,126,200,.15); }
:where(body[data-page="cabinet-avis"]) .client-avatar { width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1.3rem;color:#7a5c8a;flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .client-detail strong { display:block;font-size:1rem;color:#e8dff5;margin-bottom:3px; }
:where(body[data-page="cabinet-avis"]) .client-detail span { font-size:.8rem;color:rgba(200,180,230,.6); }
:where(body[data-page="cabinet-avis"]) .realtime-stats { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px; }
:where(body[data-page="cabinet-avis"]) .rt-stat { background:rgba(255,255,255,.05);border:1px solid rgba(155,126,200,.15);border-radius:12px;padding:12px;text-align:center; }
:where(body[data-page="cabinet-avis"]) .rt-stat .rt-val { font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#e8dff5;display:block;line-height:1;margin-bottom:3px; }
:where(body[data-page="cabinet-avis"]) .rt-stat .rt-lbl { font-size:.68rem;color:rgba(200,180,230,.5); }
:where(body[data-page="cabinet-avis"]) .rt-stat .rt-val.warn { color:#e8d0a8; }
:where(body[data-page="cabinet-avis"]) .rt-stat .rt-val.danger { color:#f0a0a0; }
:where(body[data-page="cabinet-avis"]) .credits-client-bar { margin-bottom:14px; }
:where(body[data-page="cabinet-avis"]) .credits-client-label { display:flex;justify-content:space-between;font-size:.78rem;color:rgba(200,180,230,.6);margin-bottom:6px; }
:where(body[data-page="cabinet-avis"]) .credits-bar-bg { height:6px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden; }
:where(body[data-page="cabinet-avis"]) .credits-bar-fill { height:100%;border-radius:3px;transition:width .5s ease,background .5s; background:linear-gradient(90deg,#9b7ec8,#c8a860); }
:where(body[data-page="cabinet-avis"]) .credits-bar-fill.warn { background:linear-gradient(90deg,#c8a860,#e89060); }
:where(body[data-page="cabinet-avis"]) .credits-bar-fill.danger { background:#e08080; }
:where(body[data-page="cabinet-avis"]) .consult-chat-shell {
      margin: 14px 0 12px;
      border: 1px solid rgba(155,126,200,.15);
      border-radius: 18px;
      background: rgba(10, 6, 20, .22);
      overflow: hidden;
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-header {
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:12px 16px;
      background: rgba(255,255,255,.04);
      border-bottom:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-header strong {
      font-size:.84rem;
      color:#e8dff5;
      font-weight:500;
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-header span {
      font-size:.72rem;
      color:rgba(200,180,230,.5);
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-messages {
      height: 170px;
      max-height: 24vh;
      min-height: 140px;
      overflow-y: auto;
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      scrollbar-width: thin;
      scrollbar-color: rgba(155,126,200,.2) transparent;
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-messages::-webkit-scrollbar { width:4px; }
:where(body[data-page="cabinet-avis"]) .consult-chat-messages::-webkit-scrollbar-thumb { background:rgba(155,126,200,.25); border-radius:2px; }
:where(body[data-page="cabinet-avis"]) .chat-row {
      display:flex;
      max-width: 82%;
      gap:10px;
      align-items:flex-end;
      animation: chatSlideIn .22s ease;
    }
:where(body[data-page="cabinet-avis"]) .chat-row.from-client { align-self:flex-start; }
:where(body[data-page="cabinet-avis"]) .chat-row.from-voyant { align-self:flex-end; flex-direction:row-reverse; }
:where(body[data-page="cabinet-avis"]) .chat-avatar {
      width:32px;height:32px;border-radius:50%;
      display:grid;place-items:center;
      flex-shrink:0;
      font-family:var(--font-display);
      font-size:.82rem;
      color:#3d2a4e;
      background:linear-gradient(135deg,rgba(210,190,238,.85),rgba(237,215,176,.85));
    }
:where(body[data-page="cabinet-avis"]) .chat-row.from-voyant .chat-avatar {
      color:#e8dff5;
      background:rgba(155,126,200,.32);
    }
:where(body[data-page="cabinet-avis"]) .chat-bubble {
      padding:11px 14px;
      border-radius:16px;
      line-height:1.55;
      font-size:.86rem;
      border:1px solid rgba(155,126,200,.16);
      word-break:break-word;
      white-space:pre-wrap;
    }
:where(body[data-page="cabinet-avis"]) .chat-row.from-client .chat-bubble {
      background:rgba(255,255,255,.07);
      color:#f2edf8;
      border-bottom-left-radius:5px;
    }
:where(body[data-page="cabinet-avis"]) .chat-row.from-voyant .chat-bubble {
      background:linear-gradient(135deg,rgba(155,126,200,.26),rgba(200,168,96,.18));
      color:#fffaf0;
      border-bottom-right-radius:5px;
    }
:where(body[data-page="cabinet-avis"]) .chat-meta {
      margin-top:4px;
      font-size:.66rem;
      color:rgba(200,180,230,.42);
    }
:where(body[data-page="cabinet-avis"]) .chat-system {
      align-self:center;
      padding:6px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.06);
      color:rgba(200,180,230,.58);
      font-size:.72rem;
      border:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-compose {
      padding: 12px 14px;
      border-top:1px solid rgba(155,126,200,.12);
      display:flex;
      gap:10px;
      align-items:flex-end;
      background: rgba(255,255,255,.03);
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-compose textarea {
      flex:1;
      min-height:42px;
      max-height:96px;
      resize:vertical;
      border-radius:14px;
      border:1px solid rgba(155,126,200,.2);
      background:rgba(255,255,255,.06);
      color:#f0eaf8;
      padding:12px 14px;
      outline:none;
      font-family:var(--font-body);
      font-size:.84rem;
      line-height:1.5;
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-compose textarea:focus {
      border-color: rgba(155,126,200,.45);
      box-shadow:0 0 0 3px rgba(155,126,200,.1);
    }
:where(body[data-page="cabinet-avis"]) .consult-chat-compose textarea::placeholder { color:rgba(200,180,230,.34); }
:where(body[data-page="cabinet-avis"]) .btn-send-chat {
      min-width:104px;
      height:42px;
      border:none;
      border-radius:999px;
      background:linear-gradient(135deg,#9b7ec8,#c8a860);
      color:#2c1d38;
      font-family:var(--font-body);
      font-size:.82rem;
      font-weight:600;
      cursor:pointer;
      transition:transform .2s, opacity .2s, box-shadow .2s;
      box-shadow:0 4px 16px rgba(155,126,200,.25);
    }
:where(body[data-page="cabinet-avis"]) .btn-send-chat:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-avis"]) .btn-send-chat:disabled { opacity:.4; cursor:not-allowed; transform:none; box-shadow:none; }
:where(body[data-page="cabinet-avis"]) .consult-actions-bar {
      display:grid;
      grid-template-columns:minmax(0,1fr) 260px;
      gap:14px;
      align-items:end;
      margin-top:12px;
    }
:where(body[data-page="cabinet-avis"]) .session-notes textarea {
      width:100%;padding:10px 12px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(155,126,200,.2);
      border-radius:12px;
      font-family:var(--font-body);font-size:.82rem;
      color:#f0eaf8;outline:none;
      resize:vertical;min-height:58px;max-height:92px;
      transition:border-color .2s;
    }
:where(body[data-page="cabinet-avis"]) .session-notes textarea:focus { border-color:rgba(155,126,200,.45); }
:where(body[data-page="cabinet-avis"]) .session-notes textarea::placeholder { color:rgba(200,180,230,.3); }
:where(body[data-page="cabinet-avis"]) .session-notes label { display:block;font-size:.76rem;color:rgba(200,180,230,.5);margin-bottom:7px;letter-spacing:.03em;text-transform:uppercase; }
:where(body[data-page="cabinet-avis"]) .btn-end-consultation {
      width:100%;padding:12px 16px;border-radius:999px;
      background:rgba(200,80,80,.2);
      border:1px solid rgba(200,80,80,.3);
      color:#f0a0a0;
      font-family:var(--font-body);font-size:.9rem;font-weight:500;
      cursor:pointer;transition:background .2s,border-color .2s;
      margin-top:0;
      align-self:end;
      position:sticky;
      bottom:10px;
      box-shadow:0 8px 24px rgba(0,0,0,.18);
    }
:where(body[data-page="cabinet-avis"]) .btn-end-consultation:hover { background:rgba(200,80,80,.35);border-color:rgba(200,80,80,.5); }
:where(body[data-page="cabinet-avis"]) .client-low-credits {
      display:none;align-items:center;gap:8px;
      padding:10px 14px;border-radius:10px;
      background:rgba(200,120,40,.2);border:1px solid rgba(200,120,40,.3);
      color:#e8c090;font-size:.82rem;margin-bottom:16px;
    }
:where(body[data-page="cabinet-avis"]) .client-low-credits.visible { display:flex; }
:where(body[data-page="cabinet-avis"]) .incoming-requests-block { display:none; margin-bottom:20px; }
:where(body[data-page="cabinet-avis"]) .incoming-requests-block.visible { display:block; }
:where(body[data-page="cabinet-avis"]) .incoming-requests-list { display:flex; flex-direction:column; gap:12px; }
:where(body[data-page="cabinet-avis"]) .incoming-request-card {
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:14px;
      align-items:center;
      padding:16px 18px;
      border-radius:16px;
      background:linear-gradient(135deg,rgba(155,126,200,.16),rgba(232,208,168,.14));
      border:1px solid rgba(155,126,200,.2);
      box-shadow:var(--shadow-sm);
    }
:where(body[data-page="cabinet-avis"]) .incoming-request-main strong { display:block; font-size:.96rem; color:var(--text); margin-bottom:4px; }
:where(body[data-page="cabinet-avis"]) .incoming-request-meta { display:flex; flex-wrap:wrap; gap:8px; font-size:.76rem; color:var(--text-soft); }
:where(body[data-page="cabinet-avis"]) .incoming-pill {
      display:inline-flex; align-items:center; gap:6px;
      padding:5px 10px; border-radius:999px;
      background:rgba(255,255,255,.55); border:1px solid rgba(155,126,200,.12);
      color:#5a446e; font-weight:500;
    }
:where(body[data-page="cabinet-avis"]) .incoming-request-actions { display:flex; gap:10px; align-items:center; }
:where(body[data-page="cabinet-avis"]) .btn-accept-request, :where(body[data-page="cabinet-avis"]) .btn-reject-request {
      border:none; border-radius:999px; padding:10px 16px; cursor:pointer;
      font-family:var(--font-body); font-size:.78rem; font-weight:600;
      transition:transform .18s ease, opacity .18s ease, box-shadow .18s ease;
      white-space:nowrap;
    }
:where(body[data-page="cabinet-avis"]) .btn-accept-request { background:linear-gradient(135deg,#c4aee0,#e8d0a8); color:#3d2a4e; box-shadow:0 6px 18px rgba(155,126,200,.18); }
:where(body[data-page="cabinet-avis"]) .btn-reject-request { background:rgba(200,80,80,.12); color:#9c4d4d; border:1px solid rgba(200,80,80,.2); }
:where(body[data-page="cabinet-avis"]) .btn-accept-request:hover, :where(body[data-page="cabinet-avis"]) .btn-reject-request:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-avis"]) .dashboard-toast-stack {
      position:fixed; top:18px; right:18px; z-index:120;
      display:flex; flex-direction:column; gap:10px; pointer-events:none;
    }
:where(body[data-page="cabinet-avis"]) .dashboard-toast {
      min-width:280px; max-width:360px; padding:14px 16px;
      border-radius:16px; color:#f7f1fb;
      background:rgba(28,19,43,.95); border:1px solid rgba(155,126,200,.24);
      box-shadow:0 20px 40px rgba(0,0,0,.22);
      opacity:0; transform:translateY(-8px);
      animation:toastIn .24s ease forwards;
    }
:where(body[data-page="cabinet-avis"]) .dashboard-toast strong { display:block; font-size:.84rem; margin-bottom:4px; color:#fff; }
:where(body[data-page="cabinet-avis"]) .dashboard-toast span { display:block; font-size:.76rem; color:rgba(232,223,245,.72); line-height:1.45; }
@media(max-width:1024px) { .stats-grid{grid-template-columns:repeat(2,1fr);} .realtime-stats{grid-template-columns:repeat(2,1fr);} }
@media(max-width:900px) {
      .consult-active-view { padding:22px; }
      .consult-chat-messages { height: 210px; max-height: 28vh; }
    }
@media(max-width:768px) {
      .dashboard-layout{grid-template-columns:1fr;}
      
      
      .dash-content{padding:20px 16px;}
      .dash-topbar{padding:0 16px;}
    }
@media(max-width:480px) { .stats-grid{grid-template-columns:1fr 1fr;} .realtime-stats{grid-template-columns:1fr 1fr;} }
:where(body[data-page="cabinet-avis"]) .note-global-card { background:linear-gradient(135deg,#1e1430,#2a1840);border:1px solid rgba(155,126,200,.2);border-radius:var(--radius-xl);padding:32px;display:flex;align-items:center;gap:40px;margin-bottom:24px;box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-avis"]) .note-big { font-family:var(--font-display);font-size:4rem;font-weight:600;color:#e8dff5;line-height:1; }
:where(body[data-page="cabinet-avis"]) .note-stars { color:var(--gold);font-size:1.4rem;letter-spacing:3px;margin-bottom:4px; }
:where(body[data-page="cabinet-avis"]) .note-count { font-size:.84rem;color:rgba(200,180,230,.5); }
:where(body[data-page="cabinet-avis"]) .repartition { flex:1; }
:where(body[data-page="cabinet-avis"]) .rep-row { display:flex;align-items:center;gap:10px;margin-bottom:8px;font-size:.82rem; }
:where(body[data-page="cabinet-avis"]) .rep-label { color:rgba(200,180,230,.6);width:50px;text-align:right;flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .rep-bar-bg { flex:1;height:8px;background:rgba(255,255,255,.08);border-radius:4px;overflow:hidden; }
:where(body[data-page="cabinet-avis"]) .rep-bar-fill { height:100%;border-radius:4px;background:linear-gradient(90deg,#c4aee0,#e8d0a8);transition:width .8s ease; }
:where(body[data-page="cabinet-avis"]) .rep-count { color:rgba(200,180,230,.4);width:24px;flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .avis-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;margin-bottom:14px;box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-avis"]) .avis-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-avis"]) .avis-header-row { display:flex;align-items:center;gap:12px;margin-bottom:12px; }
:where(body[data-page="cabinet-avis"]) .avis-avatar { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .avis-meta-info strong { display:block;font-size:.88rem;color:var(--text); }
:where(body[data-page="cabinet-avis"]) .avis-meta-info span { font-size:.76rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-avis"]) .avis-stars-inline { color:var(--gold);font-size:.85rem;letter-spacing:1px;margin-left:auto;flex-shrink:0; }
:where(body[data-page="cabinet-avis"]) .avis-comment { font-size:.87rem;color:var(--text-soft);line-height:1.7;font-style:italic;border-left:2px solid rgba(196,174,224,.3);padding-left:14px; }
:where(body[data-page="cabinet-avis"]) .avis-no-comment { font-size:.82rem;color:var(--text-xsoft);font-style:italic; }
:where(body[data-page="cabinet-avis"]) .mode-chip { font-size:.7rem;padding:2px 8px;border-radius:999px;background:rgba(196,174,224,.15);color:rgba(200,180,230,.6); }

/* === Page : cabinet-dashboard  (pages/cabinet/dashboard.html) === */
:where(body[data-page="cabinet-dashboard"]) .dash-topbar { position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
:where(body[data-page="cabinet-dashboard"]) .dash-topbar h1 { font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body); }
:where(body[data-page="cabinet-dashboard"]) .dash-content { padding:32px;max-width:1000px; }
:where(body[data-page="cabinet-dashboard"]) #viewNormal { display:block; }
:where(body[data-page="cabinet-dashboard"]) #viewConsultation { display:none; }
:where(body[data-page="cabinet-dashboard"]) .stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px; }
:where(body[data-page="cabinet-dashboard"]) .stat-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s; }
:where(body[data-page="cabinet-dashboard"]) .stat-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-dashboard"]) .stat-card .stat-icon { font-size:1.2rem;margin-bottom:10px;display:block; }
:where(body[data-page="cabinet-dashboard"]) .stat-card .stat-val { font-family:var(--font-display);font-size:1.8rem;font-weight:600;color:#3d2e4a;display:block;line-height:1;margin-bottom:4px; }
:where(body[data-page="cabinet-dashboard"]) .stat-card .stat-lbl { font-size:.76rem;color:var(--text-soft); }
:where(body[data-page="cabinet-dashboard"]) .dash-block { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);margin-bottom:20px; }
:where(body[data-page="cabinet-dashboard"]) .dash-block-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-dashboard"]) .dash-block-header h3 { font-size:.97rem; }
:where(body[data-page="cabinet-dashboard"]) .dash-block-header a { font-size:.78rem;color:var(--lavender-deep);text-decoration:underline;text-underline-offset:3px; }
:where(body[data-page="cabinet-dashboard"]) .pending-list { display:flex;flex-direction:column;gap:10px; }
:where(body[data-page="cabinet-dashboard"]) .pending-item { display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--bg-soft);border-radius:var(--radius-md);border:1px solid var(--line);transition:border-color .2s; }
:where(body[data-page="cabinet-dashboard"]) .pending-item:hover { border-color:rgba(180,155,210,.25); }
:where(body[data-page="cabinet-dashboard"]) .pending-avatar { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.6),rgba(237,215,176,.6));display:grid;place-items:center;font-family:var(--font-display);font-size:1rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-dashboard"]) .pending-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-dashboard"]) .pending-info strong { display:block;font-size:.85rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-dashboard"]) .pending-info span { font-size:.75rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-dashboard"]) .pending-badge { font-size:.72rem;padding:4px 10px;border-radius:999px;background:rgba(237,215,176,.5);color:#7a5a20;font-weight:500;white-space:nowrap; }
:where(body[data-page="cabinet-dashboard"]) .pending-badge.urgent { background:rgba(238,215,215,.7);color:#7a3535; }
:where(body[data-page="cabinet-dashboard"]) .btn-repondre { padding:7px 14px;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;font-family:var(--font-body);font-size:.76rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-dashboard"]) .btn-repondre:hover { transform:translateY(-1px);box-shadow:0 4px 12px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-dashboard"]) .consult-row { display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-dashboard"]) .consult-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-dashboard"]) .consult-row .c-avatar { width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:.9rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-dashboard"]) .consult-row .c-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-dashboard"]) .consult-row .c-info strong { display:block;font-size:.84rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-dashboard"]) .consult-row .c-info span { font-size:.74rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-dashboard"]) .consult-row .c-amount { font-weight:500;color:var(--text);flex-shrink:0; }
:where(body[data-page="cabinet-dashboard"]) .badge-mode { font-size:.68rem;padding:2px 8px;border-radius:999px;margin-left:6px; }
:where(body[data-page="cabinet-dashboard"]) .badge-chat { background:rgba(210,238,210,.6);color:#3a6040; }
:where(body[data-page="cabinet-dashboard"]) .badge-tel { background:rgba(210,225,238,.6);color:#3a5070; }
:where(body[data-page="cabinet-dashboard"]) .badge-email { background:rgba(237,215,176,.5);color:#7a5a20; }
:where(body[data-page="cabinet-dashboard"]) .avis-row { padding:12px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-dashboard"]) .avis-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-dashboard"]) .avis-stars { color:var(--gold);font-size:.78rem;letter-spacing:1px;margin-bottom:4px; }
:where(body[data-page="cabinet-dashboard"]) .avis-text { color:var(--text-soft);line-height:1.6;font-style:italic; }
:where(body[data-page="cabinet-dashboard"]) .avis-meta { font-size:.73rem;color:var(--text-xsoft);margin-top:4px; }
:where(body[data-page="cabinet-dashboard"]) .revenus-bar-wrap { display:flex;flex-direction:column;gap:8px;margin-top:8px; }
:where(body[data-page="cabinet-dashboard"]) .revenu-day { display:flex;align-items:center;gap:10px;font-size:.78rem; }
:where(body[data-page="cabinet-dashboard"]) .revenu-day .day { color:var(--text-soft);min-width:28px; }
:where(body[data-page="cabinet-dashboard"]) .revenu-bar-bg { flex:1;height:8px;background:var(--bg-soft);border-radius:4px;overflow:hidden; }
:where(body[data-page="cabinet-dashboard"]) .revenu-bar-fill { height:100%;border-radius:4px;background:linear-gradient(90deg,#c4aee0,#e8d0a8);transition:width .6s ease; }
:where(body[data-page="cabinet-dashboard"]) .revenu-day .amount { color:var(--text);font-weight:500;min-width:48px;text-align:right; }
:where(body[data-page="cabinet-dashboard"]) .consult-active-view {
      background: linear-gradient(160deg,#1a1228 0%,#2a1840 100%);
      border-radius:var(--radius-xl);
      padding:24px;
      color:#e8dff5;
      margin-bottom:20px;
      position:relative;
      overflow:hidden;
    }
:where(body[data-page="cabinet-dashboard"]) .consult-active-view::before { content:'';position:absolute;top:-60px;right:-60px;width:260px;height:260px;background:radial-gradient(circle,rgba(155,126,200,.2),transparent 70%);border-radius:50%;pointer-events:none; }
:where(body[data-page="cabinet-dashboard"]) .active-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:16px; }
:where(body[data-page="cabinet-dashboard"]) .active-title { font-family:var(--font-display);font-size:1.2rem;color:#e8dff5; }
:where(body[data-page="cabinet-dashboard"]) .active-mode-badge { display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:rgba(155,126,200,.2);border:1px solid rgba(155,126,200,.3);border-radius:999px;font-size:.78rem;color:rgba(200,180,230,.9); }
:where(body[data-page="cabinet-dashboard"]) .live-dot { width:7px;height:7px;background:#72b872;border-radius:50%;animation:pulseDot 1.5s ease-in-out infinite;flex-shrink:0; }
:where(body[data-page="cabinet-dashboard"]) .client-info-row { display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:14px;background:rgba(255,255,255,.05);border-radius:14px;border:1px solid rgba(155,126,200,.15); }
:where(body[data-page="cabinet-dashboard"]) .client-avatar { width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1.3rem;color:#7a5c8a;flex-shrink:0; }
:where(body[data-page="cabinet-dashboard"]) .client-detail strong { display:block;font-size:1rem;color:#e8dff5;margin-bottom:3px; }
:where(body[data-page="cabinet-dashboard"]) .client-detail span { font-size:.8rem;color:rgba(200,180,230,.6); }
:where(body[data-page="cabinet-dashboard"]) .realtime-stats { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px; }
:where(body[data-page="cabinet-dashboard"]) .rt-stat { background:rgba(255,255,255,.05);border:1px solid rgba(155,126,200,.15);border-radius:12px;padding:12px;text-align:center; }
:where(body[data-page="cabinet-dashboard"]) .rt-stat .rt-val { font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#e8dff5;display:block;line-height:1;margin-bottom:3px; }
:where(body[data-page="cabinet-dashboard"]) .rt-stat .rt-lbl { font-size:.68rem;color:rgba(200,180,230,.5); }
:where(body[data-page="cabinet-dashboard"]) .rt-stat .rt-val.warn { color:#e8d0a8; }
:where(body[data-page="cabinet-dashboard"]) .rt-stat .rt-val.danger { color:#f0a0a0; }
:where(body[data-page="cabinet-dashboard"]) .credits-client-bar { margin-bottom:14px; }
:where(body[data-page="cabinet-dashboard"]) .credits-client-label { display:flex;justify-content:space-between;font-size:.78rem;color:rgba(200,180,230,.6);margin-bottom:6px; }
:where(body[data-page="cabinet-dashboard"]) .credits-bar-bg { height:6px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden; }
:where(body[data-page="cabinet-dashboard"]) .credits-bar-fill { height:100%;border-radius:3px;transition:width .5s ease,background .5s; background:linear-gradient(90deg,#9b7ec8,#c8a860); }
:where(body[data-page="cabinet-dashboard"]) .credits-bar-fill.warn { background:linear-gradient(90deg,#c8a860,#e89060); }
:where(body[data-page="cabinet-dashboard"]) .credits-bar-fill.danger { background:#e08080; }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-shell {
      margin: 14px 0 12px;
      border: 1px solid rgba(155,126,200,.15);
      border-radius: 18px;
      background: rgba(10, 6, 20, .22);
      overflow: hidden;
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-header {
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:12px 16px;
      background: rgba(255,255,255,.04);
      border-bottom:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-header strong {
      font-size:.84rem;
      color:#e8dff5;
      font-weight:500;
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-header span {
      font-size:.72rem;
      color:rgba(200,180,230,.5);
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-messages {
      height: 170px;
      max-height: 24vh;
      min-height: 140px;
      overflow-y: auto;
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      scrollbar-width: thin;
      scrollbar-color: rgba(155,126,200,.2) transparent;
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-messages::-webkit-scrollbar { width:4px; }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-messages::-webkit-scrollbar-thumb { background:rgba(155,126,200,.25); border-radius:2px; }
:where(body[data-page="cabinet-dashboard"]) .chat-row {
      display:flex;
      max-width: 82%;
      gap:10px;
      align-items:flex-end;
      animation: chatSlideIn .22s ease;
    }
:where(body[data-page="cabinet-dashboard"]) .chat-row.from-client { align-self:flex-start; }
:where(body[data-page="cabinet-dashboard"]) .chat-row.from-voyant { align-self:flex-end; flex-direction:row-reverse; }
:where(body[data-page="cabinet-dashboard"]) .chat-avatar {
      width:32px;height:32px;border-radius:50%;
      display:grid;place-items:center;
      flex-shrink:0;
      font-family:var(--font-display);
      font-size:.82rem;
      color:#3d2a4e;
      background:linear-gradient(135deg,rgba(210,190,238,.85),rgba(237,215,176,.85));
    }
:where(body[data-page="cabinet-dashboard"]) .chat-row.from-voyant .chat-avatar {
      color:#e8dff5;
      background:rgba(155,126,200,.32);
    }
:where(body[data-page="cabinet-dashboard"]) .chat-bubble {
      padding:11px 14px;
      border-radius:16px;
      line-height:1.55;
      font-size:.86rem;
      border:1px solid rgba(155,126,200,.16);
      word-break:break-word;
      white-space:pre-wrap;
    }
:where(body[data-page="cabinet-dashboard"]) .chat-row.from-client .chat-bubble {
      background:rgba(255,255,255,.07);
      color:#f2edf8;
      border-bottom-left-radius:5px;
    }
:where(body[data-page="cabinet-dashboard"]) .chat-row.from-voyant .chat-bubble {
      background:linear-gradient(135deg,rgba(155,126,200,.26),rgba(200,168,96,.18));
      color:#fffaf0;
      border-bottom-right-radius:5px;
    }
:where(body[data-page="cabinet-dashboard"]) .chat-meta {
      margin-top:4px;
      font-size:.66rem;
      color:rgba(200,180,230,.42);
    }
:where(body[data-page="cabinet-dashboard"]) .chat-system {
      align-self:center;
      padding:6px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.06);
      color:rgba(200,180,230,.58);
      font-size:.72rem;
      border:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-compose {
      padding: 12px 14px;
      border-top:1px solid rgba(155,126,200,.12);
      display:flex;
      gap:10px;
      align-items:flex-end;
      background: rgba(255,255,255,.03);
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-compose textarea {
      flex:1;
      min-height:42px;
      max-height:96px;
      resize:vertical;
      border-radius:14px;
      border:1px solid rgba(155,126,200,.2);
      background:rgba(255,255,255,.06);
      color:#f0eaf8;
      padding:12px 14px;
      outline:none;
      font-family:var(--font-body);
      font-size:.84rem;
      line-height:1.5;
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-compose textarea:focus {
      border-color: rgba(155,126,200,.45);
      box-shadow:0 0 0 3px rgba(155,126,200,.1);
    }
:where(body[data-page="cabinet-dashboard"]) .consult-chat-compose textarea::placeholder { color:rgba(200,180,230,.34); }
:where(body[data-page="cabinet-dashboard"]) .btn-send-chat {
      min-width:104px;
      height:42px;
      border:none;
      border-radius:999px;
      background:linear-gradient(135deg,#9b7ec8,#c8a860);
      color:#2c1d38;
      font-family:var(--font-body);
      font-size:.82rem;
      font-weight:600;
      cursor:pointer;
      transition:transform .2s, opacity .2s, box-shadow .2s;
      box-shadow:0 4px 16px rgba(155,126,200,.25);
    }
:where(body[data-page="cabinet-dashboard"]) .btn-send-chat:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-dashboard"]) .btn-send-chat:disabled { opacity:.4; cursor:not-allowed; transform:none; box-shadow:none; }
:where(body[data-page="cabinet-dashboard"]) .consult-actions-bar {
      display:grid;
      grid-template-columns:minmax(0,1fr) 260px;
      gap:14px;
      align-items:end;
      margin-top:12px;
    }
:where(body[data-page="cabinet-dashboard"]) .session-notes textarea {
      width:100%;padding:10px 12px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(155,126,200,.2);
      border-radius:12px;
      font-family:var(--font-body);font-size:.82rem;
      color:#f0eaf8;outline:none;
      resize:vertical;min-height:58px;max-height:92px;
      transition:border-color .2s;
    }
:where(body[data-page="cabinet-dashboard"]) .session-notes textarea:focus { border-color:rgba(155,126,200,.45); }
:where(body[data-page="cabinet-dashboard"]) .session-notes textarea::placeholder { color:rgba(200,180,230,.3); }
:where(body[data-page="cabinet-dashboard"]) .session-notes label { display:block;font-size:.76rem;color:rgba(200,180,230,.5);margin-bottom:7px;letter-spacing:.03em;text-transform:uppercase; }
:where(body[data-page="cabinet-dashboard"]) .btn-end-consultation {
      width:100%;padding:12px 16px;border-radius:999px;
      background:rgba(200,80,80,.2);
      border:1px solid rgba(200,80,80,.3);
      color:#f0a0a0;
      font-family:var(--font-body);font-size:.9rem;font-weight:500;
      cursor:pointer;transition:background .2s,border-color .2s;
      margin-top:0;
      align-self:end;
      position:sticky;
      bottom:10px;
      box-shadow:0 8px 24px rgba(0,0,0,.18);
    }
:where(body[data-page="cabinet-dashboard"]) .btn-end-consultation:hover { background:rgba(200,80,80,.35);border-color:rgba(200,80,80,.5); }
:where(body[data-page="cabinet-dashboard"]) .client-low-credits {
      display:none;align-items:center;gap:8px;
      padding:10px 14px;border-radius:10px;
      background:rgba(200,120,40,.2);border:1px solid rgba(200,120,40,.3);
      color:#e8c090;font-size:.82rem;margin-bottom:16px;
    }
:where(body[data-page="cabinet-dashboard"]) .client-low-credits.visible { display:flex; }
:where(body[data-page="cabinet-dashboard"]) .incoming-requests-block { display:none; margin-bottom:20px; }
:where(body[data-page="cabinet-dashboard"]) .incoming-requests-block.visible { display:block; }
:where(body[data-page="cabinet-dashboard"]) .incoming-requests-list { display:flex; flex-direction:column; gap:12px; }
:where(body[data-page="cabinet-dashboard"]) .incoming-request-card {
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:14px;
      align-items:center;
      padding:16px 18px;
      border-radius:16px;
      background:linear-gradient(135deg,rgba(155,126,200,.16),rgba(232,208,168,.14));
      border:1px solid rgba(155,126,200,.2);
      box-shadow:var(--shadow-sm);
    }
:where(body[data-page="cabinet-dashboard"]) .incoming-request-main strong { display:block; font-size:.96rem; color:var(--text); margin-bottom:4px; }
:where(body[data-page="cabinet-dashboard"]) .incoming-request-meta { display:flex; flex-wrap:wrap; gap:8px; font-size:.76rem; color:var(--text-soft); }
:where(body[data-page="cabinet-dashboard"]) .incoming-pill {
      display:inline-flex; align-items:center; gap:6px;
      padding:5px 10px; border-radius:999px;
      background:rgba(255,255,255,.55); border:1px solid rgba(155,126,200,.12);
      color:#5a446e; font-weight:500;
    }
:where(body[data-page="cabinet-dashboard"]) .incoming-request-actions { display:flex; gap:10px; align-items:center; }
:where(body[data-page="cabinet-dashboard"]) .btn-accept-request, :where(body[data-page="cabinet-dashboard"]) .btn-reject-request {
      border:none; border-radius:999px; padding:10px 16px; cursor:pointer;
      font-family:var(--font-body); font-size:.78rem; font-weight:600;
      transition:transform .18s ease, opacity .18s ease, box-shadow .18s ease;
      white-space:nowrap;
    }
:where(body[data-page="cabinet-dashboard"]) .btn-accept-request { background:linear-gradient(135deg,#c4aee0,#e8d0a8); color:#3d2a4e; box-shadow:0 6px 18px rgba(155,126,200,.18); }
:where(body[data-page="cabinet-dashboard"]) .btn-reject-request { background:rgba(200,80,80,.12); color:#9c4d4d; border:1px solid rgba(200,80,80,.2); }
:where(body[data-page="cabinet-dashboard"]) .btn-accept-request:hover, :where(body[data-page="cabinet-dashboard"]) .btn-reject-request:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-dashboard"]) .dashboard-toast-stack {
      position:fixed; top:18px; right:18px; z-index:120;
      display:flex; flex-direction:column; gap:10px; pointer-events:none;
    }
:where(body[data-page="cabinet-dashboard"]) .dashboard-toast {
      min-width:280px; max-width:360px; padding:14px 16px;
      border-radius:16px; color:#f7f1fb;
      background:rgba(28,19,43,.95); border:1px solid rgba(155,126,200,.24);
      box-shadow:0 20px 40px rgba(0,0,0,.22);
      opacity:0; transform:translateY(-8px);
      animation:toastIn .24s ease forwards;
    }
:where(body[data-page="cabinet-dashboard"]) .dashboard-toast strong { display:block; font-size:.84rem; margin-bottom:4px; color:#fff; }
:where(body[data-page="cabinet-dashboard"]) .dashboard-toast span { display:block; font-size:.76rem; color:rgba(232,223,245,.72); line-height:1.45; }
@media(max-width:1024px) { .stats-grid{grid-template-columns:repeat(2,1fr);} .realtime-stats{grid-template-columns:repeat(2,1fr);} }
@media(max-width:900px) {
      .consult-active-view { padding:22px; }
      .consult-chat-messages { height: 210px; max-height: 28vh; }
    }
@media(max-width:768px) {
      .dashboard-layout{grid-template-columns:1fr;}
      
      
      .dash-content{padding:20px 16px;}
      .dash-topbar{padding:0 16px;}
    }
@media(max-width:480px) { .stats-grid{grid-template-columns:1fr 1fr;} .realtime-stats{grid-template-columns:1fr 1fr;} }

/* === Page : cabinet-disponibilite  (pages/cabinet/disponibilite.html) === */
body:where([data-page="cabinet-disponibilite"]) { margin:0; min-height:100vh; display:grid; place-items:center; background:linear-gradient(160deg,#1a1228 0%,#2a1840 50%,#1a1228 100%); font-family:var(--font-body, 'DM Sans', sans-serif); color:#e8dff5; }
:where(body[data-page="cabinet-disponibilite"]) .card { width:min(92vw,560px); background:rgba(255,255,255,.06); border:1px solid rgba(155,126,200,.2); border-radius:28px; padding:32px; box-shadow:0 24px 60px rgba(0,0,0,.28); text-align:center; backdrop-filter:blur(16px); }
:where(body[data-page="cabinet-disponibilite"]) h1 { margin:0 0 10px; font-size:1.5rem; }
:where(body[data-page="cabinet-disponibilite"]) p { margin:0 0 16px; color:rgba(232,223,245,.78); line-height:1.7; }
:where(body[data-page="cabinet-disponibilite"]) a { color:#e8dff5; }
:where(body[data-page="cabinet-disponibilite"]) .btn { display:inline-flex; align-items:center; justify-content:center; padding:12px 18px; border-radius:999px; text-decoration:none; background:rgba(155,126,200,.2); border:1px solid rgba(155,126,200,.35); }

/* === Page : cabinet-emails  (pages/cabinet/emails.html) === */
:where(body[data-page="cabinet-emails"]) .dash-topbar { position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
:where(body[data-page="cabinet-emails"]) .dash-topbar h1 { font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body); }
:where(body[data-page="cabinet-emails"]) .dash-content { padding:32px;max-width:1000px; }
:where(body[data-page="cabinet-emails"]) #viewNormal { display:block; }
:where(body[data-page="cabinet-emails"]) #viewConsultation { display:none; }
:where(body[data-page="cabinet-emails"]) .stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px; }
:where(body[data-page="cabinet-emails"]) .stat-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s; }
:where(body[data-page="cabinet-emails"]) .stat-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-emails"]) .stat-card .stat-icon { font-size:1.2rem;margin-bottom:10px;display:block; }
:where(body[data-page="cabinet-emails"]) .stat-card .stat-val { font-family:var(--font-display);font-size:1.8rem;font-weight:600;color:#3d2e4a;display:block;line-height:1;margin-bottom:4px; }
:where(body[data-page="cabinet-emails"]) .stat-card .stat-lbl { font-size:.76rem;color:var(--text-soft); }
:where(body[data-page="cabinet-emails"]) .dash-block { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);margin-bottom:20px; }
:where(body[data-page="cabinet-emails"]) .dash-block-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-emails"]) .dash-block-header h3 { font-size:.97rem; }
:where(body[data-page="cabinet-emails"]) .dash-block-header a { font-size:.78rem;color:var(--lavender-deep);text-decoration:underline;text-underline-offset:3px; }
:where(body[data-page="cabinet-emails"]) .pending-list { display:flex;flex-direction:column;gap:10px; }
:where(body[data-page="cabinet-emails"]) .pending-item { display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--bg-soft);border-radius:var(--radius-md);border:1px solid var(--line);transition:border-color .2s; }
:where(body[data-page="cabinet-emails"]) .pending-item:hover { border-color:rgba(180,155,210,.25); }
:where(body[data-page="cabinet-emails"]) .pending-avatar { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.6),rgba(237,215,176,.6));display:grid;place-items:center;font-family:var(--font-display);font-size:1rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-emails"]) .pending-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-emails"]) .pending-info strong { display:block;font-size:.85rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-emails"]) .pending-info span { font-size:.75rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-emails"]) .pending-badge { font-size:.72rem;padding:4px 10px;border-radius:999px;background:rgba(237,215,176,.5);color:#7a5a20;font-weight:500;white-space:nowrap; }
:where(body[data-page="cabinet-emails"]) .pending-badge.urgent { background:rgba(238,215,215,.7);color:#7a3535; }
:where(body[data-page="cabinet-emails"]) .btn-repondre { padding:7px 14px;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;font-family:var(--font-body);font-size:.76rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-emails"]) .btn-repondre:hover { transform:translateY(-1px);box-shadow:0 4px 12px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-emails"]) .consult-row { display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-emails"]) .consult-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-emails"]) .consult-row .c-avatar { width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:.9rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-emails"]) .consult-row .c-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-emails"]) .consult-row .c-info strong { display:block;font-size:.84rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-emails"]) .consult-row .c-info span { font-size:.74rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-emails"]) .consult-row .c-amount { font-weight:500;color:var(--text);flex-shrink:0; }
:where(body[data-page="cabinet-emails"]) .badge-mode { font-size:.68rem;padding:2px 8px;border-radius:999px;margin-left:6px; }
:where(body[data-page="cabinet-emails"]) .badge-chat { background:rgba(210,238,210,.6);color:#3a6040; }
:where(body[data-page="cabinet-emails"]) .badge-tel { background:rgba(210,225,238,.6);color:#3a5070; }
:where(body[data-page="cabinet-emails"]) .badge-email { background:rgba(237,215,176,.5);color:#7a5a20; }
:where(body[data-page="cabinet-emails"]) .avis-row { padding:12px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-emails"]) .avis-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-emails"]) .avis-stars { color:var(--gold);font-size:.78rem;letter-spacing:1px;margin-bottom:4px; }
:where(body[data-page="cabinet-emails"]) .avis-text { color:var(--text-soft);line-height:1.6;font-style:italic; }
:where(body[data-page="cabinet-emails"]) .avis-meta { font-size:.73rem;color:var(--text-xsoft);margin-top:4px; }
:where(body[data-page="cabinet-emails"]) .revenus-bar-wrap { display:flex;flex-direction:column;gap:8px;margin-top:8px; }
:where(body[data-page="cabinet-emails"]) .revenu-day { display:flex;align-items:center;gap:10px;font-size:.78rem; }
:where(body[data-page="cabinet-emails"]) .revenu-day .day { color:var(--text-soft);min-width:28px; }
:where(body[data-page="cabinet-emails"]) .revenu-bar-bg { flex:1;height:8px;background:var(--bg-soft);border-radius:4px;overflow:hidden; }
:where(body[data-page="cabinet-emails"]) .revenu-bar-fill { height:100%;border-radius:4px;background:linear-gradient(90deg,#c4aee0,#e8d0a8);transition:width .6s ease; }
:where(body[data-page="cabinet-emails"]) .revenu-day .amount { color:var(--text);font-weight:500;min-width:48px;text-align:right; }
:where(body[data-page="cabinet-emails"]) .consult-active-view {
      background: linear-gradient(160deg,#1a1228 0%,#2a1840 100%);
      border-radius:var(--radius-xl);
      padding:24px;
      color:#e8dff5;
      margin-bottom:20px;
      position:relative;
      overflow:hidden;
    }
:where(body[data-page="cabinet-emails"]) .consult-active-view::before { content:'';position:absolute;top:-60px;right:-60px;width:260px;height:260px;background:radial-gradient(circle,rgba(155,126,200,.2),transparent 70%);border-radius:50%;pointer-events:none; }
:where(body[data-page="cabinet-emails"]) .active-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:16px; }
:where(body[data-page="cabinet-emails"]) .active-title { font-family:var(--font-display);font-size:1.2rem;color:#e8dff5; }
:where(body[data-page="cabinet-emails"]) .active-mode-badge { display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:rgba(155,126,200,.2);border:1px solid rgba(155,126,200,.3);border-radius:999px;font-size:.78rem;color:rgba(200,180,230,.9); }
:where(body[data-page="cabinet-emails"]) .live-dot { width:7px;height:7px;background:#72b872;border-radius:50%;animation:pulseDot 1.5s ease-in-out infinite;flex-shrink:0; }
:where(body[data-page="cabinet-emails"]) .client-info-row { display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:14px;background:rgba(255,255,255,.05);border-radius:14px;border:1px solid rgba(155,126,200,.15); }
:where(body[data-page="cabinet-emails"]) .client-avatar { width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1.3rem;color:#7a5c8a;flex-shrink:0; }
:where(body[data-page="cabinet-emails"]) .client-detail strong { display:block;font-size:1rem;color:#e8dff5;margin-bottom:3px; }
:where(body[data-page="cabinet-emails"]) .client-detail span { font-size:.8rem;color:rgba(200,180,230,.6); }
:where(body[data-page="cabinet-emails"]) .realtime-stats { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px; }
:where(body[data-page="cabinet-emails"]) .rt-stat { background:rgba(255,255,255,.05);border:1px solid rgba(155,126,200,.15);border-radius:12px;padding:12px;text-align:center; }
:where(body[data-page="cabinet-emails"]) .rt-stat .rt-val { font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#e8dff5;display:block;line-height:1;margin-bottom:3px; }
:where(body[data-page="cabinet-emails"]) .rt-stat .rt-lbl { font-size:.68rem;color:rgba(200,180,230,.5); }
:where(body[data-page="cabinet-emails"]) .rt-stat .rt-val.warn { color:#e8d0a8; }
:where(body[data-page="cabinet-emails"]) .rt-stat .rt-val.danger { color:#f0a0a0; }
:where(body[data-page="cabinet-emails"]) .credits-client-bar { margin-bottom:14px; }
:where(body[data-page="cabinet-emails"]) .credits-client-label { display:flex;justify-content:space-between;font-size:.78rem;color:rgba(200,180,230,.6);margin-bottom:6px; }
:where(body[data-page="cabinet-emails"]) .credits-bar-bg { height:6px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden; }
:where(body[data-page="cabinet-emails"]) .credits-bar-fill { height:100%;border-radius:3px;transition:width .5s ease,background .5s; background:linear-gradient(90deg,#9b7ec8,#c8a860); }
:where(body[data-page="cabinet-emails"]) .credits-bar-fill.warn { background:linear-gradient(90deg,#c8a860,#e89060); }
:where(body[data-page="cabinet-emails"]) .credits-bar-fill.danger { background:#e08080; }
:where(body[data-page="cabinet-emails"]) .consult-chat-shell {
      margin: 14px 0 12px;
      border: 1px solid rgba(155,126,200,.15);
      border-radius: 18px;
      background: rgba(10, 6, 20, .22);
      overflow: hidden;
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-header {
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:12px 16px;
      background: rgba(255,255,255,.04);
      border-bottom:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-header strong {
      font-size:.84rem;
      color:#e8dff5;
      font-weight:500;
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-header span {
      font-size:.72rem;
      color:rgba(200,180,230,.5);
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-messages {
      height: 170px;
      max-height: 24vh;
      min-height: 140px;
      overflow-y: auto;
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      scrollbar-width: thin;
      scrollbar-color: rgba(155,126,200,.2) transparent;
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-messages::-webkit-scrollbar { width:4px; }
:where(body[data-page="cabinet-emails"]) .consult-chat-messages::-webkit-scrollbar-thumb { background:rgba(155,126,200,.25); border-radius:2px; }
:where(body[data-page="cabinet-emails"]) .chat-row {
      display:flex;
      max-width: 82%;
      gap:10px;
      align-items:flex-end;
      animation: chatSlideIn .22s ease;
    }
:where(body[data-page="cabinet-emails"]) .chat-row.from-client { align-self:flex-start; }
:where(body[data-page="cabinet-emails"]) .chat-row.from-voyant { align-self:flex-end; flex-direction:row-reverse; }
:where(body[data-page="cabinet-emails"]) .chat-avatar {
      width:32px;height:32px;border-radius:50%;
      display:grid;place-items:center;
      flex-shrink:0;
      font-family:var(--font-display);
      font-size:.82rem;
      color:#3d2a4e;
      background:linear-gradient(135deg,rgba(210,190,238,.85),rgba(237,215,176,.85));
    }
:where(body[data-page="cabinet-emails"]) .chat-row.from-voyant .chat-avatar {
      color:#e8dff5;
      background:rgba(155,126,200,.32);
    }
:where(body[data-page="cabinet-emails"]) .chat-bubble {
      padding:11px 14px;
      border-radius:16px;
      line-height:1.55;
      font-size:.86rem;
      border:1px solid rgba(155,126,200,.16);
      word-break:break-word;
      white-space:pre-wrap;
    }
:where(body[data-page="cabinet-emails"]) .chat-row.from-client .chat-bubble {
      background:rgba(255,255,255,.07);
      color:#f2edf8;
      border-bottom-left-radius:5px;
    }
:where(body[data-page="cabinet-emails"]) .chat-row.from-voyant .chat-bubble {
      background:linear-gradient(135deg,rgba(155,126,200,.26),rgba(200,168,96,.18));
      color:#fffaf0;
      border-bottom-right-radius:5px;
    }
:where(body[data-page="cabinet-emails"]) .chat-meta {
      margin-top:4px;
      font-size:.66rem;
      color:rgba(200,180,230,.42);
    }
:where(body[data-page="cabinet-emails"]) .chat-system {
      align-self:center;
      padding:6px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.06);
      color:rgba(200,180,230,.58);
      font-size:.72rem;
      border:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-compose {
      padding: 12px 14px;
      border-top:1px solid rgba(155,126,200,.12);
      display:flex;
      gap:10px;
      align-items:flex-end;
      background: rgba(255,255,255,.03);
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-compose textarea {
      flex:1;
      min-height:42px;
      max-height:96px;
      resize:vertical;
      border-radius:14px;
      border:1px solid rgba(155,126,200,.2);
      background:rgba(255,255,255,.06);
      color:#f0eaf8;
      padding:12px 14px;
      outline:none;
      font-family:var(--font-body);
      font-size:.84rem;
      line-height:1.5;
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-compose textarea:focus {
      border-color: rgba(155,126,200,.45);
      box-shadow:0 0 0 3px rgba(155,126,200,.1);
    }
:where(body[data-page="cabinet-emails"]) .consult-chat-compose textarea::placeholder { color:rgba(200,180,230,.34); }
:where(body[data-page="cabinet-emails"]) .btn-send-chat {
      min-width:104px;
      height:42px;
      border:none;
      border-radius:999px;
      background:linear-gradient(135deg,#9b7ec8,#c8a860);
      color:#2c1d38;
      font-family:var(--font-body);
      font-size:.82rem;
      font-weight:600;
      cursor:pointer;
      transition:transform .2s, opacity .2s, box-shadow .2s;
      box-shadow:0 4px 16px rgba(155,126,200,.25);
    }
:where(body[data-page="cabinet-emails"]) .btn-send-chat:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-emails"]) .btn-send-chat:disabled { opacity:.4; cursor:not-allowed; transform:none; box-shadow:none; }
:where(body[data-page="cabinet-emails"]) .consult-actions-bar {
      display:grid;
      grid-template-columns:minmax(0,1fr) 260px;
      gap:14px;
      align-items:end;
      margin-top:12px;
    }
:where(body[data-page="cabinet-emails"]) .session-notes textarea {
      width:100%;padding:10px 12px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(155,126,200,.2);
      border-radius:12px;
      font-family:var(--font-body);font-size:.82rem;
      color:#f0eaf8;outline:none;
      resize:vertical;min-height:58px;max-height:92px;
      transition:border-color .2s;
    }
:where(body[data-page="cabinet-emails"]) .session-notes textarea:focus { border-color:rgba(155,126,200,.45); }
:where(body[data-page="cabinet-emails"]) .session-notes textarea::placeholder { color:rgba(200,180,230,.3); }
:where(body[data-page="cabinet-emails"]) .session-notes label { display:block;font-size:.76rem;color:rgba(200,180,230,.5);margin-bottom:7px;letter-spacing:.03em;text-transform:uppercase; }
:where(body[data-page="cabinet-emails"]) .btn-end-consultation {
      width:100%;padding:12px 16px;border-radius:999px;
      background:rgba(200,80,80,.2);
      border:1px solid rgba(200,80,80,.3);
      color:#f0a0a0;
      font-family:var(--font-body);font-size:.9rem;font-weight:500;
      cursor:pointer;transition:background .2s,border-color .2s;
      margin-top:0;
      align-self:end;
      position:sticky;
      bottom:10px;
      box-shadow:0 8px 24px rgba(0,0,0,.18);
    }
:where(body[data-page="cabinet-emails"]) .btn-end-consultation:hover { background:rgba(200,80,80,.35);border-color:rgba(200,80,80,.5); }
:where(body[data-page="cabinet-emails"]) .client-low-credits {
      display:none;align-items:center;gap:8px;
      padding:10px 14px;border-radius:10px;
      background:rgba(200,120,40,.2);border:1px solid rgba(200,120,40,.3);
      color:#e8c090;font-size:.82rem;margin-bottom:16px;
    }
:where(body[data-page="cabinet-emails"]) .client-low-credits.visible { display:flex; }
:where(body[data-page="cabinet-emails"]) .incoming-requests-block { display:none; margin-bottom:20px; }
:where(body[data-page="cabinet-emails"]) .incoming-requests-block.visible { display:block; }
:where(body[data-page="cabinet-emails"]) .incoming-requests-list { display:flex; flex-direction:column; gap:12px; }
:where(body[data-page="cabinet-emails"]) .incoming-request-card {
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:14px;
      align-items:center;
      padding:16px 18px;
      border-radius:16px;
      background:linear-gradient(135deg,rgba(155,126,200,.16),rgba(232,208,168,.14));
      border:1px solid rgba(155,126,200,.2);
      box-shadow:var(--shadow-sm);
    }
:where(body[data-page="cabinet-emails"]) .incoming-request-main strong { display:block; font-size:.96rem; color:var(--text); margin-bottom:4px; }
:where(body[data-page="cabinet-emails"]) .incoming-request-meta { display:flex; flex-wrap:wrap; gap:8px; font-size:.76rem; color:var(--text-soft); }
:where(body[data-page="cabinet-emails"]) .incoming-pill {
      display:inline-flex; align-items:center; gap:6px;
      padding:5px 10px; border-radius:999px;
      background:rgba(255,255,255,.55); border:1px solid rgba(155,126,200,.12);
      color:#5a446e; font-weight:500;
    }
:where(body[data-page="cabinet-emails"]) .incoming-request-actions { display:flex; gap:10px; align-items:center; }
:where(body[data-page="cabinet-emails"]) .btn-accept-request, :where(body[data-page="cabinet-emails"]) .btn-reject-request {
      border:none; border-radius:999px; padding:10px 16px; cursor:pointer;
      font-family:var(--font-body); font-size:.78rem; font-weight:600;
      transition:transform .18s ease, opacity .18s ease, box-shadow .18s ease;
      white-space:nowrap;
    }
:where(body[data-page="cabinet-emails"]) .btn-accept-request { background:linear-gradient(135deg,#c4aee0,#e8d0a8); color:#3d2a4e; box-shadow:0 6px 18px rgba(155,126,200,.18); }
:where(body[data-page="cabinet-emails"]) .btn-reject-request { background:rgba(200,80,80,.12); color:#9c4d4d; border:1px solid rgba(200,80,80,.2); }
:where(body[data-page="cabinet-emails"]) .btn-accept-request:hover, :where(body[data-page="cabinet-emails"]) .btn-reject-request:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-emails"]) .dashboard-toast-stack {
      position:fixed; top:18px; right:18px; z-index:120;
      display:flex; flex-direction:column; gap:10px; pointer-events:none;
    }
:where(body[data-page="cabinet-emails"]) .dashboard-toast {
      min-width:280px; max-width:360px; padding:14px 16px;
      border-radius:16px; color:#f7f1fb;
      background:rgba(28,19,43,.95); border:1px solid rgba(155,126,200,.24);
      box-shadow:0 20px 40px rgba(0,0,0,.22);
      opacity:0; transform:translateY(-8px);
      animation:toastIn .24s ease forwards;
    }
:where(body[data-page="cabinet-emails"]) .dashboard-toast strong { display:block; font-size:.84rem; margin-bottom:4px; color:#fff; }
:where(body[data-page="cabinet-emails"]) .dashboard-toast span { display:block; font-size:.76rem; color:rgba(232,223,245,.72); line-height:1.45; }
@media(max-width:1024px) { .stats-grid{grid-template-columns:repeat(2,1fr);} .realtime-stats{grid-template-columns:repeat(2,1fr);} }
@media(max-width:900px) {
      .consult-active-view { padding:22px; }
      .consult-chat-messages { height: 210px; max-height: 28vh; }
    }
@media(max-width:768px) {
      .dashboard-layout{grid-template-columns:1fr;}
      
      
      .dash-content{padding:20px 16px;}
      .dash-topbar{padding:0 16px;}
    }
@media(max-width:480px) { .stats-grid{grid-template-columns:1fr 1fr;} .realtime-stats{grid-template-columns:1fr 1fr;} }
:where(body[data-page="cabinet-emails"]) .emails-header-stats { display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:24px; }
:where(body[data-page="cabinet-emails"]) .email-stat-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 20px;box-shadow:var(--shadow-sm);text-align:center; }
:where(body[data-page="cabinet-emails"]) .email-stat-card .stat-val { font-family:var(--font-display);font-size:2rem;font-weight:600;color:#3d2e4a;display:block; }
:where(body[data-page="cabinet-emails"]) .email-stat-card .stat-lbl { font-size:.78rem;color:var(--text-soft);margin-top:4px; }
:where(body[data-page="cabinet-emails"]) .email-stat-card.urgent .stat-val { color:#c05050; }
:where(body[data-page="cabinet-emails"]) .email-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px 24px;margin-bottom:14px;box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s,border-color .2s; }
:where(body[data-page="cabinet-emails"]) .email-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:rgba(196,174,224,.3); }
:where(body[data-page="cabinet-emails"]) .email-card.urgent-card { border-left:3px solid #c05050; }
:where(body[data-page="cabinet-emails"]) .email-card-top { display:flex;align-items:flex-start;gap:14px;margin-bottom:14px; }
:where(body[data-page="cabinet-emails"]) .email-avatar { width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1.2rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-emails"]) .email-meta { flex:1;min-width:0; }
:where(body[data-page="cabinet-emails"]) .email-meta strong { display:block;font-size:.95rem;color:var(--text);margin-bottom:3px; }
:where(body[data-page="cabinet-emails"]) .email-meta-row { display:flex;align-items:center;gap:10px;flex-wrap:wrap; }
:where(body[data-page="cabinet-emails"]) .email-chip { display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;font-size:.72rem;font-weight:500; }
:where(body[data-page="cabinet-emails"]) .email-chip.questions { background:rgba(196,174,224,.2);color:#5a3d70; }
:where(body[data-page="cabinet-emails"]) .email-chip.montant { background:rgba(237,215,176,.3);color:#7a5a20; }
:where(body[data-page="cabinet-emails"]) .email-chip.date { background:var(--bg-soft);color:var(--text-soft); }
:where(body[data-page="cabinet-emails"]) .email-chip.urgent { background:rgba(238,210,210,.6);color:#7a3535; }
:where(body[data-page="cabinet-emails"]) .email-chip.ok { background:rgba(210,238,210,.5);color:#3a6040; }
:where(body[data-page="cabinet-emails"]) .email-deadline { margin-left:auto;text-align:right;flex-shrink:0; }
:where(body[data-page="cabinet-emails"]) .email-deadline .deadline-time { font-family:var(--font-display);font-size:1.1rem;font-weight:600; }
:where(body[data-page="cabinet-emails"]) .email-deadline .deadline-time.urgent { color:#c05050; }
:where(body[data-page="cabinet-emails"]) .email-deadline .deadline-time.ok { color:#4a8050; }
:where(body[data-page="cabinet-emails"]) .email-deadline small { display:block;font-size:.72rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-emails"]) .email-questions-preview { display:flex;flex-direction:column;gap:6px;margin-bottom:14px; }
:where(body[data-page="cabinet-emails"]) .email-q-item { display:flex;gap:8px;align-items:flex-start;font-size:.84rem; }
:where(body[data-page="cabinet-emails"]) .email-q-num { color:var(--lavender-deep);font-weight:500;flex-shrink:0;min-width:20px; }
:where(body[data-page="cabinet-emails"]) .email-q-text { color:var(--text-soft);line-height:1.5; }
:where(body[data-page="cabinet-emails"]) .email-actions { display:flex;gap:10px;justify-content:flex-end; }
:where(body[data-page="cabinet-emails"]) .btn-voir-email { padding:9px 18px;border-radius:999px;border:1px solid var(--line);background:var(--surface);font-family:var(--font-body);font-size:.82rem;color:var(--text-soft);cursor:pointer;transition:all .2s; }
:where(body[data-page="cabinet-emails"]) .btn-voir-email:hover { background:var(--bg-soft);color:var(--text); }
:where(body[data-page="cabinet-emails"]) .btn-repondre-email { padding:9px 20px;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;font-family:var(--font-body);font-size:.82rem;font-weight:500;cursor:pointer;transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-emails"]) .btn-repondre-email:hover { transform:translateY(-1px);box-shadow:0 6px 16px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-emails"]) .section-title { font-family:var(--font-display);font-size:1.1rem;font-weight:500;color:#3d2e4a;margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between; }
:where(body[data-page="cabinet-emails"]) .section-title a { font-family:var(--font-body);font-size:.8rem;color:var(--lavender-deep); }
:where(body[data-page="cabinet-emails"]) .empty-emails { text-align:center;padding:48px 24px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm); }
:where(body[data-page="cabinet-emails"]) .empty-emails .empty-icon { font-size:2.5rem;margin-bottom:12px; }
:where(body[data-page="cabinet-emails"]) .empty-emails h3 { font-size:1.1rem;margin-bottom:8px; }
:where(body[data-page="cabinet-emails"]) .empty-emails p { font-size:.86rem;color:var(--text-soft);max-width:36ch;margin:0 auto; }
:where(body[data-page="cabinet-emails"]) .loading-skeleton { background:linear-gradient(90deg,var(--bg-soft) 25%,#fff 50%,var(--bg-soft) 75%);background-size:200% 100%;animation:_cabinet_emails__shimmer 1.4s infinite;border-radius:var(--radius-lg);height:120px;margin-bottom:14px; }

/* === Page : cabinet-historique  (pages/cabinet/historique.html) === */
:where(body[data-page="cabinet-historique"]) .dash-topbar { position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
:where(body[data-page="cabinet-historique"]) .dash-topbar h1 { font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body); }
:where(body[data-page="cabinet-historique"]) .dash-content { padding:32px;max-width:1000px; }
:where(body[data-page="cabinet-historique"]) #viewNormal { display:block; }
:where(body[data-page="cabinet-historique"]) #viewConsultation { display:none; }
:where(body[data-page="cabinet-historique"]) .stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px; }
:where(body[data-page="cabinet-historique"]) .stat-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s; }
:where(body[data-page="cabinet-historique"]) .stat-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-historique"]) .stat-card .stat-icon { font-size:1.2rem;margin-bottom:10px;display:block; }
:where(body[data-page="cabinet-historique"]) .stat-card .stat-val { font-family:var(--font-display);font-size:1.8rem;font-weight:600;color:#3d2e4a;display:block;line-height:1;margin-bottom:4px; }
:where(body[data-page="cabinet-historique"]) .stat-card .stat-lbl { font-size:.76rem;color:var(--text-soft); }
:where(body[data-page="cabinet-historique"]) .dash-block { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);margin-bottom:20px; }
:where(body[data-page="cabinet-historique"]) .dash-block-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-historique"]) .dash-block-header h3 { font-size:.97rem; }
:where(body[data-page="cabinet-historique"]) .dash-block-header a { font-size:.78rem;color:var(--lavender-deep);text-decoration:underline;text-underline-offset:3px; }
:where(body[data-page="cabinet-historique"]) .pending-list { display:flex;flex-direction:column;gap:10px; }
:where(body[data-page="cabinet-historique"]) .pending-item { display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--bg-soft);border-radius:var(--radius-md);border:1px solid var(--line);transition:border-color .2s; }
:where(body[data-page="cabinet-historique"]) .pending-item:hover { border-color:rgba(180,155,210,.25); }
:where(body[data-page="cabinet-historique"]) .pending-avatar { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.6),rgba(237,215,176,.6));display:grid;place-items:center;font-family:var(--font-display);font-size:1rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-historique"]) .pending-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-historique"]) .pending-info strong { display:block;font-size:.85rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-historique"]) .pending-info span { font-size:.75rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-historique"]) .pending-badge { font-size:.72rem;padding:4px 10px;border-radius:999px;background:rgba(237,215,176,.5);color:#7a5a20;font-weight:500;white-space:nowrap; }
:where(body[data-page="cabinet-historique"]) .pending-badge.urgent { background:rgba(238,215,215,.7);color:#7a3535; }
:where(body[data-page="cabinet-historique"]) .btn-repondre { padding:7px 14px;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;font-family:var(--font-body);font-size:.76rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-historique"]) .btn-repondre:hover { transform:translateY(-1px);box-shadow:0 4px 12px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-historique"]) .consult-row { display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-historique"]) .consult-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-historique"]) .consult-row .c-avatar { width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:.9rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-historique"]) .consult-row .c-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-historique"]) .consult-row .c-info strong { display:block;font-size:.84rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-historique"]) .consult-row .c-info span { font-size:.74rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-historique"]) .consult-row .c-amount { font-weight:500;color:var(--text);flex-shrink:0; }
:where(body[data-page="cabinet-historique"]) .badge-mode { font-size:.68rem;padding:2px 8px;border-radius:999px;margin-left:6px; }
:where(body[data-page="cabinet-historique"]) .badge-chat { background:rgba(210,238,210,.6);color:#3a6040; }
:where(body[data-page="cabinet-historique"]) .badge-tel { background:rgba(210,225,238,.6);color:#3a5070; }
:where(body[data-page="cabinet-historique"]) .badge-email { background:rgba(237,215,176,.5);color:#7a5a20; }
:where(body[data-page="cabinet-historique"]) .avis-row { padding:12px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-historique"]) .avis-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-historique"]) .avis-stars { color:var(--gold);font-size:.78rem;letter-spacing:1px;margin-bottom:4px; }
:where(body[data-page="cabinet-historique"]) .avis-text { color:var(--text-soft);line-height:1.6;font-style:italic; }
:where(body[data-page="cabinet-historique"]) .avis-meta { font-size:.73rem;color:var(--text-xsoft);margin-top:4px; }
:where(body[data-page="cabinet-historique"]) .revenus-bar-wrap { display:flex;flex-direction:column;gap:8px;margin-top:8px; }
:where(body[data-page="cabinet-historique"]) .revenu-day { display:flex;align-items:center;gap:10px;font-size:.78rem; }
:where(body[data-page="cabinet-historique"]) .revenu-day .day { color:var(--text-soft);min-width:28px; }
:where(body[data-page="cabinet-historique"]) .revenu-bar-bg { flex:1;height:8px;background:var(--bg-soft);border-radius:4px;overflow:hidden; }
:where(body[data-page="cabinet-historique"]) .revenu-bar-fill { height:100%;border-radius:4px;background:linear-gradient(90deg,#c4aee0,#e8d0a8);transition:width .6s ease; }
:where(body[data-page="cabinet-historique"]) .revenu-day .amount { color:var(--text);font-weight:500;min-width:48px;text-align:right; }
:where(body[data-page="cabinet-historique"]) .consult-active-view {
      background: linear-gradient(160deg,#1a1228 0%,#2a1840 100%);
      border-radius:var(--radius-xl);
      padding:24px;
      color:#e8dff5;
      margin-bottom:20px;
      position:relative;
      overflow:hidden;
    }
:where(body[data-page="cabinet-historique"]) .consult-active-view::before { content:'';position:absolute;top:-60px;right:-60px;width:260px;height:260px;background:radial-gradient(circle,rgba(155,126,200,.2),transparent 70%);border-radius:50%;pointer-events:none; }
:where(body[data-page="cabinet-historique"]) .active-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:16px; }
:where(body[data-page="cabinet-historique"]) .active-title { font-family:var(--font-display);font-size:1.2rem;color:#e8dff5; }
:where(body[data-page="cabinet-historique"]) .active-mode-badge { display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:rgba(155,126,200,.2);border:1px solid rgba(155,126,200,.3);border-radius:999px;font-size:.78rem;color:rgba(200,180,230,.9); }
:where(body[data-page="cabinet-historique"]) .live-dot { width:7px;height:7px;background:#72b872;border-radius:50%;animation:pulseDot 1.5s ease-in-out infinite;flex-shrink:0; }
:where(body[data-page="cabinet-historique"]) .client-info-row { display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:14px;background:rgba(255,255,255,.05);border-radius:14px;border:1px solid rgba(155,126,200,.15); }
:where(body[data-page="cabinet-historique"]) .client-avatar { width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1.3rem;color:#7a5c8a;flex-shrink:0; }
:where(body[data-page="cabinet-historique"]) .client-detail strong { display:block;font-size:1rem;color:#e8dff5;margin-bottom:3px; }
:where(body[data-page="cabinet-historique"]) .client-detail span { font-size:.8rem;color:rgba(200,180,230,.6); }
:where(body[data-page="cabinet-historique"]) .realtime-stats { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px; }
:where(body[data-page="cabinet-historique"]) .rt-stat { background:rgba(255,255,255,.05);border:1px solid rgba(155,126,200,.15);border-radius:12px;padding:12px;text-align:center; }
:where(body[data-page="cabinet-historique"]) .rt-stat .rt-val { font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#e8dff5;display:block;line-height:1;margin-bottom:3px; }
:where(body[data-page="cabinet-historique"]) .rt-stat .rt-lbl { font-size:.68rem;color:rgba(200,180,230,.5); }
:where(body[data-page="cabinet-historique"]) .rt-stat .rt-val.warn { color:#e8d0a8; }
:where(body[data-page="cabinet-historique"]) .rt-stat .rt-val.danger { color:#f0a0a0; }
:where(body[data-page="cabinet-historique"]) .credits-client-bar { margin-bottom:14px; }
:where(body[data-page="cabinet-historique"]) .credits-client-label { display:flex;justify-content:space-between;font-size:.78rem;color:rgba(200,180,230,.6);margin-bottom:6px; }
:where(body[data-page="cabinet-historique"]) .credits-bar-bg { height:6px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden; }
:where(body[data-page="cabinet-historique"]) .credits-bar-fill { height:100%;border-radius:3px;transition:width .5s ease,background .5s; background:linear-gradient(90deg,#9b7ec8,#c8a860); }
:where(body[data-page="cabinet-historique"]) .credits-bar-fill.warn { background:linear-gradient(90deg,#c8a860,#e89060); }
:where(body[data-page="cabinet-historique"]) .credits-bar-fill.danger { background:#e08080; }
:where(body[data-page="cabinet-historique"]) .consult-chat-shell {
      margin: 14px 0 12px;
      border: 1px solid rgba(155,126,200,.15);
      border-radius: 18px;
      background: rgba(10, 6, 20, .22);
      overflow: hidden;
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-header {
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:12px 16px;
      background: rgba(255,255,255,.04);
      border-bottom:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-header strong {
      font-size:.84rem;
      color:#e8dff5;
      font-weight:500;
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-header span {
      font-size:.72rem;
      color:rgba(200,180,230,.5);
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-messages {
      height: 170px;
      max-height: 24vh;
      min-height: 140px;
      overflow-y: auto;
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      scrollbar-width: thin;
      scrollbar-color: rgba(155,126,200,.2) transparent;
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-messages::-webkit-scrollbar { width:4px; }
:where(body[data-page="cabinet-historique"]) .consult-chat-messages::-webkit-scrollbar-thumb { background:rgba(155,126,200,.25); border-radius:2px; }
:where(body[data-page="cabinet-historique"]) .chat-row {
      display:flex;
      max-width: 82%;
      gap:10px;
      align-items:flex-end;
      animation: chatSlideIn .22s ease;
    }
:where(body[data-page="cabinet-historique"]) .chat-row.from-client { align-self:flex-start; }
:where(body[data-page="cabinet-historique"]) .chat-row.from-voyant { align-self:flex-end; flex-direction:row-reverse; }
:where(body[data-page="cabinet-historique"]) .chat-avatar {
      width:32px;height:32px;border-radius:50%;
      display:grid;place-items:center;
      flex-shrink:0;
      font-family:var(--font-display);
      font-size:.82rem;
      color:#3d2a4e;
      background:linear-gradient(135deg,rgba(210,190,238,.85),rgba(237,215,176,.85));
    }
:where(body[data-page="cabinet-historique"]) .chat-row.from-voyant .chat-avatar {
      color:#e8dff5;
      background:rgba(155,126,200,.32);
    }
:where(body[data-page="cabinet-historique"]) .chat-bubble {
      padding:11px 14px;
      border-radius:16px;
      line-height:1.55;
      font-size:.86rem;
      border:1px solid rgba(155,126,200,.16);
      word-break:break-word;
      white-space:pre-wrap;
    }
:where(body[data-page="cabinet-historique"]) .chat-row.from-client .chat-bubble {
      background:rgba(255,255,255,.07);
      color:#f2edf8;
      border-bottom-left-radius:5px;
    }
:where(body[data-page="cabinet-historique"]) .chat-row.from-voyant .chat-bubble {
      background:linear-gradient(135deg,rgba(155,126,200,.26),rgba(200,168,96,.18));
      color:#fffaf0;
      border-bottom-right-radius:5px;
    }
:where(body[data-page="cabinet-historique"]) .chat-meta {
      margin-top:4px;
      font-size:.66rem;
      color:rgba(200,180,230,.42);
    }
:where(body[data-page="cabinet-historique"]) .chat-system {
      align-self:center;
      padding:6px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.06);
      color:rgba(200,180,230,.58);
      font-size:.72rem;
      border:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-compose {
      padding: 12px 14px;
      border-top:1px solid rgba(155,126,200,.12);
      display:flex;
      gap:10px;
      align-items:flex-end;
      background: rgba(255,255,255,.03);
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-compose textarea {
      flex:1;
      min-height:42px;
      max-height:96px;
      resize:vertical;
      border-radius:14px;
      border:1px solid rgba(155,126,200,.2);
      background:rgba(255,255,255,.06);
      color:#f0eaf8;
      padding:12px 14px;
      outline:none;
      font-family:var(--font-body);
      font-size:.84rem;
      line-height:1.5;
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-compose textarea:focus {
      border-color: rgba(155,126,200,.45);
      box-shadow:0 0 0 3px rgba(155,126,200,.1);
    }
:where(body[data-page="cabinet-historique"]) .consult-chat-compose textarea::placeholder { color:rgba(200,180,230,.34); }
:where(body[data-page="cabinet-historique"]) .btn-send-chat {
      min-width:104px;
      height:42px;
      border:none;
      border-radius:999px;
      background:linear-gradient(135deg,#9b7ec8,#c8a860);
      color:#2c1d38;
      font-family:var(--font-body);
      font-size:.82rem;
      font-weight:600;
      cursor:pointer;
      transition:transform .2s, opacity .2s, box-shadow .2s;
      box-shadow:0 4px 16px rgba(155,126,200,.25);
    }
:where(body[data-page="cabinet-historique"]) .btn-send-chat:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-historique"]) .btn-send-chat:disabled { opacity:.4; cursor:not-allowed; transform:none; box-shadow:none; }
:where(body[data-page="cabinet-historique"]) .consult-actions-bar {
      display:grid;
      grid-template-columns:minmax(0,1fr) 260px;
      gap:14px;
      align-items:end;
      margin-top:12px;
    }
:where(body[data-page="cabinet-historique"]) .session-notes textarea {
      width:100%;padding:10px 12px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(155,126,200,.2);
      border-radius:12px;
      font-family:var(--font-body);font-size:.82rem;
      color:#f0eaf8;outline:none;
      resize:vertical;min-height:58px;max-height:92px;
      transition:border-color .2s;
    }
:where(body[data-page="cabinet-historique"]) .session-notes textarea:focus { border-color:rgba(155,126,200,.45); }
:where(body[data-page="cabinet-historique"]) .session-notes textarea::placeholder { color:rgba(200,180,230,.3); }
:where(body[data-page="cabinet-historique"]) .session-notes label { display:block;font-size:.76rem;color:rgba(200,180,230,.5);margin-bottom:7px;letter-spacing:.03em;text-transform:uppercase; }
:where(body[data-page="cabinet-historique"]) .btn-end-consultation {
      width:100%;padding:12px 16px;border-radius:999px;
      background:rgba(200,80,80,.2);
      border:1px solid rgba(200,80,80,.3);
      color:#f0a0a0;
      font-family:var(--font-body);font-size:.9rem;font-weight:500;
      cursor:pointer;transition:background .2s,border-color .2s;
      margin-top:0;
      align-self:end;
      position:sticky;
      bottom:10px;
      box-shadow:0 8px 24px rgba(0,0,0,.18);
    }
:where(body[data-page="cabinet-historique"]) .btn-end-consultation:hover { background:rgba(200,80,80,.35);border-color:rgba(200,80,80,.5); }
:where(body[data-page="cabinet-historique"]) .client-low-credits {
      display:none;align-items:center;gap:8px;
      padding:10px 14px;border-radius:10px;
      background:rgba(200,120,40,.2);border:1px solid rgba(200,120,40,.3);
      color:#e8c090;font-size:.82rem;margin-bottom:16px;
    }
:where(body[data-page="cabinet-historique"]) .client-low-credits.visible { display:flex; }
:where(body[data-page="cabinet-historique"]) .incoming-requests-block { display:none; margin-bottom:20px; }
:where(body[data-page="cabinet-historique"]) .incoming-requests-block.visible { display:block; }
:where(body[data-page="cabinet-historique"]) .incoming-requests-list { display:flex; flex-direction:column; gap:12px; }
:where(body[data-page="cabinet-historique"]) .incoming-request-card {
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:14px;
      align-items:center;
      padding:16px 18px;
      border-radius:16px;
      background:linear-gradient(135deg,rgba(155,126,200,.16),rgba(232,208,168,.14));
      border:1px solid rgba(155,126,200,.2);
      box-shadow:var(--shadow-sm);
    }
:where(body[data-page="cabinet-historique"]) .incoming-request-main strong { display:block; font-size:.96rem; color:var(--text); margin-bottom:4px; }
:where(body[data-page="cabinet-historique"]) .incoming-request-meta { display:flex; flex-wrap:wrap; gap:8px; font-size:.76rem; color:var(--text-soft); }
:where(body[data-page="cabinet-historique"]) .incoming-pill {
      display:inline-flex; align-items:center; gap:6px;
      padding:5px 10px; border-radius:999px;
      background:rgba(255,255,255,.55); border:1px solid rgba(155,126,200,.12);
      color:#5a446e; font-weight:500;
    }
:where(body[data-page="cabinet-historique"]) .incoming-request-actions { display:flex; gap:10px; align-items:center; }
:where(body[data-page="cabinet-historique"]) .btn-accept-request, :where(body[data-page="cabinet-historique"]) .btn-reject-request {
      border:none; border-radius:999px; padding:10px 16px; cursor:pointer;
      font-family:var(--font-body); font-size:.78rem; font-weight:600;
      transition:transform .18s ease, opacity .18s ease, box-shadow .18s ease;
      white-space:nowrap;
    }
:where(body[data-page="cabinet-historique"]) .btn-accept-request { background:linear-gradient(135deg,#c4aee0,#e8d0a8); color:#3d2a4e; box-shadow:0 6px 18px rgba(155,126,200,.18); }
:where(body[data-page="cabinet-historique"]) .btn-reject-request { background:rgba(200,80,80,.12); color:#9c4d4d; border:1px solid rgba(200,80,80,.2); }
:where(body[data-page="cabinet-historique"]) .btn-accept-request:hover, :where(body[data-page="cabinet-historique"]) .btn-reject-request:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-historique"]) .dashboard-toast-stack {
      position:fixed; top:18px; right:18px; z-index:120;
      display:flex; flex-direction:column; gap:10px; pointer-events:none;
    }
:where(body[data-page="cabinet-historique"]) .dashboard-toast {
      min-width:280px; max-width:360px; padding:14px 16px;
      border-radius:16px; color:#f7f1fb;
      background:rgba(28,19,43,.95); border:1px solid rgba(155,126,200,.24);
      box-shadow:0 20px 40px rgba(0,0,0,.22);
      opacity:0; transform:translateY(-8px);
      animation:toastIn .24s ease forwards;
    }
:where(body[data-page="cabinet-historique"]) .dashboard-toast strong { display:block; font-size:.84rem; margin-bottom:4px; color:#fff; }
:where(body[data-page="cabinet-historique"]) .dashboard-toast span { display:block; font-size:.76rem; color:rgba(232,223,245,.72); line-height:1.45; }
@media(max-width:1024px) { .stats-grid{grid-template-columns:repeat(2,1fr);} .realtime-stats{grid-template-columns:repeat(2,1fr);} }
@media(max-width:900px) {
      .consult-active-view { padding:22px; }
      .consult-chat-messages { height: 210px; max-height: 28vh; }
    }
@media(max-width:768px) {
      .dashboard-layout{grid-template-columns:1fr;}
      
      
      .dash-content{padding:20px 16px;}
      .dash-topbar{padding:0 16px;}
    }
@media(max-width:480px) { .stats-grid{grid-template-columns:1fr 1fr;} .realtime-stats{grid-template-columns:1fr 1fr;} }
:where(body[data-page="cabinet-historique"]) .filters-bar { display:flex;gap:10px;flex-wrap:wrap;margin-bottom:24px;align-items:center; }
:where(body[data-page="cabinet-historique"]) .filter-btn { padding:8px 16px;border-radius:999px;border:1px solid var(--line);background:var(--surface);font-family:var(--font-body);font-size:.8rem;color:var(--text-soft);cursor:pointer;transition:all .2s; }
:where(body[data-page="cabinet-historique"]) .filter-btn:hover, :where(body[data-page="cabinet-historique"]) .filter-btn.active { background:linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2));color:#5a3d70;border-color:rgba(196,174,224,.4); }
:where(body[data-page="cabinet-historique"]) .filter-select { padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);font-family:var(--font-body);font-size:.8rem;color:var(--text);cursor:pointer;outline:none; }
:where(body[data-page="cabinet-historique"]) .history-table { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm); }
:where(body[data-page="cabinet-historique"]) .history-table-header { display:grid;grid-template-columns:1.5fr 80px 80px 100px 90px 80px;gap:12px;padding:12px 20px;background:var(--bg-soft);border-bottom:1px solid var(--line);font-size:.74rem;font-weight:500;color:var(--text-soft);text-transform:uppercase;letter-spacing:.05em; }
:where(body[data-page="cabinet-historique"]) .history-row { display:grid;grid-template-columns:1.5fr 80px 80px 100px 90px 80px;gap:12px;padding:14px 20px;border-bottom:1px solid var(--line);align-items:center;font-size:.85rem;transition:background .15s; }
:where(body[data-page="cabinet-historique"]) .history-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-historique"]) .history-row:hover { background:var(--bg-soft); }
:where(body[data-page="cabinet-historique"]) .client-cell { display:flex;align-items:center;gap:10px; }
:where(body[data-page="cabinet-historique"]) .client-cell .c-avatar { width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:.85rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-historique"]) .client-cell strong { display:block;font-size:.85rem; }
:where(body[data-page="cabinet-historique"]) .client-cell span { font-size:.74rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-historique"]) .badge-statut { padding:3px 10px;border-radius:999px;font-size:.72rem;font-weight:500; }
:where(body[data-page="cabinet-historique"]) .badge-statut.terminee { background:rgba(210,238,210,.6);color:#3a6040; }
:where(body[data-page="cabinet-historique"]) .badge-statut.annulee { background:rgba(238,215,215,.6);color:#7a3535; }
:where(body[data-page="cabinet-historique"]) .badge-statut.active { background:rgba(196,174,224,.4);color:#5a3d70; }
:where(body[data-page="cabinet-historique"]) .gain-cell { font-weight:600;color:#3d2e4a; }
:where(body[data-page="cabinet-historique"]) .empty-state { text-align:center;padding:48px 24px; }
:where(body[data-page="cabinet-historique"]) .empty-state .empty-icon { font-size:2.5rem;margin-bottom:12px; }
:where(body[data-page="cabinet-historique"]) .empty-state p { color:var(--text-soft);font-size:.88rem; }
:where(body[data-page="cabinet-historique"]) .pagination { display:flex;gap:8px;justify-content:center;margin-top:20px;align-items:center; }
:where(body[data-page="cabinet-historique"]) .page-btn { padding:8px 14px;border-radius:var(--radius-md);border:1px solid var(--line);background:var(--surface);font-family:var(--font-body);font-size:.82rem;color:var(--text-soft);cursor:pointer;transition:all .2s; }
:where(body[data-page="cabinet-historique"]) .page-btn:hover:not(:disabled) { background:var(--bg-soft);color:var(--text); }
:where(body[data-page="cabinet-historique"]) .page-btn:disabled { opacity:.4;cursor:not-allowed; }
:where(body[data-page="cabinet-historique"]) .page-info { font-size:.82rem;color:var(--text-soft); }
@media(max-width:720px) { .history-table-header,.history-row { grid-template-columns:1fr 70px 70px; } .history-table-header span:nth-child(n+4),.history-row span:nth-child(n+4) { display:none; } }

/* === Page : cabinet-login  (pages/cabinet/login.html) === */
body:where([data-page="cabinet-login"]) {
      margin: 0;
      font-family: Arial, sans-serif;
      background: #f7f1f2;
      color: #4b3f55;
    }
:where(body[data-page="cabinet-login"]) .page {
      min-height: 100vh;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 24px;
      box-sizing: border-box;
    }
:where(body[data-page="cabinet-login"]) .card {
      width: 100%;
      max-width: 500px;
      background: #fff;
      border-radius: 28px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
      padding: 36px 32px;
      box-sizing: border-box;
      text-align: center;
    }
:where(body[data-page="cabinet-login"]) .logo-badge {
      width: 72px;
      height: 72px;
      margin: 0 auto 20px;
      border-radius: 50%;
      background: radial-gradient(circle at 30% 30%, #f3e8ff, #d9c2ff);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
    }
:where(body[data-page="cabinet-login"]) h1 {
      margin: 0 0 10px;
      font-size: 38px;
      line-height: 1.1;
      font-family: Georgia, serif;
      font-weight: 500;
      color: #3f2f4c;
    }
:where(body[data-page="cabinet-login"]) .subtitle {
      margin: 0 0 28px;
      font-size: 17px;
      line-height: 1.5;
      color: #6d5f77;
    }
:where(body[data-page="cabinet-login"]) .message {
      display: none;
      margin-bottom: 18px;
      padding: 14px 16px;
      border-radius: 16px;
      font-size: 15px;
      line-height: 1.4;
      text-align: left;
    }
:where(body[data-page="cabinet-login"]) .message.error {
      display: block;
      background: #fbeaea;
      color: #9a3f3f;
      border: 1px solid #f2c9c9;
    }
:where(body[data-page="cabinet-login"]) .message.success {
      display: block;
      background: #ecf8ee;
      color: #2f7a45;
      border: 1px solid #cfe8d5;
    }
:where(body[data-page="cabinet-login"]) .field {
      text-align: left;
      margin-bottom: 18px;
    }
:where(body[data-page="cabinet-login"]) .field label {
      display: block;
      margin-bottom: 8px;
      font-size: 16px;
      font-weight: 600;
      color: #4b3f55;
    }
:where(body[data-page="cabinet-login"]) .input-wrap {
      position: relative;
    }
:where(body[data-page="cabinet-login"]) .field input {
      width: 100%;
      box-sizing: border-box;
      padding: 16px 46px 16px 16px;
      border: 1px solid #e5dbe7;
      border-radius: 18px;
      background: #fcfbfd;
      font-size: 16px;
      color: #3f2f4c;
      outline: none;
      transition: border-color 0.2s ease;
    }
:where(body[data-page="cabinet-login"]) .field input:focus {
      border-color: #c9a8ff;
    }
:where(body[data-page="cabinet-login"]) .toggle-password {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      background: none;
      border: none;
      cursor: pointer;
      font-size: 18px;
      color: #7c6a88;
    }
:where(body[data-page="cabinet-login"]) .btn {
      width: 100%;
      border: none;
      border-radius: 999px;
      padding: 17px 20px;
      font-size: 17px;
      font-weight: 700;
      cursor: pointer;
      color: #4a3556;
      background: linear-gradient(90deg, #d8b8ff 0%, #ecd3a7 100%);
      transition: transform 0.15s ease, opacity 0.15s ease;
    }
:where(body[data-page="cabinet-login"]) .btn:hover {
      transform: translateY(-1px);
    }
:where(body[data-page="cabinet-login"]) .btn:disabled {
      opacity: 0.6;
      cursor: not-allowed;
      transform: none;
    }
:where(body[data-page="cabinet-login"]) .footer-link {
      margin-top: 22px;
      font-size: 15px;
      color: #6d5f77;
    }
:where(body[data-page="cabinet-login"]) .footer-link a, :where(body[data-page="cabinet-login"]) .back-link, :where(body[data-page="cabinet-login"]) .forgot-link {
      color: #7f65c4;
      text-decoration: none;
      font-weight: 600;
    }
:where(body[data-page="cabinet-login"]) .back-link {
      display: inline-block;
      margin-bottom: 22px;
      font-size: 15px;
    }
:where(body[data-page="cabinet-login"]) .forgot-wrap {
      text-align: right;
      margin: -6px 0 20px;
    }
:where(body[data-page="cabinet-login"]) .forgot-link {
      font-size: 14px;
    }
@media (max-width: 560px) {
  :where(body[data-page="cabinet-login"]) .card {
        padding: 28px 20px;
        border-radius: 22px;
      }
  :where(body[data-page="cabinet-login"]) h1 {
        font-size: 32px;
      }
}

/* === Page : cabinet-profil  (pages/cabinet/profil.html) === */
:where(body[data-page="cabinet-profil"]) .dash-topbar { position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
:where(body[data-page="cabinet-profil"]) .dash-topbar h1 { font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body); }
:where(body[data-page="cabinet-profil"]) .dash-content { padding:32px;max-width:860px; }
:where(body[data-page="cabinet-profil"]) .tabs { display:flex;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:5px;margin-bottom:28px;box-shadow:var(--shadow-sm); }
:where(body[data-page="cabinet-profil"]) .tab-btn { flex:1;padding:10px 16px;border:none;border-radius:var(--radius-md);background:none;font-family:var(--font-body);font-size:.84rem;color:var(--text-soft);cursor:pointer;transition:background .2s,color .2s;display:flex;align-items:center;justify-content:center;gap:7px; }
:where(body[data-page="cabinet-profil"]) .tab-btn:hover { background:var(--bg-soft);color:var(--text); }
:where(body[data-page="cabinet-profil"]) .tab-btn.active { background:linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2));color:#5a3d70;font-weight:500; }
:where(body[data-page="cabinet-profil"]) .tab-section { display:none; }
:where(body[data-page="cabinet-profil"]) .tab-section.active { display:block; }
:where(body[data-page="cabinet-profil"]) .profil-block { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow-sm);margin-bottom:20px; }
:where(body[data-page="cabinet-profil"]) .block-header { display:flex;align-items:center;gap:14px;margin-bottom:22px;padding-bottom:16px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-profil"]) .block-icon { width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.4),rgba(237,215,176,.4));display:grid;place-items:center;font-size:1.1rem;flex-shrink:0; }
:where(body[data-page="cabinet-profil"]) .block-header div h3 { font-size:1rem;margin-bottom:3px; }
:where(body[data-page="cabinet-profil"]) .block-header div p { font-size:.8rem;color:var(--text-soft); }
:where(body[data-page="cabinet-profil"]) .avatar-section { display:flex;align-items:center;gap:20px;margin-bottom:22px;padding-bottom:22px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-profil"]) .avatar-big { width:90px;height:90px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.7),rgba(237,215,176,.7));display:grid;place-items:center;font-family:var(--font-display);font-size:2.2rem;font-weight:600;color:#6a4d7a;border:3px solid var(--surface);box-shadow:0 6px 20px rgba(140,110,170,.15);flex-shrink:0;overflow:hidden; }
:where(body[data-page="cabinet-profil"]) .avatar-big img { width:100%;height:100%;object-fit:cover; }
:where(body[data-page="cabinet-profil"]) .avatar-actions { display:flex;flex-direction:column;gap:8px; }
:where(body[data-page="cabinet-profil"]) .avatar-actions small { font-size:.72rem;color:var(--text-xsoft);line-height:1.5; }
:where(body[data-page="cabinet-profil"]) .form-row { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
:where(body[data-page="cabinet-profil"]) .form-group { margin-bottom:16px; }
:where(body[data-page="cabinet-profil"]) label { display:block;font-size:.8rem;font-weight:500;color:var(--text);margin-bottom:7px; }
:where(body[data-page="cabinet-profil"]) .input-wrap { position:relative; }
:where(body[data-page="cabinet-profil"]) .input-icon { position:absolute;left:13px;top:50%;transform:translateY(-50%);font-size:.9rem;color:var(--text-xsoft);pointer-events:none;transition:color .2s; }
:where(body[data-page="cabinet-profil"]) .input-wrap:focus-within .input-icon { color:var(--lavender-deep); }
:where(body[data-page="cabinet-profil"]) input[type=text], :where(body[data-page="cabinet-profil"]) input[type=number], :where(body[data-page="cabinet-profil"]) select, :where(body[data-page="cabinet-profil"]) textarea {
      width:100%;padding:11px 13px 11px 38px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);
      font-family:var(--font-body);font-size:.87rem;color:var(--text);outline:none;transition:border-color .25s,box-shadow .25s;appearance:none;
    }
:where(body[data-page="cabinet-profil"]) textarea { resize:vertical;min-height:100px;padding-top:11px;line-height:1.65; }
:where(body[data-page="cabinet-profil"]) .no-icon input, :where(body[data-page="cabinet-profil"]) .no-icon select, :where(body[data-page="cabinet-profil"]) .no-icon textarea { padding-left:13px; }
:where(body[data-page="cabinet-profil"]) input:focus, :where(body[data-page="cabinet-profil"]) select:focus, :where(body[data-page="cabinet-profil"]) textarea:focus { border-color:rgba(180,155,210,.5);box-shadow:0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="cabinet-profil"]) .select-wrap { position:relative; }
:where(body[data-page="cabinet-profil"]) .select-wrap::after { content:'▾';position:absolute;right:13px;top:50%;transform:translateY(-50%);font-size:.75rem;color:var(--text-xsoft);pointer-events:none; }
:where(body[data-page="cabinet-profil"]) .char-count { text-align:right;font-size:.72rem;color:var(--text-xsoft);margin-top:4px; }
:where(body[data-page="cabinet-profil"]) .specialites-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:4px; }
:where(body[data-page="cabinet-profil"]) .spec-checkbox { display:flex;align-items:center;gap:8px;padding:10px 12px;border:1.5px solid var(--line);border-radius:var(--radius-md);cursor:pointer;transition:all .2s;font-size:.82rem;color:var(--text-soft); }
:where(body[data-page="cabinet-profil"]) .spec-checkbox:hover { border-color:rgba(180,155,210,.35);color:var(--text); }
:where(body[data-page="cabinet-profil"]) .spec-checkbox input { accent-color:var(--lavender-deep);flex-shrink:0; }
:where(body[data-page="cabinet-profil"]) .spec-checkbox.checked { border-color:var(--lavender-deep);background:rgba(196,174,224,.1);color:#5a3d70;font-weight:500; }
:where(body[data-page="cabinet-profil"]) .tarifs-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:14px; }
:where(body[data-page="cabinet-profil"]) .tarif-item { background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius-md);padding:16px; }
:where(body[data-page="cabinet-profil"]) .tarif-item label { font-size:.78rem;color:var(--text-soft);font-weight:500;margin-bottom:8px; display:block; }
:where(body[data-page="cabinet-profil"]) .tarif-item .tarif-suffix { font-size:.75rem;color:var(--text-xsoft);margin-top:4px;display:block; }
:where(body[data-page="cabinet-profil"]) .tarif-item input { padding-left:13px; }
:where(body[data-page="cabinet-profil"]) .tarif-item.disabled { opacity:.55; }
:where(body[data-page="cabinet-profil"]) .tarif-item.disabled input { background:rgba(0,0,0,.03); }
:where(body[data-page="cabinet-profil"]) .modes-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px; }
:where(body[data-page="cabinet-profil"]) .mode-toggle-item { display:flex;align-items:center;justify-content:space-between;padding:14px;border:1.5px solid var(--line);border-radius:var(--radius-md);transition:border-color .2s; }
:where(body[data-page="cabinet-profil"]) .mode-toggle-item.enabled { border-color:rgba(180,155,210,.35);background:rgba(196,174,224,.06); }
:where(body[data-page="cabinet-profil"]) .mode-toggle-label { display:flex;align-items:center;gap:8px;font-size:.84rem;color:var(--text-soft); }
:where(body[data-page="cabinet-profil"]) .mode-toggle-label .mode-icon { font-size:1rem; }
:where(body[data-page="cabinet-profil"]) .toggle-switch { position:relative;width:40px;height:22px;flex-shrink:0; }
:where(body[data-page="cabinet-profil"]) .toggle-switch input { opacity:0;width:0;height:0; }
:where(body[data-page="cabinet-profil"]) .toggle-slider { position:absolute;inset:0;background:var(--line);border-radius:999px;cursor:pointer;transition:background .3s; }
:where(body[data-page="cabinet-profil"]) .toggle-slider::before { content:'';position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .3s;box-shadow:0 2px 4px rgba(0,0,0,.15); }
:where(body[data-page="cabinet-profil"]) .toggle-switch input:checked + .toggle-slider { background:var(--lavender-deep); }
:where(body[data-page="cabinet-profil"]) .toggle-switch input:checked + .toggle-slider::before { transform:translateX(18px); }
:where(body[data-page="cabinet-profil"]) .preview-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm); }
:where(body[data-page="cabinet-profil"]) .preview-banner { height:70px;background:linear-gradient(135deg,#f2e9fc,#e5d0f5);position:relative;overflow:hidden; }
:where(body[data-page="cabinet-profil"]) .preview-banner::before { content:'';position:absolute;top:-30px;right:-30px;width:120px;height:120px;background:radial-gradient(circle,rgba(195,165,228,.5),transparent 70%);border-radius:50%; }
:where(body[data-page="cabinet-profil"]) .preview-avatar-wrap { display:flex;justify-content:center;margin-top:-28px;position:relative;z-index:2;margin-bottom:8px; }
:where(body[data-page="cabinet-profil"]) .preview-avatar { width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#e8d8f5,#f5e5cc);border:3px solid var(--surface);display:grid;place-items:center;font-family:var(--font-display);font-size:1.4rem;color:#7a5c8a;box-shadow:0 4px 14px rgba(140,110,170,.15);overflow:hidden; }
:where(body[data-page="cabinet-profil"]) .preview-avatar img { width:100%;height:100%;object-fit:cover; }
:where(body[data-page="cabinet-profil"]) .preview-body { padding:0 18px 18px;text-align:center; }
:where(body[data-page="cabinet-profil"]) .preview-name { font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:#3d2e4a;margin-bottom:3px; }
:where(body[data-page="cabinet-profil"]) .preview-spec { font-size:.76rem;color:var(--text-soft);margin-bottom:8px; }
:where(body[data-page="cabinet-profil"]) .preview-stars { color:var(--gold);font-size:.76rem;letter-spacing:1px;margin-bottom:10px; }
:where(body[data-page="cabinet-profil"]) .preview-tags { display:flex;flex-wrap:wrap;gap:5px;justify-content:center;margin-bottom:10px; }
:where(body[data-page="cabinet-profil"]) .preview-tag { padding:2px 9px;border-radius:999px;font-size:.7rem;background:rgba(210,190,238,.2);color:#6a4d7a;border:1px solid rgba(180,155,210,.2); }
:where(body[data-page="cabinet-profil"]) .preview-bio { font-size:.78rem;color:var(--text-soft);line-height:1.6;text-align:left;margin-bottom:12px; }
:where(body[data-page="cabinet-profil"]) .preview-footer { display:flex;align-items:center;justify-content:space-between;padding-top:10px;border-top:1px solid var(--line); }
:where(body[data-page="cabinet-profil"]) .preview-price { font-family:var(--font-display);font-size:.95rem;font-weight:600;color:#3d2e4a; }
:where(body[data-page="cabinet-profil"]) .preview-btn { padding:6px 14px;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;font-size:.74rem;font-weight:500;cursor:pointer; }
:where(body[data-page="cabinet-profil"]) .form-alert { padding:11px 15px;border-radius:var(--radius-md);font-size:.84rem;margin-bottom:18px;display:none;line-height:1.55; }
:where(body[data-page="cabinet-profil"]) .form-alert.error { display:block;background:rgba(238,215,215,.7);color:#7a3535;border:1px solid rgba(200,150,150,.3); }
:where(body[data-page="cabinet-profil"]) .form-alert.success { display:block;background:rgba(210,238,210,.7);color:#3a6040;border:1px solid rgba(150,200,150,.3); }
:where(body[data-page="cabinet-profil"]) .form-actions { display:flex;justify-content:flex-end;margin-top:22px;padding-top:18px;border-top:1px solid var(--line);gap:10px; }
:where(body[data-page="cabinet-profil"]) .btn-save { padding:11px 22px;font-size:.86rem;position:relative;overflow:hidden; }
:where(body[data-page="cabinet-profil"]) .btn-save::before { content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.18),transparent);pointer-events:none; }
:where(body[data-page="cabinet-profil"]) .btn-save.loading { pointer-events:none;opacity:.75; }
:where(body[data-page="cabinet-profil"]) .btn-save.loading .btn-text { opacity:0; }
:where(body[data-page="cabinet-profil"]) .btn-save .spinner { display:none;position:absolute;width:15px;height:15px;border:2px solid rgba(60,40,80,.2);border-top-color:#3d2a4e;border-radius:50%;animation:_cabinet_profil__spin .7s linear infinite; }
:where(body[data-page="cabinet-profil"]) .btn-save.loading .spinner { display:block; }
@media(max-width:768px) {
      .dashboard-layout{grid-template-columns:1fr;}
      
      
      .dash-content{padding:20px 16px;}
      .dash-topbar{padding:0 16px;}
      .form-row{grid-template-columns:1fr;}
      .specialites-grid{grid-template-columns:repeat(2,1fr);}
      .tarifs-grid,.modes-grid{grid-template-columns:1fr;}
      .tabs{flex-direction:column;}
    }

/* === Page : cabinet-register-voyant  (pages/cabinet/register-voyant.html) === */
body:where([data-page="cabinet-register-voyant"]) { background: var(--bg); }
:where(body[data-page="cabinet-register-voyant"]) .page-wrapper { min-height:100vh; display:grid; grid-template-columns:1fr 1fr; }
:where(body[data-page="cabinet-register-voyant"]) .panel-left { position:relative; background:linear-gradient(160deg,#2a1c3a 0%,#1e1228 50%,#2a1c3a 100%); display:flex; flex-direction:column; justify-content:center; padding:64px 56px; overflow:hidden; color:#f0e8fa; }
:where(body[data-page="cabinet-register-voyant"]) .panel-left::before { content:''; position:absolute; top:-100px; left:-100px; width:400px; height:400px; background:radial-gradient(circle,rgba(180,140,220,.25) 0%,transparent 70%); border-radius:50%; pointer-events:none; }
:where(body[data-page="cabinet-register-voyant"]) .panel-left::after { content:''; position:absolute; bottom:-80px; right:-60px; width:300px; height:300px; background:radial-gradient(circle,rgba(200,160,100,.18) 0%,transparent 70%); border-radius:50%; pointer-events:none; }
:where(body[data-page="cabinet-register-voyant"]) .panel-left-inner { position:relative; z-index:1; }
:where(body[data-page="cabinet-register-voyant"]) .panel-logo { display:flex; align-items:center; gap:14px; margin-bottom:56px; }
:where(body[data-page="cabinet-register-voyant"]) .panel-logo-icon { width:46px; height:46px; border-radius:50%; background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.3),rgba(180,140,220,.5)); border:1px solid rgba(200,175,230,.25); display:grid; place-items:center; font-size:18px; }
:where(body[data-page="cabinet-register-voyant"]) .panel-logo-text strong { display:block; font-family:var(--font-display); font-size:1rem; font-weight:600; color:#f0e8fa; }
:where(body[data-page="cabinet-register-voyant"]) .panel-logo-text span { font-size:.72rem; color:rgba(220,200,240,.55); letter-spacing:.02em; }
:where(body[data-page="cabinet-register-voyant"]) .panel-heading { font-family:var(--font-display); font-size:clamp(2rem,3vw,2.8rem); font-weight:400; color:#f0e8fa; line-height:1.15; margin-bottom:20px; }
:where(body[data-page="cabinet-register-voyant"]) .panel-heading em { font-style:italic; color:#d4b8f0; }
:where(body[data-page="cabinet-register-voyant"]) .panel-sub { font-size:.88rem; color:rgba(200,185,220,.75); line-height:1.75; max-width:38ch; margin-bottom:48px; }
:where(body[data-page="cabinet-register-voyant"]) .perks { display:flex; flex-direction:column; gap:16px; }
:where(body[data-page="cabinet-register-voyant"]) .perk { display:flex; align-items:flex-start; gap:14px; }
:where(body[data-page="cabinet-register-voyant"]) .perk-icon { width:36px; height:36px; border-radius:50%; background:rgba(180,140,220,.1); border:1px solid rgba(180,140,220,.18); display:grid; place-items:center; font-size:.75rem; flex-shrink:0; font-family:var(--font-display); color:rgba(196,174,224,.65); font-weight:500; }
:where(body[data-page="cabinet-register-voyant"]) .perk-text strong { display:block; font-size:.87rem; color:#e0d0f5; font-weight:500; margin-bottom:2px; }
:where(body[data-page="cabinet-register-voyant"]) .perk-text span { font-size:.80rem; color:rgba(200,185,220,.6); line-height:1.5; }
:where(body[data-page="cabinet-register-voyant"]) .deco-star-1 { position:absolute; top:22%; right:14%; width:5px; height:5px; border-radius:50%; background:var(--gold); animation:starPulse 3s ease-in-out infinite; }
:where(body[data-page="cabinet-register-voyant"]) .deco-star-2 { position:absolute; top:55%; right:22%; width:3px; height:3px; border-radius:50%; background:rgba(180,140,220,.7); animation:starPulse 4s ease-in-out infinite 1s; }
:where(body[data-page="cabinet-register-voyant"]) .deco-star-3 { position:absolute; bottom:28%; left:20%; width:4px; height:4px; border-radius:50%; background:rgba(237,215,176,.8); animation:starPulse 5s ease-in-out infinite .5s; }
:where(body[data-page="cabinet-register-voyant"]) .panel-right { display:flex; flex-direction:column; justify-content:center; padding:56px 60px; overflow-y:auto; }
:where(body[data-page="cabinet-register-voyant"]) .form-header { margin-bottom:36px; }
:where(body[data-page="cabinet-register-voyant"]) .form-header h2 { font-size:1.7rem; font-family:var(--font-display); font-weight:500; color:#3a2d44; margin-bottom:8px; }
:where(body[data-page="cabinet-register-voyant"]) .form-header p { font-size:.87rem; color:var(--text-soft); }
:where(body[data-page="cabinet-register-voyant"]) .form-header a { color:var(--lavender-deep); text-decoration:underline; text-underline-offset:2px; }
:where(body[data-page="cabinet-register-voyant"]) .form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
:where(body[data-page="cabinet-register-voyant"]) .form-grid .full { grid-column:1/-1; }
:where(body[data-page="cabinet-register-voyant"]) .field { display:flex; flex-direction:column; gap:6px; }
:where(body[data-page="cabinet-register-voyant"]) label { font-size:.78rem; font-weight:500; color:var(--text-soft); letter-spacing:.02em; }
:where(body[data-page="cabinet-register-voyant"]) label .req { color:var(--gold); margin-left:2px; }
:where(body[data-page="cabinet-register-voyant"]) input[type="text"], :where(body[data-page="cabinet-register-voyant"]) input[type="email"], :where(body[data-page="cabinet-register-voyant"]) input[type="tel"], :where(body[data-page="cabinet-register-voyant"]) input[type="password"], :where(body[data-page="cabinet-register-voyant"]) select, :where(body[data-page="cabinet-register-voyant"]) textarea {
      width:100%; padding:11px 14px;
      border:1px solid rgba(160,140,185,.2); border-radius:var(--radius-md);
      background:rgba(255,255,255,.7); font-family:var(--font-body); font-size:.88rem; color:var(--text);
      outline:none; transition:border-color .2s,box-shadow .2s,background .2s;
      -webkit-appearance:none; appearance:none;
    }
:where(body[data-page="cabinet-register-voyant"]) input:focus, :where(body[data-page="cabinet-register-voyant"]) select:focus, :where(body[data-page="cabinet-register-voyant"]) textarea:focus { border-color:rgba(155,126,200,.45); box-shadow:0 0 0 3px rgba(155,126,200,.1); background:#fff; }
:where(body[data-page="cabinet-register-voyant"]) input::placeholder, :where(body[data-page="cabinet-register-voyant"]) textarea::placeholder { color:var(--text-xsoft); }
:where(body[data-page="cabinet-register-voyant"]) textarea { resize:vertical; min-height:90px; line-height:1.6; }
:where(body[data-page="cabinet-register-voyant"]) select { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237a6b7c' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; padding-right:38px; cursor:pointer; }
:where(body[data-page="cabinet-register-voyant"]) .tags-wrapper { display:flex; flex-wrap:wrap; gap:8px; }
:where(body[data-page="cabinet-register-voyant"]) .tag-check { display:none; }
:where(body[data-page="cabinet-register-voyant"]) .tag-label { display:inline-flex; align-items:center; gap:6px; padding:6px 13px; border-radius:999px; border:1px solid rgba(160,140,185,.22); background:rgba(255,255,255,.6); font-size:.80rem; color:var(--text-soft); cursor:pointer; transition:border-color .2s,background .2s,color .2s; user-select:none; }
:where(body[data-page="cabinet-register-voyant"]) .tag-check:checked + .tag-label { background:rgba(195,165,228,.25); border-color:rgba(155,126,200,.5); color:#5a3e6e; }
:where(body[data-page="cabinet-register-voyant"]) .upload-zone { border:1.5px dashed rgba(155,126,200,.3); border-radius:var(--radius-md); padding:20px; text-align:center; cursor:pointer; transition:border-color .2s,background .2s; background:rgba(255,255,255,.5); position:relative; }
:where(body[data-page="cabinet-register-voyant"]) .upload-zone:hover { border-color:rgba(155,126,200,.55); background:rgba(210,190,240,.06); }
:where(body[data-page="cabinet-register-voyant"]) .upload-zone input[type="file"] { position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%; padding:0; border:none; background:none; box-shadow:none; }
:where(body[data-page="cabinet-register-voyant"]) .upload-icon { font-size:1.5rem; margin-bottom:6px; }
:where(body[data-page="cabinet-register-voyant"]) .upload-text { font-size:.82rem; color:var(--text-soft); }
:where(body[data-page="cabinet-register-voyant"]) .upload-hint { font-size:.76rem; color:var(--text-xsoft); margin-top:3px; }
:where(body[data-page="cabinet-register-voyant"]) .upload-preview { display:none; width:64px; height:64px; border-radius:50%; object-fit:cover; margin:0 auto 8px; border:2px solid rgba(155,126,200,.3); }
:where(body[data-page="cabinet-register-voyant"]) .upload-preview.visible { display:block; }
:where(body[data-page="cabinet-register-voyant"]) .audio-preview { display:none; width:100%; margin-top:10px; border-radius:var(--radius-sm); accent-color:var(--lavender-deep); }
:where(body[data-page="cabinet-register-voyant"]) .audio-preview.visible { display:block; }
:where(body[data-page="cabinet-register-voyant"]) .audio-filename { font-size:.76rem; color:var(--lavender-deep); margin-top:6px; display:none; font-weight:500; }
:where(body[data-page="cabinet-register-voyant"]) .audio-filename.visible { display:block; }
:where(body[data-page="cabinet-register-voyant"]) .form-section-title { font-family:var(--font-display); font-size:.95rem; font-weight:600; color:#5a4068; margin:8px 0 4px; padding-bottom:8px; border-bottom:1px solid var(--line); grid-column:1/-1; }
:where(body[data-page="cabinet-register-voyant"]) .exp-options { display:flex; gap:10px; }
:where(body[data-page="cabinet-register-voyant"]) .exp-radio { display:none; }
:where(body[data-page="cabinet-register-voyant"]) .exp-label { flex:1; text-align:center; padding:10px 8px; border-radius:var(--radius-md); border:1px solid rgba(160,140,185,.2); background:rgba(255,255,255,.6); font-size:.8rem; color:var(--text-soft); cursor:pointer; transition:all .2s; line-height:1.4; }
:where(body[data-page="cabinet-register-voyant"]) .exp-label .exp-emoji { display:block; font-size:1.1rem; margin-bottom:3px; }
:where(body[data-page="cabinet-register-voyant"]) .exp-radio:checked + .exp-label { background:rgba(195,165,228,.22); border-color:rgba(155,126,200,.45); color:#5a3e6e; }
:where(body[data-page="cabinet-register-voyant"]) .consult-options { display:flex; gap:10px; flex-wrap:wrap; }
:where(body[data-page="cabinet-register-voyant"]) .consult-check { display:none; }
:where(body[data-page="cabinet-register-voyant"]) .consult-label { display:flex; flex-direction:column; align-items:center; gap:8px; flex:1; min-width:100px; padding:16px 12px; border-radius:var(--radius-md); border:1px solid rgba(160,140,185,.2); background:rgba(255,255,255,.6); font-size:.82rem; color:var(--text-soft); cursor:pointer; transition:all .22s; text-align:center; user-select:none; }
:where(body[data-page="cabinet-register-voyant"]) .consult-label .ci { font-size:1.6rem; line-height:1; }
:where(body[data-page="cabinet-register-voyant"]) .consult-check:checked + .consult-label { background:rgba(195,165,228,.22); border-color:rgba(155,126,200,.5); color:#5a3e6e; font-weight:500; box-shadow:0 4px 14px rgba(155,126,200,.12); }
:where(body[data-page="cabinet-register-voyant"]) #field-consult.error .consult-label { border-color:rgba(180,80,80,.3); }
:where(body[data-page="cabinet-register-voyant"]) .consult-err { font-size:.75rem; color:#8a4040; display:none; margin-top:4px; }
:where(body[data-page="cabinet-register-voyant"]) #field-consult.error .consult-err { display:block; }
:where(body[data-page="cabinet-register-voyant"]) .legal-check { display:flex; align-items:flex-start; gap:11px; margin-top:4px; }
:where(body[data-page="cabinet-register-voyant"]) .legal-check input[type="checkbox"] { width:17px; height:17px; flex-shrink:0; margin-top:1px; accent-color:var(--lavender-deep); cursor:pointer; padding:0; border:none; box-shadow:none; }
:where(body[data-page="cabinet-register-voyant"]) .legal-check label { font-size:.80rem; color:var(--text-soft); line-height:1.6; letter-spacing:0; font-weight:400; cursor:pointer; }
:where(body[data-page="cabinet-register-voyant"]) .legal-check a { color:var(--lavender-deep); text-decoration:underline; text-underline-offset:2px; }
:where(body[data-page="cabinet-register-voyant"]) .submit-row { display:flex; align-items:center; gap:16px; margin-top:6px; }
:where(body[data-page="cabinet-register-voyant"]) .btn-submit { flex:1; padding:13px 24px; background:linear-gradient(135deg,#c4aee0 0%,#e8d0a8 100%); color:#3d2a4e; border:none; border-radius:999px; font-family:var(--font-body); font-size:.9rem; font-weight:500; cursor:pointer; transition:transform .22s,box-shadow .22s,opacity .22s; display:flex; align-items:center; justify-content:center; gap:8px; }
:where(body[data-page="cabinet-register-voyant"]) .btn-submit:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 10px 28px rgba(140,110,170,.22); }
:where(body[data-page="cabinet-register-voyant"]) .btn-submit:disabled { opacity:.55; cursor:not-allowed; }
:where(body[data-page="cabinet-register-voyant"]) .submit-progress { display:none; margin-top:10px; }
:where(body[data-page="cabinet-register-voyant"]) .submit-progress.visible { display:block; }
:where(body[data-page="cabinet-register-voyant"]) .progress-bar { height:4px; background:rgba(155,126,200,.2); border-radius:2px; overflow:hidden; }
:where(body[data-page="cabinet-register-voyant"]) .progress-fill { height:100%; background:linear-gradient(90deg,#c4aee0,#e8d0a8); border-radius:2px; width:0%; transition:width .3s ease; }
:where(body[data-page="cabinet-register-voyant"]) .progress-text { font-size:.75rem; color:var(--text-soft); margin-top:6px; text-align:center; }
:where(body[data-page="cabinet-register-voyant"]) .form-error-banner { display:none; background:rgba(180,80,80,.1); border:1px solid rgba(180,80,80,.3); border-radius:var(--radius-md); padding:12px 16px; font-size:.84rem; color:#7a3030; margin-bottom:4px; grid-column:1/-1; }
:where(body[data-page="cabinet-register-voyant"]) .form-error-banner.visible { display:block; }
:where(body[data-page="cabinet-register-voyant"]) .field.error input, :where(body[data-page="cabinet-register-voyant"]) .field.error select, :where(body[data-page="cabinet-register-voyant"]) .field.error textarea { border-color:rgba(180,80,80,.4); box-shadow:0 0 0 3px rgba(180,80,80,.08); }
:where(body[data-page="cabinet-register-voyant"]) .field-error-msg { font-size:.75rem; color:#8a4040; display:none; }
:where(body[data-page="cabinet-register-voyant"]) .field.error .field-error-msg { display:block; }
:where(body[data-page="cabinet-register-voyant"]) .success-overlay { display:none; position:fixed; inset:0; background:rgba(15,8,28,.82); backdrop-filter:blur(12px) saturate(1.2); z-index:200; align-items:center; justify-content:center; }
:where(body[data-page="cabinet-register-voyant"]) .success-overlay.visible { display:flex; }
:where(body[data-page="cabinet-register-voyant"]) .success-card { background:linear-gradient(160deg,#2a1c3a 0%,#1e1228 100%); border:1px solid rgba(196,174,224,.18); border-radius:28px; padding:52px 44px; text-align:center; max-width:420px; width:calc(100% - 40px); box-shadow:0 32px 80px rgba(0,0,0,.55); animation:revealCard .5s cubic-bezier(.34,1.36,.64,1) forwards; position:relative; overflow:hidden; }
:where(body[data-page="cabinet-register-voyant"]) .success-card::before { content:''; position:absolute; top:-60px; right:-60px; width:200px; height:200px; background:radial-gradient(circle,rgba(180,140,220,.22) 0%,transparent 70%); border-radius:50%; pointer-events:none; }
:where(body[data-page="cabinet-register-voyant"]) .success-icon { width:72px; height:72px; border-radius:50%; background:linear-gradient(135deg,rgba(180,140,220,.3),rgba(200,160,100,.25)); border:1px solid rgba(196,174,224,.25); display:grid; place-items:center; font-size:1.8rem; margin:0 auto 24px; position:relative; z-index:1; }
:where(body[data-page="cabinet-register-voyant"]) .success-card h3 { font-family:var(--font-display); font-size:1.8rem; font-weight:500; color:#f0e8fa; margin-bottom:14px; position:relative; z-index:1; }
:where(body[data-page="cabinet-register-voyant"]) .success-card p { font-size:.88rem; color:rgba(200,185,220,.75); line-height:1.75; margin-bottom:32px; position:relative; z-index:1; }
:where(body[data-page="cabinet-register-voyant"]) .success-card p strong { color:rgba(220,205,240,.9); }
:where(body[data-page="cabinet-register-voyant"]) .success-card .btn-success-cta { display:inline-flex; align-items:center; justify-content:center; padding:13px 28px; border-radius:999px; background:linear-gradient(135deg,#c4aee0 0%,#e8d0a8 100%); color:#2a1c3a; font-family:var(--font-body); font-size:.88rem; font-weight:600; text-decoration:none; border:none; cursor:pointer; transition:transform .22s,box-shadow .22s; position:relative; z-index:1; }
:where(body[data-page="cabinet-register-voyant"]) .success-card .btn-success-cta:hover { transform:translateY(-2px); box-shadow:0 10px 28px rgba(140,110,170,.35); }
@media (max-width:900px) {
  :where(body[data-page="cabinet-register-voyant"]) .page-wrapper { grid-template-columns:1fr; }
  :where(body[data-page="cabinet-register-voyant"]) .panel-left { display:none; }
  :where(body[data-page="cabinet-register-voyant"]) .panel-right { padding:40px 28px; }
}
@media (max-width:480px) {
  :where(body[data-page="cabinet-register-voyant"]) .form-grid { grid-template-columns:1fr; }
  :where(body[data-page="cabinet-register-voyant"]) .form-grid .full { grid-column:1; }
  :where(body[data-page="cabinet-register-voyant"]) .exp-options { flex-wrap:wrap; }
  :where(body[data-page="cabinet-register-voyant"]) .exp-label { min-width:calc(50% - 5px); }
}

/* === Page : cabinet-reponse-email  (pages/cabinet/reponse-email.html) === */
:where(body[data-page="cabinet-reponse-email"]) .dash-topbar { position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
:where(body[data-page="cabinet-reponse-email"]) .dash-topbar h1 { font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body); }
:where(body[data-page="cabinet-reponse-email"]) .dash-content { padding:32px;max-width:960px; }
:where(body[data-page="cabinet-reponse-email"]) .reponse-grid { display:grid;grid-template-columns:1fr 1.6fr;gap:28px;align-items:start; }
:where(body[data-page="cabinet-reponse-email"]) .questions-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);position:sticky;top:80px; }
:where(body[data-page="cabinet-reponse-email"]) .questions-card h2 { font-size:1.1rem;margin-bottom:6px; }
:where(body[data-page="cabinet-reponse-email"]) .client-meta { display:flex;align-items:center;gap:12px;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-reponse-email"]) .client-avatar { width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-reponse-email"]) .client-meta-info strong { display:block;font-size:.9rem;color:var(--text); }
:where(body[data-page="cabinet-reponse-email"]) .client-meta-info span { font-size:.78rem;color:var(--text-soft); }
:where(body[data-page="cabinet-reponse-email"]) .urgency-badge { display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:.74rem;font-weight:500;margin-bottom:16px; }
:where(body[data-page="cabinet-reponse-email"]) .urgency-badge.normal { background:rgba(210,238,210,.6);color:#4a7050; }
:where(body[data-page="cabinet-reponse-email"]) .urgency-badge.urgent { background:rgba(238,210,210,.6);color:#7a4040; }
:where(body[data-page="cabinet-reponse-email"]) .question-item { margin-bottom:14px; }
:where(body[data-page="cabinet-reponse-email"]) .question-item:last-child { margin-bottom:0; }
:where(body[data-page="cabinet-reponse-email"]) .question-num { font-size:.72rem;font-weight:500;color:var(--lavender-deep);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px; }
:where(body[data-page="cabinet-reponse-email"]) .question-text { font-size:.88rem;color:var(--text);line-height:1.7;background:var(--bg-soft);border-radius:var(--radius-sm);padding:12px 14px;border-left:3px solid var(--lavender-mid); }
:where(body[data-page="cabinet-reponse-email"]) .situation-text { font-size:.85rem;color:var(--text-soft);line-height:1.7;font-style:italic;margin-bottom:16px;padding:12px 14px;background:rgba(210,190,238,.08);border-radius:var(--radius-sm);border:1px solid rgba(196,174,224,.15); }
:where(body[data-page="cabinet-reponse-email"]) .reponse-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow-sm); }
:where(body[data-page="cabinet-reponse-email"]) .reponse-card h2 { font-size:1.15rem;margin-bottom:6px; }
:where(body[data-page="cabinet-reponse-email"]) .reponse-card .subtitle { font-size:.84rem;color:var(--text-soft);margin-bottom:24px; }
:where(body[data-page="cabinet-reponse-email"]) .form-group { margin-bottom:20px; }
:where(body[data-page="cabinet-reponse-email"]) label { display:block;font-size:.82rem;font-weight:500;color:var(--text);margin-bottom:8px; }
:where(body[data-page="cabinet-reponse-email"]) .field-note { font-size:.74rem;color:var(--text-xsoft);margin-top:5px; }
:where(body[data-page="cabinet-reponse-email"]) textarea { width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);font-family:var(--font-body);font-size:.88rem;color:var(--text);outline:none;resize:vertical;line-height:1.7;transition:border-color .25s,box-shadow .25s; }
:where(body[data-page="cabinet-reponse-email"]) textarea:focus { border-color:var(--lavender-mid);box-shadow:0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="cabinet-reponse-email"]) .char-count { font-size:.72rem;color:var(--text-xsoft);text-align:right;margin-top:4px; }
:where(body[data-page="cabinet-reponse-email"]) .sections-wrap { display:flex;flex-direction:column;gap:16px;margin-bottom:20px; }
:where(body[data-page="cabinet-reponse-email"]) .section-item { background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius-md);padding:18px; }
:where(body[data-page="cabinet-reponse-email"]) .section-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:12px; }
:where(body[data-page="cabinet-reponse-email"]) .section-num { font-size:.8rem;font-weight:500;color:var(--lavender-deep); }
:where(body[data-page="cabinet-reponse-email"]) .btn-remove-section { background:none;border:none;cursor:pointer;color:var(--text-xsoft);font-size:.8rem;padding:4px 8px;border-radius:var(--radius-sm);transition:background .2s,color .2s; }
:where(body[data-page="cabinet-reponse-email"]) .btn-remove-section:hover { background:rgba(200,80,80,.1);color:#c05050; }
:where(body[data-page="cabinet-reponse-email"]) input[type=text] { width:100%;padding:10px 13px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);font-family:var(--font-body);font-size:.87rem;color:var(--text);outline:none;transition:border-color .25s,box-shadow .25s;margin-bottom:10px; }
:where(body[data-page="cabinet-reponse-email"]) input[type=text]:focus, :where(body[data-page="cabinet-reponse-email"]) textarea:focus { border-color:var(--lavender-mid);box-shadow:0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="cabinet-reponse-email"]) .btn-add-section { display:flex;align-items:center;gap:8px;padding:10px 16px;border:1.5px dashed rgba(196,174,224,.4);border-radius:var(--radius-md);background:none;font-family:var(--font-body);font-size:.84rem;color:var(--text-soft);cursor:pointer;width:100%;justify-content:center;transition:border-color .2s,color .2s,background .2s; }
:where(body[data-page="cabinet-reponse-email"]) .btn-add-section:hover { border-color:var(--lavender-deep);color:var(--lavender-deep);background:rgba(196,174,224,.05); }
:where(body[data-page="cabinet-reponse-email"]) .apercu-wrap { background:linear-gradient(135deg,rgba(240,232,252,.3),rgba(252,245,232,.3));border:1px solid rgba(196,174,224,.2);border-radius:var(--radius-md);padding:18px;margin-bottom:20px; }
:where(body[data-page="cabinet-reponse-email"]) .apercu-wrap h4 { font-size:.85rem;font-weight:500;margin-bottom:12px;color:#5a3d70;display:flex;align-items:center;gap:8px; }
:where(body[data-page="cabinet-reponse-email"]) .apercu-intro { font-size:.85rem;color:var(--text-soft);line-height:1.7;font-style:italic;margin-bottom:10px; }
:where(body[data-page="cabinet-reponse-email"]) .apercu-section { margin-bottom:10px; }
:where(body[data-page="cabinet-reponse-email"]) .apercu-section strong { display:block;font-size:.84rem;color:var(--text);margin-bottom:4px; }
:where(body[data-page="cabinet-reponse-email"]) .apercu-section p { font-size:.83rem;color:var(--text-soft);line-height:1.65; }
:where(body[data-page="cabinet-reponse-email"]) .form-actions { display:flex;gap:12px;align-items:center;padding-top:20px;border-top:1px solid var(--line); }
:where(body[data-page="cabinet-reponse-email"]) .btn-submit-reponse { flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;border-radius:999px;font-family:var(--font-body);font-size:.9rem;font-weight:500;cursor:pointer;transition:transform .2s,box-shadow .2s;position:relative; }
:where(body[data-page="cabinet-reponse-email"]) .btn-submit-reponse:hover:not(:disabled) { transform:translateY(-2px);box-shadow:0 10px 28px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-reponse-email"]) .btn-submit-reponse:disabled { opacity:.6;cursor:not-allowed; }
:where(body[data-page="cabinet-reponse-email"]) .btn-submit-reponse.loading .btn-text { opacity:0; }
:where(body[data-page="cabinet-reponse-email"]) .btn-submit-reponse .spinner { display:none;position:absolute;width:18px;height:18px;border:2px solid rgba(60,40,80,.2);border-top-color:#3d2a4e;border-radius:50%;animation:_cabinet_reponse_email__spin .7s linear infinite; }
:where(body[data-page="cabinet-reponse-email"]) .btn-submit-reponse.loading .spinner { display:block; }
:where(body[data-page="cabinet-reponse-email"]) .btn-brouillon { padding:14px 20px;background:var(--surface);color:var(--text-soft);border:1px solid var(--line);border-radius:999px;font-family:var(--font-body);font-size:.84rem;cursor:pointer;transition:background .2s; }
:where(body[data-page="cabinet-reponse-email"]) .btn-brouillon:hover { background:var(--bg-soft); }
:where(body[data-page="cabinet-reponse-email"]) .form-alert { padding:12px 16px;border-radius:var(--radius-md);font-size:.84rem;margin-bottom:16px;display:none; }
:where(body[data-page="cabinet-reponse-email"]) .form-alert.error { display:block;background:rgba(238,215,215,.7);color:#7a3535;border:1px solid rgba(200,150,150,.3); }
:where(body[data-page="cabinet-reponse-email"]) .form-alert.success { display:block;background:rgba(210,238,210,.7);color:#3a6040;border:1px solid rgba(150,200,150,.3); }
:where(body[data-page="cabinet-reponse-email"]) .skeleton { background:linear-gradient(90deg,var(--bg-soft) 25%,#fff 50%,var(--bg-soft) 75%);background-size:200% 100%;animation:_cabinet_reponse_email__shimmer 1.4s infinite;border-radius:var(--radius-sm);height:14px;margin-bottom:8px; }
@media(max-width:900px) { .reponse-grid { grid-template-columns:1fr; } .questions-card { position:static; } }
@media(max-width:720px) { .dashboard-layout { grid-template-columns:1fr; } .sidebar { display:none; } .dash-content { padding:20px; } }

/* === Page : cabinet-revenus  (pages/cabinet/revenus.html) === */
:where(body[data-page="cabinet-revenus"]) .dash-topbar { position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
:where(body[data-page="cabinet-revenus"]) .dash-topbar h1 { font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body); }
:where(body[data-page="cabinet-revenus"]) .dash-content { padding:32px;max-width:1000px; }
:where(body[data-page="cabinet-revenus"]) #viewNormal { display:block; }
:where(body[data-page="cabinet-revenus"]) #viewConsultation { display:none; }
:where(body[data-page="cabinet-revenus"]) .stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px; }
:where(body[data-page="cabinet-revenus"]) .stat-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s; }
:where(body[data-page="cabinet-revenus"]) .stat-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-revenus"]) .stat-card .stat-icon { font-size:1.2rem;margin-bottom:10px;display:block; }
:where(body[data-page="cabinet-revenus"]) .stat-card .stat-val { font-family:var(--font-display);font-size:1.8rem;font-weight:600;color:#3d2e4a;display:block;line-height:1;margin-bottom:4px; }
:where(body[data-page="cabinet-revenus"]) .stat-card .stat-lbl { font-size:.76rem;color:var(--text-soft); }
:where(body[data-page="cabinet-revenus"]) .dash-block { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);margin-bottom:20px; }
:where(body[data-page="cabinet-revenus"]) .dash-block-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-revenus"]) .dash-block-header h3 { font-size:.97rem; }
:where(body[data-page="cabinet-revenus"]) .dash-block-header a { font-size:.78rem;color:var(--lavender-deep);text-decoration:underline;text-underline-offset:3px; }
:where(body[data-page="cabinet-revenus"]) .pending-list { display:flex;flex-direction:column;gap:10px; }
:where(body[data-page="cabinet-revenus"]) .pending-item { display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--bg-soft);border-radius:var(--radius-md);border:1px solid var(--line);transition:border-color .2s; }
:where(body[data-page="cabinet-revenus"]) .pending-item:hover { border-color:rgba(180,155,210,.25); }
:where(body[data-page="cabinet-revenus"]) .pending-avatar { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.6),rgba(237,215,176,.6));display:grid;place-items:center;font-family:var(--font-display);font-size:1rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-revenus"]) .pending-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-revenus"]) .pending-info strong { display:block;font-size:.85rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-revenus"]) .pending-info span { font-size:.75rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-revenus"]) .pending-badge { font-size:.72rem;padding:4px 10px;border-radius:999px;background:rgba(237,215,176,.5);color:#7a5a20;font-weight:500;white-space:nowrap; }
:where(body[data-page="cabinet-revenus"]) .pending-badge.urgent { background:rgba(238,215,215,.7);color:#7a3535; }
:where(body[data-page="cabinet-revenus"]) .btn-repondre { padding:7px 14px;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;font-family:var(--font-body);font-size:.76rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-revenus"]) .btn-repondre:hover { transform:translateY(-1px);box-shadow:0 4px 12px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-revenus"]) .consult-row { display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-revenus"]) .consult-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-revenus"]) .consult-row .c-avatar { width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:.9rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-revenus"]) .consult-row .c-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-revenus"]) .consult-row .c-info strong { display:block;font-size:.84rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-revenus"]) .consult-row .c-info span { font-size:.74rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-revenus"]) .consult-row .c-amount { font-weight:500;color:var(--text);flex-shrink:0; }
:where(body[data-page="cabinet-revenus"]) .badge-mode { font-size:.68rem;padding:2px 8px;border-radius:999px;margin-left:6px; }
:where(body[data-page="cabinet-revenus"]) .badge-chat { background:rgba(210,238,210,.6);color:#3a6040; }
:where(body[data-page="cabinet-revenus"]) .badge-tel { background:rgba(210,225,238,.6);color:#3a5070; }
:where(body[data-page="cabinet-revenus"]) .badge-email { background:rgba(237,215,176,.5);color:#7a5a20; }
:where(body[data-page="cabinet-revenus"]) .avis-row { padding:12px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-revenus"]) .avis-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-revenus"]) .avis-stars { color:var(--gold);font-size:.78rem;letter-spacing:1px;margin-bottom:4px; }
:where(body[data-page="cabinet-revenus"]) .avis-text { color:var(--text-soft);line-height:1.6;font-style:italic; }
:where(body[data-page="cabinet-revenus"]) .avis-meta { font-size:.73rem;color:var(--text-xsoft);margin-top:4px; }
:where(body[data-page="cabinet-revenus"]) .revenus-bar-wrap { display:flex;flex-direction:column;gap:8px;margin-top:8px; }
:where(body[data-page="cabinet-revenus"]) .revenu-day { display:flex;align-items:center;gap:10px;font-size:.78rem; }
:where(body[data-page="cabinet-revenus"]) .revenu-day .day { color:var(--text-soft);min-width:28px; }
:where(body[data-page="cabinet-revenus"]) .revenu-bar-bg { flex:1;height:8px;background:var(--bg-soft);border-radius:4px;overflow:hidden; }
:where(body[data-page="cabinet-revenus"]) .revenu-bar-fill { height:100%;border-radius:4px;background:linear-gradient(90deg,#c4aee0,#e8d0a8);transition:width .6s ease; }
:where(body[data-page="cabinet-revenus"]) .revenu-day .amount { color:var(--text);font-weight:500;min-width:48px;text-align:right; }
:where(body[data-page="cabinet-revenus"]) .consult-active-view {
      background: linear-gradient(160deg,#1a1228 0%,#2a1840 100%);
      border-radius:var(--radius-xl);
      padding:24px;
      color:#e8dff5;
      margin-bottom:20px;
      position:relative;
      overflow:hidden;
    }
:where(body[data-page="cabinet-revenus"]) .consult-active-view::before { content:'';position:absolute;top:-60px;right:-60px;width:260px;height:260px;background:radial-gradient(circle,rgba(155,126,200,.2),transparent 70%);border-radius:50%;pointer-events:none; }
:where(body[data-page="cabinet-revenus"]) .active-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:16px; }
:where(body[data-page="cabinet-revenus"]) .active-title { font-family:var(--font-display);font-size:1.2rem;color:#e8dff5; }
:where(body[data-page="cabinet-revenus"]) .active-mode-badge { display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:rgba(155,126,200,.2);border:1px solid rgba(155,126,200,.3);border-radius:999px;font-size:.78rem;color:rgba(200,180,230,.9); }
:where(body[data-page="cabinet-revenus"]) .live-dot { width:7px;height:7px;background:#72b872;border-radius:50%;animation:pulseDot 1.5s ease-in-out infinite;flex-shrink:0; }
:where(body[data-page="cabinet-revenus"]) .client-info-row { display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:14px;background:rgba(255,255,255,.05);border-radius:14px;border:1px solid rgba(155,126,200,.15); }
:where(body[data-page="cabinet-revenus"]) .client-avatar { width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1.3rem;color:#7a5c8a;flex-shrink:0; }
:where(body[data-page="cabinet-revenus"]) .client-detail strong { display:block;font-size:1rem;color:#e8dff5;margin-bottom:3px; }
:where(body[data-page="cabinet-revenus"]) .client-detail span { font-size:.8rem;color:rgba(200,180,230,.6); }
:where(body[data-page="cabinet-revenus"]) .realtime-stats { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px; }
:where(body[data-page="cabinet-revenus"]) .rt-stat { background:rgba(255,255,255,.05);border:1px solid rgba(155,126,200,.15);border-radius:12px;padding:12px;text-align:center; }
:where(body[data-page="cabinet-revenus"]) .rt-stat .rt-val { font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#e8dff5;display:block;line-height:1;margin-bottom:3px; }
:where(body[data-page="cabinet-revenus"]) .rt-stat .rt-lbl { font-size:.68rem;color:rgba(200,180,230,.5); }
:where(body[data-page="cabinet-revenus"]) .rt-stat .rt-val.warn { color:#e8d0a8; }
:where(body[data-page="cabinet-revenus"]) .rt-stat .rt-val.danger { color:#f0a0a0; }
:where(body[data-page="cabinet-revenus"]) .credits-client-bar { margin-bottom:14px; }
:where(body[data-page="cabinet-revenus"]) .credits-client-label { display:flex;justify-content:space-between;font-size:.78rem;color:rgba(200,180,230,.6);margin-bottom:6px; }
:where(body[data-page="cabinet-revenus"]) .credits-bar-bg { height:6px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden; }
:where(body[data-page="cabinet-revenus"]) .credits-bar-fill { height:100%;border-radius:3px;transition:width .5s ease,background .5s; background:linear-gradient(90deg,#9b7ec8,#c8a860); }
:where(body[data-page="cabinet-revenus"]) .credits-bar-fill.warn { background:linear-gradient(90deg,#c8a860,#e89060); }
:where(body[data-page="cabinet-revenus"]) .credits-bar-fill.danger { background:#e08080; }
:where(body[data-page="cabinet-revenus"]) .consult-chat-shell {
      margin: 14px 0 12px;
      border: 1px solid rgba(155,126,200,.15);
      border-radius: 18px;
      background: rgba(10, 6, 20, .22);
      overflow: hidden;
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-header {
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:12px 16px;
      background: rgba(255,255,255,.04);
      border-bottom:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-header strong {
      font-size:.84rem;
      color:#e8dff5;
      font-weight:500;
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-header span {
      font-size:.72rem;
      color:rgba(200,180,230,.5);
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-messages {
      height: 170px;
      max-height: 24vh;
      min-height: 140px;
      overflow-y: auto;
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      scrollbar-width: thin;
      scrollbar-color: rgba(155,126,200,.2) transparent;
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-messages::-webkit-scrollbar { width:4px; }
:where(body[data-page="cabinet-revenus"]) .consult-chat-messages::-webkit-scrollbar-thumb { background:rgba(155,126,200,.25); border-radius:2px; }
:where(body[data-page="cabinet-revenus"]) .chat-row {
      display:flex;
      max-width: 82%;
      gap:10px;
      align-items:flex-end;
      animation: chatSlideIn .22s ease;
    }
:where(body[data-page="cabinet-revenus"]) .chat-row.from-client { align-self:flex-start; }
:where(body[data-page="cabinet-revenus"]) .chat-row.from-voyant { align-self:flex-end; flex-direction:row-reverse; }
:where(body[data-page="cabinet-revenus"]) .chat-avatar {
      width:32px;height:32px;border-radius:50%;
      display:grid;place-items:center;
      flex-shrink:0;
      font-family:var(--font-display);
      font-size:.82rem;
      color:#3d2a4e;
      background:linear-gradient(135deg,rgba(210,190,238,.85),rgba(237,215,176,.85));
    }
:where(body[data-page="cabinet-revenus"]) .chat-row.from-voyant .chat-avatar {
      color:#e8dff5;
      background:rgba(155,126,200,.32);
    }
:where(body[data-page="cabinet-revenus"]) .chat-bubble {
      padding:11px 14px;
      border-radius:16px;
      line-height:1.55;
      font-size:.86rem;
      border:1px solid rgba(155,126,200,.16);
      word-break:break-word;
      white-space:pre-wrap;
    }
:where(body[data-page="cabinet-revenus"]) .chat-row.from-client .chat-bubble {
      background:rgba(255,255,255,.07);
      color:#f2edf8;
      border-bottom-left-radius:5px;
    }
:where(body[data-page="cabinet-revenus"]) .chat-row.from-voyant .chat-bubble {
      background:linear-gradient(135deg,rgba(155,126,200,.26),rgba(200,168,96,.18));
      color:#fffaf0;
      border-bottom-right-radius:5px;
    }
:where(body[data-page="cabinet-revenus"]) .chat-meta {
      margin-top:4px;
      font-size:.66rem;
      color:rgba(200,180,230,.42);
    }
:where(body[data-page="cabinet-revenus"]) .chat-system {
      align-self:center;
      padding:6px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.06);
      color:rgba(200,180,230,.58);
      font-size:.72rem;
      border:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-compose {
      padding: 12px 14px;
      border-top:1px solid rgba(155,126,200,.12);
      display:flex;
      gap:10px;
      align-items:flex-end;
      background: rgba(255,255,255,.03);
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-compose textarea {
      flex:1;
      min-height:42px;
      max-height:96px;
      resize:vertical;
      border-radius:14px;
      border:1px solid rgba(155,126,200,.2);
      background:rgba(255,255,255,.06);
      color:#f0eaf8;
      padding:12px 14px;
      outline:none;
      font-family:var(--font-body);
      font-size:.84rem;
      line-height:1.5;
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-compose textarea:focus {
      border-color: rgba(155,126,200,.45);
      box-shadow:0 0 0 3px rgba(155,126,200,.1);
    }
:where(body[data-page="cabinet-revenus"]) .consult-chat-compose textarea::placeholder { color:rgba(200,180,230,.34); }
:where(body[data-page="cabinet-revenus"]) .btn-send-chat {
      min-width:104px;
      height:42px;
      border:none;
      border-radius:999px;
      background:linear-gradient(135deg,#9b7ec8,#c8a860);
      color:#2c1d38;
      font-family:var(--font-body);
      font-size:.82rem;
      font-weight:600;
      cursor:pointer;
      transition:transform .2s, opacity .2s, box-shadow .2s;
      box-shadow:0 4px 16px rgba(155,126,200,.25);
    }
:where(body[data-page="cabinet-revenus"]) .btn-send-chat:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-revenus"]) .btn-send-chat:disabled { opacity:.4; cursor:not-allowed; transform:none; box-shadow:none; }
:where(body[data-page="cabinet-revenus"]) .consult-actions-bar {
      display:grid;
      grid-template-columns:minmax(0,1fr) 260px;
      gap:14px;
      align-items:end;
      margin-top:12px;
    }
:where(body[data-page="cabinet-revenus"]) .session-notes textarea {
      width:100%;padding:10px 12px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(155,126,200,.2);
      border-radius:12px;
      font-family:var(--font-body);font-size:.82rem;
      color:#f0eaf8;outline:none;
      resize:vertical;min-height:58px;max-height:92px;
      transition:border-color .2s;
    }
:where(body[data-page="cabinet-revenus"]) .session-notes textarea:focus { border-color:rgba(155,126,200,.45); }
:where(body[data-page="cabinet-revenus"]) .session-notes textarea::placeholder { color:rgba(200,180,230,.3); }
:where(body[data-page="cabinet-revenus"]) .session-notes label { display:block;font-size:.76rem;color:rgba(200,180,230,.5);margin-bottom:7px;letter-spacing:.03em;text-transform:uppercase; }
:where(body[data-page="cabinet-revenus"]) .btn-end-consultation {
      width:100%;padding:12px 16px;border-radius:999px;
      background:rgba(200,80,80,.2);
      border:1px solid rgba(200,80,80,.3);
      color:#f0a0a0;
      font-family:var(--font-body);font-size:.9rem;font-weight:500;
      cursor:pointer;transition:background .2s,border-color .2s;
      margin-top:0;
      align-self:end;
      position:sticky;
      bottom:10px;
      box-shadow:0 8px 24px rgba(0,0,0,.18);
    }
:where(body[data-page="cabinet-revenus"]) .btn-end-consultation:hover { background:rgba(200,80,80,.35);border-color:rgba(200,80,80,.5); }
:where(body[data-page="cabinet-revenus"]) .client-low-credits {
      display:none;align-items:center;gap:8px;
      padding:10px 14px;border-radius:10px;
      background:rgba(200,120,40,.2);border:1px solid rgba(200,120,40,.3);
      color:#e8c090;font-size:.82rem;margin-bottom:16px;
    }
:where(body[data-page="cabinet-revenus"]) .client-low-credits.visible { display:flex; }
:where(body[data-page="cabinet-revenus"]) .incoming-requests-block { display:none; margin-bottom:20px; }
:where(body[data-page="cabinet-revenus"]) .incoming-requests-block.visible { display:block; }
:where(body[data-page="cabinet-revenus"]) .incoming-requests-list { display:flex; flex-direction:column; gap:12px; }
:where(body[data-page="cabinet-revenus"]) .incoming-request-card {
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:14px;
      align-items:center;
      padding:16px 18px;
      border-radius:16px;
      background:linear-gradient(135deg,rgba(155,126,200,.16),rgba(232,208,168,.14));
      border:1px solid rgba(155,126,200,.2);
      box-shadow:var(--shadow-sm);
    }
:where(body[data-page="cabinet-revenus"]) .incoming-request-main strong { display:block; font-size:.96rem; color:var(--text); margin-bottom:4px; }
:where(body[data-page="cabinet-revenus"]) .incoming-request-meta { display:flex; flex-wrap:wrap; gap:8px; font-size:.76rem; color:var(--text-soft); }
:where(body[data-page="cabinet-revenus"]) .incoming-pill {
      display:inline-flex; align-items:center; gap:6px;
      padding:5px 10px; border-radius:999px;
      background:rgba(255,255,255,.55); border:1px solid rgba(155,126,200,.12);
      color:#5a446e; font-weight:500;
    }
:where(body[data-page="cabinet-revenus"]) .incoming-request-actions { display:flex; gap:10px; align-items:center; }
:where(body[data-page="cabinet-revenus"]) .btn-accept-request, :where(body[data-page="cabinet-revenus"]) .btn-reject-request {
      border:none; border-radius:999px; padding:10px 16px; cursor:pointer;
      font-family:var(--font-body); font-size:.78rem; font-weight:600;
      transition:transform .18s ease, opacity .18s ease, box-shadow .18s ease;
      white-space:nowrap;
    }
:where(body[data-page="cabinet-revenus"]) .btn-accept-request { background:linear-gradient(135deg,#c4aee0,#e8d0a8); color:#3d2a4e; box-shadow:0 6px 18px rgba(155,126,200,.18); }
:where(body[data-page="cabinet-revenus"]) .btn-reject-request { background:rgba(200,80,80,.12); color:#9c4d4d; border:1px solid rgba(200,80,80,.2); }
:where(body[data-page="cabinet-revenus"]) .btn-accept-request:hover, :where(body[data-page="cabinet-revenus"]) .btn-reject-request:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-revenus"]) .dashboard-toast-stack {
      position:fixed; top:18px; right:18px; z-index:120;
      display:flex; flex-direction:column; gap:10px; pointer-events:none;
    }
:where(body[data-page="cabinet-revenus"]) .dashboard-toast {
      min-width:280px; max-width:360px; padding:14px 16px;
      border-radius:16px; color:#f7f1fb;
      background:rgba(28,19,43,.95); border:1px solid rgba(155,126,200,.24);
      box-shadow:0 20px 40px rgba(0,0,0,.22);
      opacity:0; transform:translateY(-8px);
      animation:toastIn .24s ease forwards;
    }
:where(body[data-page="cabinet-revenus"]) .dashboard-toast strong { display:block; font-size:.84rem; margin-bottom:4px; color:#fff; }
:where(body[data-page="cabinet-revenus"]) .dashboard-toast span { display:block; font-size:.76rem; color:rgba(232,223,245,.72); line-height:1.45; }
@media(max-width:1024px) { .stats-grid{grid-template-columns:repeat(2,1fr);} .realtime-stats{grid-template-columns:repeat(2,1fr);} }
@media(max-width:900px) {
      .consult-active-view { padding:22px; }
      .consult-chat-messages { height: 210px; max-height: 28vh; }
    }
@media(max-width:768px) {
      .dashboard-layout{grid-template-columns:1fr;}
      
      
      .dash-content{padding:20px 16px;}
      .dash-topbar{padding:0 16px;}
    }
@media(max-width:480px) { .stats-grid{grid-template-columns:1fr 1fr;} .realtime-stats{grid-template-columns:1fr 1fr;} }
:where(body[data-page="cabinet-revenus"]) .revenus-hero { background:linear-gradient(135deg,#1e1430,#2a1840);border:1px solid rgba(155,126,200,.2);border-radius:var(--radius-xl);padding:32px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;margin-bottom:24px; }
:where(body[data-page="cabinet-revenus"]) .revenu-hero-stat { text-align:center; }
:where(body[data-page="cabinet-revenus"]) .revenu-hero-stat .big-val { font-family:var(--font-display);font-size:2.2rem;font-weight:600;color:#e8dff5;display:block; }
:where(body[data-page="cabinet-revenus"]) .revenu-hero-stat .big-lbl { font-size:.78rem;color:rgba(200,180,230,.5);margin-top:4px; }
:where(body[data-page="cabinet-revenus"]) .revenu-divider { width:1px;background:rgba(155,126,200,.15); }
:where(body[data-page="cabinet-revenus"]) .monthly-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;margin-bottom:24px; }
:where(body[data-page="cabinet-revenus"]) .month-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px;box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-revenus"]) .month-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-revenus"]) .month-name { font-family:var(--font-display);font-size:.95rem;color:var(--text);margin-bottom:4px; }
:where(body[data-page="cabinet-revenus"]) .month-amount { font-size:1.2rem;font-weight:600;color:#3d2e4a; }
:where(body[data-page="cabinet-revenus"]) .month-count { font-size:.76rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-revenus"]) .month-bar { height:4px;background:var(--bg-soft);border-radius:2px;margin-top:10px;overflow:hidden; }
:where(body[data-page="cabinet-revenus"]) .month-bar-fill { height:100%;border-radius:2px;background:linear-gradient(90deg,#c4aee0,#e8d0a8); }
:where(body[data-page="cabinet-revenus"]) .commission-note { background:rgba(237,215,176,.08);border:1px solid rgba(237,215,176,.2);border-radius:var(--radius-md);padding:14px 18px;font-size:.83rem;color:rgba(200,180,230,.6);margin-bottom:24px;display:flex;align-items:center;gap:10px; }
:where(body[data-page="cabinet-revenus"]) .semaine-bars { display:flex;align-items:flex-end;gap:6px;height:80px;margin-top:16px; }
:where(body[data-page="cabinet-revenus"]) .semaine-bar-wrap { flex:1;display:flex;flex-direction:column;align-items:center;gap:4px; }
:where(body[data-page="cabinet-revenus"]) .semaine-bar { width:100%;border-radius:4px 4px 0 0;background:linear-gradient(180deg,#c4aee0,#9b7ec8);min-height:4px;transition:height .6s ease; }
:where(body[data-page="cabinet-revenus"]) .semaine-bar-label { font-size:.68rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-revenus"]) .semaine-bar-val { font-size:.72rem;color:var(--text-soft); }

/* === Page : cabinet-virements  (pages/cabinet/virements.html) === */
:where(body[data-page="cabinet-virements"]) .dash-topbar { position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px; }
:where(body[data-page="cabinet-virements"]) .dash-topbar h1 { font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body); }
:where(body[data-page="cabinet-virements"]) .dash-content { padding:32px;max-width:1000px; }
:where(body[data-page="cabinet-virements"]) #viewNormal { display:block; }
:where(body[data-page="cabinet-virements"]) #viewConsultation { display:none; }
:where(body[data-page="cabinet-virements"]) .stats-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px; }
:where(body[data-page="cabinet-virements"]) .stat-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-sm);transition:transform .25s,box-shadow .25s; }
:where(body[data-page="cabinet-virements"]) .stat-card:hover { transform:translateY(-2px);box-shadow:var(--shadow-md); }
:where(body[data-page="cabinet-virements"]) .stat-card .stat-icon { font-size:1.2rem;margin-bottom:10px;display:block; }
:where(body[data-page="cabinet-virements"]) .stat-card .stat-val { font-family:var(--font-display);font-size:1.8rem;font-weight:600;color:#3d2e4a;display:block;line-height:1;margin-bottom:4px; }
:where(body[data-page="cabinet-virements"]) .stat-card .stat-lbl { font-size:.76rem;color:var(--text-soft); }
:where(body[data-page="cabinet-virements"]) .dash-block { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm);margin-bottom:20px; }
:where(body[data-page="cabinet-virements"]) .dash-block-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-virements"]) .dash-block-header h3 { font-size:.97rem; }
:where(body[data-page="cabinet-virements"]) .dash-block-header a { font-size:.78rem;color:var(--lavender-deep);text-decoration:underline;text-underline-offset:3px; }
:where(body[data-page="cabinet-virements"]) .pending-list { display:flex;flex-direction:column;gap:10px; }
:where(body[data-page="cabinet-virements"]) .pending-item { display:flex;align-items:center;gap:14px;padding:12px 14px;background:var(--bg-soft);border-radius:var(--radius-md);border:1px solid var(--line);transition:border-color .2s; }
:where(body[data-page="cabinet-virements"]) .pending-item:hover { border-color:rgba(180,155,210,.25); }
:where(body[data-page="cabinet-virements"]) .pending-avatar { width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.6),rgba(237,215,176,.6));display:grid;place-items:center;font-family:var(--font-display);font-size:1rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-virements"]) .pending-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-virements"]) .pending-info strong { display:block;font-size:.85rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-virements"]) .pending-info span { font-size:.75rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-virements"]) .pending-badge { font-size:.72rem;padding:4px 10px;border-radius:999px;background:rgba(237,215,176,.5);color:#7a5a20;font-weight:500;white-space:nowrap; }
:where(body[data-page="cabinet-virements"]) .pending-badge.urgent { background:rgba(238,215,215,.7);color:#7a3535; }
:where(body[data-page="cabinet-virements"]) .btn-repondre { padding:7px 14px;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;font-family:var(--font-body);font-size:.76rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-virements"]) .btn-repondre:hover { transform:translateY(-1px);box-shadow:0 4px 12px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-virements"]) .consult-row { display:flex;align-items:center;gap:14px;padding:11px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-virements"]) .consult-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-virements"]) .consult-row .c-avatar { width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:.9rem;color:#6a4d7a;flex-shrink:0; }
:where(body[data-page="cabinet-virements"]) .consult-row .c-info { flex:1;min-width:0; }
:where(body[data-page="cabinet-virements"]) .consult-row .c-info strong { display:block;font-size:.84rem;font-weight:500;color:var(--text); }
:where(body[data-page="cabinet-virements"]) .consult-row .c-info span { font-size:.74rem;color:var(--text-xsoft); }
:where(body[data-page="cabinet-virements"]) .consult-row .c-amount { font-weight:500;color:var(--text);flex-shrink:0; }
:where(body[data-page="cabinet-virements"]) .badge-mode { font-size:.68rem;padding:2px 8px;border-radius:999px;margin-left:6px; }
:where(body[data-page="cabinet-virements"]) .badge-chat { background:rgba(210,238,210,.6);color:#3a6040; }
:where(body[data-page="cabinet-virements"]) .badge-tel { background:rgba(210,225,238,.6);color:#3a5070; }
:where(body[data-page="cabinet-virements"]) .badge-email { background:rgba(237,215,176,.5);color:#7a5a20; }
:where(body[data-page="cabinet-virements"]) .avis-row { padding:12px 0;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-virements"]) .avis-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-virements"]) .avis-stars { color:var(--gold);font-size:.78rem;letter-spacing:1px;margin-bottom:4px; }
:where(body[data-page="cabinet-virements"]) .avis-text { color:var(--text-soft);line-height:1.6;font-style:italic; }
:where(body[data-page="cabinet-virements"]) .avis-meta { font-size:.73rem;color:var(--text-xsoft);margin-top:4px; }
:where(body[data-page="cabinet-virements"]) .revenus-bar-wrap { display:flex;flex-direction:column;gap:8px;margin-top:8px; }
:where(body[data-page="cabinet-virements"]) .revenu-day { display:flex;align-items:center;gap:10px;font-size:.78rem; }
:where(body[data-page="cabinet-virements"]) .revenu-day .day { color:var(--text-soft);min-width:28px; }
:where(body[data-page="cabinet-virements"]) .revenu-bar-bg { flex:1;height:8px;background:var(--bg-soft);border-radius:4px;overflow:hidden; }
:where(body[data-page="cabinet-virements"]) .revenu-bar-fill { height:100%;border-radius:4px;background:linear-gradient(90deg,#c4aee0,#e8d0a8);transition:width .6s ease; }
:where(body[data-page="cabinet-virements"]) .revenu-day .amount { color:var(--text);font-weight:500;min-width:48px;text-align:right; }
:where(body[data-page="cabinet-virements"]) .consult-active-view {
      background: linear-gradient(160deg,#1a1228 0%,#2a1840 100%);
      border-radius:var(--radius-xl);
      padding:24px;
      color:#e8dff5;
      margin-bottom:20px;
      position:relative;
      overflow:hidden;
    }
:where(body[data-page="cabinet-virements"]) .consult-active-view::before { content:'';position:absolute;top:-60px;right:-60px;width:260px;height:260px;background:radial-gradient(circle,rgba(155,126,200,.2),transparent 70%);border-radius:50%;pointer-events:none; }
:where(body[data-page="cabinet-virements"]) .active-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:16px; }
:where(body[data-page="cabinet-virements"]) .active-title { font-family:var(--font-display);font-size:1.2rem;color:#e8dff5; }
:where(body[data-page="cabinet-virements"]) .active-mode-badge { display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:rgba(155,126,200,.2);border:1px solid rgba(155,126,200,.3);border-radius:999px;font-size:.78rem;color:rgba(200,180,230,.9); }
:where(body[data-page="cabinet-virements"]) .live-dot { width:7px;height:7px;background:#72b872;border-radius:50%;animation:pulseDot 1.5s ease-in-out infinite;flex-shrink:0; }
:where(body[data-page="cabinet-virements"]) .client-info-row { display:flex;align-items:center;gap:14px;margin-bottom:16px;padding:14px;background:rgba(255,255,255,.05);border-radius:14px;border:1px solid rgba(155,126,200,.15); }
:where(body[data-page="cabinet-virements"]) .client-avatar { width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.5),rgba(237,215,176,.5));display:grid;place-items:center;font-family:var(--font-display);font-size:1.3rem;color:#7a5c8a;flex-shrink:0; }
:where(body[data-page="cabinet-virements"]) .client-detail strong { display:block;font-size:1rem;color:#e8dff5;margin-bottom:3px; }
:where(body[data-page="cabinet-virements"]) .client-detail span { font-size:.8rem;color:rgba(200,180,230,.6); }
:where(body[data-page="cabinet-virements"]) .realtime-stats { display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:16px; }
:where(body[data-page="cabinet-virements"]) .rt-stat { background:rgba(255,255,255,.05);border:1px solid rgba(155,126,200,.15);border-radius:12px;padding:12px;text-align:center; }
:where(body[data-page="cabinet-virements"]) .rt-stat .rt-val { font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#e8dff5;display:block;line-height:1;margin-bottom:3px; }
:where(body[data-page="cabinet-virements"]) .rt-stat .rt-lbl { font-size:.68rem;color:rgba(200,180,230,.5); }
:where(body[data-page="cabinet-virements"]) .rt-stat .rt-val.warn { color:#e8d0a8; }
:where(body[data-page="cabinet-virements"]) .rt-stat .rt-val.danger { color:#f0a0a0; }
:where(body[data-page="cabinet-virements"]) .credits-client-bar { margin-bottom:14px; }
:where(body[data-page="cabinet-virements"]) .credits-client-label { display:flex;justify-content:space-between;font-size:.78rem;color:rgba(200,180,230,.6);margin-bottom:6px; }
:where(body[data-page="cabinet-virements"]) .credits-bar-bg { height:6px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden; }
:where(body[data-page="cabinet-virements"]) .credits-bar-fill { height:100%;border-radius:3px;transition:width .5s ease,background .5s; background:linear-gradient(90deg,#9b7ec8,#c8a860); }
:where(body[data-page="cabinet-virements"]) .credits-bar-fill.warn { background:linear-gradient(90deg,#c8a860,#e89060); }
:where(body[data-page="cabinet-virements"]) .credits-bar-fill.danger { background:#e08080; }
:where(body[data-page="cabinet-virements"]) .consult-chat-shell {
      margin: 14px 0 12px;
      border: 1px solid rgba(155,126,200,.15);
      border-radius: 18px;
      background: rgba(10, 6, 20, .22);
      overflow: hidden;
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-header {
      display:flex;align-items:center;justify-content:space-between;gap:12px;
      padding:12px 16px;
      background: rgba(255,255,255,.04);
      border-bottom:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-header strong {
      font-size:.84rem;
      color:#e8dff5;
      font-weight:500;
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-header span {
      font-size:.72rem;
      color:rgba(200,180,230,.5);
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-messages {
      height: 170px;
      max-height: 24vh;
      min-height: 140px;
      overflow-y: auto;
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      scrollbar-width: thin;
      scrollbar-color: rgba(155,126,200,.2) transparent;
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-messages::-webkit-scrollbar { width:4px; }
:where(body[data-page="cabinet-virements"]) .consult-chat-messages::-webkit-scrollbar-thumb { background:rgba(155,126,200,.25); border-radius:2px; }
:where(body[data-page="cabinet-virements"]) .chat-row {
      display:flex;
      max-width: 82%;
      gap:10px;
      align-items:flex-end;
      animation: chatSlideIn .22s ease;
    }
:where(body[data-page="cabinet-virements"]) .chat-row.from-client { align-self:flex-start; }
:where(body[data-page="cabinet-virements"]) .chat-row.from-voyant { align-self:flex-end; flex-direction:row-reverse; }
:where(body[data-page="cabinet-virements"]) .chat-avatar {
      width:32px;height:32px;border-radius:50%;
      display:grid;place-items:center;
      flex-shrink:0;
      font-family:var(--font-display);
      font-size:.82rem;
      color:#3d2a4e;
      background:linear-gradient(135deg,rgba(210,190,238,.85),rgba(237,215,176,.85));
    }
:where(body[data-page="cabinet-virements"]) .chat-row.from-voyant .chat-avatar {
      color:#e8dff5;
      background:rgba(155,126,200,.32);
    }
:where(body[data-page="cabinet-virements"]) .chat-bubble {
      padding:11px 14px;
      border-radius:16px;
      line-height:1.55;
      font-size:.86rem;
      border:1px solid rgba(155,126,200,.16);
      word-break:break-word;
      white-space:pre-wrap;
    }
:where(body[data-page="cabinet-virements"]) .chat-row.from-client .chat-bubble {
      background:rgba(255,255,255,.07);
      color:#f2edf8;
      border-bottom-left-radius:5px;
    }
:where(body[data-page="cabinet-virements"]) .chat-row.from-voyant .chat-bubble {
      background:linear-gradient(135deg,rgba(155,126,200,.26),rgba(200,168,96,.18));
      color:#fffaf0;
      border-bottom-right-radius:5px;
    }
:where(body[data-page="cabinet-virements"]) .chat-meta {
      margin-top:4px;
      font-size:.66rem;
      color:rgba(200,180,230,.42);
    }
:where(body[data-page="cabinet-virements"]) .chat-system {
      align-self:center;
      padding:6px 12px;
      border-radius:999px;
      background:rgba(255,255,255,.06);
      color:rgba(200,180,230,.58);
      font-size:.72rem;
      border:1px solid rgba(155,126,200,.12);
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-compose {
      padding: 12px 14px;
      border-top:1px solid rgba(155,126,200,.12);
      display:flex;
      gap:10px;
      align-items:flex-end;
      background: rgba(255,255,255,.03);
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-compose textarea {
      flex:1;
      min-height:42px;
      max-height:96px;
      resize:vertical;
      border-radius:14px;
      border:1px solid rgba(155,126,200,.2);
      background:rgba(255,255,255,.06);
      color:#f0eaf8;
      padding:12px 14px;
      outline:none;
      font-family:var(--font-body);
      font-size:.84rem;
      line-height:1.5;
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-compose textarea:focus {
      border-color: rgba(155,126,200,.45);
      box-shadow:0 0 0 3px rgba(155,126,200,.1);
    }
:where(body[data-page="cabinet-virements"]) .consult-chat-compose textarea::placeholder { color:rgba(200,180,230,.34); }
:where(body[data-page="cabinet-virements"]) .btn-send-chat {
      min-width:104px;
      height:42px;
      border:none;
      border-radius:999px;
      background:linear-gradient(135deg,#9b7ec8,#c8a860);
      color:#2c1d38;
      font-family:var(--font-body);
      font-size:.82rem;
      font-weight:600;
      cursor:pointer;
      transition:transform .2s, opacity .2s, box-shadow .2s;
      box-shadow:0 4px 16px rgba(155,126,200,.25);
    }
:where(body[data-page="cabinet-virements"]) .btn-send-chat:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-virements"]) .btn-send-chat:disabled { opacity:.4; cursor:not-allowed; transform:none; box-shadow:none; }
:where(body[data-page="cabinet-virements"]) .consult-actions-bar {
      display:grid;
      grid-template-columns:minmax(0,1fr) 260px;
      gap:14px;
      align-items:end;
      margin-top:12px;
    }
:where(body[data-page="cabinet-virements"]) .session-notes textarea {
      width:100%;padding:10px 12px;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(155,126,200,.2);
      border-radius:12px;
      font-family:var(--font-body);font-size:.82rem;
      color:#f0eaf8;outline:none;
      resize:vertical;min-height:58px;max-height:92px;
      transition:border-color .2s;
    }
:where(body[data-page="cabinet-virements"]) .session-notes textarea:focus { border-color:rgba(155,126,200,.45); }
:where(body[data-page="cabinet-virements"]) .session-notes textarea::placeholder { color:rgba(200,180,230,.3); }
:where(body[data-page="cabinet-virements"]) .session-notes label { display:block;font-size:.76rem;color:rgba(200,180,230,.5);margin-bottom:7px;letter-spacing:.03em;text-transform:uppercase; }
:where(body[data-page="cabinet-virements"]) .btn-end-consultation {
      width:100%;padding:12px 16px;border-radius:999px;
      background:rgba(200,80,80,.2);
      border:1px solid rgba(200,80,80,.3);
      color:#f0a0a0;
      font-family:var(--font-body);font-size:.9rem;font-weight:500;
      cursor:pointer;transition:background .2s,border-color .2s;
      margin-top:0;
      align-self:end;
      position:sticky;
      bottom:10px;
      box-shadow:0 8px 24px rgba(0,0,0,.18);
    }
:where(body[data-page="cabinet-virements"]) .btn-end-consultation:hover { background:rgba(200,80,80,.35);border-color:rgba(200,80,80,.5); }
:where(body[data-page="cabinet-virements"]) .client-low-credits {
      display:none;align-items:center;gap:8px;
      padding:10px 14px;border-radius:10px;
      background:rgba(200,120,40,.2);border:1px solid rgba(200,120,40,.3);
      color:#e8c090;font-size:.82rem;margin-bottom:16px;
    }
:where(body[data-page="cabinet-virements"]) .client-low-credits.visible { display:flex; }
:where(body[data-page="cabinet-virements"]) .incoming-requests-block { display:none; margin-bottom:20px; }
:where(body[data-page="cabinet-virements"]) .incoming-requests-block.visible { display:block; }
:where(body[data-page="cabinet-virements"]) .incoming-requests-list { display:flex; flex-direction:column; gap:12px; }
:where(body[data-page="cabinet-virements"]) .incoming-request-card {
      display:grid;
      grid-template-columns:minmax(0,1fr) auto;
      gap:14px;
      align-items:center;
      padding:16px 18px;
      border-radius:16px;
      background:linear-gradient(135deg,rgba(155,126,200,.16),rgba(232,208,168,.14));
      border:1px solid rgba(155,126,200,.2);
      box-shadow:var(--shadow-sm);
    }
:where(body[data-page="cabinet-virements"]) .incoming-request-main strong { display:block; font-size:.96rem; color:var(--text); margin-bottom:4px; }
:where(body[data-page="cabinet-virements"]) .incoming-request-meta { display:flex; flex-wrap:wrap; gap:8px; font-size:.76rem; color:var(--text-soft); }
:where(body[data-page="cabinet-virements"]) .incoming-pill {
      display:inline-flex; align-items:center; gap:6px;
      padding:5px 10px; border-radius:999px;
      background:rgba(255,255,255,.55); border:1px solid rgba(155,126,200,.12);
      color:#5a446e; font-weight:500;
    }
:where(body[data-page="cabinet-virements"]) .incoming-request-actions { display:flex; gap:10px; align-items:center; }
:where(body[data-page="cabinet-virements"]) .btn-accept-request, :where(body[data-page="cabinet-virements"]) .btn-reject-request {
      border:none; border-radius:999px; padding:10px 16px; cursor:pointer;
      font-family:var(--font-body); font-size:.78rem; font-weight:600;
      transition:transform .18s ease, opacity .18s ease, box-shadow .18s ease;
      white-space:nowrap;
    }
:where(body[data-page="cabinet-virements"]) .btn-accept-request { background:linear-gradient(135deg,#c4aee0,#e8d0a8); color:#3d2a4e; box-shadow:0 6px 18px rgba(155,126,200,.18); }
:where(body[data-page="cabinet-virements"]) .btn-reject-request { background:rgba(200,80,80,.12); color:#9c4d4d; border:1px solid rgba(200,80,80,.2); }
:where(body[data-page="cabinet-virements"]) .btn-accept-request:hover, :where(body[data-page="cabinet-virements"]) .btn-reject-request:hover { transform:translateY(-1px); }
:where(body[data-page="cabinet-virements"]) .dashboard-toast-stack {
      position:fixed; top:18px; right:18px; z-index:120;
      display:flex; flex-direction:column; gap:10px; pointer-events:none;
    }
:where(body[data-page="cabinet-virements"]) .dashboard-toast {
      min-width:280px; max-width:360px; padding:14px 16px;
      border-radius:16px; color:#f7f1fb;
      background:rgba(28,19,43,.95); border:1px solid rgba(155,126,200,.24);
      box-shadow:0 20px 40px rgba(0,0,0,.22);
      opacity:0; transform:translateY(-8px);
      animation:toastIn .24s ease forwards;
    }
:where(body[data-page="cabinet-virements"]) .dashboard-toast strong { display:block; font-size:.84rem; margin-bottom:4px; color:#fff; }
:where(body[data-page="cabinet-virements"]) .dashboard-toast span { display:block; font-size:.76rem; color:rgba(232,223,245,.72); line-height:1.45; }
@media(max-width:1024px) { .stats-grid{grid-template-columns:repeat(2,1fr);} .realtime-stats{grid-template-columns:repeat(2,1fr);} }
@media(max-width:900px) {
      .consult-active-view { padding:22px; }
      .consult-chat-messages { height: 210px; max-height: 28vh; }
    }
@media(max-width:768px) {
      .dashboard-layout{grid-template-columns:1fr;}
      
      
      .dash-content{padding:20px 16px;}
      .dash-topbar{padding:0 16px;}
    }
@media(max-width:480px) { .stats-grid{grid-template-columns:1fr 1fr;} .realtime-stats{grid-template-columns:1fr 1fr;} }
:where(body[data-page="cabinet-virements"]) .virement-hero { background:linear-gradient(135deg,#1e1430,#2a1840);border:1px solid rgba(155,126,200,.2);border-radius:var(--radius-xl);padding:32px;margin-bottom:24px;display:flex;gap:40px;align-items:center; }
:where(body[data-page="cabinet-virements"]) .solde-dispo { font-family:var(--font-display);font-size:3.2rem;font-weight:600;color:#e8dff5; }
:where(body[data-page="cabinet-virements"]) .solde-lbl { font-size:.82rem;color:rgba(200,180,230,.5);margin-top:4px; }
:where(body[data-page="cabinet-virements"]) .virement-info { color:rgba(200,180,230,.5);font-size:.84rem;line-height:1.7; }
:where(body[data-page="cabinet-virements"]) .virement-info strong { color:rgba(200,180,230,.8); }
:where(body[data-page="cabinet-virements"]) .rib-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px 28px;margin-bottom:24px;box-shadow:var(--shadow-sm); }
:where(body[data-page="cabinet-virements"]) .rib-card h3 { font-size:1rem;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--line); }
:where(body[data-page="cabinet-virements"]) .rib-field { display:flex;align-items:center;gap:12px;margin-bottom:12px; }
:where(body[data-page="cabinet-virements"]) .rib-field label { font-size:.8rem;font-weight:500;color:var(--text);min-width:90px;flex-shrink:0; }
:where(body[data-page="cabinet-virements"]) .rib-field input { flex:1;padding:10px 14px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--bg-soft);font-family:var(--font-body);font-size:.87rem;color:var(--text);outline:none;transition:border-color .2s; }
:where(body[data-page="cabinet-virements"]) .rib-field input:focus { border-color:var(--lavender-mid); }
:where(body[data-page="cabinet-virements"]) .rib-field input:disabled { opacity:.5;cursor:not-allowed; }
:where(body[data-page="cabinet-virements"]) .btn-save-rib { padding:11px 24px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;border-radius:999px;font-family:var(--font-body);font-size:.85rem;font-weight:500;cursor:pointer;transition:transform .2s,box-shadow .2s; }
:where(body[data-page="cabinet-virements"]) .btn-save-rib:hover { transform:translateY(-1px);box-shadow:0 8px 20px rgba(140,110,170,.2); }
:where(body[data-page="cabinet-virements"]) .virement-history { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm); }
:where(body[data-page="cabinet-virements"]) .vh-header { padding:16px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center; }
:where(body[data-page="cabinet-virements"]) .vh-header h3 { font-size:.95rem; }
:where(body[data-page="cabinet-virements"]) .vh-row { display:flex;align-items:center;gap:16px;padding:14px 20px;border-bottom:1px solid var(--line);font-size:.84rem; }
:where(body[data-page="cabinet-virements"]) .vh-row:last-child { border-bottom:none; }
:where(body[data-page="cabinet-virements"]) .vh-date { color:var(--text-soft);min-width:100px;flex-shrink:0; }
:where(body[data-page="cabinet-virements"]) .vh-amount { font-weight:600;color:#3d2e4a;margin-left:auto; }
:where(body[data-page="cabinet-virements"]) .vh-status { padding:3px 10px;border-radius:999px;font-size:.72rem;font-weight:500; }
:where(body[data-page="cabinet-virements"]) .vh-status.vire { background:rgba(210,238,210,.6);color:#3a6040; }
:where(body[data-page="cabinet-virements"]) .vh-status.en-cours { background:rgba(237,215,176,.5);color:#7a5a20; }
:where(body[data-page="cabinet-virements"]) .coming-soon { text-align:center;padding:32px;color:var(--text-soft); }
:where(body[data-page="cabinet-virements"]) .coming-soon .cs-icon { font-size:2rem;margin-bottom:10px; }
:where(body[data-page="cabinet-virements"]) .coming-soon p { font-size:.88rem;line-height:1.7; }
:where(body[data-page="cabinet-virements"]) .info-banner { background:rgba(196,174,224,.08);border:1px solid rgba(196,174,224,.2);border-radius:var(--radius-md);padding:14px 18px;font-size:.84rem;color:var(--text-soft);margin-bottom:20px;display:flex;gap:10px;align-items:flex-start; }
:where(body[data-page="cabinet-virements"]) .virement-actions { margin-top:18px;display:flex;gap:12px;flex-wrap:wrap; }
:where(body[data-page="cabinet-virements"]) .btn-request-payout { padding:12px 22px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;border:none;border-radius:999px;font-family:var(--font-body);font-size:.85rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 8px 20px rgba(140,110,170,.18); }
:where(body[data-page="cabinet-virements"]) .btn-request-payout:hover { transform:translateY(-1px);box-shadow:0 10px 24px rgba(140,110,170,.24); }
:where(body[data-page="cabinet-virements"]) .modal-overlay { position:fixed;inset:0;background:rgba(20,12,32,.55);backdrop-filter:blur(4px);display:none;align-items:center;justify-content:center;padding:20px;z-index:140; }
:where(body[data-page="cabinet-virements"]) .modal-overlay.open { display:flex; }
:where(body[data-page="cabinet-virements"]) .modal-card { width:min(100%,460px);background:var(--surface);border:1px solid var(--line);border-radius:24px;box-shadow:0 30px 60px rgba(0,0,0,.22);padding:24px; }
:where(body[data-page="cabinet-virements"]) .modal-card h3 { font-size:1rem;margin-bottom:6px;color:var(--text); }
:where(body[data-page="cabinet-virements"]) .modal-card p { font-size:.83rem;color:var(--text-soft);line-height:1.65;margin-bottom:18px; }
:where(body[data-page="cabinet-virements"]) .modal-field { margin-bottom:16px; }
:where(body[data-page="cabinet-virements"]) .modal-field label { display:block;font-size:.8rem;font-weight:500;color:var(--text);margin-bottom:8px; }
:where(body[data-page="cabinet-virements"]) .modal-field input { width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--bg-soft);font-family:var(--font-body);font-size:.92rem;color:var(--text);outline:none;transition:border-color .2s,box-shadow .2s; }
:where(body[data-page="cabinet-virements"]) .modal-field input:focus { border-color:rgba(180,155,210,.5);box-shadow:0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="cabinet-virements"]) .modal-help { font-size:.76rem;color:var(--text-xsoft);margin-top:6px; }
:where(body[data-page="cabinet-virements"]) .modal-alert { min-height:20px;font-size:.8rem;margin-bottom:10px; }
:where(body[data-page="cabinet-virements"]) .modal-actions { display:flex;justify-content:flex-end;gap:10px;margin-top:6px; }
:where(body[data-page="cabinet-virements"]) .btn-modal-secondary { padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--text);font-family:var(--font-body);font-size:.82rem;cursor:pointer; }
:where(body[data-page="cabinet-virements"]) .btn-modal-primary { padding:10px 18px;border:none;border-radius:999px;background:linear-gradient(135deg,#c4aee0,#e8d0a8);color:#3d2a4e;font-family:var(--font-body);font-size:.82rem;font-weight:600;cursor:pointer; }

/* === Page : contenu-horoscope  (pages/contenu/horoscope.html) === */
:where(body[data-page="contenu-horoscope"]) .horoscope-hero {
      padding: 72px 0 46px;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-horoscope"]) .horoscope-hero::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      background:
        radial-gradient(circle at 12% 22%, rgba(217, 204, 235, 0.40), transparent 26%),
        radial-gradient(circle at 88% 14%, rgba(201, 168, 108, 0.18), transparent 22%),
        radial-gradient(circle at 78% 78%, rgba(240, 224, 214, 0.45), transparent 22%);
    }
:where(body[data-page="contenu-horoscope"]) .horoscope-hero-grid {
      position: relative;
      z-index: 1;
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 28px;
      align-items: start;
    }
:where(body[data-page="contenu-horoscope"]) .hero-copy-card, :where(body[data-page="contenu-horoscope"]) .cta-side-card, :where(body[data-page="contenu-horoscope"]) .astro-card, :where(body[data-page="contenu-horoscope"]) .insight-card, :where(body[data-page="contenu-horoscope"]) .sign-nav-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="contenu-horoscope"]) .hero-copy-card {
      padding: 34px;
    }
:where(body[data-page="contenu-horoscope"]) .hero-copy-card h1 {
      font-size: clamp(2rem, 4vw, 3.2rem);
      margin-bottom: 16px;
    }
:where(body[data-page="contenu-horoscope"]) .hero-copy-card p {
      color: var(--text-soft);
      font-size: 0.94rem;
      max-width: 66ch;
    }
:where(body[data-page="contenu-horoscope"]) .hero-meta-row {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin: 18px 0 22px;
    }
:where(body[data-page="contenu-horoscope"]) .hero-pill {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 8px 14px;
      border-radius: 999px;
      background: var(--surface-2);
      border: 1px solid var(--line);
      color: var(--text-soft);
      font-size: 0.8rem;
    }
:where(body[data-page="contenu-horoscope"]) .cta-side-card {
      padding: 28px;
      background: linear-gradient(180deg, rgba(245, 237, 230, 0.72), rgba(255, 255, 255, 0.96));
    }
:where(body[data-page="contenu-horoscope"]) .cta-side-card h2 {
      font-size: 1.6rem;
      margin-bottom: 12px;
      text-align: center;
    }
:where(body[data-page="contenu-horoscope"]) .cta-side-card p {
      color: var(--text-soft);
      font-size: 0.9rem;
      text-align: center;
      margin-bottom: 22px;
    }
:where(body[data-page="contenu-horoscope"]) .experts-row {
      display: flex;
      justify-content: center;
      margin-bottom: 20px;
    }
:where(body[data-page="contenu-horoscope"]) .expert-bubbles {
      display: flex;
      align-items: center;
      padding-left: 12px;
    }
:where(body[data-page="contenu-horoscope"]) .expert-bubble {
      width: 68px;
      height: 68px;
      border-radius: 50%;
      overflow: hidden;
      border: 3px solid rgba(255,255,255,0.85);
      box-shadow: 0 10px 22px rgba(100, 80, 120, 0.12);
      margin-left: -12px;
      background: linear-gradient(135deg, #e9dbf7, #f7ead4);
      display: grid;
      place-items: center;
      color: #6f5688;
      font-family: var(--font-display);
      font-size: 1.2rem;
    }
:where(body[data-page="contenu-horoscope"]) .expert-bubble img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
:where(body[data-page="contenu-horoscope"]) .cta-side-card .btn {
      width: 100%;
      justify-content: center;
    }
:where(body[data-page="contenu-horoscope"]) .sign-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 18px;
    }
:where(body[data-page="contenu-horoscope"]) .sign-card {
      display: block;
      padding: 24px 22px;
      min-height: 220px;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-horoscope"]) .sign-card::before {
      content: "";
      position: absolute;
      top: -30px;
      right: -30px;
      width: 120px;
      height: 120px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(217, 204, 235, 0.48), transparent 70%);
      pointer-events: none;
    }
:where(body[data-page="contenu-horoscope"]) .sign-symbol {
      width: 56px;
      height: 56px;
      display: grid;
      place-items: center;
      border-radius: 50%;
      margin-bottom: 16px;
      font-size: 1.5rem;
      background: linear-gradient(135deg, rgba(210, 190, 238, 0.45), rgba(237, 215, 176, 0.55));
      color: #674c83;
    }
:where(body[data-page="contenu-horoscope"]) .sign-card h3 {
      font-size: 1.25rem;
      margin-bottom: 6px;
    }
:where(body[data-page="contenu-horoscope"]) .sign-dates {
      color: var(--text-xsoft);
      font-size: 0.76rem;
      margin-bottom: 12px;
    }
:where(body[data-page="contenu-horoscope"]) .sign-card p {
      color: var(--text-soft);
      font-size: 0.87rem;
      line-height: 1.65;
      margin-bottom: 16px;
    }
:where(body[data-page="contenu-horoscope"]) .sign-link {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 0.82rem;
      color: #6f5688;
      font-weight: 600;
    }
:where(body[data-page="contenu-horoscope"]) .detail-layout {
      display: grid;
      grid-template-columns: 1.55fr 0.9fr;
      gap: 22px;
      align-items: start;
    }
:where(body[data-page="contenu-horoscope"]) .detail-main-card {
      padding: 34px;
    }
:where(body[data-page="contenu-horoscope"]) .detail-main-card h1 {
      font-size: clamp(2rem, 4vw, 3rem);
      margin-bottom: 12px;
    }
:where(body[data-page="contenu-horoscope"]) .detail-main-card .detail-subtitle {
      font-size: 1.2rem;
      color: #6f5688;
      font-weight: 700;
      margin-bottom: 18px;
    }
:where(body[data-page="contenu-horoscope"]) .detail-main-card .intro {
      color: var(--text-soft);
      font-size: 0.95rem;
      line-height: 1.8;
      max-width: 72ch;
    }
:where(body[data-page="contenu-horoscope"]) .horoscope-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 18px;
      margin-top: 24px;
    }
:where(body[data-page="contenu-horoscope"]) .horoscope-grid {
      align-items: stretch;
    }
:where(body[data-page="contenu-horoscope"]) .astro-card {
      padding: 22px;
      min-height: 230px;
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      gap: 14px;
    }
:where(body[data-page="contenu-horoscope"]) .astro-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin-bottom: 14px;
    }
:where(body[data-page="contenu-horoscope"]) .astro-card h3 {
      font-size: 1.15rem;
      color: #624786;
      margin: 0;
    }
:where(body[data-page="contenu-horoscope"]) .rating {
      color: var(--gold);
      font-size: 0.95rem;
      letter-spacing: 2px;
      white-space: nowrap;
    }
:where(body[data-page="contenu-horoscope"]) .astro-card p {
      color: var(--text-soft);
      font-size: 0.9rem;
      line-height: 1.72;
      margin: 0;
    }
:where(body[data-page="contenu-horoscope"]) .astro-card .astro-text {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 5;
      overflow: hidden;
    }
:where(body[data-page="contenu-horoscope"]) .astro-card.expanded .astro-text {
      display: block;
      -webkit-line-clamp: unset;
      overflow: visible;
    }
:where(body[data-page="contenu-horoscope"]) .astro-toggle {
      border: none;
      background: transparent;
      padding: 0;
      margin-top: auto;
      color: #6f5688;
      font-size: 0.82rem;
      font-weight: 700;
      cursor: pointer;
      align-self: flex-start;
    }
:where(body[data-page="contenu-horoscope"]) .astro-toggle:hover {
      text-decoration: underline;
    }
:where(body[data-page="contenu-horoscope"]) .insight-stack {
      display: flex;
      flex-direction: column;
      gap: 18px;
    }
:where(body[data-page="contenu-horoscope"]) .insight-card {
      padding: 24px;
    }
:where(body[data-page="contenu-horoscope"]) .insight-card h3 {
      font-size: 1.2rem;
      margin-bottom: 10px;
      color: #624786;
    }
:where(body[data-page="contenu-horoscope"]) .insight-card p, :where(body[data-page="contenu-horoscope"]) .insight-card li {
      color: var(--text-soft);
      font-size: 0.9rem;
      line-height: 1.7;
    }
:where(body[data-page="contenu-horoscope"]) .mini-stat {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 11px 0;
      border-bottom: 1px solid var(--line);
      font-size: 0.88rem;
      color: var(--text-soft);
      gap: 16px;
    }
:where(body[data-page="contenu-horoscope"]) .mini-stat:last-child {
      border-bottom: none;
      padding-bottom: 0;
    }
:where(body[data-page="contenu-horoscope"]) .mini-stat strong {
      color: var(--text);
      font-weight: 700;
      text-align: right;
    }
:where(body[data-page="contenu-horoscope"]) .sign-nav-card {
      margin-top: 22px;
      padding: 26px;
    }
:where(body[data-page="contenu-horoscope"]) .sign-nav-card h2 {
      font-size: 1.5rem;
      margin-bottom: 16px;
      text-align: center;
    }
:where(body[data-page="contenu-horoscope"]) .sign-mini-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 12px;
    }
:where(body[data-page="contenu-horoscope"]) .sign-mini-link {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 7px;
      padding: 14px 10px;
      border-radius: 18px;
      border: 1px solid var(--line);
      background: var(--surface-2);
      transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
      text-align: center;
      min-height: 92px;
    }
:where(body[data-page="contenu-horoscope"]) .sign-mini-link:hover, :where(body[data-page="contenu-horoscope"]) .sign-mini-link.active {
      transform: translateY(-2px);
      box-shadow: var(--shadow-sm);
      border-color: rgba(155, 126, 200, 0.28);
    }
:where(body[data-page="contenu-horoscope"]) .sign-mini-link .mini-symbol {
      font-size: 1.2rem;
      color: #6f5688;
    }
:where(body[data-page="contenu-horoscope"]) .sign-mini-link span:last-child {
      font-size: 0.8rem;
      color: var(--text-soft);
      font-weight: 600;
    }
:where(body[data-page="contenu-horoscope"]) .loading-box, :where(body[data-page="contenu-horoscope"]) .error-box {
      padding: 18px 20px;
      border-radius: var(--radius-md);
      font-size: 0.9rem;
      margin-top: 18px;
    }
:where(body[data-page="contenu-horoscope"]) .loading-box {
      background: rgba(217, 204, 235, 0.28);
      color: #6d5583;
    }
:where(body[data-page="contenu-horoscope"]) .error-box {
      background: rgba(255, 232, 232, 0.95);
      border: 1px solid rgba(215, 160, 160, 0.35);
      color: #8b5050;
    }
:where(body[data-page="contenu-horoscope"]) .hidden {
      display: none !important;
    }
:where(body[data-page="contenu-horoscope"]) .seo-copy-section {
      padding-top: 0;
    }
:where(body[data-page="contenu-horoscope"]) .seo-copy-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-xl);
      box-shadow: var(--shadow-sm);
      padding: 30px;
    }
:where(body[data-page="contenu-horoscope"]) .seo-copy-card h2, :where(body[data-page="contenu-horoscope"]) .seo-copy-card h3 {
      margin-bottom: 12px;
    }
:where(body[data-page="contenu-horoscope"]) .seo-copy-card p {
      color: var(--text-soft);
      font-size: 0.95rem;
      line-height: 1.85;
      margin-bottom: 16px;
      max-width: 78ch;
    }
:where(body[data-page="contenu-horoscope"]) .seo-copy-grid {
      display: grid;
      grid-template-columns: 1.1fr 0.9fr;
      gap: 20px;
      align-items: start;
    }
:where(body[data-page="contenu-horoscope"]) .seo-highlight-list {
      display: grid;
      gap: 14px;
    }
:where(body[data-page="contenu-horoscope"]) .seo-highlight-item {
      padding: 18px 18px;
      border: 1px solid var(--line);
      border-radius: 20px;
      background: var(--surface-2);
    }
:where(body[data-page="contenu-horoscope"]) .seo-highlight-item h3 {
      font-size: 1rem;
      color: #624786;
      margin-bottom: 8px;
    }
:where(body[data-page="contenu-horoscope"]) .seo-highlight-item p {
      margin: 0;
      font-size: 0.88rem;
      line-height: 1.7;
    }
:where(body[data-page="contenu-horoscope"]) .breadcrumb-nav {
      margin-bottom: 16px;
      font-size: 0.82rem;
      color: var(--text-soft);
    }
:where(body[data-page="contenu-horoscope"]) .breadcrumb-nav a {
      color: #6f5688;
    }
:where(body[data-page="contenu-horoscope"]) .detail-seo-copy {
      margin-top: 22px;
    }
:where(body[data-page="contenu-horoscope"]) .detail-seo-copy .seo-copy-card {
      padding: 28px;
    }
:where(body[data-page="contenu-horoscope"]) .detail-seo-copy h2 {
      font-size: 1.55rem;
      margin-bottom: 14px;
    }
:where(body[data-page="contenu-horoscope"]) .detail-seo-copy h3 {
      font-size: 1.02rem;
      color: #624786;
    }
:where(body[data-page="contenu-horoscope"]) .micro-links {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 18px;
    }
:where(body[data-page="contenu-horoscope"]) .micro-links a {
      display: inline-flex;
      align-items: center;
      padding: 8px 14px;
      border-radius: 999px;
      background: var(--surface-2);
      border: 1px solid var(--line);
      color: #6f5688;
      font-size: 0.8rem;
      font-weight: 600;
    }
@media (max-width: 1100px) {
  :where(body[data-page="contenu-horoscope"]) .horoscope-hero-grid, :where(body[data-page="contenu-horoscope"]) .detail-layout {
        grid-template-columns: 1fr;
      }
  :where(body[data-page="contenu-horoscope"]) .sign-grid, :where(body[data-page="contenu-horoscope"]) .horoscope-grid, :where(body[data-page="contenu-horoscope"]) .sign-mini-grid, :where(body[data-page="contenu-horoscope"]) .seo-copy-grid {
        grid-template-columns: repeat(2, 1fr);
      }
}
@media (max-width: 720px) {
  :where(body[data-page="contenu-horoscope"]) .horoscope-hero {
        padding: 42px 0 24px;
      }
  :where(body[data-page="contenu-horoscope"]) .hero-copy-card, :where(body[data-page="contenu-horoscope"]) .detail-main-card, :where(body[data-page="contenu-horoscope"]) .cta-side-card, :where(body[data-page="contenu-horoscope"]) .astro-card, :where(body[data-page="contenu-horoscope"]) .insight-card, :where(body[data-page="contenu-horoscope"]) .sign-nav-card {
        padding: 22px;
        border-radius: var(--radius-lg);
      }
  :where(body[data-page="contenu-horoscope"]) .sign-grid, :where(body[data-page="contenu-horoscope"]) .horoscope-grid, :where(body[data-page="contenu-horoscope"]) .sign-mini-grid, :where(body[data-page="contenu-horoscope"]) .seo-copy-grid {
        grid-template-columns: 1fr;
      }
  :where(body[data-page="contenu-horoscope"]) .expert-bubble {
        width: 58px;
        height: 58px;
      }
}

/* === Page : contenu-tarot_amour  (pages/contenu/tarot_amour.html) === */
:where(body[data-page="contenu-tarot_amour"]) .tarot-hero {
      text-align: center;
      padding: 32px 0 24px;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-hero::before {
      content: '';
      position: absolute;
      top: -100px; right: -100px;
      width: 420px; height: 420px;
      background: radial-gradient(circle, rgba(195,165,228,.22), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-hero::after {
      content: '';
      position: absolute;
      bottom: -60px; left: -80px;
      width: 300px; height: 300px;
      background: radial-gradient(circle, rgba(237,215,176,.18), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-hero h1 {
      font-size: clamp(1.6rem, 3.5vw, 2.4rem);
      margin-bottom: 14px;
      position: relative;
      z-index: 1;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-hero h1 em { font-style: italic; color: var(--lavender-deep); }
:where(body[data-page="contenu-tarot_amour"]) .tarot-hero p {
      color: var(--text-soft);
      font-size: .97rem;
      max-width: 54ch;
      margin: 0 auto;
      line-height: 1.75;
      position: relative;
      z-index: 1;
    }
:where(body[data-page="contenu-tarot_amour"]) .panel {
      background: rgba(255,255,255,.92);
      border: 1px solid var(--line);
      border-radius: var(--radius-xl);
      padding: 20px 22px;
      box-shadow: var(--shadow-md);
      margin-bottom: 32px;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_amour"]) .panel > h2 {
      font-size: 1.3rem;
      margin-bottom: 28px;
    }
:where(body[data-page="contenu-tarot_amour"]) .cards-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin-bottom: 24px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-card {
      perspective: 900px;
      cursor: pointer;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-card-inner {
      position: relative;
      width: 100%;
      aspect-ratio: 0.75;
      transform-style: preserve-3d;
      transition: transform .7s cubic-bezier(.4,0,.2,1);
      border-radius: 18px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-card.revealed .tarot-card-inner {
      transform: rotateY(180deg);
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-face {
      position: absolute;
      inset: 0;
      border-radius: 18px;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 20px 16px;
      gap: 10px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-back {
      background: linear-gradient(160deg, #e8d8f8 0%, #d0c0ee 50%, #e8d0a8 100%);
      border: 1px solid rgba(170,140,210,.2);
      box-shadow: 0 10px 30px rgba(140,110,170,.15);
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-back::before {
      content: '';
      position: absolute;
      inset: 8px;
      border: 1px solid rgba(200,170,240,.3);
      border-radius: 12px;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-back .card-symbol {
      font-size: 2rem;
      color: rgba(130,100,170,.5);
      margin-bottom: 6px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-back .card-title {
      font-family: var(--font-display);
      font-size: 1.1rem;
      font-weight: 600;
      color: #5a4070;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-back .card-text {
      font-size: .76rem;
      color: rgba(90,64,112,.6);
      line-height: 1.55;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-front {
      background: linear-gradient(160deg, #fffbf4 0%, #f8f0ff 100%);
      border: 1px solid rgba(180,155,210,.15);
      box-shadow: 0 12px 36px rgba(140,110,170,.13);
      transform: rotateY(180deg);
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-front .card-symbol { font-size: 2.6rem; line-height: 1; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-front .card-label {
      font-size: .7rem;
      font-weight: 500;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-xsoft);
      background: rgba(210,190,238,.25);
      padding: 3px 10px;
      border-radius: 999px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-front .card-title {
      font-family: var(--font-display);
      font-size: 1.05rem;
      font-weight: 600;
      color: #3d2e4a;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-front .card-text {
      font-size: .78rem;
      color: var(--text-soft);
      line-height: 1.6;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_amour"]) .cta-wrap {
      display: flex;
      justify-content: center;
    }
:where(body[data-page="contenu-tarot_amour"]) .btn-draw {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 15px 32px;
      border-radius: 999px;
      border: none;
      background: linear-gradient(135deg, #c4aee0 0%, #e8d0a8 100%);
      color: #3d2a4e;
      font-family: var(--font-body);
      font-size: .95rem;
      font-weight: 500;
      cursor: pointer;
      transition: transform .25s, box-shadow .25s;
      box-shadow: 0 8px 28px rgba(140,110,170,.2);
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-tarot_amour"]) .btn-draw::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg,rgba(255,255,255,.2),transparent);
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_amour"]) .btn-draw:hover {
      transform: translateY(-3px);
      box-shadow: 0 14px 36px rgba(140,110,170,.28);
    }
:where(body[data-page="contenu-tarot_amour"]) .btn-draw:active { transform: translateY(0); }
:where(body[data-page="contenu-tarot_amour"]) .btn-draw.loading { pointer-events: none; opacity: .75; }
:where(body[data-page="contenu-tarot_amour"]) .reading {
      margin-top: 36px;
      display: none;
      opacity: 0;
      transform: translateY(20px);
      transition: opacity .6s ease, transform .6s ease;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_amour"]) .reading.visible {
      display: block;
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto;
    }
:where(body[data-page="contenu-tarot_amour"]) .reading.visible {
      opacity: 1;
      transform: translateY(0);
      pointer-events: all;
    }
:where(body[data-page="contenu-tarot_amour"]) .reading > h2 {
      font-size: 1.3rem;
      margin-bottom: 8px;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_amour"]) .final-intro {
      text-align: center;
      color: var(--text-soft);
      font-size: .9rem;
      margin-bottom: 24px;
      max-width: 52ch;
      margin-left: auto;
      margin-right: auto;
      line-height: 1.7;
    }
:where(body[data-page="contenu-tarot_amour"]) .reading-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
      gap: 18px;
      margin-bottom: 24px;
    }
:where(body[data-page="contenu-tarot_amour"]) .reading-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 22px;
      box-shadow: var(--shadow-sm);
      transition: transform .25s, box-shadow .25s;
    }
:where(body[data-page="contenu-tarot_amour"]) .reading-card:hover {
      transform: translateY(-3px);
      box-shadow: var(--shadow-md);
    }
:where(body[data-page="contenu-tarot_amour"]) .reading-card .card-label {
      font-size: .7rem;
      font-weight: 500;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-xsoft);
      background: rgba(210,190,238,.2);
      padding: 3px 10px;
      border-radius: 999px;
      display: inline-block;
      margin-bottom: 10px;
    }
:where(body[data-page="contenu-tarot_amour"]) .reading-card h3 {
      font-size: 1.05rem;
      margin-bottom: 8px;
      color: #3d2e4a;
    }
:where(body[data-page="contenu-tarot_amour"]) .reading-card p {
      font-size: .86rem;
      color: var(--text-soft);
      line-height: 1.7;
    }
:where(body[data-page="contenu-tarot_amour"]) .global-message {
      background: linear-gradient(135deg, rgba(240,232,252,.6), rgba(252,245,232,.6));
      border: 1px solid rgba(190,170,220,.15);
      border-radius: var(--radius-lg);
      padding: 22px 26px;
      font-family: var(--font-display);
      font-style: italic;
      font-size: 1rem;
      color: #5a4068;
      line-height: 1.7;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_amour"]) .seo-block {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 32px 36px;
      margin: 32px 0;
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="contenu-tarot_amour"]) .seo-block h2 { font-size: 1.15rem; margin-bottom: 12px; }
:where(body[data-page="contenu-tarot_amour"]) .seo-block h3 { font-size: .97rem; margin: 20px 0 8px; }
:where(body[data-page="contenu-tarot_amour"]) .seo-block p { font-size: .88rem; color: var(--text-soft); line-height: 1.75; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-cta {
      background: linear-gradient(135deg, #f8f3ff 0%, #fffbf4 50%, #f8f3ff 100%);
      border: 1px solid rgba(190,165,225,.15);
      border-radius: var(--radius-xl);
      padding: 20px 22px;
      text-align: center;
      margin: 32px 0;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-cta::before {
      content: '';
      position: absolute;
      top: -60px; right: -60px;
      width: 240px; height: 240px;
      background: radial-gradient(circle, rgba(210,188,240,.3), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-cta h2 { font-size: 1.4rem; margin-bottom: 10px; position: relative; z-index: 1; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-cta p { color: var(--text-soft); font-size: .9rem; max-width: 48ch; margin: 0 auto 24px; line-height: 1.75; position: relative; z-index: 1; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-cta .cta-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; position: relative; z-index: 1; }
:where(body[data-page="contenu-tarot_amour"]) .panel { position: relative; overflow: hidden; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid {
      position: relative;
      display: block !important;
      height: 420px;
      max-width: 860px;
      margin: 0 auto 18px;
      overflow: visible;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card {
      position: absolute;
      left: 50%;
      top: 50%;
      width: 110px;
      height: 165px;
      margin-left: -55px;
      margin-top: -82px;
      perspective: 900px;
      cursor: pointer;
      transform-style: preserve-3d;
      transition: transform .7s cubic-bezier(.16,1,.3,1), filter .25s ease;
      will-change: transform;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card-inner {
      height: 100%;
      aspect-ratio: auto;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-face {
      padding: 14px 10px;
      border-radius: 16px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-symbol { font-size: 1.55rem; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-title { font-size: .98rem; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-text { font-size: .66rem; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-symbol { font-size: 2rem; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-title { font-size: .86rem; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-text { display: none; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card::before {
      content: '';
      position: absolute;
      inset: -16px;
      border-radius: 22px;
      background:
        radial-gradient(circle, rgba(237,215,176,.72), transparent 56%),
        radial-gradient(circle, rgba(196,174,224,.58), transparent 68%);
      filter: blur(18px);
      opacity: 0;
      transform: scale(.82);
      transition: opacity .35s ease, transform .35s ease;
      z-index: -1;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card.selected {
      filter: drop-shadow(0 0 18px rgba(196,174,224,.8));
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card.selected::before {
      opacity: 1;
      transform: scale(1.12);
      animation: tarotAura 1.6s ease-in-out infinite alternate;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-smoke {
      position: absolute;
      inset: 0;
      pointer-events: none;
      opacity: 0;
      transition: opacity .6s ease;
      overflow: hidden;
      z-index: 0;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-smoke.active { opacity: 1; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-smoke span {
      position: absolute;
      bottom: 90px;
      width: 140px;
      height: 140px;
      background: rgba(196,174,224,.16);
      border-radius: 50%;
      filter: blur(36px);
      animation: tarotSmokeMove 4s linear infinite;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-smoke span:nth-child(1) { left: 18%; animation-delay: 0s; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-smoke span:nth-child(2) { left: 36%; animation-delay: .7s; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-smoke span:nth-child(3) { left: 54%; animation-delay: 1.4s; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-smoke span:nth-child(4) { left: 70%; animation-delay: 2.1s; }
:where(body[data-page="contenu-tarot_amour"]) .panel > h2, :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid, :where(body[data-page="contenu-tarot_amour"]) .cta-wrap { position: relative; z-index: 1; }
@media (max-width: 720px) {
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid { height: 380px; max-width: 100%; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card {
        width: 72px;
        height: 108px;
        margin-left: -36px;
        margin-top: -54px;
      }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-title { font-size: .78rem; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-text { display: none; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-title { font-size: .7rem; }
}
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid {
      height: 500px;
      max-width: 960px;
      margin: 0 auto 22px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card {
      width: 130px;
      height: 195px;
      margin-left: -65px;
      margin-top: -97px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back {
      background-image: url("assets/img/logo/tarot_amour.png") !important;
      background-size: cover !important;
      background-position: center !important;
      border: none !important;
      box-shadow: 0 14px 34px rgba(95, 48, 130, .22) !important;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back::before, :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back::after, :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-symbol, :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-title, :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-text {
      display: none !important;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front {
      background: linear-gradient(160deg, #fff7fb 0%, #f8eaff 52%, #f5ddbd 100%);
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-label {
      color: #8f5fa0;
      background: rgba(196, 174, 224, .22);
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-title {
      color: #3d2a4e;
    }
:where(body[data-page="contenu-tarot_amour"]) .love-draw-note {
      color: var(--text-soft);
      font-size: .9rem;
      margin: -12px auto 18px;
      max-width: 58ch;
      line-height: 1.65;
    }
@media (max-width: 720px) {
  :where(body[data-page="contenu-tarot_amour"]) .cards-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
      }
  :where(body[data-page="contenu-tarot_amour"]) .card-symbol { font-size: 1.2rem !important; }
  :where(body[data-page="contenu-tarot_amour"]) .card-position-label { font-size: .7rem !important; }
  :where(body[data-page="contenu-tarot_amour"]) .card-tagline { display: none; }
  :where(body[data-page="contenu-tarot_amour"]) .reading-grid { grid-template-columns: 1fr; }
  :where(body[data-page="contenu-tarot_amour"]) .panel { padding: 16px 12px; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-cta { padding: 24px 16px; }
  :where(body[data-page="contenu-tarot_amour"]) .seo-block { padding: 18px 14px; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-cta .cta-btns { flex-direction: column; align-items: center; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-hero h1 { font-size: 1.4rem; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-hero p { font-size: .84rem; }
}
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid {
      height: 480px !important;
      max-width: 100% !important;
      margin: 0 auto !important;
      position: relative !important;
      display: block !important;
      overflow: hidden !important;   /* clip les cartes qui débordent */
      pointer-events: none !important; /* le grid ne bloque pas les clics */
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card {
      position: absolute !important;
      left: 50% !important;
      top: 60% !important;
      width: 130px !important;
      height: 195px !important;
      margin-left: -65px !important;
      margin-top: -97px !important;
      perspective: 900px;
      cursor: pointer;
      transform-style: preserve-3d;
      transition: transform .75s cubic-bezier(.16,1,.3,1), filter .25s ease;
      will-change: transform;
      pointer-events: auto !important;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card-inner {
      width: 100% !important;
      height: 100% !important;
      aspect-ratio: auto !important;
      transform-style: preserve-3d;
      transition: transform .7s cubic-bezier(.4,0,.2,1);
      border-radius: 18px;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-face {
      position: absolute;
      inset: 0;
      border-radius: 18px;
      padding: 12px 10px;
      overflow: hidden;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back {
      background-image: url("assets/img/logo/tarot_amour.png") !important;
      background-size: cover !important;
      background-position: center !important;
      background-repeat: no-repeat !important;
      background-color: #5a2a84 !important;
    }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-symbol, :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-title, :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-back .card-text { display: none !important; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-symbol { font-size: 2rem !important; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-title { font-size: .88rem !important; }
:where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-text { display: none !important; }
:where(body[data-page="contenu-tarot_amour"]) .btn-draw { min-width: 220px; justify-content: center; }
:where(body[data-page="contenu-tarot_amour"]) .btn-draw.loading { pointer-events: none; opacity: .7; }
@media (max-width: 768px) {
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid {
        height: 400px !important;
      }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card {
        width: 76px !important;
        height: 114px !important;
        margin-left: -38px !important;
        margin-top: -57px !important;
      }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-symbol { font-size: 1.3rem !important; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-front .card-title { font-size: .7rem !important; }
  :where(body[data-page="contenu-tarot_amour"]) .reading-grid { grid-template-columns: 1fr !important; }
  :where(body[data-page="contenu-tarot_amour"]) .btn-draw { width: 90% !important; max-width: 280px !important; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-hero h1 { font-size: 1.25rem !important; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-cta .cta-btns { flex-direction: column; align-items: center; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-cta .cta-btns a { width: 100%; max-width: 240px; justify-content: center; }
  :where(body[data-page="contenu-tarot_amour"]) .seo-block, :where(body[data-page="contenu-tarot_amour"]) .tarot-cta { padding: 18px 14px !important; }
}
@media (max-width: 400px) {
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid { height: 340px !important; }
  :where(body[data-page="contenu-tarot_amour"]) .tarot-pack-grid .tarot-card {
        width: 58px !important;
        height: 87px !important;
        margin-left: -29px !important;
        margin-top: -43px !important;
      }
}
:where(body[data-page="contenu-tarot_amour"]) #readingBlock.blurred {
      position: relative;
      user-select: none;
    }
:where(body[data-page="contenu-tarot_amour"]) #readingBlock.blurred .global-message {
      filter: blur(6px);
      opacity: .35;
      pointer-events: none;
      transition: filter .4s, opacity .4s;
    }
:where(body[data-page="contenu-tarot_amour"]) #readingBlock.blurred .reading-card {
      pointer-events: none;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-tarot_amour"]) #readingBlock.blurred .reading-card .card-label, :where(body[data-page="contenu-tarot_amour"]) #readingBlock.blurred .reading-card h3 {
      opacity: 1;
      filter: none;
    }
:where(body[data-page="contenu-tarot_amour"]) #readingBlock.blurred .reading-card p {
      filter: blur(5px);
      opacity: .3;
      transition: filter .4s, opacity .4s;
      user-select: none;
    }
:where(body[data-page="contenu-tarot_amour"]) #readingBlock.blurred .reading-card::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 55%;
      background: linear-gradient(to bottom, transparent, rgba(253,251,255,.92));
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_amour"]) #readingGate {
      display: none;
      position: absolute;
      inset: 0;
      z-index: 10;
      cursor: pointer;
      border-radius: inherit;
    }
:where(body[data-page="contenu-tarot_amour"]) #readingBlock.blurred #readingGate { display: block; }
:where(body[data-page="contenu-tarot_amour"]) #authPopup {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 9000;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }
:where(body[data-page="contenu-tarot_amour"]) #authPopup.open { display: flex; }
:where(body[data-page="contenu-tarot_amour"]) #authPopupOverlay {
      position: absolute;
      inset: 0;
      background: rgba(30, 15, 45, .55);
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
    }
:where(body[data-page="contenu-tarot_amour"]) #authPopupBox {
      position: relative;
      z-index: 1;
      background: #fff;
      border-radius: 24px;
      padding: 40px 32px 36px;
      max-width: 420px;
      width: 100%;
      box-shadow: 0 24px 80px rgba(100, 60, 140, .22);
      text-align: center;
      animation: popIn .35s cubic-bezier(.16,1,.3,1);
    }
:where(body[data-page="contenu-tarot_amour"]) #authPopupClose {
      position: absolute;
      top: 14px; right: 16px;
      background: none; border: none;
      font-size: 1.4rem; color: #a090a8;
      cursor: pointer; line-height: 1;
      padding: 4px 8px;
      border-radius: 8px;
      transition: background .2s, color .2s;
    }
:where(body[data-page="contenu-tarot_amour"]) #authPopupClose:hover { background: rgba(200,170,230,.15); color: #5a3a6e; }
:where(body[data-page="contenu-tarot_amour"]) .auth-popup-icon {
      font-size: 2.6rem;
      margin-bottom: 14px;
      display: block;
    }
:where(body[data-page="contenu-tarot_amour"]) .auth-popup-title {
      font-family: var(--font-display, 'Cormorant Garamond', serif);
      font-size: 1.55rem;
      font-weight: 600;
      color: #2e2338;
      margin-bottom: 10px;
      line-height: 1.25;
    }
:where(body[data-page="contenu-tarot_amour"]) .auth-popup-sub {
      font-size: .9rem;
      color: #7a6b7c;
      line-height: 1.65;
      margin-bottom: 28px;
      max-width: 32ch;
      margin-left: auto;
      margin-right: auto;
    }
:where(body[data-page="contenu-tarot_amour"]) .auth-popup-btns {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
:where(body[data-page="contenu-tarot_amour"]) .auth-popup-btns a {
      display: block;
      padding: 14px 20px;
      border-radius: 999px;
      font-size: .95rem;
      font-weight: 500;
      text-decoration: none;
      transition: transform .2s, box-shadow .2s;
    }
:where(body[data-page="contenu-tarot_amour"]) .auth-btn-primary {
      background: linear-gradient(135deg, #e8a8c4, #c4aee0 60%, #e8d0a8);
      color: #3d2a4e;
      box-shadow: 0 8px 24px rgba(190,100,140,.22);
    }
:where(body[data-page="contenu-tarot_amour"]) .auth-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(190,100,140,.3); }
:where(body[data-page="contenu-tarot_amour"]) .auth-btn-secondary {
      background: rgba(210,185,235,.12);
      border: 1.5px solid rgba(180,155,210,.3);
      color: #5a3a6e;
    }
:where(body[data-page="contenu-tarot_amour"]) .auth-btn-secondary:hover { background: rgba(210,185,235,.22); }
:where(body[data-page="contenu-tarot_amour"]) .auth-popup-login {
      margin-top: 18px;
      font-size: .82rem;
      color: #a090a8;
    }
:where(body[data-page="contenu-tarot_amour"]) .auth-popup-login a { color: #8a5fa8; text-decoration: underline; }
@media (max-width: 480px) {
  :where(body[data-page="contenu-tarot_amour"]) #authPopupBox { padding: 32px 20px 28px; }
  :where(body[data-page="contenu-tarot_amour"]) .auth-popup-title { font-size: 1.3rem; }
}
:where(body[data-page="contenu-tarot_amour"]) #restoreBanner {
      display: none;
      background: linear-gradient(135deg, rgba(255,232,242,.9), rgba(240,225,255,.9));
      border: 1px solid rgba(220,170,195,.3);
      border-radius: 16px;
      padding: 16px 20px;
      margin-bottom: 20px;
      text-align: center;
      position: relative;
      z-index: 5;
    }
:where(body[data-page="contenu-tarot_amour"]) #restoreBanner.show { display: block; animation: popIn .4s cubic-bezier(.16,1,.3,1); }
:where(body[data-page="contenu-tarot_amour"]) #restoreBanner p {
      font-family: var(--font-display, 'Cormorant Garamond', serif);
      font-size: 1rem;
      color: #7a3060;
      margin-bottom: 12px;
      font-style: italic;
    }
:where(body[data-page="contenu-tarot_amour"]) #restoreBanner .restore-btns {
      display: flex;
      gap: 10px;
      justify-content: center;
      flex-wrap: wrap;
    }
:where(body[data-page="contenu-tarot_amour"]) #restoreBanner .btn-restore {
      padding: 10px 22px;
      border-radius: 999px;
      border: none;
      cursor: pointer;
      font-size: .88rem;
      font-weight: 500;
      font-family: var(--font-body, 'DM Sans', sans-serif);
      transition: transform .2s, box-shadow .2s;
    }
:where(body[data-page="contenu-tarot_amour"]) #restoreBanner .btn-restore-yes {
      background: linear-gradient(135deg, #e8a8c4, #c4aee0 60%);
      color: #3d2a4e;
      box-shadow: 0 6px 18px rgba(190,100,140,.2);
    }
:where(body[data-page="contenu-tarot_amour"]) #restoreBanner .btn-restore-yes:hover { transform: translateY(-2px); }
:where(body[data-page="contenu-tarot_amour"]) #restoreBanner .btn-restore-no {
      background: rgba(210,185,235,.15);
      border: 1px solid rgba(180,155,210,.3);
      color: #7a6b7c;
    }

/* === Page : contenu-tarot_celibataire  (pages/contenu/tarot_celibataire.html) === */
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero {
      text-align: center;
      padding: 32px 0 24px;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero::before {
      content: '';
      position: absolute;
      top: -100px; right: -100px;
      width: 420px; height: 420px;
      background: radial-gradient(circle, rgba(195,165,228,.22), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero::after {
      content: '';
      position: absolute;
      bottom: -60px; left: -80px;
      width: 300px; height: 300px;
      background: radial-gradient(circle, rgba(237,215,176,.18), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero h1 {
      font-size: clamp(1.6rem, 3.5vw, 2.4rem);
      margin-bottom: 14px;
      position: relative;
      z-index: 1;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero h1 em { font-style: italic; color: var(--lavender-deep); }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero p {
      color: var(--text-soft);
      font-size: .97rem;
      max-width: 54ch;
      margin: 0 auto;
      line-height: 1.75;
      position: relative;
      z-index: 1;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .panel {
      background: rgba(255,255,255,.92);
      border: 1px solid var(--line);
      border-radius: var(--radius-xl);
      padding: 20px 22px;
      box-shadow: var(--shadow-md);
      margin-bottom: 32px;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .panel > h2 {
      font-size: 1.3rem;
      margin-bottom: 28px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .cards-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 14px;
      margin-bottom: 24px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-card {
      perspective: 900px;
      cursor: pointer;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-card-inner {
      position: relative;
      width: 100%;
      aspect-ratio: 0.75;
      transform-style: preserve-3d;
      transition: transform .7s cubic-bezier(.4,0,.2,1);
      border-radius: 18px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-card.revealed .tarot-card-inner {
      transform: rotateY(180deg);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-face {
      position: absolute;
      inset: 0;
      border-radius: 18px;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 20px 16px;
      gap: 10px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-back {
      background: linear-gradient(160deg, #e8d8f8 0%, #d0c0ee 50%, #e8d0a8 100%);
      border: 1px solid rgba(170,140,210,.2);
      box-shadow: 0 10px 30px rgba(140,110,170,.15);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-back::before {
      content: '';
      position: absolute;
      inset: 8px;
      border: 1px solid rgba(200,170,240,.3);
      border-radius: 12px;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-back .card-symbol {
      font-size: 2rem;
      color: rgba(130,100,170,.5);
      margin-bottom: 6px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-back .card-title {
      font-family: var(--font-display);
      font-size: 1.1rem;
      font-weight: 600;
      color: #5a4070;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-back .card-text {
      font-size: .76rem;
      color: rgba(90,64,112,.6);
      line-height: 1.55;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-front {
      background: linear-gradient(160deg, #fffbf4 0%, #f8f0ff 100%);
      border: 1px solid rgba(180,155,210,.15);
      box-shadow: 0 12px 36px rgba(140,110,170,.13);
      transform: rotateY(180deg);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-front .card-symbol { font-size: 2.6rem; line-height: 1; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-front .card-label {
      font-size: .7rem;
      font-weight: 500;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-xsoft);
      background: rgba(210,190,238,.25);
      padding: 3px 10px;
      border-radius: 999px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-front .card-title {
      font-family: var(--font-display);
      font-size: 1.05rem;
      font-weight: 600;
      color: #3d2e4a;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-front .card-text {
      font-size: .78rem;
      color: var(--text-soft);
      line-height: 1.6;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .cta-wrap {
      display: flex;
      justify-content: center;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      padding: 15px 32px;
      border-radius: 999px;
      border: none;
      background: linear-gradient(135deg, #c4aee0 0%, #e8d0a8 100%);
      color: #3d2a4e;
      font-family: var(--font-body);
      font-size: .95rem;
      font-weight: 500;
      cursor: pointer;
      transition: transform .25s, box-shadow .25s;
      box-shadow: 0 8px 28px rgba(140,110,170,.2);
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg,rgba(255,255,255,.2),transparent);
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw:hover {
      transform: translateY(-3px);
      box-shadow: 0 14px 36px rgba(140,110,170,.28);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw:active { transform: translateY(0); }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw.loading { pointer-events: none; opacity: .75; }
:where(body[data-page="contenu-tarot_celibataire"]) .reading {
      margin-top: 36px;
      display: none;
      opacity: 0;
      transform: translateY(20px);
      transition: opacity .6s ease, transform .6s ease;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading.visible {
      display: block;
      opacity: 1;
      transform: translateY(0);
      pointer-events: auto;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading.visible {
      opacity: 1;
      transform: translateY(0);
      pointer-events: all;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading > h2 {
      font-size: 1.3rem;
      margin-bottom: 8px;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .final-intro {
      text-align: center;
      color: var(--text-soft);
      font-size: .9rem;
      margin-bottom: 24px;
      max-width: 52ch;
      margin-left: auto;
      margin-right: auto;
      line-height: 1.7;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
      gap: 18px;
      margin-bottom: 24px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 22px;
      box-shadow: var(--shadow-sm);
      transition: transform .25s, box-shadow .25s;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading-card:hover {
      transform: translateY(-3px);
      box-shadow: var(--shadow-md);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading-card .card-label {
      font-size: .7rem;
      font-weight: 500;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-xsoft);
      background: rgba(210,190,238,.2);
      padding: 3px 10px;
      border-radius: 999px;
      display: inline-block;
      margin-bottom: 10px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading-card h3 {
      font-size: 1.05rem;
      margin-bottom: 8px;
      color: #3d2e4a;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .reading-card p {
      font-size: .86rem;
      color: var(--text-soft);
      line-height: 1.7;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .global-message {
      background: linear-gradient(135deg, rgba(240,232,252,.6), rgba(252,245,232,.6));
      border: 1px solid rgba(190,170,220,.15);
      border-radius: var(--radius-lg);
      padding: 22px 26px;
      font-family: var(--font-display);
      font-style: italic;
      font-size: 1rem;
      color: #5a4068;
      line-height: 1.7;
      text-align: center;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .seo-block {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 32px 36px;
      margin: 32px 0;
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .seo-block h2 { font-size: 1.15rem; margin-bottom: 12px; }
:where(body[data-page="contenu-tarot_celibataire"]) .seo-block h3 { font-size: .97rem; margin: 20px 0 8px; }
:where(body[data-page="contenu-tarot_celibataire"]) .seo-block p { font-size: .88rem; color: var(--text-soft); line-height: 1.75; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta {
      background: linear-gradient(135deg, #f8f3ff 0%, #fffbf4 50%, #f8f3ff 100%);
      border: 1px solid rgba(190,165,225,.15);
      border-radius: var(--radius-xl);
      padding: 20px 22px;
      text-align: center;
      margin: 32px 0;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta::before {
      content: '';
      position: absolute;
      top: -60px; right: -60px;
      width: 240px; height: 240px;
      background: radial-gradient(circle, rgba(210,188,240,.3), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta h2 { font-size: 1.4rem; margin-bottom: 10px; position: relative; z-index: 1; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta p { color: var(--text-soft); font-size: .9rem; max-width: 48ch; margin: 0 auto 24px; line-height: 1.75; position: relative; z-index: 1; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta .cta-btns { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; position: relative; z-index: 1; }
:where(body[data-page="contenu-tarot_celibataire"]) .panel { position: relative; overflow: hidden; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid {
      position: relative;
      display: block !important;
      height: 390px;
      max-width: 760px;
      margin: 0 auto 18px;
      overflow: visible;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card {
      position: absolute;
      left: 50%;
      top: 50%;
      width: 92px;
      height: 138px;
      margin-left: -46px;
      margin-top: -69px;
      perspective: 900px;
      cursor: pointer;
      transform-style: preserve-3d;
      transition: transform .7s cubic-bezier(.16,1,.3,1), filter .25s ease;
      will-change: transform;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card-inner {
      height: 100%;
      aspect-ratio: auto;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-face {
      padding: 14px 10px;
      border-radius: 16px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-symbol { font-size: 1.55rem; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-title { font-size: .98rem; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-text { font-size: .66rem; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-symbol { font-size: 2rem; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-title { font-size: .86rem; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-text { display: none; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card::before {
      content: '';
      position: absolute;
      inset: -16px;
      border-radius: 22px;
      background:
        radial-gradient(circle, rgba(237,215,176,.72), transparent 56%),
        radial-gradient(circle, rgba(196,174,224,.58), transparent 68%);
      filter: blur(18px);
      opacity: 0;
      transform: scale(.82);
      transition: opacity .35s ease, transform .35s ease;
      z-index: -1;
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card.selected {
      filter: drop-shadow(0 0 18px rgba(196,174,224,.8));
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card.selected::before {
      opacity: 1;
      transform: scale(1.12);
      animation: tarotAura 1.6s ease-in-out infinite alternate;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-smoke {
      position: absolute;
      inset: 0;
      pointer-events: none;
      opacity: 0;
      transition: opacity .6s ease;
      overflow: hidden;
      z-index: 0;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-smoke.active { opacity: 1; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-smoke span {
      position: absolute;
      bottom: 90px;
      width: 140px;
      height: 140px;
      background: rgba(196,174,224,.16);
      border-radius: 50%;
      filter: blur(36px);
      animation: tarotSmokeMove 4s linear infinite;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-smoke span:nth-child(1) { left: 18%; animation-delay: 0s; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-smoke span:nth-child(2) { left: 36%; animation-delay: .7s; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-smoke span:nth-child(3) { left: 54%; animation-delay: 1.4s; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-smoke span:nth-child(4) { left: 70%; animation-delay: 2.1s; }
:where(body[data-page="contenu-tarot_celibataire"]) .panel > h2, :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid, :where(body[data-page="contenu-tarot_celibataire"]) .cta-wrap { position: relative; z-index: 1; }
@media (max-width: 720px) {
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid { height: 330px; max-width: 100%; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card {
        width: 64px;
        height: 100px;
        margin-left: -32px;
        margin-top: -50px;
      }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-title { font-size: .78rem; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-text { display: none; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-title { font-size: .7rem; }
}
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid {
      height: 430px;
      max-width: 900px;
      margin: 0 auto 22px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card {
      width: 104px;
      height: 156px;
      margin-left: -52px;
      margin-top: -78px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back {
      background-image: url("assets/img/logo/tarot_celibataire.png") !important;
      background-size: cover !important;
      background-position: center !important;
      border: none !important;
      box-shadow: 0 14px 34px rgba(95, 48, 130, .22) !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back::before, :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back::after, :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-symbol, :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-title, :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-text {
      display: none !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front {
      background: linear-gradient(160deg, #fff7fb 0%, #f8eaff 52%, #f5ddbd 100%);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-label {
      color: #8f5fa0;
      background: rgba(196, 174, 224, .22);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-title {
      color: #3d2a4e;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .love-draw-note {
      color: var(--text-soft);
      font-size: .9rem;
      margin: -12px auto 18px;
      max-width: 58ch;
      line-height: 1.65;
    }
@media (max-width: 720px) {
  :where(body[data-page="contenu-tarot_celibataire"]) .cards-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
      }
  :where(body[data-page="contenu-tarot_celibataire"]) .card-symbol { font-size: 1.2rem !important; }
  :where(body[data-page="contenu-tarot_celibataire"]) .card-position-label { font-size: .7rem !important; }
  :where(body[data-page="contenu-tarot_celibataire"]) .card-tagline { display: none; }
  :where(body[data-page="contenu-tarot_celibataire"]) .reading-grid { grid-template-columns: 1fr; }
  :where(body[data-page="contenu-tarot_celibataire"]) .panel { padding: 16px 12px; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta { padding: 24px 16px; }
  :where(body[data-page="contenu-tarot_celibataire"]) .seo-block { padding: 18px 14px; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta .cta-btns { flex-direction: column; align-items: center; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero h1 { font-size: 1.4rem; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero p { font-size: .84rem; }
}
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid {
      height: 520px !important;
      max-width: 1040px !important;
      margin: 0 auto 22px !important;
      position: relative !important;
      display: block !important;
      overflow: visible !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card {
      position: absolute !important;
      left: 50% !important;
      top: 52% !important;
      width: 120px !important;
      height: 180px !important;
      margin-left: -60px !important;
      margin-top: -90px !important;
      perspective: 900px;
      cursor: pointer;
      transform-style: preserve-3d;
      transition: transform .75s cubic-bezier(.16,1,.3,1), filter .25s ease;
      will-change: transform;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card-inner {
      width: 100% !important;
      height: 100% !important;
      aspect-ratio: auto !important;
      transform-style: preserve-3d;
      transition: transform .7s cubic-bezier(.4,0,.2,1);
      border-radius: 18px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-face {
      position: absolute;
      inset: 0;
      border-radius: 18px;
      padding: 12px 10px;
      overflow: hidden;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back {
      background-image: url("assets/img/logo/tarot_celibataire.png") !important;
      background-size: cover !important;
      background-position: center !important;
      background-repeat: no-repeat !important;
      background-color: #5a2a84 !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-symbol, :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-title, :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-back .card-text {
      display: none !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-symbol { font-size: 2rem !important; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-title { font-size: .88rem !important; }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-front .card-text { display: none !important; }
:where(body[data-page="contenu-tarot_celibataire"]) .cta-wrap {
      position: relative !important;
      z-index: 20 !important;
      display: flex !important;
      justify-content: center !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw {
      min-width: 230px;
      justify-content: center;
      z-index: 30 !important;
      position: relative !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw.loading {
      pointer-events: none;
      opacity: .75;
    }
@media (max-width: 720px) {
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid {
        height: 420px !important;
        max-width: 100% !important;
      }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card {
        width: 76px !important;
        height: 114px !important;
        margin-left: -38px !important;
        margin-top: -57px !important;
      }
}
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid.ribbon-active .single-star {
      animation: _contenu_tarot_celibataire__starPulse 1.6s ease-in-out infinite alternate;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid::before {
      content: '';
      position: absolute;
      left: 50%;
      top: 53%;
      width: 520px;
      height: 220px;
      transform: translate(-50%, -50%) rotate(-8deg);
      border-radius: 999px;
      background:
        radial-gradient(circle at 30% 50%, rgba(245,217,139,.20), transparent 38%),
        radial-gradient(circle at 70% 50%, rgba(196,174,224,.22), transparent 42%);
      filter: blur(22px);
      opacity: .55;
      pointer-events: none;
      z-index: 0;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid.ribbon-active::after {
      content: '';
      position: absolute;
      left: 50%;
      top: 52%;
      width: 620px;
      height: 2px;
      transform: translate(-50%, -50%) rotate(-8deg);
      background: linear-gradient(90deg, transparent, rgba(245,217,139,.75), rgba(196,174,224,.75), transparent);
      box-shadow: 0 0 24px rgba(196,174,224,.75);
      animation: ribbonLine 1.2s ease-in-out infinite alternate;
      pointer-events: none;
      z-index: 1;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .single-star {
      display: none !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid {
      height: 480px !important;
      max-width: 100% !important;
      margin: 0 auto 0 !important;
      position: relative !important;
      display: block !important;
      overflow: hidden !important;
      pointer-events: none !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card {
      position: absolute !important;
      left: 50% !important;
      top: 60% !important;
      width: 130px !important;
      height: 195px !important;
      margin-left: -65px !important;
      margin-top: -97px !important;
      perspective: 900px;
      cursor: pointer;
      pointer-events: auto !important;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw { min-width: 220px; justify-content: center; }
:where(body[data-page="contenu-tarot_celibataire"]) .btn-draw.loading { pointer-events: none; opacity: .7; }
@media (max-width: 768px) {
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid {
        height: 400px !important;
      }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card {
        width: 76px !important;
        height: 114px !important;
        margin-left: -38px !important;
        margin-top: -57px !important;
      }
  :where(body[data-page="contenu-tarot_celibataire"]) .reading-grid { grid-template-columns: 1fr !important; }
  :where(body[data-page="contenu-tarot_celibataire"]) .btn-draw { width: 90% !important; max-width: 280px !important; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-hero h1 { font-size: 1.25rem !important; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta .cta-btns { flex-direction: column; align-items: center; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-cta .cta-btns a { width: 100%; max-width: 240px; justify-content: center; }
}
@media (max-width: 400px) {
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid { height: 350px !important; }
  :where(body[data-page="contenu-tarot_celibataire"]) .tarot-pack-grid .tarot-card {
        width: 58px !important;
        height: 87px !important;
        margin-left: -29px !important;
        margin-top: -43px !important;
      }
}
:where(body[data-page="contenu-tarot_celibataire"]) #readingBlock.blurred {
      position: relative;
      user-select: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #readingBlock.blurred .global-message {
      filter: blur(6px);
      opacity: .35;
      pointer-events: none;
      transition: filter .4s, opacity .4s;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #readingBlock.blurred .reading-card {
      pointer-events: none;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #readingBlock.blurred .reading-card .card-label, :where(body[data-page="contenu-tarot_celibataire"]) #readingBlock.blurred .reading-card h3 {
      opacity: 1;
      filter: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #readingBlock.blurred .reading-card p {
      filter: blur(5px);
      opacity: .3;
      transition: filter .4s, opacity .4s;
      user-select: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #readingBlock.blurred .reading-card::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 55%;
      background: linear-gradient(to bottom, transparent, rgba(253,251,255,.92));
      pointer-events: none;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #readingGate {
      display: none;
      position: absolute;
      inset: 0;
      z-index: 10;
      cursor: pointer;
      border-radius: inherit;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #readingBlock.blurred #readingGate { display: block; }
:where(body[data-page="contenu-tarot_celibataire"]) #authPopup {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 9000;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #authPopup.open { display: flex; }
:where(body[data-page="contenu-tarot_celibataire"]) #authPopupOverlay {
      position: absolute;
      inset: 0;
      background: rgba(30, 15, 45, .55);
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
    }
:where(body[data-page="contenu-tarot_celibataire"]) #authPopupBox {
      position: relative;
      z-index: 1;
      background: #fff;
      border-radius: 24px;
      padding: 40px 32px 36px;
      max-width: 420px;
      width: 100%;
      box-shadow: 0 24px 80px rgba(100, 60, 140, .22);
      text-align: center;
      animation: popIn .35s cubic-bezier(.16,1,.3,1);
    }
:where(body[data-page="contenu-tarot_celibataire"]) #authPopupClose {
      position: absolute;
      top: 14px; right: 16px;
      background: none; border: none;
      font-size: 1.4rem; color: #a090a8;
      cursor: pointer; line-height: 1;
      padding: 4px 8px;
      border-radius: 8px;
      transition: background .2s, color .2s;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #authPopupClose:hover { background: rgba(200,170,230,.15); color: #5a3a6e; }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-popup-icon {
      font-size: 2.6rem;
      margin-bottom: 14px;
      display: block;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-popup-title {
      font-family: var(--font-display, 'Cormorant Garamond', serif);
      font-size: 1.55rem;
      font-weight: 600;
      color: #2e2338;
      margin-bottom: 10px;
      line-height: 1.25;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-popup-sub {
      font-size: .9rem;
      color: #7a6b7c;
      line-height: 1.65;
      margin-bottom: 28px;
      max-width: 32ch;
      margin-left: auto;
      margin-right: auto;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-popup-btns {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-popup-btns a {
      display: block;
      padding: 14px 20px;
      border-radius: 999px;
      font-size: .95rem;
      font-weight: 500;
      text-decoration: none;
      transition: transform .2s, box-shadow .2s;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-btn-primary {
      background: linear-gradient(135deg, #e8a8c4, #c4aee0 60%, #e8d0a8);
      color: #3d2a4e;
      box-shadow: 0 8px 24px rgba(190,100,140,.22);
    }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-btn-primary:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(190,100,140,.3); }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-btn-secondary {
      background: rgba(210,185,235,.12);
      border: 1.5px solid rgba(180,155,210,.3);
      color: #5a3a6e;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-btn-secondary:hover { background: rgba(210,185,235,.22); }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-popup-login {
      margin-top: 18px;
      font-size: .82rem;
      color: #a090a8;
    }
:where(body[data-page="contenu-tarot_celibataire"]) .auth-popup-login a { color: #8a5fa8; text-decoration: underline; }
@media (max-width: 480px) {
  :where(body[data-page="contenu-tarot_celibataire"]) #authPopupBox { padding: 32px 20px 28px; }
  :where(body[data-page="contenu-tarot_celibataire"]) .auth-popup-title { font-size: 1.3rem; }
}
:where(body[data-page="contenu-tarot_celibataire"]) #restoreBanner {
      display: none;
      background: linear-gradient(135deg, rgba(255,232,242,.9), rgba(240,225,255,.9));
      border: 1px solid rgba(220,170,195,.3);
      border-radius: 16px;
      padding: 16px 20px;
      margin-bottom: 20px;
      text-align: center;
      position: relative;
      z-index: 5;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #restoreBanner.show { display: block; animation: popIn .4s cubic-bezier(.16,1,.3,1); }
:where(body[data-page="contenu-tarot_celibataire"]) #restoreBanner p {
      font-family: var(--font-display, 'Cormorant Garamond', serif);
      font-size: 1rem;
      color: #7a3060;
      margin-bottom: 12px;
      font-style: italic;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #restoreBanner .restore-btns {
      display: flex;
      gap: 10px;
      justify-content: center;
      flex-wrap: wrap;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #restoreBanner .btn-restore {
      padding: 10px 22px;
      border-radius: 999px;
      border: none;
      cursor: pointer;
      font-size: .88rem;
      font-weight: 500;
      font-family: var(--font-body, 'DM Sans', sans-serif);
      transition: transform .2s, box-shadow .2s;
    }
:where(body[data-page="contenu-tarot_celibataire"]) #restoreBanner .btn-restore-yes {
      background: linear-gradient(135deg, #e8a8c4, #c4aee0 60%);
      color: #3d2a4e;
      box-shadow: 0 6px 18px rgba(190,100,140,.2);
    }
:where(body[data-page="contenu-tarot_celibataire"]) #restoreBanner .btn-restore-yes:hover { transform: translateY(-2px); }
:where(body[data-page="contenu-tarot_celibataire"]) #restoreBanner .btn-restore-no {
      background: rgba(210,185,235,.15);
      border: 1px solid rgba(180,155,210,.3);
      color: #7a6b7c;
    }

/* === Page : legal-cgv  (pages/legal/cgv.html) === */
:where(body[data-page="legal-cgv"]) .legal-page { padding:56px 0 80px; }
:where(body[data-page="legal-cgv"]) .legal-header { margin-bottom:40px; }
:where(body[data-page="legal-cgv"]) .legal-header h1 { font-size:clamp(1.8rem,3vw,2.4rem); margin-bottom:10px; }
:where(body[data-page="legal-cgv"]) .legal-header p { font-size:.9rem;color:var(--text-soft); }
:where(body[data-page="legal-cgv"]) .legal-grid { display:grid;grid-template-columns:200px 1fr;gap:40px;align-items:start; }
:where(body[data-page="legal-cgv"]) .legal-nav { position:sticky;top:90px; }
:where(body[data-page="legal-cgv"]) .legal-nav a { display:block;font-size:.82rem;color:var(--text-soft);padding:7px 12px;border-radius:var(--radius-sm);border-left:2px solid var(--line);margin-bottom:4px;text-decoration:none;transition:all .2s; }
:where(body[data-page="legal-cgv"]) .legal-nav a:hover { color:var(--text);border-left-color:var(--gold); }
:where(body[data-page="legal-cgv"]) .legal-nav a.active { color:#5a3d70;border-left-color:var(--lavender-deep);background:rgba(196,174,224,.1);font-weight:500; }
:where(body[data-page="legal-cgv"]) .legal-content section { margin-bottom:36px;scroll-margin-top:90px; }
:where(body[data-page="legal-cgv"]) .legal-content h2 { font-size:1.15rem;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line); }
:where(body[data-page="legal-cgv"]) .legal-content h3 { font-size:.97rem;margin:16px 0 8px;color:#3d2e4a; }
:where(body[data-page="legal-cgv"]) .legal-content p { font-size:.88rem;color:var(--text-soft);line-height:1.8;margin-bottom:10px; }
:where(body[data-page="legal-cgv"]) .legal-content ul { padding-left:18px;margin-bottom:10px; }
:where(body[data-page="legal-cgv"]) .legal-content ul li { font-size:.88rem;color:var(--text-soft);line-height:1.8;margin-bottom:4px; }
:where(body[data-page="legal-cgv"]) .legal-content strong { color:var(--text); }
:where(body[data-page="legal-cgv"]) .legal-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px 22px;margin-bottom:14px;box-shadow:var(--shadow-sm); }
:where(body[data-page="legal-cgv"]) .highlight-box { background:linear-gradient(135deg,rgba(240,232,252,.5),rgba(252,245,232,.5));border:1px solid rgba(190,170,220,.2);border-radius:var(--radius-md);padding:16px 18px;margin-bottom:14px; }
:where(body[data-page="legal-cgv"]) .highlight-box p { margin-bottom:0;color:var(--text-soft); }
@media(max-width:768px) { .legal-grid{grid-template-columns:1fr;} .legal-nav{position:static;display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px;} .legal-nav a{border-left:none;border-bottom:2px solid var(--line);border-radius:0;padding:5px 10px;} }

/* === Page : legal-confidentialite  (pages/legal/confidentialite.html) === */
:where(body[data-page="legal-confidentialite"]) .legal-page { padding:56px 0 80px; }
:where(body[data-page="legal-confidentialite"]) .legal-header { margin-bottom:40px; }
:where(body[data-page="legal-confidentialite"]) .legal-header h1 { font-size:clamp(1.8rem,3vw,2.4rem); margin-bottom:10px; }
:where(body[data-page="legal-confidentialite"]) .legal-header p { font-size:.9rem;color:var(--text-soft); }
:where(body[data-page="legal-confidentialite"]) .legal-grid { display:grid;grid-template-columns:200px 1fr;gap:40px;align-items:start; }
:where(body[data-page="legal-confidentialite"]) .legal-nav { position:sticky;top:90px; }
:where(body[data-page="legal-confidentialite"]) .legal-nav a { display:block;font-size:.82rem;color:var(--text-soft);padding:7px 12px;border-radius:var(--radius-sm);border-left:2px solid var(--line);margin-bottom:4px;text-decoration:none;transition:all .2s; }
:where(body[data-page="legal-confidentialite"]) .legal-nav a:hover { color:var(--text);border-left-color:var(--gold); }
:where(body[data-page="legal-confidentialite"]) .legal-nav a.active { color:#5a3d70;border-left-color:var(--lavender-deep);background:rgba(196,174,224,.1);font-weight:500; }
:where(body[data-page="legal-confidentialite"]) .legal-content section { margin-bottom:36px;scroll-margin-top:90px; }
:where(body[data-page="legal-confidentialite"]) .legal-content h2 { font-size:1.15rem;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line); }
:where(body[data-page="legal-confidentialite"]) .legal-content h3 { font-size:.97rem;margin:16px 0 8px;color:#3d2e4a; }
:where(body[data-page="legal-confidentialite"]) .legal-content p { font-size:.88rem;color:var(--text-soft);line-height:1.8;margin-bottom:10px; }
:where(body[data-page="legal-confidentialite"]) .legal-content ul { padding-left:18px;margin-bottom:10px; }
:where(body[data-page="legal-confidentialite"]) .legal-content ul li { font-size:.88rem;color:var(--text-soft);line-height:1.8;margin-bottom:4px; }
:where(body[data-page="legal-confidentialite"]) .legal-content strong { color:var(--text); }
:where(body[data-page="legal-confidentialite"]) .data-table { width:100%;border-collapse:collapse;font-size:.85rem;margin-bottom:14px; }
:where(body[data-page="legal-confidentialite"]) .data-table th { text-align:left;padding:10px 14px;background:var(--bg-soft);color:var(--text);font-weight:500;border-bottom:1px solid var(--line);font-size:.82rem; }
:where(body[data-page="legal-confidentialite"]) .data-table td { padding:10px 14px;border-bottom:1px solid var(--line);color:var(--text-soft);vertical-align:top; }
:where(body[data-page="legal-confidentialite"]) .data-table tr:last-child td { border-bottom:none; }
:where(body[data-page="legal-confidentialite"]) .rights-grid { display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:8px; }
:where(body[data-page="legal-confidentialite"]) .right-item { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);padding:14px 16px; }
:where(body[data-page="legal-confidentialite"]) .right-item h4 { font-size:.86rem;font-weight:500;color:#3d2e4a;margin-bottom:5px; }
:where(body[data-page="legal-confidentialite"]) .right-item p { font-size:.8rem;color:var(--text-soft);line-height:1.6;margin-bottom:0; }
:where(body[data-page="legal-confidentialite"]) .contact-box { background:linear-gradient(135deg,rgba(240,232,252,.5),rgba(252,245,232,.5));border:1px solid rgba(190,170,220,.2);border-radius:var(--radius-md);padding:20px 22px; }
:where(body[data-page="legal-confidentialite"]) .contact-box p { margin-bottom:6px; }
@media(max-width:768px) { .legal-grid{grid-template-columns:1fr;} .legal-nav{position:static;display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px;} .legal-nav a{border-left:none;border-bottom:2px solid var(--line);border-radius:0;padding:5px 10px;} .rights-grid{grid-template-columns:1fr;} }

/* === Page : legal-mentions-legales  (pages/legal/mentions-legales.html) === */
:where(body[data-page="legal-mentions-legales"]) .legal-page { padding:56px 0 80px; }
:where(body[data-page="legal-mentions-legales"]) .legal-header { margin-bottom:40px; }
:where(body[data-page="legal-mentions-legales"]) .legal-header h1 { font-size:clamp(1.8rem,3vw,2.4rem); margin-bottom:10px; }
:where(body[data-page="legal-mentions-legales"]) .legal-header p { font-size:.9rem;color:var(--text-soft); }
:where(body[data-page="legal-mentions-legales"]) .legal-grid { display:grid;grid-template-columns:200px 1fr;gap:40px;align-items:start; }
:where(body[data-page="legal-mentions-legales"]) .legal-nav { position:sticky;top:90px; }
:where(body[data-page="legal-mentions-legales"]) .legal-nav a { display:block;font-size:.82rem;color:var(--text-soft);padding:7px 12px;border-radius:var(--radius-sm);border-left:2px solid var(--line);margin-bottom:4px;text-decoration:none;transition:all .2s; }
:where(body[data-page="legal-mentions-legales"]) .legal-nav a:hover { color:var(--text);border-left-color:var(--gold); }
:where(body[data-page="legal-mentions-legales"]) .legal-nav a.active { color:#5a3d70;border-left-color:var(--lavender-deep);background:rgba(196,174,224,.1);font-weight:500; }
:where(body[data-page="legal-mentions-legales"]) .legal-content section { margin-bottom:36px;scroll-margin-top:90px; }
:where(body[data-page="legal-mentions-legales"]) .legal-content h2 { font-size:1.15rem;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line); }
:where(body[data-page="legal-mentions-legales"]) .legal-content h3 { font-size:.97rem;margin:16px 0 8px;color:#3d2e4a; }
:where(body[data-page="legal-mentions-legales"]) .legal-content p { font-size:.88rem;color:var(--text-soft);line-height:1.8;margin-bottom:10px; }
:where(body[data-page="legal-mentions-legales"]) .legal-content ul { padding-left:18px;margin-bottom:10px; }
:where(body[data-page="legal-mentions-legales"]) .legal-content ul li { font-size:.88rem;color:var(--text-soft);line-height:1.8;margin-bottom:4px; }
:where(body[data-page="legal-mentions-legales"]) .legal-content strong { color:var(--text); }
:where(body[data-page="legal-mentions-legales"]) .legal-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px 26px;margin-bottom:14px;box-shadow:var(--shadow-sm); }
:where(body[data-page="legal-mentions-legales"]) .info-line { display:flex;gap:12px;font-size:.87rem;padding:7px 0;border-bottom:1px solid var(--line); }
:where(body[data-page="legal-mentions-legales"]) .info-line:last-child { border-bottom:none; }
:where(body[data-page="legal-mentions-legales"]) .info-line .lbl { color:var(--text-soft);min-width:160px;flex-shrink:0; }
:where(body[data-page="legal-mentions-legales"]) .info-line .val { color:var(--text);font-weight:500; }
@media(max-width:768px) { .legal-grid{grid-template-columns:1fr;} .legal-nav{position:static;display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px;} .legal-nav a{border-left:none;border-bottom:2px solid var(--line);border-radius:0;padding:5px 10px;} }

/* === Page : membre-dashboard  (pages/membre/dashboard.html) === */
:where(body[data-page="membre-dashboard"]) .dashboard-layout { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
:where(body[data-page="membre-dashboard"]) .dashboard-main { background: var(--bg); overflow-y: auto; }
:where(body[data-page="membre-dashboard"]) .dash-topbar {
      position: sticky;
      top: 0;
      z-index: 10;
      background: rgba(250,247,244,.92);
      backdrop-filter: blur(14px);
      border-bottom: 1px solid var(--line);
      padding: 0 32px;
      height: 64px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
    }
:where(body[data-page="membre-dashboard"]) .dash-topbar h1 {
      font-size: 1.05rem;
      font-weight: 500;
      color: var(--text);
      font-family: var(--font-body);
      margin: 0;
    }
:where(body[data-page="membre-dashboard"]) .dash-topbar-right {
      display: flex;
      align-items: center;
      gap: 12px;
    }
:where(body[data-page="membre-dashboard"]) .credits-pill {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 6px 14px;
      background: linear-gradient(135deg, rgba(196,174,224,.25), rgba(237,215,176,.2));
      border: 1px solid rgba(180,155,210,.2);
      border-radius: 999px;
      font-size: 0.82rem;
      color: #5a3d70;
      font-weight: 500;
    }
:where(body[data-page="membre-dashboard"]) .credits-pill .credit-dot {
      width: 7px;
      height: 7px;
      background: var(--gold);
      border-radius: 50%;
    }
:where(body[data-page="membre-dashboard"]) .dash-content {
      padding: 32px;
      max-width: 1180px;
    }
:where(body[data-page="membre-dashboard"]) .welcome-block {
      background: linear-gradient(135deg, rgba(240,232,252,.82) 0%, rgba(252,245,232,.82) 100%);
      border: 1px solid rgba(190,170,220,.15);
      border-radius: var(--radius-xl);
      padding: 34px 38px;
      margin-bottom: 28px;
      position: relative;
      overflow: hidden;
      min-height: 260px;
    }
:where(body[data-page="membre-dashboard"]) .welcome-block::before {
      content: '';
      position: absolute;
      top: -60px;
      right: -60px;
      width: 260px;
      height: 260px;
      background: radial-gradient(circle, rgba(195,165,228,.28), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="membre-dashboard"]) .welcome-block::after {
      content: '';
      position: absolute;
      bottom: -40px;
      left: -40px;
      width: 180px;
      height: 180px;
      background: radial-gradient(circle, rgba(237,215,176,.22), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="membre-dashboard"]) .welcome-inner {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      height: 100%;
    }
:where(body[data-page="membre-dashboard"]) .welcome-text {
      max-width: 52ch;
    }
:where(body[data-page="membre-dashboard"]) .welcome-text h2 {
      font-size: clamp(1.9rem, 3vw, 3rem);
      margin: 0 0 12px;
      line-height: 1.05;
      font-family: var(--font-display);
      font-weight: 600;
      color: #493857;
    }
:where(body[data-page="membre-dashboard"]) .welcome-text h2 em {
      font-style: italic;
      font-weight: 500;
    }
:where(body[data-page="membre-dashboard"]) .welcome-text p {
      font-size: 0.98rem;
      color: var(--text-soft);
      max-width: 40ch;
      line-height: 1.7;
      margin: 0;
    }
:where(body[data-page="membre-dashboard"]) .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 10px 16px;
      border-radius: 999px;
      background: rgba(196,174,224,.22);
      color: #866b9b;
      font-size: 0.78rem;
      font-weight: 600;
      letter-spacing: .03em;
      text-transform: uppercase;
      margin-bottom: 18px;
    }
:where(body[data-page="membre-dashboard"]) .welcome-deco {
      display: flex;
      gap: 12px;
      align-items: flex-end;
      padding-right: 10px;
    }
:where(body[data-page="membre-dashboard"]) .welcome-card {
      width: 84px;
      aspect-ratio: 0.72;
      border-radius: 18px;
      display: grid;
      place-items: center;
      font-size: 2rem;
      box-shadow: 0 12px 24px rgba(140,110,170,.12);
    }
:where(body[data-page="membre-dashboard"]) .welcome-card:nth-child(1) { background: linear-gradient(160deg,#fff0a9,#ecd66b); transform: rotate(-4deg); }
:where(body[data-page="membre-dashboard"]) .welcome-card:nth-child(2) { background: linear-gradient(160deg,#ddd0fb,#bea8ef); transform: translateY(-6px); }
:where(body[data-page="membre-dashboard"]) .welcome-card:nth-child(3) { background: linear-gradient(160deg,#ffd3df,#f0b3c8); transform: rotate(4deg); }
:where(body[data-page="membre-dashboard"]) .dash-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 22px;
    }
:where(body[data-page="membre-dashboard"]) .dash-block {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 24px;
      box-shadow: var(--shadow-sm);
      min-height: 420px;
    }
:where(body[data-page="membre-dashboard"]) .dash-block-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 18px;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--line);
      gap: 10px;
    }
:where(body[data-page="membre-dashboard"]) .dash-block-header h3 {
      font-size: 0.97rem;
      margin: 0;
      color: var(--text);
    }
:where(body[data-page="membre-dashboard"]) .dash-block-header a {
      font-size: 0.78rem;
      color: var(--lavender-deep);
      text-decoration: underline;
      text-underline-offset: 3px;
    }
:where(body[data-page="membre-dashboard"]) .consult-item {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 12px;
      background: var(--bg-soft);
      border-radius: var(--radius-md);
      border: 1px solid var(--line);
      transition: border-color 0.2s;
      margin-bottom: 10px;
    }
:where(body[data-page="membre-dashboard"]) .consult-item:last-child { margin-bottom: 0; }
:where(body[data-page="membre-dashboard"]) .consult-avatar {
      width: 46px;
      height: 46px;
      border-radius: 50%;
      background: linear-gradient(135deg, #e8d8f5, #f5e5cc);
      display: grid;
      place-items: center;
      font-family: var(--font-display);
      font-size: 1.05rem;
      color: #7a5c8a;
      flex-shrink: 0;
      overflow: hidden;
    }
:where(body[data-page="membre-dashboard"]) .consult-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
:where(body[data-page="membre-dashboard"]) .consult-info {
      flex: 1;
      min-width: 0;
    }
:where(body[data-page="membre-dashboard"]) .consult-info strong {
      display: block;
      font-size: 0.9rem;
      font-weight: 500;
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
:where(body[data-page="membre-dashboard"]) .consult-info span {
      font-size: 0.76rem;
      color: var(--text-xsoft);
      line-height: 1.5;
    }
:where(body[data-page="membre-dashboard"]) .consult-amount {
      font-size: 0.9rem;
      font-weight: 600;
      color: var(--text-soft);
      flex-shrink: 0;
    }
:where(body[data-page="membre-dashboard"]) .status-badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 3px 10px;
      border-radius: 999px;
      font-size: 0.68rem;
      font-weight: 600;
      margin-left: 8px;
    }
:where(body[data-page="membre-dashboard"]) .status-terminee { background: rgba(210,238,210,.7); color: #3a6040; }
:where(body[data-page="membre-dashboard"]) .status-en_attente, :where(body[data-page="membre-dashboard"]) .status-active { background: rgba(237,215,176,.6); color: #7a5a20; }
:where(body[data-page="membre-dashboard"]) .status-annulee { background: rgba(238,215,215,.7); color: #7a3535; }
:where(body[data-page="membre-dashboard"]) .empty-block {
      text-align: center;
      padding: 30px 16px;
    }
:where(body[data-page="membre-dashboard"]) .empty-block .empty-icon {
      font-size: 2rem;
      display: block;
      margin-bottom: 10px;
      opacity: 0.35;
    }
:where(body[data-page="membre-dashboard"]) .empty-block p {
      font-size: 0.84rem;
      color: var(--text-soft);
      margin-bottom: 14px;
    }
:where(body[data-page="membre-dashboard"]) .voyants-mini {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
:where(body[data-page="membre-dashboard"]) .voyant-mini-item {
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 14px 14px;
      border-radius: var(--radius-md);
      background: var(--bg-soft);
      border: 1px solid var(--line);
      text-decoration: none;
      color: inherit;
      transition: border-color 0.2s, transform 0.2s;
    }
:where(body[data-page="membre-dashboard"]) .voyant-mini-item:hover {
      border-color: rgba(180,155,210,.3);
      transform: translateX(3px);
    }
:where(body[data-page="membre-dashboard"]) .voyant-mini-avatar {
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background: linear-gradient(135deg, #e8d8f5, #f5e5cc);
      display: grid;
      place-items: center;
      font-family: var(--font-display);
      font-size: 1rem;
      color: #7a5c8a;
      flex-shrink: 0;
    }
:where(body[data-page="membre-dashboard"]) .voyant-mini-info {
      flex: 1;
      min-width: 0;
    }
:where(body[data-page="membre-dashboard"]) .voyant-mini-info strong {
      display: block;
      font-size: 0.9rem;
      font-weight: 500;
      margin-bottom: 3px;
    }
:where(body[data-page="membre-dashboard"]) .voyant-mini-info span {
      font-size: 0.76rem;
      color: var(--text-soft);
      line-height: 1.45;
    }
:where(body[data-page="membre-dashboard"]) .voyant-mini-cta {
      font-size: 0.76rem;
      padding: 7px 14px;
      border-radius: 999px;
      background: linear-gradient(135deg, #c4aee0, #e8d0a8);
      color: #3d2a4e;
      border: none;
      cursor: pointer;
      font-family: var(--font-body);
      font-weight: 500;
      flex-shrink: 0;
    }
      display: none;
      flex-direction: column;
      justify-content: center;
      gap: 5px;
      width: 38px;
      height: 38px;
      background: none;
      border: 1px solid var(--line);
      border-radius: var(--radius-sm);
      cursor: pointer;
      padding: 8px;
    }
      display: block;
      height: 1.5px;
      background: var(--text);
      border-radius: 2px;
    }
@media (max-width: 900px) {
  :where(body[data-page="membre-dashboard"]) .dash-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  :where(body[data-page="membre-dashboard"]) .dashboard-layout { grid-template-columns: 1fr; }
  :where(body[data-page="membre-dashboard"]) .dash-content { padding: 20px 16px; }
  :where(body[data-page="membre-dashboard"]) .dash-topbar { padding: 0 16px; }
  :where(body[data-page="membre-dashboard"]) .welcome-block { padding: 24px 20px; }
  :where(body[data-page="membre-dashboard"]) .welcome-inner { flex-direction: column; align-items: flex-start; }
  :where(body[data-page="membre-dashboard"]) .welcome-deco { display: none; }
}

/* === Page : membre-mes-consultations  (pages/membre/mes-consultations.html) === */
:where(body[data-page="membre-mes-consultations"]) .dashboard-layout { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
:where(body[data-page="membre-mes-consultations"]) .dashboard-main { background: var(--bg); overflow-y: auto; }
:where(body[data-page="membre-mes-consultations"]) .dash-topbar { position: sticky; top: 0; z-index: 10; background: rgba(250,247,244,.92); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); padding: 0 32px; height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
:where(body[data-page="membre-mes-consultations"]) .dash-topbar h1 { font-size: 1.05rem; font-weight: 500; color: var(--text); font-family: var(--font-body); }
:where(body[data-page="membre-mes-consultations"]) .dash-topbar-right { display: flex; align-items: center; gap: 12px; }
:where(body[data-page="membre-mes-consultations"]) .credits-pill { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; background: linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2)); border: 1px solid rgba(180,155,210,.2); border-radius: 999px; font-size: .82rem; color: #5a3d70; font-weight: 500; }
:where(body[data-page="membre-mes-consultations"]) .credits-pill .credit-dot { width: 7px; height: 7px; background: var(--gold); border-radius: 50%; }
:where(body[data-page="membre-mes-consultations"]) .dash-content { padding: 32px; max-width: 900px; }
:where(body[data-page="membre-mes-consultations"]) .stats-row {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
      margin-bottom: 28px;
    }
:where(body[data-page="membre-mes-consultations"]) .stat-mini {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 18px 20px;
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="membre-mes-consultations"]) .stat-mini .stat-val {
      font-family: var(--font-display);
      font-size: 1.7rem;
      font-weight: 600;
      color: #3d2e4a;
      line-height: 1;
      display: block;
      margin-bottom: 4px;
    }
:where(body[data-page="membre-mes-consultations"]) .stat-mini .stat-lbl { font-size: .76rem; color: var(--text-soft); }
:where(body[data-page="membre-mes-consultations"]) .filters-bar {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 14px 18px;
      margin-bottom: 20px;
      display: flex;
      align-items: center;
      gap: 12px;
      flex-wrap: wrap;
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="membre-mes-consultations"]) .filter-chips { display: flex; gap: 7px; flex-wrap: wrap; flex: 1; }
:where(body[data-page="membre-mes-consultations"]) .chip { display: inline-flex; align-items: center; gap: 5px; padding: 6px 13px; border-radius: 999px; border: 1px solid var(--line); background: var(--bg); font-size: .78rem; color: var(--text-soft); cursor: pointer; transition: all .2s; font-family: var(--font-body); white-space: nowrap; }
:where(body[data-page="membre-mes-consultations"]) .chip:hover { border-color: rgba(180,155,210,.35); color: var(--text); background: var(--bg-soft); }
:where(body[data-page="membre-mes-consultations"]) .chip.active { background: linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2)); border-color: rgba(180,155,210,.4); color: #5a4070; font-weight: 500; }
:where(body[data-page="membre-mes-consultations"]) .filter-search { position: relative; }
:where(body[data-page="membre-mes-consultations"]) .filter-search input { padding: 7px 14px 7px 32px; border: 1px solid var(--line); border-radius: 999px; background: var(--bg); font-family: var(--font-body); font-size: .8rem; color: var(--text); outline: none; width: 170px; transition: border-color .2s, box-shadow .2s, width .3s; }
:where(body[data-page="membre-mes-consultations"]) .filter-search input:focus { border-color: rgba(180,155,210,.45); box-shadow: 0 0 0 3px rgba(196,174,224,.12); width: 210px; }
:where(body[data-page="membre-mes-consultations"]) .filter-search input::placeholder { color: var(--text-xsoft); }
:where(body[data-page="membre-mes-consultations"]) .search-icon { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); font-size: .78rem; color: var(--text-xsoft); pointer-events: none; }
:where(body[data-page="membre-mes-consultations"]) .consult-list { display: flex; flex-direction: column; gap: 14px; }
:where(body[data-page="membre-mes-consultations"]) .consult-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 20px 22px;
      box-shadow: var(--shadow-sm);
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 16px;
      align-items: center;
      transition: transform .25s, box-shadow .25s, border-color .25s;
      cursor: pointer;
      text-decoration: none;
      color: inherit;
    }
:where(body[data-page="membre-mes-consultations"]) .consult-card:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-md);
      border-color: rgba(180,155,210,.2);
    }
:where(body[data-page="membre-mes-consultations"]) .consult-avatar {
      width: 54px; height: 54px;
      border-radius: 50%;
      background: linear-gradient(135deg, #e8d8f5, #f5e5cc);
      display: grid;
      place-items: center;
      font-family: var(--font-display);
      font-size: 1.3rem;
      color: #7a5c8a;
      flex-shrink: 0;
    }
:where(body[data-page="membre-mes-consultations"]) .consult-info { min-width: 0; }
:where(body[data-page="membre-mes-consultations"]) .consult-info-top {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 5px;
      flex-wrap: wrap;
    }
:where(body[data-page="membre-mes-consultations"]) .consult-voyant { font-size: .95rem; font-weight: 500; color: var(--text); font-family: var(--font-display); }
:where(body[data-page="membre-mes-consultations"]) .consult-specialite { font-size: .76rem; color: var(--text-soft); }
:where(body[data-page="membre-mes-consultations"]) .consult-meta {
      display: flex;
      align-items: center;
      gap: 14px;
      font-size: .78rem;
      color: var(--text-xsoft);
      flex-wrap: wrap;
    }
:where(body[data-page="membre-mes-consultations"]) .consult-meta span { display: flex; align-items: center; gap: 4px; }
:where(body[data-page="membre-mes-consultations"]) .consult-right { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex-shrink: 0; }
:where(body[data-page="membre-mes-consultations"]) .consult-montant { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; color: #3d2e4a; }
:where(body[data-page="membre-mes-consultations"]) .consult-duree { font-size: .76rem; color: var(--text-xsoft); }
:where(body[data-page="membre-mes-consultations"]) .badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 3px 10px;
      border-radius: 999px;
      font-size: .72rem;
      font-weight: 500;
    }
:where(body[data-page="membre-mes-consultations"]) .badge-done { background: rgba(210,238,210,.7); color: #3a6040; }
:where(body[data-page="membre-mes-consultations"]) .badge-pending { background: rgba(237,215,176,.6); color: #7a5a20; }
:where(body[data-page="membre-mes-consultations"]) .badge-cancel { background: rgba(238,215,215,.7); color: #7a3535; }
:where(body[data-page="membre-mes-consultations"]) .note-stars { color: var(--gold); font-size: .72rem; letter-spacing: 1px; }
:where(body[data-page="membre-mes-consultations"]) .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(40,28,55,.4);
      backdrop-filter: blur(6px);
      z-index: 100;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      opacity: 0;
      pointer-events: none;
      transition: opacity .3s;
    }
:where(body[data-page="membre-mes-consultations"]) .modal-overlay.open { opacity: 1; pointer-events: all; }
:where(body[data-page="membre-mes-consultations"]) .modal {
      background: var(--surface);
      border: 1px solid rgba(190,170,220,.18);
      border-radius: var(--radius-xl);
      box-shadow: 0 32px 80px rgba(80,60,100,.2);
      width: 100%;
      max-width: 520px;
      max-height: 90vh;
      overflow-y: auto;
      padding: 32px;
      transform: translateY(20px);
      transition: transform .3s;
    }
:where(body[data-page="membre-mes-consultations"]) .modal-overlay.open .modal { transform: translateY(0); }
:where(body[data-page="membre-mes-consultations"]) .modal-header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      margin-bottom: 24px;
      gap: 12px;
    }
:where(body[data-page="membre-mes-consultations"]) .modal-header h2 { font-size: 1.3rem; }
:where(body[data-page="membre-mes-consultations"]) .modal-close { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line); background: none; cursor: pointer; font-size: 1rem; color: var(--text-soft); display: grid; place-items: center; transition: background .2s; flex-shrink: 0; }
:where(body[data-page="membre-mes-consultations"]) .modal-close:hover { background: var(--bg-soft); }
:where(body[data-page="membre-mes-consultations"]) .modal-voyant-row {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 16px;
      background: var(--bg-soft);
      border-radius: var(--radius-md);
      margin-bottom: 20px;
    }
:where(body[data-page="membre-mes-consultations"]) .modal-avatar { width: 52px; height: 52px; border-radius: 50%; background: linear-gradient(135deg,#e8d8f5,#f5e5cc); display: grid; place-items: center; font-family: var(--font-display); font-size: 1.3rem; color: #7a5c8a; flex-shrink: 0; }
:where(body[data-page="membre-mes-consultations"]) .modal-details { display: flex; flex-direction: column; gap: 10px; margin-bottom: 22px; }
:where(body[data-page="membre-mes-consultations"]) .detail-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: .85rem; }
:where(body[data-page="membre-mes-consultations"]) .detail-row:last-child { border-bottom: none; }
:where(body[data-page="membre-mes-consultations"]) .detail-row .lbl { color: var(--text-soft); }
:where(body[data-page="membre-mes-consultations"]) .detail-row .val { font-weight: 500; color: var(--text); }
:where(body[data-page="membre-mes-consultations"]) .modal-avis { margin-top: 20px; }
:where(body[data-page="membre-mes-consultations"]) .modal-avis h3 { font-size: .95rem; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
:where(body[data-page="membre-mes-consultations"]) .stars-input { display: flex; gap: 6px; margin-bottom: 12px; }
:where(body[data-page="membre-mes-consultations"]) .star-btn { background: none; border: none; font-size: 1.4rem; cursor: pointer; color: var(--line); transition: color .15s, transform .15s; }
:where(body[data-page="membre-mes-consultations"]) .star-btn.active, :where(body[data-page="membre-mes-consultations"]) .star-btn:hover { color: var(--gold); transform: scale(1.15); }
:where(body[data-page="membre-mes-consultations"]) .avis-textarea { width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--radius-md); font-family: var(--font-body); font-size: .85rem; color: var(--text); outline: none; resize: vertical; min-height: 80px; transition: border-color .25s, box-shadow .25s; }
:where(body[data-page="membre-mes-consultations"]) .avis-textarea:focus { border-color: rgba(180,155,210,.5); box-shadow: 0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="membre-mes-consultations"]) .avis-already { font-size: .82rem; color: var(--text-soft); font-style: italic; display: flex; align-items: center; gap: 6px; }
:where(body[data-page="membre-mes-consultations"]) .empty-state { text-align: center; padding: 60px 20px; }
:where(body[data-page="membre-mes-consultations"]) .empty-icon { font-size: 2.8rem; display: block; margin-bottom: 16px; opacity: .35; }
:where(body[data-page="membre-mes-consultations"]) .empty-state h3 { font-size: 1.1rem; margin-bottom: 8px; }
:where(body[data-page="membre-mes-consultations"]) .empty-state p { font-size: .87rem; color: var(--text-soft); margin-bottom: 22px; }
:where(body[data-page="membre-mes-consultations"]) .pagination { display: flex; justify-content: center; align-items: center; gap: 7px; margin-top: 28px; }
:where(body[data-page="membre-mes-consultations"]) .page-btn { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); font-family: var(--font-body); font-size: .82rem; color: var(--text-soft); cursor: pointer; display: grid; place-items: center; transition: all .2s; }
:where(body[data-page="membre-mes-consultations"]) .page-btn:hover { border-color: rgba(180,155,210,.35); color: var(--text); }
:where(body[data-page="membre-mes-consultations"]) .page-btn.active { background: linear-gradient(135deg,#c4aee0,#e8d0a8); color: #3d2a4e; border-color: transparent; font-weight: 500; }
:where(body[data-page="membre-mes-consultations"]) .page-btn:disabled { opacity: .3; cursor: default; }
@media (max-width: 900px) {
  :where(body[data-page="membre-mes-consultations"]) .stats-row { grid-template-columns: repeat(2, 1fr); }
  :where(body[data-page="membre-mes-consultations"]) .consult-card { grid-template-columns: auto 1fr; }
  :where(body[data-page="membre-mes-consultations"]) .consult-right { flex-direction: row; align-items: center; grid-column: 1 / -1; justify-content: space-between; padding-top: 10px; border-top: 1px solid var(--line); }
}
@media (max-width: 768px) {
  :where(body[data-page="membre-mes-consultations"]) .dashboard-layout { grid-template-columns: 1fr; }
  :where(body[data-page="membre-mes-consultations"]) .dash-content { padding: 20px 16px; }
  :where(body[data-page="membre-mes-consultations"]) .dash-topbar { padding: 0 16px; }
  :where(body[data-page="membre-mes-consultations"]) .stats-row { grid-template-columns: repeat(2, 1fr); }
  :where(body[data-page="membre-mes-consultations"]) .filters-bar { flex-direction: column; align-items: flex-start; }
  :where(body[data-page="membre-mes-consultations"]) .filter-search input { width: 100%; }
  :where(body[data-page="membre-mes-consultations"]) .filter-search input:focus { width: 100%; }
  :where(body[data-page="membre-mes-consultations"]) .filter-search { width: 100%; }
}
@media (max-width: 480px) {
  :where(body[data-page="membre-mes-consultations"]) .stats-row { grid-template-columns: 1fr 1fr; }
  :where(body[data-page="membre-mes-consultations"]) .consult-card { grid-template-columns: auto 1fr; gap: 12px; padding: 16px; }
}
:where(body[data-page="membre-mes-consultations"]) .dashboard-layout { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
:where(body[data-page="membre-mes-consultations"]) .dashboard-main { background: var(--bg); overflow-y: auto; }
:where(body[data-page="membre-mes-consultations"]) .dash-topbar { position: sticky; top: 0; z-index: 10; background: rgba(250,247,244,.92); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); padding: 0 32px; height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
:where(body[data-page="membre-mes-consultations"]) .dash-topbar h1 { font-size: 1.05rem; font-weight: 500; color: var(--text); font-family: var(--font-body); }
:where(body[data-page="membre-mes-consultations"]) .dash-topbar-right { display: flex; align-items: center; gap: 12px; }
:where(body[data-page="membre-mes-consultations"]) .credits-pill { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; background: linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2)); border: 1px solid rgba(180,155,210,.2); border-radius: 999px; font-size: .82rem; color: #5a3d70; font-weight: 500; }
:where(body[data-page="membre-mes-consultations"]) .credits-pill .credit-dot { width: 7px; height: 7px; background: var(--gold); border-radius: 50%; }
:where(body[data-page="membre-mes-consultations"]) .dash-content { padding: 32px; max-width: 900px; }
:where(body[data-page="membre-mes-consultations"]) .stats-row {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 14px;
      margin-bottom: 28px;
    }
:where(body[data-page="membre-mes-consultations"]) .stat-mini {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 18px 20px;
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="membre-mes-consultations"]) .stat-mini .stat-val {
      font-family: var(--font-display);
      font-size: 1.7rem;
      font-weight: 600;
      color: #3d2e4a;
      line-height: 1;
      display: block;
      margin-bottom: 4px;
    }
:where(body[data-page="membre-mes-consultations"]) .stat-mini .stat-lbl { font-size: .76rem; color: var(--text-soft); }
:where(body[data-page="membre-mes-consultations"]) .filters-bar {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 14px 18px;
      margin-bottom: 20px;
      display: flex;
      align-items: center;
      gap: 12px;
      flex-wrap: wrap;
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="membre-mes-consultations"]) .filter-chips { display: flex; gap: 7px; flex-wrap: wrap; flex: 1; }
:where(body[data-page="membre-mes-consultations"]) .chip { display: inline-flex; align-items: center; gap: 5px; padding: 6px 13px; border-radius: 999px; border: 1px solid var(--line); background: var(--bg); font-size: .78rem; color: var(--text-soft); cursor: pointer; transition: all .2s; font-family: var(--font-body); white-space: nowrap; }
:where(body[data-page="membre-mes-consultations"]) .chip:hover { border-color: rgba(180,155,210,.35); color: var(--text); background: var(--bg-soft); }
:where(body[data-page="membre-mes-consultations"]) .chip.active { background: linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2)); border-color: rgba(180,155,210,.4); color: #5a4070; font-weight: 500; }
:where(body[data-page="membre-mes-consultations"]) .filter-search { position: relative; }
:where(body[data-page="membre-mes-consultations"]) .filter-search input { padding: 7px 14px 7px 32px; border: 1px solid var(--line); border-radius: 999px; background: var(--bg); font-family: var(--font-body); font-size: .8rem; color: var(--text); outline: none; width: 170px; transition: border-color .2s, box-shadow .2s, width .3s; }
:where(body[data-page="membre-mes-consultations"]) .filter-search input:focus { border-color: rgba(180,155,210,.45); box-shadow: 0 0 0 3px rgba(196,174,224,.12); width: 210px; }
:where(body[data-page="membre-mes-consultations"]) .filter-search input::placeholder { color: var(--text-xsoft); }
:where(body[data-page="membre-mes-consultations"]) .search-icon { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); font-size: .78rem; color: var(--text-xsoft); pointer-events: none; }
:where(body[data-page="membre-mes-consultations"]) .consult-list { display: flex; flex-direction: column; gap: 14px; }
:where(body[data-page="membre-mes-consultations"]) .consult-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 20px 22px;
      box-shadow: var(--shadow-sm);
      display: grid;
      grid-template-columns: auto 1fr auto;
      gap: 16px;
      align-items: center;
      transition: transform .25s, box-shadow .25s, border-color .25s;
      cursor: pointer;
      text-decoration: none;
      color: inherit;
    }
:where(body[data-page="membre-mes-consultations"]) .consult-card:hover {
      transform: translateY(-2px);
      box-shadow: var(--shadow-md);
      border-color: rgba(180,155,210,.2);
    }
:where(body[data-page="membre-mes-consultations"]) .consult-avatar {
      width: 54px; height: 54px;
      border-radius: 50%;
      background: linear-gradient(135deg, #e8d8f5, #f5e5cc);
      display: grid;
      place-items: center;
      font-family: var(--font-display);
      font-size: 1.3rem;
      color: #7a5c8a;
      flex-shrink: 0;
    }
:where(body[data-page="membre-mes-consultations"]) .consult-info { min-width: 0; }
:where(body[data-page="membre-mes-consultations"]) .consult-info-top {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 5px;
      flex-wrap: wrap;
    }
:where(body[data-page="membre-mes-consultations"]) .consult-voyant { font-size: .95rem; font-weight: 500; color: var(--text); font-family: var(--font-display); }
:where(body[data-page="membre-mes-consultations"]) .consult-specialite { font-size: .76rem; color: var(--text-soft); }
:where(body[data-page="membre-mes-consultations"]) .consult-meta {
      display: flex;
      align-items: center;
      gap: 14px;
      font-size: .78rem;
      color: var(--text-xsoft);
      flex-wrap: wrap;
    }
:where(body[data-page="membre-mes-consultations"]) .consult-meta span { display: flex; align-items: center; gap: 4px; }
:where(body[data-page="membre-mes-consultations"]) .consult-right { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex-shrink: 0; }
:where(body[data-page="membre-mes-consultations"]) .consult-montant { font-family: var(--font-display); font-size: 1.05rem; font-weight: 600; color: #3d2e4a; }
:where(body[data-page="membre-mes-consultations"]) .consult-duree { font-size: .76rem; color: var(--text-xsoft); }
:where(body[data-page="membre-mes-consultations"]) .badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 3px 10px;
      border-radius: 999px;
      font-size: .72rem;
      font-weight: 500;
    }
:where(body[data-page="membre-mes-consultations"]) .badge-done { background: rgba(210,238,210,.7); color: #3a6040; }
:where(body[data-page="membre-mes-consultations"]) .badge-pending { background: rgba(237,215,176,.6); color: #7a5a20; }
:where(body[data-page="membre-mes-consultations"]) .badge-cancel { background: rgba(238,215,215,.7); color: #7a3535; }
:where(body[data-page="membre-mes-consultations"]) .note-stars { color: var(--gold); font-size: .72rem; letter-spacing: 1px; }
:where(body[data-page="membre-mes-consultations"]) .modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(40,28,55,.4);
      backdrop-filter: blur(6px);
      z-index: 100;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      opacity: 0;
      pointer-events: none;
      transition: opacity .3s;
    }
:where(body[data-page="membre-mes-consultations"]) .modal-overlay.open { opacity: 1; pointer-events: all; }
:where(body[data-page="membre-mes-consultations"]) .modal {
      background: var(--surface);
      border: 1px solid rgba(190,170,220,.18);
      border-radius: var(--radius-xl);
      box-shadow: 0 32px 80px rgba(80,60,100,.2);
      width: 100%;
      max-width: 520px;
      max-height: 90vh;
      overflow-y: auto;
      padding: 32px;
      transform: translateY(20px);
      transition: transform .3s;
    }
:where(body[data-page="membre-mes-consultations"]) .modal-overlay.open .modal { transform: translateY(0); }
:where(body[data-page="membre-mes-consultations"]) .modal-header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      margin-bottom: 24px;
      gap: 12px;
    }
:where(body[data-page="membre-mes-consultations"]) .modal-header h2 { font-size: 1.3rem; }
:where(body[data-page="membre-mes-consultations"]) .modal-close { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--line); background: none; cursor: pointer; font-size: 1rem; color: var(--text-soft); display: grid; place-items: center; transition: background .2s; flex-shrink: 0; }
:where(body[data-page="membre-mes-consultations"]) .modal-close:hover { background: var(--bg-soft); }
:where(body[data-page="membre-mes-consultations"]) .modal-voyant-row {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 16px;
      background: var(--bg-soft);
      border-radius: var(--radius-md);
      margin-bottom: 20px;
    }
:where(body[data-page="membre-mes-consultations"]) .modal-avatar { width: 52px; height: 52px; border-radius: 50%; background: linear-gradient(135deg,#e8d8f5,#f5e5cc); display: grid; place-items: center; font-family: var(--font-display); font-size: 1.3rem; color: #7a5c8a; flex-shrink: 0; }
:where(body[data-page="membre-mes-consultations"]) .modal-details { display: flex; flex-direction: column; gap: 10px; margin-bottom: 22px; }
:where(body[data-page="membre-mes-consultations"]) .detail-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--line); font-size: .85rem; }
:where(body[data-page="membre-mes-consultations"]) .detail-row:last-child { border-bottom: none; }
:where(body[data-page="membre-mes-consultations"]) .detail-row .lbl { color: var(--text-soft); }
:where(body[data-page="membre-mes-consultations"]) .detail-row .val { font-weight: 500; color: var(--text); }
:where(body[data-page="membre-mes-consultations"]) .modal-avis { margin-top: 20px; }
:where(body[data-page="membre-mes-consultations"]) .modal-avis h3 { font-size: .95rem; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
:where(body[data-page="membre-mes-consultations"]) .stars-input { display: flex; gap: 6px; margin-bottom: 12px; }
:where(body[data-page="membre-mes-consultations"]) .star-btn { background: none; border: none; font-size: 1.4rem; cursor: pointer; color: var(--line); transition: color .15s, transform .15s; }
:where(body[data-page="membre-mes-consultations"]) .star-btn.active, :where(body[data-page="membre-mes-consultations"]) .star-btn:hover { color: var(--gold); transform: scale(1.15); }
:where(body[data-page="membre-mes-consultations"]) .avis-textarea { width: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: var(--radius-md); font-family: var(--font-body); font-size: .85rem; color: var(--text); outline: none; resize: vertical; min-height: 80px; transition: border-color .25s, box-shadow .25s; }
:where(body[data-page="membre-mes-consultations"]) .avis-textarea:focus { border-color: rgba(180,155,210,.5); box-shadow: 0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="membre-mes-consultations"]) .avis-already { font-size: .82rem; color: var(--text-soft); font-style: italic; display: flex; align-items: center; gap: 6px; }
:where(body[data-page="membre-mes-consultations"]) .empty-state { text-align: center; padding: 60px 20px; }
:where(body[data-page="membre-mes-consultations"]) .empty-icon { font-size: 2.8rem; display: block; margin-bottom: 16px; opacity: .35; }
:where(body[data-page="membre-mes-consultations"]) .empty-state h3 { font-size: 1.1rem; margin-bottom: 8px; }
:where(body[data-page="membre-mes-consultations"]) .empty-state p { font-size: .87rem; color: var(--text-soft); margin-bottom: 22px; }
:where(body[data-page="membre-mes-consultations"]) .pagination { display: flex; justify-content: center; align-items: center; gap: 7px; margin-top: 28px; }
:where(body[data-page="membre-mes-consultations"]) .page-btn { width: 36px; height: 36px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); font-family: var(--font-body); font-size: .82rem; color: var(--text-soft); cursor: pointer; display: grid; place-items: center; transition: all .2s; }
:where(body[data-page="membre-mes-consultations"]) .page-btn:hover { border-color: rgba(180,155,210,.35); color: var(--text); }
:where(body[data-page="membre-mes-consultations"]) .page-btn.active { background: linear-gradient(135deg,#c4aee0,#e8d0a8); color: #3d2a4e; border-color: transparent; font-weight: 500; }
:where(body[data-page="membre-mes-consultations"]) .page-btn:disabled { opacity: .3; cursor: default; }
@media (max-width: 900px) {
  :where(body[data-page="membre-mes-consultations"]) .stats-row { grid-template-columns: repeat(2, 1fr); }
  :where(body[data-page="membre-mes-consultations"]) .consult-card { grid-template-columns: auto 1fr; }
  :where(body[data-page="membre-mes-consultations"]) .consult-right { flex-direction: row; align-items: center; grid-column: 1 / -1; justify-content: space-between; padding-top: 10px; border-top: 1px solid var(--line); }
}
@media (max-width: 768px) {
  :where(body[data-page="membre-mes-consultations"]) .dashboard-layout { grid-template-columns: 1fr; }
  :where(body[data-page="membre-mes-consultations"]) .dash-content { padding: 20px 16px; }
  :where(body[data-page="membre-mes-consultations"]) .dash-topbar { padding: 0 16px; }
  :where(body[data-page="membre-mes-consultations"]) .stats-row { grid-template-columns: repeat(2, 1fr); }
  :where(body[data-page="membre-mes-consultations"]) .filters-bar { flex-direction: column; align-items: flex-start; }
  :where(body[data-page="membre-mes-consultations"]) .filter-search input { width: 100%; }
  :where(body[data-page="membre-mes-consultations"]) .filter-search input:focus { width: 100%; }
  :where(body[data-page="membre-mes-consultations"]) .filter-search { width: 100%; }
}
@media (max-width: 480px) {
  :where(body[data-page="membre-mes-consultations"]) .stats-row { grid-template-columns: 1fr 1fr; }
  :where(body[data-page="membre-mes-consultations"]) .consult-card { grid-template-columns: auto 1fr; gap: 12px; padding: 16px; }
}

/* === Page : membre-mes-credits  (pages/membre/mes-credits.html) === */
:where(body[data-page="membre-mes-credits"]) .dashboard-layout { display: grid; grid-template-columns: 240px 1fr; min-height: 100vh; }
:where(body[data-page="membre-mes-credits"]) .dashboard-main { background: var(--bg); overflow-y: auto; }
:where(body[data-page="membre-mes-credits"]) .dash-topbar { position: sticky; top: 0; z-index: 10; background: rgba(250,247,244,.92); backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); padding: 0 32px; height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
:where(body[data-page="membre-mes-credits"]) .dash-topbar h1 { font-size: 1.05rem; font-weight: 500; color: var(--text); font-family: var(--font-body); }
:where(body[data-page="membre-mes-credits"]) .credits-pill { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; background: linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2)); border: 1px solid rgba(180,155,210,.2); border-radius: 999px; font-size: .82rem; color: #5a3d70; font-weight: 500; }
:where(body[data-page="membre-mes-credits"]) .credits-pill .credit-dot { width: 7px; height: 7px; background: var(--gold); border-radius: 50%; }
:where(body[data-page="membre-mes-credits"]) .dash-content { padding: 32px; max-width: 860px; }
:where(body[data-page="membre-mes-credits"]) .solde-hero {
      background: linear-gradient(135deg, #f0e8fc 0%, #fdf5e8 50%, #e8f0fc 100%);
      border: 1px solid rgba(190,170,220,.15);
      border-radius: var(--radius-xl);
      padding: 36px 40px;
      margin-bottom: 28px;
      position: relative;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      flex-wrap: wrap;
    }
:where(body[data-page="membre-mes-credits"]) .solde-hero::before {
      content: '';
      position: absolute;
      top: -60px; right: -60px;
      width: 260px; height: 260px;
      background: radial-gradient(circle, rgba(195,165,228,.3), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="membre-mes-credits"]) .solde-hero::after {
      content: '';
      position: absolute;
      bottom: -40px; left: -40px;
      width: 200px; height: 200px;
      background: radial-gradient(circle, rgba(237,215,176,.25), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="membre-mes-credits"]) .solde-left { position: relative; z-index: 1; }
:where(body[data-page="membre-mes-credits"]) .solde-label { font-size: .8rem; font-weight: 500; color: var(--text-soft); letter-spacing: .03em; text-transform: uppercase; margin-bottom: 8px; display: block; }
:where(body[data-page="membre-mes-credits"]) .solde-value {
      font-family: var(--font-display);
      font-size: clamp(2.8rem, 6vw, 4rem);
      font-weight: 600;
      color: #3d2e4a;
      line-height: 1;
      display: flex;
      align-items: baseline;
      gap: 10px;
    }
:where(body[data-page="membre-mes-credits"]) .solde-unit { font-size: 1rem; color: var(--text-soft); font-weight: 400; }
:where(body[data-page="membre-mes-credits"]) .solde-sub { margin-top: 10px; font-size: .82rem; color: var(--text-soft); }
:where(body[data-page="membre-mes-credits"]) .solde-sub strong { color: var(--text); }
:where(body[data-page="membre-mes-credits"]) .solde-right { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 10px; }
:where(body[data-page="membre-mes-credits"]) .packs-section { margin-bottom: 28px; }
:where(body[data-page="membre-mes-credits"]) .packs-section h2 { font-size: 1.1rem; margin-bottom: 18px; }
:where(body[data-page="membre-mes-credits"]) .packs-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
    }
:where(body[data-page="membre-mes-credits"]) .pack-card {
      background: var(--surface);
      border: 2px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 24px 20px;
      cursor: pointer;
      transition: border-color .25s, box-shadow .25s, transform .25s;
      position: relative;
      text-align: center;
    }
:where(body[data-page="membre-mes-credits"]) .pack-card:hover {
      border-color: rgba(180,155,210,.35);
      box-shadow: var(--shadow-md);
      transform: translateY(-3px);
    }
:where(body[data-page="membre-mes-credits"]) .pack-card.selected {
      border-color: var(--lavender-deep);
      box-shadow: 0 0 0 3px rgba(155,126,200,.15);
    }
:where(body[data-page="membre-mes-credits"]) .pack-badge {
      position: absolute;
      top: -11px;
      left: 50%;
      transform: translateX(-50%);
      background: linear-gradient(135deg, #c4aee0, #e8d0a8);
      color: #3d2a4e;
      font-size: .68rem;
      font-weight: 600;
      padding: 3px 12px;
      border-radius: 999px;
      white-space: nowrap;
    }
:where(body[data-page="membre-mes-credits"]) .pack-icon { font-size: 1.8rem; display: block; margin-bottom: 10px; }
:where(body[data-page="membre-mes-credits"]) .pack-credits {
      font-family: var(--font-display);
      font-size: 2.2rem;
      font-weight: 600;
      color: #3d2e4a;
      line-height: 1;
      display: block;
      margin-bottom: 3px;
    }
:where(body[data-page="membre-mes-credits"]) .pack-credits-label { font-size: .76rem; color: var(--text-soft); display: block; margin-bottom: 14px; }
:where(body[data-page="membre-mes-credits"]) .pack-price {
      font-size: 1.3rem;
      font-weight: 600;
      color: var(--text);
      display: block;
      margin-bottom: 4px;
    }
:where(body[data-page="membre-mes-credits"]) .pack-unit { font-size: .74rem; color: var(--text-xsoft); }
:where(body[data-page="membre-mes-credits"]) .pack-saving {
      display: inline-block;
      margin-top: 10px;
      font-size: .72rem;
      color: #4a7050;
      background: rgba(210,238,210,.6);
      padding: 2px 8px;
      border-radius: 999px;
    }
:where(body[data-page="membre-mes-credits"]) .paiement-block {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 28px;
      box-shadow: var(--shadow-sm);
      margin-bottom: 28px;
    }
:where(body[data-page="membre-mes-credits"]) .paiement-block h2 { font-size: 1rem; margin-bottom: 20px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
:where(body[data-page="membre-mes-credits"]) .order-summary {
      background: var(--bg-soft);
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      padding: 16px 18px;
      margin-bottom: 20px;
    }
:where(body[data-page="membre-mes-credits"]) .order-row { display: flex; justify-content: space-between; align-items: center; font-size: .85rem; padding: 5px 0; }
:where(body[data-page="membre-mes-credits"]) .order-row.total { font-weight: 600; font-size: .95rem; color: var(--text); border-top: 1px solid var(--line); padding-top: 10px; margin-top: 5px; }
:where(body[data-page="membre-mes-credits"]) .order-row .lbl { color: var(--text-soft); }
:where(body[data-page="membre-mes-credits"]) .payment-methods { display: flex; flex-direction: column; gap: 10px; margin-bottom: 20px; }
:where(body[data-page="membre-mes-credits"]) .payment-method {
      display: flex;
      align-items: center;
      gap: 14px;
      padding: 14px 16px;
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      cursor: pointer;
      transition: border-color .2s, background .2s;
    }
:where(body[data-page="membre-mes-credits"]) .payment-method:hover { border-color: rgba(180,155,210,.3); background: var(--bg-soft); }
:where(body[data-page="membre-mes-credits"]) .payment-method.selected { border-color: var(--lavender-deep); background: rgba(196,174,224,.08); }
:where(body[data-page="membre-mes-credits"]) .payment-method input[type=radio] { accent-color: var(--lavender-deep); width: 16px; height: 16px; flex-shrink: 0; }
:where(body[data-page="membre-mes-credits"]) .payment-icon { font-size: 1.3rem; flex-shrink: 0; }
:where(body[data-page="membre-mes-credits"]) .payment-info strong { display: block; font-size: .87rem; font-weight: 500; }
:where(body[data-page="membre-mes-credits"]) .payment-info span { font-size: .76rem; color: var(--text-soft); }
:where(body[data-page="membre-mes-credits"]) .payment-logos { margin-left: auto; display: flex; gap: 6px; }
:where(body[data-page="membre-mes-credits"]) .card-logo { padding: 3px 8px; border: 1px solid var(--line); border-radius: 4px; font-size: .68rem; font-weight: 600; color: var(--text-soft); background: var(--surface); }
:where(body[data-page="membre-mes-credits"]) .card-fields { display: none; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
:where(body[data-page="membre-mes-credits"]) .card-fields.visible { display: block; }
:where(body[data-page="membre-mes-credits"]) .form-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
:where(body[data-page="membre-mes-credits"]) .form-group { margin-bottom: 14px; }
:where(body[data-page="membre-mes-credits"]) .form-group:last-child { margin-bottom: 0; }
:where(body[data-page="membre-mes-credits"]) label { display: block; font-size: .78rem; font-weight: 500; color: var(--text); margin-bottom: 6px; }
:where(body[data-page="membre-mes-credits"]) .input-wrap { position: relative; }
:where(body[data-page="membre-mes-credits"]) .input-icon { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); font-size: .85rem; color: var(--text-xsoft); pointer-events: none; transition: color .2s; }
:where(body[data-page="membre-mes-credits"]) .input-wrap:focus-within .input-icon { color: var(--lavender-deep); }
:where(body[data-page="membre-mes-credits"]) input[type=text] { width: 100%; padding: 11px 13px 11px 36px; border: 1px solid var(--line); border-radius: var(--radius-md); background: var(--surface); font-family: var(--font-body); font-size: .86rem; color: var(--text); outline: none; transition: border-color .25s, box-shadow .25s; }
:where(body[data-page="membre-mes-credits"]) input:focus { border-color: rgba(180,155,210,.5); box-shadow: 0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="membre-mes-credits"]) .no-icon input { padding-left: 13px; }
:where(body[data-page="membre-mes-credits"]) .secure-note {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: .76rem;
      color: var(--text-xsoft);
      margin-bottom: 18px;
    }
:where(body[data-page="membre-mes-credits"]) .secure-note::before { content: '🔒'; font-size: .85rem; }
:where(body[data-page="membre-mes-credits"]) .btn-pay { width: 100%; justify-content: center; padding: 15px 24px; font-size: .9rem; font-weight: 500; position: relative; overflow: hidden; }
:where(body[data-page="membre-mes-credits"]) .btn-pay::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg,rgba(255,255,255,.18),transparent); pointer-events: none; }
:where(body[data-page="membre-mes-credits"]) .btn-pay.loading { pointer-events: none; opacity: .75; }
:where(body[data-page="membre-mes-credits"]) .btn-pay.loading .btn-text { opacity: 0; }
:where(body[data-page="membre-mes-credits"]) .btn-pay .spinner { display: none; position: absolute; width: 18px; height: 18px; border: 2px solid rgba(60,40,80,.2); border-top-color: #3d2a4e; border-radius: 50%; animation: _membre_mes_credits__spin .7s linear infinite; }
:where(body[data-page="membre-mes-credits"]) .btn-pay.loading .spinner { display: block; }
:where(body[data-page="membre-mes-credits"]) .history-block { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: 24px; box-shadow: var(--shadow-sm); }
:where(body[data-page="membre-mes-credits"]) .history-block-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
:where(body[data-page="membre-mes-credits"]) .history-block-header h2 { font-size: 1rem; }
:where(body[data-page="membre-mes-credits"]) .tx-list { display: flex; flex-direction: column; }
:where(body[data-page="membre-mes-credits"]) .tx-item { display: flex; align-items: center; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--line); }
:where(body[data-page="membre-mes-credits"]) .tx-item:last-child { border-bottom: none; }
:where(body[data-page="membre-mes-credits"]) .tx-icon { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-size: .95rem; flex-shrink: 0; }
:where(body[data-page="membre-mes-credits"]) .tx-icon.credit { background: rgba(210,238,210,.6); }
:where(body[data-page="membre-mes-credits"]) .tx-icon.debit { background: rgba(238,215,215,.6); }
:where(body[data-page="membre-mes-credits"]) .tx-info { flex: 1; min-width: 0; }
:where(body[data-page="membre-mes-credits"]) .tx-info strong { display: block; font-size: .85rem; font-weight: 500; color: var(--text); }
:where(body[data-page="membre-mes-credits"]) .tx-info span { font-size: .75rem; color: var(--text-xsoft); }
:where(body[data-page="membre-mes-credits"]) .tx-amount { font-size: .9rem; font-weight: 600; flex-shrink: 0; }
:where(body[data-page="membre-mes-credits"]) .tx-amount.credit { color: #3a6040; }
:where(body[data-page="membre-mes-credits"]) .tx-amount.debit { color: #7a3535; }
:where(body[data-page="membre-mes-credits"]) .tx-credits { font-size: .75rem; color: var(--text-xsoft); text-align: right; display: block; }
:where(body[data-page="membre-mes-credits"]) .pay-alert { padding: 12px 16px; border-radius: var(--radius-md); font-size: .84rem; margin-bottom: 16px; display: none; line-height: 1.55; }
:where(body[data-page="membre-mes-credits"]) .pay-alert.error { display: block; background: rgba(238,215,215,.7); color: #7a3535; border: 1px solid rgba(200,150,150,.3); }
:where(body[data-page="membre-mes-credits"]) .pay-alert.success { display: block; background: rgba(210,238,210,.7); color: #3a6040; border: 1px solid rgba(150,200,150,.3); }
@media (max-width: 900px) {
  :where(body[data-page="membre-mes-credits"]) .packs-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
  :where(body[data-page="membre-mes-credits"]) .dashboard-layout { grid-template-columns: 1fr; }
  :where(body[data-page="membre-mes-credits"]) .dash-content { padding: 20px 16px; }
  :where(body[data-page="membre-mes-credits"]) .dash-topbar { padding: 0 16px; }
  :where(body[data-page="membre-mes-credits"]) .solde-hero { flex-direction: column; align-items: flex-start; padding: 26px 22px; }
  :where(body[data-page="membre-mes-credits"]) .solde-right { width: 100%; }
  :where(body[data-page="membre-mes-credits"]) .solde-right .btn { width: 100%; justify-content: center; }
}
@media (max-width: 560px) {
  :where(body[data-page="membre-mes-credits"]) .packs-grid { grid-template-columns: 1fr; }
  :where(body[data-page="membre-mes-credits"]) .form-row-2 { grid-template-columns: 1fr; }
}

/* === Page : membre-mon-compte  (pages/membre/mon-compte.html) === */
:where(body[data-page="membre-mon-compte"]) .dashboard-layout {display:grid;grid-template-columns:240px 1fr;min-height:100vh}
:where(body[data-page="membre-mon-compte"]) .dashboard-main {background:var(--bg);overflow-y:auto}
:where(body[data-page="membre-mon-compte"]) .dash-topbar {position:sticky;top:0;z-index:10;background:rgba(250,247,244,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:0 32px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px}
:where(body[data-page="membre-mon-compte"]) .dash-topbar h1 {font-size:1.05rem;font-weight:500;color:var(--text);font-family:var(--font-body)}
:where(body[data-page="membre-mon-compte"]) .dash-topbar-right {display:flex;align-items:center;gap:12px}
:where(body[data-page="membre-mon-compte"]) .credits-pill {display:inline-flex;align-items:center;gap:7px;padding:6px 14px;background:linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2));border:1px solid rgba(180,155,210,.2);border-radius:999px;font-size:.82rem;color:#5a3d70;font-weight:500}
:where(body[data-page="membre-mon-compte"]) .credits-pill .credit-dot {width:7px;height:7px;background:var(--gold);border-radius:50%}
:where(body[data-page="membre-mon-compte"]) .dash-content {padding:32px;max-width:980px}
:where(body[data-page="membre-mon-compte"]) .card {background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-sm)}
:where(body[data-page="membre-mon-compte"]) .empty-block {text-align:center;padding:34px 18px}
:where(body[data-page="membre-mon-compte"]) .empty-block .empty-icon {font-size:2rem;display:block;margin-bottom:10px;opacity:.35}
:where(body[data-page="membre-mon-compte"]) .empty-block p {font-size:.84rem;color:var(--text-soft);margin-bottom:14px}
:where(body[data-page="membre-mon-compte"]) .form-alert {padding:11px 15px;border-radius:var(--radius-md);font-size:.84rem;margin-bottom:18px;display:none;line-height:1.55}
:where(body[data-page="membre-mon-compte"]) .form-alert.error {display:block;background:rgba(238,215,215,.7);color:#7a3535;border:1px solid rgba(200,150,150,.3)}
:where(body[data-page="membre-mon-compte"]) .form-alert.success {display:block;background:rgba(210,238,210,.7);color:#3a6040;border:1px solid rgba(150,200,150,.3)}
:where(body[data-page="membre-mon-compte"]) .btn-save, :where(body[data-page="membre-mon-compte"]) .btn-submit {position:relative;overflow:hidden}
:where(body[data-page="membre-mon-compte"]) .btn-save.loading, :where(body[data-page="membre-mon-compte"]) .btn-submit.loading {pointer-events:none;opacity:.75}
:where(body[data-page="membre-mon-compte"]) .btn-save.loading .btn-text, :where(body[data-page="membre-mon-compte"]) .btn-submit.loading .btn-text {opacity:0}
:where(body[data-page="membre-mon-compte"]) .btn-save .spinner, :where(body[data-page="membre-mon-compte"]) .btn-submit .spinner {display:none;position:absolute;width:16px;height:16px;border:2px solid rgba(60,40,80,.2);border-top-color:#3d2a4e;border-radius:50%;animation:_membre_mon_compte__spin .7s linear infinite}
:where(body[data-page="membre-mon-compte"]) .btn-save.loading .spinner, :where(body[data-page="membre-mon-compte"]) .btn-submit.loading .spinner {display:block}
@media (max-width:768px) {
  :where(body[data-page="membre-mon-compte"]) .dashboard-layout {grid-template-columns:1fr}
  :where(body[data-page="membre-mon-compte"]) .dash-content {padding:20px 16px}
  :where(body[data-page="membre-mon-compte"]) .dash-topbar {padding:0 16px}
}
:where(body[data-page="membre-mon-compte"]) .tabs {display:flex;gap:4px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:5px;margin-bottom:28px;box-shadow:var(--shadow-sm)}
:where(body[data-page="membre-mon-compte"]) .tab-btn {flex:1;padding:10px 16px;border:none;border-radius:var(--radius-md);background:none;font-family:var(--font-body);font-size:.84rem;color:var(--text-soft);cursor:pointer;transition:background .2s,color .2s;display:flex;align-items:center;justify-content:center;gap:7px}
:where(body[data-page="membre-mon-compte"]) .tab-btn:hover {background:var(--bg-soft);color:var(--text)}
:where(body[data-page="membre-mon-compte"]) .tab-btn.active {background:linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2));color:#5a3d70;font-weight:500}
:where(body[data-page="membre-mon-compte"]) .tab-section {display:none}
:where(body[data-page="membre-mon-compte"]) .tab-section.active {display:block}
:where(body[data-page="membre-mon-compte"]) .section-header {display:flex;align-items:center;gap:14px;margin-bottom:24px;padding-bottom:16px;border-bottom:1px solid var(--line)}
:where(body[data-page="membre-mon-compte"]) .block-icon {width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.4),rgba(237,215,176,.4));display:grid;place-items:center;font-size:1.1rem;flex-shrink:0}
:where(body[data-page="membre-mon-compte"]) .section-header h3 {font-size:1rem;margin-bottom:3px}
:where(body[data-page="membre-mon-compte"]) .section-header p {font-size:.8rem;color:var(--text-soft)}
:where(body[data-page="membre-mon-compte"]) .avatar-section {display:flex;align-items:center;gap:20px;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--line)}
:where(body[data-page="membre-mon-compte"]) .avatar-big {width:80px;height:80px;border-radius:50%;background:linear-gradient(135deg,rgba(210,190,238,.7),rgba(237,215,176,.7));display:grid;place-items:center;font-family:var(--font-display);font-size:2rem;font-weight:600;color:#6a4d7a;overflow:hidden}
:where(body[data-page="membre-mon-compte"]) .avatar-big img {width:100%;height:100%;object-fit:cover}
:where(body[data-page="membre-mon-compte"]) .avatar-actions {display:flex;flex-direction:column;gap:8px}
:where(body[data-page="membre-mon-compte"]) .avatar-actions p {font-size:.78rem;color:var(--text-xsoft)}
:where(body[data-page="membre-mon-compte"]) .form-row {display:grid;grid-template-columns:1fr 1fr;gap:16px}
:where(body[data-page="membre-mon-compte"]) .form-group {margin-bottom:18px}
:where(body[data-page="membre-mon-compte"]) label {display:block;font-size:.8rem;font-weight:500;color:var(--text);margin-bottom:7px}
:where(body[data-page="membre-mon-compte"]) .input-wrap {position:relative}
:where(body[data-page="membre-mon-compte"]) .input-icon {position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:.9rem;color:var(--text-xsoft);pointer-events:none}
:where(body[data-page="membre-mon-compte"]) input[type=text], :where(body[data-page="membre-mon-compte"]) input[type=email], :where(body[data-page="membre-mon-compte"]) input[type=password], :where(body[data-page="membre-mon-compte"]) input[type=date] {width:100%;padding:12px 14px 12px 40px;border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);font-family:var(--font-body);font-size:.88rem;color:var(--text);outline:none;transition:border-color .25s,box-shadow .25s}
:where(body[data-page="membre-mon-compte"]) input:focus {border-color:rgba(180,155,210,.5);box-shadow:0 0 0 3px rgba(196,174,224,.15)}
:where(body[data-page="membre-mon-compte"]) input:disabled {background:var(--bg-soft);color:var(--text-soft)}
:where(body[data-page="membre-mon-compte"]) .no-icon input {padding-left:14px}
:where(body[data-page="membre-mon-compte"]) .form-actions {display:flex;justify-content:flex-end;margin-top:24px;padding-top:20px;border-top:1px solid var(--line);gap:10px}
:where(body[data-page="membre-mon-compte"]) .meta-row {display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:8px}
:where(body[data-page="membre-mon-compte"]) .meta-box {background:var(--bg-soft);border:1px solid var(--line);border-radius:var(--radius-md);padding:14px 16px}
:where(body[data-page="membre-mon-compte"]) .meta-label {display:block;font-size:.74rem;color:var(--text-xsoft);margin-bottom:4px}
:where(body[data-page="membre-mon-compte"]) .meta-box strong {font-size:.9rem;color:var(--text)}
:where(body[data-page="membre-mon-compte"]) .pref-row {display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);gap:20px}
:where(body[data-page="membre-mon-compte"]) .pref-row:last-child {border-bottom:none}
:where(body[data-page="membre-mon-compte"]) .pref-info strong {display:block;font-size:.88rem;font-weight:500;margin-bottom:2px}
:where(body[data-page="membre-mon-compte"]) .pref-info span {font-size:.78rem;color:var(--text-soft)}
:where(body[data-page="membre-mon-compte"]) .toggle-switch {position:relative;width:44px;height:24px;flex-shrink:0}
:where(body[data-page="membre-mon-compte"]) .toggle-switch input {opacity:0;width:0;height:0}
:where(body[data-page="membre-mon-compte"]) .toggle-slider {position:absolute;inset:0;background:var(--line);border-radius:999px;cursor:pointer;transition:background .3s}
:where(body[data-page="membre-mon-compte"]) .toggle-slider::before {content:'';position:absolute;width:18px;height:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:transform .3s;box-shadow:0 2px 6px rgba(0,0,0,.12)}
:where(body[data-page="membre-mon-compte"]) .toggle-switch input:checked + .toggle-slider {background:var(--lavender-deep)}
:where(body[data-page="membre-mon-compte"]) .toggle-switch input:checked + .toggle-slider::before {transform:translateX(20px)}
:where(body[data-page="membre-mon-compte"]) .danger-block {background:rgba(255,245,245,.8);border:1px solid rgba(220,170,170,.3);border-radius:var(--radius-lg);padding:24px 28px}
:where(body[data-page="membre-mon-compte"]) .danger-block h3 {font-size:.97rem;color:#7a3535;margin-bottom:6px}
:where(body[data-page="membre-mon-compte"]) .danger-block p {font-size:.84rem;color:#a05050;line-height:1.65;margin-bottom:16px}
:where(body[data-page="membre-mon-compte"]) .btn-danger {padding:10px 20px;border-radius:999px;border:1px solid rgba(200,130,130,.4);background:none;color:#7a3535;font-family:var(--font-body);font-size:.82rem;cursor:pointer;transition:background .2s,border-color .2s}
:where(body[data-page="membre-mon-compte"]) .btn-danger:hover {background:rgba(238,215,215,.5);border-color:rgba(200,130,130,.6)}
@media (max-width:768px) {
  :where(body[data-page="membre-mon-compte"]) .form-row, :where(body[data-page="membre-mon-compte"]) .meta-row {grid-template-columns:1fr}
  :where(body[data-page="membre-mon-compte"]) .tabs {flex-direction:column}
}

/* === Page : voyance-consultation-email-reponse  (pages/voyance/consultation-email-reponse.html) === */
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-page { min-height:100vh; background:var(--bg); padding-bottom:60px; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-hero {
      background:linear-gradient(135deg,#f0e8fc 0%,#fdf5e8 50%,#e8f0fc 100%);
      border-bottom:1px solid var(--line);
      padding:40px 0 32px;
      position:relative;overflow:hidden;
    }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-hero::before { content:'';position:absolute;top:-60px;right:-60px;width:280px;height:280px;background:radial-gradient(circle,rgba(195,165,228,.25),transparent 70%);border-radius:50%;pointer-events:none; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-hero-inner { position:relative;z-index:1;display:flex;align-items:center;gap:20px;flex-wrap:wrap; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-avatar { width:64px;height:64px;border-radius:50%;background:linear-gradient(135deg,#e8d8f5,#f5e5cc);display:grid;place-items:center;font-family:var(--font-display);font-size:1.6rem;color:#7a5c8a;border:3px solid rgba(255,255,255,.8);box-shadow:0 6px 20px rgba(140,110,170,.15);flex-shrink:0; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-hero-info h1 { font-size:clamp(1.3rem,2.2vw,1.7rem);margin-bottom:5px; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-hero-info p { font-size:.86rem;color:var(--text-soft); }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-status {
      margin-left:auto;flex-shrink:0;
      background:rgba(210,238,210,.7);
      border:1px solid rgba(150,200,150,.3);
      border-radius:var(--radius-lg);
      padding:14px 20px;text-align:center;
    }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-status .status-icon { font-size:1.6rem;display:block;margin-bottom:4px; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-status .status-text { font-size:.78rem;color:#3a6040;font-weight:500; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-content { padding:32px 0; display:grid; grid-template-columns:1fr 300px; gap:24px; align-items:start; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-block {
      background:var(--surface);border:1px solid var(--line);
      border-radius:var(--radius-lg);padding:28px;
      box-shadow:var(--shadow-sm);margin-bottom:20px;
    }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-block h2 { font-size:1rem;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--line); }
:where(body[data-page="voyance-consultation-email-reponse"]) .question-item { margin-bottom:14px;padding:14px 16px;background:var(--bg-soft);border-radius:var(--radius-md);border:1px solid var(--line); }
:where(body[data-page="voyance-consultation-email-reponse"]) .question-label { font-size:.72rem;font-weight:500;color:var(--text-xsoft);text-transform:uppercase;letter-spacing:.05em;margin-bottom:5px;display:block; }
:where(body[data-page="voyance-consultation-email-reponse"]) .question-text { font-size:.88rem;color:var(--text);line-height:1.6;font-style:italic; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-intro {
      font-family:var(--font-display);font-style:italic;
      font-size:1.05rem;color:#5a4068;
      line-height:1.65;margin-bottom:24px;
      padding:18px 20px;
      background:linear-gradient(135deg,rgba(240,232,252,.5),rgba(252,245,232,.5));
      border-radius:var(--radius-md);
      border-left:3px solid var(--lavender-deep);
    }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-section { margin-bottom:24px; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-section h3 { font-size:.95rem;color:#5a3d70;margin-bottom:10px;display:flex;align-items:center;gap:8px; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-section p { font-size:.88rem;color:var(--text-soft);line-height:1.8; }
:where(body[data-page="voyance-consultation-email-reponse"]) .voyant-note {
      margin-top:20px;padding:16px 18px;
      background:rgba(237,215,176,.15);
      border:1px solid rgba(200,170,100,.2);
      border-radius:var(--radius-md);
    }
:where(body[data-page="voyance-consultation-email-reponse"]) .voyant-note-label { font-size:.72rem;color:var(--gold);font-weight:500;letter-spacing:.05em;text-transform:uppercase;margin-bottom:6px;display:block; }
:where(body[data-page="voyance-consultation-email-reponse"]) .voyant-note p { font-size:.85rem;color:var(--text-soft);line-height:1.7;font-style:italic; }
:where(body[data-page="voyance-consultation-email-reponse"]) .reponse-sidebar { position:sticky;top:24px;display:flex;flex-direction:column;gap:16px; }
:where(body[data-page="voyance-consultation-email-reponse"]) .sidebar-card { background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:22px;box-shadow:var(--shadow-sm); }
:where(body[data-page="voyance-consultation-email-reponse"]) .sidebar-card h3 { font-size:.88rem;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line); }
:where(body[data-page="voyance-consultation-email-reponse"]) .info-row { display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--line);font-size:.82rem; }
:where(body[data-page="voyance-consultation-email-reponse"]) .info-row:last-child { border-bottom:none; }
:where(body[data-page="voyance-consultation-email-reponse"]) .info-row .lbl { color:var(--text-soft); }
:where(body[data-page="voyance-consultation-email-reponse"]) .info-row .val { font-weight:500;color:var(--text); }
:where(body[data-page="voyance-consultation-email-reponse"]) .stars-input { display:flex;gap:8px;margin-bottom:12px;justify-content:center; }
:where(body[data-page="voyance-consultation-email-reponse"]) .star-btn { background:none;border:none;font-size:1.6rem;cursor:pointer;color:var(--line);transition:color .15s,transform .15s; }
:where(body[data-page="voyance-consultation-email-reponse"]) .star-btn.active, :where(body[data-page="voyance-consultation-email-reponse"]) .star-btn:hover { color:var(--gold);transform:scale(1.15); }
:where(body[data-page="voyance-consultation-email-reponse"]) .avis-ta { width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius-md);font-family:var(--font-body);font-size:.84rem;color:var(--text);outline:none;resize:vertical;min-height:72px;transition:border-color .2s; }
:where(body[data-page="voyance-consultation-email-reponse"]) .avis-ta:focus { border-color:rgba(180,155,210,.5);box-shadow:0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="voyance-consultation-email-reponse"]) .avis-submitted { text-align:center;padding:10px;font-size:.84rem;color:#3a6040;display:none; }
@media(max-width:860px) { .reponse-content{grid-template-columns:1fr;} .reponse-sidebar{position:static;} }
@media(max-width:560px) { .reponse-status{width:100%;} .reponse-hero-inner{flex-direction:column;align-items:flex-start;} }

/* === Page : voyance-consultation-email  (pages/voyance/consultation-email.html) === */
:where(body[data-page="voyance-consultation-email"]) .email-page {
      min-height: 100vh;
      background: var(--bg);
      padding-bottom: 60px;
    }
:where(body[data-page="voyance-consultation-email"]) .email-hero {
      background: linear-gradient(135deg, #f0e8fc 0%, #fdf5e8 50%, #e8f0fc 100%);
      border-bottom: 1px solid var(--line);
      padding: 48px 0 40px;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="voyance-consultation-email"]) .email-hero::before {
      content:'';position:absolute;top:-80px;right:-80px;width:360px;height:360px;
      background:radial-gradient(circle,rgba(195,165,228,.25),transparent 70%);
      border-radius:50%;pointer-events:none;
    }
:where(body[data-page="voyance-consultation-email"]) .email-hero-inner {
      position:relative;z-index:1;
      display:flex;align-items:center;gap:20px;flex-wrap:wrap;
    }
:where(body[data-page="voyance-consultation-email"]) .email-voyant-avatar {
      width:72px;height:72px;border-radius:50%;
      background:linear-gradient(135deg,#e8d8f5,#f5e5cc);
      display:grid;place-items:center;
      font-family:var(--font-display);font-size:1.8rem;color:#7a5c8a;
      border:3px solid rgba(255,255,255,.8);
      box-shadow:0 8px 24px rgba(140,110,170,.15);
      flex-shrink:0;
    }
:where(body[data-page="voyance-consultation-email"]) .email-hero-info h1 { font-size:clamp(1.4rem,2.5vw,1.9rem); margin-bottom:6px; }
:where(body[data-page="voyance-consultation-email"]) .email-hero-info p { font-size:.88rem;color:var(--text-soft); }
:where(body[data-page="voyance-consultation-email"]) .email-price-badge {
      margin-left:auto;
      background:rgba(255,255,255,.8);
      border:1px solid rgba(190,170,220,.2);
      border-radius:var(--radius-lg);
      padding:16px 22px;
      text-align:center;
      box-shadow:var(--shadow-sm);
      flex-shrink:0;
    }
:where(body[data-page="voyance-consultation-email"]) .email-price-badge .price {
      font-family:var(--font-display);font-size:2rem;font-weight:600;color:#3d2e4a;
      display:block;line-height:1;
    }
:where(body[data-page="voyance-consultation-email"]) .email-price-badge .price-label {
      font-size:.75rem;color:var(--text-soft);margin-top:4px;display:block;
    }
:where(body[data-page="voyance-consultation-email"]) .email-content {
      padding:36px 0;
      display:grid;
      grid-template-columns:1fr 320px;
      gap:24px;
      align-items:start;
    }
:where(body[data-page="voyance-consultation-email"]) .email-form-block {
      background:var(--surface);
      border:1px solid var(--line);
      border-radius:var(--radius-lg);
      padding:28px;
      box-shadow:var(--shadow-sm);
    }
:where(body[data-page="voyance-consultation-email"]) .email-form-block h2 { font-size:1.05rem;margin-bottom:6px; }
:where(body[data-page="voyance-consultation-email"]) .email-form-block > p { font-size:.86rem;color:var(--text-soft);margin-bottom:24px;line-height:1.65; }
:where(body[data-page="voyance-consultation-email"]) .questions-selector { margin-bottom:24px; }
:where(body[data-page="voyance-consultation-email"]) .questions-selector label { font-size:.8rem;font-weight:500;color:var(--text);display:block;margin-bottom:10px; }
:where(body[data-page="voyance-consultation-email"]) .questions-tabs { display:flex;gap:8px;flex-wrap:wrap; }
:where(body[data-page="voyance-consultation-email"]) .q-tab {
      flex:1;min-width:80px;
      padding:12px 8px;
      border:1.5px solid var(--line);
      border-radius:var(--radius-md);
      background:var(--bg);
      cursor:pointer;
      font-family:var(--font-body);
      font-size:.82rem;
      color:var(--text-soft);
      text-align:center;
      transition:all .2s;
    }
:where(body[data-page="voyance-consultation-email"]) .q-tab:hover { border-color:rgba(180,155,210,.35);color:var(--text); }
:where(body[data-page="voyance-consultation-email"]) .q-tab.active {
      border-color:var(--lavender-deep);
      background:linear-gradient(135deg,rgba(196,174,224,.2),rgba(237,215,176,.15));
      color:#5a3d70;font-weight:500;
    }
:where(body[data-page="voyance-consultation-email"]) .q-tab .q-count { font-family:var(--font-display);font-size:1.4rem;font-weight:600;color:#3d2e4a;display:block;line-height:1;margin-bottom:3px; }
:where(body[data-page="voyance-consultation-email"]) .q-tab.active .q-count { color:var(--lavender-deep); }
:where(body[data-page="voyance-consultation-email"]) .q-tab .q-price { font-size:.7rem;color:var(--text-xsoft); }
:where(body[data-page="voyance-consultation-email"]) .q-tab.active .q-price { color:#7a5c8a; }
:where(body[data-page="voyance-consultation-email"]) .theme-selector { margin-bottom:20px; }
:where(body[data-page="voyance-consultation-email"]) .theme-selector label { font-size:.8rem;font-weight:500;color:var(--text);display:block;margin-bottom:8px; }
:where(body[data-page="voyance-consultation-email"]) .theme-chips { display:flex;flex-wrap:wrap;gap:7px; }
:where(body[data-page="voyance-consultation-email"]) .theme-chip {
      padding:6px 13px;border-radius:999px;
      border:1px solid var(--line);background:var(--bg);
      font-size:.78rem;color:var(--text-soft);
      cursor:pointer;font-family:var(--font-body);
      transition:all .2s;
    }
:where(body[data-page="voyance-consultation-email"]) .theme-chip:hover { border-color:rgba(180,155,210,.3);color:var(--text); }
:where(body[data-page="voyance-consultation-email"]) .theme-chip.active { background:linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.2));border-color:rgba(180,155,210,.4);color:#5a4070;font-weight:500; }
:where(body[data-page="voyance-consultation-email"]) .form-group { margin-bottom:18px; }
:where(body[data-page="voyance-consultation-email"]) .form-group label { display:block;font-size:.8rem;font-weight:500;color:var(--text);margin-bottom:7px; }
:where(body[data-page="voyance-consultation-email"]) .form-group .input-meta { font-size:.73rem;color:var(--text-xsoft);margin-top:5px; }
:where(body[data-page="voyance-consultation-email"]) textarea, :where(body[data-page="voyance-consultation-email"]) input[type=text], :where(body[data-page="voyance-consultation-email"]) input[type=date] {
      width:100%;padding:12px 14px;
      border:1px solid var(--line);border-radius:var(--radius-md);
      background:var(--surface);font-family:var(--font-body);font-size:.88rem;
      color:var(--text);outline:none;
      transition:border-color .25s,box-shadow .25s;
    }
:where(body[data-page="voyance-consultation-email"]) textarea { resize:vertical;min-height:100px;line-height:1.6; }
:where(body[data-page="voyance-consultation-email"]) textarea:focus, :where(body[data-page="voyance-consultation-email"]) input:focus { border-color:rgba(180,155,210,.5);box-shadow:0 0 0 3px rgba(196,174,224,.15); }
:where(body[data-page="voyance-consultation-email"]) .char-count { text-align:right;font-size:.72rem;color:var(--text-xsoft);margin-top:4px; }
:where(body[data-page="voyance-consultation-email"]) .email-sidebar { position:sticky;top:24px;display:flex;flex-direction:column;gap:16px; }
:where(body[data-page="voyance-consultation-email"]) .sidebar-card {
      background:var(--surface);border:1px solid var(--line);
      border-radius:var(--radius-lg);padding:22px;box-shadow:var(--shadow-sm);
    }
:where(body[data-page="voyance-consultation-email"]) .sidebar-card h3 { font-size:.9rem;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid var(--line); }
:where(body[data-page="voyance-consultation-email"]) .order-row { display:flex;justify-content:space-between;font-size:.84rem;padding:6px 0; }
:where(body[data-page="voyance-consultation-email"]) .order-row .lbl { color:var(--text-soft); }
:where(body[data-page="voyance-consultation-email"]) .order-row.total { font-weight:600;font-size:.95rem;border-top:1px solid var(--line);padding-top:10px;margin-top:4px; }
:where(body[data-page="voyance-consultation-email"]) .info-list { list-style:none;display:flex;flex-direction:column;gap:10px; }
:where(body[data-page="voyance-consultation-email"]) .info-list li { display:flex;align-items:flex-start;gap:10px;font-size:.83rem;color:var(--text-soft); }
:where(body[data-page="voyance-consultation-email"]) .info-list li::before { content:'✓';color:var(--gold);font-weight:600;flex-shrink:0;margin-top:1px; }
:where(body[data-page="voyance-consultation-email"]) .form-alert { padding:12px 16px;border-radius:var(--radius-md);font-size:.84rem;margin-bottom:16px;display:none;line-height:1.55; }
:where(body[data-page="voyance-consultation-email"]) .form-alert.error { display:block;background:rgba(238,215,215,.7);color:#7a3535;border:1px solid rgba(200,150,150,.3); }
:where(body[data-page="voyance-consultation-email"]) .form-alert.success { display:block;background:rgba(210,238,210,.7);color:#3a6040;border:1px solid rgba(150,200,150,.3); }
:where(body[data-page="voyance-consultation-email"]) .btn-submit-email { width:100%;justify-content:center;padding:14px;font-size:.9rem;font-weight:500;position:relative;overflow:hidden; }
:where(body[data-page="voyance-consultation-email"]) .btn-submit-email::before { content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.18),transparent);pointer-events:none; }
:where(body[data-page="voyance-consultation-email"]) .btn-submit-email.loading { pointer-events:none;opacity:.75; }
:where(body[data-page="voyance-consultation-email"]) .btn-submit-email.loading .btn-text { opacity:0; }
:where(body[data-page="voyance-consultation-email"]) .btn-submit-email .spinner { display:none;position:absolute;width:18px;height:18px;border:2px solid rgba(60,40,80,.2);border-top-color:#3d2a4e;border-radius:50%;animation:_voyance_consultation_email__spin .7s linear infinite; }
:where(body[data-page="voyance-consultation-email"]) .btn-submit-email.loading .spinner { display:block; }
@media(max-width:900px) { .email-content{grid-template-columns:1fr;} .email-sidebar{position:static;} }
@media(max-width:600px) { .questions-tabs{flex-direction:column;} .email-price-badge{width:100%;} .email-hero-inner{flex-direction:column;align-items:flex-start;} }
:where(body[data-page="voyance-consultation-email"]) .sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* === Page : voyance-consultation-tel  (pages/voyance/consultation-tel.html) === */
body:where([data-page="voyance-consultation-tel"]) { background:#1a1228; color:#f0eaf8; }
:where(body[data-page="voyance-consultation-tel"]) .tel-layout { min-height:100vh; display:grid; grid-template-rows:64px 1fr; }
:where(body[data-page="voyance-consultation-tel"]) .tel-topbar { background:rgba(26,18,40,.95); border-bottom:1px solid rgba(120,90,160,.2); display:flex; align-items:center; justify-content:space-between; padding:0 24px; gap:16px; backdrop-filter:blur(10px); position:sticky; top:0; z-index:10; }
:where(body[data-page="voyance-consultation-tel"]) .tel-logo { display:flex; align-items:center; gap:10px; text-decoration:none; }
:where(body[data-page="voyance-consultation-tel"]) .tel-logo .logo-orb { width:34px; height:34px; border-radius:50%; background:radial-gradient(circle at 30% 30%,#fff 0%,#ede0fc 40%,#c8b0e8 100%); display:grid; place-items:center; font-size:14px; box-shadow:0 4px 14px rgba(160,130,190,.35); }
:where(body[data-page="voyance-consultation-tel"]) .tel-logo span { font-family:var(--font-display); font-size:.95rem; font-weight:600; color:#e8dff5; }
:where(body[data-page="voyance-consultation-tel"]) .topbar-voyant { display:flex; align-items:center; gap:12px; padding:6px 14px; background:rgba(255,255,255,.05); border:1px solid rgba(120,90,160,.2); border-radius:999px; }
:where(body[data-page="voyance-consultation-tel"]) .topbar-avatar { width:32px; height:32px; border-radius:50%; background:linear-gradient(135deg,#c8b0e8,#e8d0a8); display:grid; place-items:center; font-family:var(--font-display); font-size:.9rem; color:#3d2a4e; }
:where(body[data-page="voyance-consultation-tel"]) .topbar-voyant-info strong { display:block; font-size:.84rem; font-weight:500; color:#e8dff5; }
:where(body[data-page="voyance-consultation-tel"]) .topbar-voyant-info span { font-size:.72rem; color:rgba(200,180,230,.6); }
:where(body[data-page="voyance-consultation-tel"]) .btn-end { padding:8px 18px; border-radius:999px; background:rgba(200,100,100,.2); border:1px solid rgba(200,100,100,.35); color:#f0b8b8; font-family:var(--font-body); font-size:.82rem; font-weight:500; cursor:pointer; transition:background .2s; }
:where(body[data-page="voyance-consultation-tel"]) .btn-end:hover { background:rgba(200,100,100,.35); }
:where(body[data-page="voyance-consultation-tel"]) .tel-main { display:flex; align-items:center; justify-content:center; padding:40px 20px; position:relative; overflow:hidden; }
:where(body[data-page="voyance-consultation-tel"]) .tel-bg-orb { position:absolute; border-radius:50%; filter:blur(80px); pointer-events:none; }
:where(body[data-page="voyance-consultation-tel"]) .tel-bg-orb:nth-child(1) { width:400px;height:400px;background:radial-gradient(circle,rgba(120,80,180,.15),transparent 70%);top:-80px;left:-80px; }
:where(body[data-page="voyance-consultation-tel"]) .tel-bg-orb:nth-child(2) { width:300px;height:300px;background:radial-gradient(circle,rgba(180,120,60,.1),transparent 70%);bottom:-60px;right:-60px; }
:where(body[data-page="voyance-consultation-tel"]) .tel-card { position:relative; z-index:1; background:rgba(255,255,255,.06); border:1px solid rgba(190,170,220,.15); border-radius:28px; padding:48px 40px; max-width:500px; width:100%; text-align:center; box-shadow:0 32px 80px rgba(0,0,0,.3); backdrop-filter:blur(12px); }
:where(body[data-page="voyance-consultation-tel"]) .state { display:none; }
:where(body[data-page="voyance-consultation-tel"]) .state.active { display:block; }
:where(body[data-page="voyance-consultation-tel"]) .phone-icon-wrap { width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,rgba(155,126,200,.25),rgba(200,168,96,.2));border:1px solid rgba(155,126,200,.2);display:grid;place-items:center;font-size:2.8rem;margin:0 auto 28px;position:relative; }
:where(body[data-page="voyance-consultation-tel"]) .phone-pulse { position:absolute;inset:-8px;border-radius:50%;border:2px solid rgba(155,126,200,.3);animation:phonePulse 2s ease-in-out infinite; }
:where(body[data-page="voyance-consultation-tel"]) .phone-pulse:nth-child(2) { inset:-16px;animation-delay:.5s;opacity:.5; }
:where(body[data-page="voyance-consultation-tel"]) .tel-card h1 { font-size:1.6rem;color:#e8dff5;margin-bottom:10px; }
:where(body[data-page="voyance-consultation-tel"]) .tel-card .subtitle { font-size:.88rem;color:rgba(200,180,230,.7);line-height:1.65;margin-bottom:28px; }
:where(body[data-page="voyance-consultation-tel"]) .phone-number-box { background:rgba(155,126,200,.12);border:1px solid rgba(155,126,200,.25);border-radius:16px;padding:20px 24px;margin-bottom:24px; }
:where(body[data-page="voyance-consultation-tel"]) .phone-number-label { font-size:.75rem;color:rgba(200,180,230,.6);letter-spacing:.05em;text-transform:uppercase;margin-bottom:8px;display:block; }
:where(body[data-page="voyance-consultation-tel"]) .phone-number { font-family:var(--font-display);font-size:2.2rem;font-weight:600;color:#e8dff5;letter-spacing:.05em;display:block;margin-bottom:6px; }
:where(body[data-page="voyance-consultation-tel"]) .phone-number-note { font-size:.76rem;color:rgba(200,180,230,.5); }
:where(body[data-page="voyance-consultation-tel"]) .session-code-box { display:flex;align-items:center;justify-content:space-between;background:rgba(255,255,255,.04);border:1px solid rgba(120,90,160,.15);border-radius:12px;padding:14px 16px;margin-bottom:24px;gap:12px; }
:where(body[data-page="voyance-consultation-tel"]) .session-code-label { font-size:.78rem;color:rgba(200,180,230,.6); }
:where(body[data-page="voyance-consultation-tel"]) .session-code { font-family:monospace;font-size:1.1rem;font-weight:600;color:#c8a860;letter-spacing:.1em; }
:where(body[data-page="voyance-consultation-tel"]) .copy-btn { background:none;border:1px solid rgba(120,90,160,.25);border-radius:8px;color:rgba(200,180,230,.6);font-size:.74rem;padding:5px 10px;cursor:pointer;font-family:var(--font-body);transition:all .2s;white-space:nowrap; }
:where(body[data-page="voyance-consultation-tel"]) .copy-btn:hover { background:rgba(120,90,160,.15);color:#e8dff5; }
:where(body[data-page="voyance-consultation-tel"]) .timer-display { display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:20px; }
:where(body[data-page="voyance-consultation-tel"]) .timer-dot-live { width:8px;height:8px;background:#72b872;border-radius:50%;animation:pulseDot 1.5s ease-in-out infinite; }
:where(body[data-page="voyance-consultation-tel"]) .timer-val { font-family:var(--font-display);font-size:2.4rem;font-weight:600;color:#e8dff5;letter-spacing:.04em; }
:where(body[data-page="voyance-consultation-tel"]) .session-stats-row { display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:24px; }
:where(body[data-page="voyance-consultation-tel"]) .session-stat { background:rgba(255,255,255,.04);border:1px solid rgba(120,90,160,.12);border-radius:12px;padding:12px 8px;text-align:center; }
:where(body[data-page="voyance-consultation-tel"]) .session-stat .val { font-family:var(--font-display);font-size:1.2rem;font-weight:600;color:#e8dff5;display:block; }
:where(body[data-page="voyance-consultation-tel"]) .session-stat .lbl { font-size:.68rem;color:rgba(200,180,230,.5);margin-top:2px;display:block; }
:where(body[data-page="voyance-consultation-tel"]) .tel-actions { display:flex;flex-direction:column;gap:10px; }
:where(body[data-page="voyance-consultation-tel"]) .btn-primary-dark { width:100%;padding:14px;border-radius:999px;background:linear-gradient(135deg,#9b7ec8,#c8a860);border:none;color:#fff;font-family:var(--font-body);font-size:.9rem;font-weight:500;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 6px 20px rgba(155,126,200,.3); }
:where(body[data-page="voyance-consultation-tel"]) .btn-primary-dark:hover { transform:translateY(-2px);box-shadow:0 10px 28px rgba(155,126,200,.4); }
:where(body[data-page="voyance-consultation-tel"]) .btn-ghost-dark { width:100%;padding:12px;border-radius:999px;background:none;border:1px solid rgba(120,90,160,.25);color:rgba(200,180,230,.7);font-family:var(--font-body);font-size:.85rem;cursor:pointer;transition:all .2s; }
:where(body[data-page="voyance-consultation-tel"]) .btn-ghost-dark:hover { background:rgba(120,90,160,.1);color:#e8dff5; }
:where(body[data-page="voyance-consultation-tel"]) .low-credits-alert { background:linear-gradient(135deg,rgba(200,120,40,.85),rgba(160,80,40,.85));border-radius:12px;padding:10px 16px;font-size:.8rem;color:#fff;margin-bottom:16px;display:none;align-items:center;gap:8px; }
:where(body[data-page="voyance-consultation-tel"]) .low-credits-alert.visible { display:flex; }
:where(body[data-page="voyance-consultation-tel"]) .low-credits-alert a { color:#ffe0b0;text-decoration:underline; }
:where(body[data-page="voyance-consultation-tel"]) .end-overlay { position:fixed;inset:0;background:rgba(10,6,20,.75);backdrop-filter:blur(8px);z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;pointer-events:none;transition:opacity .3s; }
:where(body[data-page="voyance-consultation-tel"]) .end-overlay.open { opacity:1;pointer-events:all; }
:where(body[data-page="voyance-consultation-tel"]) .end-modal { background:#1e1530;border:1px solid rgba(155,126,200,.25);border-radius:24px;box-shadow:0 32px 80px rgba(0,0,0,.5);width:100%;max-width:440px;padding:36px;text-align:center;transform:translateY(20px);transition:transform .3s; }
:where(body[data-page="voyance-consultation-tel"]) .end-overlay.open .end-modal { transform:translateY(0); }
:where(body[data-page="voyance-consultation-tel"]) .end-modal h2 { font-size:1.4rem;color:#e8dff5;margin-bottom:10px; }
:where(body[data-page="voyance-consultation-tel"]) .end-modal p { font-size:.87rem;color:rgba(200,180,230,.7);line-height:1.7;margin-bottom:22px; }
:where(body[data-page="voyance-consultation-tel"]) .end-recap { display:flex;justify-content:center;gap:24px;margin-bottom:24px; }
:where(body[data-page="voyance-consultation-tel"]) .recap-item { text-align:center; }
:where(body[data-page="voyance-consultation-tel"]) .recap-val { font-family:var(--font-display);font-size:1.8rem;font-weight:600;color:#e8dff5;display:block; }
:where(body[data-page="voyance-consultation-tel"]) .recap-lbl { font-size:.74rem;color:rgba(200,180,230,.5); }
:where(body[data-page="voyance-consultation-tel"]) .end-stars { display:flex;justify-content:center;gap:8px;margin-bottom:14px; }
:where(body[data-page="voyance-consultation-tel"]) .end-star { background:none;border:none;font-size:1.8rem;cursor:pointer;color:rgba(200,180,230,.2);transition:color .15s,transform .15s; }
:where(body[data-page="voyance-consultation-tel"]) .end-star.active { color:#c8a860;transform:scale(1.15); }
:where(body[data-page="voyance-consultation-tel"]) .end-textarea { width:100%;padding:12px 16px;background:rgba(255,255,255,.06);border:1px solid rgba(120,90,160,.2);border-radius:12px;font-family:var(--font-body);font-size:.85rem;color:#f0eaf8;outline:none;resize:vertical;min-height:72px;margin-bottom:14px; }
:where(body[data-page="voyance-consultation-tel"]) .end-textarea::placeholder { color:rgba(200,180,230,.3); }
@media(max-width:520px) { .tel-card{padding:32px 22px;border-radius:20px;} .phone-number{font-size:1.8rem;} .session-stats-row{grid-template-columns:1fr 1fr;} }

/* === Page : voyance-consultation  (pages/voyance/consultation.html) === */
body:where([data-page="voyance-consultation"]) { background: #1a1228; color: #f0eaf8; overflow: hidden; }
:where(body[data-page="voyance-consultation"]) .consult-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 140px;
      grid-template-rows: 64px 1fr 80px;
      height: 100vh;
      max-height: 100vh;
    }
:where(body[data-page="voyance-consultation"]) .consult-topbar {
      grid-column: 1 / -1;
      background: rgba(26,18,40,.95);
      border-bottom: 1px solid rgba(120,90,160,.2);
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 24px;
      gap: 16px;
      backdrop-filter: blur(10px);
      position: relative;
      z-index: 10;
    }
:where(body[data-page="voyance-consultation"]) .topbar-left { display: flex; align-items: center; gap: 16px; }
:where(body[data-page="voyance-consultation"]) .consult-logo {
      display: flex;
      align-items: center;
      gap: 10px;
      text-decoration: none;
    }
:where(body[data-page="voyance-consultation"]) .consult-logo .logo-orb {
      width: 34px; height: 34px;
      border-radius: 50%;
      background: radial-gradient(circle at 30% 30%, #fff 0%, #ede0fc 40%, #c8b0e8 100%);
      display: grid; place-items: center;
      font-size: 14px;
      box-shadow: 0 4px 14px rgba(160,130,190,.35);
    }
:where(body[data-page="voyance-consultation"]) .consult-logo span {
      font-family: var(--font-display);
      font-size: .95rem;
      font-weight: 600;
      color: #e8dff5;
    }
:where(body[data-page="voyance-consultation"]) .topbar-voyant {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 6px 12px;
      background: rgba(255,255,255,.05);
      border: 1px solid rgba(120,90,160,.2);
      border-radius: 999px;
    }
:where(body[data-page="voyance-consultation"]) .topbar-avatar {
      width: 32px; height: 32px;
      border-radius: 50%;
      background: linear-gradient(135deg, #c8b0e8, #e8d0a8);
      display: grid; place-items: center;
      font-family: var(--font-display);
      font-size: .9rem;
      color: #3d2a4e;
      flex-shrink: 0;
    }
:where(body[data-page="voyance-consultation"]) .topbar-voyant-info strong {
      display: block;
      font-size: .84rem;
      font-weight: 500;
      color: #e8dff5;
    }
:where(body[data-page="voyance-consultation"]) .topbar-voyant-info span {
      font-size: .72rem;
      color: rgba(200,180,230,.6);
    }
:where(body[data-page="voyance-consultation"]) .consult-timer {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 6px 16px;
      background: rgba(155,126,200,.15);
      border: 1px solid rgba(155,126,200,.25);
      border-radius: 999px;
    }
:where(body[data-page="voyance-consultation"]) .timer-dot {
      width: 7px; height: 7px;
      background: #72b872;
      border-radius: 50%;
      animation: _voyance_consultation__pulse-dot 1.5s ease-in-out infinite;
      flex-shrink: 0;
    }
:where(body[data-page="voyance-consultation"]) .timer-dot.paused { background: var(--gold); animation: none; }
:where(body[data-page="voyance-consultation"]) .timer-dot.stopped { background: #e08080; animation: none; }
:where(body[data-page="voyance-consultation"]) .timer-value {
      font-family: var(--font-display);
      font-size: 1.1rem;
      font-weight: 600;
      color: #e8dff5;
      letter-spacing: .04em;
      min-width: 52px;
    }
:where(body[data-page="voyance-consultation"]) .timer-cost {
      font-size: .75rem;
      color: rgba(200,180,230,.6);
    }
:where(body[data-page="voyance-consultation"]) .credits-counter {
      display: flex;
      align-items: center;
      gap: 7px;
      font-size: .72rem;
      color: rgba(200,180,230,.8);
    }
:where(body[data-page="voyance-consultation"]) .credit-val {
      font-family: var(--font-display);
      font-size: 1rem;
      font-weight: 600;
      color: #e8d0a8;
    }
:where(body[data-page="voyance-consultation"]) .topbar-right { display: flex; align-items: center; gap: 10px; }
:where(body[data-page="voyance-consultation"]) .btn-end {
      padding: 8px 18px;
      border-radius: 999px;
      background: rgba(200,100,100,.2);
      border: 1px solid rgba(200,100,100,.35);
      color: #f0b8b8;
      font-family: var(--font-body);
      font-size: .82rem;
      font-weight: 500;
      cursor: pointer;
      transition: background .2s, border-color .2s;
    }
:where(body[data-page="voyance-consultation"]) .btn-end:hover {
      background: rgba(200,100,100,.35);
      border-color: rgba(200,100,100,.5);
    }
:where(body[data-page="voyance-consultation"]) .chat-area {
      grid-column: 1;
      grid-row: 2;
      min-width: 0;
      background: #140f20;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      position: relative;
    }
:where(body[data-page="voyance-consultation"]) .chat-bg {
      position: absolute;
      inset: 0;
      pointer-events: none;
      overflow: hidden;
    }
:where(body[data-page="voyance-consultation"]) .chat-bg-orb {
      position: absolute;
      border-radius: 50%;
      filter: blur(80px);
    }
:where(body[data-page="voyance-consultation"]) .chat-bg-orb:nth-child(1) {
      width: 300px; height: 300px;
      background: rgba(120,80,180,.12);
      top: -80px; left: -80px;
    }
:where(body[data-page="voyance-consultation"]) .chat-bg-orb:nth-child(2) {
      width: 250px; height: 250px;
      background: rgba(180,120,60,.08);
      bottom: -60px; right: -60px;
    }
:where(body[data-page="voyance-consultation"]) .messages-wrap {
      flex: 1;
      overflow-y: auto;
      padding: 22px 28px;
      display: flex;
      flex-direction: column;
      gap: 16px;
      position: relative;
      z-index: 1;
      scrollbar-width: thin;
      scrollbar-color: rgba(120,90,160,.3) transparent;
    }
:where(body[data-page="voyance-consultation"]) .messages-wrap::-webkit-scrollbar { width: 4px; }
:where(body[data-page="voyance-consultation"]) .messages-wrap::-webkit-scrollbar-thumb { background: rgba(120,90,160,.3); border-radius: 2px; }
:where(body[data-page="voyance-consultation"]) .msg-system {
      text-align: center;
      font-size: .76rem;
      color: rgba(200,180,230,.45);
      padding: 4px 0;
      display: flex;
      align-items: center;
      gap: 10px;
    }
:where(body[data-page="voyance-consultation"]) .msg-system::before, :where(body[data-page="voyance-consultation"]) .msg-system::after {
      content: '';
      flex: 1;
      height: 1px;
      background: rgba(120,90,160,.15);
    }
:where(body[data-page="voyance-consultation"]) .msg {
      display: flex;
      gap: 10px;
      align-items: flex-end;
      max-width: 72%;
      animation: slideMsg .3s ease forwards;
    }
:where(body[data-page="voyance-consultation"]) .msg.from-user { align-self: flex-end; flex-direction: row-reverse; }
:where(body[data-page="voyance-consultation"]) .msg.from-voyant { align-self: flex-start; }
:where(body[data-page="voyance-consultation"]) .msg-avatar {
      width: 30px; height: 30px;
      border-radius: 50%;
      display: grid; place-items: center;
      font-family: var(--font-display);
      font-size: .8rem;
      flex-shrink: 0;
      margin-bottom: 2px;
    }
:where(body[data-page="voyance-consultation"]) .msg.from-voyant .msg-avatar { background: linear-gradient(135deg,#c8b0e8,#e8d0a8); color: #3d2a4e; }
:where(body[data-page="voyance-consultation"]) .msg.from-user   .msg-avatar { background: rgba(120,90,160,.3); color: #c8b0e8; }
:where(body[data-page="voyance-consultation"]) .msg-bubble {
      padding: 11px 15px;
      border-radius: 18px;
      font-size: .88rem;
      line-height: 1.65;
      position: relative;
    }
:where(body[data-page="voyance-consultation"]) .msg.from-voyant .msg-bubble {
      background: rgba(255,255,255,.07);
      border: 1px solid rgba(120,90,160,.18);
      color: #e8dff5;
      border-bottom-left-radius: 4px;
    }
:where(body[data-page="voyance-consultation"]) .msg.from-user .msg-bubble {
      background: linear-gradient(135deg, rgba(155,126,200,.3), rgba(180,140,80,.2));
      border: 1px solid rgba(155,126,200,.25);
      color: #f0eaf8;
      border-bottom-right-radius: 4px;
    }
:where(body[data-page="voyance-consultation"]) .msg-time {
      font-size: .68rem;
      color: rgba(200,180,230,.35);
      margin-top: 4px;
      text-align: right;
      display: block;
    }
:where(body[data-page="voyance-consultation"]) .msg.from-voyant .msg-time { text-align: left; }
:where(body[data-page="voyance-consultation"]) .typing-indicator {
      display: none;
      align-self: flex-start;
      align-items: flex-end;
      gap: 10px;
    }
:where(body[data-page="voyance-consultation"]) .typing-indicator.visible { display: flex; }
:where(body[data-page="voyance-consultation"]) .typing-bubble {
      background: rgba(255,255,255,.07);
      border: 1px solid rgba(120,90,160,.18);
      border-radius: 18px;
      border-bottom-left-radius: 4px;
      padding: 12px 16px;
      display: flex;
      gap: 4px;
      align-items: center;
    }
:where(body[data-page="voyance-consultation"]) .typing-dot {
      width: 6px; height: 6px;
      background: rgba(200,180,230,.5);
      border-radius: 50%;
      animation: typingBounce 1.2s ease-in-out infinite;
    }
:where(body[data-page="voyance-consultation"]) .typing-dot:nth-child(2) { animation-delay: .15s; }
:where(body[data-page="voyance-consultation"]) .typing-dot:nth-child(3) { animation-delay: .30s; }
:where(body[data-page="voyance-consultation"]) .send-bar {
      grid-column: 1;
      background: rgba(26,18,40,.95);
      border-top: 1px solid rgba(120,90,160,.15);
      padding: 14px 24px;
      display: flex;
      align-items: flex-end;
      gap: 12px;
    }
:where(body[data-page="voyance-consultation"]) .send-input-wrap {
      flex: 1;
      position: relative;
    }
:where(body[data-page="voyance-consultation"]) .send-input {
      width: 100%;
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(120,90,160,.2);
      border-radius: 22px;
      padding: 12px 50px 12px 18px;
      font-family: var(--font-body);
      font-size: .88rem;
      color: #f0eaf8;
      outline: none;
      resize: none;
      max-height: 120px;
      line-height: 1.5;
      transition: border-color .2s, box-shadow .2s;
      scrollbar-width: none;
    }
:where(body[data-page="voyance-consultation"]) .send-input::-webkit-scrollbar { display: none; }
:where(body[data-page="voyance-consultation"]) .send-input:focus {
      border-color: rgba(155,126,200,.4);
      box-shadow: 0 0 0 3px rgba(155,126,200,.1);
    }
:where(body[data-page="voyance-consultation"]) .send-input::placeholder { color: rgba(200,180,230,.35); }
:where(body[data-page="voyance-consultation"]) .send-btn {
      width: 44px; height: 44px;
      border-radius: 50%;
      background: linear-gradient(135deg, #9b7ec8, #c8a860);
      border: none;
      cursor: pointer;
      display: grid;
      place-items: center;
      font-size: 1rem;
      flex-shrink: 0;
      transition: transform .2s, box-shadow .2s, opacity .2s;
      box-shadow: 0 4px 16px rgba(155,126,200,.35);
    }
:where(body[data-page="voyance-consultation"]) .send-btn:hover { transform: scale(1.08); box-shadow: 0 6px 20px rgba(155,126,200,.45); }
:where(body[data-page="voyance-consultation"]) .send-btn:active { transform: scale(.96); }
:where(body[data-page="voyance-consultation"]) .send-btn:disabled { opacity: .35; cursor: not-allowed; transform: none; }
:where(body[data-page="voyance-consultation"]) .consult-sidebar {
      grid-row: 2 / 4;
      background: rgba(26,18,40,.72);
      border-left: 1px solid rgba(120,90,160,.15);
      display: flex;
      flex-direction: column;
      overflow-y: auto;
      scrollbar-width: thin;
      scrollbar-color: rgba(120,90,160,.2) transparent;
    }
:where(body[data-page="voyance-consultation"]) .sidebar-section {
      padding: 10px 8px;
      border-bottom: 1px solid rgba(120,90,160,.12);
    }
:where(body[data-page="voyance-consultation"]) .sidebar-section h3 {
      font-size: .68rem;
      font-weight: 500;
      letter-spacing: .06em;
      text-transform: uppercase;
      color: rgba(200,180,230,.5);
      margin-bottom: 8px;
    }
:where(body[data-page="voyance-consultation"]) .voyant-profile {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      gap: 12px;
      padding: 10px 8px;
      border-bottom: 1px solid rgba(120,90,160,.12);
    }
:where(body[data-page="voyance-consultation"]) .voyant-profile-avatar {
      width: 42px; height: 42px;
      border-radius: 50%;
      background: linear-gradient(135deg, #c8b0e8, #e8d0a8);
      display: grid; place-items: center;
      font-family: var(--font-display);
      font-size: 1rem;
      color: #3d2a4e;
      border: 2px solid rgba(155,126,200,.3);
      box-shadow: 0 8px 24px rgba(155,126,200,.2);
    }
:where(body[data-page="voyance-consultation"]) .voyant-profile h2 {
      font-size: .96rem;
      color: #e8dff5;
    }
:where(body[data-page="voyance-consultation"]) .voyant-profile span {
      font-size: .78rem;
      color: rgba(200,180,230,.6);
    }
:where(body[data-page="voyance-consultation"]) .dispo-live {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: .74rem;
      padding: 4px 12px;
      background: rgba(100,160,100,.15);
      border: 1px solid rgba(100,160,100,.25);
      border-radius: 999px;
      color: #90c890;
    }
:where(body[data-page="voyance-consultation"]) .dispo-live .dot { width: 6px; height: 6px; background: #72b872; border-radius: 50%; animation: _voyance_consultation__pulse-dot 1.5s ease-in-out infinite; }
:where(body[data-page="voyance-consultation"]) .session-stats { display: flex; flex-direction: column; gap: 10px; }
:where(body[data-page="voyance-consultation"]) .stat-line {
      display: flex;
      align-items: center;
      justify-content: space-between;
      font-size: .82rem;
    }
:where(body[data-page="voyance-consultation"]) .stat-line .lbl { color: rgba(200,180,230,.5); }
:where(body[data-page="voyance-consultation"]) .stat-line .val { color: #e8dff5; font-weight: 500; }
:where(body[data-page="voyance-consultation"]) .stat-line .val.warn { color: #e8d0a8; }
:where(body[data-page="voyance-consultation"]) .stat-line .val.danger { color: #f0a0a0; }
:where(body[data-page="voyance-consultation"]) .credits-bar-wrap { margin-top: 4px; }
:where(body[data-page="voyance-consultation"]) .credits-bar-bg { height: 4px; background: rgba(255,255,255,.08); border-radius: 2px; overflow: hidden; }
:where(body[data-page="voyance-consultation"]) .credits-bar-fill {
      height: 100%;
      border-radius: 2px;
      transition: width .5s ease;
      background: linear-gradient(90deg, #9b7ec8, #c8a860);
    }
:where(body[data-page="voyance-consultation"]) .credits-bar-fill.warn { background: linear-gradient(90deg, #c8a860, #e89060); }
:where(body[data-page="voyance-consultation"]) .credits-bar-fill.danger { background: #e08080; }
:where(body[data-page="voyance-consultation"]) .quick-actions { display: flex; flex-direction: column; gap: 8px; }
:where(body[data-page="voyance-consultation"]) .quick-btn {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 8px;
      border-radius: var(--radius-md);
      border: 1px solid rgba(120,90,160,.18);
      background: rgba(255,255,255,.04);
      color: rgba(200,180,230,.7);
      font-family: var(--font-body);
      font-size: .82rem;
      cursor: pointer;
      transition: background .2s, border-color .2s, color .2s;
      text-align: left;
      text-decoration: none;
    }
:where(body[data-page="voyance-consultation"]) .quick-btn:hover {
      background: rgba(255,255,255,.07);
      border-color: rgba(120,90,160,.3);
      color: #e8dff5;
    }
:where(body[data-page="voyance-consultation"]) .quick-btn .q-icon { font-size: .95rem; flex-shrink: 0; }
:where(body[data-page="voyance-consultation"]) .end-modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(10,6,20,.75);
      backdrop-filter: blur(8px);
      z-index: 100;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      opacity: 0;
      pointer-events: none;
      transition: opacity .3s;
    }
:where(body[data-page="voyance-consultation"]) .end-modal-overlay.open { opacity: 1; pointer-events: all; }
:where(body[data-page="voyance-consultation"]) .end-modal {
      background: #1e1530;
      border: 1px solid rgba(155,126,200,.25);
      border-radius: var(--radius-xl);
      box-shadow: 0 32px 80px rgba(0,0,0,.5);
      width: 100%;
      max-width: 460px;
      padding: 36px;
      transform: translateY(20px);
      transition: transform .3s;
      text-align: center;
    }
:where(body[data-page="voyance-consultation"]) .end-modal-overlay.open .end-modal { transform: translateY(0); }
:where(body[data-page="voyance-consultation"]) .end-icon { font-size: 3rem; display: block; margin-bottom: 18px; }
:where(body[data-page="voyance-consultation"]) .end-modal h2 { font-size: 1.5rem; color: #e8dff5; margin-bottom: 10px; }
:where(body[data-page="voyance-consultation"]) .end-modal p { font-size: .88rem; color: rgba(200,180,230,.7); line-height: 1.7; margin-bottom: 24px; }
:where(body[data-page="voyance-consultation"]) .end-recap {
      display: flex;
      justify-content: center;
      gap: 24px;
      margin-bottom: 28px;
      flex-wrap: wrap;
    }
:where(body[data-page="voyance-consultation"]) .recap-item { text-align: center; }
:where(body[data-page="voyance-consultation"]) .recap-val {
      font-family: var(--font-display);
      font-size: 1.2rem;
      font-weight: 600;
      color: #e8dff5;
      display: block;
    }
:where(body[data-page="voyance-consultation"]) .recap-lbl { font-size: .74rem; color: rgba(200,180,230,.5); }
:where(body[data-page="voyance-consultation"]) .end-stars { display: flex; justify-content: center; gap: 8px; margin-bottom: 16px; }
:where(body[data-page="voyance-consultation"]) .end-star {
      background: none;
      border: none;
      font-size: 1.2rem;
      cursor: pointer;
      color: rgba(200,180,230,.2);
      transition: color .15s, transform .15s;
    }
:where(body[data-page="voyance-consultation"]) .end-star.active, :where(body[data-page="voyance-consultation"]) .end-star:hover { color: #c8a860; transform: scale(1.2); }
:where(body[data-page="voyance-consultation"]) .end-textarea {
      width: 100%;
      padding: 12px 16px;
      background: rgba(255,255,255,.06);
      border: 1px solid rgba(120,90,160,.2);
      border-radius: var(--radius-md);
      font-family: var(--font-body);
      font-size: .85rem;
      color: #f0eaf8;
      outline: none;
      resize: vertical;
      min-height: 80px;
      margin-bottom: 16px;
      transition: border-color .2s;
    }
:where(body[data-page="voyance-consultation"]) .end-textarea:focus { border-color: rgba(155,126,200,.4); }
:where(body[data-page="voyance-consultation"]) .end-textarea::placeholder { color: rgba(200,180,230,.3); }
:where(body[data-page="voyance-consultation"]) .end-actions { display: flex; flex-direction: column; gap: 10px; }
:where(body[data-page="voyance-consultation"]) .low-credits-banner {
      position: absolute;
      top: 0; left: 0; right: 0;
      background: linear-gradient(135deg, rgba(200,120,40,.9), rgba(160,80,40,.9));
      color: #fff;
      font-size: .82rem;
      padding: 8px 18px;
      text-align: center;
      z-index: 5;
      display: none;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }
:where(body[data-page="voyance-consultation"]) .low-credits-banner.visible { display: flex; }
:where(body[data-page="voyance-consultation"]) .low-credits-banner a { color: #ffe0b0; text-decoration: underline; }
@media (max-width: 1100px) {
  :where(body[data-page="voyance-consultation"]) .consult-layout { grid-template-columns: minmax(0, 1fr) 100px; }
}
@media (max-width: 980px) {
  :where(body[data-page="voyance-consultation"]) .consult-layout { grid-template-columns: minmax(0, 1fr) 88px; }
  :where(body[data-page="voyance-consultation"]) .voyant-profile { padding: 14px 10px; gap: 8px; }
  :where(body[data-page="voyance-consultation"]) .voyant-profile-avatar { width: 54px; height: 54px; font-size: 1.3rem; }
  :where(body[data-page="voyance-consultation"]) .sidebar-section { padding: 10px 12px; }
  :where(body[data-page="voyance-consultation"]) .quick-btn { padding: 8px 10px; font-size: .76rem; }
}
@media (max-width: 860px) {
  :where(body[data-page="voyance-consultation"]) .consult-layout { grid-template-columns: 1fr; grid-template-rows: 64px 1fr 80px; }
  :where(body[data-page="voyance-consultation"]) .consult-sidebar { display: none; }
  :where(body[data-page="voyance-consultation"]) .send-bar { grid-column: 1; }
  :where(body[data-page="voyance-consultation"]) .topbar-voyant-info span { display: none; }
  :where(body[data-page="voyance-consultation"]) .timer-cost { display: none; }
}
@media (max-width: 520px) {
  :where(body[data-page="voyance-consultation"]) .consult-topbar { padding: 0 14px; gap: 10px; }
  :where(body[data-page="voyance-consultation"]) .consult-logo span { display: none; }
  :where(body[data-page="voyance-consultation"]) .messages-wrap { padding: 16px 14px; }
  :where(body[data-page="voyance-consultation"]) .send-bar { padding: 12px 16px; }
  :where(body[data-page="voyance-consultation"]) .msg { max-width: 90%; }
}
:where(body[data-page="voyance-consultation"]) .sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* === Page : voyance-profil-voyant  (pages/voyance/profil-voyant.html) === */
:where(body[data-page="voyance-profil-voyant"]) .profil-hero {
      position: relative;
      overflow: hidden;
      padding: 0 0 48px;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-banner {
      height: 120px;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-banner-bg {
      position: absolute;
      inset: 0;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-banner-orb {
      position: absolute;
      border-radius: 50%;
      filter: blur(50px);
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-hero-content {
      position: relative;
      z-index: 2;
      margin-top: -60px;
      display: flex;
      align-items: flex-end;
      gap: 28px;
      flex-wrap: wrap;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-avatar {
      position: relative;
      width: 140px;
      height: 140px;
      border-radius: 50%;
      border: 4px solid var(--bg);
      background: linear-gradient(135deg, #e8d8f5, #f5e5cc);
      display: grid;
      place-items: center;
      font-family: var(--font-display);
      font-size: 3.2rem;
      color: #7a5c8a;
      overflow: hidden;
      flex-shrink: 0;
      box-shadow:
        0 20px 50px rgba(140, 110, 170, 0.25),
        0 8px 20px rgba(0, 0, 0, 0.08);
      transform: translateY(-8px);
      transition: transform 0.4s ease, box-shadow 0.4s ease;
      animation: floatAvatar 6s ease-in-out infinite;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-avatar::after {
      content: '';
      position: absolute;
      inset: -8px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(210, 190, 238, 0.4), transparent 70%);
      filter: blur(10px);
      z-index: -1;
      pointer-events: none;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-avatar:hover {
      transform: translateY(-12px) scale(1.03);
      box-shadow:
        0 28px 70px rgba(140, 110, 170, 0.35),
        0 12px 25px rgba(0, 0, 0, 0.12);
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-avatar img {
      width: 100%; height: 100%;
      object-fit: cover;
      object-position: center top;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-identity {
      padding-bottom: 8px;
      flex: 1;
      min-width: 220px;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-identity h1 {
      font-size: clamp(1.8rem, 3vw, 2.4rem);
      margin-bottom: 6px;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-identity .profil-meta-row {
      display: flex;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-rating {
      display: flex;
      align-items: center;
      gap: 7px;
      font-size: 0.85rem;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-rating .stars { color: var(--gold); letter-spacing: 1px; font-size: 0.9rem; }
:where(body[data-page="voyance-profil-voyant"]) .profil-rating .note { font-weight: 500; color: var(--text); }
:where(body[data-page="voyance-profil-voyant"]) .profil-rating .count { color: var(--text-xsoft); font-size: 0.8rem; }
:where(body[data-page="voyance-profil-voyant"]) .profil-exp {
      font-size: 0.82rem;
      color: var(--text-soft);
      display: flex;
      align-items: center;
      gap: 5px;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-exp::before { content: '·'; color: var(--text-xsoft); }
:where(body[data-page="voyance-profil-voyant"]) .profil-cta-inline {
      margin-left: auto;
      padding-bottom: 8px;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 10px;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-layout {
      display: grid;
      grid-template-columns: 1fr 320px;
      gap: 28px;
      align-items: start;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-block {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 28px;
      box-shadow: var(--shadow-sm);
      margin-bottom: 20px;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-block h2 {
      font-size: 1.1rem;
      margin-bottom: 18px;
      padding-bottom: 14px;
      border-bottom: 1px solid var(--line);
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-bio-text {
      font-size: 0.9rem;
      color: var(--text-soft);
      line-height: 1.8;
    }
:where(body[data-page="voyance-profil-voyant"]) .profil-bio-text p + p { margin-top: 12px; }
:where(body[data-page="voyance-profil-voyant"]) .specialites-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
    }
:where(body[data-page="voyance-profil-voyant"]) .specialite-item {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 14px;
      background: var(--bg-soft);
      border-radius: var(--radius-md);
      border: 1px solid var(--line);
      transition: border-color 0.2s, box-shadow 0.2s;
    }
:where(body[data-page="voyance-profil-voyant"]) .specialite-item:hover {
      border-color: rgba(180, 155, 210, 0.25);
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="voyance-profil-voyant"]) .specialite-icon {
      width: 38px; height: 38px;
      border-radius: 50%;
      display: grid;
      place-items: center;
      background: linear-gradient(135deg, rgba(210, 190, 238, 0.5), rgba(237, 215, 176, 0.5));
      font-size: 1rem;
      flex-shrink: 0;
    }
:where(body[data-page="voyance-profil-voyant"]) .specialite-info h4 {
      font-size: 0.88rem;
      margin-bottom: 3px;
    }
:where(body[data-page="voyance-profil-voyant"]) .specialite-info p {
      font-size: 0.78rem;
      color: var(--text-soft);
      line-height: 1.5;
    }
:where(body[data-page="voyance-profil-voyant"]) .avis-list {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
:where(body[data-page="voyance-profil-voyant"]) .avis-item {
      padding: 18px;
      background: var(--bg-soft);
      border-radius: var(--radius-md);
      border: 1px solid var(--line);
    }
:where(body[data-page="voyance-profil-voyant"]) .avis-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 10px;
      gap: 12px;
    }
:where(body[data-page="voyance-profil-voyant"]) .avis-author {
      display: flex;
      align-items: center;
      gap: 10px;
    }
:where(body[data-page="voyance-profil-voyant"]) .avis-avatar {
      width: 36px; height: 36px;
      border-radius: 50%;
      background: linear-gradient(135deg, rgba(210, 190, 238, 0.6), rgba(237, 215, 176, 0.6));
      display: grid;
      place-items: center;
      font-family: var(--font-display);
      font-size: 1rem;
      font-weight: 600;
      color: #6a4d7a;
      flex-shrink: 0;
    }
:where(body[data-page="voyance-profil-voyant"]) .avis-name {
      font-size: 0.86rem;
      font-weight: 500;
      color: var(--text);
    }
:where(body[data-page="voyance-profil-voyant"]) .avis-date {
      font-size: 0.75rem;
      color: var(--text-xsoft);
      display: block;
    }
:where(body[data-page="voyance-profil-voyant"]) .avis-stars { color: var(--gold); font-size: 0.78rem; letter-spacing: 1px; flex-shrink: 0; }
:where(body[data-page="voyance-profil-voyant"]) .avis-text {
      font-size: 0.86rem;
      color: var(--text-soft);
      line-height: 1.7;
    }
:where(body[data-page="voyance-profil-voyant"]) .voir-plus-btn {
      width: 100%;
      margin-top: 16px;
      text-align: center;
      padding: 11px;
      border: 1px solid var(--line);
      border-radius: var(--radius-md);
      font-size: 0.83rem;
      color: var(--text-soft);
      background: none;
      cursor: pointer;
      font-family: var(--font-body);
      transition: border-color 0.2s, color 0.2s;
    }
:where(body[data-page="voyance-profil-voyant"]) .voir-plus-btn:hover { border-color: rgba(180, 155, 210, 0.3); color: var(--text); }
:where(body[data-page="voyance-profil-voyant"]) .profil-sidebar {
      position: sticky;
      top: 96px;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
:where(body[data-page="voyance-profil-voyant"]) .cta-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 26px;
      box-shadow: var(--shadow-md);
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="voyance-profil-voyant"]) .cta-card::before {
      content: '';
      position: absolute;
      top: -60px; right: -60px;
      width: 180px; height: 180px;
      background: radial-gradient(circle, rgba(210, 190, 238, 0.2), transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="voyance-profil-voyant"]) .cta-status {
      margin-bottom: 16px;
    }
:where(body[data-page="voyance-profil-voyant"]) .cta-tarif {
      margin-bottom: 20px;
    }
:where(body[data-page="voyance-profil-voyant"]) .cta-tarif .tarif-value {
      font-family: var(--font-display);
      font-size: 2rem;
      font-weight: 600;
      color: #3d2e4a;
      line-height: 1;
    }
:where(body[data-page="voyance-profil-voyant"]) .cta-tarif .tarif-unit {
      font-size: 0.78rem;
      color: var(--text-xsoft);
      display: block;
      margin-top: 4px;
    }
:where(body[data-page="voyance-profil-voyant"]) .btn-consult-main {
      width: 100%;
      justify-content: center;
      padding: 15px 24px;
      font-size: 0.92rem;
      font-weight: 500;
      margin-bottom: 10px;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="voyance-profil-voyant"]) .btn-consult-main::before {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(135deg, rgba(255,255,255,0.18), transparent);
      pointer-events: none;
    }
:where(body[data-page="voyance-profil-voyant"]) .btn-consult-main:disabled {
      opacity: 0.5;
      cursor: not-allowed;
      transform: none !important;
      box-shadow: none !important;
    }
:where(body[data-page="voyance-profil-voyant"]) .cta-note {
      font-size: 0.76rem;
      color: var(--text-xsoft);
      text-align: center;
      line-height: 1.6;
    }
:where(body[data-page="voyance-profil-voyant"]) .cta-note a {
      color: var(--lavender-deep);
      text-decoration: underline;
      text-underline-offset: 2px;
    }
:where(body[data-page="voyance-profil-voyant"]) .info-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 22px;
      box-shadow: var(--shadow-sm);
    }
:where(body[data-page="voyance-profil-voyant"]) .info-card h3 {
      font-size: 0.88rem;
      margin-bottom: 14px;
      color: var(--text-soft);
      letter-spacing: 0.03em;
      text-transform: uppercase;
      font-family: var(--font-body);
      font-weight: 500;
    }
:where(body[data-page="voyance-profil-voyant"]) .info-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 9px 0;
      border-bottom: 1px solid var(--line);
      font-size: 0.84rem;
    }
:where(body[data-page="voyance-profil-voyant"]) .info-row:last-child { border-bottom: none; }
:where(body[data-page="voyance-profil-voyant"]) .info-row .info-label { color: var(--text-soft); }
:where(body[data-page="voyance-profil-voyant"]) .info-row .info-val { color: var(--text); font-weight: 500; }
:where(body[data-page="voyance-profil-voyant"]) .dispo-slots {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
:where(body[data-page="voyance-profil-voyant"]) .dispo-day {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 0.83rem;
    }
:where(body[data-page="voyance-profil-voyant"]) .dispo-day .day-label {
      color: var(--text-soft);
      min-width: 80px;
    }
:where(body[data-page="voyance-profil-voyant"]) .dispo-day .day-hours {
      font-weight: 500;
      color: var(--text);
    }
:where(body[data-page="voyance-profil-voyant"]) .dispo-day .day-off {
      color: var(--text-xsoft);
      font-style: italic;
    }
:where(body[data-page="voyance-profil-voyant"]) .skel {
      background: linear-gradient(90deg, var(--bg-soft) 25%, rgba(255,255,255,0.7) 50%, var(--bg-soft) 75%);
      background-size: 200% 100%;
      animation: shimmer 1.4s ease infinite;
      border-radius: 6px;
    }
:where(body[data-page="voyance-profil-voyant"]) .skel-circle { border-radius: 50%; }
@media (max-width: 960px) {
  :where(body[data-page="voyance-profil-voyant"]) .profil-layout {
        grid-template-columns: 1fr;
      }
  :where(body[data-page="voyance-profil-voyant"]) .profil-sidebar {
        position: static;
        flex-direction: row;
        flex-wrap: wrap;
      }
  :where(body[data-page="voyance-profil-voyant"]) .cta-card { flex: 1; min-width: 260px; }
  :where(body[data-page="voyance-profil-voyant"]) .info-card { flex: 1; min-width: 220px; }
}
@media (max-width: 640px) {
  :where(body[data-page="voyance-profil-voyant"]) .profil-banner { height: 100px; }
  :where(body[data-page="voyance-profil-voyant"]) .profil-avatar { width: 100px; height: 100px; font-size: 2.4rem; }
  :where(body[data-page="voyance-profil-voyant"]) .profil-hero-content { margin-top: -40px; gap: 18px; }
  :where(body[data-page="voyance-profil-voyant"]) .specialites-grid { grid-template-columns: 1fr; }
  :where(body[data-page="voyance-profil-voyant"]) .profil-sidebar { flex-direction: column; }
}
:where(body[data-page="voyance-profil-voyant"]) .mode-selector {
      margin-bottom: 18px;
    }
:where(body[data-page="voyance-profil-voyant"]) .mode-selector-label {
      font-size: 0.75rem;
      font-weight: 500;
      color: var(--text-soft);
      letter-spacing: 0.04em;
      text-transform: uppercase;
      margin-bottom: 10px;
      display: block;
    }
:where(body[data-page="voyance-profil-voyant"]) .mode-tabs {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 6px;
    }
:where(body[data-page="voyance-profil-voyant"]) .mode-tab {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      padding: 10px 6px;
      border: 1.5px solid var(--line);
      border-radius: var(--radius-md);
      background: var(--bg);
      cursor: pointer;
      font-family: var(--font-body);
      font-size: 0.72rem;
      color: var(--text-soft);
      transition: all 0.2s ease;
      position: relative;
    }
:where(body[data-page="voyance-profil-voyant"]) .mode-tab:hover:not(:disabled) {
      border-color: rgba(180,155,210,.35);
      background: var(--bg-soft);
      color: var(--text);
    }
:where(body[data-page="voyance-profil-voyant"]) .mode-tab.active {
      border-color: var(--lavender-deep);
      background: linear-gradient(135deg, rgba(196,174,224,.15), rgba(237,215,176,.1));
      color: #5a3d70;
      font-weight: 500;
    }
:where(body[data-page="voyance-profil-voyant"]) .mode-tab:disabled {
      opacity: 0.45;
      cursor: not-allowed;
    }
:where(body[data-page="voyance-profil-voyant"]) .mode-tab .mode-icon { font-size: 1.1rem; line-height: 1; }
:where(body[data-page="voyance-profil-voyant"]) .mode-tab .mode-name { font-size: 0.72rem; font-weight: 500; }
:where(body[data-page="voyance-profil-voyant"]) .mode-tab .mode-price { font-size: 0.68rem; color: var(--text-xsoft); }
:where(body[data-page="voyance-profil-voyant"]) .mode-tab.active .mode-price { color: #7a5c8a; }
:where(body[data-page="voyance-profil-voyant"]) .mode-soon {
      position: absolute;
      top: -7px; right: -4px;
      font-size: 0.58rem;
      background: rgba(210,190,238,.4);
      color: #7a5c8a;
      padding: 1px 5px;
      border-radius: 999px;
      white-space: nowrap;
    }
:where(body[data-page="voyance-profil-voyant"]) .tarif-block { margin-bottom: 16px; }
:where(body[data-page="voyance-profil-voyant"]) .tarif-value {
      font-family: var(--font-display);
      font-size: 2rem;
      font-weight: 600;
      color: #3d2e4a;
      line-height: 1;
      display: block;
    }
:where(body[data-page="voyance-profil-voyant"]) .tarif-unit {
      font-size: 0.78rem;
      color: var(--text-xsoft);
      display: block;
      margin-top: 3px;
    }
:where(body[data-page="voyance-profil-voyant"]) .tarif-detail {
      font-size: 0.76rem;
      color: var(--text-soft);
      margin-top: 6px;
      line-height: 1.5;
      display: block;
    }
:where(body[data-page="voyance-profil-voyant"]) .audio-presentation {
      margin-top: 18px;
      background: linear-gradient(135deg, rgba(196,174,224,.12), rgba(237,215,176,.08));
      border: 1px solid rgba(196,174,224,.2);
      border-radius: 12px;
      padding: 14px 18px;
      display: flex;
      align-items: center;
      gap: 14px;
    }
:where(body[data-page="voyance-profil-voyant"]) .audio-presentation-icon { font-size: 1.4rem; flex-shrink: 0; }
:where(body[data-page="voyance-profil-voyant"]) .audio-presentation-info { flex: 1; min-width: 0; }
:where(body[data-page="voyance-profil-voyant"]) .audio-presentation-label { font-size: .76rem; font-weight: 600; color: var(--text-soft); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 6px; display: block; }
:where(body[data-page="voyance-profil-voyant"]) .audio-presentation audio { width: 100%; height: 36px; border-radius: 999px; }
:where(body[data-page="voyance-profil-voyant"]) .audio-player-custom {
      display: flex;
      align-items: center;
      gap: 12px;
      background: rgba(155,126,200,.08);
      border: 1px solid rgba(155,126,200,.18);
      border-radius: 999px;
      padding: 8px 14px 8px 8px;
    }
:where(body[data-page="voyance-profil-voyant"]) .apc-btn {
      width: 36px; height: 36px;
      border-radius: 50%;
      border: none;
      background: linear-gradient(135deg, #c4aee0, #b89ad0);
      color: #fff;
      display: grid; place-items: center;
      cursor: pointer;
      flex-shrink: 0;
      transition: transform .15s, box-shadow .15s;
    }
:where(body[data-page="voyance-profil-voyant"]) .apc-btn:hover { transform: scale(1.07); box-shadow: 0 4px 12px rgba(155,126,200,.35); }
:where(body[data-page="voyance-profil-voyant"]) .apc-track { flex: 1; min-width: 0; }
:where(body[data-page="voyance-profil-voyant"]) .apc-bar {
      position: relative;
      height: 4px;
      background: rgba(155,126,200,.2);
      border-radius: 999px;
      cursor: pointer;
      margin-bottom: 4px;
    }
:where(body[data-page="voyance-profil-voyant"]) .apc-progress {
      position: absolute; left: 0; top: 0; bottom: 0;
      background: linear-gradient(90deg, #c4aee0, #b89ad0);
      border-radius: 999px;
      width: 0%;
      transition: width .1s linear;
    }
:where(body[data-page="voyance-profil-voyant"]) .apc-thumb {
      position: absolute;
      top: 50%; transform: translate(-50%, -50%);
      width: 12px; height: 12px;
      background: #b89ad0;
      border-radius: 50%;
      left: 0%;
      box-shadow: 0 0 0 2px #fff;
      transition: left .1s linear;
    }
:where(body[data-page="voyance-profil-voyant"]) .apc-times {
      display: flex; justify-content: space-between;
      font-size: .68rem; color: var(--text-soft);
    }

/* === Page : voyance-voyants  (pages/voyance/voyants.html) === */
:where(body[data-page="voyance-voyants"]) .voyants-hero {
      padding: 56px 0 48px;
      position: relative;
      overflow: hidden;
    }
:where(body[data-page="voyance-voyants"]) .voyants-hero::before {
      content: '';
      position: absolute;
      top: -80px; right: -120px;
      width: 480px; height: 480px;
      background: radial-gradient(circle, rgba(195, 165, 228, 0.22) 0%, transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="voyance-voyants"]) .voyants-hero::after {
      content: '';
      position: absolute;
      bottom: -60px; left: -80px;
      width: 320px; height: 320px;
      background: radial-gradient(circle, rgba(237, 215, 176, 0.18) 0%, transparent 70%);
      border-radius: 50%;
      pointer-events: none;
    }
:where(body[data-page="voyance-voyants"]) .voyants-hero-inner {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: flex-end;
      justify-content: space-between;
      gap: 32px;
      flex-wrap: wrap;
    }
:where(body[data-page="voyance-voyants"]) .voyants-hero h1 {
      font-size: clamp(1.8rem, 3.5vw, 2.6rem);
      margin-bottom: 12px;
    }
:where(body[data-page="voyance-voyants"]) .voyants-hero h1 em {
      font-style: italic;
      color: var(--lavender-deep);
    }
:where(body[data-page="voyance-voyants"]) .voyants-hero p {
      color: var(--text-soft);
      font-size: 0.92rem;
      max-width: 52ch;
      line-height: 1.75;
    }
:where(body[data-page="voyance-voyants"]) .dispo-counter {
      flex-shrink: 0;
      background: rgba(255,255,255,0.75);
      backdrop-filter: blur(10px);
      border: 1px solid rgba(190, 170, 220, 0.15);
      border-radius: var(--radius-lg);
      padding: 18px 24px;
      text-align: center;
      box-shadow: var(--shadow-sm);
      min-width: 140px;
    }
:where(body[data-page="voyance-voyants"]) .dispo-counter .count {
      font-family: var(--font-display);
      font-size: 2.4rem;
      font-weight: 600;
      color: var(--lavender-deep);
      line-height: 1;
      display: block;
    }
:where(body[data-page="voyance-voyants"]) .dispo-counter .count-label {
      font-size: 0.76rem;
      color: var(--text-soft);
      margin-top: 4px;
      display: block;
    }
:where(body[data-page="voyance-voyants"]) .dispo-dot-live {
      display: inline-block;
      width: 7px; height: 7px;
      background: #5a9060;
      border-radius: 50%;
      margin-right: 5px;
      animation: _voyance_voyants__pulse-dot 2s ease-in-out infinite;
    }
:where(body[data-page="voyance-voyants"]) .filters-bar {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      padding: 18px 22px;
      margin-bottom: 32px;
      box-shadow: var(--shadow-sm);
      display: flex;
      align-items: center;
      gap: 16px;
      flex-wrap: wrap;
    }
:where(body[data-page="voyance-voyants"]) .filters-label {
      font-size: 0.78rem;
      font-weight: 500;
      color: var(--text-soft);
      flex-shrink: 0;
      letter-spacing: 0.03em;
      text-transform: uppercase;
    }
:where(body[data-page="voyance-voyants"]) .filter-chips {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      flex: 1;
    }
:where(body[data-page="voyance-voyants"]) .chip {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 7px 14px;
      border-radius: 999px;
      border: 1px solid var(--line);
      background: var(--bg);
      font-size: 0.8rem;
      color: var(--text-soft);
      cursor: pointer;
      transition: all 0.2s ease;
      white-space: nowrap;
      font-family: var(--font-body);
    }
:where(body[data-page="voyance-voyants"]) .chip:hover {
      border-color: rgba(180, 155, 210, 0.35);
      color: var(--text);
      background: var(--bg-soft);
    }
:where(body[data-page="voyance-voyants"]) .chip.active {
      background: linear-gradient(135deg, rgba(196, 174, 224, 0.25), rgba(237, 215, 176, 0.2));
      border-color: rgba(180, 155, 210, 0.4);
      color: #5a4070;
      font-weight: 500;
    }
:where(body[data-page="voyance-voyants"]) .filter-sep {
      width: 1px;
      height: 24px;
      background: var(--line);
      flex-shrink: 0;
    }
:where(body[data-page="voyance-voyants"]) .filter-search {
      position: relative;
      flex-shrink: 0;
    }
:where(body[data-page="voyance-voyants"]) .filter-search input {
      padding: 8px 14px 8px 34px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: var(--bg);
      font-family: var(--font-body);
      font-size: 0.82rem;
      color: var(--text);
      outline: none;
      width: 180px;
      transition: border-color 0.2s, box-shadow 0.2s, width 0.3s ease;
    }
:where(body[data-page="voyance-voyants"]) .filter-search input:focus {
      border-color: rgba(180, 155, 210, 0.45);
      box-shadow: 0 0 0 3px rgba(196, 174, 224, 0.12);
      width: 220px;
    }
:where(body[data-page="voyance-voyants"]) .filter-search input::placeholder { color: var(--text-xsoft); }
:where(body[data-page="voyance-voyants"]) .filter-search .search-icon {
      position: absolute;
      left: 12px;
      top: 50%;
      transform: translateY(-50%);
      font-size: 0.8rem;
      color: var(--text-xsoft);
      pointer-events: none;
    }
:where(body[data-page="voyance-voyants"]) .voyants-grid-full {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 22px;
    }
:where(body[data-page="voyance-voyants"]) .empty-msg {
      grid-column: 1 / -1;
      text-align: center;
      padding: 60px 20px;
      color: var(--text-soft);
      font-size: 0.92rem;
    }
:where(body[data-page="voyance-voyants"]) .skeleton-card {
      background: var(--surface);
      border: 1px solid var(--line);
      border-radius: var(--radius-lg);
      overflow: hidden;
    }
:where(body[data-page="voyance-voyants"]) .skel {
      background: linear-gradient(90deg, var(--bg-soft) 25%, rgba(255,255,255,0.7) 50%, var(--bg-soft) 75%);
      background-size: 200% 100%;
      animation: shimmer 1.4s ease infinite;
      border-radius: 6px;
    }
:where(body[data-page="voyance-voyants"]) .skel-banner { height: 80px; border-radius: 0; }
:where(body[data-page="voyance-voyants"]) .skel-avatar {
      width: 68px; height: 68px;
      border-radius: 50%;
      margin: -34px auto 12px;
      border: 3px solid var(--surface);
    }
:where(body[data-page="voyance-voyants"]) .skel-line {
      height: 12px;
      margin: 0 auto 8px;
    }
:where(body[data-page="voyance-voyants"]) .pagination {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 8px;
      margin-top: 40px;
    }
:where(body[data-page="voyance-voyants"]) .status-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px;
      border-radius: 999px;
      font-size: 0.76rem;
      font-weight: 500;
      border: 1px solid transparent;
      white-space: nowrap;
    }
:where(body[data-page="voyance-voyants"]) .status-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      display: inline-block;
      flex-shrink: 0;
    }
:where(body[data-page="voyance-voyants"]) .status-badge.dispo {
      background: rgba(90, 144, 96, 0.14);
      color: #4f7d53;
      border-color: rgba(90, 144, 96, 0.2);
    }
:where(body[data-page="voyance-voyants"]) .status-badge.dispo .status-dot {
      background: #5a9060;
    }
:where(body[data-page="voyance-voyants"]) .status-badge.pause {
      background: rgba(230, 170, 70, 0.14);
      color: #b06a2f;
      border-color: rgba(230, 170, 70, 0.22);
    }
:where(body[data-page="voyance-voyants"]) .status-badge.pause .status-dot {
      background: #d59a3d;
    }
:where(body[data-page="voyance-voyants"]) .status-badge.consultation {
      background: rgba(96, 126, 200, 0.14);
      color: #4a64a7;
      border-color: rgba(96, 126, 200, 0.22);
    }
:where(body[data-page="voyance-voyants"]) .status-badge.consultation .status-dot {
      background: #607ec8;
    }
:where(body[data-page="voyance-voyants"]) .status-badge.indispo {
      background: rgba(180, 95, 95, 0.12);
      color: #9a5050;
      border-color: rgba(180, 95, 95, 0.18);
    }
:where(body[data-page="voyance-voyants"]) .status-badge.indispo .status-dot {
      background: #b46a6a;
    }
:where(body[data-page="voyance-voyants"]) .tag-chip {
      padding: 4px 10px;
      border-radius: 999px;
      font-size: 0.72rem;
      background: rgba(210, 190, 238, 0.2);
      color: #6a4d7a;
      border: 1px solid rgba(180, 155, 210, 0.2);
    }
@media (max-width: 1024px) {
  :where(body[data-page="voyance-voyants"]) .voyants-grid-full { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  :where(body[data-page="voyance-voyants"]) .voyants-hero-inner { flex-direction: column; align-items: flex-start; }
  :where(body[data-page="voyance-voyants"]) .dispo-counter { align-self: flex-start; }
  :where(body[data-page="voyance-voyants"]) .filters-bar { flex-direction: column; align-items: flex-start; }
  :where(body[data-page="voyance-voyants"]) .filter-search input { width: 100%; }
  :where(body[data-page="voyance-voyants"]) .filter-search { width: 100%; }
  :where(body[data-page="voyance-voyants"]) .filter-search input:focus { width: 100%; }
}
@media (max-width: 560px) {
  :where(body[data-page="voyance-voyants"]) .voyants-grid-full { grid-template-columns: 1fr; }
}


/* =========================================================
   FIX FINAL TOPBAR CLIQUABLE — Safari / Chrome / Firefox
   ========================================================= */
html, body { position: relative; }
#header-mount {
  position: sticky !important;
  top: 0 !important;
  z-index: 2147483000 !important;
  isolation: isolate !important;
  overflow: visible !important;
  pointer-events: auto !important;
}
#header-mount *,
#header-mount .topbar,
#header-mount .topbar-inner,
#header-mount .brand,
#header-mount .nav,
#header-mount .nav-links,
#header-mount .nav-right,
#header-mount .dropdown,
#header-mount .nav-dd-toggle,
#header-mount .btn {
  pointer-events: auto !important;
}
#header-mount .topbar {
  position: relative !important;
  z-index: 2147483000 !important;
  overflow: visible !important;
}
#header-mount .dropdown-menu {
  z-index: 2147483001 !important;
  pointer-events: auto !important;
}
.hero::before, .hero::after,
.hero-v2::before, .hero-v2::after,
.page-hero::before, .page-hero::after,
.voyants-hero::before, .voyants-hero::after,
[class*="hero"]::before, [class*="hero"]::after,
[class*="glow"]::before, [class*="glow"]::after,
[class*="background"]::before, [class*="background"]::after {
  pointer-events: none !important;
}
main, section {
  position: relative;
  z-index: 1;
}

/* =========================================================
   FIX RÉEL TOPBAR CLIQUABLE — structure fixe isolée
   ========================================================= */
:root { --site-header-height: 76px; }
body.site-header-fixed { padding-top: var(--site-header-height) !important; }
#header-mount {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  z-index: 2147483646 !important;
  overflow: visible !important;
  isolation: isolate !important;
  pointer-events: none !important;
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
}
#header-mount .topbar,
#header-mount .topbar * { pointer-events: auto !important; }
#header-mount .topbar {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  z-index: 2147483646 !important;
  overflow: visible !important;
  background: rgba(250,247,244,.96) !important;
  border-bottom: 1px solid rgba(120,95,133,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.25) !important;
  backdrop-filter: blur(18px) saturate(1.25) !important;
}
#header-mount .topbar-inner,
#header-mount .nav,
#header-mount .nav-links,
#header-mount .nav-right,
#header-mount .dropdown { overflow: visible !important; }
#header-mount .nav-dd-toggle,
#header-mount .brand,
#header-mount .btn,
#header-mount .dropdown-menu a {
  position: relative !important;
  z-index: 2147483647 !important;
  cursor: pointer !important;
}
#header-mount .dropdown-menu {
  display: none !important;
  position: absolute !important;
  top: calc(100% + 12px) !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  z-index: 2147483647 !important;
  pointer-events: auto !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#header-mount .dropdown-menu.is-open,
#header-mount .dropdown.is-open > .dropdown-menu,
#header-mount .dropdown:hover > .dropdown-menu { display: block !important; }
#header-mount .dropdown-menu[hidden]:not(.is-open) { display: none !important; }
#header-mount .dropdown.is-open > .dropdown-menu[hidden],
#header-mount .dropdown:hover > .dropdown-menu[hidden] { display: block !important; }
.hero::before, .hero::after,
.hero-v2::before, .hero-v2::after,
.page-hero::before, .page-hero::after,
.voyants-hero::before, .voyants-hero::after,
[class*="hero"]::before, [class*="hero"]::after,
[class*="overlay"]::before, [class*="overlay"]::after,
[class*="glow"]::before, [class*="glow"]::after,
[class*="background"]::before, [class*="background"]::after { pointer-events: none !important; }

/* =========================================================
   CLEAN FINAL — espace membre sans sidebar + topbar connectée
   ========================================================= */
#header-mount .nav-dd-toggle{
  -webkit-appearance:none!important;
  appearance:none!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  color:#7a6b7c!important;
  font-family:var(--font-body,'DM Sans',Arial,sans-serif)!important;
  font-size:.83rem!important;
  font-weight:500!important;
  line-height:1!important;
  padding:8px 0!important;
  margin:0!important;
}
#header-mount .account-toggle{
  background:linear-gradient(135deg,#c9b4e5,#dfc4a6)!important;
  border-radius:999px!important;
  padding:12px 18px!important;
  color:#3d3040!important;
  gap:8px!important;
}
#header-mount .account-dot{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.45);font-size:.72rem;}
#header-mount .account-menu{right:0!important;left:auto!important;transform:none!important;min-width:220px!important;}
#header-mount .account-menu:before{left:auto!important;right:22px!important;transform:rotate(45deg)!important;}
#header-mount [hidden]{display:none!important;}

body[data-page^="membre-"] .dashboard-layout{
  display:block!important;
  grid-template-columns:1fr!important;
  min-height:calc(100vh - var(--site-header-height,76px))!important;
}
body[data-page^="membre-"] #clientSidebarMount,
body[data-page^="membre-"] .client-sidebar,
body[data-page^="membre-"] .sidebar{
  display:none!important;
}
body[data-page^="membre-"] .dashboard-main{
  width:100%!important;
  min-width:0!important;
  overflow:visible!important;
}
body[data-page^="membre-"] .dash-topbar{
  position:relative!important;
  top:auto!important;
  z-index:1!important;
  max-width:1220px!important;
  margin:0 auto!important;
  border-left:1px solid var(--line,rgba(120,95,133,.10))!important;
  border-right:1px solid var(--line,rgba(120,95,133,.10))!important;
}
body[data-page^="membre-"] .dash-content{
  max-width:1220px!important;
  margin:0 auto!important;
}

/* =========================================================
   REFACTO DASHBOARD CLEAN — base stable Safari / Chrome / Firefox
   ========================================================= */
html, body { width: 100%; min-width: 0; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }

/* Topbar globale : sticky, cliquable, sans mode fixed fragile */
#header-mount {
  position: sticky !important;
  top: 0 !important;
  left: auto !important;
  right: auto !important;
  width: 100% !important;
  z-index: 99990 !important;
  height: auto !important;
  pointer-events: auto !important;
  overflow: visible !important;
  isolation: isolate !important;
  transform: none !important;
  -webkit-transform: none !important;
}
body.site-header-fixed { padding-top: 0 !important; }
#header-mount .topbar {
  position: relative !important;
  width: 100% !important;
  z-index: 99991 !important;
  overflow: visible !important;
  background: rgba(250,247,244,.96) !important;
  border-bottom: 1px solid rgba(120,95,133,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.2) !important;
  backdrop-filter: blur(18px) saturate(1.2) !important;
}
#header-mount .container.topbar-inner {
  /* TOPBAR V24 — logo aligné plus à gauche pour libérer de la place aux futurs menus */
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 28px !important;
  min-height: 76px !important;
  height: 76px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 24px !important;
  overflow: visible !important;
}
#header-mount .brand { display:flex!important; align-items:center!important; gap:12px!important; text-decoration:none!important; color:#3d3040!important; min-width:220px!important; }
#header-mount .brand-logo { width:44px!important; height:44px!important; border-radius:50%!important; display:grid!important; place-items:center!important; background:linear-gradient(135deg,#e8dcf8,#d7c0f1)!important; box-shadow:0 10px 26px rgba(155,126,200,.22)!important; color:#56396d!important; flex:0 0 auto!important; }
#header-mount .brand-text { display:flex!important; flex-direction:column!important; line-height:1.15!important; }
#header-mount .brand-text strong { font-family:var(--font-display,'Cormorant Garamond',Georgia,serif)!important; font-size:1.05rem!important; font-weight:600!important; }
#header-mount .brand-text span { font-size:.78rem!important; color:#b0a0b2!important; margin-top:4px!important; }
#header-mount .nav { display:flex!important; align-items:center!important; justify-content:flex-end!important; gap:26px!important; overflow:visible!important; flex:1 1 auto!important; }
#header-mount .nav-links, #header-mount .nav-right { display:flex!important; align-items:center!important; gap:22px!important; overflow:visible!important; }
#header-mount .dropdown { position:relative!important; display:inline-flex!important; align-items:center!important; overflow:visible!important; }
#header-mount .nav-dd-toggle {
  -webkit-appearance: none !important;
  appearance: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  color:#756579!important;
  font-family:var(--font-body,'DM Sans',Arial,sans-serif)!important;
  font-size:.84rem!important;
  font-weight:500!important;
  line-height:1!important;
  padding:12px 0!important;
  margin:0!important;
  cursor:pointer!important;
  position:relative!important;
  z-index:99993!important;
}
#header-mount .nav-dd-toggle:hover { color:#3d3040!important; }
#header-mount .dropdown-menu {
  position:absolute!important;
  top:calc(100% + 12px)!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  min-width:240px!important;
  display:none!important;
  padding:8px!important;
  background:#fff!important;
  border:1px solid rgba(120,95,133,.14)!important;
  border-radius:16px!important;
  box-shadow:0 18px 45px rgba(70,45,95,.16)!important;
  z-index:99999!important;
  pointer-events:auto!important;
  opacity:1!important;
  visibility:visible!important;
}
#header-mount .dropdown-menu::before {
  content:''!important;
  position:absolute!important;
  top:-5px!important;
  left:50%!important;
  width:10px!important;
  height:10px!important;
  transform:translateX(-50%) rotate(45deg)!important;
  background:#fff!important;
  border-left:1px solid rgba(120,95,133,.14)!important;
  border-top:1px solid rgba(120,95,133,.14)!important;
}
#header-mount .dropdown.is-open > .dropdown-menu,
#header-mount .dropdown-menu.is-open,
#header-mount .dropdown:hover > .dropdown-menu { display:block!important; }
#header-mount .dropdown.is-open > .dropdown-menu[hidden],
#header-mount .dropdown:hover > .dropdown-menu[hidden],
#header-mount .dropdown-menu.is-open[hidden] { display:block!important; }
#header-mount .dropdown:not(.is-open):not(:hover) > .dropdown-menu[hidden] { display:none!important; }
#header-mount .dropdown-menu a, #header-mount .dropdown-disabled {
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
  padding:11px 12px!important;
  border-radius:10px!important;
  text-decoration:none!important;
  color:#3d3040!important;
  background:transparent!important;
  font-size:.84rem!important;
  line-height:1.25!important;
  white-space:nowrap!important;
}
#header-mount .dropdown-menu a:hover { background:#f7f1ec!important; }
#header-mount .dropdown-menu strong { font-weight:600!important; }
#header-mount .dropdown-disabled { opacity:.58!important; cursor:default!important; }
#header-mount .dropdown-disabled em { margin-left:auto!important; font-style:normal!important; font-size:.68rem!important; background:rgba(210,190,238,.35)!important; color:#7a5c8a!important; border-radius:999px!important; padding:2px 7px!important; }
#header-mount .btn { display:inline-flex!important; align-items:center!important; justify-content:center!important; min-height:44px!important; border-radius:999px!important; padding:12px 22px!important; text-decoration:none!important; font-size:.85rem!important; font-weight:600!important; border:1px solid rgba(120,95,133,.10)!important; cursor:pointer!important; }
#header-mount .btn-ghost { background:rgba(255,255,255,.66)!important; color:#756579!important; }
#header-mount .btn-primary, #header-mount .account-toggle { background:linear-gradient(135deg,#c9b4e5,#dfc4a6)!important; color:#3d3040!important; border-color:transparent!important; border-radius:999px!important; }
#header-mount .account-toggle { gap:8px!important; padding:12px 18px!important; }
#header-mount .account-dot { display:inline-grid!important; place-items:center!important; width:18px!important; height:18px!important; border-radius:50%!important; background:rgba(255,255,255,.45)!important; font-size:.72rem!important; }
#header-mount .account-menu { left:auto!important; right:0!important; transform:none!important; min-width:230px!important; }
#header-mount .account-menu::before { left:auto!important; right:24px!important; transform:rotate(45deg)!important; }

/* Espace membre refactorisé : plus aucune sidebar, contenu centré */
body[data-page^="membre-"] { background: var(--bg,#faf7f4) !important; }
body[data-page^="membre-"] .dashboard-layout,
body[data-page^="membre-"] .dashboard-main,
body[data-page^="membre-"] .dash-content {
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
}
body[data-page^="membre-"] #clientSidebarMount,
body[data-page^="membre-"] .client-sidebar,
body[data-page^="membre-"] .sidebar { display:none!important; }
body[data-page^="membre-"] .dash-topbar { display:none!important; }

.member-page-clean {
  width:100%;
  max-width:1220px;
  margin:0 auto;
  padding:42px 24px 70px;
}
.member-statusbar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin-bottom:28px;
  padding:18px 22px;
  border:1px solid var(--line,rgba(120,95,133,.10));
  border-radius:24px;
  background:rgba(255,255,255,.68);
  box-shadow:0 14px 40px rgba(80,60,110,.06);
}
.member-statusbar h1 { margin:0; font-family:var(--font-body,'DM Sans',Arial,sans-serif); font-size:1.08rem; font-weight:600; color:var(--text,#3d3040); }
.member-credits-pill { display:inline-flex; align-items:center; gap:8px; border-radius:999px; padding:9px 16px; background:linear-gradient(135deg,rgba(196,174,224,.28),rgba(237,215,176,.22)); border:1px solid rgba(180,155,210,.2); color:#5a3d70; font-weight:600; font-size:.86rem; white-space:nowrap; }
.member-credits-pill::before { content:''; width:7px; height:7px; border-radius:50%; background:var(--gold,#c9a44f); }
.member-hero-card {
  border:1px solid rgba(120,95,133,.10);
  border-radius:32px;
  background:radial-gradient(circle at 75% 20%,rgba(210,190,238,.25),transparent 34%),linear-gradient(135deg,#f5edfb 0%,#fff9f1 100%);
  box-shadow:0 20px 60px rgba(80,60,110,.08);
  padding:44px 48px;
  margin-bottom:26px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:28px;
}
.member-eyebrow { display:inline-flex; align-items:center; width:max-content; gap:8px; text-transform:uppercase; letter-spacing:.06em; font-size:.78rem; font-weight:700; color:#8b6fac; background:rgba(210,190,238,.38); border-radius:999px; padding:9px 16px; margin-bottom:20px; }
.member-hero-card h2 { margin:0 0 14px; font-family:var(--font-display,'Cormorant Garamond',Georgia,serif); font-size:clamp(2.1rem,4vw,3.4rem); line-height:1.02; font-weight:600; color:#3d3040; }
.member-hero-card h2 em { font-style:italic; color:#65416f; }
.member-hero-card p { margin:0; max-width:52ch; color:#756579; font-size:1.02rem; line-height:1.75; }
.member-card-deco { display:flex; align-items:center; gap:14px; padding-right:20px; }
.member-card-deco span { width:74px; height:104px; display:grid; place-items:center; border-radius:17px; font-size:1.8rem; box-shadow:0 14px 30px rgba(80,60,110,.08); }
.member-card-deco span:nth-child(1){ background:#ffe983; transform:rotate(-4deg); }
.member-card-deco span:nth-child(2){ background:#cdb6ff; }
.member-card-deco span:nth-child(3){ background:#ffc1d4; transform:rotate(4deg); }
.member-grid-clean { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px; align-items:start; }
.member-panel { background:#fff; border:1px solid var(--line,rgba(120,95,133,.10)); border-radius:24px; box-shadow:0 16px 44px rgba(80,60,110,.06); padding:24px; min-width:0; }
.member-panel-head { display:flex; align-items:center; justify-content:space-between; gap:14px; padding-bottom:14px; margin-bottom:18px; border-bottom:1px solid var(--line,rgba(120,95,133,.10)); }
.member-panel-head h3 { margin:0; font-family:var(--font-display,'Cormorant Garamond',Georgia,serif); font-size:1.12rem; color:#3d3040; }
.member-panel-head a { color:#8b6fac; font-size:.84rem; text-underline-offset:3px; }
.member-list { display:flex; flex-direction:column; gap:10px; }
.member-consult-card, .member-shortcut { display:flex; align-items:center; gap:14px; padding:14px 16px; border-radius:16px; border:1px solid rgba(120,95,133,.10); background:#f7f0eb; text-decoration:none; color:#3d3040; }
.member-avatar { width:46px; height:46px; border-radius:50%; display:grid; place-items:center; overflow:hidden; background:linear-gradient(135deg,rgba(210,190,238,.55),rgba(237,215,176,.45)); color:#6a4d7a; flex:0 0 auto; font-family:var(--font-display,'Cormorant Garamond',Georgia,serif); font-size:1.2rem; }
.member-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.member-card-info { flex:1; min-width:0; }
.member-card-info strong { display:block; font-size:.92rem; font-weight:700; color:#3d3040; }
.member-card-info span { display:block; margin-top:4px; color:#9a879d; font-size:.8rem; white-space:normal; }
.member-amount, .member-cta { margin-left:auto; flex:0 0 auto; font-weight:700; color:#756579; white-space:nowrap; }
.member-cta { border-radius:999px; padding:8px 13px; background:linear-gradient(135deg,#c9b4e5,#dfc4a6); color:#3d3040; font-size:.78rem; }
.member-badge { display:inline-flex; margin-left:8px; border-radius:999px; padding:3px 9px; font-size:.72rem; background:#e9d7df; color:#9b6f8b; vertical-align:middle; }
.member-badge.status-terminee { background:#dff2df; color:#5d9a68; }
.member-empty { padding:24px; text-align:center; color:#756579; background:#fbf7f4; border-radius:18px; border:1px dashed rgba(120,95,133,.16); }

@media(max-width:900px){
  #header-mount .container.topbar-inner { height:auto!important; min-height:76px!important; flex-wrap:wrap!important; padding:12px 20px!important; }
  #header-mount .brand { min-width:0!important; }
  #header-mount .nav { width:100%!important; justify-content:flex-start!important; flex-wrap:wrap!important; }
  #header-mount .nav-links { flex-wrap:wrap!important; gap:14px!important; }
  #header-mount .nav-right { margin-left:auto!important; }
  .member-hero-card { grid-template-columns:1fr; padding:34px 28px; }
  .member-card-deco { display:none; }
  .member-grid-clean { grid-template-columns:1fr; }
}
@media(max-width:640px){
  .member-page-clean { padding:28px 16px 54px; }
  .member-statusbar { flex-direction:column; align-items:flex-start; }
  .member-consult-card, .member-shortcut { align-items:flex-start; }
  #header-mount .brand-text span { display:none!important; }
}

/* =========================================================
   AUTH TOPBAR FINAL — connecté = Connexion/Inscription cachés
   ========================================================= */
#header-mount [hidden],
#header-mount .is-hidden {
  display: none !important;
}
#header-mount [data-auth-user]:not(.is-hidden):not([hidden]) {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}
#header-mount .nav-credit-pill {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
  border-radius: 999px !important;
  padding: 11px 17px !important;
  background: rgba(255,255,255,.65) !important;
  border: 1px solid rgba(120,95,133,.12) !important;
  color: #5a3d70 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
#header-mount .nav-credit-pill:before {
  content: '' !important;
  width: 7px !important;
  height: 7px !important;
  border-radius: 50% !important;
  background: #c9a44f !important;
  flex: 0 0 auto !important;
}

/* === CENTRAL AUTH + SAFARI TOPBAR FINAL FIX === */
#header-mount [data-auth-guest][hidden],
#header-mount [data-auth-guest].is-hidden,
#header-mount [data-auth-user][hidden],
#header-mount [data-auth-user].is-hidden,
#header-mount [hidden] { display: none !important; }

html.auth-logged #header-mount [data-auth-guest],
body.auth-logged #header-mount [data-auth-guest] { display: none !important; }
html.auth-logged #header-mount [data-auth-user],
body.auth-logged #header-mount [data-auth-user] { display: flex !important; }
html.auth-guest #header-mount [data-auth-user],
body.auth-guest #header-mount [data-auth-user] { display: none !important; }
html.auth-guest #header-mount [data-auth-guest],
body.auth-guest #header-mount [data-auth-guest] { display: flex !important; }

#header-mount .topbar,
#header-mount .topbar * { box-sizing: border-box !important; }
#header-mount .topbar { overflow: visible !important; }
#header-mount .topbar-inner { overflow: visible !important; }
#header-mount .nav,
#header-mount .nav-links,
#header-mount .nav-right,
#header-mount .nav-auth {
  display: flex;
  align-items: center;
  white-space: nowrap !important;
  min-width: 0 !important;
  overflow: visible !important;
}
#header-mount .nav-dd-toggle,
#header-mount .btn,
#header-mount .nav-credit-pill { white-space: nowrap !important; flex: 0 0 auto !important; }
#header-mount .nav-credit-pill:empty { display: none !important; }
#header-mount .dropdown-menu { white-space: normal !important; }
#header-mount .dropdown-menu a,
#header-mount .dropdown-disabled { white-space: nowrap !important; }

@media (max-width: 980px) {
  #header-mount .container.topbar-inner { max-width: none !important; padding-left: 18px !important; padding-right: 18px !important; gap: 14px !important; }
  #header-mount .brand { min-width: 190px !important; }
  #header-mount .nav { gap: 14px !important; }
  #header-mount .nav-links { gap: 14px !important; }
  #header-mount .btn { padding-left: 16px !important; padding-right: 16px !important; }
}

/* SaaS clean — bouton déconnexion dans dropdown compte */
.dropdown-logout {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  color: #5c4c63;
}
.dropdown-logout strong { font-weight: 600; }
.dropdown-logout span { width: 24px; text-align: center; }

/* =========================================================
   FULL RESPONSIVE MOBILE PATCH — 2026-04-28
   Objectif : site fluide mobile/tablette sans casser le desktop.
   ========================================================= */

:root{
  --mobile-gutter: clamp(14px, 4vw, 24px);
}

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  width:100%;
  overflow-x:hidden;
}
body{
  width:100%;
  min-width:0!important;
  overflow-x:hidden!important;
}
img,video,canvas,svg,iframe{
  max-width:100%;
}
iframe{display:block;border:0;}
.container,
.sv2-container,
.voyants-container,
.page-container,
.dashboard-container,
.admin-container{
  width:min(100% - (var(--mobile-gutter) * 2), var(--container, 1160px))!important;
  max-width:100%!important;
}
main,section,article,aside,header,footer,nav,form{
  min-width:0;
}
input,select,textarea,button{
  max-width:100%;
  font-size:16px;
}

/* Header mobile avec menu déroulant compact */
#header-mount .mobile-menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(120,95,133,.12);
  background:rgba(255,255,255,.72);
  color:#3d3040;
  cursor:pointer;
  font:inherit;
  flex:0 0 auto;
}
#header-mount .mobile-menu-icon,
#header-mount .mobile-menu-icon::before,
#header-mount .mobile-menu-icon::after{
  content:'';
  display:block;
  width:19px;
  height:2px;
  border-radius:99px;
  background:currentColor;
  transition:transform .22s ease, opacity .22s ease;
}
#header-mount .mobile-menu-icon{position:relative;}
#header-mount .mobile-menu-icon::before{position:absolute;top:-6px;left:0;}
#header-mount .mobile-menu-icon::after{position:absolute;top:6px;left:0;}
#header-mount.is-mobile-open .mobile-menu-icon{background:transparent;}
#header-mount.is-mobile-open .mobile-menu-icon::before{transform:translateY(6px) rotate(45deg);}
#header-mount.is-mobile-open .mobile-menu-icon::after{transform:translateY(-6px) rotate(-45deg);}

@media (max-width: 920px){
  #header-mount .container.topbar-inner,
  #header-mount .topbar-inner{
    min-height:68px!important;
    height:auto!important;
    padding:10px var(--mobile-gutter)!important;
    gap:10px!important;
    flex-wrap:wrap!important;
  }
  #header-mount .brand{
    min-width:0!important;
    flex:1 1 auto!important;
    gap:10px!important;
  }
  #header-mount .brand-logo{width:40px!important;height:40px!important;}
  #header-mount .brand-text strong{font-size:.98rem!important;}
  #header-mount .brand-text span{font-size:.7rem!important;}
  #header-mount .mobile-menu-toggle{display:inline-flex!important;}
  #header-mount .nav{
    display:none!important;
    flex-basis:100%!important;
    width:100%!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:10px!important;
    padding:8px 0 4px!important;
  }
  #header-mount.is-mobile-open .nav{display:flex!important;}
  #header-mount .nav-links,
  #header-mount .nav-right,
  #header-mount .nav-auth{
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:8px!important;
    margin:0!important;
    white-space:normal!important;
  }
  #header-mount [data-auth-guest][hidden],
  #header-mount [data-auth-user][hidden],
  #header-mount .is-hidden{display:none!important;}
  html.auth-logged #header-mount [data-auth-guest],
  body.auth-logged #header-mount [data-auth-guest],
  html.auth-guest #header-mount [data-auth-user],
  body.auth-guest #header-mount [data-auth-user]{display:none!important;}
  #header-mount .dropdown,
  #header-mount .btn,
  #header-mount .nav-credit-pill,
  #header-mount .nav-dd-toggle{
    width:100%!important;
    justify-content:space-between!important;
    min-height:44px!important;
  }
  #header-mount .nav-dd-toggle:not(.account-toggle){
    padding:12px 14px!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.66)!important;
    border:1px solid rgba(120,95,133,.10)!important;
  }
  #header-mount .dropdown-menu,
  #header-mount .account-menu{
    position:static!important;
    inset:auto!important;
    transform:none!important;
    width:100%!important;
    min-width:0!important;
    margin-top:6px!important;
    border-radius:14px!important;
    box-shadow:none!important;
  }
  #header-mount .dropdown-menu::before{display:none!important;}
  #header-mount .dropdown-menu a,
  #header-mount .dropdown-disabled,
  #header-mount .dropdown-logout{
    white-space:normal!important;
  }
}

@media (max-width: 520px){
  #header-mount .brand-text span{display:none!important;}
  #header-mount .brand-text strong{font-size:.94rem!important;}
  #header-mount .container.topbar-inner,#header-mount .topbar-inner{min-height:62px!important;}
}

/* Sections publiques */
@media (max-width: 1024px){
  .hero-inner,.hero-v2-inner,.consultation-hero,.voyants-hero-inner,
  .tarot-hero-inner,.horoscope-hero-inner,.page-hero-inner,
  .cabinet-banner,.footer-grid,.site-footer-inner{
    grid-template-columns:1fr!important;
  }
  .steps-grid,.trust-grid,.reviews-grid,.features-grid,.cards-grid,
  .sv2-grid,.voyants-grid,.voyants-grid-full,#voyantsGrid,
  .pricing-grid,.content-grid,.faq-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media (max-width: 720px){
  .hero,.hero-v2,.page-hero,.voyants-hero,.section,.section-voyants-v2,
  .auth-page,.login-page,.register-page{
    padding-left:0!important;
    padding-right:0!important;
  }
  .hero-v2{padding-top:34px!important;padding-bottom:38px!important;}
  .hero-v2-inner{padding:0 var(--mobile-gutter)!important;gap:26px!important;}
  .hero-v2-title,h1{font-size:clamp(2rem,10vw,3rem)!important;line-height:1.05!important;}
  h2{font-size:clamp(1.65rem,8vw,2.35rem)!important;}
  .hero-v2-lead,.section-heading p,.page-hero p{font-size:1rem!important;}
  .hero-v2-ctas,.form-actions,.auth-actions,.sv2-header,.site-footer-bottom{
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .hero-cta-primary,.hero-cta-secondary,.btn,.btn-primary,.btn-secondary,.btn-ghost,
  .sv2-voir-tous,.form-actions a,.form-actions button{
    width:100%!important;
    justify-content:center!important;
    text-align:center!important;
  }
  .hero-v2-trust,.sv2-filters,.filter-row,.filters-grid{
    display:flex!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
    padding-bottom:6px;
  }
  .hero-trust-item,.sv2-filter-btn,.filter-pill{flex:0 0 auto;scroll-snap-align:start;}
  .steps-grid,.trust-grid,.reviews-grid,.features-grid,.cards-grid,
  .sv2-grid,.voyants-grid,.voyants-grid-full,#voyantsGrid,
  .pricing-grid,.content-grid,.faq-grid{
    grid-template-columns:1fr!important;
  }
  .card,.voyant-card,.sv2-card,.review-card,.auth-card,.login-card,.register-card{
    border-radius:22px!important;
  }
  .site-footer-links{justify-content:flex-start!important;flex-direction:column!important;gap:10px!important;}
}

/* Tableaux, listes et formulaires : aucune sortie horizontale */
.table-wrap,.admin-table-wrap,.data-table-wrap,.list-table-wrap,
.table-responsive,.cabinet-table-wrap{
  width:100%!important;
  overflow-x:auto!important;
  -webkit-overflow-scrolling:touch;
}
table{max-width:100%;}
@media (max-width: 780px){
  .filters-grid,.form-grid,.detail-grid,.stats-grid,.realtime-stats,
  .dashboard-grid,.dash-grid,.admin-grid,.admin-cards-grid,
  .consultation-grid,.profile-grid,.settings-grid,.credits-grid,
  .paiement-grid,.virements-grid{
    grid-template-columns:1fr!important;
  }
  .detail-row,.info-row,.profile-row{
    grid-template-columns:1fr!important;
    gap:6px!important;
  }
  .table-head,.panel-head,.member-panel-head,.dash-header,.admin-header{
    flex-direction:column!important;
    align-items:flex-start!important;
  }
  .admin-table-v2,
  .dash-table,
  .data-table{
    min-width:680px;
  }
  .form-card,.detail-card,.filter-card,.list-card,.panel,.member-panel{
    padding:18px!important;
    border-radius:20px!important;
  }
}

/* Espaces membre / cabinet */
@media (max-width: 900px){
  .member-page-clean{padding:28px var(--mobile-gutter) 54px!important;}
  .member-statusbar{align-items:flex-start!important;}
  .member-hero-card{padding:30px 22px!important;border-radius:26px!important;}
  .member-grid-clean{grid-template-columns:1fr!important;}
  .dashboard-layout{grid-template-columns:1fr!important;}
  .dashboard-main,.dash-content{width:100%!important;min-width:0!important;}
  .cabinet-sidebar,.client-sidebar,.admin-sidebar{position:static!important;width:100%!important;}
}
@media (max-width: 560px){
  .member-statusbar,.member-consult-card,.member-shortcut,
  .consult-row,.message-row,.payment-row,.virement-row{
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .member-amount,.member-cta{margin-left:0!important;width:100%;text-align:center;}
  .member-hero-card h2{font-size:clamp(1.9rem,10vw,2.5rem)!important;}
  .member-panel-head a{width:100%;}
}

/* Très petits écrans */
@media (max-width: 380px){
  :root{--mobile-gutter:12px;}
  #header-mount .brand-logo{width:36px!important;height:36px!important;}
  #header-mount .mobile-menu-toggle{width:40px;height:40px;}
  .btn,.hero-cta-primary,.hero-cta-secondary{padding-left:14px!important;padding-right:14px!important;}
}

/* === PATCH iPhone Safari : consultation chat responsive === */
body:where([data-page="voyance-consultation"]){
  margin:0!important;
  width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  overscroll-behavior:none;
}
:where(body[data-page="voyance-consultation"]) .consult-layout{
  width:100%!important;
  max-width:100vw!important;
  min-width:0!important;
  height:100svh!important;
  max-height:100svh!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
}
@supports (height: 100dvh){
  :where(body[data-page="voyance-consultation"]) .consult-layout{
    height:100dvh!important;
    max-height:100dvh!important;
  }
}
:where(body[data-page="voyance-consultation"]) .consult-topbar,
:where(body[data-page="voyance-consultation"]) .chat-area,
:where(body[data-page="voyance-consultation"]) .send-bar{
  min-width:0!important;
  max-width:100vw!important;
  box-sizing:border-box!important;
}
:where(body[data-page="voyance-consultation"]) .chat-area{min-height:0!important;}
:where(body[data-page="voyance-consultation"]) .messages-wrap{min-height:0!important;}
:where(body[data-page="voyance-consultation"]) .send-bar{
  padding-bottom:calc(12px + env(safe-area-inset-bottom,0px))!important;
}

@media (max-width:640px){
  :where(body[data-page="voyance-consultation"]) .consult-topbar{
    min-height:58px!important;
    height:auto!important;
    padding:7px 10px!important;
    gap:6px!important;
    overflow:hidden!important;
    flex-wrap:nowrap!important;
  }
  :where(body[data-page="voyance-consultation"]) .topbar-left{
    min-width:0!important;
    flex:1 1 auto!important;
    gap:6px!important;
    overflow:hidden!important;
  }
  :where(body[data-page="voyance-consultation"]) .consult-logo{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-voyant{
    min-width:0!important;
    max-width:34vw!important;
    flex:1 1 auto!important;
    padding:4px 8px!important;
    gap:7px!important;
  }
  :where(body[data-page="voyance-consultation"]) .topbar-avatar{
    width:30px!important;
    height:30px!important;
    font-size:.8rem!important;
  }
  :where(body[data-page="voyance-consultation"]) .topbar-voyant-info{
    min-width:0!important;
    overflow:hidden!important;
  }
  :where(body[data-page="voyance-consultation"]) .topbar-voyant-info strong{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    max-width:100%!important;
  }
  :where(body[data-page="voyance-consultation"]) .consult-topbar > div:nth-child(2){
    flex:0 0 auto!important;
    gap:6px!important;
    min-width:0!important;
  }
  :where(body[data-page="voyance-consultation"]) .consult-timer{
    padding:5px 9px!important;
    gap:6px!important;
  }
  :where(body[data-page="voyance-consultation"]) .timer-value{
    min-width:43px!important;
    font-size:.95rem!important;
  }
  :where(body[data-page="voyance-consultation"]) .credits-counter{
    gap:4px!important;
    white-space:nowrap!important;
  }
  :where(body[data-page="voyance-consultation"]) .credits-counter span:last-child{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .credit-val{font-size:.95rem!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-right{
    flex:0 0 auto!important;
    min-width:0!important;
  }
  :where(body[data-page="voyance-consultation"]) .btn-end{
    padding:7px 10px!important;
    font-size:.78rem!important;
    white-space:nowrap!important;
  }
  :where(body[data-page="voyance-consultation"]) .messages-wrap{
    padding:14px 12px!important;
    gap:12px!important;
  }
  :where(body[data-page="voyance-consultation"]) .typing-indicator{
    padding:0 12px 10px!important;
  }
  :where(body[data-page="voyance-consultation"]) .send-bar{
    gap:8px!important;
    padding:10px 10px calc(10px + env(safe-area-inset-bottom,0px))!important;
  }
}

@media (max-width:430px){
  :where(body[data-page="voyance-consultation"]) .consult-topbar{padding-left:8px!important;padding-right:8px!important;gap:5px!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-voyant{max-width:30vw!important;padding-left:6px!important;padding-right:6px!important;}
  :where(body[data-page="voyance-consultation"]) .consult-timer{padding-left:8px!important;padding-right:8px!important;}
  :where(body[data-page="voyance-consultation"]) .credits-counter > span:first-child{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .btn-end{
    width:38px!important;
    height:38px!important;
    padding:0!important;
    font-size:0!important;
    display:grid!important;
    place-items:center!important;
  }
  :where(body[data-page="voyance-consultation"]) .btn-end::before{
    content:"✕";
    font-size:18px!important;
    line-height:1!important;
  }
}

/* =========================================================
   CORRECTIF MOBILE STRICT — iPhone 16 Pro Max / Safari iOS
   2026-04-28 — consultation chat + sous-menus topbar
   ========================================================= */

/* Empêche les dropdowns desktop/tablette de dépasser l'écran */
#header-mount .dropdown{ position:relative!important; }
#header-mount .dropdown-menu{
  max-width:calc(100vw - 24px)!important;
  overflow-wrap:anywhere!important;
  overscroll-behavior:contain!important;
}
#header-mount .dropdown-menu a,
#header-mount .dropdown-disabled,
#header-mount .dropdown-logout{
  min-width:0!important;
}
#header-mount .dropdown-menu[data-align="right"]{
  left:auto!important;
  right:0!important;
}
#header-mount .dropdown-menu[data-align="left"]{
  left:0!important;
  right:auto!important;
}
#header-mount .dropdown-menu[data-align="fixed"]{
  position:fixed!important;
  left:12px!important;
  right:12px!important;
  width:auto!important;
  min-width:0!important;
  top:var(--dropdown-fixed-top, 74px)!important;
}

@media (max-width:920px){
  #header-mount .topbar{position:relative!important;z-index:999!important;}
  #header-mount.is-mobile-open .nav{
    max-height:calc(100dvh - var(--site-header-height, 68px) - 12px)!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  #header-mount .dropdown-menu,
  #header-mount .account-menu{
    max-height:42dvh!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
}

/* Consultation chat : verrouillage dans la hauteur VISUELLE Safari, pas le 100vh théorique */
html:has(body[data-page="voyance-consultation"]),
body[data-page="voyance-consultation"]{
  width:100%!important;
  height:var(--cvh, 100dvh)!important;
  min-height:var(--cvh, 100dvh)!important;
  max-height:var(--cvh, 100dvh)!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
body[data-page="voyance-consultation"]{
  position:fixed!important;
  inset:0!important;
  touch-action:manipulation;
}
:where(body[data-page="voyance-consultation"]) .consult-layout{
  width:100vw!important;
  height:var(--cvh, 100dvh)!important;
  max-height:var(--cvh, 100dvh)!important;
  min-height:0!important;
  grid-template-columns:1fr!important;
  grid-template-rows:clamp(52px, 7.4dvh, 62px) minmax(0, 1fr) clamp(64px, 9.2dvh, 78px)!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .consult-sidebar{display:none!important;}
:where(body[data-page="voyance-consultation"]) .chat-area,
:where(body[data-page="voyance-consultation"]) .messages-wrap{
  min-height:0!important;
  max-height:100%!important;
}
:where(body[data-page="voyance-consultation"]) .send-bar{
  grid-row:3!important;
  align-self:stretch!important;
  min-height:0!important;
  height:auto!important;
  padding-bottom:max(8px, env(safe-area-inset-bottom, 0px))!important;
}
:where(body[data-page="voyance-consultation"]) .send-input{
  min-height:42px!important;
  max-height:72px!important;
  padding-top:10px!important;
  padding-bottom:10px!important;
  font-size:16px!important;
}
:where(body[data-page="voyance-consultation"]) .send-btn{
  width:42px!important;
  height:42px!important;
}

@media (max-width:480px){
  :where(body[data-page="voyance-consultation"]) .consult-layout{
    grid-template-rows:54px minmax(0, 1fr) 66px!important;
  }
  :where(body[data-page="voyance-consultation"]) .consult-topbar{
    min-height:54px!important;
    padding:6px 8px!important;
    column-gap:5px!important;
  }
  :where(body[data-page="voyance-consultation"]) .topbar-voyant{
    max-width:35vw!important;
    height:40px!important;
    padding:4px 8px!important;
  }
  :where(body[data-page="voyance-consultation"]) .topbar-avatar{width:30px!important;height:30px!important;}
  :where(body[data-page="voyance-consultation"]) .consult-timer{height:40px!important;padding:5px 9px!important;}
  :where(body[data-page="voyance-consultation"]) .credits-counter{font-size:.7rem!important;}
  :where(body[data-page="voyance-consultation"]) .credit-val{font-size:.9rem!important;}
  :where(body[data-page="voyance-consultation"]) .btn-end{height:40px!important;min-width:40px!important;}
  :where(body[data-page="voyance-consultation"]) .messages-wrap{padding:12px 10px!important;}
  :where(body[data-page="voyance-consultation"]) .send-bar{padding:8px 10px max(8px, env(safe-area-inset-bottom, 0px))!important;}
}

@media (max-width:390px){
  :where(body[data-page="voyance-consultation"]) .topbar-voyant{max-width:33vw!important;}
  :where(body[data-page="voyance-consultation"]) .consult-timer{padding-left:8px!important;padding-right:8px!important;}
  :where(body[data-page="voyance-consultation"]) .timer-value{font-size:.9rem!important;min-width:39px!important;}
}

/* =========================================================
   CORRECTIF MOBILE UNIVERSEL — toutes tailles iPhone/Android
   2026-04-28 — hauteur réelle, chat, topbar, sous-menus
   ========================================================= */
:root{
  --app-vh: 100dvh;
  --mobile-safe-bottom: env(safe-area-inset-bottom, 0px);
  --mobile-safe-top: env(safe-area-inset-top, 0px);
}
html,body{max-width:100%;overflow-x:hidden;}
img,svg,video,canvas,iframe{max-width:100%;}
*,*::before,*::after{box-sizing:border-box;}

/* Dropdowns universels : ne sortent jamais du viewport */
#header-mount{isolation:isolate;}
#header-mount .topbar{max-width:100vw!important;}
#header-mount .dropdown-menu,
#header-mount .account-menu{
  max-width:calc(100vw - 20px)!important;
  min-width:min(260px, calc(100vw - 20px))!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
  transform:none!important;
}
#header-mount .dropdown-menu a,
#header-mount .dropdown-menu button,
#header-mount .dropdown-disabled,
#header-mount .dropdown-logout{
  max-width:100%!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
@media (max-width:920px){
  #header-mount .nav{width:100%!important;max-width:100vw!important;}
  #header-mount .dropdown{position:static!important;}
  #header-mount .dropdown-menu,
  #header-mount .account-menu{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    top:var(--dropdown-fixed-top, calc(var(--site-header-height, 68px) + 8px))!important;
    width:auto!important;
    max-height:min(52dvh, calc(var(--app-vh, 100dvh) - var(--dropdown-fixed-top, 76px) - 14px))!important;
    z-index:10050!important;
    border-radius:18px!important;
  }
  #header-mount.is-mobile-open .nav{
    max-height:calc(var(--app-vh, 100dvh) - var(--site-header-height, 68px) - var(--mobile-safe-bottom) - 10px)!important;
  }
}
@media (max-width:360px){
  #header-mount .dropdown-menu,
  #header-mount .account-menu{left:8px!important;right:8px!important;max-width:calc(100vw - 16px)!important;}
}

/* Chat consultation : mobile universel, sans dépassement hauteur/largeur */
html:has(body[data-page="voyance-consultation"]),
body[data-page="voyance-consultation"]{
  width:100%!important;
  height:var(--app-vh, 100dvh)!important;
  min-height:var(--app-vh, 100dvh)!important;
  max-height:var(--app-vh, 100dvh)!important;
  overflow:hidden!important;
  position:fixed!important;
  inset:0!important;
}
:where(body[data-page="voyance-consultation"]) .consult-layout{
  width:100vw!important;
  height:var(--app-vh, 100dvh)!important;
  min-height:0!important;
  max-height:var(--app-vh, 100dvh)!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:clamp(48px, 8svh, 60px) minmax(0,1fr) clamp(58px, 10svh, 76px)!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .consult-sidebar{display:none!important;}
:where(body[data-page="voyance-consultation"]) .consult-topbar{
  grid-row:1!important;
  min-width:0!important;
  width:100%!important;
  max-width:100vw!important;
  min-height:0!important;
  height:auto!important;
  padding:6px clamp(6px, 2vw, 12px)!important;
  gap:clamp(4px, 1.4vw, 8px)!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
}
:where(body[data-page="voyance-consultation"]) .consult-topbar > *{min-width:0!important;}
:where(body[data-page="voyance-consultation"]) .topbar-left{flex:1 1 30%!important;min-width:0!important;overflow:hidden!important;}
:where(body[data-page="voyance-consultation"]) .topbar-voyant{
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  height:clamp(34px, 7svh, 42px)!important;
  padding:4px clamp(6px, 1.8vw, 10px)!important;
  gap:6px!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-avatar{width:clamp(26px, 6vw, 34px)!important;height:clamp(26px, 6vw, 34px)!important;flex:0 0 auto!important;}
:where(body[data-page="voyance-consultation"]) .topbar-voyant-info,
:where(body[data-page="voyance-consultation"]) .topbar-voyant-info strong{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
:where(body[data-page="voyance-consultation"]) .consult-topbar > div:nth-child(2){flex:0 1 auto!important;min-width:0!important;gap:clamp(4px,1.2vw,8px)!important;}
:where(body[data-page="voyance-consultation"]) .consult-timer{
  height:clamp(34px, 7svh, 42px)!important;
  min-width:0!important;
  padding:4px clamp(6px,1.8vw,10px)!important;
  gap:5px!important;
}
:where(body[data-page="voyance-consultation"]) .timer-value{font-size:clamp(.78rem, 3.4vw, .98rem)!important;min-width:clamp(34px, 10vw, 46px)!important;}
:where(body[data-page="voyance-consultation"]) .credits-counter{min-width:0!important;gap:3px!important;white-space:nowrap!important;}
:where(body[data-page="voyance-consultation"]) .credits-counter span:last-child{display:none!important;}
:where(body[data-page="voyance-consultation"]) .credit-val{font-size:clamp(.78rem, 3.2vw, .95rem)!important;}
:where(body[data-page="voyance-consultation"]) .topbar-right{flex:0 0 auto!important;min-width:0!important;}
:where(body[data-page="voyance-consultation"]) .btn-end{
  height:clamp(34px, 7svh, 42px)!important;
  min-width:clamp(36px, 18vw, 82px)!important;
  max-width:25vw!important;
  padding:4px clamp(7px,2vw,12px)!important;
  font-size:clamp(.72rem, 3vw, .86rem)!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
:where(body[data-page="voyance-consultation"]) .chat-area{grid-row:2!important;min-height:0!important;max-height:100%!important;overflow:hidden!important;}
:where(body[data-page="voyance-consultation"]) .messages-wrap{min-height:0!important;max-height:100%!important;overflow-y:auto!important;padding:clamp(8px,2.5vw,14px)!important;}
:where(body[data-page="voyance-consultation"]) .send-bar{
  grid-row:3!important;
  min-height:0!important;
  height:auto!important;
  width:100%!important;
  max-width:100vw!important;
  padding:clamp(7px,2vw,10px) clamp(8px,2.5vw,12px) max(7px, var(--mobile-safe-bottom))!important;
  gap:clamp(6px,2vw,10px)!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .send-input{min-width:0!important;min-height:clamp(38px,7svh,46px)!important;max-height:64px!important;font-size:16px!important;padding:8px 12px!important;}
:where(body[data-page="voyance-consultation"]) .send-btn{width:clamp(38px,9vw,46px)!important;height:clamp(38px,9vw,46px)!important;flex:0 0 auto!important;}
@media (max-width:380px){
  :where(body[data-page="voyance-consultation"]) .consult-layout{grid-template-rows:48px minmax(0,1fr) 58px!important;}
  :where(body[data-page="voyance-consultation"]) .consult-logo{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-left{flex-basis:26%!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-voyant{padding-left:5px!important;padding-right:5px!important;}
  :where(body[data-page="voyance-consultation"]) .btn-end{width:36px!important;min-width:36px!important;max-width:36px!important;padding:0!important;font-size:0!important;display:grid!important;place-items:center!important;}
  :where(body[data-page="voyance-consultation"]) .btn-end::before{content:"✕";font-size:17px!important;line-height:1!important;}
}
@media (max-width:340px){
  :where(body[data-page="voyance-consultation"]) .consult-topbar{padding-left:5px!important;padding-right:5px!important;gap:3px!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-avatar{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-voyant-info strong{max-width:72px!important;}
  :where(body[data-page="voyance-consultation"]) .consult-timer{padding-left:5px!important;padding-right:5px!important;}
  :where(body[data-page="voyance-consultation"]) .credits-counter > span:first-child{display:none!important;}
}

/* =========================================================
   PATCH MOBILE UNIVERSEL V2 — accordéons header + chat fit
   2026-04-28
   ========================================================= */

/* Sécurité : un menu caché reste vraiment caché, même avec les anciennes règles :hover */
#header-mount .dropdown:not(.is-open) > .dropdown-menu,
#header-mount .dropdown:not(.is-open) > .account-menu,
#header-mount .dropdown-menu[hidden]:not(.is-open),
#header-mount .account-menu[hidden]:not(.is-open){
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
#header-mount .dropdown.is-open > .dropdown-menu,
#header-mount .dropdown.is-open > .account-menu,
#header-mount .dropdown-menu.is-open,
#header-mount .account-menu.is-open{
  display:block!important;
  visibility:visible!important;
  pointer-events:auto!important;
}

/* Mobile : les sous-menus deviennent des accordéons dans le menu, plus jamais des popups hors écran */
@media (max-width:920px){
  #header-mount .dropdown,
  #header-mount .account-dropdown{
    position:relative!important;
    width:100%!important;
  }
  #header-mount .dropdown-menu,
  #header-mount .account-menu{
    position:static!important;
    inset:auto!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    max-height:none!important;
    margin:6px 0 0!important;
    padding:8px!important;
    transform:none!important;
    border-radius:16px!important;
    box-shadow:none!important;
    background:rgba(255,255,255,.72)!important;
    border:1px solid rgba(120,95,133,.12)!important;
  }
  #header-mount .dropdown:hover > .dropdown-menu[hidden],
  #header-mount .dropdown:hover > .account-menu[hidden]{
    display:none!important;
    visibility:hidden!important;
  }
  #header-mount .dropdown.is-open:hover > .dropdown-menu,
  #header-mount .dropdown.is-open:hover > .account-menu{
    display:block!important;
    visibility:visible!important;
  }
  #header-mount .dropdown-menu::before,
  #header-mount .account-menu::before{display:none!important;}
  #header-mount .nav-dd-toggle span:last-child{transition:transform .18s ease;}
  #header-mount .dropdown.is-open > .nav-dd-toggle span:last-child{transform:rotate(180deg);}
}

/* Consultation chat : force le contenu à tenir dans tous les petits écrans */
body[data-page="voyance-consultation"]{
  background:#140d20!important;
}
:where(body[data-page="voyance-consultation"]) .consult-layout{
  width:100vw!important;
  max-width:100vw!important;
  height:var(--cvh, var(--app-vh, 100dvh))!important;
  max-height:var(--cvh, var(--app-vh, 100dvh))!important;
  min-height:0!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .consult-topbar{
  width:100%!important;
  max-width:100vw!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto auto!important;
  align-items:center!important;
  gap:6px!important;
  padding:6px 8px!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-left,
:where(body[data-page="voyance-consultation"]) .consult-topbar > div:nth-child(2),
:where(body[data-page="voyance-consultation"]) .topbar-right{
  min-width:0!important;
  max-width:100%!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-left{
  display:flex!important;
  flex:unset!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .consult-logo{
  display:none!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-voyant{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:40px!important;
  padding:4px 8px!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-avatar{
  width:30px!important;
  height:30px!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-voyant-info span{
  display:none!important;
}
:where(body[data-page="voyance-consultation"]) .consult-topbar > div:nth-child(2){
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  flex:unset!important;
}
:where(body[data-page="voyance-consultation"]) .consult-timer{
  height:40px!important;
  padding:4px 9px!important;
  min-width:0!important;
}
:where(body[data-page="voyance-consultation"]) .timer-value{
  min-width:40px!important;
  font-size:.92rem!important;
}
:where(body[data-page="voyance-consultation"]) .credits-counter{
  font-size:.78rem!important;
  min-width:0!important;
}
:where(body[data-page="voyance-consultation"]) .credits-counter span:first-child,
:where(body[data-page="voyance-consultation"]) .credits-counter span:last-child{
  display:none!important;
}
:where(body[data-page="voyance-consultation"]) .credit-val{
  font-size:.9rem!important;
}
:where(body[data-page="voyance-consultation"]) .btn-end{
  width:40px!important;
  min-width:40px!important;
  max-width:40px!important;
  height:40px!important;
  padding:0!important;
  font-size:0!important;
  display:grid!important;
  place-items:center!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .btn-end::before{
  content:"✕";
  font-size:18px!important;
  line-height:1!important;
}
:where(body[data-page="voyance-consultation"]) .chat-area{
  min-height:0!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .messages-wrap{
  min-height:0!important;
  height:100%!important;
  overflow-y:auto!important;
  padding:10px!important;
}
:where(body[data-page="voyance-consultation"]) .send-bar{
  width:100%!important;
  max-width:100vw!important;
  min-width:0!important;
  min-height:0!important;
  height:auto!important;
  padding:8px 10px max(8px, env(safe-area-inset-bottom,0px))!important;
  gap:8px!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .send-input-wrap{
  min-width:0!important;
  flex:1 1 auto!important;
}
:where(body[data-page="voyance-consultation"]) .send-input{
  min-height:40px!important;
  height:40px!important;
  max-height:58px!important;
  padding:9px 12px!important;
  font-size:16px!important;
}
:where(body[data-page="voyance-consultation"]) .send-btn{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  flex:0 0 40px!important;
}
@media (max-width:374px){
  :where(body[data-page="voyance-consultation"]) .consult-topbar{
    grid-template-columns:minmax(0,1fr) auto 36px!important;
    gap:4px!important;
    padding-left:6px!important;
    padding-right:6px!important;
  }
  :where(body[data-page="voyance-consultation"]) .topbar-avatar{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-voyant{height:36px!important;padding:3px 7px!important;}
  :where(body[data-page="voyance-consultation"]) .consult-timer{height:36px!important;padding:3px 7px!important;}
  :where(body[data-page="voyance-consultation"]) .timer-dot{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .timer-value{min-width:38px!important;font-size:.86rem!important;}
  :where(body[data-page="voyance-consultation"]) .credit-val{font-size:.82rem!important;}
  :where(body[data-page="voyance-consultation"]) .btn-end,
  :where(body[data-page="voyance-consultation"]) .send-btn{width:36px!important;min-width:36px!important;height:36px!important;flex-basis:36px!important;}
  :where(body[data-page="voyance-consultation"]) .send-input{height:38px!important;min-height:38px!important;}
}

/* =========================================================
   PATCH MOBILE UNIVERSEL V3 — accordéon stable + chat full-fit
   Corrige disparition menu mobile Chrome/Firefox/Safari + petits écrans
   ========================================================= */
@media (max-width: 920px){
  #header-mount,
  #header-mount .topbar,
  #header-mount .container.topbar-inner{
    overflow: visible !important;
  }
  #header-mount .container.topbar-inner{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 44px!important;
    align-items:center!important;
    min-height:62px!important;
    height:auto!important;
    padding:10px clamp(14px,4vw,20px)!important;
    gap:10px!important;
  }
  #header-mount .brand{
    grid-column:1!important;
    min-width:0!important;
    width:auto!important;
  }
  #header-mount .mobile-menu-toggle{
    grid-column:2!important;
    display:inline-flex!important;
    position:relative!important;
    z-index:100003!important;
  }
  #header-mount .nav{
    grid-column:1 / -1!important;
    display:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:10px!important;
    padding:10px 0 6px!important;
    margin:0!important;
  }
  #header-mount.is-mobile-open .nav{
    display:flex!important;
    max-height:none!important;
    overflow:visible!important;
  }
  #header-mount .nav-links,
  #header-mount .nav-right,
  #header-mount .nav-auth{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:8px!important;
    margin:0!important;
    overflow:visible!important;
  }
  #header-mount .dropdown,
  #header-mount .account-dropdown{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    position:relative!important;
    overflow:visible!important;
  }
  #header-mount .nav-dd-toggle:not(.account-toggle),
  #header-mount .account-toggle,
  #header-mount .btn,
  #header-mount .nav-credit-pill{
    width:100%!important;
    max-width:100%!important;
    min-height:42px!important;
    justify-content:space-between!important;
    text-align:left!important;
  }
  #header-mount .dropdown-menu,
  #header-mount .account-menu{
    position:static!important;
    display:none!important;
    visibility:hidden!important;
    opacity:1!important;
    pointer-events:none!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    max-height:none!important;
    overflow:visible!important;
    margin:6px 0 0!important;
    padding:8px!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    inset:auto!important;
    transform:none!important;
    box-shadow:none!important;
    border-radius:16px!important;
    background:rgba(255,255,255,.78)!important;
    border:1px solid rgba(120,95,133,.12)!important;
  }
  #header-mount .dropdown.is-open > .dropdown-menu,
  #header-mount .dropdown.is-open > .account-menu,
  #header-mount .dropdown-menu.is-open,
  #header-mount .account-menu.is-open{
    display:block!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
  #header-mount .dropdown:not(.is-open) > .dropdown-menu,
  #header-mount .dropdown:not(.is-open) > .account-menu,
  #header-mount .dropdown:hover:not(.is-open) > .dropdown-menu,
  #header-mount .dropdown:hover:not(.is-open) > .account-menu{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  #header-mount .dropdown-menu::before,
  #header-mount .account-menu::before{display:none!important;}
  #header-mount .dropdown-menu a,
  #header-mount .dropdown-disabled,
  #header-mount .dropdown-logout{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  #header-mount [hidden]:not(.is-open){display:none!important;}
}

/* Chat consultation : la fenêtre doit toujours rentrer dans le viewport mobile */
html:has(body[data-page="voyance-consultation"]),
body[data-page="voyance-consultation"]{
  width:100%!important;
  max-width:100%!important;
  height:var(--cvh, var(--app-vh, 100dvh))!important;
  min-height:var(--cvh, var(--app-vh, 100dvh))!important;
  max-height:var(--cvh, var(--app-vh, 100dvh))!important;
  overflow:hidden!important;
  position:fixed!important;
  inset:0!important;
}
:where(body[data-page="voyance-consultation"]) .consult-layout{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  max-width:100%!important;
  height:var(--cvh, var(--app-vh, 100dvh))!important;
  max-height:var(--cvh, var(--app-vh, 100dvh))!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .consult-topbar{
  min-width:0!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  min-height:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto 40px!important;
  align-items:center!important;
  gap:clamp(3px,1.2vw,7px)!important;
  padding:6px clamp(5px,2vw,10px)!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-left,
:where(body[data-page="voyance-consultation"]) .consult-topbar > div:nth-child(2),
:where(body[data-page="voyance-consultation"]) .topbar-right{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-left{display:flex!important;}
:where(body[data-page="voyance-consultation"]) .consult-logo{display:none!important;}
:where(body[data-page="voyance-consultation"]) .topbar-voyant{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  height:38px!important;
  padding:4px 7px!important;
}
:where(body[data-page="voyance-consultation"]) .topbar-avatar{width:28px!important;height:28px!important;}
:where(body[data-page="voyance-consultation"]) .topbar-voyant-info span{display:none!important;}
:where(body[data-page="voyance-consultation"]) .topbar-voyant-info strong{
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
:where(body[data-page="voyance-consultation"]) .consult-topbar > div:nth-child(2){
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
}
:where(body[data-page="voyance-consultation"]) .consult-timer{height:38px!important;padding:4px 8px!important;}
:where(body[data-page="voyance-consultation"]) .timer-value{font-size:.88rem!important;min-width:38px!important;}
:where(body[data-page="voyance-consultation"]) .credits-counter{font-size:.78rem!important;gap:2px!important;}
:where(body[data-page="voyance-consultation"]) .credits-counter span:first-child,
:where(body[data-page="voyance-consultation"]) .credits-counter span:last-child{display:none!important;}
:where(body[data-page="voyance-consultation"]) .credit-val{font-size:.86rem!important;}
:where(body[data-page="voyance-consultation"]) .btn-end{
  width:38px!important;
  min-width:38px!important;
  max-width:38px!important;
  height:38px!important;
  padding:0!important;
  font-size:0!important;
  display:grid!important;
  place-items:center!important;
}
:where(body[data-page="voyance-consultation"]) .btn-end::before{content:"✕";font-size:17px!important;line-height:1!important;}
:where(body[data-page="voyance-consultation"]) .chat-area{min-width:0!important;min-height:0!important;height:100%!important;overflow:hidden!important;}
:where(body[data-page="voyance-consultation"]) .messages-wrap{min-height:0!important;height:100%!important;max-height:100%!important;overflow-y:auto!important;padding:8px!important;}
:where(body[data-page="voyance-consultation"]) .send-bar{
  width:100%!important;max-width:100%!important;min-width:0!important;height:auto!important;min-height:0!important;
  padding:7px 8px max(7px, env(safe-area-inset-bottom,0px))!important;gap:7px!important;overflow:hidden!important;
}
:where(body[data-page="voyance-consultation"]) .send-input-wrap{min-width:0!important;flex:1 1 auto!important;}
:where(body[data-page="voyance-consultation"]) .send-input{height:38px!important;min-height:38px!important;max-height:54px!important;font-size:16px!important;padding:8px 11px!important;}
:where(body[data-page="voyance-consultation"]) .send-btn{width:38px!important;min-width:38px!important;height:38px!important;flex:0 0 38px!important;}
@media (max-width:360px){
  :where(body[data-page="voyance-consultation"]) .consult-topbar{grid-template-columns:minmax(0,1fr) auto 34px!important;padding-left:4px!important;padding-right:4px!important;gap:3px!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-avatar{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .topbar-voyant{height:34px!important;padding:3px 6px!important;}
  :where(body[data-page="voyance-consultation"]) .consult-timer{height:34px!important;padding:3px 6px!important;}
  :where(body[data-page="voyance-consultation"]) .timer-dot{display:none!important;}
  :where(body[data-page="voyance-consultation"]) .timer-value{font-size:.82rem!important;min-width:34px!important;}
  :where(body[data-page="voyance-consultation"]) .credit-val{font-size:.78rem!important;}
  :where(body[data-page="voyance-consultation"]) .btn-end,
  :where(body[data-page="voyance-consultation"]) .send-btn{width:34px!important;min-width:34px!important;height:34px!important;flex-basis:34px!important;}
  :where(body[data-page="voyance-consultation"]) .send-input{height:36px!important;min-height:36px!important;}
}

/* ============================================================
   PATCH V4 — Consultation chat mobile universelle
   Objectif: faire rentrer toute la fenêtre de consultation dans
   la zone visible iPhone/Android, y compris Safari avec barre basse.
   ============================================================ */
@supports (height: 100dvh) {
  body:where([data-page="voyance-consultation"]) .consult-layout{
    height:100dvh;
    max-height:100dvh;
  }
}
body:where([data-page="voyance-consultation"]){
  width:100%;
  min-width:0;
  overscroll-behavior:none;
}
body:where([data-page="voyance-consultation"]) .consult-layout{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:hidden;
}
@media (max-width: 860px){
  html:has(body[data-page="voyance-consultation"]),
  body:where([data-page="voyance-consultation"]){
    height:var(--cvh, 100dvh)!important;
    max-height:var(--cvh, 100dvh)!important;
    overflow:hidden!important;
    position:fixed;
    inset:0;
  }
  body:where([data-page="voyance-consultation"]) .consult-layout{
    position:fixed!important;
    inset:0!important;
    height:var(--cvh, 100dvh)!important;
    max-height:var(--cvh, 100dvh)!important;
    width:100vw!important;
    max-width:100vw!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:minmax(54px, auto) minmax(0, 1fr) auto!important;
    overflow:hidden!important;
    padding:0!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-topbar{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
    min-height:54px!important;
    height:auto!important;
    padding:7px max(10px, env(safe-area-inset-left)) 7px max(10px, env(safe-area-inset-left))!important;
    gap:6px!important;
    flex-wrap:nowrap!important;
    overflow:hidden!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-left{
    min-width:0!important;
    flex:1 1 auto!important;
    gap:8px!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-logo{
    flex:0 0 auto!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-logo .logo-orb{
    width:30px!important;
    height:30px!important;
    font-size:12px!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-voyant{
    min-width:0!important;
    flex:1 1 auto!important;
    height:42px!important;
    padding:5px 9px!important;
    gap:8px!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-avatar{
    width:30px!important;
    height:30px!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-voyant-info{
    min-width:0!important;
    overflow:hidden!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-voyant-info strong{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:.82rem!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-topbar > div[style]{
    flex:0 0 auto!important;
    gap:5px!important;
    min-width:0!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-timer{
    height:42px!important;
    padding:5px 9px!important;
    gap:6px!important;
  }
  body:where([data-page="voyance-consultation"]) .timer-value{
    min-width:43px!important;
    font-size:.94rem!important;
    letter-spacing:.02em!important;
  }
  body:where([data-page="voyance-consultation"]) .credits-counter{
    gap:3px!important;
    font-size:.78rem!important;
    white-space:nowrap!important;
  }
  body:where([data-page="voyance-consultation"]) .credits-counter span:last-child{
    display:none!important;
  }
  body:where([data-page="voyance-consultation"]) .credit-val{
    font-size:.92rem!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-right{
    flex:0 0 auto!important;
  }
  body:where([data-page="voyance-consultation"]) .btn-end{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    overflow:hidden!important;
    white-space:nowrap!important;
    text-indent:-999px!important;
    position:relative!important;
    border-radius:999px!important;
  }
  body:where([data-page="voyance-consultation"]) .btn-end::after{
    content:'×';
    position:absolute;
    inset:0;
    display:grid;
    place-items:center;
    text-indent:0;
    font-size:1.55rem;
    line-height:1;
    font-weight:500;
  }
  body:where([data-page="voyance-consultation"]) .chat-area{
    grid-column:1!important;
    grid-row:2!important;
    min-height:0!important;
    height:auto!important;
    overflow:hidden!important;
  }
  body:where([data-page="voyance-consultation"]) .messages-wrap{
    min-height:0!important;
    height:100%!important;
    padding:12px 12px 10px!important;
    gap:10px!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body:where([data-page="voyance-consultation"]) .typing-indicator{
    padding:0 12px 8px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-bar{
    grid-column:1!important;
    grid-row:3!important;
    width:100%!important;
    max-width:100vw!important;
    min-width:0!important;
    min-height:64px!important;
    height:auto!important;
    box-sizing:border-box!important;
    padding:9px max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left))!important;
    gap:8px!important;
    align-items:center!important;
    overflow:visible!important;
    background:rgba(26,18,40,.98)!important;
    border-top:1px solid rgba(120,90,160,.22)!important;
    z-index:20!important;
  }
  body:where([data-page="voyance-consultation"]) .send-input-wrap{
    min-width:0!important;
    flex:1 1 auto!important;
  }
  body:where([data-page="voyance-consultation"]) .send-input{
    min-height:46px!important;
    max-height:92px!important;
    padding:13px 16px!important;
    font-size:16px!important;
    line-height:1.25!important;
  }
  body:where([data-page="voyance-consultation"]) .send-btn{
    width:46px!important;
    height:46px!important;
    min-width:46px!important;
    flex:0 0 46px!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-sidebar{
    display:none!important;
  }
}
@media (max-width: 380px){
  body:where([data-page="voyance-consultation"]) .consult-topbar{
    padding-left:8px!important;
    padding-right:8px!important;
    gap:4px!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-logo .logo-orb{
    width:26px!important;
    height:26px!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-voyant{
    height:38px!important;
    padding:4px 7px!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-avatar{
    width:28px!important;
    height:28px!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-timer{
    height:38px!important;
    padding:4px 7px!important;
  }
  body:where([data-page="voyance-consultation"]) .timer-value{
    min-width:39px!important;
    font-size:.86rem!important;
  }
  body:where([data-page="voyance-consultation"]) .credits-counter{
    font-size:.72rem!important;
  }
  body:where([data-page="voyance-consultation"]) .btn-end{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-bar{
    min-height:58px!important;
    padding-top:7px!important;
    gap:6px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-input{
    min-height:42px!important;
    padding:11px 14px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-btn{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    flex-basis:42px!important;
  }
}

/* ============================================================
   PATCH V5 FINAL CLEAN — Chat consultation mobile universel
   Ajuste la topbar + barre d'envoi pour petits et grands mobiles.
   Couvre iPhone SE -> iPhone 16 Pro Max + Android Chrome/Firefox/Safari.
   ============================================================ */
@media (max-width: 860px){
  body:where([data-page="voyance-consultation"]) .consult-layout{
    grid-template-rows:minmax(56px, auto) minmax(0, 1fr) auto!important;
    background:#130c20!important;
  }

  body:where([data-page="voyance-consultation"]) .consult-topbar{
    width:100%!important;
    max-width:100vw!important;
    box-sizing:border-box!important;
    align-items:center!important;
    padding-top:7px!important;
    padding-bottom:7px!important;
  }

  body:where([data-page="voyance-consultation"]) .topbar-voyant{
    border-radius:999px!important;
  }

  body:where([data-page="voyance-consultation"]) .chat-area{
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
  }

  body:where([data-page="voyance-consultation"]) .messages-wrap{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    padding-bottom:14px!important;
  }

  body:where([data-page="voyance-consultation"]) .send-bar{
    flex:0 0 auto!important;
    min-height:66px!important;
    padding:9px max(12px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left))!important;
    gap:10px!important;
  }

  body:where([data-page="voyance-consultation"]) .send-input-wrap{
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:none!important;
  }

  body:where([data-page="voyance-consultation"]) .send-input{
    width:100%!important;
    min-height:48px!important;
    height:48px!important;
    max-height:96px!important;
    padding:13px 16px!important;
    border-radius:999px!important;
    box-sizing:border-box!important;
  }

  body:where([data-page="voyance-consultation"]) .send-btn{
    width:48px!important;
    min-width:48px!important;
    height:48px!important;
    flex:0 0 48px!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    margin:0!important;
  }
}

/* Topbar en deux lignes uniquement quand la largeur devient trop serrée. */
@media (max-width: 390px){
  body:where([data-page="voyance-consultation"]) .consult-layout{
    grid-template-rows:minmax(96px, auto) minmax(0, 1fr) auto!important;
  }

  body:where([data-page="voyance-consultation"]) .consult-topbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 40px!important;
    grid-template-rows:auto auto!important;
    gap:7px!important;
    padding:7px max(9px, env(safe-area-inset-right)) 7px max(9px, env(safe-area-inset-left))!important;
  }

  body:where([data-page="voyance-consultation"]) .topbar-left{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
    width:100%!important;
    display:flex!important;
  }

  body:where([data-page="voyance-consultation"]) .consult-logo{
    display:none!important;
  }

  body:where([data-page="voyance-consultation"]) .topbar-voyant{
    width:100%!important;
    max-width:100%!important;
    height:40px!important;
  }

  body:where([data-page="voyance-consultation"]) .consult-topbar > div[style]{
    grid-column:1 / -1!important;
    grid-row:2!important;
    width:100%!important;
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    align-items:center!important;
    gap:8px!important;
  }

  body:where([data-page="voyance-consultation"]) .consult-timer{
    height:38px!important;
    justify-content:center!important;
  }

  body:where([data-page="voyance-consultation"]) .credits-counter{
    justify-content:end!important;
    min-width:0!important;
  }

  body:where([data-page="voyance-consultation"]) .topbar-right{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
  }

  body:where([data-page="voyance-consultation"]) .btn-end{
    width:40px!important;
    min-width:40px!important;
    height:40px!important;
  }

  body:where([data-page="voyance-consultation"]) .send-bar{
    min-height:64px!important;
    padding-left:10px!important;
    padding-right:10px!important;
    gap:8px!important;
  }

  body:where([data-page="voyance-consultation"]) .send-input{
    min-height:46px!important;
    height:46px!important;
  }

  body:where([data-page="voyance-consultation"]) .send-btn{
    width:46px!important;
    min-width:46px!important;
    height:46px!important;
    flex-basis:46px!important;
  }
}

@media (max-width: 340px){
  body:where([data-page="voyance-consultation"]) .consult-layout{
    grid-template-rows:minmax(90px, auto) minmax(0, 1fr) auto!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-voyant-info strong{
    font-size:.78rem!important;
  }
  body:where([data-page="voyance-consultation"]) .topbar-avatar{
    width:26px!important;
    height:26px!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-timer,
  body:where([data-page="voyance-consultation"]) .btn-end{
    height:36px!important;
  }
  body:where([data-page="voyance-consultation"]) .btn-end{
    width:36px!important;
    min-width:36px!important;
  }
  body:where([data-page="voyance-consultation"]) .timer-value,
  body:where([data-page="voyance-consultation"]) .credit-val{
    font-size:.78rem!important;
  }
  body:where([data-page="voyance-consultation"]) .send-input{
    min-height:42px!important;
    height:42px!important;
    padding:10px 13px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-btn{
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    flex-basis:42px!important;
  }
}

/* ============================================================
   PATCH V6 PREMIUM UX — Consultation chat mobile type app native
   - clavier iOS/Android mieux géré via --cvh
   - barre d'envoi toujours visible
   - auto-scroll propre + zones cliquables confortables
   ============================================================ */
@media (max-width: 860px){
  html:has(body[data-page="voyance-consultation"]),
  body[data-page="voyance-consultation"]{
    width:100%!important;
    max-width:100%!important;
    min-height:var(--cvh, 100dvh)!important;
    height:var(--cvh, 100dvh)!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
    -webkit-text-size-adjust:100%!important;
    touch-action:manipulation!important;
  }

  body:where([data-page="voyance-consultation"]) .consult-layout{
    width:100vw!important;
    max-width:100vw!important;
    min-height:var(--cvh, 100dvh)!important;
    height:var(--cvh, 100dvh)!important;
    max-height:var(--cvh, 100dvh)!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto minmax(0, 1fr) auto!important;
    padding:0!important;
    box-sizing:border-box!important;
    position:fixed!important;
    inset:0!important;
  }

  body:where([data-page="voyance-consultation"]) .consult-topbar{
    flex:0 0 auto!important;
    z-index:30!important;
    min-height:56px!important;
    max-height:106px!important;
    overflow:hidden!important;
    -webkit-backdrop-filter:blur(18px)!important;
    backdrop-filter:blur(18px)!important;
  }

  body:where([data-page="voyance-consultation"]) .chat-area{
    grid-row:2!important;
    min-height:0!important;
    height:100%!important;
    max-height:100%!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    padding-bottom:0!important;
  }

  body:where([data-page="voyance-consultation"]) .low-credits-banner{
    flex:0 0 auto!important;
    margin:8px 10px 0!important;
    max-width:calc(100vw - 20px)!important;
    box-sizing:border-box!important;
  }

  body:where([data-page="voyance-consultation"]) .messages-wrap{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    padding:14px 12px 16px!important;
    scroll-padding-bottom:18px!important;
    box-sizing:border-box!important;
  }

  body:where([data-page="voyance-consultation"]) .typing-indicator{
    flex:0 0 auto!important;
    padding:0 12px 8px!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }

  body:where([data-page="voyance-consultation"]) .send-bar{
    grid-row:3!important;
    flex:0 0 auto!important;
    width:100%!important;
    max-width:100vw!important;
    min-height:66px!important;
    max-height:118px!important;
    padding:9px max(12px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left))!important;
    display:flex!important;
    align-items:flex-end!important;
    gap:10px!important;
    box-sizing:border-box!important;
    z-index:40!important;
    position:relative!important;
    -webkit-backdrop-filter:blur(18px)!important;
    backdrop-filter:blur(18px)!important;
  }

  body:where([data-page="voyance-consultation"]) .send-input-wrap{
    flex:1 1 auto!important;
    min-width:0!important;
    display:flex!important;
    align-items:flex-end!important;
  }

  body:where([data-page="voyance-consultation"]) .send-input{
    width:100%!important;
    min-width:0!important;
    min-height:48px!important;
    height:48px!important;
    max-height:96px!important;
    padding:13px 16px!important;
    font-size:16px!important;
    line-height:1.25!important;
    resize:none!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    border-radius:24px!important;
  }

  body:where([data-page="voyance-consultation"]) .send-input:focus{
    outline:2px solid rgba(232,208,168,.25)!important;
    outline-offset:2px!important;
  }

  body:where([data-page="voyance-consultation"]) .send-btn{
    width:50px!important;
    min-width:50px!important;
    height:50px!important;
    flex:0 0 50px!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    font-size:1.05rem!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
    transition:transform .14s ease, opacity .14s ease, box-shadow .14s ease!important;
  }

  body:where([data-page="voyance-consultation"]) .send-btn:not(:disabled):active{
    transform:scale(.94)!important;
  }

  body:where([data-page="voyance-consultation"]) .send-btn:disabled{
    opacity:.42!important;
    filter:saturate(.65)!important;
  }

  body:where([data-page="voyance-consultation"]) .msg,
  body:where([data-page="voyance-consultation"]) .msg-bubble{
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
}

@media (max-width: 390px){
  body:where([data-page="voyance-consultation"]) .consult-layout{
    grid-template-rows:auto minmax(0, 1fr) auto!important;
  }
  body:where([data-page="voyance-consultation"]) .messages-wrap{
    padding:12px 9px 14px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-bar{
    min-height:62px!important;
    padding-left:max(9px, env(safe-area-inset-left))!important;
    padding-right:max(9px, env(safe-area-inset-right))!important;
    gap:8px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-input{
    min-height:46px!important;
    height:46px!important;
    max-height:86px!important;
    padding:12px 14px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-btn{
    width:46px!important;
    min-width:46px!important;
    height:46px!important;
    flex-basis:46px!important;
  }
}

@media (max-width: 340px){
  body:where([data-page="voyance-consultation"]) .send-bar{
    min-height:58px!important;
    gap:7px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-input{
    min-height:42px!important;
    height:42px!important;
    max-height:78px!important;
    padding:10px 12px!important;
  }
  body:where([data-page="voyance-consultation"]) .send-btn{
    width:42px!important;
    min-width:42px!important;
    height:42px!important;
    flex-basis:42px!important;
  }
}

/* ============================================================
   PATCH V9 — iPhone 13 / Safari iOS clavier consultation
   Stabilise la fenêtre chat dans le viewport visuel réel.
   ============================================================ */
@media (max-width: 860px){
  html:has(body[data-page="voyance-consultation"]),
  body[data-page="voyance-consultation"]{
    width:100%!important;max-width:100%!important;height:100%!important;min-height:100%!important;
    overflow:hidden!important;position:fixed!important;inset:0!important;overscroll-behavior:none!important;
    -webkit-overflow-scrolling:auto!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-layout{
    position:fixed!important;left:var(--cvoffset-left,0px)!important;top:var(--cvoffset-top,0px)!important;
    width:var(--cvw,100vw)!important;max-width:var(--cvw,100vw)!important;
    height:var(--cvh,100dvh)!important;min-height:var(--cvh,100dvh)!important;max-height:var(--cvh,100dvh)!important;
    overflow:hidden!important;display:grid!important;grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto minmax(0,1fr) auto!important;transform:translate3d(0,0,0)!important;
    contain:layout size style!important;padding:0!important;box-sizing:border-box!important;
  }
  body:where([data-page="voyance-consultation"]) .consult-topbar{grid-row:1!important;min-height:48px!important;max-height:76px!important;overflow:hidden!important;flex-wrap:nowrap!important;}
  body:where([data-page="voyance-consultation"]) .chat-area{grid-row:2!important;min-height:0!important;height:100%!important;max-height:100%!important;overflow:hidden!important;display:flex!important;flex-direction:column!important;}
  body:where([data-page="voyance-consultation"]) .messages-wrap{flex:1 1 auto!important;min-height:0!important;height:auto!important;max-height:none!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior:contain!important;padding-bottom:12px!important;}
  body:where([data-page="voyance-consultation"]) .send-bar{grid-row:3!important;position:relative!important;bottom:auto!important;left:auto!important;right:auto!important;width:100%!important;max-width:100%!important;min-height:60px!important;flex:0 0 auto!important;display:flex!important;align-items:flex-end!important;gap:8px!important;padding:8px max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important;box-sizing:border-box!important;z-index:80!important;}
  body:where([data-page="voyance-consultation"]) .send-input-wrap{min-width:0!important;flex:1 1 auto!important;}
  body:where([data-page="voyance-consultation"]) .send-input{font-size:16px!important;min-height:44px!important;height:44px!important;max-height:78px!important;line-height:1.25!important;padding:11px 13px!important;border-radius:22px!important;}
  body:where([data-page="voyance-consultation"]) .send-btn{width:44px!important;min-width:44px!important;height:44px!important;flex:0 0 44px!important;}
  body:where([data-page="voyance-consultation"].cv-keyboard-open) .consult-topbar{min-height:42px!important;max-height:50px!important;padding-top:4px!important;padding-bottom:4px!important;}
  body:where([data-page="voyance-consultation"].cv-keyboard-open) .topbar-avatar{width:28px!important;height:28px!important;}
  body:where([data-page="voyance-consultation"].cv-keyboard-open) .topbar-voyant{height:34px!important;min-height:34px!important;}
  body:where([data-page="voyance-consultation"].cv-keyboard-open) .consult-timer{height:34px!important;min-height:34px!important;}
  body:where([data-page="voyance-consultation"].cv-keyboard-open) .credits-counter{font-size:.78rem!important;}
  body:where([data-page="voyance-consultation"].cv-keyboard-open) .btn-end{width:36px!important;height:36px!important;min-width:36px!important;}
  body:where([data-page="voyance-consultation"].cv-keyboard-open) .messages-wrap{padding-top:8px!important;padding-bottom:8px!important;}
  body:where([data-page="voyance-consultation"].cv-keyboard-open) .send-bar{min-height:54px!important;padding-top:5px!important;padding-bottom:5px!important;}
}
@media (max-width: 390px){
  body:where([data-page="voyance-consultation"]) .send-input{min-height:42px!important;height:42px!important;max-height:72px!important;}
  body:where([data-page="voyance-consultation"]) .send-btn{width:42px!important;min-width:42px!important;height:42px!important;flex-basis:42px!important;}
}

/* =========================================================
   V14 — Espace voyant mobile propre
   Corrige dashboard cabinet sur mobile/tablette :
   - sidebar en drawer stable avec bouton menu
   - contenu qui ne passe plus sous la sidebar
   - cartes compactes et grilles utilisables sur 360-430px
   ========================================================= */

body[data-page^="cabinet-"]{
  overflow-x:hidden!important;
  background:var(--bg)!important;
}
body[data-page^="cabinet-"] .dashboard-layout{
  width:100%!important;
  max-width:100vw!important;
  min-width:0!important;
}
body[data-page^="cabinet-"] .dashboard-main{
  min-width:0!important;
  width:auto!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
body[data-page^="cabinet-"] .dash-content,
body[data-page^="cabinet-"] .dash-topbar{
  box-sizing:border-box!important;
  min-width:0!important;
  max-width:100%!important;
}
body[data-page^="cabinet-"] .stats-grid,
body[data-page^="cabinet-"] .dash-content [style*="grid-template-columns"]{
  min-width:0!important;
}
body[data-page^="cabinet-"] .dash-block,
body[data-page^="cabinet-"] .stat-card,
body[data-page^="cabinet-"] .pending-item,
body[data-page^="cabinet-"] .consult-row,
body[data-page^="cabinet-"] .avis-row,
body[data-page^="cabinet-"] .revenue-card,
body[data-page^="cabinet-"] .profile-card{
  min-width:0!important;
  box-sizing:border-box!important;
}
body[data-page^="cabinet-"] .dash-block-header,
body[data-page^="cabinet-"] .pending-item,
body[data-page^="cabinet-"] .consult-row{
  min-width:0!important;
}
body[data-page^="cabinet-"] .pending-info,
body[data-page^="cabinet-"] .c-info{
  min-width:0!important;
}

@media (max-width: 920px){
  body[data-page^="cabinet-"] .dashboard-main{
    margin-left:0!important;
    width:100%!important;
    max-width:100vw!important;
    overflow-x:hidden!important;
  }
  body[data-page^="cabinet-"] .dash-topbar{
    position:sticky!important;
    top:0!important;
    z-index:20!important;
    min-height:64px!important;
    height:auto!important;
    padding:12px 14px 12px 64px!important;
    background:rgba(250,247,244,.96)!important;
    backdrop-filter:blur(14px)!important;
    -webkit-backdrop-filter:blur(14px)!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
  }
  body[data-page^="cabinet-"] .dash-topbar h1{
    font-size:clamp(1.15rem,5.6vw,1.8rem)!important;
    line-height:1.05!important;
    margin:0!important;
    word-break:normal!important;
  }
  body[data-page^="cabinet-"] .dash-topbar .btn,
  body[data-page^="cabinet-"] .dash-topbar .btn-ghost{
    width:auto!important;
    max-width:48vw!important;
    padding:9px 12px!important;
    font-size:.76rem!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  body[data-page^="cabinet-"] .dash-content{
    width:100%!important;
    max-width:100vw!important;
    padding:16px 14px 34px!important;
    overflow-x:hidden!important;
  }
  body[data-page^="cabinet-"] .stats-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    margin-bottom:16px!important;
  }
  body[data-page^="cabinet-"] .stat-card{
    padding:16px!important;
    min-height:118px!important;
    border-radius:20px!important;
  }
  body[data-page^="cabinet-"] .stat-card .stat-icon{
    font-size:1rem!important;
    margin-bottom:14px!important;
  }
  body[data-page^="cabinet-"] .stat-card .stat-val{
    font-size:clamp(1.35rem,6vw,1.75rem)!important;
    line-height:1!important;
  }
  body[data-page^="cabinet-"] .stat-card .stat-lbl{
    font-size:.72rem!important;
    line-height:1.25!important;
  }
  body[data-page^="cabinet-"] .dash-content [style*="grid-template-columns"]{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
    margin-bottom:14px!important;
  }
  body[data-page^="cabinet-"] .dash-block{
    padding:18px!important;
    border-radius:22px!important;
    margin-bottom:14px!important;
  }
  body[data-page^="cabinet-"] .dash-block-header{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    margin-bottom:14px!important;
  }
  body[data-page^="cabinet-"] .dash-block-header h3{
    font-size:.94rem!important;
    line-height:1.25!important;
  }
  body[data-page^="cabinet-"] .pending-item{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    gap:12px!important;
    align-items:center!important;
    padding:14px!important;
  }
  body[data-page^="cabinet-"] .pending-badge,
  body[data-page^="cabinet-"] .btn-repondre{
    grid-column:2!important;
    width:max-content!important;
    max-width:100%!important;
    margin-top:4px!important;
  }
  body[data-page^="cabinet-"] .revenu-day{
    gap:8px!important;
  }
  body[data-page^="cabinet-"] .revenu-day .amount{
    min-width:42px!important;
    font-size:.78rem!important;
  }
  body[data-page^="cabinet-"] .consult-row{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) auto!important;
    gap:10px!important;
    align-items:center!important;
  }
  body[data-page^="cabinet-"] .consult-row .c-info strong,
  body[data-page^="cabinet-"] .consult-row .c-info span{
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
}

@media (max-width: 520px){
  body[data-page^="cabinet-"] .dash-topbar{
    padding:10px 12px 10px 60px!important;
  }
  body[data-page^="cabinet-"] .dash-topbar > div{
    min-width:0!important;
  }
  body[data-page^="cabinet-"] .dash-topbar > div:first-child{
    flex:1 1 auto!important;
  }
  body[data-page^="cabinet-"] .dash-topbar > div:last-child{
    flex:0 1 auto!important;
  }
  body[data-page^="cabinet-"] .dash-topbar .btn,
  body[data-page^="cabinet-"] .dash-topbar .btn-ghost{
    max-width:150px!important;
    padding:8px 10px!important;
    border-radius:999px!important;
  }
  body[data-page^="cabinet-"] .dash-content{
    padding:14px 12px 30px!important;
  }
  body[data-page^="cabinet-"] .stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  body[data-page^="cabinet-"] .stat-card{
    padding:14px!important;
    min-height:108px!important;
  }
  body[data-page^="cabinet-"] .dash-block{
    padding:16px!important;
    border-radius:20px!important;
  }
  body[data-page^="cabinet-"] .pending-item{
    grid-template-columns:36px minmax(0,1fr)!important;
    padding:12px!important;
  }
  body[data-page^="cabinet-"] .pending-avatar,
  body[data-page^="cabinet-"] .consult-row .c-avatar{
    width:36px!important;
    height:36px!important;
  }
}

@media (max-width: 370px){
  body[data-page^="cabinet-"] .stats-grid{
    grid-template-columns:1fr!important;
  }
  body[data-page^="cabinet-"] .dash-topbar .btn,
  body[data-page^="cabinet-"] .dash-topbar .btn-ghost{
    max-width:126px!important;
    font-size:.7rem!important;
  }
}


/* === V15 Mes réponses client === */
.v15-dashboard-replies{margin:24px auto;max-width:1120px;}
.v15-dashboard-reply-card{text-decoration:none;color:inherit;}
.v15-replies-page{max-width:1120px;margin-inline:auto;}
.v15-replies-hero{align-items:center;}
.v15-replies-panel{margin-top:24px;}
.v15-replies-list{display:flex;flex-direction:column;gap:14px;}
.v15-reply-card{display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:18px;border:1px solid var(--line);border-radius:24px;background:var(--surface);box-shadow:var(--shadow-sm);}
.v15-reply-main{min-width:0;}
.v15-reply-title{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px;}
.v15-reply-title strong{font-size:1rem;color:var(--text);}
.v15-reply-main p{font-size:.9rem;line-height:1.6;color:var(--text-soft);margin:0 0 8px;}
.v15-reply-main span:not(.v15-new-badge){font-size:.78rem;color:var(--text-xsoft);}
.v15-new-badge{display:inline-flex;align-items:center;padding:4px 9px;border-radius:999px;background:linear-gradient(135deg,rgba(196,174,224,.25),rgba(237,215,176,.22));color:#5a4070;font-size:.72rem;font-weight:700;}
.v15-reply-btn{white-space:nowrap;justify-content:center;padding:10px 16px!important;font-size:.84rem!important;}
@media(max-width:768px){.v15-dashboard-replies{margin:18px 16px;}.v15-reply-card{grid-template-columns:auto 1fr;gap:12px;padding:16px;border-radius:20px;}.v15-reply-btn{grid-column:1 / -1;width:100%;}.v15-replies-hero{gap:16px;}}
@media(max-width:420px){.v15-replies-page{padding-inline:14px!important;}.v15-replies-hero h2{font-size:2rem!important;}.v15-reply-main p{font-size:.85rem;}}

/* =========================================================
   V17 — Cabinet Android/mobile menu visible + dashboard compact
   ========================================================= */
@media (max-width: 920px){
  body[data-page^="cabinet-"] #cabinetSidebarMount{display:block!important;position:relative!important;z-index:2147483647!important;}
  body[data-page^="cabinet-"] .cabinet-mobile-menu-btn{display:flex!important;visibility:visible!important;opacity:1!important;position:fixed!important;top:max(12px, env(safe-area-inset-top))!important;left:max(12px, env(safe-area-inset-left))!important;width:46px!important;height:46px!important;z-index:2147483647!important;background:rgba(255,255,255,.98)!important;color:#3d2e4a!important;border:1px solid rgba(155,126,200,.24)!important;border-radius:999px!important;box-shadow:0 10px 26px rgba(40,25,60,.20)!important;}
  body[data-page^="cabinet-"] .sidebar{display:flex!important;position:fixed!important;left:0!important;top:0!important;bottom:0!important;width:min(86vw,292px)!important;height:100dvh!important;max-height:100dvh!important;z-index:2147483646!important;}
  body[data-page^="cabinet-"] .sidebar:not(.open){transform:translateX(-105%)!important;}
  body[data-page^="cabinet-"] .sidebar.open{transform:translateX(0)!important;}
  body[data-page^="cabinet-"] .sidebar-overlay{z-index:2147483645!important;}
  body[data-page^="cabinet-"] .dashboard-main{margin-left:0!important;width:100%!important;max-width:100vw!important;}
  body[data-page^="cabinet-"] .dash-topbar{padding:14px 14px 12px 72px!important;min-height:68px!important;align-items:flex-start!important;}
  body[data-page^="cabinet-"] .dash-topbar h1{font-size:clamp(1.28rem,7.2vw,2rem)!important;line-height:.98!important;max-width:52vw!important;overflow-wrap:anywhere!important;}
  body[data-page^="cabinet-"] .dash-topbar .btn, body[data-page^="cabinet-"] .dash-topbar .btn-ghost{max-width:150px!important;font-size:.74rem!important;padding:9px 12px!important;}
  body[data-page^="cabinet-"] .dash-content{padding:16px 14px 34px!important;}
  body[data-page^="cabinet-"] .stats-grid{grid-template-columns:1fr!important;gap:12px!important;}
  body[data-page^="cabinet-"] .stat-card{min-height:112px!important;padding:18px!important;border-radius:22px!important;}
  body[data-page^="cabinet-"] .stat-card .stat-val{font-size:1.55rem!important;}
}
@media (min-width: 921px){body[data-page^="cabinet-"] .cabinet-mobile-menu-btn{display:none!important;}}

/* === V22 - Accueil : étapes en 4 cards + slider mobile premium === */
.steps-grid.steps-premium-slider{grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}.steps-grid.steps-premium-slider::before{left:calc(12.5% + 24px);right:calc(12.5% + 24px)}.steps-premium-slider .step-card{min-height:190px}.steps-premium-slider .step-card h3{line-height:1.22}.steps-slider-controls{display:none}
@media(max-width:1024px){.steps-grid.steps-premium-slider{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.steps-mobile-shell{margin-left:-20px;margin-right:-20px}.steps-grid.steps-premium-slider{display:flex!important;grid-template-columns:none!important;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding:2px 20px 18px;scrollbar-width:none}.steps-grid.steps-premium-slider::-webkit-scrollbar{display:none}.steps-grid.steps-premium-slider::before{display:none!important}.steps-premium-slider .step-card{flex:0 0 min(84vw,330px);scroll-snap-align:center;min-height:205px;padding:24px 22px}.steps-slider-controls{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:4px}.steps-slider-btn{width:38px;height:38px;border-radius:999px;border:1px solid rgba(171,139,214,.28);background:rgba(255,255,255,.88);color:#6f4f91;box-shadow:0 10px 22px rgba(42,29,50,.08);font-size:1.45rem;line-height:1;display:grid;place-items:center}.steps-slider-btn:disabled{opacity:.35}.steps-slider-dots{display:flex;align-items:center;justify-content:center;gap:7px}.steps-dot{width:7px;height:7px;border:0;border-radius:999px;background:rgba(111,79,145,.22);padding:0}.steps-dot.active{width:22px;background:linear-gradient(135deg,#b994d6,#dfc08b)}}


/* TOPBAR V25 — menus Tendance + Blog */
#header-mount .nav-link{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:40px!important;padding:12px 0!important;color:#756579!important;font-family:var(--font-body,'DM Sans',Arial,sans-serif)!important;font-size:.84rem!important;font-weight:500!important;line-height:1!important;text-decoration:none!important;white-space:nowrap!important;position:relative!important;z-index:99993!important;transition:color .18s ease,transform .18s ease!important;}
#header-mount .nav-link::after{content:'';position:absolute;left:50%;right:50%;bottom:4px;height:2px;border-radius:999px;background:linear-gradient(135deg,#a986d5,#dfc4a6);opacity:0;transition:left .18s ease,right .18s ease,opacity .18s ease;}
#header-mount .nav-link:hover,#header-mount .nav-link.is-active,#header-mount .nav-link[aria-current="page"]{color:#3d3040!important;}
#header-mount .nav-link:hover::after,#header-mount .nav-link.is-active::after,#header-mount .nav-link[aria-current="page"]::after{left:0;right:0;opacity:1;}
#header-mount .nav-link:focus-visible{outline:2px solid rgba(155,126,200,.45)!important;outline-offset:5px!important;border-radius:999px!important;}
@media (max-width:1100px){#header-mount .brand{min-width:205px!important;}#header-mount .nav{gap:18px!important;}#header-mount .nav-links{gap:16px!important;}#header-mount .nav-dd-toggle,#header-mount .nav-link{font-size:.80rem!important;}}
@media (max-width:920px){#header-mount .nav-link{width:100%!important;justify-content:space-between!important;min-height:44px!important;padding:12px 14px!important;border-radius:14px!important;background:rgba(255,255,255,.66)!important;border:1px solid rgba(120,95,133,.10)!important;}#header-mount .nav-link::after{display:none!important;}#header-mount .nav-link.is-active,#header-mount .nav-link[aria-current="page"]{background:linear-gradient(135deg,rgba(232,220,248,.72),rgba(245,237,230,.82))!important;border-color:rgba(155,126,200,.22)!important;}}

/* Pages footer infos */
:where(body[data-page^="contenu-"]) .page-hero {
  background: linear-gradient(160deg, #fdf8f5 0%, #f5eef8 50%, #ede4f5 100%);
  padding: 96px 0 72px;
}
.info-page-wrap { padding: 54px 0 78px; }
.info-page-card { background: rgba(255,255,255,.72); border: 1px solid rgba(120,95,133,.10); border-radius: var(--radius-xl); box-shadow: var(--shadow-md); padding: clamp(24px,4vw,42px); }
.info-page-card h2 { margin: 0 0 14px; font-size: clamp(1.7rem,3vw,2.3rem); }
.info-page-card p, .info-page-card li { color: var(--text-soft); }
.info-page-card ul { margin: 18px 0 0 20px; }
.info-page-grid { display:grid; grid-template-columns: repeat(3,1fr); gap:18px; margin-top:24px; }
.info-mini-card { background:#fffaf7; border:1px solid rgba(120,95,133,.10); border-radius:22px; padding:20px; }
.info-mini-card h3 { font-family:var(--font-body); font-size:1rem; font-weight:800; margin-bottom:8px; }
@media (max-width: 860px){ .info-page-grid{grid-template-columns:1fr;} }

/* === V28 - Pages parrainage, compte prépayé et contact premium === */
.referral-hero-soft,.prepaid-hero,.contact-hero{background:linear-gradient(160deg,#fffaf7 0%,#f8f1fb 52%,#efe6f8 100%);padding:96px 0 56px;position:relative;overflow:hidden;}
.referral-banner{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:32px;align-items:center;min-height:310px;padding:clamp(28px,5vw,54px);border-radius:30px;overflow:hidden;background:radial-gradient(circle at 78% 20%,rgba(174,126,220,.42),transparent 28%),linear-gradient(135deg,#382354 0%,#6f4f91 48%,#d5b88d 125%);box-shadow:0 26px 70px rgba(64,38,88,.20);color:#fff;}
.referral-banner::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 18% 28%,rgba(255,255,255,.18),transparent 18%),radial-gradient(circle at 92% 78%,rgba(255,255,255,.16),transparent 20%);pointer-events:none;}
.referral-stars{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,.92) 0 1.4px,transparent 1.6px);background-size:42px 42px;opacity:.42;}
.referral-copy,.referral-rewards{position:relative;z-index:1;}
.referral-copy .eyebrow{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.24);color:#fff;}
.referral-copy h1{max-width:650px;margin:16px 0 14px;font-size:clamp(2.35rem,5vw,4.4rem);line-height:.96;color:#fff;}
.referral-copy p{max-width:560px;color:rgba(255,255,255,.84);font-size:1.04rem;}
.referral-rewards{display:flex;justify-content:center;align-items:center;gap:22px;flex-wrap:wrap;}
.reward-bubble{width:168px;height:168px;border-radius:999px;display:grid;place-items:center;text-align:center;background:rgba(255,255,255,.22);border:1px solid rgba(255,255,255,.22);box-shadow:0 18px 48px rgba(23,13,34,.18);backdrop-filter:blur(8px);}
.reward-bubble strong{display:block;font-size:clamp(2.2rem,5vw,3.3rem);line-height:1;color:#fff;}
.reward-bubble span{display:block;margin-top:8px;font-size:.82rem;font-weight:700;color:rgba(255,255,255,.9);}
.reward-bubble-alt{transform:translateY(-22px);background:rgba(192,151,229,.34);}
.referral-section{padding-top:42px;}
.referral-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:0 auto 24px;max-width:980px;}
.ref-step{position:relative;text-align:center;padding:26px 22px;border-radius:26px;background:rgba(255,255,255,.72);border:1px solid rgba(120,95,133,.10);box-shadow:0 16px 46px rgba(64,38,88,.08);}
.step-number{width:42px;height:42px;margin:-48px auto 18px;display:grid;place-items:center;border-radius:999px;background:#fff;color:#6f4f91;font-weight:900;box-shadow:0 12px 28px rgba(111,79,145,.13);}
.step-icon{font-size:2rem;color:#6f4f91;margin-bottom:12px;}
.ref-step h3,.referral-card h2,.prepaid-list-card h2,.prepaid-security-card h2,.contact-form-card h2,.contact-side-card h2{font-family:var(--font-body,'DM Sans',Arial,sans-serif);font-weight:800;color:#3d3040;}
.referral-cards-grid,.prepaid-content-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:24px;}
.referral-card,.referral-note,.prepaid-intro,.prepaid-list-card,.prepaid-security-card,.contact-side-card,.contact-form-card{background:rgba(255,255,255,.78);}
.soft-check-list{list-style:none!important;margin-left:0!important;padding-left:0!important;display:grid;gap:10px;}
.soft-check-list li{position:relative;padding-left:30px;}
.soft-check-list li::before{content:'✓';position:absolute;left:0;top:0;width:20px;height:20px;border-radius:999px;background:linear-gradient(135deg,#d9c3f2,#f1dfc0);color:#5e4676;display:grid;place-items:center;font-size:.74rem;font-weight:900;}
.prepaid-hero-card{max-width:850px;margin:0 auto;text-align:center;}
.prepaid-benefits .info-mini-card{background:linear-gradient(160deg,#fffaf7,#f5eef9);}
.prepaid-content-grid{align-items:stretch;}
.prepaid-security-card{margin-top:22px;}
.contact-layout{display:grid;grid-template-columns:minmax(250px,360px) 1fr;gap:24px;align-items:start;}
.contact-side-card{position:sticky;top:96px;}
.contact-mini-list{display:grid;gap:10px;margin-top:22px;}
.contact-mini-list span{display:flex;align-items:center;gap:8px;padding:12px 14px;border-radius:16px;background:linear-gradient(135deg,rgba(232,220,248,.68),rgba(255,250,247,.92));border:1px solid rgba(120,95,133,.10);font-weight:700;color:#5a4862;}
.celeste-contact-form{display:grid;gap:18px;margin-top:20px;}
.celeste-contact-form label{display:grid;gap:8px;font-weight:800;color:#3d3040;font-size:.94rem;}
.celeste-contact-form input,.celeste-contact-form select,.celeste-contact-form textarea{width:100%;border:1px solid rgba(120,95,133,.16);border-radius:18px;background:rgba(255,255,255,.88);padding:14px 15px;font:inherit;color:#3d3040;outline:none;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;}
.celeste-contact-form textarea{resize:vertical;min-height:160px;}
.celeste-contact-form input:focus,.celeste-contact-form select:focus,.celeste-contact-form textarea:focus{border-color:rgba(155,126,200,.58);box-shadow:0 0 0 4px rgba(155,126,200,.13);background:#fff;}
.form-row.two-cols{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.optional{font-weight:600;color:#8a7b8f;font-size:.78rem;}
.file-upload-field small{color:var(--text-soft);font-weight:500;}
.consent-line{display:flex!important;grid-template-columns:none!important;align-items:flex-start;gap:12px;font-weight:600!important;color:var(--text-soft)!important;}
.consent-line input{width:auto;margin-top:3px;}
@media (max-width:920px){.referral-banner{grid-template-columns:1fr;text-align:center}.referral-copy p{margin-left:auto;margin-right:auto}.reward-bubble-alt{transform:none}.referral-steps,.referral-cards-grid,.prepaid-content-grid,.contact-layout{grid-template-columns:1fr}.contact-side-card{position:relative;top:auto}.form-row.two-cols{grid-template-columns:1fr}.referral-rewards{justify-content:center}.reward-bubble{width:138px;height:138px}.referral-hero-soft,.prepaid-hero,.contact-hero{padding:74px 0 42px;}}

/* === FIX 2026-05-04 — accueil : numéros des étapes non coupés === */
.home-steps-v23 .step-card{
  position: relative !important;
  overflow: visible !important;
  padding-top: 28px !important;
}
.home-steps-v23 .step-number{
  position: relative !important;
  top: auto !important;
  left: auto !important;
  transform: none !important;
  width: 42px !important;
  height: 42px !important;
  margin: 0 auto 18px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: #fff !important;
  color: #7d5cad !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: 0 12px 26px rgba(111,79,145,.12) !important;
}
@media (max-width: 720px){
  .home-steps-v23 .step-card{padding-top: 28px !important;}
  .home-steps-v23 .step-number{
    width: 38px !important;
    height: 38px !important;
    margin: 0 auto 16px !important;
    font-size: 1.08rem !important;
  }
}

/* =========================================================
   BLOC GLOBAL "À DÉCOUVRIR AUSSI"
   ---------------------------------------------------------
   Style commun pour toutes les pages qui utilisent :
   <section class="related-links" aria-label="À découvrir aussi">
   ========================================================= */
.related-links {
  max-width: 980px;
  margin: 34px auto;
  padding: 28px;
  border: 1px solid rgba(155, 126, 200, 0.18);
  border-radius: var(--radius-xl, 32px);
  background: rgba(255, 255, 255, 0.86);
  box-shadow: var(--shadow-sm, 0 18px 48px rgba(91, 67, 110, 0.08));
  text-align: center;
}

.related-links h2 {
  margin: 0 0 18px;
  font-family: var(--font-display, 'Cormorant Garamond', Georgia, serif);
  font-size: clamp(1.45rem, 3vw, 2rem);
  font-weight: 500;
  line-height: 1.12;
  color: #3d2e4a;
}

.related-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  gap: 12px;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

.related-links li {
  margin: 0;
  padding: 0;
}

.related-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid rgba(155, 126, 200, 0.22);
  background: rgba(255, 255, 255, 0.72);
  color: #5a3d7a;
  text-decoration: none;
  font: 600 0.9rem var(--font-body, 'DM Sans', system-ui, sans-serif);
  line-height: 1.2;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease;
}

.related-links a:hover {
  transform: translateY(-1px);
  border-color: rgba(155, 126, 200, 0.42);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 10px 24px rgba(91, 67, 110, 0.10);
}

.related-links a:focus-visible {
  outline: 2px solid rgba(155, 126, 200, 0.55);
  outline-offset: 3px;
}

@media (max-width: 640px) {
  .related-links {
    width: min(100%, calc(100% - 28px));
    margin: 28px auto;
    padding: 22px 16px;
    border-radius: 24px;
  }

  .related-links ul {
    gap: 10px;
  }

  .related-links a {
    width: 100%;
    max-width: 280px;
    min-height: 44px;
  }
}