:root {color-scheme:dark;--bg:#161419;--panel:#34233f;--panel2:#291d34;--ink:#fff7fd;--sub:#cebbd5;--secondary:#b6a2bd;--border:#785b83;--gold:#ffbf76;--green:#36c9af;}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{margin:0;background:radial-gradient(ellipse at 88% 2%,#2c1d31 0%,#161419 42%,#151317 80%);color:var(--ink);font:14px/1.5 -apple-system,BlinkMacSystemFont,'PingFang SC','Helvetica Neue',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit}button{cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--gold);outline-offset:2px}button:disabled{opacity:.43;cursor:not-allowed}
.studio{max-width:1390px;min-width:0;padding:clamp(14px,2.4vw,30px) clamp(14px,3.4vw,44px) calc(20px + env(safe-area-inset-bottom,0px));margin:0 auto}
.masthead{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand-icon{width:42px;height:42px;flex:none;display:grid;place-items:center;font-size:24px;color:#382237;border-radius:12px;background:linear-gradient(135deg,#ffe6b8,#eda048);box-shadow:inset 0 1px 0 #fff8,0 3px 15px #b975373b}.brand-text h1{font-size:20px;letter-spacing:-.3px;margin:0;font-weight:800;line-height:1.35}.brand-text h1 em{font-style:normal;color:var(--gold)}.brand-text p{font-size:12px;color:#bca9c5;margin:4px 0 0}
.toolbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.status-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid #594465;border-radius:9px;background:#2b2034;color:#dbcae2;padding:9px 11px;font-size:12px;white-space:nowrap;min-height:39px}.online-dot{width:7px;height:7px;background:#34c9a9;border-radius:50%}.btn{display:inline-flex;justify-content:center;align-items:center;gap:5px;min-height:43px;border:1px solid #886d90;background:#4d3956;color:#fff2fb;border-radius:9px;padding:9px 13px;font-size:13px;font-weight:750;transition:transform .17s ease,box-shadow .22s ease,filter .22s ease;white-space:nowrap}.btn.primary{background:linear-gradient(120deg,#ffd39a,#f2a045);border-color:#ffc981;color:#392638;box-shadow:inset 0 1px 0 #fff5,0 4px 15px #ed993235}.btn:active{transform:scale(.97)}.btn.smaller{min-height:36px;padding:7px 10px;font-size:12px}.btn:not(:disabled):hover{filter:brightness(1.045)}
.stepper{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;margin:15px 0 12px}.stepper button{border:0;background:none;display:flex;align-items:center;flex-direction:column;gap:6px;color:#b9a3c2;text-align:center;font-size:12px;min-width:0;min-height:60px;padding:0;position:relative}.stepper button:not(:last-child):after{position:absolute;content:'';top:15px;height:1px;left:calc(50% + 24px);width:calc(100% - 44px);background:#6b516f;pointer-events:none}.step-circle{width:31px;height:31px;border:1px solid #80668b;border-radius:50%;background:#4b3859;color:#e7d5ee;display:grid;place-items:center;font-size:13px;font-weight:750;font-variant-numeric:tabular-nums}.stepper button[aria-current=step] .step-circle{background:var(--gold);border-color:#ffe0b2;color:#3d2637;box-shadow:0 0 0 4px #ffb3651c;animation:halo 2.7s ease-in-out infinite}.stepper button.is-done .step-circle{background:var(--green);border-color:var(--green);color:#143e34}
.progress-rail{width:100%;height:6px;overflow:hidden;border-radius:99px;background:#3b313d;margin-bottom:16px}.progress-rail i{display:block;height:100%;width:0;background:linear-gradient(90deg,#2dc8ae,#ffbd77);border-radius:99px;transition:width .24s ease}
.stage-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:436px;gap:13px;align-items:stretch}.stage{height:436px;min-width:0;min-height:0;display:flex;flex-direction:column;overflow:hidden;gap:10px;border:1px solid #745a7e;border-radius:16px;padding:14px;background:linear-gradient(145deg,#37283e,#2a1f34);transition:border-color .2s ease,box-shadow .2s ease}.stage.selected{border-color:var(--gold);box-shadow:inset 0 0 0 1px #aa7648,0 0 17px #ffae4c24}.stage.running{animation:cardglow 2.4s ease-in-out infinite}.stage-heading{display:flex;align-items:center;gap:8px;min-height:29px;flex:none}.stage-number{flex:none;width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:#695475;color:#f7eafa;font-size:12px;font-weight:800}.stage.done .stage-number{background:var(--green);color:#0c382d}.stage-heading h2{flex:1;min-width:0;font-size:16px;font-weight:750;margin:0;letter-spacing:-.15px}.stage-status{font-size:11px;color:#cebad6;white-space:nowrap}.stage.done .stage-status{color:#a6f4df}.stage-body{flex:1;min-height:0;min-width:0;display:flex;flex-direction:column;gap:10px;overflow:hidden}.stage-action{width:100%;flex:none;height:45px}.tiny-note{color:var(--secondary);font-size:11px;line-height:1.55;overflow-wrap:anywhere}.input-set label{display:block;font-size:12px;color:#e1cde4;margin-bottom:6px}.input-set input:not([type=file]),.input-set textarea,.input-set select{display:block;width:100%;min-width:0;outline-offset:2px;border:1px solid #866a8f;background:#211829;color:#f9f0fd;border-radius:8px;padding:10px 11px;font-size:16px;min-height:42px}.input-set input::placeholder{color:#a790b1}.input-set textarea{font-size:14px;min-height:142px;height:142px;resize:none;line-height:1.7}.input-set select{padding:9px 10px}.native-file{display:block;font-size:12px;color:#d2c0d8;max-width:100%;min-width:0;width:100%}.native-file::file-selector-button{padding:8px 10px;background:#4d3857;color:#ffeafb;border:1px solid #94729c;border-radius:7px;margin-right:8px;cursor:pointer}.inline-line{display:flex;gap:8px;align-items:center;min-height:36px}.source-preview{width:100%;min-height:108px;padding:9px;display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #72587d;border-radius:10px;background:#241a30;color:#fff;flex:none}.source-poster{width:68px;height:98px;object-fit:cover;border-radius:6px;flex:none}.source-copy{display:flex;flex-direction:column;gap:8px;min-width:0}.source-copy strong{font-size:14px;color:var(--gold)}.source-copy span{font-size:12px;color:#d0bad8}.source-copy small{font-size:11px;color:#d9beba}
.shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.shot{min-width:0;border:1px solid #795f81;border-radius:9px;padding:6px;background:#2d2036;color:#f1e0f5;font-size:11px}.shot.selected{border-color:#ffb764;box-shadow:inset 0 0 0 1px #c17c39}.shot img{display:block;width:100%;height:142px;object-fit:cover;border-radius:6px;margin-bottom:6px}.story-panel{background:#23192e;border:1px solid #715578;border-radius:10px;padding:13px;min-height:124px}.story-time{color:#ffc177;font-size:13px;font-weight:780;margin-bottom:7px;letter-spacing:.25px;font-variant-numeric:tabular-nums}.story-panel p{font-size:13px;color:#f1dff3;line-height:1.7;margin:0}
.choice-group{display:flex;gap:6px;flex-wrap:wrap}.choice{min-height:37px;border:1px solid #866a8b;border-radius:7px;padding:8px 11px;background:#46324e;color:#dfcbeb;font-size:12px}.choice.active{border-color:#ffc078;color:#ffe1b2;background:#68464a}.sound-meter{display:flex;align-items:center;gap:4px;height:35px;margin-top:auto}.sound-meter i{display:block;width:3px;height:6px;background:#f5b06b;border-radius:3px}.sound-meter span{margin-left:7px;font-size:12px;color:#dac4e3}.stage.running .sound-meter i{animation:wave .68s ease-in-out infinite alternate}.sound-meter i:nth-child(2),.sound-meter i:nth-child(5){animation-delay:.17s}.sound-meter i:nth-child(3),.sound-meter i:nth-child(7){animation-delay:.34s}
.actor-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.actor{min-width:0;background:#2a2033;border:1px solid #7a6083;border-radius:9px;color:#efdcf1;padding:5px;font-size:10px;text-align:center}.actor.selected{border:2px solid #ffb867;box-shadow:0 0 12px #e99d4948;padding:4px}.actor img{display:block;width:100%;height:153px;object-fit:cover;object-position:center top;border-radius:6px;margin-bottom:6px}.actor span{display:block;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.chosen-row{display:flex;justify-content:space-between;gap:12px;align-items:center;background:#251b30;border:1px solid #685371;border-radius:9px;padding:9px 11px;font-size:12px;color:#ccbad3}.chosen-row strong{color:var(--gold);font-size:13px}
.generating-preview{position:relative;min-height:140px;display:flex;gap:12px;align-items:center;background:#241a30;border:1px solid #715878;border-radius:10px;padding:9px;overflow:hidden}.generating-preview img{width:80px;height:122px;object-fit:cover;border-radius:7px;flex:none}.generation-text{display:flex;flex-direction:column;gap:8px;min-width:0}.generation-text b{font-size:14px;color:var(--gold)}.generation-text small{font-size:11px;color:#d5c0dd}.scanline{display:none;pointer-events:none;position:absolute;left:0;right:0;top:0;height:23%;background:linear-gradient(transparent,rgba(255,209,129,.4),transparent)}.stage.running .scanline{display:block;animation:scan 1.7s linear infinite}.two-inputs{display:grid;grid-template-columns:1fr 1fr;gap:9px}.generation-progress{margin-top:auto}.generation-progress>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px;font-size:12px;color:#d7c4e0}.generation-progress b{color:var(--gold);font-size:13px;font-variant-numeric:tabular-nums}.striped-meter{height:9px;background:#1b1521;overflow:hidden;border-radius:99px}.striped-meter i{height:100%;width:0;display:block;border-radius:99px;background:repeating-linear-gradient(110deg,#f1a047 0 14px,#ffd097 14px 28px);background-size:56px 100%;transition:width .12s linear}.stage.running .striped-meter i{animation:stripes 1.3s linear infinite}
.finished-panel{height:243px;position:relative;display:flex;justify-content:center;align-items:center;background:#17131b;border:1px solid #695276;border-radius:10px;overflow:hidden}.finished-panel>img{height:100%;width:100%;object-fit:cover;object-position:center 42%}.finished-panel video{height:100%;width:100%;object-fit:contain;background:#17131b}.waiting-overlay{position:absolute;inset:0;background:rgba(16,13,22,.26);display:grid;place-items:center}.waiting-overlay span{width:48px;height:48px;border:1px solid #ffd4a1;border-radius:50%;background:#261e29ac;display:grid;place-items:center;color:#fff;font-size:23px}.output-meta{display:flex;justify-content:space-between;align-items:start;gap:9px}.output-meta div{min-width:0}.output-meta strong{display:block;color:#fff3f8;font-size:13px}.output-meta span{display:block;font-size:11px;color:#d3badc;margin-top:4px}.output-meta small{font-size:11px;color:#e8cda9;white-space:nowrap}
.footnote{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;color:#ad9cb6;font-size:12px;margin-top:15px}.text-button{background:none;border:0;color:#dbc0db;font-size:12px;min-height:40px;padding:7px 0}.video-modal{padding:10px;width:min(92vw,500px);max-height:91vh;border:1px solid #684c78;border-radius:15px;background:#221927;color:white;box-shadow:0 16px 90px #0009}.video-modal::backdrop{background:rgba(0,0,0,.78)}.video-modal video{max-height:78vh;width:100%;display:block;object-fit:contain}.modal-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:5px 8px 10px}.modal-toolbar button{background:none;border:0;color:#ffca8d;font-size:14px;min-height:37px}.toast{position:fixed;left:50%;bottom:calc(25px + env(safe-area-inset-bottom,0px));z-index:10;transform:translateX(-50%);max-width:min(92vw,450px);min-width:0;padding:10px 15px;background:#f7f2fa;color:#34293c;border-radius:12px;box-shadow:0 6px 30px #0005;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s}.toast.show{opacity:1}
@keyframes halo{50%{box-shadow:0 0 0 9px #ffb36510}}@keyframes cardglow{50%{box-shadow:inset 0 0 0 1px #ce9957,0 0 25px #ffb66b43}}@keyframes scan{to{top:110%}}@keyframes stripes{to{background-position:56px 0}}@keyframes wave{to{height:24px}}
@media(max-width:1030px){.stage-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:436px}.stage{height:436px}.masthead{margin-bottom:13px}}
@media(max-width:640px){.studio{padding-left:12px;padding-right:12px}.stage-grid{grid-template-columns:minmax(0,1fr);grid-auto-rows:436px;gap:11px}.stage{height:436px}.stepper{grid-template-columns:repeat(6,minmax(66px,1fr));overflow-x:auto;scrollbar-width:thin}.brand-text h1{font-size:17px}.toolbar{width:100%}.toolbar .btn{flex:1}.toolbar .status-chip{display:none}.stage-heading h2{font-size:15px}}
@media(hover:hover) and (pointer:fine){.shot:hover,.actor:hover{border-color:#f3b47b}.stage-action:hover{box-shadow:0 5px 17px #ffb76a22}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

[hidden]{display:none!important}
/* Keep the original director desk; additions support real tasks below it. */
.notice{color:#a6f4df;font-size:13px}.error{color:#ffc0c4;font-size:13px;overflow-wrap:anywhere}.login-panel{max-width:430px;height:auto;margin:8vh auto;gap:8px}.login-panel h2{font-size:20px;margin:0}.login-panel form{display:grid;gap:16px}.source-placeholder{width:68px;height:98px;flex:none;display:grid;place-items:center;border:1px dashed #785b83;border-radius:6px;color:#b6a2bd}.stage-body>p{margin:0}.shot:disabled{opacity:1;cursor:default}.shot:not(:has(img:not([hidden]))){height:177px;display:grid;place-items:center;color:#b6a2bd;border-style:dashed}.story-panel{overflow:auto}.story-panel p{white-space:pre-wrap;overflow-wrap:anywhere}.choice-group span.choice{display:inline-flex;align-items:center}.person-preview{height:173px;display:flex;justify-content:center;align-items:center;background:#241a30;border:1px solid #715878;border-radius:10px;overflow:hidden;flex:none;padding:6px}.person-preview img{height:100%;max-width:100%;object-fit:contain;border-radius:6px}.person-preview p{padding:14px;text-align:center;margin:0}.chosen-row strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.locked-field{border:1px solid #866a8f;background:#211829;color:#f9f0fd;border-radius:8px;padding:9px 10px;min-height:42px;font-size:14px}.generation-text small{overflow-wrap:anywhere}.generating-preview{min-height:140px}.generation-text{max-height:130px;overflow:auto}.finished-panel p{padding:20px;text-align:center}.output-actions{display:flex;gap:8px;flex:none}.output-actions .btn{flex:1;height:45px}.submission-messages p{margin:12px 0 0}.detail-modal{width:min(92vw,740px)}.detail-modal>img{display:block;max-height:72vh;max-width:100%;margin:0 auto;object-fit:contain}.detail-modal>p{white-space:pre-wrap;overflow-wrap:anywhere;padding:12px;margin:0;max-height:72vh;overflow:auto}.tasks-panel{margin-top:28px;padding-top:24px;border-top:1px solid #745a7e}.tasks-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:14px}.tasks-heading h2{font-size:18px;margin:0}.filters{display:flex;gap:8px;margin-bottom:14px}.filters button{border:1px solid #785b83;border-radius:7px;min-height:44px;background:#241a30;color:#cebbd5;padding:8px 14px}.filters button[aria-pressed=true]{color:#ffe1b2;border-color:#ffbf76;background:#513849}.jobs-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.job{border:1px solid #745a7e;border-radius:12px;background:#291d34;padding:16px;min-width:0}.job.selected-job,.job.linked-job{border-color:#ffbf76}.job-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px}.job-title{font-size:14px;margin:0;overflow-wrap:anywhere}.job-status{font-size:12px;color:#ffbf76;flex:none}.job[data-status=completed] .job-status{color:#a6f4df}.job[data-status=failed] .job-status,.job[data-status=failed] .job-message{color:#ffc0c4}.job-time,.queue-note{font-size:11px;color:#cebbd5;margin:5px 0 10px}.job-message{font-size:13px;margin:0 0 12px;white-space:pre-wrap;overflow-wrap:anywhere}.job-open{min-height:40px}.empty{border:1px dashed #785b83;padding:20px;border-radius:10px}.worker-online{color:#a6f4df}.stage:focus-visible{outline:2px solid #ffbf76;outline-offset:3px}
@media(max-width:640px){.toolbar #new-job{flex:none}.toolbar #logout{flex:none;padding:8px}.jobs-list{grid-template-columns:1fr}.output-actions .btn{font-size:12px;padding-left:8px;padding-right:8px}}
.person-preview{height:153px}.input-set #photo-help{margin:6px 0 0}

.actor-placeholder{height:153px;display:grid;place-items:center;color:var(--secondary);margin-bottom:6px}.actor:disabled{opacity:1;cursor:default}.stage.running .striped-meter.waiting i{width:35%;animation:waiting 1.7s linear infinite}@keyframes waiting{from{transform:translateX(-110%)}to{transform:translateX(400%)}}

/* Taller source media and scrollable detail panels preserve all content on narrow screens. */
.stage-grid{grid-auto-rows:minmax(560px,auto)}.stage{height:560px}.stage-body{overflow:auto}.source-preview{flex-direction:column;align-items:stretch;gap:9px}.source-enlarge{position:relative;width:100%;border:0;padding:0;background:#17131b;border-radius:6px;overflow:hidden;flex:none}.source-poster{display:block;width:100%;height:280px;object-fit:contain}.source-enlarge span{position:absolute;bottom:7px;right:7px;background:#17131be8;color:#fff;padding:3px 7px;font-size:11px;border-radius:4px}.source-copy{gap:4px}.source-placeholder{width:100%;height:100px}.source-preview:has(.source-enlarge:not([hidden]))+.input-set{margin-top:0}.segment-picker{display:flex;flex-wrap:wrap;gap:6px;max-height:110px;overflow:auto;flex:none;padding:2px 0 5px}.segment-picker button{flex:0 0 calc(50% - 3px);min-width:0;min-height:44px;border:1px solid #866a8f;background:#211829;color:#f9f0fd;border-radius:7px;padding:7px 10px;font-size:12px}.segment-picker button[aria-pressed=true]{background:#68464a;border-color:#ffc078;color:#ffe1b2}.shots{flex:none}.shot img{height:84px;object-fit:contain}.shot:not(:has(img:not([hidden]))){height:115px}.story-panel{flex:1;min-height:140px}.generation-text{max-height:none;overflow:visible;flex:none;gap:6px}.generation-text b{font-size:18px}.generation-text p{font-size:14px;margin:0;line-height:1.65;overflow-wrap:anywhere;white-space:pre-wrap}.generation-text small{font-size:13px}.segment-progress{list-style:none;padding:0;margin:0;overflow:auto;min-height:90px;max-height:190px;flex:1;border-top:1px solid #715878}.segment-progress li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid #594465;font-size:12px}.segment-progress strong{font-weight:500;color:#cebbd5}.segment-progress .complete strong{color:#a6f4df}.generation-reference{display:flex;gap:9px;align-items:center;font-size:11px;color:#cebbd5;margin-top:auto;flex:none}.generation-reference img{width:32px;height:42px;object-fit:contain;border-radius:4px}.render-spec{font-size:12px;color:#cebbd5;margin:0}.generation-progress{margin-top:0;flex:none}#stage-2 #script{height:260px}#stage-0 .inline-line:has(#recognize-url:disabled){display:none}.stage-status{max-width:45%;overflow:hidden;text-overflow:ellipsis}
@media(max-width:640px){.stage-grid{grid-auto-rows:auto}.stage{height:auto;min-height:450px}.stage-body{overflow:visible}.source-poster{height:300px}.story-panel{max-height:250px}.segment-progress{flex:auto;max-height:240px}.generation-reference{margin-top:10px}#stage-2 #script{height:230px}}

/* iPad preview: equal cards fit the available browser height. */
@media(min-width:1000px) and (min-height:700px){
.studio{padding:14px 24px 24px;max-width:1440px}
.masthead{margin-bottom:8px}.brand-text p{margin-top:2px}
.stepper{margin:6px 0}.stepper button{min-height:54px;gap:4px}
.progress-rail{margin-bottom:10px;height:4px}
.stage-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(0,1fr);height:calc(100dvh - 170px);min-height:530px;gap:10px}
.stage{height:auto;padding:10px;gap:7px;border-radius:12px}
.stage-body{gap:7px}.stage-heading h2{font-size:15px}.stage-action,.output-actions .btn{height:44px;min-height:44px;padding:6px 10px}
.source-preview{padding:6px;gap:5px;flex:1;min-height:0}.source-enlarge{flex:1;min-height:100px}.source-poster{height:100%;position:absolute;inset:0}.source-copy{gap:1px}.source-copy strong{font-size:12px}.source-copy span,.source-copy small{font-size:11px}
.segment-picker{flex-wrap:nowrap;max-height:none;padding:0;gap:5px}.segment-picker button{flex:1 0 72px;padding:5px;font-size:11px}
.shot{padding:3px}.shot img{height:52px;margin-bottom:2px}.shot:not(:has(img:not([hidden]))){height:74px}
.story-panel{min-height:65px;padding:8px}.story-panel p{font-size:12px;line-height:1.55}.story-time{font-size:12px;margin-bottom:4px}
#stage-2 .stage-body>.input-set:first-child{flex:1;min-height:80px;display:flex;flex-direction:column}#stage-2 #script{height:auto;min-height:60px;flex:1;font-size:12px;line-height:1.55;padding:8px}
.choice{min-height:30px;padding:4px 8px}.sound-meter{height:22px;flex:none}.sound-meter span{font-size:11px}
.actor-grid{flex:1;min-height:80px}.actor{display:flex;flex-direction:column}.actor img,.actor-placeholder{height:0;min-height:0;flex:1;width:100%;object-fit:contain}.chosen-row{padding:6px 9px}
.generation-text{gap:3px}.generation-text b{font-size:16px}.generation-text p{font-size:12px;line-height:1.5}.generation-text small{font-size:12px}.segment-progress{min-height:45px}.segment-progress li{padding:5px 0}.generation-reference{margin-top:0}.generation-reference img{height:26px}.generation-progress>div:first-child{margin-bottom:3px}
.finished-panel{flex:1;min-height:90px;height:auto}.finished-panel>img{object-fit:contain}.output-meta span{margin-top:1px}
.footnote{margin-top:8px;min-height:32px;font-size:11px}.footnote .text-button{min-height:32px;padding:4px 0}.tasks-panel{margin-top:24px}
}

html{touch-action:pan-x pan-y}button,a,input,textarea{touch-action:manipulation}

.job{cursor:pointer}.job:focus-within{outline:2px solid var(--gold);outline-offset:2px}
@media(hover:hover){.job:hover{border-color:var(--gold)}}

#stage-4 .generation-progress{padding:10px 12px;border:1px solid #896c92;border-radius:12px;background:#1d1728}
#stage-4 .generation-progress>div:first-child{margin-bottom:7px;min-height:25px}
#stage-4 #render-percent{font-size:23px;line-height:1;font-variant-numeric:tabular-nums;color:#ffe0af}
#stage-4 .striped-meter{height:24px;position:relative;border:1px solid #76517e;background:#110d19;box-shadow:inset 0 2px 7px #0008}
#stage-4 .striped-meter i{position:relative;background:repeating-linear-gradient(115deg,#ffbc70 0 16px,#ffdf9d 16px 30px,#e494f0 30px 44px);background-size:88px 100%;box-shadow:0 0 16px #ffc37688;transition:width .6s ease}
#stage-4.running{border-color:#ffbf76;animation:render-glow 2.6s ease-in-out infinite}
#stage-4.running .striped-meter:not(.waiting) i{animation:render-flow 2s linear infinite}
#stage-4.running .striped-meter:not(.waiting) i:after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,#fff9 50%,transparent 80%);transform:translateX(-100%);animation:render-sheen 2.8s ease-in-out infinite}
#stage-4.running .striped-meter.waiting i{background:linear-gradient(90deg,transparent,#e494f0,#ffdf9d,transparent);width:38%;animation:waiting 2s linear infinite}
@keyframes render-flow{to{background-position:88px 0}}
@keyframes render-sheen{to{transform:translateX(100%)}}
@keyframes render-glow{0%,100%{box-shadow:inset 0 0 0 1px #b78354,0 0 9px #ffb76525}50%{box-shadow:inset 0 0 0 1px #ffe0ad,0 0 22px #e494f050}}
@media(prefers-reduced-motion:reduce){#stage-4.running .striped-meter.waiting i{transform:none;margin:auto}}