.camera-modal{width:min(92vw,460px)}.camera-modal .modal-body{padding:14px 16px 18px;max-height:calc(90vh - 100px);max-height:calc(90dvh - 100px)}.camera-intro{font-size:13px;margin:0 0 12px;line-height:1.7}.camera-stage{position:relative;background:#0b1721;border-radius:15px;overflow:hidden;min-height:170px;height:clamp(170px,36vh,300px);isolation:isolate}.camera-stage video{display:block;width:100%;height:100%;object-fit:cover}.camera-guide{position:absolute;width:65%;aspect-ratio:1;max-height:85%;top:50%;left:50%;transform:translate(-50%,-50%);border:2px solid #d7edff99;border-radius:13px;pointer-events:none;box-shadow:0 0 0 80px #07142018}.camera-guide:before,.camera-guide:after{content:"";position:absolute;inset:-3px;border:3px solid #e9f7ff;border-radius:12px;clip-path:polygon(0 0,20% 0,20% 3%,3% 3%,3% 20%,0 20%,0 0,100% 0,100% 20%,97% 20%,97% 3%,80% 3%,80% 0,100% 0,100% 100%,80% 100%,80% 97%,97% 97%,97% 80%,100% 80%,100% 100%,0 100%,0 80%,3% 80%,3% 97%,20% 97%,20% 100%,0 100%)}.camera-stage[data-state="stopped"]:after,.camera-stage[data-state="starting"]:after{content:"请允许使用摄像头";position:absolute;inset:0;display:grid;place-items:center;font-size:14px;color:#e5f3ff;pointer-events:none}.camera-stage[data-state="running"] .camera-guide{border-color:#e9f7ff}.camera-status{font-size:13px;line-height:1.75;color:#3e6582;margin:12px 0;min-height:23px;overflow-wrap:anywhere}.camera-status.error{color:#a73e33}.camera-controls{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.camera-controls button,.camera-photo{display:inline-flex;justify-content:center;align-items:center;min-height:42px;border:1px solid #c4dcf0;border-radius:10px;background:#eff7ff;color:#174775;padding:9px 14px;font-family:inherit;font-size:13px;font-weight:600;line-height:1.5;cursor:pointer;position:relative}.camera-controls button:disabled{opacity:.5}.camera-photo input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.camera-photo:focus-within{outline:3px solid #f5bc43;outline-offset:2px}.camera-device{display:block;width:100%;font-size:13px;padding:9px 10px;border:1px solid #c4dcf0;border-radius:9px;margin-top:10px;background:#fff;color:#174775}.camera-privacy{font-size:11px;color:#7f93a2;line-height:1.6;margin:12px 0 0}.camera-modal .close-modal{min-width:36px}.camera-hint-link{font-size:12px;color:#306f9e;text-underline-offset:3px}.camera-preview-link{margin:10px 0 0;text-align:center;font-size:12px}@media(max-height:570px){.camera-stage{height:170px;min-height:170px}.camera-modal .modal-head{padding:12px 16px}.camera-intro{margin-bottom:8px}.camera-status{margin:8px 0}.camera-privacy{margin-top:8px}}@media(orientation:landscape) and (max-height:500px){.camera-stage{height:150px;min-height:150px}.camera-modal .modal-body{max-height:calc(90vh - 70px)}}

/* Full viewport camera, including WeChat browser safe areas. */
dialog.camera-modal,dialog.camera-modal.fallback-modal[open]{position:fixed;inset:0;margin:0;transform:none;width:100vw;max-width:none;height:var(--view-height,100dvh);max-height:none;padding:0;border:0;border-radius:0;background:#071420;color:white;overflow:hidden}
.camera-modal #modal-content{height:100%;position:relative}
.camera-modal .modal-head{position:absolute;z-index:4;inset:0 0 auto;border:0;background:linear-gradient(#0009,transparent);padding:calc(16px + env(safe-area-inset-top,0px)) 20px 24px}
.camera-modal .modal-head h2{font-size:18px;color:#fff}
.camera-modal .close-modal{background:#ffffff26;color:#fff;width:42px;height:42px}
.camera-modal .modal-body{position:absolute;inset:0;max-height:none;height:100%;padding:0;overflow:hidden}
.camera-modal .camera-stage{position:absolute;inset:0;width:100%;height:100%;min-height:0;border-radius:0}
.camera-modal .camera-stage video{width:100%;height:100%;object-fit:cover}
.camera-modal .camera-guide{width:min(72vw,330px,50vh);height:min(72vw,330px,50vh);max-height:none;top:45%;box-shadow:0 0 0 100vmax #0005}
.camera-modal .camera-intro{position:absolute;z-index:2;top:calc(78px + env(safe-area-inset-top,0px));left:8%;width:84%;text-align:center;color:#fff;font-size:14px;text-shadow:0 1px 4px #000}
.camera-modal .camera-status{position:absolute;z-index:2;bottom:calc(140px + env(safe-area-inset-bottom,0px));width:84%;left:8%;margin:0;text-align:center;color:#fff;font-size:14px;text-shadow:0 1px 4px #000}
.camera-modal .camera-status.error{color:#ffe0c7}
.camera-modal .camera-controls{position:absolute;z-index:3;bottom:calc(64px + env(safe-area-inset-bottom,0px));width:100%;justify-content:center;padding:0 14px;gap:10px}
.camera-modal .camera-controls button,.camera-modal .camera-photo{background:#ffffff20;color:#fff;border-color:#ffffff66;backdrop-filter:blur(8px);font-size:13px}
.camera-modal .camera-device{position:absolute;z-index:3;bottom:calc(18px + env(safe-area-inset-bottom,0px));left:12%;width:76%;max-width:400px;margin:0;background:#102637cc;color:#fff;border-color:#ffffff55}
.camera-modal .camera-privacy{display:none}
@media(orientation:landscape) and (max-height:500px){.camera-modal .camera-intro{top:70px;font-size:12px}.camera-modal .camera-guide{top:48%;width:42vh;height:42vh}.camera-modal .camera-status{bottom:85px;font-size:12px}.camera-modal .camera-controls{bottom:34px}.camera-modal .camera-device{left:auto;right:18px;bottom:34px;width:160px}.camera-modal .camera-controls{width:60%;left:20%}}
