/* Banque — détails existants seulement.
   Actif sur #app > .page > .tx-page ou > .grille-banques.
   Toutes les règles sont réservées à l'écran : aucune impression modifiée. */
@media screen {
  body:has(#app > .page > .tx-page),
  body:has(#app > .page > .grille-banques) {
    --bd-bg:#081a23; --bd-surface:#172d36; --bd-raised:#203942; --bd-field:#102730;
    --bd-text:#eaf1ed; --bd-muted:#b6c8ce; --bd-cyan:#99dfdb; --bd-amber:#dfbc88;
    --bd-line:#49636d; --bd-positive:#abdccc; --bd-negative:#f0b4aa;
    --toile:var(--bd-bg); --encre:var(--bd-text); --sur-encre:var(--bd-bg); --sourd:#c4d5d8; --muet:var(--bd-muted);
    --trait:var(--bd-line); --bleu:var(--bd-cyan); --vert:var(--bd-positive);
    --ambre:var(--bd-amber); --rouge:var(--bd-negative);
    --verre:var(--bd-surface); --verre-bord:var(--bd-line);
    background-color:var(--bd-bg); color:var(--bd-text); color-scheme:dark;
  }
  body:has(#app > .page > .tx-page) #app,
  body:has(#app > .page > .grille-banques) #app {
    background:radial-gradient(ellipse at 12% 8%,#a8834214,transparent 52%),radial-gradient(ellipse at 92% 65%,#2d94a516,transparent 55%),var(--bd-bg);
  }
  #app > .page:has(> .tx-page),
  #app > .page:has(> .grille-banques) {
    padding-right:clamp(18px,4vw,64px); padding-left:clamp(18px,4vw,64px);
    color:var(--bd-text); scrollbar-width:thin; scrollbar-color:#54717b transparent;
  }
  #app > .page:has(> .tx-page) > .haut,
  #app > .page:has(> .grille-banques) > .haut {
    max-width:1160px; margin:0 auto; border-bottom:1px solid #49636d55;
    background:linear-gradient(#081a23 68%,#081a2300); color:var(--bd-muted);
  }
  #app > .page:has(> .tx-page) .haut .verre,
  #app > .page:has(> .grille-banques) .haut .verre {
    background-color:var(--bd-surface); color:var(--bd-text); border-color:var(--bd-line);
    box-shadow:inset 0 1px #a9d5dc15;
  }
  #app > .page:has(> .tx-page) .haut .rond:hover,
  #app > .page:has(> .grille-banques) .haut .rond:hover { background-color:var(--bd-raised); }
  #app > .page:has(> .tx-page) .haut .vue-bascule,
  #app > .page:has(> .grille-banques) .haut .vue-bascule { background-color:var(--bd-surface); color:var(--bd-muted); border-color:var(--bd-line); }
  #app > .page:has(> .tx-page) .haut .vue-bascule:hover,
  #app > .page:has(> .grille-banques) .haut .vue-bascule:hover { background-color:var(--bd-raised); color:var(--bd-text); }
  #app > .page:has(> .tx-page) .haut .avatar,
  #app > .page:has(> .grille-banques) .haut .avatar { background-color:#33483f; color:#efcfa0; border:1px solid #9c865653; }
  body:has(#app > .page > .tx-page) #app > .barre.verre,
  body:has(#app > .page > .grille-banques) #app > .barre.verre { background-color:var(--bd-surface); color:var(--bd-text); border-color:var(--bd-line); box-shadow:0 14px 36px #0005,inset 0 1px #b6d2d01a; }
  body:has(#app > .page > .tx-page) #app .barre .onglet.on,
  body:has(#app > .page > .grille-banques) #app .barre .onglet.on { background-color:#29434c; color:var(--bd-cyan); }
  body:has(#app > .page > .tx-page) #app .barre .micro,
  body:has(#app > .page > .grille-banques) #app .barre .micro,
  body:has(#app > .page > .tx-page) #app .composer .envoyer,
  body:has(#app > .page > .grille-banques) #app .composer .envoyer { background-color:var(--bd-cyan); color:#092930; box-shadow:0 7px 22px #65bdbb24; }
  #app > .page:has(> .tx-page) :is(a,button,input,textarea,select,[contenteditable]):focus-visible,
  #app > .page:has(> .grille-banques) :is(a,button,input,textarea,select,[contenteditable]):focus-visible {
    outline:2px solid var(--bd-cyan); outline-offset:4px;
  }
  #app > .page:has(> .tx-page) .tx-page {
    max-width:1100px; min-width:0; gap:23px; margin-top:30px;
    background-color:var(--bd-bg); color:var(--bd-text);
  }
  #app > .page:has(> .tx-page) .tx-haut {
    display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:start; gap:22px;
    padding:28px; border:1px solid #7563495c; border-radius:21px;
    background:radial-gradient(ellipse at 0 0,#a5834224,transparent 60%),linear-gradient(120deg,#1c3036,#132b35);
    box-shadow:inset 0 1px #e8cda41c,0 12px 35px #0002;
  }
  #app > .page:has(> .tx-page) .tx-haut > div { min-width:0; }
  #app > .page:has(> .tx-page) .tx-haut > .pastille {
    background-color:#344742!important; background-image:none!important; color:#edcfa3!important;
    border:1px solid #b694604d; box-shadow:inset 0 1px #e8d7b827,0 7px 18px #0003;
  }
  #app > .page:has(> .tx-page) .tx-haut .titre {
    font-size:clamp(24px,2.5vw,34px)!important; font-weight:500; line-height:1.2;
    letter-spacing:-.035em; overflow-wrap:anywhere; color:var(--bd-text);
  }
  #app > .page:has(> .tx-page) .tx-haut .etiq {
    font-size:11px; line-height:1.7; color:var(--bd-muted); font-weight:450;
  }
  #app > .page:has(> .tx-page) .tx-haut .sous {
    font-size:13px; line-height:1.8; color:#c2d6d7; overflow-wrap:anywhere;
  }
  #app > .page:has(> .tx-page) .tx-page .note {
    color:var(--bd-muted); font-size:12px; line-height:1.7; overflow-wrap:anywhere;
  }
  #app > .page:has(> .tx-page) .tx-page .solde-xl {
    font-size:clamp(27px,3vw,42px)!important; line-height:1.15; letter-spacing:-.04em;
    font-weight:450; overflow-wrap:anywhere; white-space:normal;
  }
  #app > .page:has(> .tx-page) .tx-page .pastille-etat {
    background-color:#243e47; color:var(--bd-text); border:1px solid #5c7d8566;
    font-size:10px; font-weight:500; min-height:25px; height:auto; max-width:100%;
    padding:5px 10px; line-height:1.5; white-space:normal; overflow-wrap:anywhere;
  }
  #app > .page:has(> .tx-page) .tx-page .pastille-etat.vert { background-color:#213e39; color:var(--bd-positive); border-color:#608f7f70; }
  #app > .page:has(> .tx-page) .tx-page .pastille-etat.ambre { background-color:#3b3428; color:var(--bd-amber); border-color:#ad895466; }
  #app > .page:has(> .tx-page) .tx-justif {
    background-color:var(--bd-surface); color:var(--bd-text); background-image:radial-gradient(ellipse at 50% 100%,#679f9812,transparent 75%);
    border:1px solid var(--bd-line); border-radius:20px; min-height:236px; padding:34px;
    box-shadow:inset 0 1px #abc5c31a,0 12px 34px #0002;
  }
  #app > .page:has(> .tx-page) .tx-justif.survol { border-color:var(--bd-cyan); box-shadow:0 0 0 3px #99dfdb45; }
  #app > .page:has(> .tx-page) .tx-justif-vide { max-width:760px; width:100%; line-height:1.6; color:var(--bd-text); }
  #app > .page:has(> .tx-page) .tx-justif-vide > span:first-child[style] {
    background-color:#3b3e31!important; color:var(--bd-amber)!important; border:1px solid #a68c5855;
  }
  #app > .page:has(> .tx-page) .tx-gestes { grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; }
  #app > .page:has(> .tx-page) .tx-geste {
    min-width:0; min-height:135px; padding:19px 16px; gap:8px; border-color:var(--bd-line);
    background-color:var(--bd-surface); color:var(--bd-text); border-radius:15px;
    box-shadow:inset 0 1px #a2c8cc12; transition:background-color 150ms,border-color 150ms;
  }
  #app > .page:has(> .tx-page) .tx-geste:hover { background-color:var(--bd-raised); border-color:#789b9e; transform:none; }
  #app > .page:has(> .tx-page) .tx-geste .ico { color:var(--bd-cyan); margin-bottom:4px; }
  #app > .page:has(> .tx-page) .tx-geste b { font-size:13px; font-weight:500; }
  #app > .page:has(> .tx-page) .tx-geste small { font-size:11px; line-height:1.6; color:var(--bd-muted); white-space:normal; overflow-wrap:anywhere; }
  #app > .page:has(> .tx-page) .tx-geste kbd { color:#bbced1; background-color:#102730; border-color:#536f78; font-size:9px; }
  #app > .page:has(> .tx-page) .tx-page .bloc.verre {
    background-color:var(--bd-surface); color:var(--bd-text); border-color:var(--bd-line);
    border-radius:18px; box-shadow:inset 0 1px #a9c9c71a,0 10px 25px #0002;
  }
  #app > .page:has(> .tx-page) #tx-feuille .bloc { padding:24px; gap:15px; }
  #app > .page:has(> .tx-page) #tx-note,
  #app > .page:has(> .tx-page) .sep-l input,
  #app > .page:has(> .tx-page) .sep-l select {
    min-width:0; width:100%; background-color:var(--bd-field)!important; color:var(--bd-text)!important;
    border-width:1px!important; border-style:solid!important; border-color:var(--bd-line)!important;
    border-radius:10px; padding:11px 13px; font:inherit; font-size:13px; line-height:1.6; color-scheme:dark;
  }
  #app > .page:has(> .tx-page) #tx-note { min-height:120px; resize:vertical; }
  #app > .page:has(> .tx-page) #tx-note::placeholder { color:var(--bd-muted); opacity:1; }
  #app > .page:has(> .tx-page) .sep-l { grid-template-columns:minmax(0,1fr) 130px minmax(160px,220px); gap:10px; }
  #app > .page:has(> .tx-page) .tx-page .plein,
  #app > .page:has(> .grille-banques) .grille-banques .plein {
    background-color:#dfbc88; background-image:linear-gradient(120deg,#ead0a6,#c9aa7c); color:#18282c;
    border:1px solid #d1b386; border-radius:11px; font-size:12px; font-weight:550;
    min-height:38px; height:auto; padding:10px 14px; white-space:normal; line-height:1.5;
  }
  #app > .page:has(> .tx-page) .tx-page .creux,
  #app > .page:has(> .grille-banques) .grille-banques .creux {
    background-color:var(--bd-raised); color:var(--bd-text); border:1px solid var(--bd-line); border-radius:11px;
    font-size:12px; font-weight:500; min-height:38px; height:auto; padding:9px 13px; white-space:normal; line-height:1.5;
  }
  #app > .page:has(> .tx-page) .tx-page .creux:hover,
  #app > .page:has(> .grille-banques) .grille-banques .creux:hover { background-color:#2d4a54; border-color:#719397; }
  #app > .page:has(> .tx-page) .tx-page button:disabled,
  #app > .page:has(> .grille-banques) .grille-banques button:disabled { opacity:.52; cursor:not-allowed; }
  #app > .page:has(> .tx-page) .tx-page .champ[contenteditable]:focus { outline:2px solid var(--bd-cyan); outline-offset:5px; border-radius:5px; }
  #app > .page:has(> .grille-banques) .grille-banques { grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr)); max-width:1160px; margin:26px auto 0; gap:20px; }
  #app > .page:has(> .grille-banques) .carte-banque {
    background-color:var(--bd-surface); color:var(--bd-text); background-image:linear-gradient(130deg,#22404a33,transparent);
    border:1px solid var(--bd-line); border-top:3px solid #608b88; border-radius:20px; padding:24px;
    box-shadow:inset 0 1px #a9caca17,0 14px 35px #0002;
  }
  #app > .page:has(> .grille-banques) .carte-banque.ambre { border-top-color:var(--bd-amber); }
  #app > .page:has(> .grille-banques) .carte-banque.rouge { border-top-color:var(--bd-negative); }
  #app > .page:has(> .grille-banques) .cb-haut { flex-wrap:wrap; gap:14px; align-items:start; }
  #app > .page:has(> .grille-banques) .cb-haut > div { min-width:0; overflow-wrap:anywhere; }
  #app > .page:has(> .grille-banques) .cb-haut .gestes { flex-basis:100%; }
  #app > .page:has(> .grille-banques) .cb-logo { background-color:#33483f; color:#efcfa0; border:1px solid #9c865653; font-size:17px; font-weight:500; }
  #app > .page:has(> .grille-banques) .cb-etat { font-size:12px; line-height:1.6; color:var(--bd-muted); }
  #app > .page:has(> .grille-banques) .cb-comptes { border-color:var(--bd-line); margin-top:6px; }
  #app > .page:has(> .grille-banques) .cb-compte {
    display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px;
    margin-top:9px; padding:14px 12px; border:1px solid #41616d70; border-radius:11px;
    background-color:var(--bd-field); color:var(--bd-text); min-width:0; font-size:13px;
  }
  #app > .page:has(> .grille-banques) .cb-compte:hover { background-color:var(--bd-raised); border-color:#729796; }
  #app > .page:has(> .grille-banques) .cb-compte > span { min-width:0; overflow-wrap:anywhere; }
  #app > .page:has(> .grille-banques) .cb-compte > b { min-width:0; overflow-wrap:anywhere; font-weight:500; }
  #app > .page:has(> .grille-banques) .cb-compte small,
  #app > .page:has(> .grille-banques) .cb-pied,
  #app > .page:has(> .grille-banques) .carte-banque .note { color:var(--bd-muted); font-size:11px; line-height:1.7; }
  #app > .page:has(> .grille-banques) .ajouter-banque {
    background-color:#182c31; color:var(--bd-text); border-color:#8c785466; border-radius:20px;
    padding:30px 24px; min-width:0; min-height:220px; box-shadow:none;
  }
  #app > .page:has(> .grille-banques) .ajouter-banque:hover { background-color:#223b3d; border-color:#b29b6f; }
  #app > .page:has(> .grille-banques) .ajouter-banque .plus { background-color:#3d4434; color:var(--bd-amber); border:1px solid #9b815355; }
  #app > .page:has(> .grille-banques) .ajouter-banque .note { color:var(--bd-muted); }
  #app > .page:has(> .grille-banques) .ajouter-banque .trois { flex-wrap:wrap; justify-content:center; }
  #app > .page:has(> .grille-banques) .ajouter-banque .trois span { color:#c8dad5; background-color:#28413e; font-size:10px; }
  #app > .page:has(> .grille-banques) .porte-a { background-color:var(--bd-surface); color:var(--bd-muted); border-color:var(--bd-line); }
  #app > .page:has(> .grille-banques) .porte-a:hover { background-color:var(--bd-raised); color:var(--bd-text); }
  #app > .page:has(> .grille-banques) .porte-a.on { background-color:#2b494e; color:var(--bd-cyan); border-color:#618e91; }
  body:has(#app > .page > .tx-page) > .menu-plus,
  body:has(#app > .page > .grille-banques) > .menu-plus {
    background-color:var(--bd-surface); color:var(--bd-text); border-color:var(--bd-line);
    box-shadow:0 20px 55px #0008,inset 0 1px #9ad6dc19; max-height:calc(100dvh - 32px); overflow-y:auto;
  }
  body:has(#app > .page > .tx-page) > .menu-plus button,
  body:has(#app > .page > .grille-banques) > .menu-plus button { color:var(--bd-text); font-size:12px; padding:12px; }
  body:has(#app > .page > .tx-page) > .menu-plus button:hover,
  body:has(#app > .page > .grille-banques) > .menu-plus button:hover { background-color:var(--bd-raised); }
  body:has(#app > .page > .tx-page) > .menu-plus button:focus-visible,
  body:has(#app > .page > .grille-banques) > .menu-plus button:focus-visible { outline:2px solid var(--bd-cyan); outline-offset:-2px; }
  body:has(#app > .page > .tx-page) > .menu-plus button.danger,
  body:has(#app > .page > .grille-banques) > .menu-plus button.danger { color:var(--bd-negative); }
  @media (max-width:960px) {
    #app > .page:has(> .tx-page) .tx-haut { grid-template-columns:auto minmax(0,1fr); }
    #app > .page:has(> .tx-page) .tx-haut > div:last-child { grid-column:1 / -1; text-align:left!important; padding-top:16px; border-top:1px solid #54696555; }
    #app > .page:has(> .tx-page) .tx-gestes { grid-template-columns:repeat(3,minmax(0,1fr)); }
  }
  @media (max-width:760px) {
    #app > .page:has(> .tx-page) .tx-page { margin-top:20px; gap:18px; }
    #app > .page:has(> .tx-page) .tx-haut { gap:15px; padding:22px; }
    #app > .page:has(> .tx-page) .tx-haut > .pastille { width:52px!important; height:52px!important; border-radius:16px!important; font-size:19px!important; }
    #app > .page:has(> .tx-page) .tx-gestes { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
    #app > .page:has(> .tx-page) .tx-geste { min-height:122px; padding:16px; }
    #app > .page:has(> .tx-page) .tx-justif { padding:27px 20px; }
    #app > .page:has(> .tx-page) #tx-feuille .bloc { padding:20px; }
    #app > .page:has(> .tx-page) .sep-l { grid-template-columns:repeat(2,minmax(0,1fr)); }
    #app > .page:has(> .tx-page) .sep-nom { grid-column:1 / -1; }
    #app > .page:has(> .grille-banques) .carte-banque { padding:20px; }
  }
  @media (max-width:480px) {
    #app > .page:has(> .tx-page) .tx-haut { padding:20px 16px; gap:12px; }
    #app > .page:has(> .tx-page) .tx-page .solde-xl { font-size:32px!important; }
    #app > .page:has(> .grille-banques) .cb-compte { grid-template-columns:auto minmax(0,1fr); }
    #app > .page:has(> .grille-banques) .cb-compte > b { grid-column:2; }
  }
  @media (prefers-reduced-motion:reduce) {
    #app > .page:has(> .tx-page) .tx-geste,
    #app > .page:has(> .tx-page) .tx-justif,
    #app > .page:has(> .grille-banques) .ajouter-banque,
    body:has(#app > .page > .tx-page) > .menu-plus,
    body:has(#app > .page > .grille-banques) > .menu-plus { transition:none!important; animation:none!important; }
  }
}