:root{--bg:#f6f7f9;--surface:#fff;--surface-soft:#fafbfc;--text:#1f2937;--muted:#6b7280;--line:#e5e7eb;--line-strong:#d1d5db;--accent:#2563eb;--accent-dark:#1d4ed8;--accent-soft:#eff6ff;--success:#15803d;--danger:#b42318;--shadow:0 8px 30px #0f172a0f}@media (prefers-color-scheme:dark){:root{--bg:#111418;--surface:#1a1e24;--surface-soft:#15191e;--text:#f3f4f6;--muted:#a1a1aa;--line:#2c323a;--line-strong:#414955;--accent:#76a7ff;--accent-dark:#9abfff;--accent-soft:#182b4c;--success:#6ee7a0;--danger:#fda29b;--shadow:0 8px 30px #0000002e}}*{box-sizing:border-box}html{background:var(--bg)}body{background:var(--bg);color:var(--text);margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}.shell{min-height:100vh}.nav{justify-content:space-between;align-items:center;gap:26px;max-width:1120px;margin:auto;padding:22px 24px;display:flex}.brand{letter-spacing:-.025em;align-items:center;gap:10px;font-size:18px;font-weight:750;display:flex}.brand-mark{color:#fff;letter-spacing:-.04em;background:#111827;border-radius:9px;place-items:center;width:34px;height:34px;font-size:12px;display:grid}.nav-links{color:var(--muted);gap:24px;margin-left:auto;margin-right:14px;font-size:14px;display:flex}.nav-links a:hover,.nav-cta:hover{color:var(--accent)}.nav-cta{color:var(--accent);white-space:nowrap;font-size:14px;font-weight:650}.hero{text-align:center;max-width:730px;margin:68px auto 0;padding:0 24px}.eyebrow,.step-label{color:var(--accent);letter-spacing:.12em;text-transform:uppercase;font-size:11px;font-weight:750}h1{letter-spacing:-.065em;margin:17px 0 18px;font-size:clamp(42px,6vw,66px);font-weight:760;line-height:1.02}.hero h1 span{color:var(--accent)}.hero p{max-width:590px;color:var(--muted);margin:0 auto;font-size:17px;line-height:1.65}.converter-shell{max-width:760px;margin:38px auto 0;padding:0 24px}.upload-panel,.conversion-panel,.job-panel{border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);border-radius:16px}.upload-panel{border:1.5px dashed var(--line-strong);text-align:center;place-items:center;min-height:294px;transition:background .15s,border-color .15s;display:grid}.upload-panel.is-dragging{border-color:var(--accent);background:var(--accent-soft)}.upload-panel-copy{width:100%;padding:38px 28px}.upload-badge{background:var(--accent-soft);width:50px;height:50px;color:var(--accent);border:1px solid #bfdbfe;border-radius:50%;place-items:center;margin:0 auto 18px;font-size:24px;display:grid}.upload-badge-loading{animation:1.2s ease-in-out infinite uploadPulse}.upload-panel h2,.conversion-panel h2,.job-panel h2{letter-spacing:-.025em;margin:7px 0 0;font-size:21px;line-height:1.25}.upload-panel p{color:var(--muted);margin:9px 0 20px;font-size:14px}.upload-hint{color:var(--muted);margin-top:15px;font-size:12px;display:block}.upload-progress{text-align:left;max-width:430px;margin:26px auto 0}.upload-progress-top{color:var(--muted);justify-content:space-between;font-size:13px;display:flex}.upload-progress-top strong{color:var(--accent)}@keyframes uploadPulse{0%,to{opacity:1;transform:translateY(0)}50%{opacity:.65;transform:translateY(-3px)}}.button{border:1px solid var(--accent);background:var(--accent);color:#fff;border-radius:9px;justify-content:center;align-items:center;min-height:44px;padding:0 18px;font-size:14px;font-weight:700;transition:background .15s,border-color .15s,opacity .15s;display:inline-flex}.button:hover{background:var(--accent-dark);border-color:var(--accent-dark)}.button.secondary{border-color:var(--line-strong);background:var(--surface);color:var(--text)}.button.secondary:hover{background:var(--surface-soft)}.button:disabled{cursor:not-allowed;opacity:.55}.text-button{color:var(--accent);background:0 0;border:0;padding:4px 0;font-size:13px;font-weight:650}.text-button:hover{text-decoration:underline}.conversion-panel,.job-panel{padding:26px}.panel-heading,.job-status-row{justify-content:space-between;align-items:flex-start;gap:18px;display:flex}.selected-file{border:1px solid var(--line);background:var(--surface-soft);border-radius:11px;align-items:center;gap:13px;margin-top:20px;padding:14px;display:flex}.file-type-icon{background:var(--accent-soft);width:40px;height:40px;color:var(--accent);border-radius:9px;flex:0 0 40px;place-items:center;font-size:19px;display:grid}.selected-file-info{gap:3px;min-width:0;display:grid}.selected-file-info strong{text-overflow:ellipsis;white-space:nowrap;font-size:14px;overflow:hidden}.selected-file-info small{color:var(--muted);font-size:12px}.ready-mark{color:var(--success);margin-left:auto;font-weight:800}.conversion-divider{background:var(--line);height:1px;margin:26px 0}.format-selector{align-items:center;gap:12px;margin-top:19px;display:flex}.from-format,.format-selector select{border:1px solid var(--line-strong);background:var(--surface);min-height:46px;color:var(--text);border-radius:9px;padding:0 14px;font-size:14px;font-weight:700}.from-format{background:var(--surface-soft);color:var(--muted);align-items:center;display:flex}.format-selector select{outline:none;flex:1;min-width:100px}.format-selector select:focus,input:focus,.advanced-settings select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.arrow{color:var(--muted);font-size:18px}.advanced-toggle{color:var(--accent);background:0 0;border:0;align-items:center;gap:7px;margin-top:18px;font-size:13px;font-weight:650;display:flex}.advanced-toggle span{font-size:19px;font-weight:400}.advanced-settings{border-top:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:13px;margin-top:16px;padding-top:18px;display:grid}.advanced-settings label{color:var(--muted);gap:6px;font-size:12px;display:grid}.advanced-settings input,.advanced-settings select{border:1px solid var(--line-strong);background:var(--surface);width:100%;min-height:40px;color:var(--text);border-radius:8px;outline:none;padding:0 10px}.advanced-settings input[type=checkbox]{width:16px;min-height:16px;accent-color:var(--accent)}.check-setting{align-self:end;align-items:center;padding-bottom:11px;gap:8px!important;display:flex!important}.convert-button{width:100%;margin-top:24px}.job-panel{padding:28px}.job-status-row strong{color:var(--accent);font-size:18px}.progress-track{background:var(--surface-soft);border-radius:99px;height:8px;margin-top:22px;overflow:hidden}.progress-value{border-radius:inherit;background:var(--accent);min-width:2px;height:100%;transition:width .35s}.job-meta{color:var(--muted);justify-content:space-between;gap:12px;margin-top:12px;font-size:12px;display:flex}.cancel-button{margin-top:19px;display:block}.complete-state{text-align:center}.complete-icon{width:52px;height:52px;color:var(--success);background:#ecfdf3;border-radius:50%;place-items:center;margin:0 auto 17px;font-size:27px;font-weight:800;display:grid}.complete-state .step-label{display:block}.complete-state h2{margin-top:9px}.complete-state p{color:var(--muted);margin:9px auto 0;font-size:14px}.complete-state small{color:var(--muted);margin-top:19px;font-size:12px;display:block}.result-actions{justify-content:center;gap:10px;margin-top:23px;display:flex}.error-state .complete-icon{color:var(--danger);background:#fff1f0}.notice{color:var(--danger);background:#fff7f7;border:1px solid #fecaca;border-radius:9px;margin-top:14px;padding:13px 15px;font-size:13px}.popular,.feature-section{max-width:1120px;margin:78px auto 0;padding:0 24px}.section-title{text-align:center;margin-bottom:22px}.section-title h2{letter-spacing:-.04em;margin:0 0 7px;font-size:27px}.section-title p{color:var(--muted);margin:0;font-size:14px}.chips{flex-wrap:wrap;justify-content:center;gap:9px;display:flex}.chip{border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:8px;align-items:center;gap:10px;padding:10px 13px;font-size:12px;display:flex}.chip:hover{border-color:var(--accent);color:var(--accent)}.chip span{color:var(--muted)}.chip strong{color:var(--text);font-size:12px}.feature-grid,.tool-grid{grid-template-columns:repeat(4,1fr);gap:13px;display:grid}.feature,.tool-card{border:1px solid var(--line);background:var(--surface);border-radius:12px;padding:20px}.feature-number{color:var(--accent);font-size:12px;font-weight:750}.feature h3{margin:18px 0 7px;font-size:15px}.feature p,.tool-card p{color:var(--muted);margin:0;font-size:13px;line-height:1.55}.footer{border-top:1px solid var(--line);max-width:1120px;color:var(--muted);justify-content:space-between;margin:78px auto 0;padding:24px;font-size:12px;display:flex}.page{max-width:1120px;margin:45px auto;padding:0 24px}.page h1{max-width:700px;margin-bottom:14px;font-size:48px}.page-lead{max-width:650px;color:var(--muted);margin:0;line-height:1.65}.tool-card{min-height:150px}.tool-card h3{margin:16px 0 7px;font-size:16px}.tool-card a{color:var(--accent);margin-top:17px;font-size:13px;font-weight:650;display:inline-block}.bulk-panel{overflow:hidden}.bulk-percent{color:var(--accent);flex:none;font-size:18px}.bulk-total-progress{margin-top:18px}.bulk-list{gap:8px;max-height:365px;margin-top:18px;padding-right:2px;display:grid;overflow-y:auto}.bulk-item{border:1px solid var(--line);background:var(--surface-soft);border-radius:10px;align-items:center;gap:11px;min-width:0;padding:12px;display:flex}.bulk-item-info{flex:1;gap:3px;min-width:0;display:grid}.bulk-item-info strong{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:13px;overflow:hidden}.bulk-item-info small{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--muted);font-size:12px;overflow:hidden}.bulk-item-info .progress-track{width:100%;height:5px;margin-top:5px}.bulk-item-percent,.bulk-error{min-width:38px;color:var(--muted);text-align:right;flex:none;font-size:12px}.bulk-error{color:var(--danger);font-weight:800}.ready-list{max-height:240px}.ready-list .bulk-item{background:var(--surface)}.bulk-help{color:var(--muted);margin:15px 0 0;font-size:12px}.bulk-actions{border-top:1px solid var(--line);justify-content:flex-end;align-items:center;gap:10px;margin-top:24px;padding-top:20px;display:flex}.bulk-summary{flex:1;gap:4px;min-width:0;margin-right:auto;display:grid}.bulk-summary strong{font-size:14px}.bulk-summary span{color:var(--muted);font-size:12px}.job-list .text-button{white-space:nowrap;flex:none}@media (max-width:760px){.nav{padding:17px 18px}.nav-links,.nav-cta span{display:none}.hero{margin-top:42px;padding:0 18px}.hero p{font-size:15px}.converter-shell{padding:0 15px}.conversion-panel,.job-panel{padding:21px 18px}.upload-panel{min-height:270px}.format-selector{flex-wrap:wrap}.from-format,.format-selector select{flex:1}.arrow{text-align:center;flex-basis:100%;transform:rotate(90deg)}.advanced-settings,.feature-grid,.tool-grid{grid-template-columns:1fr}.job-meta{flex-direction:column;gap:5px}.result-actions{flex-direction:column}.result-actions .button{width:100%}.popular,.feature-section{margin-top:60px;padding:0 15px}.footer{flex-direction:column;gap:8px;margin-top:60px;padding:22px 18px}.page{margin-top:30px;padding:0 18px}.page h1{font-size:39px}}.notification-option{border:1px solid var(--line);background:var(--surface-soft);color:var(--text);cursor:pointer;border-radius:9px;align-items:center;gap:10px;margin-top:16px;padding:12px 13px;display:flex}.notification-option input{width:16px;height:16px;accent-color:var(--accent)}.notification-option span{gap:2px;display:grid}.notification-option strong{font-size:12px}.notification-option small{color:var(--muted);font-size:10px}.favicon-page{text-align:center;max-width:980px;margin:48px auto 0;padding:0 24px 70px}.favicon-page h1{max-width:720px;margin:17px auto 18px;font-size:clamp(39px,5vw,58px)}.favicon-page .page-lead{max-width:650px;margin:0 auto}.favicon-card{border:1.5px dashed var(--line-strong);background:var(--surface);max-width:860px;min-height:390px;box-shadow:var(--shadow);border-radius:18px;margin:36px auto 0;transition:border-color .15s,background .15s}.favicon-card.is-dragging{border-color:var(--accent);background:var(--accent-soft)}.favicon-empty{padding:62px 24px}.favicon-upload-icon{background:var(--accent-soft);width:64px;height:64px;color:var(--accent);border:1px solid #bfdbfe;border-radius:18px;place-items:center;margin:0 auto 18px;font-size:30px;display:grid}.favicon-empty h2,.favicon-details h2{letter-spacing:-.03em;margin:0;font-size:22px}.favicon-empty p{color:var(--muted);margin:9px 0 20px;font-size:14px}.favicon-empty small{color:var(--muted);margin-top:15px;font-size:12px;display:block}.favicon-work{text-align:left;grid-template-columns:1fr 1.1fr;align-items:center;gap:34px;padding:38px;display:grid}.favicon-preview-wrap{border:1px solid var(--line);background:repeating-conic-gradient(#f3f5f8 0 25%, #fff 0 50%) 50% / 20px 20px;border-radius:14px;min-width:0;padding:26px}.favicon-preview-large{place-items:center;min-height:220px;display:grid}.favicon-preview-large img{object-fit:contain;filter:drop-shadow(0 9px 14px #0f172a1f);width:190px;height:190px}.favicon-tab-demo{border:1px solid var(--line);background:var(--surface);width:max-content;max-width:100%;color:var(--muted);border-radius:7px 7px 0 0;align-items:center;gap:7px;padding:7px 11px;font-size:11px;display:flex}.favicon-tab-demo img{object-fit:contain;width:16px;height:16px}.favicon-details{min-width:0}.favicon-details h2{text-overflow:ellipsis;white-space:nowrap;margin-top:9px;overflow:hidden}.favicon-details>p{color:var(--muted);margin:6px 0 20px;font-size:13px}.favicon-size-list{border-top:1px solid var(--line);border-bottom:1px solid var(--line);flex-wrap:wrap;gap:7px;padding:16px 0;display:flex}.favicon-size-list span{border:1px solid var(--line);background:var(--surface-soft);color:var(--muted);border-radius:7px;padding:7px 9px;font-size:11px;font-weight:700}.favicon-actions{flex-wrap:wrap;align-items:center;gap:14px;margin-top:22px;display:flex}.favicon-progress{text-align:left;max-width:860px;margin:16px auto 0}.favicon-progress .progress-track{margin-top:0}.favicon-progress>span{color:var(--muted);margin-top:7px;font-size:12px;display:block}.favicon-success{max-width:860px;color:var(--success);text-align:left;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:9px;margin:16px auto 0;padding:13px 15px;font-size:13px}.favicon-features{text-align:left;grid-template-columns:repeat(3,1fr);gap:12px;margin:42px auto 0;display:grid}.favicon-features div{border:1px solid var(--line);background:var(--surface);border-radius:11px;gap:6px;padding:18px;display:grid}.favicon-features strong{font-size:13px}.favicon-features span{color:var(--muted);font-size:12px;line-height:1.5}@media (max-width:760px){.favicon-page{margin-top:30px;padding:0 15px 50px}.favicon-card{margin-top:28px}.favicon-work{grid-template-columns:1fr;gap:20px;padding:20px}.favicon-preview-wrap{padding:16px}.favicon-preview-large{min-height:180px}.favicon-preview-large img{width:150px;height:150px}.favicon-actions .button{flex:1}.favicon-features{grid-template-columns:1fr;margin-top:28px}}
