.landing{display:flex;justify-content:center;align-items:center;height:100vh;position:relative;background:#f7f7f7;overflow:hidden;z-index:0}.content-container{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;height:100vh;width:100%;z-index:5}.flag-bg-strip{position:absolute;top:50%;left:0;transform:translateY(-50%);width:100vw;height:120px;z-index:-1;background-image:url(https://upload.wikimedia.org/wikipedia/en/b/ba/Flag_of_Germany.svg);background-size:contain;background-repeat:repeat-x;background-position:center}.flag-img{position:absolute;top:50%;left:0;transform:translateY(-50%);width:100vw;height:120px;object-fit:fill;z-index:1;display:block;border:5px solid red}.landing-card{background:#fff;padding:48px 40px;border-radius:28px;max-width:400px;width:90%;z-index:10;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:0 16px 40px #0000001a}.title-text h1{margin:0;font-size:2.5rem;font-weight:800;color:#3c3c3c}.start-btn{background:#58cc02;color:#fff;border:none;border-radius:18px;padding:.875rem 2rem;font-size:1rem;font-weight:800;cursor:pointer;margin-top:1.5rem;transition:transform .05s ease,box-shadow .1s ease}.start-btn:hover{box-shadow:0 6px 16px #58cc0266}.start-btn:active{transform:translateY(1px)}*{box-sizing:border-box}body{margin:0;font-family:Nunito,system-ui,-apple-system,sans-serif;background:#f7f7f7;color:#3c3c3c}.app{max-width:600px;margin:0 auto;padding:96px 16px 120px}.flashcard-card{background:#f2f2f2;border:2px solid #d6d6d6;border-radius:20px;padding:32px;min-height:220px;display:flex;flex-direction:column;justify-content:center;margin:64px auto 24px}.flashcard-card h3{margin:0 0 12px;font-size:18px;font-weight:700}.loading-state{border:2px solid #d6d6d6;border-radius:20px;display:flex;justify-content:center;align-items:center;height:220px;font-size:1.2rem;color:#666;font-style:italic;animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:.5}50%{opacity:1}to{opacity:.5}}.answer-input{width:100%;padding:14px 18px;font-size:18px;border-radius:16px;border:2px solid #e5e5e5;outline:none;margin-bottom:16px;transition:border-color .2s ease}.answer-input:focus{border-color:#58cc02}.answer-input:disabled{background:#f0f0f0}button{font-family:inherit}.primary-btn{width:100%;padding:14px;font-size:18px;font-weight:700;border-radius:16px;border:none;cursor:pointer;background:#58cc02;color:#fff;box-shadow:0 4px #46a302}.primary-btn:disabled{background:#cfcfcf;box-shadow:none;cursor:not-allowed}.primary-btn:active:not(:disabled){transform:translateY(2px);box-shadow:0 2px #46a302}.primary-btn:hover:not(:disabled){background:#61e001}.flashcard-nav-wrapper{margin-top:24px;display:flex;justify-content:center}.flashcard-nav{display:inline-flex;align-items:center;gap:12px;background:#fff;padding:10px;border-radius:22px;box-shadow:0 8px 20px #00000014}.flashcard-nav button{padding:10px 16px;border-radius:16px;border:none;background:#e5e5e5;font-weight:700;font-size:14px;cursor:pointer;transition:background .15s ease,transform .05s ease}.flashcard-nav button:hover{background:#dcdcdc}.flashcard-nav button:active{transform:translateY(1px)}.flashcard-nav input{width:72px;text-align:center;padding:10px 12px;border-radius:14px;border:2px solid #e5e5e5;font-weight:700;font-size:14px;outline:none}.flashcard-nav input:focus{border-color:#58cc02}.token{padding:2px 4px;border-radius:6px}.token.highlight{background:#ffd43b}.modal-backdrop{position:fixed;inset:0;background:#00000073;z-index:999}.bottom-sheet{position:fixed;bottom:0;left:0;right:0;width:100%;max-width:100%;z-index:1000;padding:8px 40px 60px;background:#fff;border-top-left-radius:24px;border-top-right-radius:24px;box-shadow:0 -8px 30px #00000040;overflow-y:auto;transition:height .3s ease-out;animation:slideUp .25s ease-out forwards}.sheet-main-layout{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:30px;max-width:1200px;margin:0 auto}.content-left{flex:1;display:flex;flex-direction:column}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.sheet-handle{width:40px;height:4px;background:#0000001a;border-radius:2px;margin:0 auto 16px;flex-shrink:0}.content-left h2{margin:0 0 8px;font-size:24px;font-weight:800}.content-left h3{margin:16px 0 4px;font-size:16px;text-transform:uppercase;letter-spacing:.5px;opacity:.9}.correct-sentence,.user-sentence-line{margin-bottom:4px;word-break:break-word;display:block;line-height:1.4}.content-left ul{margin:0;padding-left:20px}.content-left li{margin-bottom:4px}.active-issue{font-weight:700}.tokens{display:flex;flex-wrap:wrap;line-height:1.6}.token{margin-right:2px}.bottom-sheet.correct{background:#d7ffb8;color:#43a047}.bottom-sheet.warning{background:#fff4d1;color:#9e7f00}.bottom-sheet.blocking{background:#ffdfdf;color:#ea2b2b}.continue-btn{position:relative;flex-shrink:0;width:160px;height:50px;border:none;border-radius:16px;font-weight:800;font-size:16px;text-transform:uppercase;letter-spacing:.8px;cursor:pointer;color:#fff;box-shadow:0 4px #0003;transition:transform .1s,box-shadow .1s}.bottom-sheet.correct .continue-btn{background:#58cc02;box-shadow:0 4px #46a302}.bottom-sheet.warning .continue-btn{background:#ffc800;box-shadow:0 4px #e5b300}.bottom-sheet.blocking .continue-btn{background:#ff4b4b;box-shadow:0 4px #ea2b2b}.bottom-sheet.correct .continue-btn:hover{background:#61e001}.bottom-sheet.warning .continue-btn:hover{background:#fccd23}.bottom-sheet.blocking .continue-btn:hover{background:#fa5f5f}.continue-btn:active{transform:translateY(4px);box-shadow:0 0 0 transparent}