*,:before,:after{box-sizing:border-box}body{margin:0}#root{min-height:100vh}.comprehension-assessment{background:#fff;border:2px solid #e9ecef;border-radius:12px;max-width:800px;margin:1rem auto;padding:2rem;box-shadow:0 4px 12px #0000001a}.assessment-header{text-align:center;margin-bottom:2rem}.assessment-header h2{color:#333;margin-bottom:.5rem;font-size:1.8rem}.assessment-header p{color:#6c757d;margin-bottom:1.5rem;font-size:1.1rem}.progress-bar{background:#e9ecef;border-radius:4px;width:100%;height:8px;margin-bottom:.5rem;overflow:hidden}.progress-fill{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:4px;height:100%;transition:width .3s}.progress-text{color:#6c757d;font-size:.9rem;font-weight:600}.question-card{background:#f8f9fa;border:1px solid #e9ecef;border-radius:12px;margin-bottom:1.5rem;padding:2rem}.question-type{border-bottom:2px solid #e9ecef;align-items:center;gap:1rem;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.type-icon{font-size:1.5rem}.type-label{color:#495057;font-size:1.1rem;font-weight:600}.difficulty-stars{margin-left:auto;font-size:1.2rem}.question-text{color:#333;margin-bottom:1.5rem;font-size:1.3rem;font-weight:500;line-height:1.6}.answer-input{margin-bottom:2rem}.answer-textarea{resize:vertical;box-sizing:border-box;border:2px solid #e9ecef;border-radius:8px;width:100%;min-height:100px;padding:1rem;font-family:inherit;font-size:1.1rem;line-height:1.5;transition:border-color .3s}.answer-textarea:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 3px #667eea1a}.answer-textarea::placeholder{color:#adb5bd;font-style:italic}.question-navigation{justify-content:space-between;gap:1rem;display:flex}.nav-button{cursor:pointer;border:none;border-radius:8px;min-width:120px;padding:.8rem 1.5rem;font-size:1rem;font-weight:600;transition:all .3s}.nav-button.prev{color:#fff;background:#6c757d}.nav-button.prev:hover:not(:disabled){background:#5a6268;transform:translateY(-1px)}.nav-button.next{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)}.nav-button.next:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.nav-button:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.question-hints{background:#e3f2fd;border-left:4px solid #2196f3;border-radius:8px;padding:1.5rem}.hint-section h4{color:#1976d2;margin-bottom:.5rem;font-size:1rem}.hint-section p{color:#1565c0;margin:0;font-size:.95rem;line-height:1.4}@media (width<=768px){.comprehension-assessment{margin:.5rem;padding:1.5rem}.question-card{padding:1.5rem}.question-type{flex-direction:column;align-items:flex-start;gap:.5rem}.difficulty-stars{margin-left:0}.question-text{font-size:1.2rem}.question-navigation{flex-direction:column}.nav-button{width:100%}}@media (width<=480px){.assessment-header h2{font-size:1.5rem}.question-text{font-size:1.1rem}.answer-textarea{font-size:1rem}}.reading-session{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;padding:1rem}.session-header{background:#fff;border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1.5rem;padding:1.5rem 2rem;display:flex;box-shadow:0 8px 25px #0000001a}.session-header h1{color:#333;text-align:center;flex:1;margin:0;font-size:1.8rem}.passage-subtitle{color:#6c757d;text-align:center;flex-basis:100%;margin:0;font-size:1rem}.session-info{color:#6c757d;flex-direction:column;align-items:flex-end;gap:.25rem;font-size:.9rem;font-weight:500;display:flex}.timer-display{letter-spacing:.05em;border:2px solid #0000;border-radius:10px;padding:.4rem .9rem;font-weight:700;transition:color .5s,background .5s,border-color .5s}.timer-countdown{text-align:center;min-width:5.5rem;font-size:2.4rem}.timer-green{color:#28a745;background:#28a7451a;border-color:#28a74559}.timer-orange{color:#fd7e14;background:#fd7e141a;border-color:#fd7e1459}.timer-red{color:#dc3545;background:#dc35451f;border-color:#dc354566}.timer-elapsed{color:#6c757d;background:#6c757d14;border-color:#6c757d33;font-size:1.1rem}.back-button{cursor:pointer;color:#fff;white-space:nowrap;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:25px;padding:.6rem 1.2rem;font-size:.95rem;font-weight:600;transition:all .3s}.back-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 15px #667eea66}.back-button:disabled{opacity:.5;cursor:not-allowed}.error-banner{color:#856404;background:#fff3cd;border:2px solid #ffc107;border-radius:8px;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem;padding:1rem 1.5rem;font-size:.95rem;display:flex}.error-banner button{cursor:pointer;color:#856404;background:0 0;border:none;flex-shrink:0;padding:0;font-size:1.2rem}.passage-selector{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 8px 25px #0000001a}.passage-selector h2{color:#333;text-align:center;margin-bottom:1.5rem;font-size:1.5rem}.passage-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;display:grid}.passage-card{cursor:pointer;background:#f8f9fa;border:2px solid #e0e7ff;border-radius:12px;padding:1.5rem;transition:all .3s}.passage-card.clickable{background:linear-gradient(135deg,#f8f9fa 0%,#e8f5e8 100%);border-color:#28a745}.passage-card.clickable:hover{color:#fff;background:linear-gradient(135deg,#28a745 0%,#20c997 100%);border-color:#28a745;transform:translateY(-3px);box-shadow:0 10px 30px #28a7454d}.passage-card h3{margin-bottom:.5rem;font-size:1.2rem}.passage-meta{color:#6c757d;gap:1rem;margin-bottom:.5rem;font-size:.85rem;display:flex}.passage-card.clickable:hover .passage-meta{color:#ffffffd9}.passage-tier{color:#667eea;background:#e0e7ff;border-radius:20px;padding:.1rem .5rem;font-weight:600}.passage-card.clickable:hover .passage-tier{color:#fff;background:#ffffff40}.passage-preview{opacity:.75;margin-top:.5rem;font-size:.9rem;line-height:1.4}.start-indicator{color:#28a745;text-align:center;background:#28a7451a;border:1px solid #28a7454d;border-radius:20px;margin-top:1rem;padding:.4rem .8rem;font-size:.85rem;font-weight:600}.passage-card.clickable:hover .start-indicator{color:#fff;background:#fff3;border-color:#fff6}.mode-hint{text-align:center;color:#6c757d;margin:.25rem 0 1.25rem;font-size:.9rem}.header-title-group{text-align:center;flex-direction:column;flex:1;align-items:center;gap:.3rem;display:flex}.header-title-group h1{color:#333;margin:0;font-size:1.4rem}.mode-badge{color:#fff;letter-spacing:.02em;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:20px;padding:.2rem .75rem;font-size:.8rem;font-weight:600;display:inline-block}.timed-hint{color:#6c757d;margin:.6rem 0 0;font-size:.85rem}.autostop-notice{text-align:center;color:#0c5460;background:#e8f4fd;border:2px solid #bee5fb;border-radius:8px;margin-bottom:1rem;padding:.75rem 1.25rem;font-size:.95rem;font-weight:600}.timer-urgent{animation:.8s ease-in-out infinite pulse-urgent}@keyframes pulse-urgent{0%,to{opacity:1}50%{opacity:.6}}.reading-interface{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 8px 25px #0000001a}.reading-controls-top{text-align:center;background:#f8f9fa;border-bottom:2px solid #e9ecef;padding:1.5rem 2rem}.start-button-top,.stop-button-top{color:#fff;cursor:pointer;border:none;border-radius:12px;min-width:200px;padding:1rem 2.5rem;font-size:1.2rem;font-weight:600;transition:transform .2s}.start-button-top{background:linear-gradient(135deg,#28a745 0%,#20c997 100%)}.stop-button-top{background:linear-gradient(135deg,#dc3545 0%,#c82333 100%)}.start-button-top:hover:not(:disabled),.stop-button-top:hover:not(:disabled){transform:translateY(-2px)}.start-button-top:disabled,.stop-button-top:disabled{opacity:.65;cursor:not-allowed;transform:none}.passage-display{background:#f8f9fa;border-bottom:2px solid #e9ecef;padding:2rem;position:relative}.passage-locked .passage-text{filter:blur(6px);-webkit-user-select:none;user-select:none;pointer-events:none}.passage-lock-overlay{color:#495057;pointer-events:none;background:#f8f9fa80;justify-content:center;align-items:center;font-size:1.05rem;display:flex;position:absolute;inset:0}.passage-text{color:#222;text-align:left;margin:0;font-size:1.4rem;line-height:1.9}.transcript-display{background:#fff;padding:1.5rem 2rem}.transcript-display h3{color:#333;margin-bottom:.75rem;font-size:1rem;font-weight:600}.transcript{color:#495057;background:#f8f9fa;border-left:4px solid #28a745;border-radius:8px;min-height:60px;padding:1rem 1.5rem;font-size:1.05rem;font-style:italic;line-height:1.6}.comprehension-wrapper{max-width:860px;margin:0 auto;padding:1rem}.skip-questions-button{color:#fff;cursor:pointer;background:0 0;border:2px solid #ffffff80;border-radius:25px;margin:1rem auto 0;padding:.6rem 1.5rem;font-size:.95rem;font-weight:600;transition:all .3s;display:block}.skip-questions-button:hover{background:#ffffff26;border-color:#fff}.results-display{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 8px 25px #0000001a}.score-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1.5rem;margin-bottom:2rem;display:grid}.score-card{text-align:center;background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);border:2px solid #e9ecef;border-radius:12px;padding:1.75rem;transition:all .3s}.score-card:hover{transform:translateY(-2px);box-shadow:0 8px 25px #0000001a}.score-card.prosody{color:#fff;background:linear-gradient(135deg,#ff6b6b 0%,#feca57 100%);border-color:#ff6b6b}.score-card.comprehension{color:#fff;background:linear-gradient(135deg,#17a2b8 0%,#138496 100%);border-color:#17a2b8}.score-card.overall{color:#fff;background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%);border-color:#4facfe}.score-card h3{color:#495057;margin-bottom:.75rem;font-size:1rem}.score-card.prosody h3,.score-card.comprehension h3,.score-card.overall h3{color:#ffffffe6}.score-value{color:#333;margin-bottom:.4rem;font-size:2.5rem;font-weight:700}.score-card.prosody .score-value,.score-card.comprehension .score-value,.score-card.overall .score-value{color:#fff}.score-description{opacity:.8;font-size:.85rem}.score-card.wcpm-card{color:#fff;background:linear-gradient(135deg,#28a745 0%,#20c997 100%);border-color:#28a745;flex-direction:column;grid-column:1/-1;align-items:center;padding:1.5rem 2rem;display:flex}.score-card.wcpm-card h3{color:#ffffffe6;margin-bottom:.25rem;font-size:1rem}.wcpm-number{color:#fff;margin:.1rem 0;font-size:4rem;font-weight:900;line-height:1}.wcpm-label{letter-spacing:.12em;color:#fffc;text-transform:uppercase;margin-bottom:.75rem;font-size:.85rem;font-weight:700}.wcpm-detail{gap:1.25rem;margin-bottom:.25rem;display:flex}.words-correct{color:#fffffff2;font-size:1.3rem;font-weight:700}.words-incorrect{color:#ffdcdcf2;font-size:1.3rem;font-weight:700}.words-insertion{color:#fff0c8f2;font-size:1.3rem;font-weight:700}.score-card.wcpm-card .score-description{color:#ffffffbf;font-size:.8rem}.word-accuracy-section{background:#f8f9fa;border-left:4px solid #4facfe;border-radius:12px;margin-bottom:2rem;padding:1.5rem}.word-accuracy-section h3{color:#333;margin-bottom:1rem;font-size:1.1rem}.word-accuracy-display{margin-bottom:1rem;font-size:1.15rem;line-height:2}.word{display:inline}.word-none{color:#28a745;font-weight:500}.word-mispronunciation{color:#dc3545;font-weight:500;-webkit-text-decoration:underline wavy;text-decoration:underline wavy}.word-omission{color:#adb5bd;text-decoration:line-through}.word-insertion{color:#fd7e14;font-style:italic}.word-unexpectedbreak,.word-missingbreak,.word-monotone{color:#6c757d}.word-legend{flex-wrap:wrap;gap:1.25rem;margin-top:.5rem;font-size:.85rem;display:flex}.legend-item{border-radius:4px;padding:.2rem .6rem;font-weight:600}.action-buttons{flex-wrap:wrap;justify-content:center;gap:1rem;margin-top:1rem;display:flex}.action-buttons button{cursor:pointer;border:none;border-radius:8px;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;transition:transform .2s}.action-buttons button:hover{transform:translateY(-1px)}.try-again-button{color:#333;background:linear-gradient(135deg,#ffc107 0%,#e0a800 100%)}.new-passage-button{color:#fff;background:linear-gradient(135deg,#17a2b8 0%,#138496 100%)}.home-button{color:#fff;background:linear-gradient(135deg,#6c757d 0%,#495057 100%)}.azure-raw-debug{border:1px solid #dee2e6;border-radius:8px;margin-top:2rem;overflow:hidden}.azure-raw-debug summary{cursor:pointer;color:#495057;-webkit-user-select:none;user-select:none;background:#f8f9fa;padding:.75rem 1rem;font-size:.9rem;font-weight:600}.azure-raw-debug summary:hover{background:#e9ecef}.azure-raw-debug pre{color:#d4d4d4;background:#1e1e1e;max-height:400px;margin:0;padding:1rem;font-size:.78rem;line-height:1.5;overflow:auto}@media (width<=768px){.reading-session{padding:.5rem}.session-header{text-align:center;flex-direction:column;padding:1rem 1.5rem}.session-header h1{font-size:1.4rem}.passage-grid{grid-template-columns:1fr}.score-grid{grid-template-columns:repeat(2,1fr)}.passage-text{font-size:1.2rem}.passage-display{padding:1.5rem 1rem}.transcript-display{padding:1rem}.start-button-top,.stop-button-top{width:100%}}@media (width<=480px){.score-grid{grid-template-columns:1fr}.score-value{font-size:2rem}.passage-text{font-size:1.1rem}.action-buttons{flex-direction:column}}.pin-entry{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.pin-hidden-input{opacity:0;pointer-events:none;width:0;height:0;position:absolute}.pin-card{background:#fff;border-radius:20px;flex-direction:column;align-items:center;gap:1.25rem;width:100%;max-width:380px;padding:2.5rem 2rem;display:flex;box-shadow:0 24px 60px #0003}.pin-header{text-align:center}.pin-header h1{color:#333;margin-bottom:.3rem;font-size:1.8rem;font-weight:700}.pin-header p{color:#6c757d;font-size:1rem}.pin-class-field{width:100%}.pin-class-field label{color:#555;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.35rem;font-size:.85rem;font-weight:600;display:block}.pin-class-input{letter-spacing:.1em;text-align:center;color:#333;border:2px solid #e0e7ff;border-radius:10px;outline:none;width:100%;padding:.7rem 1rem;font-size:1.1rem;font-weight:700;transition:border-color .2s}.pin-class-input:focus{border-color:#667eea}.pin-class-locked{color:#6c757d;font-size:.95rem}.pin-class-locked strong{color:#333;font-size:1.05rem}.pin-display{gap:.75rem;margin:.25rem 0;display:flex}.pin-dot{color:#333;background:#f8f9fa;border:3px solid #e0e7ff;border-radius:12px;justify-content:center;align-items:center;width:60px;height:70px;font-size:2rem;font-weight:700;transition:all .15s;display:flex}.pin-dot.filled{color:#667eea;background:linear-gradient(135deg,#f0f2ff 0%,#e8eaff 100%);border-color:#667eea}.pin-error{color:#dc3545;text-align:center;background:#dc35450f;border:1px solid #dc354533;border-radius:8px;width:100%;padding:.5rem 1rem;font-size:.9rem;font-weight:500}.pin-pad{grid-template-columns:repeat(3,1fr);gap:.6rem;width:100%;display:grid}.pin-key{color:#333;cursor:pointer;background:#fff;border:2px solid #e0e7ff;border-radius:12px;justify-content:center;align-items:center;height:64px;font-size:1.6rem;font-weight:600;transition:all .12s;display:flex}.pin-key:hover:not(.spacer){background:linear-gradient(135deg,#f0f2ff 0%,#e8eaff 100%);border-color:#667eea;transform:translateY(-1px)}.pin-key:active:not(.spacer){color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-color:#0000;transform:translateY(0)}.pin-key.delete{color:#6c757d;font-size:1.3rem}.pin-key.spacer{cursor:default;background:0 0;border:none}.pin-submit{color:#fff;cursor:pointer;letter-spacing:.02em;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:12px;width:100%;padding:1rem;font-size:1.1rem;font-weight:700;transition:all .2s}.pin-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px #667eea66}.pin-submit:disabled{opacity:.4;cursor:not-allowed;transform:none}.pin-teacher-link{color:#adb5bd;cursor:pointer;background:0 0;border:none;padding:0;font-size:.85rem;text-decoration:underline}.pin-teacher-link:hover{color:#6c757d}.pin-confirmed{text-align:center;background:#fff;border-radius:20px;width:100%;max-width:380px;padding:3rem 2rem;box-shadow:0 24px 60px #0003}.confirmed-emoji{margin-bottom:1rem;font-size:5rem;animation:.4s cubic-bezier(.34,1.56,.64,1) bounce-in}@keyframes bounce-in{0%{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}.pin-confirmed h1{color:#333;margin-bottom:.4rem;font-size:2rem;font-weight:700}.pin-confirmed p{color:#6c757d;margin-bottom:2rem;font-size:1.1rem}.confirmed-start-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#28a745 0%,#20c997 100%);border:none;border-radius:12px;padding:1rem 2.5rem;font-size:1.2rem;font-weight:700;transition:all .2s}.confirmed-start-btn:hover{transform:translateY(-2px);box-shadow:0 8px 24px #28a74559}@media (width<=480px){.pin-card,.pin-confirmed{border-radius:16px;padding:2rem 1.25rem}.pin-dot{width:52px;height:62px;font-size:1.7rem}.pin-key{height:58px;font-size:1.4rem}}.teacher-login{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.login-card{background:#fff;border-radius:20px;flex-direction:column;gap:1rem;width:100%;max-width:420px;padding:2.5rem 2rem;display:flex;box-shadow:0 24px 60px #0003}.login-back-link{color:#6c757d;cursor:pointer;text-align:left;background:0 0;border:none;width:fit-content;padding:0;font-size:.9rem}.login-back-link:hover{color:#333}.login-card h1{color:#333;margin:0;font-size:1.8rem;font-weight:700}.login-card>p{color:#6c757d;margin:0;font-size:.95rem;line-height:1.5}.login-mode-tabs{background:#f0f2ff;border-radius:10px;gap:0;padding:.3rem;display:flex}.login-tab{color:#6c757d;cursor:pointer;background:0 0;border:none;border-radius:7px;flex:1;padding:.5rem;font-size:.9rem;font-weight:600;transition:all .18s}.login-tab.active{color:#667eea;background:#fff;box-shadow:0 2px 6px #00000014}.login-hint{color:#6c757d;margin:0;font-size:.9rem;line-height:1.5}.login-field{flex-direction:column;gap:.4rem;display:flex}.login-field label{color:#555;text-transform:uppercase;letter-spacing:.04em;font-size:.85rem;font-weight:600}.login-field input{color:#333;border:2px solid #e0e7ff;border-radius:10px;outline:none;padding:.8rem 1rem;font-size:1rem;transition:border-color .2s}.login-field input:focus{border-color:#667eea}.login-error{color:#dc3545;background:#dc35450f;border:1px solid #dc354533;border-radius:8px;margin:0;padding:.5rem .75rem;font-size:.9rem;font-weight:500}.login-submit{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:10px;padding:.9rem;font-size:1rem;font-weight:700;transition:all .2s}.login-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 24px #667eea66}.login-submit:disabled{opacity:.45;cursor:not-allowed;transform:none}.login-sent-icon{text-align:center;font-size:3.5rem}.login-card .login-note{color:#adb5bd;font-size:.85rem}.login-back-btn{color:#6c757d;cursor:pointer;background:0 0;border:2px solid #e0e7ff;border-radius:8px;margin-top:.5rem;padding:.6rem 1rem;font-size:.9rem;transition:all .2s}.login-back-btn:hover{color:#667eea;border-color:#667eea}.print-cards-page{background:#f0f2ff;min-height:100vh;padding:1.5rem}.print-controls{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.print-controls-right{align-items:center;gap:1rem;display:flex}.print-info{color:#6c757d;font-size:.9rem}.print-back-btn{color:#667eea;cursor:pointer;background:0 0;border:2px solid #667eea;border-radius:8px;padding:.5rem 1rem;font-size:.9rem;font-weight:600;transition:all .2s}.print-back-btn:hover{color:#fff;background:#667eea}.print-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;padding:.6rem 1.25rem;font-size:.95rem;font-weight:700;transition:all .2s}.print-btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px #667eea66}.cards-sheet-header{background:#fff;border:2px solid #e0e7ff;border-radius:12px;flex-wrap:wrap;align-items:center;gap:1.5rem;margin-bottom:1.5rem;padding:1.25rem 1.75rem;display:flex}.sheet-title{color:#333;flex:1;min-width:0;font-size:1.2rem;font-weight:700}.sheet-code-row{flex-shrink:0;align-items:center;gap:.5rem;display:flex}.sheet-code-label{color:#6c757d;text-transform:uppercase;letter-spacing:.05em;font-size:.8rem;font-weight:600}.sheet-code-value{color:#667eea;letter-spacing:.15em;background:#f0f2ff;border-radius:6px;padding:.1rem .6rem;font-family:monospace;font-size:1.6rem;font-weight:900}.sheet-instructions{color:#6c757d;width:100%;margin-top:.25rem;font-size:.85rem}.cards-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.25rem;display:grid}.reading-card{background:#fff;border:2px solid #e0e7ff;border-radius:16px;flex-direction:column;align-items:center;gap:.4rem;padding:1.5rem 1.25rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;display:flex;box-shadow:0 4px 16px #00000012}.card-emoji{margin-bottom:.2rem;font-size:3.5rem;line-height:1}.card-name{color:#333;text-align:center;font-size:1.15rem;font-weight:700}.card-pin-label{text-transform:uppercase;letter-spacing:.1em;color:#adb5bd;margin-top:.5rem;font-size:.7rem;font-weight:700}.card-pin{color:#667eea;letter-spacing:.25em;font-variant-numeric:tabular-nums;font-size:2.2rem;font-weight:900}.card-qr{width:80px;height:80px;margin-top:.4rem}.card-footer{flex-direction:column;align-items:center;gap:.1rem;margin-top:.4rem;display:flex}.card-url{color:#adb5bd;font-size:.7rem}.card-class{color:#6c757d;font-size:.75rem;font-weight:600}@media print{@page{size:A4 portrait;margin:10mm}body{background:#fff!important}.no-print{display:none!important}.print-cards-page{background:#fff;min-height:auto;padding:0}.cards-sheet-header{border:1pt solid #ccc;border-radius:4pt;gap:4mm;margin-bottom:6mm;padding:6mm 8mm}.sheet-title{font-size:13pt}.sheet-code-value{color:#44c;font-size:18pt}.sheet-code-label,.sheet-instructions{font-size:8pt}.cards-grid{grid-template-columns:1fr 1fr;gap:6mm;display:grid}.reading-card{box-shadow:none;break-inside:avoid;page-break-inside:avoid;border:1.5pt solid #ccc;border-radius:8pt;padding:8mm 6mm}.card-emoji{font-size:28pt}.card-name{font-size:13pt}.card-pin{letter-spacing:.2em;color:#44c;font-size:22pt}.card-pin-label,.card-url{font-size:7pt}.card-class{font-size:8pt}.card-qr{width:60px;height:60px}}.class-editor{background:#f0f2ff;min-height:100vh;padding:1.5rem}.editor-header{align-items:center;gap:1.25rem;margin-bottom:1.5rem;display:flex}.editor-header h1{color:#333;margin:0;font-size:1.6rem;font-weight:700}.editor-back-btn{color:#667eea;cursor:pointer;white-space:nowrap;background:0 0;border:2px solid #667eea;border-radius:8px;padding:.45rem .9rem;font-size:.9rem;font-weight:600;transition:all .2s}.editor-back-btn:hover{color:#fff;background:#667eea}.editor-card{background:#fff;border-radius:16px;flex-direction:column;gap:1.25rem;max-width:700px;padding:2rem;display:flex;box-shadow:0 8px 30px #00000014}.editor-field{flex-direction:column;flex:1;gap:.4rem;display:flex}.editor-field label{color:#555;text-transform:uppercase;letter-spacing:.04em;font-size:.85rem;font-weight:600}.field-note{text-transform:none;letter-spacing:0;color:#adb5bd;font-size:.8rem;font-weight:400}.editor-field input,.editor-field select{color:#333;background:#fff;border:2px solid #e0e7ff;border-radius:10px;outline:none;padding:.7rem .9rem;font-size:1rem;transition:border-color .2s}.editor-field input:focus,.editor-field select:focus{border-color:#667eea}.editor-row{gap:1rem;display:flex}.editor-error{color:#dc3545;background:#dc35450f;border:1px solid #dc354533;border-radius:8px;margin:0;padding:.5rem .75rem;font-size:.9rem}.editor-actions{justify-content:flex-end;gap:.75rem;margin-top:.5rem;display:flex}.editor-save-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:10px;padding:.75rem 1.75rem;font-size:1rem;font-weight:700;transition:all .2s}.editor-save-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 18px #667eea66}.editor-save-btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.editor-secondary-btn{color:#6c757d;cursor:pointer;background:0 0;border:2px solid #e0e7ff;border-radius:10px;padding:.75rem 1.25rem;font-size:.95rem;font-weight:600;transition:all .2s}.editor-secondary-btn:hover{color:#667eea;border-color:#667eea}.roster-meta{color:#6c757d;border-bottom:1px solid #f0f2ff;flex-wrap:wrap;gap:1rem;padding-bottom:.75rem;font-size:.9rem;display:flex}.roster-meta strong{color:#333}.roster-note{color:#6c757d;background:#fffbeb;border:1px solid #fde68a;border-radius:8px;margin:0;padding:.6rem .9rem;font-size:.88rem}.roster-table-wrap{border:1px solid #e0e7ff;border-radius:10px;max-height:420px;overflow-y:auto}.roster-table{border-collapse:collapse;width:100%;font-size:.95rem}.roster-table th{text-align:left;text-transform:uppercase;letter-spacing:.05em;color:#667eea;background:#f0f2ff;padding:.6rem 1rem;font-size:.8rem;font-weight:700;position:sticky;top:0}.roster-table td{border-bottom:1px solid #f0f2ff;padding:.55rem 1rem}.roster-table tr:last-child td{border-bottom:none}.roster-table tr:hover td{background:#f8f9ff}.roster-num{color:#adb5bd;width:40px}.roster-pseudonym{color:#333;font-weight:600}.roster-pin{color:#667eea;letter-spacing:.15em;font-family:monospace;font-size:1.05rem;font-weight:700}@media (width<=600px){.editor-row{flex-direction:column}.editor-card{padding:1.25rem}.editor-actions{flex-direction:column}.editor-save-btn,.editor-secondary-btn{text-align:center;width:100%}}.wcpm-chart-wrap{background:#fff;border:2px solid #e0e7ff;border-radius:12px;margin-bottom:1.5rem;padding:1.25rem 1.5rem}.wcpm-chart-header{flex-wrap:wrap;align-items:baseline;gap:.75rem;margin-bottom:.75rem;display:flex}.wcpm-chart-header h3{color:#333;margin:0;font-size:1rem;font-weight:700}.wcpm-target-label{color:#667eea;background:#f0f2ff;border-radius:20px;padding:.15rem .5rem;font-size:.8rem;font-weight:600}.wcpm-empty{color:#6c757d;text-align:center;background:#fff;border:2px solid #e0e7ff;border-radius:12px;margin-bottom:1.5rem;padding:2rem;font-size:.9rem}.wcpm-tooltip{background:#fff;border:1px solid #e0e7ff;border-radius:8px;min-width:130px;padding:.6rem .85rem;font-size:.85rem;box-shadow:0 4px 12px #667eea26}.wcpm-tooltip-date{color:#6c757d;margin-bottom:.2rem}.wcpm-tooltip-score{color:#333;font-size:1.1rem;font-weight:700}.wcpm-tooltip-mode{color:#6c757d;margin-top:.15rem;font-size:.8rem}.wcpm-tooltip-target{color:#667eea;margin-top:.25rem;font-size:.8rem;font-weight:600}.teacher-dashboard{background:#f0f2ff;min-height:100vh}.dash-header{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem 2rem;display:flex}.dash-title h1{color:#fff;margin:0;font-size:1.5rem}.dash-subtitle{color:#ffffffd9;font-size:.85rem}.dash-teacher{color:#ffffffe6;align-items:center;gap:.75rem;font-size:.9rem;display:flex}.dash-logout{color:#fff;cursor:pointer;background:#fff3;border:1px solid #fff6;border-radius:6px;padding:.3rem .75rem;font-size:.85rem;transition:background .2s}.dash-logout:hover{background:#ffffff4d}.dash-body{max-width:900px;margin:0 auto;padding:2rem}.dash-section-header{justify-content:space-between;align-items:center;margin-bottom:1.25rem;display:flex}.dash-section-header h2{color:#333;margin:0;font-size:1.3rem}.dash-new-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;border-radius:8px;padding:.55rem 1.1rem;font-size:.9rem;font-weight:700;transition:all .2s}.dash-new-btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px #667eea66}.dash-error{color:#dc3545;background:#dc35450f;border:1px solid #dc354533;border-radius:8px;margin-bottom:1rem;padding:.75rem 1rem}.dash-loading,.dash-empty{text-align:center;color:#6c757d;padding:3rem}.dash-empty p{margin-bottom:1rem}.class-cards{flex-direction:column;gap:.75rem;display:flex}.class-card{background:#fff;border:2px solid #e0e7ff;border-radius:12px;align-items:center;gap:1rem;padding:1.25rem 1.5rem;transition:all .2s;display:flex}.class-card:hover{border-color:#667eea;box-shadow:0 4px 16px #667eea1f}.class-card-level{flex-shrink:0;font-size:2.2rem}.class-card-info{flex:1;min-width:0}.class-card-info h3{color:#333;margin:0 0 .35rem;font-size:1.05rem;font-weight:700}.class-card-meta{color:#6c757d;align-items:center;gap:.75rem;font-size:.85rem;display:flex}.class-code-badge{color:#667eea;letter-spacing:.05em;background:#e0e7ff;border-radius:6px;padding:.15rem .5rem;font-family:monospace;font-size:.8rem;font-weight:700}.class-card-actions{flex-shrink:0;gap:.5rem;display:flex}.class-action-btn{color:#667eea;cursor:pointer;background:#fff;border:2px solid #e0e7ff;border-radius:7px;padding:.4rem .85rem;font-size:.85rem;font-weight:600;transition:all .2s}.class-action-btn:hover{color:#fff;background:#667eea;border-color:#667eea}.class-action-btn.danger{color:#dc3545;border-color:#f8d7da}.class-action-btn.danger:hover{color:#fff;background:#dc3545;border-color:#dc3545}.class-action-btn.primary{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-color:#0000}.class-action-btn.primary:hover{opacity:.88;color:#fff}.dash-back-btn{color:#ffffffd9;cursor:pointer;background:0 0;border:none;padding:0;font-size:.9rem;font-weight:600}.dash-back-btn:hover{color:#fff}.dash-breadcrumb{color:#fff;margin-left:.5rem;font-size:1.1rem;font-weight:700}.dash-count{color:#adb5bd;font-size:.88rem}.student-list{flex-direction:column;gap:.5rem;display:flex}.student-row{background:#fff;border:2px solid #e0e7ff;border-radius:10px;align-items:center;gap:.75rem;padding:.6rem .75rem .6rem 1.25rem;transition:all .18s;display:flex}.student-row:hover{border-color:#667eea;box-shadow:0 3px 12px #667eea1f}.student-row-main{cursor:pointer;text-align:left;background:0 0;border:none;flex-direction:column;flex:1;gap:.2rem;min-width:0;padding:.4rem 0;display:flex}.student-row-main:hover .student-pseudonym{color:#667eea}.student-pseudonym{color:#333;font-size:1rem;font-weight:700;transition:color .15s}.student-wcpm-mini{color:#6c757d;font-variant-numeric:tabular-nums;font-size:.8rem}.student-level-controls{flex-shrink:0;align-items:center;gap:.25rem;display:flex}.student-level-badge{color:#495057;white-space:nowrap;background:#f0f2ff;border-radius:6px;padding:.2rem .5rem;font-size:.8rem;font-weight:600}.student-level-btn{cursor:pointer;color:#667eea;background:0 0;border:1px solid #dee2e6;border-radius:5px;flex-shrink:0;justify-content:center;align-items:center;width:1.65rem;height:1.65rem;font-size:.85rem;transition:all .15s;display:flex}.student-level-btn:hover:not(:disabled){color:#fff;background:#667eea;border-color:#667eea}.student-level-btn:disabled{color:#dee2e6;cursor:default;border-color:#f0f2ff}.student-chevron-btn{cursor:pointer;color:#adb5bd;background:0 0;border:none;flex-shrink:0;padding:0 .25rem;font-size:1.3rem;transition:color .15s}.student-chevron-btn:hover{color:#667eea}.session-list{flex-direction:column;gap:.6rem;display:flex}.session-card{background:#fff;border:2px solid #e0e7ff;border-radius:12px;transition:border-color .18s;overflow:hidden}.session-card.open{border-color:#667eea}.session-summary{cursor:pointer;text-align:left;background:0 0;border:none;justify-content:space-between;align-items:center;gap:1rem;width:100%;padding:1rem 1.25rem;display:flex}.session-summary:hover{background:#f8f9ff}.session-summary-left{flex-wrap:wrap;flex:1;align-items:center;gap:.75rem;display:flex}.session-date{color:#6c757d;white-space:nowrap;font-size:.88rem}.session-passage{color:#333;font-size:.88rem;font-weight:600}.session-mode-badge{border-radius:20px;padding:.15rem .5rem;font-size:.75rem;font-weight:700}.session-mode-badge.timed{color:#856404;background:#fff3cd}.session-mode-badge.full{color:#0c5460;background:#d1ecf1}.session-summary-right{flex-shrink:0;align-items:center;gap:.75rem;display:flex}.session-overall{font-size:1.4rem;font-weight:700}.session-chevron{color:#adb5bd;font-size:1.2rem}.session-scores{border-top:1px solid #f0f2ff;flex-direction:column;gap:.6rem;padding:1rem 1.25rem 1.25rem;display:flex}.score-row{align-items:center;gap:.75rem;display:flex}.score-row.highlight{border-top:1px solid #f0f2ff;margin-top:.4rem;padding-top:.6rem}.score-row.highlight .score-row-label{color:#333;font-weight:700}.score-row.highlight .score-row-value{font-size:1.05rem;font-weight:700}.score-row-label{color:#6c757d;flex-shrink:0;width:110px;font-size:.85rem}.score-row-value{text-align:right;flex-shrink:0;width:52px;font-size:.9rem;font-weight:600}.score-row-bar{background:#f0f2ff;border-radius:4px;flex:1;height:8px;overflow:hidden}.score-row-fill{border-radius:4px;height:100%;transition:width .4s}.passage-filters{flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem;display:flex}.passage-filter-btn{color:#6c757d;cursor:pointer;background:#fff;border:2px solid #e0e7ff;border-radius:20px;padding:.3rem .85rem;font-size:.85rem;font-weight:600;transition:all .15s}.passage-filter-btn:hover{color:#667eea;border-color:#667eea}.passage-filter-btn.active{color:#fff;background:#667eea;border-color:#667eea}.passage-list{flex-direction:column;gap:.5rem;display:flex}.passage-row{background:#fff;border:2px solid #e0e7ff;border-radius:10px;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem 1.25rem;transition:border-color .15s;display:flex}.passage-row:hover{border-color:#667eea}.passage-row-left{flex:1;align-items:center;gap:.75rem;min-width:0;display:flex}.passage-level-emoji{flex-shrink:0;font-size:1.5rem}.passage-info{flex-direction:column;gap:.15rem;min-width:0;display:flex}.passage-title{color:#333;white-space:nowrap;text-overflow:ellipsis;font-size:.95rem;font-weight:700;overflow:hidden}.passage-meta{color:#6c757d;font-size:.8rem}.passage-tier-badge{border-radius:20px;flex-shrink:0;padding:.2rem .6rem;font-size:.75rem;font-weight:700}@media (width<=600px){.session-passage{display:none}.dash-body{padding:1.25rem}.class-card{flex-wrap:wrap}.class-card-actions{width:100%}}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.app{flex-direction:column;align-items:center;min-height:100vh;padding:1rem;display:flex}.container{background:#fff;border-radius:16px;flex:1;width:100%;max-width:80vw;overflow:hidden;box-shadow:0 20px 40px #00000026}.header{color:#fff;background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%);padding:2rem}.header-content{justify-content:space-between;align-items:center;display:flex}.header h1{margin-bottom:.4rem;font-size:2.4rem;font-weight:700}.header p{opacity:.9;font-size:1.05rem}.main-content{padding:2rem}.mode-selector{margin-bottom:2rem}.mode-selector h2{color:#333;margin-bottom:1.25rem;font-size:1.5rem}.mode-cards{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.mode-card{text-align:center;cursor:pointer;background:#fff;border:2px solid #e0e7ff;border-radius:14px;padding:1.75rem 1.5rem;transition:all .25s;position:relative}.mode-card:hover:not(.active){border-color:#667eea;transform:translateY(-2px);box-shadow:0 8px 24px #667eea26}.mode-card.active{background:linear-gradient(135deg,#f0f2ff 0%,#e8eaff 100%);border-color:#667eea;box-shadow:0 8px 24px #667eea33}.mode-card-icon{margin-bottom:.6rem;font-size:2.5rem}.mode-card h3{color:#333;margin-bottom:.4rem;font-size:1.15rem;font-weight:700}.mode-card p{color:#6c757d;margin:0;font-size:.88rem;line-height:1.45}.mode-selected-badge{color:#fff;letter-spacing:.04em;text-transform:uppercase;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border-radius:20px;margin-top:.75rem;padding:.2rem .7rem;font-size:.75rem;font-weight:700;display:inline-block}.grade-selector{margin-bottom:2rem}.grade-selector h2{color:#333;margin-bottom:1.25rem;font-size:1.5rem}.grade-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin-bottom:1rem;display:grid}.grade-card{text-align:center;cursor:pointer;background:#fff;border:2px solid #e0e7ff;border-radius:12px;padding:1.5rem;transition:all .3s;position:relative}.grade-card:hover:not(.disabled){border-color:#4facfe;transform:translateY(-3px);box-shadow:0 10px 30px #4facfe40}.grade-card.disabled{opacity:.55;cursor:not-allowed}.grade-emoji{margin-bottom:.5rem;font-size:2.5rem}.grade-card h3{color:#333;margin-bottom:.25rem;font-size:1.1rem}.grade-card p{color:#6c757d;margin-bottom:.25rem;font-size:.85rem}.grade-description{line-height:1.3;color:#adb5bd!important;font-size:.8rem!important}.coming-soon{color:#6c757d;background:#f8f9fa;border:1px solid #dee2e6;border-radius:20px;margin-top:.5rem;padding:.2rem .6rem;font-size:.75rem;font-weight:600;display:inline-block}.azure-notice{background:#f0f7ff;border:2px solid #b8d9f8;border-radius:12px;margin-top:1.5rem;padding:1.5rem}.azure-notice h3{color:#1a73e8;margin-bottom:.5rem;font-size:1.1rem}.azure-notice p{color:#555;font-size:.95rem;line-height:1.5}.config-warning{color:#856404;background:#fff3cd;border:1px solid #ffc107;border-radius:8px;margin-top:1rem;padding:.75rem 1rem;font-size:.9rem;line-height:1.5}.config-warning code{background:#00000014;border-radius:3px;padding:.1rem .35rem;font-family:monospace;font-size:.85em}@media (width<=768px){.app{padding:.5rem}.container{border-radius:0;max-width:100%;min-height:100vh}.header{padding:1.5rem}.header h1{font-size:2rem}.main-content{padding:1.5rem}.grade-grid{grid-template-columns:1fr 1fr}.mode-card{padding:1.25rem 1rem}.mode-card-icon{font-size:2rem}}@media (width<=480px){.header h1{font-size:1.7rem}.main-content{padding:1rem}.grade-grid{grid-template-columns:1fr}}