/* Подготовка к уроку · Xudoyorxon Bunyodov / Худоёрхон Бунёдов */
.ls { max-width: 940px; margin: 0 auto; padding: 4px 0 96px; }
.ls-head h1 { margin: 0; font-size: 24px; }
.ls-sub { color: #6B7B88; font-size: 13px; margin: 4px 0 10px; max-width: 700px; line-height: 1.55; }
.ls-pick { display: flex; gap: 8px; align-items: center; font-size: 13px; color: #46586A; margin-bottom: 14px; }
.ls-pick select { flex: 1 1 auto; max-width: 560px; padding: 9px 12px; border: 1px solid #D6DEE5; border-radius: 10px; }
.ls-cards { display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); margin-bottom: 14px; }
.ls-card { padding: 12px; border: 1px solid #E1E8ED; border-radius: 12px; background: #fff; text-align: center; }
.ls-card b { display: block; font-size: 21px; color: #1B3A4B; }
.ls-card span { font-size: 11.5px; color: #7C8B97; }
.ls-warn { padding: 12px 14px; border-radius: 10px; background: #FDF6E0; color: #6B4E00; font-size: 13px; margin-bottom: 14px; }
.ls-h2 { font-size: 14px; text-transform: uppercase; letter-spacing: .05em; color: #6B7B88; margin: 18px 0 8px; font-weight: 700; }
.ls-levels { display: grid; gap: 6px; }
.ls-lvl { display: flex; gap: 11px; align-items: center; padding: 10px 13px;
  border: 1px solid #E1E8ED; border-radius: 11px; background: #fff; cursor: pointer; }
.ls-lvl.is-off { opacity: .5; }
.ls-lvl__n { width: 26px; height: 26px; flex: 0 0 26px; border-radius: 8px; background: #EEF3F7;
  display: flex; align-items: center; justify-content: center; font-size: 12.5px; color: #46586A; }
.ls-lvl__b { flex: 1 1 auto; }
.ls-lvl__b b { display: block; font-size: 14px; }
.ls-lvl__b i { font-style: normal; font-size: 12px; color: #7C8B97; }
.ls-lvl__c { font-size: 12px; color: #14562B; font-weight: 600; }
.ls-form { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }
.ls-form label, .ls-notes { display: block; font-size: 12.5px; color: #6B7B88; }
.ls-in { width: 100%; padding: 9px 12px; border: 1.5px solid #D6DEE5; border-radius: 10px;
  margin-top: 4px; font-size: 14px; font-family: inherit; }
.ls-notes { margin-top: 12px; }
.ls-actions { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 8px; }
.ls-stats, .ls-hint { font-size: 13px; color: #46586A; background: #F1F5F8; border-radius: 10px; padding: 10px 13px; }
.ls-stats:empty { display: none; }
[data-theme="dark"] .ls-card, [data-theme="dark"] .ls-lvl { background: #1E2A33; border-color: #2E4150; color: #DDE7EE; }
[data-theme="dark"] .ls-hint, [data-theme="dark"] .ls-stats { background: #22323E; color: #C3D4E0; }