/* Learn Room - styles des outils embarques, portee limitee a .lrt-scope.
   Extrait de lr_outils_v1.css pour poser un outil sur une page qui a deja sa
   propre feuille, sans toucher a sa mise en page. */
:root{
  
  --forest-deep:#03200E; --forest-dark:#06371F; --forest-mid:#0C7334; --forest-soft:#2D3A32;
  --mint-vif:#53D495; --mint-pastel:#86E7B8; --sage-clair:#E6F3EB; --sage-rule:#D8E4DC;
  --muted-sage:#6B7D72; --cream:#FEFBF0; --beige:#EFEBE0; --white:#F7F8F7; --paper:#FFFFFF;
  --gray:#6D6D6D; --blue-link:#1E6E79;

  
  --maxw:1180px; --gut:20px; --radius-sm:12px; --radius:18px; --radius-lg:28px;
  --sec:clamp(56px,8vw,96px); --border:rgba(3,32,14,.10); --border-dark:rgba(255,255,255,.16);

  --f-title:"Bricolage Grotesque",system-ui,sans-serif;
  --f-body:"Inter",system-ui,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,monospace;
}
.lrt-scope ul.dots li, .lrt-scope ol.steps li, .lrt-scope .lrt-note, .lrt-scope .lrt-privacy{max-width:78ch}
.lrt-scope .sec--dark .chapo, .lrt-scope .sec--dark .mesure{color:var(--mint-pastel)}
.lrt-scope .mesure{max-width:46ch}
.lrt-scope h2+.body, .lrt-scope h2+.grid, .lrt-scope h2+.lrt{margin-top:44px}
@media (max-width:640px){.lrt-scope h2+.body, .lrt-scope h2+.grid, .lrt-scope h2+.lrt{margin-top:30px}}
.lrt-scope .btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;border-radius:999px;
  font-family:var(--f-body);font-size:15px;font-weight:700;padding:13px 24px;
  text-decoration:none;border:1px solid transparent;cursor:pointer;transition:.2s ease}
.lrt-scope .btn--main{background:var(--mint-vif);color:var(--forest-deep)}
.lrt-scope .btn--main:hover{background:var(--mint-pastel)}
.lrt-scope .btn--sec{background:transparent;border-color:var(--border);color:var(--forest-deep)}
.lrt-scope .btn--sec:hover{border-color:var(--mint-vif)}
.lrt-scope .btn--dark{background:var(--forest-deep);color:var(--cream)}
.lrt-scope .btn--sec-dark{background:transparent;border-color:var(--border-dark);color:var(--cream)}
.lrt-scope .btn--sec-dark:hover{border-color:var(--mint-vif)}
.lrt-scope .btn--sm{min-height:36px;padding:8px 16px;font-size:14px}
.lrt-scope .btn[disabled]{opacity:.5;cursor:not-allowed}
.lrt-scope a.btn, .lrt-scope a.navlink{text-decoration:none}
.lrt-scope .tablewrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius);
  background:var(--paper)}
.lrt-scope table.t{border-collapse:collapse;width:100%;min-width:560px;font-size:14px}
.lrt-scope table.t th, .lrt-scope table.t td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--border);
  vertical-align:top}
.lrt-scope table.t th{font-family:var(--f-mono);font-size:12px;text-transform:uppercase;letter-spacing:.08em;
  color:var(--forest-mid);background:var(--beige)}
.lrt-scope table.t tr:last-child td{border-bottom:0}
.lrt-scope .lrt{background:var(--paper);border:1px solid var(--border);border-radius:var(--radius);
  
  min-height:340px;position:relative}
.lrt-scope .lrt-bar{position:sticky;top:0;z-index:2;display:flex;flex-wrap:wrap;align-items:center;gap:12px;
  padding:14px 20px;background:var(--beige);border-bottom:1px solid var(--border);
  border-radius:var(--radius) var(--radius) 0 0}
.lrt-scope .lrt-bar .lrt-name{font-family:var(--f-mono);font-size:12px;font-weight:600;text-transform:uppercase;
  letter-spacing:.08em;color:var(--forest-mid);margin-right:auto}
.lrt-scope .lrt-body{padding:20px}
.lrt-scope .lrt-note{font-size:14px;color:var(--muted-sage);margin:0 0 16px}
.lrt-scope .lrt-privacy{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--forest-mid);
  background:var(--beige);border-radius:var(--radius-sm);padding:12px 14px;margin:0 0 20px}
.lrt-scope .lrt-state{font-size:12px;font-family:var(--f-mono);color:var(--muted-sage)}
.lrt-scope .lrt-field{display:grid;gap:6px;margin-bottom:18px}
.lrt-scope .lrt-field label{font-size:14px;font-weight:700}
.lrt-scope .lrt-field .help{font-size:14px;color:var(--muted-sage)}
.lrt-scope .sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);
  white-space:nowrap;border:0}
.lrt-scope .lrt-grid{width:100%;border-collapse:collapse}
.lrt-scope .lrt-grid td input, .lrt-scope .lrt-grid td select{min-width:200px}
.lrt-scope .lrt-grid td select{padding-right:34px}
.lrt-scope .lrt-grid th{font-family:var(--f-mono);font-size:12px;font-weight:600;text-transform:uppercase;
  letter-spacing:.06em;color:var(--forest-mid);text-align:left;padding:8px 8px 10px;
  border-bottom:1px solid var(--border);white-space:nowrap}
.lrt-scope .lrt-grid td{padding:6px 8px;vertical-align:top}
.lrt-scope .lrt-grid input, .lrt-scope .lrt-grid select{min-height:40px}
.lrt-scope .lrt-grid .num{font-family:var(--f-mono);font-size:14px;color:var(--muted-sage);padding-top:16px}
.lrt-scope .lrt-score{font-family:var(--f-mono);font-weight:600;font-size:16px;padding-top:14px;
  white-space:nowrap}
.lrt-scope .lrt-del{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);
  width:40px;height:40px;cursor:pointer;color:var(--gray);font-size:18px;line-height:1}
@media (max-width:899px){.lrt-scope .lrt-grid, .lrt-scope .lrt-grid tbody, .lrt-scope .lrt-grid tr, .lrt-scope .lrt-grid td{display:block;width:auto}.lrt-scope .lrt-grid thead{display:none}.lrt-scope .lrt-grid tr{border:1px solid var(--border);border-radius:var(--radius);padding:14px;
    margin-bottom:14px;position:relative}.lrt-scope .lrt-grid td{padding:0 0 12px}.lrt-scope .lrt-grid td.num{position:absolute;top:14px;right:52px;padding:0;font-size:12px}.lrt-scope .lrt-grid td[data-lab]::before{content:attr(data-lab);display:block;font-size:13px;
    font-weight:700;margin-bottom:4px}.lrt-scope .lrt-grid td input, .lrt-scope .lrt-grid td select{min-width:0;width:100%}.lrt-scope .lrt-grid td:last-child{padding:0;position:absolute;top:10px;right:10px}.lrt-scope .lrt-grid .lrt-score{padding:0 0 4px;font-size:14px}}
.lrt-scope .lrt-del:hover{border-color:var(--forest-mid);color:var(--forest-deep)}
.lrt-scope .lrt-check{display:grid;gap:10px;margin:0 0 20px;padding:0;list-style:none}
.lrt-scope .lrt-check li{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--paper)}
.lrt-scope .lrt-check label{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;cursor:pointer;
  min-height:44px}
.lrt-scope .lrt-check input[type=checkbox]{width:20px;height:20px;min-height:20px;margin-top:2px;flex:none;
  accent-color:var(--mint-vif)}
.lrt-scope .lrt-check .t{font-weight:700;font-size:15px}
.lrt-scope .lrt-check .h{font-size:14px;color:var(--muted-sage);display:block;margin-top:2px}
.lrt-scope .lrt-check li.done{background:var(--beige);border-color:var(--mint-vif)}
.lrt-scope .lrt-out{background:var(--forest-deep);color:var(--cream);border-radius:var(--radius);padding:20px;
  margin-top:20px}
.lrt-scope .lrt-out h3{color:var(--cream);font-size:18px;margin-bottom:12px}
.lrt-scope .lrt-out pre{margin:0 0 16px;font-family:var(--f-mono);font-size:13px;line-height:1.6;
  white-space:pre-wrap;word-break:break-word}
.lrt-scope .lrt-band{font-size:15px;font-weight:700;margin-top:16px;padding:14px 16px;border-radius:var(--radius-sm);
  background:var(--beige)}
.lrt-scope .v2 .lrt{border-color:var(--forest-deep);box-shadow:0 1px 0 var(--forest-deep)}
.lrt-scope .v2 .lrt-bar{background:var(--forest-deep);border-bottom-color:transparent}
.lrt-scope .v2 .lrt-bar .lrt-name{color:var(--mint-pastel)}
.lrt-scope .v2 .lrt-bar .lrt-state{color:var(--mint-pastel)}
.lrt-scope .v2 .lrt-bar .btn--sec{border-color:var(--border-dark);color:var(--cream)}
.lrt-scope .v2 .lrt-bar .btn--sec:hover{border-color:var(--mint-vif)}
.lrt-scope .v2 .sec--dark .tablewrap{background:transparent;border-color:var(--border-dark)}
.lrt-scope .v2 .sec--dark table.t th{background:rgba(255,255,255,.06);color:var(--mint-pastel)}
.lrt-scope .v2 .sec--dark table.t th, .lrt-scope .v2 .sec--dark table.t td{border-bottom-color:var(--border-dark)}
.lrt-scope .v2 .sec--dark .lrt, .lrt-scope .v2 .sec--dark .card, .lrt-scope .v2 .sec--dark figure.lr-map{color:var(--forest-deep)}
.lrt-scope .v2 .sec--dark .lrt h3, .lrt-scope .v2 .sec--dark .card h3{color:var(--forest-deep)}
.lrt-scope .v2 .sec--dark .lrt .lrt-check .t, .lrt-scope .v2 .sec--dark .lrt label{color:var(--forest-deep)}
.lrt-scope .v2 .sec--dark .lrt-bar .lrt-name, .lrt-scope .v2 .sec--dark .lrt-bar .lrt-state{color:var(--mint-pastel)}
.lrt-scope .v2 .lrt-note, .lrt-scope .v2 .mesure, .lrt-scope .v2 ul.dots li span, .lrt-scope .v2 .lrt-grid .num, .lrt-scope .v2 .lrt-check .h, .lrt-scope .v2 .lrt-field .help{color:var(--forest-soft)}
.lrt-scope .v2 .sec--dark .lrt-note, .lrt-scope .v2 .sec--dark .lrt-check .h, .lrt-scope .v2 .sec--dark .lrt-field .help{color:var(--forest-soft)}
.lrt-scope .v2 .sec--dark ul.dots li span, .lrt-scope .v2 .sec--dark .mesure{color:var(--mint-pastel)}
.lrt-scope .v2 .sec--dark .lrt-bar{background:var(--beige);border-bottom:1px solid var(--border)}
.lrt-scope .v2 .sec--dark .lrt-bar .lrt-name, .lrt-scope .v2 .sec--dark .lrt-bar .lrt-state{color:var(--forest-mid)}
.lrt-scope .v2 .sec--dark .lrt-bar .btn--sec{border-color:var(--border);color:var(--forest-deep)}
.lrt-scope{margin:36px 0}
