/* Fontista Control en ligne : l'outil (control.html). Variables et polices : celles du site (--ws, --panel, --line…). */
:root{--fix:#fb923c;--past:#fdba74}
@media (prefers-color-scheme:light){:root{--fix:#c2410c;--past:#b45309}}
.fc-main{display:block}
.fc [hidden]{display:none!important}
.fc{display:flex;flex-direction:column;min-height:calc(100vh - var(--head));font-size:15px;line-height:1.5;color:var(--body)}
.fc kbd{font-size:12px}
.fc .btn,.fc .ghost{font-size:15px;cursor:pointer;font-family:inherit;line-height:1.3}
.fc .ghost{background:none}
.fc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fc-dim{color:var(--fg4)}
.fc-mono{font-family:"Source Code Pro",monospace}
.fc-sp{flex:1 1 0}
.fc .ok{color:var(--accent)}.fc .fx{color:var(--fix)}

/* barre de l'outil */
.fc-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;padding:10px 24px;border-bottom:1px solid var(--line);background:var(--panel)}
.fc .fc-crumb{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;font-size:15px}.fc .fc-crumb a{padding:0;border:0;color:var(--fg4)}.fc-crumb a:hover{color:var(--fg)}.fc-crumb b{color:var(--fg);font-weight:600}.fc-crumb .sl{color:var(--line3)}
.fc-file{display:flex;align-items:center;gap:8px;min-height:34px;padding:0 10px;border:1px solid var(--line2);border-radius:4px;font:13px "Source Code Pro",monospace;color:var(--fg);max-width:100%;overflow:hidden}
.fc-file b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:28ch}.fc-file span{color:var(--fg4);white-space:nowrap}
.fc-seg{display:flex;flex-wrap:wrap;border:1px solid var(--line2);border-radius:4px;overflow:hidden}
.fc-seg button{min-height:34px;padding:0 12px;border:0;background:none;color:var(--fg4);font:inherit;font-size:14px;cursor:pointer}
.fc-seg button[aria-pressed=true]{background:var(--accent);color:var(--on-accent);font-weight:600}
.fc-prog{display:flex;flex-direction:column;gap:5px;min-width:200px}
.fc-pbar{display:flex;height:4px;background:var(--line);border-radius:2px;overflow:hidden}.fc-pbar i:first-child{background:var(--accent)}.fc-pbar i:last-child{background:var(--fix)}
.fc-pbar.fc-big{height:6px;max-width:640px;margin-top:14px}
.fc-counts{font:12px "Source Code Pro",monospace;color:var(--fg4)}
.fc-q{display:flex;align-items:center;gap:8px;min-height:34px;padding:0 10px;border:1px solid var(--line2);border-radius:4px;background:var(--ws);color:var(--fg4)}
.fc-q input{width:150px;border:0;background:none;color:var(--fg);font:13px "Source Code Pro",monospace;outline:none}
.fc-q:focus-within{border-color:var(--accent)}
.fc-tbtn{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 12px;border:1px solid var(--line3);border-radius:4px;background:none;color:var(--fg);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.fc-tbtn:hover,.fc-tbtn[aria-pressed=true]{border-color:var(--accent)}
.fc-i{width:16px;height:16px;flex:none}

/* corps : rail + scène */
.fc-body{display:flex;flex-wrap:wrap;flex:1 1 auto;align-items:stretch}
.fc-rail{flex:0 0 312px;max-width:100%;box-sizing:border-box;padding:24px 24px 32px;border-right:1px solid var(--line);background:var(--ws)}
/* le rail est un <details> (repliable sur téléphone) : on retire la boîte des <details> du site */
.fc .fc-railbox{background:none;border:0;border-radius:0;margin:0;padding:0}.fc .fc-railbox[open]>summary{border-bottom:0}
.fc-railbox>summary{display:none}
.fc-blk{display:flex;flex-direction:column;gap:4px;margin-bottom:32px}.fc-blk:last-child{margin-bottom:0}
.fc-h{font:12px "Source Code Pro",monospace;letter-spacing:.08em;text-transform:uppercase;color:var(--fg4);margin:0 0 8px}
.fc-grp{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:40px;padding:7px 12px;border:1px solid transparent;border-radius:4px;background:none;color:var(--body);font:inherit;font-size:15px;line-height:1.3;text-align:left;cursor:pointer}
.fc-grp:hover{border-color:var(--line2)}.fc-grp[aria-pressed=true]{background:var(--panel);border-color:var(--line2);color:var(--fg)}
.fc-n{font:12px "Source Code Pro",monospace;color:var(--fg4);white-space:nowrap}
.fc-map{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}
.fc-cellb{display:flex;align-items:center;justify-content:center;height:40px;padding:0;border:1px solid var(--line2);border-radius:3px;background:none;color:var(--fg4);font-size:17px;line-height:1;cursor:pointer;overflow:hidden}
.fc-cellb svg{height:30px;width:100%;fill:currentColor}
.fc-cellb[data-s=ok]{border-color:color-mix(in srgb,var(--accent) 45%,var(--line2));background:color-mix(in srgb,var(--accent) 8%,transparent);color:var(--fg)}
.fc-cellb[data-s=fix]{border-color:var(--fix);background:color-mix(in srgb,var(--fix) 12%,transparent);color:var(--fix)}
.fc-cellb[aria-current=true]{outline:2px solid var(--accent);outline-offset:1px;color:var(--fg)}
.fc-leg{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:10px;font-size:13px;color:var(--fg4)}.fc-leg span{display:flex;align-items:center;gap:6px}
.fc-leg i{width:8px;height:8px;border-radius:2px;border:1px solid var(--fg4)}.fc-leg i.ok{background:var(--accent);border-color:var(--accent)}.fc-leg i.fx{background:var(--fix);border-color:var(--fix)}
.fc-radio,.fc-chk{display:flex;align-items:center;gap:10px;min-height:32px;padding:0 2px;cursor:pointer}
.fc-radio input,.fc-chk input{accent-color:var(--accent);width:16px;height:16px}
.fc-stage{flex:999 1 560px;min-width:0;padding:20px 32px 24px;display:flex;flex-direction:column;gap:14px}

/* glyphe */
.fc-info{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.fc-name{margin:0;font:500 26px "Source Code Pro",monospace;color:var(--fg);overflow-wrap:anywhere}
.fc-code{font:14px "Source Code Pro",monospace;color:var(--fg2)}
.fc-tag{font:12px "Source Code Pro",monospace;border:1px solid var(--line3);border-radius:3px;padding:1px 8px;color:var(--fg4)}
.fc-tag[data-s=ok]{border-color:var(--accent);color:var(--accent)}.fc-tag[data-s=fix]{border-color:var(--fix);color:var(--fix)}
.fc-num{font-family:"Source Code Pro",monospace;font-size:13px}
.fc-why{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:10px 14px;border:1px solid var(--line);border-radius:4px;background:var(--panel)}
.fc-mini{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 12px;border:1px solid var(--line3);border-radius:4px;background:none;color:var(--fg);font:inherit;font-size:14px;cursor:pointer}
.fc-mini[aria-pressed=true]{background:var(--fix);border-color:var(--fix);color:#1a1a1a}
.fc-tabs{display:none}
.fc-panels{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:14px}
.fc-panel{margin:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:4px;background:var(--bg);overflow:hidden;min-width:0}
.fc-panel figcaption{display:flex;justify-content:space-between;gap:10px;margin:0;padding:8px 12px;border-bottom:1px solid var(--line);font-size:14px;color:var(--fg4)}
.fc-panel figcaption b{color:var(--fg);font-weight:600}.fc-panel figcaption span{font:12px "Source Code Pro",monospace;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fc-panel>svg{display:block;width:100%;height:clamp(240px,calc(100vh - 480px),470px)}
.fc-cell{fill:color-mix(in srgb,var(--fg) 4%,transparent)}
.fc-m0{stroke:var(--line2);stroke-width:2;vector-effect:non-scaling-stroke}.fc-m1{stroke:var(--line3);stroke-width:1.6;vector-effect:non-scaling-stroke}
.fc-mv{stroke:var(--line2);stroke-dasharray:4 5;vector-effect:non-scaling-stroke}
.fc-ml,.fc-adv{fill:var(--fg4);font-family:"Source Code Pro",monospace}
.fc-ink{fill:var(--fg)}.fc-ink.fc-past{fill:var(--past)}.fc-ink.fc-out{fill:color-mix(in srgb,var(--fg) 14%,transparent);stroke:var(--fg);stroke-width:1;vector-effect:non-scaling-stroke}
.fc-ghost{fill:none;stroke:var(--fix);stroke-width:1.6;stroke-dasharray:6 4;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.fc-on{fill:var(--accent)}.fc-off{fill:none;stroke:var(--fg4);stroke-width:1;vector-effect:non-scaling-stroke}.fc-hdl{fill:none;stroke:var(--line3);stroke-width:1;vector-effect:non-scaling-stroke}
.fc-ctx{margin:0;padding:8px 12px;border-top:1px solid var(--line);color:var(--fg2);white-space:nowrap;overflow:hidden;text-overflow:clip;line-height:1.3}
.fc-ctxs{display:block;height:38px;width:auto;max-width:100%;margin:0;padding:6px 12px;border-top:1px solid var(--line);fill:var(--fg2);box-sizing:content-box}
.fc-abs{margin:auto;padding:40px 12px;color:var(--fg4);text-align:center}

/* écrans moyens : la barre reste sur une ligne (le nombre de glyphes est déjà dans la progression) */
@media(min-width:901px) and (max-width:1700px){
  .fc-file span{display:none}
  .fc-q input{width:110px}
  .fc-prog{min-width:150px}
  .fc-bar{gap:10px 14px}
}

/* sous 1450 px : les deux boutons de la barre en icône seule (le libellé reste dans title et pour les lecteurs d'écran) */
@media(min-width:901px) and (max-width:1450px){
  .fc-tl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .fc-tbtn{min-width:40px;justify-content:center;padding:0 10px}
}

/* revue sur écran large : l'outil occupe exactement la fenêtre sous l'en-tête du site */
@media(min-width:901px){
  .fc[data-view=review]{height:calc(100dvh - var(--fc-head, var(--head)));min-height:520px}
  .fc[data-view=review] .fc-body{flex:1 1 0;min-height:0;flex-wrap:nowrap}
  .fc[data-view=review] .fc-rail{overflow-y:auto;overscroll-behavior:contain}
  .fc[data-view=review] .fc-stage{min-height:0;overflow-y:auto;padding-bottom:16px}
  .fc[data-view=review] .fc-panels{flex:1 1 auto;min-height:0;grid-auto-rows:minmax(0,1fr)}
  .fc[data-view=review] .fc-panel{min-height:0}
  .fc[data-view=review] .fc-panel>svg{flex:1 1 0;height:auto;min-height:150px}
  .fc[data-view=review] .fc-keys{padding-bottom:12px}
}

/* zoom et repères */
.fc-zoom{display:inline-flex;align-items:center;gap:4px}
.fc-zb{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-width:30px;height:30px;padding:0 9px;border:1px solid var(--line3);border-radius:4px;background:none;color:var(--fg);font:inherit;font-size:15px;line-height:1;cursor:pointer}
.fc-zb:hover{border-color:var(--accent)}.fc-zfit{font-size:13px}
.fc-zv{min-width:44px;text-align:center;font:12px "Source Code Pro",monospace;color:var(--fg4)}.fc.fc-zoomed .fc-zv{color:var(--fg)}
#fcMark[aria-pressed=true]{background:var(--fix);border-color:var(--fix);color:#1a1a1a}
.fc-marks{display:flex;flex-wrap:wrap;gap:4px 18px;margin:-6px 0 0;font:13px "Source Code Pro",monospace;color:var(--fix)}.fc-marks b{font-weight:600}
.fc-pm{color:var(--fg2)}
.fc-mhint{margin:0;font-size:13px;color:var(--fix)}
.fc-panel{position:relative}
.fc.fc-marking .fc-panel>svg{cursor:crosshair}
.fc.fc-zoomed:not(.fc-marking) .fc-panel>svg{cursor:grab}.fc.fc-zoomed:not(.fc-marking) .fc-panel>svg:active{cursor:grabbing}
.fc-mkc,.fc-mkp{cursor:pointer}
.fc-mkc .c{fill:color-mix(in srgb,var(--fix) 14%,transparent);stroke:var(--fix);stroke-width:2;vector-effect:non-scaling-stroke}
.fc-mkc.on .c{stroke-width:3.5}
.fc-mkc .t{fill:var(--fix)}
.fc-mkp .c{fill:none;stroke:var(--fg4);stroke-width:1.5;stroke-dasharray:4 3;vector-effect:non-scaling-stroke}
.fc-mkp .t{fill:var(--fg4)}
.fc-mkc text,.fc-mkp text{fill:#1a1a1a;font-family:"Source Code Pro",monospace;font-weight:600;pointer-events:none}
/* liaisons : coins, nœuds et écarts mesurés (orange, comme les repères) */
.fc-lk{pointer-events:none}
.fc-lkc{fill:none;stroke:var(--fix);stroke-width:1.5;vector-effect:non-scaling-stroke}
.fc-lkl{stroke:var(--fix);stroke-width:1.5;stroke-dasharray:4 3;vector-effect:non-scaling-stroke}
.fc-lkd{fill:var(--fix)}
.fc-lkt{fill:var(--fix);font-family:"Source Code Pro",monospace}
.fc-lkm{color:var(--fg2)}
.fc-lknote{max-width:72ch}
.fc-mnote{position:absolute;z-index:4;height:34px;box-sizing:border-box;padding:0 10px;border:1px solid var(--fix);border-radius:4px;background:var(--ws);color:var(--fg);font:inherit;font-size:14px;outline:none}

/* actions */
.fc-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;padding:12px 24px;border-top:1px solid var(--line);background:var(--ws)}
.fc-actions .fc-abtn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid var(--line3);border-radius:4px;background:none;color:var(--fg);font:inherit;font-size:15px;cursor:pointer}
.fc-actions #fcFix[aria-pressed=true]{border-color:var(--fix);color:var(--fix);background:color-mix(in srgb,var(--fix) 12%,transparent)}
.fc-note{flex:1 1 240px;display:flex;align-items:center;min-height:44px;padding:0 14px;border:1px solid var(--line3);border-radius:4px;background:var(--bg)}
.fc-note input{width:100%;border:0;background:none;color:var(--fg);font:inherit;font-size:15px;outline:none}.fc-note:focus-within{border-color:var(--accent)}
.fc-actions #fcNext{border-color:var(--accent);background:var(--accent);color:var(--on-accent);font-weight:600}
.fc-keys{display:flex;flex-wrap:wrap;gap:6px 18px;padding:0 24px 16px;font-size:13px;color:var(--fg4);background:var(--ws)}

/* état vide, erreurs */
.fc-empty{max-width:720px;margin:32px auto;padding:0 24px;box-sizing:border-box;display:flex;flex-direction:column;gap:18px;width:100%}
.fc-drop{display:flex;flex-direction:column;align-items:center;gap:12px;padding:48px 24px;border:1px dashed var(--line3);border-radius:8px;background:var(--panel);text-align:center;cursor:pointer;color:var(--accent)}
.fc-drop:hover{border-color:var(--accent)}.fc-dt{font-size:22px;font-weight:600;color:var(--fg)}.fc-ds{color:var(--body)}
.fc-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0}.fc-row>.fc-i{flex:none}.fc-row.fc-dim{column-gap:8px}.fc-empty p{margin:0}
.fc-link{border:0;background:none;padding:0;color:var(--accent);font:inherit;font-size:15px;cursor:pointer}.fc-link:hover{text-decoration:underline}
.fc-dls{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.fc-dls .ghost{padding:6px 14px;font-size:14px}
.fc-fmts{display:flex;flex-direction:column;padding-top:16px;border-top:1px solid var(--line)}.fc-fmts p{margin:0;line-height:1.6}
#fcLast:empty{display:none}
.fc-err{border:1px solid var(--fix);border-radius:4px;padding:12px 16px;color:var(--fg)}
.fc-none{margin:48px auto;text-align:center;display:flex;flex-direction:column;gap:12px;align-items:center}
.fc-toast{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);z-index:9;max-width:min(90vw,560px);padding:0;border-radius:4px;background:var(--fg);color:var(--ws);font-size:15px;text-align:center;pointer-events:none}
.fc-toast:not(:empty){padding:10px 16px}
.fc-busy .fc-stage{opacity:.5;pointer-events:none}.fc-busy{cursor:progress}
.fc-drag{display:none}
.fc-dragging .fc-drag{display:flex;position:fixed;inset:0;z-index:10;align-items:center;justify-content:center;background:color-mix(in srgb,var(--ws) 82%,transparent);border:3px dashed var(--accent);font-size:24px;font-weight:600;color:var(--fg)}
#fcFileIn,#fcImp{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}

/* bilan */
.fc-bilan{display:flex;flex-wrap:wrap;gap:32px 40px;align-items:flex-start}
.fc-bmain{flex:999 1 520px;min-width:0}.fc-bmain h1{margin:0;font-size:clamp(26px,3vw,36px);line-height:1.15;letter-spacing:-.02em;color:var(--fg)}
.fc-baside{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:16px}
.fc-box{display:flex;flex-direction:column;gap:12px;padding:20px;border:1px solid var(--line);border-radius:4px;background:var(--panel)}
.fc-box h2{margin:0;font-size:20px;color:var(--fg)}.fc-box p{margin:0}.fc-box .btn{border:0;text-align:center}
.fc-next{border-color:var(--fix)}
.fc-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.fc-pre{margin:0;padding:12px;background:var(--code);border:1px solid var(--line);border-radius:4px;font:12px/1.55 "Source Code Pro",monospace;color:var(--fg2);overflow-x:auto;max-height:260px}
.fc-drop2{display:flex;align-items:center;justify-content:center;min-height:44px;border:1px dashed var(--fix);border-radius:4px;color:var(--fix);cursor:pointer}
.fc-tablebox{overflow-x:auto;border:1px solid var(--line);border-radius:4px;margin-top:20px}
.fc-tablebox table{margin:0;min-width:560px;font-size:15px}.fc-tablebox th,.fc-tablebox td{padding:6px 12px;vertical-align:middle}.fc-tablebox th:first-child,.fc-tablebox td:first-child{padding-left:12px}
.fc-tablebox th{font:12px "Source Code Pro",monospace;letter-spacing:.06em;text-transform:uppercase;color:var(--fg4);font-weight:400;background:var(--panel)}
.fc-th{display:block;height:48px;width:40px;fill:var(--fg)}

/* téléphone et tablette */
@media(max-width:900px){
  .fc-rail{flex-basis:100%;border-right:0;border-bottom:1px solid var(--line);padding:10px 16px}
  .fc-railbox>summary{display:block;cursor:pointer;padding:8px 0;color:var(--fg);font-weight:600}
  .fc-railbox[open]>summary{margin-bottom:10px}
  .fc-map{grid-template-columns:repeat(10,minmax(0,1fr))}
  .fc-stage{padding:16px}
  .fc-bar{padding:10px 16px}.fc-actions{padding:10px 16px}.fc-keys{padding:0 16px 12px}
}
@media(max-width:720px){
  .fc-tabs{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);border:1px solid var(--line2);border-radius:4px;overflow:hidden}
  .fc-tabs button{min-height:44px;border:0;background:none;color:var(--body);font:inherit;font-size:15px;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 6px}
  .fc-tabs button[aria-selected=true]{background:var(--accent);color:var(--on-accent);font-weight:600}
  .fc-panels{grid-template-columns:minmax(0,1fr)}
  .fc-panel:not(.sel){display:none}
  .fc-panel>svg{height:min(52vh,380px)}
  .fc-map{grid-template-columns:repeat(8,minmax(0,1fr))}
  .fc-prog{min-width:0;flex:1 1 100%}
  .fc-q{flex:1 1 100%}.fc-q input{width:100%}
  .fc-keys{display:none}
  .fc-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));position:sticky;bottom:0;z-index:3}
  .fc-actions .fc-note{grid-column:1/-1;order:-1}
  .fc-actions #fcPrev{display:none}
  .fc-actions .fc-abtn{min-height:52px;justify-content:center}
  .fc-file b{max-width:16ch}
}