*{box-sizing:border-box}body{margin:0;background:#f5f3e9;color:#142e3e;font:18px Arial,sans-serif}header{background:#123d4b;color:white;display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 5%}header a{color:white;font-size:16px}header span{font-weight:900;letter-spacing:2px}main{max-width:1100px;margin:auto;padding:38px 24px}h1{font-size:clamp(38px,6vw,62px);letter-spacing:-2px;line-height:1.06;margin:14px 0}h2{font-size:28px}.eyebrow{color:#267766;font-size:14px;font-weight:900;letter-spacing:3px}.intro{font-size:22px}.story-link{margin:6px 0 18px}.story-link a{color:#267766;font-weight:800;text-decoration:none;font-size:16px}.story-link a:hover{text-decoration:underline}.button,button{display:inline-block;background:#165748;color:white;border:0;border-radius:12px;padding:14px 20px;text-decoration:none;font:bold 17px Arial;cursor:pointer}button:hover,.button:hover{background:#237361}button:disabled{opacity:.6;cursor:default}button:focus-visible,a:focus-visible{outline:4px solid #e5a127;outline-offset:4px}aside,.note{font-size:15px;line-height:1.5;color:#52616a}aside{padding:12px;background:#fff1c7;border-radius:10px}nav{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}nav button{background:white;color:#193c48;border:2px solid #cbd8d5}nav button.active{background:#193c48;color:white}.stats{display:flex;gap:18px;flex-wrap:wrap;font-size:21px;font-weight:800;padding:18px 0}.toolbar{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin:16px 0}.toolbar h2{margin-right:auto}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:16px}.word{background:white;border:1px solid #d6ddd9;border-radius:18px;padding:22px;text-align:center}.yi{font:bold 42px Georgia;direction:rtl;margin:16px 0}.status{display:inline-block;border-radius:20px;padding:7px 12px;font-size:14px;background:#edf0f2;color:#40515a}.learned{background:#d1eddb;color:#155431}.practicing{background:#fff0bc;color:#6b5000}.word button{background:#eef5f1;color:#244a3d;margin-top:16px;font-size:15px}.source{direction:rtl;font:22px/1.7 Georgia;max-height:180px;overflow:auto}#practice{background:#fff;border:3px solid #cfac43;border-radius:22px;padding:26px;text-align:center;margin:20px 0}#answers{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:650px;margin:20px auto}#feedback{min-height:32px;font-weight:bold}table{width:100%;border-collapse:collapse;background:white}td,th{padding:14px;text-align:left;border-bottom:1px solid #dde4e1}td[lang=yi]{font:28px Georgia}small{font-weight:bold} @media(max-width:600px){header{flex-wrap:wrap}.grid{grid-template-columns:1fr 1fr}.word{padding:14px}.yi{font-size:36px}#answers{grid-template-columns:1fr}}
[hidden]{display:none!important}input,select{font:18px Arial;padding:10px;border:1px solid #abc0bd;border-radius:8px;max-width:100%}label{display:inline-flex;gap:10px;align-items:center;margin:10px 12px 10px 0;flex-wrap:wrap}#notice{background:#fff1c7;padding:12px;border-radius:10px}#notice:empty{display:none}.section-editor{background:white;padding:22px;border:1px solid #cbd8d5;border-radius:16px;margin:18px 0}.section-editor input[type=number]{width:105px}.word-checks{display:flex;flex-wrap:wrap;gap:5px}.word-checks label{background:#f0f5f2;padding:8px;border-radius:8px}.scroll{overflow:auto}th{background:#d9ebe2}.pill{padding:8px 14px;border-radius:20px;background:#d9ebe2}.student-name{background:transparent;color:#123d4b;padding:0;text-decoration:underline}#save{position:sticky;bottom:15px;box-shadow:0 5px 25px #123d4b44}

/* Simpler student practice flow */
.practice-progress{font-weight:900;font-size:18px;color:#52616a;margin-bottom:8px}
.practice-bar{height:10px;max-width:560px;margin:0 auto 22px;background:#e8ecea;border-radius:999px;overflow:hidden}
.practice-bar-fill{height:100%;background:#267766;border-radius:999px;transition:width .25s ease}
.feedback-correct{color:#155431;font-size:22px}
.feedback-wrong{color:#8a3d18;font-size:20px}
.round-check{font-size:54px;color:#267766;font-weight:900}



/* Story Detective — paragraph comprehension */
#storyquiz{background:#fff;border:3px solid #315f86;border-radius:22px;padding:26px;text-align:center;margin:20px 0}
.story-topbar{display:flex;justify-content:flex-start;margin-bottom:8px}
.story-exit{background:#e8eef3;color:#244b6d;padding:10px 14px;font-size:15px}
.story-exit:hover{background:#d8e4ed}
.story-hint{font-weight:800;color:#52616a;margin:4px auto 10px}
.story-directions{background:#e8eef3;color:#244b6d;padding:9px 13px;font-size:15px;margin:2px 0 6px}
.story-directions:hover{background:#d8e4ed}
.story-reading-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start;max-width:1000px;margin:14px auto 22px}
.story-para{margin:0;background:#f8fbfd;border:2px solid #c6d8e8;border-radius:18px;padding:22px 26px;font:25px/1.9 Georgia,serif;text-align:right}
.story-key{background:#ffe58a;color:#17344a;border-radius:7px;padding:1px 4px;font-weight:900;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.story-glossary{margin:0;background:#fff8d8;border:2px solid #e5c95b;border-radius:18px;padding:16px;text-align:left;color:#17344a;font-size:16px;line-height:1.3}
.story-glossary h3{margin:0 0 10px;text-align:center;font-size:21px;color:#17344a}
.story-glossary-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid #eadc9a}
.story-glossary-row:last-child{border-bottom:0}
.story-glossary-yi{font:bold 20px Georgia,serif;direction:rtl;text-align:right}
.story-glossary-en{font-weight:800;color:#40515a}
.story-glossary-speak{min-width:38px;padding:7px 8px;background:#fff;color:#244b6d;border:1px solid #d9c86e;font-size:17px}
.story-glossary-speak:hover{background:#fff3b2}
.story-answers{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:900px;margin:20px auto}
.story-answer-row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:stretch}
.story-answer{background:#315f86;text-align:left;line-height:1.35;min-height:78px;width:100%}
.story-answer:hover{background:#244b6d}
.story-speak{min-width:56px;padding:12px 13px;background:#e8eef3;color:#244b6d;font-size:22px}
.story-speak:hover{background:#d8e4ed}
.story-speak:disabled{opacity:.45}
.story-feedback{min-height:32px;font-weight:800}
.story-next{margin-top:12px;background:#165748}
.story-link{display:inline-block;background:#e9f1ed;border-radius:999px;padding:8px 12px}
@media(max-width:800px){.story-reading-layout{grid-template-columns:1fr}.story-glossary{order:2}.story-para{order:1}}
@media(max-width:650px){.story-answers{grid-template-columns:1fr}.story-para{font-size:22px;padding:18px}.story-answer{min-height:68px}.story-glossary-row{grid-template-columns:1fr 1fr auto}}

/* Teacher Story Detective analytics */
.story-teacher-detail{margin:18px 0 28px;padding:18px;background:#eef5f9;border:2px solid #c6d8e8;border-radius:18px}
.story-teacher-detail h3{margin:0 0 12px;font-size:24px}
.story-teacher-card{background:#fff;border:1px solid #c6d8e8;border-radius:14px;padding:14px 16px;margin:10px 0}
.story-teacher-card h4{margin:0 0 6px;font-size:19px}.story-teacher-card p{margin:6px 0}
.story-paragraph-stats{display:flex;flex-wrap:wrap;gap:7px;margin-top:10px}
.story-paragraph-stats span{background:#e8eef3;color:#244b6d;border-radius:999px;padding:6px 9px;font-size:14px;font-weight:800}


/* 2026-09-29 student visual refresh */
.student-page{
  background:
    radial-gradient(circle at 8% 13%,rgba(255,209,102,.20) 0 110px,transparent 111px),
    radial-gradient(circle at 92% 22%,rgba(120,100,220,.10) 0 145px,transparent 146px),
    #f8f6ed;
}
.student-page header{
  padding:16px 5%;
  box-shadow:0 3px 14px rgba(20,46,62,.12);
}
.student-page main{padding-top:28px}
.student-meta{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.student-meta #who{margin:4px 0;font-weight:800;color:#52616a}
.student-page #notice{
  display:inline-block;
  margin:4px 0;
  padding:8px 12px;
  border-radius:999px;
  background:#fff0bd;
  color:#6b5000;
  font-size:15px;
  font-weight:800;
}
.student-page #notice:empty{display:none}

.section-map{
  margin-top:24px;
  padding:16px 18px 10px;
  border-radius:22px;
  background:#fff;
  border:1px solid #e2e4df;
  box-shadow:0 7px 20px rgba(20,46,62,.06);
}
.section-map-label,.activity-kicker{
  font-size:12px;
  letter-spacing:2.4px;
  font-weight:900;
  color:#71808a;
}
.student-page #segments{
  display:grid;
  grid-template-columns:repeat(4,minmax(120px,1fr));
  gap:10px;
  margin:10px 0 4px;
}
.student-page #segments button{
  position:relative;
  padding:14px 12px;
  border:0;
  border-radius:15px;
  background:#f1f3f1;
  color:#65747b;
  box-shadow:inset 0 0 0 1px #dce2de;
  transition:transform .15s ease,box-shadow .15s ease;
}
.student-page #segments button:not(:disabled):hover{
  transform:translateY(-2px);
  box-shadow:0 6px 14px rgba(20,46,62,.10);
}
.student-page #segments button.active{
  background:linear-gradient(135deg,#173d4d,#245c67);
  color:#fff;
  box-shadow:0 7px 15px rgba(20,61,75,.20);
}
.student-page #segments button:disabled{opacity:.72}

.story-adventure{
  display:flex;
  align-items:center;
  gap:14px;
  margin:16px 0 4px;
  padding:15px 18px;
  text-decoration:none;
  color:#153c48;
  border-radius:20px;
  border:2px solid #bfe2d5;
  background:linear-gradient(90deg,#e8f7ef,#fff9db);
  box-shadow:0 7px 18px rgba(20,46,62,.07);
  transition:transform .15s ease,box-shadow .15s ease;
}
.story-adventure:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(20,46,62,.11);
}
.story-adventure-icon{font-size:32px}
.story-adventure-copy{display:flex;flex-direction:column;gap:2px}
.story-adventure-copy strong{font-size:18px}
.story-adventure-copy small{font-size:14px;color:#5d6c74}
.story-adventure-arrow{margin-left:auto;font-size:24px;font-weight:900}
.student-page .stats{
  width:max-content;
  max-width:100%;
  margin:14px 0 0;
  padding:9px 14px;
  border-radius:999px;
  background:#173d4d;
  color:#fff;
  font-size:16px;
  box-shadow:0 6px 14px rgba(20,61,75,.14);
}

.activity-zone{
  margin:20px 0 18px;
  padding:20px;
  border-radius:24px;
  background:#fff;
  border:1px solid #e1e4df;
  box-shadow:0 9px 25px rgba(20,46,62,.07);
}
.activity-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}
.activity-heading h2{
  margin:4px 0 0;
  font-size:28px;
}
.activity-sparkles{
  color:#e2ad25;
  font-size:28px;
  letter-spacing:6px;
  white-space:nowrap;
}
.activity-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.student-page .activity-card{
  min-height:136px;
  padding:17px;
  border-radius:20px;
  display:grid;
  grid-template-columns:auto 1fr auto;
  grid-template-rows:auto;
  gap:12px;
  align-items:center;
  text-align:left;
  color:#fff;
  box-shadow:0 8px 16px rgba(20,46,62,.15);
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
}
.student-page .activity-card:hover:not(:disabled){
  transform:translateY(-4px) rotate(-.3deg);
  box-shadow:0 13px 24px rgba(20,46,62,.20);
  filter:saturate(1.06);
}
.student-page .activity-card:disabled{filter:grayscale(.35)}
.activity-practice{background:linear-gradient(135deg,#e66c2c,#f39b38)}
.activity-blast{background:linear-gradient(135deg,#7855c7,#a16ad7)}
.activity-sentence{background:linear-gradient(135deg,#b34d79,#d96a8d)}
.activity-sound{background:linear-gradient(135deg,#a05a17,#d08a24)}
.activity-detective{background:linear-gradient(135deg,#276ca3,#3b8fc1)}
.activity-words{background:linear-gradient(135deg,#198069,#32a182)}
.activity-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:15px;
  background:rgba(255,255,255,.18);
  font-size:28px;
}
.activity-text{display:flex;flex-direction:column;gap:5px;min-width:0}
.activity-text strong{font-size:20px;line-height:1.05}
.activity-text small{
  font-size:13px;
  line-height:1.25;
  color:rgba(255,255,255,.88);
}
.activity-arrow{font-size:25px;font-weight:900}
.student-page .grid{
  gap:18px;
  padding-bottom:30px;
}
.student-page .word{
  position:relative;
  overflow:hidden;
  border:0;
  border-radius:22px;
  box-shadow:0 8px 20px rgba(20,46,62,.08);
  transition:transform .15s ease,box-shadow .15s ease;
}
.student-page .word:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  right:0;
  height:5px;
  background:linear-gradient(90deg,#f0b33a,#42a389,#6b78d6);
}
.student-page .word:hover{
  transform:translateY(-3px);
  box-shadow:0 12px 25px rgba(20,46,62,.12);
}
.student-page .word .status{
  font-size:12px;
  font-weight:900;
}
.student-page .word .yi{margin:18px 0 12px}

@media(max-width:900px){
  .activity-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
  .student-page #segments{grid-template-columns:1fr 1fr}
  .activity-zone{padding:16px}
  .activity-grid{grid-template-columns:1fr}
  .student-page .activity-card{min-height:102px}
  .activity-sparkles{display:none}
  .story-adventure{padding:13px 14px}
}


/* Missing Word — four sentences + eight-word drag bank */
#sentencegame{background:#fff;border:3px solid #b34d79;border-radius:22px;padding:26px;text-align:center;margin:20px 0}
.sentence-topbar{display:flex;justify-content:flex-start;margin-bottom:8px}
.sentence-exit{background:#f5e6ed;color:#7f3154;padding:10px 14px;font-size:15px}
.sentence-exit:hover{background:#edd7e1}
.sentence-hint{margin:6px auto 14px;color:#52616a;font-weight:800}
.sentence-bank{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:16px auto 24px;padding:16px;border-radius:18px;background:#fbf2f6;border:2px solid #efd2df;direction:rtl}
.sentence-word{min-width:105px;background:#7d4364;color:#fff;border:2px solid transparent;border-radius:14px;padding:12px 16px;font:bold 27px Georgia,serif;cursor:grab;box-shadow:0 5px 12px rgba(58,29,47,.12)}
.sentence-word:hover:not(:disabled){background:#945377;transform:translateY(-2px)}
.sentence-word.selected{outline:4px solid #f0b33a;outline-offset:2px}
.sentence-word.used{background:#d9e8df;color:#245541;opacity:.72;cursor:default}
.sentence-board{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:980px;margin:0 auto}
.sentence-card{position:relative;background:#f9fbfa;border:2px solid #dce5e1;border-radius:18px;padding:24px 20px;min-height:126px;display:flex;align-items:center;justify-content:center}
.sentence-number{position:absolute;top:10px;left:12px;width:29px;height:29px;border-radius:50%;display:grid;place-items:center;background:#173d4d;color:#fff;font-size:14px;font-weight:900}
.sentence-line{width:100%;font:bold 27px/1.8 Georgia,serif;text-align:right;color:#17344a}
.sentence-blank{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;min-width:132px;min-height:50px;margin:0 7px;padding:5px 10px;background:#fff8d8;color:#714f00;border:3px dashed #d7b84d;border-radius:12px;font:bold 27px Georgia,serif}
.sentence-blank:hover:not(:disabled),.sentence-blank.drag-over{background:#fff0ad;border-color:#b98a10;transform:scale(1.03)}
.sentence-blank.solved{background:#dff2e6;color:#155431;border:3px solid #73b58a}
.sentence-feedback{min-height:34px;margin:16px 0 8px;font-weight:900}
.sentence-next{margin-top:4px;background:#7d4364}
.sentence-next:hover{background:#945377}
@media(max-width:760px){.sentence-board{grid-template-columns:1fr}.sentence-card{min-height:108px}.sentence-line{font-size:23px}.sentence-word{font-size:24px;min-width:92px}.sentence-blank{font-size:23px;min-width:110px}}


/* Sound Builder — pedagogical Yiddish pronunciation/nekudos */
#soundgame{background:#fff;border:3px solid #b77524;border-radius:22px;padding:26px;text-align:center;margin:20px 0}
.sound-topbar{display:flex;justify-content:flex-start;margin-bottom:8px}
.sound-exit{background:#f7ead7;color:#70420c;padding:10px 14px;font-size:15px}
.sound-exit:hover{background:#f0dcc0}
.sound-meaning{display:inline-block;margin:2px auto 14px;padding:7px 14px;border-radius:999px;background:#eef5f2;color:#35584e;font-weight:900;font-size:18px}
.sound-word{direction:rtl;unicode-bidi:isolate;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:4px;min-height:116px;margin:12px auto 18px;padding:16px 20px;border-radius:20px;background:#fbfaf4;border:2px solid #e6dfc9;font:900 58px/1.3 Georgia,serif}
.sound-part{display:inline-block;padding:4px 5px;border-radius:10px;transition:transform .16s ease,background .16s ease,box-shadow .16s ease}
.sound-part.active{background:#fff0a8;box-shadow:0 0 0 3px #d8aa22 inset,0 4px 12px rgba(112,66,12,.12);transform:translateY(-2px)}
.sound-part.placed{background:#e2f3e8;color:#155431}
.sound-part.pop{animation:soundPop .42s ease}
@keyframes soundPop{0%{transform:scale(.88)}55%{transform:scale(1.16)}100%{transform:scale(1)}}
.sound-hint{font-weight:800;color:#52616a;margin:4px 0 12px}
.sound-options{display:grid;grid-template-columns:repeat(4,minmax(105px,1fr));gap:12px;max-width:760px;margin:0 auto}
.sound-option{min-height:78px;background:#173d4d;color:#fff;border-radius:17px;font:900 36px Georgia,serif;box-shadow:0 7px 14px rgba(20,46,62,.13);transition:transform .12s ease,box-shadow .12s ease}
.sound-option:hover:not(:disabled){background:#245c67;transform:translateY(-3px);box-shadow:0 10px 18px rgba(20,46,62,.18)}
.sound-option.wrong{background:#a14a38;animation:soundShake .22s linear}
@keyframes soundShake{0%,100%{transform:translateX(0)}33%{transform:translateX(-5px)}66%{transform:translateX(5px)}}
.sound-feedback{min-height:34px;margin:14px 0 4px;font-weight:900}
.sound-complete{font-size:22px;font-weight:900;color:#155431;margin:8px 0 14px}
.sound-next{background:#a05a17}
.sound-next:hover{background:#b86b1b}
@media(max-width:760px){.sound-word{font-size:46px;min-height:96px}.sound-options{grid-template-columns:1fr 1fr}.sound-option{font-size:31px;min-height:68px}}
.activity-icon-hebrew{font:bold 25px Georgia,'Times New Roman',serif;color:#fff;line-height:1;letter-spacing:0;padding-bottom:4px}
#blastgame{background:#fff;border:3px solid #2f4f7a;border-radius:22px;padding:22px;text-align:center;margin:20px 0}
.blast-hud{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;font-weight:800;font-size:17px;margin:6px 0 10px}
.blast-prompt{display:flex;flex-direction:column;align-items:center;gap:2px;margin-bottom:12px}
.blast-prompt small{font-weight:700;color:#52616a;font-size:15px}
.blast-prompt strong{font-size:30px;color:#1b2b4a}
.blast-field{position:relative;height:340px;overflow:hidden;border-radius:16px;border-bottom:6px solid #4caf7a;
  background:radial-gradient(circle,rgba(255,255,255,.85) 0 1px,transparent 2px) 0 0/90px 90px,radial-gradient(circle,rgba(255,255,255,.6) 0 1px,transparent 2px) 40px 30px/130px 130px,linear-gradient(#0f1b3d,#2a3f7a)}
.blast-rock{position:absolute;top:0;width:20%;min-height:54px;padding:8px 6px;border-radius:999px;background:linear-gradient(#f8dc8c,#d99a2b);color:#2b1d14;
  border:3px solid #fff3c4;box-shadow:0 4px 14px rgba(0,0,0,.45);font-size:26px;font-weight:900;cursor:pointer;will-change:transform;transition:opacity .35s,filter .35s,background .2s}
.blast-rock:hover{filter:brightness(1.08)}
.blast-rock .yi{direction:rtl}
.blast-rock.hit{background:#4caf7a;border-color:#d9ffe6;color:#fff;animation:blastPop .7s forwards;pointer-events:none}
.blast-rock.miss{opacity:.12;filter:grayscale(1);pointer-events:none}
.blast-rock.reveal{background:#e45b5b;border-color:#ffd6d6;color:#fff;pointer-events:none}
@keyframes blastPop{60%{opacity:1;scale:1.35}to{opacity:0;scale:1.6}}
.blast-feedback{min-height:28px;font-weight:800;margin:12px 0 0}
.blast-final{font-size:20px;font-weight:800}
.blast-review{max-width:420px;margin:10px auto 16px}
.blast-review-row{font-size:20px;margin:4px 0}
@media(max-width:600px){.blast-field{height:300px}.blast-rock{width:22%;font-size:20px;padding:6px 4px}.blast-prompt strong{font-size:24px}}
