/* Rappli Partenaires (partenaires.html) : retouche visuelle du 25/10/2026, demandée par le propriétaire (« exactement le
   même travail » que sur les sections « SMS » et « Félicitations » de l'accueil : la forme seulement, ni texte ni
   fonctionnement). Feuille propre à cette page, chargée après sa part (feuilles/pages-partenaires.css) et avant la
   coquille partagée : chaque sélecteur commence par « .rp-page main » pour passer devant la coquille.
   Langage visuel de l'accueil (docs/design/IDENTITE-V10.md, 24/10/2026) : cartes à identité propre avec un en-tête
   teinté et un filet, pictogrammes au trait dans une pastille blanche, coches dans une pastille, flèche des liens dans
   une pastille qui se remplit au survol et au focus clavier, bulle de SMS verte avec sa queue, jetons seulement, mélangés
   en color-mix(in oklab, …). Code couleur de la page : bleu pour l'agence et son espace, vert pour le client.
   Balisage ajouté dans la page : trois pictogrammes d'encart (svg.ptd-mark, aria-hidden, sans texte). */

/* 1. Jetons de la page (mêmes recettes que les cartes de l'accueil). */
.rp-page main.sol-page{
  --ptd-blue-tint:color-mix(in oklab,var(--rp-blue-highlight) 8%,var(--rappli-white));
  --ptd-blue-edge:color-mix(in oklab,var(--rp-blue-highlight) 18%,var(--rappli-white));
  --ptd-blue-soft:color-mix(in oklab,var(--rp-blue-highlight) 12%,var(--rappli-white));
  --ptd-green-tint:color-mix(in oklab,var(--rappli-green-bright) 9%,var(--rappli-white));
  --ptd-green-edge:color-mix(in oklab,var(--rappli-green-bright) 22%,var(--rappli-white));
  --ptd-green-soft:color-mix(in oklab,var(--rappli-green-bright) 14%,var(--rappli-white));
  /* Bulle de SMS : vert Rappli éclairci de vert vif (38 %), texte blanc à 5,35:1 (le vert vif des bulles de l'accueil,
     avec du texte blanc, reste sous 4,5:1 : choix du propriétaire pour l'accueil seulement). */
  --ptd-sms:color-mix(in oklab,var(--rappli-green) 62%,var(--rappli-green-bright));
  --ptd-ink:var(--rappli-blue);
  --ptd-tint:var(--ptd-blue-tint);
  --ptd-edge:var(--ptd-blue-edge);
  --ptd-soft:var(--ptd-blue-soft);
  --ptd-pad:var(--rappli-space-5);
  --ptd-mark:48px
}
.rp-page main :is(.pt-role--client,.pt-payer--client,.pt-roles-flow--in){--ptd-ink:var(--rappli-green);--ptd-tint:var(--ptd-green-tint);--ptd-edge:var(--ptd-green-edge);--ptd-soft:var(--ptd-green-soft)}

/* 2. Liens « texte » : la flèche passe dans une pastille bleue qui se remplit au survol (pointeurs fins) et au focus
   clavier, comme « Voir les tarifs » sur l'accueil. L'anneau de focus de la charte reste. */
.rp-page main .text-link .icon{width:32px;height:32px;padding:8px;border-radius:50%;background:var(--ptd-blue-soft);color:var(--rappli-blue);stroke-width:2;transition:transform var(--rappli-fast) var(--rappli-ease),background-color var(--rappli-fast) var(--rappli-ease),color var(--rappli-fast) var(--rappli-ease)}
.rp-page main .text-link:focus-visible .icon{background:var(--rappli-blue);color:var(--rappli-white)}
@media(hover:hover) and (pointer:fine){
  .rp-page main .text-link:hover .icon{background:var(--rappli-blue);color:var(--rappli-white)}
}
.rp-page main .text-link--wrap .icon{vertical-align:middle;margin:-8px 0 -6px 10px}

/* 3. En-tête de page : repères avec leur coche dans une pastille verte. */
.rp-page main .rp-reassurance .icon{width:22px;height:22px;padding:4px;border-radius:50%;background:var(--ptd-green-soft);color:var(--rappli-green);stroke-width:3}

/* 4. « À qui s'adresse Rappli Partenaires » : les trois profils dans une bande teintée (bleu : l'agence), pictogramme
   dans une pastille blanche. */
.rp-page main .pt-profiles{border:1px solid var(--ptd-blue-edge);border-radius:var(--rappli-radius-card);background:var(--ptd-blue-tint);overflow:hidden;overflow:clip}
.rp-page main .pt-profiles>li{gap:var(--rappli-space-3);padding:var(--rappli-space-6) var(--rappli-space-5)}
.rp-page main .pt-profiles>li+li{border-color:var(--ptd-blue-edge)}
.rp-page main .pt-profiles .sol-icon{width:var(--ptd-mark);height:var(--ptd-mark);padding:calc((var(--ptd-mark) - 24px) / 2);border:1px solid var(--ptd-blue-edge);border-radius:var(--rappli-radius-control);background:var(--rappli-white);box-shadow:var(--rappli-shadow-light);color:var(--rappli-blue);stroke-width:1.7}

/* Le SMS reçu par la personne qui appelle : une carte de messagerie. En-tête teinté de bleu (le SMS avec formulaire est
   bleu sur l'accueil), expéditeur dans une pastille, bulle verte avec sa queue, comme les bulles de l'accueil. */
.rp-page main .pt-sms-screen{padding:0 0 var(--rappli-space-5);overflow:hidden;overflow:clip;border:1px solid var(--rappli-line);background:var(--rappli-white);box-shadow:var(--rappli-shadow-card)}
.rp-page main .pt-sms-from{margin:0 0 var(--rappli-space-5);padding:var(--rappli-space-4) var(--rappli-space-5);border-bottom:1px solid var(--ptd-blue-edge);background:var(--ptd-blue-tint)}
.rp-page main .pt-sms-from .rp-phone-avatar{width:40px;height:40px;border:1px solid var(--ptd-blue-edge);background:var(--rappli-white);box-shadow:var(--rappli-shadow-light);color:var(--rappli-blue);font-size:17px}
.rp-page main .pt-sms-bubble{position:relative;max-width:calc(100% - 2 * var(--rappli-space-5) - 8px);margin-inline:calc(var(--rappli-space-5) + 8px) var(--rappli-space-5);padding:var(--rappli-space-3) var(--rappli-space-4);border-radius:20px 20px 20px 4px;background:var(--ptd-sms);box-shadow:none;color:var(--rappli-white);font-weight:600;line-height:1.5}
.rp-page main .pt-sms-bubble::before{content:"";position:absolute;bottom:0;left:-8px;width:16px;height:22px;background:var(--ptd-sms);clip-path:path("M8 0H16V22H0C4.5 20.5 8 16.5 8 9Z")}
.rp-page main .pt-sms-bubble .rp-token{background:var(--rappli-white);color:var(--rappli-green)}
.rp-page main .pt-sms-bubble .rp-token--link{background:none;color:var(--rappli-white);font-weight:700}
/* 30/10/2026, demande du propriétaire : ce SMS est le SMS avec formulaire, sa bulle prend le bleu des bulles de l'iPhone
   (--sms-blue, même valeur que sur l'accueil, posé sur la bulle par feuilles/pages-partenaires.css), queue comprise, texte blanc à 4,59:1 ; le repère reste blanc, écrit en bleu
   Rappli (le lien reste blanc : :not(), sinon cette règle, plus loin, le passait en bleu sur bleu). Le vert --ptd-sms n'est plus utilisé par la bulle. Contraste forcé : inchangé (§ 12, le système impose ses couleurs). */
.rp-page main .pt-sms-bubble,.rp-page main .pt-sms-bubble::before{background:var(--sms-blue)}
.rp-page main .pt-sms-bubble .rp-token:not(.rp-token--link){color:var(--rappli-blue)}
/* Repères de la bulle et lien de l'encart « appel découverte » : en ligne et d'un seul tenant, comme en production
   (relecture du 25/10, R2 : en « inline-block », le repère faisait lire « [nom de votre client] . » aux lecteurs
   d'écran, et le lien laissait le « : » commencer une ligne). Ils se coupent seulement quand la carte devient trop
   étroite pour eux, c'est-à-dire avec un texte agrandi : requêtes de conteneur en rem + px (largeur mesurée du bloc
   insécable + marges fixes de la carte) ; sans requêtes de conteneur, ils restent d'un seul tenant comme avant.
   Bulle : « [nom de votre client]. » mesure 9,7rem, la carte prend 88 px autour (marges et marges intérieures de la
   bulle). Le point qui suit le repère s'en détache légèrement. */
.rp-page main .pt-sms-bubble .rp-token{margin-inline-end:.06em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.rp-page main :is(.pt-sms-screen,#votre-projet>.sol-wrap){container-type:inline-size}
@container (width < calc(9.75rem + 90px)){
  .rp-page main .pt-sms-bubble .rp-token{white-space:normal}
}

/* 5. Cartes à identité propre (« Vous les accompagnez » et « Comment fonctionne la facturation ? ») : en-tête teinté du
   haut de la carte jusqu'au titre compris, filet dessous, pictogramme dans une pastille blanche à côté du titre. */
.rp-page main :is(.pt-role,.pt-payer){position:relative;isolation:isolate;padding:var(--ptd-pad);border-color:var(--rappli-line);box-shadow:var(--rappli-shadow-card)}
.rp-page main :is(.pt-role,.pt-payer)::before{content:"";position:absolute;z-index:-1;grid-row:auto/2;grid-column:auto/auto;inset:0;border-bottom:1px solid var(--ptd-edge);border-radius:calc(var(--rappli-radius-card) - 1px) calc(var(--rappli-radius-card) - 1px) 0 0;background:var(--ptd-tint)}
.rp-page main :is(.pt-role-icon,.pt-payer-icon){width:var(--ptd-mark);height:var(--ptd-mark);border:1px solid var(--ptd-edge);border-radius:var(--rappli-radius-control);background:var(--rappli-white);box-shadow:var(--rappli-shadow-light);color:var(--ptd-ink)}
.rp-page main :is(.pt-role-icon,.pt-payer-icon) .sol-icon{width:calc(var(--ptd-mark) / 2 + 2px);height:calc(var(--ptd-mark) / 2 + 2px);stroke-width:1.6}

/* « Vous les accompagnez. Ils gardent leur compte. » */
.rp-page main .pt-role{display:grid;grid-template-columns:minmax(0,1fr);align-content:start}
.rp-page main .pt-role h3{gap:var(--rappli-space-4);margin:0;padding-bottom:var(--ptd-pad)}
.rp-page main .pt-role .sol-check-list{margin-top:var(--ptd-pad)}
.rp-page main .pt-role .sol-check-list .sol-icon{width:22px;height:22px;margin-top:calc((1.55em - 22px) / 2);padding:4px;border-radius:50%;background:var(--ptd-soft);color:var(--ptd-ink);stroke-width:3}
/* Les deux sens de la relation : étiquette dans une pastille à la couleur de celui qui agit, flèche partant d'un point. */
.rp-page main .pt-roles-flow>span:not(.pt-arrow){justify-self:center;padding:3px 12px;white-space:nowrap;border:1px solid var(--ptd-edge);border-radius:var(--rappli-radius-pill);background:var(--ptd-soft);color:var(--ptd-ink)}
.rp-page main .pt-roles-flow{gap:var(--rappli-space-3)}
.rp-page main .pt-arrow{color:var(--ptd-ink)}
.rp-page main .pt-arrow::before{content:"";position:absolute;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;background:currentColor}
.rp-page main .pt-roles-flow--out .pt-arrow::before{left:-3px}
.rp-page main .pt-roles-flow--in .pt-arrow::before{right:-3px}

@media(min-width:1024px){
  .rp-page main .pt-roles{grid-template-columns:minmax(0,1fr) max-content minmax(0,1fr)}
}

/* « Comment fonctionne la facturation ? » : pictogramme et titre dans l'en-tête, explication dessous, pleine largeur. */
.rp-page main .pt-payer{grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:var(--rappli-space-4);row-gap:0;align-items:center}
.rp-page main .pt-payer-icon{grid-row:1;margin-bottom:var(--ptd-pad)}
.rp-page main .pt-payer h3{min-height:0;margin-bottom:var(--ptd-pad)}
.rp-page main .pt-payer p{grid-column:1/-1;align-self:start;margin-top:var(--ptd-pad)}

/* 6. Notes rattachées à une section : un encart à pictogramme (renvoi d'appel, facture, rendez-vous). */
.rp-page main :is(.pt-steps-note,.pt-payers-note,.pt-form-alt){position:relative;padding:var(--rappli-space-4) var(--rappli-space-5) var(--rappli-space-4) calc(var(--rappli-space-5) + 44px + var(--rappli-space-4));border:1px solid var(--rappli-line);border-radius:var(--rp-radius-tile);text-align:left;text-wrap:pretty}
.rp-page main .ptd-mark{position:absolute;top:50%;left:var(--rappli-space-5);width:44px;height:44px;margin-top:-22px;padding:10px;border:1px solid var(--ptd-blue-edge);border-radius:var(--rappli-radius-control);background:var(--rappli-white);box-shadow:var(--rappli-shadow-light);fill:none;stroke:var(--rappli-blue);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.rp-page main .ptd-mark .ptd-accent{stroke:var(--rp-blue-highlight)}
.rp-page main .pt-steps-note{max-width:44rem;background:var(--rappli-surface);color:var(--rappli-ink)}
.rp-page main .pt-payers-note{max-width:var(--rappli-measure-tool);margin-top:var(--rappli-space-5);background:var(--rappli-white);box-shadow:var(--rappli-shadow-light)}
.rp-page main .pt-form-alt{width:fit-content;max-width:min(100%,680px);background:var(--rappli-surface);color:var(--rappli-ink);text-wrap:balance}

/* 7. « Comment démarrer ? » : la dernière étape, la mise en route chez le client, prend le vert du client (même
   pastille que l'étape « C'est activé. » de l'accueil). */
.rp-page main .pt-timeline>li:last-child .rp-step-number{border-color:color-mix(in oklab,var(--rappli-green) 40%,var(--rappli-white));background:color-mix(in oklab,var(--rappli-green-bright) 12%,var(--rappli-white));color:var(--rappli-green)}

/* 8. Questions : le « + » passe dans une pastille qui se remplit quand la réponse est ouverte. */
.rp-page main .faq-list summary>.sol-icon{width:32px;height:32px;padding:8px;border-radius:50%;background:var(--ptd-blue-soft);color:var(--rappli-blue);stroke-width:2;transition:transform var(--rappli-state) var(--rappli-ease),background-color var(--rappli-fast) var(--rappli-ease),color var(--rappli-fast) var(--rappli-ease)}
@media(hover:hover) and (pointer:fine){
  .rp-page main .faq-list summary:hover>.sol-icon{background:var(--ptd-blue-edge)}
}
.rp-page main .faq-list details:not(.faq-enhanced)[open]:not([data-closing]) summary>.sol-icon,.rp-page main .faq-list .is-open summary>.sol-icon{background:var(--rappli-blue);color:var(--rappli-white)}

/* 9. Formulaire : les champs facultatifs dans un encart, distincts des trois informations demandées. */
.rp-page main .pt-form .pt-optional{padding:var(--rappli-space-5);border:1px solid var(--rappli-line);border-radius:var(--rp-radius-tile);background:var(--rp-surface-soft)}

/* 10. Tailles selon la largeur (pastilles : 44, 48 puis 52 px, comme sur l'accueil). */
@media(max-width:359px){
  .rp-page main.sol-page{--ptd-mark:44px}
  .rp-page main .pt-role h3{gap:var(--rappli-space-3)}
}
@media(min-width:768px){
  .rp-page main.sol-page{--ptd-pad:var(--rappli-space-6);--ptd-mark:52px}
}
@media(max-width:1023px){
  /* Cartes l'une sous l'autre : flèches verticales, le point au départ. */
  .rp-page main .pt-roles-flow--out .pt-arrow::before{top:-3px;left:50%;margin:0 0 0 -4px}
  .rp-page main .pt-roles-flow--in .pt-arrow::before{top:auto;right:auto;bottom:-3px;left:50%;margin:0 0 0 -4px}
  /* Étiquettes d'une ligne tant qu'il y a la place ; avec un texte agrandi (200 % à 600 px), elles passent sur deux
     lignes au lieu de sortir de l'écran (relecture du 25/10). */
  .rp-page main .pt-roles-link{grid-template-columns:repeat(2,minmax(0,max-content))}
  .rp-page main .pt-roles-flow{grid-template-columns:minmax(0,auto) auto}
  .rp-page main .pt-roles-flow--in{grid-template-columns:auto minmax(0,auto)}
  .rp-page main .pt-roles-flow>span:not(.pt-arrow){white-space:normal}
}
@media(max-width:640px){
  .rp-page main .rp-links-row .text-link--wrap{padding-right:calc(32px + var(--rappli-space-3))}
  .rp-page main .rp-links-row .text-link--wrap .icon{margin:-16px 0 0}
  /* Encarts : pictogramme plus petit, toujours à gauche du texte, aligné sur la première ligne. */
  .rp-page main :is(.pt-steps-note,.pt-payers-note,.pt-form-alt){padding:var(--rappli-space-4) var(--rappli-space-4) var(--rappli-space-4) calc(var(--rappli-space-4) + 36px + var(--rappli-space-3))}
  .rp-page main .ptd-mark{top:var(--rappli-space-4);left:var(--rappli-space-4);width:36px;height:36px;margin-top:-2px;padding:7px;border-radius:var(--rappli-radius-field)}
}
@media(max-width:560px){
  /* Les deux sens côte à côte, chacun en colonne : « Vous l'accompagnez » au-dessus de sa flèche vers le bas,
     « Il choisit vos accès » sous sa flèche vers le haut. */
  .rp-page main .pt-roles-link{grid-template-columns:repeat(2,minmax(0,max-content));justify-content:center;justify-items:center;gap:var(--rappli-space-5)}
  .rp-page main .pt-roles-flow{grid-template-columns:none;grid-auto-flow:row;justify-items:center;gap:var(--rappli-space-2)}
  .rp-page main .pt-roles-flow>span:not(.pt-arrow){white-space:normal;text-align:center}
  .rp-page main .pt-arrow{height:32px}
}
@media(max-width:374px){
  /* Étiquettes sur deux lignes : coins moins ronds. */
  .rp-page main .pt-roles-link{gap:var(--rappli-space-4)}
  .rp-page main .pt-roles-flow>span:not(.pt-arrow){border-radius:var(--rappli-radius-field)}
  /* Encarts sur petit téléphone (relecture R5) : le pictogramme passe au-dessus du texte, qui reprend toute la
     largeur de l'encart (à 320 px, environ 250 px de texte au lieu de 190). */
  .rp-page main :is(.pt-steps-note,.pt-payers-note,.pt-form-alt){padding:var(--rappli-space-4)}
  .rp-page main .ptd-mark{position:static;display:block;margin:0 0 var(--rappli-space-3)}
}
/* Lien « Réservez un appel découverte » suivi de « : » (13,5rem mesurés) : coupé seulement s'il ne tient plus sur une ligne de
   l'encart (largeur du conteneur moins bordure et marges intérieures de l'encart, qui changent à 375 et 641 px). */
@media(min-width:641px){
  @container (width < calc(13.8rem + 112px)){.rp-page main .pt-form-alt a{white-space:normal}}
}
@media(min-width:375px) and (max-width:640px){
  @container (width < calc(13.8rem + 84px)){.rp-page main .pt-form-alt a{white-space:normal}}
}
@media(max-width:374px){
  @container (width < calc(13.8rem + 36px)){.rp-page main .pt-form-alt a{white-space:normal}}
}
/* « Vous les accompagnez » sur téléphone, texte agrandi : les deux colonnes se partagent la largeur à parts égales ;
   quand une moitié ne contient plus « l'accompagnez » (5,9rem) dans sa pastille (26 px), écart de 24 px compris, les
   deux étiquettes passent l'une sous l'autre au lieu de couper le mot. À la taille normale, elles restent côte à côte. */
@media(max-width:560px){
  .rp-page main .pt-roles{container-type:inline-size}
  @container (width < calc(12rem + 78px)){.rp-page main .pt-roles-link{grid-template-columns:minmax(0,max-content)}}
}
@media(max-width:600px){
  .rp-page main .pt-profiles>li{padding:var(--rappli-space-4)}
  .rp-page main .pt-profiles>li+li{border-top-color:var(--ptd-blue-edge)}
  .rp-page main.sol-page .pt-profiles{--ptd-mark:44px}
}
@media(max-width:400px){
  .rp-page main .pt-form .pt-optional{padding:var(--rappli-space-4)}
  .rp-page main .faq-list summary{gap:var(--rappli-space-4)}
}
/* Texte agrandi à 200 % sur petit téléphone (relecture du 25/10) : un mot plus large que sa place se coupe au lieu
   d'être rogné par la bande des profils ou de sortir de l'écran (« communication », « l'accompagnez »,
   « accompagnement ») ; sans effet à la taille normale, où chaque mot tient. */
.rp-page main :is(.pt-profiles>li>span,.pt-optional legend),.rp-page main .pt-roles-flow>span:not(.pt-arrow){overflow-wrap:anywhere}

/* 11. Mouvement : un seul, lié au défilement. Les flèches de « Vous les accompagnez » se tracent depuis leur point de
   départ (découpe progressive, la pointe apparaît en dernier) pendant qu'elles entrent à l'écran. Seulement sans
   préférence de mouvement réduit et si le navigateur lie l'animation au défilement ; ailleurs, flèches entières. */
@media(prefers-reduced-motion:no-preference){
  @supports(animation-timeline:view()){
    .rp-page main .pt-arrow{animation:ptd-trace-droite linear both;animation-timeline:view();animation-range:entry 30% cover 45%}
    .rp-page main .pt-roles-flow--in .pt-arrow{animation-name:ptd-trace-gauche}
  }
}
@media(prefers-reduced-motion:no-preference) and (max-width:1023px){
  @supports(animation-timeline:view()){
    .rp-page main .pt-roles-flow--out .pt-arrow{animation-name:ptd-trace-bas}
    .rp-page main .pt-roles-flow--in .pt-arrow{animation-name:ptd-trace-haut}
  }
}
/* -8px : la pointe et le point dépassent du trait de 2 px ; la découpe les garde entiers. */
@keyframes ptd-trace-droite{from{clip-path:inset(-8px 100% -8px -8px)}to{clip-path:inset(-8px)}}
@keyframes ptd-trace-gauche{from{clip-path:inset(-8px -8px -8px 100%)}to{clip-path:inset(-8px)}}
@keyframes ptd-trace-bas{from{clip-path:inset(-8px -8px 100% -8px)}to{clip-path:inset(-8px)}}
@keyframes ptd-trace-haut{from{clip-path:inset(100% -8px -8px -8px)}to{clip-path:inset(-8px)}}
@media(prefers-reduced-motion:reduce){
  .rp-page main :is(.text-link .icon,.faq-list summary>.sol-icon){transition:none}
  .rp-page main .pt-arrow{animation:none}
}

/* 12. Contraste forcé : en-têtes en Canvas avec filet, pastilles et encarts encadrés, traits en CanvasText. */
@media(forced-colors:active){
  .rp-page main :is(.pt-role,.pt-payer)::before{background:Canvas;border-bottom-color:CanvasText}
  .rp-page main :is(.pt-role-icon,.pt-payer-icon,.pt-profiles .sol-icon,.ptd-mark,.pt-sms-from .rp-phone-avatar){border:1px solid CanvasText;background:Canvas;color:CanvasText;box-shadow:none}
  .rp-page main .ptd-mark,.rp-page main .ptd-mark .ptd-accent{stroke:CanvasText}
  .rp-page main :is(.pt-profiles,.pt-profiles>li+li,.pt-sms-from,.pt-steps-note,.pt-payers-note,.pt-form-alt,.pt-form .pt-optional){border-color:CanvasText;box-shadow:none}
  .rp-page main .pt-sms-from{background:Canvas}
  .rp-page main .pt-sms-bubble{border:1px solid CanvasText;background:Canvas;color:CanvasText}
  .rp-page main .pt-sms-bubble::before{display:none}
  .rp-page main .pt-sms-bubble .rp-token{border:1px solid CanvasText;background:Canvas;color:CanvasText}
  .rp-page main .pt-sms-bubble .rp-token--link{border:0;color:CanvasText}
  .rp-page main :is(.rp-reassurance .icon,.pt-role .sol-check-list .sol-icon){background:Canvas;color:CanvasText}
  .rp-page main .pt-roles-flow>span:not(.pt-arrow){border-color:CanvasText;background:Canvas;color:CanvasText}
  .rp-page main .pt-arrow::before{background:CanvasText}
  .rp-page main :is(.text-link .icon,.faq-list summary>.sol-icon){border:1px solid currentColor;background:Canvas;color:inherit}
}