.demo-shell{color:var(--text);font:var(--type-body)/var(--leading-body) var(--font)}.demo-editor{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:pan-x pan-y}.demo-editor input:not([type=range]),.demo-editor textarea{-webkit-user-select:text;user-select:text}.demo-preview{min-width:0}.demo-more-controls{display:inline-flex;align-items:center;justify-content:flex-start;flex:1;gap:var(--s-3, 8px);font-size:var(--type-caption);color:var(--demo-more-text);min-width:0;text-align:left;white-space:nowrap;padding-inline-start:var(--editor-action-padding-inline)}.demo-more-label{white-space:normal}.demo-more-controls>.arrow-motion{flex:none}.demo-more-controls:hover{color:var(--text-bright)}.media-choices{display:flex;align-items:center;gap:8px;min-width:0;padding:14px 1px 0;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain;justify-content:flex-start}.media-choices::-webkit-scrollbar,.looks-track::-webkit-scrollbar{display:none}.media-choice{position:relative;flex:none}.media-choices :is(button[data-media],#media-upload){width:61px;flex:none}.media-choices #media-upload{padding:3px;border:1px solid transparent;border-radius:var(--radius-control);background:transparent;color:var(--demo-label-muted);transition:background .2s}.media-choices #media-upload:hover{background:var(--demo-media-hover);color:var(--c-text-soft)}.media-choices img{width:53px;height:34px}.media-choices button>span{display:block;min-width:0;overflow:hidden;font-size:var(--type-mini);line-height:var(--leading-caption);padding-top:3px;text-overflow:ellipsis;white-space:nowrap}.media-choices .media-upload-icon{height:34px;padding:0;display:grid;place-items:center;border-radius:var(--demo-media-add-radius);background:var(--demo-media-add-background);color:var(--demo-media-add-icon)}.media-choices button:disabled{opacity:.45;cursor:default}.video-transport{display:flex;align-items:center;gap:8px;position:absolute;z-index:4;bottom:7px;left:8px;right:8px;height:30px;margin:0}.video-transport>output{font-size:var(--type-note);color:var(--demo-video-time);font-variant-numeric:tabular-nums;min-width:27px}.filmstrip{position:relative;flex:1;min-width:0;height:28px;overflow:hidden;border-radius:var(--radius-label);background:var(--filmstrip-background)}.filmstrip input{position:absolute;z-index:4;inset:0;width:100%;height:100%;margin:0;appearance:none;background:transparent;opacity:0;touch-action:none;cursor:ew-resize}.filmstrip input::-webkit-slider-runnable-track{background:transparent;height:100%}.filmstrip input::-webkit-slider-thumb{appearance:none;width:3px;height:100%;background:transparent;border:0}.filmstrip input::-moz-range-thumb{width:3px;height:100%;background:transparent;border:0}.filmstrip__playhead{position:absolute;z-index:3;top:3px;bottom:3px;left:clamp(5px,calc(var(--video-progress, 0) * 100%),calc(100% - 5px));width:3px;border-radius:var(--r-pill, 999px);background:var(--filmstrip-playhead);transform:translate(-50%);pointer-events:none}.filmstrip input:focus-visible+.filmstrip__playhead{background:var(--c-focus, var(--demo-focus))}.demo-library{padding:10px 14px 14px;border-top:1px solid var(--demo-library-divider)}.library-heading{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-3, 8px) var(--s-7, 20px);margin-bottom:var(--s-5, 12px)}.library-heading strong{display:inline-flex;align-items:baseline;gap:var(--s-3, 8px);font-size:var(--type-ui);font-weight:550;white-space:nowrap}.library-heading strong>span{color:var(--demo-library-count);font-size:var(--type-caption);font-weight:400;opacity:.65}#demo-import-lut{display:none}#demo-import-lut:not(:disabled):focus-visible{color:var(--editor-selected-color)}.library-actions{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s-6, 16px);margin-left:auto}.demo-shell .editor-preview-toggle[aria-checked=false]{color:var(--c-text-faint)}.demo-history-actions{display:flex;align-items:center;flex:none;gap:var(--s-2, 5px)}.demo-history-actions .editor-inline-action:not(:disabled){opacity:.65}.demo-bar{display:flex;align-items:center;padding:18px 14px;border-bottom:1px solid var(--demo-header-divider);gap:16px}.demo-bar-actions{display:flex;align-items:center;gap:6px;margin-left:auto}.demo-bar-actions .quiet-button{white-space:nowrap}#demo-export{color:var(--c-text-inverse);background:var(--c-text)}#demo-export:disabled{opacity:.36}@media(hover:hover){#demo-export:hover{background:var(--c-thumb)}}#demo-export:not(:disabled):is(:focus-visible,:active){background:var(--c-focus)}.demo-bar .site-brand{font-size:var(--type-copy)}.demo-bar .brand-mark{width:24px;height:24px}.looks-track{min-width:0;display:flex;overflow-x:auto;gap:10px;overscroll-behavior-x:contain;touch-action:pan-x pan-y;cursor:pointer;scrollbar-width:none;padding:2px}.look-card{cursor:pointer;position:relative;width:135px;flex:none;padding:0;scroll-snap-align:start}.look-import-divider{flex:0 0 1px;margin:7px 4px;background:var(--demo-import-divider)}.look-card>img{display:block;width:100%;height:88px;object-fit:cover;background:linear-gradient(135deg,var(--demo-thumbnail-start),var(--demo-thumbnail-end))}.look-more{display:flex;flex-direction:column;justify-content:center;padding:15px;width:168px;flex:none;border:1px solid var(--demo-more-border);border-radius:var(--radius-button);background:var(--demo-more-background);color:var(--demo-more-heading);scroll-snap-align:start}.look-more strong{font-size:var(--type-demo-promotion);font-weight:550}.look-more>span{font-size:var(--type-caption);line-height:var(--leading-demo-promotion);color:var(--demo-more-description);margin-top:5px}.library-status{font-size:var(--type-caption);color:var(--demo-status-text);min-height:0;margin:0}.library-status:not(:empty){margin-top:7px}#quick-controls{--carousel-footer-height: max(var(--inspector-action-size), var(--editor-action-height));position:relative;height:100%;min-height:0;text-align:left}#quick-controls .grade-carousel{position:relative;width:100%;height:100%;container-type:size}#quick-controls .grade-carousel-track{position:relative;display:flex;width:100%;height:calc(100% - var(--carousel-footer-height) - var(--s-2) * 2);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y}#quick-controls .grade-carousel-track:is(.is-dragging,.is-animating){scroll-snap-type:none}#quick-controls .grade-carousel-track.is-dragging{cursor:grabbing}#quick-controls .grade-carousel-track>.grade-carousel-panel{flex:0 0 100%;scroll-snap-align:start;scroll-snap-stop:always}#quick-controls .grade-carousel .grade-mode-view .contrast-panel{padding-inline:var(--s-6);padding-bottom:var(--s-6)}#quick-controls .grade-carousel .labelActions,#quick-controls .grade-carousel .grade-mode-card>.grade-mode-actions,#quick-controls .grade-preset-menu{display:none}#quick-controls .grade-carousel-nav{position:absolute;z-index:60;bottom:calc(var(--s-2) + (var(--carousel-footer-height) - var(--inspector-action-size)) / 2);left:var(--curve-header-inset);display:flex;align-items:center;gap:var(--s-1);color:var(--c-text-dim);font:var(--ui-font-weight) var(--ui-control-font-size)/1.4 var(--font-ui)}#quick-controls .grade-carousel-nav>span{min-width:4ch;text-align:center}#quick-controls [data-control-direction="-1"] svg{transform:rotate(180deg)}#quick-controls .grade-carousel-nav button:disabled{opacity:var(--c-disabled-control-opacity);cursor:default}#quick-controls>.demo-global-actions{position:absolute;z-index:60;right:var(--s-6);bottom:var(--s-2);display:flex;align-items:center;gap:var(--s-1);height:var(--carousel-footer-height)}#quick-controls>.demo-global-actions>button{white-space:nowrap}#quick-controls .grade-mode-lock{position:absolute;z-index:10;inset:var(--curve-heading-height) 0 0;display:grid;place-items:center}#quick-controls .grade-mode-view[data-locked]{opacity:var(--c-disabled-panel-opacity)}#quick-controls .grade-mode-lock[hidden]{display:none}#quick-controls .grade-mode-lock>a{display:inline-flex;align-items:center;gap:var(--s-3);color:var(--c-text);text-decoration:none}.hero-stage{--hero-zoom: .14;--hero-shade: .6;--edge-outset: 40px;--edge-softness: 50px}.demo-shell{position:relative;border-radius:var(--radius);isolation:isolate}.demo-shell>:is(.gallery-return,.gallery-feedback){bottom:0;transform:translate(-50%,50%);z-index:43}.demo-editor{position:relative;border:1px solid transparent;border-radius:var(--radius);background:var(--c-side);overflow:hidden;box-shadow:var(--product-shadow);text-align:left}.hero-stage[data-teaser]{will-change:transform;transform:scale(calc(1 + var(--hero-zoom) * var(--hero-tease, 1)));transform-origin:center top}.hero-stage:is([data-teaser],[data-outro]) .demo-editor:after{will-change:opacity;content:"";position:absolute;z-index:40;inset:0;background:var(--demo-teaser-shade);opacity:calc(var(--hero-shade) * var(--hero-shade-progress, 1));pointer-events:none}.demo-shell:after,.demo-edge-glow{position:absolute;inset:0;z-index:41;border-radius:inherit;pointer-events:none;opacity:0}.hero-stage[data-teaser] .demo-shell:after,.hero-stage[data-teaser] .demo-edge-glow{will-change:opacity;opacity:calc(var(--hero-tease, 1) * var(--edge-strength, .65))}.hero-stage[data-teaser] .demo-shell:after{opacity:calc(var(--hero-tease, 1) * var(--edge-strength, .65) * .45)}@supports (mask-composite: exclude) or (-webkit-mask-composite: xor){.demo-shell:after{content:"";background:var(--edge-mesh);mask-image:var(--edge-cutout),conic-gradient(from var(--edge-angle, 30deg),transparent 5%,var(--mask-opaque) 15%,var(--mask-opaque) 85%,transparent 95%);mask-composite:subtract,add,add,add,add,add;mix-blend-mode:soft-light}.demo-edge-glow{inset:calc(-1 * var(--edge-outset));mask-image:conic-gradient(from var(--edge-angle, 30deg),var(--mask-opaque) 2.5%,transparent 17%,transparent 83%,var(--mask-opaque) 97.5%);mix-blend-mode:plus-lighter}.demo-edge-glow:before{content:"";position:absolute;inset:var(--edge-outset);border-radius:inherit;box-shadow:var(--edge-bloom-core),inset 0 0 calc(var(--edge-softness) * .3) var(--edge-halo-near),0 0 calc(var(--edge-softness) * .3) var(--edge-halo-near),inset 0 0 calc(var(--edge-softness) * .5) calc(var(--edge-softness) * .04) var(--edge-halo-middle),0 0 calc(var(--edge-softness) * .5) calc(var(--edge-softness) * .04) var(--edge-halo-middle),inset 0 0 var(--edge-softness) calc(var(--edge-softness) * .04) var(--edge-halo-far),0 0 var(--edge-softness) calc(var(--edge-softness) * .04) var(--edge-halo-far),-1px 0 4px var(--edge-halo-cool),1px 0 4px var(--edge-halo-warm)}}@media(max-width:1450px){.hero-stage{--hero-zoom: .06}}@media(max-width:700px){.hero-stage{--hero-zoom: .035;--edge-outset: 8px}}.quiet-button{color:var(--demo-text-soft);border:0;background:var(--demo-button-background);padding:7px 13px;border-radius:var(--radius-control);font-size:var(--type-caption);min-height:34px}.quiet-button:hover{background:var(--demo-button-hover)}.quiet-button:disabled{opacity:.4}.demo-body{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);gap:10px;padding:10px}.demo-picture{position:relative;min-width:0;background:var(--demo-picture-background);overflow:hidden;aspect-ratio:1.5}.demo-picture>img,.demo-picture>canvas{position:absolute;inset:0;width:100%;height:100%}.demo-picture>img{object-fit:contain}.demo-editor:not([data-preview-ready]) #demo-source,.demo-editor[data-preview-ready] .demo-initial-preview{visibility:hidden}.demo-picture>canvas{opacity:0}.demo-editor[data-preview-ready] .demo-picture>canvas{opacity:1}.compare-label{position:absolute;top:calc(var(--preview-image-top, 0px) + 14px);z-index:1;padding:4px 9px;color:var(--text-bright);background:var(--demo-compare-label-background);border-radius:var(--radius-label);font-size:var(--type-caption);pointer-events:none}.before-label{left:14px}.after-label{right:14px}.compare-line{--compare-position: var(--split);position:absolute;inset:0;top:var(--preview-image-top, 0px);height:var(--preview-image-height, 100%);pointer-events:none;z-index:1}.compare-input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;z-index:2;touch-action:pan-y}.demo-controls{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) auto;align-self:stretch;min-width:0;padding:0 3px}.demo-controls-toolbar{display:flex;align-items:center;gap:var(--s-2, 5px);padding-block:10px 0;min-width:0}.demo-presets{display:none;gap:3px;margin-top:8px;max-width:100%;overflow-x:auto;scrollbar-width:none}.demo-presets button{white-space:nowrap}.demo-caption{display:flex;justify-content:space-between;gap:20px;margin-top:22px;font-size:var(--type-caption);color:var(--caption-muted);text-align:left}.demo-caption .text-link{font-size:var(--type-caption)}.lut-intensity{display:grid;grid-template-columns:auto minmax(0,160px) 32px;align-items:center;gap:10px}.lut-intensity output{width:32px}.media-choices.is-dragging,.media-choices.is-dragging *,.looks-track.is-dragging,.looks-track.is-dragging *{cursor:grabbing;user-select:none}.look-card img{user-select:none;-webkit-user-drag:none}.looks-window{min-width:0}.gallery-arrow{position:absolute;z-index:42;bottom:var(--gallery-arrow-bottom, 76px);transform:translateY(50%);display:grid;place-items:center;width:24px;height:32px;padding:0;border:0;border-radius:var(--radius-label);background:transparent;color:var(--demo-label-muted);cursor:pointer;transition:color .15s}.gallery-arrow[hidden]{display:none}.gallery-arrow:is(:hover,:focus-visible){color:var(--demo-arrow-hover)}.gallery-arrow-left{left:-30px}.gallery-arrow-right{right:-30px}.demo-picture[data-media=video]>canvas,.demo-picture[data-media=video]>img,.demo-picture[data-media=video] .compare-input{height:calc(100% - 44px)}@media(700px<width<=1000px){.demo-body{grid-template-columns:minmax(0,1.3fr) minmax(290px,1fr)}}@media(width<=700px){#quick-controls{height:290px;min-height:290px}.media-choices{gap:5px;padding-top:10px}.demo-bar{gap:8px;padding-inline:10px}.demo-bar-actions .quiet-button{padding-inline:8px}.media-choices :is(button[data-media],#media-upload){width:58px}.media-choices img{width:50px}.demo-library{padding-inline:10px}.look-card{width:120px}.look-card>img{height:80px}.library-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}.demo-body{grid-template-columns:1fr;padding:8px;gap:14px}.demo-controls{padding:0 2px}.demo-caption{display:block;margin-top:15px}.demo-caption>span{display:block}.demo-caption>.text-link{display:inline-block;margin-top:8px}.library-heading strong{flex-wrap:wrap;gap:0 var(--s-3, 8px)}.library-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-column:1 / -1;width:100%;gap:var(--s-3, 8px)}.library-actions [data-live-preview]{justify-self:start}.library-actions #demo-import-lut{margin-left:auto}.lut-intensity{grid-column:1 / -1;grid-template-columns:auto minmax(48px,1fr) 32px;gap:5px}.gallery-arrow{--gallery-arrow-width: 18px;width:var(--gallery-arrow-width)}.hero-stage[data-teaser] .gallery-arrow{--gallery-arrow-width: max(0px, min(18px, calc((100vw / (1 + var(--hero-zoom) * var(--hero-tease, 1)) - 100%) / 2)))}.gallery-arrow svg{max-width:100%}.gallery-arrow-left{left:calc(-1 * var(--gallery-arrow-width))}.gallery-arrow-right{right:calc(-1 * var(--gallery-arrow-width))}}@media(width>700px){body[data-landing-layout=desktop] .demo-body{grid-template-rows:minmax(0,1fr) auto}body[data-landing-layout=desktop] :is(.demo-preview,.demo-controls){display:grid;grid-row:1 / 3;grid-template-rows:subgrid;row-gap:0}body[data-landing-layout=desktop] .demo-preview{grid-column:1}body[data-landing-layout=desktop] .demo-controls{grid-column:2}body[data-landing-layout=desktop] .demo-picture{grid-row:1}body[data-landing-layout=desktop] .media-choices{grid-row:3}body[data-landing-layout=desktop] #quick-controls{grid-row:1}body[data-landing-layout=desktop] .demo-controls-toolbar{grid-row:2}}body[data-landing-layout^=touch-] .hero-stage{--hero-zoom: 0;--edge-outset: var(--page-gutter);--edge-softness: calc(var(--page-gutter) * .6)}body[data-landing-layout^=touch-] .compare-input{pointer-events:none}body[data-landing-layout^=touch-] .compare-line>span{pointer-events:auto;touch-action:none;cursor:ew-resize}body[data-landing-layout^=touch-] .compare-line>span:before{content:"";position:absolute;width:var(--control-touch-target);height:var(--control-touch-target)}body[data-landing-layout^=touch-] .demo-shell{--demo-space: calc(var(--touch-unit) * 10);--editor-range-height: calc(var(--touch-unit) * 24);--editor-range-track-height: calc(var(--touch-unit) * 3);--editor-range-thumb-size: calc(var(--touch-unit) * 11);--r-xs: var(--radius-label);--r-sm: var(--radius-button);--r-md: var(--radius-card);--r-lg: var(--radius-preview);--editor-pill-padding-block: calc(var(--touch-unit) * 6);--editor-pill-padding-inline: calc(var(--touch-unit) * 8);--editor-pill-radius: var(--radius-control);--editor-action-padding-block: calc(var(--touch-unit) * 6);--editor-action-padding-inline: calc(var(--touch-unit) * 10);--editor-action-height: calc(var(--touch-unit) * 30);--compare-handle-width: var(--s-8);--compare-handle-height: var(--s-8);--gallery-label-height: calc(var(--touch-unit) * 26);--demo-look-width: max(80px, calc(var(--touch-unit) * 128));scroll-margin-top:max(16px,env(safe-area-inset-top))}body[data-landing-layout^=touch-] .demo-body{align-items:start;gap:var(--demo-space);padding:var(--demo-space)}body[data-landing-layout^=touch-] .demo-bar{padding:var(--demo-space) calc(var(--touch-unit) * 12)}body[data-landing-layout^=touch-] .demo-bar .brand-mark{width:var(--s-8);height:var(--s-8)}body[data-landing-layout^=touch-] .quiet-button{min-height:calc(var(--touch-unit) * 34);padding:calc(var(--touch-unit) * 7) calc(var(--touch-unit) * 13)}body[data-landing-layout^=touch-] .media-choices{--media-item-width: max(54px, calc(var(--touch-unit) * 61));--media-thumb-width: calc(var(--media-item-width) - 8px);--media-thumb-height: calc(var(--media-thumb-width) * 34 / 53);padding-top:var(--demo-space);gap:var(--s-2)}body[data-landing-layout^=touch-] .media-choice{display:flex}body[data-landing-layout^=touch-] .media-choices :is(button[data-media],#media-upload){width:var(--media-item-width)}body[data-landing-layout^=touch-] .media-choices img{width:var(--media-thumb-width);height:var(--media-thumb-height);object-fit:cover}body[data-landing-layout^=touch-] .media-choices .media-upload-icon{height:var(--media-thumb-height)}body[data-landing-layout^=touch-] #media-upload svg{width:calc(var(--touch-unit) * 18);height:calc(var(--touch-unit) * 18)}body[data-landing-layout^=touch-] .editor-switch__track{width:calc(var(--touch-unit) * 32);height:calc(var(--touch-unit) * 18)}body[data-landing-layout^=touch-] .editor-switch__track:before{inset-block-start:var(--s-1);inset-inline-start:var(--s-1);width:var(--s-5);height:var(--s-5)}body[data-landing-layout^=touch-] .editor-switch[aria-checked=true] .editor-switch__track:before{transform:translate(calc(var(--touch-unit) * 14))}body[data-landing-layout^=touch-] .demo-controls{padding:0}body[data-landing-layout^=touch-] #quick-controls{--fs-xs: var(--type-mini);min-height:0}body[data-landing-layout^=touch-] .demo-controls-toolbar{padding-block:var(--demo-space) 0}body[data-landing-layout^=touch-] .demo-more-controls{gap:6px}body[data-landing-layout^=touch-] .demo-library{padding:var(--demo-space)}body[data-landing-layout^=touch-] .library-heading{display:flex;flex-wrap:nowrap;gap:8px;margin-bottom:8px}body[data-landing-layout^=touch-] .library-heading strong{min-width:0;flex-wrap:wrap}body[data-landing-layout^=touch-] .library-actions{display:flex;flex-wrap:nowrap;flex:1;grid-column:auto;width:auto;align-items:center;justify-content:flex-end;min-width:0;gap:8px}body[data-landing-layout^=touch-] .library-actions>button{flex:none;white-space:nowrap}body[data-landing-layout^=touch-] .lut-intensity{flex:0 1 240px;grid-template-columns:auto minmax(40px,1fr) 28px;gap:8px}body[data-landing-layout^=touch-] .look-card{width:var(--demo-look-width)}body[data-landing-layout^=touch-] .look-card>img{height:auto;aspect-ratio:3 / 2}body[data-landing-layout^=touch-] .look-more{width:150px;padding:10px}body[data-landing-layout^=touch-] .look-more strong{font-size:var(--type-ui)}body[data-landing-layout^=touch-] .look-more>span{font-size:var(--type-mini);line-height:var(--leading-caption)}body[data-landing-layout^=touch-] .looks-track{gap:8px}body[data-landing-layout^=touch-] .gallery-arrow{display:none}body[data-landing-layout^=touch-] .demo-caption{justify-content:center;text-align:center}@media(hover:none){body[data-landing-layout^=touch-] [data-live-preview]{display:none}}@media(width<=700px){body[data-landing-layout^=touch-] .demo-caption{display:grid;justify-items:center;gap:6px}body[data-landing-layout^=touch-] .demo-caption>.text-link{margin-top:0}}
