@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');
@font-face{font-family:'Mekorot Vilna';src:url('./fonts/mekorot-vilna/Mekorot-Vilna.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
:root{--hebrew:'Mekorot Vilna','Times New Roman',serif}
:lang(he){font-family:var(--hebrew);font-synthesis:none}
:root{--bg:#f7f5ee;--ink:#20253b;--muted:#757885;--line:#dfdfd5;--mint:#8fe0cc;--night:#101529;--gold:#f2c879;--purple:#ac9df6;--font:'DM Sans','Segoe UI',sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:14px}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}button{border:0}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #655dc5;outline-offset:4px}svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}[hidden]{display:none!important}.app-shell{max-width:1460px;margin:0 auto;padding:0 50px}.topbar{height:106px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink);font-size:23px;font-weight:700;letter-spacing:-1.1px}.brand-light{font-weight:400}.brand small{display:block;font-size:8px;font-weight:600;letter-spacing:2px;margin-top:5px}.brand-mark{width:47px;height:47px;display:grid;place-items:center;background:var(--night);color:var(--mint);border-radius:13px;font:36px var(--hebrew)}.topbar nav{display:flex;gap:25px;height:100%;align-items:center}.nav-tab{height:100%;padding:3px 0 0;background:none;color:var(--muted);font-size:13px;border-bottom:2px solid transparent;display:flex;align-items:center;gap:8px}.nav-tab.active{color:var(--ink);border-color:var(--ink);font-weight:600}.tiny-dot{width:5px;height:5px;background:#ad9be7;border-radius:50%}.version-label{font-size:9px;font-weight:600;letter-spacing:1.8px;display:flex;align-items:center;gap:12px}.version-label span{padding:8px 9px;border:1px solid var(--line);border-radius:50%;font-size:11px}.page-intro{display:flex;justify-content:space-between;align-items:center;padding:33px 0 29px;gap:18px}.eyebrow{font-size:9px;letter-spacing:2px;font-weight:700;color:#7c7a78}h1{font-size:43px;font-weight:500;letter-spacing:-2px;margin:8px 0 0;line-height:1.12}h1 em{font-family:Georgia,serif;font-weight:400;color:#716bb7}h2{margin:0}.page-intro p{line-height:1.75;color:var(--muted);font-size:13px;margin:0}.game-layout{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:30px}.flight-column{min-width:0}.scorebar{display:grid;grid-template-columns:1fr 1fr 1.2fr 1.1fr;padding:0 0 20px;gap:20px}.stat-label{display:block;font-size:8px;font-weight:700;letter-spacing:1.7px;color:var(--muted);margin-bottom:7px}.scorebar strong{display:block;font-size:24px;font-weight:500;line-height:1.2;letter-spacing:-.6px}.scorebar small{font-size:11px;color:var(--muted);letter-spacing:0;margin-left:6px}.lives-stat{justify-self:end}.lives-stat>div{display:flex;gap:6px;margin-top:6px;height:24px}.lives-stat svg{width:22px;height:22px;fill:#dc887e;stroke:#dc887e}.lives-stat svg.lost{fill:transparent;stroke:#cec8c3}.infinity{font-size:30px;line-height:23px;color:#7563bc}.flightdeck{height:457px;position:relative;isolation:isolate;overflow:hidden;background:var(--night);color:#f7f5ee;border-radius:18px;box-shadow:0 16px 33px -22px #141b42}.flightdeck canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1}.deck-top,.deck-bottom{position:absolute;left:27px;right:27px;display:flex;justify-content:space-between;align-items:center;z-index:3;gap:12px}.deck-top{top:25px}.stage-label{font-size:8px;letter-spacing:2px;color:#b9bdd0}.deck-badge{font-size:10px;background:#ffffff08;border:1px solid #ffffff12;border-radius:30px;padding:7px 10px;color:#c9c6ed;display:flex;align-items:center;gap:7px}.deck-badge>span{width:5px;height:5px;background:var(--purple);border-radius:50%}.flight-prompt{position:absolute;top:76px;left:10px;right:10px;text-align:center;color:#c1c3d5;letter-spacing:.5px;font-size:12px;z-index:3}.deck-bottom{bottom:28px;color:#868da9;font-size:8px;letter-spacing:1.2px}.deck-bottom>span:first-child{display:flex;align-items:center;gap:7px;color:var(--gold);font-size:9px;letter-spacing:.4px}.deck-bottom svg{width:13px;height:13px}.deck-corners{position:absolute;inset:69px 19px 65px;border:1px solid #ffffff07;border-radius:8px;pointer-events:none}.welcome{position:absolute;inset:85px 0 70px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.welcome-glyph{font:84px/1.05 var(--hebrew);color:var(--mint);text-shadow:0 0 50px #8fe0cc30;transform:rotate(-8deg);margin-bottom:15px}.welcome h2{font-size:29px;font-weight:500;line-height:1.18;letter-spacing:-1px}.welcome p{font-size:11px;line-height:1.7;color:#969ebc;margin:14px 0 17px}.welcome-tag{border:1px solid #8fe0cc25;border-radius:25px;color:var(--mint);padding:7px 12px;font-size:9px;display:flex;align-items:center;gap:7px}.welcome-tag svg{width:12px;height:12px}.flying-letter{position:absolute;top:50%;left:50%;font:176px/1.5 var(--hebrew);transform:translate(-50%,-50%) scale(.3);transform-origin:center;color:#fff2c9;text-shadow:0 0 36px #f7da9b35;white-space:nowrap;will-change:transform,opacity;pointer-events:none}.flying-letter.word{font-size:95px;line-height:1.7}.flying-letter.correct{color:var(--mint);text-shadow:0 0 50px #8fe0cc70}.flying-letter.wrong{color:#f2a297}.feedback{position:absolute;inset:auto 16px 86px;text-align:center;font-size:18px;color:var(--mint);z-index:4;pointer-events:none}.feedback small{display:block;font-size:11px;color:#b9bdd0;margin-top:6px}.feedback.wrong{color:#f2a297}.feedback.unclear{color:var(--gold);font-size:14px}.paused-overlay{position:absolute;inset:65px 0;background:#101529d9;display:grid;place-content:center;text-align:center;z-index:5;backdrop-filter:blur(4px)}.paused-overlay h2{font-size:28px;font-weight:500}.paused-overlay p{color:#a6adcb;font-size:12px}.approach-track{position:absolute;bottom:0;left:0;width:100%;height:3px;background:#ffffff08}.approach-track>span{display:block;width:0;height:100%;background:var(--mint)}.controls{display:flex;align-items:center;gap:18px;padding-top:22px}.primary-button{background:var(--mint);color:var(--night);padding:16px 21px;font-size:13px;font-weight:700;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:background .15s,transform .15s}.primary-button:hover{background:#a9e9d9;transform:translateY(-1px)}.controls .primary-button{min-width:212px;justify-content:space-between}.primary-button svg{width:17px;height:17px}.quiet-button{background:none;color:var(--muted);display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:12px;padding:11px 5px}.quiet-button:hover{color:var(--ink)}.listening-strip{display:flex;align-items:center;gap:9px;min-height:47px}.listening-dot{height:6px;width:6px;background:#c8cbc8;border-radius:50%;flex-shrink:0}.listening-dot.on{background:#58bda0;box-shadow:0 0 0 4px #58bda014}.listening-strip p{font-size:11px;color:var(--muted);line-height:1.6;margin:0}.input-tag{margin-left:auto;white-space:nowrap;font-size:7px;font-weight:700;letter-spacing:1.5px;color:#a19d97}.how-it-works{border-top:1px solid var(--line);font-size:11px;color:var(--muted);line-height:1.8;margin-top:10px;padding:13px 0}.how-it-works summary{cursor:pointer;display:flex;justify-content:space-between;font-size:11px}.how-it-works p{max-width:650px}.how-it-works summary span{font-size:18px;line-height:1}.setup{border-left:1px solid var(--line);padding-left:27px}.setup-heading{position:relative;padding:0 0 18px}.setup-heading h2{font-size:20px;font-weight:500;letter-spacing:-.6px;margin-top:6px}.setup-heading>svg{position:absolute;right:0;top:10px;color:#b3a570;transform:rotate(12deg);width:21px;height:21px}fieldset{margin:0 0 21px;padding:0;border:0;min-width:0}legend{font-size:8px;color:#aba59a;letter-spacing:1.2px;width:100%;margin-bottom:12px;display:flex;align-items:center;gap:9px}legend span{font-size:11px;font-weight:600;color:var(--ink);letter-spacing:0}.stage-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}.stage-grid button{background:#eeeae1;border:1px solid transparent;border-radius:8px;display:flex;align-items:center;gap:10px;text-align:left;font-size:10px;padding:6px 12px;height:42px;color:#797785}.stage-grid button span{font:25px var(--hebrew);width:29px;flex-shrink:0}.stage-grid button.selected{background:#e8e4f4;border-color:#cfc6e9;color:#625298}.set-actions{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:9px;color:var(--muted)}.set-actions span{margin-right:auto}.set-actions button{padding:0;background:none;font-size:9px;color:#7567a4;text-decoration:underline;text-underline-offset:3px}.letter-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}.letter-grid button{height:34px;min-width:0;background:#eeece5;border:1px solid transparent;border-radius:6px;color:#8b8990;font:28px var(--hebrew);line-height:1.15;position:relative}.letter-grid button.selected{color:var(--ink);background:#e0ece4;border-color:#b7d9c9}.letter-grid button:hover{border-color:#a99fbe}.letter-grid button.word-choice{font-size:18px;grid-column:span 3}.letter-grid button.trained::after{content:'';position:absolute;right:2px;top:2px;width:3px;height:3px;background:#7665af;border-radius:50%}.mode-switch{display:flex;background:#eae7de;padding:3px;border-radius:7px;margin-bottom:17px}.mode-switch button{flex:1;background:none;border-radius:5px;padding:8px 5px;font-size:9px;color:var(--muted)}.mode-switch button.selected{background:#fffdf8;color:var(--ink);box-shadow:0 1px 3px #21202f10}.slider-label{display:flex;align-items:center;justify-content:space-between;font-size:10px}.slider-label output{font-size:9px;color:var(--muted)}input[type=range]{accent-color:#8173b9;width:100%;height:16px;margin:12px 0 2px}.range-endpoints{display:flex;justify-content:space-between;font-size:8px;color:#aaa397}.select-pair{display:grid;gap:12px}.setup label{font-size:10px;color:#757381;display:block}select{display:block;background:#fffdf7;border:1px solid var(--line);color:var(--ink);border-radius:6px;padding:9px;width:100%;margin:6px 0 12px;font-size:11px}.setup-toggles{display:flex;flex-direction:column;gap:11px;margin:7px 0 20px}.setup-toggles label{display:flex;align-items:center;gap:7px;font-size:10px}input[type=checkbox]{accent-color:#8173b9;margin:0;width:13px;height:13px}.studio-link{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);background:none;padding:13px 0;color:#7460a1;font-size:11px;width:100%}.studio-link svg{width:15px}.teacher-controls{display:flex;align-items:center;gap:10px;margin:5px 0 15px}.teacher-controls button{border:1px solid var(--line);border-radius:6px;padding:9px 12px;font-size:11px;background:#fffdf7}.teacher-controls span{font-size:10px;color:var(--muted)}kbd{font:inherit;color:#9686b0;margin-left:5px}footer{display:flex;justify-content:space-between;gap:15px;font-size:9px;color:#9c9993;padding:25px 0;border-top:1px solid var(--line);margin-top:26px}footer>span:last-child{font-size:7px;letter-spacing:2px}.footer-star{margin:0 9px;color:#aea28f}.studio-intro{display:grid;grid-template-columns:1fr 280px;gap:50px;padding:25px 0 30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.studio-intro h2{font-size:23px;letter-spacing:-.5px;font-weight:500}.studio-intro p{font-size:13px;line-height:1.7;color:var(--muted);max-width:630px;margin:10px 0}.studio-intro .studio-note{font-size:10px;max-width:580px}.studio-test{border-left:1px solid var(--line);padding-left:26px}.studio-test .primary-button{margin-top:12px;width:100%}.studio-test p{font-size:11px}.studio-toolbar{display:flex;justify-content:space-between;padding:25px 0 18px;font-size:11px;color:var(--muted)}.local-tag{font-size:8px;letter-spacing:1px;display:flex;align-items:center;gap:6px}.local-tag span{width:5px;height:5px;border-radius:50%;background:#6dae92}.sample-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.sample-card{background:#fffdf7;border:1px solid var(--line);border-radius:12px;padding:18px 18px 14px;position:relative}.sample-glyph{font:68px/1.6 var(--hebrew);text-align:center;height:110px;color:#39354c}.sample-card.words .sample-glyph{font-size:43px}.sample-info{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px}.sample-info span{color:var(--muted);font-size:9px}.sample-guide{font-size:10px;color:var(--muted);margin-top:6px;min-height:13px}.sample-actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:15px}.sample-actions button{padding:8px 10px;background:#e7e2f3;border-radius:6px;color:#6c5a9b;font-size:10px}.sample-actions button:hover{background:#dcd3ee}.sample-actions .delete-sample{margin-left:auto;background:none;color:#a18e8e;padding:7px;font-size:9px}.sample-actions svg{width:12px;height:12px;vertical-align:middle}.sample-card.recording{border-color:#bc756a;background:#fff3ee}.studio-status{font-size:12px;color:#7564a3;text-align:center;padding:15px;min-height:47px}dialog{border:1px solid #eee8df;border-radius:20px;padding:35px;max-width:460px;width:calc(100% - 32px);text-align:center;background:var(--bg);color:var(--ink)}dialog::backdrop{background:#101529b8;backdrop-filter:blur(5px)}.result-star{font-size:45px;color:#be9952;margin-bottom:15px}dialog h2{font-size:29px;font-weight:500;letter-spacing:-.8px;margin-top:10px}.result-score{font-size:70px;letter-spacing:-4px;margin:13px 0;color:#6d5da1}dialog p{font-size:12px;color:var(--muted);line-height:1.8}.result-actions{display:flex;flex-direction:column;gap:5px;margin-top:23px}.missed-items{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.missed-items span{font:30px var(--hebrew);border:1px solid #ded4e7;border-radius:6px;padding:2px 9px}.flightdeck.burst::after{content:'✦';position:absolute;top:44%;left:65%;font-size:45px;color:var(--gold);animation:burst .65s ease-out forwards;pointer-events:none}@keyframes burst{from{opacity:1;transform:scale(.4) rotate(0)}to{opacity:0;transform:translate(40px,-50px) scale(1.2) rotate(45deg)}}
@media(min-width:1250px){.flightdeck{height:495px}.game-layout{gap:40px;grid-template-columns:minmax(0,1fr) 325px}.setup{padding-left:32px}.welcome h2{font-size:33px}.welcome-glyph{font-size:94px}}
@media(max-width:1000px){.app-shell{padding:0 27px}.game-layout{gap:22px;grid-template-columns:minmax(0,1fr) 270px}.setup{padding-left:20px}.flightdeck{height:430px}.version-label{display:none}.sample-grid{grid-template-columns:repeat(3,1fr)}h1{font-size:37px}.scorebar{gap:10px}.deck-top,.deck-bottom{left:19px;right:19px}}
@media(max-width:760px){.app-shell{padding:0 20px}.topbar{height:88px}.topbar nav{gap:16px}.nav-tab{font-size:10px}.brand{font-size:20px}.brand-mark{width:38px;height:38px;font-size:29px}.brand small{font-size:6px;letter-spacing:1.4px}.page-intro{padding:26px 0 22px}.page-intro p{font-size:11px}.eyebrow{font-size:7px;letter-spacing:1.7px}h1{font-size:35px}.game-layout{grid-template-columns:1fr;gap:27px}.flightdeck{height:445px}.setup{border-left:0;border-top:1px solid var(--line);padding:24px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:16px 22px}.setup-heading{grid-column:1/-1;padding-bottom:0}.setup-heading h2{font-size:22px}.setup fieldset{margin:0}.setup .set-picker{grid-column:1/-1}.stage-grid{grid-template-columns:repeat(4,1fr)}.setup .stage-picker{grid-column:1/-1}.stage-grid button{padding:6px 9px;gap:6px}.letter-grid{grid-template-columns:repeat(10,1fr)}.letter-grid button{height:40px}.select-pair{gap:0}.setup-toggles{margin:0;justify-content:center}.studio-link{grid-column:1/-1}.scorebar{padding-bottom:19px}.deck-bottom{font-size:7px}.studio-intro{grid-template-columns:1fr;gap:15px;padding-top:15px}.studio-test{border-left:0;padding:15px 0 0;border-top:1px solid var(--line)}.studio-test .primary-button{width:auto}.sample-grid{grid-template-columns:repeat(2,1fr)}.sample-card{padding:12px}.studio-toolbar{font-size:10px}.local-tag{font-size:6px}.page-intro .quiet-button{font-size:10px}.studio-intro h2{font-size:20px}footer{font-size:8px}footer>span:last-child{display:none}}
@media(max-width:430px){.app-shell{padding:0 15px}.topbar{gap:12px}.topbar nav{gap:12px}.brand{font-size:18px;gap:7px}.brand-mark{width:33px;height:33px;font-size:27px}.brand small{font-size:5px;letter-spacing:1px}.nav-tab{font-size:9px}.page-intro p{display:none}.flightdeck{height:402px}.scorebar strong{font-size:21px}.stat-label{font-size:7px;letter-spacing:1.2px}.scorebar small{font-size:8px;margin-left:3px}.lives-stat svg{width:18px;height:18px}.lives-stat>div{gap:3px}.deck-top{top:20px}.deck-top,.deck-bottom{left:17px;right:17px}.stage-label{font-size:7px}.deck-bottom>span:last-child{max-width:135px;text-align:right;line-height:1.7}.welcome h2{font-size:26px}.welcome-glyph{font-size:76px;margin-bottom:12px}.welcome-tag{padding:6px 10px}.controls{gap:17px}.controls .primary-button{min-width:197px;padding:15px 17px}.controls .quiet-button{font-size:10px;padding:9px 0}.input-tag{display:none}.listening-strip{min-height:52px}.setup{gap:18px 16px}.stage-grid button{font-size:9px;padding:6px}.stage-grid button span{font-size:21px;width:23px}.letter-grid{grid-template-columns:repeat(8,1fr)}.teacher-controls{flex-wrap:wrap}.studio-view .page-intro{flex-wrap:wrap}.sample-info{font-size:10px}.sample-info span{font-size:8px}.sample-actions{gap:5px}.sample-actions button{font-size:9px;padding:8px}.sample-actions .delete-sample{padding:6px 0;font-size:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

#incoming-letters{position:absolute;inset:0;pointer-events:none;z-index:1}.queued-letter{position:absolute;font:150px "Mekorot Vilna",serif;white-space:nowrap;pointer-events:none}.flying-letter.nearest{outline:2px solid #fff5bc;outline-offset:10px;border-radius:12px}.heard-response{font-size:13px;min-height:20px;color:#66529d}.stage-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.letter-grid{max-height:360px;overflow:auto}.setup input[type=number]{width:100%;padding:10px;border:1px solid #ddd7cc;border-radius:10px;background:white}

.account-dialog input:not([type=checkbox]){width:100%;padding:11px;border:1px solid #ddd7cc;border-radius:10px;background:#fff;font:inherit;margin:6px 0 12px}.account-modes{display:flex;gap:12px}.account-dialog form{margin:14px 0}.account-dialog ul{padding-left:20px;font-size:14px;line-height:1.7}#account-button{font-size:12px;padding:7px 10px}.masthead nav{flex-wrap:wrap}

#results{position:fixed;max-height:calc(100dvh - 24px);overflow:auto}.results-exit{position:absolute;top:10px;right:10px;width:44px;height:44px;background:transparent;color:var(--ink);font-size:28px;border-radius:50%;display:grid;place-items:center}.results-exit:hover{background:#e9e4d9}#close-results{min-height:44px;border:1px solid #ded9ce;border-radius:10px;margin-top:5px;color:var(--ink)}

.player-settings{margin-bottom:22px}.player-settings label{font-size:12px}.player-settings small{color:var(--muted)}.player-settings input,.score-name-form input{width:100%;padding:11px;border:1px solid #ddd7cc;border-radius:10px;background:#fff;font:inherit;margin-top:7px}.player-settings p{font-size:11px;color:var(--muted);line-height:1.5}.score-name-form{margin-top:18px;text-align:left}.score-name-form label{font-size:12px}.score-name-form button{min-height:44px;width:100%;margin-top:9px;border:1px solid #ddd7cc;border-radius:10px}.high-score-list{padding-left:24px}.high-score-list li{margin:15px 0;padding:10px 0;border-bottom:1px solid #ddd7cc}.high-score-list strong{float:right}.high-score-list small{display:block;color:var(--muted);font-size:11px;margin-top:7px}.topbar nav{gap:16px}
@media(max-width:760px){.topbar{height:auto;min-height:88px;flex-direction:column;align-items:flex-start;gap:8px;padding:16px 0 8px}.topbar nav{height:auto;max-width:100%;flex-wrap:wrap;gap:4px 14px}.topbar .nav-tab,.topbar nav .quiet-button{min-height:44px;height:auto}.topbar nav .quiet-button{font-size:11px}}
.advanced-game-settings{border-top:1px solid var(--line);padding:16px 0;grid-column:1/-1}.advanced-game-settings summary{font-weight:600;cursor:pointer;padding:10px 0}.advanced-game-settings[open]>:not(summary){margin-top:16px}.simple-choice-grid{display:flex;flex-wrap:wrap;gap:7px}.simple-choice-grid button{background:#ece9e0;border:1px solid transparent;border-radius:8px;padding:9px;color:var(--ink);font-size:12px}.simple-choice-grid button.selected{background:#e7e1f5;border-color:#baa9ee}#simple-blend-settings{grid-column:1/-1}#simple-blend-settings h3{font-size:13px;margin:18px 0 10px}#simple-blend-settings .letter-grid{margin-top:10px}.setup>.stage-picker .stage-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.advanced-game-settings .set-picker{margin-top:20px}.advanced-game-settings>label{display:block}

.simple-choice-grid button{display:flex;align-items:center;gap:7px;min-height:48px}.nekudah-mini{font:32px "Mekorot Vilna",serif;min-width:22px;line-height:1.2}