:root{font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:#1d2433;background:#f7f8fa;--orange:#ff5b22;--line:#e7e9ee}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;background:linear-gradient(180deg,#fff 0,#f7f8fa 420px);-webkit-font-smoothing:antialiased}.topbar{height:72px;padding:0 max(24px,calc((100vw - 1180px)/2));display:flex;align-items:center;justify-content:space-between;background:#ffffffed;border-bottom:1px solid #eceef2;backdrop-filter:blur(18px);position:sticky;top:0;z-index:20}.brand{display:flex;align-items:center;gap:11px;color:inherit;text-decoration:none}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:linear-gradient(145deg,#ff7a32,#f24513);color:#fff;font-size:21px;font-weight:900;box-shadow:0 7px 16px #ff642938}.brand>span:last-child{display:grid;line-height:1.1}.brand b{font-size:16px}.brand small{font-size:10px;color:#9298a3;margin-top:4px}.top-actions,.api-state{display:flex;align-items:center}.top-actions{gap:22px}.api-state{font-size:12px;color:#6f7681;gap:7px}.api-state i{width:7px;height:7px;border-radius:50%;background:#f5a524}.api-state.ready i{background:#26b36a}.api-state.offline i{background:#f04444}.help{font-size:13px;color:#555d69;text-decoration:none}.shell{width:min(1180px,calc(100% - 40px));margin:auto;padding:54px 0}.hero{min-height:210px;display:flex;align-items:center;justify-content:space-between;gap:40px}.eyebrow{display:flex;align-items:center;gap:9px;color:var(--orange);font-weight:750;font-size:11px;letter-spacing:.16em}.eyebrow i{width:20px;height:2px;background:var(--orange)}h1{font-size:clamp(38px,5vw,64px);line-height:1.08;letter-spacing:-.045em;margin:17px 0 16px;color:#171b24}h1 em{font-style:normal;color:var(--orange)}.hero p{max-width:580px;margin:0;color:#707784;font-size:15px;line-height:1.8}.formats{display:flex;align-items:center;gap:22px;background:#fff;border:1px solid var(--line);box-shadow:0 14px 45px #252b3910;border-radius:20px;padding:20px 25px}.formats>div{display:grid;grid-template-columns:34px auto;column-gap:11px;align-items:center}.formats b,.formats small{grid-column:2}.formats b{font-size:13px}.formats small{font-size:10px;color:#999faa;margin-top:2px}.ratio{grid-row:1/3;display:block;border:2px solid #272d38;border-radius:4px;background:linear-gradient(145deg,#ff7540,#ffb76d)}.portrait{width:26px;height:34px}.landscape{width:36px;height:27px}.plus{color:#b0b5bd}.workspace{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;box-shadow:0 14px 45px #252b3909}.card-title{display:flex;align-items:center;gap:13px;margin-bottom:23px}.card-title>span{width:34px;height:34px;border-radius:10px;background:#fff2ec;color:var(--orange);display:grid;place-items:center;font-weight:850;font-size:12px}.card-title h2{font-size:17px;margin:0}.card-title p{font-size:11px;color:#969ca6;margin:4px 0 0}.drop{height:285px;border:1.5px dashed #d5d9e0;border-radius:16px;display:grid;place-items:center;position:relative;overflow:hidden;background:linear-gradient(135deg,#fafbfc,#f7f8fa);cursor:pointer;transition:.2s}.drop:hover,.drop.dragging{border-color:var(--orange);background:#fff8f4}.drop input{display:none}.drop>img{width:100%;height:100%;object-fit:contain;background:#171a20}.upload-content{display:grid;place-items:center;text-align:center}.upload-icon{width:52px;height:52px;border-radius:15px;background:#fff0e8;display:grid;place-items:center;color:var(--orange);margin-bottom:13px}.upload-icon svg,.primary svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.upload-icon svg{width:24px}.upload-content b{font-size:14px}.upload-content small{font-size:11px;color:#9aa0aa;margin-top:7px}.replace{position:absolute;right:12px;bottom:12px;border:0;border-radius:9px;padding:8px 12px;background:#ffffffed;color:#333;font-size:12px;box-shadow:0 4px 15px #0002;cursor:pointer}.field{border:0;padding:0;margin:23px 0 0}.field-head{display:flex;justify-content:space-between}.field label,.field legend{font-size:13px;font-weight:700}.field-head span{font-size:10px;color:#a1a6af}.field textarea{width:100%;margin-top:9px;border:1px solid #dfe2e7;border-radius:12px;padding:13px 14px;min-height:75px;resize:none;font:inherit;font-size:14px;line-height:1.55;outline:none;background:#fcfcfd}.field textarea:focus{border-color:#ff8056;box-shadow:0 0 0 3px #ff6a3013;background:#fff}.field-tip{font-size:10px;color:#a1a6af;margin:7px 2px 0}.styles legend{margin-bottom:10px}.style-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.style-grid label{cursor:pointer}.style-grid input{position:absolute;opacity:0}.style-grid label>span{display:grid;grid-template-columns:30px auto;grid-template-rows:auto auto;column-gap:9px;padding:10px;border:1px solid #e4e6eb;border-radius:11px}.style-grid i{grid-row:1/3;width:30px;height:30px;border-radius:8px;background:#f2f3f5;color:#767d88;display:grid;place-items:center;font-style:normal;font-size:11px}.style-grid b{font-size:11px}.style-grid small{font-size:9px;color:#a1a6af;margin-top:2px}.style-grid input:checked+span{border-color:#ff7a4a;background:#fff8f5;box-shadow:inset 0 0 0 1px #ff7a4a}.style-grid input:checked+span i{background:#ffebe3;color:var(--orange)}.primary{width:100%;height:49px;border:0;border-radius:12px;background:linear-gradient(100deg,#ff6c31,#f04412);color:#fff;font-size:14px;font-weight:800;margin-top:23px;display:flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 10px 22px #f3592630;cursor:pointer}.primary:hover{transform:translateY(-1px)}.primary:disabled{opacity:.6;cursor:wait}.primary svg{width:18px;stroke-width:2}.message{margin:10px 0 0;min-height:16px;text-align:center;font-size:11px;color:#848b96}.output-card{min-height:615px}.empty{min-height:475px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.empty-visual{width:150px;height:130px;position:relative;margin-bottom:15px}.sheet{position:absolute;border:1px solid #e1e4e9;background:#f4f5f7;border-radius:11px}.sheet.back{width:92px;height:113px;left:19px;top:5px;transform:rotate(-8deg)}.sheet.front{width:98px;height:116px;left:42px;top:11px;box-shadow:0 12px 28px #28304213;background:linear-gradient(150deg,#fafafa,#e9ebee)}.sheet.front i{display:block;width:50px;height:28px;border-radius:5px;background:linear-gradient(135deg,#ffd6c4,#ff8b59);margin:20px auto}.empty-visual>b{position:absolute;right:0;bottom:0;width:44px;height:44px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 7px 23px #252b3920}.empty h3{font-size:15px;margin:0 0 8px}.empty p,.working p{font-size:11px;line-height:1.7;color:#9aa0aa;margin:0}.working{padding:28px 2px 20px}.status-line{display:flex;justify-content:space-between;font-size:12px}.status-line b{color:var(--orange)}.progress{height:7px;background:#f0f1f3;border-radius:10px;overflow:hidden;margin:11px 0}.progress i{display:block;width:0;height:100%;background:linear-gradient(90deg,#ff8b57,#f04412);border-radius:10px;transition:width .45s}.covers{display:grid;grid-template-columns:1fr 1fr;gap:13px}.cover{border:1px solid #e7e9ed;border-radius:13px;padding:8px;background:#fafbfc;min-width:0}.cover img{display:block;width:100%;height:300px;object-fit:contain;background:#111;border-radius:8px}.cover-info{display:flex;align-items:center;justify-content:space-between;padding:10px 3px 2px}.cover-info span{display:grid}.cover-info b{font-size:11px}.cover-info small{font-size:9px;color:#9aa0aa}.cover-info a{color:var(--orange);text-decoration:none;background:#fff0e9;border-radius:7px;padding:7px 9px;font-size:10px;font-weight:700}.secondary{width:100%;height:42px;border:1px solid #e2e4e8;background:#fff;border-radius:10px;margin-top:15px;font-weight:700;cursor:pointer}.tips{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:22px}.tips>div{display:flex;align-items:center;gap:13px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px}.tips>div>span{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;background:#fff1eb;color:var(--orange);font-weight:800}.tips p{display:grid;margin:0}.tips b{font-size:11px}.tips small{font-size:9px;color:#999faa;margin-top:4px}footer{text-align:center;color:#a3a8b1;font-size:10px;padding:8px 20px 35px}
@media(max-width:800px){.topbar{height:62px;padding:0 16px}.brand small,.help,.api-state>span{display:none}.shell{width:min(100% - 24px,600px);padding:28px 0}.hero{display:block;min-height:auto;text-align:center;padding:15px 0 30px}.eyebrow{justify-content:center}.hero h1{font-size:39px;margin-top:14px}.hero p{font-size:13px}.formats{margin:24px auto 0;width:max-content;max-width:100%;padding:14px 18px;border-radius:15px;gap:15px}.workspace{grid-template-columns:1fr}.card{border-radius:18px;padding:18px}.drop{height:230px}.output-card{min-height:420px}.empty{min-height:310px}.tips{grid-template-columns:1fr;gap:8px}.tips>div{padding:12px 14px}.cover img{height:230px}}
@media(max-width:430px){.shell{width:100%;padding:20px 12px}.hero h1{font-size:34px}.hero p{line-height:1.65}.formats{transform:scale(.93)}.card{padding:15px}.style-grid{gap:7px}.style-grid label>span{padding:8px}.drop{height:205px}.covers{grid-template-columns:1fr}.cover img{height:auto;max-height:470px}.output-card{min-height:380px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.shell{padding-top:38px}.hero{min-height:190px;justify-content:center;text-align:center}.eyebrow{justify-content:center}.hero p{margin-left:auto;margin-right:auto}@media(max-width:800px){.shell{padding-top:22px}.hero{padding-top:0}}