:root{color-scheme:dark;--black:#000;--black-alt:#0a0a0a;--mint:#30d4f1;--blue:#96effe;--teal:#1a2f33;--grey-blue:#31464a;--muted:#929292;--line:#ffffff20}
*{box-sizing:border-box}body{margin:0;background:#000;color:#fff}a{color:inherit}[hidden]{display:none!important}
.story-header{position:absolute;left:42px;right:42px;top:26px;display:flex;align-items:center;gap:28px;z-index:50;pointer-events:none}.story-header>*{pointer-events:auto}.brand{display:flex;align-items:center;gap:10px;text-decoration:none}.brand img{width:28px;height:28px}.brand-times{color:#737373;padding:0 7px}.chapter-control{height:36px;padding:8px 14px}.top-actions{position:fixed;right:28px;top:24px;display:flex;align-items:center;gap:8px;z-index:65}#save-status{color:var(--blue);max-width:100px}.journey-nav{position:fixed;bottom:24px;right:30px;z-index:65;display:flex;align-items:center;gap:14px;background:#000b;padding:7px;border-radius:38px;backdrop-filter:blur(12px)}#position{color:#9b9b9b;min-width:44px;text-align:center}.loading{padding:150px 60px;color:#888}
.scene{max-width:1540px;margin:auto;padding:126px 60px 124px;min-height:100vh;animation:enter .3s ease}.eyebrow{color:var(--blue);text-transform:uppercase;margin:0 0 20px}.scene h1{margin:0;max-width:1100px}.scene .description{color:#9c9c9c;max-width:800px;margin:24px 0 38px}.media-note{color:#717171;margin-top:16px}.creative-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.creative-card{border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#090909;text-align:left;padding:0;color:white;transition:transform .2s,border-color .2s}.creative-card:hover{transform:translateY(-4px);border-color:#ffffff60}.creative-card img{width:100%;height:210px;object-fit:cover;display:block}.creative-card .card-copy{padding:21px}.creative-card h3{margin:0 0 6px}.creative-card p{color:#8c8c8c;margin:0}.creative-card .credit{color:var(--blue);margin-top:15px}.creator-loop{display:flex;gap:18px;align-items:center;margin-top:30px;color:#a8a8a8}.creator-loop span:nth-child(even){color:#444}.hero-media{border-radius:18px;overflow:hidden;background:#0c0c0c;border:1px solid var(--line);position:relative}.hero-media>img{width:100%;max-height:540px;object-fit:cover;display:block}.hero-media video{display:block;width:100%;max-height:560px;background:#080808}.model-layout{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(230px,1fr);gap:36px;align-items:center}.model-layout h2{margin:12px 0}.model-layout p:where(:not(.model-creator)){color:#999;max-width:350px}.model-meta{color:var(--blue)}.model-options{display:flex;gap:6px;flex-wrap:wrap;margin:18px 0}.brackets{display:flex;gap:8px;margin-top:12px}.brackets img{height:74px;width:112px;object-fit:cover;border-radius:6px}.process-layout{display:grid;grid-template-columns:1.55fr 1fr;gap:30px;align-items:start}.tabs{display:flex;gap:8px;margin:28px 0 22px;flex-wrap:wrap}.catalog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.catalog-grid .creative-card img{height:200px}.large-statement{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:58px}.statement{padding:30px;border-top:1px solid #3f3f3f}.statement .num{color:var(--blue)}.statement h2{margin:24px 0 18px}.statement p{color:#888}.roadmap-strip{margin-top:35px;color:#9b9b9b}.portrait-placeholder{width:40px;height:40px;border-radius:50%;background:#1a2f33;display:inline-flex;align-items:center;justify-content:center;color:var(--blue);margin-right:12px}.byline{display:flex;align-items:center;margin-top:18px;color:#aaa}
/* Economics layout keeps native controls on their own rows with room for explicit labels. */
.economics-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(28px,4.5vw,70px);margin-top:20px}
.economics-context{max-width:900px;margin:-24px 0 32px;color:#a0a0a0}
.assumptions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px;min-width:0}
.assumption{display:grid;grid-template-rows:1fr auto;gap:20px;min-width:0;border-bottom:1px solid #232323;padding-bottom:24px}
.assumption .assumption-heading{display:grid;grid-template-rows:1fr auto;align-items:start;gap:12px;min-width:0;color:#b0b0b0}
.assumption-heading>span:first-child{min-width:0}
.assumption-value{display:inline-flex;align-items:center;justify-self:start;gap:8px;white-space:nowrap}
.assumption-unit{color:#a0a0a0}
.assumption.full{grid-column:1/-1}
.assumption.full .assumption-heading{grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto;align-items:center;gap:16px}
.assumption.full .assumption-value{justify-self:end}
.assumption .repo-range{margin-top:0}
.video-volume{display:grid;grid-column:1/-1;gap:16px;min-width:0;padding:4px 0 24px;border-bottom:1px solid #232323}
.video-volume>label{color:#b0b0b0}
.video-volume .repo-select{min-width:0;margin:0}
.video-volume .mode-note{margin:0}
.economics-total{min-width:0;align-self:start;position:sticky;top:118px}
.economics-total .annual-label{color:#a0a0a0}
.annual-number{margin:20px 0;color:var(--blue);font-variant-numeric:tabular-nums}
.profit-note{color:#777;max-width:370px;margin:0 0 26px}
.breakdown{border-top:1px solid #333}
.breakdown>div{display:flex;justify-content:space-between;gap:20px;margin:18px 0;color:#999}
.breakdown strong{flex-shrink:0;color:#e7e7e7;font-variant-numeric:tabular-nums}
.equation{color:#777;margin:24px 0 16px}
.mode-note{color:#777;margin:0;grid-column:1/-1}

body.partner-mode{background:#fff;overflow:hidden}.partner-frame{position:fixed;inset:0;border:0;width:100%;height:100%;background:white;z-index:1}.partner-mode .brand{display:none}.partner-mode .story-header{top:14px;left:14px;right:auto}.partner-mode .top-actions{top:14px;right:14px}.partner-mode #save-status{color:#166573;background:white;border-radius:4px}.partner-mode .journey-nav{background:#fffffff0;border:1px solid #eee;box-shadow:0 5px 25px #0002;backdrop-filter:blur(10px)}.partner-mode #position{color:#888}.partner-hint{position:fixed;bottom:30px;left:24px;z-index:40;max-width:calc(100vw - 410px);padding:12px 18px;background:#fffffff0;color:#222;border-radius:12px;box-shadow:0 4px 22px #0002;border:1px solid #eee;pointer-events:auto}.partner-hint small{display:block;color:#777;margin-top:3px}
.workflow-line{display:flex;align-items:center;gap:24px;justify-content:center;margin:50px 0}.workflow-node{border:1px solid #303030;border-radius:20px;padding:32px;min-width:220px;text-align:center;background:#0b0b0b}.workflow-node small{display:block;color:#888;margin-top:6px}.workflow-line .arrow{color:var(--mint)}.prompt-box{background:#101010;border:1px solid #333;border-radius:18px;padding:24px;max-width:880px;margin:24px 0}.chat-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:34px}.chat-log{background:#080a0a;border:1px solid #243033;border-radius:18px;min-height:315px;padding:25px;display:flex;flex-direction:column;gap:15px}.chat-step{color:#a5a5a5;animation:enter .25s ease}.chat-step .check{color:var(--mint);margin-right:10px}.chat-done{color:var(--blue);border-top:1px solid #243033;padding-top:16px;margin-top:auto}.setup-subtitle{margin:14px 0 0;color:#b5b5b5}.setup-list{display:flex;flex-direction:column;list-style:none;padding:0;margin:34px 0 36px;width:100%}.setup-item{display:grid;grid-template-columns:32px minmax(0,1fr);gap:20px;align-items:baseline;border-top:1px solid #303030;padding:24px 0;width:100%;max-width:none}.setup-number{font-weight:500;color:var(--mint);font-variant-numeric:tabular-nums}.setup-reason{margin:0;min-width:0}.setup-content{margin-top:32px;padding:26px;background:#0d0d0d;border:1px solid #333;border-radius:18px;max-width:980px}.setup-content ol{padding-left:24px;color:#aaa}.setup-content code{color:var(--blue);font-size:12px;overflow-wrap:anywhere}
#api-drawer{position:fixed;inset:0;z-index:200}.drawer-backdrop{position:absolute;inset:0;background:#0006;backdrop-filter:blur(3px)}.drawer-panel{position:absolute;right:0;top:0;bottom:0;width:min(580px,100vw);background:#0b0d0e;color:#fff;border-left:1px solid #35464a;box-shadow:-20px 0 60px #0005;display:flex;flex-direction:column}.drawer-panel.wide{width:min(1000px,94vw)}.drawer-header{display:flex;align-items:center;justify-content:space-between;padding:22px 25px;border-bottom:1px solid #293033;gap:10px}.drawer-body{padding:28px;overflow:auto}.drawer-body h2{margin:0 0 22px}.drawer-body h3{color:var(--blue);text-transform:uppercase;margin:29px 0 12px}.drawer-body p,.drawer-body li{color:#b9b9b9}.drawer-body ol,.drawer-body ul{padding-left:20px}.api-operation{background:#13191b;border:1px solid #293539;border-radius:8px;padding:12px;margin:9px 0}.api-operation code{font-size:11px;color:var(--blue);overflow-wrap:anywhere}.api-operation small{display:block;color:#9a9a9a;margin-top:6px}.roadmap{background:#292114;border:1px solid #534126;padding:15px;border-radius:9px;color:#ebc47e;margin-top:24px}.roadmap ul{color:#be9b61;margin-bottom:0}.code-wrap{position:relative}.code-wrap pre{background:#060808;border:1px solid #283236;padding:18px;border-radius:8px;overflow:auto;font:11px/1.6 ui-monospace,SFMono-Regular,Consolas,monospace;color:#b5d1d7;max-height:400px}.code-wrap>button{position:absolute;top:7px;right:7px}.drawer-links{display:flex;gap:15px;flex-wrap:wrap;margin:28px 0}.drawer-links a{color:var(--blue)}.drawer-close{background:transparent;color:white;border:0;cursor:pointer}
#modal{position:fixed;inset:0;z-index:250;background:#000a;backdrop-filter:blur(10px);padding:50px;overflow:auto;display:flex;align-items:center;justify-content:center}.modal-card{background:#0c0d0d;border:1px solid #333;border-radius:22px;padding:32px;max-width:980px;width:100%;position:relative;max-height:90vh;overflow:auto}.modal-card h2{margin:0 40px 24px 0}.modal-card p{color:#aaa}.modal-card>img{width:100%;max-height:420px;object-fit:contain;border-radius:10px}.modal-close{position:absolute;right:20px;top:20px;background:none;color:white;border:0}.chapter-list{display:grid;grid-template-columns:1fr 1fr;gap:4px 20px}.chapter-list button{border:0;border-bottom:1px solid #262626;background:none;color:#bbb;padding:12px;text-align:left;display:flex;gap:12px}.chapter-list button.active{color:var(--blue)}.chapter-list span{color:#555}.chapter-heading{grid-column:1/-1;color:#64797d;margin:15px 0 4px;text-transform:uppercase}#notice{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);background:#223236;color:#d8f8fe;border:1px solid #486168;padding:13px 22px;border-radius:9px;z-index:400;max-width:80vw}
body.editing [data-copy]{outline:1px dashed #30d4f177;outline-offset:5px;border-radius:3px;min-width:12px;cursor:text}body.editing [data-copy]:focus{outline:2px solid var(--mint)}[data-copy]{white-space:pre-wrap}.editor-note{color:var(--blue);margin:15px 0}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
@keyframes enter{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1450px){.scene{padding-top:145px}.story-header{gap:35px}.top-actions{right:42px}}
@media(max-width:1180px){.story-header{left:28px;gap:16px}.chapter-control{display:none}.scene{padding:115px 32px 115px}.creative-grid{gap:12px}.creative-card img{height:155px}.creative-card .card-copy{padding:16px}.economics-layout{gap:35px}.model-layout{gap:25px}.workflow-node{min-width:180px;padding:25px}}
@media(max-width:800px){.story-header{top:20px;left:20px}.brand-times{padding:0 3px}.brand img{width:24px}.top-actions{top:63px;right:20px;left:20px;justify-content:flex-end}.scene{padding:135px 22px 118px}.scene .description{margin:20px 0 30px}.creative-grid,.catalog-grid{grid-template-columns:1fr 1fr}.creative-card img{height:160px}.creative-card .card-copy{padding:16px}.model-layout,.process-layout,.economics-layout,.chat-layout{grid-template-columns:1fr}.model-options{margin:12px 0}.model-layout .hero-media img{height:300px}.large-statement{grid-template-columns:1fr;gap:0;margin-top:28px}.statement{padding:22px 0}.statement h2{margin:10px 0}.creator-loop{gap:9px;flex-wrap:wrap}.assumptions{gap:24px 18px}.economics-context{margin:-12px 0 26px}.economics-total{position:static;order:-1}.annual-number{margin:10px 0}.economics-layout{gap:30px}.profit-note{max-width:100%;margin-bottom:15px}.breakdown{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}.breakdown>div{flex-direction:column;gap:3px}.workflow-line{gap:10px;margin:28px 0}.workflow-node{min-width:0;padding:18px 12px;flex:1}.setup-item{grid-template-columns:24px minmax(0,1fr);gap:14px;padding:20px 0}.journey-nav{bottom:15px;right:15px}.partner-mode .top-actions{top:12px;right:12px;left:auto}.partner-mode #edit-mode{display:none}.partner-hint{left:12px;bottom:85px;max-width:calc(100vw - 24px);padding:8px 13px}.partner-hint small{display:none}.partner-mode .story-header{top:60px}.partner-mode .chapter-control{display:inline-flex;height:30px}.drawer-body{padding:24px 20px}.drawer-header{padding:17px 20px}.modal-card{padding:24px}#modal{padding:16px}.chapter-list{grid-template-columns:1fr}.chapter-heading{grid-column:1}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.workflow-statement{max-width:960px}@media(max-width:800px){.partner-mode #edit-mode{display:inline-flex}.chapter-control{display:inline-flex;height:30px;padding:5px 10px}.story-header{gap:10px}.partner-mode .chapter-control{max-width:150px}.partner-mode .top-actions{gap:5px}}
.copy-conflict{border-top:1px solid #333;padding:20px 0;margin:15px 0}.copy-conflict h3{color:var(--blue)}.copy-conflict strong{color:#ddd}.copy-conflict p{white-space:pre-wrap;max-height:180px;overflow:auto}
/* Partner screens stay full-bleed; only walkthrough controls float above them. */
.partner-hint{display:none}.editing .partner-hint{display:block}
/* Matt's minimal presentation direction: one heading, a visual, requested copy only. */
.cover-mode .story-header{display:none}
.scene-cover{display:flex;align-items:center;justify-content:center;text-align:center;min-height:100vh;padding:120px 50px}
.scene-cover h1{max-width:1100px;margin:0;text-wrap:balance}
.scene>h1{margin-bottom:48px}
.scene-cover>h1{margin-bottom:0}
.scene-library .creative-grid{gap:20px}
.scene-library .creative-card{background:transparent;border-color:#ffffff18;border-radius:16px}
.scene-library .creative-card img{height:clamp(220px,29vw,360px)}
.scene-library .card-copy{padding:24px}
.scene-library .creative-card h3{margin:0}
/* The overview title and cards form one centered presentation block. */
.scene.scene-library-centered{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100svh;padding-top:100px;padding-bottom:100px}
.scene-library-centered>h1{width:100%;text-align:center;margin:0 0 40px}
.scene-library-centered .creative-grid{width:100%;grid-template-columns:repeat(4,minmax(0,1fr));align-items:stretch}
.scene-library-centered .card-copy{text-align:center}
@media(max-width:800px){.scene.scene-library-centered{padding-top:100px;padding-bottom:110px}.scene-library-centered>h1{margin-bottom:30px}.scene-library-centered .creative-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.scene .model-layout{grid-template-columns:minmax(0,2.15fr) minmax(220px,1fr);gap:44px}
.scene .active-model-name{color:#fff;margin:0 0 24px}
.scene .model-options{gap:8px;margin:0 0 22px}
.scene .model-controls{display:flex;gap:8px;flex-wrap:wrap}
.scene .roadmap-strip{color:#aaa;max-width:900px;margin-top:30px}
.scene .model-layout .roadmap-strip{max-width:290px}
.scene .editor-note,.scene .model-meta,.scene .annual-number,.scene .workflow-line .arrow,.scene .chat-step .check,.scene .chat-done{color:#ededed}
.scene .portrait-placeholder{background:#191919;color:#ddd}
.scene .statement{padding:28px 0}
.scene .statement h2{margin:12px 0;max-width:310px}
.scene .large-statement{margin-top:60px;gap:40px}
.scene .chat-log{background:#090909;border-color:#292929}
.scene .chat-done{border-color:#292929}
.scene .byline{margin-top:28px}
.scene-video-templates .process-layout>div{min-width:0}
.scene-video-templates .brackets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:0}
.scene-video-templates .brackets img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain}
@media(max-width:480px){.scene-video-templates .brackets{grid-template-columns:repeat(2,minmax(0,1fr))}}
.scene-video-templates .creator-profile{display:block;margin:28px 0 0;max-width:575px}
.scene-video-templates .creator-profile img{display:block;width:100%;height:auto;border-radius:12px}
.scene-video-templates .creator-profile+.byline{margin-top:20px}
.scene-video-templates .film-template-caption{margin-top:24px}
.scene-video-templates .film-template-label{margin:0 0 6px;color:#999}
/* The input grid and output share a heading row; the arrow aligns to the six photos. */
.film-input-output{display:grid;grid-template-columns:minmax(0,1fr) 48px minmax(0,1.55fr);grid-template-rows:auto auto auto;gap:20px 24px;align-items:start}
.film-input-output .film-inputs,.film-input-output .film-output{display:contents}
.film-input-output .film-input-heading{grid-column:1;grid-row:1;margin:0}
.film-input-output .brackets{grid-column:1;grid-row:2}
.film-input-output .film-creator{grid-column:1;grid-row:3;min-width:0}
.film-input-output .creator-profile{margin:4px 0 0}
.film-input-output .film-flow-arrow{grid-column:2;grid-row:2;align-self:center;color:#b0b0b0;display:flex;justify-content:center}
.film-input-output .film-output-heading{grid-column:3;grid-row:1;margin:0}
.film-input-output .hero-media{grid-column:3;grid-row:2 / 4;min-width:0;width:100%}
.film-input-output .hero-media video{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
@media(max-width:800px){.film-input-output{display:flex;flex-direction:column;gap:24px}.film-input-output .film-inputs,.film-input-output .film-output{display:block;width:100%;min-width:0}.film-input-output .film-input-heading,.film-input-output .film-output-heading{margin:0 0 18px}.film-input-output .film-creator{margin-top:24px}.film-input-output .film-flow-arrow{align-self:center;transform:rotate(90deg);margin:0 0 4px}}
.journey-nav{background:transparent;padding:0;backdrop-filter:none;gap:12px;border:0;border-radius:0}
.partner-mode .journey-nav{background:transparent;border:0;box-shadow:none;backdrop-filter:none}
.api-preview-note{font-size:12px!important;color:#888!important;padding-bottom:15px;border-bottom:1px solid #293033}
@media(max-width:800px){.scene>h1{margin-bottom:32px}.scene-cover{padding:120px 24px}.scene-cover h1{margin-bottom:0}.scene-library .creative-grid{gap:14px}.scene-library .creative-card img{height:180px}.scene-library .card-copy{padding:16px}.scene .model-layout{grid-template-columns:1fr;gap:24px}.scene .active-model-name{margin-bottom:18px}.scene .model-layout .roadmap-strip{max-width:100%;margin-top:22px}.scene .large-statement{gap:8px;margin-top:20px}}
/* Layout only. Control appearance and typography are compiled from frontend. */
.repo-button{display:inline-flex;vertical-align:middle;align-items:center}
.repo-process{display:flex;width:100%}
.repo-process.active{opacity:1}.repo-process:not(.active){opacity:.55}
.repo-modal-close{position:absolute;right:20px;top:20px}
.repo-range{display:block;width:100%;margin-top:18px}
.repo-number{display:inline-flex;width:96px;vertical-align:middle}
.repo-select{display:block;min-width:150px;width:100%;margin-top:10px}
.model-options{width:100%;display:block}
.model-controls{align-items:center}
.scene>h1{max-width:1100px}
.scene-cover>h1{text-align:center;max-width:1000px}
.scene .active-model-name{margin-bottom:20px}
.scene .roadmap-strip{color:#aaa}
.scene .tabs{display:block}
.cover-mode .top-actions{right:28px}
@media(max-width:800px){.top-actions{flex-wrap:wrap}.top-actions .repo-button{max-width:100%}.scene{padding-top:150px}.scene-cover{padding-top:150px}.repo-number{width:84px}.assumptions{grid-template-columns:1fr}.assumption.full{grid-column:auto}.repo-select{min-width:0}.scene .model-layout{grid-template-columns:1fr}.repo-modal-close{right:12px;top:12px}}

/* Show the complete supplied screen recording without cropping. */
.photo-preset-recording{width:100%}
.photo-preset-recording video{display:block;width:100%;height:auto;max-height:78svh;object-fit:contain;background:#000}
.photo-preset-recording video::-webkit-media-controls-mute-button,.photo-preset-recording video::-webkit-media-controls-volume-slider{display:none}
.video-preset-recording{width:100%}
.video-preset-recording video{display:block;width:100%;height:auto;max-height:78svh;object-fit:contain;background:#000}
.video-preset-recording video::-webkit-media-controls-mute-button,.video-preset-recording video::-webkit-media-controls-volume-slider{display:none}

/* Actual marketplace stays in its own document; recordings stay uncropped. */
.scene-marketplace>h1{margin-bottom:24px}
.scene-marketplace .marketplace-intro{max-width:none;margin:0 0 28px}
.marketplace-shell{position:relative;min-width:0}
.marketplace-frame{display:block;width:100%;height:620px;border:0;background:#000}
body.marketplace-modal-open{overflow:hidden}
body.delivery-editor-open .top-actions,body.delivery-editor-open .partner-hint,body.delivery-editor-open .story-header{display:none!important}
/* Reserve space for presentation navigation outside the editor and its photo strip. */
body.delivery-editor-open{--editor-navigation-height:80px}
body.delivery-editor-open .partner-frame{bottom:var(--editor-navigation-height);height:calc(100% - var(--editor-navigation-height))}
body.delivery-editor-open .journey-nav{bottom:16px;right:24px}
.marketplace-frame.marketplace-modal-open{position:fixed;inset:0;z-index:500;width:100%;height:100dvh!important}
.training-recording{width:100%}
.training-recording video{display:block;width:100%;height:auto;max-height:78svh;object-fit:contain;background:#000}


/* Show every comparison result's complete frame, including on mobile. */
.scene-models .hero-media>img{height:auto;object-fit:contain}

@media(max-width:480px){.assumption.full .assumption-heading{grid-template-columns:minmax(0,1fr);gap:12px}.assumption.full .assumption-value{justify-self:start}.video-volume{gap:14px}}

/* Conversation layout adapted from the API page's AutomationDemoPanel.
   Native tabs/buttons/typography still come from the compiled frontend source. */
.scene-mcp>h1,.scene-twilight>h1{margin-bottom:28px}
.scene-mcp .tabs{margin:0 0 24px}
.agent-chat{display:flex;flex-direction:column;max-width:1100px;min-width:0;height:640px;height:clamp(440px,65svh,760px);margin:0 auto;overflow:hidden;border:1px solid #ffffff29;border-radius:32px;background:radial-gradient(ellipse at 90% 0%,#30d4f112,transparent 65%),#080e10;box-shadow:inset 0 1px 0 #ffffff0a;isolation:isolate}
.chat-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;min-height:78px;padding:16px 24px;border-bottom:1px solid #ffffff0d}
.chat-heading{display:flex;align-items:center;gap:12px;color:#ffffffe6;font-weight:500}
.chat-heading small{display:block;color:#ffffff66;font-size:11px;font-weight:400;margin-top:2px}
.chat-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.assistant-avatar{display:grid;place-items:center;width:32px;flex:0 0 32px;height:32px;margin-top:3px;border:1px solid #ffffff1a;border-radius:50%;background:#0006;color:var(--mint);font-size:18px}
.chat-transcript{flex:1;min-height:0;padding:24px;overflow:auto;overscroll-behavior-y:auto;scrollbar-width:thin;scrollbar-color:#ffffff2e transparent;line-height:1.6;color:#ffffffe6;overflow-wrap:anywhere}
.chat-transcript:focus-visible{outline:1px solid var(--mint);outline-offset:-5px;border-radius:20px}
.chat-message{display:flex;align-items:flex-start;gap:12px;margin:0 0 18px;max-width:90%;animation:chat-arrival .28s cubic-bezier(.22,1,.36,1) both}
.chat-message[data-role="user"]{margin-left:auto;max-width:85%;justify-content:flex-end}
.chat-bubble{min-width:0;border:1px solid #ffffff1a;border-radius:16px;padding:16px;background:#0003}
.chat-message[data-role="user"] .chat-bubble{background:#20383d73;border-color:#91cbd524;color:#e2edf0}
.chat-author{display:block;margin-bottom:6px;color:#ffffff66;font-size:11px}
.agent-chat .prompt-box{max-width:none;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:inherit}
.chat-bubble>p{margin:0}
.chat-arrival{animation:chat-arrival .28s cubic-bezier(.22,1,.36,1) both}
.chat-message[data-kind="tool"]{width:90%;margin-top:-6px}
.chat-message[data-kind="tool"]>.assistant-avatar{visibility:hidden}
.chat-tool{flex:1;min-width:0;padding:16px;border:1px solid #ffffff1a;border-radius:16px;background:#ffffff0a}
.tool-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:10px}
.tool-provider{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:#fffffff2}
.tool-provider img{width:16px;height:16px;object-fit:contain}
.tool-service-icon{display:grid;place-items:center;width:20px;height:20px;border-radius:5px;background:#ffffff14;color:#ffffffa6;font-size:11px}
.tool-operation{display:inline-flex;align-items:center;max-width:100%;padding:4px 10px;border:1px solid #ffffff1a;border-radius:999px;background:#ffffff0a;color:#fffffff2;font-size:12px}
.tool-details{font-size:12px;color:#ffffff80}
.tool-details summary{cursor:pointer;width:fit-content;padding:3px 0}
.tool-details summary:focus-visible{outline:1px solid var(--mint);outline-offset:3px}
.tool-input{margin:10px 0 0;padding:12px;background:#0003;border:1px solid #ffffff0d;border-radius:8px;white-space:pre-wrap;overflow-wrap:anywhere;color:#b6ced3;font-size:12px;line-height:1.6}
.tool-status{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:11px;border-top:1px solid #ffffff12;color:var(--mint);font-size:12px}
.tool-spinner{width:13px;flex:0 0 13px;height:13px;border:2px solid #ffffff1f;border-top-color:currentColor;border-right-color:currentColor;border-radius:50%;animation:chat-spin 1s linear infinite}
.chat-tool[data-state="complete"] .tool-status{color:#beefe6cc}
.tool-complete-icon{width:13px;flex:0 0 13px;height:13px;border-radius:50%;background:#94e4ce22;position:relative}
.tool-complete-icon:after{content:"";position:absolute;left:4px;top:2px;width:5px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg)}
.tool-result{margin:10px 0 0;color:#ffffffb3;font-size:13px;animation:chat-arrival .28s cubic-bezier(.22,1,.36,1) both}
.chat-typing{display:flex;align-items:center;gap:4px;min-height:22px;padding:0 3px}
.chat-typing i{display:block;width:5px;height:5px;background:#8fb7c0;border-radius:50%;animation:chat-dot 1.1s ease-in-out infinite}
.chat-typing i:nth-child(2){animation-delay:.15s}.chat-typing i:nth-child(3){animation-delay:.3s}
.chat-complete .chat-bubble{border-color:#80debc38;background:#21483933;color:#d4f3e9}
.chat-complete .assistant-avatar{color:#a4e6cf;border-color:#80debc38}
.chat-footer{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:12px 24px;min-height:46px;flex-shrink:0;border-top:1px solid #ffffff0d;color:#ffffff80;font-size:12px}
#chat-progress{white-space:nowrap;color:#8bb6c0;font-variant-numeric:tabular-nums}
.chat-progress-track{height:2px;flex:0 0 2px;background:#ffffff08}
#chat-progress-fill{height:100%;width:0;background:var(--mint);transition:width .3s ease}
.agent-chat[data-paused="true"] .tool-spinner,.agent-chat[data-paused="true"] .chat-typing i{animation-play-state:paused}
.agent-chat[data-paused="true"] #chat-status:before{content:"Paused · ";color:#d0e8ee}
@keyframes chat-arrival{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes chat-spin{to{transform:rotate(360deg)}}
@keyframes chat-dot{0%,65%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@media(max-width:800px){.agent-chat{border-radius:22px;height:600px;height:65svh;min-height:410px}.chat-header{padding:14px 16px}.chat-transcript{padding:18px 14px}.chat-message,.chat-message[data-kind="tool"]{max-width:100%;width:auto;gap:8px}.chat-message[data-role="user"]{max-width:92%}.chat-bubble,.chat-tool{padding:13px}.chat-footer{padding:12px 16px}.scene-mcp .tabs{overflow-x:auto}.scene-mcp .tabs>div{min-width:610px}}
@media(max-width:480px){.chat-header{flex-wrap:wrap;gap:10px}.chat-controls{margin-left:44px}.tool-heading{gap:8px}.tool-operation{font-size:11px}.chat-footer{align-items:flex-start;gap:8px}.chat-message[data-kind="tool"]>.assistant-avatar{display:none}.chat-message[data-kind="tool"]{margin-left:40px}}
@media(prefers-reduced-motion:reduce){.chat-message,.chat-arrival,.tool-result,.tool-spinner,.chat-typing i{animation:none!important}#chat-progress-fill{transition:none}}

/* Creator byline uses the native ModelCard typography and color utilities. */
#model-copy:has(.model-creator) .active-model-name{margin-bottom:8px}
.model-layout .model-creator{margin:0 0 20px}

/* Full mockup screenshot: natural aspect ratio and scrollable at short heights. */
.scene-image-mockup{display:flex;align-items:center;justify-content:center;padding-top:92px;padding-bottom:96px}
.image-mockup{margin:0;width:100%;min-width:0}
.image-mockup img{display:block;width:100%;height:auto;object-fit:contain}
@media(max-width:800px){.scene-image-mockup{padding:100px 12px 100px}}

/* Selected presentation: five results and a prominent annual profit. */
.scene.scene-economics-simplified .annual-number{color:#4ade80}
.scene.scene-economics-simplified .breakdown{display:block}
.scene.scene-economics-simplified .breakdown>div{flex-direction:row;align-items:baseline}
.scene.scene-economics-simplified .profit-note{width:100%;max-width:none;color:#fff;font-weight:600;margin:28px 0 0}

/* Unedited house inputs: one continuous page, with thumbnails loaded as they enter view. */
.input-gallery-count{color:#a0a0a0;margin:16px 0 32px}
.input-photo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 16px;padding-bottom:24px}
.input-photo{margin:0;min-width:0;content-visibility:auto;contain-intrinsic-size:auto 260px}
.input-photo img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;background:#080808;border:1px solid #ffffff14;border-radius:8px}
.input-photo figcaption{color:#888;margin-top:8px;font-size:12px;line-height:18px;overflow-wrap:anywhere}
@media(max-width:1100px){.input-photo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:800px){.input-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 12px}}
@media(max-width:420px){.input-photo-grid{grid-template-columns:minmax(0,1fr)}}
/* API audit layout; controls retain their imported frontend components. */
.api-section-picker{display:grid;gap:10px;margin-bottom:28px;padding-bottom:20px;border-bottom:1px solid #293033;min-width:0}.api-section-picker .repo-select{display:block;min-width:0}.api-section-picker p{margin:0;font-size:12px}.api-mock-status{color:#ebc47e!important;border-left:2px solid #ebc47e;padding-left:12px}.roadmap h3{margin-top:0;color:#ebc47e;text-transform:none}.api-mock-operation{background:#17150f;border-color:#534126}.api-mock-operation summary{cursor:pointer;overflow-wrap:anywhere}.api-mock-operation pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:11px}.api-mock-operation p{font-size:12px;margin-bottom:6px}.drawer-header>strong{min-width:0}.api-operation code{word-break:break-word}
