:root{--bg: #0d0b1a;--panel: #171429;--panel2: #1f1b38;--line: #2e2950;--text: #f1eeff;--muted: #9c95c4;--accent: #b45cff;--accent2: #2de1ff;--good: #3dff8a;--bad: #ff5c7a;--warn: #ffb02e;font-family:Segoe UI,system-ui,-apple-system,Roboto,Arial,sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;background:radial-gradient(1200px 700px at 80% -10%,#2a1457 0%,transparent 60%),radial-gradient(900px 600px at -10% 110%,#0b3550 0%,transparent 55%),var(--bg);color:var(--text);min-height:100%}button,input{font:inherit;color:inherit}.app{max-width:1280px;margin:0 auto;padding:18px 20px 30px}.top{display:flex;align-items:center;gap:24px;flex-wrap:wrap;margin-bottom:16px}.brand{font-size:24px;font-weight:700;letter-spacing:.2px;display:flex;align-items:center;gap:10px}.brand b{background:linear-gradient(90deg,var(--accent),var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}.logo{width:26px;height:26px;border-radius:50%;border:3px solid var(--accent);box-shadow:0 0 12px var(--accent),inset 0 0 8px var(--accent2);position:relative}.logo:after{content:"";position:absolute;left:6px;top:9px;width:8px;height:8px;border-radius:50%;background:var(--accent2)}.tag{margin:0;color:var(--muted);font-size:14px;flex:1;min-width:260px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:20px;align-items:start}.col{display:flex;flex-direction:column;gap:16px;min-width:0}.preview{position:sticky;top:14px}@media(max-width:960px){.layout{grid-template-columns:1fr}.preview{position:static;order:-1}}.card{background:linear-gradient(180deg,var(--panel),#131026);border:1px solid var(--line);border-radius:16px;padding:16px 18px;transition:border-color .15s,box-shadow .15s}.card.dragover{border-color:var(--accent2);box-shadow:0 0 0 3px #2de1ff33}.card-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;flex-wrap:wrap}h2{margin:0;font-size:17px;display:flex;align-items:center;gap:10px}.step{width:24px;height:24px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0d0b1a;display:inline-grid;place-items:center;font-size:13px;font-weight:800}.hint{color:var(--muted);font-size:13px;line-height:1.5;margin:4px 0 12px}.hint b{color:var(--text)}.muted{color:var(--muted);font-size:12px;font-weight:400}.lbl{display:block;font-size:12px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;color:var(--muted);margin:14px 0 6px}.btn{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:8px 14px;cursor:pointer;font-weight:600;transition:transform .08s,background .15s,border-color .15s}.btn:hover:not(:disabled){border-color:var(--accent);background:#28224a}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.small{padding:5px 10px;font-size:12.5px;border-radius:8px}.btn.wide{width:100%;margin-top:12px;padding:12px;font-size:15px}.btn.big{padding:13px 22px;font-size:16px;flex:1;border-radius:12px}.btn.primary{background:linear-gradient(135deg,#8a3dff,#2d9bff);border-color:transparent;color:#fff;box-shadow:0 6px 22px #7846ff59}.btn.primary:hover:not(:disabled){filter:brightness(1.1);background:linear-gradient(135deg,#9a55ff,#3aa6ff)}.btn.danger{border-color:var(--bad);color:#ffd0d8}.slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}@media(max-width:760px){.slots{grid-template-columns:repeat(2,minmax(0,1fr))}}.slot{position:relative;background:#100d20;border:1.5px dashed var(--line);border-radius:12px;padding:8px;min-height:176px;display:flex;flex-direction:column;gap:4px;transition:border-color .15s,background .15s}.slot.ok{border-style:solid;border-color:#3b3470}.slot.error{border-color:var(--bad)}.slot.over{border-color:var(--accent2);background:#12203a}.badge{position:absolute;top:6px;left:6px;z-index:2;width:24px;height:24px;border-radius:50%;background:var(--accent);color:#fff;font-size:12px;font-weight:800;display:grid;place-items:center;box-shadow:0 2px 8px #0006}.thumb{background:repeating-conic-gradient(#1b1736 0% 25%,#141126 0% 50%) 50% / 16px 16px;border:0;border-radius:8px;padding:0;height:92px;display:grid;place-items:center;cursor:pointer}.thumb{overflow:hidden;width:100%}.thumb img{max-width:84px;max-height:84px;width:auto;height:auto;object-fit:contain}.meta{font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.meta.dim{color:var(--muted);font-size:11px}.warn{font-size:10.5px;color:var(--warn);line-height:1.25}.acts{display:flex;gap:4px;margin-top:auto}.acts button{flex:1;background:var(--panel2);border:1px solid var(--line);border-radius:7px;padding:3px 0;cursor:pointer;font-size:13px}.acts button:hover:not(:disabled){border-color:var(--accent)}.acts button:disabled{opacity:.3;cursor:default}.empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:none;border:0;cursor:pointer;color:var(--muted);text-align:center;padding:6px;font-size:12px}.empty b{font-size:28px;color:var(--accent2);line-height:1;font-weight:400}.empty:hover b{color:#fff}.empty.err{color:#ffb3c0}.empty.err b{font-size:14px;color:var(--bad)}.empty.err span{font-size:11px;line-height:1.3}.empty.err em{font-size:11px;color:var(--muted)}.spin{width:22px;height:22px;border:3px solid var(--line);border-top-color:var(--accent2);border-radius:50%;animation:sp .7s linear infinite}@keyframes sp{to{transform:rotate(360deg)}}.validation{margin-top:10px;font-size:13px;color:var(--warn);font-weight:600}.validation.good{color:var(--good)}.notice{margin-top:10px;padding:9px 12px;border-radius:10px;background:#ff5c7a1f;border:1px solid rgba(255,92,122,.45);color:#ffd0d8;font-size:13px;line-height:1.4}.notice.soft{background:#ffb02e1a;border-color:#ffb02e66;color:#ffe2b0}.swatches{display:flex;gap:8px;flex-wrap:wrap}.sw{width:40px;height:40px;border-radius:10px;border:2px solid transparent;cursor:pointer;outline:1px solid var(--line)}.sw.on{border-color:#fff}.sw.img{background:var(--panel2);font-size:18px}.row{display:flex;align-items:center;gap:12px;margin-top:10px}.row.wrap{flex-wrap:wrap}.row.between{justify-content:space-between}.mini{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted)}.mini.grow,.mini.grow input{flex:1}input[type=color]{width:34px;height:26px;padding:0;border:1px solid var(--line);border-radius:6px;background:none;cursor:pointer}.chips{display:flex;gap:7px;flex-wrap:wrap}.chips.tight{gap:5px}.chip{background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:12.5px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}.chip.on{background:linear-gradient(135deg,#b45cff66,#2de1ff4d);border-color:var(--accent)}.chip:hover{border-color:var(--accent)}.colorchip input{width:22px;height:18px}.check{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer}.check input{accent-color:var(--accent);width:16px;height:16px}.text{width:100%;background:#100d20;border:1px solid var(--line);border-radius:10px;padding:9px 12px;outline:none}.text:focus{border-color:var(--accent2)}.slider{display:block;margin:10px 0}.sl-top{display:flex;justify-content:space-between;font-size:13px;margin-bottom:2px}.sl-top b{color:var(--accent2);font-weight:600}.rs{font-style:normal;font-size:10px;margin-left:6px;color:var(--warn);border:1px solid rgba(255,176,46,.5);border-radius:6px;padding:0 5px}input[type=range]{width:100%;accent-color:var(--accent);height:22px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px}@media(max-width:560px){.grid2{grid-template-columns:1fr}}.seg .lbl{margin:8px 0 5px}.segbtns{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}.segbtns button{flex:1;background:var(--panel2);border:0;border-right:1px solid var(--line);padding:7px 4px;font-size:12.5px;cursor:pointer}.segbtns button:last-child{border-right:0}.segbtns button.on{background:linear-gradient(135deg,#6f35c8,#2a7fc9);color:#fff;font-weight:600}.progress-wrap{margin-top:12px}.bar{height:10px;border-radius:6px;background:#100d20;border:1px solid var(--line);overflow:hidden;margin-bottom:8px}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .15s}.result{margin-top:14px;display:flex;gap:14px;align-items:flex-start;background:#100d20;border:1px solid var(--line);border-radius:12px;padding:10px}.result video{width:110px;border-radius:8px;background:#000;aspect-ratio:9 / 16}.result-info{display:flex;flex-direction:column;gap:6px;font-size:13px;align-items:flex-start;word-break:break-all}.result-info span{color:var(--muted)}.adv{margin-top:14px;font-size:13px}.adv summary{cursor:pointer;color:var(--muted)}.stage-wrap{display:grid;place-items:center}.phone{position:relative;width:100%;max-width:360px;aspect-ratio:9 / 16;border-radius:22px;overflow:hidden;border:2px solid var(--line);box-shadow:0 20px 60px #0000008c,0 0 0 6px #0a0816;background:#000}.phone canvas{width:100%;height:100%;display:block}.overlay{position:absolute;inset:auto 0 60px;text-align:center;pointer-events:none;padding:0 22px}.ov-title{font-size:22px;font-weight:800;text-shadow:0 2px 12px #000}.ov-sub{font-size:13px;color:#d6d0ff;text-shadow:0 1px 8px #000;margin-top:4px}.controls-bar{display:flex;gap:10px;margin:14px auto 0;max-width:360px;width:100%}.progress{max-width:360px;width:100%;margin:14px auto 0}.prog-head{display:flex;justify-content:space-between;align-items:center;font-size:14px}.pill{font-size:11.5px;padding:3px 10px;border-radius:999px;background:var(--panel2);border:1px solid var(--line)}.pill.running{color:var(--good);border-color:#3dff8a80}.pill.finale,.pill.done{color:var(--warn);border-color:#ffb02e99}.pill.full{color:var(--bad)}.prog-steps{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;margin:10px 0}.ps{position:relative;aspect-ratio:1;border-radius:50%;border:2px solid var(--line);background:#100d20;display:grid;place-items:center;font-size:12px;color:var(--muted)}.ps img{width:76%;height:76%;object-fit:contain;opacity:.35;filter:grayscale(1)}.ps.done{border-color:var(--accent2)}.ps.done img{opacity:1;filter:none}.ps.cur{border-color:#fff;box-shadow:0 0 12px var(--accent2)}.ps em{position:absolute;bottom:-7px;right:-4px;font-style:normal;font-size:10px;background:var(--panel2);border:1px solid var(--line);border-radius:8px;padding:0 5px;color:var(--text)}.stats{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;color:#cfc9f5;margin-top:8px}.foot{text-align:center;color:var(--muted);font-size:12px;margin-top:24px}.unlock-panel{margin-top:5px;padding:11px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%;border:1px solid rgba(170,91,255,.38);border-radius:10px;background:#7336be1a}.unlock-panel>b{color:#fff;font-size:13px}.unlock-panel>span,.unlock-note{color:var(--muted);font-size:12px;line-height:1.4;word-break:normal}.unlock-panel .btn{word-break:normal}.unlock-success{color:#78f0c0;font-weight:700;font-size:13px}@media(max-width:560px){.result{flex-direction:column}.result video{width:100%;max-height:320px;object-fit:contain}.result-info{width:100%}.unlock-panel{box-sizing:border-box}}.download-card{position:relative;isolation:isolate;overflow:hidden;margin-top:14px;padding:clamp(18px,3vw,28px);display:grid;grid-template-columns:116px minmax(0,1fr);gap:16px 20px;align-items:center;border:1px solid rgba(180,92,255,.48);border-radius:18px;background:radial-gradient(ellipse at 14% 0%,rgba(147,75,255,.22),transparent 55%),linear-gradient(145deg,#19132f,#100d20 72%);box-shadow:0 14px 42px #00000038,inset 0 1px #ffffff0a}.download-card.is-unlocked{border-color:#3dffaa80;background:radial-gradient(ellipse at 14% 0%,rgba(61,255,170,.13),transparent 55%),linear-gradient(145deg,#142a2b,#100d20 72%)}.download-art{width:116px;height:116px;position:relative;display:grid;place-items:center;border-radius:24px;background:linear-gradient(145deg,#b45cff2e,#2de1ff14);border:1px solid rgba(180,92,255,.3)}.download-art-glow{position:absolute;inset:18px;border-radius:50%;background:#a64cff;filter:blur(25px);opacity:.38}.download-file{z-index:1;width:60px;height:76px;border-radius:10px 10px 14px 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;background:linear-gradient(155deg,#a85aff,#387ef5);box-shadow:0 8px 24px #5b45ff66;transform:rotate(-5deg)}.download-file span{font-size:11px;font-weight:900;letter-spacing:1px;color:#fff}.download-file b{color:#fff;font-size:24px;line-height:1}.download-spark{position:absolute;color:#8ceeff;text-shadow:0 0 12px #8ceeff}.spark-one{top:13px;right:17px;font-size:20px}.spark-two{bottom:15px;left:15px;font-size:17px}.download-heading{min-width:0}.ready-kicker{display:inline-block;color:#9b83ff;font-size:10px;font-weight:800;letter-spacing:1.5px;margin-bottom:5px}.download-heading h3{margin:0;font-size:clamp(19px,2.4vw,25px);line-height:1.2;letter-spacing:-.35px}.download-heading p{margin:7px 0 0;color:var(--muted);font-size:13px;line-height:1.45}.download-meta{grid-column:1 / -1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:13px;border-radius:12px;background:#0706127a;border:1px solid rgba(255,255,255,.06)}.download-meta div{display:flex;flex-direction:column;gap:5px;min-width:0}.download-meta span{color:#8e87b4;font-size:9px;font-weight:800;letter-spacing:.9px}.download-meta b{font-size:12px;line-height:1.3;overflow-wrap:anywhere}.download-filename{grid-column:1 / -1;color:var(--muted);font-size:11px;overflow-wrap:anywhere;margin-top:-8px}.unlock-panel{grid-column:1 / -1;margin:0;padding:17px;display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:9px 12px;width:100%;border:1px solid rgba(170,91,255,.42);border-radius:14px;background:linear-gradient(120deg,#7336be2e,#2a1f523d)}.unlock-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#9c4dff,#367ff4);color:#fff;font-size:18px;font-weight:900;box-shadow:0 5px 18px #7846ff4d}.unlock-copy{display:flex;flex-direction:column;gap:4px;min-width:0}.unlock-copy b{color:#fff;font-size:15px}.unlock-copy span{color:#b8afd9;font-size:12px;line-height:1.45}.unlock-cta{grid-column:1 / -1;width:100%;min-height:54px;border-radius:12px;font-size:15px;font-weight:850;letter-spacing:.45px;box-shadow:0 8px 26px #7846ff59}.dev-reward{grid-column:1 / -1;justify-self:start}.unlock-note{grid-column:1 / -1}.unlocked-panel{border-color:#3dffaa61;background:#1e785a1f}.unlocked-panel .unlock-icon{background:linear-gradient(135deg,#22b77c,#16865b)}.download-card .unlock-success{display:none}button,.empty,.thumb,.acts button,.chip,.sw,.segbtns button{touch-action:manipulation}button:focus-visible,input:focus-visible{outline:2px solid var(--accent2);outline-offset:2px}@media(max-width:760px){.app{padding:14px 14px 24px}.top{gap:8px;margin-bottom:13px}.brand{font-size:22px}.tag{flex-basis:100%;min-width:0;font-size:13px;line-height:1.45}.layout{grid-template-columns:minmax(0,1fr);gap:14px}.preview{order:-1;position:static}.phone{width:min(100%,340px)}.controls-bar,.progress{max-width:440px}.card{padding:14px;border-radius:14px}.slots{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.slot{min-height:150px;padding:7px}.thumb{height:76px}.thumb img{max-width:70px;max-height:70px}.acts button{min-height:34px}.btn{min-height:42px}.btn.small{min-height:38px}.segbtns button{min-height:42px}.sw{width:42px;height:42px}.chip{min-height:38px}}@media(max-width:560px){.app{padding:10px 10px 20px}.card{padding:13px 12px}.card-head{align-items:flex-start}.card-head h2{font-size:16px}.card-head>.btn{margin-left:auto}.slots{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.slot{min-height:164px;padding:8px}.thumb{height:88px}.thumb img{max-width:82px;max-height:82px}.meta{font-size:11px}.acts button{min-height:38px;font-size:15px}.grid2{grid-template-columns:minmax(0,1fr);gap:4px}.segbtns button{padding:9px 5px;font-size:12px}.row{align-items:flex-start;flex-wrap:wrap;gap:9px}.row.between{align-items:center}.check{min-height:36px}.controls-bar{gap:8px;margin-top:10px}.btn.big{min-height:48px;padding:10px 8px;font-size:14px}.prog-head{font-size:12px}.prog-steps{gap:4px}.stats{gap:7px 10px;font-size:11px}.download-card{grid-template-columns:72px minmax(0,1fr);gap:12px;padding:15px 12px;border-radius:15px}.download-art{width:72px;height:82px;border-radius:17px}.download-file{width:43px;height:57px;border-radius:8px 8px 11px 11px;gap:5px}.download-file span{font-size:9px}.download-file b{font-size:18px}.spark-one{top:8px;right:8px;font-size:15px}.spark-two{bottom:8px;left:8px;font-size:13px}.ready-kicker{font-size:9px}.download-heading h3{font-size:18px}.download-heading p{font-size:11.5px;margin-top:5px}.download-meta{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;padding:11px}.download-meta span{font-size:8px}.download-meta b{font-size:11px}.download-filename{font-size:10px}.unlock-panel{padding:12px;grid-template-columns:36px minmax(0,1fr);gap:9px}.unlock-icon{width:36px;height:36px;border-radius:11px;font-size:16px}.unlock-copy b{font-size:13px}.unlock-copy span{font-size:11px}.unlock-cta{min-height:52px;font-size:13px}.foot{font-size:11px;line-height:1.5;padding:0 8px}}@media(max-width:360px){.app{padding-left:8px;padding-right:8px}.download-card{grid-template-columns:1fr}.download-art{width:100%;height:74px}.download-heading{text-align:center}.controls-bar{flex-direction:column}.btn.big{width:100%}}.compact-hint{margin:2px 0 10px;font-size:12px;line-height:1.4}.option-card{padding:0;overflow:hidden}.option-summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 18px;min-height:62px;user-select:none}.option-summary::-webkit-details-marker,.export-options summary::-webkit-details-marker{display:none}.option-summary:hover,.export-options summary:hover{background:#ffffff06}.summary-title{display:flex;align-items:center;gap:10px;min-width:0}.summary-title>span:last-child{display:flex;flex-direction:column;gap:2px}.summary-title b{font-size:15px}.summary-title small{color:var(--muted);font-size:11px;font-weight:400}.chevron{color:var(--muted);font-size:22px;transition:transform .18s ease}.option-card[open] .chevron{transform:rotate(180deg)}.option-content{border-top:1px solid rgba(255,255,255,.06);padding:15px 18px 18px}.subhead{font-size:13px;color:var(--muted);font-weight:600}.export-options{margin:10px 0 12px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:#0706123d;overflow:hidden}.export-options summary{cursor:pointer;list-style:none;padding:11px 13px;color:#ded8f8;font-size:12px;font-weight:650;user-select:none}.export-options summary:after{content:"+";float:right;color:var(--accent2);font-size:16px;line-height:12px}.export-options[open] summary:after{content:"−"}.export-options .grid2{padding:4px 12px 12px}@media(max-width:560px){.option-summary{padding:14px 13px;min-height:60px}.option-content{padding:13px 12px 15px}.summary-title small{font-size:10px}}