:root{--font-body:"Aptos", "Segoe UI", sans-serif;--font-heading:"Palatino Linotype", "Book Antiqua", Georgia, serif;--font-mono:"Consolas", "SFMono-Regular", monospace;--page-bg:#f6faf7;--page-bg-soft:#edf4ef;--page-bg-accent:#f4f8fb;--surface:#ffffffd6;--surface-strong:#fff;--surface-soft:#f3f8f5;--surface-muted:#e9f1ec;--border:#708b7e33;--border-strong:#67877761;--text-strong:#27433c;--text:#4d675f;--text-muted:#72887f;--accent:#7ea995;--accent-strong:#5f8a76;--accent-soft:#e8f2eb;--info:#88aebd;--info-strong:#678d9e;--warning:#d0b37a;--warning-strong:#a98443;--danger:#d58d8d;--danger-strong:#b96a6a;--success:#8db89a;--success-strong:#5d8f6b;--shadow-soft:0 20px 45px #6782771f;--shadow-card:0 12px 28px #68827914;--radius-xl:28px;--radius-lg:22px;--radius-md:16px;--radius-sm:12px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font:16px/1.5 var(--font-body);color:var(--text);background:var(--page-bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(circle at top left, #b7d5c46b, transparent 36%), radial-gradient(circle at top right, #c6dbeb70, transparent 32%), linear-gradient(180deg, var(--page-bg) 0%, var(--page-bg-soft) 100%);min-height:100svh;color:var(--text);margin:0}body:before,body:after{content:"";filter:blur(80px);pointer-events:none;z-index:-1;border-radius:999px;position:fixed;inset:auto}body:before{background:#b8dbc838;width:18rem;height:18rem;top:5rem;left:-4rem}body:after{background:#b7d0e133;width:20rem;height:20rem;bottom:2rem;right:-5rem}#root{width:100%;min-height:100svh}button,input,textarea,select{font:inherit}button{color:inherit;cursor:pointer}a{color:inherit}h1,h2,h3{color:var(--text-strong);font-family:var(--font-heading);margin:0;line-height:1.08}p{margin:0}code{background:var(--surface-muted);color:var(--text-strong);font-family:var(--font-mono);border-radius:999px;padding:.15rem .45rem;font-size:.92rem}@media (width<=640px){:root{font-size:15px}}.app-shell{width:min(100%,1180px);margin:0 auto;padding:clamp(1rem,2.2vw,1.6rem)}.page-wrapper{width:100%;padding-top:.5rem}.app-container{width:100%;padding:.25rem 0 2.5rem}.content{flex-direction:column;gap:1.35rem;width:min(100%,1120px);margin:0 auto;display:flex}.home-hero{grid-template-columns:minmax(0,1.45fr) minmax(250px,.85fr);align-items:stretch;gap:1.25rem;display:grid}.hero-copy,.hero-summary,.home-section,.modes-section{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.hero-copy{background:linear-gradient(135deg, #ffffffeb, #f3f9f5eb), var(--surface);text-align:left;padding:clamp(1.5rem,3.6vw,2.7rem)}.hero-kicker,.summary-label{letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted);font-size:.78rem;font-weight:700;display:inline-block}.home-title{max-width:11ch;margin-top:.9rem;font-size:clamp(2.35rem,4.8vw,4rem)}.home-subtitle{max-width:56ch;color:var(--text);margin-top:1rem;font-size:1.03rem;line-height:1.65}.hero-summary{background:#f8fcfae0;gap:1rem;padding:clamp(1.2rem,2.8vw,1.8rem);display:grid}.summary-card{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-strong);text-align:left;flex-direction:column;justify-content:center;gap:.45rem;min-height:8.5rem;padding:1.15rem 1.2rem;display:flex}.summary-card-link{color:inherit;border-radius:var(--radius-lg);text-decoration:none;transition:transform .18s,box-shadow .18s;display:block}.summary-card-link:hover .summary-card{border-color:var(--border-strong);background:#fffffff2;transform:translateY(-2px);box-shadow:0 8px 16px #00000014}.summary-value{font-family:var(--font-heading);color:var(--text-strong);font-size:clamp(2rem,6vw,3rem)}.home-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.25rem;display:grid}.home-section,.modes-section{padding:clamp(1.2rem,2.6vw,1.8rem)}.upload-panel{display:flex}.upload-panel .file-upload-section{width:100%}.sync-panel{flex-direction:column;gap:1rem;display:flex}.section-heading{text-align:left;flex-direction:column;gap:.35rem;display:flex}.section-heading h2{font-size:clamp(1.5rem,3vw,2rem)}.section-heading p{max-width:62ch;color:var(--text-muted);line-height:1.65}.data-buttons{grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;display:grid}.data-button{border:1px solid #0000;border-radius:999px;min-height:3.4rem;padding:.95rem 1.3rem;font-size:.98rem;font-weight:700;transition:transform .18s,box-shadow .18s,background-color .18s,border-color .18s}.data-button:hover{transform:translateY(-2px)}.save-button{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#fff;box-shadow:0 10px 20px #7499872e}.load-button{background:linear-gradient(135deg, var(--info), var(--info-strong));color:#fff;box-shadow:0 10px 20px #6d93a42e}.button-container{grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:1rem;display:grid}.mode-button-link{height:100%;text-decoration:none;display:block}.mode-card{border:1px solid var(--border);border-radius:var(--radius-lg);text-align:left;background:linear-gradient(#fff 0%,#f5faf7 100%);flex-direction:column;gap:.85rem;height:100%;padding:1.35rem;transition:transform .18s,box-shadow .18s,border-color .18s,background-color .18s;display:flex;box-shadow:0 10px 22px #67827714}.mode-card:hover{border-color:var(--border-strong);box-shadow:var(--shadow-soft);background:linear-gradient(#fff 0%,#eef6f1 100%);transform:translateY(-4px)}.mode-card-header{justify-content:space-between;align-items:flex-start;gap:.85rem;display:flex}.button-label{color:var(--text-strong);font-size:1.35rem;font-weight:700}.button-description{color:var(--text);line-height:1.6}.mode-badge{background:var(--accent-soft);color:var(--accent-strong);white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;padding:.35rem .7rem;font-size:.82rem;font-weight:700;display:inline-flex}.mode-badge.neutral{background:var(--surface-muted);color:var(--text)}.progress-indicator{flex-direction:column;gap:.45rem;margin-top:auto;display:flex}.progress-meta{color:var(--text-muted);justify-content:space-between;gap:.5rem;font-size:.86rem;font-weight:600;display:flex}.progress-track{background:var(--surface-muted);border-radius:999px;width:100%;height:.62rem;display:block;overflow:hidden}.progress-fill{border-radius:inherit;background:linear-gradient(90deg,#95bea8 0%,#7ca6ba 100%);height:100%;display:block}.data-status{border-radius:var(--radius-md);color:var(--success-strong);background:#eaf5eceb;border:1px solid #779e8147;align-items:center;padding:.75rem .95rem;font-weight:600;display:inline-flex}@media (width<=860px){.home-hero{grid-template-columns:1fr}.home-title{max-width:15ch}}@media (width<=640px){.app-shell{padding:.8rem}.content{gap:1rem}.data-buttons{grid-template-columns:1fr}.mode-card{padding:1.15rem}.mode-card-header{flex-direction:column}.button-label{font-size:1.2rem}}.file-upload-section{flex-direction:column;gap:1rem;width:100%;display:flex}.upload-title{text-align:left;font-size:clamp(1.5rem,3vw,2rem)}.drop-zone{border:1.5px dashed var(--border-strong);border-radius:var(--radius-lg);background:linear-gradient(#f8fbf9 0%,#eef6f1 100%);padding:clamp(1.6rem,4vw,2.35rem);transition:transform .18s,border-color .18s,box-shadow .18s,background-color .18s}.drop-zone:hover{border-color:var(--accent);box-shadow:0 14px 24px #7499871f}.drop-zone.dragging{border-color:var(--accent-strong);background:linear-gradient(#f4faf6 0%,#e6f1ea 100%);transform:scale(1.01);box-shadow:0 18px 30px #74998729}.drop-zone-content{text-align:center;flex-direction:column;align-items:center;gap:.75rem;display:flex}.drop-icon{background:#ffffffd1;border-radius:999px;place-items:center;width:4rem;height:4rem;font-size:1.8rem;display:grid;box-shadow:0 8px 16px #68827914}.drop-text{color:var(--text-strong);font-size:1.05rem;font-weight:700}.drop-subtext{color:var(--text-muted)}.browse-button{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#fff;border:none;border-radius:999px;min-height:3rem;padding:.8rem 1.25rem;font-weight:700;transition:transform .18s,box-shadow .18s}.browse-button:hover{transform:translateY(-2px);box-shadow:0 12px 22px #74998733}.feedback-message{border-radius:var(--radius-md);padding:.95rem 1rem;font-weight:600}.feedback-message.success{color:var(--success-strong);background:#eaf5eceb;border:1px solid #779e8147}.feedback-message.error{color:var(--danger-strong);background:#fff1f1eb;border:1px solid #d58d8d47}@media (width<=640px){.drop-zone{padding:1.4rem 1rem}.drop-icon{width:3.4rem;height:3.4rem;font-size:1.55rem}}.global-header{z-index:10;border:1px solid var(--border);border-radius:var(--radius-xl);width:100%;box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#f9fcfad1;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;padding:.95rem 1.05rem;display:flex;position:sticky;top:.8rem}.global-branding{flex:1;justify-content:space-between;align-items:center;gap:1.2rem;min-width:0;display:flex}.header-logo{font-family:var(--font-heading);color:var(--text-strong);flex-shrink:0;font-size:1.55rem;font-weight:700;text-decoration:none}.header-nav{flex-wrap:wrap;justify-content:flex-end;gap:.65rem;display:flex}.nav-link{min-height:2.7rem;color:var(--text);background:#ffffffb8;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;padding:.72rem 1rem;font-size:.94rem;font-weight:700;text-decoration:none;transition:transform .18s,border-color .18s,background-color .18s,color .18s;display:inline-flex}.nav-link:hover{color:var(--text-strong);background:#edf5f9e6;border-color:#69899538;transform:translateY(-1px)}.nav-link.active{color:var(--accent-strong);background:#e8f2ebf0;border-color:#6f908047}.header-logout{min-height:2.8rem;color:var(--danger-strong);background:#fff4f4eb;border:1px solid #d58d8d47;border-radius:999px;flex-shrink:0;padding:.8rem 1.1rem;font-weight:700;transition:transform .18s,background-color .18s,border-color .18s}.header-logout:hover{background:#ffeeeefa;border-color:#c2747459;transform:translateY(-1px)}@media (width<=860px){.global-header{top:0}.global-branding{flex-direction:column;align-items:stretch}.header-nav{justify-content:flex-start}}@media (width<=640px){.global-header{padding:.9rem}.header-nav{flex-wrap:nowrap;padding-bottom:.2rem;overflow-x:auto}.nav-link{white-space:nowrap}}.login-container{justify-content:center;align-items:center;min-height:100svh;padding:clamp(1rem,4vw,2rem);display:flex}.login-content{border:1px solid var(--border);border-radius:var(--radius-xl);width:min(100%,460px);box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffe0;padding:clamp(1.6rem,5vw,2.4rem);position:relative;overflow:hidden}.login-content:before{content:"";background:linear-gradient(90deg,#7ea995d1,#88aebdd1);height:.32rem;position:absolute;inset:0 0 auto}.login-content h1{margin-bottom:.85rem;font-size:clamp(2.2rem,7vw,3.3rem)}.login-content p{color:var(--text-muted);margin-bottom:1.5rem;line-height:1.65}.login-form{flex-direction:column;gap:.9rem;display:flex}.login-input{border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-soft);width:100%;color:var(--text-strong);padding:1rem 1.1rem;font-size:1rem;transition:border-color .18s,box-shadow .18s,background-color .18s}.login-input:focus{border-color:var(--accent);background:#fff;outline:none;box-shadow:0 0 0 4px #7ea99526}.login-input::placeholder{color:var(--text-muted)}.login-button{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#fff;border:none;border-radius:999px;width:100%;min-height:3.4rem;padding:.95rem 1.2rem;font-weight:700;transition:transform .18s,box-shadow .18s,filter .18s}.login-button:hover{filter:saturate(1.03);transform:translateY(-2px);box-shadow:0 14px 24px #74998738}.login-error{border-radius:var(--radius-md);color:var(--danger-strong);background:#fff1f1eb;border:1px solid #d58d8d47;margin-top:1rem;padding:.85rem 1rem;font-weight:600}.mode1-container{width:100%;padding:.25rem 0 2rem}.mode1-content{flex-direction:column;gap:1.2rem;width:min(100%,760px);margin:0 auto;display:flex}.mode1-content h1{text-align:left;font-size:clamp(2rem,5vw,3rem)}.mode1-container .question-section,.mode1-container .loading-state{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:clamp(1.3rem,3vw,2rem)}.mode1-container .question{font-family:var(--font-heading);color:var(--text-strong);letter-spacing:.04em;text-align:center;flex-direction:column;align-items:center;gap:.85rem;margin-bottom:1.5rem;font-size:clamp(2.7rem,8vw,4.4rem);display:flex}.mode1-container .question-points{border:1px solid var(--border);background:var(--surface-soft);color:var(--text-muted);font-size:.9rem;font-family:var(--font-body);letter-spacing:normal;border-radius:999px;justify-content:center;align-items:center;padding:.42rem .8rem;font-weight:700;display:inline-flex}.mode1-container .input-section{flex-direction:column;gap:.8rem;display:flex}.mode1-container .answer-input{border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-soft);width:100%;min-height:3.5rem;color:var(--text-strong);text-align:center;padding:1rem 1.1rem;font-size:1.08rem;font-weight:600;transition:border-color .18s,box-shadow .18s,background-color .18s}.mode1-container .answer-input:focus{border-color:var(--accent);background:#fff;outline:none;box-shadow:0 0 0 4px #7ea99526}.mode1-container .answer-input::placeholder{color:var(--text-muted);font-weight:500}.mode1-container .submit-button,.mode1-container .next-button,.mode1-container .give-up-button{border:none;border-radius:999px;min-height:3.2rem;padding:.9rem 1.15rem;font-weight:700;transition:transform .18s,box-shadow .18s,filter .18s}.mode1-container .submit-button,.mode1-container .next-button{width:min(100%,260px);margin:0 auto}.mode1-container .submit-button{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#fff}.mode1-container .submit-button:hover:not(:disabled),.mode1-container .next-button:hover{filter:saturate(1.03);transform:translateY(-2px)}.mode1-container .submit-button:hover:not(:disabled){box-shadow:0 14px 24px #74998738}.mode1-container .submit-button:disabled{color:#27433c8c;cursor:not-allowed;background:#d3ddd7}.mode1-container .give-up-button{width:min(100%,200px);color:var(--danger-strong);background:#fff4f4f5;border:1px solid #d58d8d47;margin:0 auto}.mode1-container .give-up-button:hover{background:#fee;transform:translateY(-1px)}.mode1-container .next-button{background:linear-gradient(135deg, var(--info), var(--info-strong));color:#fff;box-shadow:0 14px 24px #6d93a433}.mode1-container .feedback,.mode1-container .auto-next-message{border-radius:var(--radius-md);text-align:center;margin-top:1rem;padding:.95rem 1rem;font-weight:600}.mode1-container .feedback.correct{color:var(--success-strong);background:#eaf5eceb;border:1px solid #779e8147}.mode1-container .feedback.incorrect{color:var(--danger-strong);background:#fff1f1eb;border:1px solid #d58d8d47}.mode1-container .feedback.error{color:var(--warning-strong);background:#fff8eaf0;border:1px solid #d0b37a4d}.mode1-container .correct-answer{color:var(--text);margin-top:.45rem;font-weight:600}.mode1-container .auto-next-message{color:var(--info-strong);background:#ecf4f7f0;border:1px solid #88aebd4d}.mode1-container .loading-state{text-align:center}.mode1-container .loading-state p{color:var(--text)}.mode1-container .back-button{border:1px solid var(--border);width:fit-content;min-height:3rem;color:var(--text-strong);background:#ffffffb8;border-radius:999px;justify-content:center;align-items:center;padding:.8rem 1.1rem;font-weight:700;text-decoration:none;transition:transform .18s,background-color .18s,border-color .18s;display:inline-flex}.mode1-container .back-button:hover{border-color:var(--border-strong);background:#ffffffeb;transform:translateY(-1px)}@media (width<=640px){.mode1-container .question{font-size:clamp(2.2rem,13vw,3.4rem)}.mode1-container .submit-button,.mode1-container .next-button,.mode1-container .give-up-button,.mode1-container .back-button{width:100%}}.mode2-container{width:100%;padding:.25rem 0 2rem}.mode2-content{flex-direction:column;gap:1rem;width:min(100%,760px);margin:0 auto;display:flex}.mode2-content h1{text-align:left;font-size:clamp(2rem,5vw,3rem)}.mode2-container .toggle-button{border:1px solid var(--border);min-height:2.85rem;color:var(--text);background:#ffffffbd;border-radius:999px;align-self:flex-end;padding:.72rem 1rem;font-weight:700;transition:transform .18s,border-color .18s,background-color .18s}.mode2-container .toggle-button:hover{border-color:var(--border-strong);transform:translateY(-1px)}.mode2-container .toggle-button.active{color:var(--accent-strong);background:#e8f2ebf5;border-color:#6f90804d}.mode2-container .question-section,.mode2-container .loading-state{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:clamp(1.3rem,3vw,2rem)}.mode2-container .question{color:var(--text-strong);font-family:var(--font-heading);text-align:center;flex-direction:column;align-items:center;gap:.85rem;margin-bottom:1.5rem;font-size:clamp(2rem,6vw,3.2rem);display:flex}.mode2-container .question-points{border:1px solid var(--border);background:var(--surface-soft);color:var(--text-muted);font-size:.9rem;font-family:var(--font-body);border-radius:999px;justify-content:center;align-items:center;padding:.42rem .8rem;font-weight:700;display:inline-flex}.mode2-container .input-section{flex-direction:column;gap:.8rem;display:flex}.mode2-container .answer-input{border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-soft);width:100%;min-height:3.5rem;color:var(--text-strong);text-align:center;padding:1rem 1.1rem;font-size:1.08rem;font-weight:600;transition:border-color .18s,box-shadow .18s,background-color .18s}.mode2-container .answer-input:focus{border-color:var(--accent);background:#fff;outline:none;box-shadow:0 0 0 4px #7ea99526}.mode2-container .answer-input::placeholder{color:var(--text-muted);font-weight:500}.mode2-container .submit-button,.mode2-container .next-button,.mode2-container .give-up-button,.mode2-container .tip-button{border-radius:999px;min-height:3.2rem;padding:.9rem 1.15rem;font-weight:700;transition:transform .18s,box-shadow .18s,background-color .18s,border-color .18s}.mode2-container .submit-button,.mode2-container .next-button{color:#fff;border:none;width:min(100%,260px);margin:0 auto}.mode2-container .submit-button{background:linear-gradient(135deg, var(--accent), var(--accent-strong))}.mode2-container .next-button{background:linear-gradient(135deg, var(--info), var(--info-strong));box-shadow:0 14px 24px #6d93a433}.mode2-container .submit-button:hover:not(:disabled),.mode2-container .next-button:hover,.mode2-container .give-up-button:hover,.mode2-container .tip-button:hover{transform:translateY(-2px)}.mode2-container .submit-button:hover:not(:disabled){box-shadow:0 14px 24px #74998738}.mode2-container .submit-button:disabled{color:#27433c8c;cursor:not-allowed;background:#d3ddd7}.mode2-container .button-row{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;display:grid}.mode2-container .give-up-button,.mode2-container .tip-button{border:1px solid #0000}.mode2-container .give-up-button{color:var(--danger-strong);background:#fff4f4f5;border-color:#d58d8d47}.mode2-container .tip-button{color:var(--warning-strong);background:#fff8eaf5;border-color:#d0b37a4d}.mode2-container .feedback,.mode2-container .auto-next-message{border-radius:var(--radius-md);text-align:center;margin-top:1rem;padding:.95rem 1rem;font-weight:600}.mode2-container .feedback.correct{color:var(--success-strong);background:#eaf5eceb;border:1px solid #779e8147}.mode2-container .feedback.incorrect{color:var(--danger-strong);background:#fff1f1eb;border:1px solid #d58d8d47}.mode2-container .feedback.error,.mode2-container .feedback.tip{color:var(--warning-strong);background:#fff8eaf0;border:1px solid #d0b37a4d}.mode2-container .correct-answer{color:var(--text);margin-top:.45rem;font-weight:600}.mode2-container .auto-next-message{color:var(--info-strong);background:#ecf4f7f0;border:1px solid #88aebd4d}.mode2-container .loading-state{text-align:center}.mode2-container .back-button{border:1px solid var(--border);width:fit-content;min-height:3rem;color:var(--text-strong);background:#ffffffb8;border-radius:999px;justify-content:center;align-items:center;padding:.8rem 1.1rem;font-weight:700;text-decoration:none;transition:transform .18s,background-color .18s,border-color .18s;display:inline-flex}.mode2-container .back-button:hover{border-color:var(--border-strong);background:#ffffffeb;transform:translateY(-1px)}@media (width<=640px){.mode2-container .toggle-button,.mode2-container .submit-button,.mode2-container .next-button,.mode2-container .back-button{width:100%}.mode2-container .button-row{grid-template-columns:1fr}}.mode3-container{width:100%;padding:.25rem 0 2rem}.mode3-content{flex-direction:column;gap:1.2rem;width:min(100%,820px);margin:0 auto;display:flex}.mode3-content h1{text-align:left;font-size:clamp(2rem,5vw,3rem)}.mode3-container .question-section,.mode3-container .loading-state{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:clamp(1.3rem,3vw,2rem)}.mode3-container .question{color:var(--text-strong);font-family:var(--font-heading);text-align:center;margin-bottom:1.5rem;font-size:clamp(1.9rem,5vw,3rem);line-height:1.24}.mode3-container .input-section{flex-direction:column;gap:.8rem;display:flex}.mode3-container .answer-input{border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-soft);width:100%;min-height:3.6rem;color:var(--text-strong);text-align:center;padding:1rem 1.1rem;font-size:1.08rem;font-weight:600;transition:border-color .18s,box-shadow .18s,background-color .18s}.mode3-container .answer-input:focus{border-color:var(--accent);background:#fff;outline:none;box-shadow:0 0 0 4px #7ea99526}.mode3-container .answer-input::placeholder{color:var(--text-muted);font-weight:500}.mode3-container .submit-button,.mode3-container .next-button,.mode3-container .give-up-button{border-radius:999px;min-height:3.2rem;padding:.9rem 1.15rem;font-weight:700;transition:transform .18s,box-shadow .18s,background-color .18s}.mode3-container .submit-button,.mode3-container .next-button{color:#fff;border:none;width:min(100%,260px);margin:0 auto}.mode3-container .submit-button{background:linear-gradient(135deg, var(--accent), var(--accent-strong))}.mode3-container .next-button{background:linear-gradient(135deg, var(--info), var(--info-strong));box-shadow:0 14px 24px #6d93a433}.mode3-container .submit-button:hover:not(:disabled),.mode3-container .next-button:hover,.mode3-container .give-up-button:hover{transform:translateY(-2px)}.mode3-container .submit-button:hover:not(:disabled){box-shadow:0 14px 24px #74998738}.mode3-container .submit-button:disabled{color:#27433c8c;cursor:not-allowed;background:#d3ddd7}.mode3-container .give-up-button{width:min(100%,200px);color:var(--danger-strong);background:#fff4f4f5;border:1px solid #d58d8d47;margin:0 auto}.mode3-container .feedback,.mode3-container .auto-next-message{border-radius:var(--radius-md);text-align:center;margin-top:1rem;padding:.95rem 1rem;font-weight:600}.mode3-container .feedback.correct{color:var(--success-strong);background:#eaf5eceb;border:1px solid #779e8147}.mode3-container .feedback.incorrect{color:var(--danger-strong);background:#fff1f1eb;border:1px solid #d58d8d47}.mode3-container .feedback.error{color:var(--warning-strong);background:#fff8eaf0;border:1px solid #d0b37a4d}.mode3-container .correct-answer{color:var(--text);margin-top:.45rem;font-weight:600}.mode3-container .auto-next-message{color:var(--info-strong);background:#ecf4f7f0;border:1px solid #88aebd4d}.mode3-container .loading-state{text-align:center}.mode3-container .back-button{border:1px solid var(--border);width:fit-content;min-height:3rem;color:var(--text-strong);background:#ffffffb8;border-radius:999px;justify-content:center;align-items:center;padding:.8rem 1.1rem;font-weight:700;text-decoration:none;transition:transform .18s,background-color .18s,border-color .18s;display:inline-flex}.mode3-container .back-button:hover{border-color:var(--border-strong);background:#ffffffeb;transform:translateY(-1px)}@media (width<=640px){.mode3-container .submit-button,.mode3-container .next-button,.mode3-container .give-up-button,.mode3-container .back-button{width:100%}}.mode4-container{width:100%;padding:.25rem 0 2rem}.mode4-content{flex-direction:column;gap:1.2rem;width:min(100%,980px);margin:0 auto;display:flex}.mode4-content h1{text-align:left;font-size:clamp(2rem,5vw,3rem)}.mode4-container .mode-selector{border:1px solid var(--border);width:fit-content;box-shadow:var(--shadow-card);background:#ffffffb8;border-radius:999px;gap:.55rem;padding:.35rem;display:inline-flex}.mode4-container .mode-button{min-height:2.9rem;color:var(--text);background:0 0;border:none;border-radius:999px;padding:.72rem 1.1rem;font-weight:700;transition:transform .18s,background-color .18s,color .18s}.mode4-container .mode-button:hover:not(.active){background:#f3f8f5f2;transform:translateY(-1px)}.mode4-container .mode-button.active{color:var(--accent-strong);background:#e8f2ebf5}.mode4-container .story-section,.mode4-container .quiz-section,.mode4-container .loading-state{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);padding:clamp(1.3rem,3vw,2rem)}.mode4-container .story-section{text-align:left}.mode4-container .story-section h2{margin-bottom:1rem;font-size:clamp(1.45rem,3vw,2rem)}.mode4-container .story-list{gap:.8rem;max-height:min(60svh,640px);padding-right:.2rem;display:grid;overflow-y:auto}.mode4-container .story-sentence{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-soft);grid-template-columns:minmax(90px,110px) minmax(0,1fr);align-items:start;gap:.8rem;padding:1rem;display:grid}.mode4-container .block-number{color:var(--text-muted);font-weight:700}.mode4-container .sentence-text{color:var(--text-strong);line-height:1.65}.mode4-container .progress-info{gap:.8rem;margin-bottom:1.5rem;display:grid}.mode4-container .progress-info p,.mode4-container .previous-block{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface-soft);padding:.95rem 1rem}.mode4-container .progress-info p{color:var(--text-strong);font-weight:700}.mode4-container .previous-block{color:var(--text);line-height:1.6}.mode4-container .question-section{flex-direction:column;gap:1rem;display:flex}.mode4-container .question{color:var(--text-strong);font-family:var(--font-heading);text-align:center;font-size:clamp(1.8rem,4.6vw,2.7rem)}.mode4-container .input-section{grid-template-columns:minmax(0,1fr) repeat(2,minmax(150px,190px));align-items:stretch;gap:.75rem;display:grid}.mode4-container .block-input{border:1px solid var(--border-strong);border-radius:var(--radius-md);background:var(--surface-soft);width:100%;min-height:3.6rem;color:var(--text-strong);font-family:var(--font-mono);text-align:center;padding:1rem 1.1rem;font-size:clamp(1.15rem,3vw,1.45rem);font-weight:700;transition:border-color .18s,box-shadow .18s,background-color .18s}.mode4-container .block-input:focus{border-color:var(--accent);background:#fff;outline:none;box-shadow:0 0 0 4px #7ea99526}.mode4-container .submit-button,.mode4-container .hint-button,.mode4-container .reset-button{border-radius:999px;min-height:3.2rem;padding:.9rem 1.1rem;font-weight:700;transition:transform .18s,box-shadow .18s,background-color .18s,border-color .18s}.mode4-container .submit-button{background:linear-gradient(135deg, var(--accent), var(--accent-strong));color:#fff;border:none}.mode4-container .submit-button:hover:not(:disabled),.mode4-container .hint-button:hover:not(:disabled),.mode4-container .reset-button:hover{transform:translateY(-2px)}.mode4-container .submit-button:hover:not(:disabled){box-shadow:0 14px 24px #74998738}.mode4-container .submit-button:disabled{color:#27433c8c;cursor:not-allowed;background:#d3ddd7}.mode4-container .hint-button{color:var(--warning-strong);background:#fff8eaf5;border:1px solid #d0b37a4d}.mode4-container .hint-button:disabled{color:var(--text-muted);cursor:not-allowed;background:#ebf0edf2}.mode4-container .hint-display,.mode4-container .feedback{border-radius:var(--radius-md);text-align:center;padding:.95rem 1rem;font-weight:600}.mode4-container .hint-display{color:var(--warning-strong);background:#fff8eaf0;border:1px solid #d0b37a4d;line-height:1.6}.mode4-container .feedback.correct{color:var(--success-strong);background:#eaf5eceb;border:1px solid #779e8147}.mode4-container .feedback.incorrect{color:var(--danger-strong);background:#fff1f1eb;border:1px solid #d58d8d47}.mode4-container .feedback.error{color:var(--warning-strong);background:#fff8eaf0;border:1px solid #d0b37a4d}.mode4-container .feedback.success{color:var(--info-strong);background:#ecf4f7f0;border:1px solid #88aebd4d}.mode4-container .correct-answer{color:var(--text);font-family:var(--font-mono);margin-top:.45rem;font-weight:700}.mode4-container .reset-button{width:fit-content;color:var(--danger-strong);background:#fff4f4f5;border:1px solid #d58d8d47;margin:0 auto}.mode4-container .loading-state{text-align:center}.mode4-container .back-button{border:1px solid var(--border);width:fit-content;min-height:3rem;color:var(--text-strong);background:#ffffffb8;border-radius:999px;justify-content:center;align-items:center;padding:.8rem 1.1rem;font-weight:700;text-decoration:none;transition:transform .18s,background-color .18s,border-color .18s;display:inline-flex}.mode4-container .back-button:hover{border-color:var(--border-strong);background:#ffffffeb;transform:translateY(-1px)}@media (width<=760px){.mode4-container .input-section{grid-template-columns:1fr}.mode4-container .mode-selector,.mode4-container .reset-button,.mode4-container .back-button{width:100%}.mode4-container .mode-selector{justify-content:center}.mode4-container .story-sentence{grid-template-columns:1fr;gap:.4rem}}@media (width<=520px){.mode4-container .mode-selector{grid-template-columns:1fr 1fr;display:grid}}.eintraege-container{width:100%;padding:.25rem 0 2rem}.eintraege-content{flex-direction:column;gap:1.5rem;width:min(100%,1120px);margin:0 auto;display:flex}.eintraege-header{flex-direction:column;gap:.5rem;display:flex}.eintraege-content h1{color:var(--text-strong);text-align:left;margin:0;font-size:clamp(2rem,5vw,3rem)}.eintraege-subtitle{color:var(--text);max-width:56ch;margin:0;font-size:1.03rem;line-height:1.65}.search-section{flex-direction:column;gap:.75rem;display:flex}.search-wrapper{align-items:center;display:flex;position:relative}.search-input{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);width:100%;color:var(--text);padding:.95rem 2.5rem .95rem 1rem;font-family:inherit;font-size:1rem;transition:border-color .18s,box-shadow .18s}.search-input::placeholder{color:var(--text-muted)}.search-input:focus{border-color:var(--border-strong);outline:none;box-shadow:0 0 0 2px #6f90801a}.search-clear{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:.25rem .5rem;font-size:1.2rem;transition:color .18s;position:absolute;right:1rem}.search-clear:hover{color:var(--text-strong)}.search-info{color:var(--text-muted);margin:0;font-size:.9rem}.table-wrapper{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-card);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);overflow-x:auto}.entries-table{border-collapse:collapse;width:100%;font-size:.95rem}.entries-table thead{border-bottom:1px solid var(--border);background:#f3f9f580}.entries-table th{text-align:left;color:var(--text-muted);letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;padding:1rem;font-size:.78rem;font-weight:700}.entries-table tbody tr{border-bottom:1px solid var(--border);transition:background-color .15s}.entries-table tbody tr:hover{background-color:#f3f9f599}.entries-table tbody tr:last-child{border-bottom:none}.entries-table td{color:var(--text);padding:1rem}.col-number{width:10%;min-width:80px;color:var(--text-strong);font-weight:600}.col-person,.col-action,.col-object{width:25%;min-width:120px}.col-points{text-align:center;width:12%;min-width:80px}.points-badge{text-align:center;border-radius:999px;min-width:2.5rem;padding:.35rem .75rem;font-size:.9rem;font-weight:600;display:inline-block}.points-badge.high{color:var(--accent-strong);background:#6f908026}.points-badge.medium{color:#916e32;background:#b4965a26}.points-badge.low{color:#964646;background:#b4646426}.no-results{text-align:center}.no-results td{color:var(--text-muted);padding:2rem 1rem;font-size:1rem}.no-results p{margin:0}.empty-state{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-card);text-align:center;flex-direction:column;align-items:center;gap:1.5rem;padding:3rem 2rem;display:flex}.empty-state p{color:var(--text-muted);margin:0;font-size:1.03rem}.loading-state{border:1px solid var(--border);border-radius:var(--radius-xl);background:var(--surface);box-shadow:var(--shadow-card);text-align:center;padding:3rem 2rem}.loading-state p{color:var(--text-muted);margin:0}.entries-footer{justify-content:center;padding-top:1rem;display:flex}.back-button{border:1px solid var(--border);border-radius:var(--radius-lg);min-height:2.85rem;color:var(--text);cursor:pointer;background:#ffffffbd;padding:.72rem 1.5rem;font-family:inherit;font-weight:700;transition:transform .18s,border-color .18s,background-color .18s}.back-button:hover{border-color:var(--border-strong);background:#ffffffd9;transform:translateY(-1px)}.back-button:active{transform:translateY(0)}@media (width<=768px){.entries-table{font-size:.85rem}.entries-table th,.entries-table td{padding:.75rem .5rem}.col-person,.col-action,.col-object{min-width:100px}.entries-table th{font-size:.7rem}.points-badge{padding:.3rem .6rem;font-size:.8rem}}@media (width<=480px){.entries-table{font-size:.8rem}.entries-table th,.entries-table td{padding:.6rem .4rem}.col-number{width:12%;min-width:50px}.col-person,.col-action,.col-object{width:22%;min-width:80px}.col-points{width:10%;min-width:60px}.points-badge{min-width:2rem;padding:.2rem .4rem;font-size:.7rem}}
