:root{color-scheme:light;--paper:#fff;--paper-2:#F5F8FC;--ink:#0E141C;
  --ink-soft:#48566A;--ink-faint:#78889E;--rule:#D3DEEC;--accent:#1148D0;
  --accent-wash:#EAF0FE;--stamp:#A8371F;--ok:#0E7A46;--fond:#F3F8FF;
  --f-display:"Source Serif 4",Georgia,"Times New Roman",serif;
  --f-body:"Source Sans 3","Segoe UI",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Consolas,monospace}
*{box-sizing:border-box}
body{margin:0;background:var(--fond);color:var(--ink);font-family:var(--f-body);
  font-size:1.02rem;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}
.barre{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;
  padding:.9rem clamp(1rem,4vw,2.5rem);background:var(--paper);
  border-bottom:1px solid var(--rule)}
.marque{font-family:var(--f-display);font-weight:700;font-size:1.15rem;
  color:var(--ink);text-decoration:none}
.marque span{color:var(--accent)}
.rubrique{color:var(--ink-faint);font-size:.95rem}
.langues{margin-left:auto;display:flex;gap:.25rem}
.langues a{font-family:var(--f-mono);font-size:.78rem;text-decoration:none;
  color:var(--ink-soft);padding:.2rem .45rem;border-radius:6px}
.langues a[aria-current="true"]{color:var(--accent);background:var(--accent-wash)}
main{margin:0 auto;padding:clamp(1.5rem,5vw,3.5rem) 1rem 3rem}
main.etroit{max-width:26rem}
main.large{max-width:52rem}
main.moyen{max-width:36rem}
.carte{background:var(--paper);border:1px solid var(--rule);border-radius:14px;
  padding:clamp(1.25rem,4vw,2rem);box-shadow:0 18px 40px -28px rgb(17 72 208/.35)}
h1{font-family:var(--f-display);font-size:clamp(1.5rem,1.2rem + 1.2vw,2rem);
  line-height:1.2;margin:0 0 .4rem}
h2{font-family:var(--f-display);font-size:1.2rem;margin:2rem 0 .8rem}
.intro{color:var(--ink-soft);margin:0 0 1.4rem}
label{display:block;font-weight:600;font-size:.92rem;margin:1rem 0 .35rem}
input{width:100%;font:inherit;padding:.65rem .8rem;border:1px solid var(--rule);
  border-radius:9px;background:var(--paper-2);color:var(--ink)}
input:focus{outline:2px solid var(--accent);outline-offset:1px;background:#fff}
input.code{font-family:var(--f-mono);font-size:1.3rem;letter-spacing:.35em;
  text-align:center}
button,.bouton{display:inline-flex;align-items:center;justify-content:center;
  font:inherit;font-weight:600;border:0;border-radius:999px;cursor:pointer;
  padding:.7rem 1.4rem;background:var(--accent);color:#fff;text-decoration:none}
form.pleine button{width:100%;margin-top:1.5rem}
button.discret{background:none;color:var(--ink-soft);border:1px solid var(--rule);
  padding:.45rem 1rem;font-weight:400}
.message{border-radius:9px;padding:.7rem .9rem;margin:0 0 1rem;font-size:.95rem;
  background:#FDF0EC;color:var(--stamp);border:1px solid #F2C9BD}
.message.ok{background:#E9F6EF;color:var(--ok);border-color:#BFE3CE}
.demo{background:#FFF7E6;color:#8A5300;border-bottom:1px solid #F2D9A6;
  font-size:.88rem;padding:.5rem clamp(1rem,4vw,2.5rem)}
.sous{margin-top:1rem;font-size:.9rem;color:var(--ink-faint);text-align:center}
.tete{display:flex;align-items:flex-start;gap:1rem;flex-wrap:wrap}
.tete .qui{flex:1;min-width:14rem}
.tete .qui p{margin:0;color:var(--ink-soft)}
.fichiers{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(18rem,1fr))}
.fichier{display:flex;flex-direction:column;gap:.5rem}
.fichier h3{margin:0;font-size:1.05rem}
.fichier p{margin:0;color:var(--ink-soft);font-size:.95rem}
.fichier .meta{font-size:.82rem;color:var(--ink-faint)}
.fichier .empreinte{font-family:var(--f-mono);font-size:.7rem;word-break:break-all;
  color:var(--ink-faint)}
.fichier .bouton{align-self:flex-start;margin-top:.4rem}
.puce{align-self:flex-start;font-family:var(--f-mono);font-size:.75rem;
  text-transform:uppercase;letter-spacing:.06em;color:#B45309;
  border:1px solid currentColor;border-radius:6px;padding:.15rem .5rem}
.note{margin-top:1.6rem;font-size:.88rem;color:var(--ink-soft);
  border-left:3px solid var(--rule);padding-left:.9rem}
.qr{display:block;margin:1rem auto;image-rendering:pixelated;width:220px;height:220px}
.cle{font-family:var(--f-mono);font-size:.85rem;word-break:break-all;text-align:center;
  color:var(--ink-soft)}
.ou{text-align:center;color:var(--ink-faint);font-size:.9rem;margin:1.1rem 0 .7rem}
button.secondaire{width:100%;background:var(--paper);color:var(--ink);
  border:1px solid var(--rule)}
button.secondaire:hover{border-color:var(--accent);color:var(--accent)}
.cles{list-style:none;padding:0;margin:.4rem 0 1rem;display:grid;gap:.5rem}
.cles li{display:flex;align-items:center;gap:.8rem;border:1px solid var(--rule);
  border-radius:10px;padding:.55rem .8rem}
.cles .nom{font-weight:600}
.cles .meta{font-size:.82rem;color:var(--ink-faint);flex:1}
.cles form{margin:0}
.cles button{padding:.35rem .8rem;font-size:.85rem}
#cle-ajouter{margin-top:.2rem}
select{width:100%;font:inherit;padding:.55rem .7rem;border:1px solid var(--rule);
  border-radius:9px;background:var(--paper-2);color:var(--ink);margin-bottom:.8rem}
form.v2 button{align-self:flex-start;margin-top:.4rem}
form.changer{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin:.2rem 0}
form.changer label{margin:0}
form.changer select{width:auto;margin:0;padding:.4rem .6rem}
.tete .meta{font-size:.85rem;color:var(--ink-faint)}
.expo .meta{margin:0;font-size:.85rem;color:var(--ink-faint)}
.expo .montant{font-family:var(--f-display);font-size:1.6rem;margin:.25rem 0 0}
.tableau{overflow-x:auto;padding:0;position:relative}
.dossiers{width:100%;border-collapse:collapse;font-size:.9rem}
.dossiers th,.dossiers td{text-align:left;padding:.55rem .75rem;
  border-bottom:1px solid var(--rule);vertical-align:top}
.dossiers th{font-size:.75rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--ink-faint);font-weight:600}
.dossiers .nombre{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.dossiers .mono{font-family:var(--f-mono);font-size:.78rem}
.dossiers .hors{display:block;font-size:.75rem;color:var(--ink-faint)}
.masque{color:var(--ink-faint);text-align:center;
  background:repeating-linear-gradient(135deg,var(--paper-2) 0 4px,var(--paper) 4px 8px)}
.a-venir{display:inline-block;font-size:.75rem;padding:0 .5rem;white-space:nowrap;
  border:1px dashed var(--ink-faint);border-radius:999px;color:var(--ink-soft)}
/* Lu par les lecteurs d'écran, pas affiché. En `absolute`, il lui faut un
   ancêtre positionné : sinon un tableau qui défile le laisse déborder la page. */
.lecteur{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.bandeau{margin:1rem 0 0;padding:.55rem .85rem;border-radius:9px;color:var(--ink);
  background:var(--accent-wash);border-left:3px solid var(--accent)}
.frise{display:flex;align-items:center;gap:3px;list-style:none;margin:.4rem 0 0;padding:0}
.frise li{width:1.3rem;height:4px;border-radius:2px;background:var(--rule)}
.frise li.fait{background:var(--ink-faint)}
.frise li.courant{height:6px;background:var(--ink-soft)}
.frise li.ecart{width:9px;height:9px;border-radius:50%;margin-left:3px;background:var(--ink-soft)}
.frise li.ok{background:var(--ok)}
.frise li.info{background:var(--accent)}
.frise li.warn{background:#8A5300}
.frise li.ko{background:var(--stamp)}
.legende{list-style:none;padding:0;margin:.9rem 0 0;display:grid;gap:.45rem;
  font-size:.82rem;color:var(--ink-soft)}
.legende>li{display:flex;align-items:center;gap:.6rem}
.legende .frise{margin:0;flex:none}
.legende .masque{flex:none;padding:0 .7rem;border-radius:4px;border:1px solid var(--rule)}
.legende .a-venir{flex:none}
.etat{display:inline-block;font-size:.78rem;padding:.1rem .5rem;border-radius:999px;
  background:var(--paper-2);border:1px solid var(--rule);white-space:nowrap}
.etat.ok{background:#E9F6EF;color:var(--ok);border-color:#BFE3CE}
.etat.info{background:var(--accent-wash);color:var(--accent);border-color:#C9D8FB}
.etat.warn{background:#FFF7E6;color:#8A5300;border-color:#F2D9A6}
.etat.ko{background:#FBECE8;color:var(--stamp);border-color:#F0C9BF}
/* ── Le hub en tuiles (12/10) ─────────────────────────────────────────── */
.hub-tete{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  margin:0 0 2rem}
.hub-tete h1{margin:0;font-size:clamp(1.45rem,1.1rem + 1.2vw,1.9rem)}
.hub-tete .qui{min-width:0}
.ent{display:inline-flex;align-items:center;gap:.4rem;margin:.45rem 0 0;
  padding:.22rem .7rem .22rem .55rem;border-radius:999px;background:var(--paper);
  border:1px solid var(--rule);font-size:.86rem;color:var(--ink-soft)}
.ent svg{width:1rem;height:1rem;color:var(--ink-faint);flex:none}
.ent strong{color:var(--ink);font-weight:600}
form.changer{position:relative;display:inline-flex;align-items:center;gap:.45rem;
  margin:.45rem 0 0;padding:.15rem .3rem .15rem .55rem;border-radius:999px;
  background:var(--paper);border:1px solid var(--rule)}
form.changer svg{width:1rem;height:1rem;color:var(--ink-faint);flex:none}
form.changer select{border:0;background:none;padding:.2rem .3rem;font-weight:600}
form.changer button{padding:.25rem .7rem;font-size:.82rem}
html.js form.changer button{display:none}
.hub-tete .sa{margin:.35rem 0 0;font-size:.78rem;color:var(--ink-faint)}
details.profil{position:relative;flex:none}
details.profil>summary{list-style:none;cursor:pointer;border-radius:50%}
details.profil>summary::-webkit-details-marker{display:none}
details.profil>summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.avatar{display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;
  background:linear-gradient(135deg,#1148D0,#5B86F0);color:#fff;font-weight:700;
  font-size:1.05rem;box-shadow:0 6px 16px -8px rgb(17 72 208/.7)}
details.profil[open]>summary .avatar{box-shadow:0 0 0 4px var(--accent-wash)}
.menu{position:absolute;right:0;top:calc(100% + .55rem);z-index:10;width:17.5rem;
  max-width:calc(100vw - 2rem);background:var(--paper);border:1px solid var(--rule);
  border-radius:14px;padding:.4rem;box-shadow:0 24px 48px -20px rgb(14 20 28/.35)}
.menu-qui{display:flex;align-items:center;gap:.7rem;padding:.55rem .55rem .75rem;
  margin:0 0 .35rem;border-bottom:1px solid var(--rule)}
.menu-qui .avatar{width:2.2rem;height:2.2rem;font-size:.92rem;box-shadow:none;flex:none}
.menu-qui strong{display:block;overflow:hidden;text-overflow:ellipsis}
.menu-qui span{font-size:.82rem;color:var(--ink-faint)}
.menu form{margin:0}
.menu-item,button.menu-item{display:flex;align-items:center;justify-content:flex-start;
  gap:.7rem;width:100%;padding:.6rem;border-radius:10px;background:none;border:0;
  color:var(--ink);text-decoration:none;font-weight:500;font-size:.94rem;text-align:left}
.menu-item:hover,.menu-item:focus-visible{background:var(--paper-2)}
.menu-item svg{width:1.15rem;height:1.15rem;color:var(--ink-soft);flex:none}
.menu-item small{display:block;font-size:.78rem;color:var(--ink-faint);font-weight:400}
/* 13/10 (William : « se déconnecter en rouge, mais propre ») */
.menu-item.sortie,.menu-item.sortie svg{color:#B42318}
.menu-item.sortie:hover,.menu-item.sortie:focus-visible{background:#FEF3F2}
.section{font-family:var(--f-body);font-size:.76rem;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-faint);margin:2.2rem 0 .8rem}
.hub-tete+.section,.message+.hub-tete+.section{margin-top:0}
.apps{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fill,minmax(14.5rem,1fr))}
.app{position:relative;display:flex;flex-direction:column;gap:.3rem;
  padding:1.15rem 1.15rem 1rem;background:var(--paper);border:1px solid var(--rule);
  border-radius:16px;transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease}
.app:not(.verrou):hover{transform:translateY(-2px);border-color:#BCD0F5;
  box-shadow:0 16px 32px -22px rgb(17 72 208/.5)}
.app:not(.verrou):focus-within{outline:2px solid var(--accent);outline-offset:2px}
.app h3{margin:.6rem 0 0;font-size:1.02rem;line-height:1.3}
.app p{margin:0;color:var(--ink-soft);font-size:.9rem;line-height:1.4}
.app-pied{display:flex;align-items:center;margin-top:auto;padding-top:.85rem}
.app-pied form{margin:0}
.app-lien,button.app-lien{display:inline-flex;align-items:center;gap:.15rem;padding:0;
  border:0;border-radius:0;background:none;color:var(--accent);font-weight:600;
  font-size:.92rem;text-decoration:none}
.app-lien::after{content:"";position:absolute;inset:0;border-radius:16px}
.app-lien:focus-visible{outline:none}
.app-lien svg{width:1.1rem;height:1.1rem;transition:transform .15s ease}
.app:hover .app-lien svg{transform:translateX(3px)}
.ico{position:relative;display:inline-grid;place-items:center;flex:none;
  width:2.75rem;height:2.75rem;border-radius:12px}
.ico svg{width:1.45rem;height:1.45rem}
/* 12/10 — les logos des applications (LOGO_V2_PNG, LOGO_IC_SVG). */
.ico.a-logo{background:none;overflow:hidden}
.ico.a-logo .logo{width:100%;height:100%;display:block;border-radius:12px}
.app.verrou .ico.a-logo .logo{filter:grayscale(1);opacity:.55}
/* 12/10 — une application ouverte dans son onglet : la tuile se grise. */
.app.ouverte{opacity:.62}
.app.ouverte:hover{transform:none}
.app.ouverte .app-lien{color:var(--ink-faint);cursor:default}
.app.ouverte .app-lien svg{display:none}
/* « Ouvert » se lit même là où « Ouvrir » n'est qu'une flèche (mobile). */
.app.ouverte .app-lien .txt{position:static;width:auto;height:auto;clip:auto;
  overflow:visible;font-size:.82rem;font-weight:600}
.section-ligne{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.section-ligne .section{margin-right:auto}
form.tout-fermer{margin:0}
form.tout-fermer button{display:inline-flex;align-items:center;gap:.35rem;font-size:.82rem}
form.tout-fermer svg{width:1rem;height:1rem}
.ico-v2{background:#EAF0FE;color:#1148D0}
.ico-ic{background:#E4F5F0;color:#0F766E}
.ico-icp{background:#F1ECFE;color:#6D28D9}
.ico-win,.ico-neutre{background:#EEF2F7;color:#334155}
.app.verrou{background:var(--paper-2);border-style:dashed}
.app.verrou .ico{background:#E6ECF4;color:var(--ink-faint)}
.app.verrou h3{color:var(--ink-soft)}
.cadenas{position:absolute;right:-6px;bottom:-6px;display:grid;place-items:center;
  width:1.4rem;height:1.4rem;border-radius:50%;background:var(--paper);
  border:1px solid var(--rule);color:var(--ink-soft)}
.cadenas svg{width:.8rem;height:.8rem}
button.demande{padding:.42rem .95rem;font-size:.86rem;background:var(--paper);
  color:var(--accent);border:1px solid #C9D8FB}
button.demande:hover{background:var(--accent-wash)}
.envoyee{display:inline-flex;align-items:center;gap:.35rem;font-size:.86rem;
  font-weight:600;color:var(--ok)}
.envoyee svg{width:1rem;height:1rem}
.telech{list-style:none;margin:0;padding:0;background:var(--paper);
  border:1px solid var(--rule);border-radius:16px}
.telech li{display:flex;align-items:center;gap:.9rem;padding:.85rem 1rem}
.telech li+li{border-top:1px solid var(--rule)}
.telech .ico{width:2.35rem;height:2.35rem;border-radius:10px}
.telech .ico svg{width:1.2rem;height:1.2rem}
.t-txt{flex:1;min-width:0}
.t-txt strong{display:block;font-size:.95rem}
.t-txt .meta{font-size:.8rem;color:var(--ink-faint)}
details.empreinte{font-size:.75rem;color:var(--ink-faint)}
details.empreinte summary{cursor:pointer;width:max-content}
details.empreinte code{display:block;font-family:var(--f-mono);font-size:.68rem;
  word-break:break-all;margin-top:.2rem}
.bouton.petit{padding:.45rem 1rem;font-size:.88rem;flex:none}
details.aide{margin-top:.8rem;font-size:.86rem;color:var(--ink-soft)}
details.aide summary{cursor:pointer;width:max-content}
details.aide p{margin:.5rem 0 0;border-left:3px solid var(--rule);padding-left:.9rem}
.retour{display:inline-block;margin:0 0 1rem;font-size:.9rem;text-decoration:none;
  color:var(--ink-soft)}
.retour:hover{color:var(--accent)}
.reglage{margin-top:1rem}
.reglage-tete{display:flex;align-items:flex-start;gap:.9rem;margin:0 0 .4rem}
.reglage-tete h2{margin:.1rem 0 .25rem;font-size:1.1rem}
.reglage-tete .intro{margin:0}
.reglage #cle-ajouter{width:auto;margin-top:.4rem}
.reglage .cles{margin-top:1rem}
.reglage>.meta{margin:.8rem 0 0;font-size:.88rem;color:var(--ink-faint)}
.reglage>form{margin-top:1rem}
@media (max-width:40rem){
  .hub-tete{margin-bottom:1.4rem}
  .apps{grid-template-columns:1fr;gap:.6rem}
  .app{display:grid;grid-template-columns:auto 1fr auto;column-gap:.85rem;row-gap:.1rem;
    align-items:center;padding:.85rem .95rem}
  .app .ico{grid-row:1/3}
  .app h3{grid-column:2;margin:0}
  .app p{grid-column:2;font-size:.85rem}
  .app-pied{grid-column:3;grid-row:1/3;margin:0;padding:0}
  .app.verrou .app-pied{grid-column:2/4;grid-row:auto;padding-top:.55rem}
  .app-lien .txt{position:absolute;width:1px;height:1px;overflow:hidden;
    clip:rect(0 0 0 0);white-space:nowrap}
  .telech li{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  .app,.app-lien svg{transition:none}
  .app:not(.verrou):hover{transform:none}
  .app:hover .app-lien svg{transform:none}
}

.ic-head{margin-bottom:1.5rem}
.ic-head-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}
.ic-head-top p{margin:0;color:var(--ink-soft);font-size:.85rem}
.ic-head-top>a{font-size:.85rem;white-space:nowrap}
.ic-head-panel{border:1px solid var(--rule);border-radius:16px;background:var(--paper);overflow:hidden}
.ic-head-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.65rem 1rem;border-bottom:1px solid var(--rule)}
.ic-portal .ic-head .ic-roles{margin:0;padding:0;border:0;gap:.25rem}
.ic-head-nav>a{padding:.55rem .85rem;border:1px solid var(--rule);border-radius:9px;font-size:.85rem;text-decoration:none;white-space:nowrap;color:var(--ink)}
.ic-head-context{display:grid;grid-template-columns:minmax(0,1fr) minmax(18rem,1fr);gap:1.5rem;align-items:center;padding:1rem 1.25rem}
.ic-head-context>div{min-width:0}
.ic-head-kicker{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-faint);margin:0 0 .4rem}
.ic-head-name{display:block;font-size:1rem;overflow-wrap:anywhere}
.ic-head-context .ic-head-description{font-size:.8rem;color:var(--ink-soft);margin:.35rem 0 0;line-height:1.5}
.ic-head-context form.ic-switch{margin:0;padding:0;border:0;max-width:none;background:none;grid-template-columns:minmax(0,1fr) auto;gap:.4rem .6rem}
.ic-head-context form.ic-switch label{grid-column:1/-1;font-size:.75rem}
.ic-head-context form.ic-switch select{font-weight:400}
.ic-head-help{margin:.65rem .15rem 0;font-size:.78rem;color:var(--ink-soft)}
.ic-head-help summary{cursor:pointer}
.ic-head-help p{margin:.5rem 0;max-width:65rem;line-height:1.5}
@media(max-width:750px){.ic-head-context{grid-template-columns:1fr;gap:1rem}.ic-head-nav{align-items:stretch;flex-direction:column;gap:.6rem}.ic-head-nav>a{align-self:flex-start}.ic-head-top{align-items:flex-start}.ic-head-top>a{white-space:normal;text-align:right}}
main.large:has(>.ic-portal){max-width:96rem;width:100%;box-sizing:border-box;
  padding:2rem clamp(1rem,3vw,3rem) 3rem}
.ic-portal .fichiers{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.ic-portal .expo{padding:1.15rem 1.35rem;min-width:0}
.ic-portal .expo .montant{margin:.45rem 0 0}
.ic-portal h1{margin:0 0 .5rem}
.ic-portal h2{margin:1.2rem 0 .8rem}
.ic-portal .ic-roles{margin:1rem 0 1.25rem;padding-bottom:.75rem}
.ic-portal .note{margin:1rem 0 1.5rem}
@media(max-width:700px){main.large:has(>.ic-portal){padding-top:1.25rem}
  .ic-portal .fichiers{grid-template-columns:1fr}.ic-portal .expo{padding:1rem}}
.tete:has(.ic-switch) .qui{min-width:0}
form.ic-switch{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
  gap:.65rem;width:100%;max-width:42rem;margin:1rem 0 0;padding:.65rem .8rem;
  box-sizing:border-box;border:1px solid var(--rule);border-radius:12px;background:var(--paper)}
form.ic-switch label{margin:0;font-size:.85rem;color:var(--ink-soft);white-space:nowrap}
form.ic-switch select{width:100%;min-width:0;margin:0;padding:.5rem .65rem;font-size:.9rem}
form.ic-switch button{margin:0;padding:.5rem .85rem;font-size:.85rem;border-radius:8px}
form.ic-switch input[type=hidden]{display:none}
.ic-roles{display:flex;gap:.4rem;flex-wrap:wrap;margin:1.25rem 0 1.75rem;padding-bottom:1rem;border-bottom:1px solid var(--rule)}
.ic-roles a{padding:.55rem .85rem;font-size:.9rem;color:var(--ink-soft);border:1px solid transparent;border-radius:9px;text-decoration:none}
.ic-roles a:hover{background:var(--paper);border-color:var(--rule)}
.ic-roles a[aria-current]{background:var(--ink);color:var(--paper)}
@media(max-width:650px){form.ic-switch{grid-template-columns:minmax(0,1fr) auto}
  form.ic-switch label{grid-column:1/-1}.ic-roles{gap:.25rem}.ic-roles a{padding:.5rem .65rem}}
.ic-client{margin:2rem 0}.ic-client *{box-sizing:border-box}
.ic-client nav{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.2rem 0}
.ic-client nav a{padding:.65rem 1rem;border:1px solid var(--rule);border-radius:30px;text-decoration:none}
.ic-client nav a:hover{background:var(--paper)}
.ic-client .ic-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.ic-client .ic-metric{padding:1.2rem;border:1px solid var(--rule);border-radius:16px}
.ic-client .ic-metric strong{display:block;font-size:2rem;font-variant-numeric:tabular-nums}
.ic-client .ic-section{margin-top:2rem;scroll-margin-top:2rem}
.ic-client .ic-row{border:1px solid var(--rule);border-radius:14px;padding:1rem 1.2rem;margin:.7rem 0}
.ic-client .ic-row summary{cursor:pointer;display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.ic-client .ic-row summary code{font-size:1rem;letter-spacing:.05em}
.ic-client .ic-row summary .ic-desc{flex:1;min-width:120px}
.ic-client .ic-badge{font-size:.78rem;padding:.25rem .6rem;border-radius:20px;background:#f0ede6;color:#57554d}
.ic-client .ic-badge.warn{background:#fff0d7;color:#82530c}.ic-client .ic-badge.ok{background:#e2f2e8;color:#246444}
.ic-client .ic-options{display:grid;gap:.5rem;margin:1rem 0}.ic-client .ic-option{padding:.65rem;background:var(--paper);border-radius:8px}
.ic-client .ic-small{font-size:.84rem;color:var(--ink-soft);line-height:1.6}
.ic-client .ic-workflow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
.ic-client .ic-workflow p{padding:1rem;border-left:2px solid var(--rule)}
.ic-client .ic-invoice{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
@media(max-width:650px){.ic-client .ic-metrics,.ic-client .ic-workflow{grid-template-columns:1fr}.ic-client .ic-metric strong{font-size:1.5rem}}