:root {
  --bg: #100e0c;
  --bg-raised: #18140f;
  --bg-raised-2: #1e1712;
  --border: rgba(255, 255, 255, 0.1);
  --border-hover: rgba(255, 255, 255, 0.25);
  --text: #ffffff;
  --text-dim: rgba(255, 255, 255, 0.6);
  --text-dimmer: rgba(255, 255, 255, 0.52);
  --text-dimmest: rgba(255, 255, 255, 0.3);
  --red: #C8722F;
  --red-hover: #A85F26;
  --green: #22c55e;
  --green-hover: #16a34a;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color-scheme: dark;
  overflow-x: hidden;
  overflow-x: clip; /* clip (not hidden) so sticky side panels keep following the page */
}

a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ---------- Header ---------- */
.site-header {
  position: sticky;
  top: 0;
  z-index: 40;
  background: rgba(13, 13, 13, 0.95);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--border);
}
/* #site-header/#site-footer start empty and get their real content
   injected by JS after the HTML parses — reserving roughly their real
   rendered height here keeps that insertion from visibly shifting
   everything below it (this is most of this site's Cumulative Layout
   Shift score). Approximate is fine; exact isn't needed. */
#site-header { min-height: 73px; }
#site-footer { min-height: 320px; }
.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 64px;
}
.logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 18px;
  font-weight: 800;
}
.logo svg { width: 32px; height: 32px; }
.logo .accent { color: var(--red); }
.nav-links {
  display: flex;
  align-items: center;
  gap: 24px;
  font-size: 14px;
  font-weight: 500;
  color: var(--text-dim);
}
.nav-links a:hover { color: var(--text); }

/* "Products" dropdown — native <details>/<summary>, so opening it works
   identically via click, tap, or keyboard with zero JS. summary's default
   disclosure triangle is hidden and replaced with a small chevron that
   matches the rest of the nav's styling. */
.nav-dropdown { position: relative; }
.nav-dropdown summary {
  list-style: none; cursor: pointer; display: flex; align-items: center; gap: 4px;
  color: var(--text-dim); font-size: 14px; font-weight: 500;
}
.nav-dropdown summary::-webkit-details-marker { display: none; }
.nav-dropdown summary:hover { color: var(--text); }
.nav-dropdown summary::after {
  content: ""; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg); margin-top: -3px; transition: transform 0.15s;
}
.nav-dropdown[open] summary::after { transform: rotate(-135deg); margin-top: 3px; }
.nav-dropdown-menu {
  position: absolute; top: calc(100% + 12px); right: 0; min-width: 170px;
  background: #161616; border: 1px solid var(--border); border-radius: 10px;
  padding: 6px; display: flex; flex-direction: column; gap: 2px;
  box-shadow: 0 12px 32px rgba(0,0,0,0.5); z-index: 50;
}
.nav-dropdown-menu a {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 9px 12px; border-radius: 6px; font-size: 14px; font-weight: 500;
  color: var(--text-dim); white-space: nowrap;
}
.nav-dropdown-menu a:hover { background: rgba(255,255,255,0.06); color: var(--text); }
.nav-dropdown-menu .ext-arrow { color: var(--text-dimmest); font-size: 12px; }
.header-right { display: flex; align-items: center; gap: 12px; }
.badge-pill {
  border: 1px solid var(--border-hover);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  color: var(--text-dim);
}
.btn-white {
  background: #fff;
  color: #000;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 700;
}
.btn-white:hover { background: rgba(255,255,255,0.9); }

.hamburger-btn {
  display: none; background: transparent; border: 1px solid var(--border-hover);
  border-radius: 8px; width: 38px; height: 38px; align-items: center; justify-content: center;
  color: #fff;
}
.hamburger-btn svg { width: 20px; height: 20px; }

.mobile-nav {
  display: none; flex-direction: column; border-top: 1px solid var(--border);
  background: var(--bg); padding: 8px 0;
}
.mobile-nav.open { display: flex; }
.mobile-nav a {
  padding: 14px 24px; font-size: 15px; font-weight: 600; color: rgba(255,255,255,0.85);
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.mobile-nav a:last-child { border-bottom: none; }
.mobile-nav a:hover { color: #fff; background: rgba(255,255,255,0.03); }
.header-account-btn { display: inline-block; }

@media (max-width: 960px) {
  .nav-links, .badge-pill, .header-account-btn { display: none; }
  .hamburger-btn { display: flex; }
}

/* ---------- Hero ---------- */
.hero { padding: 80px 0 60px; }
.hero h1 { font-size: 48px; font-weight: 900; line-height: 1.05; margin: 0 0 20px; }
@media (min-width: 640px) { .hero h1 { font-size: 60px; } }
.hero p { max-width: 480px; color: var(--text-dim); font-size: 18px; line-height: 1.6; margin: 0 0 28px; }

/* ---------- Format Picker Widget ---------- */
.format-picker { display: flex; align-items: center; gap: 12px; position: relative; }
.fp-box {
  width: 128px; display: flex; flex-direction: column; align-items: center; gap: 8px;
  border: 1px solid var(--border); background: var(--bg-raised); border-radius: 12px;
  padding: 20px 16px; color: #fff; position: relative; border-width: 1px;
}
.fp-box.target { background: var(--bg-raised-2); }
.fp-box:hover { border-color: var(--border-hover); }
.fp-box svg.file-icon { width: 32px; height: 32px; color: rgba(255,255,255,0.7); }
.fp-box.target svg.file-icon { color: rgba(227,148,91,0.8); }
.fp-box .fp-label { font-size: 14px; font-weight: 700; letter-spacing: 0.5px; }
.fp-box .fp-chevron { width: 14px; height: 14px; color: var(--text-dimmer); }

.fp-swap-col { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 0 2px; }
.fp-swap-line { width: 24px; height: 1px; background: rgba(255,255,255,0.15); }
.fp-swap-btn {
  width: 36px; height: 36px; display: flex; align-items: center; justify-content: center;
  border-radius: 999px; border: 1px solid rgba(200,114,47,0.4); background: rgba(200,114,47,0.1); color: var(--red);
}
.fp-swap-btn:hover { background: rgba(200,114,47,0.2); }
.fp-swap-btn svg { width: 16px; height: 16px; }
.fp-swap-label { font-size: 10px; font-weight: 700; letter-spacing: 1px; color: var(--text-dimmer); }

.fp-dropdown {
  position: fixed; z-index: 50; background: var(--bg-raised); border: 1px solid var(--border);
  border-radius: 12px; box-shadow: 0 25px 50px rgba(0,0,0,0.5); overflow: hidden;
  max-width: calc(100vw - 24px);
}
.fp-search { display: flex; align-items: center; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--border); }
.fp-search svg { width: 16px; height: 16px; color: var(--text-dimmer); flex-shrink: 0; }
.fp-search input { width: 100%; min-width: 0; background: transparent; border: none; outline: none; color: #fff; font-size: 14px; }
.fp-search input::placeholder { color: var(--text-dimmer); }

.fp-body { display: flex; max-height: 356px; min-width: 0; }
.fp-categories { width: 150px; flex-shrink: 0; overflow-y: auto; overflow-x: hidden; border-right: 1px solid var(--border); padding: 8px 0; }
.fp-cat-item {
  width: 100%; display: flex; align-items: center; justify-content: space-between; text-align: left;
  padding: 10px 12px; font-size: 13px; color: var(--text-dim); background: transparent; border: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.fp-cat-item:hover, .fp-cat-item.active { background: rgba(255,255,255,0.05); color: #fff; }
.fp-cat-item svg { width: 14px; height: 14px; opacity: 0.5; flex-shrink: 0; }

.fp-grid {
  flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px; padding: 12px; overflow-y: auto; overflow-x: hidden; align-content: start;
}
.fp-format-btn {
  min-width: 0; border: 1px solid var(--border); background: rgba(255,255,255,0.03); color: rgba(255,255,255,0.8);
  border-radius: 6px; padding: 10px 6px; font-size: 12px; font-weight: 700; letter-spacing: 0.3px; text-align: center;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.fp-format-btn:hover { border-color: var(--border-hover); background: rgba(255,255,255,0.07); }
.fp-format-btn.selected { border-color: var(--red); background: var(--red); color: #fff; }
.fp-empty { grid-column: 1 / -1; text-align: center; padding: 32px 0; color: var(--text-dimmer); font-size: 14px; }

@media (max-width: 480px) {
  .fp-categories { width: 110px; }
  .fp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 400px) {
  .format-picker { gap: 6px; }
  .fp-box { width: 96px; padding: 14px 8px; }
  .fp-box svg.file-icon { width: 24px; height: 24px; }
  .fp-box .fp-label { font-size: 12px; }
  .fp-swap-btn { width: 30px; height: 30px; }
  .fp-swap-btn svg { width: 13px; height: 13px; }
}

/* ---------- Privacy strip ---------- */

/* ---------- Format catalog ---------- */

/* ---------- Footer ---------- */
.site-footer { border-top: 1px solid var(--border); background: var(--bg); }
/* Footer: brand on its own row on phones/tablets, two link columns per row on
   phones, four across on tablets, and brand + four columns on desktop. */
.footer-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px 24px; padding-top: 48px; padding-bottom: 40px; }
.footer-brand { grid-column: 1 / -1; }
@media (min-width: 768px) { .footer-grid { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1024px) { .footer-grid { grid-template-columns: 1.5fr repeat(4, 1fr); gap: 32px; } .footer-brand { grid-column: auto; } }
.footer-brand p { color: var(--text-dimmer); font-size: 14px; margin-top: 12px; max-width: 280px; line-height: 1.55; }
.footer-col h4 { font-size: 14px; font-weight: 700; margin: 0 0 12px; }
.footer-col ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.footer-col a { font-size: 14px; color: var(--text-dimmer); }
.footer-col a:hover { color: rgba(255,255,255,0.8); }
.footer-col a.footer-more { color: #E3945B; font-weight: 600; }
.footer-col a.footer-more:hover { color: #f0aa78; }
.footer-bottom-left { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; }
.footer-legal { display: flex; gap: 18px; }
.footer-legal a { font-size: 13px; color: var(--text-dimmer); }
.footer-legal a:hover { color: rgba(255,255,255,0.8); }
.footer-bottom-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 24px; border-top: 1px solid var(--border); }
.footer-payments { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pay-badge { font-size: 11px; font-weight: 600; letter-spacing: 0.2px; color: var(--text-dimmer); background: rgba(255,255,255,0.04); border: 1px solid var(--border); border-radius: 5px; padding: 4px 9px; }
.footer-trademark { font-size: 12px; color: var(--text-dimmest); white-space: nowrap; }
@media (max-width: 640px) {
  .footer-bottom-row { justify-content: center; text-align: center; }
  .footer-bottom-left { justify-content: center; width: 100%; }
  .footer-trademark { white-space: normal; }
  .footer-payments { justify-content: center; width: 100%; }
}
.seg-toggle { display: inline-flex; background: rgba(255,255,255,0.04); border: 1px solid var(--border); border-radius: 10px; padding: 3px; }
.seg-toggle input[type="radio"] { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.seg-toggle label { padding: 8px 16px; font-size: 13px; font-weight: 600; color: var(--text-dimmer); border-radius: 8px; cursor: pointer; transition: background 0.15s, color 0.15s; user-select: none; }
.seg-toggle input[type="radio"]:checked + label { background: rgba(200,114,47,0.16); color: #E3945B; }
.seg-toggle label:hover { color: rgba(255,255,255,0.85); }

/* ---------- Converter page ---------- */
.conv-hero { padding: 64px 0 40px; }
.conv-hero h1 { font-size: 40px; font-weight: 900; line-height: 1.1; margin: 0 0 20px; }
@media (min-width: 640px) { .conv-hero h1 { font-size: 48px; } }
.conv-hero p { max-width: 440px; color: var(--text-dim); margin: 0 0 24px; }
.conv-checklist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; font-size: 14px; color: var(--text-dimmer); }
.conv-checklist li { display: flex; align-items: center; gap: 8px; }
.conv-checklist svg { width: 16px; height: 16px; color: var(--red); flex-shrink: 0; }

.upload-section { max-width: 720px; margin: 0 auto; padding: 0 24px 64px; }

.file-card { border: 1px solid var(--border); background: rgba(255,255,255,0.02); border-radius: 16px; padding: 32px; }
.file-card-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.file-card-top svg.arrow { width: 16px; height: 16px; color: var(--text-dimmest); flex-shrink: 0; }
.btn-full { width: 100%; border: none; border-radius: 8px; padding: 13px; font-size: 14px; font-weight: 700; }
.btn-convert { background: var(--red); color: #fff; }
.btn-convert:hover { background: var(--red-hover); }
.btn-download { background: var(--green); color: #fff; }
.btn-download:hover { background: var(--green-hover); }
.error-box { border: 1px solid rgba(200,114,47,0.3); background: rgba(200,114,47,0.1); color: #fca5a5; border-radius: 8px; padding: 14px; font-size: 14px; }
.error-box a { color: #E3945B; font-weight: 700; text-decoration: underline; }
/* Same link treatment wherever a result/warning box links out (e.g. every
   "Unlock PDF" link inside an inline message) — a dedicated class rather
   than matching the href, so it doesn't also grab the Unlock PDF tool
   card's own link on pdf-tools.html. */
.inline-link { color: #E3945B; font-weight: 700; text-decoration: underline; }
.reset-link { display: block; width: 100%; text-align: center; background: none; border: none; margin-top: 12px; font-size: 12px; color: var(--text-dimmer); }
.reset-link:hover { color: rgba(255,255,255,0.7); } /* 760px of content, lined up with the guide below */

/* ---------- Options panel ---------- */
.options-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 16px; align-items: end; }
.options-row:last-child { margin-bottom: 0; }
.options-row label {
  min-width: 0; display: flex; flex-direction: column; gap: 8px;
  font-size: 13px; font-weight: 600; color: var(--text-dim); justify-content: flex-end;
}
.options-row input[type="number"], .options-row input[type="month"], .options-row select {
  background: var(--bg-raised); border: 1px solid var(--border); border-radius: 6px;
  padding: 9px 10px; color: #fff; font-size: 14px; height: 38px; box-sizing: border-box; width: 100%;
}
.options-row input[type="range"] {
  width: 100%; accent-color: var(--red); height: 38px; padding: 0; margin: 0; display: block;
}
@media (max-width: 480px) {
  .options-row { grid-template-columns: minmax(0, 1fr); }
}

/* Polished select — custom chevron, proper focus ring, consistent with
   the rest of the design system instead of a bare browser default. */

/* ---------- Merge / multi-file tool ---------- */
.drag-handle {
  cursor: grab; color: var(--text-dimmer); flex-shrink: 0; display: flex; align-items: center;
  touch-action: none;
}
.drag-handle:active { cursor: grabbing; }
.drag-handle svg { width: 16px; height: 16px; }
.add-more-btn {
  border: 1px dashed var(--border-hover); background: transparent; color: var(--text-dim);
  border-radius: 10px; padding: 12px; font-size: 13px; font-weight: 600; width: 100%;
}
.add-more-btn:hover { border-color: var(--red); color: #fff; }

/* ---------- Page thumbnail grid (Rearrange PDF) ---------- */

.hidden { display: none !important; }

/* Announcement bar above the header — a single still message, or (when
   there are 2+ in the ANNOUNCEMENT_MESSAGES array) a smooth fade between
   them every few seconds instead of a scrolling ticker. */
.announcement-bar {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  background: linear-gradient(90deg, rgba(200,114,47,0.25), rgba(200,114,47,0.08));
  border-bottom: 1px solid rgba(200,114,47,0.3);
  padding: 9px 44px 9px 16px;
  overflow: hidden;
}
.announcement-link { display: block; width: 100%; text-decoration: none; }
.announcement-text {
  display: block;
  width: 100%;
  box-sizing: border-box;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px; font-weight: 600; color: #fff;
  transition: opacity 0.3s ease;
}
.announcement-text.fade-out { opacity: 0; }
.announcement-close {
  position: absolute;
  right: 0; top: 0; bottom: 0;
  background: none; border: none; color: rgba(255,255,255,0.6); cursor: pointer;
  padding: 0 14px; display: flex; align-items: center; justify-content: center;
}
.announcement-close:hover { color: #fff; }
@media (max-width: 640px) {
  .announcement-bar { padding: 9px 40px 9px 12px; }
  .announcement-text { font-size: 11.5px; }
}

/* Shared styling for the calculator hub + every individual calculator page. */
.calc-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 20px; margin-top: 24px;
}
.calc-card {
  display: block; border: 1px solid var(--border); background: rgba(255,255,255,0.02);
  border-radius: 14px; padding: 22px; transition: border-color 0.15s, background 0.15s;
}
.calc-card:hover { border-color: rgba(200,114,47,0.4); background: rgba(255,255,255,0.04); }
.calc-card .icon {
  width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;
  border-radius: 8px; background: rgba(200,114,47,0.12); color: #E3945B; margin-bottom: 14px;
}
.calc-card .icon svg { width: 20px; height: 20px; }
.calc-card h3 { margin: 0 0 6px; font-size: 15px; font-weight: 700; color: #fff; }
.calc-card p { margin: 0; font-size: 13px; color: var(--text-dimmer); line-height: 1.5; }
.calc-category { margin-top: 56px; }
.calc-category:first-of-type { margin-top: 40px; }
.calc-category h2 { font-size: 22px; margin: 0 0 4px; }
.calc-category .cat-desc { color: var(--text-dimmer); font-size: 14px; margin: 0; }
.calc-faq { margin: 56px auto 0; max-width: 760px; } /* same centred column as the guide text below it */ /* app pages use a wider content column */
.calc-faq h2 { font-size: 24px; margin-bottom: 24px; }
.calc-faq .faq-item { padding: 18px 0; border-top: 1px solid var(--border); }
.calc-faq .faq-item h3 { font-size: 15px; margin: 0 0 8px; }
.calc-faq .faq-item p { font-size: 14px; color: var(--text-dimmer); margin: 0; line-height: 1.6; }

/* Shared layout for the typing-tools hub + every individual language page. */

/* New single-textarea typing tool UI (word-boundary commit + Google Input
   Tools suggestion chips), replacing the earlier two-box live-preview
   layout with a closer match to how Google's own Input Tools actually work. */

/* ---------- Free daily AI credits ---------- */
.qb-gift-pill {
  display: inline-block; margin: 0 auto 16px; padding: 7px 14px; border-radius: 999px;
  background: rgba(34,197,94,0.1); border: 1px solid rgba(34,197,94,0.3); color: #86efac; font-size: 13px;
}
.qb-gift-pill strong { color: #bbf7d0; }
.qb-free-line { display: block; margin-top: 6px; font-size: 12.5px; font-weight: 500; color: var(--text-dimmer); line-height: 1.5; }
.qb-free-line strong { color: #86efac; font-weight: 700; }
.qb-free-line a { color: #E3945B; font-weight: 700; }
.qb-corner-card {
  position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 1000;
  width: 320px; max-width: calc(100vw - 32px); box-sizing: border-box; padding: 18px 18px 16px;
  background: #1c1916; border: 1px solid rgba(200,114,47,0.45); border-radius: 14px;
  box-shadow: 0 12px 40px rgba(0,0,0,0.5); color: #fff;
  opacity: 0; transform: translateY(12px); transition: opacity 0.25s ease, transform 0.25s ease;
}
.qb-corner-card.show { opacity: 1; transform: translateY(0); }
.qb-corner-close {
  position: absolute; top: 8px; right: 10px; background: none; border: none; color: var(--text-dimmer);
  font-size: 20px; line-height: 1; cursor: pointer; padding: 4px;
}
.qb-corner-close:hover { color: #fff; }
.qb-corner-title { font-size: 15px; font-weight: 800; margin: 0 22px 6px 0; }
.qb-corner-text { font-size: 13px; line-height: 1.5; color: var(--text-dim); margin-bottom: 14px; }
.qb-corner-actions { display: flex; gap: 8px; }
.qb-corner-actions a { flex: 1; text-align: center; text-decoration: none; font-size: 13px; font-weight: 700; padding: 9px 12px; border-radius: 8px; }
.qb-corner-primary { background: var(--red); color: #fff; }
.qb-corner-primary:hover { background: var(--red-hover); }
.qb-corner-secondary { border: 1px solid var(--border-hover); color: rgba(255,255,255,0.85); }
@media (max-width: 640px) {
  .qb-corner-card { left: 16px; right: 16px; width: auto; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); }
}

/* ---------- Install app ---------- */
.btn-install {
  display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(200,114,47,0.55); background: rgba(200,114,47,0.12); color: #E3945B;
  font-size: 13px; font-weight: 700; font-family: inherit; white-space: nowrap;
}
.btn-install svg { width: 15px; height: 15px; }
.btn-install:hover { background: rgba(200,114,47,0.22); color: #fff; }
.badge-pill.qb-pill-hidden { display: none; }
/* Phones and small tablets: keep the header clean — installing is offered
   from the menu (📲 Install the Quikbench app) instead. */
@media (max-width: 960px) {
  .btn-install { display: none; }
}
.qb-install-overlay {
  position: fixed; inset: 0; z-index: 1100; background: rgba(0,0,0,0.55);
  display: flex; align-items: flex-end; justify-content: center; padding: 16px;
  padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
}
.qb-install-sheet {
  position: relative; width: 100%; max-width: 420px; box-sizing: border-box; padding: 22px 20px 18px;
  background: #1c1916; border: 1px solid rgba(200,114,47,0.45); border-radius: 16px; color: #fff;
}
.qb-install-steps { margin: 0 0 16px; padding-left: 20px; font-size: 14px; line-height: 1.7; color: rgba(255,255,255,0.88); }
.qb-install-done {
  width: 100%; padding: 11px; border-radius: 8px; border: none; cursor: pointer;
  background: var(--red); color: #fff; font-weight: 700; font-size: 14px; font-family: inherit;
}

/* ---------- Image compressor ---------- */
.ic-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ic-chips button { padding: 5px 10px; border-radius: 999px; border: 1px solid var(--border); background: transparent; color: var(--text-dim); font-size: 12px; font-weight: 600; cursor: pointer; font-family: inherit; }
.ic-chips button:hover { border-color: rgba(200,114,47,0.5); color: #E3945B; }

/* Header on mid-size screens (small laptops, tablets in landscape): keep
   every nav label on one line, drop the decorative badge, tighten spacing. */
.nav-links a, .nav-dropdown summary, .logo { white-space: nowrap; }
@media (min-width: 961px) and (max-width: 1240px) {
  .badge-pill { display: none; }
  .nav-links { gap: 16px; }
}
@media (min-width: 961px) and (max-width: 1040px) {
  .nav-links { gap: 12px; }
  .nav-links a, .nav-dropdown summary { font-size: 13.5px; }
  .header-right { gap: 8px; }
  .btn-install span { display: none; }
  .btn-install { padding: 7px 9px; }
}

/* ---------- Shopify apps (apps.html + app pages) ---------- */

/* Old Photo Repair: next-step buttons under each result */
.pr-next { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.pr-next-btn { flex: 1; min-width: 0; padding: 7px 8px; border-radius: 7px; border: 1px solid rgba(200,114,47,0.45); background: rgba(200,114,47,0.08); color: #E3945B; font-size: 12px; font-weight: 700; cursor: pointer; font-family: inherit; white-space: nowrap; }
.pr-next-btn:hover { background: rgba(200,114,47,0.18); color: #fff; }
.pr-next-btn:disabled { opacity: 0.6; cursor: wait; }

/* ---------- Creative AI tools: animate, photo editor, alt text ---------- */
.ct-field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 18px; }
.ct-label { font-size: 12.5px; font-weight: 700; color: rgba(255,255,255,0.8); }
/* labels sitting directly on their field (found by the layout check) */
.ct-label + #prefix { margin-top: 8px; }
.ct-radios .seg-toggle { flex-wrap: wrap; align-self: flex-start; }
.ct-radios .seg-toggle label { padding: 8px 12px; }
.ct-check { display: flex; align-items: flex-start; gap: 9px; font-size: 13px; color: var(--text-dim); margin: 0 0 18px; cursor: pointer; line-height: 1.5; }
.ct-check input { margin-top: 3px; flex-shrink: 0; }
.ct-tip { font-size: 12.5px; color: var(--text-dimmer); margin: 10px 0 0; line-height: 1.6; }
.ct-note { font-size: 12.5px; color: var(--text-dimmer); margin: 12px 0 0; text-align: center; line-height: 1.6; }
.ct-preview { display: flex; align-items: center; gap: 14px; padding: 10px; border: 1px solid var(--border); border-radius: 10px; margin-bottom: 18px; background: rgba(255,255,255,0.02); }
.ct-preview img { width: 72px; height: 72px; object-fit: cover; border-radius: 8px; flex-shrink: 0; }
.ct-preview .ct-name { font-size: 14px; color: #fff; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 320px; margin-bottom: 6px; }
.ct-small-btn { font-size: 13px; font-weight: 700; padding: 7px 12px; border-radius: 7px; cursor: pointer; border: 1px solid var(--border); background: rgba(255,255,255,0.03); color: var(--text-dim); font-family: inherit; }
.ct-small-btn:hover { border-color: var(--border-hover); color: #fff; }
.ct-small-btn:disabled { opacity: 0.6; cursor: wait; }
.ct-textarea { width: 100%; box-sizing: border-box; min-height: 92px; padding: 12px 14px; border-radius: 10px; background: rgba(255,255,255,0.03); border: 1px solid var(--border); color: #fff; font-size: 14.5px; font-family: inherit; line-height: 1.5; resize: vertical; }
.ct-textarea:focus { outline: none; border-color: rgba(200,114,47,0.6); }
.ct-count { font-size: 12px; color: var(--text-dimmer); text-align: right; }
.ct-select { padding: 10px 12px; border-radius: 8px; background: rgba(255,255,255,0.03); border: 1px solid var(--border); color: #fff; font-size: 14px; font-family: inherit; align-self: flex-start; }
.ct-select option { background: #1a1716; }
.ct-progress { display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 10px; background: rgba(200,114,47,0.08); border: 1px solid rgba(200,114,47,0.3); color: rgba(255,255,255,0.9); font-size: 14px; margin-bottom: 4px; }
.ct-progress svg { width: 20px; height: 20px; flex-shrink: 0; animation: ct-spin 1s linear infinite; color: #E3945B; }
@keyframes ct-spin { to { transform: rotate(360deg); } }
.ct-result { margin-top: 22px; padding-top: 22px; border-top: 1px solid var(--border); }
.ct-result video { width: 100%; max-height: 520px; border-radius: 12px; background: #000; display: block; margin-bottom: 14px; }
.ct-compare { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 14px; }
.ct-compare figure { margin: 0; }
.ct-compare img { width: 100%; border-radius: 10px; border: 1px solid var(--border); display: block; background: #111; }
.ct-compare figcaption { font-size: 12px; color: var(--text-dimmer); text-align: center; margin-top: 6px; font-weight: 700; }
.ct-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.ct-actions > * { flex: 1; min-width: 150px; }
.ct-out { border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px; margin-bottom: 12px; background: rgba(255,255,255,0.02); }
.ct-out-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.ct-out-head strong { font-size: 13px; color: #E3945B; }
.ct-out p { margin: 0; font-size: 14.5px; line-height: 1.6; color: rgba(255,255,255,0.92); word-break: break-word; }
.ct-out small { font-size: 12px; color: var(--text-dimmer); }
.ct-demo { max-width: 340px; margin: 28px auto 0; text-align: center; }
.ct-demo svg { width: 100%; height: auto; border-radius: 14px; border: 1px solid var(--border); display: block; filter: sepia(0.55) contrast(0.95); }
.ct-demo-tag { font-size: 12px; color: var(--text-dimmer); margin-top: 8px; }
.ct-sway { transform-origin: 200px 300px; animation: ct-sway 6s ease-in-out infinite; }
.ct-lid { transform-box: fill-box; transform-origin: 50% 0%; transform: scaleY(0); animation: ct-blink 5s infinite; }
.ct-mouth { transform-box: fill-box; transform-origin: 50% 50%; animation: ct-smile 6s ease-in-out infinite; }
@keyframes ct-sway { 0%, 100% { transform: rotate(-1deg); } 50% { transform: rotate(1.2deg); } }
@keyframes ct-blink { 0%, 88%, 100% { transform: scaleY(0); } 92%, 95% { transform: scaleY(1); } }
@keyframes ct-smile { 0%, 100% { transform: scale(1, 1); } 50% { transform: scale(1.14, 1.25); } }
@media (prefers-reduced-motion: reduce) { .ct-sway, .ct-lid, .ct-mouth { animation: none; } }
@media (max-width: 640px) { .ct-compare { grid-template-columns: minmax(0, 1fr); } .ct-preview .ct-name { max-width: 190px; } }

/* AI hub: three groups of three cards. 3 across on desktop, 2 on tablets, 1 on phones. */
.calc-grid.calc-grid-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) { .calc-grid.calc-grid-3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .calc-grid.calc-grid-3 { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Website assistant (chat widget) ---------- */
.qb-chat-launcher {
  position: fixed; right: 20px; bottom: calc(20px + env(safe-area-inset-bottom, 0px)); z-index: 1050;
  display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px 12px 14px; border-radius: 999px; cursor: pointer;
  border: 1px solid rgba(200,114,47,0.6); background: #C8722F; color: #fff; font-family: inherit; font-size: 14px; font-weight: 700;
  box-shadow: 0 8px 28px rgba(0,0,0,0.45); transition: transform 0.15s ease, background 0.15s ease;
}
.qb-chat-launcher:hover { background: #d97f38; transform: translateY(-1px); }
.qb-chat-launcher svg { width: 20px; height: 20px; flex-shrink: 0; }
.qb-chat {
  position: fixed; right: 20px; bottom: calc(80px + env(safe-area-inset-bottom, 0px)); z-index: 1060;
  width: 372px; max-width: calc(100vw - 32px); height: min(580px, calc(100vh - 120px)); box-sizing: border-box;
  display: flex; flex-direction: column; overflow: hidden;
  background: #1c1916; border: 1px solid rgba(200,114,47,0.45); border-radius: 16px; box-shadow: 0 18px 60px rgba(0,0,0,0.6); color: #fff;
}
.qb-chat[hidden] { display: none; }
.qb-chat-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 16px; border-bottom: 1px solid var(--border); background: rgba(200,114,47,0.08); }
.qb-chat-head strong { display: block; font-size: 15px; }
.qb-chat-head span { display: block; font-size: 12px; color: var(--text-dimmer); margin-top: 2px; }
.qb-chat-close { background: none; border: none; color: var(--text-dim); font-size: 26px; line-height: 1; cursor: pointer; padding: 2px 6px; }
.qb-chat-close:hover { color: #fff; }
.qb-chat-log { flex: 1; overflow-y: auto; padding: 14px 14px 6px; display: flex; flex-direction: column; gap: 10px; }
.qb-msg { max-width: 88%; padding: 10px 13px; border-radius: 14px; font-size: 14px; line-height: 1.55; word-break: break-word; }
.qb-msg p { margin: 0 0 6px; }
.qb-msg p:last-child, .qb-msg ul:last-child { margin-bottom: 0; }
.qb-msg ul { margin: 4px 0 6px; padding-left: 18px; }
.qb-msg li { margin-bottom: 3px; }
.qb-msg a { color: #E3945B; font-weight: 700; text-decoration: underline; }
.qb-msg-user { align-self: flex-end; background: #C8722F; color: #fff; border-bottom-right-radius: 4px; }
.qb-msg-assistant { align-self: flex-start; background: rgba(255,255,255,0.06); border: 1px solid var(--border); color: rgba(255,255,255,0.92); border-bottom-left-radius: 4px; }
.qb-msg-error { border-color: rgba(252,165,165,0.4); color: #fca5a5; }
.qb-typing { display: inline-flex; gap: 5px; padding: 13px 15px; }
.qb-typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--text-dimmer); animation: qb-dot 1.2s infinite ease-in-out; }
.qb-typing span:nth-child(2) { animation-delay: 0.15s; }
.qb-typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes qb-dot { 0%, 60%, 100% { opacity: 0.3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }
.qb-chat-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 4px 14px 10px; }
.qb-chat-chips[hidden] { display: none; }
.qb-chat-chips button { padding: 7px 11px; border-radius: 999px; border: 1px solid rgba(200,114,47,0.45); background: rgba(200,114,47,0.08); color: #E3945B; font-size: 12.5px; font-weight: 600; cursor: pointer; font-family: inherit; text-align: left; }
.qb-chat-chips button:hover { background: rgba(200,114,47,0.18); color: #fff; }
.qb-chat-form { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--border); }
.qb-chat-input { flex: 1; min-width: 0; padding: 11px 13px; border-radius: 10px; background: rgba(255,255,255,0.05); border: 1px solid var(--border); color: #fff; font-size: 14px; font-family: inherit; }
.qb-chat-input:focus { outline: none; border-color: rgba(200,114,47,0.7); }
.qb-chat-send { width: 44px; border-radius: 10px; border: none; background: #C8722F; color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.qb-chat-send:hover { background: #d97f38; }
.qb-chat-send:disabled { opacity: 0.55; cursor: wait; }
.qb-chat-send svg { width: 18px; height: 18px; }
.qb-chat-note { margin: 0; padding: 0 14px 10px; font-size: 11px; line-height: 1.5; color: var(--text-dimmest); }
.qb-chat-note a { color: var(--text-dimmer); text-decoration: underline; }
/* The free-credits card and the install sheet sit above the launcher, not on top of it. */
body.qb-has-assistant .qb-corner-card { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
@media (max-width: 640px) {
  .qb-chat-launcher { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); padding: 13px; }
  .qb-chat-launcher span { display: none; }
  .qb-chat { left: 8px; right: 8px; width: auto; max-width: none; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); height: min(78vh, 600px); }
  body.qb-chat-open .qb-chat-launcher { display: none; }
  body.qb-has-assistant .qb-corner-card { bottom: calc(78px + env(safe-area-inset-bottom, 0px)); }
}
@media print { .qb-chat-launcher, .qb-chat { display: none !important; } }

/* ---------- Guide content under tools (how-to, tips, FAQ) ---------- */
.guide { max-width: 760px; margin: 0 auto; padding: 8px 0 72px; }
.guide h2 { font-size: 24px; margin: 44px 0 14px; color: #fff; line-height: 1.25; }
.guide h2:first-child { margin-top: 24px; }
.guide h3 { font-size: 16.5px; margin: 24px 0 8px; color: #fff; }
.guide p, .guide li { font-size: 15.5px; line-height: 1.75; color: var(--text-dim); }
.guide p { margin: 0 0 14px; }
.guide ul, .guide ol { padding-left: 22px; margin: 10px 0 18px; }
.guide li { margin-bottom: 8px; }
.guide li strong, .guide p strong { color: rgba(255,255,255,0.92); }
.guide a { color: #E3945B; }
.guide .faq-item { padding: 14px 0; border-top: 1px solid var(--border); }
.guide .faq-item:first-of-type { border-top: none; }
.guide .faq-item h3 { margin: 0 0 6px; font-size: 16px; }
.guide .faq-item p { margin: 0; font-size: 15px; }
.guide .guide-note { padding: 14px 16px; border-radius: 10px; background: rgba(200,114,47,0.07); border: 1px solid rgba(200,114,47,0.3); margin: 18px 0; }
.guide .guide-note p { margin: 0; font-size: 14.5px; }
.guide .guide-table { width: 100%; border-collapse: collapse; margin: 16px 0 22px; font-size: 14px; }
.guide .guide-table th, .guide .guide-table td { text-align: left; padding: 10px 12px; border-bottom: 1px solid var(--border); color: var(--text-dim); vertical-align: top; }
.guide .guide-table th { color: #fff; font-weight: 700; background: rgba(255,255,255,0.03); }
.guide-table-wrap { overflow-x: auto; }
@media (max-width: 640px) { .guide h2 { font-size: 21px; } .guide p, .guide li { font-size: 15px; } }

/* ---------- Upscale PDF (batch) ---------- */

/* ---------- About / Contact content ---------- */

/* ---------- Footer social links ---------- */
.footer-social { display: flex; gap: 10px; margin-top: 16px; }
.footer-social a { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--border); color: var(--text-dim); transition: color .15s, border-color .15s, background .15s; }
.footer-social a:hover, .footer-social a:focus-visible { color: #fff; border-color: var(--border-hover); background: rgba(255,255,255,0.05); }

/* ---------- Assistant: "Try again" on an error message ---------- */
.qb-retry { display: inline-block; margin: 8px 0 0; padding: 6px 14px; border-radius: 999px; border: 1px solid rgba(252,165,165,0.5); background: transparent; color: #fca5a5; font-size: 13px; font-weight: 700; cursor: pointer; }
.qb-retry:hover, .qb-retry:focus-visible { background: rgba(252,165,165,0.12); color: #fff; }


/* ---------- Free AI credits without an account ---------- */
.qb-anon-note { flex-basis: 100%; width: 100%; font-size: 13px; line-height: 1.5; color: var(--text-dimmer); }
.qb-anon-note a { color: #E3945B; font-weight: 600; }

/* ---------- Share + bookmark bar under results ---------- */
.qb-share { display: block; width: 100%; flex-basis: 100%; box-sizing: border-box; margin: 14px 0 4px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: rgba(255,255,255,0.03); text-align: left; }
.qb-share-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-bottom: 8px; }
.qb-share-head strong { font-size: 14px; color: #fff; }
.qb-share-head span { font-size: 12px; color: var(--text-dimmer); }
.qb-share-row { display: flex; flex-wrap: wrap; gap: 8px; }
.qb-share-btn { display: inline-flex; align-items: center; padding: 7px 13px; border-radius: 999px; border: 1px solid var(--border-hover, rgba(255,255,255,0.18)); background: transparent; color: var(--text); font-size: 13px; font-weight: 600; line-height: 1.2; text-decoration: none; cursor: pointer; font-family: inherit; }
.qb-share-btn:hover, .qb-share-btn:focus-visible { border-color: #C8722F; color: #fff; background: rgba(200,114,47,0.12); outline: none; }
.qb-share-btn[hidden] { display: none; }
.qb-share-whatsapp:hover { border-color: #25D366; background: rgba(37,211,102,0.12); }
.qb-share-facebook:hover { border-color: #1877F2; background: rgba(24,119,242,0.14); }
.qb-share-linkedin:hover { border-color: #0A66C2; background: rgba(10,102,194,0.14); }
.qb-share-telegram:hover { border-color: #26A5E4; background: rgba(38,165,228,0.14); }
.qb-share-note { margin-top: 8px; font-size: 13px; color: #86efac; }
.qb-share-note[hidden] { display: none; }

/* ---------- AI Image Generator + AI Video Generator ---------- */
.gen-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.gen-card { position: relative; display: block; cursor: pointer; }
.gen-card input { position: absolute; opacity: 0; pointer-events: none; }
.gen-card .gen-card-body { display: block; padding: 12px 14px; border-radius: 10px; border: 1px solid var(--border); background: rgba(255,255,255,0.03); transition: border-color .15s, background .15s; height: 100%; box-sizing: border-box; }
.gen-card:hover .gen-card-body { border-color: var(--border-hover); }
.gen-card input:checked + .gen-card-body { border-color: #C8722F; background: rgba(200,114,47,0.1); }
.gen-card input:focus-visible + .gen-card-body { outline: 2px solid #E3945B; outline-offset: 2px; }
.gen-card strong { display: block; font-size: 14px; color: #fff; }
.gen-card .gen-note { display: block; margin-top: 3px; font-size: 12px; color: var(--text-dimmer); line-height: 1.45; }
.gen-card .gen-price { display: block; margin-top: 8px; font-size: 12px; font-weight: 700; color: #E3945B; }
.gen-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
@media (max-width: 560px) { .gen-row { grid-template-columns: minmax(0, 1fr); } }
.gen-row select, .gen-select { width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 8px; background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: #fff; font-size: 14px; font-family: inherit; }
.gen-refs { display: flex; flex-wrap: wrap; gap: 10px; }
.gen-ref { position: relative; width: 84px; height: 84px; border-radius: 8px; overflow: hidden; border: 1px solid var(--border); }
.gen-ref img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gen-ref button { position: absolute; top: 3px; right: 3px; width: 22px; height: 22px; border-radius: 50%; border: 0; background: rgba(0,0,0,0.7); color: #fff; cursor: pointer; font-size: 14px; line-height: 1; }
.gen-ref span { position: absolute; left: 0; right: 0; bottom: 0; padding: 2px 4px; font-size: 10.5px; font-weight: 700; background: rgba(0,0,0,0.65); color: #fff; text-align: center; }
.gen-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 12.5px; line-height: 1.55; color: var(--text-dim); margin: 4px 0 16px; cursor: pointer; }
.gen-consent input { margin-top: 3px; flex-shrink: 0; }
.gen-consent a { color: #E3945B; }
.gen-result img, .gen-result video { width: 100%; max-height: 560px; object-fit: contain; border-radius: 10px; background: #000; display: block; }
.gen-quota { font-size: 12px; color: var(--text-dimmer); margin: 8px 0 0; text-align: center; }
.gen-optional { font-weight: 500; color: var(--text-dimmer); }

/* ---------- Style buttons (image + video generators) ---------- */
.gen-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.gen-tab { padding: 7px 14px; border-radius: 8px; border: 1px solid var(--border); background: transparent; color: var(--text-dim); font-size: 13px; font-weight: 700; font-family: inherit; cursor: pointer; }
.gen-tab:hover { color: #fff; border-color: var(--border-hover); }
.gen-tab.active { background: rgba(200,114,47,0.16); border-color: #C8722F; color: #E3945B; }
.gen-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.gen-chip { padding: 8px 12px; border-radius: 999px; border: 1px solid var(--border); background: rgba(255,255,255,0.03); color: rgba(255,255,255,0.88); font-size: 13px; font-weight: 600; font-family: inherit; cursor: pointer; line-height: 1.2; transition: border-color .15s, background .15s; }
.gen-chip:hover { border-color: rgba(200,114,47,0.6); }
.gen-chip.active { background: rgba(200,114,47,0.18); border-color: #C8722F; color: #fff; }
.gen-chip:focus-visible, .gen-tab:focus-visible { outline: 2px solid #E3945B; outline-offset: 2px; }

/* ---------- Generator pages: wide two-column layout ---------- */
.gen-wrap { max-width: 1100px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
.gen-wrap .credit-bar { max-width: none; }
.gen-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 430px); gap: 24px; align-items: start; margin-top: 18px; }
@media (max-width: 960px) { .gen-layout { grid-template-columns: minmax(0, 1fr); } }
.gen-form { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.gen-step, .gen-submit { border: 1px solid var(--border); background: rgba(255,255,255,0.025); border-radius: 14px; padding: 18px 20px; }
.gen-h { margin: 0 0 14px; font-size: 15px; font-weight: 700; color: #fff; display: flex; align-items: center; gap: 10px; }
.gen-n { width: 24px; height: 24px; border-radius: 50%; background: rgba(200,114,47,0.18); color: #E3945B; font-size: 12.5px; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.gen-opt { margin-left: auto; font-size: 12px; font-weight: 600; color: var(--text-dimmer); text-align: right; }
.gen-textarea { width: 100%; box-sizing: border-box; min-height: 118px; resize: vertical; }
.gen-under { display: flex; justify-content: space-between; align-items: center; margin: 8px 0 4px; }
.gen-link { background: none; border: 0; padding: 0; color: #E3945B; font-weight: 700; font-size: 13px; cursor: pointer; font-family: inherit; }
.gen-link:hover { text-decoration: underline; }
.gen-refs-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 10px; }
.gen-hint { font-size: 12px; color: var(--text-dimmer); }
.gen-refs:empty { display: none; }
.gen-refs { margin-top: 12px; }
.gen-photos { display: flex; flex-wrap: wrap; gap: 24px; }
.gen-photos > div:not(.hidden) { margin-top: 16px; }
.gen-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 640px) { .gen-cards { grid-template-columns: minmax(0, 1fr); } }
.gen-card .gen-note { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gen-row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 16px; }
.gen-row .ct-label { display: block; margin-bottom: 6px; }
.gen-preview { position: sticky; top: 90px; }
@media (max-width: 960px) { .gen-preview { position: static; } }
.gen-stage { border: 1px solid var(--border); background: rgba(255,255,255,0.02); border-radius: 14px; padding: 14px; min-height: 360px; display: flex; flex-direction: column; justify-content: center; }
.gen-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 8px; padding: 36px 24px; border: 1px dashed var(--border-hover, rgba(255,255,255,0.18)); border-radius: 10px; min-height: 300px; color: var(--text-dimmer); }
.gen-empty[hidden] { display: none; }
.gen-empty svg { width: 46px; height: 46px; opacity: 0.55; }
.gen-empty strong { color: var(--text-dim); font-size: 15px; }
.gen-empty span { font-size: 13px; line-height: 1.55; max-width: 300px; }
.gen-submit { display: flex; flex-direction: column; gap: 12px; }
.gen-summary { font-size: 13px; color: var(--text-dim); text-align: center; min-height: 18px; }
.gen-submit .gen-consent { margin: 0; font-size: 12px; }
.gen-submit .gen-quota { margin: 0; }
.gen-switch { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--text-dim); cursor: pointer; margin-top: 12px; position: relative; }
.gen-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.gen-switch .ui { width: 36px; height: 20px; border-radius: 999px; background: rgba(255,255,255,0.18); position: relative; flex-shrink: 0; transition: background .15s; }
.gen-switch .ui::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; }
.gen-switch input:checked + .ui { background: #C8722F; }
.gen-switch input:checked + .ui::after { transform: translateX(16px); }
.gen-switch input:disabled + .ui { opacity: 0.4; }
.gen-switch input:focus-visible + .ui { outline: 2px solid #E3945B; outline-offset: 2px; }
.gen-result img, .gen-result video { max-height: 520px; }
.upload-section.gen-section { max-width: 1148px; }
@media (max-width: 520px) { .gen-row { grid-template-columns: minmax(0, 1fr); } .gen-step, .gen-submit { padding: 16px; } }

/* ---------- AI Video Upscaler ---------- */
.gen-drop { border: 1.5px dashed var(--border-hover, rgba(255,255,255,0.18)); border-radius: 12px; padding: 18px; text-align: center; transition: border-color .15s, background .15s; }
.gen-drop.over { border-color: #C8722F; background: rgba(200,114,47,0.08); }
.gen-drop-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 18px 0; }
.gen-drop-empty strong { color: #fff; font-size: 15px; }
.gen-drop-empty span { font-size: 12.5px; color: var(--text-dimmer); }
.gen-drop video { width: 100%; max-height: 300px; border-radius: 8px; background: #000; display: block; }
.gen-meta { font-size: 12.5px; color: var(--text-dim); margin: 8px 0 4px; }
.gen-card.is-disabled { opacity: .5; cursor: not-allowed; }
a.gen-btn-link { display: flex; align-items: center; justify-content: center; text-decoration: none; }
.gen-consent.gen-consent-need { outline: 2px solid #E3945B; outline-offset: 6px; border-radius: 8px; background: rgba(200,114,47,0.08); }

/* ---------- Bulk Product SEO Optimiser ---------- */
.gen-check { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--text); margin: 8px 0; cursor: pointer; }
.gen-check .gen-opt { color: var(--text-dimmer); font-size: 12px; }
.gen-result-title { margin: 0 0 4px; font-size: 18px; color: #fff; }
.seo-map { margin-top: 14px; padding: 14px; border: 1px solid var(--border); border-radius: 10px; background: rgba(255,255,255,0.02); }
.seo-map-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px 14px; }
.seo-map-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 700; color: var(--text-dim); }
.seo-map-grid select { width: 100%; }

/* ---------- Product Photo Batch Processor ---------- */
.ph-thumbs { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 8px; margin-bottom: 8px; }
.ph-thumbs .gen-ref { width: 100%; height: 64px; }
.ph-swatches { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 4px; }
.ph-sw { width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--border); cursor: pointer; padding: 0; position: relative; overflow: hidden; }
.ph-sw.active { border-color: #C8722F; box-shadow: 0 0 0 3px rgba(200,114,47,0.35); }
.ph-sw-none, .ph-checker { background-color: #fff; background-image: linear-gradient(45deg,#d9d9d9 25%,transparent 25%,transparent 75%,#d9d9d9 75%), linear-gradient(45deg,#d9d9d9 25%,transparent 25%,transparent 75%,#d9d9d9 75%); background-size: 12px 12px; background-position: 0 0, 6px 6px; }
.ph-sw-custom { background: conic-gradient(red, yellow, lime, cyan, blue, magenta, red); }
.ph-sw-custom input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.ph-results { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; max-height: 460px; overflow-y: auto; }
.ph-out { display: flex; flex-direction: column; gap: 4px; padding: 6px; border: 1px solid var(--border); border-radius: 10px; background: rgba(255,255,255,0.03); cursor: pointer; color: var(--text-dim); font-size: 11px; font-family: inherit; }
.ph-out:hover { border-color: #C8722F; }
.ph-out img { width: 100%; aspect-ratio: 1; object-fit: contain; border-radius: 6px; background: transparent; }
.ph-out span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gen-step input[type="number"], .gen-step input[type="text"] { width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 8px; background: var(--bg-raised, rgba(255,255,255,0.04)); border: 1px solid var(--border); color: #fff; font-size: 14px; font-family: inherit; }

/* ---------- Structured Data Checker ---------- */
.sd-card { max-width: 860px; margin: 0 auto; }
.sd-url-row { display: flex; gap: 10px; }
.sd-input { width: 100%; box-sizing: border-box; padding: 12px 14px; border-radius: 10px; background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: #fff; font-size: 15px; font-family: inherit; }
.sd-input:focus { outline: none; border-color: rgba(200,114,47,0.6); }
.sd-go { flex: 0 0 auto; padding: 0 22px; border: 0; border-radius: 10px; font-weight: 700; cursor: pointer; font-family: inherit; }
@media (max-width: 600px) { .sd-url-row { flex-direction: column; } .sd-go { padding: 14px; } }

/* ---------- Website SEO Audit / Internal Link Planner ---------- */

/* ---------- Print File Checker ---------- */

/* ---------- Photo Library Cleaner ---------- */

/* ---------- Homepage tool hub ---------- */
.hub { padding: 64px 0 24px; }
.hub h1 { font-size: clamp(32px, 5vw, 56px); line-height: 1.08; letter-spacing: -0.02em; margin: 0 0 16px; max-width: 900px; color: #fff; }
.hub-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 30px; }
#convert { scroll-margin-top: 70px; }
@media (max-width: 520px) { .hub { padding-top: 36px; } }

/* ---------- Robots.txt Generator ---------- */

/* ---------- Sitemap Generator & hosted sitemaps ---------- */
/* assistant voice */
.qb-chat-mic { width: 44px; border-radius: 10px; border: 1px solid var(--border); background: rgba(255,255,255,0.05); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.qb-chat-mic[hidden], .qb-chat-lang[hidden] { display: none; }
.qb-chat-mic svg { width: 18px; height: 18px; }
.qb-chat-mic:hover { border-color: rgba(200,114,47,0.7); }
.qb-chat-mic.qb-mic-on { background: #C8722F; border-color: #C8722F; animation: qbMicPulse 1.2s ease-in-out infinite; }
.qb-chat-mic.qb-mic-talk { background: rgba(200,114,47,0.25); border-color: #C8722F; }
@keyframes qbMicPulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(200,114,47,0.55); } 50% { box-shadow: 0 0 0 7px rgba(200,114,47,0); } }
@media (prefers-reduced-motion: reduce) { .qb-chat-mic.qb-mic-on { animation: none; } }
.qb-chat-lang { margin-left: auto; margin-right: 6px; min-width: 38px; height: 30px; padding: 0 8px; border-radius: 8px; border: 1px solid var(--border); background: rgba(255,255,255,0.05); color: #fff; font: 600 12px/1 inherit; cursor: pointer; }
.qb-chat-lang:hover { border-color: rgba(200,114,47,0.7); }
/* assistant: language, sound, greeting pop-up */
.qb-chat-head > div:first-child { min-width: 0; }
select.qb-chat-lang { margin-left: auto; margin-right: 0; max-width: 128px; height: 32px; padding: 0 26px 0 10px; border-radius: 8px; border: 1px solid var(--border); background: rgba(255,255,255,0.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23aaa' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 9px center; color: #fff; font: 600 12.5px/1 inherit; cursor: pointer; appearance: none; -webkit-appearance: none; }
select.qb-chat-lang option { background: #1c1917; color: #fff; }
.qb-chat-sound { width: 32px; height: 32px; flex-shrink: 0; border-radius: 8px; border: 1px solid var(--border); background: rgba(255,255,255,0.05); color: #fff; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.qb-chat-sound[hidden] { display: none; }
.qb-chat-sound svg { width: 16px; height: 16px; }
.qb-chat-sound .qb-mute { display: none; }
.qb-chat-sound.qb-off { color: var(--text-dimmer); }
.qb-chat-sound.qb-off .qb-wave { display: none; }
.qb-chat-sound.qb-off .qb-mute { display: inline; }
.qb-chat-lang:hover, .qb-chat-sound:hover { border-color: rgba(200,114,47,0.7); }
.qb-chat-head { gap: 8px; }
.qb-nudge { position: fixed; right: 20px; bottom: 86px; z-index: 9998; max-width: 290px; display: flex; align-items: flex-start; background: #1c1917; border: 1px solid rgba(200,114,47,0.55); border-radius: 14px 14px 4px 14px; box-shadow: 0 12px 32px rgba(0,0,0,0.45); animation: qbNudgeIn .35s ease-out; }
.qb-nudge-body { flex: 1; text-align: left; background: none; border: none; color: #fff; padding: 13px 4px 13px 15px; cursor: pointer; font-family: inherit; }
.qb-nudge-body strong { display: block; font-size: 14.5px; line-height: 1.35; }
.qb-nudge-body span { display: block; font-size: 12.5px; color: var(--text-dim); margin-top: 4px; line-height: 1.4; }
.qb-nudge-x { background: none; border: none; color: var(--text-dimmer); font-size: 20px; line-height: 1; padding: 8px 10px; cursor: pointer; }
.qb-nudge-x:hover { color: #fff; }
@keyframes qbNudgeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .qb-nudge { animation: none; } }
@media (max-width: 600px) { .qb-nudge { right: 12px; left: auto; bottom: 78px; max-width: calc(100vw - 24px); } }
/* QR tools */
.qr-types { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.qr-types input { position: absolute; opacity: 0; pointer-events: none; }
.qr-types label { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--border); font-size: 13.5px; font-weight: 600; color: var(--text-dim); cursor: pointer; background: rgba(255,255,255,0.03); }
.qr-types label:hover { border-color: rgba(200,114,47,0.55); color: #fff; }
.qr-types input:checked + label { background: rgba(200,114,47,0.16); border-color: #C8722F; color: #fff; }
.qr-types input:focus-visible + label { outline: 2px solid #E3945B; outline-offset: 2px; }
.qr-layout { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 26px; align-items: start; }
.qr-form .sd-field { margin-bottom: 12px; }
.qr-ta { min-height: 84px; }
.qr-check { display: flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--text-dim); cursor: pointer; align-self: end; padding-bottom: 12px; }
.qr-check input { width: 16px; height: 16px; accent-color: #C8722F; }
.qr-design { margin-top: 6px; }
.qr-design-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.qr-color { width: 100%; height: 42px; padding: 3px; border-radius: 9px; border: 1px solid var(--border); background: rgba(255,255,255,0.04); cursor: pointer; }
.qr-logo-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 4px 0 10px; }
.qr-logo-btn { display: inline-flex; width: auto; padding: 9px 14px; font-size: 13px; cursor: pointer; }
.qr-side { position: sticky; top: 90px; }
.qr-preview { position: relative; background: #fff; border-radius: 14px; padding: 10px; aspect-ratio: 1 / 1; display: flex; align-items: center; justify-content: center; }
.qr-preview canvas { width: 100%; height: auto; max-height: 100%; object-fit: contain; display: block; }
.qr-preview canvas.qr-dim { opacity: 0.08; }
.qr-empty { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; text-align: center; padding: 24px; margin: 0; color: #555; font-size: 14px; font-weight: 600; }
.qr-check-line { font-size: 13px; margin: 10px 0 4px; min-height: 18px; color: var(--text-dimmer); }
.qr-check-line.good { color: #86efac; }
.qr-check-line.bad { color: #fbbf24; }
.qr-size { margin-top: 8px; }
.qr-actions { flex-direction: column; margin-top: 12px; }
.qr-actions .btn-full { width: 100%; }
.qr-note { margin-top: 14px; }
.qr-scan-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.qr-file-btn { display: flex; align-items: center; justify-content: center; cursor: pointer; text-align: center; }
.qr-paste-tip { text-align: center; }
.qr-card.drag { border-color: #C8722F; background: rgba(200,114,47,0.06); }
.qr-cam { position: relative; margin-top: 16px; border-radius: 14px; overflow: hidden; background: #000; }
.qr-cam video { width: 100%; max-height: 62vh; display: block; object-fit: cover; }
.qr-aim { position: absolute; left: 50%; top: 45%; width: min(56%, 300px); aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 18px; box-shadow: 0 0 0 9999px rgba(0,0,0,0.35); border: 3px solid rgba(255,255,255,0.9); pointer-events: none; }
.qr-cam-bar { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 14px; padding: 12px 16px; background: linear-gradient(transparent, rgba(0,0,0,0.75)); color: #fff; font-size: 13.5px; }
.qr-cam-bar span { flex: 1; }
.qr-cam-bar .gen-link { color: #fff; }
.qr-result { margin-top: 18px; border: 1px solid rgba(200,114,47,0.4); border-radius: 14px; padding: 18px; background: rgba(200,114,47,0.05); }
.qr-result-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.qr-type { font-size: 12px; font-weight: 800; letter-spacing: 0.6px; text-transform: uppercase; color: #E3945B; }
.qr-row { display: flex; align-items: baseline; gap: 12px; padding: 9px 0; border-top: 1px solid var(--border); }
.qr-row:first-of-type { border-top: 0; }
.qr-row span { width: 110px; flex-shrink: 0; font-size: 13px; color: var(--text-dimmer); }
.qr-row b { flex: 1; min-width: 0; font-size: 14.5px; color: #fff; overflow-wrap: anywhere; font-weight: 600; }
.qr-raw { font-size: 12.5px; color: var(--text-dimmer); overflow-wrap: anywhere; margin: 6px 0 0; }
.qr-warn { font-size: 13px; color: #fcd34d; background: rgba(251,191,36,0.08); border: 1px solid rgba(251,191,36,0.25); border-radius: 10px; padding: 10px 12px; margin: 12px 0 0; line-height: 1.5; }
.qr-btns { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.qr-btns .btn-full { flex: 1 1 160px; text-align: center; text-decoration: none; }
.qr-text { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13px; background: rgba(255,255,255,0.04); border-radius: 10px; padding: 12px; margin: 8px 0 0; color: #fff; max-height: 260px; overflow: auto; }
@media (max-width: 820px) { .qr-layout { grid-template-columns: minmax(0, 1fr); } .qr-side { position: static; max-width: 420px; width: 100%; margin: 0 auto; } .qr-design-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .qr-scan-btns { grid-template-columns: minmax(0, 1fr); } .qr-row { flex-wrap: wrap; gap: 2px 12px; } .qr-row span { width: auto; flex-basis: 100%; } }
/* QR generator — 3-step layout */
.qrg .qr-form .sd-field { margin-bottom: 12px; }
.qrg-btn2 { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 11px 14px; border-radius: 10px; border: 1px solid var(--border-hover); background: rgba(255,255,255,0.04); color: #fff; font: 600 13.5px/1.2 inherit; cursor: pointer; text-decoration: none; }
.qrg-btn2:hover:not(:disabled) { border-color: rgba(200,114,47,0.6); background: rgba(200,114,47,0.08); }
.qrg-btn2:disabled { opacity: 0.45; cursor: not-allowed; }
.qrg .qr-preview { box-shadow: 0 10px 30px rgba(0,0,0,0.35); }
.qrg .qr-empty { color: #8a8580; font-weight: 600; }
.qrg .qr-empty.qr-empty-err { color: #b45309; }
.qrg .qr-check-line { margin: 0; text-align: center; }
.qrg-privacy { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; color: var(--text-dimmer); margin: 2px 0 0; }
.qrg-privacy svg { width: 13px; height: 13px; flex-shrink: 0; }
.upload-section.qrg-section { max-width: 1088px; }
/* Domain age */
/* Signature resizer */
.sg-pick { width: 100%; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 30px 18px; border: 1.5px dashed rgba(200,114,47,0.5); border-radius: 14px; background: rgba(200,114,47,0.04); color: #fff; cursor: pointer; font-family: inherit; text-align: center; }
.sg-pick:hover { background: rgba(200,114,47,0.09); }
.sg-pick svg { width: 30px; height: 30px; color: #E3945B; }
.sg-pick b { font-size: 15px; }
.sg-pick span { font-size: 12.5px; color: var(--text-dimmer); }
/* Sign PDF */
.sp-drop { padding: 46px 18px; }
#pad { width: 100%; aspect-ratio: 3 / 1; background: #fff; border-radius: 12px; touch-action: none; cursor: crosshair; display: block; }
/* GST invoice */
/* Compress PDF to size */
.ps-file{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;background:var(--bg-raised)}
.ps-name{flex:1;min-width:0;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ps-size{color:var(--text-dim);font-size:13.5px}
.ps-prog{display:flex;flex-direction:column;gap:6px;font-size:13.5px;color:var(--text-dim)}
.ps-bar{height:6px;border-radius:6px;background:var(--border);overflow:hidden}
.ps-bar i{display:block;height:100%;width:0;background:#C8722F;transition:width .2s}
.ps-card .qr-check{align-self:start;padding-bottom:0}
.ps-name{color:var(--text)}
/* Fancy text */
/* AI subtitles */
.st-card{display:flex;flex-direction:column;gap:14px}
.st-media{display:flex;flex-direction:column;gap:10px}
.st-media video{width:100%;max-height:420px;border-radius:12px;background:#000}
.st-media video.st-audio{max-height:54px;background:transparent}
.st-opts{display:grid;grid-template-columns:1fr 1.4fr;gap:12px}
.st-field{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:600;color:var(--text)}
.st-field small{font-weight:400;color:var(--text-dimmer)}
.st-field .sd-input{width:100%;box-sizing:border-box}
.st-indet i{width:35%!important;animation:stmove 1.3s ease-in-out infinite}
@keyframes stmove{0%{transform:translateX(-100%)}100%{transform:translateX(300%)}}
.st-result{display:flex;flex-direction:column;gap:10px}
.st-res-h{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;font-size:14px}
.st-shift{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--text-dim)}
.st-shift .qrg-btn2{padding:6px 10px}
.st-list{max-height:420px;overflow:auto;border:1px solid var(--border);border-radius:12px}
.st-row{display:grid;grid-template-columns:62px 1fr;gap:8px;align-items:start;padding:8px 10px;border-top:1px solid var(--border)}
.st-row:first-child{border-top:0}
.st-time{background:none;border:0;color:#C8722F;font-weight:600;font-size:13px;line-height:1.6;font-family:inherit;cursor:pointer;padding:4px 0;text-align:left}
.st-text{width:100%;min-height:40px;box-sizing:border-box;resize:vertical;overflow:hidden;background:transparent;border:1px solid transparent;border-radius:8px;color:var(--text);font-size:15px;line-height:1.5;font-family:inherit;padding:4px 8px}
.st-text:hover{border-color:var(--border)}
.st-text:focus{outline:none;border-color:#C8722F;background:var(--bg-raised)}
.st-dl{display:flex;gap:8px;flex-wrap:wrap}
.st-dl .sd-go{padding:12px 20px}
@media (max-width:600px){.st-opts{grid-template-columns: minmax(0, 1fr)}}
.st-card>.sd-go{padding:13px 22px;font-size:15px}
/* Bank statement to Excel */
.bk-card{display:flex;flex-direction:column;gap:14px}
.bk-card>.sd-go{padding:12px 20px}
.bk-table{max-height:460px;overflow:auto;border:1px solid var(--border);border-radius:12px}
.bk-table table{width:100%;border-collapse:collapse;font-size:13px}
.bk-table th{position:sticky;top:0;background:var(--bg-raised);text-align:left;font-weight:600;color:var(--text);padding:9px 10px;border-bottom:1px solid var(--border);white-space:nowrap}
.bk-table td{padding:8px 10px;border-top:1px solid var(--border);color:var(--text-dim);vertical-align:top}
.bk-table td:first-child,.bk-table td.d{white-space:nowrap}
.bk-table .n{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.bk-table tr.bad td{background:rgba(251,191,36,.12)}
/* Credit panel (shared by AI tools; older pages also style it inline) */
.credit-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:14px 18px;border-radius:12px;background:rgba(200,114,47,0.08);border:1px solid rgba(200,114,47,0.25)}
.credit-bar .balance{font-size:15px;font-weight:700;color:#fff}
.credit-bar .balance span{color:#E3945B}
.credit-bar .pack-buttons{display:flex;gap:8px;flex-wrap:wrap}
.credit-bar .pack-btn{font-size:13px;font-weight:700;padding:9px 16px;border-radius:8px;cursor:pointer;border:1px solid var(--border);background:rgba(255,255,255,0.03);color:var(--text-dim);font-family:inherit}
.credit-bar .pack-btn:hover{border-color:var(--red);color:#fff}
.st-cost{margin:0;font-size:14px;color:var(--text-dim)}
.st-cost b{color:var(--text)}
/* Credits as one line on every AI tool */
.credit-bar.qb-compact:not(.hidden){display:block!important}
.credit-bar.qb-compact{padding:0!important;border:0!important;background:none!important;margin:0 0 16px!important}
.qb-credit-line{margin:0;font-size:14px;color:var(--text-dim);line-height:1.6}
.qb-credit-line strong{color:var(--text)}
.qb-credit-line .qb-cl-bal span{color:inherit}
.qb-credit-line a{color:#E3945B;font-weight:600;text-decoration:underline}
/* Subtitles: language dropdown and words box look the same (Safari draws its own short select otherwise) */
.st-field input.sd-input,.st-field select.sd-input{height:48px;padding:0 14px;font-size:15px;border-radius:10px}
.st-field select.sd-input{-webkit-appearance:none;appearance:none;padding-right:40px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23999' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center}
.credit-bar .qb-credit-line{font-size:14px!important;line-height:1.6!important;font-weight:400!important;color:var(--text-dim)!important;margin:0!important}
.qb-credit-line .qb-cl-ok{color:#86efac!important}
.credit-bar .qb-credit-line{max-width:none!important}
#hubCreditBar .qb-credit-line{white-space:nowrap}
@media (max-width:760px){#hubCreditBar .qb-credit-line{white-space:normal}}
/* Text & SEO tools */
.tt-opts .qr-check{align-self:center;padding:0}
/* SEO Autopilot */
.ap-card{display:flex;flex-direction:column;gap:14px}
.ap-state{display:flex;flex-direction:column;gap:16px}
.ap-loading,.ap-note{font-size:13.5px;color:var(--text-dim);margin:0}
.ap-empty{display:flex;flex-direction:column;gap:12px}
.ap-empty h2{margin:0;font-size:21px;color:var(--text)}
.ap-empty p{margin:0;color:var(--text-dim);font-size:14.5px;line-height:1.6}
.ap-btns{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ap-card .sd-go{padding:12px 20px;font-size:14.5px;text-decoration:none;text-align:center}
.ap-card a.qrg-btn2{text-decoration:none;display:inline-flex;align-items:center}
.ap-add .sd-url-row{display:flex;gap:8px}.ap-add .sd-url-row .sd-input{flex:1;min-width:0}
.ap-top{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:flex-end;padding-bottom:12px;border-bottom:1px solid var(--border)}
.ap-label{display:block;font-size:12px;color:var(--text-dimmer)}
.ap-host{font-size:20px;color:var(--text)}
.ap-meta{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--text-dim)}
.ap-meta b{color:var(--text);font-weight:600}
.ap-settings .qr-check{padding:0}
/* Slug + compare v2 */
/* YouTube subscriber goal tracker */
/* Sliders: one clear look everywhere (Safari ignores accent-color on the track). The hidden before/after slider keeps its own style. */
input[type=range]:not(#baRange){-webkit-appearance:none;appearance:none;height:6px;border-radius:6px;background:linear-gradient(to right,#C8722F 0,#C8722F var(--p,50%),#5a524a var(--p,50%),#5a524a 100%);outline:none;cursor:pointer;margin:10px 0}
input[type=range]:not(#baRange)::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid #C8722F;box-shadow:0 1px 4px rgba(0,0,0,.4);cursor:pointer;margin-top:0}
input[type=range]:not(#baRange)::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid #C8722F;box-shadow:0 1px 4px rgba(0,0,0,.4);cursor:pointer}
input[type=range]:not(#baRange)::-moz-range-track{background:transparent;border:0}
input[type=range]:not(#baRange):focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px rgba(200,114,47,.35)}
input[type=range]:not(#baRange):disabled{opacity:.5;cursor:not-allowed}
/* ---- AI create tools (js/aiCreate.js) */
.acr-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.acr-grid .full{grid-column:1/-1}
@media (max-width:600px){.acr-grid{grid-template-columns: minmax(0, 1fr)}}
.st-field textarea.sd-input{min-height:96px;padding:12px 14px;font-size:15px;border-radius:10px;resize:vertical;font-family:inherit;line-height:1.5}
.acr-label{font-size:13.5px;font-weight:600;color:var(--text);margin:16px 0 8px}
.acr-label small{font-weight:400;color:var(--text-dimmer)}
.acr-photo{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.acr-photo-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border:1.5px dashed rgba(200,114,47,.55);border-radius:12px;background:rgba(200,114,47,.06);color:#E3945B;font:600 14px/1.2 inherit;font-family:inherit;cursor:pointer}
.acr-photo-btn svg{width:18px;height:18px}
.acr-prev{display:flex;align-items:center;gap:12px;font-size:13px;color:var(--text-dimmer)}
.acr-prev img{width:56px;height:56px;object-fit:cover;border-radius:10px;border:1px solid var(--border)}
.acr-prev span{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acr-go-row{margin-top:18px}
.acr-out{margin-top:20px}
.acr-img{border-radius:14px;overflow:hidden;border:1px solid var(--border);background:repeating-conic-gradient(#1c1c1c 0 25%,#151515 0 50%) 0 0/20px 20px;text-align:center}
.acr-img img{display:block;max-width:100%;max-height:640px;margin:0 auto}
.acr-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;align-items:center}
.acr-note{font-size:12.5px;color:var(--text-dimmer);margin:10px 0 0}
.acr-sec{border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:12px;background:rgba(255,255,255,.02)}
.acr-sec h3{font-size:15px;margin:0 0 10px;color:#fff}
.acr-sec h3 small{font-weight:400;color:var(--text-dimmer);font-size:12.5px}
.acr-list{margin:0;padding:0;list-style:none;counter-reset:a}
.acr-list li{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-top:1px solid var(--border)}
.acr-list li:first-child{border-top:0;padding-top:0}
.acr-list li p{flex:1;margin:0;font-size:14.5px;line-height:1.55;color:var(--text)}
.acr-list li .qrg-btn2,.acr-sec>.qrg-btn2{flex-shrink:0}
.acr-text{font-size:14.5px;line-height:1.6;color:var(--text);margin-bottom:10px;white-space:normal}
.acr-tags{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.acr-tags span{font-size:13px;padding:5px 10px;border-radius:999px;background:rgba(200,114,47,.12);color:#E3945B}
.acr-go-row .sd-go{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;margin-top:10px;font-size:16px;border-radius:12px}
.acr-go-row .st-cost{margin:0}
.acr-cp{padding:6px 12px!important;font-size:12.5px!important;min-height:0!important}
.acr-sec>.acr-cp{margin-top:2px}
.acr-actions .qrg-btn2{min-height:44px}
/* AI create — loading panel + result buttons */
.acr-loading{position:relative;display:flex;align-items:center;gap:14px;margin-top:16px;padding:18px 20px 22px;border:1px solid rgba(200,114,47,.35);border-radius:14px;background:linear-gradient(135deg,rgba(200,114,47,.10),rgba(200,114,47,.03));overflow:hidden}
.acr-loading.hidden{display:none}
.acr-spin{width:28px;height:28px;flex-shrink:0;border-radius:50%;border:3px solid rgba(227,148,91,.25);border-top-color:#E3945B;animation:acrSpin .8s linear infinite}
.acr-spin.sm{width:16px;height:16px;border-width:2px;border-color:rgba(255,255,255,.35);border-top-color:#fff;margin-right:10px;vertical-align:-3px;display:inline-block}
@keyframes acrSpin{to{transform:rotate(360deg)}}
.acr-load-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.acr-load-t b{font-size:15px;color:#fff;font-weight:700}
.acr-load-t span{font-size:13px;color:var(--text-dimmer)}
.acr-time{font:600 14px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:#E3945B;font-variant-numeric:tabular-nums}
.acr-load-bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.06);overflow:hidden}
.acr-load-bar i{position:absolute;top:0;bottom:0;width:35%;border-radius:3px;background:linear-gradient(90deg,transparent,#E3945B,transparent);animation:acrSlide 1.4s ease-in-out infinite}
@keyframes acrSlide{0%{left:-35%}100%{left:100%}}
.acr-go-row .sd-go.acr-busy{opacity:.75;cursor:progress}
.acr-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:11px;font:700 14.5px/1 inherit;font-family:inherit;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s;white-space:nowrap}
.acr-btn svg{width:17px;height:17px}
.acr-primary{background:var(--red);color:#fff;border:0}
.acr-primary:hover{filter:brightness(1.08)}
.acr-ghost{background:rgba(255,255,255,.04);color:#fff;border:1px solid var(--border)}
.acr-ghost:hover{border-color:rgba(200,114,47,.6);background:rgba(200,114,47,.08)}
.acr-actions{margin-top:16px}
@media (max-width:600px){.acr-actions .acr-btn{flex:1 1 100%}}
@media (prefers-reduced-motion:reduce){.acr-spin,.acr-load-bar i{animation-duration:3s}}
.acr-out + .qrg-privacy,.acr-out ~ .qrg-privacy{margin-top:22px}
.file-card .acr-go-row ~ .qrg-privacy{margin-top:18px}
/* YouTube goal tracker — dark theme to match the other tools */
/* exam pages: spec table + exam links */
/* ---- Exam photo & signature resizer layout */
.upload-section:has(.ex-grid){max-width:980px}
/* ---- Form-field baseline (every page). A text box must never collapse, look unstyled or be shorter than its button.
   Stacked rows (mobile) use flex-direction:column, where `flex:1` would squash the field to its text height — undone here. */
input.sd-input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]),select.sd-input{min-height:46px}
@media (max-width:600px){
  .sd-url-row>*,.ap-add .sd-url-row>*{flex:none!important;width:100%}
  .sd-url-row .sd-input,.sd-url-row input{min-height:50px!important;height:50px;font-size:16px}
  .sd-url-row .sd-go,.sd-url-row button{min-height:50px}
}
/* Every text box and dropdown on every page: at least 44px tall (easy to tap, never squashed). */
main :is(input[type=text],input[type=number],input[type=email],input[type=url],input[type=password],input[type=search],input[type=tel],input[type=date],input:not([type]),select){min-height:44px;box-sizing:border-box}
/* Dropdowns and boxes that were left with browser defaults get the site look. */
main select:not([class]),main input[type=number]:not([class]),main input[type=text]:not([class]){padding:0 12px;border-radius:10px;background-color:rgba(255,255,255,.04);border:1px solid var(--border);color:#fff;font:500 15px/1.2 inherit;font-family:inherit}
main select:not([class]) option{background:#1a1716}
/* Links inside sentences are underlined, so they are recognisable without relying on colour. */
.guide p a,.guide li a,.calc-faq p a,.faq-item p a,.conv-hero p a{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
.footer-trademark{color:rgba(255,255,255,.55)!important}
/* ---- AI create tools: form on the left, result on the right (stacks on phones) */
.upload-section:has(.acr-layout){max-width:1200px}
.acr-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:24px;align-items:start}
.acr-right{position:sticky;top:88px;min-height:420px;display:flex;flex-direction:column;padding:24px}
.acr-empty{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;min-height:360px;border:1.5px dashed rgba(255,255,255,.14);border-radius:14px;padding:24px;color:var(--text-dimmer)}
.acr-empty.hidden{display:none}
.acr-empty-ic{width:52px;height:52px;color:rgba(255,255,255,.35);margin-bottom:6px}
.acr-empty-ic svg{width:100%;height:100%}
.acr-empty b{font-size:17px;color:#fff;font-weight:700}
.acr-empty span:last-child{font-size:14px;max-width:300px;line-height:1.5}
.acr-right .acr-loading{margin-top:0}
.acr-right .acr-out{margin-top:0}
.acr-left .qrg-privacy{margin-top:16px}
@media (max-width:900px){.acr-layout{grid-template-columns: minmax(0, 1fr)}.acr-right{position:static;min-height:0}.acr-empty{min-height:180px}}
.acr-right .acr-img img{width:100%;height:auto;max-height:70vh;object-fit:contain}
/* ---- Salary slip & rent receipt */
.ss-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media (max-width:760px){.ss-grid{grid-template-columns: minmax(0, 1fr)}}
.ss-h{margin:0 0 8px;font-size:13px;font-weight:700;color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em}
.ss-row{display:grid;grid-template-columns:minmax(0,1fr) 110px 32px;gap:6px;margin-bottom:6px;align-items:center}
.ss-row .sd-input{min-height:42px;padding:0 10px;font-size:14px}
.ss-x{width:32px;height:32px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text-dimmer);font-size:18px;cursor:pointer}
.ss-x:hover{color:#fca5a5;border-color:rgba(248,113,113,.5)}
.ss-mini{display:grid;grid-template-columns:1fr auto;gap:4px 10px;margin-top:10px;font-size:13px;color:var(--text-dimmer)}
.ss-mini b{color:#fff;text-align:right}
.ss-warn{margin:10px 0 0;font-size:12.5px;line-height:1.5;color:#fcd34d;background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.25);border-radius:8px;padding:8px 10px}
/* ---- money calculators (inputs left, results right) */
.fc-note{margin-top:14px;line-height:1.55}
.acr-label.full{grid-column:1/-1}
/* Kruti Dev converter */
/* Age calculator */
/* Wide tools (form + result side by side): centre the page heading over the tool so edges line up */
main:has(.acr-layout, .kd-wrap, .gen-section) .conv-hero{text-align:center;padding-bottom:32px}
main:has(.acr-layout, .kd-wrap, .gen-section) .conv-hero .container{max-width:900px!important}
main:has(.acr-layout, .kd-wrap, .gen-section) .conv-hero p{max-width:640px;margin-left:auto;margin-right:auto}
main:has(.acr-layout, .kd-wrap, .gen-section) .conv-checklist{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px 22px}
.upload-section:has(.kd-wrap){max-width:none;padding:0}
/* Amazon seller tools */
.acr-layout>.sd-card,.acr-layout>.acr-left{margin:0;max-width:none;min-width:0}
/* Drag & zoom frame editor */
input[type=range]{accent-color:#c8722f}
/* Consistent spacing inside every tool card */
.acr-left > * + *, .acr-right > .acr-out > * + *{margin-top:20px}
.acr-left > .acr-note, .acr-left > .hidden + .acr-note{margin-top:10px}
.acr-left > .hidden + *{margin-top:20px}
.acr-left > .error-box.hidden, .acr-left > .hidden{margin-top:0}
.acr-grid{gap:18px 16px}
.st-field{gap:8px}
.acr-left .acr-actions{margin-top:20px}
.acr-left > .qrg-privacy{margin-top:22px}
.acr-label{margin:22px 0 10px}
.acr-grid > .acr-label{margin:6px 0 -6px}
.acr-grid > .st-field{justify-content:flex-end}.acr-grid > .st-field > span{flex:1 0 auto}
/* Size chart maker */
/* Older calculators & forms: same rhythm as the newer tools */
.options-row label{display:block}
.options-row label > input,.options-row label > select,.options-row label > div{display:block;margin-top:8px}
.options-row input[type="number"],.options-row input[type="month"],.options-row select{height:46px;padding:0 14px;border-radius:10px;font-size:15px}
.options-row{gap:18px 16px;margin-bottom:18px}
/* Genuine-use / safety notices on document and payment tools */
/* Characters */
.ch-section{max-width:1148px;margin:0 auto 56px;padding:0 24px}
.ch-head h2{margin:0 0 6px;font-size:22px}.ch-head p{margin:0 0 18px;color:var(--text-dimmer);font-size:14px}
.ch-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:14px}
.ch-pickwrap .ch-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.ch-card{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:rgba(255,255,255,.02);display:flex;flex-direction:column;transition:border-color .15s}
.ch-card.active{border-color:#E3945B;box-shadow:0 0 0 2px rgba(227,148,91,.35)}
.ch-card img{width:100%;aspect-ratio:16/9;object-fit:cover;background:#f2efe9;display:block}
.ch-meta{padding:10px 12px 4px;display:flex;flex-direction:column;gap:2px}.ch-meta b{color:#fff;font-size:14px}.ch-meta small{color:var(--text-dimmer);font-size:12px}
.ch-acts{display:flex;gap:6px;padding:8px 12px 12px;align-items:center}
.ch-pick{flex:1;height:34px;border-radius:9px;border:1px solid rgba(200,114,47,.55);background:rgba(200,114,47,.1);color:#E3945B;font:700 13px inherit;font-family:inherit;cursor:pointer}
.ch-pick:hover{background:rgba(200,114,47,.2)}
.ch-dl,.ch-del{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;border:1px solid var(--border);background:transparent;color:var(--text-dim);cursor:pointer;text-decoration:none;font-size:13px}
.ch-del:hover{color:#f2a49b;border-color:rgba(224,104,92,.45)}
.ch-empty{color:var(--text-dimmer);font-size:14px;padding:14px 16px;border:1px dashed var(--border);border-radius:12px;margin:0}
.ch-save{display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center;margin-top:16px;padding:14px;border-radius:12px;background:rgba(200,114,47,.07);border:1px solid rgba(200,114,47,.28);font-size:13.5px;color:var(--text-dim)}
.ch-save b{color:#8fd6a8}
/* ---- What's next panel (js/nextSteps.js) */
.qb-next{max-width:1100px;margin:22px auto 8px;padding:20px 22px;border:1px solid rgba(227,148,91,.35);border-radius:16px;background:linear-gradient(180deg,rgba(227,148,91,.08),rgba(255,255,255,.02));box-sizing:border-box;width:calc(100% - 32px);animation:qbnIn .35s ease}
.qb-next.qbn-float{position:fixed;left:50%;bottom:16px;transform:translateX(-50%);margin:0;z-index:60;max-width:760px;background:#1d1a17;box-shadow:0 18px 50px rgba(0,0,0,.45)}
@keyframes qbnIn{from{opacity:0;transform:translateY(8px)}to{opacity:1}}
.qb-next.qbn-float{animation:none}
.qbn-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}
.qbn-head b{display:block;font-size:17px;margin-bottom:3px}
.qbn-head span{font-size:13.5px;opacity:.75}
.qbn-x{background:none;border:0;color:inherit;opacity:.6;font-size:16px;cursor:pointer;padding:4px 6px}
.qbn-x:hover{opacity:1}
.qbn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.qbn-card{display:flex;flex-direction:column;gap:4px;padding:13px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}
.qbn-card:hover{border-color:#E3945B;transform:translateY(-1px)}
.qbn-card.first{border-color:rgba(227,148,91,.55)}
.qbn-card b{font-size:14.5px}
.qbn-card small{font-size:12.5px;opacity:.7;line-height:1.4}
.qbn-go{margin-top:auto;padding-top:6px;font-size:12.5px;font-weight:700;color:#E3945B}
.qbn-toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:#1d1a17;border:1px solid rgba(227,148,91,.5);color:#f3ece5;padding:11px 18px;border-radius:999px;font-size:14px;z-index:70;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.ch-badge{display:inline-block;font-size:10.5px;font-weight:800;padding:1px 7px;border-radius:999px;margin-left:6px;vertical-align:middle;background:rgba(255,255,255,.08)}
.ch-badge.cloud{background:rgba(74,222,128,.15);color:#86efac}
.ch-save{display:flex;flex-direction:column;gap:12px;margin-top:14px;padding:16px;border:1px solid rgba(255,255,255,.1);border-radius:14px;background:rgba(255,255,255,.02)}
.ch-save h4{margin:0;font-size:15px}
.ch-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ch-opt{display:flex;flex-direction:column;gap:6px;text-align:left;padding:14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.03);color:inherit;cursor:pointer;font:inherit}
.ch-opt:hover{border-color:#E3945B}
.ch-opt b{font-size:14.5px}
.ch-opt small{font-size:12.5px;opacity:.75;line-height:1.45}
.ch-warn{font-size:13px;line-height:1.5;padding:12px 14px;border-radius:10px;background:rgba(250,204,21,.08);border:1px solid rgba(250,204,21,.3)}
.ch-warn label{display:flex;gap:8px;align-items:flex-start;margin-top:8px;cursor:pointer}
.ch-flow{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:13px;margin:0 0 6px}
.ch-flow span{padding:5px 11px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.ch-flow span.on{border-color:#E3945B;color:#E3945B;font-weight:700}
@media (max-width:640px){.ch-opts{grid-template-columns: minmax(0, 1fr)}.qb-next{padding:16px}}
.ch-save .ch-opt b,.ch-save h4{color:inherit;text-align:left}
.ch-save h4{text-align:center}
.ch-warn>b{color:#facc15}
.ch-warn b{color:inherit}.ch-warn>b:first-child{color:#facc15}
.ch-save .acr-btn:disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.4)}
.ch-opt.on{border-color:#E3945B;background:rgba(227,148,91,.08)}
.pack-btn.pack-starter{border-color:rgba(74,222,128,.55)!important;color:#86efac}
.qb-next.qbn-inline{width:100%;max-width:none;margin:16px 0 4px;padding:16px 18px}
.qb-next.qbn-inline .qbn-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
.qb-next.qbn-inline .qbn-head b{font-size:16px}
/* ---- Spacing fixes from the site-wide spacing audit (keep blocks from touching) */
.qrg-privacy ~ .error-box,.ct-tip ~ .error-box,.gen-drop ~ .error-box,.qr-cam ~ .error-box,.fc-note ~ .error-box{margin-top:14px}
/* ---- Tool ratings */
.qb-rating{display:flex;width:fit-content;max-width:100%;align-items:center;gap:8px;margin:14px 0 18px;padding:6px 14px 6px 12px;border:1px solid rgba(255,255,255,.1);border-radius:999px;background:rgba(255,255,255,.035);font-size:13.5px;line-height:1.2;color:var(--text-dim,#bbb);box-sizing:border-box;flex-wrap:wrap}
.qb-rating.qbr-center{margin-left:auto;margin-right:auto}.qb-rating.qbr-right{margin-left:auto}.qb-rating.qbr-left{margin-left:0;margin-right:auto}
.qb-rating .qbr-st{color:#fbbf24;letter-spacing:1px;font-size:14px;line-height:1}.qb-rating .qbr-st i{font-style:normal;color:rgba(255,255,255,.2)}.qb-rating b{color:#fff;font-weight:700}
.qbr{margin-top:16px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08)}
.qbr-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.qbr-q{font-weight:700;font-size:14.5px}
.qbr-stars{display:flex;gap:4px}.qbr-stars button{background:none;border:0;cursor:pointer;font-size:28px;line-height:1;padding:2px 3px;color:rgba(255,255,255,.22);transition:color .12s,transform .12s}
.qbr-stars button.on{color:#fbbf24}.qbr-stars button:hover{transform:scale(1.12)}.qbr-stars button:focus-visible{outline:2px solid #E3945B;border-radius:6px}
.qbr-thanks{display:flex;flex-direction:column;gap:10px}.qbr-thanks span{font-size:13.5px;opacity:.85}.qbr-thanks small{opacity:.7}
.qbr-thanks textarea,.qbr-thanks input[type=email]{width:100%;box-sizing:border-box;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:10px 12px;color:inherit;font:inherit;font-size:14px}
.qbr-thanks textarea:focus,.qbr-thanks input:focus{outline:none;border-color:#E3945B}.qbr-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.qbr-acts{display:flex;gap:10px;flex-wrap:wrap}.qbr-send{background:#C8722F;color:#fff;border:0;border-radius:10px;padding:10px 18px;font-weight:700;cursor:pointer}.qbr-send:disabled{opacity:.6}
.qbr-skip{background:none;border:1px solid rgba(255,255,255,.16);color:inherit;border-radius:10px;padding:10px 16px;cursor:pointer}
.qbr-toast{position:fixed;left:16px;bottom:16px;z-index:65;width:min(380px,calc(100vw - 32px));box-sizing:border-box;background:#1d1a17;border:1px solid rgba(227,148,91,.45);border-radius:16px;padding:16px 18px;box-shadow:0 18px 50px rgba(0,0,0,.45);animation:qbnIn .35s ease}
.qbr-toast .qbr{margin:0;padding:0;border:0}.qbr-toast .qbn-x{position:absolute;top:8px;right:8px}.qbr-toast .qbr-row{padding-right:22px}
@media (max-width:640px){.qbr-toast{bottom:88px}}
/* ---- Bulk sections (js/batchKit.js + js/bulkTools.js) */
.bk-section{margin-top:28px;margin-bottom:8px}
.bk-card{max-width:1100px;margin:0 auto;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:linear-gradient(180deg,rgba(227,148,91,.06),rgba(255,255,255,.015));padding:26px 28px;box-sizing:border-box}
.bk-head{margin-bottom:18px}.bk-head h2{margin:8px 0 6px;font-size:22px}.bk-head p{margin:0;font-size:14.5px;line-height:1.55;opacity:.8;max-width:760px}
.bk-badge{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 10px;border-radius:999px;background:rgba(227,148,91,.16);color:#E3945B}
.bk-head .bk-limit{margin-top:8px;font-size:12.5px;opacity:.7}
.bk-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin:0 0 18px}
.bk-step{border:1px solid rgba(255,255,255,.09);border-radius:14px;padding:16px;background:rgba(255,255,255,.02);display:flex;flex-direction:column;gap:10px}
.bk-step b{font-size:14px}.bk-step small{font-size:12.5px;opacity:.72;line-height:1.5}.bk-step .acr-btn{align-self:flex-start}
.bk-num{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:50%;background:rgba(227,148,91,.18);color:#E3945B;font-size:12px;font-weight:800;margin-right:8px}
label.bk-drop,.bk-drop{display:block;box-sizing:border-box;width:100%;border:1.5px dashed rgba(255,255,255,.18);border-radius:14px;padding:26px 18px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s;font-size:14px}
.bk-drop b{display:block;font-size:14.5px}.bk-drop:hover,.bk-drop.over{border-color:#E3945B;background:rgba(227,148,91,.05)}.bk-drop small{display:block;margin-top:4px;opacity:.65;font-size:12.5px}
.bk-files{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:6px;max-height:260px;overflow:auto}
.bk-files li{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.035);font-size:13.5px}
.bk-files li span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bk-files li small{opacity:.6;font-size:12px}
.bk-files li button{background:none;border:0;color:inherit;opacity:.6;cursor:pointer;font-size:14px;padding:2px 6px}.bk-files li button:hover{opacity:1}
.bk-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:16px 0 0}
.bk-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:18px}.bk-actions .bk-note{font-size:12.5px;opacity:.7}
.bk-table-wrap{margin-top:14px;max-height:300px;overflow:auto;border:1px solid rgba(255,255,255,.09);border-radius:12px}
.bk-table{width:100%;border-collapse:collapse;font-size:12.5px}.bk-table th,.bk-table td{padding:7px 10px;text-align:left;border-bottom:1px solid rgba(255,255,255,.06);white-space:nowrap}
.bk-table th{position:sticky;top:0;background:#1d1a17;font-weight:700;opacity:.9}.bk-table tr.bad td{color:#fca5a5}.bk-table td.bk-msg{white-space:normal;min-width:180px}
.bk-progress{margin-top:18px}.bk-progress p{margin:8px 0 0;font-size:13.5px;opacity:.85}.bk-progress p b{margin-left:6px}
.bk-bar{height:8px;border-radius:99px;background:rgba(255,255,255,.08);overflow:hidden}.bk-bar i{display:block;height:100%;background:#E3945B;border-radius:99px;transition:width .25s}
.bk-done{margin-top:18px;padding:16px 18px;border-radius:14px;border:1px solid rgba(74,222,128,.3);background:rgba(74,222,128,.06)}.bk-done p{margin:0}.bk-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.bk-fails{margin-top:12px;font-size:13px}.bk-fails summary{cursor:pointer;color:#fca5a5}.bk-fails ul{margin:8px 0 0;padding-left:18px}
.bk-thumbs{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.bk-thumbs button{position:relative;width:64px;height:64px;padding:0;border-radius:10px;overflow:hidden;border:2px solid transparent;background:rgba(255,255,255,.04);cursor:pointer}
.bk-thumbs button.on{border-color:#E3945B}.bk-thumbs img{width:100%;height:100%;object-fit:cover;display:block}.bk-thumbs button i{position:absolute;right:3px;top:3px;font-style:normal;font-size:10px;background:#16a34a;color:#fff;border-radius:99px;padding:0 4px}
.bk-jump{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:13.5px;font-weight:600;color:#E3945B;text-decoration:none}.bk-jump:hover{text-decoration:underline}
@media (max-width:640px){.bk-card{padding:20px 16px}.bk-head h2{font-size:19px}}
.bk-card .bk-note{font-size:12.5px;line-height:1.55;opacity:.72;margin:12px 0 0}.bk-card .bk-actions .bk-note{margin:0}
.bk-text{display:block;width:100%;box-sizing:border-box;margin-top:14px;min-height:260px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;line-height:1.55;resize:vertical;white-space:pre-wrap}
.qbr-form:empty{display:none}.qbr-form{display:flex;flex-direction:column;gap:10px;margin-top:14px}.qbr-form .qbr-sel{font-size:14px}.qbr-form .qbr-ask{font-size:13.5px;opacity:.85}.qbr-form small{opacity:.7}
.qbr-form textarea,.qbr-form input[type=email]{width:100%;box-sizing:border-box;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:10px 12px;color:inherit;font:inherit;font-size:14px}
.qbr-form textarea:focus,.qbr-form input:focus{outline:none;border-color:#E3945B}.qbr-err{color:#fca5a5}

/* ---- Original / AI-cleaned switch (both versions kept — no paying twice) */
.qb-ver{display:inline-flex;gap:4px;padding:4px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1)}
.qb-ver button{background:none;border:0;color:inherit;opacity:.7;font:inherit;font-size:13.5px;font-weight:600;padding:7px 14px;border-radius:9px;cursor:pointer}
.qb-ver button.on{background:#C8722F;color:#fff;opacity:1}.qb-ver button:not(.on):hover{opacity:1;background:rgba(255,255,255,.06)}
.qb-ver.hidden{display:none}
.qb-next.qbn-inline{grid-column:1 / -1;flex-basis:100%}

/* Amazon Image Checker: once photos are checked, settings sit on top and the report gets the full width */
/* Buttons keep their label on one line and a steady height on every screen size */
.acr-btn{flex-shrink:0}
/* Amazon checker: compact settings bar and summary */
/* Scan to PDF: captured page thumbnails */
/* Scan to PDF: camera with live page outline, looks, corner editor */
/* Page board (Merge / Split PDF) */
/* Split PDF */
/* Image to PDF: page settings + true page previews */
/* Compress PDF levels + before/after */
/* Image studio (Resize Image) */
.is-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:22px;margin-top:18px;align-items:start}
.is-preview{position:sticky;top:88px}
.is-stage{display:flex;align-items:center;justify-content:center;min-height:240px;max-height:420px;padding:12px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.03)}
.is-stage canvas{max-width:100%;max-height:396px;width:auto;height:auto;box-shadow:0 2px 12px rgba(0,0,0,.45)}
.is-stage canvas.is-alpha{background:repeating-conic-gradient(#3a3631 0 25%,#2c2925 0 50%) 0 0/16px 16px}
.is-meta{margin:10px 0 0;font-size:13px;color:var(--text-dim);line-height:1.6;text-align:center}
.is-meta b{color:#fff}.is-arrow{color:#E3945B;margin:0 4px}
.is-ctrl{display:flex;flex-direction:column;gap:16px;min-width:0}
.is-dims{display:flex;align-items:flex-end;gap:10px}
.is-dims label{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:600;color:var(--text-dim)}
.is-dims input{height:42px;border-radius:10px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:#fff;padding:0 12px;font:inherit;font-size:15px;font-weight:600;width:100%}
.is-unit{font-size:13px;color:var(--text-dimmer);padding-bottom:12px}
.is-lock{flex:0 0 auto;width:42px;height:42px;border-radius:10px;border:1px solid var(--border);background:rgba(255,255,255,.04);color:rgba(255,255,255,.45);cursor:pointer;display:flex;align-items:center;justify-content:center}
.is-lock.on{background:rgba(200,114,47,.14);color:#E3945B;border-color:rgba(200,114,47,.4)}
.is-scale{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:13px;color:var(--text-dim);font-weight:600}
.is-scale span{margin-right:2px}
.is-scale button,.is-mini{height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:#fff;font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer}
.is-scale button:hover,.is-mini:hover{border-color:var(--border-hover)}
.is-field{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600;color:var(--text-dim)}
.is-field b{color:#fff}
.is-seg{display:flex;border:1px solid var(--border);border-radius:10px;overflow:hidden}
.is-seg button{flex:1;min-height:38px;padding:6px 8px;background:transparent;border:0;border-right:1px solid var(--border);color:var(--text-dim);font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}
.is-seg button:last-child{border-right:0}
.is-seg button.on{background:rgba(200,114,47,.16);color:#fff}
.is-bg{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--text-dim)}
.is-bg input[type=color]{width:42px;height:30px;border:1px solid var(--border);border-radius:8px;background:none;padding:2px;cursor:pointer}
.is-row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.is-row2 select{height:40px}
.is-row2 input[type=range]{width:100%;accent-color:#c8722f;height:40px}
.is-presets{border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.02)}
.is-presets summary{cursor:pointer;padding:12px 14px;font-size:13.5px;font-weight:700;color:#fff;list-style-position:inside}
.is-presets[open] summary{border-bottom:1px solid var(--border)}
.is-pg-h{display:block;font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#E3945B;margin-bottom:6px}
.is-chips{display:flex;flex-wrap:wrap;gap:6px}
.is-chip{display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;padding:7px 10px;border-radius:10px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:#fff;font-family:inherit;font-size:12.5px;font-weight:600;cursor:pointer;text-align:left}
.is-chip small{font-size:11px;color:var(--text-dimmer);font-weight:500}
.is-chip:hover{border-color:var(--border-hover)}
.is-chip.on{border-color:#E3945B;background:rgba(200,114,47,.14)}
@media (max-width:760px){.is-wrap{grid-template-columns: minmax(0, 1fr)}.is-preview{position:static}.is-stage{min-height:180px}.is-seg button{font-size:12.5px}}
/* converter result: sizes + preview */
/* New background editor */
.be-modal{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:16px}
.be-box{width:min(940px,100%);max-height:100%;overflow:auto;background:#171512;border:1px solid var(--border);border-radius:16px;padding:18px}
.be-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.be-head b{color:#fff;font-size:17px}
.be-x{width:34px;height:34px;border-radius:9px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:var(--text-dim);cursor:pointer;font-size:14px}
.be-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:start}
.be-stage{display:flex;align-items:center;justify-content:center;min-height:300px;padding:12px;border-radius:12px;border:1px solid var(--border);background:repeating-conic-gradient(#3a3631 0 25%,#2c2925 0 50%) 0 0/16px 16px}
.be-cv{max-width:100%;max-height:60vh;width:auto;height:auto;box-shadow:0 2px 14px rgba(0,0,0,.45)}
.be-ctrl{display:flex;flex-direction:column;gap:16px}
.be-sec{display:flex;flex-direction:column;gap:8px}
.be-h{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#E3945B}
.be-sw{display:flex;flex-wrap:wrap;gap:8px}
.be-dot{position:relative;width:32px;height:32px;border-radius:50%;border:2px solid rgba(255,255,255,.18);cursor:pointer;padding:0;overflow:hidden}
.be-dot.on{border-color:#E3945B;box-shadow:0 0 0 2px rgba(200,114,47,.45)}
.be-tr{background:repeating-conic-gradient(#ccc 0 25%,#fff 0 50%) 0 0/10px 10px}
.be-pick{background:conic-gradient(red,yellow,lime,cyan,blue,magenta,red)}
.be-pick input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.be-up{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 16px;border-radius:10px;border:1px dashed rgba(200,114,47,.55);background:rgba(200,114,47,.06);color:#E3945B;font-weight:700;font-size:13.5px;cursor:pointer;align-self:flex-start}
.be-size{height:40px}
.be-range{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;color:var(--text-dim)}
.be-range input{flex:1;accent-color:#c8722f}
.be-chk{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:600;color:var(--text-dim);cursor:pointer}
.be-chk input{accent-color:#c8722f;width:16px;height:16px}
.be-seg{display:flex;border:1px solid var(--border);border-radius:10px;overflow:hidden}
.be-seg button{flex:1;height:38px;border:0;border-right:1px solid var(--border);background:transparent;color:var(--text-dim);font-family:inherit;font-weight:700;font-size:13px;cursor:pointer}
.be-seg button:last-child{border-right:0}.be-seg button.on{background:rgba(200,114,47,.16);color:#fff}
.be-meta{font-size:12.5px;color:var(--text-dimmer);margin:0}
.be-dl{width:100%}
@media (max-width:760px){.be-body{grid-template-columns: minmax(0, 1fr)}.be-stage{min-height:200px}.be-cv{max-height:40vh}}
/* Subtitle generator: burn captions into the video */
.bn-card{margin-top:20px;padding:18px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.02)}
.bn-h{display:flex;flex-direction:column;gap:3px;margin-bottom:14px}.bn-h b{color:#fff;font-size:16px}.bn-h small{font-size:13px;color:var(--text-dimmer)}
.bn-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:18px;align-items:start}
.bn-prev{display:flex;flex-direction:column;gap:8px;align-items:center}
.bn-prev canvas{max-width:100%;max-height:380px;border-radius:10px;background:#000;box-shadow:0 2px 12px rgba(0,0,0,.4)}
.bn-tip{font-size:12px;color:var(--text-dimmer)}
.bn-ctrl{display:flex;flex-direction:column;gap:14px}
.bn-sec{display:flex;flex-direction:column;gap:8px;font-size:13px;font-weight:600;color:var(--text-dim)}
.bn-sec input[type=range]{accent-color:#c8722f}
.bn-styles{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bn-style{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;border:1px solid var(--border);background:rgba(255,255,255,.03);color:#fff;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;text-align:left}
.bn-style i{font-style:normal;display:inline-flex;align-items:center;justify-content:center;width:38px;height:28px;border-radius:6px;background:#3b3a38;font-size:15px}
.bn-style.on{border-color:#E3945B;background:rgba(200,114,47,.14)}
.bn-note{font-size:12.5px;color:var(--text-dimmer);margin:0}
#bnProg{display:flex;flex-wrap:wrap;align-items:center;gap:8px}#bnProg .ps-bar{flex:1 1 100%}
@media (max-width:760px){.bn-grid{grid-template-columns: minmax(0, 1fr)}}
.bn-ctrl .sd-go{min-height:48px;margin:0;flex:0 0 auto;font-size:15px}
/* SEO audit report */
.au-card{padding:16px 18px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.02);min-width:0}
.au-card h3{margin:0 0 12px;font-size:15px;color:#fff;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}.au-card h3 small{font-size:12px;color:var(--text-dimmer);font-weight:500}
.au-muted{font-size:13px;color:var(--text-dimmer);margin:8px 0 0;line-height:1.5}
.upload-section:has(.au-cards){max-width:1080px}
/* SEO audit: tidier speed card */
/* Bulk Product SEO: score, review */
.ps-in { margin-top: 6px; }
.ps-hint { margin: 6px 0 0; font-size: 12px; color: var(--text-dimmer); line-height: 1.5; }
.ps-sample { margin-bottom: 10px; }
.ps-resume { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 14px; margin-bottom: 12px; border: 1px solid rgba(200,114,47,0.45); background: rgba(200,114,47,0.08); border-radius: 10px; }
.ps-resume strong { display: block; color: #fff; font-size: 14px; }
.ps-resume span { font-size: 12.5px; color: var(--text-dim); }
.ps-score { padding: 8px 6px 4px; }
.ps-score + .gen-result:not(.hidden) { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--border); }
.ps-score-top { display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.ps-score-top strong { display: block; color: #fff; font-size: 16px; }
.ps-score-top span { display: block; font-size: 13px; color: var(--text-dim); margin-top: 3px; line-height: 1.45; }
.ps-ring { --p: 0; --c: #E3945B; flex: 0 0 86px; width: 86px; height: 86px; border-radius: 50%; display: grid; place-content: center; text-align: center; background: radial-gradient(closest-side, #141210 79%, transparent 80% 100%), conic-gradient(var(--c) calc(var(--p) * 1%), rgba(255,255,255,0.08) 0); }
.ps-ring b { font-size: 26px; line-height: 1; color: #fff; }
.ps-ring span { font-size: 11px; color: var(--text-dimmer); margin-top: 2px; }
.ps-bars { display: flex; flex-direction: column; gap: 12px; }
.pq-bar-l { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--text); }
.pq-bar-l b { color: #fff; font-weight: 700; white-space: nowrap; }
.pq-track { position: relative; height: 7px; border-radius: 99px; background: rgba(255,255,255,0.07); margin: 6px 0 4px; overflow: hidden; }
.pq-track i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 99px; transition: width .4s; }
.pq-track i.pq-was { background: rgba(255,255,255,0.22); }
.pq-bar small { font-size: 11.5px; color: var(--text-dimmer); }
.ps-review { margin-top: 28px; border: 1px solid var(--border); background: rgba(255,255,255,0.02); border-radius: 14px; padding: 22px 22px 18px; scroll-margin-top: 90px; }
.ps-review-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.ps-review-head h2 { margin: 0 0 4px; font-size: 22px; color: #fff; }
.ps-review-head p { margin: 0; font-size: 13.5px; color: var(--text-dim); max-width: 640px; line-height: 1.5; }
.ps-dl2 { padding: 12px 22px; border-radius: 10px; font-weight: 700; white-space: nowrap; }
.ps-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 18px 0 14px; }
.ps-filters .gen-tab { margin: 0; }
.ps-filters .gen-tab span { margin-left: 4px; opacity: 0.75; }
.ps-search { flex: 1 1 200px; max-width: 280px; margin-left: auto; min-width: 0; }
.ps-list { display: flex; flex-direction: column; gap: 12px; }
.ps-item { border: 1px solid var(--border); border-radius: 12px; padding: 14px 16px 16px; background: rgba(255,255,255,0.02); }
.ps-item.off { opacity: 0.55; }
.ps-item header { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.ps-use { display: flex; align-items: center; gap: 10px; cursor: pointer; min-width: 0; }
.ps-use input { width: 17px; height: 17px; flex-shrink: 0; accent-color: #C8722F; }
.ps-use span { font-weight: 700; color: #fff; font-size: 14.5px; overflow-wrap: anywhere; }
.ps-tags { display: flex; gap: 6px; flex-wrap: wrap; }
.ps-tag { font-style: normal; font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 99px; background: rgba(255,255,255,0.07); color: var(--text-dim); }
.ps-t-free { background: rgba(63,178,127,0.15); color: #6fd3a3; }
.ps-t-warn { background: rgba(229,83,75,0.14); color: #f08a84; }
.ps-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 360px); gap: 18px; align-items: start; }
@media (max-width: 860px) { .ps-body { grid-template-columns: minmax(0, 1fr); } }
.ps-fields { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.ps-fl { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 12px; font-weight: 700; color: var(--text-dim); margin-bottom: 5px; }
.ps-m { font-weight: 600; }
.ps-ok { color: #6fd3a3; }
.ps-bad { color: #f08a84; }
.ps-f { width: 100%; box-sizing: border-box; min-width: 0; padding: 9px 11px; border-radius: 8px; background: rgba(255,255,255,0.04); border: 1px solid var(--border); color: #fff; font-size: 14px; font-family: inherit; line-height: 1.45; resize: vertical; }
.ps-f:focus { outline: none; border-color: #C8722F; }
.ps-desc { font-size: 12.5px; font-family: ui-monospace, Menlo, Consolas, monospace; }
.ps-field .ps-was-t { margin-top: 5px; font-size: 12px; color: var(--text-dimmer); overflow-wrap: anywhere; }
.ps-undo { margin-top: 5px; padding: 0; border: 0; background: none; color: #E3945B; font-size: 12px; font-weight: 700; cursor: pointer; font-family: inherit; }
.ps-prev-h { display: block; font-size: 12px; font-weight: 700; color: var(--text-dim); margin-bottom: 6px; }
.ps-snip { background: #fff; border-radius: 10px; padding: 12px 14px; font-family: Arial, sans-serif; overflow-wrap: anywhere; }
.ps-snip small { display: block; font-size: 12px; color: #4d5156; margin-bottom: 3px; }
.ps-snip b { display: block; font-size: 18px; font-weight: 400; color: #1a0dab; line-height: 1.3; margin-bottom: 4px; }
.ps-snip span { display: block; font-size: 13px; color: #4d5156; line-height: 1.5; }
.ps-pager { display: flex; justify-content: center; align-items: center; gap: 14px; margin-top: 16px; font-size: 13px; color: var(--text-dim); }
.ps-pager:empty { display: none; }
.ps-none { text-align: center; color: var(--text-dim); padding: 24px 0; margin: 0; }
@media (max-width: 560px) { .ps-review { padding: 16px 14px; } .ps-search { max-width: none; margin-left: 0; flex-basis: 100%; } .ps-dl2 { width: 100%; } .ps-review-act { width: 100%; } }
/* Product SEO: same height for every text box and dropdown (Safari draws selects shorter otherwise) */
#toolWrap .gen-row select, #toolWrap .ps-in { height: 48px; margin-top: 6px; box-sizing: border-box; padding: 0 14px; font-size: 15px; line-height: 46px; border-radius: 10px; background-color: rgba(255,255,255,0.04); border: 1px solid var(--border); color: #fff; }
#toolWrap .gen-row select { -webkit-appearance: none; appearance: none; padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23bbb' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
#toolWrap .gen-row select:focus, #toolWrap .ps-in:focus { outline: none; border-color: #C8722F; }
#toolWrap .gen-row .ct-label { display: block; }
/* Every dropdown draws like a text box in every browser (Safari otherwise ignores padding/height on native selects,
   so a dropdown next to a text box ends up shorter or taller). Own chevron, same box model as inputs. */
select:not([multiple]):not([size]):not(.qb-chat-lang) { -webkit-appearance: none !important; appearance: none !important; padding-right: 36px !important; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5 6 6.5 11 1.5' fill='none' stroke='%23aaa' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important; background-position: right 13px center !important; background-size: 12px 8px !important; }
select:not([multiple]):not([size]) option { background-color: #1a1716; color: #fff; }
select.sd-input { line-height: 20px; }
input.sd-input { line-height: 20px; }
.st-field{justify-content:flex-end} /* fields side by side: boxes line up even when one label wraps to two lines */
/* ---- Site search: results list, voice, search window ---- */
.qs-wrap { position: relative; }
.qs-mic, .qs-lang { position: absolute; top: 50%; transform: translateY(-50%); border: 0; cursor: pointer; font-family: inherit; display: inline-flex; align-items: center; justify-content: center; }
.qs-mic { right: 10px; width: 40px; height: 40px; border-radius: 50%; background: rgba(200,114,47,0.14); color: #E3945B; }
.qs-mic svg { width: 20px; height: 20px; }
.qs-mic:hover { background: rgba(200,114,47,0.26); color: #fff; }
.qs-mic.on { background: #C8722F; color: #fff; animation: qsPulse 1.2s ease-out infinite; }
@keyframes qsPulse { 0% { box-shadow: 0 0 0 0 rgba(200,114,47,0.55); } 100% { box-shadow: 0 0 0 14px rgba(200,114,47,0); } }
.qs-wrap .qs-lang { right: 58px; height: 32px; min-width: 52px; padding: 0 22px 0 10px; border-radius: 8px; border: 1px solid var(--border); background: rgba(255,255,255,0.05) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23aaa' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 8px center; color: var(--text-dim); font-size: 12.5px; font-weight: 700; box-sizing: border-box; }
.qs-wrap .qs-lang span { pointer-events: none; white-space: nowrap; }
.qs-wrap .qs-lang select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; margin: 0; padding: 0 !important; border: 0; font-size: 16px; }
.qs-lang:hover { color: #fff; background: rgba(255,255,255,0.12); }
.qs-wrap input[type=search]::-webkit-search-cancel-button { margin-right: 4px; }
.qs-listening input { border-color: #C8722F !important; }
.qs-drop { position: absolute; left: 0; right: 0; top: calc(100% + 8px); z-index: 60; max-height: min(460px, 62vh); overflow-y: auto; padding: 6px; border-radius: 14px; background: #1a1715; border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 18px 50px rgba(0,0,0,0.55); text-align: left; }
.qs-drop.hidden, .qs-list:empty { display: none; }
.qs-item { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; text-decoration: none; color: inherit; }
.qs-item:hover, .qs-item.on { background: rgba(200,114,47,0.13); }
.qs-ico { flex: 0 0 34px; width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: rgba(255,255,255,0.05); color: #E3945B; }
.qs-ico svg { width: 18px; height: 18px; }
.qs-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.qs-txt b { color: #fff; font-size: 14.5px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.qs-txt small { color: var(--text-dim); font-size: 12.5px; line-height: 1.4; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.qs-b { flex-shrink: 0; font-style: normal; font-size: 11px; font-weight: 700; padding: 3px 8px; border-radius: 99px; background: rgba(63,178,127,0.14); color: #6fd3a3; }
.qs-b-ai { background: rgba(200,114,47,0.18); color: #E3945B; }
.qs-b-guide { background: rgba(255,255,255,0.08); color: var(--text-dim); }
.qs-h { padding: 10px 12px 6px; font-size: 11.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--text-dimmer); display: flex; align-items: center; gap: 6px; }
.qs-h svg { width: 15px; height: 15px; color: #E3945B; }
.qs-h-ai { color: #E3945B; }
.qs-recent { display: flex; align-items: center; gap: 10px; width: 100%; padding: 9px 12px; border: 0; border-radius: 10px; background: none; color: var(--text); font: inherit; font-size: 14px; cursor: pointer; text-align: left; }
.qs-recent:hover { background: rgba(255,255,255,0.06); }
.qs-recent svg { width: 16px; height: 16px; color: var(--text-dimmer); flex-shrink: 0; }
.qs-ai, .qs-note { margin: 0; padding: 14px; font-size: 13.5px; color: var(--text-dim); line-height: 1.55; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.qs-spin { width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(200,114,47,0.3); border-top-color: #E3945B; animation: qsSpin .8s linear infinite; flex-shrink: 0; }
@keyframes qsSpin { to { transform: rotate(360deg); } }
.qs-more { padding: 8px 12px 6px; font-size: 12.5px; color: var(--text-dimmer); text-align: center; }
/* header button */
.qs-open { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 10px; border: 1px solid var(--border); background: rgba(255,255,255,0.04); color: var(--text-dim); font: inherit; font-size: 14px; font-weight: 600; cursor: pointer; }
.qs-open svg { width: 17px; height: 17px; }
.qs-open:hover { color: #fff; border-color: var(--border-hover, rgba(255,255,255,0.25)); }
@media (max-width: 1180px) { .qs-open span { display: none; } .qs-open { width: 38px; padding: 0; justify-content: center; } }
/* search window */
.qs-lock { overflow: hidden; }
.qs-modal { position: fixed; inset: 0; z-index: 2147483000; background: rgba(0,0,0,0.6); backdrop-filter: blur(3px); display: flex; justify-content: center; align-items: flex-start; padding: 10vh 16px 16px; }
.qs-modal.hidden { display: none; }
.qs-panel { width: 100%; max-width: 640px; max-height: 78vh; display: flex; flex-direction: column; border-radius: 16px; background: #1a1715; border: 1px solid rgba(255,255,255,0.12); box-shadow: 0 30px 80px rgba(0,0,0,0.6); overflow: hidden; }
.qs-field { position: relative; display: flex; align-items: center; gap: 10px; padding: 0 16px; border-bottom: 1px solid var(--border); }
.qs-field > svg { width: 20px; height: 20px; color: var(--text-dimmer); flex-shrink: 0; }
.qs-field input { flex: 1; min-width: 0; height: 60px; border: 0; background: none; color: #fff; font: inherit; font-size: 17px; outline: none; padding-right: 120px; }
.qs-list { overflow-y: auto; padding: 6px; flex: 1; }
.qs-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 16px; border-top: 1px solid var(--border); font-size: 12px; color: var(--text-dimmer); }
.qs-foot kbd { display: inline-block; padding: 1px 6px; margin: 0 2px; border-radius: 5px; border: 1px solid var(--border); font: inherit; font-size: 11px; }
.qs-x { display: none; flex-shrink: 0; height: 40px; padding: 0 2px 0 6px; align-items: center; border: 0; background: none; color: #E3945B; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; order: 9; }
.qs-close { border: 0; background: none; color: var(--text-dim); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
@media (max-width: 640px) {
  .qs-modal { padding: 0; align-items: stretch; }
  .qs-panel { max-width: none; max-height: none; height: 100%; border-radius: 0; border: 0; }
  .qs-foot span { display: none; } .qs-foot { justify-content: flex-end; }
  .qs-drop { max-height: 58vh; }
  .qs-foot { display: none; }
  .qs-x { display: inline-flex !important; }
  .qs-field input { padding-right: 92px; }
  .qs-field .qs-mic { right: 76px; } .qs-field .qs-lang { right: 122px; }
  .qs-field input { padding-right: 176px; }
}
@media (max-width: 640px) { .qs-field input::-webkit-search-cancel-button { display: none; } }
/* Crop image: select-an-area mode */
/* SEO Autopilot extras */
/* Store Agent */
.sa-prod header { display: flex; align-items: center; gap: 12px; }
.sa-prod header img { width: 44px; height: 44px; border-radius: 8px; object-fit: cover; background: #222; flex-shrink: 0; }
.sa-prod header b { flex: 1; min-width: 0; color: #fff; font-size: 15px; overflow-wrap: anywhere; }

/* Store Agent explainer */
.sag { max-width: 860px; padding-bottom: 24px; }
.sag-h { font-size: 24px; margin: 56px 0 14px; letter-spacing: -0.01em; }
.sag-p { font-size: 15px; line-height: 1.65; color: var(--text-dim); margin: 12px 0 0; }
.sag-tw { overflow-x: auto; border: 1px solid var(--border); border-radius: 12px; }
.sag-t { width: 100%; border-collapse: collapse; font-size: 14px; line-height: 1.55; }
.sag-t th { text-align: left; padding: 11px 14px; color: var(--text-dim); font-weight: 700; background: rgba(255,255,255,0.03); white-space: nowrap; }
.sag-t td { padding: 11px 14px; border-top: 1px solid var(--border); vertical-align: top; color: var(--text-dim); }
.sag-t tbody tr:first-child td { border-top: 0; } .sag-t thead + tbody tr:first-child td { border-top: 1px solid var(--border); }
.sag-t td strong { color: var(--text); white-space: nowrap; }
.sag .calc-faq { margin-top: 56px; padding-left: 0; padding-right: 0; max-width: none; }
@media (max-width: 720px) { .sag-h { font-size: 21px; margin-top: 44px; } .sag-t td strong { white-space: normal; } }

/* Score / count tiles (replaces the old circles: cleaner, never cramped) */

/* Resize Image: roomier, grouped layout */
/* Print File Checker: wider workspace once a file is loaded */

/* "Change file" control at the top of every tool card */
.qb-cardbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: -4px 0 18px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
.qb-fname { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; font-weight: 600; color: var(--text); }
.qb-fname:empty::before { content: "Your file"; color: var(--text-dimmer); }
.qb-cardbar[hidden], .qb-change[hidden] { display: none; }
.qb-moved { position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important; clip-path: inset(50%) !important; border: 0 !important; }
.qb-change { display: inline-flex; align-items: center; gap: 7px; flex: none; height: 36px; padding: 0 14px; border-radius: 10px; border: 1px solid var(--border-hover); background: rgba(255,255,255,0.04); color: #fff; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none; white-space: nowrap; }
.qb-change:hover { border-color: rgba(200,114,47,0.6); color: #E3945B; }
.file-card-top > .qb-change { margin-left: auto; }

.qb-btns { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; margin-left: auto; }
.qb-btns > button { height: 36px !important; padding: 0 14px !important; border-radius: 10px !important; font-size: 13px !important; font-weight: 600 !important; display: inline-flex; align-items: center; gap: 6px; }
/* New PDF tools (rotate, watermark, page numbers, PDF to JPG/Word/Excel): wide workspace, grouped settings */

/* Robots.txt generator: settings left, live file right */
/* SEO tools: the card widens once a report is showing */
.upload-section:has(> .sd-card #report:not(.hidden):not(:empty)) { max-width: 1120px; }
/* Typing tools: a roomier writing area */
/* EMI calculator: inputs + result left, yearly schedule right */
/* Phone: small text-style buttons get a finger-sized tap area */
@media (max-width: 600px) { #exampleBtn, #rmMusicClear { min-height: 40px; padding-top: 10px; padding-bottom: 10px; } .fp-swap-label { font-size: 11px; } }
.options-row input[type="month"] { color-scheme: dark; }
/* Photo pickers at the top of a tool: a proper drop target, not a small button */
.acr-left > .acr-photo-btn:first-child { width: 100%; min-height: 112px; flex-direction: column; justify-content: center; gap: 10px; padding: 22px 16px; font-size: 15px; }
.acr-left > .acr-photo-btn:first-child svg { width: 26px; height: 26px; }
.acr-left > .acr-photo-btn:first-child:hover { background: rgba(200,114,47,.1); border-color: rgba(200,114,47,.8); }
/* Marketplace Seller Agent */

/* Store Agent: draft products */
/* Seller Agent — live Amazon connection */
/* Seller Agent — create on Amazon */
/* AI image generator — one-tap controls */
.gen-keep { margin-top: 12px; padding: 12px 14px; border: 1px solid rgba(200,114,47,.45); background: rgba(200,114,47,.07); border-radius: 12px; display: grid; gap: 8px; }
.gen-keep-t { margin: 0; font-size: 13px; color: var(--text-dim); line-height: 1.5; } .gen-keep-t b { color: var(--text); }
.gen-more { margin-top: 14px; border: 1px solid var(--border); border-radius: 12px; padding: 0 14px; }
.gen-more > summary { cursor: pointer; padding: 12px 0; font-size: 14px; list-style: none; display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; } .gen-more > summary::-webkit-details-marker { display: none; }
.gen-more > summary::before { content: "▸"; color: var(--text-dim); } .gen-more[open] > summary::before { content: "▾"; }
.gen-more > summary span { font-size: 12.5px; color: var(--text-dim); } .gen-more > summary em { font-style: normal; font-size: 12px; font-weight: 700; color: #C8722F; }
#ctlBox { display: grid; gap: 14px; padding: 2px 0 14px; } #ctlBox .gen-link { justify-self: start; }
.gen-cgroup { display: grid; gap: 7px; } .gen-clabel { font-size: 12.5px; font-weight: 700; color: var(--text-dim); } .gen-clabel i { font-style: normal; font-weight: 500; opacity: .75; }
.gen-cgroup .gen-chips, .gen-keep .gen-chips { margin: 0; }
.sag-h3 { margin: 22px 0 8px; font-size: 17px; }
.sag-list { margin: 0 0 14px; padding-left: 20px; display: grid; gap: 8px; font-size: 15px; line-height: 1.6; color: var(--text-dim); } .sag-list strong { color: var(--text); }
.acr-ctl { display: grid; gap: 12px; margin: 14px 0 4px; } .acr-ctl:empty { display: none; } .acr-ctl .gen-keep, .acr-ctl .gen-more { margin-top: 0; }
.acr-ctlbox { display: grid; gap: 14px; padding: 2px 0 14px; } .acr-ctlbox .gen-link { justify-self: start; }
/* Free-credits banner under the header (signed-out / unverified visitors) */
.qb-gift-bar { background: linear-gradient(90deg, rgba(200,114,47,.16), rgba(200,114,47,.06)); border-bottom: 1px solid rgba(200,114,47,.35); }
.qb-gift-in { max-width: 1400px; margin: 0 auto; padding: 10px 56px 10px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 18px; position: relative; font-size: 14px; }
.qb-gift-msg b { color: #fff; } .qb-gift-msg span { color: rgba(255,255,255,.78); }
.qb-gift-acts { display: flex; gap: 10px; }
.qb-gift-primary { background: #C8722F; color: #fff; font-weight: 700; padding: 6px 14px; border-radius: 8px; text-decoration: none; font-size: 13.5px; }
.qb-gift-secondary { color: #fff; font-weight: 600; padding: 6px 12px; border-radius: 8px; border: 1px solid rgba(255,255,255,.25); text-decoration: none; font-size: 13.5px; }
.qb-gift-x { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); background: none; border: 0; color: rgba(255,255,255,.7); font-size: 22px; cursor: pointer; line-height: 1; }
@media (max-width: 640px) { .qb-gift-in { padding: 10px 44px 10px 16px; justify-content: flex-start; font-size: 13px; } .qb-gift-msg span { display: block; } }
/* SEO audit — speed tips and AI speed plan */
/* SEO audit — full-width speed tips, code changes, site-check fixes */
/* SEO audit / autopilot — collapsible Errors / Warnings / Tips groups */
.qb-credit-line::first-letter{text-transform:uppercase}
.ap-cbar .credit-bar.qb-compact{margin:0 0 2px!important}
/* Speed (layout shift): <head> marks which bars JS will add (html.qb-ann / html.qb-gift / html.qb-in), so their space is
   kept free from the first paint instead of the page jumping down when they appear. JS removes the mark as it adds them. */
html.qb-ann body::before{content:"";display:block;height:35px}
html.qb-gift body:not(:has(#signinPrompt)) #site-header{min-height:116px}
@media (max-width:1147px){html.qb-gift body:not(:has(#signinPrompt)) #site-header{min-height:143px}}
@media (max-width:947px){html.qb-gift body:not(:has(#signinPrompt)) #site-header{min-height:160px}}
@media (max-width:643px){html.qb-gift body:not(:has(#signinPrompt)) #site-header{min-height:174px}}
@media (max-width:640px){html.qb-ann body::before{height:33px}}
@media (max-width:371px){html.qb-gift body:not(:has(#signinPrompt)) #site-header{min-height:190px}}
html:not(.qb-in) #signinPrompt[data-early].hidden{display:block!important}
html.qb-pend [data-anon].hidden{display:block!important;pointer-events:none;opacity:.6}
[data-anon] .credit-bar:not(.qb-compact){padding:0!important;border:0!important;background:none!important;margin:0 0 16px!important;min-height:22px;display:block!important}[data-anon] .credit-bar:not(.qb-compact)>*{visibility:hidden;height:0;overflow:hidden;margin:0;padding:0}
@media (max-width:640px){[data-anon] .credit-bar:not(.qb-compact){min-height:45px}}
/* ---- Instagram Reel Agent ---- */
.ra-card{max-width:1120px!important}
.ra-host{color:var(--text-dimmer);font-size:13px;margin-left:6px}
.ra-pill{display:inline-block;padding:3px 10px;border-radius:999px;border:1px solid var(--border);font-size:12.5px;color:var(--text-dim)}
.ra-pill.on{border-color:rgba(74,222,128,.45);color:#86efac}
.ra-brandsel{width:auto!important;padding:6px 10px!important;font-size:13px!important}
.ra-left{margin:0;color:var(--text-dim);font-size:13.5px}.ra-left a{color:#E3945B}
.ra-tabs{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--border);padding-bottom:10px}
.ra-tab{background:none;border:1px solid transparent;border-radius:999px;padding:7px 14px;color:var(--text-dim);font:600 13.5px/1 inherit;cursor:pointer;font-family:inherit}
.ra-tab.on{background:rgba(200,114,47,.14);border-color:rgba(200,114,47,.5);color:#fff}
#raTab{display:flex;flex-direction:column;gap:18px;padding-top:4px}
.ra-make{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--border);border-radius:12px;background:var(--bg-raised)}
.ra-make .ap-note{margin:0}
.ra-make-btns{display:flex;gap:10px;flex-wrap:wrap}.ra-make-btns button{padding:12px 18px;font-size:14px}
.ra-link{background:none;border:0;padding:0;color:#E3945B;font:inherit;font-weight:600;cursor:pointer;text-decoration:underline}
.ra-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.ra-reel{display:flex;flex-direction:column;border:1px solid var(--border);border-radius:14px;overflow:hidden;background:var(--bg-raised)}
.ra-video{width:100%;aspect-ratio:9/16;max-height:520px;background:#000;display:block;object-fit:contain}
.ra-wait{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:var(--text-dim);font-size:14px;text-align:center;padding:16px;box-sizing:border-box}
.ra-wait small{color:var(--text-dimmer);font-size:12px}
.ra-spin{width:34px;height:34px;border-radius:50%;border:3px solid rgba(255,255,255,.12);border-top-color:#E3945B;animation:raSpin 1s linear infinite}
@keyframes raSpin{to{transform:rotate(360deg)}}
.ra-body{display:flex;flex-direction:column;gap:10px;padding:14px}
.ra-body h4{margin:0;font-size:15px;color:var(--text);line-height:1.4}
.ra-row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ra-st{font-size:11.5px;font-weight:700;padding:3px 8px;border-radius:999px;background:rgba(255,255,255,.06);color:var(--text-dim)}
.ra-st.ok{background:rgba(74,222,128,.14);color:#86efac}.ra-st.new{background:rgba(200,114,47,.18);color:#f0b07c}.ra-st.bad{background:rgba(248,113,113,.14);color:#fca5a5}
.ra-kind{font-size:12px;color:var(--text-dimmer)}
.ra-cap{font-size:13px;color:var(--text-dim);line-height:1.55;border-top:1px solid var(--border);padding-top:10px}.ra-cap p{margin:0 0 6px}
.ra-tags{color:#93c5fd;word-break:break-word}
.ra-acts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.ra-acts .btn-convert,.ra-acts .qrg-btn2{padding:9px 14px;font-size:13px;text-decoration:none}
.ra-del{background:none;border:0;color:var(--text-dimmer);font:inherit;font-size:13px;cursor:pointer;margin-left:auto}.ra-del:hover{color:#fca5a5}
.ra-change{display:flex;flex-direction:column;gap:8px}
.ra-warn{margin:0;font-size:12.5px;color:#fbbf24}
.ra-empty{color:var(--text-dim);margin:0}
.ra-audit,.ra-brand{display:flex;flex-direction:column;gap:14px}
.ra-audit .au-card,.ra-brand .au-card{display:flex;flex-direction:column;gap:10px}
.ra-audit h3,.ra-brand h3{margin:0}.ra-audit p{margin:0;line-height:1.6}
.ra-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}.ra-two h4{margin:0 0 6px;font-size:14px}.ra-two ul{margin:0;padding-left:18px;line-height:1.6;font-size:14px}
.ra-tagset{display:flex;flex-direction:column;gap:4px}.ra-tagset p{color:#93c5fd;font-size:13.5px;word-break:break-word}.ra-tagset .ra-link{align-self:flex-start}
.ra-ideas{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px}
.ra-ideas li{font-size:14px}.ra-ideas li span{display:inline-flex;flex-direction:column;margin-right:10px}.ra-ideas small{color:var(--text-dimmer);font-size:12px}
.ra-form{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.ra-color input{width:64px;height:40px;border:1px solid var(--border);border-radius:8px;background:none;padding:2px;cursor:pointer}
.ra-toggles{display:flex;gap:18px;flex-wrap:wrap}
.ra-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px}
.ra-photos figure{position:relative;margin:0;aspect-ratio:1;border-radius:10px;overflow:hidden;border:1px solid var(--border)}
.ra-photos img{width:100%;height:100%;object-fit:cover;display:block}
.ra-x{position:absolute;top:6px;right:6px;width:26px;height:26px;border-radius:50%;border:0;background:rgba(0,0,0,.7);color:#fff;font-size:16px;line-height:1;cursor:pointer}
.ra-upl{cursor:pointer}
.error-box.ra-ok{border-color:rgba(74,222,128,.45);color:#86efac;background:rgba(74,222,128,.08)}
.ra-plans-wrap{max-width:1120px;margin:48px auto 0;padding:0 24px;box-sizing:border-box}
.ra-plans-h{margin:0 0 6px;font-size:26px}.ra-plans-sub{margin:0 0 18px;color:var(--text-dim)}
.ra-cur{margin-left:6px}
.ra-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.ra-plan{position:relative;display:flex;flex-direction:column;gap:12px;padding:22px;border:1px solid var(--border);border-radius:16px;background:var(--bg-raised)}
.ra-plan.best{border-color:rgba(200,114,47,.6);box-shadow:0 0 0 1px rgba(200,114,47,.25)}
.ra-badge{position:absolute;top:-11px;left:22px;background:#c8722f;color:#fff;font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px}
.ra-plan h3{margin:0;font-size:18px}.ra-price{font-size:30px;font-weight:800;color:var(--text)}.ra-price small{font-size:13px;font-weight:500;color:var(--text-dim)}
.ra-plan ul{margin:0;padding-left:18px;color:var(--text-dim);line-height:1.8;font-size:14px;flex:1}
.ra-plan .btn-convert{width:100%;padding:12px}
.ra-plans-note{margin:14px 0 0;color:var(--text-dim);font-size:13.5px}
@media (max-width:800px){.ra-plans{grid-template-columns: minmax(0, 1fr)}.ra-form,.ra-two{grid-template-columns: minmax(0, 1fr)}}
@media (max-width:640px){.ra-grid{grid-template-columns: minmax(0, 1fr)}.ra-make-btns button{width:100%}.ra-plans-wrap{padding:0 16px}}
.ra-brand .ap-btns .btn-convert,.ra-make .btn-convert{padding:11px 18px;font-size:14px}
.ra-pick{display:flex;flex-direction:column;gap:16px;padding:18px;border:1px solid rgba(200,114,47,.45);border-radius:14px;background:rgba(200,114,47,.05)}
.ra-pick-h{display:flex;flex-direction:column;gap:4px}.ra-pick-h b{font-size:16px;color:var(--text)}
.ra-pick-sec{display:flex;flex-direction:column;gap:10px}
.ra-pick-t{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-weight:600;font-size:14px;color:var(--text)}.ra-pick-t .au-muted{font-weight:400}
.ra-pick-t .ra-upl{padding:7px 12px;font-size:13px}
.ra-thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}
.ra-thumb{position:relative;aspect-ratio:1;border-radius:10px;border:2px solid var(--border);background:#111 center/cover no-repeat;cursor:pointer;padding:0}
.ra-thumb.on{border-color:#E3945B;box-shadow:0 0 0 2px rgba(227,148,91,.35)}
.ra-num{position:absolute;top:6px;left:6px;min-width:22px;height:22px;border-radius:999px;background:#c8722f;color:#fff;font:700 12px/22px inherit;text-align:center;padding:0 5px;box-sizing:border-box}
.ra-frames{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.ra-frame-wrap{display:flex;flex-direction:column;gap:8px}
.ra-frame{position:relative;aspect-ratio:9/16;border-radius:10px;border:1px solid var(--border);background:#111 no-repeat;background-size:cover;cursor:crosshair}
.ra-frame.fit{background-size:contain;background-position:center!important;cursor:default}
.ra-fbtns{display:flex;gap:6px;flex-wrap:wrap}
.ra-chip{background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:999px;color:var(--text-dim);font:600 12px/1 inherit;padding:7px 10px;cursor:pointer;font-family:inherit}
.ra-chip.on{border-color:#E3945B;color:#fff;background:rgba(200,114,47,.18)}.ra-chip:disabled{opacity:.35;cursor:default}
.ra-pick .btn-convert:disabled{opacity:.45;cursor:not-allowed}
.ra-thumb-w{position:relative}.ra-thumb-w .ra-thumb{width:100%}
.ra-frame{cursor:grab;touch-action:none;user-select:none}.ra-frame.dragging{cursor:grabbing;outline:2px solid #E3945B}
.ra-fmts{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.ra-fmt{display:flex;flex-direction:column;gap:3px;align-items:flex-start;text-align:left;padding:11px 12px;border-radius:12px;border:1px solid var(--border);background:rgba(255,255,255,.02);color:var(--text-dim);cursor:pointer;font-family:inherit}
.ra-fmt b{color:var(--text);font-size:14px}.ra-fmt small{font-size:12px;color:var(--text-dimmer);line-height:1.35}
.ra-fmt.on{border-color:#E3945B;background:rgba(200,114,47,.14)}
.ra-slides{max-width:220px}
.ra-aipics{font-size:14px}
.ra-frame.r45{aspect-ratio:4/5}
.ra-sv{position:relative;width:100%;aspect-ratio:9/16;max-height:520px;background:#000}.ra-sv.r45,.ra-wait.r45{aspect-ratio:4/5}
.ra-sv img{width:100%;height:100%;object-fit:contain;display:block}
.ra-nav{position:absolute;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:22px;line-height:1;cursor:pointer}
.ra-nav.l{left:8px}.ra-nav.r{right:8px}.ra-nav:disabled{opacity:.25;cursor:default}
.ra-count{position:absolute;bottom:8px;right:10px;background:rgba(0,0,0,.6);color:#fff;font-size:12px;padding:3px 8px;border-radius:999px}
@media (max-width:900px){.ra-fmts{grid-template-columns:repeat(2,1fr)}}
.ca-card{max-width:640px!important;margin:0 auto}.ca-list{margin:6px 0 4px}
.ra-url{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.ra-url code{flex:1;min-width:220px;padding:11px 14px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--border);color:#f0b07c;font-size:14px;word-break:break-all}
.ra-steps{margin:0;padding-left:20px;line-height:1.75;color:var(--text-dim);font-size:14px}.ra-steps b{color:var(--text)}
.ra-conn{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--border)}.ra-conn:first-child{border-top:0}.ra-conn span{display:flex;flex-direction:column;gap:2px}.ra-conn small{color:var(--text-dimmer);font-size:12px}
.ca-card .btn-convert,.ca-card .qrg-btn2{padding:12px 22px;font-size:15px;text-decoration:none}.ca-card .ap-btns{display:flex;gap:10px;flex-wrap:wrap}
.ra-sched{margin:0;font-size:13px;color:#f0b07c}.ra-sched.done{color:#86efac}
.ra-pubmode{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px solid var(--border);border-radius:12px}.ra-pubmode b{color:var(--text);font-size:14px}
.ra-cal-day{display:flex;flex-direction:column;gap:2px}.ra-cal-day h4{margin:8px 0 4px;font-size:14px;color:#f0b07c}
.ra-cal-row{display:flex;gap:14px;align-items:flex-start;padding:9px 0;border-top:1px solid var(--border)}.ra-cal-t{min-width:150px;font-size:13px;color:var(--text-dim)}.ra-cal-n{display:flex;flex-direction:column;gap:2px}.ra-cal-n b{color:var(--text);font-size:14px}.ra-cal-n small{color:var(--text-dimmer);font-size:12px}
@media (max-width:640px){.ra-cal-row{flex-direction:column;gap:4px}}
.ra-igacc{display:flex;align-items:center;gap:12px}.ra-igacc img{width:48px;height:48px;border-radius:50%;object-fit:cover}.ra-igacc span{display:flex;flex-direction:column;gap:2px;flex:1}.ra-igacc b{color:var(--text)}.ra-igacc small{color:var(--text-dimmer);font-size:12.5px}
.ra-sub{margin:6px 0 0;font-size:14px}
.ra-igposts{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.ra-igpost{display:flex;flex-direction:column;gap:4px;text-decoration:none}.ra-igpost img,.ra-igpost span{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:8px;background:#111;display:flex;align-items:center;justify-content:center;color:var(--text-dim);font-size:12px}.ra-igpost small{color:var(--text-dim);font-size:11.5px}
.ra-pub{border-color:rgba(227,148,91,.6)!important;color:#f0b07c!important}
.ra-sched a{color:#86efac}

@media (max-width:520px){.ss-row{grid-template-columns:minmax(0,1fr) 76px 28px;gap:5px}.ss-row .sd-input{font-size:13.5px;padding:0 8px}}