:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#113437;background:#f3f7f4;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:300px}.shell{min-height:100dvh;max-width:760px;margin:0 auto;background:#f8faf7;box-shadow:0 0 60px #073d4210}.topbar{height:76px;padding:14px 20px;display:flex;align-items:center;gap:11px;background:#fff;border-bottom:1px solid #e7eeeb}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:#073d42;color:#2de0c4;font-size:15px}.brand-copy{display:flex;flex-direction:column;gap:1px;flex:1}.brand-copy strong{font-size:15px}.brand-copy span{font-size:11px;color:#718885}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#d9f6ed;color:#11675b;font-size:14px;font-weight:800}main{padding:20px 18px 114px}.screen[hidden],.gate[hidden],.bottom-nav[hidden],.toast[hidden],.empty-card[hidden]{display:none}.eyebrow{font-size:10px;letter-spacing:.18em;font-weight:850;color:#138f7e}.hero{position:relative;overflow:hidden;min-height:330px;border-radius:24px;padding:28px 25px;background:linear-gradient(135deg,#063a3f 0%,#0a5c5c 80%);color:white}.hero h1{position:relative;z-index:1;font-size:clamp(31px,8vw,45px);line-height:1.05;letter-spacing:-.05em;margin:17px 0 13px}.hero h1 em{font-style:normal;color:#fff1b8}.hero p{position:relative;z-index:1;max-width:240px;font-size:13px;line-height:1.5;color:#d5e9e5;margin:0 0 20px}.primary-button{position:relative;z-index:1;appearance:none;border:0;border-radius:12px;background:#2de0c4;color:#063b3c;font-weight:800;font-size:14px;padding:13px 17px;cursor:pointer}.hero-art{position:absolute;width:220px;height:230px;right:-45px;bottom:-50px;transform:rotate(-12deg)}.frame{position:absolute;border:11px solid #c1f4e4;border-radius:24px;width:115px;height:184px;box-shadow:0 22px 30px #00232350}.frame-one{top:10px;left:25px;opacity:.45}.frame-two{top:31px;left:55px;border-color:#fff1b8;background:linear-gradient(160deg,#2de0c4,#0b6865)}.play-symbol{position:absolute;top:92px;left:102px;color:#fff1b8;font-size:35px}.section-head{display:flex;align-items:center;justify-content:space-between;margin:27px 2px 13px}.section-head h2{font-size:20px;letter-spacing:-.03em;margin:0}.section-head span{font-size:12px;color:#64817a;background:#e8f1eb;border-radius:20px;padding:3px 9px}.project-list{display:grid;gap:9px}.project-card{display:flex;align-items:center;gap:12px;width:100%;padding:15px;border:1px solid #e5ece7;background:white;border-radius:16px;text-align:left;cursor:pointer;color:inherit}.project-card:hover{border-color:#2de0c4}.project-icon{display:grid;place-items:center;flex:0 0 45px;height:45px;border-radius:12px;background:#e4f7ef;color:#097c70;font-size:22px}.project-details{display:flex;flex-direction:column;gap:4px;min-width:0;flex:1}.project-details strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}.project-details small{color:#7b918a;font-size:11px}.chevron{font-size:25px;color:#9cb6ae}.empty-card,.timeline-card{background:#fff;border:1px dashed #c7dbd1;border-radius:20px;text-align:center;padding:27px 22px;color:#496c65}.empty-icon,.timeline-icon{display:block;color:#13a58f;font-size:35px;margin-bottom:13px}.empty-card strong{display:block;color:#1a4644}.empty-card p,.timeline-card p{font-size:13px;line-height:1.55;margin:9px auto 0;max-width:330px}.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(760px,100%);height:calc(69px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:#fff;display:flex;border-top:1px solid #e7eeeb;box-shadow:0 -7px 30px #073d4209}.bottom-nav button{flex:1;border:0;background:transparent;color:#80958c;font-size:11px;font-weight:750;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer}.bottom-nav button span{font-size:22px;line-height:1}.bottom-nav button.active{color:#087b6e}.back-button{background:none;border:0;padding:0;color:#308678;font-weight:700;font-size:13px;margin-bottom:28px;cursor:pointer}.page-heading{font-size:31px;line-height:1.12;letter-spacing:-.045em;margin:11px 0 25px;overflow-wrap:anywhere}.panel{background:#fff;border:1px solid #e4ece7;border-radius:18px;padding:19px;margin-bottom:16px}.panel label{font-size:12px;font-weight:750;color:#587a70}.field-row{display:flex;gap:7px;margin-top:9px}.field-row input{min-width:0;flex:1;border:1px solid #d6e4dd;border-radius:10px;padding:12px;font:inherit;font-size:14px;color:#183b38}.field-row button{border:0;border-radius:10px;background:#073d42;color:#fff;font-weight:750;padding:0 14px;cursor:pointer}.hint{font-size:12px;color:#218875;min-height:1em;margin:9px 0 0}.timeline-card{margin-top:24px;padding:30px 20px}.timeline-card h2{font-size:17px;margin:0;color:#194a46}.coming-soon{display:inline-block;margin-top:22px;background:#e8f6f0;color:#07816e;border-radius:20px;padding:8px 11px;font-size:10px;letter-spacing:.07em;font-weight:800}.danger-button{display:block;margin:30px auto 0;background:none;border:0;color:#b65353;font-size:13px;font-weight:700;cursor:pointer}.setting-panel{display:flex;align-items:center;gap:20px}.setting-panel>div{flex:1}.setting-panel strong{font-size:15px}.setting-panel p{font-size:12px;line-height:1.5;color:#698078;margin:6px 0 0}.switch{position:relative;width:46px;height:27px;flex:0 0 46px}.switch input{opacity:0;position:absolute}.switch span{display:block;background:#cbdad2;width:46px;height:27px;border-radius:20px;transition:background .2s}.switch span:after{content:"";display:block;position:absolute;width:21px;height:21px;top:3px;left:3px;border-radius:50%;background:white;box-shadow:0 1px 4px #0002;transition:transform .2s}.switch input:checked+span{background:#0db59b}.switch input:checked+span:after{transform:translateX(19px)}.privacy-note{display:flex;gap:9px;padding:16px;color:#637e74;font-size:12px;line-height:1.5}.gate{padding:68px 25px;text-align:center}.gate-icon{font-size:45px;color:#0da98f}.gate h1{font-size:26px;letter-spacing:-.04em}.gate p{color:#648078;font-size:14px;line-height:1.5}.gate .error-text{color:#a84e4e;font-size:12px}.toast{position:fixed;bottom:calc(83px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);max-width:min(90%,400px);padding:11px 16px;border-radius:11px;background:#073d42;color:#fff;font-size:13px;box-shadow:0 5px 20px #063b3c33;z-index:5}@media(min-width:600px){main{padding:25px 30px 110px}.hero{min-height:350px}.hero-art{right:30px;bottom:-40px;transform:rotate(-10deg) scale(1.25)}}

/* Project source videos */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.media-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}.media-heading h2{margin:7px 0 0;font-size:21px;letter-spacing:-.03em}.count-pill{padding:4px 10px;border-radius:16px;background:#e8f5ee;color:#0b7f70;font-size:12px;font-weight:800}.media-help{font-size:13px;line-height:1.5;color:#58766e;margin:13px 0 17px}.upload-picker{display:inline-block;cursor:pointer}.media-limit{font-size:11px;color:#799087;line-height:1.4;margin:11px 0 18px}.media-list{display:grid;gap:9px}.media-item{display:flex;align-items:center;gap:10px;padding:12px;background:#f7faf8;border:1px solid #e4ece7;border-radius:12px;min-width:0}.media-item-info{flex:1;min-width:0}.media-item-info strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.media-item-info small{display:block;margin-top:4px;font-size:11px;color:#69847a}.media-actions{display:flex;gap:3px;flex-wrap:wrap;justify-content:flex-end}.media-actions button,.upload-progress button{border:0;background:#e6f3ee;color:#126a5d;border-radius:8px;padding:7px 9px;font-size:13px;font-weight:750;cursor:pointer}.media-actions button:disabled{opacity:.35;cursor:default}.media-actions .remove{color:#a44747;background:#f9eaea}.media-empty{font-size:13px;color:#789089;text-align:center;padding:20px 0}.ready-button{display:block;width:100%;padding:13px;margin-top:18px;background:#073d42;color:white;border:0;border-radius:12px;font-weight:800;font-size:14px;cursor:pointer}.ready-button:disabled{background:#d6e2dd;color:#81958c;cursor:default}.upload-progress{margin:8px 0 16px;padding:12px;background:#ecf8f3;border-radius:12px;font-size:12px}.upload-progress[hidden]{display:none}.upload-progress strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.progress-track{height:7px;background:#d1e7de;border-radius:8px;overflow:hidden;margin:9px 0 6px}.progress-track>div{height:100%;width:0;background:#12b99f;transition:width .15s}.upload-progress button{margin-left:10px}.media-panel .hint{margin-bottom:0}
@media(max-width:520px){.hero-art{display:none}.hero p{max-width:300px}.hero{min-height:0}.media-item{align-items:flex-start}.media-actions{max-width:115px}}

/* Source thumbnails and inline playback */
.media-item{display:block}
.media-main{display:flex;align-items:center;gap:10px;min-width:0}
.media-preview{position:relative;flex:0 0 88px;width:88px;height:72px;overflow:hidden;padding:0;border:0;border-radius:9px;background:#123e3d;color:#fff;cursor:pointer}
.media-preview img{display:block;width:100%;height:100%;object-fit:cover}
.media-preview:after{content:"▶";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#052e32b8;font-size:11px}
.media-play-button{display:inline-block;margin-top:7px;padding:0;border:0;background:none;color:#078675;font-size:12px;font-weight:800;cursor:pointer;text-align:left}
.media-player{display:block;width:100%;max-height:70vh;margin-top:12px;border-radius:9px;background:#07191b}
@media(max-width:520px){.media-main{align-items:flex-start;flex-wrap:wrap}.media-item-info{min-width:calc(100% - 100px)}.media-actions{width:100%;max-width:none;justify-content:flex-end}.media-preview{height:82px}}

/* Automatic render stage */
.render-panel[hidden],#render-job[hidden],#render-preview[hidden],#render-cancel[hidden],#render-download[hidden]{display:none}
.render-panel h2{font-size:21px;margin:9px 0}
.render-panel>p{font-size:13px;color:#58766e;line-height:1.5}
.render-panel .primary-button{margin:8px 0}
.render-panel .primary-button:disabled{opacity:.5;cursor:default}
.render-next{margin-top:12px}
#render-job{border-top:1px solid #e4ece7;margin-top:16px;padding-top:16px}
#render-job strong{display:block;font-size:15px}
#render-stage{font-size:13px;color:#58766e;margin:8px 0}
.render-cancel{border:0;background:#f9eaea;color:#a44747;border-radius:9px;padding:9px 12px;font-weight:750;cursor:pointer}
#render-preview{width:100%;max-height:65vh;margin-top:12px;background:#07191b;border-radius:9px}
