#opgNavigation{padding:12px;border:1px solid #55426e;background:#241e33;border-radius:12px;color:#f0eafa;margin:10px 0}#opgNavigation[hidden],#opgOpenCrop[hidden]{display:none}#opgNavigation h3{margin:0 0 10px;font-size:14px}.opg-formula{display:grid;grid-template-columns:repeat(8,1fr);gap:5px}.opg-formula button{min-width:0;height:29px;border:1px solid #494053;border-radius:6px;background:#2d263d;color:#bfb3d0;cursor:pointer;font-size:11px}.opg-formula button:disabled{opacity:.45;cursor:default}.opg-formula button.has-findings{background:#473052;color:#f6daeb}.opg-formula button[aria-pressed=true],.opg-groups button[aria-pressed=true]{outline:2px solid #b18cf8;outline-offset:0;background:#51366d}.opg-formula button:nth-child(n+17):nth-child(-n+24){margin-top:5px}.opg-groups{display:flex;gap:7px;margin-top:10px}.opg-groups button{border:1px solid #665078;border-radius:7px;background:#332740;color:#eadcfb;padding:7px;font-size:11px;cursor:pointer}.opg-groups button:disabled{opacity:.45}.opg-nav-note{font-size:10px;line-height:1.45;color:#c0b1d1;margin:10px 0 0}#opgOpenCrop{border:1px solid #73589b;color:#4c2c71;background:#f1e9ff;border-radius:8px;padding:8px;font-size:12px;cursor:pointer}#opgCrop{width:min(920px,94vw);max-height:92dvh;overflow:auto;border:1px solid #615079;border-radius:14px;background:#201a2d;color:#f3eff9;padding:18px}#opgCrop::backdrop{background:#0c0815b0}#opgCrop form{display:flex;align-items:center;justify-content:space-between;gap:14px}#opgCrop h2{font-size:20px;margin:0 0 12px}#opgCrop form button{background:#352846;color:#f5ebff;border:1px solid #796387;border-radius:8px;font-size:24px;cursor:pointer}#opgCrop canvas{display:block;width:100%;max-height:65dvh;object-fit:contain;background:#090a10;border-radius:9px}#opgCrop p{font-size:12px;color:#c7b9d7}body:not(.ct-mode):not(.io-mode) .shell{max-width:1440px;margin:auto}#compactQueue button[hidden]{display:none!important}

/* Formula is placed above the image, in anatomical order. Icons are navigation symbols. */
#opgNavigation .opg-formula{grid-template-columns:repeat(16,minmax(0,1fr));gap:4px}
#opgNavigation .opg-formula button{height:70px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:12px;margin-top:0}
.opg-formula svg{width:25px;height:34px;fill:#645970;stroke:#d7cede;stroke-width:1.1}
.opg-formula svg.lower{transform:rotate(180deg)}
.opg-formula .has-findings svg{fill:#ac70bd;stroke:#f1d9ff}
#opgNavigation .opg-formula button:nth-child(8),#opgNavigation .opg-formula button:nth-child(24){margin-right:5px}
#opgToothInfo{font-size:12px;margin:9px 0 0;color:#e1d2f4}
#opgNavigation h3{margin-bottom:6px}#opgNavigation{margin:8px 0;padding:10px}
#stage .opg-tooth-region{border:1px dashed #c6acf3;background:#b18cf80a;z-index:4;cursor:pointer}
#stage .opg-tooth-region:hover,#stage .opg-tooth-region.selected{border:2px solid #d7bcff;background:#a678f033}
#stage .opg-tooth-region span{background:#49325e;color:white;font-size:11px}
#stage.lesion-editing .opg-tooth-region{display:none}
@media(max-width:650px){#opgNavigation .opg-formula button{height:51px;font-size:10px}.opg-formula svg{width:17px;height:25px}#opgNavigation .opg-formula{gap:2px}}
/* Keep the image usable on laptop-height windows. */
#opgNavigation h3{display:none}
#opgNavigation .opg-nav-note{margin:4px 0 0;font-size:10px}
#opgNavigation .opg-formula button{height:43px;flex-direction:row;gap:3px}
#opgNavigation .opg-formula svg{width:20px;height:29px}
#opgNavigation .opg-groups{margin-top:6px}
#opgNavigation #opgToothInfo{margin-top:5px}
@media(max-height:800px){#opgNavigation{padding:6px;margin:4px 0}#opgNavigation .opg-formula button{height:29px}#opgNavigation .opg-formula svg{height:22px;width:17px}#opgNavigation .opg-nav-note{display:none}#opgNavigation .opg-groups button{padding:5px}#opgNavigation #opgToothInfo{font-size:11px}}
/* Overlapping model rectangles must not steal clicks from another tooth. */
#stage .opg-tooth-region{pointer-events:none}
#stage .opg-tooth-region span{pointer-events:auto;cursor:pointer}

/* R2.2: one selected object, with its observations and fragment. */
body.opg-unified #compactQueue,body.opg-unified #reviewHeading,body.opg-unified #opgToothInfo{display:none!important}
#opgSelectionCard[hidden],#opgStudyOverview[hidden]{display:none!important}
#opgSelectionCard{border:1px solid #624777;border-radius:10px;padding:12px;background:#251d31;margin:10px 0}
#opgSelectionCard>header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 10px}
#opgSelectionCard h3{font-size:17px;margin:0}#opgSelectionCount{font-size:12px;color:#d7b8f6;white-space:nowrap}
.opg-observation-nav{display:flex;align-items:end;gap:6px;margin:8px 0}.opg-observation-nav[hidden]{display:none}
.opg-observation-nav label{display:grid;gap:4px;min-width:0;flex:1;font-size:11px;color:#cbbada}.opg-observation-nav select{width:100%;min-width:0}
.opg-observation-nav button,.opg-observation-nav select{padding:8px;background:#392a49;color:#f0e6fa;border:1px solid #725987;border-radius:7px}.opg-observation-nav button{cursor:pointer}.opg-observation-nav button:disabled{opacity:.4;cursor:default}
#opgSelectionPreview{display:block;width:100%;padding:0;background:#090a10;border:1px solid #594169;border-radius:8px;overflow:hidden;cursor:zoom-in}#opgSelectionPreview[hidden]{display:none}#opgSelectionPreview canvas{display:block;width:100%;height:115px;object-fit:contain}
#opgSelectionEmpty,#opgSelectionRegion,.opg-card-safety{font-size:11px;line-height:1.5;color:#d3c2df;margin:8px 0}
#opgSelectionCard #candidate .tooth{display:none}#opgSelectionCard #candidate h3{margin-top:8px}#opgSelectionCard #candidate>small{font-size:10px}#opgSelectionCard #candidate .confidence{height:4px;margin-top:5px}#opgSelectionCard #candidate p{font-size:11px;line-height:1.45;margin:7px 0}#opgSelectionCard #candidate #confounderState,#opgSelectionCard #candidate #reviewState{font-size:11px;padding:8px;margin:7px 0}
#opgSelectionCard #openOpgCorrection{margin-top:8px;padding:10px}#opgSelectionCard #opgOpenCrop{width:100%;margin-top:6px}
#opgStudyOverview{font-size:12px}#opgStudyOverview>summary{padding:6px 0;color:#d6b6f7;cursor:pointer}
#opgCrop{width:min(920px,94vw);max-height:94dvh;overflow:hidden}#opgCrop canvas{height:min(54dvh,580px);width:100%;object-fit:contain;aspect-ratio:3/2}#opgCrop .opg-view-controls{gap:8px;margin-bottom:8px}#opgCrop>p{margin:8px 0 0;font-size:11px}
@media(max-height:800px){#opgSelectionPreview canvas{height:86px}#opgSelectionCard{padding:10px}#opgSelectionCard #candidate p{font-size:10px}#opgSelectionCard .opg-card-safety{font-size:10px}#opgCrop canvas{height:46dvh}}

#opgSelectionExplanation{font-size:11px;margin:8px 0;color:#d3c2df}#opgSelectionExplanation>summary{cursor:pointer;padding:5px 0;color:#d8b9fa}#opgSelectionExplanation p{font-size:11px;line-height:1.5}#opgSelectionExplanation #model{font-size:11px}#opgSelectionStatus{line-height:1.5;color:#d9c4ef}#opgSelectionCard #candidate .confidence{margin-bottom:10px}

#opgCrop canvas{width:min(100%,81dvh,870px);height:auto;max-height:54dvh;margin:0 auto} @media(max-height:800px){#opgCrop canvas{width:min(100%,69dvh);height:auto;max-height:46dvh}}

body.opg-dark #opgCrop{max-height:94dvh;overflow:auto}body.opg-dark #opgCrop canvas{width:min(100%,81dvh,870px);height:auto;max-height:54dvh;margin:0 auto} @media(max-height:800px){body.opg-dark #opgCrop canvas{width:min(100%,69dvh);height:auto;max-height:46dvh}}
