.job-gallery{margin:20px 0 38px}.job-gallery-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.job-gallery-head h2{font-size:22px;margin:8px 0}.job-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px}.generation-card{overflow:hidden;border:1px solid #294638;border-radius:18px;background:#102319}.job-media{position:relative;min-height:260px;background:linear-gradient(135deg,#192b21,#0c1712);display:grid;place-items:center}.job-media img,.job-media video{width:100%;max-height:550px;object-fit:contain;display:block}.job-badge{position:absolute;left:16px;top:16px;border-radius:30px;padding:9px 14px;color:#d8fbe8;background:#102019ed;border:1px solid #345741;font-size:12px}.is-generating{color:#baff7b}.job-placeholder{padding:70px 30px;text-align:center;color:#abc5b5}.job-details{padding:18px;display:flex;flex-wrap:wrap;gap:12px}.job-details b,.job-details small{width:100%}.job-details small{color:#a3b8ab;font-size:11px}.job-error{color:#efc09d;font-size:13px;overflow-wrap:anywhere}.job-spinner{display:inline-block;width:20px;height:20px;border:2px solid #456b51;border-top-color:#baff7b;border-radius:50%;animation:job-spin 1s linear infinite}@keyframes job-spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.job-spinner{animation:none}}@media(max-width:600px){.job-grid{grid-template-columns:1fr}.job-gallery-head{align-items:flex-start}.job-gallery-head h2{font-size:18px}}

/* Studio: controls on the left, generated media on the right. */
.content:has(.studio-history)>.page-heading{margin-bottom:20px}.content:has(.studio-history)>.page-heading h1{font-size:27px;margin-bottom:6px}.studio:has(.studio-history),.video-workspace:has(.studio-history){display:grid;grid-template-columns:310px minmax(0,1fr);gap:20px;align-items:start}.studio-history{margin:0!important;min-width:0;border:1px solid var(--edge);border-radius:18px;padding:18px;min-height:calc(100vh - 270px);max-height:calc(100vh - 230px);overflow-y:auto}.studio-history .job-gallery-head{position:sticky;top:-18px;background:var(--bg);z-index:2;padding:12px 0;margin-top:-10px}.studio-history .job-gallery-head h2{font-size:18px}.studio-history .job-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}.studio-history .job-media{min-height:200px;aspect-ratio:1/1}.studio-history .job-media img,.studio-history .job-media video{height:100%;max-height:380px;object-fit:contain}.studio-history .job-details{padding:12px}.studio-history .job-details b{font-size:12px}.studio:has(.studio-history)>.form-panel{padding:18px;position:sticky;top:15px}.studio:has(.studio-history) textarea{min-height:130px}.studio-history .eyebrow{display:none}@media(min-width:1500px){.studio-history .job-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:1000px){.studio:has(.studio-history),.video-workspace:has(.studio-history){grid-template-columns:270px minmax(0,1fr)}.studio-history .job-grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}}@media(max-width:760px){.studio:has(.studio-history),.video-workspace:has(.studio-history){grid-template-columns:1fr}.studio:has(.studio-history)>.form-panel{position:static}.studio-history{max-height:none;min-height:220px}.studio-history .job-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}}

/* One viewport workspace: independent full-height controls and result history. */
@media(min-width:761px){
 body:has(.studio-history){overflow:hidden}
 .layout:has(.studio-history){height:100dvh;min-height:0}
 .main:has(.studio-history){height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden}
 .main:has(.studio-history)>.topbar{height:66px;min-height:66px;flex:0 0 66px;padding:8px 18px}
 .content:has(.studio-history){flex:1;min-height:0;max-width:none;width:100%;margin:0;padding:12px 16px 16px;display:flex;flex-direction:column;overflow:hidden;animation:none}
 .content:has(.studio-history)>.preview-note{flex:none;margin:0 0 10px;padding:0 0 10px;font-size:9px}
 .content:has(.studio-history)>.page-heading,.content:has(.studio-history)>.footer{display:none}
 .studio:has(.studio-history),.video-workspace:has(.studio-history){flex:1;min-height:0;grid-template-columns:320px minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:16px;align-items:stretch;overflow:hidden}
 .studio:has(.studio-history)>.form-panel,.video-workspace:has(.studio-history)>.video-console{grid-column:1!important;grid-row:1!important;position:relative;top:auto;min-height:0;height:100%;max-height:none;min-width:0;max-width:none;width:100%;margin:0;padding:14px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;border-radius:16px}
 .studio:has(.studio-history)>.studio-history,.video-workspace:has(.studio-history)>.studio-history{grid-column:2!important;grid-row:1!important;position:relative;height:100%;min-height:0;max-height:none;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;border-radius:16px;padding:16px}
 .studio-history .job-gallery-head{top:-16px;padding:12px 0;margin-top:-12px}
 .studio-history .job-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
 .studio-history .job-media{height:auto;min-height:0;aspect-ratio:1/1}
 .studio-history .job-media img,.studio-history .job-media video{max-height:none;max-width:100%;width:100%;height:100%;object-fit:contain}
 .video-console .frame-pair{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .video-console .frame-slot,.video-console .frame-slot label{min-height:155px}
 .video-console .frame-slot img{height:155px;object-fit:contain}
 .video-console .frame-clear{top:7px;right:7px;bottom:auto;height:30px;width:30px;font-size:21px}
}
@media(min-width:761px) and (max-width:1350px){.studio:has(.studio-history),.video-workspace:has(.studio-history){grid-template-columns:290px minmax(0,1fr)}.studio-history .job-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.reference-upload{position:relative;border:1px dashed #49624f;border-radius:14px;background:#0c1912;overflow:hidden;margin-bottom:8px}
.reference-upload>label{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:200px;cursor:pointer;margin:0!important;padding:15px;text-align:center;overflow:hidden}
.reference-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0;z-index:1}
.reference-upload img{display:block;width:100%;height:195px;object-fit:contain;border-radius:8px;max-width:100%}
.reference-upload.has-reference>label{padding:7px;min-height:220px}
.reference-plus{display:grid;place-items:center;border:1px solid #426048;border-radius:50%;height:45px;width:45px;font-size:28px;color:#9df5c6}
.reference-upload strong{font-size:13px}.reference-upload small{font-size:10px;color:#a4b7a8}
.reference-file-name{display:block;font-size:10px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#b5cbbb}
.reference-remove{position:absolute;top:9px;right:9px;z-index:3;background:#102019ed;border:1px solid #7c9b87;border-radius:50%;height:32px;width:32px;font-size:24px;line-height:24px;color:white;box-shadow:0 2px 9px #0009}
.reference-upload-note{font-size:10px;color:#a4b7a8;margin:7px 0 17px;line-height:1.45}.reference-upload:focus-within{outline:2px solid #91efba;outline-offset:2px}
@media(max-width:760px){.video-workspace:has(.studio-history)>.video-console,.video-workspace:has(.studio-history)>.studio-history{grid-column:1!important;grid-row:auto!important}.video-workspace:has(.studio-history)>.video-console{order:0}.video-workspace:has(.studio-history)>.studio-history{order:1}.studio-history{height:auto;max-height:none;min-height:320px}}

@media(min-width:761px){.studio-history .job-media{overflow:hidden}.studio-history .job-media img,.studio-history .job-media video{position:absolute;inset:0}}

/* Card actions and playback belong to Lumora, rather than the browser menu. */
.job-media{isolation:isolate;background:#1b1f1e}.media-actions{position:absolute;right:12px;top:12px;z-index:6;display:flex;flex-direction:column;gap:5px;opacity:0;transition:opacity .15s}.generation-card:hover .media-actions,.generation-card:focus-within .media-actions{opacity:1}.media-icon{display:grid;place-items:center;width:34px;height:34px;padding:0!important;min-height:0!important;background:#101514d9!important;color:#f3f8f5!important;border:1px solid #ffffff12!important;border-radius:50%!important;cursor:pointer;box-shadow:0 2px 8px #0002}.media-icon:hover{background:#33483d!important}.media-icon[aria-pressed=true]{color:#9df5c6!important}.media-icon[aria-pressed=true] svg{fill:#9df5c633}.media-icon:focus-visible,.media-menu-panel button:focus-visible{outline:2px solid #9df5c6;outline-offset:2px}.media-menu summary{list-style:none}.media-menu summary::-webkit-details-marker{display:none}.media-menu-panel{position:absolute;right:43px;top:0;min-width:200px;padding:8px;background:#1b201f;color:#eef4f0;border:1px solid #ffffff16;border-radius:13px;box-shadow:0 12px 40px #0008}.media-menu-panel button{display:flex;align-items:center;gap:12px;width:100%;padding:11px 12px;background:none;border:0;border-radius:7px;color:inherit;text-align:left;font:inherit;font-size:13px;cursor:pointer}.media-menu-panel button:hover{background:#ffffff0c}.media-menu-panel button:last-child{border-top:1px solid #ffffff20;border-radius:0;margin-top:5px;padding-top:14px}.media-menu[open]{z-index:10}.generation-card:has(.media-menu[open]){position:relative;z-index:5}.job-media>.media-icon[data-media-action=play]{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:3;width:48px;height:48px;background:#10151485!important;border:1px solid #ffffff40!important}.generation-card[data-playing=true] .job-media>.media-icon[data-media-action=play]{opacity:0}.generation-card[data-playing=true]:hover .job-media>.media-icon[data-media-action=play]{opacity:1}.media-player{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;gap:7px;padding:28px 10px 10px;background:linear-gradient(transparent,#000c);z-index:4;opacity:0;transition:opacity .15s}.generation-card:hover .media-player,.generation-card:focus-within .media-player{opacity:1}.media-player .media-icon{width:28px;height:28px;flex:none;background:transparent!important;border:0!important;box-shadow:none}.media-time{font:10px monospace;color:white;white-space:nowrap}.media-seek{flex:1;width:20px;min-width:20px;padding:0!important;height:4px!important;accent-color:#9df5c6;cursor:pointer}.job-media:fullscreen{width:100vw;height:100dvh;aspect-ratio:auto!important;background:#080a09}.job-media:fullscreen video,.job-media:fullscreen img{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:contain}.job-media:fullscreen .media-actions,.job-media:fullscreen .media-player{opacity:1}.job-badge{pointer-events:none}.generation-card:has(.media-actions) .job-details>a{display:none}.generation-card:has(.media-actions) .job-details>small:last-child{display:none}
@media(hover:none){.media-actions,.media-player{opacity:1}}
