:root{--bg:#f7f5ef;--card:#eee8dc;--surface:#e6ded0;--ink:#171714;--muted:#716e66;--line:#ddd6ca;--orange:#c96f50;--orange-dark:#a94f34;--green:#2c7442;--red:#9c3e43;--blue:#315f8b;--radius:15px}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;background:var(--bg);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}.hidden{display:none!important}.topbar{position:sticky;top:0;z-index:30;height:58px;display:flex;align-items:center;gap:12px;padding:0 26px;background:rgba(247,245,239,.94);border-bottom:1px solid var(--line);backdrop-filter:blur(15px)}.back{padding:7px 9px;border-radius:8px;color:var(--muted);font-size:13px;font-weight:700}.back:hover{background:var(--surface);color:var(--ink)}.bar-line{width:1px;height:18px;background:var(--line)}.bar-title{font-family:"Bricolage Grotesque",sans-serif;font-size:15px;font-weight:800}.stage-badge{margin-left:auto;display:flex;align-items:center;gap:7px;padding:6px 11px;border:1px solid rgba(46,116,66,.2);background:rgba(46,116,66,.08);color:var(--green);border-radius:99px;font-size:10px;font-weight:800;letter-spacing:.4px}.stage-badge span{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(46,116,66,.1)}.page{max-width:1220px;margin:0 auto;padding:44px 24px 80px}.hero{display:grid;grid-template-columns:1.25fr .75fr;align-items:end;gap:36px;margin-bottom:30px}.eyebrow{margin-bottom:13px;color:var(--orange);font-size:11px;font-weight:800;letter-spacing:1.1px}h1{font-family:"Bricolage Grotesque",sans-serif;font-size:clamp(38px,5vw,68px);line-height:.98;letter-spacing:-1.7px}h1 em{color:var(--orange);font-style:normal}.lead{max-width:700px;margin-top:18px;color:var(--muted);font-size:15px;font-weight:500;line-height:1.75}.hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.hero-metrics div{padding:16px 10px;border-right:1px solid var(--line)}.hero-metrics div:last-child{border-right:0}.hero-metrics strong,.hero-metrics span{display:block}.hero-metrics strong{font-family:"Bricolage Grotesque",sans-serif;font-size:19px}.hero-metrics span{margin-top:5px;color:var(--muted);font-size:10px;font-weight:700}.workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,.82fr);gap:18px;align-items:stretch}.editor-panel,.result-panel{min-height:600px;padding:25px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius)}.result-panel{background:#1c1c19;color:#f8f5ee;overflow:hidden}.panel-heading{display:flex;align-items:start;justify-content:space-between;gap:20px;margin-bottom:20px}.panel-heading>div{display:flex;align-items:center;gap:10px}.panel-heading h2{font-family:"Bricolage Grotesque",sans-serif;font-size:20px}.panel-heading p{max-width:330px;color:var(--muted);font-size:11px;line-height:1.5;text-align:right}.step-no{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--orange);color:#fff;font-size:11px;font-weight:900}.result-panel .step-no{background:#f3eee5;color:#222}.result-badge{padding:5px 9px;border:1px solid #4c4b46;border-radius:99px;color:#aaa79f;font-size:10px;font-weight:800}.result-badge.running{border-color:rgba(201,111,80,.6);color:#e79a7d}.result-badge.done{border-color:rgba(87,167,108,.55);color:#77c38a}.result-badge.error{border-color:rgba(202,86,93,.5);color:#e8898e}.upload-box{position:relative;display:flex;align-items:center;gap:14px;min-height:94px;margin-top:12px;padding:17px;border:1px dashed #bdb4a5;border-radius:12px;background:rgba(255,255,255,.25);cursor:pointer;transition:.18s ease}.upload-box:hover,.upload-box.dragging{border-color:var(--orange);background:rgba(201,111,80,.07);transform:translateY(-1px)}.upload-box input{position:absolute;width:1px;height:1px;opacity:0}.upload-icon{display:grid;place-items:center;flex:0 0 46px;height:46px;border-radius:12px;background:var(--orange);color:#fff;font-size:22px;font-weight:500}.grid-icon{background:var(--surface);color:var(--orange)}.upload-copy{min-width:0;flex:1}.upload-copy strong,.upload-copy small{display:block}.upload-copy strong{font-size:13px}.upload-copy small{margin-top:6px;color:var(--muted);font-size:11px}.upload-action{padding:7px 10px;border:1px solid var(--line);border-radius:8px;background:rgba(255,255,255,.42);color:var(--muted);font-size:10px;font-weight:800}.file-summary,.material-files{margin:8px 2px 15px;padding:10px 12px;border-radius:9px;background:rgba(255,255,255,.42);font-size:11px}.file-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 0}.file-row strong{max-width:72%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-row span{color:var(--muted)}.material-files{max-height:126px;overflow:auto}.material-head{display:flex;justify-content:space-between;padding-bottom:7px;margin-bottom:4px;border-bottom:1px solid var(--line);font-weight:800}.material-head span:last-child{color:var(--orange)}.audio-option{display:flex;align-items:center;gap:12px;margin:18px 1px 13px;cursor:pointer}.audio-option input{position:absolute;opacity:0}.switch{position:relative;width:38px;height:22px;border-radius:20px;background:#c9c1b4;transition:.2s}.switch:after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s}.audio-option input:checked+.switch{background:var(--green)}.audio-option input:checked+.switch:after{transform:translateX(16px)}.audio-option strong,.audio-option small{display:block}.audio-option strong{font-size:12px}.audio-option small{margin-top:3px;color:var(--muted);font-size:10px}.privacy-note{display:flex;gap:8px;align-items:start;padding:10px;border-radius:8px;background:rgba(49,95,139,.08);color:var(--muted);font-size:10px;line-height:1.5}.privacy-note span{display:grid;place-items:center;flex:0 0 17px;height:17px;border-radius:50%;background:var(--blue);color:#fff;font-weight:800}.start-button{display:flex;align-items:center;justify-content:space-between;width:100%;height:50px;margin-top:17px;padding:0 18px;border:0;border-radius:10px;background:var(--orange);color:#fff;font:800 13px Inter,sans-serif;cursor:pointer;transition:.18s}.start-button:hover{background:var(--orange-dark);transform:translateY(-1px)}.start-button:disabled{opacity:.55;cursor:wait;transform:none}.start-button b{font-size:20px}.empty-state,.progress-state,.error-state{min-height:480px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.timeline-ghost{display:flex;flex-wrap:wrap;align-content:center;gap:6px;width:210px;height:120px;margin-bottom:25px;padding:14px;border:1px solid #343430;border-radius:13px;background:#20201d}.timeline-ghost i{width:var(--w);height:30px;border-radius:5px;background:linear-gradient(135deg,#383832,#292925)}.empty-state strong{font-family:"Bricolage Grotesque",sans-serif;font-size:18px}.empty-state p,.progress-state p,.error-state p{max-width:320px;margin-top:9px;color:#96948d;font-size:11px;line-height:1.6}.progress-orbit{display:grid;place-items:center;width:124px;height:124px;margin-bottom:26px;border:1px solid #4b4942;border-radius:50%;background:radial-gradient(circle,rgba(201,111,80,.16),transparent 64%);box-shadow:0 0 0 12px #22221f,0 0 0 13px #30302c}.progress-orbit span{font-family:"Bricolage Grotesque",sans-serif;font-size:28px;font-weight:800;color:#ef9c7c}.progress-state h3,.error-state h3{font-size:15px}.progress-track{width:min(340px,90%);height:5px;margin-top:25px;border-radius:8px;background:#33332e;overflow:hidden}.progress-track i{display:block;width:0;height:100%;border-radius:8px;background:var(--orange);transition:width .4s ease}.progress-meta{display:flex;justify-content:space-between;width:min(340px,90%);margin-top:9px;color:#77756f;font-size:9px}.done-state{padding-top:7px}.done-state video{display:block;width:100%;max-height:405px;border-radius:11px;background:#0b0b0a;object-fit:contain}.done-summary{display:grid;grid-template-columns:repeat(3,1fr);margin:13px 0;border:1px solid #363631;border-radius:9px}.done-summary div{padding:10px;text-align:center;border-right:1px solid #363631}.done-summary div:last-child{border-right:0}.done-summary strong,.done-summary span{display:block}.done-summary strong{font-size:14px}.done-summary span{margin-top:3px;color:#8e8b83;font-size:9px}.download-actions{display:grid;grid-template-columns:1.3fr 1fr;gap:8px}.download-actions a{display:grid;place-items:center;min-height:42px;border-radius:8px;font-size:10px;font-weight:800}.download-primary{background:var(--orange);color:#fff}.download-secondary{border:1px solid #484741;color:#d0cdc5}.new-task{width:100%;margin-top:8px;padding:9px;border:0;background:transparent;color:#7d7b74;font:700 10px Inter;cursor:pointer}.error-icon{display:grid;place-items:center;width:62px;height:62px;margin-bottom:20px;border:1px solid rgba(232,137,142,.35);border-radius:50%;background:rgba(156,62,67,.18);color:#e8898e;font-size:25px;font-weight:800}.error-state button{margin-top:20px;padding:10px 18px;border:1px solid #4d4b45;border-radius:8px;background:#292925;color:#ddd9d0;cursor:pointer}.how-it-works{margin-top:58px;padding-top:28px;border-top:1px solid var(--line)}.section-title span{color:var(--orange);font-size:10px;font-weight:800;letter-spacing:1px}.section-title h2{margin-top:7px;font-family:"Bricolage Grotesque",sans-serif;font-size:27px}.flow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px}.flow-grid article{display:flex;gap:12px;min-height:145px;padding:17px;border:1px solid var(--line);border-radius:11px;background:var(--card)}.flow-grid b{color:var(--orange);font-size:10px}.flow-grid h3{font-size:13px}.flow-grid p{margin-top:8px;color:var(--muted);font-size:10px;line-height:1.65}.scope-note{margin-top:12px;color:var(--muted);font-size:10px;text-align:right}@media(max-width:940px){.hero{grid-template-columns:1fr}.workspace{grid-template-columns:1fr}.result-panel{min-height:540px}.flow-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.topbar{padding:0 13px}.stage-badge{display:none}.page{padding:28px 13px 55px}.hero-metrics{grid-template-columns:1fr 1fr}.hero-metrics div:last-child{display:none}.editor-panel,.result-panel{padding:17px}.panel-heading p{display:none}.upload-action{display:none}.flow-grid{grid-template-columns:1fr}.download-actions{grid-template-columns:1fr}.workspace{gap:11px}}
