:root{--bg:#fbf7f0;--card:#fff;--ink:#1f2328;--muted:#5b6470;--acc:#7a3e9d;--acc2:#e9ddf3;--ok:#1d7a3a;--okbg:#e3f4e8;--bad:#b42318;--badbg:#fde8e7;--line:#e4dccf;--warm:#f3e7d3}
*{box-sizing:border-box}
html{font-size:18px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Assistant","Rubik","Arial Hebrew",Arial,"Noto Sans Hebrew",sans-serif;line-height:1.65}
main{max-width:720px;margin:0 auto;padding:12px 14px 120px}
h1{font-size:1.6rem;line-height:1.3;margin:.3em 0}
h2{font-size:1.3rem;margin:.2em 0 .6em;color:var(--acc)}
h3{font-size:1.08rem;margin:.8em 0 .3em}
.hero{background:linear-gradient(135deg,#7a3e9d,#b4569e);color:#fff;border-radius:18px;padding:18px 18px 16px;margin:8px 0 14px}
.hero h1{color:#fff}.hero p{margin:.2em 0;opacity:.95}
.src{font-size:.92rem}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px;margin:0 0 14px;box-shadow:0 1px 3px rgba(0,0,0,.04)}
label{display:block;font-weight:700;margin:.6em 0 .25em}
input[type=text],textarea{width:100%;font:inherit;font-size:1rem;padding:12px;border:2px solid #cfc6b8;border-radius:12px;background:#fff;color:var(--ink)}
textarea{min-height:5.5em;resize:vertical}
input:focus,textarea:focus,button:focus-visible,a:focus-visible{outline:3px solid #f0b429;outline-offset:2px}
.btn{display:inline-block;font:inherit;font-weight:700;font-size:1.05rem;border:0;border-radius:14px;padding:13px 20px;background:var(--acc);color:#fff;cursor:pointer;text-decoration:none;min-height:48px}
.btn.sec{background:var(--acc2);color:#4b2363}
.btn:disabled{opacity:.5}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.nav{position:sticky;top:0;z-index:5;background:rgba(251,247,240,.96);backdrop-filter:blur(6px);padding:8px 0;margin:0 -14px 8px;padding-inline:14px;border-bottom:1px solid var(--line)}
.steps{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.steps button{flex:0 0 auto;font:inherit;font-size:.9rem;border:2px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:6px 12px;cursor:pointer;min-height:40px}
.steps button.on{background:var(--acc);border-color:var(--acc);color:#fff}
.steps button.done::after{content:" ✓";color:var(--ok)}
.steps button.on.done::after{color:#fff}
.who{font-size:.88rem;color:var(--muted);margin-top:4px}
.q{margin:0 0 18px}
.q .qt{font-weight:700;margin-bottom:6px}
.qn{display:inline-block;min-width:1.7em;height:1.7em;border-radius:50%;background:var(--acc2);color:#4b2363;text-align:center;font-size:.9rem;line-height:1.7em;margin-left:6px}
.opts{display:grid;gap:8px}
.opt{display:block;width:100%;text-align:right;font:inherit;font-size:1rem;padding:12px 14px;border:2px solid #cfc6b8;border-radius:12px;background:#fff;color:var(--ink);cursor:pointer;min-height:48px}
.opt.right{background:var(--okbg);border-color:var(--ok);color:#0f4d24;font-weight:700}
.opt.wrong{background:var(--badbg);border-color:var(--bad);color:#7a1610}
.opt:disabled{cursor:default}
.fb{margin-top:8px;padding:10px 12px;border-radius:12px;font-size:.95rem}
.fb.ok{background:var(--okbg);color:#0f4d24}.fb.no{background:var(--badbg);color:#7a1610}
.story p{font-size:1.08rem;line-height:1.95;margin:0 0 1em;text-align:justify}
.story .pn{font-size:.8rem;color:var(--muted);font-weight:700;margin-left:6px;vertical-align:super}
.story.big p{font-size:1.25rem}
details.gl{background:var(--warm);border-radius:14px;padding:10px 14px;margin:0 0 14px}
details.gl summary{font-weight:700;cursor:pointer;min-height:36px}
dl{margin:.4em 0 0}dt{font-weight:700;margin-top:.5em}dd{margin:0 0 .2em}
.tips{background:var(--warm);border-radius:12px;padding:8px 14px 8px;margin:6px 0 8px;font-size:.95rem}
.tips ul{margin:.2em 0;padding-inline-start:1.2em}
.wc{font-size:.9rem;color:var(--muted);margin-top:4px}
.wc.good{color:var(--ok);font-weight:700}
.scale{display:flex;gap:6px;flex-wrap:wrap}
.scale button{flex:1 1 0;min-width:56px;font:inherit;font-size:.9rem;padding:10px 4px;border:2px solid #cfc6b8;border-radius:12px;background:#fff;cursor:pointer;min-height:48px;color:var(--ink)}
.scale button.on{background:var(--acc);color:#fff;border-color:var(--acc)}
.foot{display:flex;justify-content:space-between;gap:10px;margin-top:6px}
.saved{font-size:.85rem;color:var(--muted);text-align:center;margin:8px 0}
.note{background:#fff7e0;border:1px solid #f0d58a;border-radius:12px;padding:10px 12px;font-size:.95rem}
.okbox{background:var(--okbg);border:1px solid #9fd3ae;border-radius:12px;padding:12px;font-weight:700;color:#0f4d24}
.err{color:var(--bad);font-weight:700}
.hidden{display:none!important}
.tools{display:flex;gap:8px;align-items:center;justify-content:flex-start;margin-bottom:8px;font-size:.9rem}
.tools button{font:inherit;font-size:.9rem;border:1px solid var(--line);background:#fff;border-radius:10px;padding:6px 10px;min-height:40px;cursor:pointer}
/* teacher */
table{border-collapse:collapse;width:100%;font-size:.92rem}
th,td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:right;vertical-align:top}
th{background:var(--warm)}
.ans{white-space:pre-wrap;background:#faf8f4;border:1px solid var(--line);border-radius:10px;padding:8px 10px;margin:4px 0 10px}
.model{font-size:.9rem;color:#3d4a3d;background:#eef6ee;border-radius:10px;padding:6px 10px;margin:2px 0 10px}
.pill{display:inline-block;border-radius:999px;padding:1px 9px;font-size:.85rem;font-weight:700}
.pill.ok{background:var(--okbg);color:var(--ok)}.pill.no{background:var(--badbg);color:var(--bad)}.pill.na{background:#eee;color:#555}
@media (min-width:900px){main{max-width:880px}}
@media print{.nav,.noprint,.btn{display:none!important}body{background:#fff}.card{box-shadow:none;break-inside:avoid-page;border-color:#bbb}main{max-width:none;padding:0}}
