body { width: 360px; margin: 0; font-family: 'Avenir Next', sans-serif; background: #1e1e2e; color: #cdd6f4; } .popup-shell { padding: 16px; background: linear-gradient(145deg, #313244, #1e1e2e 42%); } header h1 { margin: 0 0 12px; font-size: 1.2rem; } header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; } .extension-logo { display: block; width: 150px; height: 42px; margin-bottom: 0; object-fit: contain; object-position: left center; } .feed-link { color: #b4befe; font-family: 'Asset', 'Avenir Next', sans-serif; font-size: 0.95rem; font-weight: 700; text-decoration: none; } .feed-link:hover { color: #cba6f7; text-decoration: underline; } label { display: block; margin-bottom: 12px; font-size: 0.85rem; font-weight: 600; color: #a6adc8; } input, textarea, button { width: 100%; box-sizing: border-box; font: inherit; } input, textarea { margin-top: 6px; border: 1px solid #585b70; border-radius: 8px; padding: 8px 10px; background: #313244; color: #cdd6f4; } textarea { resize: vertical; } fieldset { display: grid; gap: 8px; margin: 0; padding: 10px; border: 1px solid #585b70; border-radius: 8px; } legend { padding: 0 4px; color: #b4befe; font-weight: 600; } .tag-options { display: flex; flex-wrap: wrap; gap: 6px 10px; } .tag-options label { display: flex; align-items: center; gap: 4px; font-weight: 400; } .actions { display: flex; gap: 8px; } button { border: 1px solid #cba6f7; border-radius: 8px; padding: 10px 12px; cursor: pointer; font-weight: 600; background: #cba6f7; color: #11111b; } #submit-link { background: #cba6f7; color: #11111b; } .secondary { background: #45475a; border-color: #585b70; color: #cdd6f4; } .status { margin-bottom: 10px; border-radius: 8px; padding: 8px 10px; font-size: 0.8rem; } .status.success { background: #1e3a38; color: #94e2d5; } .status.error { background: #45243a; color: #f38ba8; } .hidden { display: none; }