/* Reference geometry: 1512 viewport, 1230 content, 56/70 heading, 829x68 prompt, 306 cards. */
html body.workspace-readable.public-auth-open #authModal:not(:has(#securityPanel:not(.hidden))) .cl-home{--u:1px}
.cl-home .cl-header{height:50px;padding:0 16px}.cl-home .cl-brand{gap:8px}.cl-home .cl-brand img{width:36px;height:36px}.cl-home .cl-brand strong{font-size:24px}.cl-home .cl-login{height:32px;padding:0 20px;font-size:14px}
.cl-home .cl-hero{padding:80px 24px 0}
html body.workspace-readable.public-auth-open #authModal:not(:has(#securityPanel:not(.hidden))) .cl-home h1{font-size:56px!important;line-height:70px!important;font-weight:600!important;letter-spacing:0!important;gap:4px!important}
.cl-home .cl-description{font-size:20px;line-height:22px;margin-top:28px}
.cl-home .cl-prompt{box-sizing:border-box;width:min(829px,100%);height:68px;margin:80px auto 0;padding:14px;gap:8px}.cl-home .cl-prompt input{height:38px;font-size:16px;padding-left:7px}.cl-home .cl-prompt .cl-button{height:38px;min-width:102px;padding:0 21px;font-size:15px}
.cl-home .cl-showcase{display:flex;flex-direction:column;width:min(1230px,calc(100% - 48px));gap:16px;margin:80px auto 0}
.cl-showcase-row{height:306px;overflow:hidden;border-radius:24px}.cl-showcase-rail{display:flex;width:max-content;height:100%;animation:cl-live-rail 65s linear infinite}.cl-showcase-group{display:flex;gap:16px;padding-right:16px;height:100%;flex-shrink:0}
.cl-showcase-row:nth-child(2) .cl-showcase-rail{animation-duration:48s;animation-direction:reverse}
.cl-home .cl-showcase .cl-tile{position:relative;flex:none;width:408.34px;height:306px;overflow:hidden;border-radius:24px;padding:0;display:block}
.cl-home .cl-showcase-row:first-child .cl-tile:nth-child(3n+1){width:245.2px}.cl-home .cl-showcase-row:first-child .cl-tile:nth-child(3n+2){width:544.45px}.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(2){width:544.45px}.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(3){width:245.2px}
.cl-home .cl-showcase .cl-art,.cl-home .cl-showcase .cl-live-scene{display:block;width:100%;height:100%;border-radius:24px;margin:0}
.cl-home .cl-showcase .cl-tile-label,.cl-home .cl-gallery .cl-tile-label,.cl-home .cl-media-label{position:absolute!important;display:block!important;z-index:8;left:24px;top:22px;right:auto;bottom:auto;width:auto!important;height:auto!important;margin:0!important;padding:0!important;clip:auto!important;clip-path:none!important;overflow:visible!important;white-space:nowrap;color:#fff;font-size:16px;font-weight:500;line-height:24px;text-shadow:0 1px 8px #0009;pointer-events:none}
.cl-home .cl-tile:has(video)::after{content:"";position:absolute;inset:0 0 auto;height:90px;background:linear-gradient(#0005,transparent);pointer-events:none;border-radius:24px 24px 0 0}
.cl-home .cl-section{width:min(1230px,calc(100% - 48px));padding-top:160px}.cl-home .cl-section:has(#clWorkflowTitle){padding-top:220px}.cl-home .cl-section-heading{margin-bottom:64px}.cl-home .cl-section-heading h2{font-size:56px;line-height:70px;font-weight:600}.cl-home .cl-section-heading p{font-size:20px;line-height:28px;margin-top:28px}.cl-home .cl-section-heading .cl-button{height:52px;font-size:17px;padding:0 28px;margin-top:32px}.cl-home .cl-columns{gap:24px}.cl-home .cl-feature>.cl-art,.cl-home .cl-feature>.cl-live-scene,.cl-home .cl-section:has(#clToolsTitle) .cl-feature>div{height:306px;border-radius:24px;position:relative}.cl-home .cl-feature h3{font-size:24px;line-height:34px;margin-top:20px}.cl-home .cl-feature p{font-size:17px;line-height:26px;margin-top:10px}.cl-home .cl-art{border-radius:24px}.cl-home .cl-gallery{gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}.cl-home .cl-gallery .cl-tile{position:relative;overflow:hidden;border-radius:24px}.cl-home .cl-gallery .cl-art{height:306px}.cl-home .cl-example-note{font-size:13px}.cl-home .cl-workspace-preview{height:254px;position:relative}.cl-home .cl-workspace-preview>.cl-media-label{display:block!important}.cl-home .cl-footer{width:min(1230px,calc(100% - 48px));font-size:14px;padding:32px 0}.cl-home .cl-footer nav{gap:24px}
.cl-showcase-row:hover .cl-showcase-rail,.cl-showcase-row:focus-within .cl-showcase-rail,.cl-motion-suspended .cl-showcase-rail,.cl-rail-offscreen .cl-showcase-rail{animation-play-state:paused}
@keyframes cl-live-rail{to{transform:translateX(-50%)}}
@media(min-width:761px){
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) #authForm{grid-template-columns:minmax(0,62%) minmax(0,38%)!important;width:min(1202px,calc(100vw - 48px))!important;height:min(856px,calc(100dvh - 44px))!important;max-height:856px!important;padding:8px!important;border:0!important;border-radius:32px!important;background:#161616!important}
#authModal .cl-login-cinema{border-radius:26px;background:#202020;box-shadow:none}.cl-login-video{inset:0;width:100%;height:100%;object-fit:cover}.cl-login-cinema::after{height:42%;background:linear-gradient(transparent,#000c)}.cl-login-category{position:absolute;left:30px;top:28px;z-index:4;color:#fff;font-size:17px;text-shadow:0 1px 8px #0009}.cl-login-cinema-copy{position:absolute;z-index:4;left:36px;right:24px;bottom:56px;color:#fff}.cl-login-cinema-copy strong{font-size:28px;font-weight:600}.cl-login-cinema-copy p{font-size:15px;margin:14px 0 0;color:#ffffffb3}.cl-login-cinema .auth-login-dots{bottom:24px}.cl-login-cinema .auth-login-dots button{background:#ffffff50}.cl-login-cinema .auth-login-dots button.is-active{background:white;box-shadow:none}
#authModal .auth-login-panel{padding:60px 36px 26px;background:#161616}.cl-login-brand-logo{display:inline-block;vertical-align:middle;object-fit:contain;margin:0 8px 0 0}#authModal .auth-login-brand strong{display:inline-block;font-size:28px;vertical-align:middle;letter-spacing:0}#authModal .auth-login-brand small{letter-spacing:.12em;color:#999}
}
@media(max-width:760px){
.cl-home .cl-header{height:64px;padding:0 16px}.cl-home .cl-brand img{width:32px;height:32px}.cl-home .cl-brand strong{font-size:18px}.cl-home .cl-login{font-size:12px;height:32px;padding:0 14px}.cl-home .cl-hero{padding:48px 16px 0}
html body.workspace-readable.public-auth-open #authModal:not(:has(#securityPanel:not(.hidden))) .cl-home h1{font-size:clamp(20px,5.6vw,36px)!important;line-height:1.25!important;gap:1px!important}
.cl-home .cl-description{font-size:14px;line-height:22px;margin-top:20px}.cl-home .cl-prompt{height:56px;margin-top:40px;padding:8px;gap:4px}.cl-home .cl-prompt input{font-size:14px;min-width:0}.cl-home .cl-prompt .cl-button{min-width:94px;padding:0 13px;font-size:14px}.cl-home .cl-showcase{width:calc(100% - 32px);margin-top:56px;gap:12px}.cl-showcase-row{height:220px;border-radius:20px}.cl-showcase-group{gap:12px;padding-right:12px}.cl-home .cl-showcase .cl-tile{height:220px;width:310px;border-radius:20px}.cl-home .cl-showcase-row:first-child .cl-tile:nth-child(3n+1){width:184px}.cl-home .cl-showcase-row:first-child .cl-tile:nth-child(3n+2),.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(2){width:420px}.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(3){width:184px}.cl-home .cl-section,.cl-home .cl-section:has(#clWorkflowTitle){width:calc(100% - 32px);padding-top:96px}.cl-home .cl-section-heading{margin-bottom:32px}.cl-home .cl-section-heading h2{font-size:30px;line-height:42px}.cl-home .cl-section-heading p{font-size:14px;line-height:23px;margin-top:16px}.cl-home .cl-columns{grid-template-columns:1fr;gap:28px}.cl-home .cl-feature>.cl-art,.cl-home .cl-feature>.cl-live-scene,.cl-home .cl-section:has(#clToolsTitle) .cl-feature>div{height:220px}.cl-home .cl-feature h3{font-size:20px;line-height:28px;margin-top:14px}.cl-home .cl-feature p{font-size:14px;line-height:23px}.cl-home .cl-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.cl-home .cl-gallery .cl-art{height:160px}.cl-home .cl-showcase .cl-tile-label,.cl-home .cl-gallery .cl-tile-label,.cl-home .cl-media-label{left:14px;top:14px;font-size:13px;line-height:20px}.cl-login-brand-logo{display:none}.cl-home .cl-footer{width:calc(100% - 32px)}
}
@media(prefers-reduced-motion:reduce){.cl-showcase-rail{animation:none}.cl-showcase-row{overflow-x:auto}.cl-login-video{transition:none}}
html body.workspace-readable.public-auth-open #authModal:not(:has(#securityPanel:not(.hidden))) .cl-home .cl-prompt input{font-size:16px;padding-left:7px}
.cl-home .cl-section:has(#clToolsTitle) .cl-section-heading h2{font-size:56px;line-height:70px}.cl-home .cl-section:has(#clToolsTitle) .cl-section-heading,.cl-home .cl-section:has(#clScenesTitle) .cl-section-heading{margin-bottom:64px}
@media(max-width:760px){html body.workspace-readable.public-auth-open #authModal:not(:has(#securityPanel:not(.hidden))) .cl-home .cl-prompt input{font-size:14px}.cl-home .cl-section:has(#clToolsTitle) .cl-section-heading h2{font-size:30px;line-height:42px}.cl-home .cl-section:has(#clToolsTitle) .cl-section-heading,.cl-home .cl-section:has(#clScenesTitle) .cl-section-heading{margin-bottom:32px}}
@media(min-width:761px){#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .auth-login-brand strong{color:#fff!important;font-size:28px!important;letter-spacing:0!important}.cl-login-cinema-copy{text-align:left!important}.cl-login-cinema-copy strong{color:#fff!important}.cl-login-cinema-copy p{color:#ffffffb3!important}}
.cl-home .cl-word-window{display:inline-block;height:1.25em;overflow:hidden;vertical-align:bottom}.cl-home #clRotatingWord{display:block;line-height:1.25!important;height:1.25em;overflow:visible!important;min-width:0!important;border:0!important;opacity:1!important}.cl-word-item{display:block;height:1.25em;line-height:1.25;white-space:nowrap;width:0;overflow:hidden;font:inherit;color:inherit}.cl-word-item.is-current{width:auto;border-bottom:1px solid currentColor;box-sizing:border-box}
.cl-home .cl-word-window{border-bottom:0!important}
.cl-home .cl-feature>.cl-live-scene,.cl-home .cl-feature>.cl-art{width:100%;max-width:100%;box-sizing:border-box}
.cl-home .cl-section:has(#clToolsTitle) .cl-feature h3{font-size:24px;line-height:34px;margin-top:20px}.cl-home .cl-section:has(#clToolsTitle) .cl-feature p{font-size:17px;line-height:26px;margin-top:10px}.cl-home .cl-prompt .cl-button{width:102px}.cl-home .cl-workspace-preview{width:min(1139px,100%)}.cl-home .cl-footer a,.cl-home .cl-footer button,.cl-home .cl-footer p{font-size:14px;line-height:22px}
@media(max-width:760px){.cl-home .cl-section:has(#clToolsTitle) .cl-feature h3{font-size:20px;line-height:28px;margin-top:14px}.cl-home .cl-section:has(#clToolsTitle) .cl-feature p{font-size:14px;line-height:23px}.cl-home .cl-prompt .cl-button{width:94px}.cl-home .cl-footer a,.cl-home .cl-footer button,.cl-home .cl-footer p{font-size:12px;line-height:20px}}

/* Fixed-looking glass chrome stays in the landing scroll container, above every section. */
.cl-home .cl-header{position:sticky;top:0;z-index:30;background:linear-gradient(180deg,#ffffff82,#ffffff38);-webkit-backdrop-filter:blur(12px) saturate(180%);backdrop-filter:blur(12px) saturate(180%);border-bottom:1px solid #ffffff9c;box-shadow:0 1px 0 #171d2e05;isolation:isolate}
.cl-home .cl-brand{padding:3px 10px 3px 0;border-radius:999px;background:linear-gradient(125deg,#ffffff50,#ffffff08);text-shadow:0 1px 1px #fff7}
.cl-home .cl-login{height:38px;min-width:102px;padding:0 21px;font-size:15px;font-weight:550;border:0;border-radius:999px;background:var(--cl-blue);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}
@media(max-width:760px){.cl-home .cl-login{min-width:94px;padding:0 13px;font-size:14px}}
.cl-home .cl-login:hover{background:#004cda;box-shadow:none}.cl-home .cl-login:focus,.cl-home .cl-login:focus-visible{outline:0!important;background:#004cda}
.cl-home .cl-showcase-row:nth-child(2) .cl-showcase-rail{animation-duration:76s}.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(3n+1){width:408.34px}.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(3n+2){width:544.45px}.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(3n){width:245.2px}.cl-home .cl-live-tools{row-gap:40px}
@media(max-width:760px){.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(3n+1){width:310px}.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(3n+2){width:420px}.cl-home .cl-showcase-row:nth-child(2) .cl-tile:nth-child(3n){width:184px}.cl-home .cl-live-tools{row-gap:28px}.cl-home .cl-brand{padding-right:8px}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.cl-home .cl-header{background:#fafafaf0}.cl-home .cl-login{background:#065dff}}
.cl-home .cl-section:has(#clToolsTitle) .cl-live-tools{row-gap:40px}@media(max-width:760px){.cl-home .cl-section:has(#clToolsTitle) .cl-live-tools{row-gap:28px}}

/* Keep the complete landscape poster in its intended frame; cloned cards remain interactive. */
.cl-home .cl-showcase-row:first-child .cl-tile:has(.cl-art-flat){width:459.37px}
.cl-home .cl-showcase .cl-art-flat video{object-fit:contain;object-position:center}
.cl-home .cl-gallery .cl-art-flat.cl-live-video video{object-fit:cover;object-position:left center}
.cl-home .cl-feature-action{cursor:pointer;border-radius:24px;outline-offset:6px}.cl-home .cl-feature-action:focus-visible{outline:2px solid #065dff}
@media(max-width:760px){.cl-home .cl-showcase-row:first-child .cl-tile:has(.cl-art-flat){width:330.26px}}

/* White landing and login surfaces; retain the artwork's own colors. */
html body.workspace-readable.public-auth-open #authModal:not(:has(#securityPanel:not(.hidden))) .auth-story.login-site.cr-home.cl-home{background:#fff!important}
html body.workspace-readable.public-auth-open #authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) #authForm,
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) #authForm,
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .auth-login-panel{background:#fff!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .auth-login-brand strong{color:#111!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .auth-login-brand small{color:#737780!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) :is(.remember-login,.auth-terms-acceptance,.auth-register-switch){color:#596579!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) #authForm:has(#forgotPasswordPanel:not(.hidden)) #authTitle{color:#111!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) #authForm:has(#forgotPasswordPanel:not(.hidden)) #authMessage{color:#737780!important}

/* Dedicated 1194x1080 films and a matching full-bleed login viewport. */
@media(min-width:761px){
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) #authForm{--login-film-width:min(735.32px,calc(62vw - 39.68px),calc((100dvh - 60px) * 1.1055555556));grid-template-columns:var(--login-film-width) minmax(0,1fr)!important;width:calc(var(--login-film-width) / .62 + 16px)!important;height:calc(var(--login-film-width) / 1.1055555556 + 16px)!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .cl-login-cinema{background:#111720!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .cl-login-cinema .auth-login-visual-slides{inset:0!important;background:#111720!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .cl-login-cinema .cl-login-video{inset:0!important;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center!important;transform:none!important;transition:none!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .cl-login-cinema::after{display:block!important;inset:auto 0 0!important;height:38%!important;background:linear-gradient(transparent,rgba(0,0,0,.58))!important;pointer-events:none}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .cl-login-cinema .cl-login-cinema-copy{left:36px!important;right:28px!important;bottom:36px!important;height:auto!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;backdrop-filter:none!important;text-align:left!important;text-shadow:0 2px 12px #0006!important;pointer-events:none}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .cl-login-cinema .cl-login-cinema-copy strong{color:#fff!important;font-size:28px!important;line-height:1.35!important;font-weight:600!important}
#authModal.auth-form-open:not(:has(#securityPanel:not(.hidden))) .cl-login-cinema .cl-login-cinema-copy p{margin:12px 0 0!important;color:#ffffffc7!important;font-size:15px!important;line-height:1.5!important;letter-spacing:0!important}
}

/* Separate the functional tools heading from the gallery above. */
.cl-home .cl-section:has(#clToolsTitle){padding-top:160px}
@media(max-width:760px){.cl-home .cl-section:has(#clToolsTitle){padding-top:96px}}
