/* Page d'accueil NetPilot (js/accueil.js) et bouton Home.
   Variables communes de l'appli seulement (--surface, --line, --ink, --muted, --soft, couleurs de la société --theme / --theme2),
   donc clair, sombre et couleur de la société suivent tout seuls. Téléphone d'abord ; PC (html.wide) en fin de fichier. */

/* ---------- bouton Home ---------- */
/* téléphone : maison à gauche des onglets ; la pastille de sauvegarde devient un petit point posé sur la maison */
.shome{flex:none;width:40px;height:40px;border:0;border-radius:10px;background:transparent;color:var(--brand-ink);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0}
.shome[aria-current="page"]{background:var(--brand-ink);color:var(--brand)}
.shome:focus-visible{outline:3px solid var(--focus);outline-offset:1px}
html:not(.wide) .shell .sdot{position:absolute;left:32px;top:calc(50% - 22px);width:20px;height:20px;z-index:1}
html:not(.wide) .shell .sdot span{width:11px;height:11px;box-shadow:0 0 0 2px var(--brand)}
/* PC : entrée « Accueil » en tête du menu de gauche, et le logo NetPilot qui y mène */
html.wide #sHome{display:none}
html.wide .stabs .stab-acc{display:flex;align-items:center;gap:10px}
html.wide .stabs .stab-acc svg{flex:none}
html.wide .sbrand[data-tab]{cursor:pointer;border-radius:12px}
html.wide .sbrand[data-tab]:focus-visible{outline:3px solid var(--focus);outline-offset:2px}

/* ---------- page ---------- */
.acc-wrap{max-width:680px;margin:0 auto;padding:16px 16px calc(32px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:14px}
.acc-top h1{margin:0;font-size:28px;line-height:1.15}
.acc-sub{margin:2px 0 0;color:var(--muted);font-size:15px}
.acc-sub::first-letter{text-transform:uppercase}
.acc-resume{background:var(--surface);border:2px solid var(--theme);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.acc-resume b{display:block;font-size:17px}
.acc-resume span{color:var(--muted);font-size:14px}
.acc-resume .btn{width:100%;margin:0}
.acc-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.acc-actions .btn{margin:0;min-height:54px;display:flex;align-items:center;justify-content:center;gap:8px;padding:6px 10px;line-height:1.2;text-align:center}
.acc-actions .btn svg{flex:none}
/* téléphone : icône au-dessus du mot (gros boutons de même taille) ; un nombre impair d'actions laisse la dernière sur toute la largeur */
html:not(.wide) .acc-actions .btn{flex-direction:column;gap:4px;min-height:66px}
html:not(.wide) .acc-actions .btn:last-child:nth-child(odd){grid-column:1/-1}
.acc-cols{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}
.acc-panel{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px 6px 6px;min-width:0}
.acc-panel h2{margin:6px 10px 4px;font-size:18px}
.acc-row{width:100%;font:inherit;color:var(--ink);background:transparent;border:0;border-top:1px solid var(--line);display:flex;align-items:center;gap:12px;min-height:58px;padding:8px 10px;text-align:left;cursor:pointer;border-radius:0}
.acc-panel h2+.acc-row{border-top:0}
.acc-row:hover{background:var(--soft)}
.acc-row:focus-visible{outline:3px solid var(--focus);outline-offset:-3px;border-radius:10px}
.acc-row>svg{flex:none;color:var(--muted)}
.acc-ico{flex:none;width:36px;height:36px;border-radius:10px;background:var(--theme2);color:var(--theme2-ink);display:flex;align-items:center;justify-content:center}
.acc-row.grave .acc-ico{background:var(--nok);color:#fff}
.acc-row.grave b{color:var(--nok)}
.acc-tx{flex:1;min-width:0}
.acc-tx b{display:block;font-size:16px;line-height:1.25}
.acc-tx small{display:block;color:var(--muted);font-size:14px;line-height:1.3;margin-top:2px;overflow-wrap:anywhere}
.acc-h{flex:none;width:48px;font-weight:700;font-variant-numeric:tabular-nums}
.acc-vide{margin:0;padding:10px 10px 12px;color:var(--muted);display:flex;align-items:center;gap:8px}
.acc-vide svg{color:var(--ok);flex:none}

/* ---------- PC ---------- */
html.wide .acc-wrap{max-width:1180px;padding:28px 24px 40px;gap:16px}
html.wide .acc-top h1{font-size:32px}
html.wide .acc-resume{flex-direction:row;align-items:center;justify-content:space-between}
html.wide .acc-resume .btn{width:auto;flex:none;padding:0 22px}
html.wide .acc-actions{grid-template-columns:repeat(var(--n,4),minmax(0,1fr))}
html.wide .acc-actions .btn{min-height:44px}
html.wide .acc-cols:has(>.acc-panel+.acc-panel){grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}