:root{--bg-primary: #ffffff;--bg-secondary: #F8FAFC;--bg-tertiary: #F1F5F9;--text-primary: #0F172A;--text-secondary: #475569;--text-tertiary: #94A3B8;--border: #CBD5E1;--border-light: #E2E8F0;--border-strong: #94A3B8;--c-primary: #2E6FE1;--c-primary-dark: #1E40AF;--c-primary-bg: #DBEAFE;--c-primary-border: #BFDBFE;--c-amber: #92400E;--c-amber-bg: #FEF3C7;--c-green: #15803D;--c-green-bg: #ECFDF5;--c-green-border: #86EFAC;--c-red: #991B1B;--c-red-bg: #FEE2E2;--c-purple: #1E40AF;--c-purple-bg: #EFF6FF;--c-pink: #991B1B;--c-pink-bg: #FEE2E2;--c-blue: #1E40AF;--c-blue-bg: #DBEAFE;--c-teal: #15803D;--c-teal-bg: #ECFDF5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;font-family:-apple-system,BlinkMacSystemFont,PingFang SC,Microsoft YaHei,Helvetica Neue,sans-serif;font-size:14px;line-height:1.7;color:var(--text-primary);background:var(--bg-tertiary);-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer;border:none;border-radius:6px;padding:6px 16px;font-size:13px;font-weight:500;transition:all .15s}button:hover:not(:disabled){opacity:.88;transform:translateY(-1px)}button:active:not(:disabled){transform:translateY(0)}button:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:#2e6fe1;color:#fff;font-weight:500;padding:8px 20px;font-size:14px}.btn-ghost{background:#fff;color:var(--c-blue);border:1px solid var(--c-blue);padding:6px 14px}.btn-pink{background:#fff;color:var(--c-pink);border:1px solid var(--c-pink);padding:6px 14px}.app{display:flex;flex-direction:column;height:100vh;overflow:hidden}.topbar{display:flex;align-items:center;gap:16px;padding:12px 20px;background:#fff;border-bottom:1px solid var(--border-light);flex-shrink:0;box-shadow:0 1px 3px #0000000a;height:56px}.topbar .logo{font-weight:600;font-size:17px;color:var(--c-primary-dark);letter-spacing:-.3px}.topbar .spacer{flex:1}.topbar .logo-mark{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:var(--c-primary);color:#fff;border-radius:5px;font-weight:700;font-size:13px;margin-right:8px;vertical-align:middle}.topbar .breadcrumb{font-size:13px;color:var(--text-secondary)}.topbar .breadcrumb .bc-course{color:var(--c-amber);font-weight:600}.topbar .breadcrumb .bc-sep{color:var(--text-tertiary);margin:0 6px}.topbar .breadcrumb .bc-lesson{color:var(--text-primary);font-weight:500}.topbar .badge{border-radius:6px;padding:4px 12px;font-size:13px;font-weight:500}.badge.amber,.badge.pink{background:var(--c-amber-bg);color:var(--c-amber)}.badge.teal{background:var(--c-primary-bg);color:var(--c-primary-dark)}.progress-bar{display:flex;align-items:center;gap:12px;padding:8px 20px;background:var(--bg-tertiary);border-bottom:1px solid var(--border-light);flex-shrink:0}.progress-bar .track{height:8px;flex:1;background:var(--c-purple-bg);border-radius:4px;overflow:hidden}.progress-bar .fill{height:100%;background:linear-gradient(90deg,#1d9e75,#2db389);transition:width .4s}.progress-bar .label{font-size:12px;color:var(--text-secondary);white-space:nowrap}.main{display:flex;flex:1;min-height:0}.sidebar{width:260px;border-right:1px solid var(--border-light);background:#fafaf8;overflow-y:auto;padding:16px 12px;flex-shrink:0}.sidebar .title{font-size:12px;color:var(--text-tertiary);font-weight:500;margin-bottom:12px;padding-left:6px;text-transform:uppercase;letter-spacing:.5px}.course-group{margin-bottom:10px}.course-header{font-size:14px;font-weight:500;padding:8px 10px;border-radius:6px;cursor:pointer;transition:background .15s}.course-header:hover{background:var(--bg-secondary)}.course-header.completed{color:var(--c-amber);background:var(--c-amber-bg)}.course-header.active{color:var(--c-amber);background:var(--c-amber-bg);font-weight:600}.course-header.pending{color:var(--text-secondary);background:transparent}.course-header.locked{color:var(--text-tertiary)}.lesson-item{font-size:13px;padding:7px 12px 7px 28px;border-radius:5px;cursor:pointer;color:var(--text-secondary);transition:all .15s;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.lesson-item:hover{background:var(--bg-secondary);color:var(--text-primary)}.lesson-item.completed{color:var(--text-tertiary)}.lesson-item.completed:before{content:"✓ ";color:var(--c-teal);font-weight:600}.lesson-item.active{background:var(--c-blue-bg);color:var(--c-blue);border-left:3px solid #2E6FE1;padding-left:25px;font-weight:600}.lesson-item.locked{color:var(--border);cursor:not-allowed}.sidebar .tip{margin-top:16px;padding:10px 12px;background:var(--bg-tertiary);border-radius:6px;border:1px solid var(--border-light)}.sidebar .tip .tip-title{font-weight:600;color:var(--text-secondary);margin-bottom:4px;font-size:12px}.sidebar .tip .tip-body{color:var(--text-tertiary);font-size:11px;line-height:1.5}.center-pane{flex:1;display:flex;flex-direction:column;background:#fff;min-width:0}.editor-pane{flex:65;display:flex;flex-direction:column;background:#fbfbf9;border-bottom:1px solid var(--border-light);min-height:0}.editor-tabs{display:flex;align-items:center;gap:10px;padding:8px 16px;border-bottom:1px solid var(--border-light);background:var(--bg-secondary);flex-shrink:0;height:40px}.editor-tabs .lang-tag{background:#2e6fe1;color:#fff;border-radius:4px;padding:2px 10px;font-size:11px;font-weight:600;letter-spacing:.5px}.editor-tabs .filename{font-size:13px;font-weight:500;color:var(--text-primary)}.editor-tabs .spacer{flex:1}.editor-tabs .hint{font-size:11px;color:var(--text-secondary)}.editor-container{flex:1;min-height:0}.editor-toolbar{display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid var(--border-light);background:var(--bg-secondary);flex-shrink:0;height:52px}.editor-toolbar .spacer{flex:1}.editor-toolbar .meta{font-size:12px;color:var(--text-secondary)}.result-pane{flex:35;display:flex;flex-direction:column;background:#fff;min-height:0}.result-pane-header{display:flex;align-items:center;gap:12px;padding:8px 16px;border-bottom:1px solid var(--border-light);background:var(--bg-secondary);flex-shrink:0;height:40px}.result-pane-header .title{font-size:13px;font-weight:600;color:var(--text-primary)}.result-pane-header .status{font-size:12px}.result-pane-header .status.ok{color:var(--c-teal);font-weight:500}.result-pane-header .status.fail{color:var(--c-red);font-weight:500}.result-pane-header .spacer{flex:1}.result-pane-header .meta{font-size:12px;color:var(--text-tertiary)}.result-body{flex:1;padding:12px 16px;overflow:auto;min-height:0}.right-pane{width:420px;border-left:1px solid var(--border-light);background:#fafaf8;display:flex;flex-direction:column;flex-shrink:0;overflow:hidden}.task-card{padding:16px 20px;flex:1;overflow-y:auto;min-height:0}.task-card .label{font-size:12px;color:var(--text-tertiary);font-weight:500;margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.task-card .body{font-size:14px;line-height:1.7;color:var(--text-primary)}.term-card code{background:var(--bg-secondary);padding:2px 8px;border-radius:4px;color:var(--c-purple);font-weight:600;font-size:12px;margin-right:4px}.term-hint{margin-top:10px;font-size:13px;color:#633806;background:var(--c-amber-bg);border-radius:6px;padding:8px 12px;line-height:1.5}.guide-section{background:var(--bg-primary);border:1px solid var(--border-light);border-radius:8px;margin-bottom:14px;overflow:hidden}.guide-header{display:flex;justify-content:space-between;align-items:center;padding:8px 14px;cursor:pointer;background:var(--c-primary-bg);-webkit-user-select:none;user-select:none}.guide-header:hover{background:var(--c-primary-bg);opacity:.85}.guide-title{font-size:13px;font-weight:600;color:var(--c-primary-dark)}.guide-toggle{font-size:11px;color:var(--c-primary-dark);font-weight:500}.guide-body{padding:14px 16px}.guide-block{margin-bottom:14px}.guide-block:last-child{margin-bottom:0}.guide-label{font-size:12px;font-weight:600;color:var(--c-primary-dark);margin-bottom:6px;letter-spacing:.3px}.guide-text{font-size:13px;line-height:1.75;color:var(--text-primary)}.field-table{width:100%;border-collapse:collapse;font-size:12px}.field-table th,.field-table td{padding:8px 10px;border:1px solid var(--border-light);vertical-align:top;text-align:left;line-height:1.5}.field-table th{background:#7f77dd1a;font-weight:600;color:var(--text-secondary);font-size:11px;text-transform:uppercase;letter-spacing:.3px}.field-name{font-family:monospace;font-weight:700;color:var(--c-purple);white-space:nowrap;font-size:12px}.field-note{font-size:11px;color:var(--text-tertiary);margin-top:3px;line-height:1.4}.field-eg{font-family:monospace;font-size:11px;color:var(--text-secondary)}.knowledge-card{background:#ffffffb3;border:1px solid var(--border-light);border-radius:6px;padding:10px 12px;margin-bottom:8px}.knowledge-point{font-size:14px;font-weight:700;color:var(--c-primary-dark);margin-bottom:6px;font-family:SF Mono,Menlo,monospace}.knowledge-point.clickable{cursor:pointer;transition:color .15s}.knowledge-point.clickable:hover{color:var(--c-primary);text-decoration:underline}.knowledge-row{font-size:12px;line-height:1.7;color:var(--text-primary);margin-bottom:3px}.k-tag{display:inline-block;font-size:10px;font-weight:600;padding:1px 6px;border-radius:3px;background:var(--bg-secondary);color:var(--text-secondary);margin-right:6px;letter-spacing:.3px}.k-tag.k-caution{background:var(--c-amber-bg);color:var(--c-amber)}.k-tag.k-eg{background:var(--c-teal-bg);color:var(--c-teal)}.knowledge-row code{font-size:12px;background:var(--bg-secondary);padding:1px 6px;border-radius:3px;color:var(--c-blue);font-family:SF Mono,monospace}.example-card{background:var(--bg-primary);border:1px solid var(--c-green-border);border-radius:8px;padding:10px 12px;margin-bottom:10px}.example-title{font-size:13px;font-weight:600;color:var(--c-green);margin-bottom:6px}.example-explanation{font-size:12px;line-height:1.65;color:var(--text-secondary);margin:6px 0 8px}.example-code{background:#1e1e1e;border:none;border-radius:6px;padding:10px 12px;font-size:12px;font-family:SF Mono,Menlo,Consolas,monospace;line-height:1.65;color:#e0e0e0;white-space:pre-wrap;word-break:break-all;margin:6px 0;overflow-x:auto}.example-code .kw{color:#c586c0}.example-code .str{color:#ce9178}.example-code .cmt{color:#6a9955}.btn-load-example{background:var(--c-primary);color:#fff;border:none;border-radius:5px;padding:5px 14px;font-size:12px;font-weight:500;cursor:pointer;margin-top:4px}.btn-load-example:hover{background:var(--c-primary-dark)}.intro-block{background:#eff6ff;border-radius:8px;padding:12px 14px;border:1px dashed #BFDBFE}.intro-row{margin-bottom:12px}.intro-row:last-child{margin-bottom:0}.intro-q{font-size:12px;font-weight:700;color:#1e40af;margin-bottom:4px}.intro-a{font-size:13px;line-height:1.7;color:var(--text-primary)}.sql-structure{background:#1e1e1e;color:#e0e0e0;border-radius:6px;padding:10px 12px;font-size:12px;font-family:SF Mono,Menlo,Consolas,monospace;line-height:1.7;white-space:pre-wrap;word-break:break-all;margin:4px 0}.knowledge-point-row{display:flex;align-items:center;gap:10px;margin-bottom:8px}.pronunciation{font-size:11px;color:var(--text-tertiary);font-style:italic;background:var(--bg-secondary);padding:1px 8px;border-radius:10px}.knowledge-chinese{color:var(--c-teal);background:var(--c-teal-bg);padding:6px 8px;border-radius:4px;margin-top:4px}.case-chinese{background:var(--c-teal-bg);border-left:3px solid var(--c-teal);padding:8px 12px;border-radius:4px;margin:6px 0;font-size:13px;line-height:1.65;color:var(--c-teal);font-weight:500}.chinese-label{font-size:11px;color:var(--c-teal);font-weight:700;margin-right:4px;opacity:.7}.word-by-word{background:var(--bg-secondary);border-radius:6px;padding:8px 10px;margin:6px 0}.wbw-label{font-size:11px;font-weight:600;color:var(--text-tertiary);margin-bottom:6px}.wbw-row{display:flex;align-items:center;gap:8px;font-size:12px;line-height:1.6;margin-bottom:3px}.wbw-word{background:var(--c-primary-bg);color:var(--c-primary-dark);font-family:SF Mono,monospace;font-weight:600;font-size:11px;padding:1px 8px;border-radius:3px;white-space:nowrap}.wbw-arrow{color:var(--text-tertiary);font-size:11px}.wbw-meaning{color:var(--text-primary)}.term-card{margin-top:6px;padding:4px 0;font-size:13px;line-height:1.7}.term-card code{background:var(--bg-secondary);padding:2px 8px;border-radius:4px;color:var(--c-primary-dark);font-weight:600;font-size:12px;margin-right:6px}.term-zh{color:var(--text-secondary)}.term-card .eg{color:var(--text-tertiary);font-family:monospace;font-size:11px;margin-left:8px;margin-top:2px}.result-table{width:100%;border-collapse:collapse;font-size:13px;font-family:SF Mono,Menlo,Consolas,monospace}.result-table th,.result-table td{padding:8px 12px;border:1px solid var(--border-light);text-align:left;white-space:nowrap}.result-table th{background:var(--bg-secondary);font-weight:600;color:var(--text-secondary);font-size:12px}.result-table td.numeric{text-align:right}.result-empty{font-size:13px;color:var(--text-tertiary);padding:30px 0;text-align:center}.result-error{margin-top:12px;padding:12px 14px;background:var(--c-red-bg);border-left:3px solid var(--c-red);border-radius:6px;font-size:13px;color:var(--c-red);font-family:SF Mono,monospace;word-break:break-all;line-height:1.6}.result-meta{margin-top:12px;font-size:12px;color:var(--text-tertiary);padding-top:8px;border-top:1px dashed var(--border-light)}.test-list{margin-top:16px}.test-list .label{font-size:12px;font-weight:600;color:var(--text-primary);margin-bottom:6px;text-transform:uppercase;letter-spacing:.5px}.test-item{font-size:12px;padding:6px 12px;margin-bottom:4px;border-radius:5px;font-family:SF Mono,monospace;display:flex;align-items:flex-start;gap:8px}.test-item.pass{background:var(--c-green-bg);color:var(--c-green)}.test-item.fail{background:var(--c-red-bg);color:var(--c-red)}.test-item .icon{font-weight:700}.test-item .reason{font-size:11px;margin-top:2px;opacity:.85}.loading{display:inline-block;width:14px;height:14px;border:2px solid var(--border-light);border-top-color:#2e6fe1;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:5px;border:2px solid #fff}::-webkit-scrollbar-thumb:hover{background:var(--border)}.btn-ref-entry{background:var(--c-primary-bg);color:var(--c-primary-dark);border:1px solid var(--c-primary-border);border-radius:6px;padding:5px 12px;font-size:12px;font-weight:500;cursor:pointer;margin-left:12px;transition:all .15s}.btn-ref-entry:hover{background:var(--c-primary);color:#fff}.user-info{display:flex;align-items:center;gap:8px;margin-left:8px;padding-left:12px;border-left:1px solid var(--border-light)}.user-name{font-size:13px;font-weight:500;color:var(--text-primary)}.btn-logout{background:transparent;color:var(--text-tertiary);border:1px solid var(--border-light);border-radius:4px;padding:3px 10px;font-size:11px;cursor:pointer;transition:all .15s}.btn-logout:hover{color:var(--c-red);border-color:var(--c-red)}.loading-screen{display:flex;align-items:center;justify-content:center;height:100vh;font-size:14px;color:var(--text-tertiary)}.login-page{display:flex;align-items:center;justify-content:center;min-height:100vh;background:linear-gradient(135deg,#ebf3fc,#eff6ff,#f8fafc)}.login-card{background:#fff;border-radius:12px;padding:36px 40px;width:380px;box-shadow:0 8px 32px #1e40af14;border:1px solid var(--border-light)}.login-logo{display:flex;align-items:center;gap:10px;font-size:20px;font-weight:700;color:var(--c-primary-dark);margin-bottom:6px}.login-logo .logo-mark{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background:var(--c-primary);color:#fff;border-radius:6px;font-weight:700;font-size:15px}.login-subtitle{font-size:13px;color:var(--text-tertiary);margin-bottom:24px}.login-tabs{display:flex;gap:4px;margin-bottom:20px;background:var(--bg-tertiary);border-radius:8px;padding:3px}.login-tabs button{flex:1;background:transparent;color:var(--text-secondary);border:none;border-radius:6px;padding:8px;font-size:13px;font-weight:500;cursor:pointer;transition:all .15s}.login-tabs button.active{background:#fff;color:var(--c-primary-dark);box-shadow:0 1px 3px #00000014}.login-form{display:flex;flex-direction:column;gap:12px}.login-form input{padding:10px 14px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit;outline:none;transition:border .15s}.login-form input:focus{border-color:var(--c-primary)}.login-error{background:var(--c-red-bg);color:var(--c-red);padding:8px 12px;border-radius:6px;font-size:12px;border-left:3px solid var(--c-red)}.login-submit{margin-top:4px;width:100%;padding:10px;font-size:14px}.login-tip{margin-top:16px;text-align:center;font-size:12px;color:var(--text-tertiary)}.reference-page{min-height:100vh;background:var(--bg-secondary);padding:20px 32px 40px}.ref-header{display:flex;align-items:center;gap:16px;padding:16px 0;border-bottom:1px solid var(--border-light);margin-bottom:20px}.ref-title{font-size:20px;font-weight:700;color:var(--c-primary-dark);flex:1}.ref-tip{font-size:12px;color:var(--text-tertiary)}.ref-controls{display:flex;gap:16px;margin-bottom:24px;align-items:center;flex-wrap:wrap}.ref-search{flex:0 0 320px;padding:10px 14px;border:1px solid var(--border);border-radius:8px;font-size:14px;font-family:inherit;outline:none;transition:border .15s}.ref-search:focus{border-color:var(--c-primary)}.ref-categories{display:flex;gap:6px;flex-wrap:wrap}.ref-cat{background:#fff;border:1px solid var(--border-light);border-radius:16px;padding:5px 14px;font-size:12px;color:var(--text-secondary);cursor:pointer;transition:all .15s}.ref-cat:hover{border-color:var(--c-primary);color:var(--c-primary-dark)}.ref-cat.active{background:var(--c-primary);color:#fff;border-color:var(--c-primary)}.ref-content{max-width:1200px}.ref-group{margin-bottom:28px}.ref-group-title{font-size:15px;font-weight:700;color:var(--c-primary-dark);margin-bottom:12px;padding-bottom:6px;border-bottom:2px solid var(--c-primary-bg)}.ref-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:14px}.ref-card{background:#fff;border:1px solid var(--border-light);border-radius:10px;padding:14px 16px;transition:box-shadow .15s}.ref-card:hover{box-shadow:0 4px 12px #0000000f}.ref-card-header{display:flex;align-items:center;gap:10px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px dashed var(--border-light)}.ref-word{font-size:18px;font-weight:700;color:var(--c-primary-dark);font-family:SF Mono,Menlo,monospace}.ref-pron{font-size:12px;color:var(--text-tertiary);font-style:italic;flex:1}.ref-speak-btns{display:flex;gap:6px}.speak-btn{background:var(--c-primary);color:#fff;border:none;border-radius:14px;padding:4px 12px;font-size:12px;font-weight:500;cursor:pointer;transition:all .15s}.speak-btn:hover{background:var(--c-primary-dark);transform:scale(1.05)}.speak-btn.speak-zh{background:var(--c-amber)}.speak-btn.speak-zh:hover{opacity:.85}.ref-card-body{font-size:13px;line-height:1.7}.ref-row{margin-bottom:6px;display:flex;align-items:flex-start;gap:8px}.ref-row:last-child{margin-bottom:0}.ref-tag{display:inline-block;font-size:10px;font-weight:600;padding:1px 7px;border-radius:3px;background:var(--bg-tertiary);color:var(--text-secondary);flex-shrink:0;margin-top:2px;letter-spacing:.3px}.ref-tag.ref-caution{background:var(--c-amber-bg);color:var(--c-amber)}.ref-tag.ref-eg{background:var(--c-green-bg);color:var(--c-green)}.ref-tag.ref-zh-tag{background:var(--c-primary-bg);color:var(--c-primary-dark)}.ref-row code{background:var(--bg-tertiary);padding:1px 6px;border-radius:3px;font-size:12px;font-family:SF Mono,monospace;color:var(--c-primary-dark);word-break:break-all}.ref-example{display:block;padding:4px 8px;margin-top:2px}.ref-zh{background:var(--c-primary-bg);padding:6px 10px;border-radius:6px;color:var(--c-primary-dark);font-weight:500}.ref-empty{text-align:center;padding:60px 0;color:var(--text-tertiary);font-size:14px}.ref-footer{margin-top:32px;padding:16px 20px;background:var(--c-primary-bg);border-radius:8px;font-size:13px;color:var(--c-primary-dark);line-height:1.7}@media (max-width: 1024px){.right-pane{width:340px!important}.sidebar{width:220px!important}.reference-page{padding:16px 20px 32px}.ref-cards{grid-template-columns:1fr}}@media (max-width: 768px){.topbar{flex-wrap:wrap;padding:8px 12px;gap:6px}.topbar .logo{font-size:14px}.topbar .breadcrumb{display:none}.topbar .badge{font-size:10px;padding:3px 8px}.btn-ref-entry{font-size:11px;padding:4px 8px}.user-info{margin-left:4px;padding-left:8px}.user-name{font-size:11px}.main{flex-direction:column}.sidebar{width:100%!important;max-height:180px;border-right:none;border-bottom:1px solid var(--border-light);flex-shrink:0}.center-pane{width:100%!important;flex:1;min-height:400px}.right-pane{width:100%!important;border-left:none;border-top:1px solid var(--border-light);max-height:50vh}.editor-pane,.result-pane{flex:50!important;min-height:200px}.reference-page{padding:12px 12px 24px}.ref-header{flex-wrap:wrap;gap:8px;padding:12px 0}.ref-title{font-size:16px;width:100%}.ref-controls{flex-direction:column}.ref-search{flex:1;width:100%}.ref-cards{grid-template-columns:1fr}.ref-word{font-size:16px}.login-card{width:100%;margin:0 16px;padding:24px 20px}.login-logo{font-size:18px}.progress-bar .label{font-size:10px}}.btn-ref-entry .count-pill{display:inline-block;min-width:16px;height:16px;padding:0 5px;margin-left:4px;border-radius:8px;background:var(--c-red);color:#fff;font-size:10px;line-height:16px;font-weight:600}.mistake-review-page .mistake-list{max-width:960px;margin:0 auto;padding:8px 0 24px;display:flex;flex-direction:column;gap:12px}.mistake-card{background:var(--bg-primary);border:1px solid var(--border-light);border-radius:10px;padding:12px 16px;display:flex;flex-direction:column;gap:8px}.mistake-card.resolved{opacity:.62}.mistake-meta{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--text-secondary)}.mistake-meta .m-lesson{font-family:SF Mono,Menlo,Consolas,monospace;background:var(--bg-tertiary);color:var(--c-primary-dark);padding:2px 8px;border-radius:4px}.mistake-meta .m-time{color:var(--text-tertiary)}.mistake-meta .m-resolved{color:var(--c-green);background:var(--c-green-bg);padding:2px 8px;border-radius:4px;font-weight:600}.mistake-meta .m-review{background:var(--c-amber-bg);color:var(--c-amber);padding:2px 8px;border-radius:4px}.mistake-sql code{display:block;font-family:SF Mono,Menlo,Consolas,monospace;font-size:12px;color:var(--text-primary);background:var(--bg-secondary);padding:8px 10px;border-radius:6px;white-space:pre-wrap;word-break:break-all}.mistake-err{color:var(--c-red);font-size:12px;background:var(--c-red-bg);padding:6px 10px;border-radius:6px}.mistake-actions{display:flex;gap:8px;justify-content:flex-end}.history-list{margin-top:12px;border-top:1px dashed var(--border-light);padding-top:8px}.history-toggle{background:transparent;color:var(--text-secondary);font-size:12px;font-weight:600;padding:4px 0}.history-items{margin-top:6px;display:flex;flex-direction:column;gap:4px}.history-item{display:flex;align-items:center;gap:8px;padding:4px 8px;border-radius:6px;background:var(--bg-secondary);font-size:12px}.history-item .icon{width:16px;font-weight:700}.history-item.pass .icon{color:var(--c-green)}.history-item.fail .icon{color:var(--c-red)}.history-item .time{color:var(--text-tertiary);font-family:SF Mono,Menlo,Consolas,monospace;font-size:11px}.history-item .sql-snippet{flex:1;font-family:SF Mono,Menlo,Consolas,monospace;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-item .meta{color:var(--text-tertiary);font-size:11px}.admin-page{display:flex;flex-direction:column;height:100vh;overflow:hidden}.admin-body{flex:1;display:flex;gap:12px;padding:0 16px 16px;min-height:0}.admin-sidebar{width:280px;flex-shrink:0;background:var(--bg-primary);border:1px solid var(--border-light);border-radius:10px;padding:8px;overflow-y:auto}.admin-sidebar .title{font-size:12px;font-weight:600;color:var(--text-secondary);padding:4px 8px 8px;border-bottom:1px solid var(--border-light);margin-bottom:4px}.admin-lesson-item{padding:6px 8px;border-radius:6px;cursor:pointer;font-size:12px}.admin-lesson-item:hover{background:var(--bg-secondary)}.admin-lesson-item.active{background:var(--c-primary-bg);color:var(--c-primary-dark)}.admin-lesson-item .m-lesson{font-weight:600}.admin-lesson-item .m-time{font-family:SF Mono,Menlo,Consolas,monospace;color:var(--text-tertiary);font-size:11px}.admin-editor{flex:1;display:flex;flex-direction:column;background:var(--bg-primary);border:1px solid var(--border-light);border-radius:10px;padding:8px;min-width:0}.admin-textarea{flex:1;width:100%;border:none;outline:none;resize:none;padding:8px 10px;font-family:SF Mono,Menlo,Consolas,monospace;font-size:12px;line-height:1.55;color:var(--text-primary);background:transparent}