/* One material family, with color reserved for actions and the content itself. */
:root{--surface-base:#111614;--surface-raised:#171c19;--surface-edge:#ffffff20;--surface-highlight:#ffffff08;--surface-shadow:0 22px 64px #0005,0 1px 0 #ffffff08 inset;--ui-muted:#afb8b1;--ui-secondary:#c5ccc7;--ui-ease:cubic-bezier(.22,.68,.2,1);--ui-time:220ms}
.cinema-poster,.cinema-finish-screen,.film-scene[data-film=studio] .demo-phone{border-color:#6a756d;background:var(--surface-base);box-shadow:0 0 0 4px #202622,0 0 0 5px #ffffff12,0 18px 48px #0005}
.cinema-finish{filter:none}
.cinema-finish-shade{background:linear-gradient(180deg,#0001,transparent 20%,transparent 66%,#0003)}
.cinema-finish-badge,.cinema-finish-note{display:none}
.cinema-finish-label{font-size:11px;letter-spacing:.025em;color:var(--ui-muted)}
.cinema-finish-label>span:last-child{color:var(--ui-muted);font-size:11px}
.cinema-finish-watermark{font-size:clamp(10px,calc(var(--preview-width)*.034),12px);font-weight:600}
.cinema-finish-caption{font-weight:800;letter-spacing:-.025em;filter:drop-shadow(0 2px 3px #000b)}
.cinema-finish-controls button,.preview-player button{background:#1b211d;border-color:var(--surface-edge);color:var(--ui-secondary);transition:background var(--ui-time),border-color var(--ui-time)}
.cinema-finish-controls button:hover,.preview-player button:hover{background:#262e28;border-color:#ffffff50}
.cinema-finish-controls time{font-size:11px;color:var(--ui-secondary)}
.cinema-frame-label{font-size:11px;letter-spacing:.05em;color:var(--ui-muted)}
.cinema-frame-label .cinema-ratio{color:var(--ui-muted)}
.cinema-scene-number{opacity:.22}
.cinema-depth-grid{opacity:.4}
.cinema-filmstrip{border-color:var(--surface-edge);background:var(--surface-base)}
.cinema-filmstrip img{opacity:.8}
.cinema-selection{box-shadow:none;border-width:1px}
.cinema-selection span{font-size:10px;padding:3px 5px}
.cinema-timeline-top,.cinema-ruler{font-size:11px;color:var(--ui-muted)}
.cinema-copy .eyebrow{font-size:11px;letter-spacing:.07em;color:var(--ui-muted)}
.cinema-copy p.cinema-audience{color:var(--ui-muted);font-size:14px}
.cinema-copy .beta-status{background:transparent;border-color:var(--surface-edge);font-size:11px;color:var(--ui-secondary);font-weight:500}
.cinema-scroll-cue{font-size:12px;color:var(--ui-muted);letter-spacing:0}
.cinema-chapters button{color:var(--ui-muted);font-size:12px}
.cinema-chapters button[aria-current=step]{background:transparent}
.cinema-tools button{font-size:11px;min-height:36px;padding:8px 11px;color:var(--ui-secondary);border-color:var(--surface-edge)}
.cinema-note{font-size:11px;color:var(--ui-muted)}
.cinema-presets button{background:var(--surface-base);border-color:var(--surface-edge);font-size:12px;color:var(--ui-secondary);min-height:36px}
.cinema-presets button[aria-pressed=true]{background:#c1ee9f0b;border-color:var(--accent)}
/* Retain the dimensional motion; keep its surface treatment consistent. */
.ownership-panel,.journey-enabled .gallery-frame,.film-scene[data-film=studio] .caption-workbench{background:linear-gradient(145deg,#191e1b,#111614);border:1px solid var(--surface-edge);border-radius:20px;box-shadow:var(--surface-shadow)}
.ownership-visual::before{background:radial-gradient(ellipse,#ffffff06,transparent 70%)}
.ownership-engine{font-size:11px;color:var(--ui-muted);letter-spacing:.06em}
.ownership-engine>span{box-shadow:none}
.ownership-infinity-line{filter:drop-shadow(0 10px 13px #0007)}
.ownership-infinity-depth{stroke:#c1ee9f09}
.ownership-features{background:#0000000a}
.ownership-features svg,.ownership-platforms svg{stroke:#b4c1b6}
.ownership-platforms li:first-child svg{fill:#b4c1b6}
.ownership-platforms small{font-size:12px;color:var(--ui-muted)}
.ownership-features p,.ownership-foot p{color:var(--ui-muted)}
.ownership-foot p{font-size:12px}
.ownership-foot a{color:var(--ui-secondary);font-size:13px}
.film-chapter{font-size:11px;letter-spacing:.055em;color:var(--ui-muted)}
.film-chapter>span:first-child{color:#89998c}
.film-chapter i{background:linear-gradient(90deg,#ffffff38,#ffffff08)}
.film-ruler span{display:none}
.film-ruler::before{background:#ffffff0c}
.film-ruler i{background:linear-gradient(90deg,#c1ee9f70,#ffffff08)}
.film-tour-note{font-size:12px;color:var(--ui-muted);min-height:25px}
.film-tour-note:has(button[hidden]){visibility:hidden}
.film-tour-note button{color:var(--ui-secondary);border-color:#ffffff40;min-height:36px}
.film-background svg{opacity:.32}
.film-ambient{background:radial-gradient(ellipse 48% 48% at var(--film-world-x,25%) var(--film-world-y,45%),#dce7db07,transparent 72%)}
.film-faq-orbit span{-webkit-text-stroke-color:#bccabc70}
.film-faq-orbit i,.film-launch-seal span{border-color:#bccabc38}
.film-launch-seal img{filter:drop-shadow(0 14px 18px #0008)}
.journey-enabled .workspace-tabs,.lab-toolbar{background:#1b211d;border-color:var(--surface-edge)}
.journey-enabled .workspace-tabs button{font-size:14px;min-height:42px}
.workspace-panel,.workspace-image,.workspace-panel figcaption{background:#141916}
.workspace-panel figcaption{border-color:var(--surface-edge)}
.workspace-panel figcaption span,.workspace-footnote{font-size:13px;color:var(--ui-muted)}
.workspace-footnote{line-height:1.6}
.workspace-image img{filter:none;image-rendering:auto}
.workspace-image .image-open{font-size:12px;min-height:36px;background:#141916f2;border-color:#ffffff38;color:#eff3ee}
.layout-mini .layout-label{display:none}
.layout-mini li{font-size:12px;color:var(--ui-muted)}
.layout-mini li .frame-icon{color:#aebcaf;border-color:#637067;background:transparent}
.layout-mini li.is-lit .frame-icon{color:#d4e2cc;border-color:#8ea783;background:#ffffff03}
/* Controls stay neutral. The selected style and the real caption carry color. */
.lab-toolbar .lab-mark,.lab-toolbar div div>span,.setting-title>span:last-child{display:none}
.lab-toolbar strong{font-size:14px;font-weight:600}
.film-scene[data-film=studio] .studio-controls{background:#151a17;border-color:var(--surface-edge)}
.film-scene[data-film=studio] .preview-area{background:radial-gradient(ellipse at 50% 40%,#ffffff04,transparent 70%)}
.journey-enabled .caption-workbench::after{border-color:#ffffff12}
.preview-shade{background:linear-gradient(180deg,#0001,transparent 24%,transparent 66%,#0003)}
.film-scene[data-film=studio] .demo-phone>video{filter:none;opacity:1}
.film-scene[data-film=studio] .demo-phone>.preview-shade{background:linear-gradient(180deg,transparent 60%,#0002);opacity:1}
@media(min-width:761px){
.film-scene[data-film=studio] .preview-player{display:grid;grid-template-columns:44px minmax(16px,1fr) auto 44px 44px;gap:6px;width:min(100%,360px);align-items:center}
.film-scene[data-film=studio] .preview-player>*{grid-column:auto;grid-row:1}
.film-scene[data-film=studio] .preview-player #preview-play{grid-column:1}
.film-scene[data-film=studio] .preview-player #preview-seek{grid-column:2;width:100%;min-width:0}
.film-scene[data-film=studio] .preview-player #preview-time{grid-column:3}
.film-scene[data-film=studio] .preview-player #preview-sound{grid-column:4}
.film-scene[data-film=studio] .preview-player #preview-reset{grid-column:5}
}
.look-card,.look-sample{background:#121714}
.look-label{background:#1b211d;color:var(--ui-secondary)}
.look-card[aria-pressed=true] .look-label{background:#c1ee9f0b}
.field-label,.color-field legend,.setting-title,.range-setting label,.mark-field legend{font-size:13px;color:var(--ui-secondary)}
.field-help,.studio-note,.caption-customize>summary small,.preview-meta,.word-timing summary,.custom-color-row{font-size:12px;color:var(--ui-muted);line-height:1.6;letter-spacing:0}
.caption-customize>summary{color:#edf2ec}
.caption-customize>summary svg{stroke:var(--ui-secondary)}
.reset-look{min-height:38px;color:var(--ui-secondary);border-color:var(--surface-edge)}
.preview-meta{padding-bottom:10px}
.preview-player span{font-size:12px;color:var(--ui-secondary)}
/* Every invitation uses the same label, treatment and action. */
.nav .button.small,.cinema-actions .button,.access .access-action .button,.mobile-beta-bar button,#access-dialog .button.primary,.pricing-card .pricing-action,.pricing-card.featured .pricing-action{display:inline-flex;align-items:center;justify-content:center;gap:12px;border:1px solid #c1ee9f;border-radius:10px;background:#c1ee9f;color:#14200f;box-shadow:0 1px 0 #ffffff40 inset,0 5px 14px #0002;font-weight:650;font-size:13px;line-height:1.4;min-height:46px;transition:background var(--ui-time) var(--ui-ease),border-color var(--ui-time) var(--ui-ease),translate var(--ui-time) var(--ui-ease),box-shadow var(--ui-time) var(--ui-ease);text-decoration:none}
.nav .button.small:hover,.cinema-actions .button:hover,.access .access-action .button:hover,.mobile-beta-bar button:hover,#access-dialog .button.primary:hover,.pricing-card .pricing-action:hover{background:#d3f4b7;border-color:#d3f4b7;box-shadow:0 1px 0 #ffffff50 inset,0 8px 20px #0003;translate:0 -1px}
.nav .button.small:active,.cinema-actions .button:active,.access .access-action .button:active,.mobile-beta-bar button:active,.pricing-card .pricing-action:active{translate:0 1px}
.button:focus-visible,.pricing-action:focus-visible{outline:2px solid #e3f8d4;outline-offset:4px}
header.nav.wrap>a.button.small{background:#c1ee9f;border-color:#c1ee9f;color:#14200f;box-shadow:0 1px 0 #ffffff40 inset,0 5px 14px #0002}
header.nav.wrap>a.button.small:hover{background:#d3f4b7;border-color:#d3f4b7}
.cinema-actions [data-next-style]{background:#1b211d;border-color:#ffffff30;color:#e0e7df;box-shadow:none}
.cinema-actions [data-next-style]:hover{background:#252d27;border-color:#ffffff60;color:#edf2ec;box-shadow:none}
.cinema-actions .text-link,.product-section .text-link,.pricing-note a{color:var(--ui-secondary);font-size:13px}
.button svg.cta-arrow,.pricing-action svg.cta-arrow,.mobile-beta-bar svg.cta-arrow{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.pricing-card,.pricing-card.featured{background:var(--surface-base);border-color:var(--surface-edge);box-shadow:0 1px 0 #ffffff05 inset}
.pricing-tag{background:#ffffff06;color:var(--ui-secondary);border:1px solid #ffffff10;font-size:11px;letter-spacing:.03em;text-transform:none}
.pricing-note,.access .micro,.launch-note,.launch-benefits{font-size:12px;color:var(--ui-muted)}
.pricing-card>p:not(.pricing-price),.pricing-price span{color:var(--ui-muted)}
.film-scene[data-film=launch] .access-action .button{box-shadow:0 1px 0 #ffffff40 inset,0 5px 14px #0002}
.film-scene[data-film=faq] details::after{background:linear-gradient(90deg,#ffffff22,transparent)}
.mobile-beta-bar:not([hidden]){background:#141a16fa;border-color:var(--surface-edge)}
.mobile-beta-bar>div>span{font-size:11px;color:var(--ui-muted)}
@media(min-width:1001px){
 .film-scene[data-film=app] .workspace-image{height:clamp(340px,46vh,440px)}
}
@media(max-width:760px){
 header.nav>.button.small{padding:8px 11px;font-size:12px;max-width:130px;white-space:normal;text-align:center}
 header.nav .nav-cta-full{display:inline}
 header.nav .nav-cta-mobile{display:none}
 header.nav.has-mobile-menu nav{background:#171d19;border-color:var(--surface-edge)}
 .cinema-tools button{font-size:11px;padding:7px 9px;min-height:36px}
 .cinema-note{font-size:11px}
 .cinema-timeline-top,.cinema-ruler{font-size:10px}
 .ownership-platforms small{font-size:12px}
 .ownership-foot p{font-size:12px;line-height:1.65}
 .workspace-panel figcaption span{font-size:13px}
 .film-tour-note{flex-wrap:wrap;gap:4px 10px}
 .mobile-beta-bar button{font-size:12px;gap:8px;padding-inline:13px}
 .mobile-beta-bar strong{font-size:12px}
}
@media(max-width:360px){
 header.nav.wrap{padding-inline:14px;gap:8px}
 header.nav .brand{font-size:18px;gap:7px}
 header.nav .brand img{width:26px;height:26px}
 header.nav>.button.small{max-width:116px;padding-inline:9px;font-size:11px}
 .mobile-beta-bar button{font-size:11px;padding-inline:11px;gap:7px}
 .mobile-beta-bar>div>span{font-size:10px}
}
@media(prefers-reduced-motion:reduce){
 .nav .button.small,.cinema-actions .button,.access .access-action .button,.mobile-beta-bar button,.pricing-action{transition:none;translate:none}
}
