.front-door-preview{display:flex;flex-direction:column;min-height:0;max-height:none}
.front-door-preview h3{margin-top:20px}
.front-door-preview #previewBio{display:-webkit-box;margin:0;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.door-greeting-recorder{width:100%;margin-top:14px;padding:11px;border:0;border-radius:16px;background:#0d0f12;color:#fff;box-shadow:0 12px 28px #00000024}
.door-greeting-recorder header{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:26px}
.door-greeting-recorder header>span{display:grid;gap:1px;min-width:0}
.door-greeting-recorder header b{font-size:9px;line-height:1.2;letter-spacing:.15em;text-transform:uppercase}
.door-greeting-recorder header small{overflow:hidden;color:#adb4bd;font-size:9px;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
.door-greeting-recorder time{flex:0 0 auto;color:#fff;font-size:12px;font-weight:850;font-variant-numeric:tabular-nums}
.greeting-preview{display:grid;place-items:center;width:100%;height:136px;min-height:136px;max-height:136px;margin:8px 0;overflow:hidden;border-radius:11px;background:linear-gradient(145deg,#20242a,#15171b);color:#c2c7ce;font-size:11px;text-align:center}
.greeting-preview video{display:block;width:100%;height:136px;background:#08090b;object-fit:contain}
.greeting-preview audio{width:calc(100% - 16px);height:34px}
.preview-devices{display:flex;align-items:center;gap:10px;max-width:100%;padding:8px 12px;border:0;border-radius:11px;background:transparent;color:#fff;text-align:left;cursor:pointer}
.preview-devices:hover{background:#ffffff0a}
.preview-devices>.ui-icon{width:28px;height:28px;padding:6px;border-radius:9px;background:#b5121b;color:#fff}
.preview-devices span,.audio-live span{display:grid;min-width:0}
.preview-devices b,.audio-live b{font-size:10px;line-height:1.25}
.preview-devices small,.audio-live small{color:#929aa5;font-size:8px;line-height:1.3}
.greeting-device-row{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:8px}
.greeting-device-row[hidden],.greeting-device-row label[hidden]{display:none}
.greeting-device-row label{display:grid;grid-template-columns:18px minmax(0,1fr);grid-template-areas:"icon name" "icon select";align-items:center;gap:1px 7px;min-width:0;padding:7px 9px;border-radius:9px;background:#1b1e23}
.greeting-device-row .ui-icon{grid-area:icon;width:14px;height:14px;color:#ef5660}
.greeting-device-name{grid-area:name;color:#aeb5be;font-size:9px;font-weight:850;letter-spacing:.09em;text-transform:uppercase}
.greeting-device-row select{grid-area:select;min-width:0;width:100%;height:31px;padding:0 24px 0 0;border:0;background-color:transparent;color:#eef0f3;font-size:12px;outline:0;cursor:pointer}
.greeting-device-row option{color:#20242a}
.greeting-controls{display:flex;align-items:center;justify-content:space-between;gap:8px}
.greeting-modes,.greeting-transports{display:flex;align-items:center;gap:5px}
.greeting-mode,.greeting-record,.greeting-stop{display:inline-flex;align-items:center;justify-content:center;gap:5px;height:32px;margin:0;padding:0 10px;border:0;border-radius:9px;color:#fff;font-size:9px;font-weight:850;cursor:pointer}
.greeting-mode{background:#20242a}
.greeting-mode:hover{background:#2b3037}
.greeting-mode.active,.greeting-mode[aria-pressed="true"]{background:#fff;color:#20242a}
.greeting-record{background:#b5121b}
.greeting-record:hover{background:#8f0e15}
.greeting-stop{background:#30353d;color:#fff}
.greeting-stop.active{background:#fff;color:#b5121b}
.greeting-mode .ui-icon,.greeting-record .ui-icon,.greeting-stop .ui-icon{width:14px;height:14px}
.greeting-mode:focus-visible,.greeting-record:focus-visible,.greeting-stop:focus-visible,.preview-devices:focus-visible,.greeting-device-row select:focus-visible{outline:2px solid #fff;outline-offset:2px}
.greeting-mode:disabled,.greeting-record:disabled,.greeting-stop:disabled{cursor:default;opacity:.34}
.greeting-foot{display:flex;align-items:center;gap:10px;margin-top:8px}
.greeting-enable{display:flex;align-items:center;gap:6px;color:#d4d8dd;font-size:9px;font-weight:750;white-space:nowrap}
.greeting-enable input{margin:0;accent-color:#b5121b}
.door-greeting-recorder progress{width:100%;height:3px;margin:0;border:0;opacity:.5;accent-color:#b5121b}
.audio-live{display:flex;align-items:center;gap:9px;text-align:left}
.audio-live>.ui-icon{width:26px;height:26px;padding:6px;border-radius:50%;background:#b5121b;color:#fff}
.audio-live.recording>.ui-icon{animation:greeting-pulse .9s infinite}
.front-door-preview>.front-door-actions{margin-top:auto;padding-top:12px}
@keyframes greeting-pulse{50%{opacity:.45;transform:scale(.9)}}
@media(prefers-reduced-motion:reduce){.audio-live.recording>.ui-icon{animation:none}.preview-devices,.greeting-mode,.greeting-record,.greeting-stop{transition:none!important}}
@media(max-width:560px){.front-door-preview{max-height:none}.door-greeting-recorder{padding:10px}.greeting-device-row{grid-template-columns:1fr}.greeting-controls{align-items:stretch;flex-direction:column}.greeting-modes,.greeting-transports{display:grid;grid-template-columns:1fr 1fr;width:100%}.greeting-mode,.greeting-record,.greeting-stop{width:100%}}