.recorder-workbench{--recorder-accent:#31867f;--recorder-tint:#f4f9f8;overflow:hidden}.recorder-workbench button,.recorder-workbench select,.recorder-workbench input{font:inherit}.recorder-workbench button:disabled{opacity:.5;cursor:not-allowed}.recorder-privacy{background:var(--recorder-tint);color:var(--ink-soft);border-bottom:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 24px;padding:17px 24px;font-size:14px;display:flex}.recorder-privacy span{align-items:center;gap:8px;display:inline-flex}.recorder-layout{grid-template-columns:minmax(0,1.65fr) minmax(290px,1fr);display:grid}.recorder-main,.recorder-settings{min-width:0;padding:26px}.recorder-settings{border-left:1px solid var(--line);background:var(--recorder-tint)}.recorder-workbench h2{margin:0;font-size:20px;line-height:1.5}.recorder-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px;display:flex}.recorder-status{overflow-wrap:anywhere;max-width:100%;color:var(--muted);align-items:center;gap:7px;font-size:14px;font-weight:700;line-height:1.6;display:inline-flex}.recorder-status.is-recording{color:#b6534a}.recorder-status i,.recorder-record-dot{background:#dd6c61;border-radius:50%;width:10px;height:10px}.recorder-record-dot{background:#fff}.recorder-preview{aspect-ratio:16/9;color:#d8e6e7;background:#152631;border-radius:14px;position:relative;overflow:hidden}.recorder-preview video{object-fit:contain;width:100%;height:100%;display:block}.recorder-empty,.recorder-overlay{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:24px;display:flex;position:absolute;inset:0}.recorder-empty svg{color:#86b9b4}.recorder-empty strong{font-size:21px}.recorder-empty p{color:#a6bac3;margin:0;font-size:15px;line-height:1.7}.recorder-overlay{background:#152631a6}.recorder-countdown{font-size:72px;font-weight:800}.recorder-controls{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;margin-top:22px;display:flex}.recorder-clock strong{font-variant-numeric:tabular-nums;font-size:28px;display:block}.recorder-clock span{color:var(--muted);margin-top:4px;font-size:14px;display:block}.recorder-buttons{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.recorder-workbench .recorder-primary,.recorder-workbench .ghost-button{border:1px solid var(--line);background:var(--paper);min-height:46px;color:var(--ink-soft);white-space:nowrap;border-radius:11px;justify-content:center;align-items:center;gap:8px;padding:12px 16px;font-size:15px;font-weight:750;display:inline-flex}.recorder-workbench .recorder-primary{color:#fff;background:linear-gradient(125deg,#49a69b,#2e7e78);border-color:#0000}.recorder-workbench .recorder-stop{background:#b6534a}.recorder-finishing{align-items:center;gap:8px;font-size:15px;display:flex}.recorder-settings fieldset{border:0;min-width:0;margin:18px 0;padding:0}.recorder-settings fieldset:disabled{opacity:.65}.recorder-settings .recorder-webcam-settings{border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:16px}.recorder-webcam-settings legend{padding:0 7px;font-size:15px;font-weight:750}.recorder-webcam-layout{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.recorder-corners{border:1px solid var(--line);background:var(--recorder-tint);border-radius:10px;grid-template-columns:repeat(2,44px);gap:6px;padding:6px;display:grid}.recorder-corners button,.recorder-webcam-sizes button{border:1px solid var(--line);color:var(--ink-soft);background:var(--paper);cursor:pointer;border-radius:7px;min-height:40px;font-weight:700}.recorder-corners button{font-size:24px}.recorder-webcam-sizes{flex-wrap:wrap;gap:5px;display:flex}.recorder-webcam-sizes button{padding:8px 10px;font-size:14px}.recorder-webcam-layout button[aria-pressed=true]{border-color:var(--recorder-accent);background:var(--recorder-tint);color:var(--recorder-accent);box-shadow:inset 0 0 0 1px var(--recorder-accent)}.recorder-option{cursor:pointer;align-items:flex-start;gap:12px;margin:18px 0;display:flex}.recorder-option input{width:20px;height:20px;accent-color:var(--recorder-accent);flex:none;margin-top:2px}.recorder-option strong{align-items:center;gap:7px;font-size:16px;display:flex}.recorder-option small{color:var(--muted);margin-top:6px;font-size:14px;line-height:1.7;display:block}.recorder-resolution{gap:9px;margin-top:24px;font-size:15px;font-weight:700;display:grid}.recorder-resolution select{border:1px solid var(--line);background:var(--paper);min-width:0;max-width:100%;color:var(--ink);border-radius:9px;padding:12px}.recorder-note,.recorder-tip p{color:var(--ink-soft);word-break:keep-all;overflow-wrap:anywhere;margin:12px 0 0;font-size:14px;line-height:1.8}.recorder-share-hint{color:#23756e;font-weight:700}.recorder-tip{border:1px solid var(--line);background:var(--recorder-tint);border-radius:12px;margin-top:20px;padding:20px}.recorder-tip strong{color:var(--recorder-accent);font-size:16px}.recorder-audio-check{border:1px solid var(--line);background:var(--paper);border-radius:12px;margin:20px 0;padding:18px}.recorder-audio-check>strong{font-size:16px}.recorder-audio-check>div{grid-template-columns:76px minmax(30px,1fr) auto;align-items:center;gap:10px;margin:14px 0;font-size:14px;display:grid}.recorder-audio-check meter{width:100%;height:16px;accent-color:var(--recorder-accent)}.recorder-audio-check small{color:var(--muted);font-size:12px}.recorder-message{color:#885c2b;background:#fff5e9;border:1px solid #f2dec3;border-radius:10px;align-items:flex-start;gap:10px;margin:20px;padding:16px 20px;font-size:15px;line-height:1.8;display:flex}.recorder-message p{overflow-wrap:anywhere;word-break:keep-all;margin:0}.recorder-message p+p{margin-top:10px}.recorder-message svg{flex:none;margin-top:4px}.recorder-message.is-error{color:#a14e3b;background:#fff0ed;border-color:#f0d1c7}.recorder-limit-note{padding:0 26px 18px}.recorder-result{border-top:1px solid var(--line);padding:26px;scroll-margin-top:88px}.recorder-result-heading{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:18px;display:flex}.recorder-result-heading p{color:var(--muted);margin:6px 0 0;font-size:14px}.recorder-result-video{background:#152631;border-radius:12px;width:100%;min-height:160px;max-height:500px;display:block}.recorder-saved{color:var(--recorder-accent);margin:12px 0 0;font-size:14px}.recorder-backup{border:1px solid var(--line);background:var(--recorder-tint);border-radius:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;margin-top:20px;padding:18px;display:flex}.recorder-backup strong{font-size:15px}.recorder-backup p{color:var(--muted);margin:6px 0 0;font-size:14px}html[data-theme=dark] .recorder-workbench{--recorder-tint:#182928;--recorder-accent:#89cec1}html[data-theme=dark] .recorder-share-hint{color:var(--recorder-accent)}html[data-theme=dark] .recorder-message{color:#ecc28f;background:#332a1f;border-color:#554532}html[data-theme=dark] .recorder-message.is-error{color:#ffc2a7;background:#36251f;border-color:#57362d}@media (max-width:1050px){.recorder-layout{grid-template-columns:minmax(0,1fr)}.recorder-settings{border-left:0;border-top:1px solid var(--line)}}@media (max-width:600px){.recorder-main,.recorder-settings,.recorder-result,.recorder-privacy{padding:18px 16px}.recorder-empty{gap:9px;padding:16px}.recorder-empty strong{font-size:17px}.recorder-empty p{font-size:13px}.recorder-empty svg{width:32px;height:32px}.recorder-buttons{width:100%}.recorder-buttons button{flex:auto;white-space:normal!important}.recorder-message{margin:16px;padding:14px}}
