/* Auto-extracted from pages/student-dashboard.html for landing welcome clone */
html,
body {
  height: 100%;
  margin: 0;
}
body.landing-welcome-body {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: #ffffff;
  color: #111111;
  min-height: 100%;
  min-height: 100dvh;
}
.landing-welcome-root {
  min-height: 100dvh;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.landing-welcome-root .dashboard-welcome {
  flex: 1 1 auto;
  min-height: 0;
}
:root {
      /* Définie sur .dashboard-shell dans le dashboard ; requise ici pour les boutons sous le prompt. */
      --shell-header-control-size: 30px;
      --app-sidebar-w: min(232px, 34vw);
      /* Espace sidebar ↔ panneau arrondi (entre 6px d’origine et 10px) */
      --app-sidebar-gap: 8px;
      /* Inset latéral unique ; légèrement sous 10px pour ne pas trop écarter le contenu */
      --app-sidebar-content-pad-x: 9px;
      /* Coin page (body::after) : référence unique bleu / cyan pastel */
      --xyz-pastel-blue: #d6e8fc;
      --xyz-pastel-cyan: #d2f3f6;
      --app-accent-blue: var(--xyz-pastel-blue);
      /* Upgrade / Free : bleu iOS #007aff = rgb(0, 122, 255) */
      --app-upgrade-rgb: 0, 122, 255;
      --app-upgrade-text: #007aff;
      /* Pastille Free / CTA navbar : fond plus pâle */
      --app-upgrade-bg: rgba(var(--app-upgrade-rgb), 0.09);
      --app-upgrade-bg-hover: rgba(var(--app-upgrade-rgb), 0.14);
      /* Barres de quota : même bleu que le texte du badge Free */
      --app-usage-progress-fill: var(--app-upgrade-text);
      /*
       * Même teintes que le fond : capsule / triangle / cases = pastel blue→cyan,
       * assombri via color-mix pour garder le texte blanc lisible.
       */
      --xyz-tour-deep-a: color-mix(in srgb, var(--xyz-pastel-blue) 34%, #132736);
      --xyz-tour-deep-b: color-mix(in srgb, var(--xyz-pastel-cyan) 32%, #122f35);
      --xyz-tour-deep-c: color-mix(
        in srgb,
        color-mix(in srgb, var(--xyz-pastel-blue) 50%, var(--xyz-pastel-cyan) 50%) 40%,
        #152f3a 60%
      );
      /* Contour + anneau tutoriel = exactement les couleurs du dégradé page (avant le blanc) */
      --xyz-gradient-blue-cyan: linear-gradient(
        135deg,
        var(--xyz-pastel-blue) 0%,
        var(--xyz-pastel-cyan) 100%
      );
      /* Intérieur : même famille, même sens que le coin page */
      --xyz-gradient-blue-cyan-deep: linear-gradient(
        to top left,
        var(--xyz-tour-deep-a) 0%,
        var(--xyz-tour-deep-b) 38%,
        var(--xyz-tour-deep-c) 100%
      );
      --xyz-stroke-blue: color-mix(in srgb, var(--xyz-pastel-blue) 55%, #5a7a96);
      /* Même épaisseur / rayon que la capsule du tutoriel ; bouton action = 20px → anneau ext. 22px */
      /* Bordures / traits : même gris que compte (Membres) */
      --app-ui-border: #ececec;
      --app-ui-stroke-width: 1.5;
      --xyz-tour-stroke-width: 1.5px;
      --xyz-welcome-action-btn-radius: 20px;
      --xyz-tour-action-ring-outer-radius: calc(
        var(--xyz-welcome-action-btn-radius) + var(--xyz-tour-stroke-width)
      );
    }
    .dashboard-game-ai-chat-log {
      margin: 0 0 12px;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 8px;
      min-height: 0;
    }
    /* Base message : typo commune */
    .dashboard-game-ai-chat-msg {
      max-width: 100%;
      box-sizing: border-box;
      font-size: 13px;
      line-height: 1.4;
      white-space: pre-wrap;
      word-break: break-word;
    }
    /* Messages utilisateur : contour #e1e1e1, pas de fond ; coin bas-droit plus serré */
    .dashboard-game-ai-chat-msg--user {
      align-self: flex-end;
      padding: 8px 10px;
      background: transparent;
      border: 1px solid #e1e1e1;
      border-radius: 14px 14px 6px 14px;
      color: #111827;
      max-width: min(100%, 425px);
    }
    /* Réponses assistant : texte noir uniquement */
    .dashboard-game-ai-chat-msg--assistant {
      align-self: flex-start;
      padding: 6px 0;
      background: none;
      border: none;
      color: #111827;
      max-width: min(100%, 425px);
      width: auto;
      text-align: start;
    }
    /* Chargement / quota : pleine largeur du fil (pas la limite 425px des bulles) */
    .dashboard-game-ai-chat-msg--assistant.dashboard-game-ai-chat-msg--loading,
    .dashboard-game-ai-chat-msg--assistant.dashboard-game-ai-chat-msg--word-quota {
      max-width: 100%;
      width: 100%;
    }
    .dashboard-game-ai-chat-msg--word-quota {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 4px 4px;
      line-height: 1.35;
      padding: 0;
      margin: 0;
    }
    .dashboard-game-ai-chat-msg--word-quota .nav-plan-cta.nav-plan-cta--upgrade,
    .dashboard-game-ai-chat-msg--word-quota .nav-plan-cta.nav-plan-cta--upgrade:visited {
      flex-shrink: 0;
      background-color: var(--app-upgrade-bg);
      background: var(--app-upgrade-bg);
      color: var(--app-upgrade-text);
      border: none;
      text-decoration: none;
      border-radius: 8px;
      box-sizing: border-box;
      height: 26px;
      min-height: 26px;
      max-height: 26px;
      padding: 0 10px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-weight: 400;
      font-size: 13px;
      font-style: italic;
      line-height: 1;
      transition:
        background 0.15s ease,
        color 0.15s ease;
    }
    .dashboard-game-ai-chat-msg--word-quota .nav-plan-cta.nav-plan-cta--upgrade:hover {
      background-color: var(--app-upgrade-bg-hover);
      background: var(--app-upgrade-bg-hover);
      color: var(--app-upgrade-text);
    }
    .dashboard-game-ai-chat-msg--word-quota .nav-plan-cta.nav-plan-cta--upgrade:active {
      background-color: var(--app-upgrade-bg-hover);
      background: var(--app-upgrade-bg-hover);
      color: var(--app-upgrade-text);
    }
    .dashboard-game-ai-chat-msg--loading {
      display: flex;
      align-items: center;
      padding: 10px 0 10px 10px;
      min-height: 28px;
    }
    .dashboard-game-ai-chat-loading-spinner {
      display: block;
      width: 17px;
      height: 17px;
      box-sizing: border-box;
      border: 1.5px solid #e5e7eb;
      border-top-color: #111827;
      border-radius: 50%;
      animation: game-ai-chat-loading-spin 0.65s linear infinite;
      flex-shrink: 0;
    }
    @keyframes game-ai-chat-loading-spin {
      to {
        transform: rotate(360deg);
      }
    }
    /* Premier prompt auto (quiz) : fond gris d’origine, pas le style message saisi. */
    .dashboard-game-ai-chat-msg--quiz-explain {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 10px;
      padding: 10px 12px;
      color: var(--dashboard-game-ai-head-text);
      box-sizing: border-box;
      width: 100%;
      max-width: 100%;
      align-self: stretch;
      background: var(--dashboard-game-ai-muted);
      border: none;
      border-radius: 12px;
    }
    .dashboard-game-ai-chat-msg-badge {
      flex-shrink: 0;
      align-self: flex-start;
      box-sizing: border-box;
      width: 175px;
      height: 55px;
      border-radius: 12px;
      background: #e8e8ea;
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
      padding: 0 10px;
    }
    .dashboard-game-ai-chat-msg-badge-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      color: var(--dashboard-game-ai-head-text);
    }
    .dashboard-game-ai-chat-msg-badge-icon svg {
      display: block;
      width: 18px;
      height: 18px;
    }
    .dashboard-game-ai-chat-msg-badge-label {
      font-size: 13px;
      font-weight: 600;
      line-height: 1.4;
      text-align: left;
      flex: 1;
      min-width: 0;
      white-space: nowrap;
      color: var(--dashboard-game-ai-head-text);
    }
    .dashboard-game-ai-chat-msg-body {
      max-width: 100%;
      min-width: 0;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.4;
      color: var(--dashboard-game-ai-head-text);
    }
    .dashboard-game-ai-chat-msg-body--cascade {
      white-space: normal;
    }
    .dashboard-game-ai-chat-msg--cascade {
      white-space: normal;
    }
    .dashboard-game-ai-chat-msg-word {
      display: inline-block;
      opacity: 0;
      transform: translateY(0.45em);
      animation: game-ai-chat-msg-word 0.42s cubic-bezier(0.22, 1, 0.36, 1) forwards;
      animation-delay: calc(var(--w-i, 0) * 42ms);
    }
    @keyframes game-ai-chat-msg-word {
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }
    .dashboard-colleague-drawer {
      flex-shrink: 0;
      align-self: stretch;
      width: 0;
      min-width: 0;
      min-height: 0;
      overflow: hidden;
      transition: width 0.28s ease;
      border-right: 1px solid transparent;
      background: #ffffff;
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
    }
    .dashboard-shell.dashboard-shell--colleague-discussions-open #dashboard-colleague-panel {
      width: min(248px, 36vw);
      border-right: 1px solid var(--app-ui-border);
    }
    .dashboard-shell.dashboard-shell--home-ai-chats-open #dashboard-home-ai-chat-panel {
      width: min(248px, 36vw);
      border-right: 1px solid var(--app-ui-border);
    }
    .dashboard-colleague-drawer-inner {
      box-sizing: border-box;
      flex: 1;
      min-height: 0;
      width: min(248px, 36vw);
      display: flex;
      flex-direction: column;
      background: #ffffff;
    }
    .dashboard-colleague-drawer .dashboard-colleague-panel-head {
      position: relative;
      box-sizing: border-box;
      height: var(--dashboard-navbar-inner-height);
      min-height: var(--dashboard-navbar-inner-height);
      max-height: var(--dashboard-navbar-inner-height);
      padding: 0 12px;
      margin: 0;
      gap: 8px;
      border-bottom: none;
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
    .dashboard-colleague-drawer .dashboard-colleague-panel-head::after {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      bottom: 10px;
      height: 1px;
      background: var(--app-ui-border);
      pointer-events: none;
    }
    .dashboard-colleague-drawer .dashboard-colleague-panel-head h2 {
      margin: 0;
      min-width: 0;
      flex: 1;
      font-size: var(--shell-header-title-size);
      font-weight: var(--shell-header-title-weight);
      letter-spacing: var(--shell-header-title-tracking);
      line-height: 1;
      display: flex;
      align-items: center;
      transform: translateY(var(--shell-header-align-nudge));
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .dashboard-colleague-panel-head-trailing {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 2px;
      flex-shrink: 0;
      transform: translateY(var(--shell-header-align-nudge));
    }
    .dashboard-colleague-panel-head-trailing .dashboard-colleague-new-chat-btn {
      transform: none;
    }
    /* Fermeture du tiroir : visible uniquement en mobile (voir @media max-width 768px). */
    .dashboard-chat-panel-close-btn {
      display: none;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      width: var(--shell-header-control-size);
      height: var(--shell-header-control-size);
      min-height: var(--shell-header-control-size);
      max-height: var(--shell-header-control-size);
      font: inherit;
      line-height: 0;
      color: #111111;
      background: transparent;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      transition: background 0.15s ease, color 0.15s ease;
      -webkit-tap-highlight-color: transparent;
    }
    .dashboard-chat-panel-close-btn svg {
      flex-shrink: 0;
      width: 20px;
      height: 20px;
      display: block;
    }
    .dashboard-chat-panel-close-btn:hover {
      background: #f2f2f2;
    }
    .dashboard-chat-panel-close-btn:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .dashboard-home-ai-chat-panel-head .dashboard-chat-panel-close-btn {
      transform: translateY(var(--shell-header-align-nudge));
    }
    /* Même logique que .get-started-trigger : fond transparent, hover #f2f2f2 ; SVG centré */
    .dashboard-colleague-new-chat-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      width: var(--shell-header-control-size);
      height: var(--shell-header-control-size);
      min-height: var(--shell-header-control-size);
      max-height: var(--shell-header-control-size);
      font: inherit;
      line-height: 0;
      color: #111111;
      background: transparent;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      transform: translateY(var(--shell-header-align-nudge));
      transition: background 0.15s ease, color 0.15s ease;
    }
    .dashboard-colleague-new-chat-btn svg {
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      display: block;
      stroke: currentColor;
      fill: none;
      stroke-width: var(--app-ui-stroke-width, 1.5);
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .dashboard-colleague-new-chat-btn:hover {
      background: #f2f2f2;
    }
    .dashboard-colleague-new-chat-btn:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .dashboard-colleague-drawer .dashboard-colleague-panel-body {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 12px 12px 12px;
    }
    .dashboard-colleague-panel-empty {
      margin: 0;
      padding: 0 0 4px;
      display: flex;
      flex-direction: column;
      align-items: stretch;
    }
    .dashboard-colleague-panel-empty.hidden {
      display: none;
    }
    .dashboard-home-ai-chat-empty-text {
      margin: 0;
      padding: 12px 8px;
      font-size: 13px;
      font-weight: 500;
      line-height: 1.45;
      color: #9ca3af;
      text-align: center;
    }
    .dashboard-colleague-panel-members-cta {
      width: 100%;
      box-sizing: border-box;
      text-align: center;
    }
    .dashboard-colleague-panel-list {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    /* Dossiers notifications : même espacement vertical que `.app-sidebar-tabs` (3px). */
    #dashboard-colleague-panel-list.dashboard-colleague-panel-list {
      gap: 3px;
    }
    #dashboard-colleague-panel-list.dashboard-colleague-panel-list--calendar-tasks {
      gap: 10px;
    }
    .dashboard-colleague-panel-list li {
      margin: 0;
    }
    .dashboard-notification-folder-li {
      display: block;
      margin: 0;
    }
    .dashboard-notification-folder-li .dashboard-discussion-row--folder {
      width: 100%;
      min-width: 0;
    }
    /* Trait entre la boîte de réception et les dossiers créés. */
    #dashboard-colleague-panel-list .dashboard-notification-folder-sep {
      display: block;
      height: 0;
      margin: 6px 10px;
      padding: 0;
      border: none;
      border-top: 1px solid var(--app-ui-border, #e5e7eb);
      pointer-events: none;
    }
    .dashboard-notification-folder-li--add-slot,
    .dashboard-notification-folder-composer-li {
      margin-top: 2px;
    }
    /* Même gabarit que `button.dashboard-discussion-row--folder` (pleine largeur, padding 6px 12px, rayon 8px). */
    #dashboard-colleague-panel-list .dashboard-notification-folder-composer-li .dashboard-folder-composer {
      display: block;
      width: 100%;
      min-width: 0;
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    #dashboard-colleague-panel-list .dashboard-notification-folder-composer-li .dashboard-folder-composer-inner.dashboard-folder-composer-row {
      width: 100%;
      min-width: 0;
      margin: 0;
      box-sizing: border-box;
      padding: 6px 12px;
      border-radius: 8px;
      align-items: center;
      /* Aligné sur la ligne dossier : padding 6+6 + icône 18px (même repère que le libellé 14px / 1.25). */
      min-height: calc(12px + 18px);
    }
    #dashboard-colleague-panel-list .dashboard-notification-folder-composer-li .dashboard-folder-composer .dashboard-folder-new-input {
      line-height: 1.25;
    }
    .dashboard-folder-composer-host {
      margin: 0;
      padding: 0;
    }
    .dashboard-notification-folder-add-first {
      width: 100%;
      box-sizing: border-box;
      margin: 0;
      padding: 8px 12px;
      font: inherit;
      font-size: 14px;
      font-weight: 500;
      color: #111111;
      background: #ffffff;
      border: 1px solid #e1e1e1;
      border-radius: 10px;
      cursor: pointer;
      text-align: center;
      transition: background 0.15s ease, border-color 0.15s ease;
    }
    .dashboard-notification-folder-add-first:hover {
      background: #f9fafb;
      border-color: #d1d5db;
    }
    .dashboard-notification-folder-add-first:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .dashboard-colleague-panel-empty-text {
      margin: 0;
      padding: 8px 0;
      font-size: 14px;
      line-height: 1.45;
      color: #6b7280;
    }
    .dashboard-folder-composer {
      padding: 0;
      margin: 0 0 3px;
      border-bottom: none;
    }
    .dashboard-folder-composer.hidden {
      display: none !important;
    }
    /* Même « ligne » qu’un onglet sidebar : padding 6px 12px, rayon 8px, icône 18px #111. */
    .dashboard-folder-composer-inner.dashboard-folder-composer-row {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
      padding: 6px 12px;
      border-radius: 8px;
      background: transparent;
      transition: background 0.15s ease;
    }
    .dashboard-folder-composer-row:focus-within {
      background: #f3f4f6;
    }
    .dashboard-folder-composer-main.app-sidebar-tab-main {
      flex: 1;
      min-width: 0;
    }
    .dashboard-folder-composer-label-cell.app-sidebar-tab-label-row {
      flex: 1;
      min-width: 0;
    }
    .dashboard-folder-composer .dashboard-folder-new-input {
      flex: 1;
      min-width: 0;
      width: 100%;
      border: none;
      background: transparent;
      padding: 0;
      margin: 0;
      font: inherit;
      font-size: 14px;
      font-weight: 400;
      line-height: 1.25;
      color: #111111;
      box-sizing: border-box;
      outline: none;
      box-shadow: none;
      border-radius: 0;
    }
    .dashboard-folder-composer .dashboard-folder-new-input::placeholder {
      color: #9ca3af;
      font-weight: 400;
    }
    .dashboard-folder-new-accept {
      flex-shrink: 0;
      width: var(--shell-header-control-size, 30px);
      height: var(--shell-header-control-size, 30px);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin: 0;
      padding: 0;
      border: none;
      border-radius: 8px;
      background: transparent;
      color: #111111;
      cursor: pointer;
      transition: background 0.15s ease, color 0.15s ease;
      -webkit-tap-highlight-color: transparent;
    }
    .dashboard-folder-new-accept:hover {
      background: #f3f4f6;
    }
    .dashboard-folder-new-accept:active {
      background: #e5e7eb;
    }
    .dashboard-folder-new-accept:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .dashboard-folder-new-accept .dashboard-folder-new-accept-icon {
      width: 18px;
      height: 18px;
      display: block;
      flex-shrink: 0;
      stroke: #111111;
      fill: none;
      stroke-width: var(--app-ui-stroke-width);
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    #dashboard-colleague-panel-list button.dashboard-discussion-row--folder-active {
      background: #f3f4f6 !important;
      box-shadow: none;
      font-weight: 400;
    }

    /* Lignes dossier : alignées sur `.app-sidebar-footer-btn` (padding, rayon, gap icône). */
    #dashboard-colleague-panel-list button.dashboard-discussion-row--folder {
      gap: 0;
      padding: 6px 12px;
      border-radius: 8px;
    }
    #dashboard-colleague-panel-list .dashboard-notification-folder-tab-main.app-sidebar-tab-main,
    .dashboard-folder-composer-main.app-sidebar-tab-main {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 8px;
      width: 100%;
      min-width: 0;
      flex: 1;
    }
    #dashboard-colleague-panel-list .dashboard-discussion-row--folder .dashboard-discussion-name {
      font-weight: 400;
    }
    .dashboard-discussion-row {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      padding: 8px;
      border: none;
      border-radius: 10px;
      background: transparent;
      background-color: transparent;
      cursor: pointer;
      font: inherit;
      text-align: left;
      color: #111111;
      box-sizing: border-box;
      transition: background-color 0.15s ease;
      -webkit-appearance: none;
      appearance: none;
    }
    /* Panneau Discussions (membres) : pas de fond gris au survol / clic. */
    .dashboard-discussion-row:hover {
      background-color: rgba(17, 17, 17, 0.06);
    }
    #dashboard-colleague-panel-list button.dashboard-discussion-row--folder:hover {
      background-color: #f3f4f6;
    }
    #dashboard-colleague-panel-list button.dashboard-discussion-row--folder:active {
      background-color: #e5e7eb;
    }
    #dashboard-colleague-panel-list .dashboard-calendar-task-li {
      list-style: none;
      margin: 0;
      padding: 6px 0;
    }
    #dashboard-colleague-panel-list .dashboard-calendar-task-row {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 10px;
      width: 100%;
      margin: 0;
      padding: 0;
      border: none;
      background: transparent;
      box-sizing: border-box;
    }
    .dashboard-calendar-task-check {
      appearance: none;
      -webkit-appearance: none;
      flex-shrink: 0;
      width: 18px;
      height: 18px;
      margin: 0;
      border-radius: 50%;
      border: 1.5px solid #6b7280;
      background: transparent;
      cursor: pointer;
      box-sizing: border-box;
      position: relative;
    }
    .dashboard-calendar-task-check:checked {
      background: #111827;
      border-color: #111827;
    }
    .dashboard-calendar-task-check:checked::after {
      content: "";
      position: absolute;
      left: 50%;
      top: 45%;
      width: 4px;
      height: 8px;
      border: solid #fff;
      border-width: 0 2px 2px 0;
      transform: translate(-50%, -50%) rotate(45deg);
      box-sizing: border-box;
    }
    .dashboard-calendar-task-title {
      flex: 1;
      min-width: 0;
      font-size: 14px;
      font-weight: 600;
      color: #111111;
      line-height: 1.35;
      letter-spacing: -0.02em;
      word-break: break-word;
    }
    .dashboard-calendar-task-title--done {
      text-decoration: line-through;
      color: #9ca3af;
      font-weight: 500;
    }
    .dashboard-calendar-task-remove {
      flex-shrink: 0;
      margin: 0;
      padding: 2px 6px;
      border: none;
      background: transparent;
      cursor: pointer;
      font-size: 18px;
      line-height: 1;
      color: #9ca3af;
      font-family: inherit;
      border-radius: 4px;
    }
    .dashboard-calendar-task-remove:hover {
      color: #b91c1c;
    }
    #dashboard-colleague-panel-list .dashboard-calendar-task-composer-li {
      margin-top: 0;
      margin-bottom: 2px;
      padding-top: 2px;
    }
    #dashboard-colleague-panel-list .dashboard-calendar-task-composer-li .dashboard-calendar-task-composer {
      display: block;
      width: 100%;
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    .dashboard-calendar-task-composer.hidden {
      display: none !important;
    }
    .dashboard-calendar-task-composer-row {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 10px;
      width: 100%;
      min-width: 0;
      margin: 0;
      padding: 0;
      border: none;
      background: transparent;
      box-sizing: border-box;
    }
    .dashboard-calendar-task-composer-leading {
      flex-shrink: 0;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      border: 1.5px solid #9ca3af;
      box-sizing: border-box;
      opacity: 0.55;
    }
    .dashboard-calendar-task-composer-input {
      flex: 1;
      min-width: 0;
      border: none;
      background: transparent;
      padding: 0;
      margin: 0;
      font: inherit;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.35;
      color: #111111;
      box-sizing: border-box;
      outline: none;
      box-shadow: none;
      border-radius: 0;
    }
    .dashboard-calendar-task-composer-input::placeholder {
      color: #9ca3af;
      font-weight: 500;
    }
    .dashboard-discussion-row:focus-visible {
      outline: 2px solid #2563eb;
      outline-offset: 2px;
    }
    .dashboard-discussion-pfp {
      width: 40px;
      height: 40px;
      flex-shrink: 0;
      border-radius: 10px;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 15px;
      font-weight: 700;
      color: #1d4ed8;
      background: linear-gradient(145deg, #dbeafe, #e0f2fe);
    }
    /* Membres / discussions : avatar légèrement plus compact. */
    #dashboard-colleague-panel-list .dashboard-discussion-pfp {
      width: 38px;
      height: 38px;
      border-radius: 9px;
      font-size: 14px;
    }
    .dashboard-discussion-pfp-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }
    .dashboard-discussion-pfp-fallback {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 100%;
    }
    .dashboard-discussion-main {
      min-width: 0;
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 1px;
      overflow: hidden;
    }
    .dashboard-discussion-name {
      display: block;
      min-width: 0;
      max-width: 100%;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.25;
      color: #111111;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .dashboard-discussion-preview {
      display: block;
      min-width: 0;
      max-width: 100%;
      font-size: 12px;
      line-height: 1.35;
      color: #6b7280;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .dashboard-discussion-preview-time {
      color: #9ca3af;
      font-weight: 400;
    }
    .dashboard-discussion-preview--typing {
      display: inline-flex;
      align-items: center;
      min-height: 1.35em;
    }
    .dashboard-typing-dots {
      display: inline-flex;
      align-items: center;
      gap: 3px;
      padding-left: 1px;
    }
    .dashboard-typing-dots > span {
      width: 4px;
      height: 4px;
      border-radius: 50%;
      background: #9ca3af;
      animation: dashboard-typing-dot 1.05s ease-in-out infinite both;
    }
    .dashboard-typing-dots > span:nth-child(2) {
      animation-delay: 0.18s;
    }
    .dashboard-typing-dots > span:nth-child(3) {
      animation-delay: 0.36s;
    }
    @keyframes dashboard-typing-dot {
      0%,
      70%,
      100% {
        transform: translateY(0);
        opacity: 0.35;
      }
      35% {
        transform: translateY(-3px);
        opacity: 1;
      }
    }
    @media (prefers-reduced-motion: reduce) {
      .dashboard-typing-dots > span {
        animation: none;
        opacity: 0.65;
      }
    }
    .navbar .container {
      max-width: none;
      margin-left: 0;
      margin-right: 0;
    }
    .navbar-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      height: var(--dashboard-navbar-inner-height);
      gap: 1rem;
      /* Inset horizontal : voir .dashboard-shell-right-column (12px à droite avec le shell). */
      padding: 0;
    }
    .navbar-start {
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
      flex: 1;
      transform: translateY(var(--shell-header-align-nudge));
    }
    .navbar-page-title {
      font-size: var(--shell-header-title-size);
      font-weight: var(--shell-header-title-weight);
      color: #111111;
      letter-spacing: var(--shell-header-title-tracking);
      line-height: var(--shell-header-title-leading);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      min-width: 0;
    }
    .get-started-trigger {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      width: var(--shell-header-control-size);
      height: var(--shell-header-control-size);
      min-height: var(--shell-header-control-size);
      max-height: var(--shell-header-control-size);
      font: inherit;
      color: #111111;
      background: transparent;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      transition: background 0.15s ease, color 0.15s ease;
    }
    .get-started-trigger:hover {
      background: #f2f2f2;
    }
    .get-started-trigger:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .get-started-trigger svg {
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      stroke: currentColor;
      fill: none;
      stroke-width: var(--app-ui-stroke-width);
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    /* Bouton tiroir Discussions : bulle quand fermé, X quand ouvert (fermer). */
    #dashboard-colleague-discussions-btn .dashboard-colleague-discussions-icon--close {
      display: none;
    }
    #dashboard-colleague-discussions-btn.dashboard-colleague-discussions-btn--panel-open
      .dashboard-colleague-discussions-icon--chat {
      display: none;
    }
    #dashboard-colleague-discussions-btn.dashboard-colleague-discussions-btn--panel-open
      .dashboard-colleague-discussions-icon--close {
      display: block;
    }
    #dashboard-colleague-discussions-btn:disabled {
      opacity: 0.42;
      cursor: not-allowed;
    }
    #dashboard-home-ai-chats-btn .dashboard-colleague-discussions-icon--close {
      display: none;
    }
    #dashboard-home-ai-chats-btn.dashboard-home-ai-chats-btn--panel-open
      .dashboard-colleague-discussions-icon--chat {
      display: none;
    }
    #dashboard-home-ai-chats-btn.dashboard-home-ai-chats-btn--panel-open
      .dashboard-colleague-discussions-icon--close {
      display: block;
    }
    .dashboard-home-ai-chat-panel-head {
      justify-content: flex-start;
    }
    /* Panneau Chat : un peu plus d’air au-dessus de la liste ; même densité que .app-sidebar-tabs (gap 3px). */
    #dashboard-home-ai-chat-panel-body.dashboard-colleague-panel-body {
      padding-top: 14px;
    }
    #dashboard-home-ai-chat-panel-list.dashboard-colleague-panel-list {
      gap: 3px;
    }
    /* Hauteur / typo alignées sur .app-sidebar-footer-btn (padding 6px 12px, 14px / 400). */
    #dashboard-home-ai-chat-panel-list .dashboard-home-ai-chat-row {
      gap: 8px;
      padding: 6px 12px;
      padding-right: 40px;
      min-height: 30px;
      box-sizing: border-box;
      border-radius: 8px;
      justify-content: space-between;
      transition: background 0.15s ease;
    }
    #dashboard-home-ai-chat-panel-list
      .dashboard-home-ai-chat-row:not(.dashboard-home-ai-chat-row--editing):hover {
      background: rgba(17, 17, 17, 0.06);
    }
    #dashboard-home-ai-chat-panel-list .dashboard-home-ai-chat-row__line {
      display: block;
      flex: 1;
      min-width: 0;
      font-weight: 400;
      font-size: 14px;
      line-height: 1.25;
      color: #111111;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .dashboard-home-ai-chat-row__dot {
      flex-shrink: 0;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #2563eb;
      align-self: center;
    }
    #dashboard-home-ai-chat-panel-list .dashboard-home-ai-chat-item {
      position: relative;
      list-style: none;
      margin: 0;
    }
    #dashboard-home-ai-chat-panel-list .dashboard-home-ai-chat-item__surface {
      position: relative;
    }
    #dashboard-home-ai-chat-panel-list .dashboard-home-ai-chat-item .dashboard-home-ai-chat-row {
      width: 100%;
    }
    #dashboard-home-ai-chat-panel-list .dashboard-home-ai-chat-row--editing {
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      padding: 6px 12px;
      padding-right: 12px;
      min-height: 30px;
      box-sizing: border-box;
      border-radius: 8px;
      background: transparent;
      border: none;
      cursor: default;
      font: inherit;
      text-align: left;
      color: #111111;
    }
    .dashboard-home-ai-chat-row__title-input {
      flex: 1;
      min-width: 0;
      margin: 0;
      padding: 5px 8px;
      box-sizing: border-box;
      border: 0.5px solid #000000;
      border-radius: 6px;
      background: #ffffff;
      font: inherit;
      font-size: 14px;
      font-weight: 400;
      line-height: 1.25;
      color: #111111;
    }
    .dashboard-home-ai-chat-row__title-input:focus {
      outline: none;
      border-color: #000000;
    }
    .dashboard-home-ai-chat-item--editing-title .dashboard-home-ai-chat-row__actions {
      display: none;
    }
    .dashboard-home-ai-chat-row__actions {
      position: absolute;
      top: 3px;
      right: 6px;
      z-index: 3;
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      pointer-events: none;
    }
    .dashboard-home-ai-chat-row__more,
    .dashboard-home-ai-chat-row__menu {
      pointer-events: auto;
    }
    .dashboard-home-ai-chat-row__more {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 26px;
      min-height: 24px;
      padding: 0;
      margin: 0;
      border: none;
      border-radius: 8px;
      background: transparent;
      box-shadow: none;
      color: #6b7280;
      cursor: pointer;
      opacity: 0;
      pointer-events: none;
      transition:
        opacity 0.15s ease,
        color 0.15s ease;
    }
    .dashboard-home-ai-chat-item:hover .dashboard-home-ai-chat-row__more,
    .dashboard-home-ai-chat-item:focus-within .dashboard-home-ai-chat-row__more,
    .dashboard-home-ai-chat-item--menu-open .dashboard-home-ai-chat-row__more {
      opacity: 1;
      pointer-events: auto;
      color: #4b5563;
    }
    .dashboard-home-ai-chat-row__more:hover {
      background: transparent;
      color: #111111;
      box-shadow: none;
    }
    .dashboard-home-ai-chat-row__more:focus-visible {
      outline: 2px solid #2563eb;
      outline-offset: 2px;
      opacity: 1;
      pointer-events: auto;
    }
    .dashboard-home-ai-chat-row__more-icon {
      display: block;
      flex-shrink: 0;
      width: 14px;
      height: 14px;
    }
    .dashboard-home-ai-chat-row__menu {
      position: absolute;
      right: 0;
      top: 100%;
      margin-top: 4px;
      min-width: 148px;
      padding: 6px 0;
      background: #ffffff;
      border: 1px solid #e5e7eb;
      border-radius: 10px;
      box-shadow: none;
      z-index: 40;
    }
    .dashboard-home-ai-chat-row__menu.hidden {
      display: none !important;
    }
    .dashboard-home-ai-chat-row__menu-item {
      display: block;
      width: 100%;
      margin: 0;
      padding: 8px 14px;
      border: none;
      background: none;
      font: inherit;
      font-size: 14px;
      font-weight: 450;
      line-height: 1.25;
      text-align: left;
      color: #111827;
      cursor: pointer;
      box-sizing: border-box;
    }
    .dashboard-home-ai-chat-row__menu-item:hover {
      background: #f3f4f6;
    }
    .dashboard-home-ai-chat-row__menu-item:focus-visible {
      outline: 2px solid #2563eb;
      outline-offset: -2px;
    }
    .dashboard-home-ai-chat-row__menu-item--danger {
      color: #b91c1c;
    }
    .dashboard-home-ai-chat-row__menu-item--danger:hover {
      background: #fef2f2;
    }
    @media (prefers-reduced-motion: reduce) {
      .dashboard-home-ai-chat-row__more {
        transition: none;
      }
    }
    .welcome-home-ai-msg--typing {
      display: flex;
      align-items: center;
      padding: 8px 0 10px;
      min-height: 32px;
    }
    /* Capsule bien lisible sur fond #f6f6f6 de la carte agent (éviter gris sur gris). */
    .welcome-home-ai-chat-log
      .dashboard-game-ai-chat-msg--assistant.welcome-home-ai-msg--typing {
      padding: 0;
      background: none;
      width: auto;
      max-width: 100%;
    }
    .welcome-home-ai-typing {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 8px 14px;
      border-radius: 999px;
      box-sizing: border-box;
      background: #ffffff;
      border: 1px solid #e5e7eb;
      box-shadow: none;
    }
    .welcome-home-ai-typing-dot {
      display: block;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: #6b7280;
      animation: welcome-home-ai-typing-dot 1.05s ease-in-out infinite;
    }
    .welcome-home-ai-typing-dot:nth-child(2) {
      animation-delay: 0.16s;
    }
    .welcome-home-ai-typing-dot:nth-child(3) {
      animation-delay: 0.32s;
    }
    @keyframes welcome-home-ai-typing-dot {
      0%,
      70%,
      100% {
        opacity: 0.35;
        transform: translateY(0);
      }
      35% {
        opacity: 1;
        transform: translateY(-3px);
      }
    }
    .navbar-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      transform: translateY(var(--shell-header-align-nudge));
    }
    .navbar-actions a {
      font-size: 14px;
      font-weight: 500;
      color: #444444;
      text-decoration: none;
      padding: 8px 12px;
      border-radius: 8px;
      transition: background 0.15s ease, color 0.15s ease;
    }
    .navbar-actions a:hover {
      color: #111111;
      background: #f2f2f2;
    }
    .navbar-actions .nav-plan-cta {
      border: none;
      box-sizing: border-box;
      height: var(--shell-header-control-size);
      min-height: var(--shell-header-control-size);
      max-height: var(--shell-header-control-size);
      padding: 0 12px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      font-weight: 400;
      font-size: 13px;
      line-height: 1;
      transition: background 0.15s ease, color 0.15s ease;
    }
    .nav-plan-cta__icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      margin: 0;
      line-height: 0;
      color: inherit;
    }
    .nav-plan-cta__icon svg {
      display: block;
      width: 18px;
      height: 18px;
    }
    .nav-plan-cta--pro .nav-plan-cta__icon {
      display: none;
    }
    .navbar-actions a.nav-plan-cta.nav-plan-cta--upgrade,
    .navbar-actions a.nav-plan-cta.nav-plan-cta--upgrade:visited {
      background-color: var(--app-upgrade-bg);
      background: var(--app-upgrade-bg);
      color: var(--app-upgrade-text);
    }
    .navbar-actions a.nav-plan-cta.nav-plan-cta--upgrade:hover {
      background-color: var(--app-upgrade-bg-hover);
      background: var(--app-upgrade-bg-hover);
      color: var(--app-upgrade-text);
    }
    .navbar-actions a.nav-plan-cta.nav-plan-cta--upgrade:active {
      background-color: var(--app-upgrade-bg-hover);
      background: var(--app-upgrade-bg-hover);
      color: var(--app-upgrade-text);
    }
    .navbar-actions .nav-plan-cta--pro {
      background: #ecfdf5;
      color: #047857;
    }
    .navbar-actions .nav-plan-cta--pro:hover {
      background: #d1fae5;
      color: #065f46;
    }
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 10px 18px;
      font-size: 14px;
      font-weight: 600;
      border-radius: 8px;
      cursor: pointer;
      text-decoration: none;
      border: none;
      transition: background 0.15s ease, color 0.15s ease;
    }
    .btn-primary {
      background: #111111;
      color: #ffffff;
    }
    .btn-primary:hover { background: #333333; }
    .btn-secondary {
      background: #ffffff;
      color: #111111;
      border: 1.5px solid var(--app-ui-border);
    }
    .btn-secondary:hover { background: #f5f5f5; }

    /* Zone centrale du shell : accueil ou iframe workspace */
    .dashboard-main {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      min-height: 0;
      width: 100%;
    }
    .dashboard-welcome {
      position: relative;
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 16px 16px max(24px, env(safe-area-inset-bottom));
      text-align: center;
      min-height: 0;
    }
    .dashboard-welcome.hidden {
      display: none !important;
    }
    .dashboard-workspace {
      flex: 1;
      display: flex;
      flex-direction: column;
      min-height: 0;
      gap: 12px;
      padding: 8px 0 20px;
      width: 100%;
    }
    .dashboard-workspace.hidden {
      display: none !important;
    }
    .dashboard-workspace-iframe {
      flex: 1;
      width: 100%;
      min-height: min(420px, 55vh);
      border: none;
      border-radius: 0;
      background: #ffffff;
      box-shadow: none;
    }
    .welcome-visual {
      width: 100%;
      max-width: 720px;
      --welcome-action-btn-width: 225px;
      --welcome-actions-gap: 12px;
      --welcome-actions-row-width: calc(
        3 * var(--welcome-action-btn-width) + 2 * var(--welcome-actions-gap)
      );
    }
    .welcome-title {
      font-size: clamp(26px, 5vw, 34px);
      font-weight: 700;
      letter-spacing: -0.03em;
      line-height: 1.2;
      margin-bottom: 12px;
      color: #111111;
    }
    .welcome-title .name {
      color: #111111;
    }
    .welcome-subtitle {
      font-size: 16px;
      line-height: 1.55;
      color: #6b7280;
      margin-bottom: 28px;
      max-width: 420px;
      margin-left: auto;
      margin-right: auto;
    }
    .welcome-actions {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: center;
      align-items: stretch;
      gap: var(--welcome-actions-gap);
      width: 100%;
      max-width: 720px;
      margin-left: auto;
      margin-right: auto;
    }
    .welcome-action-btn {
      display: inline-flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: center;
      gap: 12px;
      width: var(--welcome-action-btn-width);
      height: 125px;
      box-sizing: border-box;
      padding: 16px 18px;
      border-radius: var(--xyz-welcome-action-btn-radius);
      cursor: pointer;
      text-decoration: none;
      background: #ffffff;
      color: #111111;
      border: 1.5px solid var(--app-ui-border);
      box-shadow: none;
      transition: background 0.15s ease, transform 0.2s ease;
      flex-shrink: 0;
    }
    .welcome-action-btn:hover {
      background: #fafafa;
      box-shadow: none;
      transform: scale(1.004);
    }
    .welcome-action-btn:active {
      transform: scale(0.99);
    }
    .welcome-action-btn-icon {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      line-height: 0;
    }
    .welcome-action-btn svg {
      flex-shrink: 0;
      width: 24px;
      height: 24px;
      stroke: currentColor;
      fill: none;
      stroke-width: var(--app-ui-stroke-width);
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .welcome-action-btn-label {
      font-size: 14px;
      font-weight: 600;
      line-height: 1.35;
      text-align: left;
    }
    .welcome-action-btn-text {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
      align-self: stretch;
    }
    .welcome-action-btn-sublabel {
      font-size: 11px;
      font-weight: 500;
      line-height: 1.3;
      color: #6b7280;
      text-align: left;
    }
    button.welcome-action-btn {
      font: inherit;
      text-align: left;
      appearance: none;
      -webkit-appearance: none;
    }
    .welcome-action-btn--recording {
      border-color: #fecaca;
      background: #fff5f5;
    }
    .welcome-action-btn--recording .welcome-action-btn-sublabel {
      color: #b91c1c;
    }

    /* Accueil — « agent » central (même esprit que le composeur jeu : cadre gris + zone blanche arrondie). */
    .welcome-visual--home-agent {
      max-width: 660px;
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0;
      min-height: 0;
      flex: 1 1 auto;
      /* Toutes les « capsules » home utilisent ce facteur (contenu mis à l’échelle avec le bloc). */
      --welcome-home-capsule-scale: 1.12;
    }
    .welcome-home-free-plan-pill,
    .welcome-home-preset,
    .welcome-home-attach-btn,
    .welcome-home-send-btn {
      transform: scale(var(--welcome-home-capsule-scale));
      transform-origin: center center;
    }
    /* Rangée du composeur : sans scale — sinon le rendu dépasse la boîte flex et mange l’espace
       entre « Ajouter des fichiers » et le bouton plugins. */
    .welcome-visual--home-agent .welcome-home-agent-actions .welcome-home-attach-btn,
    .welcome-visual--home-agent .welcome-home-agent-actions .welcome-home-send-btn {
      transform: none;
    }
    /*
      Accueil : la colonne remplit la hauteur utile — le hero centre titre + composeur + capsules,
      le carrousel reste en bas de l’écran (sous le hero en flex:1).
    */
    .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-visual--home-agent {
      flex: 1 1 auto;
      min-height: 0;
      align-self: center;
      justify-content: flex-start;
      width: 100%;
      transform: none;
    }
    .welcome-home-hero {
      display: flex;
      flex-direction: column;
      align-items: center;
      min-height: 0;
      width: 100%;
      justify-content: center;
    }
    .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-home-hero {
      flex: 1 1 auto;
      min-height: 0;
    }
    .dashboard-welcome--ai-chat .welcome-home-hero {
      flex: 1 1 0;
      min-height: 0;
      justify-content: flex-start;
    }
    .welcome-home-free-plan-pill {
      display: inline-flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      flex-wrap: wrap;
      gap: 6px 8px;
      /* Espace jusqu’au titre « How can we help you? » puis au composeur. */
      margin: 0 0 44px;
      padding: 8px 16px;
      border-radius: 999px;
      border: 1.5px solid var(--app-ui-border);
      background: #ffffff;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.2;
      color: #374151;
      box-sizing: border-box;
      max-width: 100%;
    }
    .welcome-home-free-plan-pill--hidden {
      display: none !important;
    }
    .welcome-home-free-plan-pill__sep {
      color: #d1d5db;
      font-weight: 500;
      user-select: none;
    }
    .welcome-home-free-plan-pill__upgrade {
      margin: 0;
      padding: 0;
      border: none;
      background: none;
      font: inherit;
      font-weight: 600;
      color: var(--app-upgrade-text);
      cursor: pointer;
      text-decoration: none;
      border-radius: 4px;
    }
    .welcome-home-free-plan-pill__upgrade:hover {
      text-decoration: underline;
    }
    .welcome-home-free-plan-pill__upgrade:focus-visible {
      outline: 2px solid var(--app-upgrade-text);
      outline-offset: 2px;
    }
    .dashboard-welcome--ai-chat .welcome-home-free-plan-pill {
      display: none !important;
    }
    .welcome-home-help-lead {
      width: 100%;
      max-width: 660px;
      margin: 0 0 28px;
      padding: 0 16px;
      box-sizing: border-box;
      text-align: center;
      font-size: clamp(26px, 4.8vw, 40px);
      font-weight: 600;
      letter-spacing: -0.03em;
      line-height: 1.2;
      color: #111111;
    }
    .dashboard-welcome--ai-chat .welcome-home-help-lead {
      display: none !important;
    }
    .welcome-home-stack {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      justify-content: flex-start;
      flex: 0 0 auto;
      min-height: 0;
      width: 100%;
      max-width: 660px;
    }
    .dashboard-welcome--ai-chat .welcome-visual--home-agent {
      max-width: 100%;
      flex: 1;
      align-self: stretch;
    }
    /* basis 0 + min-height 0 : la pile ne grandit pas avec le contenu du chat ; le défilement reste dans log-wrap. */
    .dashboard-welcome--ai-chat .welcome-home-stack {
      flex: 1 1 0;
      min-height: 0;
      max-width: 820px;
      margin: 0 auto;
      width: 100%;
      justify-content: flex-end;
    }
    .welcome-home-ai-chat-scroll {
      display: none;
      flex-direction: column;
      flex: 1;
      min-height: 0;
      overflow: hidden;
    }
    .dashboard-welcome--ai-chat .welcome-home-ai-chat-scroll {
      display: flex;
    }
    .welcome-home-ai-new-chat:disabled {
      opacity: 0.5;
      cursor: not-allowed;
    }
    .welcome-home-ai-chat-log-wrap {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      overflow-x: hidden;
      overflow-anchor: none;
      padding: 0 6px 8px;
      -webkit-overflow-scrolling: touch;
    }
    .welcome-home-ai-chat-log {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 12px;
      width: 100%;
      max-width: 650px;
      margin: 0 auto;
      min-height: min-content;
      box-sizing: border-box;
    }
    .welcome-home-body {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      flex-shrink: 0;
      width: 100%;
    }
    .dashboard-welcome--ai-chat .welcome-home-body {
      width: 100%;
      max-width: 660px;
      margin: 0 auto;
      padding-bottom: 0;
      align-items: stretch;
    }
    .dashboard-welcome--ai-chat {
      justify-content: stretch;
      align-items: stretch;
      padding: 12px 10px max(24px, env(safe-area-inset-bottom));
    }
    .dashboard-welcome--ai-chat .welcome-home-spotlight {
      display: none !important;
    }
    .welcome-home-agent {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 12px;
      /* Rayon proportionnel à la largeur du bloc (~4,25 % ≈ 28px à 660px). */
      container-type: inline-size;
      container-name: welcome-home-agent;
      --welcome-home-agent-outer-radius: clamp(12px, 2.8vw, 28px);
      --welcome-home-agent-inner-radius: max(
        10px,
        calc(var(--welcome-home-agent-outer-radius) - 2px)
      );
    }
    @supports (width: 1cqw) {
      .welcome-home-agent {
        --welcome-home-agent-outer-radius: clamp(12px, 4.25cqw, 28px);
      }
    }
    .welcome-home-agent-card {
      --welcome-home-agent-card-surface: #f6f6f6;
      position: relative;
      border-radius: var(--welcome-home-agent-outer-radius);
      background: var(--welcome-home-agent-card-surface);
      box-sizing: border-box;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      /* .dashboard-welcome a text-align: center ; le titre « Uplearn AI » doit rester au leading. */
      text-align: start;
      box-shadow: none;
    }
    /* Carte grise + bandeau + composeur blanc : même échelle que les pastilles (largeur compensée). */
    .welcome-visual--home-agent .welcome-home-agent-card {
      align-self: center;
      width: calc(100% / var(--welcome-home-capsule-scale));
      transform: scale(var(--welcome-home-capsule-scale));
      transform-origin: top center;
    }
    /* Trait intérieur 1px : #e1e1e1 côté haut-gauche → fond de la carte (masque = anneau). */
    .welcome-home-agent-card::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      box-sizing: border-box;
      padding: 1px;
      pointer-events: none;
      background: linear-gradient(
        to bottom right,
        #e1e1e1 0%,
        var(--welcome-home-agent-card-surface) 48%,
        var(--welcome-home-agent-card-surface) 100%
      );
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask-composite: exclude;
    }
    .welcome-home-agent-head {
      display: flex;
      flex-direction: row;
      flex-wrap: nowrap;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-shrink: 0;
      height: 44px;
      min-height: 44px;
      max-height: 44px;
      padding: 0 16px;
      box-sizing: border-box;
      font-size: 13px;
      font-weight: 600;
      color: #7a7a7a;
      overflow: hidden;
    }
    .welcome-home-agent-head-title {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
      min-width: 0;
      flex: 1 1 0;
    }
    #welcome-home-agent-badge-label {
      flex: 1 1 0;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      text-align: start;
    }
    .welcome-home-import-badge {
      display: inline-flex;
      flex-direction: row;
      align-items: center;
      flex-shrink: 0;
      gap: 0;
      max-width: 100%;
      margin: 0;
      padding: 0;
      border: none;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      font-size: 13px;
      font-weight: 600;
      color: inherit;
      line-height: 1.2;
    }
    .welcome-home-import-badge:hover {
      background: transparent;
      border: none;
      box-shadow: none;
    }
    .welcome-home-import-badge--hidden {
      display: none !important;
    }
    .welcome-home-import-badge-label {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 140px;
    }
    .welcome-home-import-badge-clear {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 22px;
      height: 22px;
      margin: 0 0 0 2px;
      padding: 0;
      border: none;
      border-radius: 50%;
      background: transparent;
      color: #444444;
      cursor: pointer;
      flex-shrink: 0;
      opacity: 0;
      transform: scale(0.92);
      pointer-events: none;
      transition: opacity 0.15s ease, transform 0.15s ease, background 0.15s ease, color 0.15s ease;
    }
    .welcome-home-import-badge-clear svg {
      width: 14px;
      height: 14px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
    }
    .welcome-home-import-badge:hover .welcome-home-import-badge-clear,
    .welcome-home-import-badge:focus-within .welcome-home-import-badge-clear {
      opacity: 1;
      transform: scale(1);
      pointer-events: auto;
    }
    .welcome-home-import-badge-clear:hover {
      background: rgba(17, 17, 17, 0.06);
      color: #111111;
    }
    .welcome-home-import-badge-clear:focus-visible {
      opacity: 1;
      transform: scale(1);
      pointer-events: auto;
      outline: 2px solid #3b82f6;
      outline-offset: 1px;
    }
    @media (hover: none) {
      .welcome-home-import-badge-clear {
        opacity: 1;
        transform: none;
        pointer-events: auto;
      }
    }
    .welcome-home-agent-head-icon {
      flex-shrink: 0;
      display: inline-flex;
      width: 20px;
      height: 20px;
      color: currentColor;
    }
    .welcome-home-agent-head-icon svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.75;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .welcome-home-agent-compose {
      flex: 0 1 auto;
      width: auto;
      margin: 0 2px 2px;
      background: #ffffff;
      border-radius: var(--welcome-home-agent-inner-radius);
      padding: 14px 16px 12px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      box-sizing: border-box;
      overflow: hidden;
      min-width: 0;
    }
    .welcome-home-prompt-input {
      display: block;
      width: 100%;
      min-height: 0;
      margin: 0;
      padding: 4px 2px 6px;
      border: none;
      resize: none;
      overflow-y: hidden;
      font: inherit;
      font-size: 15px;
      line-height: 1.45;
      color: #111111;
      background: transparent;
      box-sizing: border-box;
    }
    .welcome-home-prompt-input::placeholder {
      color: #9ca3af;
    }
    .welcome-home-prompt-input:focus {
      outline: none;
    }
    .welcome-home-agent-actions {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      --welcome-home-agent-actions-gap: 8px;
      gap: var(--welcome-home-agent-actions-gap);
      flex-wrap: wrap;
      width: 100%;
      box-sizing: border-box;
      padding-top: 8px;
    }
    .welcome-home-agent-actions-tools {
      --welcome-home-tools-slot-gap: var(--welcome-home-agent-actions-gap);
      display: flex;
      flex-direction: row;
      align-items: center;
      flex-wrap: wrap;
      gap: var(--welcome-home-agent-actions-gap);
      min-width: 0;
      flex: 1 1 auto;
    }
    .welcome-home-record-slot {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: var(--welcome-home-tools-slot-gap, 6px);
      flex: 0 0 auto;
      min-width: 0;
    }
    .welcome-home-record-timer {
      display: none;
      flex: 0 0 auto;
      align-self: center;
      font-size: 13px;
      font-weight: 600;
      font-variant-numeric: tabular-nums;
      letter-spacing: 0.02em;
      color: #6b7280;
      min-width: 3.25em;
      text-align: center;
      line-height: var(--shell-header-control-size);
    }
    .welcome-home-agent-actions-tools.welcome-home-agent-actions-tools--recording
      .welcome-home-record-timer {
      display: inline-block;
      color: #dc2626;
    }
    /* Même visuel que .dashboard-game-ai-chat-send-btn (panneau quiz / Ask AI). */
    .welcome-home-send-btn {
      margin-left: auto;
      flex-shrink: 0;
      width: var(--shell-header-control-size);
      height: var(--shell-header-control-size);
      min-width: var(--shell-header-control-size);
      padding: 0;
      border: none;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      background: #f6f6f6;
      color: #111111;
      transition: background 0.15s ease, transform 0.15s ease;
    }
    .welcome-home-send-btn:hover {
      background: #ebebeb;
    }
    .welcome-home-send-btn:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .welcome-home-send-btn svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .welcome-home-attach-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-left: 0;
      box-sizing: border-box;
      border: none;
      background: #f6f6f6;
      color: #111111;
      font: inherit;
      cursor: pointer;
      flex-shrink: 0;
      transition: background 0.15s ease, transform 0.15s ease;
    }
    .welcome-home-attach-btn:hover {
      background: #ebebeb;
    }
    .welcome-home-attach-btn:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .welcome-home-attach-files-btn {
      gap: 6px;
      height: var(--shell-header-control-size);
      min-height: var(--shell-header-control-size);
      max-height: var(--shell-header-control-size);
      padding: 0 12px;
      border-radius: 10px;
      font-size: 13px;
      font-weight: 500;
      line-height: 1;
      width: auto;
      min-width: 0;
      color: #374151;
    }
    .welcome-home-attach-files-btn svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.65;
      stroke-linecap: round;
      stroke-linejoin: round;
      flex-shrink: 0;
    }
    .welcome-home-attach-files-btn.welcome-action-btn--tour-active {
      position: relative;
      z-index: 560;
      isolation: isolate;
      box-shadow: none;
    }
    .welcome-home-attach-files-btn.welcome-action-btn--tour-active::before {
      content: "";
      position: absolute;
      inset: calc(-1px - var(--xyz-tour-stroke-width));
      border-radius: calc(10px + var(--xyz-tour-stroke-width));
      box-sizing: border-box;
      padding: var(--xyz-tour-stroke-width);
      background: var(--xyz-gradient-blue-cyan);
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask-composite: exclude;
      pointer-events: none;
      z-index: -1;
    }
    .welcome-home-record-btn {
      gap: 0;
      width: var(--shell-header-control-size);
      height: var(--shell-header-control-size);
      min-width: var(--shell-header-control-size);
      min-height: var(--shell-header-control-size);
      max-height: var(--shell-header-control-size);
      padding: 0;
      border-radius: 10px;
      border: 1.5px solid transparent;
      box-sizing: border-box;
    }
    .welcome-home-record-btn svg,
    .welcome-home-plugins-btn svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
      stroke-linecap: round;
      stroke-linejoin: round;
      flex-shrink: 0;
    }
    .welcome-home-plugins-wrap {
      position: relative;
      display: inline-flex;
      flex-shrink: 0;
      align-items: center;
    }
    /* fixed + append sur document.body à l’ouverture : au-dessus du cadre arrondi (pas clip overflow). */
    .welcome-home-plugins-menu {
      position: fixed;
      z-index: 5000;
      top: 0;
      left: 0;
      width: max-content;
      min-width: min(240px, calc(100vw - 32px));
      max-width: min(280px, calc(100vw - 32px));
      padding: 4px;
      margin: 0;
      list-style: none;
      box-sizing: border-box;
      background: #ffffff;
      border: 1px solid var(--app-ui-border);
      border-radius: 10px;
      box-shadow: none;
    }
    .welcome-home-plugins-menu.hidden {
      display: none !important;
    }
    .welcome-home-plugins-item {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      gap: 10px;
      width: 100%;
      margin: 0;
      padding: 8px 10px;
      border: none;
      border-radius: 7px;
      background: transparent;
      color: #111111;
      font: inherit;
      font-size: 13px;
      font-weight: 600;
      text-align: left;
      cursor: pointer;
      line-height: 1.25;
      transition: background 0.12s ease;
      box-sizing: border-box;
    }
    .welcome-home-plugins-item:hover {
      background: #f3f4f6;
    }
    .welcome-home-plugins-item:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 0;
    }
    .welcome-home-plugins-item-icon {
      display: inline-flex;
      flex-shrink: 0;
      align-items: center;
      justify-content: center;
      width: 20px;
      height: 20px;
      line-height: 0;
      pointer-events: none;
      color: #374151;
    }
    .welcome-home-plugins-item-icon svg {
      width: 18px;
      height: 18px;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.65;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .welcome-home-record-btn.welcome-action-btn--recording {
      background: #f6f6f6;
      color: #dc2626;
      border-color: #dc2626;
    }
    .welcome-home-record-btn.welcome-action-btn--recording:hover {
      background: #ebebeb;
      color: #b91c1c;
      border-color: #b91c1c;
    }
    .welcome-home-record-btn.welcome-action-btn--tour-active {
      position: relative;
      z-index: 560;
      isolation: isolate;
      box-shadow: none;
    }
    .welcome-home-record-btn.welcome-action-btn--tour-active::before {
      content: "";
      position: absolute;
      inset: calc(-1px - var(--xyz-tour-stroke-width));
      border-radius: calc(10px + var(--xyz-tour-stroke-width));
      box-sizing: border-box;
      padding: var(--xyz-tour-stroke-width);
      background: var(--xyz-gradient-blue-cyan);
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask-composite: exclude;
      pointer-events: none;
      z-index: -1;
    }
    /* Gouttières modérées (le scale() ne grossit pas la boîte layout). */
    .welcome-home-presets {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-content: center;
      align-items: center;
      gap: clamp(10px, 2vw, 14px);
      width: 100%;
      max-width: 100%;
      margin-left: auto;
      margin-right: auto;
      padding: 6px 4px;
      box-sizing: border-box;
    }
    /* Accueil vide : largeur limitée pour passer sur ~2 lignes (ex. 3 + 2), lignes centrées au wrap. */
    .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-home-presets {
      max-width: min(100%, 30rem);
    }

    .welcome-home-spotlight {
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 4px;
      width: 100%;
      max-width: min(100%, calc(30rem + 50px));
      margin: 0 auto;
      padding: clamp(1.5rem, 5.5vh, 3.75rem) 4px max(12px, env(safe-area-inset-bottom));
      box-sizing: border-box;
    }
    .welcome-home-spotlight-viewport {
      position: relative;
      overflow: hidden;
      --welcome-home-spotlight-slide-gap: 24px;
      /* 75px zone texte min + 12px padding vertical ×2 */
      min-height: clamp(calc(75px + 24px), 18vw, 7.5rem);
    }
    .welcome-home-spotlight-slide {
      position: absolute;
      left: 0;
      right: 0;
      top: 0;
      margin: 0;
      /* Pas de padding à droite : l’image occupe le bord du rectangle arrondi. */
      padding: 12px 0 12px 20px;
      border-radius: 14px;
      border: none;
      background: #f6f6f6;
      color: #111111;
      text-align: start;
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      min-height: 0;
      overflow: hidden;
      opacity: 1;
      visibility: visible;
      z-index: 0;
      pointer-events: none;
      transform: translateX(calc(100% + var(--welcome-home-spotlight-slide-gap)));
      transition: transform 0.42s cubic-bezier(0.32, 0.72, 0, 1);
      will-change: transform;
    }
    .welcome-home-spotlight-slide--instant {
      transition: none !important;
    }
    .welcome-home-spotlight-slide-inner {
      display: flex;
      flex-direction: row;
      align-items: stretch;
      gap: 12px;
      flex: 1 1 auto;
      min-width: 0;
      min-height: 75px;
    }
    .welcome-home-spotlight-slide-copy {
      flex: 1 1 0;
      min-width: 0;
      text-align: start;
      align-self: center;
    }
    /* Emplacement réservé à droite (pas d’image pour l’instant) : décale le texte et montre la zone. */
    .welcome-home-spotlight-slide-media {
      flex: 0 0 auto;
      width: clamp(72px, 20%, 100px);
      align-self: stretch;
      margin-block: -12px;
      margin-inline-end: 0;
      border-radius: 0 14px 14px 0;
      overflow: hidden;
      background: rgba(17, 17, 17, 0.055);
      border-inline-start: 1px dashed rgba(17, 17, 17, 0.14);
      box-sizing: border-box;
    }
    .welcome-home-spotlight-slide--off-right {
      transform: translateX(calc(100% + var(--welcome-home-spotlight-slide-gap)));
      z-index: 1;
    }
    .welcome-home-spotlight-slide--off-left {
      transform: translateX(calc(-100% - var(--welcome-home-spotlight-slide-gap)));
      z-index: 1;
    }
    .welcome-home-spotlight-slide--active {
      transform: translateX(0);
      z-index: 2;
      pointer-events: auto;
    }
    @media (prefers-reduced-motion: reduce) {
      .welcome-home-spotlight-slide {
        transition: none;
      }
    }
    .welcome-home-spotlight-slide-title {
      margin: 0 0 4px;
      font-size: 14px;
      font-weight: 700;
      letter-spacing: -0.02em;
      line-height: 1.25;
      color: #111111;
      text-align: start;
    }
    .welcome-home-spotlight-slide-desc {
      margin: 0;
      font-size: 13px;
      font-weight: 500;
      line-height: 1.45;
      color: #4b5563;
      text-align: start;
    }
    .welcome-home-spotlight-dots {
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      gap: 10px;
      margin: 0;
      padding: 0;
      flex-shrink: 0;
    }
    .welcome-home-spotlight-dot {
      width: 8px;
      height: 8px;
      padding: 0;
      border: none;
      border-radius: 999px;
      background: #d1d5db;
      cursor: pointer;
      transition:
        background 0.2s ease,
        transform 0.2s ease;
      box-sizing: border-box;
    }
    .welcome-home-spotlight-dot:hover {
      background: #9ca3af;
    }
    .welcome-home-spotlight-dot:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .welcome-home-spotlight-dot.is-active {
      background: #111111;
      transform: scale(1.2);
    }

    .welcome-home-preset {
      display: inline-flex;
      flex-direction: row;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 8px 14px;
      flex: 0 1 auto;
      margin: 0;
      border-radius: 10px;
      border: 1.5px solid var(--app-ui-border);
      background: #ffffff;
      color: #111111;
      font: inherit;
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
      line-height: 1.2;
      transition:
        background 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease,
        transform 0.15s ease;
    }
    .welcome-home-preset:hover {
      background: #fafafa;
    }
    /* Sélection : mêmes teintes que le bouton Upgrade du header (.nav-plan-cta--upgrade). */
    .welcome-home-preset[aria-pressed="true"] {
      border-color: rgba(var(--app-upgrade-rgb), 0.32);
      background: var(--app-upgrade-bg);
      color: var(--app-upgrade-text);
    }
    .welcome-home-preset[aria-pressed="true"]:hover {
      background: var(--app-upgrade-bg-hover);
      color: var(--app-upgrade-text);
    }
    .welcome-home-preset:focus-visible {
      outline: 2px solid var(--app-upgrade-text);
      outline-offset: 2px;
    }
    .welcome-home-preset-icon {
      display: inline-flex;
      flex-shrink: 0;
      align-items: center;
      justify-content: center;
      line-height: 0;
      pointer-events: none;
    }
    .welcome-home-preset-icon svg {
      width: 16px;
      height: 16px;
      stroke: currentColor;
      fill: none;
      stroke-width: 1.5;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    .welcome-home-preset--recording {
      border-color: #fecaca;
      background: #fff5f5;
      color: #b91c1c;
    }
    .welcome-home-preset--recording:hover {
      background: #fee2e2;
    }
    .welcome-home-preset--recording[aria-pressed="true"] {
      border-color: #991b1b;
      background: #b91c1c;
      color: #ffffff;
    }
    .welcome-home-learn-xyz .welcome-home-learn-xyz-icon img {
      display: block;
      width: 16px;
      height: 16px;
      object-fit: contain;
    }

    .welcome-home-preset.welcome-action-btn--tour-active {
      position: relative;
      z-index: 560;
      isolation: isolate;
      box-shadow: none;
    }
    .welcome-home-preset.welcome-action-btn--tour-active::before {
      content: "";
      position: absolute;
      inset: calc(-2px - var(--xyz-tour-stroke-width));
      border-radius: calc(10px + var(--xyz-tour-stroke-width));
      box-sizing: border-box;
      padding: var(--xyz-tour-stroke-width);
      background: var(--xyz-gradient-blue-cyan);
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask-composite: exclude;
      pointer-events: none;
      z-index: -1;
    }

    /* Remplace le bloc Home : fond clair comme le reste du shell */
    .welcome-record-panel {
      flex: 1;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-height: 0;
      width: 100%;
      padding: 20px 20px 40px;
      box-sizing: border-box;
      text-align: center;
      border-radius: 0;
      background: #ffffff;
      border: none;
      overflow: hidden;
    }
    .welcome-record-panel.hidden {
      display: none !important;
    }
    .welcome-record-panel-inner {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      width: 100%;
      max-width: 440px;
      min-height: 0;
      flex: 1;
    }
    .welcome-record-panel-center {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 28px;
      flex: 1;
      justify-content: center;
      width: 100%;
    }
    .welcome-record-panel-status {
      margin: 0;
      font-size: 17px;
      font-weight: 500;
      letter-spacing: -0.02em;
      color: #111111;
    }
    /* Sphère « Uplearn AI » : halo conique, double nébuleuse, 3 anneaux, noyau iridescent + voix (variables sur le wrap) */
    .welcome-record-orb-wrap {
      --welcome-record-pulse: 1;
      --welcome-record-aura: 1;
      --welcome-record-aura-o: 0.55;
      position: relative;
      width: 208px;
      height: 208px;
      display: grid;
      place-items: center;
      transform: scale(var(--welcome-record-pulse));
      transform-origin: center center;
      will-change: transform;
    }
    .welcome-record-orb-wrap > * {
      grid-area: 1 / 1;
    }
    .welcome-record-orb-chroma {
      width: 228px;
      height: 228px;
      border-radius: 50%;
      background: conic-gradient(
        from 220deg,
        #7c3aed 0deg,
        #22d3ee 72deg,
        #f472b6 160deg,
        #a78bfa 250deg,
        #14b8a6 320deg,
        #7c3aed 360deg
      );
      opacity: 0.36;
      filter: blur(22px);
      pointer-events: none;
      animation: welcome-record-chroma-drift 14s linear infinite;
    }
    @keyframes welcome-record-chroma-drift {
      to {
        transform: rotate(360deg);
      }
    }
    .welcome-record-orb-nebula {
      width: 172px;
      height: 172px;
      border-radius: 50%;
      pointer-events: none;
      filter: blur(20px);
      transform: scale(var(--welcome-record-aura));
      opacity: var(--welcome-record-aura-o);
      will-change: transform, opacity;
    }
    .welcome-record-orb-nebula--a {
      background: radial-gradient(
        circle at 30% 40%,
        rgba(34, 211, 238, 0.5) 0%,
        rgba(124, 58, 237, 0.14) 55%,
        transparent 72%
      );
    }
    .welcome-record-orb-nebula--b {
      background: radial-gradient(
        circle at 72% 58%,
        rgba(244, 114, 182, 0.38) 0%,
        rgba(167, 139, 250, 0.18) 50%,
        transparent 70%
      );
    }
    .welcome-record-orb-ring {
      border-radius: 50%;
      pointer-events: none;
      box-sizing: border-box;
    }
    .welcome-record-orb-ring--a {
      width: 198px;
      height: 198px;
      border: 1.5px solid transparent;
      border-top-color: rgba(124, 58, 237, 0.4);
      border-right-color: rgba(34, 211, 238, 0.22);
      animation: welcome-record-spin 11s linear infinite;
    }
    .welcome-record-orb-ring--b {
      width: 216px;
      height: 216px;
      border: 1px solid transparent;
      border-bottom-color: rgba(244, 114, 182, 0.35);
      border-left-color: rgba(167, 139, 250, 0.2);
      animation: welcome-record-spin-rev 7.5s linear infinite;
    }
    .welcome-record-orb-ring--c {
      width: 182px;
      height: 182px;
      border: 1px dashed rgba(17, 24, 39, 0.1);
      border-top-color: rgba(20, 184, 166, 0.42);
      animation: welcome-record-spin 5.2s linear infinite;
    }
    @keyframes welcome-record-spin {
      to {
        transform: rotate(360deg);
      }
    }
    @keyframes welcome-record-spin-rev {
      to {
        transform: rotate(-360deg);
      }
    }
    .welcome-record-orb-core {
      position: relative;
      z-index: 2;
      width: 108px;
      height: 108px;
      border-radius: 50%;
      overflow: hidden;
      background:
        radial-gradient(ellipse 78% 58% at 30% 18%, rgba(255, 255, 255, 0.92) 0%, transparent 48%),
        radial-gradient(circle at 78% 82%, rgba(244, 114, 182, 0.4) 0%, transparent 42%),
        radial-gradient(circle at 18% 88%, rgba(34, 211, 238, 0.35) 0%, transparent 48%),
        linear-gradient(152deg, #3b0764 0%, #5b21b6 22%, #0e7490 48%, #312e81 78%, #1e1b4b 100%);
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.35),
        inset 0 -12px 28px rgba(0, 0, 0, 0.35),
        0 0 0 1px rgba(255, 255, 255, 0.22) inset,
        0 18px 50px rgba(91, 33, 182, 0.2),
        0 8px 24px rgba(15, 118, 110, 0.12);
    }
    .welcome-record-orb-core::after {
      content: "";
      position: absolute;
      inset: -40%;
      border-radius: 50%;
      background: linear-gradient(
        105deg,
        transparent 35%,
        rgba(255, 255, 255, 0.14) 48%,
        transparent 62%
      );
      animation: welcome-record-shimmer 4.5s ease-in-out infinite;
      pointer-events: none;
    }
    @keyframes welcome-record-shimmer {
      0%,
      100% {
        transform: translate(-18%, -12%) rotate(0deg);
        opacity: 0.5;
      }
      50% {
        transform: translate(12%, 8%) rotate(18deg);
        opacity: 0.85;
      }
    }
    .welcome-record-timer {
      font-size: 34px;
      font-weight: 300;
      font-variant-numeric: tabular-nums;
      letter-spacing: 0.04em;
      color: #111111;
      line-height: 1;
    }
    .welcome-record-stop-btn {
      margin-top: auto;
      margin-bottom: max(8px, env(safe-area-inset-bottom));
      padding: 14px 36px;
      border: none;
      border-radius: 999px;
      font: inherit;
      font-size: 16px;
      font-weight: 600;
      color: #ffffff;
      background: rgba(255, 59, 48, 0.92);
      cursor: pointer;
      box-shadow: none;
      transition: background 0.15s ease, transform 0.12s ease;
    }
    .welcome-record-stop-btn:hover {
      background: #ff3b30;
    }
    .welcome-record-stop-btn:active {
      transform: scale(0.97);
    }
    .welcome-record-stop-btn:focus-visible {
      outline: 2px solid #111111;
      outline-offset: 3px;
    }
    @media (prefers-reduced-motion: reduce) {
      .welcome-record-orb-chroma,
      .welcome-record-orb-ring--a,
      .welcome-record-orb-ring--b,
      .welcome-record-orb-ring--c,
      .welcome-record-orb-core::after {
        animation: none !important;
      }
    }

    .welcome-quick-actions-block,
    .welcome-get-started-block {
      width: min(100%, var(--welcome-actions-row-width));
      margin-left: auto;
      margin-right: auto;
      text-align: left;
    }
    .welcome-quick-actions-block {
      margin-top: 0;
    }
    .welcome-get-started-block {
      margin-top: 36px;
    }
    /* Décalage = rayon des cartes (20px) pour aligner avec le visuel des blocs arrondis */
    .welcome-section-heading {
      margin: 0 0 12px;
      padding-left: 20px;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.02em;
      color: #9ca3af;
      text-transform: none;
      box-sizing: border-box;
    }
    .welcome-actions-panel {
      border-radius: 20px;
      border: 1.5px solid var(--app-ui-border);
      background: #ffffff;
      box-shadow: none;
      padding: 6px 8px;
      box-sizing: border-box;
    }
    .welcome-action-check {
      position: relative;
      display: flex;
      width: 100%;
      align-items: center;
      gap: 14px;
      padding: 14px 14px;
      margin: 0;
      border: none;
      border-radius: 14px;
      background: transparent;
      cursor: pointer;
      font: inherit;
      text-align: left;
      color: #111111;
      transition: background 0.15s ease, padding-right 0.2s ease;
      box-sizing: border-box;
    }
    .welcome-action-check:hover {
      background: #f9fafb;
    }
    .welcome-action-check:hover:not(.welcome-action-check--locked):not([aria-disabled="true"]) {
      padding-right: 96px;
    }
    .welcome-action-check:focus-visible {
      outline: 2px solid var(--xyz-stroke-blue);
      outline-offset: 2px;
    }
    .welcome-action-check:focus-visible:not(.welcome-action-check--locked):not([aria-disabled="true"]) {
      padding-right: 96px;
    }
    .welcome-action-check-circle {
      position: relative;
      overflow: hidden;
      width: 22px;
      height: 22px;
      border-radius: 999px;
      border: 1.5px solid var(--app-ui-border);
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      background: transparent;
      transition:
        border-color 0.4s cubic-bezier(0.22, 1, 0.36, 1) 0.08s,
        background 0.4s cubic-bezier(0.22, 1, 0.36, 1) 0.08s;
    }
    /* Même bleu que badge Free : glisse de gauche à droite (effet « wipe ») */
    .welcome-action-check-circle::before {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      background: var(--app-upgrade-text);
      transform: scaleX(0);
      transform-origin: left center;
      transition: transform 0.58s cubic-bezier(0.22, 1, 0.36, 1);
      z-index: 0;
    }
    .welcome-action-check[aria-pressed="true"] .welcome-action-check-circle::before {
      transform: scaleX(1);
    }
    .welcome-action-check-circle svg {
      position: relative;
      z-index: 1;
      width: 12px;
      height: 12px;
      stroke: #ffffff;
      fill: none;
      stroke-width: 2.5;
      stroke-linecap: round;
      stroke-linejoin: round;
      opacity: 0;
      transform: translateX(-7px);
      transition: opacity 0.4s cubic-bezier(0.22, 1, 0.36, 1) 0.16s,
        transform 0.62s cubic-bezier(0.22, 1, 0.36, 1) 0.14s;
    }
    /* Trait du check : dessin progressif + glissement vers la droite */
    .welcome-action-check-circle svg path {
      stroke-dasharray: 1;
      stroke-dashoffset: 1;
      transition: stroke-dashoffset 0.62s cubic-bezier(0.33, 1, 0.68, 1) 0.16s;
    }
    .welcome-action-check[aria-pressed="true"] .welcome-action-check-circle {
      border-color: transparent;
      background: transparent;
    }
    .welcome-action-check[aria-pressed="true"] .welcome-action-check-circle svg {
      opacity: 1;
      transform: translateX(0);
      stroke: #ffffff;
    }
    .welcome-action-check[aria-pressed="true"] .welcome-action-check-circle svg path {
      stroke-dashoffset: 0;
    }
    @media (prefers-reduced-motion: reduce) {
      .welcome-action-check-circle,
      .welcome-action-check-circle::before,
      .welcome-action-check-circle svg,
      .welcome-action-check-circle svg path {
        transition-duration: 0.01ms !important;
        transition-delay: 0s !important;
      }
      .welcome-action-check[aria-pressed="true"] .welcome-action-check-circle svg {
        transform: none;
      }
      .welcome-action-check:not([aria-pressed="true"]) .welcome-action-check-circle svg {
        transform: none;
      }
    }
    .welcome-action-check-label {
      font-size: 15px;
      font-weight: 500;
      line-height: 1.35;
      flex: 1;
      min-width: 0;
    }
    .welcome-action-check-discover {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      font-size: 13px;
      font-weight: 600;
      letter-spacing: -0.02em;
      color: var(--app-upgrade-text);
      opacity: 0;
      transition: opacity 0.18s ease;
      pointer-events: none;
      white-space: nowrap;
    }
    .welcome-action-check:hover:not(.welcome-action-check--locked):not([aria-disabled="true"])
      .welcome-action-check-discover,
    .welcome-action-check:focus-visible:not(.welcome-action-check--locked):not([aria-disabled="true"])
      .welcome-action-check-discover {
      opacity: 1;
    }
    .welcome-action-check.welcome-action-check--locked,
    .welcome-action-check[aria-disabled="true"] {
      pointer-events: none;
      cursor: default;
      opacity: 0.82;
    }

    /* Tutoriel : fond bleu/cyan assez profond pour blanc + contour pastel */
    .dashboard-feature-tour {
      position: fixed;
      inset: 0;
      z-index: 550;
      pointer-events: none;
    }
    .dashboard-feature-tour.hidden {
      display: none;
    }
    .dashboard-feature-tour-capsule {
      position: fixed;
      width: min(300px, calc(100vw - 24px));
      padding: 16px 18px 14px;
      border-radius: 18px;
      border: var(--xyz-tour-stroke-width) solid transparent;
      background:
        var(--xyz-gradient-blue-cyan-deep) padding-box,
        var(--xyz-gradient-blue-cyan) border-box;
      overflow: visible;
      color: #ffffff;
      box-shadow: none;
      box-sizing: border-box;
      pointer-events: auto;
      opacity: 0;
      transform: scale(0.94) translateY(10px);
      transition:
        opacity 0.36s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        top 0.48s cubic-bezier(0.22, 1, 0.36, 1),
        left 0.48s cubic-bezier(0.22, 1, 0.36, 1),
        width 0.48s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .dashboard-feature-tour-capsule.dashboard-feature-tour-capsule--no-pos-transition {
      transition:
        opacity 0.36s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.42s cubic-bezier(0.22, 1, 0.36, 1),
        top 0s,
        left 0s,
        width 0s;
    }
    .dashboard-feature-tour-capsule.is-shown {
      opacity: 1;
      transform: scale(1) translateY(0);
    }
    @media (prefers-reduced-motion: reduce) {
      .dashboard-feature-tour-capsule,
      .dashboard-feature-tour-capsule.dashboard-feature-tour-capsule--no-pos-transition {
        transition-duration: 0.01ms !important;
      }
    }
    /*
     * Flèche SVG : base sans trait — descendre pour coller au arrondi de la capsule
     * (compense l’ancien décalage lié au stroke sur la base).
     */
    .dashboard-feature-tour-arrow {
      position: absolute;
      left: 50%;
      top: 0;
      width: 22px;
      height: 13px;
      transform: translate(-50%, -100%);
      transform-origin: center center;
      pointer-events: none;
      display: block;
      overflow: visible;
    }
    .dashboard-feature-tour-capsule.dashboard-feature-tour-capsule--above .dashboard-feature-tour-arrow {
      top: auto;
      bottom: 0;
      transform: translate(-50%, calc(100% - 8px)) scaleY(-1);
    }
    .dashboard-feature-tour-title {
      margin: 0 0 8px;
      font-size: 15px;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: #ffffff;
    }
    .dashboard-feature-tour-body {
      margin: 0 0 14px;
      font-size: 13px;
      line-height: 1.5;
      color: rgba(255, 255, 255, 0.9);
    }
    .dashboard-feature-tour-next {
      width: 100%;
      padding: 10px 14px;
      font: inherit;
      font-size: 14px;
      font-weight: 600;
      color: #3d5d7a;
      background: #ffffff;
      border: none;
      border-radius: 10px;
      cursor: pointer;
      transition: background 0.15s ease, transform 0.1s ease;
    }
    .dashboard-feature-tour-next:hover {
      background: #f3f4f6;
    }
    .dashboard-feature-tour-next:active {
      transform: scale(0.98);
    }
    .dashboard-feature-tour-next:focus-visible {
      outline: 2px solid rgba(255, 255, 255, 0.85);
      outline-offset: 2px;
    }
    .welcome-action-btn.welcome-action-btn--tour-active {
      position: relative;
      z-index: 560;
      isolation: isolate;
      box-shadow: none;
    }
    /*
     * Anneau hors du bouton : même trait que la capsule (2px, dégradé identique).
     * Containing block = padding du bouton : -1px bordure grise + -2px trait = -3px ;
     * rayon ext. = rayon bouton + 2px → coins parallèles au rounded rect du bouton.
     */
    .welcome-action-btn.welcome-action-btn--tour-active::before {
      content: "";
      position: absolute;
      inset: calc(-1px - var(--xyz-tour-stroke-width));
      border-radius: var(--xyz-tour-action-ring-outer-radius);
      box-sizing: border-box;
      padding: var(--xyz-tour-stroke-width);
      background: var(--xyz-gradient-blue-cyan);
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask-composite: exclude;
      pointer-events: none;
      z-index: -1;
    }

    .welcome-modal {
      position: fixed;
      inset: 0;
      z-index: 300;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
      box-sizing: border-box;
    }
    .welcome-modal.hidden {
      display: none;
    }
    .welcome-modal-backdrop {
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.35);
    }
    .welcome-modal-box {
      position: relative;
      width: 100%;
      max-width: 420px;
      padding: 22px 22px 18px;
      border-radius: 16px;
      background: #ffffff;
      border: 1.5px solid var(--app-ui-border);
      box-shadow: none;
    }
    .welcome-modal-box h2 {
      margin: 0 0 8px;
      font-size: 18px;
      font-weight: 700;
      letter-spacing: -0.02em;
      color: #111111;
    }
    .welcome-modal-hint {
      margin: 0 0 14px;
      font-size: 13px;
      line-height: 1.45;
      color: #6b7280;
    }
    .welcome-modal-box textarea {
      width: 100%;
      min-height: 120px;
      padding: 12px 14px;
      margin-bottom: 16px;
      font: inherit;
      font-size: 14px;
      line-height: 1.45;
      border-radius: 10px;
      border: 1.5px solid var(--app-ui-border);
      resize: vertical;
      box-sizing: border-box;
    }
    .welcome-modal-box textarea:focus {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .welcome-moodle-field {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-bottom: 12px;
    }
    .welcome-moodle-field label {
      font-size: 12px;
      font-weight: 600;
      color: #374151;
    }
    .welcome-moodle-input {
      width: 100%;
      padding: 10px 12px;
      font: inherit;
      font-size: 14px;
      border-radius: 10px;
      border: 1.5px solid var(--app-ui-border);
      box-sizing: border-box;
    }
    .welcome-moodle-input:focus {
      outline: 2px solid #111111;
      outline-offset: 2px;
    }
    .welcome-moodle-error {
      margin: 0 0 12px;
      font-size: 13px;
      color: #b91c1c;
    }
    .welcome-moodle-error.hidden {
      display: none !important;
    }
    .welcome-modal-actions {
      display: flex;
      justify-content: flex-end;
      gap: 10px;
    }
    .welcome-modal-actions button {
      padding: 10px 16px;
      font-size: 14px;
      font-weight: 600;
      border-radius: 8px;
      cursor: pointer;
      border: none;
      font-family: inherit;
    }
    .welcome-modal-cancel {
      background: #f3f4f6;
      color: #111111;
    }
    .welcome-modal-cancel:hover {
      background: #e5e7eb;
    }
    .welcome-modal-submit {
      background: #111111;
      color: #ffffff;
    }
    .welcome-modal-submit:hover {
      background: #333333;
    }
    a.welcome-modal-submit {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 10px 16px;
      font-size: 14px;
      font-weight: 600;
      border-radius: 8px;
      font-family: inherit;
      text-decoration: none;
      box-sizing: border-box;
    }

    .welcome-toast {
      position: fixed;
      bottom: 24px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 400;
      max-width: min(420px, calc(100vw - 32px));
      padding: 12px 18px;
      font-size: 14px;
      line-height: 1.4;
      color: #111111;
      background: #ffffff;
      border: 1.5px solid var(--app-ui-border);
      border-radius: 12px;
      box-shadow: none;
    }
    .welcome-toast.hidden {
      display: none;
    }
    .visually-hidden {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }
    @media (max-width: 768px) {
      .welcome-visual {
        --welcome-action-btn-width: min(100%, 300px);
        --welcome-actions-gap: 10px;
      }

      .welcome-actions {
        flex-direction: column;
        align-items: stretch;
        padding: 0;
        box-sizing: border-box;
      }

      .welcome-action-btn {
        width: 100%;
        max-width: 340px;
        margin-left: auto;
        margin-right: auto;
      }

      .welcome-home-agent-actions {
        flex-direction: row;
        justify-content: flex-start;
        align-items: center;
      }
      .welcome-home-attach-btn {
        width: auto;
      }
      .welcome-home-agent-actions-tools {
        flex: 1 1 auto;
        min-width: 0;
      }

      /* Centrage explicite : éviter que width:100% + max-width ne reste visuellement décalé. */
      .dashboard-welcome {
        padding-left: max(8px, env(safe-area-inset-left));
        padding-right: max(6px, env(safe-area-inset-right));
        padding-top: 16px;
        padding-bottom: max(24px, env(safe-area-inset-bottom));
      }
      .dashboard-welcome--ai-chat {
        padding-left: max(8px, env(safe-area-inset-left));
        padding-right: max(6px, env(safe-area-inset-right));
        padding-top: 12px;
        padding-bottom: max(24px, env(safe-area-inset-bottom));
      }
      .welcome-visual--home-agent {
        margin-left: auto;
        margin-right: auto;
        min-width: 0;
        box-sizing: border-box;
        --welcome-home-capsule-scale: 1.07;
      }
      .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-visual--home-agent {
        transform: none;
        /* Remplir la colonne scrollable : sinon le carrousel reste collé sous le header. */
        align-self: stretch;
        width: 100%;
        min-height: 0;
        /* basis 0 : la colonne occupe bien la hauteur utile sous le header (mobile). */
        flex: 1 1 0;
        isolation: isolate;
      }
      .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-home-hero {
        flex: 1 1 0;
        min-height: 0;
        width: 100%;
        position: relative;
        z-index: 1;
      }
      .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-home-spotlight {
        margin-top: auto;
        flex-shrink: 0;
        width: 100%;
        max-width: min(100%, calc(30rem + 50px));
        position: relative;
        z-index: 0;
        /* Desktop : 4px ; mobile : plus d’air entre les cartes et les indicateurs. */
        gap: clamp(14px, 4vw, 22px);
      }
      .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-home-stack {
        flex: 0 1 auto;
        min-height: 0;
      }
      .welcome-home-free-plan-pill {
        margin-bottom: 36px;
      }
      .welcome-home-help-lead {
        font-size: clamp(22px, 6.5vw, 32px);
        margin-bottom: 24px;
        padding: 0 14px;
      }
      .welcome-home-stack {
        margin-left: auto;
        margin-right: auto;
        min-width: 0;
        box-sizing: border-box;
      }

      .welcome-home-attach-files-btn {
        display: none !important;
      }
      /* Accueil : mêmes capsules que le desktop, une ligne scrollable sous le composeur. */
      .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-home-presets {
        display: flex !important;
        flex-wrap: nowrap;
        justify-content: flex-start;
        align-items: center;
        align-content: stretch;
        max-width: 100%;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding: 8px max(4px, env(safe-area-inset-left)) 10px max(4px, env(safe-area-inset-right));
        gap: clamp(10px, 2vw, 14px);
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
        scrollbar-width: thin;
      }
      .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-home-presets .welcome-home-preset {
        flex-shrink: 0;
      }
      .dashboard-welcome--ai-chat .welcome-home-presets {
        display: none !important;
      }

      /* Menu « + » : positionné au-dessus du champ ; éviter de couper le panneau. */
      .welcome-home-agent-card {
        overflow: visible;
      }
      .welcome-home-agent-compose {
        overflow: visible;
      }

      .welcome-modal {
        padding: max(12px, env(safe-area-inset-top)) max(6px, env(safe-area-inset-right))
          max(12px, env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
      }

      .welcome-modal-box {
        max-width: min(420px, calc(100vw - 16px));
      }
    }

/* --- Landing iframe : air sous la carte (scale ne grossit pas la boîte flex) + gaps capsules. --- */
body.landing-welcome-body .welcome-home-agent {
  gap: clamp(14px, 3.2vw, 28px);
}

body.landing-welcome-body .welcome-home-presets {
  margin-top: clamp(6px, 1.4vw, 14px);
  gap: clamp(10px, 2vw, 14px);
}

@media (max-width: 768px) {
  body.landing-welcome-body .dashboard-welcome:not(.dashboard-welcome--ai-chat) .welcome-home-presets {
    gap: clamp(10px, 2vw, 14px);
    margin-top: clamp(4px, 1.2vw, 12px);
  }
}