/* Minimal Capture stage: one shared shader canvas and one dominant action. */
#capture-panel[hidden],#capture-backdrop[hidden]{display:none}
.capture-view{background:#080b0e;color:#f3eee6}
.capture-view .topbar{height:64px;min-height:64px;background:#0b0d10e8;border-bottom:1px solid #ffffff12;backdrop-filter:blur(15px)}
.capture-view .brand{flex:1;width:auto;border:0;gap:13px}.capture-view .brand svg{color:#d8b478}.capture-view .brand span{font-size:10px;letter-spacing:2.4px}
.capture-view .topbar nav,.capture-view .visualizer-toggle,.capture-view .monitor-status,.capture-view .add-top,.capture-view .library{display:none}
.capture-view .view-switch{background:#0c0e12aa;border-color:#ffffff1f;margin-right:18px}.capture-view .view-switch button[aria-pressed=true]{color:#f1d8a6;background:#393025;box-shadow:inset 0 0 0 1px #8a704e66}
.capture-view .workspace{display:block;min-height:calc(100svh - 64px)}.capture-view main{position:relative;max-width:none;width:100%;margin:0;padding:0;isolation:isolate}
.capture-view main>:not(#capture-panel):not(#capture-backdrop){display:none!important}
#capture-backdrop{position:fixed;inset:64px 0 0;z-index:-2;pointer-events:none;background:#080b0e}
#capture-backdrop canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
#capture-backdrop::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#05070b66 0,#05070b10 25%,#05070b33 54%,#05070ba8 100%),radial-gradient(ellipse at 50% 68%,#070a0f66,transparent 52%)}
#capture-panel{position:relative;min-height:calc(100svh - 64px);display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto 1fr auto;padding:28px 36px 24px;gap:0 24px;font-family:var(--mono);--capture-progress:0%}
.capture-source{display:flex;align-items:flex-start;gap:14px;min-width:0;grid-column:1;grid-row:1;max-width:650px}
.capture-source>div{min-width:0}.capture-eyebrow{display:none}
.capture-source h1{font-family:var(--sans);font-size:19px;font-weight:450;letter-spacing:.1px;line-height:1.4;margin:0 0 5px;overflow-wrap:anywhere;text-shadow:0 2px 12px #0008}
.capture-source p{font-size:9px;line-height:1.8;letter-spacing:.2px;color:#b9b6b0;margin:0;text-shadow:0 1px 7px #000}
#capture-choose{min-width:44px;min-height:44px;margin-top:-7px;color:#e8cf9b;font-size:22px;border:1px solid #bba77b33;border-radius:50%;background:#13141860;backdrop-filter:blur(12px)}
.capture-transport-line{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:14px;grid-column:2;grid-row:1;align-self:start;color:#d6ccc0;max-width:300px}
#capture-source-state{font-size:8px;letter-spacing:1.4px;color:#c6beb2}#capture-source-state.playing{color:#eac385}
#capture-position{font-size:11px;letter-spacing:.8px;font-variant-numeric:tabular-nums}
.capture-transport-line button{min-height:44px;font-family:var(--sans);font-size:10px;color:#dec59a;padding:0 4px}
#capture-mute{display:none}
.capture-scene{position:absolute;right:36px;bottom:22px;display:flex;align-items:center;gap:12px;max-width:calc(100% - 72px);color:#afa89c;font-size:8px;letter-spacing:1.5px}
#capture-preset{height:44px;min-height:44px;padding:0 26px 0 11px;font-family:var(--sans);font-size:11px;color:#d3cbc0;border:1px solid #cfc2a626;border-radius:7px;background:#0a0d13a6;backdrop-filter:blur(12px);max-width:200px}
.capture-spectrum-panel,.capture-wave-panel,.capture-recent,#capture-help,.capture-footnote{display:none}
.capture-action{grid-column:1/-1;grid-row:2;align-self:center;justify-self:center;display:flex;flex-direction:column;align-items:center;text-align:center;padding:55px 0 70px;min-width:0}
.capture-state-label{font-size:10px;color:#d1c7b4;letter-spacing:3px;min-height:15px;text-shadow:0 2px 10px #000}
#capture-elapsed{font-family:var(--mono);font-size:30px;letter-spacing:2px;line-height:1.5;color:#eae5db;margin-top:7px;font-variant-numeric:tabular-nums;text-shadow:0 2px 15px #000}
.capture-dial{position:relative;width:224px;height:224px;display:grid;place-items:center;border-radius:50%;margin-top:26px;background:conic-gradient(from -90deg,#efb765 var(--capture-progress),#ddbc7e21 var(--capture-progress));box-shadow:inset 0 0 0 1px #ffdd9e20,0 12px 55px #0007}
.capture-dial::before{content:'';position:absolute;inset:3px;border-radius:50%;background:#0a0e13b3;backdrop-filter:blur(14px);box-shadow:inset 0 1px 2px #f8d49a33}
.capture-dial::after{content:'';position:absolute;inset:10px;border-radius:50%;pointer-events:none;border:1px solid #c8a16355}
#capture-button{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:21px;width:192px;height:192px;border-radius:50%;border:1px solid #dca95a;background:radial-gradient(ellipse at 33% 8%,#9a7138 0,#544123 13%,#2c251c 36%,#111215 73%);box-shadow:inset 0 2px 3px #ffdda655,inset 0 -14px 30px #000b,0 4px 24px #0009;color:#fff0d4;transition:transform 120ms ease,border-color 120ms ease}
#capture-button:hover{border-color:#ffe1a4;background:radial-gradient(ellipse at 33% 8%,#ac854a,#554127 15%,#2c251c 40%,#121316 78%)}#capture-button:active{transform:scale(.97)}#capture-button:disabled{opacity:.5;cursor:default}
.capture-button-symbol{width:40px;height:40px;border-radius:50%;border:3px solid #ffc674;box-shadow:0 0 15px #ffb9511c}
#capture-button-label{font-family:var(--sans);font-size:14px;letter-spacing:1.2px}
.is-capturing .capture-button-symbol{width:31px;height:31px;border-radius:3px;background:#ffc06b;border:0;box-shadow:inset 0 1px 1px #ffe4b3,0 0 17px #ffbd6822}
.is-capturing .capture-state-label,.is-capturing #capture-elapsed{color:#ffcb83}
.capture-feedback{position:absolute;left:24px;right:24px;bottom:83px;text-align:center;font-size:10px;line-height:1.8;color:#efd6ad;text-shadow:0 2px 9px #000}
.capture-feedback.error{color:#ffce91}
#capture-graphics-status{position:absolute;bottom:88px;left:24px;right:24px;font-size:10px;line-height:1.7;color:#e0c49d;text-align:center}
@media(max-width:760px){
 body.capture-view .topbar{height:62px;min-height:62px;flex-wrap:nowrap}
 .capture-view .brand{min-height:62px;padding:0 11px;gap:8px}.capture-view .brand span{font-size:8px;letter-spacing:1px}.capture-view .brand svg{width:21px}
 body.capture-view .view-switch{flex-basis:auto;order:0;margin:0 8px 0 4px;border:1px solid #ffffff1f;border-radius:9px;padding:3px}
 body.capture-view .view-switch button{min-width:46px;padding:0 7px;font-size:9px}
 .simple-view .view-switch button{min-width:46px;padding:0 7px;font-size:9px}.simple-view .brand{padding-left:12px;gap:6px}.simple-view .brand span{font-size:8px;letter-spacing:.8px}.simple-view .view-switch{margin-right:8px}
 #capture-backdrop{top:62px}
 #capture-panel{min-height:calc(100svh - 62px);padding:22px 20px 18px;display:flex;flex-direction:column;gap:0}
 .capture-source{max-width:100%;justify-content:space-between}.capture-source h1{font-size:18px}.capture-source p{font-size:8px}
 .capture-transport-line{align-self:stretch;justify-content:flex-start;max-width:none;gap:14px;margin-top:3px}
 #capture-position{margin-right:auto;font-size:11px}
 .capture-action{align-self:center;flex:1;justify-content:center;padding:20px 0 100px}
 .capture-state-label{font-size:10px}
 #capture-elapsed{font-size:28px}
 .capture-dial{width:208px;height:208px;margin-top:22px}
 #capture-button{width:176px;height:176px;font-size:13px;gap:20px}
 .capture-scene{right:20px;bottom:17px;max-width:calc(100% - 40px);font-size:7px;letter-spacing:1px}
 #capture-preset{font-size:10px;max-width:180px}
 .capture-feedback{bottom:78px;font-size:9px;left:20px;right:20px}
}
@media(max-width:360px){.capture-view .brand{gap:6px;padding-left:8px}.capture-view .brand span{font-size:7px;letter-spacing:.5px}body.capture-view .view-switch button{min-width:42px;padding:0 5px}.simple-view .brand span{font-size:7px}.simple-view .view-switch button{min-width:42px;padding:0 5px}#capture-panel{padding-left:16px;padding-right:16px}.capture-source h1{font-size:17px}}
@media(max-height:680px){.capture-action{padding-top:10px;padding-bottom:90px}.capture-dial{width:184px;height:184px;margin-top:14px}#capture-button{width:155px;height:155px}#capture-elapsed{font-size:24px}}
@media(prefers-reduced-motion:reduce){#capture-button{transition:none}}

#capture-credit{position:absolute;bottom:28px;left:36px;font-size:8px;letter-spacing:.2px;color:#b9b0a2;text-decoration:none;z-index:1}#capture-credit[hidden]{display:none}#capture-credit:hover{text-decoration:underline}@media(max-width:760px){#capture-credit{left:20px;bottom:66px;font-size:7px}}

.capture-listen{min-height:48px;min-width:166px;margin-top:24px;padding:0 26px;border:1px solid #e9c58b77;border-radius:28px;background:#0b0e14bc;backdrop-filter:blur(15px);color:#fff0d4;font:14px var(--sans);letter-spacing:.5px;display:flex;align-items:center;justify-content:center;gap:12px;box-shadow:0 5px 24px #0005}
.capture-listen::before{content:'';width:0;height:0;border-left:10px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent}
.capture-listen[aria-pressed=true]::before{width:10px;height:12px;border:0;border-left:3px solid currentColor;border-right:3px solid currentColor}
.capture-listen:hover{border-color:#ffe0a2;background:#25221dcf}.capture-listen:disabled{opacity:.5}
.capture-saved{position:absolute;left:24px;right:24px;bottom:82px;text-align:center}.capture-saved .capture-feedback{position:static}.capture-saved button{margin:5px auto 0;min-height:36px;font:11px var(--sans);color:#ffd99d;text-decoration:underline}#capture-download-last[hidden]{display:none}
#choose-live{width:100%;margin:0 0 12px;border:1px solid #b78c4a88;background:#30271c}
@media(max-width:760px){.capture-listen{margin-top:20px;min-height:46px;min-width:160px;font-size:13px}.capture-action{padding-bottom:132px}.capture-saved{bottom:92px;left:20px;right:20px}.capture-feedback{font-size:9px}#capture-credit{bottom:68px}}
@media(max-height:680px){.capture-listen{margin-top:14px;min-height:44px}.capture-action{padding-bottom:118px}}
