/* Odontic Link V2.8.2 — portal-aligned MPR UX */

/* Remove the original static demo cross. The only crosshair left is the movable MPR axes. */
.ol-mpr-demo>div[data-mpr-interactive] > i{display:none!important}

/* Plane framing mirrors the existing portal MPR visual language. */
.ol-mpr-demo>div[data-mpr-interactive]{border-width:1px!important;border-style:solid!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.015)}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(1){border-color:#00d2ff!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(2){border-color:#69d900!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(3){border-color:#f000b8!important}

.ol-mpr-demo>div[data-mpr-interactive]>span:first-child{font-weight:850!important;letter-spacing:.04em}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(1)>span:first-child{color:#00d2ff!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(2)>span:first-child{color:#69d900!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(3)>span:first-child{color:#f000b8!important}

/* Thin, movable axes. */
.ol-mpr-demo>div[data-mpr-interactive] .ol-cross-v{width:1px!important}
.ol-mpr-demo>div[data-mpr-interactive] .ol-cross-h{height:1px!important}
.ol-mpr-demo>div[data-mpr-interactive] .ol-cross-v,
.ol-mpr-demo>div[data-mpr-interactive] .ol-cross-h{box-shadow:none!important}

.ol-mpr-demo>div[data-mpr-interactive]:nth-child(1) .ol-cross-v,
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(1) .ol-cross-h{background:#00d2ff!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(2) .ol-cross-v,
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(2) .ol-cross-h{background:#69d900!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(3) .ol-cross-v,
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(3) .ol-cross-h{background:#f000b8!important}

.ol-mpr-demo>div[data-mpr-interactive] .ol-cross-dot{width:7px!important;height:7px!important;border-width:1px!important;background:#09111c!important;box-shadow:none!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(1) .ol-cross-dot{border-color:#00d2ff!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(2) .ol-cross-dot{border-color:#69d900!important}
.ol-mpr-demo>div[data-mpr-interactive]:nth-child(3) .ol-cross-dot{border-color:#f000b8!important}

/* Rotation handles sit on the outer axis ends, like the portal MPR interaction model. */
.ol-rot-handle{position:absolute;z-index:9;width:14px;height:14px;border:1px solid currentColor;border-radius:50%;background:rgba(5,15,25,.9);box-shadow:none;pointer-events:auto;cursor:grab;color:#8aa0b5}
.ol-rot-handle:active{cursor:grabbing}
.ol-rot-handle:after{content:'↻';position:absolute;inset:0;display:grid;place-items:center;color:currentColor;font:700 9px/1 system-ui}
.ol-mpr-demo>div:nth-child(1) .ol-rot-handle{color:#00d2ff}
.ol-mpr-demo>div:nth-child(2) .ol-rot-handle{color:#69d900}
.ol-mpr-demo>div:nth-child(3) .ol-rot-handle{color:#f000b8}
.ol-cross-h>.ol-rot-handle{right:-7px;top:-7px}
.ol-cross-v>.ol-rot-handle{left:-7px;bottom:-7px}

.ol-mpr-mobile-nav,.ol-mpr-slice-control{display:none}

@media(max-width:720px){
  .ol-demo-first .ol-sandbox{height:calc(100svh - 58px);min-height:620px}
  .ol-demo-first .ol-viewer-stage{position:relative;display:block;padding:6px 46px 6px 6px;min-height:0;flex:1}
  .ol-demo-first .ol-mpr-demo{height:100%;display:block!important;position:relative}
  .ol-demo-first .ol-mpr-demo>div{display:none!important;position:absolute!important;inset:0!important;min-height:0!important;border-radius:10px}
  .ol-demo-first .ol-mpr-demo>div.ol-mpr-mobile-active{display:block!important}

  .ol-mpr-mobile-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;position:absolute;left:8px;right:48px;bottom:8px;z-index:20;pointer-events:none}
  .ol-mpr-mobile-nav button{pointer-events:auto;min-height:42px;border:1px solid #2b3b50;border-radius:9px;background:rgba(8,15,25,.9);color:#91a3b9;font:800 10px/1 "SFMono-Regular",Consolas,monospace;backdrop-filter:blur(8px)}
  .ol-mpr-mobile-nav button:nth-child(1).is-active{background:rgba(0,210,255,.13);border-color:#00d2ff;color:#bff6ff}
  .ol-mpr-mobile-nav button:nth-child(2).is-active{background:rgba(105,217,0,.12);border-color:#69d900;color:#dcffbf}
  .ol-mpr-mobile-nav button:nth-child(3).is-active{background:rgba(240,0,184,.12);border-color:#f000b8;color:#ffd0f4}

  .ol-mpr-slice-control{display:flex;position:absolute;right:6px;top:8px;bottom:58px;width:34px;z-index:21;flex-direction:column;align-items:center;gap:7px}
  .ol-mpr-slice-control input{flex:1;width:28px;writing-mode:vertical-lr;direction:rtl;accent-color:#18bde7;margin:0}
  .ol-mpr-slice-control span{font:750 9px/1 "SFMono-Regular",Consolas,monospace;color:#c8d9e8;background:#0a121d;border:1px solid #26394f;border-radius:6px;padding:5px 3px;min-width:32px;text-align:center}
  .ol-first-hint{top:95px;max-width:92vw;text-align:center}
}