/* =================================================================
   Rovia — עיצוב
   RTL עברית · תוכן רומני LTR · תמיכה במצב כהה
================================================================= */

@font-face{font-family:Heebo;src:url("../assets/landing/heebo-medium.ttf") format("truetype");font-weight:400 700;font-display:swap}
@font-face{font-family:Heebo;src:url("../assets/landing/heebo-extrabold.ttf") format("truetype");font-weight:800 900;font-display:swap}
@font-face{font-family:Karantina;src:url("../assets/landing/karantina-bold.ttf") format("truetype");font-weight:700;font-display:swap}
@font-face{font-family:Kalam;src:url("../assets/landing/kalam-bold.ttf") format("truetype");font-weight:700;font-display:swap}

:root{
  --ro-blue:#2f6fe0;
  --ro-yellow:#f5c518;
  --ro-red:#e0483d;

  --bg:#f6f7fb;
  --bg-soft:#eef0f7;
  --card:#ffffff;
  --ink:#1d2333;
  --ink-2:#5b6478;
  --ink-3:#687287;
  --line:#e2e6ef;
  --line-2:#cdd4e2;

  --ok:#2f9e6e;
  --ok-bg:#e6f7ef;
  --ok-line:#9fdcc2;
  --bad:#e0483d;
  --bad-bg:#fdecea;
  --bad-line:#f3b3ad;
  --gold:#f5b301;

  --shadow:0 1px 2px rgba(20,26,45,.06), 0 6px 20px rgba(20,26,45,.06);
  --shadow-lg:0 10px 40px rgba(20,26,45,.14);
  --r:16px;
  --r-sm:10px;
  --tap:0 4px 0 var(--line-2);

  --font-he:"Heebo","Assistant","Rubik",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-ro:"Georgia","Times New Roman",serif;
}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#12151f; --bg-soft:#191d2a; --card:#1c2130; --ink:#eef1f8; --ink-2:#a4adc2;
    --ink-3:#8993a8; --line:#2b3243; --line-2:#3a4256;
    --ok-bg:#123326; --ok-line:#2c6d51; --bad-bg:#3a1e1b; --bad-line:#7d3a33;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 20px rgba(0,0,0,.3);
    --shadow-lg:0 10px 40px rgba(0,0,0,.5);
  }
}
:root[data-theme="dark"]{
  --bg:#12151f; --bg-soft:#191d2a; --card:#1c2130; --ink:#eef1f8; --ink-2:#a4adc2;
  --ink-3:#8993a8; --line:#2b3243; --line-2:#3a4256;
  --ok-bg:#123326; --ok-line:#2c6d51; --bad-bg:#3a1e1b; --bad-line:#7d3a33;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 6px 20px rgba(0,0,0,.3);
  --shadow-lg:0 10px 40px rgba(0,0,0,.5);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  direction:rtl;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-he);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
button{font-family:inherit;font-size:inherit;color:inherit;cursor:pointer}
:focus-visible{outline:3px solid var(--ro-blue);outline-offset:2px;border-radius:6px}
.sr-only{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}
.skip-link{position:fixed;z-index:1000;top:10px;inset-inline-start:10px;padding:10px 16px;border-radius:8px;background:var(--ink);color:var(--bg);font-weight:900;text-decoration:none;transform:translateY(-150%)}
.skip-link:focus{transform:none}
::selection{background:#f8cb4e;color:#1d2423}
*{scrollbar-color:#58b2a0 #f7f0dc;scrollbar-width:thin}
.ui-icon{width:22px;height:22px;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ---------------- Entry + first session ---------------- */
.entry-gate,.onboarding{
  --paper:#f7f0dc;--marker:#1d2423;--yellow:#f8cb4e;--coral:#df6869;--teal:#58b2a0;--rule:#c8c2b4;
  min-height:100svh;color:var(--marker);background-color:var(--paper);
  background-image:radial-gradient(circle at 22% 18%,rgba(29,36,35,.035) 0 1px,transparent 1.5px);
  background-size:13px 13px;position:relative;overflow:hidden;
}
.entry-gate{display:grid;grid-template-columns:46% 54%;direction:ltr}
.entry-brand{position:absolute;top:30px;left:42px;display:flex;flex-direction:column;align-items:flex-start;color:var(--marker);text-decoration:none;font:700 34px/.8 Kalam,Georgia,serif;z-index:3}
.entry-brand i{display:flex;width:70px;height:5px;margin-top:7px;transform:rotate(-2deg)}
.entry-brand i b{flex:1}.entry-brand i b:nth-child(1){background:#00319c}.entry-brand i b:nth-child(2){background:#ffde00}.entry-brand i b:nth-child(3){background:#de2110}
.entry-copy{grid-column:2;grid-row:1;direction:rtl;min-height:100svh;padding:clamp(130px,17vh,190px) clamp(48px,8vw,130px) 70px 5vw;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;position:relative;z-index:2}
.entry-letter{position:absolute;inset-inline-end:5%;top:5%;margin:0;font:700 clamp(230px,33vw,510px)/.8 Georgia,serif;color:rgba(29,36,35,.035);pointer-events:none}
.entry-copy h1{margin:0;font:700 clamp(62px,7vw,106px)/.9 Karantina,var(--font-he);letter-spacing:-.02em;max-width:620px;text-wrap:balance}
.entry-copy h1::after{content:"";display:block;width:78%;height:12px;margin-top:13px;background:var(--coral);clip-path:polygon(0 30%,100% 0,97% 75%,3% 100%);transform:rotate(-1deg)}
.entry-copy>p:not(.entry-letter):not(.entry-message){max-width:530px;margin:32px 0 0;font-size:19px;line-height:1.75;color:var(--muted-ink,#5f625b)}
.entry-google{width:min(100%,390px);min-height:64px;margin-top:38px;border:0;border-radius:14px;background:var(--marker);color:var(--paper);font-weight:900;display:flex;align-items:center;justify-content:center;gap:14px;transition:transform .2s cubic-bezier(.2,.8,.3,1),background .2s}
.entry-google:hover:not(:disabled){transform:translateY(-3px);background:color-mix(in srgb,var(--marker) 88%,var(--teal))}.entry-google:disabled{opacity:.72;cursor:wait}.entry-google[data-state="retry"]{background:var(--coral);color:var(--marker)}
.google-mark{width:32px;height:32px;border-radius:50%;background:var(--paper);display:grid;place-items:center;padding:6px}.google-mark svg{width:100%;height:100%;display:block}
.entry-message{width:min(100%,390px);min-height:24px;margin:12px 0 0;color:var(--marker);font-weight:700;font-size:14px}
.entry-back{margin-top:6px;color:var(--marker);font-weight:800;text-underline-offset:5px}
.entry-proof{grid-column:1;grid-row:1;direction:rtl;min-height:100svh;background:var(--teal);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:100px 17%;border-inline-end:1px solid rgba(29,36,35,.22);position:relative;overflow:hidden}
.entry-proof::before{content:"ț";position:absolute;left:-3%;bottom:-15%;font:700 clamp(330px,47vw,700px)/.75 Georgia,serif;color:rgba(247,240,220,.2);direction:ltr}
.entry-note{position:relative;font:700 22px/1.2 Kalam,Georgia,serif;transform:rotate(-3deg);z-index:1}
.entry-word{position:relative;z-index:1;margin:38px 0 26px;padding:25px 50px 30px;border-top:2px solid var(--marker);border-bottom:2px solid var(--marker)}
.entry-word strong{display:block;font:700 clamp(72px,9vw,132px)/.9 Georgia,serif}.entry-word span{display:block;margin-top:18px;font-weight:900;font-size:18px}
.entry-proof>p{position:relative;z-index:1;max-width:360px;font-weight:700;font-size:17px;line-height:1.65}

.onboarding-head{height:94px;border-bottom:1px solid rgba(29,36,35,.18);display:flex;align-items:center;justify-content:flex-start;padding:0 48px}.onboarding-head .entry-brand{position:static;margin-inline-end:auto}.onboarding-skip{border:0;background:transparent;text-decoration:underline;text-underline-offset:6px;font-weight:800;padding:14px;color:var(--marker)}
.onboarding-layout{width:min(1240px,calc(100% - 80px));min-height:calc(100svh - 94px);margin:auto;display:grid;grid-template-columns:1.08fr .92fr;gap:8vw;align-items:center;padding:52px 0 70px}
.onboarding-copy h1{margin:0;font:700 clamp(60px,6.3vw,92px)/.94 Karantina,var(--font-he);letter-spacing:-.02em;text-wrap:balance}.onboarding-copy h1 span{position:relative;white-space:nowrap}.onboarding-copy h1 span::after{content:"";position:absolute;z-index:-1;left:-2%;right:-2%;bottom:6%;height:12px;background:var(--yellow);clip-path:polygon(0 24%,100% 0,98% 85%,2% 100%);transform:rotate(-1deg)}
.onboarding-copy>p:first-of-type{max-width:570px;margin:28px 0 30px;color:#5f625b;font-size:18px;line-height:1.75}
.pace-picker{border:0;padding:0;margin:0;min-width:0}.pace-picker legend{font-size:18px;font-weight:900;margin-bottom:13px}.pace-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.pace-picker legend{grid-column:1/-1}
.pace-picker button{position:relative;min-height:96px;border:1px solid var(--rule);border-radius:12px;background:rgba(255,255,255,.18);text-align:right;padding:17px 15px;transition:transform .16s,border-color .16s,background .16s}.pace-picker button:hover{transform:translateY(-2px);border-color:var(--marker)}.pace-picker button.selected{background:var(--yellow);border-color:var(--marker)}
.pace-picker b,.pace-picker span{display:block}.pace-picker b{font-size:18px}.pace-picker span{margin-top:5px;font-size:13px;color:#5f625b;font-weight:700}.pace-picker em{position:absolute;top:-11px;left:10px;background:var(--marker);color:var(--paper);border-radius:999px;padding:3px 9px;font-style:normal;font-size:11px;font-weight:900}
.onboarding-start{width:min(100%,430px);min-height:62px;margin-top:25px;border:0;border-radius:14px;background:var(--marker);color:var(--paper);display:flex;align-items:center;justify-content:center;gap:14px;font-weight:900;transition:transform .18s,background .18s}.onboarding-start:hover{transform:translateY(-3px);background:color-mix(in srgb,var(--marker) 88%,var(--teal))}.onboarding-start svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transform:rotate(180deg)}
.onboarding-save{margin:10px 0 0!important;font-size:13px!important;color:#5f625b!important}
.sound-proof{position:relative;min-height:560px;background:var(--teal);border:2px solid var(--marker);border-radius:16px;padding:62px 34px 42px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;overflow:hidden;transform:rotate(1deg)}
.sound-proof::before,.sound-proof::after{content:"";position:absolute;background:rgba(247,240,220,.22);width:170px;height:24px}.sound-proof::before{top:15px;left:-35px;transform:rotate(-20deg)}.sound-proof::after{right:-34px;bottom:20px;transform:rotate(-17deg)}
.sound-script{position:absolute;top:10px;left:22px;font:700 48px/1 Kalam,Georgia,serif;color:rgba(29,36,35,.18);transform:rotate(-8deg)}
.sound-proof>p{max-width:340px;font-weight:800;font-size:18px;line-height:1.55;margin:0 0 28px}.sound-button{width:72px;height:72px;border:2px solid var(--marker);border-radius:50%;background:var(--paper);display:grid;place-items:center;transition:transform .16s}.sound-button:hover{transform:scale(1.06) rotate(-3deg)}.sound-button svg{width:33px;height:33px;fill:none;stroke:var(--marker);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sound-button.playing{animation:soundPulse .75s ease-out infinite}.sound-proof>strong{margin-top:25px;font:700 clamp(68px,8vw,112px)/.9 Georgia,serif}.sound-proof>span:not(.sound-script){font-weight:900;font-size:18px;margin-top:16px}.sound-proof>i{position:absolute;right:-18px;bottom:-78px;font:700 250px/1 Georgia,serif;color:rgba(247,240,220,.18)}
@keyframes soundPulse{to{box-shadow:0 0 0 18px rgba(247,240,220,0)}}

@media(max-width:800px){
  .entry-brand{top:21px;left:20px;font-size:28px}.entry-brand i{width:58px;height:4px}
  .entry-gate{display:block;padding-top:78px}.entry-copy{min-height:auto;width:100%;padding:54px 20px 44px;align-items:center;text-align:center}.entry-copy h1{font-size:clamp(52px,17vw,70px)}.entry-copy h1::after{margin-inline:auto;height:9px}.entry-copy>p:not(.entry-letter):not(.entry-message){margin-top:23px;font-size:16px;line-height:1.65}.entry-google{margin-top:27px}.entry-message{text-align:center}.entry-proof{width:100%;min-height:330px;padding:55px 20px}.entry-word{margin:25px 0 12px;padding:18px 34px 22px}.entry-word strong{font-size:72px}.entry-proof>p{font-size:15px}.entry-letter{display:none}
  .onboarding-head{height:76px;padding:0 12px 0 20px}.onboarding-head .entry-brand{font-size:27px}.onboarding-skip{font-size:13px}
  .onboarding-layout{width:calc(100% - 40px);min-height:auto;display:flex;flex-direction:column;gap:36px;padding:44px 0 54px}.onboarding-copy{width:100%}.onboarding-copy h1{font-size:clamp(52px,15vw,68px)}.onboarding-copy>p:first-of-type{margin:23px 0 25px;font-size:16px}.pace-picker{grid-template-columns:1fr}.pace-picker button{min-height:68px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:16px;text-align:right;padding:13px 15px}.pace-picker button span{margin:0}.pace-picker em{top:50%;left:12px;transform:translateY(-50%)}.onboarding-start{width:100%}.sound-proof{width:100%;min-height:300px;padding:43px 24px 32px}.sound-script{font-size:36px}.sound-proof>p{font-size:15px;margin-bottom:18px}.sound-button{width:60px;height:60px}.sound-proof>strong{font-size:64px;margin-top:17px}.sound-proof>span:not(.sound-script){font-size:16px;margin-top:10px}.sound-proof>i{font-size:170px;bottom:-53px}
}

@media(max-width:800px) and (max-height:520px){
  .entry-gate{padding-top:0}
  .entry-brand{top:13px;left:16px;font-size:24px}.entry-brand i{width:50px;height:3px;margin-top:5px}
  .entry-copy{min-height:100svh;padding:58px 18px 16px;justify-content:center}
  .entry-copy h1{font-size:clamp(42px,11vw,52px);line-height:.9}.entry-copy h1::after{height:7px;margin-top:8px}
  .entry-copy>p:not(.entry-letter):not(.entry-message){margin-top:13px;font-size:14px;line-height:1.5}
  .entry-google{min-height:54px;margin-top:15px}.entry-message{margin-top:7px;min-height:22px;font-size:14px}.entry-back{margin-top:2px;font-size:14px}
  .entry-proof{min-height:280px;padding-block:40px}
}

/* רומנית תמיד LTR.
   חשוב: הבידוד (isolate) חל רק על המכל עצמו — לא על צאצאיו.
   אם מבודדים גם <b> פנימי, הוא הופך לריצה נפרדת וסדר המילים מתהפך ב-RTL. */
.ro, [lang="ro"]{
  direction:ltr; unicode-bidi:isolate;
  font-family:var(--font-ro);
  font-feature-settings:"kern";
}
.ro *:not(.he){font-family:var(--font-ro)}
.he{direction:rtl;unicode-bidi:isolate;font-family:var(--font-he)}

/* ---------------- Layout ---------------- */
#app{min-height:100vh;display:flex;flex-direction:column}
.wrap{width:100%;max-width:720px;margin:0 auto;padding:0 18px}

/* ---------------- Top bar ---------------- */
.topbar{
  position:sticky;top:0;z-index:50;
  background:color-mix(in srgb, var(--card) 88%, transparent);
  backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid var(--line);
}
.topbar .wrap{display:flex;align-items:center;gap:14px;height:60px}
.brand{display:flex;flex-direction:column;align-items:flex-start;gap:3px;font:700 24px/.8 Kalam,var(--font-ro);letter-spacing:-.01em;text-decoration:none;color:inherit}
.brand-rule{display:flex;width:48px;height:4px;direction:ltr;transform:rotate(-2deg)}
.brand-rule i{flex:1}.brand-rule i:nth-child(1){background:#00319c}.brand-rule i:nth-child(2){background:#ffde00}.brand-rule i:nth-child(3){background:#de2110}
.flag{width:22px;height:15px;border-radius:3px;overflow:hidden;display:flex;box-shadow:0 0 0 1px rgba(0,0,0,.12) inset}
.flag i{flex:1}
.flag i:nth-child(1){background:#00319c}
.flag i:nth-child(2){background:#ffde00}
.flag i:nth-child(3){background:#de2110}
.spacer{flex:1}

.stat{display:flex;align-items:center;gap:5px;font-weight:800;font-size:.95rem;color:var(--ink-2)}
.stat b{color:var(--ink)}
.stat small{font-size:.72rem;font-weight:800}
.stat .ui-icon{width:19px;height:19px}
.icon-btn{
  border:none;background:transparent;width:44px;height:44px;border-radius:10px;
  display:grid;place-items:center;font-size:1.15rem;transition:background .15s;
}
.icon-btn:hover{background:var(--bg-soft)}

/* צ'יפ הפרופיל בסרגל העליון */
.profile-chip{
  display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--card);
  border-radius:999px;padding:4px 12px 4px 4px;font-weight:800;font-size:.9rem;
  max-width:190px;transition:background .15s,border-color .15s;
}
.profile-chip:hover{background:var(--bg-soft);border-color:var(--line-2)}
.profile-avatar{
  flex:0 0 30px;width:30px;height:30px;border-radius:50%;background:var(--ro-blue);color:#fff;
  display:grid;place-items:center;font-size:.95rem;font-weight:800;text-transform:uppercase;
}
.profile-avatar .ui-icon{width:17px;height:17px}
.profile-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* שדות טקסט: הרשמה ופרופיל */
.form-field{display:flex;flex-direction:column;gap:6px;margin:0 0 14px;text-align:start}
.form-field label{font-weight:800;font-size:.9rem}
.form-field input{
  width:100%;border:2px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);
  padding:12px 14px;font-size:1rem;font-family:inherit;
}
.form-field input:focus{outline:none;border-color:var(--ro-blue)}
.form-field input::placeholder{color:var(--ink-3)}
.form-field input[type=tel]{direction:ltr;text-align:start}
.field-note{margin:0 0 4px;color:var(--ink-3);font-size:.84rem;line-height:1.6}
.profile-fields{border:0;margin:26px 0 24px;padding:0}
.profile-fields legend{padding:0;margin-bottom:12px;font-weight:800}
.profile-fields legend span{color:var(--ink-3);font-weight:700}

/* ---------------- Home ---------------- */
.hero{padding:26px 0 8px}
.hero-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.hero h1{margin:0 0 4px;font-size:1.75rem;letter-spacing:-.02em}
.hero p{margin:0;color:var(--ink-2);font-size:.95rem}

.stat.level{color:var(--gold)}

/* טבעת מטרה יומית */
.goalwrap{
  position:relative;flex:0 0 auto;border:none;background:none;width:64px;height:64px;
  display:grid;place-items:center;
}
.goalring{display:block}
.gr-bg{fill:none;stroke:var(--line);stroke-width:6}
.gr-fg{fill:none;stroke:var(--ok);stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset .5s cubic-bezier(.2,.8,.3,1)}
.goalnum{position:absolute;inset:0;display:grid;place-items:center;font-weight:900;font-size:1.05rem;color:var(--ink)}

.statrow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0 8px}
.statcard{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:12px 10px;text-align:center;box-shadow:var(--shadow);
}
.statcard .v{font-size:1.5rem;font-weight:800;line-height:1.15}
.statcard .k{font-size:.78rem;color:var(--ink-3);font-weight:600}

.quickrow{display:flex;gap:10px;margin:14px 0 6px;flex-wrap:wrap}
.chip{
  border:1px solid var(--line);background:var(--card);border-radius:999px;
  padding:9px 15px;font-weight:700;font-size:.9rem;display:flex;align-items:center;gap:7px;
  box-shadow:var(--shadow);transition:transform .12s, border-color .15s;
}
.chip:hover{transform:translateY(-1px);border-color:var(--line-2)}
.chip.accent{background:var(--ro-blue);color:#fff;border-color:transparent}
.chip[disabled]{opacity:.45;cursor:not-allowed;transform:none}

/* ---------------- Today home ---------------- */
.screen-today{background:#f7f0dc}
.screen-today .topbar{position:relative;background:#f7f0dc;border-color:rgba(29,36,35,.18);backdrop-filter:none}
.screen-today .topbar .wrap{max-width:1200px;height:76px;padding-inline:20px}
.today-shell{
  --today-paper:#f7f0dc;--today-ink:#1d2423;--today-muted:#5f625b;--today-line:#c8c2b4;
  --today-yellow:#f8cb4e;--today-coral:#df6869;--today-teal:#58b2a0;
  min-height:calc(100svh - 76px);background-color:var(--today-paper);color:var(--today-ink);
  background-image:radial-gradient(circle at 22% 18%,rgba(29,36,35,.035) 0 1px,transparent 1.5px);background-size:13px 13px;
  padding:70px 0 80px;
}
.today-wrap{width:min(1160px,calc(100% - 40px));margin:auto}
.today-intro{display:grid;grid-template-columns:1.25fr .75fr;gap:8vw;align-items:end;padding-bottom:54px;border-bottom:1px solid rgba(29,36,35,.22)}
.today-intro h1{margin:0;font:700 clamp(62px,7vw,98px)/.92 Karantina,var(--font-he);letter-spacing:-.02em;text-wrap:balance}
.today-intro h1 span{position:relative;white-space:nowrap}.today-intro h1 span::after{content:"";position:absolute;z-index:-1;left:-2%;right:-2%;bottom:4%;height:12px;background:var(--today-coral);clip-path:polygon(0 28%,100% 0,98% 82%,2% 100%);transform:rotate(-1deg)}
.today-intro>div>p{max-width:620px;margin:26px 0 0;color:var(--today-muted);font-size:18px;line-height:1.75}
.today-progress{padding-bottom:8px}.today-progress>div:first-child{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:15px}.today-progress strong{font:700 30px/1 Karantina,var(--font-he)}.today-progress span{font-size:14px;font-weight:800;color:var(--today-muted)}
.today-progress-track{height:13px;border:1px solid var(--today-ink);border-radius:999px;overflow:hidden;background:rgba(255,255,255,.15)}.today-progress-track i{display:block;height:100%;min-width:3px;background:var(--today-teal);border-radius:inherit;transition:width .55s cubic-bezier(.2,.8,.3,1)}
.today-grid{display:grid;grid-template-columns:1.4fr .6fr;gap:24px;margin-top:30px}
.next-lesson{position:relative;min-height:410px;padding:48px clamp(30px,5vw,68px);background:var(--today-yellow);border:2px solid var(--today-ink);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.next-label{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:900}.next-label::before{content:"";width:11px;height:11px;border-radius:50%;background:var(--lesson-color);border:1px solid var(--today-ink)}
.next-unit{margin:26px 0 4px;font-weight:800;color:var(--today-muted)}.next-unit b{font-family:var(--font-ro)}
.next-lesson h2{position:relative;z-index:1;margin:0;font:700 clamp(52px,5.5vw,78px)/.95 Karantina,var(--font-he);letter-spacing:-.02em}.next-lesson>p:not(.next-unit){position:relative;z-index:1;max-width:510px;margin:20px 0 27px;font-weight:700;font-size:17px;line-height:1.6}
.next-lesson button{position:relative;z-index:2;min-height:58px;border:0;border-radius:12px;background:var(--today-ink);color:var(--today-paper);padding:0 26px;display:flex;align-items:center;gap:12px;font-weight:900;transition:transform .18s,background .18s}.next-lesson button:hover{transform:translateY(-3px);background:color-mix(in srgb,var(--today-ink) 88%,var(--today-teal))}.next-lesson button .ui-icon{transform:rotate(180deg)}
.next-mark{position:absolute;direction:ltr;left:-18px;bottom:-82px;font:700 340px/.8 var(--font-ro);color:rgba(29,36,35,.08);pointer-events:none}
.today-pulse{padding:34px 28px;border-top:2px solid var(--today-ink);border-bottom:2px solid var(--today-ink);align-self:stretch}.today-pulse h2{margin:0 0 18px;font-size:20px}.pulse-row{display:flex;align-items:center;gap:16px;padding:20px 0;border-top:1px solid var(--today-line)}.pulse-row>.ui-icon{width:28px;height:28px;color:var(--today-ink)}.pulse-row div{display:flex;flex-direction:column}.pulse-row strong{font-size:17px}.pulse-row span{font-size:13px;color:var(--today-muted);font-weight:700}.pulse-link{border:0;background:transparent;padding:11px 0 0;text-decoration:underline;text-underline-offset:5px;font-weight:800}
.short-session{margin-top:24px;padding:20px 24px;background:var(--today-ink);color:var(--today-paper);display:flex;align-items:center;justify-content:space-between;gap:24px;border-radius:12px}.short-session>div{display:flex;align-items:center;gap:18px}.short-session .ui-icon{width:34px;height:34px;color:var(--today-teal)}.short-session p{margin:0;display:flex;flex-direction:column}.short-session strong{font-size:18px}.short-session span{color:#d9d8c9;font-size:14px}.short-session>button{border:1px solid var(--today-paper);border-radius:10px;background:transparent;color:var(--today-paper);min-height:46px;padding:0 22px;font-weight:900}.short-session>button:hover:not(:disabled){background:var(--today-paper);color:var(--today-ink)}.short-session>button:disabled{opacity:.4;cursor:not-allowed}
.due-section{padding:78px 0 62px}.due-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:24px}.due-heading h2{margin:0;font:700 clamp(42px,4vw,58px)/1 Karantina,var(--font-he)}.due-heading p{margin:10px 0 0;color:var(--today-muted)}.due-heading>button{border:0;background:transparent;text-decoration:underline;text-underline-offset:6px;font-weight:900;padding:10px 0}
.due-list{border-top:1px solid var(--today-ink)}.due-word{min-height:94px;border-bottom:1px solid var(--today-line);display:grid;grid-template-columns:52px 1fr auto;gap:18px;align-items:center}.due-word>button{width:46px;height:46px;border:1px solid var(--today-ink);border-radius:50%;background:transparent;display:grid;place-items:center}.due-word>button:hover{background:var(--today-teal)}.due-word>button.playing{animation:soundPulse .75s ease-out infinite}.due-word>div{display:flex;align-items:baseline;gap:18px}.due-word strong{font:700 30px/1 var(--font-ro);direction:ltr;unicode-bidi:isolate}.due-word span{font-weight:800}.due-word small{color:var(--today-muted);font-weight:800}
.due-empty{min-height:140px;border-bottom:1px solid var(--today-ink);display:flex;align-items:center;gap:34px}.due-empty>span{font:700 54px/1 Kalam,var(--font-ro);transform:rotate(-5deg);color:var(--today-teal)}.due-empty strong{font-size:18px}.due-empty p{margin:4px 0 0;color:var(--today-muted)}
.today-links{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--today-ink);border-bottom:1px solid var(--today-ink)}.today-links button{min-height:100px;border:0;border-inline-start:1px solid var(--today-line);background:transparent;display:flex;align-items:center;justify-content:center;gap:13px;font-weight:900}.today-links button:first-child{border-inline-start:0}.today-links button:hover{background:rgba(88,178,160,.18)}.today-links .ui-icon{width:27px;height:27px}.link-letter{font:700 34px/1 var(--font-ro);direction:ltr}
.course-map{margin-top:68px;border-top:2px solid var(--today-ink);border-bottom:2px solid var(--today-ink)}.course-map-head{min-height:96px;display:flex;align-items:center;gap:20px}.course-map-head span{display:flex;flex-direction:column}.course-map-head strong{font-size:22px}.course-map-head small{color:var(--today-muted);font-weight:700}.course-map-content{max-width:720px;margin:auto;padding:0 0 44px}.course-source{max-width:760px;margin:28px auto 0;color:var(--today-muted);font-size:13px;text-align:center;line-height:1.7}

:root[data-theme="dark"] .screen-today{background:#171c1b}
:root[data-theme="dark"] .screen-today .topbar{background:#171c1b;border-color:#414744}
:root[data-theme="dark"] .today-shell{--today-paper:#171c1b;--today-ink:#f7f0dc;--today-muted:#c8c2b4;--today-line:#414744;--today-yellow:#b98d25;--today-coral:#b55255;--today-teal:#3b8879;background-image:radial-gradient(circle at 22% 18%,rgba(247,240,220,.04) 0 1px,transparent 1.5px)}

@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .screen-today{background:#171c1b}
  :root:not([data-theme="light"]) .screen-today .topbar{background:#171c1b;border-color:#414744}
  :root:not([data-theme="light"]) .today-shell{--today-paper:#171c1b;--today-ink:#f7f0dc;--today-muted:#c8c2b4;--today-line:#414744;--today-yellow:#b98d25;--today-coral:#b55255;--today-teal:#3b8879;background-image:radial-gradient(circle at 22% 18%,rgba(247,240,220,.04) 0 1px,transparent 1.5px)}
}

@media(max-width:760px){
  .profile-chip{max-width:none;padding:3px}.profile-chip .profile-name{display:none}
  .screen-today .topbar .wrap{height:68px;gap:10px}.screen-today .topbar .brand{font-size:21px}.screen-today .topbar .brand-rule{width:42px}.screen-today .topbar .stat.level{display:none}.screen-today .topbar .stat{font-size:.82rem;gap:3px}.screen-today .topbar .stat .ui-icon{width:17px;height:17px}.screen-today .topbar .icon-btn{width:44px}
  .today-shell{padding:43px 0 54px;min-height:calc(100svh - 68px)}.today-wrap{width:calc(100% - 40px)}
  .today-intro{grid-template-columns:1fr;gap:32px;padding-bottom:36px}.today-intro h1{font-size:clamp(52px,15vw,68px)}.today-intro h1 span{white-space:normal}.today-intro>div>p{margin-top:20px;font-size:16px}.today-progress{padding:0}.today-progress strong{font-size:26px}
  .today-grid{grid-template-columns:1fr;margin-top:20px}.next-lesson{min-height:370px;padding:38px 24px}.next-unit{margin-top:22px}.next-lesson h2{font-size:54px}.next-lesson>p:not(.next-unit){font-size:15px;margin-top:16px}.next-mark{font-size:260px;bottom:-58px}
  .today-pulse{padding:25px 8px}.today-pulse h2{padding-inline:12px}.pulse-row{padding:17px 12px}.pulse-link{margin-inline:12px}
  .short-session{align-items:flex-start;padding:20px;flex-direction:column}.short-session>button{width:100%}
  .due-section{padding:58px 0 48px}.due-heading{align-items:flex-start;flex-direction:column;gap:8px}.due-heading h2{font-size:46px}.due-heading p{font-size:14px}.due-word{grid-template-columns:46px 1fr;gap:13px;padding:14px 0}.due-word>button{width:42px;height:42px}.due-word>div{align-items:flex-start;flex-direction:column;gap:4px}.due-word strong{font-size:27px}.due-word small{grid-column:2}.due-empty{align-items:flex-start;gap:18px;padding:25px 0}.due-empty>span{font-size:42px}.due-empty p{font-size:14px}
  .today-links{grid-template-columns:1fr}.today-links button{min-height:68px;border-inline-start:0;border-top:1px solid var(--today-line)}.today-links button:first-child{border-top:0}.course-map{margin-top:52px}.course-map-head{min-height:84px}.course-map-content{padding-bottom:30px}
}

/* ---------------- Course syllabus ---------------- */
.course-map .course-map-content{max-width:none;padding:0 0 16px}
.course-map-head{padding-block:24px}
.course-unit{display:grid;grid-template-columns:minmax(0, .85fr) minmax(0, 1.15fr);gap:clamp(32px,6vw,88px);padding:42px 0;border-top:1px solid var(--today-line)}
.course-unit-intro h2{font:700 clamp(36px,3.6vw,48px)/1.1 Karantina,var(--font-he);margin:0 0 14px;text-wrap:balance}
.course-unit-name{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 16px;margin:0 0 20px;color:var(--today-muted);font-size:14px}
.course-unit-name [lang="ro"]{direction:ltr;unicode-bidi:isolate;font-family:var(--font-ro);font-style:italic;font-size:18px}
.course-unit-goal{max-width:40ch;margin:0 0 20px;line-height:1.75}
.course-unit-progress{font-size:14px;font-weight:800;color:var(--today-muted);margin:0}
.course-unit-actions{display:flex;flex-wrap:wrap;gap:4px 22px;margin-top:14px}
.course-unit-actions button{background:transparent;border:0;border-bottom:1px solid var(--today-line);padding:10px 0;min-height:44px;font-size:14px;font-weight:800;color:var(--today-ink)}
.course-unit-actions button:hover{border-color:var(--today-ink)}
.course-lessons{list-style:none;padding:0;margin:0;min-width:0}
.course-lessons li+li{border-top:1px solid var(--today-line)}
.course-lesson{width:100%;display:grid;grid-template-columns:64px 28px minmax(0,1fr) 22px;align-items:center;gap:14px;padding:12px 14px;min-height:92px;text-align:start;background:transparent;color:var(--today-ink);border:1px solid transparent;border-radius:0}
.course-lesson:hover:not(:disabled){background:color-mix(in srgb,var(--today-teal) 12%,transparent)}
.course-lesson:disabled{cursor:not-allowed;color:var(--today-muted)}
.course-lesson-art{width:64px;height:64px;object-fit:contain;filter:saturate(.92);transition:transform .18s cubic-bezier(.2,.8,.3,1)}
.course-lesson:hover:not(:disabled) .course-lesson-art{transform:rotate(-2deg) scale(1.04)}
.course-lesson-index{flex:0 0 28px;display:grid;place-items:center;font-family:var(--font-ro);font-size:22px;font-variant-numeric:tabular-nums;color:var(--today-muted)}
.course-lesson-index .ui-icon{width:22px;height:22px}
.course-lesson-copy{flex:1;min-width:0}
.course-lesson-title{display:block;font-size:16px;font-weight:800;line-height:1.45;unicode-bidi:plaintext}
.course-lesson-status{display:block;margin-top:5px;font-size:14px;line-height:1.5;color:var(--today-muted)}
.course-lesson-arrow{flex:0 0 22px;transform:rotate(180deg)}
.course-lesson-arrow .ui-icon{width:20px;height:20px}
.course-lesson.is-current{background:#f8cb4e;color:#1d2423;border-color:#1d2423;border-radius:10px}
.course-lesson.is-current:hover{background:#f8cb4e;border-color:var(--today-ink)}
.course-lesson.is-current .course-lesson-index,.course-lesson.is-current .course-lesson-status{color:#1d2423}
.course-lesson.is-done .course-lesson-index{color:var(--today-ink)}
:root[data-theme="dark"] .course-lesson:not(.is-current) .course-lesson-art{filter:saturate(.8) brightness(.88)}
.course-lesson:focus-visible,.course-unit-actions button:focus-visible{outline:3px solid var(--today-ink);outline-offset:3px}
@media(max-width:700px){
  .course-unit{grid-template-columns:1fr;gap:22px;padding:30px 0}
  .course-unit-intro h2{font-size:38px}.course-unit-name{margin-bottom:14px}.course-unit-goal{margin-bottom:14px}
  .course-unit-actions{margin-top:8px}.course-lesson{grid-template-columns:50px 24px minmax(0,1fr) 20px;padding:12px 6px;gap:9px;min-height:78px}
  .course-lesson-art{width:50px;height:50px}.course-lesson-index{font-size:18px}
}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) .course-lesson:not(.is-current) .course-lesson-art{filter:saturate(.8) brightness(.88)}}
@media(prefers-reduced-motion:reduce){.course-lesson-art{transition:none}}

/* ---------------- Session ---------------- */
.session{flex:1;display:flex;flex-direction:column;min-height:100vh}
.session-top{padding:14px 0 6px}
.session-top .wrap{display:flex;align-items:center;gap:12px}
.progress{flex:1;height:14px;border-radius:99px;background:var(--line);overflow:hidden;position:relative}
.progress i{
  display:block;height:100%;width:0;border-radius:99px;position:relative;
  background:linear-gradient(90deg,var(--ok),#59c894);
  transition:width .45s cubic-bezier(.2,.8,.3,1);
}
.progress i::after{
  content:"";position:absolute;top:3px;inset-inline-start:6px;height:4px;
  width:calc(100% - 12px);min-width:0;
  border-radius:99px;background:rgba(255,255,255,.28);pointer-events:none;
}
.combo{
  font-weight:900;font-size:.85rem;color:var(--gold);
  display:flex;align-items:center;gap:3px;min-width:44px;justify-content:center;
}
@keyframes comboPop{0%{transform:scale(.6);opacity:0}55%{transform:scale(1.25)}100%{transform:scale(1);opacity:1}}
.combo.pop{animation:comboPop .38s}

.stage{flex:1;display:flex;align-items:flex-start;padding:16px 0 190px}
.card{width:100%}
@keyframes slideIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
.card{animation:slideIn .32s cubic-bezier(.2,.8,.3,1)}
@keyframes shake{10%,90%{transform:translateX(-2px)}20%,80%{transform:translateX(4px)}30%,50%,70%{transform:translateX(-7px)}40%,60%{transform:translateX(7px)}}
.card.shake{animation:shake .5s}

.prompt{font-size:1.3rem;font-weight:800;margin:0 0 18px;letter-spacing:-.02em;line-height:1.45}
.prompt-question{direction:rtl;unicode-bidi:plaintext;display:block}
.prompt small{display:block;font-size:.82rem;font-weight:700;color:var(--ink-3);letter-spacing:.04em;margin-bottom:6px}

/* --- word card (intro) --- */
.wordcard{
  background:var(--card);border:1px solid var(--line);border-radius:22px;
  padding:34px 22px;text-align:center;box-shadow:var(--shadow);
}
.wordcard > .ro{font-size:2.6rem;font-weight:700;line-height:1.2;margin-bottom:6px;letter-spacing:-.01em}
.wordcard > .ro u{text-decoration:none;border-bottom:3px solid var(--ro-yellow);padding-bottom:1px}
.wordcard .tr{font-size:1.05rem;color:var(--ink-2);font-weight:600}
.wordcard .he-t{font-size:1.5rem;font-weight:800;margin-top:14px}
.wordcard .tags{display:flex;gap:6px;justify-content:center;margin-top:14px;flex-wrap:wrap}
.tag{
  font-size:.75rem;font-weight:800;padding:3px 10px;border-radius:999px;
  background:var(--bg-soft);color:var(--ink-2);border:1px solid var(--line);
}
.tag.m{background:#e8f0ff;color:#2452a8;border-color:#c6d9ff}
.tag.f{background:#ffe9f2;color:#a8306a;border-color:#ffc9de}
.tag.n{background:#eef1e8;color:#5a6b3a;border-color:#d5deca}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .tag.m{background:#1a2947;color:#9dbcff;border-color:#2c4270}
:root:not([data-theme=light]) .tag.f{background:#3a1c2c;color:#ffa7cc;border-color:#5d2c45}
:root:not([data-theme=light]) .tag.n{background:#242b1c;color:#c3d69a;border-color:#3b4530}}

.speaker{
  border:none;background:var(--ro-blue);color:#fff;width:60px;height:60px;border-radius:50%;
  font-size:1.5rem;display:grid;place-items:center;margin:18px auto 0;
  box-shadow:0 4px 0 #1f52ad;transition:transform .1s, box-shadow .1s;
}
.speaker:active{transform:translateY(3px);box-shadow:0 1px 0 #1f52ad}
.speaker.sm{width:44px;height:44px;font-size:1rem;box-shadow:0 3px 0 #1f52ad;margin:0}
.speaker.ghost{background:var(--bg-soft);color:var(--ink-2);box-shadow:0 3px 0 var(--line-2)}
/* צמד השמעה: רגיל + איטי */
.speakpair{display:inline-flex;align-items:center;justify-content:center;gap:8px;vertical-align:middle}
.speakpair .speaker{margin:0}
.speaker .audio-label{display:none}
.speakpair.lg{margin:18px auto 0;gap:12px}
.speaker.slow-speaker{display:inline-flex;align-items:center;justify-content:center;gap:7px}
.speaker.slow-speaker.labeled{width:auto;min-width:60px;height:60px;padding:0 20px;border-radius:999px}
.speaker.slow-speaker.labeled.sm{height:44px;padding:0 14px}
.speaker.slow-speaker span{font-size:.86rem;font-weight:800;line-height:1}
@keyframes ring{0%{box-shadow:0 4px 0 #1f52ad,0 0 0 0 rgba(47,111,224,.45)}100%{box-shadow:0 4px 0 #1f52ad,0 0 0 22px rgba(47,111,224,0)}}
.speaker.playing{animation:ring .8s ease-out infinite}

/* --- options --- */
.opts{display:grid;gap:10px;margin-top:4px}
.skill-summary{margin:18px 0}.skill-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}.skill-item{display:grid;gap:3px;padding:12px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}.skill-item strong{font-size:1.25rem;color:var(--ink)}.skill-item small{color:var(--ink-3);font-size:.78rem}@media(max-width:600px){.skill-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.checkpoint-summary{margin:24px 0;padding:18px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;gap:18px;align-items:center;justify-content:space-between}.checkpoint-summary h2{margin:0 0 4px;font-size:18px}.checkpoint-summary p{margin:0;color:var(--ink-2)}.checkpoint-summary button{border:0;border-radius:0;background:transparent;box-shadow:inset 0 -3px 0 var(--sound-yellow);color:var(--ink);font:inherit;font-weight:900;padding:8px 0}.checkpoint-result{margin:18px auto 0;max-width:38ch;color:var(--ink-2);font-weight:700}.checkpoint-action{margin-top:14px;text-align:center}@media(max-width:600px){.checkpoint-summary{align-items:flex-start;flex-direction:column;gap:8px}}
.writing-task{margin-top:16px;padding:18px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}.writing-task p{margin:0 0 12px;color:var(--ink-2)}.writing-task ul{margin:0 0 16px;padding-inline-start:22px;color:var(--ink-2)}.writing-task li+li{margin-top:5px}.writing-task label{display:block;margin-bottom:7px;font-weight:800}.writing-task textarea{box-sizing:border-box;width:100%;resize:vertical;border:2px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);font:inherit;font-size:1rem;line-height:1.6;padding:12px}.writing-task textarea:focus{outline:3px solid rgba(42,103,215,.2);border-color:var(--ro-blue)}.writing-count{text-align:left;font-size:.85rem}
.writing-portfolio{margin:28px 0;padding:20px 0;border-block:1px solid var(--line)}.writing-portfolio h2{margin:0 0 4px;font-size:20px}.writing-portfolio>p{margin:0 0 14px;color:var(--ink-2)}.writing-portfolio details{border-top:1px solid var(--line);padding:12px 0}.writing-portfolio details:last-child{border-bottom:1px solid var(--line)}.writing-portfolio summary{cursor:pointer;font-weight:800}.writing-portfolio details p{white-space:pre-wrap;overflow-wrap:anywhere;color:var(--ink-2);line-height:1.65}
.opts.two{grid-template-columns:1fr 1fr}
.opt{
  background:var(--card);border:2px solid var(--line);border-radius:14px;
  padding:15px 16px;text-align:start;font-weight:700;font-size:1.05rem;
  box-shadow:0 4px 0 var(--line);transition:transform .1s, box-shadow .1s, border-color .12s, background .12s;
  display:flex;align-items:center;gap:11px;
}
.opt:hover:not([disabled]){border-color:var(--line-2)}
.opt:active:not([disabled]){transform:translateY(3px);box-shadow:0 1px 0 var(--line)}
.opt .k{
  width:24px;height:24px;flex:0 0 24px;border-radius:7px;border:1.5px solid var(--line-2);
  display:grid;place-items:center;font-size:.72rem;color:var(--ink-3);font-weight:800;
}
.opt.sel{border-color:var(--ro-blue);background:color-mix(in srgb,var(--ro-blue) 8%,var(--card))}
.opt.right{border-color:var(--ok);background:var(--ok-bg);box-shadow:0 4px 0 var(--ok-line)}
.opt.wrong{border-color:var(--bad);background:var(--bad-bg);box-shadow:0 4px 0 var(--bad-line)}
.opt[disabled]{cursor:default}

/* --- word bank (build) --- */
.answer-slot{
  min-height:76px;border-radius:14px;background:var(--bg-soft);border:2px dashed var(--line-2);
  padding:10px;display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;
  direction:ltr;justify-content:flex-start;
}
.answer-slot.filled{border-style:solid;background:var(--card)}
.bank{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;direction:ltr;justify-content:flex-start}
.tile{
  background:var(--card);border:2px solid var(--line);border-radius:11px;
  padding:9px 14px;font-weight:700;font-size:1.02rem;
  box-shadow:0 3px 0 var(--line);transition:transform .1s, box-shadow .1s, opacity .18s;
  font-family:var(--font-ro);direction:ltr;
}
.tile:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}
.tile.used{opacity:0;pointer-events:none}
@keyframes tileIn{from{transform:scale(.7);opacity:0}to{transform:none;opacity:1}}
.answer-slot .tile{animation:tileIn .18s}

/* --- typing --- */
.typebox{
  width:100%;border:2px solid var(--line);border-radius:14px;background:var(--card);
  padding:15px 16px;font-size:1.2rem;font-family:var(--font-ro);direction:ltr;
  color:var(--ink);resize:none;min-height:96px;line-height:1.5;
}
.typebox:focus{outline:none;border-color:var(--ro-blue)}
.field{width:100%;border:2px solid var(--line);border-radius:12px;background:var(--card);padding:11px 14px;font-size:1rem;color:var(--ink);direction:ltr}
.field:focus{outline:none;border-color:var(--ro-blue)}
.field::placeholder{color:var(--ink-3)}
.typebox.right{border-color:var(--ok);background:var(--ok-bg)}
.typebox.wrong{border-color:var(--bad);background:var(--bad-bg)}
.diacritics{display:flex;gap:7px;margin-top:10px;direction:ltr;flex-wrap:wrap}
.dkey{
  border:1.5px solid var(--line);background:var(--card);border-radius:9px;
  min-width:44px;height:44px;font-size:1.15rem;font-family:var(--font-ro);font-weight:600;
  box-shadow:0 3px 0 var(--line);transition:transform .08s,box-shadow .08s;
}
.dkey:active{transform:translateY(2px);box-shadow:0 1px 0 var(--line)}

/* --- match --- */
.matchgrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mcol{display:flex;flex-direction:column;gap:9px}
.mitem{
  background:var(--card);border:2px solid var(--line);border-radius:12px;padding:13px 12px;
  font-weight:700;box-shadow:0 3px 0 var(--line);transition:all .14s;text-align:center;
}
.mitem.sel{border-color:var(--ro-blue);background:color-mix(in srgb,var(--ro-blue) 10%,var(--card))}
.mitem.ok{border-color:var(--ok);background:var(--ok-bg);color:var(--ok);opacity:.55;pointer-events:none}
.mitem.err{border-color:var(--bad);background:var(--bad-bg);animation:shake .4s}

/* --- speak --- */
.mic{
  width:110px;height:110px;border-radius:50%;border:none;margin:10px auto;display:grid;
  place-items:center;font-size:2.4rem;background:var(--ro-red);color:#fff;
  box-shadow:0 5px 0 #a8352c;transition:transform .1s;
}
.mic:active{transform:translateY(3px)}
@keyframes micPulse{0%,100%{box-shadow:0 5px 0 #a8352c,0 0 0 0 rgba(224,72,61,.4)}50%{box-shadow:0 5px 0 #a8352c,0 0 0 26px rgba(224,72,61,0)}}
.mic.listening{animation:micPulse 1.3s ease-out infinite}
.heard{
  margin-top:14px;text-align:center;font-size:1.15rem;font-family:var(--font-ro);direction:ltr;
  min-height:32px;color:var(--ink-2);
}
.heard b.ok{color:var(--ok)}
.heard b.no{color:var(--bad)}

/* --- letters / grid cards --- */
.lettergrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:10px}
.lettercard{
  background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 10px;
  text-align:center;box-shadow:var(--shadow);transition:transform .12s;
}
.lettercard:hover{transform:translateY(-2px)}
.lettercard .l{font-size:1.7rem;font-weight:700;font-family:var(--font-ro)}
.lettercard .h{font-size:1rem;color:var(--ink-2);font-weight:700}
.lettercard.star{border-color:var(--ro-yellow);box-shadow:0 0 0 3px rgba(245,197,24,.16)}

/* ---------------- Footer feedback ---------------- */
.footer{
  position:fixed;bottom:0;inset-inline:0;z-index:60;
  border-top:1px solid var(--line);background:var(--card);
  transform:translateY(0);transition:background .25s, border-color .25s;
  padding-bottom:env(safe-area-inset-bottom);
}
.footer.ok{background:var(--ok-bg);border-color:var(--ok-line)}
.footer.no{background:var(--bad-bg);border-color:var(--bad-line)}
.footer .wrap{padding-top:14px;padding-bottom:16px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.verdict{flex:1;min-width:200px;display:flex;align-items:flex-start;gap:11px}
.verdict .mark{
  width:38px;height:38px;flex:0 0 38px;border-radius:50%;display:grid;place-items:center;
  font-size:1.15rem;color:#fff;font-weight:900;
}
@keyframes markPop{0%{transform:scale(0)}60%{transform:scale(1.22)}100%{transform:scale(1)}}
.verdict .mark{animation:markPop .32s}
.footer.ok .mark{background:var(--ok)}
.footer.no .mark{background:var(--bad)}
.verdict .txt{font-weight:800;line-height:1.4}
.footer.ok .verdict .txt{color:var(--ok)}
.footer.no .verdict .txt{color:var(--bad)}
.verdict .sub{font-weight:600;font-size:.9rem;color:var(--ink-2);margin-top:3px}
.verdict .sub .ro{font-weight:700;color:var(--ink)}

[hidden]{display:none!important}
.confirm-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
a.btn{display:inline-block;text-decoration:none;text-align:center}
.entry-legal{margin:14px 0 0;font-size:.86rem;color:var(--ink-2);line-height:1.6}
.entry-legal a{color:inherit;text-decoration:underline;text-underline-offset:3px}

.consent-strip{position:fixed;z-index:100;inset:auto 20px 20px;max-width:760px;margin-inline:auto;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:22px;background:#f7f0dc;color:#1d2423;border:2px solid #1d2423;border-radius:14px;box-shadow:0 12px 34px rgba(29,36,35,.18)}
.consent-strip[hidden]{display:none!important}
.consent-strip strong{display:block;font-size:18px;line-height:1.3}.consent-strip p{margin:4px 0 0;font-size:14px;line-height:1.55;color:#5f625b}.consent-strip a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.consent-actions{display:flex;gap:9px;flex:0 0 auto}.consent-actions button{min-height:44px;padding:9px 15px;border:1px solid #1d2423;border-radius:10px;background:transparent;color:#1d2423;font-weight:800}.consent-actions button:first-child{background:#1d2423;color:#f7f0dc}.consent-actions button:hover{transform:translateY(-1px)}
@media(max-width:680px){.consent-strip{inset:auto 12px 12px;align-items:stretch;flex-direction:column;gap:13px}.consent-actions{width:100%}.consent-actions button{flex:1}}

.btn{
  border:none;border-radius:14px;padding:14px 30px;font-weight:900;font-size:1rem;
  background:var(--ro-blue);color:#fff;box-shadow:0 4px 0 #1f52ad;
  transition:transform .09s, box-shadow .09s, opacity .15s;letter-spacing:-.01em;
}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 #1f52ad}
.btn[disabled]{opacity:.4;cursor:not-allowed;transform:none}
.btn.ok{background:var(--ok);box-shadow:0 4px 0 #1f6d4b}
.btn.ok:active{box-shadow:0 1px 0 #1f6d4b}
.btn.no{background:var(--bad);box-shadow:0 4px 0 #a8352c}
.btn.no:active{box-shadow:0 1px 0 #a8352c}
.btn.ghost{background:var(--bg-soft);color:var(--ink-2);box-shadow:0 4px 0 var(--line-2)}
.btn.sm{padding:9px 18px;font-size:.9rem;border-radius:11px}

.linkbtn{background:none;border:none;color:var(--ink-3);font-weight:700;font-size:.86rem;text-decoration:underline}

/* XP float */
@keyframes xpFloat{0%{opacity:0;transform:translateY(6px) scale(.8)}
20%{opacity:1;transform:translateY(-4px) scale(1.08)}
100%{opacity:0;transform:translateY(-46px) scale(1)}}
.xpfloat{
  position:fixed;z-index:80;font-weight:900;color:var(--ok);pointer-events:none;
  font-size:1.15rem;animation:xpFloat 1s ease-out forwards;
}

/* ---------------- Result ---------------- */
.result{text-align:center;padding:50px 0 40px}
@keyframes trophy{0%{transform:scale(0) rotate(-25deg)}60%{transform:scale(1.18) rotate(6deg)}100%{transform:scale(1) rotate(0)}}
.result .big{font-size:4.2rem;animation:trophy .6s cubic-bezier(.2,.9,.3,1.4)}
.result h2{margin:6px 0 4px;font-size:1.7rem;letter-spacing:-.02em}
.result p{color:var(--ink-2);margin:0 0 22px}
.rstats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:24px}
.rstat{border:2px solid var(--line);border-radius:var(--r);padding:14px 8px;background:var(--card)}
.rstat .v{font-size:1.6rem;font-weight:900}
.rstat .k{font-size:.78rem;color:var(--ink-3);font-weight:700}
.rstat.xp{border-color:var(--gold)} .rstat.xp .v{color:var(--gold)}
.rstat.acc{border-color:var(--ok)} .rstat.acc .v{color:var(--ok)}

#confetti{position:fixed;inset:0;pointer-events:none;z-index:70}

/* ---------------- Sheet (grammar / vocab / dialogue) ---------------- */
.sheet{padding:20px 0 70px}
.sheet h2{font-size:1.45rem;margin:0 0 4px;letter-spacing:-.02em}
.sheet .lead{color:var(--ink-2);margin:0 0 20px;font-size:.94rem}
.gcard{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:18px 20px;margin-bottom:16px;box-shadow:var(--shadow);
}
.gcard h3{margin:0 0 12px;font-size:1.1rem;display:flex;align-items:center;gap:8px}
.gcard h3::before{content:"";width:4px;height:19px;border-radius:99px;background:var(--u-color,var(--ro-blue))}
.gcard p{margin:0 0 11px}
.gcard ul,.gcard ol{margin:0 0 11px;padding-inline-start:22px}
.gcard li{margin-bottom:5px}

.gtable{width:100%;border-collapse:collapse;margin:0 0 13px;font-size:.94rem}
.gtable th{
  background:var(--bg-soft);font-weight:800;font-size:.83rem;color:var(--ink-2);
  padding:8px 10px;border:1px solid var(--line);text-align:start;
}
.gtable td{padding:8px 10px;border:1px solid var(--line);vertical-align:top}
.gtable td.ro,.gtable .ro{font-family:var(--font-ro)}
.gtable .he{font-family:var(--font-he);font-size:.86rem;color:var(--ink-2)}
.gtable.pron td:nth-child(odd),.gtable.conj td:nth-child(odd){font-weight:700}
.gtable.nums td:nth-child(odd){font-weight:800;color:var(--ink-3);width:36px;text-align:center}
.gtable.alt td:first-child{font-weight:800;white-space:nowrap;background:var(--bg-soft)}

.tip,.warn,.callout{
  border-radius:12px;padding:11px 14px;font-size:.92rem;margin:0 0 12px;border-inline-start:4px solid;
}
.tip{background:color-mix(in srgb,var(--ro-blue) 7%,var(--card));border-color:var(--ro-blue)}
.warn{background:color-mix(in srgb,var(--ro-yellow) 14%,var(--card));border-color:var(--ro-yellow)}
.callout{background:color-mix(in srgb,var(--ok) 9%,var(--card));border-color:var(--ok);font-weight:600}
.ex{background:var(--bg-soft);border-radius:10px;padding:10px 13px;margin:0 0 12px;font-size:.96rem;line-height:1.85}

/* dialogue */
.dline{
  display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);align-items:flex-start;
}
.dline:last-child{border-bottom:none}
.dwho{
  flex:0 0 84px;font-size:.8rem;font-weight:800;color:var(--ink-3);padding-top:4px;
  font-family:var(--font-ro);direction:ltr;text-align:start;
  display:flex;align-items:center;gap:6px;
}
.davatar{font-size:1.3rem;line-height:1}
.dbody{flex:1;min-width:0}
.dbody .ro{font-size:1.08rem;font-weight:600;line-height:1.55}
.dbody .he{font-size:.9rem;color:var(--ink-2);margin-top:3px}
.dline>.speaker{flex:0 0 36px}
.dline .speakpair,.vrow .speakpair{flex:0 0 auto}

/* תגים */
.badgerow{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:16px 0}
.badge{
  display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--card);
  border:2px solid var(--gold);border-radius:14px;padding:10px 14px;box-shadow:0 3px 0 var(--gold);
  animation:markPop .4s;
}
.badge .bi{font-size:1.6rem}
.badge .bl{font-size:.72rem;font-weight:800;color:var(--ink-2)}

.badgegrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:12px}
.badgecard{
  background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 10px;
  text-align:center;box-shadow:var(--shadow);display:flex;flex-direction:column;align-items:center;gap:6px;
}
.badgecard.locked{opacity:.4}
.badgecard .bi{font-size:2rem}
.badgecard .bl{font-size:.78rem;font-weight:700;color:var(--ink-2)}

/* vocab list */
.vsearch{
  width:100%;border:2px solid var(--line);border-radius:12px;background:var(--card);
  padding:12px 14px;font-size:1rem;color:var(--ink);margin-bottom:14px;font-family:var(--font-he);
}
.vsearch:focus{outline:none;border-color:var(--ro-blue)}
.vrow{
  display:flex;align-items:center;gap:12px;padding:11px 14px;background:var(--card);
  border:1px solid var(--line);border-radius:12px;margin-bottom:7px;
}
.vrow .w{flex:1;min-width:0;text-align:start}
.vrow .w .ro{display:inline-block;font-size:1.1rem;font-weight:700;line-height:1.3}
.vrow .w .ro u{text-decoration:none;border-bottom:2px solid var(--ro-yellow)}
.vrow .w .tr{font-size:.82rem;color:var(--ink-3);font-weight:600}
.vrow .m{font-weight:700;text-align:start;flex:0 0 34%}
.vrow .m .pl{font-size:.78rem;color:var(--ink-3);font-family:var(--font-ro);direction:ltr}
.strength{display:flex;gap:2px;flex:0 0 auto}
.strength i{width:5px;height:14px;border-radius:2px;background:var(--line)}
.strength i.on{background:var(--ok)}

/* misc */
.empty{text-align:center;color:var(--ink-3);padding:50px 20px;font-weight:600}
.backbar{display:flex;align-items:center;gap:10px;padding:14px 0 2px}
.backbar h2{margin:0;font-size:1.2rem;flex:1}
.pillrow{display:flex;gap:8px;overflow-x:auto;padding:2px 0 12px;scrollbar-width:none}
.pillrow::-webkit-scrollbar{display:none}
.pill{
  white-space:nowrap;border:1px solid var(--line);background:var(--card);border-radius:999px;
  min-height:44px;padding:7px 14px;font-weight:700;font-size:.86rem;
}
.typebox:focus-visible,.field:focus-visible,.vsearch:focus-visible{outline:3px solid var(--ro-blue);outline-offset:2px}
.pill.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}

.toast{
  position:fixed;bottom:100px;inset-inline:0;margin:auto;width:max-content;max-width:88vw;z-index:90;
  background:var(--ink);color:var(--bg);padding:11px 20px;border-radius:999px;font-weight:700;
  font-size:.9rem;box-shadow:var(--shadow-lg);animation:slideIn .25s;
}

@media (max-width:520px){
  .prompt{font-size:1.15rem}
  .wordcard > .ro{font-size:2.1rem}
  .statrow{gap:7px}
  .opts.two{grid-template-columns:1fr}
  .dwho{flex-basis:64px;font-size:.74rem}
  .vrow .m{flex-basis:38%}
  body:not(.screen-session) .vrow .speakpair,.dline .speakpair{flex-direction:column;gap:6px}
  body:not(.screen-session) .vrow .speaker.sm,.dline .speaker.sm{width:44px;height:44px}
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important}
}
/* Native in-page dialog: works in embedded browsers that suppress window.confirm. */
.quit-dialog { max-width: 440px; width: calc(100% - 40px); padding: 28px; border: 1px solid var(--line); border-radius: 20px; background: var(--bg); color: var(--ink); }
.quit-dialog::backdrop { background: rgb(0 0 0 / .65); }
.quit-dialog p { margin: 16px 0 24px; }
.quit-dialog form { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------------- Focused lesson loop ---------------- */
body.screen-session{
  --bg:#f7f0dc;--bg-soft:#eee5ce;--card:#fffaf0;--ink:#1d2423;--ink-2:#5f625b;--ink-3:#686b63;
  --line:#c8c2b4;--line-2:#aaa397;--ok:#287c6c;--ok-bg:#d5ebe4;--ok-line:#58b2a0;
  --bad:#a94448;--bad-bg:#f4d5d4;--bad-line:#df6869;--gold:#7b5c0c;
  background:#f7f0dc;color:#1d2423;
}
.mistake-review{text-align:start;margin:32px 0;padding:24px 0;border-block:1px solid var(--line)}
.mistake-review h3{margin:0;font-size:24px;line-height:1.4}
.mistake-review>p{color:var(--ink-2);font-size:14px;line-height:1.6}
.mistake-review ol{list-style:none;counter-reset:mistake;padding:0;margin:24px 0}
.mistake-review li{counter-increment:mistake;position:relative;padding:16px 42px 16px 8px;border-bottom:1px solid var(--line);overflow-wrap:anywhere;line-height:1.7}
.mistake-review li::before{content:counter(mistake) ".";position:absolute;inset-inline-start:8px;top:16px;font-weight:800;direction:ltr}
.mistake-review li p{text-align:start;margin:0 0 10px}
.mistake-review li>strong{font-size:13px;color:var(--ink-2)}
.mistake-review li .sub{font-size:14px;color:var(--ink-2)}
.mistake-review .btn{background:var(--ink);color:var(--bg);box-shadow:none;max-width:100%;white-space:normal}
.screen-session #app{background-color:var(--bg);background-image:radial-gradient(circle at 22% 18%,rgba(29,36,35,.035) 0 1px,transparent 1.5px);background-size:13px 13px}
.screen-session .session{min-height:100svh;background:transparent}
.screen-session .session-top{position:sticky;top:0;z-index:55;padding:0;background:color-mix(in srgb,var(--bg) 94%,transparent);border-bottom:1px solid color-mix(in srgb,var(--ink) 18%,transparent);backdrop-filter:blur(10px)}
.screen-session .session-top .wrap{max-width:940px;height:92px;padding:13px 22px;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:18px;align-items:center}
.screen-session .session-top .icon-btn{width:44px;height:44px;border:1px solid var(--line);background:transparent;border-radius:50%}.screen-session .session-top .icon-btn:hover{background:var(--bg-soft)}
.session-track{min-width:0}.session-meta{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:9px}.session-meta strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:15px}.session-meta span{color:var(--ink-2);font-size:13px;font-weight:800;font-variant-numeric:tabular-nums}
.screen-session .progress{height:10px;border:1px solid var(--ink);border-radius:999px;background:rgba(255,255,255,.18)}
.screen-session .progress i{background:#58b2a0;transition:width .42s cubic-bezier(.2,.8,.3,1)}.screen-session .progress i::after{display:none}
.screen-session .combo{min-width:42px;color:var(--gold);gap:3px}.screen-session .combo .ui-icon{width:20px;height:20px}.screen-session .combo b{font-size:14px}
.screen-session .stage{padding:64px 0 190px;align-items:flex-start}.screen-session .stage .wrap{max-width:800px;padding-inline:24px}
@keyframes lessonCardIn{from{opacity:.72;transform:translateY(12px);clip-path:inset(0 0 0 8%);filter:blur(2px)}to{opacity:1;transform:none;clip-path:inset(0);filter:none}}
.screen-session .card{animation:lessonCardIn .34s cubic-bezier(.16,1,.3,1)}
.screen-session .prompt{margin:0 0 30px;font-size:clamp(28px,4vw,40px);line-height:1.28;letter-spacing:-.025em;text-wrap:balance;direction:rtl}.screen-session .prompt small{display:block;width:max-content;max-width:100%;margin:0 0 13px;padding:4px 10px;background:#f8cb4e;color:#1d2423;clip-path:polygon(2% 10%,100% 0,97% 88%,0 100%);font-size:13px;line-height:1.3;letter-spacing:0;font-weight:900}
.screen-session .prompt .ro{direction:ltr;unicode-bidi:isolate;display:inline-block}
.screen-session .prompt>.ro{font-size:1.12em;font-weight:700}.screen-session .prompt-question .ro{direction:ltr;unicode-bidi:isolate;display:inline-block}.screen-session .prompt .speaker.sm{display:inline-grid;vertical-align:middle;margin-inline-start:8px}
.pronunciation-note{display:block;margin-top:6px;color:var(--ink-2);font-size:12px;font-weight:600;line-height:1.45}
.screen-session .wordcard{position:relative;padding:50px 34px;background:color-mix(in srgb,#58b2a0 34%,var(--card));border:2px solid var(--ink);border-radius:16px;box-shadow:none;overflow:hidden}.screen-session .wordcard::after{content:"ă";position:absolute;direction:ltr;left:-18px;bottom:-73px;font:700 230px/.8 var(--font-ro);color:color-mix(in srgb,var(--card) 26%,transparent);pointer-events:none}.screen-session .wordcard>*{position:relative;z-index:1}.screen-session .wordcard > .ro{font-size:clamp(52px,9vw,78px);line-height:1}.screen-session .wordcard > .ro u{border-color:#df6869}.screen-session .wordcard .tr{margin-top:12px;color:var(--ink-2)}.screen-session .wordcard .he-t{font-size:24px;margin-top:16px}.screen-session .wordcard p{color:var(--ink-2)!important}
.screen-session .speaker{width:66px;height:66px;margin-top:24px;border:2px solid var(--ink);border-radius:50%;background:var(--card);color:var(--ink);box-shadow:none;display:grid;place-items:center}.screen-session .speaker:hover{background:#f8cb4e}.screen-session .speaker:active{transform:scale(.96);box-shadow:none}.screen-session .speaker .ui-icon{width:29px;height:29px}.screen-session .speaker.sm{width:44px;height:44px;margin:0;border-width:1px;box-shadow:none}.screen-session .speaker.sm .ui-icon{width:21px;height:21px}.screen-session .speaker.ghost{background:transparent;color:var(--ink-2);box-shadow:none}.screen-session .speaker.slow-speaker{border-radius:999px;display:inline-flex;gap:6px}.screen-session .speaker.slow-speaker.labeled{width:auto;min-width:88px;height:66px;padding:0 20px}.screen-session .speaker.slow-speaker.labeled.sm{height:44px;padding:0 14px}.screen-session .speaker.slow-speaker span{font-size:12px;font-weight:900}.screen-session .speaker.slow-speaker .ui-icon{width:22px;height:22px}
.screen-session .speakpair.lg{margin-top:24px}.screen-session .speakpair.lg .speaker{margin-top:0}
.screen-session .opts{display:grid;grid-template-columns:1fr 1fr;gap:13px}.screen-session .opt{min-height:74px;padding:16px 18px;background:rgba(255,255,255,.18);border:1.5px solid var(--ink);border-radius:12px;box-shadow:none;font-size:18px;transition:transform .15s,background .15s,border-color .15s}.screen-session .opt:hover:not([disabled]){transform:translateY(-2px);background:var(--card);border-color:var(--ink)}.screen-session .opt:active:not([disabled]){transform:translateY(1px);box-shadow:none}.screen-session .opt .k{width:28px;height:28px;border:1px solid var(--ink);border-radius:8px;color:var(--ink-2);font-variant-numeric:tabular-nums}.screen-session .opt.sel,.screen-session .opt.sel:hover:not([disabled]){background:#f8cb4e;border-color:var(--ink)}.screen-session .opt.right{background:#58b2a0;border-color:var(--ink);box-shadow:none}.screen-session .opt.wrong{background:#df9a99;border-color:#a94448;box-shadow:none}
.screen-session .answer-slot{min-height:95px;padding:14px;border:1.5px dashed var(--ink);border-radius:12px;background:rgba(255,255,255,.14)}.screen-session .answer-slot.filled{border-style:solid;background:var(--card)}.screen-session .bank{gap:10px;margin-top:18px}.screen-session .tile{padding:11px 16px;border:1.5px solid var(--ink);border-radius:10px;background:var(--card);box-shadow:none}.screen-session .tile:active{transform:translateY(1px);box-shadow:none}
.screen-session .typebox{min-height:120px;padding:20px;border:1.5px solid var(--ink);border-radius:12px;background:var(--card);font-size:24px;caret-color:#df6869}.screen-session .typebox:focus{border-color:var(--ink);outline:3px solid #58b2a0;outline-offset:3px}.screen-session .diacritics{gap:9px;margin-top:15px}.screen-session .dkey{min-width:48px;height:44px;border:1px solid var(--ink);border-radius:9px;background:transparent;box-shadow:none}.screen-session .dkey:hover{background:#f8cb4e}
.screen-session .matchgrid{gap:14px}.screen-session .mcol{gap:11px}.screen-session .mitem{min-height:58px;border:1.5px solid var(--ink);border-radius:10px;background:rgba(255,255,255,.16);box-shadow:none}.screen-session .mitem.sel{background:#f8cb4e;border-color:var(--ink)}.screen-session .mitem.ok{background:#58b2a0;color:var(--ink);border-color:var(--ink)}.screen-session .mitem.err{background:#df9a99;border-color:#a94448}
.screen-session .mic{width:104px;height:104px;background:#df6869;color:#1d2423;border:2px solid var(--ink);box-shadow:none}.screen-session .mic .ui-icon{width:42px;height:42px}.screen-session .mic:active{transform:scale(.96)}
.screen-session .opt.sel,.screen-session .opt.right,.screen-session .opt.wrong,.screen-session .mitem.sel,.screen-session .mitem.ok{color:#1d2423}.screen-session .opt.sel .k,.screen-session .opt.right .k,.screen-session .opt.wrong .k{color:#1d2423;border-color:#1d2423}
.screen-session .footer.ok,.screen-session .footer.no{--ink:#1d2423;--ink-2:#5f625b;--bg:#f7f0dc}
.screen-session .vrow{background:rgba(255,255,255,.16);border:0;border-bottom:1px solid var(--line);border-radius:0;margin:0;padding:14px 5px}.screen-session .vrow:first-child{border-top:1px solid var(--line)}
.screen-session .gcard{background:rgba(255,255,255,.18);border:1px solid var(--line);border-radius:14px;box-shadow:none}.screen-session .tip,.screen-session .warn,.screen-session .callout{border-inline-start-width:1px;border-color:var(--ink)}
.screen-session .footer{background:var(--bg);border-top:2px solid var(--ink)}.screen-session .footer.ok{background:#d5ebe4;border-color:#287c6c}.screen-session .footer.no{background:#f4d5d4;border-color:#a94448}.screen-session .footer .wrap{max-width:800px;min-height:104px;padding:18px 24px;flex-wrap:nowrap}.screen-session .verdict{align-items:center}.screen-session .verdict .mark{width:44px;height:44px;flex-basis:44px;background:var(--ink);color:var(--bg)}.screen-session .verdict .mark .ui-icon{width:25px;height:25px}.screen-session .footer.ok .verdict .txt,.screen-session .footer.no .verdict .txt{color:var(--ink)}.screen-session .verdict .sub{color:var(--ink-2)}.screen-session .footer .btn{min-width:190px;min-height:56px;padding:14px 28px;border-radius:12px;background:var(--ink);color:var(--bg);box-shadow:none}.screen-session .footer .btn:hover:not(:disabled){transform:translateY(-2px)}.screen-session .footer .btn:active{transform:translateY(1px);box-shadow:none}.screen-session .footer .btn[disabled]{opacity:.3}

.screen-session>.topbar,.screen-session .topbar{background:var(--bg);border-color:var(--line);backdrop-filter:none}.screen-session .result{max-width:760px;margin:auto;padding:72px 0 80px}.result-stamp{width:190px;aspect-ratio:1;margin:0 auto 28px;border:5px solid var(--ink);border-radius:50%;display:grid;place-items:center;font:700 38px/1 Kalam,var(--font-ro);transform:rotate(-7deg);box-shadow:0 0 0 10px color-mix(in srgb,var(--ink) 8%,transparent)}.screen-session .result h2{font:700 clamp(52px,7vw,78px)/.95 Karantina,var(--font-he);letter-spacing:-.02em}.screen-session .result>p{font-size:17px}.screen-session .rstats{margin:36px 0 28px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);gap:0}.screen-session .rstat{border:0;border-inline-start:1px solid var(--line);border-radius:0;background:transparent}.screen-session .rstat:first-child{border-inline-start:0}.screen-session .rstat.xp,.screen-session .rstat.acc{border-color:var(--line)}.screen-session .rstat .v,.screen-session .rstat.xp .v,.screen-session .rstat.acc .v{color:var(--ink)}.result-notes{display:flex;justify-content:center;gap:18px;flex-wrap:wrap}.result-notes p{display:flex;align-items:center;gap:7px;margin:0!important;color:var(--ink)!important;font-weight:800}.result-notes .ui-icon{width:20px;height:20px;color:#287c6c}

:root[data-theme="dark"] body.screen-session{--bg:#171c1b;--bg-soft:#242a28;--card:#202624;--ink:#f7f0dc;--ink-2:#c8c2b4;--ink-3:#9f9b90;--line:#414744;--line-2:#59605c;--ok-bg:#244a42;--bad-bg:#4c292b;--gold:#f1c75b;background:#171c1b;color:#f7f0dc}
@media(prefers-color-scheme:dark){:root:not([data-theme="light"]) body.screen-session{--bg:#171c1b;--bg-soft:#242a28;--card:#202624;--ink:#f7f0dc;--ink-2:#c8c2b4;--ink-3:#9f9b90;--line:#414744;--line-2:#59605c;--ok-bg:#244a42;--bad-bg:#4c292b;--gold:#f1c75b;background:#171c1b;color:#f7f0dc}}

@media(max-width:640px){
  .screen-session .session-top .wrap{height:78px;padding:10px 14px;grid-template-columns:44px minmax(0,1fr) auto;gap:10px}.screen-session .session-top .icon-btn{width:44px;height:44px}.screen-session .session-meta strong{font-size:13px}.screen-session .session-meta span{font-size:11px}.screen-session .combo{position:absolute;top:62px;left:18px;z-index:2}
  .screen-session .stage{padding:42px 0 170px}.screen-session .stage .wrap{padding-inline:20px}.screen-session .prompt{font-size:28px;margin-bottom:24px}.screen-session .prompt small{font-size:12px;margin-bottom:10px}.screen-session .wordcard{padding:38px 20px}.screen-session .wordcard > .ro{font-size:52px}.screen-session .wordcard .he-t{font-size:21px}
  .screen-session .opts{grid-template-columns:1fr;gap:10px}.screen-session .opt{min-height:62px;padding:13px 14px;font-size:16px}.screen-session .answer-slot{min-height:84px}.screen-session .typebox{min-height:104px;font-size:21px}
  .screen-session .stage{padding-bottom:220px}.screen-session .footer .wrap{min-height:94px;padding:14px 20px;gap:12px;flex-direction:column;align-items:stretch}.screen-session .footer .btn{width:100%;min-width:0;min-height:52px;padding:12px 20px}.screen-session .verdict{width:100%;min-width:0}.screen-session .verdict:empty{display:none}.screen-session .verdict .mark{width:38px;height:38px;flex-basis:38px}.screen-session .verdict .txt{font-size:14px}.screen-session .verdict .sub{font-size:13px}
  .screen-session .result{padding:54px 0 70px}.result-stamp{width:150px;font-size:31px}.screen-session .result h2{font-size:56px}.screen-session .rstats{grid-template-columns:repeat(3,1fr)}.screen-session .rstat{padding:12px 5px}.screen-session .rstat .v{font-size:1.35rem}.result-notes{flex-direction:column;align-items:center}
}

/* Settings follows the warm workbook palette of the Today screen. */
.screen-settings{--bg:#f7f0dc;--card:#f7f0dc;--ink:#1d2423;--ink-2:#5f625b;--line:#c8c2b4;--settings-accent:#58b2a0;--settings-selected:#f8cb4e;background:var(--bg)}
.screen-settings .topbar{position:relative;background:var(--bg);border-color:var(--line);backdrop-filter:none}
.screen-settings .topbar .wrap{max-width:1200px;height:76px;padding-inline:20px}
.settings-sheet{max-width:960px;padding:48px 28px 80px}
.settings-heading{padding-bottom:32px}
.settings-heading h1{font:700 clamp(56px,7vw,78px)/1 Karantina,var(--font-he);margin:26px 0 0;letter-spacing:-.02em}
.settings-back{display:flex;align-items:center;gap:14px;border:0;background:transparent;padding:10px 0;font-size:14px;font-weight:800;min-height:44px}
.settings-back:hover{text-decoration:underline;text-underline-offset:5px}
.settings-sheet .gcard{display:grid;grid-template-columns:190px minmax(0,1fr);column-gap:36px;align-items:start;border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none;background:transparent;margin:0;padding:28px 0}
.settings-sheet .gcard:first-of-type{border-top:2px solid var(--ink)}
.settings-sheet .gcard h3{grid-column:1;grid-row:1 / span 8;font-size:18px;font-weight:900;margin:6px 0 0}
.settings-sheet .gcard h3::before{display:none}
.settings-sheet .gcard> :not(h3){grid-column:2}
.settings-sheet .gcard p{margin:0 0 14px;line-height:1.7}
.settings-sheet .gcard> :last-child{margin-bottom:0}
.settings-toggle{display:flex;flex-direction:row-reverse;justify-content:space-between;align-items:center;gap:20px;cursor:pointer;min-height:44px}
.settings-toggle input{appearance:none;flex:0 0 46px;width:46px;height:26px;border:1px solid var(--ink-2);border-radius:20px;background:transparent;position:relative;cursor:pointer;margin:0}
.settings-toggle input::after{content:"";position:absolute;width:18px;height:18px;top:3px;left:3px;border-radius:50%;background:var(--ink-2);transition:transform .16s ease-out}
.settings-toggle input:checked{background:var(--settings-accent);border-color:var(--ink)}
.settings-toggle input:checked::after{background:#1d2423;transform:translateX(20px)}
.settings-sheet .pillrow{display:flex;flex-wrap:wrap;gap:8px}
.settings-sheet .pill{min-height:44px;min-width:86px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--ink);padding:8px 18px;font-weight:700;box-shadow:none}
.settings-sheet .pill.on{background:var(--settings-selected);border-color:var(--ink);color:#1d2423}
.settings-sheet .pill:hover{border-color:var(--ink)}
.settings-sheet .btn{justify-self:start;min-height:44px;box-shadow:none;border:1px solid var(--ink);border-radius:8px;background:transparent;color:var(--ink);padding:9px 16px;text-decoration:none}
.settings-sheet .btn:hover{background:var(--ink);color:var(--bg);transform:none}
.settings-sheet .btn.no{border-color:#ad383a;color:#ad383a}
.settings-sheet .btn.no:hover{background:#ad383a;color:#fff}
.settings-sheet a{ text-underline-offset:5px }
:root[data-theme="dark"] .screen-settings{--bg:#171c1b;--card:#171c1b;--ink:#f7f0dc;--ink-2:#c8c2b4;--line:#414744;--settings-selected:#f8cb4e}
:root[data-theme="dark"] .settings-sheet .btn.no{color:#f39293;border-color:#f39293}
@media(prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .screen-settings{--bg:#171c1b;--card:#171c1b;--ink:#f7f0dc;--ink-2:#c8c2b4;--line:#414744;--settings-selected:#f8cb4e}
  :root:not([data-theme="light"]) .settings-sheet .btn.no{color:#f39293;border-color:#f39293}
}
@media(max-width:640px){
  .settings-sheet{padding:28px 20px 54px}.settings-heading{padding-bottom:25px}.settings-heading h1{margin-top:18px}
  .settings-sheet .gcard{grid-template-columns:1fr;gap:0;padding:24px 0}.settings-sheet .gcard h3{grid-column:1;grid-row:auto;margin:0 0 14px}.settings-sheet .gcard> :not(h3){grid-column:1}
  .screen-settings .topbar .wrap{height:68px;gap:10px}.screen-settings .topbar .stat.level{display:none}
}
@media(prefers-reduced-motion:reduce){.settings-toggle input::after{transition:none}}

/* Mobile learning: readable pronunciation and explicit audio actions. */
@media(max-width:640px){
  .screen-session .stage{padding-top:28px}
  .screen-session .prompt{line-height:1.4;letter-spacing:0;overflow-wrap:anywhere}
  .screen-session .prompt p.he{font-size:20px;line-height:1.65;margin-block:16px}
  .screen-session .prompt small{font-size:16px;line-height:1.5;padding:8px 12px;clip-path:none;border-radius:4px}
  .screen-session .speaker,.screen-session .speaker.sm,
  .screen-session .speaker.slow-speaker.labeled,.screen-session .speaker.slow-speaker.labeled.sm{
    display:inline-flex;width:auto;min-width:96px;min-height:52px;height:auto;
    padding:12px 14px;gap:8px;border-radius:12px;margin:0;flex-shrink:0;
  }
  .screen-session .speaker .audio-label{display:inline;font-size:16px;font-weight:800;line-height:1.25}
  .screen-session .speaker.slow-speaker span{font-size:16px;line-height:1.25}
  .screen-session .speakpair{display:inline-flex;flex-wrap:wrap;gap:12px;max-width:100%;margin-block:12px}
  .screen-session .prompt .speaker.sm{margin-inline-start:0}
  .screen-session .wordcard>.ro{font-size:clamp(36px,11vw,52px);line-height:1.2;overflow-wrap:anywhere}
  .screen-session .wordcard .tr{font-size:19px;line-height:1.65}
  .screen-session .pronunciation-note{font-size:16px;line-height:1.6}
  .screen-session .opt{font-size:18px;line-height:1.6;min-width:0}
  .screen-session .opt>span:not(.k){min-width:0;overflow-wrap:anywhere}
  .screen-session .tile,.screen-session .mitem{min-height:48px;font-size:18px;line-height:1.5}
  .screen-session .dkey{min-width:48px;height:48px}
  .screen-session .vrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;padding:16px 8px}
  .screen-session .vrow .speakpair{grid-column:1/-1;grid-row:2;justify-content:flex-start;margin:0}
  .screen-session .vrow .w .ro{font-size:21px;overflow-wrap:anywhere}
  .screen-session .vrow .w .tr,.screen-session .vrow .m{font-size:17px;line-height:1.6;overflow-wrap:anywhere}
  .screen-session .verdict .txt{font-size:18px;line-height:1.5}
  .screen-session .verdict .sub{font-size:16px;line-height:1.6;overflow-wrap:anywhere}
  .screen-session .session-meta strong,.screen-session .session-meta span{font-size:14px}
  .screen-session .footer .wrap{padding-bottom:max(14px,env(safe-area-inset-bottom))}
  .screen-session .footer .btn{min-height:56px;font-size:18px}
}