/* Vela V7 visual system: restrained, premium, lower-glare light and deep graphite dark. */
:root {
  color-scheme: light;
  --v7-page: #f1f0ec;
  --v7-surface: #fbfaf8;
  --v7-raised: #f5f3ef;
  --v7-field: #f0eee9;
  --v7-ink: #2b2930;
  --v7-muted: #6d6870;
  --v7-subtle: #89838a;
  --v7-border: #dedad3;
  --v7-accent: #966873;
  --v7-accent-strong: #845661;
  --v7-accent-soft: #eee3e4;
  --v7-gold: #ad905e;
  --v7-shadow: 0 14px 38px rgba(43,38,33,.065);
}
html[data-theme="dark"] {
  color-scheme: dark;
  --v7-page: #15161b;
  --v7-surface: #202129;
  --v7-raised: #292b34;
  --v7-field: #191a21;
  --v7-ink: #f0ede8;
  --v7-muted: #c0b9b8;
  --v7-subtle: #9c969b;
  --v7-border: #3d404a;
  --v7-accent: #d1a0a0;
  --v7-accent-strong: #e0b2ad;
  --v7-accent-soft: #43363d;
  --v7-gold: #d0b47c;
  --v7-shadow: 0 18px 48px rgba(0,0,0,.24);
}
html, body { background: var(--v7-page) !important; color: var(--v7-ink) !important; }
body { overflow-x: clip; font-family: 'DM Sans', system-ui, sans-serif; }
::selection { background: var(--v7-accent-soft); color: var(--v7-ink); }
.announcement { background: var(--v7-raised) !important; color: var(--v7-muted) !important; border-bottom: 1px solid var(--v7-border); }
.announcement a { color: var(--v7-accent) !important; }
.site-header { background: color-mix(in srgb,var(--v7-surface) 93%,transparent) !important; border-color: var(--v7-border) !important; box-shadow: 0 5px 20px rgba(20,20,25,.025); }
.brand, .brand>span:last-child { color: var(--v7-ink) !important; }
.brand small { color: var(--v7-subtle) !important; }
.brand-mark { background: var(--v7-accent-soft) !important; color: var(--v7-accent) !important; }
.brand-dot { color: var(--v7-accent) !important; }
.main-nav a, .nav-login, .nav-account { color: var(--v7-muted) !important; }
.main-nav a:hover, .main-nav a.active, .nav-login:hover { color: var(--v7-accent) !important; }
.btn-primary { background: var(--v7-accent) !important; color: #fff !important; box-shadow: 0 6px 16px color-mix(in srgb,var(--v7-accent) 18%,transparent) !important; }
.btn-primary:hover { background: var(--v7-accent-strong) !important; }
.btn-cream { background: var(--v7-raised) !important; color: var(--v7-ink) !important; border: 1px solid var(--v7-border); }
.btn-dark { background: var(--v7-ink) !important; color: var(--v7-page) !important; }
.theme-toggle, .mobile-menu-toggle { background: var(--v7-raised) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important; }
.theme-toggle-icon { background: var(--v7-accent-soft) !important; color: var(--v7-accent) !important; }
.hero { color: var(--v7-ink); }
.hero h1, .page-hero h1, .auth-form-card h1, .section-heading h2, .feature-copy h2, .creator-band h2, .tool-intro h1 { color: var(--v7-ink) !important; }
.hero h1 em, .page-hero h1 em, .feature-copy h2 em, .creator-band h2 em, .auth-form-card h1 em, .tool-intro h1 em { color: var(--v7-accent) !important; }
.eyebrow, .eyebrow-star { color: var(--v7-accent) !important; }
.hero-lede, .page-hero p, .section-heading p, .tool-intro p, .feature-copy p { color: var(--v7-muted) !important; }
.hero-search, .catalog-search { background: var(--v7-surface) !important; border-color: var(--v7-border) !important; box-shadow: var(--v7-shadow) !important; }
.hero-search input, .catalog-search input { background: transparent !important; color: var(--v7-ink) !important; }
.hero-search input::placeholder, .catalog-search input::placeholder { color: var(--v7-subtle) !important; }
.hero-search kbd { color: var(--v7-subtle) !important; border-color: var(--v7-border) !important; background: var(--v7-raised); }
.hero-blob { opacity: .46 !important; filter: blur(4px) saturate(.55) !important; }
.tool-preview, .float-card { background: var(--v7-surface) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important; box-shadow: var(--v7-shadow) !important; }
.preview-grid a { background: var(--v7-raised) !important; border-color: var(--v7-border) !important; color: var(--v7-ink) !important; }
.preview-grid small, .float-card small { color: var(--v7-subtle) !important; }
.trust-strip, .section-soft, .site-footer { background: var(--v7-raised) !important; border-color: var(--v7-border) !important; }
.trust-inner, .trust-inner b, .trust-inner>span { color: var(--v7-muted) !important; }
.category-card { background: var(--v7-surface) !important; border: 1px solid var(--v7-border) !important; box-shadow: none; }
.category-card:hover { border-color: color-mix(in srgb,var(--v7-accent) 38%,var(--v7-border)) !important; box-shadow: var(--v7-shadow); }
.category-card b, .tool-card b, .panel-heading b { color: var(--v7-ink) !important; }
.category-card small, .tool-card p, .panel-heading small { color: var(--v7-muted) !important; }
.cat-art, .tool-card-icon, .value-icon { background: var(--v7-accent-soft) !important; color: var(--v7-accent) !important; }
.tool-card { background: var(--v7-surface) !important; border-color: var(--v7-border) !important; color: var(--v7-ink) !important; box-shadow: none; }
.tool-card:hover { border-color: color-mix(in srgb,var(--v7-accent) 40%,var(--v7-border)) !important; box-shadow: var(--v7-shadow) !important; }
.tool-category, .text-link { color: var(--v7-accent) !important; }
.section-heading h2 em { color: var(--v7-accent) !important; }
.tool-workspace, .tool-preview, .panel-card, .stat-card, .account-sidebar, .admin-sidebar, .admin-topbar, .admin-section, .admin-stat, .flow-panel, .flow-workspace, .flow-save-card, .workspace-item, .blog-card, .price-card, .guide-card, .feature-main-card, .workspace-callout, .note-box, .tool-output, .flow-output, .auth-form-side, .auth-form-card, .image-result-card, .image-selected-card, .modal-card, .creator-level-card { background: var(--v7-surface) !important; border-color: var(--v7-border) !important; color: var(--v7-ink) !important; box-shadow: var(--v7-shadow); }
.tool-controls, .form-stack, .form-grid, .admin-setting-card, .ad-manager-card, .blog-admin-form, .image-preview, .image-selected-info, .image-option-check, .image-help, .flow-step-item, .flow-empty-step, .flow-login-note, .empty-inline { background: var(--v7-raised) !important; border-color: var(--v7-border) !important; color: var(--v7-ink) !important; }
.tool-controls label, .form-stack label, .form-grid label, .ad-manager-fields label, .admin-setting-card b, .ad-manager-title b { color: var(--v7-ink) !important; }
input, textarea, select, .tool-controls input, .tool-controls textarea, .tool-controls select, .form-stack input, .form-stack textarea, .form-grid input, .form-grid select, .ad-manager-fields input, .ad-manager-fields select, .ad-manager-fields textarea, .admin-payout-form input, .admin-payout-form select { background: var(--v7-field) !important; border: 1px solid var(--v7-border) !important; color: var(--v7-ink) !important; }
input::placeholder, textarea::placeholder { color: var(--v7-subtle) !important; }
input:focus, textarea:focus, select:focus { border-color: var(--v7-accent) !important; box-shadow: 0 0 0 3px color-mix(in srgb,var(--v7-accent) 17%,transparent) !important; }
.account-heading h1, .admin-topbar h1, .admin-section-heading h2, .tool-card h3, .blog-card h2 { color: var(--v7-ink) !important; }
.account-heading p, .admin-section-heading p, .admin-note, .small-note, .footer-brand p, .footer-col a, .footer-bottom, .legal-copy p { color: var(--v7-muted) !important; }
.account-nav { color: var(--v7-muted) !important; }
.account-nav:hover { background: var(--v7-raised) !important; color: var(--v7-ink) !important; }
.account-nav.active { background: var(--v7-accent-soft) !important; color: var(--v7-accent) !important; }
.sidebar-help, .creator-balance-main { background: var(--v7-raised) !important; border-color: var(--v7-border) !important; color: var(--v7-ink) !important; }
.admin-stat small, .admin-stat span { color: var(--v7-muted) !important; }
.admin-stat b { color: var(--v7-ink) !important; }
.table-wrap { border-color: var(--v7-border) !important; }
.data-table { color: var(--v7-ink) !important; }
.data-table th { background: var(--v7-raised) !important; color: var(--v7-muted) !important; border-color: var(--v7-border) !important; }
.data-table td, .data-table td small { color: var(--v7-ink) !important; border-color: var(--v7-border) !important; }
.toast-success { background: #dfe9e0 !important; color: #315d3e !important; }
.toast-error { background: #f0e2e0 !important; color: #783e43 !important; }
.toast-info { background: #eae5d9 !important; color: #65583c !important; }
.auth-art { background: linear-gradient(145deg,#38333d,#474047 58%,#3a443e) !important; }
.auth-art-card { background: color-mix(in srgb,var(--v7-surface) 88%,transparent) !important; border-color: var(--v7-border) !important; color: var(--v7-ink) !important; }
.password-visibility-toggle { color: var(--v7-accent) !important; }
.mobile-menu { background: var(--v7-surface) !important; border-color: var(--v7-border) !important; }
.mobile-menu a { color: var(--v7-ink) !important; }
.mobile-bottom-nav { background: color-mix(in srgb,var(--v7-surface) 96%,transparent) !important; border-color: var(--v7-border) !important; box-shadow: var(--v7-shadow) !important; }
.mobile-bottom-nav a { color: var(--v7-muted) !important; }
.mobile-bottom-nav a.active { background: var(--v7-accent-soft) !important; color: var(--v7-accent) !important; }
.flash, .toast { border-color: var(--v7-border) !important; }
.install-app-pill { background: var(--v7-accent) !important; color: #fff !important; }
@media(min-width:1500px){.wrap{width:min(1320px,calc(100% - 96px))}.hero{gap:64px}.tool-card-grid{gap:18px}.account-shell{max-width:1480px}.admin-shell{max-width:1580px}}
@media(max-width:1100px){.nav-shell{gap:16px}.main-nav{gap:15px}.hero{min-height:520px}.tool-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}.wrap{width:calc(100% - 30px)}.hero{padding-top:44px;padding-bottom:38px;gap:18px}.hero-art{min-height:300px}.section{padding-block:55px}.tool-card-grid,.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tool-card{min-height:170px}.mobile-bottom-nav{bottom:calc(8px + env(safe-area-inset-bottom));left:8px;right:8px;z-index:60;padding:5px 4px}.mobile-bottom-nav a{min-width:0;flex:1}.account-shell,.admin-shell{padding-bottom:24px}.account-content,.admin-content{min-width:0}.table-wrap{max-width:100%;overflow:auto}.data-table{min-width:680px}.tool-workspace{padding:15px}.tool-controls{padding:14px}.auth-wrap{margin-bottom:50px}}
@media(max-width:420px){.wrap{width:calc(100% - 24px)}.hero h1{font-size:clamp(36px,10vw,46px)}.section-heading{align-items:flex-start;flex-direction:column}.category-grid{gap:9px}.category-card{min-height:94px;padding:10px}.cat-art{width:42px;height:42px;flex-basis:42px}.tool-card-grid,.catalog-grid{gap:9px}.tool-card{padding:11px;min-height:162px}.tool-card-icon{width:36px;height:36px}.stat-card{padding:11px}.admin-topbar{padding:13px}.account-heading h1{font-size:24px}}
/* Final high-specificity surface pass. This intentionally supersedes legacy V5 !important values. */
html[data-theme="light"] body { background: var(--v7-page) !important; color: var(--v7-ink) !important; }
html[data-theme="light"] .site-header { background: rgba(251,250,248,.96) !important; border-color: var(--v7-border) !important; }
html[data-theme="light"] .announcement, html[data-theme="light"] .trust-strip,
html[data-theme="light"] .section-soft, html[data-theme="light"] .site-footer { background: var(--v7-raised) !important; color: var(--v7-muted) !important; border-color: var(--v7-border) !important; }
html[data-theme="light"] .hero-search, html[data-theme="light"] .tool-preview,
html[data-theme="light"] .float-card, html[data-theme="light"] .tool-card,
html[data-theme="light"] .tool-workspace, html[data-theme="light"] .panel-card,
html[data-theme="light"] .stat-card, html[data-theme="light"] .account-sidebar,
html[data-theme="light"] .admin-sidebar, html[data-theme="light"] .admin-topbar,
html[data-theme="light"] .admin-section, html[data-theme="light"] .admin-stat,
html[data-theme="light"] .flow-panel, html[data-theme="light"] .flow-workspace,
html[data-theme="light"] .flow-save-card, html[data-theme="light"] .workspace-item,
html[data-theme="light"] .blog-card, html[data-theme="light"] .price-card,
html[data-theme="light"] .auth-form-side, html[data-theme="light"] .auth-form-card,
html[data-theme="light"] .modal-card, html[data-theme="light"] .image-result-card,
html[data-theme="light"] .image-selected-card, html[data-theme="light"] .guide-card {
  background: var(--v7-surface) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important;
}
html[data-theme="light"] .category-card, html[data-theme="light"] .cat-peach,
html[data-theme="light"] .cat-lav, html[data-theme="light"] .cat-mint,
html[data-theme="light"] .cat-yellow, html[data-theme="light"] .cat-blue,
html[data-theme="light"] .cat-rose { background: var(--v7-surface) !important; border-color: var(--v7-border) !important; }
html[data-theme="light"] .tool-controls, html[data-theme="light"] .form-stack,
html[data-theme="light"] .form-grid, html[data-theme="light"] .admin-setting-card,
html[data-theme="light"] .ad-manager-card, html[data-theme="light"] .blog-admin-form,
html[data-theme="light"] .image-preview, html[data-theme="light"] .tool-output,
html[data-theme="light"] .flow-output { background: var(--v7-raised) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important; }
html[data-theme="light"] .tool-controls input, html[data-theme="light"] .tool-controls textarea,
html[data-theme="light"] .tool-controls select, html[data-theme="light"] .form-stack input,
html[data-theme="light"] .form-stack textarea, html[data-theme="light"] .form-grid input,
html[data-theme="light"] .form-grid select, html[data-theme="light"] .admin-payout-form input,
html[data-theme="light"] .admin-payout-form select, html[data-theme="light"] .ad-manager-fields input,
html[data-theme="light"] .ad-manager-fields select, html[data-theme="light"] .ad-manager-fields textarea {
  background: var(--v7-field) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important;
}
html[data-theme="light"] .category-card b, html[data-theme="light"] .tool-card b,
html[data-theme="light"] .section-heading h2, html[data-theme="light"] .hero h1,
html[data-theme="light"] .page-hero h1, html[data-theme="light"] .tool-intro h1,
html[data-theme="light"] .account-heading h1, html[data-theme="light"] .admin-topbar h1,
html[data-theme="light"] .admin-section-heading h2 { color: var(--v7-ink) !important; }
html[data-theme="light"] .category-card small, html[data-theme="light"] .tool-card p,
html[data-theme="light"] .hero-lede, html[data-theme="light"] .page-hero p,
html[data-theme="light"] .section-heading p, html[data-theme="light"] .tool-intro p,
html[data-theme="light"] .account-heading p, html[data-theme="light"] .admin-section-heading p { color: var(--v7-muted) !important; }
html[data-theme="light"] .btn-primary { background: var(--v7-accent) !important; color: #fff !important; }
html[data-theme="light"] .btn-cream, html[data-theme="light"] .theme-toggle { background: var(--v7-raised) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important; }
html[data-theme="light"] .data-table th { background: var(--v7-raised) !important; color: var(--v7-muted) !important; border-color: var(--v7-border) !important; }
html[data-theme="light"] .data-table td { color: var(--v7-ink) !important; border-color: var(--v7-border) !important; }

html[data-theme="dark"] body { background: var(--v7-page) !important; color: var(--v7-ink) !important; }
html[data-theme="dark"] .announcement, html[data-theme="dark"] .trust-strip,
html[data-theme="dark"] .section-soft, html[data-theme="dark"] .site-footer { background: #1c1d23 !important; color: var(--v7-muted) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .site-header { background: rgba(29,30,37,.97) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .hero-search, html[data-theme="dark"] .tool-preview,
html[data-theme="dark"] .float-card, html[data-theme="dark"] .tool-card,
html[data-theme="dark"] .tool-workspace, html[data-theme="dark"] .panel-card,
html[data-theme="dark"] .stat-card, html[data-theme="dark"] .account-sidebar,
html[data-theme="dark"] .admin-sidebar, html[data-theme="dark"] .admin-topbar,
html[data-theme="dark"] .admin-section, html[data-theme="dark"] .admin-stat,
html[data-theme="dark"] .flow-panel, html[data-theme="dark"] .flow-workspace,
html[data-theme="dark"] .flow-save-card, html[data-theme="dark"] .workspace-item,
html[data-theme="dark"] .blog-card, html[data-theme="dark"] .price-card,
html[data-theme="dark"] .auth-form-side, html[data-theme="dark"] .auth-form-card,
html[data-theme="dark"] .modal-card, html[data-theme="dark"] .image-result-card,
html[data-theme="dark"] .image-selected-card, html[data-theme="dark"] .guide-card {
  background: var(--v7-surface) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important; box-shadow: var(--v7-shadow) !important;
}
html[data-theme="dark"] .category-card, html[data-theme="dark"] .cat-peach,
html[data-theme="dark"] .cat-lav, html[data-theme="dark"] .cat-mint,
html[data-theme="dark"] .cat-yellow, html[data-theme="dark"] .cat-blue,
html[data-theme="dark"] .cat-rose, html[data-theme="dark"] .stat-peach,
html[data-theme="dark"] .stat-lav, html[data-theme="dark"] .stat-mint,
html[data-theme="dark"] .stat-yellow, html[data-theme="dark"] .admin-stat:nth-child(2),
html[data-theme="dark"] .admin-stat:nth-child(3), html[data-theme="dark"] .admin-stat:nth-child(4) {
  background: var(--v7-surface) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important;
}
html[data-theme="dark"] .tool-controls, html[data-theme="dark"] .form-stack,
html[data-theme="dark"] .form-grid, html[data-theme="dark"] .admin-setting-card,
html[data-theme="dark"] .ad-manager-card, html[data-theme="dark"] .blog-admin-form,
html[data-theme="dark"] .image-preview, html[data-theme="dark"] .tool-output,
html[data-theme="dark"] .flow-output, html[data-theme="dark"] .flow-step-item,
html[data-theme="dark"] .image-selected-info, html[data-theme="dark"] .image-help,
html[data-theme="dark"] .empty-inline { background: var(--v7-raised) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .tool-controls input, html[data-theme="dark"] .tool-controls textarea,
html[data-theme="dark"] .tool-controls select, html[data-theme="dark"] .form-stack input,
html[data-theme="dark"] .form-stack textarea, html[data-theme="dark"] .form-grid input,
html[data-theme="dark"] .form-grid select, html[data-theme="dark"] .admin-payout-form input,
html[data-theme="dark"] .admin-payout-form select, html[data-theme="dark"] .ad-manager-fields input,
html[data-theme="dark"] .ad-manager-fields select, html[data-theme="dark"] .ad-manager-fields textarea {
  background: var(--v7-field) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important;
}
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color: var(--v7-subtle) !important; }
html[data-theme="dark"] .main-nav a, html[data-theme="dark"] .nav-login,
html[data-theme="dark"] .nav-account, html[data-theme="dark"] .hero-lede,
html[data-theme="dark"] .page-hero p, html[data-theme="dark"] .section-heading p,
html[data-theme="dark"] .tool-intro p, html[data-theme="dark"] .account-heading p,
html[data-theme="dark"] .admin-section-heading p, html[data-theme="dark"] .footer-col a,
html[data-theme="dark"] .footer-brand p, html[data-theme="dark"] .footer-bottom,
html[data-theme="dark"] .tool-card p, html[data-theme="dark"] .category-card small,
html[data-theme="dark"] .small-note, html[data-theme="dark"] .legal-copy p { color: var(--v7-muted) !important; }
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3,
html[data-theme="dark"] h4, html[data-theme="dark"] .brand,
html[data-theme="dark"] .brand>span:last-child, html[data-theme="dark"] .hero h1,
html[data-theme="dark"] .page-hero h1, html[data-theme="dark"] .section-heading h2,
html[data-theme="dark"] .tool-intro h1, html[data-theme="dark"] .account-heading h1,
html[data-theme="dark"] .admin-topbar h1, html[data-theme="dark"] .tool-card b,
html[data-theme="dark"] .category-card b, html[data-theme="dark"] .admin-section-heading h2 { color: var(--v7-ink) !important; }
html[data-theme="dark"] .btn-primary { background: #b47e83 !important; color: #fff !important; }
html[data-theme="dark"] .btn-cream, html[data-theme="dark"] .theme-toggle,
html[data-theme="dark"] .mobile-menu-toggle { background: var(--v7-raised) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .account-nav { color: var(--v7-muted) !important; }
html[data-theme="dark"] .account-nav:hover { background: var(--v7-raised) !important; color: var(--v7-ink) !important; }
html[data-theme="dark"] .account-nav.active, html[data-theme="dark"] .mobile-bottom-nav a.active { background: var(--v7-accent-soft) !important; color: var(--v7-accent) !important; }
html[data-theme="dark"] .mobile-menu { background: var(--v7-surface) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .mobile-menu a { color: var(--v7-ink) !important; }
html[data-theme="dark"] .mobile-bottom-nav { background: rgba(32,33,41,.97) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .mobile-bottom-nav a { color: var(--v7-muted) !important; }
html[data-theme="dark"] .data-table th { background: var(--v7-raised) !important; color: var(--v7-muted) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .data-table td, html[data-theme="dark"] .data-table td small { background: var(--v7-surface) !important; color: var(--v7-ink) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .auth-art { background: linear-gradient(145deg,#282831 0%,#37313a 55%,#29352f 100%) !important; }
html[data-theme="dark"] .auth-art-card { background: rgba(32,33,41,.94) !important; border-color: var(--v7-border) !important; }
html[data-theme="dark"] .auth-art-card h2, html[data-theme="dark"] .auth-art-card p,
html[data-theme="dark"] .auth-form-card h1, html[data-theme="dark"] .auth-sub,
html[data-theme="dark"] .auth-switch, html[data-theme="dark"] .checkbox-label { color: var(--v7-ink) !important; }
html[data-theme="dark"] .password-visibility-toggle { color: var(--v7-accent) !important; }
html[data-theme="dark"] .password-strength-track { background: var(--v7-raised) !important; }
html[data-theme="dark"] .toast-success { background: #26392e !important; color: #d0e8d5 !important; }
html[data-theme="dark"] .toast-error { background: #402d32 !important; color: #f0c6c3 !important; }
html[data-theme="dark"] .toast-info { background: #38352e !important; color: #eadbb4 !important; }