:root{--bg:#fff;--muted:#666;--accent:#2b6cb0;--highlight:#fff59d;--removed:#ffb7c5}
*{box-sizing:border-box;font-family:Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial}
body{background:#f7fafc;color:#1a202c;padding:16px}
main{max-width:900px;margin:0 auto}
h1{font-size:20px;margin-bottom:12px}
label{display:block;margin-bottom:6px;color:var(--muted);font-size:14px}
textarea{width:100%;min-height:320px;padding:12px;font-size:15px;line-height:1.5;border:1px solid #cbd5e0;border-radius:6px;resize:vertical}
.controls{margin-top:12px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
button{background:var(--accent);color:#fff;padding:8px 12px;border:0;border-radius:6px;cursor:pointer;font-size:14px}
button[disabled]{opacity:.6;cursor:not-allowed}
.note{color:var(--muted);margin-top:10px;font-size:12px}
.result{white-space:pre-wrap;padding:12px;border-radius:6px;border:1px solid #e2e8f0;min-height:320px;font-size:14px;line-height:1.6}
.removed{color:#c53030;font-style:italic}
.no-select{user-select:none;-webkit-user-select:none;-ms-user-select:none}
#status{color:var(--muted);font-size:13px}
.highlight-change{background:#c6f6d5;font-weight:bold;border-radius:2px;padding:0 2px;cursor:pointer;transition:opacity 0.2s}
.highlight-change:hover{opacity:0.8}
.change-tooltip{position:fixed;background:#fff;border:1px solid #cbd5e0;border-radius:6px;padding:6px 8px;font-size:12px;max-width:300px;box-shadow:0 2px 8px rgba(0,0,0,0.15);z-index:10000;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tooltip-arrow{position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #fff}
.comment-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:9999;align-items:center;justify-content:center}
.comment-modal.active{display:flex}
.comment-box{background:#fff;padding:16px;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.15);max-width:500px;width:90%}
.comment-header{font-weight:bold;margin-bottom:10px;font-size:15px}
.comment-text{margin-bottom:12px;font-size:14px;line-height:1.5;min-height:40px}
.comment-counter{color:var(--muted);font-size:12px;margin-bottom:10px}
.comment-nav{display:none;gap:8px;justify-content:flex-end}
.flag-llm{background:#ffd700;padding:0 3px;border-radius:2px;cursor:help;font-weight:500;position:relative}
.flag-llm:hover::after{content:attr(title);position:absolute;bottom:100%;left:0;background:#333;color:#fff;padding:4px 6px;border-radius:3px;font-size:11px;white-space:nowrap;width:200px;max-width:200px;overflow:hidden;text-overflow:ellipsis;z-index:1000}
.flag-delete{background:#ffcccc;padding:0 3px;border-radius:2px;cursor:help;font-weight:500;position:relative}
.flag-delete:hover::after{content:attr(title);position:absolute;bottom:100%;left:0;background:#333;color:#fff;padding:4px 6px;border-radius:3px;font-size:11px;white-space:nowrap;z-index:1000}
.flag-emoji{background:#ff9500;padding:0 4px;border-radius:2px;cursor:pointer;font-weight:500;position:relative;display:inline-block}
.flag-emoji:hover{opacity:0.8;box-shadow:0 0 4px rgba(255,149,0,0.5)}
.emoji-tooltip{font-family:system-ui;font-size:12px}
.section-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:9999;align-items:center;justify-content:center}
.section-modal.active{display:flex}
.section-box{background:#fff;padding:20px;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.15);max-width:500px;width:90%}
.section-preview{background:#f5f5f5;padding:12px;border-radius:6px;margin:12px 0;font-size:13px;line-height:1.6;max-height:150px;overflow-y:auto}
.section-buttons{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
.section-buttons button{padding:10px 16px;border:1px solid #cbd5e0;border-radius:6px;cursor:pointer;font-size:14px}
.section-buttons button.primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.section-buttons button:hover{opacity:0.9}
