/* =====================================================================
   Mémoclic — feuille de style unique
   Les polices IBM Plex sont chargées par <link> dans index.html.
   ===================================================================== */

html{-webkit-text-size-adjust:100%;}
body{margin:0;}
img{max-width:100%;}
[hidden]{display:none!important;}

:root{
  color-scheme: light;
  --bg:#ffffff; --surface:#ffffff; --surface-2:#f2f5f6; --surface-3:#e5ebed;
  --text:#11181c; --text-muted:#5a6870; --border:#dbe3e6;
  --accent:#0f7a6b; --accent-strong:#0b5c50; --accent-soft:#e2f4f0; --accent-ink:#ffffff;
  --warn:#a8551c; --warn-soft:#fdf0e4;
  --bad:#b13434; --bad-soft:#fdeaea;
  --good:#1c8a4c; --good-soft:#e6f6ec;
  --violet:#5b4bb7; --violet-soft:#eeeafb;
  --shadow:0 1px 2px rgba(20,30,32,.05), 0 4px 14px rgba(20,30,32,.06);
  --shadow-lg:0 10px 44px rgba(20,30,32,.16);
  --term-bg:#14171a; --term-bar:#202427; --term-text:#dce3e0;
  --term-prompt:#4fd1b8; --term-path:#7aa2f7; --term-out:#8ecf9d;
  --term-comment:#7c8790; --term-warn:#f2b664;
}

*{box-sizing:border-box;}
body{background:var(--bg); color:var(--text); font-family:'IBM Plex Sans',system-ui,sans-serif; line-height:1.55; font-size:15.5px;}
h1,h2,h3,h4{font-family:'IBM Plex Mono',ui-monospace,monospace; text-wrap:balance; font-weight:700; letter-spacing:-.01em; color:var(--text);}
a{color:var(--accent); text-decoration:none;}
code,pre,kbd{font-family:'IBM Plex Mono',ui-monospace,monospace;}
code{background:var(--surface-2); border:1px solid var(--border); padding:.05em .4em; border-radius:5px; font-size:.88em; color:var(--accent-strong); white-space:nowrap;}
::selection{background:var(--accent-soft);}
button{font-family:inherit;}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}

/* ---------- App shell ---------- */
.topbar{
  position:sticky; top:0; z-index:60; background:var(--bg);
  border-bottom:1px solid var(--border); padding:.7rem 1.4rem;
  display:flex; align-items:center; gap:1rem;
}
.logo{display:flex; align-items:center; gap:.5rem; cursor:pointer; background:none; border:none; padding:0; color:var(--text);}
.logo-mark{
  width:28px; height:28px; border-radius:8px; background:var(--term-bg); color:var(--term-prompt);
  display:grid; place-items:center; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:.9rem;
}
.logo-text{font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:1rem;}
.logo-text span{color:var(--accent);}
.topbar-spacer{flex:1;}
.top-status{font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--text-muted); display:flex; align-items:center; gap:.4rem;}
.dot-live{width:7px; height:7px; border-radius:50%; background:var(--good);}
.dot-off{width:7px; height:7px; border-radius:50%; background:var(--text-muted);}

.wrap{max-width:1180px; margin:0 auto; padding:1.8rem 1.4rem 5rem;}
.wrap-narrow{max-width:840px;}

/* ---------- Buttons ---------- */
.btn{
  font-weight:600; font-size:.87rem; padding:.55rem 1rem; border-radius:9px;
  border:1px solid var(--border); background:var(--surface); color:var(--text); cursor:pointer;
  display:inline-flex; align-items:center; gap:.45rem; line-height:1.3;
}
.btn:hover:not(:disabled){border-color:var(--accent);}
.btn:disabled{opacity:.5; cursor:not-allowed;}
.btn.primary{background:var(--accent); border-color:var(--accent); color:#ffffff;}
.btn.primary:hover:not(:disabled){background:var(--accent-strong); border-color:var(--accent-strong);}
.btn.ghost{background:transparent; border-color:transparent; color:var(--text-muted);}
.btn.ghost:hover:not(:disabled){background:var(--surface-2); color:var(--text);}
.btn.danger{color:var(--bad); border-color:var(--bad);}
.btn.sm{font-size:.78rem; padding:.35rem .7rem; border-radius:7px;}
.btn.lg{font-size:.95rem; padding:.75rem 1.4rem;}
.btn-row{display:flex; gap:.6rem; flex-wrap:wrap; align-items:center;}

/* ---------- Forms ---------- */
.field{display:block; margin-bottom:1.1rem;}
.field label{display:block; font-size:.78rem; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); margin-bottom:.35rem; font-family:'IBM Plex Mono',monospace;}
.input, .textarea, .select{
  width:100%; font-family:'IBM Plex Sans',sans-serif; font-size:.92rem; padding:.6rem .8rem;
  border-radius:9px; border:1px solid var(--border); background:var(--surface); color:var(--text);
}
.textarea{min-height:96px; resize:vertical; line-height:1.5;}
.input.mono, .textarea.mono{font-family:'IBM Plex Mono',monospace; font-size:.86rem;}
.hint{font-size:.78rem; color:var(--text-muted); margin-top:.3rem;}

/* ---------- Library ---------- */
.hero-lib{margin-bottom:1.6rem;}
.hero-lib h1{font-size:1.9rem; margin:0 0 .35rem;}
.hero-lib p{color:var(--text-muted); max-width:62ch; margin:0 0 1.2rem;}
.searchbar{display:flex; gap:.6rem; margin-bottom:.6rem; flex-wrap:wrap;}
.searchbar .input{flex:1; min-width:220px;}
.memo-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:1rem;}
.memo-card{
  background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:1.1rem 1.2rem;
  box-shadow:var(--shadow); cursor:pointer; display:flex; flex-direction:column; gap:.5rem; text-align:left;
  transition:transform .15s ease, border-color .15s ease;
}
.memo-card:hover{transform:translateY(-2px); border-color:var(--accent);}
.memo-card h3{font-size:1.02rem; margin:0;}
.memo-card p{font-size:.85rem; color:var(--text-muted); margin:0; flex:1; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;}
.memo-meta{display:flex; gap:.4rem; flex-wrap:wrap; font-family:'IBM Plex Mono',monospace; font-size:.68rem; color:var(--text-muted);}
.chip{background:var(--surface-2); border:1px solid var(--border); border-radius:99px; padding:.12rem .5rem;}
.chip.accent{background:var(--accent-soft); color:var(--accent-strong); border-color:transparent;}
.chip.tmpl{background:var(--violet-soft); color:var(--violet); border-color:transparent;}
.card-new{
  border:1.5px dashed var(--border); background:transparent; display:grid; place-items:center; min-height:150px;
  gap:.4rem; color:var(--text-muted); cursor:pointer; border-radius:14px; text-align:center; padding:1.2rem;
}
.card-new:hover{border-color:var(--accent); color:var(--accent-strong);}
.card-new .plus{font-size:1.6rem; font-family:'IBM Plex Mono',monospace;}
.empty-state{text-align:center; padding:3rem 1rem; color:var(--text-muted);}

/* ---------- Dropzone ---------- */
.dropzone{
  border:1.5px dashed var(--border); border-radius:14px; padding:2rem 1.2rem; text-align:center;
  background:var(--surface); cursor:pointer; transition:.15s;
}
.dropzone.over{border-color:var(--accent); background:var(--accent-soft);}
.dropzone .dz-icon{font-size:1.6rem;}
.dropzone .dz-main{font-weight:600; margin-top:.4rem;}
.dropzone .dz-sub{font-size:.8rem; color:var(--text-muted); margin-top:.25rem;}
.file-list{display:flex; flex-direction:column; gap:.4rem; margin-top:.9rem;}
.file-row{
  display:flex; align-items:center; gap:.6rem; padding:.5rem .7rem; background:var(--surface-2);
  border:1px solid var(--border); border-radius:9px; font-size:.84rem;
}
.file-row .fname{flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:'IBM Plex Mono',monospace; font-size:.8rem;}
.file-row .fsize{font-family:'IBM Plex Mono',monospace; font-size:.72rem; color:var(--text-muted);}
.file-row.err{background:var(--bad-soft); border-color:var(--bad);}
.file-row.ok .fstate{color:var(--good);}

/* ---------- Progress ---------- */
.progress{height:8px; background:var(--surface-2); border-radius:99px; overflow:hidden; margin:.5rem 0;}
.progress-bar{height:100%; background:var(--accent); width:0%; transition:width .35s ease;}
.gen-log{
  font-family:'IBM Plex Mono',monospace; font-size:.78rem; background:var(--term-bg); color:var(--term-text);
  border-radius:10px; padding:.8rem 1rem; max-height:230px; overflow-y:auto; line-height:1.7;
}
.gen-log .ok{color:var(--term-out);}
.gen-log .warn{color:var(--term-warn);}
.gen-log .muted{color:var(--term-comment);}

/* ---------- Memo shell ---------- */
.memo-head{margin-bottom:1.2rem;}
.crumb{font-family:'IBM Plex Mono',monospace; font-size:.75rem; color:var(--text-muted); margin-bottom:.5rem; display:flex; gap:.5rem; align-items:center;}
.crumb button{background:none; border:none; color:var(--accent); cursor:pointer; font:inherit; padding:0;}
.memo-head h1{font-size:1.6rem; margin:0 0 .3rem;}
.memo-head .desc{color:var(--text-muted); max-width:70ch; margin:0;}
.tabbar{
  display:flex; gap:.25rem; border-bottom:1px solid var(--border); margin:1.2rem 0 1.4rem;
  overflow-x:auto; scrollbar-width:thin;
}
.tab{
  background:none; border:none; padding:.6rem .85rem; cursor:pointer; font-size:.86rem; font-weight:600;
  color:var(--text-muted); border-bottom:2px solid transparent; white-space:nowrap; display:flex; gap:.35rem; align-items:center;
}
.tab:hover{color:var(--text);}
.tab.active{color:var(--accent-strong); border-bottom-color:var(--accent);}
.tab .tab-count{font-family:'IBM Plex Mono',monospace; font-size:.68rem; background:var(--surface-2); border-radius:99px; padding:.05rem .35rem;}

.panel{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:1.5rem 1.6rem; box-shadow:var(--shadow); margin-bottom:1.2rem;}
.panel-title{font-size:1.05rem; margin:0 0 .3rem;}
.panel-sub{font-size:.85rem; color:var(--text-muted); margin:0 0 1rem; max-width:70ch;}
.toolbar{display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; margin-bottom:1rem;}

/* ---------- Course content (rendered memo sections) ---------- */
.prose p{max-width:74ch;}
.doc-section{margin-bottom:2.4rem; scroll-margin-top:4.5rem;}
.doc-head{display:flex; align-items:baseline; gap:.6rem; border-bottom:1px solid var(--border); padding-bottom:.5rem; margin-bottom:1rem;}
.doc-head h2{font-size:1.3rem; margin:0;}
.module-tag{font-family:'IBM Plex Mono',monospace; font-size:.72rem; color:var(--accent-strong); background:var(--accent-soft); border-radius:5px; padding:.15rem .5rem; font-weight:600;}
.doc-toc{display:flex; flex-wrap:wrap; gap:.35rem; margin-bottom:1.4rem;}
.doc-toc a{font-size:.78rem; padding:.25rem .6rem; border-radius:99px; background:var(--surface-2); border:1px solid var(--border); color:var(--text);}
.doc-toc a:hover{border-color:var(--accent); color:var(--accent-strong);}

.callout{border-left:3px solid var(--warn); background:var(--warn-soft); padding:.7rem 1rem; border-radius:0 8px 8px 0; font-size:.9rem; margin:1rem 0; max-width:74ch;}
.callout strong{color:var(--warn);}
.callout.good{border-color:var(--good); background:var(--good-soft);}
.callout.good strong{color:var(--good);}
.callout.info{border-color:var(--accent); background:var(--accent-soft);}
.callout.info strong{color:var(--accent-strong);}

.table-wrap{overflow-x:auto; border-radius:10px;}
table.cmd-table{width:100%; border-collapse:collapse; margin:1rem 0 1.4rem; font-size:.86rem; background:var(--surface); border:1px solid var(--border); border-radius:10px; overflow:hidden; box-shadow:var(--shadow);}
table.cmd-table th{text-align:left; background:var(--surface-2); padding:.55rem .8rem; font-family:'IBM Plex Mono',monospace; font-size:.7rem; text-transform:uppercase; letter-spacing:.06em; color:var(--text-muted); border-bottom:1px solid var(--border); white-space:nowrap;}
table.cmd-table td{padding:.55rem .8rem; border-bottom:1px solid var(--border); vertical-align:top;}
table.cmd-table tr:last-child td{border-bottom:none;}
table.cmd-table tr:hover td{background:var(--surface-2);}
table.cmd-table td.cmdcell code{white-space:nowrap; font-weight:600;}
table.cmd-table td small{color:var(--text-muted); display:block; margin-top:.15rem; font-family:'IBM Plex Mono',monospace; font-size:.78rem; white-space:pre-wrap;}
tr.base-row td{background:var(--accent-soft);}
tr.base-row td:first-child code{font-weight:700; color:var(--accent-strong);}
.row-badge{font-size:.6rem; text-transform:uppercase; letter-spacing:.07em; font-weight:700; color:var(--accent-strong); background:var(--surface); border:1px solid var(--accent); border-radius:5px; padding:.1rem .4rem; margin-left:.5rem; font-family:'IBM Plex Mono',monospace; vertical-align:middle; white-space:nowrap;}
tr.opt-row td:first-child{padding-left:1.5rem;}
.opt-arrow{color:var(--text-muted); margin-right:.4rem; font-family:'IBM Plex Mono',monospace;}

pre.snippet{background:var(--term-bg); color:var(--term-text); padding:.85rem 1rem; border-radius:9px; overflow-x:auto; font-size:.83rem; line-height:1.65; margin:.8rem 0; box-shadow:var(--shadow);}
.term{background:var(--term-bg); border-radius:11px; overflow:hidden; margin:1.1rem 0; box-shadow:var(--shadow); max-width:74ch;}
.term-bar{background:var(--term-bar); padding:.5rem .7rem; display:flex; gap:.4rem;}
.term-dot{width:9px; height:9px; border-radius:50%;}
.term-body{padding:.9rem 1.05rem 1.05rem; font-family:'IBM Plex Mono',monospace; font-size:.82rem; line-height:1.75; color:var(--term-text); overflow-x:auto; white-space:pre;}
.term-body .p,pre.snippet .p{color:var(--term-prompt);}
.term-body .path,pre.snippet .path{color:var(--term-path);}
.term-body .o,pre.snippet .o{color:var(--term-out);}
.term-body .c,pre.snippet .c{color:var(--term-comment); font-style:italic;}
.term-body .w,pre.snippet .w{color:var(--term-warn);}

.field-diagram{display:flex; flex-wrap:wrap; gap:.3rem; margin:1rem 0; font-family:'IBM Plex Mono',monospace; font-size:.78rem;}
.field-chip{background:var(--surface); border:1px solid var(--border); border-radius:7px; padding:.4rem .55rem; min-width:90px;}
.field-chip .k{display:block; font-weight:700; color:var(--accent-strong); font-size:.85rem;}
.field-chip .v{display:block; color:var(--text-muted); font-size:.7rem; margin-top:.1rem;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:1.2rem;}
@media (max-width:760px){.grid-2{grid-template-columns:1fr;}}
.kbd{display:inline-block; padding:.05em .45em; border:1px solid var(--border); border-bottom-width:2px; border-radius:5px; background:var(--surface); font-family:'IBM Plex Mono',monospace; font-size:.82em;}

/* ---------- Lookup ---------- */
.lookup-count{font-size:.78rem; color:var(--text-muted); margin-bottom:.6rem; font-family:'IBM Plex Mono',monospace;}
tr.lookup-cat td{background:var(--surface-2); font-family:'IBM Plex Mono',monospace; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--accent-strong); font-weight:700; padding:.4rem .8rem;}

/* ---------- Flashcards ---------- */
.fc-stage{display:flex; justify-content:center; margin:1rem 0;}
.flip-card{width:100%; max-width:540px; height:240px; perspective:1200px; cursor:pointer;}
.flip-inner{position:relative; width:100%; height:100%; transition:transform .5s cubic-bezier(.2,.7,.3,1); transform-style:preserve-3d;}
.flip-card.flipped .flip-inner{transform:rotateY(180deg);}
.flip-face{position:absolute; inset:0; backface-visibility:hidden; border-radius:14px; border:1px solid var(--border); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:1.6rem; box-shadow:var(--shadow); overflow:auto;}
.flip-front{background:var(--surface);}
.flip-front .fc-label{font-family:'IBM Plex Mono',monospace; font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-muted); margin-bottom:.7rem;}
.flip-front .fc-main{font-family:'IBM Plex Mono',monospace; font-size:1.45rem; font-weight:700; color:var(--accent-strong); word-break:break-word;}
.flip-back{background:var(--accent-soft); transform:rotateY(180deg); color:var(--text);}
.flip-back .fc-main{font-size:.98rem; line-height:1.5;}
.fc-hint{text-align:center; font-size:.76rem; color:var(--text-muted); margin-top:.6rem;}
.fc-nav{display:flex; justify-content:center; gap:.7rem; margin-top:1rem; flex-wrap:wrap;}
.btn.know{border-color:var(--good); color:var(--good);}
.btn.review{border-color:var(--warn); color:var(--warn);}
.fc-stats{font-family:'IBM Plex Mono',monospace; font-size:.78rem; color:var(--text-muted);}
.mastery-bar{display:flex; height:8px; border-radius:99px; overflow:hidden; background:var(--surface-2); margin:.5rem 0 1rem;}
.mastery-bar span{display:block; height:100%;}
.mastery-bar .m-known{background:var(--good);}
.mastery-bar .m-review{background:var(--warn);}
.mastery-bar .m-new{background:var(--surface-3);}

/* ---------- Verify modal (flashcard competence test) ---------- */
.modal-back{position:fixed; inset:0; background:rgba(8,12,14,.62); backdrop-filter:blur(3px); display:grid; place-items:center; z-index:200; padding:1.2rem;}
.modal{background:var(--surface); border:1px solid var(--border); border-radius:16px; box-shadow:var(--shadow-lg); max-width:620px; width:100%; max-height:88vh; overflow-y:auto; padding:1.6rem;}
.modal h3{margin:0 0 .3rem; font-size:1.1rem;}
.modal .modal-sub{color:var(--text-muted); font-size:.85rem; margin:0 0 1.1rem;}
.modal-foot{display:flex; justify-content:flex-end; gap:.6rem; margin-top:1.2rem;}

/* ---------- Quiz ---------- */
.quiz-progress{height:6px; background:var(--surface-2); border-radius:99px; overflow:hidden; margin-bottom:1.2rem;}
.quiz-progress-bar{height:100%; background:var(--accent); width:0%; transition:width .3s ease;}
.quiz-card{background:var(--surface); border:1px solid var(--border); border-radius:14px; padding:1.5rem 1.6rem; box-shadow:var(--shadow);}
.quiz-meta{font-family:'IBM Plex Mono',monospace; font-size:.72rem; color:var(--text-muted); margin-bottom:.5rem; text-transform:uppercase; letter-spacing:.06em; display:flex; gap:.5rem; align-items:center; flex-wrap:wrap;}
.type-badge{border-radius:5px; padding:.1rem .45rem; font-weight:700; font-size:.62rem; letter-spacing:.05em;}
.type-mcq{background:var(--accent-soft); color:var(--accent-strong);}
.type-tf{background:var(--violet-soft); color:var(--violet);}
.type-input{background:var(--warn-soft); color:var(--warn);}
.type-reverse{background:var(--good-soft); color:var(--good);}
.quiz-q{font-size:1.06rem; font-weight:600; margin-bottom:1.1rem;}
.quiz-q code{white-space:pre-wrap;}
.quiz-options{display:flex; flex-direction:column; gap:.55rem;}
.quiz-opt{text-align:left; padding:.7rem .9rem; border-radius:9px; border:1px solid var(--border); background:var(--bg); cursor:pointer; font-size:.9rem; color:var(--text);}
.quiz-opt:hover:not(:disabled){border-color:var(--accent);}
.quiz-opt.correct{background:var(--good-soft); border-color:var(--good); font-weight:600;}
.quiz-opt.wrong{background:var(--bad-soft); border-color:var(--bad);}
.quiz-opt:disabled{cursor:default;}
.quiz-input-row{display:flex; gap:.6rem; flex-wrap:wrap;}
.quiz-input-row .input{flex:1; min-width:200px;}
.quiz-explain{margin-top:1rem; padding:.8rem .9rem; background:var(--surface-2); border-radius:9px; font-size:.88rem;}
.quiz-explain.right{background:var(--good-soft);}
.quiz-explain.wrong{background:var(--bad-soft);}
.quiz-footer{display:flex; justify-content:space-between; align-items:center; margin-top:1.2rem; gap:.6rem; flex-wrap:wrap;}
.quiz-score{font-family:'IBM Plex Mono',monospace; font-size:.85rem;}
.quiz-result{text-align:center; padding:1.6rem 1rem;}
.quiz-result .big{font-family:'IBM Plex Mono',monospace; font-size:2.6rem; font-weight:700; color:var(--accent-strong);}

/* chapter weighting */
.weights{display:flex; flex-direction:column; gap:.5rem; margin:.4rem 0 1rem;}
.weight-row{display:grid; grid-template-columns:minmax(120px,1.4fr) 1fr 62px; gap:.7rem; align-items:center; font-size:.85rem;}
.weight-row input[type=range]{width:100%; accent-color:var(--accent);}
.weight-val{font-family:'IBM Plex Mono',monospace; font-size:.78rem; color:var(--text-muted); text-align:right;}
.weight-row.off{opacity:.45;}
.wk-list{display:flex; flex-direction:column; gap:.4rem;}
.wk-row{display:flex; align-items:center; gap:.7rem; font-size:.85rem; padding:.45rem .7rem; background:var(--surface-2); border-radius:8px;}
.wk-bar{flex:1; height:7px; background:var(--surface-3); border-radius:99px; overflow:hidden;}
.wk-bar span{display:block; height:100%; background:var(--bad);}
.wk-pct{font-family:'IBM Plex Mono',monospace; font-size:.75rem; color:var(--text-muted); min-width:64px; text-align:right;}

/* fullscreen quiz */
.quiz-shell.fs{position:fixed; inset:0; z-index:150; background:var(--bg); padding:2rem clamp(1rem,6vw,5rem); overflow-y:auto;}
.quiz-shell.fs .quiz-card{max-width:840px; margin:0 auto;}
.quiz-shell.fs .quiz-progress{max-width:840px; margin:0 auto 1.2rem;}
.quiz-shell.fs .toolbar{max-width:840px; margin:0 auto 1rem;}

/* ---------- Exercises ---------- */
.exo{border:1px solid var(--border); border-radius:12px; margin-bottom:.9rem; background:var(--surface); overflow:hidden;}
.exo-head{padding:.9rem 1.1rem; display:flex; justify-content:space-between; align-items:center; gap:1rem; cursor:pointer;}
.exo-head:hover{background:var(--surface-2);}
.exo-num{font-family:'IBM Plex Mono',monospace; color:var(--accent-strong); font-weight:700; margin-right:.5rem;}
.exo-diff{font-family:'IBM Plex Mono',monospace; font-size:.68rem; padding:.15rem .5rem; border-radius:99px; text-transform:uppercase; letter-spacing:.05em; white-space:nowrap;}
.exo-diff.easy{background:var(--good-soft); color:var(--good);}
.exo-diff.mid{background:var(--warn-soft); color:var(--warn);}
.exo-diff.hard{background:var(--bad-soft); color:var(--bad);}
.exo-chev{transition:transform .2s ease; color:var(--text-muted); flex-shrink:0;}
.exo.open .exo-chev{transform:rotate(90deg);}
.exo-body{display:none; padding:0 1.1rem 1.1rem;}
.exo.open .exo-body{display:block;}
.exo-answer{display:flex; flex-direction:column; gap:.6rem;}
.exo-solution{background:var(--term-bg); color:var(--term-text); border-radius:9px; padding:.8rem 1rem; font-family:'IBM Plex Mono',monospace; font-size:.82rem; line-height:1.7; white-space:pre-wrap; margin-top:.5rem;}
.exo-verdict{font-size:.85rem; padding:.6rem .8rem; border-radius:9px;}
.exo-verdict.ok{background:var(--good-soft); color:var(--good);}
.exo-verdict.ko{background:var(--warn-soft); color:var(--warn);}
.exo-done{color:var(--good); font-family:'IBM Plex Mono',monospace; font-size:.7rem;}

/* ---------- Chat ---------- */
.chat-log{display:flex; flex-direction:column; gap:.8rem; max-height:56vh; overflow-y:auto; padding:.3rem; margin-bottom:1rem;}
.bubble{padding:.75rem 1rem; border-radius:13px; font-size:.9rem; max-width:86%; white-space:pre-wrap; line-height:1.55;}
.bubble.user{background:var(--accent-soft); align-self:flex-end; border-bottom-right-radius:4px;}
.bubble.ai{background:var(--surface-2); align-self:flex-start; border-bottom-left-radius:4px;}
.bubble.err{background:var(--bad-soft); color:var(--bad); align-self:flex-start;}
.bubble code{white-space:pre-wrap;}
.chat-form{display:flex; gap:.6rem; align-items:flex-end;}
.chat-form .textarea{min-height:52px;}
.suggest-row{display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:.8rem;}
.suggest{font-size:.78rem; padding:.3rem .7rem; border-radius:99px; background:var(--surface-2); border:1px solid var(--border); cursor:pointer; color:var(--text);}
.suggest:hover{border-color:var(--accent); color:var(--accent-strong);}

/* ---------- Editor ---------- */
.edit-item{border:1px solid var(--border); border-radius:11px; padding:.9rem 1rem; margin-bottom:.7rem; background:var(--surface);}
.edit-item .er-head{display:flex; justify-content:space-between; gap:.6rem; align-items:center; margin-bottom:.5rem;}
.edit-item .er-title{font-family:'IBM Plex Mono',monospace; font-size:.8rem; color:var(--text-muted);}

/* ---------- Toast ---------- */
.toast-host{position:fixed; bottom:1.2rem; left:50%; transform:translateX(-50%); z-index:300; display:flex; flex-direction:column; gap:.5rem; align-items:center;}
.toast{background:var(--term-bg); color:var(--term-text); padding:.6rem 1rem; border-radius:10px; font-size:.85rem; box-shadow:var(--shadow-lg); max-width:90vw;}
.toast.bad{background:var(--bad); color:#fff;}
.toast.good{background:var(--good); color:#04211c;}

.skeleton{background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 37%,var(--surface-2) 63%); background-size:400% 100%; animation:sk 1.4s ease infinite; border-radius:8px;}
@keyframes sk{0%{background-position:100% 50%}100%{background-position:0 50%}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important; transition-duration:.01ms!important;}}


/* ---------- Fiche : mise en page document (barre latérale + page unique) ---------- */
.memo-layout{display:grid; grid-template-columns:264px minmax(0,1fr); max-width:1300px; margin:0 auto;}
.memo-sidebar{
  border-right:1px solid var(--border); padding:1.4rem 1rem 4rem; position:sticky; top:53px;
  align-self:start; max-height:calc(100vh - 53px); overflow-y:auto; background:var(--bg); scrollbar-width:thin;
}
.memo-main{padding:2rem 2.8rem 6rem; min-width:0;}
@media (max-width:900px){
  .memo-layout{grid-template-columns:1fr;}
  .memo-sidebar{position:relative; top:0; max-height:none; border-right:none; border-bottom:1px solid var(--border);}
  .memo-main{padding:1.4rem 1.2rem 4rem;}
}
.side-title{font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:.9rem; line-height:1.3; margin-bottom:1.3rem; padding-left:.2rem;}
.nav-group{margin-bottom:1.25rem;}
.nav-group-title{
  font-family:'IBM Plex Mono',monospace; font-size:.66rem; text-transform:uppercase; letter-spacing:.09em;
  color:var(--text-muted); font-weight:700; margin-bottom:.45rem; padding-left:.2rem;
}
.nav-link{
  display:block; width:100%; text-align:left; font-family:inherit; font-size:.845rem; line-height:1.35;
  color:var(--text); background:none; border:none; border-left:2px solid transparent; cursor:pointer;
  padding:.34rem .5rem; border-radius:0 6px 6px 0;
}
.nav-link:hover{background:var(--surface-2);}
.nav-link.active{background:var(--accent-soft); color:var(--accent-strong); border-left-color:var(--accent); font-weight:600;}
.nav-link.tool{color:var(--accent-strong); font-weight:600;}
.tool-anchor{scroll-margin-top:4.5rem; display:block;}
.memo-main .memo-head{border-bottom:1px solid var(--border); padding-bottom:1rem; margin-bottom:1.8rem;}

/* ---------- Print (recto/verso) ---------- */
#printRoot{display:none;}
@media print{
  body{background:#fff; color:#000;}
  .topbar,.wrap,.toast-host,.modal-back{display:none!important;}
  #printRoot{display:block!important;}
  @page{size:A4; margin:9mm;}
  .print-page{page-break-after:always; break-after:page;}
  .print-page:last-child{page-break-after:auto; break-after:auto;}
}
#printRoot .print-page{font-family:'IBM Plex Sans',sans-serif; color:#000; font-size:8.1pt; line-height:1.32;}
#printRoot h2{font-size:12pt; margin:0 0 1.5mm; font-family:'IBM Plex Mono',monospace;}
#printRoot .p-sub{font-size:7pt; color:#444; margin:0 0 2mm; border-bottom:.4pt solid #999; padding-bottom:1mm;}
#printRoot .p-cols{column-count:3; column-gap:4mm; column-rule:.3pt solid #ccc;}
#printRoot .p-cols.two{column-count:2;}
#printRoot .p-grp{break-inside:avoid; margin-bottom:1.6mm;}
#printRoot .p-grp-t{font-family:'IBM Plex Mono',monospace; font-size:6.6pt; font-weight:700; text-transform:uppercase; letter-spacing:.03em; background:#eee; padding:.5mm 1mm; margin-bottom:.8mm; border-radius:1mm;}
#printRoot .p-row{break-inside:avoid; margin-bottom:1.1mm; padding-bottom:.7mm; border-bottom:.2pt dotted #bbb;}
#printRoot .p-need{display:block; font-size:7pt; color:#333;}
#printRoot .p-cmd{display:block; font-family:'IBM Plex Mono',monospace; font-size:7.4pt; font-weight:700;}
#printRoot .p-foot{margin-top:2mm; font-size:6pt; color:#666; text-align:right; font-family:'IBM Plex Mono',monospace;}