.recording-demo{display:grid;grid-template-columns:1.1fr 1fr;gap:30px;align-items:center;margin:40px 0 12px;padding:30px;background:linear-gradient(120deg,#e9f5ff,#e7f7ed);border:1px solid #b7dccc;border-radius:22px}.recording-demo .eyebrow{color:#087b71}.recording-demo h2{font-size:clamp(25px,3vw,34px);margin:12px 0}.recording-demo p{font-size:15px;line-height:1.7}.recording-demo .recording-demo-note{font-size:12px;margin-top:18px;color:#486878}.recording-demo-sample{background:#fff;border:1px solid #c2d7e7;box-shadow:0 12px 30px #1749680b;border-radius:16px;overflow:hidden}.recording-demo-sample-head{display:flex;gap:9px;flex-wrap:wrap;align-items:center;padding:16px 18px;background:#eff6fc;color:#1c5778;font-size:13px}.recording-demo-sample-head>span{font-size:11px;margin-left:auto}.recording-demo-row{display:flex;gap:18px;padding:25px 20px;align-items:center}.recording-demo-row>div{min-width:0}.recording-demo-row strong{font-size:16px}.recording-demo-row p{font-size:12px;margin:7px 0 13px}.recording-smile{flex:0 0 76px;display:grid;gap:8px;justify-items:center;border:1px solid #a5d8b5;background:#edf9f0;color:#188347;padding:13px 5px;border-radius:14px;cursor:pointer}.recording-smile i{font-size:35px}.recording-smile span{font-size:11px;font-weight:700}.recording-smile:hover{background:#d8f1e0;transform:translateY(-2px)}.recording-smile:focus-visible,.recording-demo-open:focus-visible{outline:3px solid #1179e4;outline-offset:3px}.recording-demo-score,.recording-demo-outcome{display:inline-block;border-radius:6px;padding:4px 7px;font-size:11px;font-weight:700}.recording-demo-score{background:#e8f1ff;color:#155b9c;margin-right:7px}.recording-demo-outcome{background:#e0f4ec;color:#087647}.recording-demo-open{border:0;border-top:1px solid #dbe7ee;border-radius:0;background:#f4f9fc;padding:14px;width:100%;font:inherit;font-size:13px;font-weight:700;color:#125a88;cursor:pointer}.recording-demo-open i{margin-left:7px}.recording-analysis-visible{overflow:hidden}.recording-analysis-dialog{position:fixed;inset:0;margin:auto;width:min(960px,calc(100vw - 24px));height:min(840px,calc(100dvh - 24px));max-width:none;max-height:none;padding:0;border:0;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 24px 100px #09192c55}.recording-analysis-dialog::backdrop{background:#071627b3;backdrop-filter:blur(3px)}.recording-analysis-dialog iframe{display:block;width:100%;height:100%;border:0}.recording-analysis-close{position:absolute;z-index:10;right:8px;top:8px;width:34px;height:34px;border:1px solid #7faca0;background:#fff;color:#253e40;border-radius:8px;cursor:pointer;font-size:19px}.recording-analysis-close:focus-visible{outline:3px solid #1179e4;outline-offset:2px}html[data-site-theme=dark] .recording-demo{background:linear-gradient(120deg,#182e44,#183c36);border-color:#366c68}html[data-site-theme=dark] .recording-demo .eyebrow{color:#81d8c8}html[data-site-theme=dark] .recording-demo-note{color:#b1c9d2}html[data-site-theme=dark] .recording-demo-sample{background:#17293b;border-color:#375469}html[data-site-theme=dark] .recording-demo-sample-head,html[data-site-theme=dark] .recording-demo-open{background:#20384c;color:#a2d3f4;border-color:#375469}html[data-site-theme=dark] .recording-smile{background:#1d4230;color:#9ce3b6;border-color:#4c8c62}html[data-site-theme=dark] .recording-demo-score{background:#243e60;color:#a1cdff}html[data-site-theme=dark] .recording-demo-outcome{background:#214638;color:#98e2be}html[data-site-theme=dark] .recording-analysis-close{background:#233e45;border-color:#567b80;color:#e0f3f4}@media(max-width:1000px){.recording-demo{grid-template-columns:1fr}}@media(max-width:650px){.recording-demo{padding:21px 17px;gap:20px}.recording-demo-row{gap:13px;padding:19px 15px}.recording-analysis-dialog{width:calc(100vw - 12px);height:calc(100dvh - 12px);border-radius:9px}.recording-demo-sample-head{padding:14px}.recording-demo-sample-head>span{margin-left:0;flex-basis:100%}}

.recording-analysis-close[hidden]{display:none}.recording-analysis-dialog[aria-busy=true]{background:var(--surface,#f8fafc)}.recording-analysis-dialog:not([aria-busy=true]) .recording-analysis-close{display:none}

#recordings-detail-2 .recording-popup-preview{display:flex;flex-direction:column;align-items:center;justify-self:center;width:auto;max-width:100%;padding:0;overflow:hidden}#recordings-detail-2 .recording-popup-preview img{display:block;width:auto;max-width:100%;height:540px;max-height:none;object-fit:contain;object-position:center;margin:0 auto}#recordings-detail-2 .recording-popup-preview .enlarge{position:static;display:flex;justify-content:center;align-items:center;gap:7px;align-self:stretch;padding:11px 13px;margin:0;border-radius:0;white-space:normal;line-height:1.4;font-size:12px;text-align:center;transform:none}@media(max-width:650px){#recordings-detail-2 .recording-popup-preview img{height:500px}}