:root{--base:17px;--he-scale:1.3}*{box-sizing:border-box}html,body{height:100%}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;background:#fff;color:#111}
header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #e5e7eb;background:#fff;position:sticky;top:0;z-index:10}
.title{font-weight:700}.status{font-size:12px;opacity:.75}
.controls{padding:12px 16px;border-bottom:1px solid #f0f0f0}.controls label{margin-right:10px}
.badge{display:inline-block;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:6px;padding:2px 6px;font-size:12px}
.results{display:grid;grid-template-columns:1fr 360px}
.reader{padding:12px 16px;line-height:1.6;overflow-wrap:anywhere}
.tok{margin-right:6px}.tok .s{color:#d63384;font-size:.75em;cursor:pointer;vertical-align:super}
.lex{border-left:1px solid #e5e7eb;background:#fafafa;overflow:auto}
.lx-head{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-bottom:1px solid #e5e7eb;background:#fff;position:sticky;top:0}
.lx-clear{border:1px solid #e5e7eb;background:#fff;border-radius:6px;padding:2px 8px;cursor:pointer}
#lx-body{padding:12px}
.reader .en{direction:ltr}
.reader .he{direction:rtl;font-family:"SBL Hebrew","Ezra SIL","Noto Sans Hebrew",serif;font-size:calc(var(--base)*var(--he-scale))}