/* 2026-09-28 · flexible teacher setup + bilingual UI */
.edu-lang-switch{display:flex;gap:3px;padding:3px;border:1px solid rgba(8,31,59,.12);border-radius:999px;background:#f1f5f8}
.edu-lang-switch button{border:0;border-radius:999px;background:transparent;color:#6c8194;padding:7px 9px;font-size:8px;font-weight:950;cursor:pointer}
.edu-lang-switch button.active{background:var(--navy);color:#fff;box-shadow:0 4px 10px rgba(8,31,59,.14)}

.teaching-path-picker{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.teaching-path-card{position:relative;border:1px solid var(--line);border-radius:13px;background:#fff;padding:12px;text-align:left;cursor:pointer;transition:.18s}
.teaching-path-card:hover{transform:translateY(-1px);border-color:#9ebdd6}
.teaching-path-card.active{border-color:#1b63a5;background:linear-gradient(145deg,#eef6fd,#fff);box-shadow:0 0 0 3px rgba(27,99,165,.07)}
.teaching-path-card small{display:block;color:var(--teal);font-size:7px;font-weight:950;letter-spacing:.08em}
.teaching-path-card strong{display:block;margin-top:5px;color:var(--navy);font-size:11px}
.teaching-path-card span{display:block;margin-top:4px;color:#778b9c;font-size:7px;line-height:1.4}
.curriculum-filter-card .visually-hidden-select{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.curriculum-fields{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.curriculum-fields label.full{grid-column:1/-1}
.curriculum-result-card .teacher-freedom-note{position:relative;margin-top:15px;padding:10px 11px;border-radius:11px;background:#eefbf8;color:#31736e;font-size:8px;line-height:1.45}
.curriculum-result-card .teacher-freedom-note b{color:#0a7771}

.lesson-free-controls{margin-top:2px;padding:12px;border:1px solid var(--line);border-radius:13px;background:#f8fafc}
.lesson-free-controls>small{display:block;color:#7a8e9f;font-size:7px;font-weight:950;letter-spacing:.08em}
.lesson-presets{display:flex;gap:5px;flex-wrap:wrap;margin-top:8px}
.lesson-presets button{border:1px solid var(--line);border-radius:999px;background:#fff;color:#657a8d;padding:7px 8px;font-size:7px;font-weight:900;cursor:pointer}
.lesson-presets button.active{background:var(--navy);border-color:var(--navy);color:#fff}
.lesson-stage-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:5px;margin-top:9px}
.lesson-stage-picker label{display:flex!important;align-items:center!important;gap:5px!important;padding:8px 7px;border:1px solid #e0e8ee;border-radius:9px;background:#fff;color:#536b80!important;font-size:7px!important;cursor:pointer}
.lesson-stage-picker input{width:auto!important;accent-color:#0f5c9f}
.custom-topic-wrap[hidden]{display:none!important}
.lesson-generate-status{padding:9px 10px;border-radius:10px;font-size:8px;line-height:1.4}
.lesson-generate-status.is-working{background:#eef5fb;color:#426b8e}
.lesson-generate-status.is-ready{background:#e9faf5;color:#087b74}
.lesson-output{transition:.25s}
.lesson-output.is-generating{opacity:.65;transform:scale(.994)}
.lesson-output.is-ready{animation:lessonReady .8s ease}
@keyframes lessonReady{0%{box-shadow:0 0 0 rgba(22,166,162,0)}35%{box-shadow:0 0 0 5px rgba(22,166,162,.13)}100%{box-shadow:0 0 0 rgba(22,166,162,0)}}

.curriculum-verification{display:flex;gap:7px;align-items:flex-start;margin-top:9px;color:#6f8395;font-size:7px;line-height:1.45}
.curriculum-verification i{width:16px;height:16px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:#dff6f2;color:#087b74;font-style:normal;font-size:8px;font-weight:950}

@media(max-width:800px){
 .curriculum-fields{grid-template-columns:1fr}
 .curriculum-fields label.full{grid-column:auto}
 .lesson-stage-picker{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
 .edu-lang-switch{order:-1}
 .teaching-path-picker{grid-template-columns:1fr}
 .lesson-stage-picker{grid-template-columns:1fr}
}

/* 2026-09-29 · Lesson Builder visual overhaul */
.builder-layout{
  grid-template-columns:minmax(360px,.92fr) minmax(430px,1.08fr);
  gap:20px;
  align-items:start;
}
.lesson-form,.lesson-output{
  position:relative;
  overflow:hidden;
  border:1px solid #dfe8ef;
  border-radius:24px;
  background:linear-gradient(180deg,#ffffff 0%,#fbfdff 100%);
  box-shadow:0 18px 50px rgba(8,31,59,.08);
}
.lesson-form{
  padding:24px;
  gap:16px;
}
.lesson-form:before,.lesson-output:before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:4px;
  background:linear-gradient(90deg,#175ca8,#19a5a0,#f29d38);
}
.lesson-form label{
  gap:8px;
  color:#536b80;
  font-size:11px;
  font-weight:950;
  letter-spacing:.01em;
}
.lesson-form input,.lesson-form select{
  min-height:50px;
  border:1.5px solid #d7e2ea;
  border-radius:14px;
  background:#fff;
  padding:12px 14px;
  color:#0b2747;
  font-size:13px;
  font-weight:850;
  box-shadow:0 2px 0 rgba(8,31,59,.015);
  transition:border-color .18s,box-shadow .18s,transform .18s;
}
.lesson-form input:hover,.lesson-form select:hover{border-color:#b8cad8}
.lesson-form input:focus,.lesson-form select:focus{
  border-color:#4c86ba;
  box-shadow:0 0 0 4px rgba(23,92,168,.10);
  transform:translateY(-1px);
}
.form-two{gap:14px}
.custom-topic-wrap{margin-top:8px}
.lesson-free-controls{
  margin-top:2px;
  padding:16px;
  border:1px solid #dce7ee;
  border-radius:18px;
  background:linear-gradient(145deg,#f7fafc,#eef6fb);
}
.lesson-free-controls>small{
  color:#526d84;
  font-size:9px;
  letter-spacing:.08em;
}
.lesson-presets{gap:7px;margin-top:11px}
.lesson-presets button{
  min-height:34px;
  padding:8px 11px;
  border-color:#d6e2ea;
  border-radius:999px;
  font-size:8px;
  transition:.18s;
}
.lesson-presets button:hover{border-color:#8eb2d1;transform:translateY(-1px)}
.lesson-presets button.active{
  background:linear-gradient(135deg,#0b2f5b,#175ca8);
  box-shadow:0 7px 16px rgba(23,92,168,.18);
}
.lesson-stage-picker{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
  margin-top:12px;
}
.lesson-stage-picker label{
  min-height:44px;
  justify-content:center;
  padding:9px 7px!important;
  border:1px solid #dce6ed;
  border-radius:12px;
  background:#fff;
  color:#4d677d!important;
  font-size:8px!important;
  text-align:center;
  transition:.18s;
}
.lesson-stage-picker label:hover{border-color:#95b7d3;background:#f7fbfe}
.lesson-stage-picker label:has(input:checked){
  border-color:#79aaa7;
  background:#ecf9f6;
  color:#0b6f6a!important;
  box-shadow:inset 0 0 0 1px rgba(25,165,160,.12);
}
.lesson-stage-picker input{width:15px!important;height:15px!important;min-height:0!important}
.generate-button{
  min-height:54px;
  border-radius:15px;
  background:linear-gradient(135deg,#0b2f5b,#1767ad);
  font-size:11px;
  letter-spacing:.01em;
  box-shadow:0 14px 28px rgba(12,66,121,.20);
  transition:.18s;
}
.generate-button:hover{transform:translateY(-2px);box-shadow:0 17px 32px rgba(12,66,121,.25)}
.generate-button:disabled{opacity:.65;transform:none;cursor:wait}
.form-note{
  padding:10px 12px;
  border-radius:12px;
  background:#f6f9fb;
  color:#73889a;
  font-size:8px;
  line-height:1.55;
}
.lesson-generate-status{
  padding:11px 12px;
  border-radius:12px;
  font-size:9px;
  font-weight:800;
}
.lesson-output{padding:24px}
.output-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
}
.output-head small{
  display:block;
  color:#7790a4;
  font-size:8px;
  font-weight:950;
  letter-spacing:.1em;
}
.output-head strong{
  margin-top:5px;
  font-size:21px;
  letter-spacing:-.025em;
}
.output-head>span{
  padding:8px 11px;
  border-radius:999px;
  background:#eef5fb;
  color:#175ca8;
  font-size:9px;
  font-weight:950;
}
.question-preview{
  margin-top:18px;
  padding:22px;
  border-radius:20px;
  background:
    radial-gradient(circle at 90% 0%,rgba(46,173,166,.26),transparent 38%),
    linear-gradient(145deg,#082a52,#0d3d73 55%,#175ca8);
  box-shadow:0 18px 35px rgba(8,47,91,.18);
}
.question-meta{gap:8px;flex-wrap:wrap}
.question-meta span{padding:6px 9px;font-size:8px}
.question-preview>small{margin-top:22px;font-size:8px}
.question-preview h4{
  margin:10px 0 9px;
  font-size:clamp(21px,2vw,30px);
  line-height:1.18;
  letter-spacing:-.02em;
}
.question-preview p{font-size:10px;line-height:1.6}
.question-preview button{
  margin-top:17px;
  padding:9px 12px;
  border-radius:11px;
  font-size:9px;
}
.generated-plan{gap:9px;margin-top:18px}
.plan-row{
  grid-template-columns:62px minmax(0,1fr) 92px;
  min-height:54px;
  padding:11px 13px;
  border-color:#e0e8ee;
  border-radius:14px;
  background:#fff;
  transition:.16s;
}
.plan-row:hover{
  border-color:#b9cedd;
  transform:translateX(2px);
  box-shadow:0 7px 18px rgba(8,31,59,.05);
}
.plan-row span{
  padding:5px 7px;
  border-radius:8px;
  background:#fff2ef;
  color:#c65e54;
  font-size:8px;
  text-align:center;
}
.plan-row b{font-size:11px}
.plan-row small{font-size:8px}
.phase-guide{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:7px;
  margin-top:14px;
}
.phase-guide>div{
  padding:10px 8px;
  border:1px solid #e4ebf0;
  border-radius:12px;
  background:#f9fbfc;
}
.phase-guide b{display:block;color:#173552;font-size:8px}
.phase-guide span{display:block;margin-top:4px;color:#8497a7;font-size:7px;line-height:1.4}
.output-actions{
  gap:10px;
  margin-top:18px;
}
.output-actions button{
  min-height:44px;
  border-radius:13px;
  padding:10px 15px;
  font-size:9px;
}
@media(max-width:1050px){
  .builder-layout{grid-template-columns:1fr}
  .lesson-output{position:static}
}
@media(max-width:720px){
  .lesson-form,.lesson-output{padding:18px;border-radius:19px}
  .form-two{grid-template-columns:1fr}
  .lesson-stage-picker{grid-template-columns:1fr 1fr}
  .phase-guide{grid-template-columns:1fr 1fr}
  .plan-row{grid-template-columns:58px 1fr}
  .plan-row small{grid-column:2;text-align:left}
  .output-actions{flex-direction:column}
  .output-actions button{width:100%}
}

.builder-form-head{
  display:grid;
  grid-template-columns:1fr auto;
  gap:4px 12px;
  padding:0 0 16px;
  border-bottom:1px solid #e5edf2;
}
.builder-form-head small{
  display:block;
  color:#17857f;
  font-size:8px;
  font-weight:950;
  letter-spacing:.12em;
}
.builder-form-head h4{
  margin:4px 0 0;
  color:#0b2747;
  font-size:19px;
  letter-spacing:-.025em;
}
.builder-form-head>span{
  align-self:start;
  padding:7px 10px;
  border-radius:999px;
  background:#eaf8f5;
  color:#08746f;
  font-size:8px;
  font-weight:950;
}
.builder-form-head p{
  grid-column:1/-1;
  margin:8px 0 0;
  color:#73889a;
  font-size:9px;
  line-height:1.55;
}
.builder-form-points{
  grid-column:1/-1;
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:7px;
}
.builder-form-points b{
  padding:6px 8px;
  border:1px solid #e0e9ef;
  border-radius:999px;
  background:#fff;
  color:#587186;
  font-size:7px;
  font-weight:900;
}


/* 2026-09-29 · Live lesson flow */
.plan-row.is-live-active{
  border-color:#175ca8!important;
  background:linear-gradient(135deg,#eef6ff,#f8fbff)!important;
  box-shadow:0 0 0 3px rgba(23,92,168,.10),0 10px 24px rgba(8,31,59,.07)!important;
  transform:translateX(4px);
}
.plan-row.is-live-active b{color:#0d4f8c}
.plan-row.is-live-active span{
  background:#175ca8!important;
  color:#fff!important;
}
.plan-row.is-live-complete{
  border-color:#c9e8df!important;
  background:#f4fbf8!important;
}
.plan-row.is-live-complete b:after{
  content:"  ✓";
  color:#128178;
}
.plan-row.is-live-complete span{
  background:#e4f6f0!important;
  color:#0d7a72!important;
}

.live-progress{
  margin:12px 0 4px;
  padding:11px 13px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:13px;
  background:rgba(255,255,255,.045);
}
.live-progress-copy{
  display:flex;
  justify-content:space-between;
  gap:12px;
  margin-bottom:8px;
}
.live-progress-copy span{
  color:#a9bfd3;
  font-size:8px;
  font-weight:900;
  letter-spacing:.04em;
}
.live-progress-track{
  height:7px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.10);
}
.live-progress-track i{
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#36c2b8,#78ddd6);
  transition:width .28s ease;
}

#startDemoLesson{
  position:relative;
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease;
}
#startDemoLesson:hover:not(:disabled){
  transform:translateY(-2px);
  box-shadow:0 12px 24px rgba(8,31,59,.20);
}
#startDemoLesson:active:not(:disabled){transform:translateY(0)}
#startDemoLesson:disabled{
  cursor:wait;
  opacity:.7;
}

#nextLiveQuestion{
  min-width:180px;
  font-weight:950;
  transition:transform .16s ease,box-shadow .16s ease;
}
#nextLiveQuestion:hover{transform:translateY(-1px)}
#nextLiveQuestion[data-action="restart"]{
  background:linear-gradient(135deg,#0d766f,#17a39a);
  border-color:transparent;
  color:#fff;
}

@media(max-width:650px){
  .live-progress-copy{flex-direction:column;gap:3px}
  #nextLiveQuestion{min-width:0}
}


/* 2026-09-30 · Adaptive game playability */
.game-task-extra{
  width:min(980px,100%);
  margin:22px auto 0!important;
  display:grid!important;
  gap:12px!important;
}
.game-extra-group{
  display:grid;
  gap:9px;
  justify-items:center;
}
.game-extra-group>b{
  color:#7ee4dc;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.12em;
}
.game-extra-group>div{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:9px;
}
.game-extra-group span{
  padding:9px 13px!important;
  border:1px solid rgba(255,255,255,.16);
  border-radius:999px!important;
  background:rgba(255,255,255,.11)!important;
  color:#fff!important;
  font-size:clamp(11px,1.1vw,15px)!important;
  font-weight:950!important;
}
.game-extra-group.always-visible span{
  background:rgba(241,108,96,.16)!important;
  border-color:rgba(255,151,140,.34)!important;
  color:#ffd6d1!important;
}
.game-extra-group.answer-group span{
  background:#fff!important;
  border-color:#fff!important;
  color:#0b2f5b!important;
}
.game-hidden-note{
  width:max-content;
  max-width:100%;
  margin:0 auto;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  color:#d6e2eb;
  font-size:10px;
  font-weight:900;
}
.game-timer{
  width:min(1280px,100%);
  margin:12px auto 0;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:16px;
  background:rgba(255,255,255,.06);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.game-timer[hidden]{display:none!important}
.game-timer>div:first-child{display:flex;align-items:baseline;gap:12px}
.game-timer small{
  color:#83e3dc;
  font-size:8px;
  font-weight:1000;
  letter-spacing:.1em;
}
.game-timer strong{
  color:#fff;
  font-size:25px;
  font-variant-numeric:tabular-nums;
}
.game-timer.running{
  border-color:rgba(126,228,220,.36);
  box-shadow:0 0 0 3px rgba(126,228,220,.06);
}
.game-timer.finished{
  border-color:rgba(242,157,56,.42);
  background:rgba(242,157,56,.08);
}
.game-timer.finished strong{color:#ffd195}
.game-timer-actions{display:flex;gap:7px}
.game-timer-actions button{
  min-height:36px;
  padding:8px 11px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:10px;
  background:rgba(255,255,255,.08);
  color:#fff;
  font-size:9px;
  font-weight:950;
  cursor:pointer;
}
.game-timer-actions button:first-child{
  background:#fff;
  color:#0b2f5b;
}
.game-modal-actions button[hidden]{display:none!important}
.game-modal-actions button:disabled{
  opacity:.58;
  cursor:default;
}
@media(max-width:700px){
  .game-timer{align-items:flex-start;flex-direction:column}
  .game-timer-actions{width:100%}
  .game-timer-actions button{flex:1}
}

.game-modal-card{
  overflow-y:auto!important;
  justify-content:flex-start!important;
  overscroll-behavior:contain;
}
.game-modal-head{flex:0 0 auto}
.game-task-card{
  min-height:clamp(300px,46vh,520px)!important;
  flex:0 0 auto;
}
.game-modal-help,.mode-switch-row,.game-modal-actions,.game-team-zone,.game-timer{flex:0 0 auto}