*{box-sizing:border-box}html,body{min-height:100%}body{color:#000;background:silver;margin:0;padding:20px 10px;font:13px Tahoma,Arial,sans-serif}button,textarea{font:inherit}button{color:#000;cursor:pointer;background:#d4d0c8;border:2px outset #fff;min-width:105px;padding:5px 12px}button:active{border-style:inset}button:disabled{color:#777;cursor:default}.phone{width:520px;max-width:100%;margin:35px auto}.window{background:#d4d0c8;border:2px outset #fff;padding:3px}.title-bar{color:#fff;background:navy;min-height:24px;padding:4px 6px;font-weight:700}.title-bar span{float:right;font-weight:400}.window-body{padding:14px}.centered{text-align:center}.incoming-photo{object-fit:cover;border:2px inset #fff;width:280px;max-width:100%;height:220px;margin:0 auto;display:block}.caller{margin:14px 0 8px;font-size:16px}.buttons{margin:12px 0 0}.buttons button+button{margin-left:6px}.contact{align-items:center;gap:10px;margin-bottom:10px;display:flex}.contact img{object-fit:cover;border:2px inset #fff;width:56px;height:56px}#call-status,#recognition-label{color:#555}.dialogue-log{background:#fff;border:2px inset #fff;height:220px;margin-bottom:12px;padding:8px;line-height:1.45;overflow-y:auto}.dialogue-entry{white-space:pre-wrap;overflow-wrap:anywhere;border-bottom:1px dotted #aaa;margin:0;padding:5px 2px}.dialogue-entry:last-child{border-bottom:0}.dialogue-entry b{color:navy}label{margin-bottom:4px;display:block}textarea{resize:vertical;color:#000;background:#fff;border:2px inset #fff;width:100%;padding:6px;display:block}.speech-line{min-height:27px;padding-top:5px;font-size:11px}#interim{color:#555;margin-left:8px}.reply-status{margin:0 0 8px;font-style:italic}.conversation-buttons{gap:6px;display:flex}.conversation-buttons #hangup-button{margin-left:auto}.conversation,.ended,.phone[data-state=listening] .incoming,.phone[data-state=waiting] .incoming,.phone[data-state=replying] .incoming,.phone[data-state=finished] .incoming{display:none}.phone[data-state=listening] .conversation,.phone[data-state=waiting] .conversation,.phone[data-state=replying] .conversation,.phone[data-state=finished] .ended{display:block}@media (width<=540px){body{padding:8px}.phone{margin:0 auto}.dialogue-log{height:190px}.conversation-buttons{flex-wrap:wrap}.conversation-buttons #hangup-button{margin-left:0}}
