.screen-recorder-page [hidden]{display:none!important}.screen-recorder-page .screen-recorder-tool{padding:clamp(18px,2.4vw,28px)}.screen-recorder-page .sr-app-header,.screen-recorder-page .sr-controls,.screen-recorder-page .sr-download-bar,.screen-recorder-page .sr-panel-heading,.screen-recorder-page .sr-result-header{align-items:center;display:flex;gap:18px;justify-content:space-between}.screen-recorder-page .sr-app-header{border-bottom:1px solid var(--color-border);padding:4px 4px 24px}.screen-recorder-page .sr-explainer>header>span,.screen-recorder-page .sr-kicker,.screen-recorder-page .sr-result-header>div>span{color:var(--color-primary);display:block;font-size:.72rem;font-weight:800;letter-spacing:.13em;margin-bottom:7px}.screen-recorder-page .sr-app-header h2{color:var(--color-text);font-size:clamp(1.3rem,2vw,1.7rem);letter-spacing:-.03em;margin:0}.screen-recorder-page .sr-app-header p{color:var(--color-text-secondary);font-size:.91rem;line-height:1.65;margin:7px 0 0;max-width:650px}.screen-recorder-page .sr-local-badge{align-items:center;background:#ecfdf5;border:1px solid #bbf7d0;border-radius:999px;color:#087443;display:inline-flex;flex:0 0 auto;font-size:.77rem;font-weight:750;gap:8px;padding:9px 12px;white-space:nowrap}.screen-recorder-page .sr-control-button svg,.screen-recorder-page .sr-download-button svg,.screen-recorder-page .sr-limit svg,.screen-recorder-page .sr-local-badge svg,.screen-recorder-page .sr-primary-button svg,.screen-recorder-page .sr-privacy-note svg,.screen-recorder-page .sr-reset-button svg,.screen-recorder-page .sr-stop-button svg{fill:none;height:18px;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.9;width:18px}.screen-recorder-page .sr-workspace{display:grid;gap:18px;grid-template-columns:minmax(270px,.83fr) minmax(0,1.17fr);padding:24px 0 20px}.screen-recorder-page .sr-preview-panel,.screen-recorder-page .sr-settings{background:color-mix(in srgb,var(--color-bg-secondary) 82%,#f8faff);border:1px solid var(--color-border);border-radius:19px;min-width:0;padding:clamp(18px,2.1vw,24px)}.screen-recorder-page .sr-panel-heading{align-items:flex-start;justify-content:flex-start;margin-bottom:18px}.screen-recorder-page .sr-panel-heading>span{background:var(--color-primary-light);border-radius:9px;color:var(--color-primary);display:grid;flex:0 0 28px;font-size:.71rem;font-weight:800;height:28px;place-items:center;width:28px}.screen-recorder-page .sr-panel-heading h3{color:var(--color-text);font-size:1rem;line-height:1.35;margin:0}.screen-recorder-page .sr-panel-heading p{color:var(--color-text-secondary);font-size:.78rem;line-height:1.5;margin:3px 0 0}.screen-recorder-page .sr-setting-grid{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}.screen-recorder-page .sr-field{display:grid;gap:7px}.screen-recorder-page .sr-audio-options legend,.screen-recorder-page .sr-field>span{color:var(--color-text);font-size:.8rem;font-weight:750}.screen-recorder-page .sr-field select{background:var(--color-bg);border:1px solid var(--color-border);border-radius:11px;color:var(--color-text);font:inherit;font-size:.82rem;min-height:43px;padding:0 11px;width:100%}.screen-recorder-page .sr-audio-options{border:0;display:grid;gap:8px;margin:19px 0 0;min-width:0;padding:0}.screen-recorder-page .sr-audio-options legend{margin-bottom:1px;padding:0}.screen-recorder-page .sr-audio-options label{align-items:flex-start;background:hsla(0,0%,100%,.66);border:1px solid var(--color-border);border-radius:11px;color:var(--color-text);cursor:pointer;display:flex;gap:9px;padding:10px;transition:border-color .16s,background-color .16s}.screen-recorder-page .sr-audio-options label:has(input:checked){background:rgba(238,242,255,.78);border-color:rgba(79,70,229,.58)}.screen-recorder-page .sr-audio-options input{accent-color:var(--color-primary);flex:0 0 auto;height:16px;margin:2px 0 0;width:16px}.screen-recorder-page .sr-audio-options span{display:grid;gap:2px}.screen-recorder-page .sr-audio-options strong{font-size:.79rem}.screen-recorder-page .sr-audio-options small{color:var(--color-text-secondary);font-size:.7rem;line-height:1.38}.screen-recorder-page .sr-privacy-note{align-items:flex-start;border-top:1px solid var(--color-border);color:var(--color-text-secondary);display:flex;font-size:.72rem;gap:7px;line-height:1.55;margin-top:16px;padding-top:15px}.screen-recorder-page .sr-privacy-note svg{color:var(--color-primary);flex:0 0 auto;height:16px;width:16px}.screen-recorder-page .sr-preview-stage{background:radial-gradient(circle at 50% 25%,#273358 0,#11182d 47%,#080d1c 100%);border:1px solid rgba(99,102,241,.22);border-radius:16px;color:#fff;display:grid;min-height:305px;overflow:hidden;position:relative}.screen-recorder-page .sr-preview-stage video{background:#050814;height:100%;max-height:480px;min-height:305px;object-fit:contain;width:100%}.screen-recorder-page .sr-preview-stage video[hidden]{display:none}.screen-recorder-page .sr-preview-empty{display:grid;gap:9px;justify-items:center;padding:25px;place-content:center;text-align:center}.screen-recorder-page .sr-preview-empty strong{font-size:.98rem}.screen-recorder-page .sr-preview-empty p{color:#b8c3dc;font-size:.78rem;line-height:1.55;margin:0;max-width:290px}.screen-recorder-page .sr-preview-icon{background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.18);border-radius:16px;color:#d9e1ff;display:grid;height:52px;margin-bottom:3px;place-items:center;width:52px}.screen-recorder-page .sr-preview-icon svg{fill:none;height:26px;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8;width:26px}.screen-recorder-page .sr-recording-indicator{align-items:center;backdrop-filter:blur(8px);background:rgba(15,23,42,.72);border:1px solid hsla(0,0%,100%,.19);border-radius:999px;color:#fff;display:inline-flex;font-size:.7rem;gap:7px;left:13px;padding:7px 9px;position:absolute;top:13px}.screen-recorder-page .sr-recording-indicator span{animation:srBlink 1.1s infinite;background:#fb4f5d;border-radius:50%;box-shadow:0 0 0 3px rgba(251,79,93,.2);height:8px;width:8px}.screen-recorder-page .sr-recording-indicator b{font-size:.68rem;letter-spacing:.07em}.screen-recorder-page .sr-recording-indicator time{border-left:1px solid hsla(0,0%,100%,.25);font-variant-numeric:tabular-nums;padding-left:2px}@keyframes srBlink{50%{opacity:.3}}.screen-recorder-page .sr-controls{flex-wrap:wrap;justify-content:flex-start;padding:18px 4px 2px}.screen-recorder-page .sr-control-button,.screen-recorder-page .sr-download-button,.screen-recorder-page .sr-primary-button,.screen-recorder-page .sr-reset-button,.screen-recorder-page .sr-stop-button{align-items:center;border-radius:12px;cursor:pointer;display:inline-flex;font:inherit;font-size:.83rem;font-weight:750;gap:8px;justify-content:center;min-height:43px;padding:0 15px;transition:transform .16s,box-shadow .16s,border-color .16s,background-color .16s}.screen-recorder-page .sr-primary-button{background:linear-gradient(135deg,#7c3aed,#2563eb);border:0;box-shadow:0 10px 20px rgba(79,70,229,.23);color:#fff}.screen-recorder-page .sr-primary-button:hover{box-shadow:0 13px 26px rgba(79,70,229,.32);transform:translateY(-1px)}.screen-recorder-page .sr-control-button,.screen-recorder-page .sr-reset-button{background:var(--color-bg-secondary);border:1px solid var(--color-border);color:var(--color-text)}.screen-recorder-page .sr-stop-button{background:#fff4f2;border:1px solid #fecdca;color:#b42318}.screen-recorder-page .sr-stop-button:hover{background:#d92d20;border-color:#d92d20;color:#fff}.screen-recorder-page .sr-status{background:#fff4f2;border:1px solid #fecdca;border-radius:12px;color:#b42318;font-size:.81rem;line-height:1.5;margin-top:15px;padding:12px 14px}.screen-recorder-page .sr-status.is-success{background:#ecfdf3;border-color:#abefc6;color:#087443}.screen-recorder-page .sr-status.is-info{background:#eff8ff;border-color:#b2ddff;color:#175cd3}.screen-recorder-page .sr-result{background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-2xl);box-shadow:var(--shadow-subtle);margin-top:var(--space-10);padding:var(--space-8)}.screen-recorder-page .sr-result-header{align-items:flex-start;margin-bottom:19px}.screen-recorder-page .sr-result-header h2{color:var(--color-text);font-size:var(--text-2xl);letter-spacing:-.025em;margin:0}.screen-recorder-page .sr-result-header p{color:var(--color-text-secondary);font-size:.84rem;margin:6px 0 0}.screen-recorder-page .sr-reset-button:hover{background:var(--color-primary-light);border-color:var(--color-primary);color:var(--color-primary)}.screen-recorder-page .sr-result-video{background:#070b15;border-radius:15px;display:block;max-height:600px;width:100%}.screen-recorder-page .sr-download-bar{background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:14px;margin-top:16px;padding:15px}.screen-recorder-page .sr-download-bar>div{display:grid;gap:3px;min-width:0}.screen-recorder-page .sr-download-bar strong{color:var(--color-text);font-size:.83rem}.screen-recorder-page .sr-download-bar span{color:var(--color-text-secondary);font-size:.72rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.screen-recorder-page .sr-download-button{background:var(--color-primary);border:1px solid var(--color-primary);color:#fff;flex:0 0 auto}.screen-recorder-page .sr-download-button:hover{background:#4338ca}.screen-recorder-page .sr-explainer{background:linear-gradient(135deg,#fff,#f7f8ff);border:1px solid var(--color-border);border-radius:var(--radius-2xl);box-shadow:var(--shadow-subtle);margin-top:var(--space-10);padding:var(--space-8)}.screen-recorder-page .sr-explainer>header h2{color:var(--color-text);font-size:var(--text-2xl);letter-spacing:-.025em;margin:0}.screen-recorder-page .sr-explainer>header p{color:var(--color-text-secondary);font-size:.9rem;line-height:1.7;margin:10px 0 0;max-width:820px}.screen-recorder-page .sr-explainer-grid{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:22px}.screen-recorder-page .sr-explainer-grid article{background:hsla(0,0%,100%,.72);border:1px solid var(--color-border);border-radius:14px;padding:15px}.screen-recorder-page .sr-explainer-grid article>span{color:var(--color-primary);font-size:.7rem;font-weight:800;letter-spacing:.08em}.screen-recorder-page .sr-explainer-grid h3{color:var(--color-text);font-size:.94rem;margin:7px 0 5px}.screen-recorder-page .sr-explainer-grid p{color:var(--color-text-secondary);font-size:.78rem;line-height:1.65;margin:0}.screen-recorder-page .sr-limit{align-items:flex-start;background:#fffaeb;border:1px solid #fedf89;border-radius:13px;color:#9a5a07;display:flex;gap:10px;margin-top:14px;padding:13px}.screen-recorder-page .sr-limit svg{flex:0 0 auto}.screen-recorder-page .sr-limit p{font-size:.78rem;line-height:1.6;margin:0}html[data-theme=dark] .screen-recorder-page .sr-local-badge{background:rgba(6,78,59,.35);border-color:rgba(52,211,153,.26);color:#6ce9a6}html[data-theme=dark] .screen-recorder-page .sr-audio-options label,html[data-theme=dark] .screen-recorder-page .sr-download-bar,html[data-theme=dark] .screen-recorder-page .sr-explainer,html[data-theme=dark] .screen-recorder-page .sr-explainer-grid article,html[data-theme=dark] .screen-recorder-page .sr-preview-panel,html[data-theme=dark] .screen-recorder-page .sr-result,html[data-theme=dark] .screen-recorder-page .sr-settings{background:var(--color-bg-secondary)}html[data-theme=dark] .screen-recorder-page .sr-limit{background:rgba(120,53,15,.18);border-color:rgba(245,158,11,.32);color:#f7c66c}html[data-theme=dark] .screen-recorder-page .sr-stop-button{background:rgba(127,29,29,.28);border-color:hsla(0,91%,71%,.3);color:#fda29b}@media (max-width:900px){.screen-recorder-page .sr-workspace{grid-template-columns:1fr}.screen-recorder-page .sr-preview-stage{min-height:280px}}@media (max-width:660px){.screen-recorder-page .sr-app-header,.screen-recorder-page .sr-download-bar,.screen-recorder-page .sr-result-header{align-items:stretch;flex-direction:column}.screen-recorder-page .sr-local-badge{align-self:flex-start}.screen-recorder-page .sr-setting-grid{grid-template-columns:1fr}.screen-recorder-page .sr-primary-button,.screen-recorder-page .sr-stop-button{width:100%}.screen-recorder-page .sr-controls{display:grid;grid-template-columns:1fr}.screen-recorder-page .sr-control-button{width:100%}.screen-recorder-page .sr-explainer-grid{grid-template-columns:1fr}.screen-recorder-page .sr-explainer,.screen-recorder-page .sr-result{padding:17px}}@media (prefers-reduced-motion:reduce){.screen-recorder-page .sr-recording-indicator span{animation:none}}