:root{--color-bg: #ffffff;--color-card: #f5f1e8;--color-surface2: #efead0;--color-outline: #e0d9cc;--color-primary: #3c4a73;--color-primary-hover:#30395c;--color-on-primary: #ffffff;--color-text: #1f1d1a;--color-text-secondary: #6b655c;--color-sage: #5e7556;--color-amber: #b87514;--color-error: #ba1a1a;--color-error-bg: #ffdad6}@media (prefers-color-scheme: dark){:root{--color-bg: #1a1916;--color-card: #242220;--color-surface2: #2e2b28;--color-outline: #3a3733;--color-primary: #4a5a8a;--color-primary-hover:#3c4a73;--color-on-primary: #ffffff;--color-text: #f0ebe0;--color-text-secondary: #b8b2a6;--color-sage: #8aa17f;--color-amber: #e0a14a;--color-error: #ffb4ab;--color-error-bg: #93000a}}.dark{--color-bg: #1a1916;--color-card: #242220;--color-surface2: #2e2b28;--color-outline: #3a3733;--color-primary: #4a5a8a;--color-primary-hover:#3c4a73;--color-on-primary: #ffffff;--color-text: #f0ebe0;--color-text-secondary: #b8b2a6;--color-sage: #8aa17f;--color-amber: #e0a14a;--color-error: #ffb4ab;--color-error-bg: #93000a}:root{--font-heading: "Fraunces", Georgia, serif;--font-body: "Inter", system-ui, -apple-system, sans-serif;--text-title-lg: 1.375rem;--text-title-md: 1rem;--text-title-sm: .875rem;--text-body-lg: 1rem;--text-body-md: .875rem;--text-body-sm: .75rem;--text-label-lg: .875rem;--text-label-sm: .75rem}:root{--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-6: 1.5rem;--space-8: 2rem;--space-12: 3rem}:root{--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-full: 9999px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{overflow-x:hidden}*{overflow-wrap:break-word}body{font-family:var(--font-body);font-size:var(--text-body-lg);line-height:1.6;color:var(--color-text);background:var(--color-bg);padding:var(--space-4);max-width:100vw;overflow-x:hidden;transition:background .2s,color .2s}h1,h2,h3{font-family:var(--font-heading)}.container{max-width:640px;width:100%;margin:var(--space-8) auto}.layout-grid{display:grid;grid-template-columns:1fr}@media (min-width: 1024px){.container{max-width:1280px}.layout-grid{grid-template-columns:1fr 1fr 1fr;gap:var(--space-4);align-items:start}}.feedback-placeholder{display:none;color:var(--color-text-secondary);font-size:var(--text-body-md);text-align:center}@media (min-width: 1024px){.feedback-placeholder{display:block}.col-right:has(#feedback-section:not([hidden])) .feedback-placeholder{display:none}}.card{background:var(--color-card);border-radius:var(--radius-lg);padding:var(--space-4) var(--space-6);margin-bottom:var(--space-4);border:1px solid var(--color-outline)}.card h2{font-size:var(--text-title-md);font-weight:600;margin-bottom:var(--space-2);color:var(--color-text)}.badge{display:inline-block;background:var(--color-surface2);color:var(--color-primary);border-radius:var(--radius-sm);padding:var(--space-1) var(--space-2);font-size:var(--text-body-sm);font-family:var(--font-body);font-weight:500;margin-bottom:var(--space-3)}button{padding:var(--space-2) var(--space-4);border:none;border-radius:var(--radius-md);font-size:var(--text-label-lg);font-family:var(--font-body);font-weight:500;cursor:pointer;transition:background .15s,opacity .15s}button:disabled{opacity:.5;cursor:default}.btn-primary,#btn-submit{background:var(--color-primary);color:var(--color-on-primary)}.btn-primary:hover:not(:disabled),#btn-submit:hover:not(:disabled){background:var(--color-primary-hover)}.btn-secondary,#btn-record,#btn-next{background:var(--color-surface2);color:var(--color-primary)}.btn-secondary:hover:not(:disabled),#btn-record:hover:not(:disabled),#btn-next:hover:not(:disabled){background:var(--color-outline)}#btn-stop{background:var(--color-error-bg);color:var(--color-error)}#btn-submit,#btn-next{width:100%;padding:var(--space-3) var(--space-4);font-size:var(--text-body-lg);border-radius:var(--radius-md);margin-top:var(--space-4)}label{display:block;font-weight:500;font-size:var(--text-label-lg);margin-bottom:var(--space-2);color:var(--color-text)}textarea,input[type=text]{width:100%;padding:var(--space-2) var(--space-3);border:1px solid var(--color-outline);border-radius:var(--radius-md);font-size:var(--text-body-lg);font-family:var(--font-body);resize:vertical;background:var(--color-bg);color:var(--color-text);transition:border-color .15s,outline .15s}textarea:focus,input[type=text]:focus{outline:2px solid var(--color-primary);border-color:transparent}.record-row{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}#record-status{font-size:var(--text-body-sm);color:var(--color-text-secondary)}.language-row{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-3);font-size:var(--text-body-sm)}.language-row select{font-family:inherit;font-size:inherit;padding:.2rem .4rem;border:1px solid var(--color-border, #ccc);border-radius:4px;background:var(--color-surface, #fff);cursor:pointer}#mic-denied{font-size:var(--text-body-sm);color:var(--color-error);margin-top:var(--space-2)}#turnstile-widget,#turnstile-widget>iframe{max-width:100%}#status{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);margin-bottom:var(--space-4);font-size:var(--text-body-md)}#status.info{background:var(--color-surface2);color:var(--color-primary)}#status.error{background:var(--color-error-bg);color:var(--color-error)}#status.pause{background:var(--color-card);color:var(--color-amber);border:1px solid var(--color-amber)}#status:empty{display:none}.score-row{display:flex;align-items:baseline;gap:var(--space-2);margin-bottom:var(--space-3)}.score-big{font-size:2rem;font-weight:700;font-family:var(--font-heading);color:var(--color-primary)}.score-label{font-size:var(--text-body-md);color:var(--color-text-secondary)}.score-reason{font-size:var(--text-body-md);color:var(--color-text-secondary);margin-bottom:var(--space-4);font-style:italic}.corrections h3,.model-answer h3,.student-answer h3,.detailed-section h3{font-size:var(--text-title-sm);font-weight:600;margin-bottom:var(--space-2);color:var(--color-text)}.student-answer{margin-bottom:var(--space-3)}.student-answer p{font-size:var(--text-body-md);color:var(--color-text-secondary);line-height:1.6}.detailed-section{margin-top:var(--space-4)}.detailed-section ul{padding-left:var(--space-4);font-size:var(--text-body-md);color:var(--color-text-secondary);line-height:1.7}.detailed-section p{font-size:var(--text-body-md);color:var(--color-text-secondary);line-height:1.6}#feedback-detailed-area .detailed-loading{font-size:var(--text-body-sm);color:var(--color-text-secondary);margin-top:var(--space-3)}#feedback-detailed-area .detailed-error{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-3);font-size:var(--text-body-sm);color:var(--color-error)}#btn-meer-details{width:100%;margin-top:var(--space-4)}.correction{border-left:3px solid var(--color-error);padding:var(--space-1) var(--space-3);margin-bottom:var(--space-2);font-size:var(--text-body-md)}.correction .orig{color:var(--color-error);text-decoration:line-through}.correction .fixed{color:var(--color-sage);font-weight:500}.correction .expl{color:var(--color-text-secondary);font-size:var(--text-body-sm)}.segment{display:inline;padding:1px 2px;border-radius:var(--radius-sm)}.segment.correct{background:color-mix(in srgb,var(--color-sage) 20%,transparent);color:var(--color-sage)}.segment.partial{background:color-mix(in srgb,var(--color-amber) 20%,transparent);color:var(--color-amber)}.segment.wrong{background:color-mix(in srgb,var(--color-error) 15%,transparent);color:var(--color-error)}.segment.neutral{color:var(--color-text)}h1{font-size:var(--text-title-lg);font-weight:700;margin-bottom:var(--space-1);color:var(--color-text)}.subtitle{color:var(--color-text-secondary);margin-bottom:var(--space-6);font-size:var(--text-body-md)}#prompt-text{color:var(--color-text);line-height:1.7}#prompt-media{margin-top:var(--space-3)}.examiner-audio audio{width:100%;border-radius:var(--radius-md)}.exercise-images{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}.exercise-image{width:calc(50% - var(--space-1));max-width:240px;border-radius:var(--radius-md);border:1px solid var(--color-outline);object-fit:cover}@media (max-width: 400px){.exercise-image{width:100%;max-width:100%}}.task-search-row{display:flex;gap:var(--space-2);margin-top:var(--space-3)}.task-search-row input[type=search]{flex:1;padding:var(--space-2) var(--space-3);border:1px solid var(--color-outline);border-radius:var(--radius-md);font-size:var(--text-body-md);background:var(--color-surface);color:var(--color-text)}.task-search-row select{padding:var(--space-2) var(--space-3);border:1px solid var(--color-outline);border-radius:var(--radius-md);font-size:var(--text-body-md);background:var(--color-surface);color:var(--color-text)}.task-count{font-size:var(--text-body-sm);color:var(--color-text-secondary);margin:var(--space-2) 0 0}.task-list{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-3)}.task-item{text-align:left;background:var(--color-surface2);color:var(--color-text);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);font-size:var(--text-body-md);width:100%;font-weight:400;margin:0}.task-item:hover:not(:disabled){background:var(--color-outline)}.task-item--active{background:var(--color-primary);color:var(--color-on-primary)}.task-item--active:hover{background:var(--color-primary-hover)}.task-group{margin-top:var(--space-2)}.task-group__letter{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-1) var(--space-2);font-size:var(--text-body-sm);font-weight:600;color:var(--color-text-secondary);cursor:pointer;list-style:none;-webkit-user-select:none;user-select:none;border-radius:var(--radius-sm)}.task-group__letter::-webkit-details-marker{display:none}.task-group__letter:before{content:"▶";font-size:.6em;transition:transform .15s}details[open]>.task-group__letter:before{transform:rotate(90deg)}.task-group__letter:hover{color:var(--color-primary);background:var(--color-surface2)}.task-group__items{display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-2);padding-left:var(--space-3)}.cta-steps{padding-left:var(--space-6);margin-top:var(--space-3);font-size:var(--text-body-md);color:var(--color-text);line-height:1.7}.cta-steps li{margin-bottom:var(--space-2)}.cta-steps a{color:var(--color-primary);font-weight:500}.cta-steps a:hover{color:var(--color-primary-hover)}.page-footer{text-align:center;padding:var(--space-4) 0 var(--space-8)}.btn-link{background:none;border:none;padding:0;font-size:var(--text-body-sm);color:var(--color-text-secondary);cursor:pointer;text-decoration:underline;font-family:var(--font-body);border-radius:0}.btn-link:hover{color:var(--color-primary)}#report-dialog{border:1px solid var(--color-outline);border-radius:var(--radius-lg);background:var(--color-card);color:var(--color-text);padding:var(--space-6);width:min(480px,90vw);max-height:90vh;overflow-y:auto}#report-dialog::backdrop{background:#00000073}#report-dialog h2{font-size:var(--text-title-md);font-weight:600;margin-bottom:var(--space-4)}#report-dialog label{margin-bottom:var(--space-2)}#report-dialog textarea{margin-bottom:var(--space-3)}#report-status{font-size:var(--text-body-md);min-height:1.4em;margin-bottom:var(--space-3)}#report-status.success{color:var(--color-sage)}#report-status.error{color:var(--color-error)}#report-status:empty{display:none}.report-actions{display:flex;gap:var(--space-3)}.report-actions button{flex:1}.daily-counter{font-size:var(--text-title-lg);font-weight:700;color:var(--color-text);margin-bottom:var(--space-3);text-align:center}.daily-counter.limit-reached{font-size:var(--text-body-lg);font-weight:400;color:var(--color-text-secondary)}.daily-counter.limit-reached a{color:var(--color-primary);text-decoration:underline}@media (max-width: 400px){body{padding:var(--space-3)}.card{padding:var(--space-3) var(--space-4)}}