/* 'See the Greek order' map. Mobile = stacked tiles + tap-to-highlight; desktop (>=720px) = Greek row over English row with SVG lines. No external assets. */
.mapbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.mapbar h1{flex:1 1 100%;margin:4px 0;font-size:22px}.mapbar h1 small{color:#777;font-weight:400}
.mintro{font:14px system-ui,sans-serif;color:#555;margin:6px 0}
.mlegend{display:flex;flex-wrap:wrap;gap:6px;font:12px system-ui,sans-serif;margin:6px 0 10px}.mk{border:1px solid #ddd;border-radius:999px;padding:2px 8px;background:#fff}
.mk.none{color:#999}.mk.added{text-decoration:underline dotted}.mk.flag{background:#fff6dc}
.mverse{position:relative;border:1px solid var(--line,#e4ded3);border-radius:10px;padding:10px;margin:12px 0;background:#fff}
.mverse h2{font-size:17px;margin:0 0 8px}
.grow{display:flex;flex-direction:column;gap:6px}
.gt{display:grid;grid-template-columns:28px 1fr;column-gap:8px;text-align:left;background:#faf8f3;border:1px solid #d8d2c6;border-radius:8px;padding:6px 8px;font:14px system-ui,sans-serif;color:inherit}
.gt>span{grid-column:2}.gt .gn{grid-column:1;grid-row:1/span 4;color:#998;font-size:12px}
.gt .go{font:600 19px "Gentium Plus","DejaVu Serif",serif}.gt .gx{font-style:italic}.gt .gm{color:#555;font-size:13px}.gt .ge{font-weight:600;color:#2b4f7a}.gt .ge.none{color:#aaa;font-weight:400}
.gt .bd{display:inline-block;font-size:11px;border:1px solid #ccc;border-radius:999px;padding:0 6px;margin-top:2px;margin-right:4px;width:max-content}.gt .bd.fl{background:#fff6dc;border-color:#e3c46b}
.gt.none{opacity:.55;font-size:12px;padding:3px 8px}.gt.none .go{font-size:15px}.gt.none .gm{display:none}
.gt.on{outline:3px solid #e3a21a;background:#fff3d6}.gt.dim{opacity:.35}
.gt .gd{font-size:13px;margin-top:4px;border-top:1px dashed #ccc;padding-top:4px}
.erow{font:17px/2 Georgia,serif;margin:12px 0 4px}.et{border-radius:3px;padding:0 1px;cursor:pointer}.et.added{text-decoration:underline dotted #999;color:#666}.et.unl{color:#888}
.et.on{background:#ffe08a}
.mdetail{font:13px system-ui,sans-serif;color:#444;min-height:1.2em}.mstat{font:12px system-ui,sans-serif;color:#777;margin:4px 0 0}
.mlines{display:none}
p.v .gmap{display:none;font:12px system-ui,sans-serif;margin-left:6px}p.v.target .gmap,p.v.sel .gmap{display:inline}
@media (min-width:720px){
 .grow{flex-direction:row;flex-wrap:wrap;gap:8px}.gt{display:flex;flex-direction:column;min-width:84px;padding:5px 7px}
 .gt .gn{font-size:11px}.gt .gm{font-size:12px}
 .erow{margin-top:70px}
 .mlines{display:block;position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;overflow:visible}
 .mlines line{stroke:#9bb3cf;stroke-width:1.3}.mlines line.on{stroke:#e3a21a;stroke-width:3}
}
.gt .gd{display:none}.gt.on .gd{display:block}
.gt{position:relative;z-index:1}.gt .bd{white-space:normal;max-width:100%}
@media (min-width:720px){.gt.on .gd{display:none}.mlines{z-index:0}.gt{background:#faf8f3}.gt.on{background:#fff3d6}.gt.none{opacity:1;color:#999;background:#f4f2ee}}
/* 2026-10-30 long-word fix: tiles size to content (max-content, capped), text wraps inside, rows wrap instead of squeezing. */
.gt{box-sizing:border-box;min-width:0;max-width:100%;overflow-wrap:break-word}.gt>span{min-width:0;overflow-wrap:break-word}
.gt .go{overflow-wrap:anywhere;line-height:1.2}.gt .gx{overflow-wrap:anywhere}
@media (min-width:720px){
 .grow{align-items:stretch}
 .gt{flex:0 0 auto;width:max-content;min-width:84px;max-width:min(320px,100%)}
 .gt .go{font-size:clamp(15px,1.1vw + 7px,19px)}
 .gt .gm,.gt .ge{white-space:normal}
}
/* 2026-11-04 'See the Hebrew order': Hebrew tiles run right to left (dir=rtl on .grow); text inside tiles stays readable left-aligned English. */
.grow.rtl .gt{text-align:right}.grow.rtl .gt .gx,.grow.rtl .gt .gm,.grow.rtl .gt .ge,.grow.rtl .gt .bd,.grow.rtl .gt .gd{direction:ltr;unicode-bidi:isolate}
.grow.rtl .gt .go{font:600 21px "SBL Hebrew","Ezra SIL","Taamey Frank CLM","DejaVu Sans","Noto Sans Hebrew",serif}
.grow.rtl .gt .gn{grid-column:1}
.mnote{font:13px system-ui,sans-serif;color:#6a5a2a;background:#fff8e6;border-radius:6px;padding:4px 8px;margin:0 0 6px}
.morder{font:14px system-ui,sans-serif;color:#2b4f7a;margin:0 0 8px;padding-left:20px}.morder li{margin:2px 0}
.gt.lk{outline:2px dashed #6a8fc7;outline-offset:1px}.gd .gcl{color:#1f4e8c}