*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:#1c1c1c;font-family:system-ui,sans-serif}.app{flex-direction:column;height:100vh;display:flex}.toolbar{background:#fafafa;border-bottom:1px solid #ddd;flex-wrap:wrap;align-items:center;gap:10px;padding:8px 14px;display:flex}.toolbar .spacer{flex:1}.status{background:#eee;border-radius:10px;padding:2px 8px;font-size:12px}.status-connected{color:#1a7d3a;background:#d4f4dd}.status-connecting{color:#8a6d00;background:#fff3cd}.doc-name{color:#888;font-size:12px}.role-chip{text-transform:uppercase;letter-spacing:.04em;border-radius:10px;padding:2px 8px;font-size:11px;font-weight:600}.role-chip.role-teacher{color:#fff;background:#2c3e50}.role-chip.role-student{color:#555;background:#e9e9e9}.teacher-capture{background:#fffbea;border-bottom:1px solid #ddd;padding:8px 14px}.teacher-capture-input{align-items:center;gap:6px;display:flex}.teacher-capture-input input{border:1px solid #ddd;border-radius:4px;flex:1;padding:6px 10px;font-size:13px}.capture-tag{cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:10px;padding:3px 9px;font-size:11px}.capture-tag:disabled{cursor:default;opacity:.5}.capture-tag-mistake{background:#ffc9c9;border-color:#ffc9c9}.capture-tag-pronunciation{background:#c7e8ff;border-color:#c7e8ff}.capture-tag-vocab{background:#fff1a8;border-color:#fff1a8}.capture-tag-personal{background:#d8f5d8;border-color:#d8f5d8}.teacher-capture-log{color:#555;max-height:80px;margin:6px 0 0;padding:0;font-size:12px;list-style:none;overflow-y:auto}.teacher-capture-log li{align-items:baseline;gap:6px;padding:2px 0;display:flex}.presence{gap:4px;display:flex}.peer-chip{color:#fff;border-radius:8px;padding:2px 6px;font-size:11px}.group{border-left:1px solid #ddd;align-items:center;gap:4px;padding-left:10px;display:flex}.group-label{color:#888;margin-right:2px;font-size:11px}.toolbar button{cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:4px;padding:4px 8px;font-size:13px}.toolbar button:hover{background:#f0f0f0}.hl-btn.hl-vocab{background:#fff1a8}.hl-btn.hl-error{background:#ffc9c9}.hl-btn.hl-structure{background:#c7e8ff}.scroll-container{scroll-snap-type:y proximity;flex:1;overflow-y:auto}.editor-column{padding:20px 0 60vh}.ProseMirror{outline:none;max-width:800px;margin:0 auto;padding:0 24px;line-height:1.6}.ProseMirror h1,.ProseMirror h2{scroll-snap-align:start;align-items:baseline;gap:6px;scroll-margin-top:54px;display:flex;position:relative}.h-toggle{-webkit-user-select:none;user-select:none;cursor:pointer;color:#999;width:16px;font-size:.6em;display:inline-block}.h-toggle:hover{color:#333}.pm-heading-collapsed{opacity:.7}.pm-hidden{display:none!important}mark[data-highlight-type=vocab]{background:#fff1a8;border-radius:2px;padding:0 1px}mark[data-highlight-type=error]{background:#ffc9c9;border-radius:2px;padding:0 1px}mark[data-highlight-type=structure]{background:#c7e8ff;border-radius:2px;padding:0 1px}.image-ink-node{margin:14px 0}.image-ink-toolbar{gap:6px;margin-bottom:4px;display:flex}.image-ink-toolbar .swatch{cursor:pointer;border:2px solid #0000;border-radius:50%;width:20px;height:20px;padding:0}.image-ink-toolbar .swatch.active{border-color:#333}.image-ink-toolbar .tool-btn{cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:4px;padding:2px 8px;font-size:11px}.image-ink-toolbar .tool-btn.active{color:#fff;background:#333}.image-ink-wrap{max-width:100%;display:inline-block;position:relative}.image-ink-wrap img{border-radius:4px;max-width:100%;height:auto;display:block}.image-ink-canvas{touch-action:none;cursor:crosshair;width:100%;height:100%;position:absolute;inset:0}.collaboration-carets__caret{word-break:normal;pointer-events:none;border-left:1px solid;border-right:1px solid;margin-left:-1px;margin-right:-1px;position:relative}.collaboration-carets__label{color:#fff;white-space:nowrap;border-radius:3px 3px 3px 0;padding:1px 5px;font-size:11px;font-weight:600;position:absolute;top:-1.1em;left:-1px}