.favicon-generator-page{--tool-accent:#7046ff}.favicon-generator-page .panel-heading-row{flex-wrap:wrap}.favicon-generator-page :is(h1,h2,h3){overflow-wrap:anywhere}.favicon-generator-page .tool-faq>div,.favicon-generator-page .tool-faq-list summary strong{min-width:0}.favicon-generator-page .tool-faq-list :is(summary strong,details>p){overflow-wrap:anywhere}.favicon-upload{text-align:center;justify-items:center;gap:18px;padding:44px 12px;display:grid}.favicon-upload h2,.favicon-upload p{margin:0}.favicon-upload-icon{color:#7046ff;background:#f1edff;border-radius:22px;place-items:center;width:76px;height:76px;font-size:38px;display:grid}.favicon-upload .primary-action{max-width:480px;margin:8px 0}.favicon-hint{color:#526a93;font-size:.94rem;line-height:1.65}.favicon-feedback{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.favicon-feedback p{color:#526a93;margin:0}.favicon-editor{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;display:grid}.favicon-editor>section{background:#fafcff;border:1px solid #d7e3fb;border-radius:22px;min-width:0;padding:26px}.favicon-editor h2{margin:0 0 12px;font-size:clamp(1.2rem,2vw,1.7rem)}.favicon-editor h3{margin:0 0 10px;font-size:1rem}.favicon-source-meta{overflow-wrap:anywhere;color:#526a93;font-size:.92rem;line-height:1.5}.favicon-settings{gap:16px;margin-top:24px;display:grid}.favicon-settings fieldset{min-width:0;border:0;min-inline-size:0;margin:0;padding:0}.favicon-settings legend{margin-bottom:10px;padding:0;font-weight:800}.favicon-fit-options{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;display:grid}.favicon-fit-options label{cursor:pointer;background:#fff;border:1px solid #d4e2fa;border-radius:12px;align-items:center;gap:8px;padding:14px 12px;display:flex}.favicon-fit-options label:has(input:checked){background:#f5f1ff;border-color:#7046ff}.favicon-fit-options span,.favicon-check span{overflow-wrap:anywhere}.favicon-settings input[type=radio],.favicon-settings input[type=checkbox]{accent-color:#7046ff;flex-shrink:0;width:18px;height:18px}.favicon-settings .favicon-hint{margin:0}.favicon-check{cursor:pointer;align-items:center;gap:10px;display:flex}.favicon-color{gap:10px;font-weight:700;display:grid}.favicon-color>span:last-child{background:#fff;border:1px solid #d4e2fa;border-radius:12px;align-items:center;gap:12px;min-height:48px;padding:8px 12px;display:flex}.favicon-color input{background:0 0;border:0;width:48px;height:30px;padding:0}.favicon-package-note{background:#f0f4ff;border-radius:14px;margin-top:24px;padding:16px}.favicon-package-note p{overflow-wrap:anywhere;margin:0;line-height:1.7}.favicon-checkerboard{background-color:#fff;background-image:linear-gradient(45deg,#dce5f4 25%,#0000 25%),linear-gradient(-45deg,#dce5f4 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#dce5f4 75%),linear-gradient(-45deg,#0000 75%,#dce5f4 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px}.favicon-large-preview{text-align:center;max-width:300px;margin:20px auto}.favicon-large-preview .favicon-checkerboard{aspect-ratio:1;border:1px solid #d4e2fa;border-radius:14px;overflow:hidden}.favicon-large-preview canvas{width:100%;height:auto;display:block}.favicon-small-previews{flex-wrap:wrap;justify-content:center;gap:20px;display:flex}.favicon-small-previews figure{align-content:end;justify-items:center;gap:10px;min-width:58px;margin:0;display:grid}.favicon-small-previews .favicon-checkerboard{display:flex}.favicon-small-previews canvas{max-width:none;display:block}.favicon-editor figcaption{color:#526a93;margin-top:10px;font-size:.82rem}.favicon-export-panel{grid-column:1/-1}.favicon-export-panel>.primary-action{max-width:520px;margin-bottom:24px}.favicon-export-panel>p{line-height:1.75}.favicon-result{background:#e8f7f3;border-radius:14px;margin-bottom:24px;padding:16px}.favicon-result p{margin:0 0 12px}.favicon-snippet{color:#17335c;white-space:pre-wrap;overflow-wrap:anywhere;background:#fff;border:1px solid #d4e2fa;border-radius:12px;max-width:100%;margin:18px 0 0;padding:16px;font-size:.84rem;line-height:1.7;overflow:auto}.favicon-generator-page button:disabled{opacity:.55;cursor:not-allowed}.favicon-generator-page .primary-action,.favicon-generator-page .secondary-action{white-space:normal;overflow-wrap:anywhere;text-align:center;min-width:0;height:auto}@media (width<=900px){.favicon-editor{grid-template-columns:minmax(0,1fr)}}@media (width<=720px){.favicon-generator-page .tool-intro{flex-direction:column;align-items:flex-start;gap:16px}.favicon-generator-page .tool-intro>div{width:100%}.favicon-generator-page .tool-intro h1{text-align:left;line-height:1.15}.favicon-generator-page .tool-intro>.responsive-character{align-self:flex-end;margin:0}.favicon-generator-page .tool-faq{grid-template-columns:minmax(0,1fr)}}@media (width<=520px){.favicon-editor>section{padding:16px}.favicon-upload{padding:26px 0}.favicon-upload .primary-action{width:100%}.favicon-fit-options{grid-template-columns:minmax(0,1fr)}.favicon-feedback .secondary-action,.favicon-export-panel>.primary-action{width:100%}}