.style-studio{min-height:100dvh;background:theme("colors.surface.DEFAULT");color:theme("colors.on-surface");padding-bottom:calc(env(safe-area-inset-bottom) + 24px)}.style-studio *{box-sizing:border-box;letter-spacing:0}.style-studio a,.style-studio button,.style-studio input{touch-action:manipulation}.style-studio a:focus-visible,.style-studio button:focus-visible,.style-studio input:focus-visible{outline:2px solid theme("colors.primary.DEFAULT");outline-offset:3px}.style-studio button:disabled{opacity:.4;cursor:not-allowed}.studio-header{display:flex;align-items:center;gap:12px;min-height:88px;padding:16px 24px;border-bottom:1px solid theme("colors.outline-variant");background:theme("colors.surface-container-lowest");position:sticky;top:0;z-index:30}.studio-heading{min-width:0;flex:1}.studio-heading h1{font-size:22px;line-height:1.25;font-weight:800}.studio-status{color:theme("colors.on-surface-variant");font-size:12px;display:block;margin-top:4px;min-height:18px}.studio-header-actions{display:flex;align-items:center;gap:4px}.studio-icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;border-radius:6px}.studio-icon:hover{background:theme("colors.surface-container-high")}.studio-primary{min-height:44px;padding:10px 16px;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:theme("colors.primary.DEFAULT");color:theme("colors.on-primary");border-radius:6px;font-size:13px;font-weight:700;white-space:nowrap}.studio-primary:hover:not(:disabled){background:theme("colors.primary.container")}.studio-workspace{display:grid;grid-template-columns:minmax(0,1fr) 320px;max-width:1700px;margin:0 auto;grid-template-areas:"preview controls" "looks controls";grid-template-rows:max-content 1fr}.studio-preview-column{grid-area:preview;align-self:start}.studio-controls{grid-area:controls}.studio-looks{grid-area:looks;padding:0 24px 24px;min-width:0}.studio-preview-column{min-width:0;padding:22px 24px 32px}.studio-preview-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:12px}.studio-preview-heading h2{font-size:14px;font-weight:700}.studio-preview-heading span{color:theme("colors.on-surface-variant");font-size:12px}.studio-segment{display:flex;padding:2px;border:1px solid theme("colors.outline-variant");border-radius:6px}.studio-segment button{height:40px;width:44px;display:grid;place-items:center;border-radius:4px}.studio-segment button[aria-pressed=true]{background:theme("colors.primary.fixed");color:theme("colors.on-primary-fixed")}.style-preview{min-width:0}.style-stage{width:100%;aspect-ratio:16/9;position:relative;overflow:hidden;background:#050505}.style-stage.is-portrait{width:min(100%,290px);aspect-ratio:9/16;margin:0 auto}.style-canvas-host,.style-render-status{position:absolute;inset:0}.style-render-status{display:flex;align-items:center;justify-content:center;flex-direction:column;padding:24px;color:white;text-align:center;font-size:14px;background:#111}.style-render-status button{border:1px solid #78868d;border-radius:6px;padding:12px;margin-top:16px}.style-transport{display:flex;align-items:center;gap:4px;min-height:58px;border-bottom:1px solid theme("colors.outline-variant")}.style-transport input{flex:1;min-width:30px;accent-color:theme("colors.primary.DEFAULT");height:44px;margin:0 12px}.style-time{font-size:11px;color:theme("colors.on-surface-variant");font-variant-numeric:tabular-nums;min-width:71px;white-space:nowrap}.studio-presets-heading{display:flex;align-items:center;justify-content:space-between;margin:12px 0 4px;gap:12px}.studio-presets-heading h2,.studio-saved-heading{font-size:14px;font-weight:800}.studio-text-button{min-height:44px;display:inline-flex;align-items:center;gap:8px;color:theme("colors.primary.DEFAULT");font-size:12px;font-weight:700;text-align:left}.studio-text-button:hover:not(:disabled){text-decoration:underline;text-underline-offset:3px}.studio-presets{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.studio-preset{display:flex;position:relative;flex-wrap:wrap;align-items:center;gap:5px;text-align:left;padding:6px;border:1px solid theme("colors.outline-variant");border-radius:6px;background:theme("colors.surface-container-lowest");min-width:0}.studio-preset[aria-pressed=true]{border-color:theme("colors.primary.DEFAULT");box-shadow:0 0 0 1px theme("colors.primary.DEFAULT")}.studio-preset>span:last-of-type{font-size:11px;font-weight:700;line-height:1.4;min-height:30px;display:flex;align-items:center;flex:1}.studio-preset-art{height:52px;display:flex;gap:8px;align-items:flex-end;justify-content:center;width:100%;border-radius:3px;overflow:hidden}.studio-preset-art i{display:block;width:8px;border-radius:2px 2px 0 0;min-height:16px;height:75%;box-shadow:inset 1px 0 0 #ffffff90}.studio-preset-art i:nth-child(2){height:45%}.studio-preset-art i:nth-child(3){height:100%}.studio-preset-art i:nth-child(4){height:60%}.studio-saved-heading{margin:24px 0 8px}.studio-saved-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}.studio-saved-row{display:flex;border-bottom:1px solid theme("colors.outline-variant");min-width:0}.studio-saved-row>button:first-child{display:flex;flex:1;gap:10px;align-items:center;min-width:0;min-height:52px;font-size:13px;text-align:left}.studio-saved-row>button:first-child>span:nth-child(2){overflow-wrap:anywhere;flex:1}.studio-pair{display:flex;gap:3px;flex-shrink:0}.studio-pair i{display:block;width:12px;height:24px;border-radius:2px}.studio-controls{border-left:1px solid theme("colors.outline-variant");padding:18px 20px;background:theme("colors.surface-container-lowest");min-width:0}.studio-tabs{display:flex;border-bottom:1px solid theme("colors.outline-variant");margin-bottom:4px}.studio-tabs button{min-height:48px;flex:1;font-size:12px;font-weight:700;border-bottom:2px solid transparent;white-space:nowrap}.studio-tabs button[aria-pressed=true]{border-color:theme("colors.primary.DEFAULT");color:theme("colors.primary.DEFAULT")}.studio-control-section{padding:18px 0;border-bottom:1px solid theme("colors.outline-variant")}.studio-control-section h2{font-size:13px;font-weight:800;margin-bottom:12px}.studio-color-row{display:flex;align-items:center;gap:10px;min-height:52px;font-size:12px}.studio-color-row>span{flex:1}.studio-color-row code{color:theme("colors.on-surface-variant");font-size:10px}.studio-color-row input{width:44px;height:44px;border:0;padding:4px;cursor:pointer;background:none}.studio-color-row input::-webkit-color-swatch-wrapper{padding:2px}.studio-color-row input::-webkit-color-swatch{border:1px solid theme("colors.outline");border-radius:4px}.studio-toggle{display:flex;align-items:center;justify-content:space-between;min-height:48px;font-size:12px;gap:12px;cursor:pointer}.studio-toggle input{width:20px;height:20px;accent-color:theme("colors.primary.DEFAULT")}.studio-range{display:block;margin:16px 0 0;font-size:12px}.studio-range>span{display:flex;justify-content:space-between;gap:12px}.studio-range output{font-variant-numeric:tabular-nums;color:theme("colors.on-surface-variant")}.studio-range input{height:44px;width:100%;accent-color:theme("colors.primary.DEFAULT")}.studio-asset-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:56px;padding:6px 0}.studio-asset-row span,.studio-asset-row strong{display:block;font-size:12px}.studio-asset-row span{color:theme("colors.on-surface-variant");font-size:11px;margin-top:3px}.studio-asset-row>div:last-child{display:flex;align-items:center;gap:4px}.studio-choice-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.studio-choice-grid button{min-height:48px;padding:8px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid theme("colors.outline-variant");border-radius:6px;font-size:12px;font-weight:700}.studio-choice-grid button[aria-pressed=true]{color:theme("colors.on-primary-fixed");background:theme("colors.primary.fixed");border-color:theme("colors.primary.DEFAULT")}.studio-section-title{display:flex;justify-content:space-between;gap:8px}.studio-section-title>span{font-size:11px;color:theme("colors.on-surface-variant")}.studio-hand-segment{display:flex;border:1px solid theme("colors.outline-variant");border-radius:6px;margin:2px 0 16px;overflow:hidden}.studio-hand-segment button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;flex:1;font-size:12px}.studio-hand-segment button[aria-pressed=true]{background:theme("colors.surface-container-high");font-weight:700}.studio-hand-segment i{width:10px;height:10px;border-radius:50%;border:1px solid #0003}.studio-effect-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.studio-effect-grid button{display:flex;align-items:center;min-height:62px;gap:8px;padding:9px;border:1px solid theme("colors.outline-variant");border-radius:6px;font-size:12px}.studio-effect-grid button[aria-pressed=true]{border-color:theme("colors.primary.DEFAULT");background:theme("colors.primary.fixed");color:theme("colors.on-primary-fixed")}.studio-effect-grid button>svg{flex-shrink:0}.studio-effect-grid button>span{flex:1;text-align:left}.studio-reset-row{display:flex;flex-direction:column;align-items:flex-start;padding-top:12px}.studio-loading{aspect-ratio:16/9;display:grid;place-items:center;background:#111;color:#eee}.studio-motion-status{font-size:12px;color:theme("colors.on-surface-variant");padding:10px 0}.studio-error{background:theme("colors.error.container");color:theme("colors.on-error-container");padding:12px 20px;font-size:13px;overflow-wrap:anywhere}.studio-dialog{width:min(440px,calc(100vw - 32px));margin:auto;border:1px solid theme("colors.outline-variant");border-radius:8px;padding:20px;color:theme("colors.on-surface");background:theme("colors.surface-container-lowest");max-height:90dvh;overflow:auto}.studio-dialog::backdrop{background:#111a}.studio-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.studio-dialog h2{font-size:18px;font-weight:800}.studio-dialog p{font-size:14px;overflow-wrap:anywhere}.studio-name-label{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600}.studio-name-label input{height:48px;border:1px solid theme("colors.outline");border-radius:6px;padding:10px;font-size:16px;width:100%}.studio-dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.studio-dialog-actions>a,.studio-dialog-actions>button{min-height:44px;padding:10px 14px;font-size:13px;font-weight:700;border-radius:6px;display:flex;align-items:center}.studio-dialog-actions>a{background:theme("colors.surface-container-high")}.studio-danger{background:theme("colors.error.DEFAULT");color:theme("colors.on-error")}@media(max-width:1100px){.studio-workspace{grid-template-columns:minmax(0,1fr) 290px}.studio-preview-column{padding:20px 18px}.studio-controls{padding:16px}.studio-presets{grid-template-columns:repeat(3,minmax(0,1fr))}.studio-saved-list{grid-template-columns:1fr}}@media(max-width:760px){.studio-header{padding:12px;min-height:76px;gap:6px;flex-wrap:wrap}.studio-heading h1{font-size:19px}.studio-header-actions{gap:0}.studio-primary{padding:10px 12px}.studio-header-actions .studio-primary svg{display:none}.studio-workspace{display:block}.studio-preview-column{padding:14px 14px 20px}.studio-presets{grid-template-columns:repeat(3,minmax(0,1fr))}.studio-controls{border-left:0;border-top:1px solid theme("colors.outline-variant");padding:8px 20px 24px}.studio-tabs{max-width:480px;overflow-x:auto}.studio-tabs button{min-width:72px}.studio-control-section{max-width:600px}.style-time{min-width:68px}.style-transport input{margin:0 4px}.studio-preview-heading{margin-bottom:10px}.style-stage.is-portrait{width:240px}.studio-saved-list{grid-template-columns:1fr}}@media(max-width:480px){.studio-header-actions{width:100%;justify-content:flex-end}.studio-header-actions .studio-primary{margin-left:8px}.studio-presets{gap:8px}}@media(max-width:760px){.studio-workspace{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"preview" "controls" "looks";grid-template-rows:auto}.studio-preview-column{position:sticky;top:var(--studio-header-height,118px);z-index:20;background:theme("colors.surface.DEFAULT");padding-bottom:0}.studio-looks{padding:10px 20px 24px}.style-stage.is-portrait{width:min(240px,calc(30dvh * .5625))}.studio-controls button,.studio-controls input,.studio-looks button{scroll-margin-top:calc(var(--studio-header-height,118px) + var(--studio-preview-height,300px) + 12px)}}@media(prefers-reduced-motion:reduce){.style-studio *{scroll-behavior:auto!important;transition:none!important}}.studio-segment button{height:44px}.studio-color-row code{font-size:11px}@media(max-height:600px){.studio-preview-column{position:static}.studio-controls button,.studio-controls input,.studio-looks button{scroll-margin-top:calc(var(--studio-header-height,88px) + 12px)}}.style-studio[data-preview-pinned=false] .studio-preview-column{position:static}.style-studio[data-preview-pinned=false] :is(.studio-controls button,.studio-controls input,.studio-looks button){scroll-margin-top:calc(var(--studio-header-height,88px) + 12px)}.studio-tabs{display:grid;grid-template-columns:repeat(3,minmax(44px,1fr)) minmax(66px,1.2fr) minmax(44px,1fr)}.studio-tabs button{min-width:0;padding:0 3px}.studio-geometry-segment{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid theme("colors.outline-variant");border-radius:6px;padding:2px;gap:2px}.studio-geometry-segment button{min-width:0;min-height:44px;padding:6px 4px;font-size:12px;border-radius:4px}.studio-geometry-segment button[aria-pressed=true]{background:theme("colors.primary.fixed");color:theme("colors.on-primary-fixed");font-weight:700}.studio-choice-grid button:hover:not([aria-pressed=true]),.studio-geometry-segment button:hover:not([aria-pressed=true]){background:theme("colors.surface-container-high")}.studio-entrance-grid button{height:60px;line-height:1.35;text-align:left;justify-content:flex-start}.studio-entrance-grid button:first-child{grid-column:1/-1;height:44px;min-height:44px;justify-content:center}.studio-entrance-grid button svg{flex-shrink:0}.studio-entrance-grid button span{min-width:0;overflow-wrap:anywhere}.studio-range[data-disabled=true]{opacity:.5}.studio-range input:disabled{cursor:not-allowed}.studio-range output{flex-shrink:0;min-width:44px;text-align:right}.style-preview-options{display:flex;align-items:center;justify-content:space-between;gap:4px 16px;flex-wrap:wrap;padding:4px 0}.style-replay,.style-replay svg{flex-shrink:0}.style-camera-toggle{display:flex;align-items:center;gap:8px;min-height:44px;font-size:12px;cursor:pointer}.style-camera-toggle input{width:18px;height:18px;flex-shrink:0;accent-color:theme("colors.primary.DEFAULT")}.style-time{width:88px;min-width:88px;flex-shrink:0;text-align:right}.camera-workspace-body{max-width:1400px;margin:auto;padding:24px}.camera-composite-preview{max-width:1000px;margin:32px auto 0}.camera-composite-preview h2{font-size:16px;font-weight:700;margin-bottom:12px}@media(max-width:600px){.camera-workspace .studio-header{flex-wrap:wrap}.camera-workspace .studio-heading{min-width:160px}.camera-workspace-body{padding:12px}}