.mechanism-guide{position:absolute;z-index:5;left:8px;right:8px;top:48px;padding:5px 8px;border-radius:10px;background:#102a31;color:#edf7f8;box-shadow:0 2px 10px #0002}.mechanism-case{display:flex;gap:4px;align-items:center}.mechanism-case select{min-width:0;max-width:none!important;flex:1;width:100%;background:transparent;color:inherit;border:0;font:600 13px system-ui;height:29px;padding:2px}.mechanism-case option{background:#102a31}.mechanism-guide button{color:inherit;background:transparent;border:1px solid #627c7960;border-radius:7px;min-height:28px;padding:4px 6px;cursor:pointer}.mechanism-stages{display:flex;gap:4px;margin-top:4px}.mechanism-stages button{flex:1;font:12px system-ui}.mechanism-guide button[aria-pressed=true]{background:#a7f2dc;color:#102a31}.mechanism-stages small{padding-right:4px;opacity:.7}.mechanism-guide p{font:12px/1.5 system-ui;margin:7px 0}.mechanism-guide small{font:11px/1.3 system-ui}.mechanism-focus{display:flex;gap:5px;align-items:center;margin-top:4px;font-size:11px}.mechanism-focus button{font:11px system-ui}.mechanism-focus span{margin-left:auto;color:#bce0d8;font-size:10px}.mechanism-guide details{font:11px/1.4 system-ui;margin-top:4px}.mechanism-guide summary{cursor:pointer;color:#cce2dd}.lesson-stage:has(.mechanism-guide) .studio-host{top:137px}.lesson-stage:has(.mechanism-focus) .studio-host{top:169px}.phone-app .mechanism-guide{top:5px;left:5px;right:5px;padding:4px 6px}.patient-stage:has(.mechanism-guide) .anatomy-canvas{top:85px}.patient-stage:has(.mechanism-focus) .anatomy-canvas{top:116px}.stage:has(.mechanism-guide) .viewport{top:142px}.stage:has(.mechanism-focus) .viewport{top:174px}.mechanism-guide details[open]{background:#102a31;padding-bottom:5px}.mechanism-focus span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@media(max-width:600px){.mechanism-stages button{font-size:10px;padding:4px 2px}.mechanism-focus span{max-width:115px}.mechanism-case select{font-size:11px}.mechanism-guide details{font-size:10px}}.patient-stage:has(.mechanism-guide) .markers{top:85px}.patient-stage:has(.mechanism-focus) .markers{top:116px}.exchange-state{position:absolute;right:9px;bottom:37px;width:57%;z-index:3;color:#b9e5de;font:11px/1.35 system-ui;pointer-events:none}.phone-app .exchange-state{bottom:70px;font-size:9px}.exchange-state strong{display:block;color:#7fdfff}.exchange-state em{font-style:normal;color:#ffc064}