.dial-widget{width:min(320px,calc(100vw - 28px));padding:15px;bottom:88px;max-height:none;overflow:visible;transform-origin:bottom right;transform:scale(var(--dial-scale,1))}
.dial-widget .actions,.dial-widget .tools{gap:6px;margin-top:8px}
.dial-widget #callState{margin:10px 0 0;font-size:12px}
.dial-widget #remoteAudio{display:none}
.dial-widget .display{font-size:19px;margin:10px 0}
.dial-widget .key{border-radius:9px;aspect-ratio:auto;height:43px;border:1px solid #d8e5ef;font-size:18px}
.dial-widget .keys{gap:6px;margin-top:10px}
.dial-widget small{display:block;font-size:11px;color:#6b8298;margin-top:5px}
#callerChoice{width:100%;font-size:13px;padding:9px}
.dial-widget .status{font-size:12px;padding:5px 8px}
.dial-fab{height:54px;width:54px}
#dispositionDialog{width:min(460px,calc(100vw - 30px));border:1px solid #d8e5ef;border-radius:20px;padding:24px;color:#102a43;box-shadow:0 24px 80px #102a4340}
#dispositionDialog::backdrop{background:#102a4380;backdrop-filter:blur(3px)}
#dispositionDialog label{display:block;margin:16px 0 5px;font-weight:600}
#dispositionDialog select,#dispositionDialog textarea{display:block;width:100%;margin-top:7px;padding:12px;border:1px solid #d8e5ef;border-radius:10px;font:inherit;box-sizing:border-box}
#dispositionError{color:#bd2c2c}
@media(max-height:700px){
  .dial-widget{padding:12px}
  .dial-widget .key{height:36px}
  .dial-widget .display{padding:8px;margin:7px 0}
  .dial-widget .actions button,.dial-widget .tools button{padding:8px}
}
