.demo-intro { position: relative; padding-right: 76px; }
#ownerAccess { position: absolute; right: 26px; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; color: #ccc; }
#ownerAccess[data-unlocked="true"] { color: #5ad4b3; background: #163e34; }
#ownerAccess:hover::after, #liveOutput:hover::after { left: auto; right: 0; transform: none; }
#ownerDialog { max-height: calc(100dvh - 32px); overflow-y: auto; }
#ownerDialog h2 { font-size: 21px; line-height: 1.3; }
#ownerUnlockForm { margin-top: 22px; }
#ownerUnlockForm label { display: block; margin-bottom: 8px; font-size: 14px; }
.owner-password-field { display: flex; align-items: center; gap: 6px; margin-bottom: 18px; }
#ownerPassword { width: 0; min-width: 0; flex: 1; height: 44px; border: 1px solid #777; border-radius: 4px; background: #151515; color: #fff; padding: 8px 10px; font: 16px Arial, sans-serif; }
#ownerPassword:focus-visible { outline: 2px solid #5ad4b3; outline-offset: 2px; }
#ownerShowPassword { width: 44px; height: 44px; flex: 0 0 44px; }
#ownerUnlock { width: 100%; min-height: 44px; }
#ownerDialog button:disabled { opacity: .6; cursor: wait; }
#ownerStatus { font-size: 14px; line-height: 1.5; margin: 16px 0 0; }
#ownerStatus:empty { display: none; }
#ownerStatus[data-error="true"] { color: #ffb8b3; }
#ownerUnlockedActions p { font-size: 14px; line-height: 1.5; color: #ccc; }
#ownerUnlockedActions[hidden], #ownerUnlockForm[hidden] { display: none; }
@media (max-width: 760px) {
  .demo-intro { padding-right: 56px; }
  #ownerAccess { right: 12px; width: 36px; height: 36px; }
  #ownerDialog { padding: 20px; }
}