.reader-shell{min-height:100vh;display:flex;flex-direction:column;background:var(--app-page, #f6f4fb);font-family:inherit}.reader-navbar{position:sticky;top:0;z-index:40;background:var(--app-surface, #fff);border-bottom:1px solid var(--app-border, #e2e8f0);display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.25rem}.reader-nav-left{display:flex;align-items:center;gap:1rem}.reader-back-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.5rem .85rem;background:var(--app-surface, #fff);border:1px solid var(--app-border, #e2e8f0);box-shadow:0 1px 3px #0f172a0d;border-radius:10px;font-weight:700;font-size:.9rem;cursor:pointer;text-decoration:none;color:var(--app-text, #0f172a);transition:transform .1s}.reader-back-btn:hover{transform:translate(-1px,-1px)}.reader-context-title{font-size:1.15rem;font-weight:600;margin:0;max-width:450px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reader-nav-right{display:flex;align-items:center;gap:1rem}.reader-progress-pill{display:inline-flex;align-items:center;gap:.5rem;background:var(--app-accent-soft, #ede9fe);border:1px solid var(--app-border, #e2e8f0);border-radius:10px;padding:.35rem .85rem;font-weight:600;font-size:.85rem}.reader-toggle-toc-btn{display:inline-flex;align-items:center;gap:.35rem;padding:.5rem .85rem;background:var(--app-surface, #fff);border:1px solid var(--app-border, #e2e8f0);box-shadow:0 1px 3px #0f172a0d;border-radius:10px;font-weight:700;font-size:.9rem;cursor:pointer}.reader-body{display:flex;flex:1;position:relative}.reader-sidebar{order:1;width:300px;min-width:300px;background:var(--app-surface, #fff);border-left:1px solid var(--app-border, #e2e8f0);display:flex;flex-direction:column;height:calc(100dvh - 72px);position:sticky;top:72px;overflow-y:auto}.reader-sidebar.collapsed{display:none}.reader-sidebar-header{padding:1rem 1.25rem;border-bottom:1px solid var(--app-border, #e2e8f0);background:var(--app-page, #f9fafb)}.reader-sidebar-title{font-size:1.1rem;font-weight:600;margin:0 0 .25rem}.reader-sidebar-subtitle{font-size:.8125rem;color:var(--app-text-secondary, #6b7280);font-weight:600;margin:0}.reader-toc-tree{padding:.75rem 0;list-style:none;margin:0}.reader-toc-lesson-group{margin-bottom:.5rem}.reader-toc-lesson-header{padding:.6rem 1.25rem;font-weight:600;font-size:.9rem;color:var(--app-text-secondary, #374151);background:var(--app-surface-soft, #f3f4f6);border-top:1px solid var(--app-border, #e5e7eb);border-bottom:1px solid var(--app-border, #e5e7eb)}.reader-toc-item-row{display:flex;align-items:center;justify-content:space-between;padding:.65rem 1.25rem;cursor:pointer;border-left:4px solid transparent;transition:background .15s}.reader-toc-item-row:hover{background:var(--app-accent-soft, #E8F3F1)}.reader-toc-item-row.active{background:var(--app-accent-soft, #E8F3F1);border-left-color:var(--app-primary, #174D53);font-weight:600}.reader-toc-item-left{display:flex;align-items:center;gap:.6rem;flex:1;min-width:0}.reader-toc-item-title{font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.reader-main-area{flex:1;padding:2rem 3rem 5rem;max-width:900px;margin:0 auto}.reader-lecture-card{background:var(--app-surface, #fff);border:1px solid var(--app-border, #e2e8f0);box-shadow:0 8px 28px #0f172a0d;border-radius:16px;padding:2.25rem;margin-bottom:2rem;-webkit-user-select:text;-moz-user-select:text;user-select:text;-webkit-touch-callout:default}.reader-lecture-title{font-size:2rem;font-weight:700;margin:0 0 1rem;color:var(--app-text, #0f172a);line-height:1.25;-webkit-user-select:text;-moz-user-select:text;user-select:text;-webkit-touch-callout:default}.reader-lecture-body{font-size:1.05rem;line-height:1.7;color:var(--app-text, #1f2937);margin-bottom:2rem;-webkit-user-select:text;-moz-user-select:text;user-select:text;-webkit-touch-callout:default}.reader-lecture-body table{display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.reader-lecture-body pre{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}.reader-lecture-body img{max-width:100%;height:auto}.reader-lecture-body p{margin-bottom:1.2rem}.reader-video-container{margin:2rem 0;border:1px solid var(--app-border, #e2e8f0);box-shadow:0 4px 12px #6d28d91f;border-radius:16px;overflow:hidden;position:relative;padding-bottom:56.25%;height:0}.reader-video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.reader-attachments-box{background:var(--app-page, #f8fafc);border:1px solid var(--app-border, #e2e8f0);border-radius:16px;padding:1.25rem;margin-bottom:2rem}.reader-attachments-title{font-size:1rem;font-weight:600;margin:0 0 .75rem}.reader-attachment-item{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;background:var(--app-surface, #fff);border:1px solid var(--app-border, #e2e8f0);border-radius:10px;margin-bottom:.5rem;font-size:.88rem;font-weight:600}.reader-action-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:1.5rem;border-top:1px solid var(--app-border, #e2e8f0)}.reader-nav-step-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.65rem 1.25rem;background:var(--app-surface, #fff);border:1px solid var(--app-border, #e2e8f0);box-shadow:0 1px 3px #0f172a0d;border-radius:16px;font-weight:600;font-size:.9rem;cursor:pointer;text-decoration:none;color:var(--app-text, #0f172a)}.reader-complete-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.75rem 1.75rem;border:1px solid var(--app-border, #e2e8f0);box-shadow:0 4px 12px #6d28d91f;border-radius:16px;font-weight:700;font-size:1rem;cursor:pointer;transition:transform .1s}.complete-btn-normal{background:var(--app-primary, #2563EB);color:var(--app-primary-text, #ffffff)}.complete-btn-completed{background:var(--app-success-surface, #E2F6EC);color:var(--app-success-text, #115E38);cursor:default}.complete-btn-submitting{background:var(--app-primary, #2563EB);color:var(--app-primary-text, #ffffff);cursor:wait}.complete-btn-error{background:var(--app-danger, #C9352B);color:#fff}.reader-quiz-intro-card{background:var(--app-surface, #fff);border:1px solid var(--app-border, #e2e8f0);box-shadow:0 8px 28px #0f172a0d;border-radius:16px;padding:2.5rem;text-align:center}.reader-quiz-intro-title{font-size:1.85rem;font-weight:700;margin:0 0 1rem}.reader-quiz-rules-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1rem;margin:1.5rem 0 2rem}.reader-quiz-rule-card{background:var(--app-accent-soft, #f5f3ff);border:1px solid var(--app-border, #e2e8f0);border-radius:16px;padding:.85rem}.reader-quiz-rule-val{font-size:1.25rem;font-weight:700}.reader-quiz-rule-label{font-size:.8125rem;color:var(--app-text-secondary, #4b5563);font-weight:700}.reader-start-quiz-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 2.25rem;background:var(--app-primary);color:var(--app-primary-text);border:1px solid var(--app-border, #e2e8f0);box-shadow:0 4px 12px #6d28d91f;border-radius:16px;font-weight:700;font-size:1.1rem;cursor:pointer}.reader-start-quiz-btn:hover{transform:translate(-1px,-1px);box-shadow:0 8px 28px #0f172a0d}@media(max-width:1024px){.reader-sidebar{position:fixed;inset:0 0 0 auto;height:100vh;height:100dvh;z-index:100;background:var(--app-surface, #ffffff);box-shadow:-4px 0 24px #0f172a26;transform:translate(0);transition:transform .25s ease}.reader-sidebar.collapsed{display:flex;transform:translate(100%);pointer-events:none}.reader-sidebar-backdrop{position:fixed;inset:0;background:#0f172a80;z-index:90}}@media(max-width:640px){.reader-main-area{padding:1.25rem 1rem 4rem}.reader-lecture-card{padding:1.25rem}.reader-action-bar{flex-direction:column-reverse;gap:.75rem;width:100%}.reader-action-bar>*{width:100%;justify-content:center}.reader-complete-btn,.reader-nav-step-btn{width:100%;justify-content:center;box-sizing:border-box}.reader-context-title{max-width:180px}}.reader-shell{color:var(--app-text, #172B30)}.reader-shell button,.reader-shell input,.reader-shell textarea{font-family:inherit}.reader-navbar{min-height:72px;gap:16px}.reader-nav-left{min-width:0;flex:1}.reader-context-title{color:var(--app-text, #172B30)}.reader-nav-right{flex-shrink:0}.reader-back-btn,.reader-toggle-toc-btn,.reader-nav-step-btn{min-height:44px;color:var(--app-text-secondary, #52656A)}.reader-back-btn:hover,.reader-toggle-toc-btn:hover,.reader-nav-step-btn:hover{background:var(--app-accent-soft, #E8F3F1);border-color:var(--app-border-strong, #BCCBC1);transform:none}.reader-progress-pill{color:var(--app-accent-text, #174D53);border-color:var(--app-border, #D8E2DB);font-variant-numeric:tabular-nums}.reader-progress-pill svg{color:var(--app-accent-text, #174D53)}.reader-content-progress{margin-bottom:12px}.reader-sidebar-title{color:var(--app-text, #172B30)}.reader-sidebar-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:20px}.reader-sidebar-close{display:none}.reader-toc-tree{padding:12px}.reader-toc-lesson-header{background:transparent;border:0;padding:12px 8px;color:var(--app-text-secondary, #52656A)}.reader-toc-item-row{width:100%;min-height:48px;border:1px solid transparent;border-radius:10px;padding:10px;margin-bottom:6px;background:transparent;text-align:left;font:inherit;box-shadow:none;gap:8px}.reader-toc-item-row.active{border-color:var(--app-border, #D8E2DB);color:var(--app-accent-text, #174D53)}.reader-toc-item-title{white-space:normal;overflow-wrap:anywhere;line-height:1.5}.reader-required{flex-shrink:0;border-radius:6px;padding:2px 6px;font-size:var(--type-caption);font-weight:600;background:var(--app-surface-soft, #F5F2E6);color:var(--app-text-secondary, #52656A)}.reader-main-area{width:100%;min-width:0;max-width:1040px;padding:32px clamp(20px,3vw,48px) 64px}.reader-lecture-title,.reader-quiz-intro-title{color:var(--app-text, #172B30);font-size:clamp(24px,2.5vw,32px);line-height:1.35;overflow-wrap:anywhere}.reader-quiz-intro-card{padding:clamp(24px,4vw,48px)}.reader-quiz-intro-icon{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 20px;border-radius:18px;background:var(--app-accent-soft, #E8F3F1);color:var(--app-accent-text, #174D53)}.reader-quiz-rule-card{background:var(--app-page, #FFFDF4);border-color:var(--app-border, #D8E2DB);padding:18px}.reader-quiz-rule-val{color:var(--app-accent-text, #174D53);margin-bottom:4px;font-variant-numeric:tabular-nums}.reader-start-quiz-btn,.reader-complete-btn{min-height:48px;color:var(--app-primary-text, #fff);background:var(--app-primary, #174D53);border-color:var(--app-primary, #174D53);border-radius:12px;font-weight:700;font-size:var(--type-body)}.reader-start-quiz-btn:hover,.reader-complete-btn:hover:not(:disabled){transform:none;background:var(--app-primary-hover, #1E6068);border-color:var(--app-primary-hover, #1E6068);box-shadow:0 4px 12px #174d5338}.reader-shell button:disabled{opacity:.6;cursor:not-allowed}.reader-complete-btn.complete-btn-completed{background:var(--app-success-surface, #E6F6F0);border-color:var(--app-success-border, #8ADABB);color:var(--app-success-text, #1B6B50);box-shadow:none;opacity:1}.reader-complete-btn.complete-btn-error{background:var(--app-danger);border-color:var(--app-danger);color:var(--app-primary-text)}.reader-attachment-item{flex-wrap:wrap;gap:12px;overflow-wrap:anywhere}.reader-attachment-item img{flex-basis:100%}.reader-action-bar{flex-wrap:wrap}.reader-sidebar-backdrop{display:none}.reader-result-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.reader-status-card{max-width:600px;margin:48px auto;padding:24px;border:1px solid var(--app-border, #D8E2DB);border-radius:16px;background:var(--app-surface, #fff);color:var(--app-text-secondary, #52656A);text-align:center;line-height:1.6}.reader-attempt-summary{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-bottom:24px;color:var(--app-text-secondary, #52656A);font-size:var(--type-label)}.reader-attempt-summary p{margin:0}.reader-attempt-timer{padding:8px 12px;border-radius:10px;background:var(--app-accent-soft, #E8F3F1);color:var(--app-accent-text, #174D53);font-weight:700;font-variant-numeric:tabular-nums}.reader-attempt-question{min-width:0;margin:0 0 24px;padding:20px;border:1px solid var(--app-border, #D8E2DB);border-radius:16px;background:var(--app-surface, #fff);text-align:left}.reader-attempt-question-title{margin:0 0 16px;font-size:var(--type-body);line-height:1.6;font-weight:600;color:var(--app-text, #172B30);overflow-wrap:anywhere}.reader-attempt-options{display:grid;gap:10px;margin-top:16px}.reader-attempt-option{display:flex;align-items:flex-start;gap:12px;padding:14px;border:1px solid var(--app-border, #D8E2DB);border-radius:12px;background:var(--app-page, #FFFDF4);color:var(--app-text-secondary, #52656A);line-height:1.5;cursor:pointer;overflow-wrap:anywhere}.reader-attempt-option:has(input:checked){background:var(--app-accent-soft, #E8F3F1);border-color:var(--app-primary, #174D53);color:var(--app-accent-text, #174D53);font-weight:600}.reader-attempt-option input{margin-top:4px;flex-shrink:0;accent-color:var(--app-primary, #174D53);width:18px;height:18px}.reader-attempt-answer{width:100%;min-height:48px;border:1px solid var(--app-border, #D8E2DB);border-radius:12px;padding:12px;font-size:var(--type-body);background:var(--app-surface, #fff);color:var(--app-text, #172B30)}.reader-shell button:focus-visible,.reader-shell a:focus-visible,.reader-shell input:focus-visible{outline:2px solid var(--app-primary, #174D53);outline-offset:3px}@media(max-width:1024px){.reader-sidebar{width:min(340px,calc(100vw - 32px));min-width:0;border-right:0;border-left:1px solid var(--app-border, #e2e8f0)}.reader-sidebar-backdrop{display:block}.reader-sidebar-close{display:grid;place-items:center;flex-shrink:0;width:40px;height:40px;border:1px solid var(--app-border, #e2e8f0);border-radius:10px;background:var(--app-surface, #fff);color:var(--app-text-secondary, #475569)}}@media(max-width:640px){.reader-navbar{padding:10px 12px;flex-wrap:nowrap;gap:8px;min-height:0}.reader-nav-left{flex-basis:auto;gap:10px}.reader-back-btn{flex-shrink:0;white-space:nowrap;padding:8px;font-size:13px}.reader-back-btn svg{flex-shrink:0}.reader-context-title{max-width:none;min-width:0;font-size:var(--type-body)}.reader-nav-right{width:auto;gap:8px}.reader-progress-pill{font-size:var(--type-caption)}.reader-toggle-toc-btn{width:40px;min-height:40px;padding:8px;justify-content:center}.reader-main-area{padding:16px 12px calc(96px + env(safe-area-inset-bottom,0px))}.reader-quiz-intro-card,.reader-lecture-card{padding:20px 16px;border-radius:12px}.reader-quiz-intro-title{font-size:20px}.reader-quiz-intro-icon{width:48px;height:48px;margin-bottom:16px;border-radius:12px}.reader-quiz-rules-grid{margin:16px 0}.reader-quiz-rule-card{padding:12px;border-radius:10px}.reader-start-quiz-btn{width:100%;justify-content:center;padding:12px 16px}.reader-quiz-playing-card{padding:12px}.reader-attempt-summary{align-items:center;gap:8px;margin-bottom:16px}.reader-attempt-timer{white-space:nowrap;padding:8px}.reader-attempt-question{padding:14px 0;margin-bottom:16px;border:0;border-bottom:1px solid var(--app-border);border-radius:0}.reader-attempt-question-title{font-size:15px;line-height:1.55}.reader-attempt-option{padding:12px;gap:10px;font-size:14px;color:var(--app-text)}.reader-attempt-option span{min-width:0}.reader-result-actions>*{width:100%;justify-content:center}}@media(prefers-reduced-motion:reduce){.reader-sidebar,.reader-shell button{transition:none}}
