/* Graphite surfaces, a quieter motion rhythm, and clear focus on the work. */
:root{--motion-out:cubic-bezier(.22,1,.36,1)}
html{scroll-padding-top:100px}
button{transition:color 180ms,border-color 180ms,background-color 180ms,opacity 180ms,transform 220ms var(--motion-out)}
.button{min-height:44px;transition:background 160ms,border-color 160ms,box-shadow 200ms,transform 220ms var(--motion-out)}
.button:not(:disabled):active{transform:translateY(1px) scale(.985)}
.button .ico:last-child{transition:transform 240ms var(--motion-out)}
.button:not(:disabled):hover .ico:last-child{transform:translateX(2px)}
.button.primary{box-shadow:inset 0 1px #fff,0 2px 3px #0005,0 0 0 1px #ffffff05}
.button.primary:not(:disabled):hover{box-shadow:inset 0 1px #fff,0 4px 14px #0008}
.site-header{position:relative;z-index:2}
.site-nav>.nav-signin{min-height:44px;color:var(--subtle);font-size:12px}
.cinema{box-shadow:0 35px 80px -40px #000,inset 0 1px #ffffff06}
.cinema-source,.cinema-export{transition:translate 650ms var(--motion-out)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.cinema:hover .cinema-source{translate:0 -3px}.cinema:hover .cinema-export{translate:0 -5px}}
.task-card,.project-card{transition:border-color 200ms,box-shadow 220ms,transform 280ms var(--motion-out)}
.project-card:hover{box-shadow:0 12px 30px -15px #0008}
.workflow-step:active,.lang-switch button:active{transform:scale(.97)}
.field input,.field textarea,.auth-form input{transition:border-color 180ms,box-shadow 180ms}
.field input:focus,.field textarea:focus,.auth-form input:focus{border-color:#a7b298;box-shadow:0 0 0 3px #c8dcac0b}
dialog{background:#181a1d;border:1px solid #45484c;border-radius:16px;box-shadow:0 40px 100px #000b,inset 0 1px #ffffff09;max-height:calc(100dvh - 32px);overflow:auto}
dialog::backdrop{background:#050607b8;backdrop-filter:blur(10px)}
.icon-button{min-height:40px;min-width:40px;border-radius:8px}
.auth-dialog{width:calc(100vw - 32px);max-width:480px;padding:30px 32px}
.auth-topline{display:flex;align-items:center;justify-content:space-between;margin-bottom:36px}
.auth-topline .wordmark{font-size:22px}
.auth-intro .eyebrow{font-size:9px;color:#9aa394;letter-spacing:.16em}
.auth-intro h2{font-size:32px;line-height:1.18;letter-spacing:-.045em;margin:10px 0 12px}
.auth-intro p{font-size:13px;line-height:1.7;color:#b0b5be;overflow-wrap:anywhere}
.auth-providers{display:grid;gap:10px;margin-top:28px}
.auth-provider{justify-content:flex-start;min-height:48px;background:#212428;border-color:#3b3f44;font-size:13px;border-radius:8px;padding:12px 16px;gap:12px}
.auth-provider svg{width:19px;height:19px;flex-shrink:0}
.auth-provider .ico,.auth-provider small{margin-left:auto}.auth-provider small{font-size:10px;font-weight:400}
.auth-provider:disabled{opacity:.58}
.auth-divider{display:flex;align-items:center;gap:14px;margin:24px 0;color:#858b94;font-size:11px}
.auth-divider::before,.auth-divider::after{content:'';height:1px;background:#34383e;flex:1}
.auth-form label{display:block;color:#c2c6cc;font-size:12px;margin:22px 0 8px}
.auth-form input{display:block;width:100%;min-height:50px;border:1px solid #3c4148;border-radius:8px;padding:12px 14px;color:#edf0f3;background:#101215;outline-offset:3px;font-size:14px}
.auth-form input::placeholder{color:#656c76}
.auth-error{min-height:28px;padding:6px 0;font-size:11px;line-height:1.5;color:#edb2a8}
.auth-submit{min-height:48px;border-radius:8px;font-size:13px}
.auth-code{font-family:var(--mono);font-size:24px!important;letter-spacing:.42em;text-align:center;padding-left:24px!important;font-variant-numeric:tabular-nums}
.auth-secondary{display:flex;align-items:center;justify-content:space-between;margin-top:12px;gap:10px}
.auth-secondary button{min-height:44px;font-size:11px;color:var(--subtle);display:flex;align-items:center;gap:6px;padding:4px 0}
.auth-secondary .ico{width:14px;height:14px}
.auth-footnote{border-top:1px solid #2d3136;padding-top:20px;margin-top:26px;display:flex;align-items:flex-start;gap:9px;font-size:11px;line-height:1.6;color:#8e959f}
.auth-footnote .ico{width:13px;height:15px;margin-top:1px}
.auth-legal{margin-top:16px;font-size:11px;line-height:1.85;color:#b0b5be;overflow-wrap:anywhere}.auth-legal a{color:#edf0e9;text-decoration:underline;text-decoration-color:#747a83;text-underline-offset:3px}.auth-legal a:hover{color:var(--accent)}.checkout-legal{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:14px;font-size:11px;color:#c8ccd3}.checkout-legal a{min-height:44px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:4px}
.auth-availability{font-size:11px;color:#b0b5be;margin-top:12px;line-height:1.7}
.auth-spinner{width:15px;height:15px;display:inline-block;border:1.5px solid currentColor;border-right-color:transparent;border-radius:50%;animation:auth-spin .8s linear infinite}
@keyframes auth-spin{to{transform:rotate(360deg)}}
@media(max-width:700px){.site-nav>.nav-signin{display:none}.auth-dialog{padding:24px}.auth-topline{margin-bottom:28px}.auth-intro h2{font-size:29px}.lang-switch button{min-height:40px}.cinema-source,.cinema-export{transition:none}}
@media(prefers-reduced-motion:reduce){button,.button,.cinema-source,.cinema-export,.project-card,.field input,.auth-form input{transition:none!important}.auth-spinner{animation:none;border-style:dotted}.cinema:hover .cinema-source,.cinema:hover .cinema-export{translate:none}}
@media(prefers-reduced-transparency:reduce){dialog::backdrop{backdrop-filter:none;background:#050607f5}}
@media(prefers-contrast:more){.auth-intro p,.auth-footnote,.auth-divider,.auth-form label{color:#d3d7dd}.auth-form input,.auth-provider,dialog{border-color:#a8aeb8}}

html{scrollbar-gutter:stable}html:has(dialog[open]){overflow:hidden}dialog{overscroll-behavior:contain}
.drop-area{transition:background 160ms,border-color 160ms,box-shadow 220ms}
.drop-area.over{box-shadow:inset 0 0 0 1px #c8dcac44;background:#1b231d}
.drop-ico{transition:transform 220ms var(--motion-out)}.drop-area.over .drop-ico{transform:translateY(-4px)}
.scene-item{transition:border-color 200ms,background-color 200ms}.scene-item.active{box-shadow:inset 2px 0 #a6ba96}
@media(max-width:700px){.auth-form input:not(.auth-code){font-size:16px}}

.showcase-dialog{width:calc(100vw - 32px);max-width:880px;padding:26px;border-radius:16px}
.showcase-dialog .dialog-copy{margin:20px 0}.demo-screen{background:#08090a;border:1px solid #373b42;border-radius:9px;overflow:hidden}
.demo-screen video{width:100%;display:block;max-height:65dvh;aspect-ratio:9/16;object-fit:contain}
.demo-description{display:flex;gap:30px;padding-top:20px;align-items:flex-start}.demo-description .eyebrow{white-space:nowrap;padding-top:3px}.demo-description p{font-size:12px;color:var(--subtle);line-height:1.7}
@media(max-width:700px){.showcase-dialog{padding:20px}.demo-description{display:block}.demo-description p{margin-top:8px}.showcase-dialog .dialog-actions{flex-wrap:wrap}}

/* Actual browser-generated Impact template showcase. */
.impact-source-video{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;border:1px solid #4a4d53;border-radius:8px;background:#090a0c}
.cinema-export .impact-demo{display:block;width:241px;aspect-ratio:9/16;object-fit:cover;border:1px solid #51544b;border-radius:5px;background:#0b0b0b}
.impact-entry{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 19px;margin-bottom:26px;border:1px solid #46513b;border-radius:7px;background:#c8dcac06;color:#d9e2cd;font-size:11px;line-height:1.6}
.impact-entry strong{display:block;font-weight:550}.impact-entry small{display:block;color:#9ba58f;font-size:10px;margin-top:4px}.impact-entry>span:last-child{white-space:nowrap}
@media(max-width:700px){.cinema-export .impact-demo{width:180px}.impact-entry{align-items:flex-start;padding:14px;gap:12px}}
@media(max-width:420px){.cinema-export .impact-demo{width:143px}.impact-entry{flex-direction:column;gap:8px}}
.cinema-export{position:relative}.poster-play{position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-50%);width:56px;height:56px;border:1px solid #ffffff70;border-radius:50%;display:grid;place-items:center;background:#111a;color:#fff;backdrop-filter:blur(5px)}.poster-play svg{width:20px;height:20px}.poster-play:hover{background:#111e}
.film-templates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:30px;border-top:1px solid #303238;padding-top:24px}
.film-templates article{display:flex;gap:22px;align-items:center;min-width:0}.film-template-thumb{position:relative;flex-shrink:0;border:1px solid #50555e;border-radius:4px;overflow:hidden}.film-template-thumb img{display:block;object-fit:cover}.film-template-thumb>span{position:absolute;inset:0;display:grid;place-items:center;background:#0003;color:white}.film-template-thumb svg{width:23px;height:23px}.film-templates .eyebrow{font-size:9px}.film-templates h3{font-size:24px;font-weight:500;margin:6px 0;letter-spacing:-.7px}.film-templates p{font-size:12px;line-height:1.6;color:#9da5af;margin:0 0 6px}.film-template-actions{display:flex;gap:23px;flex-wrap:wrap;font-size:11px;color:#d6dce4}.film-template-actions button,.film-template-actions a{min-height:40px;display:inline-flex;align-items:center;gap:6px}.film-template-actions svg{width:13px;height:13px}.film-template-actions a{text-decoration:underline;text-underline-offset:5px}
@media(max-width:700px){.film-templates{grid-template-columns:1fr;gap:22px;margin-top:22px}.film-templates article{gap:18px}.film-templates article+article{border-top:1px solid #2a2d33;padding-top:22px}.film-template-actions{gap:22px}.film-template-actions button,.film-template-actions a{min-height:44px}.poster-play{width:46px;height:46px}}
/* The content-specific studio is discoverable before the legacy template gallery. */
.creative-entry{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 28px;margin:24px 0 20px;border:1px solid #41493d;border-radius:7px;background:linear-gradient(115deg,#171d17,#111418)}.creative-entry strong{display:block;font-size:20px;font-weight:500;letter-spacing:-.035em;margin-top:8px}.creative-entry small{display:block;color:var(--subtle);font-size:12px;margin-top:5px}.creative-entry>span{font-size:12px;color:#dce8d2;white-space:nowrap}.creative-entry:hover{border-color:#87977c}.creative-entry .eyebrow{color:#9ba991}@media(max-width:640px){.creative-entry{padding:20px;align-items:flex-start;flex-direction:column;gap:15px}.creative-entry strong{font-size:19px}}