.logo-studio{--studio-ink:var(--surface-0);--studio-accent:var(--action);--studio-text:var(--text-primary);--studio-secondary:var(--text-secondary);--studio-error:var(--danger);--studio-surface-1:var(--surface-1);--studio-surface-2:var(--surface-2);--studio-surface-3:var(--surface-3);--studio-border:var(--border-default);color:var(--studio-text);background:var(--studio-ink);font-family:var(--font-geist-sans), Arial, sans-serif}.studio-live-region{min-height:24px;color:var(--studio-secondary);padding:8px 24px;font-size:13px}.studio-upload-hero,.entitlement-panel,.editor-rail,.preview-region{border:1px solid var(--studio-border);background:var(--studio-surface-1);border-radius:12px}.studio-upload-hero{grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:48px;max-width:1200px;margin:0 auto 24px;padding:32px;display:grid}.studio-upload-task{min-width:0}.studio-upload-hero h2,.entitlement-panel h2{text-wrap:balance;margin:0 0 12px;font-size:22px;line-height:28px}.studio-upload-hero p,.preview-build-note{color:var(--studio-secondary)}.upload-control{gap:8px;display:grid}.upload-drop-target{cursor:pointer;border:1px solid var(--studio-border);background:var(--studio-surface-1);text-align:center;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:168px;padding:24px;transition:background-color .16s,border-color .16s;display:flex}.upload-drop-target:hover{background:var(--studio-surface-2);border-color:#f4f7f252}.upload-drop-target:focus-within{outline:2px solid var(--studio-accent);outline-offset:3px}.upload-drop-target[data-drag-active=true]{border:2px solid var(--studio-accent);background:#c7ff4a1f}.upload-title{font-size:16px;font-weight:600}.upload-help,.preview-build-note{color:var(--studio-secondary);margin:0;font-size:13px;line-height:18px}.upload-feedback{min-height:18px;color:var(--studio-secondary);border:1px solid #0000;border-radius:8px;margin:0;padding:8px 10px;font-size:13px;line-height:18px}.upload-feedback[data-state=busy]{border-color:var(--studio-border);color:var(--studio-text);background:var(--studio-surface-2)}.upload-progress{border:1px solid var(--studio-border);background:var(--studio-surface-1);border-radius:999px;height:4px;overflow:hidden}.upload-progress:before{content:"";background:var(--studio-secondary);width:52%;height:100%;display:block}.upload-feedback[data-state=error]{border-color:var(--studio-error);color:var(--studio-error)}.upload-control:has(.upload-feedback[data-state=error]) .upload-drop-target{border-color:var(--studio-error)}.upload-feedback[data-state=idle]:not(:empty){border-color:var(--studio-accent);color:var(--studio-accent)}.upload-feedback[data-state=idle]:not(:empty):before{content:"✓ ";font-weight:700}.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.logo-studio button,.logo-studio input{font:inherit}.primary-button,.secondary-button,.quiet-button{border-radius:8px;min-height:44px;font-size:14px;font-weight:600}.primary-button{border:1px solid var(--studio-accent);color:var(--studio-ink);background:var(--studio-accent)}.secondary-button{border:1px solid var(--studio-border);color:var(--studio-text);background:var(--studio-surface-2)}.quiet-button{color:var(--studio-text);text-underline-offset:3px;background:0 0;border:0;justify-self:start;text-decoration:underline}.logo-studio button:not(:disabled){cursor:pointer}.logo-studio button:disabled{cursor:not-allowed;opacity:.52}.logo-studio button:focus-visible,.logo-studio input:focus-visible{outline:2px solid var(--studio-accent);outline-offset:2px}.editor-workspace{grid-template-columns:minmax(0,.9fr) minmax(0,1.7fr) minmax(0,1fr);grid-template-areas:"controls preview output";gap:16px;max-width:1480px;margin:0 auto;padding:0 24px 24px;display:grid}.controls-rail{grid-area:controls}.preview-region{grid-area:preview}.output-rail{grid-area:output}.editor-rail,.preview-region{padding:16px}.uploaded-file{border-bottom:1px solid var(--studio-border);gap:4px;padding-bottom:16px;font-size:13px;display:grid}.uploaded-file span{color:var(--studio-secondary)}.uploaded-file strong{overflow-wrap:anywhere}.studio-controls,.control-group{gap:12px;display:grid}.studio-controls{margin-top:16px}.control-group{border:0;min-width:0;margin:0;padding:0 0 16px}.control-group legend,.control-label{margin-bottom:8px;padding:0;font-size:14px;font-weight:600}.template-options{grid-template-columns:minmax(0,1fr);gap:8px;display:grid}.logo-studio .template-options .template-preview{border-color:var(--studio-border);color:var(--studio-text);background:var(--studio-surface-2)}.logo-studio label.template-preview{cursor:pointer}.logo-studio .template-preview.is-active{outline-color:var(--studio-accent)}.logo-studio .template-options .template-preview .specimen-mark,.logo-studio .template-options .template-preview.template-neon-pulse .specimen-mark{color:var(--studio-accent)}.logo-studio .template-options .template-preview .template-preview-use-case{color:var(--studio-secondary)}.logo-studio .template-options .template-preview .template-preview-duration{color:var(--studio-secondary);font-family:var(--font-geist-mono), monospace;font-size:11px}.logo-studio .template-preview .selection-label{border-color:var(--studio-accent);color:var(--studio-accent)}.logo-studio label.template-preview:hover{background:var(--studio-surface-3);border-color:#f4f7f252}.logo-studio label.template-preview:has(.template-preview-input:focus-visible){outline:2px solid var(--studio-accent);outline-offset:2px}.color-control{gap:8px;display:grid}.color-input-row{grid-template-columns:44px minmax(0,1fr);gap:8px;display:grid}.color-input-row input{box-sizing:border-box;border:1px solid var(--studio-border);width:100%;height:40px;color:var(--studio-text);background:var(--studio-surface-2);border-radius:8px}.hex-input{font-family:var(--font-geist-mono), monospace;padding:0 10px}.color-recovery,.control-help{color:var(--studio-secondary);margin:0;font-size:12px;line-height:18px}.segments{border:1px solid var(--studio-border);border-radius:8px;grid-auto-columns:1fr;grid-auto-flow:column;display:grid;overflow:hidden}.segments label{position:relative}.segments input{opacity:0;position:absolute}.segments span{min-height:40px;color:var(--studio-text);background:var(--studio-surface-2);font-family:var(--font-geist-mono), monospace;place-items:center;font-size:12px;display:grid}.segments input:checked+span{color:var(--studio-ink);background:var(--studio-accent);font-weight:700}.segments input:focus-visible+span{outline:2px solid var(--studio-accent);outline-offset:-3px}.replace-upload{border-top:1px solid var(--studio-border);padding-top:16px}.replace-upload .upload-drop-target{min-height:112px}.preview-region{align-self:start}.animation-stage{gap:8px;width:100%;display:grid}.composition-frame{aspect-ratio:16/9;border:1px solid var(--studio-border);background:var(--stage-background);border-radius:14px;place-items:center;width:100%;display:grid;position:relative;overflow:hidden}.transparency-grid{grid-template-rows:repeat(6,1fr);grid-template-columns:repeat(8,1fr);display:grid;position:absolute;inset:0}.transparency-grid [data-tone=light]{background:var(--studio-surface-2)}.transparency-grid [data-tone=dark]{background:var(--studio-surface-1)}.background-label{z-index:4;border:1px solid var(--studio-border);color:var(--studio-text);background:var(--studio-ink);border-radius:999px;padding:4px 8px;font-size:12px;font-weight:600;position:absolute;bottom:12px;right:12px}[data-ratio="1:1"] .composition-frame{aspect-ratio:1}[data-ratio="9:16"] .composition-frame{aspect-ratio:9/16;justify-self:center;width:min(100%,38.25vh);max-height:68vh}.logo-mask{z-index:2;width:100%;height:100%;animation-duration:calc(4s / var(--motion-speed));animation-iteration-count:1;animation-play-state:paused;animation-fill-mode:both;animation-delay:calc(var(--preview-render-time) * -1s / var(--motion-speed));place-items:center;display:grid;position:relative}.studio-logo{box-sizing:border-box;object-fit:contain;width:100%;height:100%;animation-duration:calc(4s / var(--motion-speed));animation-iteration-count:1;animation-play-state:paused;animation-fill-mode:both;animation-delay:calc(var(--preview-render-time) * -1s / var(--motion-speed));padding:12%}.composition-guides{z-index:3;pointer-events:none;position:absolute;inset:0}.guide-line{background:color-mix(in srgb, var(--studio-text) 8%, transparent);position:absolute}.guide-line-horizontal{height:1px;top:50%;left:0;right:0}.guide-line-vertical{width:1px;top:0;bottom:0;left:50%}[data-template=clean-reveal] .studio-logo{animation-name:clean-reveal}[data-template=soft-bounce] .studio-logo{animation-name:soft-bounce}[data-template=radial-reveal] .logo-mask{animation-name:radial-reveal}[data-template=neon-pulse] .studio-logo{animation-name:neon-pulse}@keyframes clean-reveal{0%{opacity:0;transform:scale(.9)}45%,to{opacity:1;transform:scale(1)}}@keyframes soft-bounce{0%{opacity:0;transform:translateY(12%)scale(.94)}52%{opacity:1;transform:translateY(-3%)scale(1.03)}70%,to{opacity:1;transform:none}}@keyframes radial-reveal{0%{clip-path:circle(0)}55%,to{clip-path:circle(75%)}}@keyframes neon-pulse{0%{opacity:.5;filter:drop-shadow(0 0 0 var(--accent))}45%{opacity:1;filter:drop-shadow(0 0 18px var(--accent))}to{opacity:1;filter:drop-shadow(0 0 5px var(--accent))}}.time-ruler{border-top:1px solid var(--studio-border);color:var(--studio-secondary);font-family:var(--font-geist-mono), monospace;justify-content:space-between;padding-top:8px;font-size:12px;display:flex}.player-controls{gap:12px;padding-top:12px;display:grid}.player-actions{flex-wrap:wrap;gap:8px;display:flex}.timeline-control{color:var(--studio-secondary);gap:6px;font-size:12px;display:grid}.timeline-control input{width:100%;accent-color:var(--studio-accent)}.time-readout{color:var(--studio-secondary);font-family:var(--font-geist-mono), monospace;font-size:12px}.entitlement-panel{max-width:1200px;margin:0 auto;padding:20px}.output-rail .entitlement-panel{border:0;padding:0}.output-summary{border:1px solid var(--studio-border);background:var(--studio-surface-2);color:var(--studio-secondary);border-radius:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-bottom:16px;padding:12px;font-size:12px;display:grid}.output-summary span{gap:2px;display:grid}.output-summary strong{color:var(--studio-text)}.output-options{border:0;gap:8px;min-width:0;margin:0;padding:0;display:grid}.output-options legend{margin-bottom:8px;font-weight:600}.output-option{border:1px solid var(--studio-border);background:var(--studio-surface-1);cursor:pointer;border-radius:8px;grid-template-columns:auto minmax(0,1fr);gap:6px 10px;padding:12px;display:grid}.output-option[data-selected=true]{border-color:var(--studio-accent);background:#c7ff4a14}.output-option input{accent-color:var(--studio-accent);grid-row:span 2;margin-top:3px}.output-option-header{justify-content:space-between;gap:12px;display:flex}.output-option-header b{color:var(--studio-accent)}.output-option-details{color:var(--studio-secondary);font-size:12px;line-height:18px}.entitlement-actions{gap:8px;margin-top:16px;display:grid}.preview-build-note{margin-top:12px}.output-privacy,.output-limit,.checkout-status{color:var(--studio-secondary);margin:0;font-size:12px;line-height:18px}.checkout-status{color:var(--studio-error);margin-top:12px}@media (width>=1200px){.editor-rail{scrollbar-gutter:stable;align-self:start;height:calc(100dvh - 48px);position:sticky;top:24px;overflow:hidden auto}}@media (width<=1199px){.editor-workspace{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"preview preview""controls output"}.template-options{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=767px){.studio-upload-hero,.editor-workspace{grid-template-columns:minmax(0,1fr)}.studio-upload-hero{border-left:0;border-right:0;border-radius:0;gap:24px;padding:16px}.editor-workspace{grid-template-areas:"preview""controls""output";padding:0 16px 24px}.timeline-control input{min-height:44px}}@media (width<=639px){.studio-live-region{padding-inline:16px}.editor-workspace{padding:0 0 calc(112px + env(safe-area-inset-bottom))}.editor-rail,.preview-region,.entitlement-panel{border-left:0;border-right:0;border-radius:0}.editor-rail,.preview-region{padding-inline:16px}.entitlement-panel{padding:16px}.entitlement-actions{z-index:10;padding:12px 16px calc(12px + env(safe-area-inset-bottom));border-top:1px solid var(--studio-border);background:var(--studio-surface-1);margin-inline:-16px;position:sticky;bottom:0}.upload-drop-target{min-height:144px}.animation-stage[data-ratio="9:16"] .composition-frame{width:min(100%,29.25vh);max-height:52vh;margin-inline:auto}.color-input-row input,.segments span{height:44px;min-height:44px}}@media (prefers-reduced-motion:reduce){.logo-studio *,.logo-studio :before,.logo-studio :after{scroll-behavior:auto!important;transition-duration:.01ms!important}.logo-mask,.studio-logo{animation-name:reduced-preview!important;animation-duration:.16s!important;animation-delay:calc(var(--preview-render-time) * -40ms)!important;clip-path:none!important;filter:none!important;animation-iteration-count:1!important;animation-play-state:paused!important;transform:none!important}}@keyframes reduced-preview{0%{opacity:0}to{opacity:1}}@media (forced-colors:active){.studio-upload-hero,.entitlement-panel,.editor-rail,.preview-region,.upload-drop-target,button,input{border:1px solid canvastext}button:focus-visible,input:focus-visible{outline-color:highlight}}