.favicon-generator .upload-section{margin-bottom:16px}.favicon-generator .upload-section .upload-area{border:2px dashed var(--teb-hairline);border-radius:14px;padding:48px 24px;text-align:center;cursor:pointer;transition:border-color .15s ease,background .15s ease;background:var(--teb-canvas)}.favicon-generator .upload-section .upload-area:hover{border-color:var(--teb-primary);background:var(--teb-primary-tint)}.favicon-generator .upload-section .upload-area svg{color:var(--teb-primary);margin-bottom:16px}.favicon-generator .settings-section{background:var(--teb-surface);border-radius:14px;padding:24px;margin-bottom:16px;border:1px solid var(--teb-hairline);box-shadow:var(--teb-shadow-card)}.favicon-generator .settings-section .settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:24px}.favicon-generator .settings-section .settings-grid .setting-group{display:flex;flex-direction:column}.favicon-generator .settings-section .settings-grid .setting-group label{font-weight:500;color:var(--teb-ink);margin-bottom:8px;font-size:13px}.favicon-generator .settings-section .settings-grid .setting-group input,.favicon-generator .settings-section .settings-grid .setting-group select{padding:8px 12px;border:1px solid var(--teb-hairline);border-radius:8px;font-size:13px;background:var(--teb-canvas);color:var(--teb-ink);transition:border-color .15s ease}.favicon-generator .settings-section .settings-grid .setting-group input:focus,.favicon-generator .settings-section .settings-grid .setting-group select:focus{outline:none;border-color:var(--teb-primary);box-shadow:var(--teb-ring)}.favicon-generator .settings-section .settings-grid .setting-group input[type=range]{padding:0}.favicon-generator .settings-section .settings-grid .setting-group .color-input-group{display:flex;gap:8px}.favicon-generator .settings-section .settings-grid .setting-group .color-input-group input[type=color]{width:40px;height:40px;padding:0;border:none;border-radius:6px;cursor:pointer}.favicon-generator .settings-section .settings-grid .setting-group .color-input-group input[type=text]{flex:1}.favicon-generator .preview-section{background:var(--teb-surface);border-radius:14px;padding:24px;margin-bottom:16px;border:1px solid var(--teb-hairline);box-shadow:var(--teb-shadow-card)}.favicon-generator .preview-section .preview-container{display:flex;justify-content:center;align-items:center;min-height:200px}.favicon-generator .preview-section .preview-container .preview-image{position:relative;width:200px;height:200px;border-radius:14px;overflow:hidden;box-shadow:var(--teb-shadow-card)}.favicon-generator .preview-section .preview-container .preview-image img{width:100%;height:100%;object-fit:cover}.favicon-generator .results-section{background:var(--teb-surface);border-radius:14px;padding:24px;border:1px solid var(--teb-hairline);box-shadow:var(--teb-shadow-card)}.favicon-generator .results-section .results-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.favicon-generator .results-section .favicons-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:16px;margin-bottom:32px}.favicon-generator .results-section .favicons-grid .favicon-card{background:var(--teb-canvas);border-radius:8px;padding:16px;text-align:center;border:1px solid var(--teb-hairline);transition:transform .15s ease,border-color .15s ease}.favicon-generator .results-section .favicons-grid .favicon-card:hover{transform:translateY(-2px);border-color:var(--teb-primary)}.favicon-generator .results-section .favicons-grid .favicon-card .favicon-preview{margin-bottom:12px}.favicon-generator .results-section .favicons-grid .favicon-card .favicon-preview img{width:48px;height:48px;border-radius:4px}.favicon-generator .results-section .html-code-section .html-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.favicon-generator .results-section .html-code-section .html-code{background:var(--teb-canvas);border:1px solid var(--teb-hairline);border-radius:8px;padding:16px;overflow-x:auto}.favicon-generator .results-section .html-code-section .html-code pre{margin:0;font-family:var(--teb-font-mono);font-size:13px;line-height:1.55;color:var(--teb-ink)}@media (max-width: 768px){.favicon-generator .settings-grid{grid-template-columns:1fr}.favicon-generator .results-header{flex-direction:column;gap:12px;align-items:stretch}.favicon-generator .favicons-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.favicon-generator .html-header{flex-direction:column;gap:12px;align-items:stretch}.favicon-generator .upload-area{padding:32px 16px}}