:root{
  --bg:#eceef2; --ink:#1b2533; --ink2:#4b5666; --line:#d3d8e0; --card:#fbfcfd;
  --accent:#1f4e8c; --accent2:#a8792a; --accent-ink:#fff; --ok:#2f6b4f; --no:#b23a2b;
  --dock-h:120px;
  font-family: system-ui, -apple-system, "Segoe UI", "Arial Hebrew", Arial, "Noto Sans Hebrew", sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);overflow:hidden;-webkit-text-size-adjust:100%}
body{position:fixed;inset:0}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
canvas#world{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab;-webkit-tap-highlight-color:transparent}
canvas#world.dragging{cursor:grabbing}
canvas#world.over{cursor:pointer}

.top{position:fixed;top:0;inset-inline:0;z-index:5;display:flex;align-items:flex-start;justify-content:space-between;gap:10px;
  padding:calc(10px + env(safe-area-inset-top)) 14px 12px;pointer-events:none;
  background:linear-gradient(var(--bg) 60%, rgba(236,238,242,0))}
.brand{min-width:0;flex:1 1 auto}
.brand h1{margin:0;font-size:1.18rem;letter-spacing:-.01em;font-weight:780}
.brand p{margin:2px 0 0;font-size:.78rem;color:var(--ink2)}
.brand .credit{margin:2px 0 0;font-size:12px;font-weight:600;opacity:.75;letter-spacing:.02em}
.chips{display:flex;gap:6px;pointer-events:auto;flex:0 0 auto}
.chip{border:1px solid var(--line);background:var(--card);border-radius:999px;padding:7px 11px;font-size:.82rem;min-height:38px;white-space:nowrap}
.chip b{font-variant-numeric:tabular-nums;margin-inline-start:2px}
.chip.done{border-color:var(--ok);color:var(--ok)}

.hint{position:fixed;z-index:4;top:calc(84px + env(safe-area-inset-top));inset-inline:0;margin:0 auto;width:max-content;max-width:calc(100% - 28px);
  font-size:.78rem;color:var(--ink2);background:rgba(251,252,253,.88);border:1px solid var(--line);border-radius:999px;padding:5px 12px;text-align:center;transition:opacity .4s}
.hint.gone{opacity:0;pointer-events:none}

.zoom{position:fixed;z-index:4;inset-inline-end:12px;bottom:calc(var(--dock-h) + 14px);display:flex;flex-direction:column;gap:6px}
.zoom button{width:44px;height:44px;border-radius:12px;border:1px solid var(--line);background:var(--card);font-size:1.25rem;line-height:1}

.dock,.tourbar{position:fixed;z-index:6;bottom:0;inset-inline:0;background:var(--card);border-top:1px solid var(--line);
  padding:10px 10px calc(10px + env(safe-area-inset-bottom));box-shadow:0 -6px 24px rgba(27,37,51,.07)}
.actions{display:flex;gap:6px}
.actions.sub{margin-top:6px}
.act{flex:1;border:1px solid var(--line);background:#fff;border-radius:12px;min-height:46px;padding:8px 6px;font-size:.92rem;font-weight:650}
.act.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.act.primary2{background:var(--accent2);border-color:var(--accent2);color:#fff}
.act.ghost{background:transparent;font-weight:550;color:var(--ink2);min-height:40px;font-size:.86rem}
.act:disabled{opacity:.45;cursor:default}

.sheet{position:fixed;z-index:7;inset-inline:10px;bottom:calc(var(--dock-h) + 10px);max-width:540px;margin-inline:auto;
  background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px 16px 16px;box-shadow:0 12px 40px rgba(27,37,51,.2);
  max-height:calc(100% - var(--dock-h) - 96px);overflow:auto;overscroll-behavior:contain}
.sheet .x,.quiz-head .x{position:absolute;top:6px;inset-inline-end:6px;width:44px;height:44px;border:0;background:transparent;font-size:1.6rem;line-height:1;color:var(--ink2);border-radius:10px}
.kicker{margin:0;font-size:.75rem;letter-spacing:.02em;color:var(--accent);font-weight:700}
.sheet h2{margin:3px 0 0;font-size:1.14rem;padding-inline-end:36px}
#sheet-body p,#panel-body p{margin:9px 0 0;font-size:.95rem;line-height:1.58}
#sheet-body ul,#panel-body ul,#panel-body ol{margin:8px 0 0;padding-inline-start:20px;font-size:.93rem;line-height:1.55}
#sheet-body li,#panel-body li{margin:3px 0}
.note{font-size:.8rem;color:var(--ink2)}
.tagline{display:inline-block;margin-top:10px;font-size:.8rem;font-weight:650;color:var(--ok);border:1px solid var(--ok);border-radius:999px;padding:3px 10px}
.sw{display:inline-block;width:14px;height:14px;border-radius:4px;vertical-align:-2px;margin-inline-end:6px;border:1px solid rgba(0,0,0,.15)}

.tourbar h2{margin:4px 0 0;font-size:1.08rem}
.tourbar p{margin:6px 0 0;font-size:.93rem;line-height:1.52;max-height:32vh;overflow:auto}
.tour-head{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--accent);font-weight:700}
.link{border:0;background:none;color:var(--ink2);text-decoration:underline;text-underline-offset:2px;min-height:36px;padding:0 4px;font-size:.84rem}
.tour-nav{display:flex;gap:8px;margin-top:10px}

.modal{position:fixed;inset:0;z-index:20;background:rgba(27,37,51,.45);display:flex;align-items:center;justify-content:center;padding:12px}
.modal[hidden],.sheet[hidden],.tourbar[hidden],.dock[hidden]{display:none}
.panel{position:relative;background:var(--card);border-radius:18px;width:100%;max-width:580px;max-height:100%;overflow:auto;padding:16px 16px 18px;box-shadow:0 20px 60px rgba(0,0,0,.25);overscroll-behavior:contain}
.quiz-head h2{margin:0;font-size:1.1rem;padding-inline-end:40px}
.gbar{height:8px;background:#e1e5ec;border-radius:99px;margin:10px 0 0;overflow:hidden}
.gbar i{display:block;height:100%;width:0;background:var(--accent2);border-radius:99px;transition:width .35s}
.qrow{display:flex;justify-content:space-between;align-items:center;margin:12px 0 0;font-size:.8rem;font-weight:700}
.qrow .qnum{color:var(--accent)} .qrow .pts{color:var(--accent2);font-variant-numeric:tabular-nums}
.qtype{display:inline-block;font-size:.72rem;font-weight:700;border-radius:999px;padding:2px 8px;background:#e8eef7;color:var(--accent);margin-top:8px}
.qtype.tf{background:#f6eedd;color:#7a5617}
.q{font-size:1.05rem;font-weight:650;margin:6px 0 10px;line-height:1.42}
.opt{display:block;width:100%;text-align:start;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:12px 14px;margin:8px 0;min-height:48px;font-size:.95rem;line-height:1.35}
.opt.sel{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink) inset;background:#f2f4f8}
.opt.right{border-color:var(--ok);background:#eef6f0;box-shadow:0 0 0 1px var(--ok) inset}
.opt.wrong{border-color:var(--no);background:#fbefed}
.opt:disabled{cursor:default;color:var(--ink)}
.tfrow{display:flex;gap:8px}.tfrow .opt{text-align:center;font-weight:650}
.confirm{margin-top:6px;width:100%}
.fb{margin:10px 0 0;padding:10px 12px;border-radius:12px;font-size:.93rem;line-height:1.52;background:#f1f3f7}
.fb strong{display:block;margin-bottom:2px}
.fb.ok strong{color:var(--ok)} .fb.no strong{color:var(--no)}
.fb .src{display:block;margin-top:4px;font-size:.78rem;color:var(--ink2)}
.score{font-size:2.6rem;font-weight:800;margin:14px 0 0;font-variant-numeric:tabular-nums;color:var(--accent)}
.endmsg{font-size:1.05rem;font-weight:650;margin:4px 0 0}
.review{list-style:none;padding:0;margin:12px 0 0}
.review li{display:flex;gap:8px;font-size:.88rem;line-height:1.4;padding:6px 0;border-top:1px dashed var(--line)}
.review .m{flex:0 0 auto;font-weight:800}
.review .m.ok{color:var(--ok)} .review .m.no{color:var(--no)}

.legend{list-style:none;padding:0;margin:10px 0 0}
.legend li{display:flex;align-items:center;gap:8px;padding:7px 4px;border-top:1px solid var(--line);font-size:.95rem}
.legend li:first-child{border-top:0}
.legend .nm{flex:1}
.legend .n{font-weight:800;font-variant-numeric:tabular-nums}
.legend .lt{font-size:.75rem;color:var(--ink2);border:1px solid var(--line);border-radius:6px;padding:1px 5px;min-width:2.2em;text-align:center}
.legend button{all:unset;display:flex;align-items:center;gap:8px;flex:1;cursor:pointer;min-height:30px}
.stack{display:flex;height:18px;border-radius:6px;overflow:hidden;margin:10px 0 2px;direction:ltr}
.stack i{display:block;height:100%}
.plist{list-style:none;padding:0;margin:8px 0 0}
.plist li{margin:0}
.plist button{display:flex;width:100%;align-items:center;gap:10px;text-align:start;border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;margin:6px 0;min-height:48px;font-size:.95rem}
.plist button .k{flex:0 0 auto;width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.85rem}
.plist button.seen .k{background:var(--ok)}
.sec{margin-top:14px;border-top:1px solid var(--line);padding-top:10px}
.sec h3{margin:0;font-size:1rem}
#panel-body a{color:var(--accent);text-underline-offset:2px}

.toast{position:fixed;z-index:30;top:calc(74px + env(safe-area-inset-top));inset-inline:0;margin:0 auto;width:max-content;max-width:calc(100% - 24px);
  background:var(--ink);color:#fff;border-radius:12px;padding:10px 14px;font-size:.9rem;opacity:0;transform:translateY(-6px);transition:opacity .25s,transform .25s;pointer-events:none;text-align:center}
.toast.show{opacity:1;transform:none}

@media (min-width:760px){
  .dock,.tourbar{inset-inline:auto;left:50%;transform:translateX(-50%);bottom:14px;width:min(740px,calc(100% - 28px));border:1px solid var(--line);border-radius:18px;padding:10px}
  .brand h1{font-size:1.4rem}
  .sheet{bottom:calc(var(--dock-h) + 26px);inset-inline-start:auto;inset-inline-end:20px;width:420px;margin:0}
  .zoom{bottom:calc(var(--dock-h) + 28px)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

/* קריינות */
.say{display:inline-flex;align-items:center;gap:6px;margin-top:9px;min-height:40px;padding:6px 14px;border-radius:999px;
  border:1px solid var(--accent);background:#fff;color:var(--accent);font-size:.88rem;font-weight:650}
.say .ic{font-size:1rem;line-height:1}
.say.on{background:var(--accent);color:var(--accent-ink)}
.say[hidden]{display:none}
.tour-audio{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px}
.tour-audio .say{margin-top:4px}

/* חברי הכנסת */
.ph{display:inline-block;flex:0 0 auto;border-radius:50%;background-color:#d9dde3;background-size:1000% 1200%;background-repeat:no-repeat;box-shadow:0 0 0 2px #fff,0 1px 4px rgba(0,0,0,.18)}
.mkcard{display:flex;gap:14px;align-items:center;margin-top:8px}
.mkcard p{margin:4px 0}
.mkbtns{display:flex;gap:8px;margin:12px 0 4px}
.mini-h{margin:12px 0 4px;font-weight:650;font-size:.9rem}
.mkrow{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:6px}
.mkrow button{display:flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:3px 10px 3px 4px;font-size:.84rem;min-height:44px}
.srch{display:block;position:sticky;top:-16px;z-index:2;background:var(--card);padding:6px 0 4px}
.srch input{width:100%;box-sizing:border-box;font:inherit;font-size:16px;padding:11px 14px;border:1px solid var(--line);border-radius:12px;background:#fff}
.srch input:focus{outline:3px solid var(--accent);outline-offset:1px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mkgrp h3{display:flex;align-items:center;gap:4px;font-size:1rem;margin:14px 0 6px}
.mkgrp h3 small{color:var(--ink2);font-weight:600}
.mkgrp[hidden],.mkgrid li[hidden]{display:none}
.mkgrid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(98px,1fr));gap:8px}
.mkgrid button{display:flex;flex-direction:column;align-items:center;gap:4px;width:100%;height:100%;border:1px solid var(--line);background:#fff;border-radius:12px;padding:8px 4px;text-align:center;min-height:44px}
.mkgrid .nm{font-size:.82rem;font-weight:650;line-height:1.2}
.mkgrid .pt{font-size:.7rem;color:var(--ink2)}

.exl{display:block;margin:8px 0;font-weight:600}.exl input{display:block;width:100%;box-sizing:border-box;margin-top:4px;padding:10px;border:1px solid #c9d2e3;border-radius:10px;font:inherit}
.exq{margin:14px 0}.exq textarea{width:100%;box-sizing:border-box;padding:10px;border:1px solid #c9d2e3;border-radius:10px;font:inherit;resize:vertical}
#ex-send{width:100%;margin-top:6px}
