.source-section{display:flex;flex-direction:column;gap:1.5rem}.file-info{display:flex;justify-content:space-between;align-items:center;padding:1rem;background:var(--bg-secondary);border-radius:8px}.file-name{font-weight:500;word-break:break-all}.file-size{color:var(--text-secondary);white-space:nowrap;margin-left:1rem}.preview-container{display:flex;justify-content:center}.source-preview{max-width:200px;max-height:200px;border-radius:8px;object-fit:contain}.generate-btn{width:100%;padding:1rem;font-size:1.1rem}.tip-text{text-align:center;color:var(--text-secondary);font-size:.9rem;margin-top:1rem}.processing-status{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:3rem}.spinner{width:40px;height:40px;border:3px solid var(--bg-secondary);border-top-color:var(--accent-color);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-message{display:flex;flex-direction:column;align-items:center;gap:1rem;padding:2rem;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:var(--color-error)}.result-section{display:flex;flex-direction:column;gap:1.5rem}.action-buttons{display:flex;gap:1rem;flex-wrap:wrap}.action-buttons.top{justify-content:center}.favicon-grid{display:flex;flex-direction:column;gap:.75rem}.favicon-item{display:flex;align-items:center;gap:1rem;padding:.75rem 1rem;background:var(--bg-secondary);border-radius:8px}.favicon-preview{display:flex;align-items:center;justify-content:center;background:repeating-conic-gradient(#ccc 0% 25%,#fff 0% 50%) 50% / 16px 16px;border-radius:4px;overflow:hidden;flex-shrink:0}.favicon-preview img{width:100%;height:100%;object-fit:contain}.favicon-info{flex:1;display:flex;flex-direction:column;gap:.125rem}.favicon-label{font-weight:500;font-size:.9rem}.favicon-filename{font-family:Menlo,monospace;font-size:.8rem;color:var(--text-secondary)}.favicon-size{font-size:.75rem;color:var(--text-secondary)}.html-snippet{display:flex;flex-direction:column;gap:.5rem}.snippet-header{font-weight:500}.snippet-code{padding:1rem;background:var(--bg-secondary);border-radius:8px;font-family:Menlo,Monaco,monospace;font-size:.8rem;overflow-x:auto;white-space:pre;line-height:1.5}.privacy-note{margin-top:2rem;padding:1rem;background:var(--bg-secondary);border-radius:8px;text-align:center;font-size:.9rem;color:var(--text-secondary)}
