:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#root{max-width:700px;margin:0 auto;padding:1rem;text-align:center;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background:#f7f7fa;min-height:100vh;box-sizing:border-box}.App h1{color:#ff69b4;font-size:clamp(1.8rem,5vw,2.5rem);margin-bottom:.5rem}.site-description{color:#666;font-size:clamp(.9rem,2.5vw,1.1rem);max-width:600px;margin:0 auto 1.5rem;line-height:1.5;padding:0 1rem}.loader{background:#fffbe7;border-radius:16px;padding:clamp(1rem,3vw,2rem);box-shadow:0 2px 12px #ffe4e1;margin-bottom:2rem}.inputs{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1rem;padding:0 1rem}@media (min-width: 480px){.inputs{flex-direction:row;justify-content:center}}.inputs input{padding:.5rem 1rem;font-size:1.1rem;border-radius:8px;border:1px solid #ddd;width:100%;max-width:200px}.inputs button{background:gold;border:none;border-radius:8px;padding:.5rem 1.2rem;font-size:1.1rem;cursor:pointer;font-weight:700;color:#333;transition:background .2s;width:100%;max-width:200px;margin:0 auto}@media (min-width: 480px){.inputs button{width:auto}}.inputs button:hover{background:#ffec8b}.game-area{background:#fffbe7;border-radius:16px;padding:clamp(1rem,3vw,2rem);box-shadow:0 2px 12px #ffe4e1;min-height:350px;margin:0 .5rem}.score{font-size:1.8rem;color:gold;margin-bottom:1.5rem;font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.1)}.question{margin-bottom:1.5rem;padding:0 1rem}.english-word{font-size:clamp(1.5rem,5vw,2rem);color:#40e0d0;font-weight:700;margin-top:.5rem;display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap}.speak-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;padding:.5rem;border-radius:50%;transition:all .2s;display:flex;align-items:center;justify-content:center}.speak-btn:hover{background:#40e0d01a;transform:scale(1.1)}.speak-btn:active{transform:scale(.95)}.cards{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:2rem;min-height:90px;padding:0 .5rem}@media (min-width: 480px){.cards{gap:1rem}}.hebrew-card{min-width:clamp(70px,20vw,90px);min-height:clamp(50px,15vw,60px);font-size:clamp(1.2rem,4vw,1.5rem);font-weight:700;color:#333;border:none;border-radius:16px;box-shadow:0 2px 8px #e0e0e0;cursor:pointer;transition:transform .1s,box-shadow .1s;outline:none;margin-bottom:.5rem;padding:.5rem}.hebrew-card:active{transform:scale(.96);box-shadow:0 1px 4px #ccc}.hebrew-card.correct{animation:bounce-flash .5s}.hebrew-card.wrong{animation:shake .5s}@keyframes bounce-flash{0%{transform:scale(1);background:inherit}20%{transform:scale(1.15);background:#fff176}40%{transform:scale(.95);background:gold}60%{transform:scale(1.1);background:#fff176}80%{transform:scale(1);background:inherit}to{transform:scale(1);background:inherit}}@keyframes shake{0%{transform:translate(0)}20%{transform:translate(-10px)}40%{transform:translate(10px)}60%{transform:translate(-8px)}80%{transform:translate(8px)}to{transform:translate(0)}}.message{font-size:1.3rem;margin-top:1.2rem;color:#ff69b4;font-weight:700;min-height:2rem}button{font-family:inherit}.scoreboard{display:flex;flex-direction:column;gap:.5rem;background:#fff;padding:1rem;border-radius:12px;margin-bottom:1.5rem;box-shadow:0 2px 8px #0000001a}@media (min-width: 480px){.scoreboard{flex-direction:row;justify-content:space-between;align-items:center;padding:1rem 2rem}}.current-score,.high-score{font-size:clamp(1.2rem,4vw,1.5rem);font-weight:700;display:flex;align-items:center;gap:.5rem}.current-score{color:#40e0d0}.high-score{color:gold}.csv-upload{margin:1rem 0 .5rem;display:flex;flex-direction:column;align-items:center;gap:.5rem}@media (min-width: 480px){.csv-upload{flex-direction:row;justify-content:center}}.csv-label{cursor:pointer}.csv-btn{position:relative;cursor:pointer;background:gold;color:#333;border-radius:8px;padding:.4rem 1.2rem;font-size:clamp(1rem,3vw,1.1rem);font-weight:700;border:none;transition:background .2s;box-shadow:0 2px 4px #00000012;display:inline-block;margin:.2rem;width:min(90%,200px)}@media (min-width: 480px){.csv-btn{width:auto}}.csv-btn:hover{background:#ffec8b}.csv-label .csv-btn:hover:after{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%);padding:8px;background:#333;color:#fff;border-radius:4px;font-size:14px;white-space:nowrap;z-index:1000;margin-bottom:5px}.csv-label .csv-btn:hover:before{content:"";position:absolute;bottom:100%;left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:#333;margin-bottom:-5px;z-index:1000}.csv-btn.cancel{background:#eee;color:#888}.csv-btn.cancel:hover{background:#ddd}.csv-error{color:#d32f2f;font-size:1rem;margin-left:1rem}.csv-mode-modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#0003;display:flex;align-items:center;justify-content:center;z-index:1000}.csv-mode-content{background:#fffbe7;border-radius:12px;padding:2rem 2.5rem;box-shadow:0 2px 12px #ffe4e1;text-align:center;min-width:260px}.csv-mode-content p{font-size:1.2rem;margin-bottom:1.2rem}.level-settings{margin-bottom:1rem;font-size:1.1rem;display:flex;align-items:center;justify-content:center;gap:.5rem}.level-settings input[type=number]{font-size:1.1rem;border-radius:6px;border:1px solid #ccc;padding:.2rem .5rem}.level{font-size:1.2rem;color:#8e44ad;font-weight:700;margin-left:1.5rem}.missed-words{background:#fff8d6;border-radius:10px;padding:1rem;margin:1rem auto;max-width:min(350px,90%);box-shadow:0 2px 8px #ffe4e1;text-align:left}.missed-words ul{margin:.5rem 0 0;padding-left:1.2rem}.missed-words li{font-size:clamp(1rem,3vw,1.1rem);margin-bottom:.2rem;word-break:break-word}.restart-btn{background:#ff69b4;color:#fff;border:none;border-radius:8px;padding:.4rem 1.2rem;font-size:clamp(1rem,3vw,1.1rem);font-weight:700;margin:.5rem 0;cursor:pointer;transition:all .2s;box-shadow:0 2px 4px #0000001a;display:inline-block}@media (min-width: 480px){.restart-btn{margin:0 0 0 1rem}}.restart-btn:hover{background:#ff1493;transform:scale(1.05);box-shadow:0 4px 8px #00000026}.restart-btn:active{background:#ff1493;transform:scale(.98);box-shadow:0 2px 4px #0000001a}.next-level-btn{background:linear-gradient(135deg,#40e0d0,#87cefa);color:#fff;border:none;border-radius:12px;padding:clamp(.6rem,2vw,.8rem) clamp(1.5rem,4vw,2rem);font-size:clamp(1.1rem,3vw,1.3rem);font-weight:700;cursor:pointer;margin-top:1rem;transition:all .3s ease;box-shadow:0 4px 15px #40e0d04d;text-shadow:1px 1px 2px rgba(0,0,0,.1);width:min(90%,300px)}.next-level-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #40e0d066;background:linear-gradient(135deg,#3dd1c1,#7bc5e6)}.next-level-btn:active{transform:translateY(1px);box-shadow:0 2px 10px #40e0d04d}.footer{margin-top:2rem;padding:1rem;color:#ff69b4;font-size:clamp(1rem,3vw,1.1rem);font-weight:700;text-shadow:1px 1px 2px rgba(0,0,0,.1)}.start-btn{background:linear-gradient(135deg,#40e0d0,#87cefa);color:#fff;border:none;border-radius:12px;padding:clamp(.8rem,2vw,1rem) clamp(2rem,4vw,3rem);font-size:clamp(1.4rem,4vw,1.8rem);font-weight:700;cursor:pointer;margin:0 auto 1.5rem;transition:all .3s ease;box-shadow:0 4px 15px #40e0d04d;text-shadow:1px 1px 2px rgba(0,0,0,.1);display:block;width:min(90%,300px)}.start-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #40e0d066;background:linear-gradient(135deg,#3dd1c1,#7bc5e6)}.start-btn:active{transform:translateY(1px);box-shadow:0 2px 10px #40e0d04d}.start-btn:disabled{background:linear-gradient(135deg,#b0e0e6,#d0e0e6);cursor:not-allowed;transform:none;box-shadow:none}.section-title{color:#40e0d0;font-size:clamp(1.1rem,3vw,1.3rem);margin:1.5rem 0 1rem;font-weight:700}ul{list-style:none;padding:0;margin:0}ul li{font-size:1.1rem;margin:.2rem 0;padding:.3rem 0}.hero-image{width:min(200px,90%);height:auto;margin:0 auto 1rem;display:block}
