/* Module « Parcours habilitation électrique » (préfixe hab-). Site en Bootstrap 3 : em/px uniquement, jamais rem. */
.hab-shell{--p:#c2410c;--p2:#f59e0b;--ink:#17213a;--muted:#5d6b85;--line:#dfe3f0;--soft:#fff8f1;--ok:#178a57;--bad:#c2412f;--warn:#d98a00;max-width:1240px;margin:0 auto;padding:18px;color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:16px;line-height:1.55}
.hab-shell *{box-sizing:border-box}
.hab-shell h1,.hab-shell h2,.hab-shell h3,.hab-shell h4{font-family:inherit;color:inherit;line-height:1.2}
.hab-shell h2{font-size:1.55em;font-weight:800;margin:0 0 8px}
.hab-shell h3{font-size:1.15em;font-weight:800;margin:18px 0 8px}
.hab-shell p{margin:0 0 10px}
.hab-loading{padding:60px;text-align:center;color:var(--muted);font-weight:700}
.hab-alert{background:#fff0ee;color:#8a2a1c;border-radius:12px;padding:14px 16px}
.hab-muted{color:var(--muted)}
.hab-small{font-size:.88em}
.hab-good{color:var(--ok)}
.hab-bad{color:var(--bad)}

/* Hero */
.hab-hero{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center;padding:32px 38px;border-radius:26px;color:#fff;background:linear-gradient(125deg,#1f2937 0%,var(--pc,#c2410c) 60%,#f59e0b 100%);box-shadow:0 18px 50px #c2410c30}
.hab-hero:after{content:"";position:absolute;right:-60px;top:-60px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,#ffffff22 0 2px,transparent 3px) 0 0/18px 18px;opacity:.7;pointer-events:none}
.hab-hero h1{font-size:2.5em;margin:6px 0 10px;font-weight:850;color:#fff}
.hab-hero p{font-size:1.06em;max-width:760px;opacity:.95;margin:0}
.hab-kicker{font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:.8em;opacity:.95}
.hab-pills{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.hab-pills span{padding:6px 12px;border:1px solid #ffffff55;border-radius:999px;background:#ffffff1c;font-size:.9em;font-weight:700}
.hab-ring{position:relative;width:116px;height:116px;text-align:center;z-index:1}
.hab-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.hab-ring circle{fill:none;stroke-width:10}
.hab-ring .bg{stroke:#ffffff30}
.hab-ring .fg{stroke:#fff;stroke-linecap:round;stroke-dasharray:327;transition:stroke-dashoffset .6s ease}
.hab-ring b{position:absolute;left:0;right:0;top:40px;font-size:1.5em}
.hab-ring small{display:block;font-weight:700;opacity:.9;margin-top:4px}

/* Onglets */
.hab-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 16px;position:sticky;top:0;z-index:5;background:#ffffffee;padding:8px 0;backdrop-filter:blur(4px)}
.hab-tab{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:10px 14px;font-weight:750;font-size:.95em;color:var(--ink);cursor:pointer;transition:all .15s}
.hab-tab:hover{border-color:var(--p2)}
.hab-tab.on{background:var(--p);border-color:var(--p);color:#fff;box-shadow:0 8px 20px #c2410c33}
.hab-tab .n{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#ffedd5;color:var(--p);font-size:.85em}
.hab-tab.on .n{background:#ffffff30;color:#fff}
.hab-tab.done .n{background:var(--ok);color:#fff}

/* Panneaux / cartes */
.hab-panel{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px 24px;margin-bottom:16px;box-shadow:0 6px 22px #17213a0a}
.hab-grid{display:grid;gap:14px}
.hab-g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.hab-g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.hab-g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.hab-g5{grid-template-columns:repeat(5,minmax(0,1fr))}
.hab-card{border:1px solid var(--line);border-radius:16px;padding:14px 16px;background:var(--soft)}
.hab-card h4{margin:0 0 6px;font-size:1.05em;font-weight:800}
.hab-card p{margin:0 0 4px;font-size:.94em}
.hab-card.warn{background:#fff8ec;border-color:#f3dcae}
.hab-card.rule{background:#f2fbf7;border-color:#c5e8d6}
.hab-card.ingr{border-top:5px solid var(--p)}
.hab-card.ingr.contexte{border-top-color:#2bb3c9}
.hab-card.ingr.tache{border-top-color:#e2683c}
.hab-card.ingr.format{border-top-color:#2f9e5b}
.hab-card.ingr.contraintes{border-top-color:#d9a400}
.hab-list{margin:0 0 6px;padding-left:22px}
.hab-list li{margin-bottom:4px}
.hab-info{margin-top:14px;border-radius:14px;padding:12px 16px;background:#ffedd5;border:1px solid #fed7aa}
.hab-info.ok{background:#e9f7ef;border-color:#b9e2c9}
.hab-info.warn{background:#fff4e0;border-color:#f3d79c}
.hab-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-top:10px}
.hab-next{justify-content:flex-end;margin:0 0 20px}
.hab-done-badge{display:inline-flex;align-items:center;gap:6px;background:#e5f6ec;color:#0f5c3a;border-radius:999px;padding:5px 14px;font-weight:800;font-size:.9em;margin-top:10px}
.hab-todo{display:inline-block;background:#fff3e6;color:#9a3412;border-radius:12px;padding:6px 12px;font-weight:700;font-size:.9em;margin-top:10px}

/* Frise */
.hab-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;counter-reset:f}
.hab-flow div{position:relative;border-radius:16px;padding:14px 16px;background:linear-gradient(135deg,#fff8f1,#eefbfd);border:1px solid var(--line)}
.hab-flow div:not(:last-child):after{content:"➜";position:absolute;right:-14px;top:50%;transform:translateY(-50%);color:var(--p);font-weight:900;z-index:1}
.hab-flow b{display:block;color:var(--p);margin-bottom:4px}
.hab-flow span{font-size:.93em}

/* Boutons */
.hab-btn{display:inline-flex;align-items:center;gap:6px;border:0;border-radius:12px;padding:9px 16px;font-weight:800;font-size:.95em;cursor:pointer;background:var(--p);color:#fff;transition:filter .15s}
.hab-btn:hover{filter:brightness(1.08)}
.hab-btn.alt{background:#ffedd5;color:var(--p)}
.hab-btn[disabled]{opacity:.45;cursor:not-allowed}

/* Jeu du mot suivant */
.hab-game{border:1px solid var(--line);border-radius:18px;padding:16px;background:#fbfbff}
.hab-sentence{font-size:1.25em;font-weight:700;background:#17213a;color:#e9ecff;border-radius:14px;padding:16px 18px;font-family:"Cascadia Code",Consolas,monospace;line-height:1.5}
.hab-caret{color:#f59e0b;animation:hab-blink 1s steps(1) infinite}
@keyframes hab-blink{50%{opacity:0}}
.hab-temp{font-weight:700;display:flex;align-items:center;gap:10px;margin:0}
.hab-temp input{width:200px}
.hab-bars{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.hab-bar{display:grid;grid-template-columns:minmax(120px,240px) 1fr 54px;gap:12px;align-items:center;border:1px solid var(--line);background:#fff;border-radius:12px;padding:8px 12px;cursor:pointer;text-align:left;color:var(--ink);font-size:.98em}
.hab-bar:hover{border-color:var(--p2);background:#fff8f1}
.hab-bar .w{font-weight:800}
.hab-bar .track{height:14px;border-radius:7px;background:#ecebf5;overflow:hidden}
.hab-bar .track span{display:block;height:100%;border-radius:7px;background:linear-gradient(90deg,#f59e0b,#2bb3c9);transition:width .3s}
.hab-bar .p{font-weight:800;text-align:right;color:var(--muted)}

/* Exercices */
.hab-ex{border:1px solid var(--line);border-radius:16px;padding:14px 16px}
.hab-ex.ok{border-color:#9fd8b8;background:#f4fbf7}
.hab-ex.ko{border-color:#f0b4a8;background:#fff8f6}
.hab-ex p{margin:0}
.hab-ex .fb,.hab-situ .fb{margin-top:8px;font-size:.92em}

/* Chasse aux erreurs */
.hab-chat{border:1px solid var(--line);border-radius:18px;padding:14px;margin-bottom:14px;background:#fafbfe}
.hab-chat.ok{border-color:#9fd8b8;background:#f4fbf7}
.hab-chat.ko{border-color:#f0b4a8;background:#fff8f6}
.hab-msg{border-radius:14px;padding:10px 14px;margin-bottom:10px;max-width:92%}
.hab-msg>span:first-child{display:block;font-size:.8em;font-weight:800;color:var(--muted);margin-bottom:2px}
.hab-msg.user{background:#e8f7fa;margin-left:auto}
.hab-msg.ai{background:#fff;border:1px solid var(--line);line-height:1.9}
.hab-sent{cursor:pointer;border-radius:6px;padding:2px 3px;transition:background .15s;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.hab-chat:not(.ok):not(.ko) .hab-sent:hover{background:#fff3e6}
.hab-sent.sel{background:#ffe2a8;box-shadow:inset 0 -2px 0 #d98a00}
.hab-sent.found{background:#ffd8cf;box-shadow:inset 0 -2px 0 var(--bad)}
.hab-sent.missed{background:#ffd8cf;outline:2px dashed var(--bad)}
.hab-sent.false{background:#e2f3e9;text-decoration:line-through;text-decoration-color:var(--ok)}
.hab-chat.ok .hab-sent,.hab-chat.ko .hab-sent{cursor:default}
.hab-fb{font-size:.92em;margin:4px 0 10px}
.hab-fb p{margin:0 0 6px}

/* Prompts */
.hab-opt{display:block;width:100%;text-align:left;border:1px solid #cfd5e6;background:#fff;border-radius:12px;padding:10px 14px;margin:8px 0;cursor:pointer;font-size:.95em;color:var(--ink)}
.hab-opt:hover{border-color:var(--p2)}
.hab-opt.sel{border-color:var(--p);background:#fff3e6;font-weight:700}
.hab-opt.good{border-color:var(--ok);background:#e5f6ec}
.hab-opt.wrong{border-color:var(--bad);background:#ffe9e4}
.hab-prompt{font-family:"Cascadia Code",Consolas,monospace;font-size:.95em}
.hab-checks{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.hab-chk{border:1px solid #cfd5e6;background:#fff;border-radius:12px;padding:8px 14px;font-weight:750;cursor:pointer;color:var(--ink);font-size:.95em}
.hab-chk.on{border-color:var(--p);background:#fff3e6}
.hab-chk.good{border-color:var(--ok);background:#e5f6ec}
.hab-chk.wrong{border-color:var(--bad);background:#ffe9e4}
.hab-build{border:1px solid var(--line);border-radius:18px;padding:14px 16px;margin-bottom:14px}
.hab-build.ok{border-color:#9fd8b8;background:#f8fdfa}
.hab-build.ko{border-color:#f0b4a8;background:#fffaf8}
.hab-build h3{margin-top:0}
.hab-buildgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.hab-field label{display:block;font-weight:800;font-size:.92em;margin-bottom:4px}
.hab-input{width:100%;border:1px solid #cfd5e6;border-radius:10px;padding:8px 10px;font-size:.93em;background:#fff;color:var(--ink);height:auto}
.hab-preview{margin-top:12px;border-radius:14px;padding:12px 14px;background:#17213a;color:#e9ecff;font-family:"Cascadia Code",Consolas,monospace;font-size:.93em}
.hab-preview span{display:block;font-family:inherit;color:#a99bff;font-weight:800;margin-bottom:4px}
.hab-preview .hab-muted{color:#9aa3bf}

/* Situations */
.hab-situ{border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px}
.hab-situ.ok{border-color:#9fd8b8;background:#f4fbf7}
.hab-situ.ko{border-color:#f0b4a8;background:#fff8f6}
.hab-situ p{margin:0 0 8px}
.hab-seg{display:inline-flex;flex-wrap:wrap;gap:6px;background:#f1f2f8;border-radius:14px;padding:5px}
.hab-seg button{border:0;background:transparent;padding:7px 12px;border-radius:10px;font-weight:800;color:var(--ink);cursor:pointer;font-size:.92em}
.hab-seg button.on.ok{background:#d9f2e4;color:#0f5c3a}
.hab-seg button.on.att{background:#ffeccc;color:#8a5600}
.hab-seg button.on.non{background:#ffdcd5;color:#8a2a1c}
.hab-charter ol{padding-left:22px}
.hab-charter li{margin-bottom:6px}

/* Quiz */
.hab-q{border:1px solid var(--line);border-radius:16px;padding:14px 16px;margin-bottom:12px}
.hab-q p{font-weight:750}
.hab-verdict{text-align:center;border-radius:16px;padding:16px;margin-bottom:14px;font-weight:800}
.hab-verdict.ok{background:#e5f6ec;color:#0f5c3a}
.hab-verdict.bad{background:#fff0ec;color:#8a2a1c}
.hab-score{font-size:2.4em;font-weight:900}

/* Toasts */
.hab-toasts{position:fixed;right:18px;bottom:18px;z-index:9999;display:flex;flex-direction:column;gap:8px}
.hab-toast{background:#17213a;color:#fff;padding:10px 16px;border-radius:12px;font-weight:700;box-shadow:0 10px 30px #0003;font-size:15px;transition:opacity .4s,transform .4s}
.hab-toast.ok{background:#178a57}
.hab-toast.out{opacity:0;transform:translateY(8px)}

@media print{
  .hab-hero,.hab-tabs,.hab-next,.hab-panel:not(.hab-charter),.hab-btn{display:none!important}
  .hab-charter{border:0;box-shadow:none}
}
@media (max-width:980px){
  .hab-g4,.hab-g5{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hab-g3{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .hab-shell{padding:10px}
  .hab-hero{grid-template-columns:1fr;padding:24px 20px}
  .hab-hero h1{font-size:1.9em}
  .hab-g2,.hab-g3,.hab-g4,.hab-g5,.hab-flow,.hab-buildgrid{grid-template-columns:1fr}
  .hab-flow div:not(:last-child):after{content:"⬇";right:50%;top:auto;bottom:-16px;transform:translateX(50%)}
  .hab-bar{grid-template-columns:1fr 46px}
  .hab-bar .track{grid-column:1/-1;grid-row:2}
  .hab-panel{padding:16px}
  .hab-tab{padding:8px 10px;font-size:.88em}
  .hab-msg{max-width:100%}
}

/* ===== Spécifique habilitation ===== */
.hab-tab.locked{opacity:.5}
.hab-sym{display:inline-block;background:#fff;color:var(--pc,#c2410c);border-radius:10px;padding:0 12px;margin-right:6px;font-weight:900}
.hab-bigsym{display:inline-block;background:#1f2937;color:#fff;border-radius:12px;padding:6px 14px;font-weight:900;font-size:1.3em;letter-spacing:.02em}
.hab-bigsym.sm{font-size:1.1em;padding:4px 12px}
.hab-tag{display:inline-block;color:#fff;border-radius:8px;padding:1px 8px;font-size:.8em;font-weight:800;vertical-align:1px}
.hab-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.hab-flow div{border-radius:16px;padding:14px 16px;background:var(--soft);border:1px solid var(--line)}
.hab-flow b{display:block;color:var(--p);margin-bottom:4px}
.hab-flow span{font-size:.93em}
.hab-pgrid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.hab-pcard{display:flex;flex-direction:column;gap:6px;text-align:left;border:1px solid var(--line);background:#fff;border-radius:18px;padding:16px;cursor:pointer;color:var(--ink);transition:all .15s;font-size:.95em}
.hab-pcard:hover{border-color:var(--p2);box-shadow:0 8px 22px #0000000f;transform:translateY(-2px)}
.hab-pcard.on{border:2px solid var(--p);background:#fffaf5}
.hab-pcard .sym{align-self:flex-start;color:#fff;border-radius:10px;padding:4px 12px;font-weight:900;font-size:1.15em}
.hab-pcard b{font-size:1.05em}
.hab-pcard .who{color:var(--muted);font-size:.9em;min-height:2.8em}
.hab-pcard .bar{height:8px;border-radius:4px;background:#eef0f4;overflow:hidden}
.hab-pcard .bar span{display:block;height:100%}
.hab-effect{border:1px solid var(--line);border-radius:16px;padding:16px;background:#fbfcfe}
.hab-range{width:100%}
.hab-scale{display:flex;justify-content:space-between;font-size:.8em;color:var(--muted);margin:2px 0 10px}
.hab-effect-out{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.hab-effect-out .v{font-size:2em;font-weight:900;min-width:130px}
.hab-effect-out .lvl{flex:1;min-width:220px;border-radius:14px;padding:10px 14px;background:#eef2f6}
.hab-effect-out .lvl b{display:block}
.hab-effect-out .l1{background:#e6f6ec}.hab-effect-out .l2{background:#fff6d6}.hab-effect-out .l3{background:#ffe7cc}.hab-effect-out .l4{background:#ffd6cc}.hab-effect-out .l5{background:#3b0d0d;color:#fff}
.hab-table{width:100%;border-collapse:collapse;font-size:.93em}
.hab-table th,.hab-table td{border-bottom:1px solid var(--line);padding:8px 10px;text-align:left}
.hab-table th{background:#fff1e3}
.hab-tablewrap{overflow-x:auto;margin-bottom:6px}
.hab-line{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;border:1px solid var(--line);border-radius:12px;padding:8px 12px;margin-bottom:8px}
.hab-line.ok{border-color:#9fd8b8;background:#f4fbf7}
.hab-line.ko{border-color:#f0b4a8;background:#fff8f6}
.hab-line>span{font-weight:700}
.hab-seg{display:inline-flex;flex-wrap:wrap;gap:4px;background:#f1f2f6;border-radius:12px;padding:4px}
.hab-seg button{border:0;background:transparent;padding:6px 12px;border-radius:9px;font-weight:800;color:var(--ink);cursor:pointer;font-size:.9em}
.hab-seg button.on{background:#fff;color:var(--p);box-shadow:0 2px 8px #0001}
.hab-seq{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.hab-seq-done{margin:0;padding:12px 12px 12px 36px;border-radius:16px;background:#f4fbf7;border:1px solid #c5e8d6;min-height:100px}
.hab-seq-done li{margin-bottom:6px;font-weight:650}
.hab-seq-done li.empty{list-style:none;margin-left:-22px;color:var(--muted);font-weight:500}
.hab-seq-cards{display:flex;flex-direction:column;gap:8px}
.hab-seq-card{text-align:left;border:1px solid #d6dbe4;background:#fff;border-radius:12px;padding:10px 14px;cursor:pointer;color:var(--ink);font-size:.95em;transition:all .15s}
.hab-seq-card:hover:not([disabled]){border-color:var(--p2);background:#fffaf3}
.hab-seq-card.trap{background:#ffe9e4;border-color:#f0b4a8;text-decoration:line-through;opacity:.8}
.hab-seq-card[disabled]{cursor:default}
.hab-decoder{border:1px solid var(--line);border-radius:16px;padding:14px;background:#fbfcfe}
.hab-decsel{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.hab-decsel label{font-weight:800;font-size:.88em;margin:0}
.hab-decout{display:flex;align-items:center;gap:14px;margin-top:12px;flex-wrap:wrap}
.hab-zone{border:1px solid var(--line);border-radius:16px;background:#fbfcfe;padding:8px}
.hab-zone svg{width:100%;height:auto;display:block}
.hab-zone .t{font-weight:800;font-size:13px;fill:#1f2937}
.hab-zone .s{font-size:11px;fill:#475569}
.hab-zone .z{font-weight:900;font-size:12px;fill:#dc2626}
.hab-zone .who{transition:transform .2s}
.hab-epi{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.hab-epi-item{display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-align:left;border:1px solid #d6dbe4;background:#fff;border-radius:14px;padding:10px 12px;cursor:pointer;color:var(--ink);font-size:.92em;font-weight:650}
.hab-epi-item .ic{font-size:1.6em}
.hab-epi-item small{font-weight:500;color:var(--muted)}
.hab-epi-item.on{border-color:var(--p);background:#fff3e6}
.hab-epi-item.good{border-color:var(--ok);background:#e5f6ec}
.hab-epi-item.wrong{border-color:var(--bad);background:#ffe9e4}
.hab-rolehead{display:flex;gap:16px;align-items:center;margin-bottom:12px}
.hab-rolehead h2{margin:0}
.hab-rolehead p{margin:0}
.hab-can,.hab-cannot{border-radius:16px;padding:14px 16px}
.hab-can{background:#f0faf4;border:1px solid #c5e8d6}
.hab-cannot{background:#fff4f1;border:1px solid #f6c8bd}
.hab-can h4,.hab-cannot h4{margin:0 0 6px;font-weight:800}
.hab-can ul,.hab-cannot ul{margin:0;padding-left:20px}
.hab-can li,.hab-cannot li{margin-bottom:4px}
.hab-videos{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.hab-video{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}
.hab-video .frame{position:relative;padding-top:56.25%;background:#111 center/cover no-repeat;cursor:pointer}
.hab-video .frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.hab-video .frame .play{position:absolute;inset:0;display:grid;place-items:center;font-size:3em;color:#fff;text-shadow:0 4px 16px #000a;background:linear-gradient(transparent 50%,#0007)}
.hab-video .cap{padding:10px 12px}
.hab-video .cap b{display:block;font-size:.95em}
.hab-video .cap small{color:var(--muted)}
@media (max-width:980px){.hab-flow{grid-template-columns:repeat(2,minmax(0,1fr))}.hab-decsel{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.hab-flow,.hab-seq,.hab-decsel{grid-template-columns:1fr}.hab-rolehead{flex-direction:column;align-items:flex-start}.hab-effect-out .v{font-size:1.6em}}