.recording-player{position:relative;isolation:isolate;max-width:100%;background:#090a0b;border-radius:4px;overflow:hidden}
.recording-player .project-video{margin:0}
.recording-start{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;width:100%;border:0;color:#f5e7cf;background:linear-gradient(transparent 30%,#0e0c0840 100%);font:inherit;cursor:pointer}
.recording-start[hidden],.recording-notice[hidden],.recording-original[hidden]{display:none}
.recording-start-icon{display:grid;place-items:center;width:62px;height:62px;border:1px solid #ead1a89c;border-radius:50%;background:#17130cc9;box-shadow:0 0 0 7px #18140c35,0 8px 28px #0005;backdrop-filter:blur(8px);transition:transform .25s,background .25s}
.recording-start-icon svg{width:20px;height:20px;margin-left:3px;fill:currentColor}
.recording-start-label{padding:7px 15px;background:#15120dd9;border:1px solid #d9bf9545;border-radius:2px;font-size:14px;letter-spacing:.14em}
.recording-start:hover .recording-start-icon{transform:scale(1.09);background:#59442bd9}
.recording-start:focus-visible{outline:2px solid #f1d2a0;outline-offset:-5px}
.recording-start:disabled{cursor:progress}
.recording-notice{position:absolute;top:14px;left:50%;z-index:2;transform:translateX(-50%);max-width:calc(100% - 28px);padding:7px 12px;border:1px solid #d9bf9545;border-radius:3px;background:#17130ce8;color:#f5e7cf;font-size:12px;text-align:center;pointer-events:none}
.recording-original{position:absolute;bottom:22px;left:50%;z-index:2;transform:translateX(-50%);padding:8px 12px;border-bottom:1px solid #b99a66;color:#f5e7cf;background:#17130ce8;font-size:12px;white-space:nowrap}
@media(prefers-reduced-motion:reduce){.recording-start-icon{transition:none}}