:root{--ink:#202b45;--muted:#748097;--accent:#4c6fff;--green:#4c6fff;--line:#e8ecf5;--paper:#f7f9ff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--ink);background:var(--paper);font:14px/1.7 Segoe UI,Microsoft YaHei,sans-serif;-webkit-font-smoothing:antialiased}button,textarea{font:inherit}a{color:inherit;text-decoration:none}button,a,summary{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid #b7c8ff;outline-offset:3px}[hidden]{display:none!important}.header{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:25px;padding:19px max(24px,calc((100vw - 1160px)/2));background:#fff;border-bottom:1px solid var(--line);box-shadow:0 3px 16px #202b4506;max-width:none;margin:0}.brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:750;letter-spacing:-.6px;white-space:nowrap}.brand-icon{display:grid;place-items:center;width:35px;height:35px;background:#4c6fff;border-radius:10px;color:#fff;box-shadow:0 4px 10px #4c6fff20}.help-link{color:var(--muted);font-size:15px;padding:8px 0}.help-link:hover{color:var(--accent)}main{max-width:1020px;padding:0 30px;margin:auto}.hero{padding:56px 0 30px;text-align:center}h1{font-size:clamp(30px,4vw,48px);line-height:1.4;font-weight:750;letter-spacing:-1.5px;margin:21px 0 13px}.hero p{font-size:16px;color:#7a859b;margin:0;line-height:1.9}.workspace{overflow:hidden;border:1px solid #e2e8f5;border-radius:18px;background:#fff;box-shadow:0 12px 50px -15px #4e6fc41a,0 2px 5px #2b429103}.editor{padding:28px 32px 0}.panel-heading h2{display:flex;align-items:center;gap:9px;font-size:18px;font-weight:650;margin:0}.editor-description{font-size:15px;color:var(--muted);margin:12px 0 18px}.platform-details{margin:0 0 16px;font-size:15px;color:var(--muted)}.platform-details summary{cursor:pointer;width:fit-content}.platform-help{margin:-5px 0 20px;font-size:15px;line-height:1.8;color:#7d89a8}.input-box{overflow:hidden;border:1px solid #dbe3f4;background:#fcfdff;border-radius:11px;transition:border-color .2s,box-shadow .2s}.input-box:focus-within{border-color:#7494ff;box-shadow:0 0 0 4px #4c6fff0c}textarea{display:block;width:100%;min-height:104px;padding:17px 18px;border:0;outline:none;resize:vertical;background:none;color:#364462;font-size:16px;line-height:1.9}textarea::placeholder{color:#9aa6bb}textarea:disabled{background:#fafbfc}.input-toolbar{display:flex;gap:13px;align-items:center;min-height:42px;padding:4px 13px;border-top:1px solid #edf1f8;background:#f7f9ff}.input-toolbar>span{flex:1;color:#75829a;font-size:14px}.text-button{min-height:38px;padding:7px 12px;font-size:15px;font-weight:500;color:#4867b9;border:1px solid #d8e1f5;border-radius:7px;background:#fff;white-space:nowrap}.text-button:hover:not(:disabled){background:#edf2ff;border-color:#a7baf0}.primary{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:50px;padding:15px 22px;border:0;border-radius:10px;color:#fff;background:linear-gradient(105deg,#4d7bf9,#7360eb);font-size:17px;font-weight:600;box-shadow:0 5px 13px #5c75e52b;transition:transform .2s,box-shadow .2s}.primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 7px 17px #5c75e53d}.primary:disabled{background:#a1afd6;box-shadow:none;cursor:default}#submit{max-width:300px;width:100%;margin:16px 0 0 auto}.spinner{display:inline-block;width:14px;height:14px;border:2px solid #ffffff66;border-top-color:#fff;border-radius:50%;animation:spin 1s linear infinite}.hint{display:flex;justify-content:space-between;gap:12px;color:#8c98ae;font-size:14px;margin:12px 0 19px}.preview-panel{padding:28px 32px 32px;border-top:1px solid var(--line);background:#fafbff}.preview-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#374763;font-size:18px;font-weight:600}.preview-badge{border:1px solid #e3e8f7;border-radius:20px;padding:3px 10px;background:#fff;color:#8795ad;font-size:14px;font-weight:400}.preview-badge.ready{color:#4a78dc;border-color:#d7e4ff;background:#eff5ff}.empty-preview{display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:240px;margin-top:20px;border:1px dashed #dce4f6;border-radius:12px;background:#f4f7ff;text-align:center}.empty-preview h3{font-size:16px;font-weight:550;color:#627aab;margin:21px 0 7px}.empty-preview p{font-size:14px;color:#7686a2;margin:0}video{display:block;width:100%;height:auto;max-height:440px;min-height:180px;object-fit:contain;border-radius:12px;background:#172036;margin:20px auto 0;border:1px solid #263453}.playback-error{background:#faf5ed;color:#8f6a37;border-radius:6px;padding:10px 12px;font-size:15px}.video-info h3{font-size:17px;font-weight:600;line-height:1.8;margin:17px 0 5px;overflow-wrap:anywhere}.video-info p{font-size:15px;color:#71819b;margin:0}.metadata{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px;padding:0;border:0}.metadata>div{display:flex;flex-direction:column;gap:5px;border:1px solid #e4eaf8;border-radius:9px;background:#f0f4fd;padding:12px 16px}.metadata span{font-size:14px;color:#8a9ab6}.metadata strong{font-size:17px;font-weight:600;color:#455f91;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.quality-panel{padding:23px;margin-top:25px;border:1px solid #e1e7f5;border-radius:12px;background:#fff}.quality-panel h3{font-size:17px;margin:0 0 7px}.quality-panel p{font-size:14px;color:#6c7b95;line-height:1.8}#quality-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:11px;padding:0;border:0;margin:17px 0;min-width:0}.quality-option{display:flex;gap:10px;align-items:center;padding:15px 13px;border:1px solid #e1e7f4;border-radius:9px;background:#fcfdff;cursor:pointer;transition:background .2s,border-color .2s}.quality-option:hover{border-color:#bac4dc}.quality-option:has(input:checked){border-color:#6c8bfa;background:#f0f4ff;box-shadow:0 0 0 1px #6c8bfa}.quality-option input,.image-caption input{accent-color:var(--accent);width:16px;height:16px;margin:0;flex-shrink:0}.quality-option>span{flex:1;min-width:0}.quality-option strong{display:block;font-size:15px;font-weight:550}.quality-option small{display:block;color:#748094;font-size:14px;overflow-wrap:anywhere}.quality-option b{color:var(--muted);font-size:14px;font-weight:400;white-space:nowrap}#start-download{max-width:380px;margin:20px auto 0;justify-content:center}.image-selection-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:17px;padding:10px 12px;border-radius:8px;background:#f2f6ff;font-size:15px;color:#6d81a6}.image-selection-toolbar button{min-height:38px;background:#fff;border:1px solid #d3def7;border-radius:7px;padding:7px 12px;color:var(--accent);font-size:15px}.image-selection-toolbar button:hover:not(:disabled){background:#eaf0ff;border-color:#a7baf0}#quality-options.image-grid{grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:15px}.image-card{border:1px solid #dfe7f5;border-radius:11px;overflow:hidden;background:#fff;transition:border-color .2s,box-shadow .2s;min-width:0}.image-card.selected{border-color:#6c8bfa;box-shadow:0 0 0 1px #6c8bfa;background:#f5f8ff}.image-thumbnail{display:block;position:relative;width:100%;aspect-ratio:4/3;padding:0;border:0;border-bottom:1px solid #e8edf7;background:#edf2fa;overflow:hidden;cursor:zoom-in}.image-thumbnail img{width:100%;height:100%;display:block;object-fit:contain}.image-thumbnail span{position:absolute;bottom:7px;right:7px;padding:3px 7px;border-radius:5px;color:#fff;font-size:14px;background:#203457a6;opacity:1}.image-thumbnail:hover span,.image-thumbnail:focus-visible span{opacity:1}.image-caption{display:flex;align-items:center;gap:9px;padding:12px;cursor:pointer;min-height:64px}.image-caption strong{display:block;font-size:15px;font-weight:500}.image-caption small{display:block;font-size:14px;color:#748094;overflow-wrap:anywhere}.image-dialog{width:fit-content;max-width:calc(100vw - 28px);max-height:calc(100vh - 28px);border:1px solid var(--line);border-radius:10px;padding:16px;background:#fff}.image-dialog::backdrop{background:#151b2ab3}.image-dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}.image-dialog-heading strong{font-size:15px;font-weight:500}.image-dialog-heading button{width:32px;height:32px;font-size:23px;border:0;border-radius:5px;background:#f2f3f5;color:var(--muted)}#image-preview{display:block;max-width:100%;max-height:calc(100vh - 120px);object-fit:contain;margin:12px auto 0}.status{padding:18px;border:1px solid #dfe8fc;border-radius:11px;background:#f0f5ff;color:#5476b3;font-size:15px;margin-top:18px}.status.error{background:#fff8f3;border-color:#f0ddce;color:#ae6242}.task-stages{display:flex;justify-content:space-between;gap:8px;list-style:none;counter-reset:stage;padding:0;margin:0 0 16px}.task-stages li.active{color:#5276d8;font-weight:600}.task-stages li.complete{color:#636d7c}.status.error .task-stages{display:none}.status-top{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 12px}#progress-text{white-space:nowrap;font-variant-numeric:tabular-nums}progress{display:block;width:100%;height:5px;margin-top:12px;accent-color:var(--accent);border:0;border-radius:4px;overflow:hidden}progress::-webkit-progress-bar{background:#e5e9f1}progress::-webkit-progress-value{background:var(--accent)}.elapsed{margin-top:8px;color:#748096;font-size:14px}.retry-button{margin-top:12px;padding:6px 10px;border:1px solid currentColor;border-radius:5px;background:transparent;color:inherit;font-size:15px}.help-section{margin-top:20px;background:#fff;border:1px solid var(--line);border-radius:10px}.help-section>summary{display:flex;justify-content:space-between;align-items:center;cursor:pointer;padding:17px 20px;font-size:15px;color:#626c7c;list-style:none}.help-section>summary::-webkit-details-marker{display:none}.help-section[open]>summary span{transform:rotate(45deg)}.help-content{padding:0 20px 18px;font-size:15px;color:var(--muted)}.help-content h3{font-size:15px;font-weight:600;color:#535e70;margin:16px 0 4px}.help-content p{margin:0;line-height:1.9}.notice{display:flex;justify-content:center;align-items:flex-start;gap:8px;font-size:14px;color:#73819a;margin:25px 0;text-align:left}footer{display:flex;justify-content:space-between;align-items:center;max-width:1160px;padding:25px 30px;margin:auto;border-top:1px solid #e5eaf4}.completion{position:fixed;right:24px;bottom:24px;z-index:10;display:flex;align-items:flex-start;gap:12px;width:min(420px,calc(100vw - 36px));border:1px solid #c5e7dc;border-radius:13px;background:#f3fdf8;padding:18px;box-shadow:0 10px 40px #2b475520}.completion>span{display:grid;place-items:center;width:28px;height:28px;flex-shrink:0;color:#fff;background:#35a87b;border-radius:50%}.completion strong{font-size:16px;color:#2e7960}.completion p{font-size:15px;color:#6c9b87;margin:5px 0 0}.completion button{margin-left:auto;padding:0 2px;border:0;background:none;font-size:22px;color:#748096}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@keyframes spin{to{transform:rotate(360deg)}}.brand-icon svg{width:23px;height:23px}.brand-tag{border-left:1px solid #dde3f0;padding-left:13px;margin-left:5px;color:#8a94a8;font-size:14px;font-weight:400;letter-spacing:1px}nav{display:flex;align-items:center;gap:28px;font-size:15px;color:#69758d}nav a{padding:6px 0}nav a:hover,.nav-active{color:#4c6fff}.service-badge{display:flex;align-items:center;gap:7px;font-size:14px;color:#77859a;background:#f7f9fd;border:1px solid #edf0f7;padding:6px 10px;border-radius:20px}.service-badge i{width:6px;height:6px;background:#41b48e;border-radius:50%}.eyebrow{display:inline-flex;align-items:center;gap:7px;border:1px solid #e0e6ff;background:#edf1ff;color:#5a75d1;border-radius:30px;padding:5px 14px;font-size:14px;letter-spacing:.5px}.eyebrow span{font-size:17px}h1 span{color:#4c6fff;background:linear-gradient(105deg,#4278fa,#8758e9);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.hero-tags{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:19px;color:#8190a7;font-size:14px}.hero-tags i{width:3px;height:3px;border-radius:50%;background:#b7c2d9}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.link-icon,.section-number{display:inline-grid;place-items:center;width:29px;height:29px;border-radius:8px;font-size:15px;color:#5578e8;background:#edf2ff;flex-shrink:0}.platform{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:#6e7a92;background:#f7f9fd;border:1px solid #e9edf5;padding:4px 9px;border-radius:6px}.platform b{display:grid;place-items:center;width:20px;height:20px;color:#fff;background:#26314a;border-radius:5px;font-size:17px}#submit-icon{width:17px;height:17px;display:grid;place-items:center}.supported-platforms{display:flex;align-items:center;flex-wrap:wrap;gap:9px;padding:18px 0 21px;border-top:1px dashed #dce4f5}.supported-label{color:#74819a;font-size:15px;margin-right:3px}.platform-shortcut{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:7px 13px;border:1px solid #dae3f6;border-radius:20px;background:#f5f8ff;color:#536788;font-size:15px;transition:background .15s,border-color .15s}.platform-shortcut span{color:#8e9fbe;font-size:15px}.platform-shortcut:hover{color:#3c60bf;background:#eaf0ff;border-color:#a8bceb}.platform-shortcut[aria-pressed=true]{color:#3d60c2;background:#e9efff;border-color:#8fa9ed;box-shadow:0 0 0 1px #8fa9ed33;font-weight:600}.platform-shortcut:disabled{cursor:wait}h1 .hero-prefix{color:var(--ink);background:none;-webkit-text-fill-color:currentColor}.supported-tip{color:#97a4b9;font-size:14px}@media(max-width:680px){.supported-platforms{gap:8px;padding:16px 0 19px}.supported-tip{width:100%;margin-top:2px}.platform-shortcut{padding:7px 11px}}.preview-heading>span:first-child{display:flex;align-items:center;gap:9px}.video-illustration{display:grid;place-items:center;position:relative;width:105px;height:92px}.illus-lines{position:absolute;width:66px;height:82px;border-radius:11px;border:1px solid #cdd9f5;background:#e8efff;transform:rotate(10deg);box-shadow:-8px 3px 0 -1px #f4f7ff,-9px 3px #dce5f9}.video-illustration>span{display:grid;place-items:center;position:relative;width:34px;height:34px;border:1px solid #d1ddfa;border-radius:50%;color:#7e9ae2;background:#fff;font-size:15px;padding-left:2px}.video-illustration i{position:absolute;right:1px;top:-3px;color:#94a9e8;font-size:27px;font-style:normal}.preview-label{font-size:13px;letter-spacing:2px;color:#a7b6d1;margin-top:20px}.processing .video-illustration{animation:float 2s ease-in-out infinite}@keyframes float{50%{transform:translateY(-6px)}}.image-thumbnail img{transition:transform .2s}.image-thumbnail:hover img{transform:scale(1.04)}.task-stages li{display:flex;align-items:center;gap:6px;color:#94a2bd;font-size:14px}.task-stages li:before{counter-increment:stage;content:counter(stage);display:grid;place-items:center;width:20px;height:20px;border:1px solid #d7e2f8;border-radius:50%;font-size:13px}.task-stages li.active:before{color:#fff;background:#5a80ef;border-color:#5a80ef}.task-stages li.complete:before{content:"✓";color:#4e7cbf;border-color:#cbdcf8;background:#e3edff}.features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding-top:26px}.features>div{display:flex;align-items:center;gap:12px;padding:19px 16px;border:1px solid #e6ebf7;border-radius:11px;background:#fff}.feature-icon{display:grid;place-items:center;width:37px;height:37px;border-radius:10px;background:#edf2ff;color:#6f8fe4;font-size:22px;flex-shrink:0}.features h3{font-size:15px;font-weight:600;margin:0 0 4px}.features p{font-size:14px;color:#6d7a92;margin:0}.guide{padding:43px 0 35px}.section-title{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.section-label{font-size:14px;letter-spacing:1px;color:#7e97d7}.section-title h2{font-size:23px;font-weight:650;margin:6px 0 0;letter-spacing:-.5px}.section-title>p{font-size:15px;color:#94a1b9;margin:0 0 4px}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:23px}.steps article{padding:22px;background:#fff;border:1px solid #e5eaf5;border-radius:12px}.steps article>span{display:grid;place-items:center;width:30px;height:30px;background:#eef2ff;color:#6989dd;font-size:14px;border-radius:8px}.steps h3{font-size:15px;font-weight:600;margin:13px 0 8px}.steps p{font-size:14px;color:#6d7a92;margin:0;line-height:1.9}.faq .section-title{margin-bottom:20px}.faq details{border:1px solid #e3e9f5;border-radius:9px;background:#fff;margin:10px 0;padding:0 20px}.faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;cursor:pointer;padding:17px 0;font-size:15px;color:#516281}.faq summary::-webkit-details-marker{display:none}.faq summary span{color:#9aacc9}.faq details p{font-size:15px;color:#8291ab;line-height:1.9;margin:0 0 18px}.notice p{margin:0}footer .brand{font-size:18px;color:#657b9f}.footer-sub{font-size:14px;color:#a2aec2;font-weight:400;margin-left:10px;letter-spacing:0}footer>span{font-size:14px;color:#a2aec2}@media(max-width:900px){.service-badge{display:none}.header{padding:18px 25px}.features{gap:12px}.features>div{padding:16px 12px;gap:8px}.steps p br{display:none}}@media(max-width:680px){.header{padding:16px 18px;gap:10px}.brand{font-size:19px}.brand-tag,nav .nav-active,nav span{display:none}nav{font-size:14px;gap:14px}.brand-icon{width:31px;height:31px}main{padding:0 17px}.hero{padding:35px 0 25px}h1{font-size:31px;letter-spacing:-1px;margin-top:17px}h1 span{display:block}.hero p{font-size:15px;max-width:300px;margin:auto}.hero-tags{font-size:14px;gap:10px;margin-top:16px}.workspace{border-radius:14px}.editor{padding:22px 19px 0}.editor-description{font-size:14px}.panel-heading h2{font-size:16px}.platform{font-size:13px;padding:3px 6px}textarea{min-height:132px;padding:15px;font-size:18px}.input-toolbar{gap:5px;padding:3px 9px}.text-button{min-height:36px}#submit{max-width:none}.hint span{display:none}.trust-row{gap:16px;justify-content:space-between;font-size:13px}.preview-panel{padding:22px 19px}.preview-heading{font-size:16px}.empty-preview{min-height:230px}.metadata{gap:7px}.metadata>div{padding:11px 9px}.metadata strong{font-size:15px}.quality-panel{padding:17px}#quality-options{grid-template-columns:1fr}.features{grid-template-columns:1fr;gap:10px;padding-top:20px}.features>div{padding:15px;gap:13px}.features p{font-size:14px}.guide{padding:30px 0}.section-title>p{display:none}.section-title h2{font-size:21px}.steps{grid-template-columns:1fr;gap:10px;margin-top:18px}.steps article{position:relative;padding:17px 16px 17px 60px}.steps article>span{position:absolute;left:16px;top:18px}.steps h3{margin:0 0 6px}.steps p{font-size:15px}.faq details{padding:0 15px}.faq summary{font-size:15px}.notice{font-size:14px}footer{padding:20px}.footer-sub{display:none}footer>span{font-size:13px}}@media(max-width:480px){#quality-options.image-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.image-caption{padding:9px;gap:6px}.image-selection-toolbar{align-items:flex-start}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}.header{padding-top:19px;padding-bottom:19px}.brand{font-size:21px}.brand-tag,.service-badge{font-size:12px}nav{font-size:13px}.hero{padding:44px 0 28px}h1{font-size:clamp(30px,4vw,40px);line-height:1.38;letter-spacing:-1px;margin:18px 0 12px}.hero p{font-size:14px;line-height:1.85}.eyebrow,.hero-tags{font-size:12px}.eyebrow{padding:5px 13px}.panel-heading h2,.preview-heading{font-size:16px}.platform{font-size:12px}.input-explanation{margin:15px 0 17px}.input-explanation h3{margin:0 0 5px;color:#53647e;font-size:13px;font-weight:600}.input-explanation .editor-description{margin:0;font-size:13.5px;line-height:1.85;color:#708099}textarea{font-size:14.5px;line-height:1.85}.input-toolbar{padding:6px 12px}.input-toolbar>span{font-size:12px}.text-button{font-size:13px;min-height:38px}.primary{font-size:14.5px;min-height:50px}.hint{font-size:12px;line-height:1.8;margin:11px 0 17px}.supported-label{font-size:12.5px}.supported-platforms{gap:9px}.platform-shortcut{min-height:40px;padding:8px 13px;font-size:13px}.features-section{padding-top:30px}.features-section .features{padding-top:17px}.features>div{align-items:flex-start;padding:20px 17px}.features h3{font-size:15px;font-weight:600;margin:0 0 7px}.features p{font-size:13.5px;line-height:1.85;color:#708099}.section-label{display:block;margin-bottom:5px;font-size:12px;letter-spacing:.5px}.section-title h2{font-size:22px;line-height:1.5;letter-spacing:-.4px}.section-title>p{font-size:13px}.steps h3{font-size:15.5px}.steps p,.faq details p{font-size:13.5px;line-height:1.9}.steps article>span{font-size:12px}.faq summary{font-size:14.5px;padding:18px 0;gap:14px}.preview-badge{font-size:12px}.empty-preview h3{font-size:14px}.empty-preview p{font-size:13px}.video-info h3{font-size:15px}.video-info p{font-size:12.5px}.metadata span{font-size:12px}.metadata strong{font-size:14px}.quality-panel h3{font-size:15px}.quality-panel p{font-size:13px;line-height:1.85}.quality-option strong{font-size:13.5px}.quality-option small,.image-caption small{font-size:12px;line-height:1.8}.quality-option b{font-size:12.5px}.image-caption{min-height:68px}.image-caption strong{font-size:13px}.image-thumbnail span{font-size:12px}.image-selection-toolbar,.image-selection-toolbar button,.image-dialog-heading strong,.playback-error{font-size:13px}#source-note{margin-top:18px;font-size:12.5px;line-height:1.85}.status{font-size:13px}.elapsed{font-size:12px}.task-stages li,.task-stages li:before{font-size:12px}.retry-button{font-size:13px}.notice{font-size:12px;line-height:1.85}.completion strong{font-size:14px}.completion p{font-size:13px}.footer-sub,footer>span{font-size:12px}@media(max-width:680px){.header{flex-wrap:wrap;row-gap:10px}nav{font-size:12px}.hero{padding:30px 0 24px}h1{font-size:29px;line-height:1.45}.hero p{font-size:13px;max-width:340px}.hero-tags{font-size:12px}.input-explanation .editor-description{font-size:13px}textarea{font-size:16px}.input-toolbar>span{min-width:0;font-size:11px;overflow-wrap:anywhere}.hint{font-size:11.5px}.panel-heading h2,.preview-heading{font-size:15px}.platform{font-size:11px}.section-title h2{font-size:21px}.features p,.steps p,.faq details p{font-size:13px}.steps h3{font-size:15px}.faq summary{font-size:14px}.metadata strong{font-size:13px}.image-caption small{font-size:11.5px}.notice{font-size:12px}footer{flex-wrap:wrap;gap:10px}}.reveal-enter-active,.reveal-leave-active{transition:opacity .24s ease,transform .24s ease}.reveal-enter-from,.reveal-leave-to{opacity:0;transform:translateY(12px)}.toast-enter-active,.toast-leave-active{transition:opacity .22s ease,transform .22s ease}.toast-enter-from,.toast-leave-to{opacity:0;transform:translateY(16px)}.platform-shortcut,.image-card,.quality-option{transition:background .18s,border-color .18s,box-shadow .18s,transform .18s}.image-card.selected{transform:translateY(-2px)}.image-card.selected .image-caption{background:#edf2ff}.primary:active:not(:disabled),.text-button:active:not(:disabled){transform:scale(.98)}.loading-orbit{width:30px;height:30px;margin-bottom:16px;border:3px solid #dce5ff;border-top-color:#5b7bea;border-radius:50%;animation:spin .9s linear infinite}progress::-webkit-progress-value{transition:width .3s ease}.image-dialog[open]{animation:viewer-in .18s ease-out}@keyframes viewer-in{0%{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(max-width:680px){html{scroll-padding-top:136px}}.platform-guide{padding-top:36px}.platform-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}.platform-guide-card{display:flex;flex-direction:column;min-width:0;padding:20px;border:1px solid #e2e8f5;border-radius:12px;background:#fff;transition:border-color .18s,box-shadow .18s}.platform-guide-card.is-current{border-color:#bdcdf5;box-shadow:0 0 0 1px #4c6fff09}.platform-guide-top{display:flex;align-items:center;gap:11px}.platform-guide-mark{display:grid;place-items:center;flex-shrink:0;width:36px;height:36px;border-radius:10px;background:#f0f4ff;color:#6984c5;font-size:18px;font-weight:600}.platform-guide-top h3{margin:0;font-size:15px;font-weight:600;color:#3a4a67}.platform-guide-top div>span{font-size:12px;color:#8592a8}.platform-guide-card>p{margin:15px 0 13px;font-size:13px;color:#75819a;line-height:1.9}.platform-guide-card code{display:block;overflow-wrap:anywhere;padding:7px 9px;background:#f7f9fd;border-radius:6px;color:#7c8baa;font:12px/1.8 ui-monospace,Consolas,monospace}.platform-guide-bottom{margin-top:auto;padding-top:15px}.platform-guide-bottom small{display:block;color:#8b97ac;font-size:12px;line-height:1.8}.platform-guide-bottom button{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;min-height:38px;margin-top:11px;padding:8px 11px;background:#f5f8ff;color:#5578cf;border:1px solid #e0e7f8;border-radius:7px;font-size:13px}.platform-guide-bottom button:hover:not(:disabled){background:#eaf0ff;border-color:#bfcef3}.steps{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.steps article{padding:20px 17px}@media(max-width:820px){.platform-guide-grid,.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){.platform-guide{padding-top:28px}.platform-guide .section-title>p{display:none}.steps{grid-template-columns:1fr}.steps article{padding:17px 16px 17px 60px}}@media(max-width:480px){.platform-guide-grid{grid-template-columns:1fr;gap:11px}.platform-guide-card{padding:18px}}@media(prefers-reduced-motion:reduce){.platform-guide-card{transition:none}}.home-highlights{padding-top:38px}.benefit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:20px}.benefit-card{padding:22px;border:1px solid #e2e8f5;border-radius:12px;background:#fff;transition:transform .2s,border-color .2s}.benefit-icon{display:grid;place-items:center;width:35px;height:35px;color:#6280ce;background:#eef3ff;border-radius:10px;font-size:20px;margin-bottom:14px}.benefit-card h3{font-size:15px;font-weight:600;margin:0 0 8px;color:#40516e}.benefit-card p{font-size:13px;color:#78859c;line-height:1.9;margin:0}.benefit-footnote{font-size:12px;color:#929db0;margin:14px 0 0}.home-tutorial-banner,.tutorial-cta{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 28px;border:1px solid #dfe7fa;border-radius:13px;background:linear-gradient(110deg,#eef3ff,#f9faff);margin:32px 0}.home-tutorial-banner h2,.tutorial-cta h2{font-size:20px;line-height:1.6;color:#3c527a;margin:0 0 6px;font-weight:600}.home-tutorial-banner p,.tutorial-cta p{font-size:13px;color:#7a89a5;margin:0}.lesson-next{display:inline-flex;justify-content:center;align-items:center;min-height:43px;padding:10px 17px;color:#fff;background:#5276e4;border:1px solid #5276e4;border-radius:8px;font-size:13px;font-weight:550;white-space:nowrap}.lesson-next:hover:not(:disabled){background:#4265d0}.lesson-next:disabled{opacity:.45}.faq-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}.faq.home-faq details{margin:0;padding:0 18px}.faq.home-faq summary{font-size:13.5px;min-height:65px;padding:16px 0}.faq.home-faq details p{font-size:13px}.tutorial-breadcrumb{display:flex;gap:12px;padding-top:25px;font-size:12px;color:#91a0b9}.tutorial-breadcrumb a{color:#637cad}.tutorial-hero{padding:36px 0 32px;text-align:center}.tutorial-hero h1{font-size:clamp(27px,4vw,38px);margin:18px 0 12px;line-height:1.5}.tutorial-hero>p{font-size:14px;color:#8390a8;margin:0}.tutorial-mode{display:inline-flex;gap:4px;padding:4px;background:#eaf0fc;border:1px solid #e0e7f7;border-radius:10px;margin-top:22px}.tutorial-mode button{padding:9px 20px;border:0;border-radius:7px;background:transparent;color:#7c8ba7;font-size:13px}.tutorial-mode button[aria-pressed=true]{background:#fff;color:#5276d5;box-shadow:0 2px 7px #38508512}.tutorial-lab{background:#fff;border:1px solid #e0e7f5;border-radius:16px;overflow:hidden}.tutorial-lab-heading{padding:20px 25px;border-bottom:1px solid #edf0f8;display:flex;align-items:center;justify-content:space-between;gap:12px}.tutorial-lab-heading h2{margin:0;font-size:16px;font-weight:600}.tutorial-lab-heading>span{color:#97a1b5;font-size:12px}.tutorial-layout{display:grid;grid-template-columns:235px minmax(0,1fr)}.tutorial-step-list{display:flex;flex-direction:column;gap:8px;background:#fafbff;padding:23px 15px;border-right:1px solid #edf0f8}.tutorial-step-list button{display:flex;align-items:center;gap:11px;text-align:left;border:1px solid transparent;border-radius:9px;padding:14px 10px;color:#8191ab;background:transparent}.tutorial-step-list button>span:first-child{display:grid;place-items:center;width:29px;height:29px;flex-shrink:0;border-radius:8px;background:#f0f3fa;font-size:11px}.tutorial-step-list button div{flex:1}.tutorial-step-list strong{display:block;font-size:13px;font-weight:550}.tutorial-step-list small{display:block;font-size:11px;color:#99a6bd;margin-top:3px;line-height:1.7}.tutorial-step-list .current{color:#5276d3;background:#fff;border-color:#dce5fb;box-shadow:0 3px 10px #3e5c9f08}.tutorial-step-list .current>span:first-child{color:#fff;background:#6482df}.tutorial-demo{padding:25px 28px;display:flex;flex-direction:column;min-width:0}.tutorial-demo-top{display:flex;justify-content:space-between;gap:15px;color:#96a3ba;font-size:11px;margin-bottom:22px}.tutorial-demo-top span:last-child{color:#758dc4}.tutorial-demo-body{min-height:310px}.tutorial-demo h3{font-size:18px;color:#405472;font-weight:600;margin:0 0 9px}.tutorial-demo-body>p{font-size:13px;color:#7a89a3;line-height:1.9;margin:0 0 19px}.tutorial-field-label{display:block;font-size:12px;color:#8191ab;margin:17px 0 8px}.tutorial-demo select{width:100%;padding:10px 12px;border:1px solid #dfe6f5;border-radius:7px;color:#5b708f;background:#fbfcff;font:inherit;font-size:13px;line-height:1.6}.tutorial-demo select:focus-visible{outline:2px solid #9db5f3;outline-offset:2px}.tutorial-share{display:flex;align-items:center;gap:12px;padding:15px;border:1px solid #e6ebf5;border-radius:9px;margin-top:12px;background:#f9fbff}.tutorial-share-mark{width:34px;height:34px;display:grid;place-items:center;color:#7e9ad4;background:#ebf1ff;border-radius:8px;flex-shrink:0}.tutorial-share strong{font-size:12px;font-weight:550;color:#5f7597}.tutorial-share div{min-width:0}.tutorial-share code{display:block;font-size:11px;color:#93a0b9;margin-top:3px;overflow-wrap:anywhere}.tutorial-share-tag{margin-left:auto;font-size:10px;white-space:nowrap;color:#9aabc6}.lesson-note{margin-top:17px;padding:10px 12px;font-size:12px;line-height:1.85;color:#8395b2;border-left:2px solid #cfdcf8;background:#f7f9ff;border-radius:0 6px 6px 0}.tutorial-demo textarea{border:1px solid #dbe4f6;border-radius:8px;min-height:108px;font-size:13px;background:#fcfdff}.lesson-example{display:inline-flex;align-items:center;margin-top:12px;padding:7px 11px;min-height:36px;border:1px solid #dce5f8;color:#6b87ca;background:#f6f9ff;border-radius:6px;font-size:12px}.lesson-example:hover:not(:disabled){background:#eaf0ff}.tutorial-demo-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;border-top:1px solid #edf1fa;padding-top:19px;margin-top:auto}.lesson-quality{display:grid;gap:10px}.lesson-quality label{display:flex;align-items:center;gap:10px;padding:17px 13px;border:1px solid #e1e7f4;border-radius:8px;color:#7e8da6;font-size:13px;cursor:pointer}.lesson-quality label>span:last-child{margin-left:auto;color:#a9b7cf}.lesson-quality .selected{background:#f3f7ff;border-color:#91adee;color:#5b7ec5}.lesson-quality input,.lesson-images input{accent-color:#6486e5}.lesson-images{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}.lesson-images label{overflow:hidden;border:1px solid #e2e8f6;border-radius:8px;background:#fff;cursor:pointer}.lesson-images label.selected{border-color:#7f9ee8;background:#f0f5ff}.lesson-images label>span:last-child{display:flex;align-items:center;gap:6px;padding:9px;font-size:12px;color:#7d91b0}.lesson-art{display:block;position:relative;height:85px;overflow:hidden;background:#e9effb}.lesson-art:before{content:"";position:absolute;width:25px;height:25px;border-radius:50%;background:#fff9e8;right:18%;top:17%}.lesson-art:after{content:"";position:absolute;width:90px;height:90px;background:#b8caed;transform:rotate(45deg);bottom:-60px;left:15%;border-radius:10px}.lesson-art i{position:absolute;width:100px;height:100px;background:#d1def6;bottom:-65px;right:-20px;transform:rotate(40deg);border-radius:12px}.lesson-art.art-2{background:#eaf4f1}.art-2:after{background:#b8d7cf}.art-2 i{background:#d0e6df}.lesson-art.art-3{background:#f4eef7}.art-3:after{background:#d4c1e1}.art-3 i{background:#e2d5ec}.lesson-progress{border:1px solid #e0e8fa;background:#f8faff;border-radius:10px;padding:19px;margin:20px 0 3px}.lesson-progress>div{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#7b93c2;font-size:13px}.lesson-progress strong{font-weight:500}.lesson-progress p{color:#98a6bd;font-size:11px;margin:12px 0 0}.tutorial-tips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:24px}.tutorial-tips article{padding:21px;background:#fff;border:1px solid #e3e9f6;border-radius:11px}.tutorial-tips article>span{color:#92a6cc;font-size:11px}.tutorial-tips h3{font-size:14px;font-weight:550;color:#627897;margin:10px 0 7px}.tutorial-tips p{color:#8b9bb4;line-height:1.9;font-size:12px;margin:0}.lesson-enter-active,.lesson-leave-active{transition:opacity .15s,transform .15s}.lesson-enter-from{opacity:0;transform:translateY(5px)}.lesson-leave-to{opacity:0;transform:translateY(-5px)}@media(max-width:820px){.benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tutorial-layout{grid-template-columns:205px minmax(0,1fr)}.tutorial-demo{padding:22px}}@media(max-width:680px){nav .nav-active{display:inline-flex}nav{flex-wrap:wrap;gap:15px}.home-highlights{padding-top:28px}.benefit-grid{gap:10px}.benefit-card{padding:18px 15px}.home-tutorial-banner,.tutorial-cta{align-items:flex-start;flex-direction:column;padding:22px;gap:17px}.home-tutorial-banner h2,.tutorial-cta h2{font-size:18px}.faq-card-grid{grid-template-columns:1fr}.tutorial-hero{padding:26px 0}.tutorial-hero h1{font-size:27px}.tutorial-hero>p{font-size:13px}.tutorial-layout{grid-template-columns:1fr}.tutorial-step-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:12px;border-right:0;border-bottom:1px solid #edf0f8}.tutorial-step-list button{flex-direction:column;text-align:center;padding:10px 3px;gap:7px}.tutorial-step-list small,.tutorial-step-list button>span:last-child{display:none}.tutorial-step-list strong{font-size:12px}.tutorial-lab-heading{align-items:flex-start;flex-direction:column;padding:17px 20px;gap:5px}.tutorial-demo{padding:22px 19px}.tutorial-demo-body{min-height:330px}.tutorial-tips{grid-template-columns:1fr;gap:10px}.tutorial-share-tag{display:none}.tutorial-demo textarea{font-size:16px}}@media(max-width:400px){.benefit-grid{grid-template-columns:1fr}.tutorial-mode button{padding:8px 17px}.tutorial-demo-actions .lesson-next{padding:9px 12px;font-size:12px}}@media(prefers-reduced-motion:reduce){.benefit-card,.lesson-enter-active,.lesson-leave-active{transition:none}}body{background-color:#f5f7ff;background-image:radial-gradient(ellipse 70% 430px at 50% 0,#e8edff99,transparent)}.hero{padding:48px 0 34px}.hero h1{font-size:clamp(29px,4.4vw,42px);font-weight:750;line-height:1.28;letter-spacing:-1px;margin:18px 0 12px}.hero>p{max-width:640px;margin:0 auto;font-size:14px;line-height:1.85}.workspace{border-radius:22px;box-shadow:0 24px 45px -30px #25396945}.home-highlights,.platform-guide{padding-top:52px}.home-highlights .section-title,.platform-guide .section-title,.home-faq .section-title{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;max-width:740px;margin:0 auto 25px}.home-highlights .section-label,.platform-guide .section-label,.home-faq .section-label{display:inline-flex;align-items:center;min-height:28px;padding:3px 13px;background:#eaf0ff;border:1px solid #d9e3ff;border-radius:30px;color:#5a78cd;font-size:12px;font-weight:600;margin-bottom:12px;letter-spacing:.3px}.home-highlights .section-title h2,.platform-guide .section-title h2,.home-faq .section-title h2{font-size:clamp(22px,3.4vw,28px);line-height:1.35;font-weight:700;letter-spacing:-.6px;margin:0}.home-highlights .section-title>p,.platform-guide .section-title>p{display:block;font-size:13.5px;line-height:1.85;color:#7b89a3;margin:0}.benefit-grid,.platform-guide-grid{margin-top:0;gap:16px}.benefit-card{--card-color:79,119,234;position:relative;overflow:hidden;padding:23px 21px;border-radius:15px;border:1px solid #e0e7f7;background:linear-gradient(180deg,#fff,#fafbff);transition:transform .28s cubic-bezier(.2,.7,.3,1),box-shadow .28s,border-color .24s}.benefit-card:nth-child(2){--card-color:139,104,223}.benefit-card:nth-child(3){--card-color:222,163,58}.benefit-card:nth-child(4){--card-color:61,169,136}.benefit-card:nth-child(5){--card-color:57,159,186}.benefit-card:nth-child(6){--card-color:220,112,132}.benefit-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,rgb(var(--card-color)),rgba(var(--card-color),.25));transform:scaleX(0);transform-origin:left;transition:transform .32s ease}.benefit-card:after{content:"";position:absolute;width:130px;height:130px;top:-65px;right:-45px;border-radius:50%;background:rgba(var(--card-color),.07);opacity:0;transition:opacity .3s;pointer-events:none}.benefit-icon{position:relative;width:44px;height:44px;margin-bottom:16px;border:1px solid rgba(var(--card-color),.15);border-radius:13px;color:rgb(var(--card-color));background:rgba(var(--card-color),.09);transition:transform .28s,background .28s,color .28s,box-shadow .28s}.benefit-icon svg{width:22px;height:22px}.benefit-card h3{font-size:15.5px;font-weight:650;letter-spacing:-.15px;margin:0 0 8px}.benefit-card p{font-size:13.5px;line-height:1.8;color:#7b87a0}.benefit-footnote{text-align:center;font-size:12px;margin-top:18px}.platform-guide-card{border-radius:15px;background:linear-gradient(180deg,#fff,#fbfcff);transition:transform .25s,box-shadow .25s,border-color .25s}.platform-guide-card>p{font-size:13.5px;line-height:1.8}.platform-guide-bottom button{transition:background .2s,border-color .2s,color .2s}.home-tutorial-banner{margin:42px 0;border-radius:16px;padding:27px 30px}.faq.home-faq details{border-radius:13px;overflow:hidden;transition:border-color .24s,box-shadow .24s,background .24s}.faq.home-faq details[open]{border-color:#aebfee;background:linear-gradient(180deg,#fff,#f8faff);box-shadow:0 18px 30px -27px #314d9355}.faq.home-faq summary{font-size:14px;min-height:64px;font-weight:550;color:#4a5d7c}.faq.home-faq summary>span{font-size:0;flex:0 0 25px;height:25px;width:25px;border-radius:8px;color:#6988df;background-color:#edf2ff;background-image:linear-gradient(currentColor,currentColor),linear-gradient(currentColor,currentColor);background-size:10px 1.5px,1.5px 10px;background-position:center;background-repeat:no-repeat;transition:background-size .22s,background-color .22s}.faq.home-faq details[open] summary>span{background-size:10px 1.5px,0 0;background-color:#e0e9ff}.faq.home-faq details p{font-size:13px;line-height:1.85;color:#7d8aa3}.scroll-reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.7,.3,1)}.scroll-reveal.is-revealed{opacity:1;transform:translateY(0)}@media(hover:hover){.benefit-card:hover{transform:translateY(-5px);border-color:rgba(var(--card-color),.32);box-shadow:0 24px 38px -28px #24345a75}.benefit-card:hover:before{transform:scaleX(1)}.benefit-card:hover:after{opacity:1}.benefit-card:hover .benefit-icon{color:#fff;background:rgb(var(--card-color));border-color:transparent;transform:translateY(-2px) rotate(-5deg);box-shadow:0 12px 20px -13px rgba(var(--card-color),.6)}.platform-guide-card:hover,.platform-guide-card:focus-within{transform:translateY(-4px);border-color:#b8c9f2;box-shadow:0 20px 30px -27px #304c9255}.faq.home-faq details:hover{border-color:#c3d0ef}}@media(max-width:680px){.hero{padding:33px 0 26px}.hero h1{font-size:29px;line-height:1.4}.hero>p{max-width:340px;font-size:13px}.home-highlights,.platform-guide{padding-top:36px}.benefit-grid{gap:12px}.benefit-card{padding:20px 17px}.benefit-card h3{font-size:15px}.benefit-card p,.platform-guide-card>p{font-size:13px}.home-highlights .section-title>p,.platform-guide .section-title>p{display:block;font-size:13px}.home-tutorial-banner{margin:30px 0;padding:23px}}@media(prefers-reduced-motion:reduce){.scroll-reveal{opacity:1;transform:none}.benefit-card,.benefit-icon,.benefit-card:before,.benefit-card:after,.platform-guide-card,.faq.home-faq details,.faq.home-faq summary>span{transition:none}.benefit-card:hover,.benefit-card:hover .benefit-icon,.platform-guide-card:hover{transform:none}}@font-face{font-family:VideoClear UI;src:url(/ui-sans.woff2) format("woff2");font-style:normal;font-weight:100 900;font-display:swap}:root{--ink:#303344;--muted:#808399;--accent:#7667cb;--line:#e9e8f0;--paper:#f8f8fc}body{font-family:VideoClear UI,PingFang SC,Microsoft YaHei UI,sans-serif;font-size:14px;line-height:1.85;color:var(--ink);background:#f8f8fc;font-synthesis:none}button,input,select,textarea{font-family:inherit}.header{background:#ffffffed;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid #eeedf4;box-shadow:none;padding-top:16px;padding-bottom:16px}.brand{font-size:20px;font-weight:700;letter-spacing:-.3px}.brand-icon{background:#8071cb;box-shadow:none;border-radius:11px}.brand-tag{color:#9897a8;font-size:11px}nav{gap:28px;font-size:13px}nav a{color:#868596}nav a:hover,nav .nav-active{color:#7768be}.service-badge{background:#f7f7fa;border-color:#efedf4;color:#9594a4;font-size:11px}main{max-width:1080px;padding:0 36px}.hero{display:block;text-align:center;padding:42px 0 29px}.hero .eyebrow{width:fit-content;margin:0 auto;padding:4px 13px;color:#8b80bc;border-color:#e8e3f6;background:#f1eef9;font-size:11px;font-weight:500;letter-spacing:.2px}.hero h1{margin:20px 0 12px;font-size:clamp(28px,4vw,38px);line-height:1.5;font-weight:700;letter-spacing:-.6px}.hero h1>span{display:inline}.hero h1 span:not(.hero-prefix){background:linear-gradient(100deg,#8772cc,#a184bf);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero>p{margin:0 auto;padding:0;border:0;max-width:570px;font-size:13px;line-height:1.9;color:#9390a4}.hero-tags{justify-content:center;font-size:11px;gap:13px;margin-top:16px;color:#aaa6b8}.workspace{background:#fff;border:1px solid #e9e6f0;border-radius:19px;box-shadow:0 14px 32px -22px #6a5b8d26}.editor{padding:27px 30px 0}.panel-heading h2{font-size:15px;font-weight:600;color:#57546d}.link-icon{background:#f1eef9;color:#a08bc8;border-radius:9px}.platform{font-size:11px;color:#a29caf;background:#faf8fc;border-color:#eeeaf3}.input-explanation{margin:15px 0 16px}.input-explanation h3{font-size:12px;font-weight:550;color:#9c94ac}.input-explanation .editor-description{font-size:12.5px;line-height:1.85;color:#a39bab}.input-box{border-color:#e7e2ed;background:#fcfbfd;border-radius:11px}.input-box:focus-within{border-color:#b4a8d7;box-shadow:0 0 0 3px #9d87cf0a}textarea{font-size:14px;line-height:1.9;color:#61586e}textarea::placeholder{color:#b3a8be}.input-toolbar{background:#faf8fc;border-color:#f0ecf4}.text-button{color:#9685b7;border-color:#e9e1f1;font-size:12px;border-radius:7px;background:#fff}.primary{background:linear-gradient(110deg,#8b78d0,#9b80c2);border-radius:10px;box-shadow:0 5px 13px #9d83c526;font-size:14px;font-weight:550}.primary:hover:not(:disabled){box-shadow:0 7px 18px #9d83c53a}#submit{max-width:250px}.hint{font-size:11px;color:#b1a7bd}.supported-platforms{padding:17px 0 21px;gap:8px;border-color:#ece5f2}.supported-label{font-size:11px;color:#a89caf}.platform-shortcut{color:#a092b2;background:#faf7fc;border-color:#eee7f3;border-radius:8px;padding:6px 12px;min-height:34px;font-size:12px}.platform-shortcut[aria-pressed=true]{color:#8c76ad;background:#f0e9f7;border-color:#dbceeb;box-shadow:none}.home-highlights,.platform-guide{padding-top:42px}.home-highlights .section-title,.platform-guide .section-title,.home-faq .section-title{max-width:none;text-align:left;flex-direction:row;justify-content:space-between;align-items:flex-end;margin:0 0 20px;gap:20px}.home-highlights .section-label,.platform-guide .section-label,.home-faq .section-label{display:block;width:fit-content;padding:0;margin:0 0 7px;min-height:0;border:0;background:none;color:#aea4bf;font-size:11px;font-weight:500;letter-spacing:.7px}.home-highlights .section-title h2,.platform-guide .section-title h2,.home-faq .section-title h2{color:#615a70;font-size:22px;font-weight:650;line-height:1.6;letter-spacing:0}.home-highlights .section-title>p,.platform-guide .section-title>p{color:#aaa1b6;font-size:12px;line-height:1.8}.benefit-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.benefit-card{--card-color:145,119,191;display:block;padding:22px;min-height:170px;border:1px solid rgba(var(--card-color),.1);border-radius:15px;background:#f1ecf9}.benefit-card:nth-child(1){grid-column:span 2;background:#eeeafa;--card-color:145,119,191}.benefit-card:nth-child(2){grid-column:span 2;background:#eaf1fb;--card-color:116,149,192}.benefit-card:nth-child(3){background:#eaf5ef;--card-color:109,165,139}.benefit-card:nth-child(4){background:#fbf0e9;--card-color:198,153,120}.benefit-card:nth-child(5){background:#faf5e5;--card-color:183,164,99}.benefit-card:nth-child(6){background:#f8edf2;--card-color:190,138,160}.benefit-icon{width:35px;height:35px;margin:0 0 15px;border:0;border-radius:10px;color:rgb(var(--card-color));background:#ffffff9c;box-shadow:0 3px 8px #ffffff20}.benefit-icon svg{width:19px;height:19px}.benefit-card h3{color:#6d6176;font-size:14px;font-weight:600;line-height:1.7;margin-bottom:7px}.benefit-card p{font-size:12.5px;line-height:1.9;color:#a394aa}.benefit-card:nth-child(2) h3{color:#65758c}.benefit-card:nth-child(2) p{color:#96a4b8}.benefit-card:nth-child(3) h3{color:#698475}.benefit-card:nth-child(3) p{color:#9bafa2}.benefit-card:nth-child(4) h3{color:#947d6d}.benefit-card:nth-child(4) p{color:#b5a08f}.benefit-card:nth-child(5) h3{color:#8b805c}.benefit-card:nth-child(5) p{color:#b2a783}.benefit-card:nth-child(6) h3{color:#947786}.benefit-card:nth-child(6) p{color:#b69aa9}.benefit-footnote{text-align:right;font-size:11px;color:#b2a7bb}.platform-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.platform-guide-card{display:flex;flex-direction:column;align-items:stretch;gap:0;min-width:0;padding:20px;border:1px solid #eee9f2;border-radius:13px;background:#fff}.platform-guide-top{display:flex;align-items:center;gap:10px}.platform-guide-mark{background:#f3eff9;color:#b09bc9;width:33px;height:33px;font-size:14px;border-radius:10px}.platform-guide-card:nth-child(2) .platform-guide-mark{background:#fbebee;color:#c99ca6}.platform-guide-card:nth-child(3) .platform-guide-mark{background:#eaf3fc;color:#99b8d0}.platform-guide-card:nth-child(4) .platform-guide-mark{background:#ebf5f1;color:#95b6a9}.platform-guide-card:nth-child(5) .platform-guide-mark{background:#f0eff5;color:#aaa3bc}.platform-guide-top h3{color:#72677f;font-size:14px;font-weight:600}.platform-guide-top div>span{font-size:11px;color:#b1a4bd}.platform-guide-card>p{font-size:12px;line-height:1.9;color:#afa1ba;margin:13px 0 10px}.platform-guide-card>code{background:#fbf9fc;color:#c0b1ca;border-radius:6px;padding:6px 8px;font-size:10.5px}.platform-guide-bottom{margin-top:auto;padding-top:12px}.platform-guide-bottom small{color:#bfb1c8;font-size:10.5px}.platform-guide-bottom button{color:#aa95bf;background:#faf6fd;border-color:#eee3f5;font-size:12px;margin-top:10px;min-height:36px}.home-tutorial-banner{border:1px solid #ebe2f4;border-radius:14px;background:linear-gradient(110deg,#f0e9f8,#f7f3fc);padding:26px}.home-tutorial-banner h2{color:#8b779e;font-weight:600;font-size:19px}.home-tutorial-banner p{color:#b3a1c2}.lesson-next{background:#a18bbd;border-color:#a18bbd;font-weight:550}.home-faq{display:block}.faq-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.faq.home-faq details{background:#fff;border-color:#eee7f3;border-radius:10px}.faq.home-faq summary{color:#a08aad;font-size:13px;min-height:60px}.faq.home-faq details p{color:#baa7c6;font-size:12px;line-height:1.9}.faq.home-faq summary>span{color:#b49bc6;background-color:#faf3ff}.faq.home-faq details[open]{background:#fefbff;border-color:#dfcee9}@media(hover:hover){.benefit-card:hover{transform:translateY(-4px);box-shadow:0 14px 23px -20px rgba(var(--card-color),.38);border-color:rgba(var(--card-color),.26)}.platform-guide-card:hover{transform:translateY(-3px)}}@media(max-width:820px){.benefit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.benefit-card:nth-child(1),.benefit-card:nth-child(2){grid-column:auto}.platform-guide-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:680px){main{padding:0 18px}.header{padding:14px 18px;gap:12px}nav{gap:17px;font-size:12px}.hero{padding:29px 0 24px}.hero h1{font-size:29px;line-height:1.55}.hero h1>span{display:block}.hero>p{max-width:340px;font-size:12px}.editor,.preview-panel{padding:21px 18px}.editor{padding-bottom:0}textarea{font-size:16px}.home-highlights,.platform-guide{padding-top:30px}.home-highlights .section-title,.platform-guide .section-title,.home-faq .section-title{display:block;margin-bottom:17px}.home-highlights .section-title h2,.platform-guide .section-title h2,.home-faq .section-title h2{font-size:21px}.home-highlights .section-title>p,.platform-guide .section-title>p{display:block;margin-top:7px}.benefit-grid{gap:10px}.benefit-card{min-height:175px;padding:18px 15px}.benefit-card h3{font-size:13px}.benefit-card p{font-size:12px}.platform-guide-card{padding:18px}.faq-card-grid{grid-template-columns:1fr}}@media(max-width:440px){.benefit-grid,.platform-guide-grid{grid-template-columns:1fr}.benefit-card{min-height:0;display:grid;grid-template-columns:36px minmax(0,1fr);gap:0 12px}.benefit-icon{grid-row:1/3;margin:0}.benefit-card h3,.benefit-card p{grid-column:2}}@media(prefers-reduced-motion:reduce){.benefit-card:hover,.platform-guide-card:hover{transform:none}}nav a{color:#797184}.hero>p{color:#81768f}.input-explanation .editor-description{color:#81768e}.input-explanation h3{color:#8c7b9c}.hint,.supported-label{color:#8f829e}.platform-shortcut{color:#8b789c}.platform-shortcut[aria-pressed=true]{color:#7d6296}.benefit-card p{color:#8b7898}.benefit-card:nth-child(2) p{color:#7f93ac}.benefit-card:nth-child(3) p{color:#819d8b}.benefit-card:nth-child(4) p{color:#a28b79}.benefit-card:nth-child(5) p{color:#9c9064}.benefit-card:nth-child(6) p{color:#a48394}.platform-guide-card>p{color:#94839f}.platform-guide-card>code{color:#a391af}.platform-guide-bottom small{color:#aa96b6}.faq.home-faq summary{color:#91779f}.faq.home-faq details p{color:#a48caf}textarea{min-height:118px}:root{--ink:#302c3e;--muted:#726b82;--accent:#7254c2;--line:#dedbe8;--paper:#f1f0f7}body{color:#302c3e;background-color:#f1f0f7}.header{border-bottom-color:#e0dce9}.brand{color:#302c3e}.brand-icon{background:#7760c4}.brand-tag{color:#81778f}nav a{color:#62586f}nav a:hover,nav .nav-active{color:#7050bc}.service-badge{color:#7c6e8b;border-color:#e3dced}.hero .eyebrow{color:#8664b3;background:#ebe2f8;border-color:#d9cbed}.hero h1{color:#302c3e}.hero h1 span:not(.hero-prefix){background:linear-gradient(105deg,#805bc6,#a86ba3);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.hero>p{color:#756780}.hero-tags{color:#93839d}.hero-tags i{background:#b3a2be}.workspace{border-color:#ded5e8;box-shadow:0 16px 35px -23px #6c458633}.panel-heading h2{color:#51415f}.link-icon{color:#9972b6;background:#efe2f8}.input-explanation h3{color:#785e88}.input-explanation .editor-description{color:#766183}.input-box{border-color:#e0d0ec}.input-box:focus-within{border-color:#af88c9;box-shadow:0 0 0 3px #ac7fc110}textarea{color:#6c4f7c}textarea::placeholder{color:#b094bf}.input-toolbar{border-color:#ecdef4}.input-toolbar>span{color:#8d749b}.text-button{color:#9b74b1;border-color:#dfccec}.primary{background:linear-gradient(110deg,#7655bf,#9863af);box-shadow:0 5px 14px #9d6eb838}.primary:hover:not(:disabled){background:linear-gradient(110deg,#6848ad,#89559f);box-shadow:0 7px 19px #9d6eb84a}.hint,.supported-label{color:#8b709b}.platform-shortcut{color:#8e719f;border-color:#e7d7ef}.platform-shortcut[aria-pressed=true]{color:#946ba9;border-color:#cdb1e0;background:#eee0f6}.home-highlights .section-label,.platform-guide .section-label,.home-faq .section-label{color:#826292}.home-highlights .section-title h2,.platform-guide .section-title h2,.home-faq .section-title h2{color:#574265}.home-highlights .section-title>p,.platform-guide .section-title>p{color:#8a719a}.benefit-footnote{color:#b094bf}.lesson-next{background:#8960ad;border-color:#8960ad}.lesson-next:hover:not(:disabled){background:#7a519e;border-color:#7a519e}.notice{color:#9279a0}footer .brand{color:#9676aa}.footer-sub,footer>span{color:#9c83aa}.tutorial-platform-picker{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:0 0 24px}.tutorial-platform-picker button{display:flex;flex-direction:column;align-items:center;gap:5px;padding:15px 9px;border:1px solid #e6ddee;border-radius:11px;background:#fff;color:#917f9d;transition:background .2s,border-color .2s,transform .2s}.tutorial-platform-picker button>span{font-size:13px;font-weight:600}.tutorial-platform-picker small{font-size:11px;color:#b19dbe}.tutorial-platform-picker button[aria-pressed=true]{border-color:#c3a2d8;background:#f1e6f8;color:#9269a7}.tutorial-platform-picker button:hover{border-color:#cbb1dd;background:#faf5fd}.platform-tutorial-link{display:block;width:fit-content;margin-top:10px;font-size:12px;color:#ac91bd}.platform-tutorial-link:hover{color:#885da4;text-decoration:underline;text-underline-offset:3px}@media(max-width:680px){.tutorial-platform-picker{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.tutorial-platform-picker button{padding:12px 7px}.tutorial-platform-picker small{font-size:10px}}@media(prefers-reduced-motion:reduce){.tutorial-platform-picker button{transition:none}}.brand-icon{background:none;box-shadow:none;border-radius:0;width:40px;height:40px;padding:0}.brand-mark{display:block;width:40px;height:40px;object-fit:contain;flex-shrink:0}.brand{gap:9px}footer .brand-mark{width:28px;height:28px}@media(max-width:680px){.brand-icon,.brand-icon .brand-mark{width:35px;height:35px}}
