/* SocialFansGeek AI tool pages: dark studio skin (shared by all AI landing pages) */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;700&family=Inter:wght@400;500;600;700;800&display=swap');
.sfg-tool-scope{--paper:#0F0F14;--panel:#191922;--panel-2:#20202B;--ink:#F4F3EE;--muted:#A9A8B3;--line:#2A2A36;--accent:#ff6300;--accent-2:#e3242b;--sf-primary:#ff6300;--sf-gradient:linear-gradient(135deg,#ff6300 0%,#e3242b 100%);background:var(--paper)!important;color:var(--ink)!important;font-family:Inter,system-ui,sans-serif}
body.sfg-tool-dark{background:#0F0F14!important}
.sfg-tool-scope [class*="-wrapper"],.sfg-tool-scope main,.sfg-tool-scope section{--sf-primary:#ff6300!important;--sf-gradient:linear-gradient(135deg,#ff6300 0%,#e3242b 100%)!important;background-color:transparent}
.sfg-tool-scope [class*="-wrapper"]{background:var(--paper)!important;color:var(--ink)!important}
.sfg-tool-scope section,.sfg-tool-scope .hero-section,.sfg-tool-scope section.bg-white,.sfg-tool-scope section.py-5,.sfg-tool-scope .section-footer,.sfg-tool-scope .sfg-trust-section,.sfg-tool-scope .ai-faq-section,.sfg-tool-scope .stat-bar,.sfg-tool-scope section[style*="background"]{background:var(--paper)!important;color:var(--ink)!important;border-color:var(--line)!important}
.sfg-tool-scope .hero-section{padding-top:36px!important;padding-bottom:64px!important}
.sfg-tool-scope .hero-bg-circle{display:none!important}
.sfg-tool-scope h1,.sfg-tool-scope h2,.sfg-tool-scope h3,.sfg-tool-scope h4,.sfg-tool-scope h5,.sfg-tool-scope .hero-title,.sfg-tool-scope .hero-title-main,.sfg-tool-scope .main-title,.sfg-tool-scope .sfg-trust-heading,.sfg-tool-scope strong{color:var(--ink)!important}
.sfg-tool-scope h1,.sfg-tool-scope h2,.sfg-tool-scope .hero-title,.sfg-tool-scope .hero-title-main,.sfg-tool-scope .main-title{font-family:'Space Grotesk',Inter,sans-serif!important;letter-spacing:-.02em}
.sfg-tool-scope h1 span,.sfg-tool-scope .hero-title span,.sfg-tool-scope .hero-title-main span,.sfg-tool-scope .text-primary-gradient,.sfg-tool-scope .text-green,.sfg-tool-scope .text-youtube,.sfg-tool-scope .text-gradient-green,.sfg-tool-scope [style*="-webkit-text-fill-color"]{background:none!important;-webkit-background-clip:unset!important;-webkit-text-fill-color:var(--accent)!important;color:var(--accent)!important}
.sfg-tool-scope p,.sfg-tool-scope li,.sfg-tool-scope .lead,.sfg-tool-scope .text-muted,.sfg-tool-scope label,.sfg-tool-scope .form-label,.sfg-tool-scope small,.sfg-tool-scope .sfg-trust-sub,.sfg-tool-scope .sfg-trust-bar,.sfg-tool-scope .card-body,.sfg-tool-scope .stat-label,.sfg-tool-scope [style*="color:#64748b"],.sfg-tool-scope [style*="color:#555"],.sfg-tool-scope [style*="color:#666"],.sfg-tool-scope [style*="color:#374151"],.sfg-tool-scope [style*="color:#6b7280"],.sfg-tool-scope [style*="color:#94a3b8"],.sfg-tool-scope [style*="color:#9ca3af"]{color:var(--muted)!important}
.sfg-tool-scope .text-dark,.sfg-tool-scope [style*="color:#0f172a"],.sfg-tool-scope [style*="color:#1e293b"],.sfg-tool-scope [style*="color:#1a1a1a"],.sfg-tool-scope [style*="color:#1f2937"],.sfg-tool-scope [style*="color:#111827"],.sfg-tool-scope [style*="color: #1f2937"],.sfg-tool-scope [style*="color:#222"],.sfg-tool-scope [style*="color:#333"]{color:var(--ink)!important}
.sfg-tool-scope .text-primary,.sfg-tool-scope .text-success,.sfg-tool-scope .text-warning,.sfg-tool-scope a:not(.btn):not([class*="btn-"]):not(.sfg-studio-categories a){color:var(--accent)!important}
/* panels */
.sfg-tool-scope .card,.sfg-tool-scope .generator-card,.sfg-tool-scope .generator-form,.sfg-tool-scope .tool-card,.sfg-tool-scope .generator-input-container,.sfg-tool-scope .mock-results .card,.sfg-tool-scope .result-card,.sfg-tool-scope .result-box,.sfg-tool-scope .plan-card,.sfg-tool-scope .tweet-card,.sfg-tool-scope .variation-card,.sfg-tool-scope .feature-card,.sfg-tool-scope .step-card,.sfg-tool-scope .feature-card-hover,.sfg-tool-scope .usage-badge,.sfg-tool-scope .file-preview,.sfg-tool-scope .url-preview,.sfg-tool-scope .dropzone,.sfg-tool-scope .upload-zone,.sfg-tool-scope .sfg-zero-rep-panel,.sfg-tool-scope .sfg-model-badge,.sfg-tool-scope .sfg-usp-chip,.sfg-tool-scope .rounded-3.border,.sfg-tool-scope .p-3.border,.sfg-tool-scope .shadow-lg,.sfg-tool-scope [style*="background:#f8fafc"],.sfg-tool-scope [style*="background: #f8fafc"],.sfg-tool-scope [style*="background:#f9fafb"],.sfg-tool-scope [style*="background:#f5f3ff"],.sfg-tool-scope [style*="background:#fafafa"],.sfg-tool-scope [style*="background:#f5f5f5"],.sfg-tool-scope [style*="background:#fff"],.sfg-tool-scope [style*="background: #fff"],.sfg-tool-scope [style*="background:white"],.sfg-tool-scope [style*="background: white"],.sfg-tool-scope [style*="background:#ffffff"]{background:var(--panel)!important;border-color:var(--line)!important;color:var(--ink)!important;box-shadow:none!important}
.sfg-tool-scope .bg-light,.sfg-tool-scope .bg-white,.sfg-tool-scope .card-header,.sfg-tool-scope .form-control,.sfg-tool-scope .form-select,.sfg-tool-scope textarea,.sfg-tool-scope .generator-input,.sfg-tool-scope .input-tabs,.sfg-tool-scope .copy-btn,.sfg-tool-scope .tone-btn,.sfg-tool-scope .type-btn,.sfg-tool-scope .ratio-btn,.sfg-tool-scope .platform-badge,.sfg-tool-scope .hashtag-item,.sfg-tool-scope .btn-outline-secondary,.sfg-tool-scope .tweet-copy-btn,.sfg-tool-scope .copy-all-btn,.sfg-tool-scope .usage-icon-wrapper,.sfg-tool-scope .bg-gradient-warning-soft,.sfg-tool-scope .bg-gradient-success-soft,.sfg-tool-scope .bg-gradient-primary-soft{background:var(--panel-2)!important;border-color:var(--line)!important;color:var(--ink)!important;background-image:none!important}
.sfg-tool-scope .form-control::placeholder,.sfg-tool-scope .generator-input::placeholder,.sfg-tool-scope textarea::placeholder{color:#6f6e7a!important}
.sfg-tool-scope .form-control:focus,.sfg-tool-scope .form-select:focus,.sfg-tool-scope textarea:focus,.sfg-tool-scope .generator-input-container:focus-within{border-color:var(--accent)!important;box-shadow:0 0 0 3px rgba(255,99,0,.18)!important}
.sfg-tool-scope .form-select{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23A9A8B3' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e")!important;background-repeat:no-repeat!important;background-position:right .75rem center!important;background-size:16px 12px!important}
.sfg-tool-scope .form-select option{background:#20202B;color:#F4F3EE}
.sfg-tool-scope .card:hover,.sfg-tool-scope .feature-card:hover,.sfg-tool-scope .feature-card-hover:hover,.sfg-tool-scope .step-card:hover,.sfg-tool-scope .p-3.border:hover,.sfg-tool-scope .rounded-3.border:hover{border-color:var(--accent)!important;box-shadow:none!important;transform:none!important}
/* chips & active states */
.sfg-tool-scope .tone-btn.active,.sfg-tool-scope .type-btn.active,.sfg-tool-scope .ratio-btn.active,.sfg-tool-scope .input-tab.active,.sfg-tool-scope .hashtag-item.recommended,.sfg-tool-scope .platform-badge.active{background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important;box-shadow:none!important}
.sfg-tool-scope .input-tab{color:var(--muted)!important;background:transparent!important}
.sfg-tool-scope .tone-btn:hover,.sfg-tool-scope .type-btn:hover,.sfg-tool-scope .copy-btn:hover,.sfg-tool-scope .hashtag-item:hover,.sfg-tool-scope .dropzone:hover,.sfg-tool-scope .dropzone.dragover,.sfg-tool-scope .upload-zone:hover,.sfg-tool-scope .upload-zone.dragover{border-color:var(--accent)!important;color:var(--ink)!important;background:var(--panel-2)!important}
.sfg-tool-scope .badge-custom,.sfg-tool-scope .badge-ai,.sfg-tool-scope .badge-ppc,.sfg-tool-scope .hero-badge,.sfg-tool-scope .usage-bar,.sfg-tool-scope .sfg-trust-eyebrow,.sfg-tool-scope .title-section{background:rgba(255,99,0,.12)!important;border:1px solid rgba(255,99,0,.35)!important;color:var(--accent)!important;background-image:none!important}
.sfg-tool-scope .sfg-trust-eyebrow,.sfg-tool-scope .title-section{background:none!important;border:0!important}
.sfg-tool-scope .usage-label{color:var(--muted)!important}
.sfg-tool-scope .usage-value{color:var(--ink)!important}
.sfg-tool-scope .usage-icon-wrapper{color:var(--accent)!important}
.sfg-tool-scope .sfg-live-dot,.sfg-tool-scope .sfg-usp-check{color:#22c55e!important}
.sfg-tool-scope .sfg-model-badge{color:var(--ink)!important;border-color:var(--line)!important}
.sfg-tool-scope .sfg-model-sub{color:var(--muted)!important}
/* buttons */
.sfg-tool-scope .btn-primary-gradient,.sfg-tool-scope .generate-btn,.sfg-tool-scope .btn-generate,.sfg-tool-scope .btn-generate-mock,.sfg-tool-scope .btn-success,.sfg-tool-scope .btn-primary,.sfg-tool-scope .btn-youtube,.sfg-tool-scope .btn-danger,.sfg-tool-scope .btn-dark,.sfg-tool-scope .btn-info,.sfg-tool-scope .btn-warning,.sfg-tool-scope button[id^="btn-generate"],.sfg-tool-scope button[id^="btn-analyze"]{background:var(--accent)!important;background-image:none!important;border:1px solid var(--accent)!important;color:#fff!important;box-shadow:none!important;font-weight:700}
.sfg-tool-scope .btn-primary-gradient:hover,.sfg-tool-scope .generate-btn:hover,.sfg-tool-scope .btn-generate:hover,.sfg-tool-scope .btn-success:hover,.sfg-tool-scope .btn-primary:hover,.sfg-tool-scope button[id^="btn-generate"]:hover{background:#ff7a2a!important;opacity:1!important}
.sfg-tool-scope .btn-outline-secondary:hover,.sfg-tool-scope .tweet-copy-btn:hover,.sfg-tool-scope .copy-all-btn:hover{border-color:var(--accent)!important;color:var(--accent)!important}
.sfg-tool-scope .text-decoration-underline{color:var(--accent)!important}
/* results */
.sfg-tool-scope .analysis-output h2,.sfg-tool-scope .analysis-output h3{color:var(--accent)!important;background:rgba(255,99,0,.1)!important;border-color:var(--accent)!important}
.sfg-tool-scope .analysis-output p,.sfg-tool-scope .analysis-output li,.sfg-tool-scope [id$="result-content"]{color:var(--ink)!important}
.sfg-tool-scope pre,.sfg-tool-scope code{color:var(--ink)!important;background:var(--panel-2)!important}
/* FAQ */
.sfg-tool-scope .ai-faq-section .card{background:var(--panel)!important;border-color:var(--line)!important}
.sfg-tool-scope .ai-faq-section .btn-link{color:var(--ink)!important;background:transparent!important}
.sfg-tool-scope .ai-faq-section .btn-link:hover{color:var(--accent)!important}
.sfg-tool-scope .ai-faq-section .card-body{color:var(--muted)!important;background:var(--panel)!important}
/* stat bar */
.sfg-tool-scope .stat-num{color:var(--accent)!important}
/* how-it-works mockup */
.sfg-tool-scope .border-bottom{border-color:var(--line)!important}
.sfg-tool-scope .vr{background:var(--line)!important}
.sfg-tool-scope hr{border-color:var(--line)!important}
/* step numbers / icons */
.sfg-tool-scope [style*="background:rgba(99,102,241,0.1)"],.sfg-tool-scope [style*="background: rgba(99, 102, 241"],.sfg-tool-scope .step-number{background:rgba(255,99,0,.14)!important;color:var(--accent)!important}
.sfg-tool-scope [style*="color:#6366f1"],.sfg-tool-scope [style*="color: #6366f1"],.sfg-tool-scope [style*="color:#7c3aed"],.sfg-tool-scope [style*="color: #7c3aed"]{color:var(--accent)!important}
.sfg-tool-scope [style*="background:#6366f1"]{background:var(--accent)!important}
/* category nav + frame */
.sfg-tool-scope .sfg-tool-frame{padding-top:92px;color:var(--ink)}
@media(max-width:768px){.sfg-tool-scope .sfg-tool-frame{padding-top:72px}}
.sfg-tool-scope .sfg-studio-categories{border-bottom:1px solid var(--line)!important;color:var(--ink)}
.sfg-tool-scope .sfg-studio-categories a{color:var(--muted)!important;border-radius:999px!important}
.sfg-tool-scope .sfg-studio-categories a:hover{color:var(--ink)!important;text-decoration:none!important;background:var(--panel-2)!important}
.sfg-tool-scope .sfg-studio-categories a[aria-current="page"]{background:var(--panel-2)!important;border-color:var(--line)!important;color:var(--ink)!important}
.sfg-tool-scope .sfg-tool-crumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:14px 0 0}
.sfg-tool-scope .sfg-tool-crumbs a{color:var(--muted)!important;text-decoration:none}
.sfg-tool-scope .sfg-tool-crumbs a:hover{color:var(--accent)!important}
.sfg-tool-scope .sfg-tool-crumbs span[aria-current]{color:var(--ink)}
.sfg-tool-scope .sfg-tool-pitch{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:center;font-size:13px;color:var(--muted);margin:-28px 0 34px}
.sfg-tool-scope .sfg-tool-pitch span::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:8px;vertical-align:middle}
/* more tools strip */
.sfg-tool-scope .sfg-more-tools{padding:56px 0 24px;border-top:1px solid var(--line)}
.sfg-tool-scope .sfg-more-tools h2{font-size:clamp(24px,3vw,32px);margin:0 0 6px}
.sfg-tool-scope .sfg-more-tools>.container>p{color:var(--muted);margin:0 0 22px}
.sfg-tool-scope .sfg-more-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.sfg-tool-scope .sfg-more-grid a{display:block;padding:16px 18px;background:var(--panel)!important;border:1px solid var(--line);border-radius:14px;color:var(--ink)!important;text-decoration:none!important;transition:border-color .15s}
.sfg-tool-scope .sfg-more-grid a:hover{border-color:var(--accent)}
.sfg-tool-scope .sfg-more-grid strong{display:block;font-size:15px;margin-bottom:4px;color:var(--ink)!important}
.sfg-tool-scope .sfg-more-grid span{font-size:12.5px;color:var(--muted)!important}
.sfg-tool-scope .sfg-studio-cta{display:grid;grid-template-columns:1.2fr .8fr;gap:24px;align-items:center;margin:28px 0 8px;padding:28px 30px;border-radius:18px;background:linear-gradient(135deg,#1d1710 0%,#191922 60%);border:1px solid rgba(255,99,0,.35)}
.sfg-tool-scope .sfg-studio-cta h3{font-family:'Space Grotesk',Inter,sans-serif;font-size:clamp(22px,2.6vw,30px);margin:0 0 8px;color:var(--ink)!important}
.sfg-tool-scope .sfg-studio-cta p{margin:0;color:var(--muted)!important}
.sfg-tool-scope .sfg-studio-cta-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.sfg-tool-scope .sfg-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:999px;font-weight:700;font-size:14px;text-decoration:none!important;border:1px solid var(--line);color:var(--ink)!important;background:var(--panel-2)}
.sfg-tool-scope .sfg-btn:hover{border-color:var(--accent)}
.sfg-tool-scope .sfg-btn-primary{background:var(--accent);border-color:var(--accent);color:#fff!important}
.sfg-tool-scope .sfg-btn-primary:hover{background:#ff7a2a}
@media(max-width:768px){.sfg-tool-scope .sfg-studio-cta{grid-template-columns:1fr}.sfg-tool-scope .sfg-studio-cta-actions{justify-content:flex-start}}
/* footer stays as site footer; nothing here */
/* generic chip buttons (platform-btn, style-btn, tone-btn, etc.) */
.sfg-tool-scope button[class*="-btn"]:not(.generate-btn):not(.btn-generate):not(.btn-generate-mock):not([id^="btn-"]):not(.btn-link){background:var(--panel-2)!important;background-image:none!important;border:1px solid var(--line)!important;color:var(--ink)!important;box-shadow:none!important}
.sfg-tool-scope button[class*="-btn"].active:not(.generate-btn):not([id^="btn-"]){background:var(--accent)!important;border-color:var(--accent)!important;color:#fff!important}
.sfg-tool-scope button[class*="-btn"]:not(.active):hover{border-color:var(--accent)!important}
.sfg-tool-scope a.btn:not(.btn-outline-secondary):not(.btn-link),.sfg-tool-scope a.btn[style*="gradient"],.sfg-tool-scope .btn[style*="gradient"]{background:var(--accent)!important;background-image:none!important;border-color:var(--accent)!important;color:#fff!important;box-shadow:none!important}
.sfg-tool-scope [style*="gradient"]:not(.sfg-studio-cta):not(.btn):not(h1):not(span):not(.hero-bg-circle){background-image:none!important}
/* leftovers found in the dev sweep */
.sfg-tool-scope [class*="-wrapper"] .bg-light,.sfg-tool-scope .custom-toggle-container,.sfg-tool-scope .form-control-blog,.sfg-tool-scope .input-group-custom,.sfg-tool-scope .benefit-icon,.sfg-tool-scope .mockup-body-placeholder,.sfg-tool-scope .rounded-4[style*="background"],.sfg-tool-scope [style*="background:#f5f9ff"],.sfg-tool-scope [style*="background: #f5f9ff"],.sfg-tool-scope [style*="background:#f3f4f6"],.sfg-tool-scope [style*="background:#f1f5f9"],.sfg-tool-scope [style*="background:#eef2ff"],.sfg-tool-scope [style*="background:#f0f4ff"],.sfg-tool-scope [style*="background:#fff5f5"],.sfg-tool-scope [style*="background:#fdf2f8"],.sfg-tool-scope [style*="background:#ecfdf5"],.sfg-tool-scope [style*="background:#fffbeb"],.sfg-tool-scope [style*="background:#fef3c7"],.sfg-tool-scope [style*="background:#d1fae5"]{background:var(--panel-2)!important;background-image:none!important;border-color:var(--line)!important;color:var(--ink)!important}
.sfg-tool-scope span[class^="badge-"],.sfg-tool-scope .badge{background:rgba(255,99,0,.12)!important;background-image:none!important;border:1px solid rgba(255,99,0,.35)!important;color:var(--accent)!important}
.sfg-tool-scope .custom-toggle-container:hover{border-color:var(--accent)!important}
.sfg-tool-scope .slider{background:var(--line)!important}
.sfg-tool-scope input:checked + .slider{background:var(--accent)!important}
.sfg-tool-scope .form-control-blog{border:1px solid var(--line)!important}
.sfg-tool-scope .form-control-blog::placeholder{color:#6f6e7a!important}
