/* YouTips · Faire écouter votre morceau (outil d'analyse dans le navigateur), 25 oct. 2026. Préfixe html body #ybe. Jetons du site --yj-*, sombre via html.yj-isdark. */
html body #ybe{
  --bg:var(--yj-bg,#F0F2F5); --card:var(--yj-card,#FFFFFF); --ink:var(--yj-text,#050505); --ink2:var(--yj-text2,#4A4E55); --mute:#6A6F77; --line:var(--yj-border,#DADDE1);
  --link:var(--yj-link,#124CA3); --btn:var(--yj-btn,#124CA3); --btn-ink:#FFFFFF;
  --noir:#0B0D12; --noir2:#161A22; --noir-ink:#F4F5F7; --noir-ink2:#B9BEC8; --noir-line:rgba(255,255,255,.12);
  --mao:#C45048; --mao2:#8D3A34; --zone:rgba(196,80,72,.12);
  --ok:#1F7A45; --ok-bg:#E3F3E9; --warn:#8A5A00; --warn-bg:#FFF1D6; --bad:#B0312A; --bad-bg:#FBE4E2;
  --f-display:-apple-system,BlinkMacSystemFont,"SF Pro Display","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --f-text:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --f-data:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  width:100vw; max-width:100vw; margin:0 0 0 calc(50% - 50vw) !important; padding:0 !important; overflow-x:clip;
  background:var(--bg); color:var(--ink); font:16px/1.55 var(--f-text); -webkit-font-smoothing:antialiased;
}
html.yj-isdark body #ybe{ --mute:#8E949D; --zone:rgba(232,120,110,.16); --mao:#E2756C;
  --ok:#6FD39A; --ok-bg:#163223; --warn:#F2C062; --warn-bg:#3A2D12; --bad:#FF8F86; --bad-bg:#3D1D1B; }
body.yt-ybe #primary.content-area, body.yt-ybe .content-area{ margin:0 !important; }
body.yt-ybe .entry-content-wrap{ padding:0 !important; }
body.yt-ybe article.content-bg, body.yt-ybe .content-bg.single-entry{ background:transparent !important; box-shadow:none !important; }
body.yt-ybe .entry-content{ margin:0 !important; }
html body #ybe h1, html body #ybe h2, html body #ybe h3{ color:inherit; text-transform:none; }
html body #ybe p, html body #ybe h1, html body #ybe h2, html body #ybe h3{ margin:0; padding:0; }
html body #ybe ul, html body #ybe ol{ margin:0; }
html body #ybe button{ text-transform:none; letter-spacing:0; box-shadow:none; }
html body #ybe,html body #ybe *,html body #ybe *::before,html body #ybe *::after{box-sizing:border-box}
html body #ybe a{color:var(--link);text-decoration:none;font-weight:600}
html body #ybe a:hover{text-decoration:underline;text-underline-offset:3px}
html body #ybe :focus-visible{outline:3px solid #5fa8ff;outline-offset:3px}
html body #ybe h1,html body #ybe h2,html body #ybe h3{font-family:var(--f-display);text-wrap:balance;margin:0}
html body #ybe p{margin:0}
html body #ybe .wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
html body #ybe .band{padding-block:88px}
html body #ybe .band.gris{background:var(--bg)}
html body #ybe .band.blanc{background:var(--card)}
html body #ybe .k{display:block;font:700 11px/1.3 var(--f-text);letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
html body #ybe .num{font-variant-numeric:tabular-nums}
html body #ybe .hero{min-height:520px;display:flex;align-items:center;background:radial-gradient(90% 120% at 85% 10%, rgba(196,80,72,.35) 0%, transparent 55%), var(--noir);color:var(--noir-ink);padding-block:96px 104px}
html body #ybe .hero .wrap{width:100%;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
html body #ybe .hero h1{font-size:clamp(42px,6.4vw,76px);line-height:1.02;letter-spacing:-.04em;font-weight:700;color:var(--noir-ink) !important}
html body #ybe .hero h1 span{color:#9AA0A8 !important}
html body #ybe .hero .chapo{margin-top:24px;font-size:20px;line-height:1.55;color:var(--noir-ink2);max-width:34em}
html body #ybe .hero .rgpd{margin-top:20px;font-size:14px;color:#9AA0A8;display:flex;gap:10px;align-items:flex-start;max-width:34em}
html body #ybe .hero .rgpd svg{flex:none;margin-top:2px}
html body #ybe .depot{position:relative;display:flex;flex-direction:column;gap:18px;padding:28px;border-radius:24px;background:var(--noir2);border:1px solid var(--noir-line)}
html body #ybe .drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:210px;border:1.5px dashed rgba(255,255,255,.28);border-radius:18px;text-align:center;padding:24px;cursor:pointer;transition:border-color .2s, background .2s}
html body #ybe .drop:hover,html body #ybe .drop.sur{border-color:#fff;background:rgba(255,255,255,.04)}
html body #ybe .drop b{font:700 22px/1.2 var(--f-display);letter-spacing:-.02em;color:#fff}
html body #ybe .drop small{font-size:14px;color:var(--noir-ink2)}
html body #ybe .drop .bouton{display:inline-flex;align-items:center;gap:8px;background:#fff;color:#0B0D12 !important;border-radius:999px;padding:12px 22px;font-weight:600;font-size:15px}
html body #ybe #ybe-fichier{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
html body #ybe .reglages{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
html body #ybe .reglages label{font-size:14px;color:var(--noir-ink2)}
html body #ybe .reglages select{appearance:none;min-height:0;height:auto;line-height:1.3;background:#0B0D12;color:#fff;border:1px solid var(--noir-line);border-radius:999px;padding:9px 34px 9px 16px;font:600 14px var(--f-text);background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-size:5px 5px;background-repeat:no-repeat}
html body #ybe .etat{font-size:14px;color:var(--noir-ink2);min-height:1.5em}
html body #ybe .barre{height:4px;border-radius:4px;background:rgba(255,255,255,.1);overflow:hidden}
html body #ybe .barre i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--mao2),#E2756C);transition:width .2s}
html body #ybe .res-tete{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:flex-end;justify-content:space-between}
html body #ybe .res-tete h2{font-size:clamp(30px,4vw,44px);letter-spacing:-.03em;line-height:1.1}
html body #ybe .res-tete p{margin-top:8px;color:var(--ink2)}
html body #ybe .pastille{display:inline-flex;align-items:center;gap:6px;font:700 12px/1 var(--f-text);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:6px 10px;background:var(--warn-bg);color:var(--warn);vertical-align:middle}
html body #ybe .pastille[hidden]{display:none}
html body #ybe .score{display:flex;align-items:baseline;gap:6px}
html body #ybe .score b{font:700 64px/1 var(--f-display);letter-spacing:-.04em}
html body #ybe .score span{color:var(--mute);font-size:15px}
html body #ybe .onde{position:relative;margin-top:32px;border-radius:18px;background:var(--noir);padding:18px 18px 14px;display:flex;gap:16px;align-items:center}
html body #ybe .onde canvas{display:block;width:100%;height:96px;min-width:0;flex:1;cursor:pointer}
html body #ybe .lecture{flex:none;width:52px;height:52px;border-radius:50% !important;border:0 !important;padding:0 !important;background:#fff !important;color:#0B0D12 !important;display:flex;align-items:center;justify-content:center;cursor:pointer}
html body #ybe .lecture svg{width:20px;height:20px}
html body #ybe .onde .temps{position:absolute;right:20px;bottom:8px;font:12px var(--f-data);color:#9AA0A8}
html body #ybe .mesures{margin-top:28px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
html body #ybe .mesure{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:22px 22px 20px;display:flex;flex-direction:column;gap:10px;min-width:0}
html body #ybe .mesure .haut{display:flex;justify-content:space-between;align-items:center;gap:10px}
html body #ybe .mesure .val{font:700 40px/1 var(--f-display);letter-spacing:-.03em}
html body #ybe .mesure .val small{font:600 15px var(--f-text);letter-spacing:0;color:var(--mute);margin-left:4px}
html body #ybe .mesure .dit{font-size:14px;line-height:1.5;color:var(--ink2)}
html body #ybe .st{font:700 11px/1 var(--f-text);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:5px 9px;white-space:nowrap}
html body #ybe .st.ok{background:var(--ok-bg);color:var(--ok)}
html body #ybe .st.warn{background:var(--warn-bg);color:var(--warn)}
html body #ybe .st.bad{background:var(--bad-bg);color:var(--bad)}
html body #ybe .st.info{background:var(--bg);color:var(--ink2)}
html body #ybe .jauge{position:relative;height:28px;margin-top:4px}
html body #ybe .jauge .rail{position:absolute;left:0;right:0;top:12px;height:4px;border-radius:4px;background:var(--line)}
html body #ybe .jauge .cible{position:absolute;top:8px;height:12px;border-radius:6px;background:var(--zone);border:1px solid var(--mao)}
html body #ybe .jauge .curseur{position:absolute;top:4px;width:4px;height:20px;border-radius:2px;background:var(--ink);transform:translateX(-2px)}
html body #ybe .jauge .rep{position:absolute;top:0;width:1px;height:28px;background:var(--mute);opacity:.6}
html body #ybe .graduation{display:flex;justify-content:space-between;font:11px var(--f-data);color:var(--mute)}
html body #ybe .equilibre{margin-top:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px}
html body #ybe .equilibre .haut{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;align-items:baseline;margin-bottom:18px}
html body #ybe .equilibre h3{font-size:20px;letter-spacing:-.01em}
html body #ybe .equilibre .haut p{font-size:14px;color:var(--ink2)}
html body #ybe .bandes{display:grid;gap:10px}
html body #ybe .bande{display:grid;grid-template-columns:150px minmax(0,1fr) 64px;gap:16px;align-items:center}
html body #ybe .bande .nom{font-size:14px;line-height:1.3}
html body #ybe .bande .nom small{display:block;font:11px var(--f-data);color:var(--mute)}
html body #ybe .piste{position:relative;height:26px;border-radius:6px;background:var(--bg)}
html body #ybe .piste .tol{position:absolute;top:0;bottom:0;background:var(--zone);border-left:1px dashed var(--mao);border-right:1px dashed var(--mao)}
html body #ybe .piste .zero{position:absolute;top:-3px;bottom:-3px;left:50%;width:2px;background:var(--mao)}
html body #ybe .piste .ecart{position:absolute;top:6px;height:14px;border-radius:3px;background:var(--ink)}
html body #ybe .bande .db{font:600 14px var(--f-data);text-align:right}
html body #ybe .echelle{display:grid;grid-template-columns:150px minmax(0,1fr) 64px;gap:16px;margin-top:6px}
html body #ybe .echelle div:nth-child(2){display:flex;justify-content:space-between;font:11px var(--f-data);color:var(--mute)}
html body #ybe .bilan{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:48px;align-items:start}
html body #ybe .bilan h2{font-size:clamp(30px,4vw,44px);letter-spacing:-.03em;line-height:1.1}
html body #ybe .bilan .sous{margin-top:10px;color:var(--ink2);max-width:36em}
html body #ybe .travail{margin-top:28px;display:grid;gap:14px;counter-reset:t;list-style:none;padding:0 !important}
html body #ybe .travail>li{counter-increment:t;list-style:none;background:var(--bg);border-radius:14px;padding:22px 22px 20px 64px;position:relative}
html body #ybe .travail>li::before{content:counter(t);position:absolute;left:20px;top:20px;width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--card);font:700 15px/30px var(--f-display);text-align:center}
html body #ybe .travail h3{font-size:19px;line-height:1.3;letter-spacing:-.01em}
html body #ybe .travail p.pq{margin-top:6px;font-size:15px;color:var(--ink2)}
html body #ybe .travail ul{margin:12px 0 0;padding-left:18px;display:grid;gap:6px;font-size:15px}
html body #ybe .travail>li>ul li{list-style:disc}
html body #ybe .travail .liens{margin-top:12px;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:14px}
html body #ybe .bien{list-style:none;padding:0 !important;margin:20px 0 0;display:grid;gap:12px}
html body #ybe .bien li{display:flex;gap:12px;align-items:flex-start;font-size:15px;list-style:none}
html body #ybe .bien li svg{flex:none;margin-top:3px;color:var(--ok)}
html body #ybe .aside h3{font-size:22px;letter-spacing:-.02em}
html body #ybe .carte-f{margin-top:28px;background:var(--noir);color:var(--noir-ink);border-radius:18px;padding:24px}
html body #ybe .carte-f h3{color:#fff !important}
html body #ybe .carte-f p{color:var(--noir-ink2);font-size:15px;margin-top:8px}
html body #ybe .carte-f a{display:inline-flex;margin-top:16px;background:#fff;color:#0B0D12 !important;border-radius:999px;padding:11px 20px;font-size:15px}
html body #ybe .carte-f a:hover{text-decoration:none;filter:brightness(.95)}
html body #ybe .jeux{margin-top:16px;display:grid;gap:10px}
html body #ybe .jeux a{display:flex;justify-content:space-between;gap:12px;background:var(--bg);border-radius:12px;padding:14px 16px;font-size:15px}
html body #ybe .band.noir{background:var(--noir);color:var(--noir-ink)}
html body #ybe .avis-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:48px;align-items:start}
html body #ybe .avis h2{font-size:clamp(34px,4.6vw,56px);line-height:1.05;letter-spacing:-.035em;color:#fff !important}
html body #ybe .avis h2 span{color:#9AA0A8}
html body #ybe .avis-tx{display:grid;gap:16px;font-size:18px;line-height:1.6;color:var(--noir-ink2)}
html body #ybe .avis-btns{display:flex;flex-wrap:wrap;gap:12px 20px;margin-top:10px;align-items:center}
html body #ybe .avis-btns a.b1{background:#fff;color:#0B0D12 !important;border-radius:999px;padding:13px 24px;font-size:16px}
html body #ybe .avis-btns a.b1:hover{text-decoration:none;filter:brightness(.94)}
html body #ybe .avis-btns a.b2{color:#9CC2FF !important;font-size:16px}
@media (max-width:900px){
  html body #ybe .hero .wrap,html body #ybe .bilan,html body #ybe .avis-g{grid-template-columns:1fr}
  html body #ybe .mesures{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:600px){
  html body #ybe .band{padding-block:64px}
  html body #ybe .hero{min-height:0;padding-block:64px 72px}
  html body #ybe .mesures{grid-template-columns:1fr}
  html body #ybe .bande,html body #ybe .echelle{grid-template-columns:96px minmax(0,1fr) 52px;gap:10px}
  html body #ybe .travail>li{padding-left:56px}
  html body #ybe .travail>li::before{left:16px}
  html body #ybe .onde{padding:12px}
  html body #ybe .lecture{width:44px;height:44px}
}
@media (prefers-reduced-motion: reduce){html body #ybe *{transition:none!important;animation:none!important}}
/* bandeau final collé au pied de page (25 oct. 2026) */
html.yj-ok body.yt-ybe .yf-footer.yf-footer, html body.yt-ybe .yf-footer.yf-footer{ margin-top:0 !important; }
html body.yt-ybe #ybe, html body.yt-ybe .entry-content, html body.yt-ybe article, html body.yt-ybe .site-main, html body.yt-ybe #primary{ margin-bottom:0 !important; padding-bottom:0 !important; }
html body.yt-ybe .content-container, html body.yt-ybe #inner-wrap{ padding-bottom:0 !important; }

/* ---------- v1.1 : vos bilans (25 oct. 2026) ---------- */
html body #ybe .garder-lien{ display:inline-flex; margin-top:10px; font-size:15px; }
html body #ybe .garder-lien[hidden]{ display:none; }
html body #ybe .score-col{ display:flex; flex-direction:column; align-items:flex-end; }
html body #ybe .mes h2{ font-size:clamp(30px,4vw,44px); letter-spacing:-.03em; line-height:1.1; margin-top:6px; }
html body #ybe .mes .sous{ margin-top:12px; color:var(--ink2); max-width:40em; }
html body #ybe .mes-3{ list-style:none; padding:0 !important; margin:32px 0 0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
html body #ybe .mes-3 li{ list-style:none; background:var(--card); border:1px solid var(--line); border-radius:14px; padding:22px; display:flex; flex-direction:column; gap:6px; }
html body #ybe .mes-3 b{ font:700 17px/1.3 var(--f-display); }
html body #ybe .mes-3 span{ font-size:15px; color:var(--ink2); }
html body #ybe .mes-btns{ display:flex; flex-wrap:wrap; gap:12px 22px; align-items:center; margin-top:28px; }
html body #ybe .mes-btns a.b1{ background:var(--btn); color:var(--btn-ink) !important; border-radius:999px; padding:13px 24px; font-size:16px; }
html body #ybe .mes-btns a.b1:hover{ text-decoration:none; filter:brightness(1.1); }
html body #ybe .mes-btns a.b2{ font-size:16px; }
html body #ybe .mes-zone{ margin-top:32px; display:grid; gap:20px; }
html body #ybe .mes-zone[hidden], html body #ybe .mes-invite[hidden], html body #ybe .mes-garder[hidden], html body #ybe .mes-comp[hidden], html body #ybe .mes-vide[hidden], html body #ybe .mes-attente[hidden]{ display:none; }
html body #ybe .mes-attente, html body #ybe .mes-vide{ color:var(--ink2); }
html body #ybe .mes-garder{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:22px; }
html body #ybe .mes-champs{ display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px 16px; align-items:center; max-width:720px; }
html body #ybe .mes-champs label{ font-size:14px; font-weight:600; color:var(--ink2); }
html body #ybe .mes-champs label small{ font-weight:400; }
html body #ybe .mes-champs input{ height:44px; border-radius:10px !important; border:1px solid var(--line) !important; background:var(--bg) !important; color:var(--ink) !important; padding:0 14px !important; font:16px var(--f-text) !important; width:100%; }
html body #ybe .mes-champs button{ grid-column:2; justify-self:start; appearance:none; border:0 !important; border-radius:999px !important; background:var(--btn) !important; color:var(--btn-ink) !important; padding:12px 24px !important; font:600 16px var(--f-text) !important; cursor:pointer; margin-top:6px; }
html body #ybe .mes-champs button:disabled{ opacity:.6; cursor:wait; }
html body #ybe .mes-statut{ margin-top:12px; font-size:14px; color:var(--ok); min-height:1.2em; }
html body #ybe .mes-liste{ display:grid; gap:14px; }
html body #ybe .grp{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:18px 18px 10px; }
html body #ybe .grp-t{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; margin-bottom:8px; }
html body #ybe .grp-t h3{ font-size:19px; letter-spacing:-.01em; }
html body #ybe .grp-n{ font-size:13px; color:var(--mute); white-space:nowrap; }
html body #ybe .ver{ display:grid; grid-template-columns:44px minmax(0,1fr) auto auto; gap:12px; align-items:center; padding:10px 0; border-top:1px solid var(--line); }
html body #ybe .ver-v{ font:700 13px var(--f-data); color:var(--mute); }
html body #ybe .ver-i{ display:flex; flex-direction:column; gap:2px; min-width:0; }
html body #ybe .ver-i b{ font-size:15px; font-weight:600; overflow-wrap:anywhere; }
html body #ybe .ver-i small{ font:12px var(--f-data); color:var(--mute); }
html body #ybe .ver-s{ font:700 22px var(--f-display); letter-spacing:-.02em; }
html body #ybe button.ver-x{ appearance:none; border:1px solid var(--line) !important; background:transparent !important; color:var(--mute) !important; border-radius:999px !important; min-width:32px; height:32px; padding:0 10px !important; font:600 14px var(--f-text) !important; cursor:pointer; }
html body #ybe button.ver-x.ok{ color:var(--bad) !important; border-color:var(--bad) !important; }
html body #ybe .mes-comp{ background:var(--card); border:1px solid var(--line); border-radius:14px; padding:24px; }
html body #ybe .mes-comp h3{ font-size:20px; letter-spacing:-.01em; }
html body #ybe .mes-sel{ display:grid; grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr); gap:10px 12px; align-items:center; margin-top:14px; }
html body #ybe .mes-sel label{ font-size:14px; font-weight:600; color:var(--ink2); }
html body #ybe .mes-sel select{ width:100%; min-width:0; height:42px; border-radius:10px !important; border:1px solid var(--line) !important; background:var(--bg) !important; color:var(--ink) !important; padding:0 10px !important; font:14px var(--f-text) !important; }
html body #ybe .mes-resume{ margin-top:16px; font-weight:600; }
html body #ybe .mes-tabw{ margin-top:12px; overflow-x:auto; }
html body #ybe .mes-tab{ width:100%; border-collapse:collapse; font-size:15px; min-width:520px; }
html body #ybe .mes-tab th, html body #ybe .mes-tab td{ text-align:left; padding:10px 12px; border-bottom:1px solid var(--line); background:transparent !important; color:var(--ink); }
html body #ybe .mes-tab thead th{ font:700 11px var(--f-text); letter-spacing:.1em; text-transform:uppercase; color:var(--mute); }
html body #ybe .mes-tab tbody th{ font-weight:600; }
html body #ybe .evo{ font:700 11px/1 var(--f-text); letter-spacing:.06em; text-transform:uppercase; border-radius:999px; padding:5px 9px; white-space:nowrap; }
html body #ybe .evo.mieux{ background:var(--ok-bg); color:var(--ok); }
html body #ybe .evo.moins{ background:var(--bad-bg); color:var(--bad); }
html body #ybe .evo.stable{ background:var(--bg); color:var(--ink2); }
@media (max-width:760px){
  html body #ybe .mes-3{ grid-template-columns:1fr; }
  html body #ybe .mes-champs{ grid-template-columns:1fr; }
  html body #ybe .mes-champs button{ grid-column:1; }
  html body #ybe .mes-sel{ grid-template-columns:auto minmax(0,1fr); }
  html body #ybe .score-col{ align-items:flex-start; }
}

/* ---------- v1.2 : énergie, stéréo par bande, référence (25 oct. 2026) ---------- */
html body #ybe .carte2{position:relative;margin-top:16px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px}
html body #ybe .carte2 .haut{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 20px;align-items:baseline;margin-bottom:18px}
html body #ybe .carte2 h3{font-size:20px;letter-spacing:-.01em}
html body #ybe .carte2 .haut p{font-size:14px;color:var(--ink2);max-width:46em}
html body #ybe .carte2 .dit{font-size:14px;line-height:1.5;color:var(--ink2);margin-top:12px}
html body #ybe .en-courbe{display:block;width:100%;height:180px}
html body #ybe .ms .piste .tol{border-left:0}
html body #ybe .ms .piste .ecart.trop{background:var(--bad)}
html body #ybe .ref-drop{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;border:1.5px dashed var(--line);border-radius:12px;padding:16px 18px;cursor:pointer;transition:border-color .2s}
html body #ybe .ref-drop:hover,html body #ybe .ref-drop.sur{border-color:var(--ink)}
html body #ybe .ref-drop .b2{display:inline-flex;background:var(--ink);color:var(--card);border-radius:999px;padding:10px 18px;font-weight:600;font-size:15px}
html body #ybe .ref-drop small{font-size:14px;color:var(--ink2)}
html body #ybe .ref-inp{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
html body #ybe .ref-res{margin-top:18px}
html body #ybe .ref-res[hidden]{display:none}
html body #ybe .ref-res h4{font:700 16px/1.3 var(--f-display);margin:24px 0 12px;color:inherit;text-transform:none}
html body #ybe .ref-dit{margin-top:16px;font-size:15px;color:var(--ink2)}
html body #ybe .graduation span{white-space:nowrap}