:root {
  --primary:    #1a56db;
  --primary-lt: #ebf0ff;
  --success:    #057a55;
  --success-lt: #e3fcef;
  --danger:     #c81e1e;
  --danger-lt:  #fde8e8;
  --warning:    #b45309;
  --warning-lt: #fef3c7;
  --text:       #111827;
  --muted:      #6b7280;
  --border:     #e5e7eb;
  --bg:         #f9fafb;
  --white:      #ffffff;
  --nav-h:      64px;


 

  

/* SIP */
  --primary-sip:#057a55;--primary-sip-lt:#e3fcef;--accent-sip:#10b981;--text-sip:#111827;--muted-sip:#6b7280;--border-sip:#e5e7eb;--bg-sip:#f9fafb;--white-sip:#fff;
  /* BMI */
  --primary-bmi:#7c3aed;--primary-bmi-lt:#f3f0ff;--text-bmi:#111827;--muted-bmi:#6b7280;--border-bmi:#e5e7eb;--bg-bmi:#f9fafb;--white-bmi:#fff;
  /* Image Format */
  --primary-image-converter:#b45309;--primary-image-converter-lt:#fef3c7;--accent-image-converter:#f59e0b;--text-image-converter:#111827;--muted-image-converter:#6b7280;--border-image-converter:#e5e7eb;--bg-image-converter:#f9fafb;--white-image-converter:#fff;
/* Percentage */
--primary-percentage: #7c3aed;
--primary-lt-percentage: #f5f3ff;
--accent-percentage: #a78bfa;
--text-percentage: #111827;
--muted-percentage: #6b7280;
--border-percentage: #e5e7eb;
--bg-percentage: #f9fafb;
--white-percentage: #fff;

/* Electricity */
--primary-electricity:#d97706;--primary-lt-electricity:#fffbeb;--accent-electricity:#f59e0b;--text-electricity:#111827;--muted-electricity:#6b7280;--border-electricity:#e5e7eb;--bg-electricity:#f9fafb;--white-electricity:#fff;

/* PF Interest */
--primary-pf:#059669;--primary-lt-pf:#ecfdf5;--accent-pf:#10b981;--text-pf:#111827;--muted-pf:#6b7280;--border-pf:#e5e7eb;--bg-pf:#f9fafb;--white-pf:#fff;

/* Credit Card Interest */
--primary-credit-card:#dc2626;--primary-lt-credit-card:#fef2f2;--accent-credit-card:#ef4444;--text-credit-card:#111827;--muted-credit-card:#6b7280;--border-credit-card:#e5e7eb;--bg-credit-card:#f9fafb;--white-credit-card:#fff;

/* Calorie Calacualtor */
--primary-calorie:#0891b2;--primary-lt-calorie:#ecfeff;--accent-calorie:#06b6d4;--text-calorie:#111827;--muted-calorie:#6b7280;--border-calorie:#e5e7eb;--bg-calorie:#f9fafb;--white-calorie:#fff;

/* Body Fat Calculator */
--primary-body-fat:#7c3aed;--primary-lt-body-fat:#f5f3ff;--accent-body-fat:#a78bfa;--text-body-fat:#111827;--muted-body-fat:#6b7280;--border-body-fat:#e5e7eb;--bg-body-fat:#f9fafb;--white-body-fat:#fff;

--primary-json:#7c3aed;--primary-lt-json:#f5f3ff;--text-json:#111827;--muted-json:#6b7280;--border-json:#e5e7eb;--bg-json:#f9fafb;--white-json:#fff;--code-bg-json:#1e1e2e;
/* Password Generator */
--primary-password:#7c3aed;--primary-lt-password:#f5f3ff;--text-password:#111827;--muted-password:#6b7280;--border-password:#e5e7eb;--bg-password:#f9fafb;--white-password:#fff;
/* Word Counter */
--primary-word:#7c3aed;--primary-lt-word:#f5f3ff;--text-word:#111827;--muted-word:#6b7280;--border-word:#e5e7eb;--bg-word:#f9fafb;--white-word:#fff;
/* Love Calculator */
--primary-love:#590086;--primary-lt-love:#f5f3ff;--accent-love:#a78bfa;--text-love:#111827;--muted-love:#6b7280;--border-love:#e5e7eb;--bg-love:#f9fafb;--white-love:#fff;
/* Entertainment */
--primary-lt-entertainment:#a0d9e95e;
/* Image size compressor */
--primary-image-compressor:#108ea8;--primary-lt-image-compressor:#f5f3ff;--accent-image-compressor:#108ea8;--text-image-compressor:#111827;--muted-image-compressor:#6b7280;--border-image-compressor:#e5e7eb;--bg-image-compressor:#f9fafb;--white-image-compressor:#fff;
--primary-ctc:#0891b2;--primary-lt-ctc:#f5f3ff;--accent-ctc:#a78bfa;--text-ctc:#111827;--muted-ctc:#6b7280;--border-ctc:#e5e7eb;--bg-ctc:#f9fafb;--white-ctc:#fff;
--primary-invoice:#16a34a;--primary-lt-invoice:#f5f3ff;--accent-invoice:#a78bfa;--text-invoice:#111827;--muted-invoice:#6b7280;--border-invoice:#e5e7eb;--bg-invoice:#f9fafb;--white-invoice:#fff;
/* PDF TOOLS */
--primary-pdf:#dc2626;--primary-lt-pdf:#fff1f2;--primary-mid-pdf:#fecaca;--accent-pdf:#ef4444;--text-pdf:#111827;--muted-pdf:#6b7280;--border-pdf:#e5e7eb;--bg-pdf:#f9fafb;--white-pdf:#fff;
/* QR Generator */
--primary-qr:#0891b2;--primary-lt-qr:#ecfeff;--accent-qr:#06b6d4;--text-qr:#111827;--muted-qr:#6b7280;--border-qr:#e5e7eb;--bg-qr:#f9fafb;--white-qr:#fff;


/* JSON CONVERTER */

--bg-json-converter: #0f1117;
--surface-json-converter: #1a1d27;
--surface2-json-converter: #22263a;
--border-json-converter: #2e3349;
--border-light-json-converter: #3a4060;
--primary-json-converter: #6c63ff;
--primary-glow-json-converter: rgba(108,99,255,.18);
--primary-dark-json-converter: #5048e5;
--green-json-converter: #22c55e;
--green-glow-json-converter: rgba(34,197,94,.15);
--blue-json-converter: #38bdf8;
--blue-glow-json-converter: rgba(56,189,248,.15);
--orange-json-converter: #f97316;
--red-json-converter: #ef4444;
--text-json-converter: #e8eaf2;
--muted-json-converter: #8b90a8;
--muted2-json-converter: #555b77;
--mono-json-converter: 'JetBrains Mono', monospace;
--sans-json-converter: 'Inter', sans-serif;
--radius-json-converter: 12px;
--radius-sm-json-converter: 8px;
--shadow-json-converter: 0 4px 24px rgba(0,0,0,.4);


/* DUMMY DATA GENERATOR */

--primary-dummy-data:#dc2626;--primary-lt-dummy-data:#fff1f2;--primary-mid-dummy-data:#fecaca;--accent-dummy-data:#ef4444;
      --text-dummy-data:#111827;--muted-dummy-data:#6b7280;--border-dummy-data:#e5e7eb;--bg-dummy-data:#f9fafb;--white-dummy-data:#fff;

      /* Resume Generator */
--ink-resume-generator:#1c1f26;--paper-resume-generator:#fafaf8;--line-resume-generator:#e3e1da;--accent-resume-generator:#1f4e3d;--accent2-resume-generator:#8a6d3b;--muted-resume-generator:#6b6f76;--panel-resume-generator:#ffffff;--bg-resume-generator:#f1efe9;
/* TIMESTAMP CONVERTER */
--primary-timestamp:#0d9488;        /* teal */
--primary-dk-timestamp:#115e59;
--primary-lt-timestamp:#f0fdfa;
--accent-timestamp:#2dd4bf;
--text-timestamp:#0f172a;
--muted-timestamp:#64748b;
--border-timestamp:#e2e8f0;
--bg-timestamp:#f8fafc;
--white-timestamp:#fff;

/* AI LOGO GENERATOR */
--primary-ai-logo:#7c3aed;--primary-lt-ai-logo:#f5f3ff;--accent-ai-logo:#a78bfa;--text-ai-logo:#111827;--muted-ai-logo:#6b7280;--border-ai-logo:#e5e7eb;--bg-ai-logo:#f9fafb;--white-ai-logo:#fff;

/* CSS GRADIENT GENERATOR */
--bg-css-gradient:#0a0a0f;
--surface-css-gradient:#13131a;
--surface2-css-gradient:#1c1c27;
--border-css-gradient:#2a2a3d;
--text-css-gradient:#f0f0ff;
--muted-css-gradient:#8b8ba0;
--accent1-css-gradient:#7c3aed;
--accent2-css-gradient:#06b6d4;
--accent3-css-gradient:#f59e0b;


/* URL ENCODER AND DECODER */

--bg-url-encode-decode:#f5f5f0;
--surface-url-encode-decode:#ffffff;
--surface2-url-encode-decode:#f0f0ea;
--border-url-encode-decode:#d8d8d0;
--text-url-encode-decode:#1a1a18;
--muted-url-encode-decode:#6b6b62;
--accent-url-encode-decode:#2563eb;
--accent-lt-url-encode-decode:#eff6ff;
--green-url-encode-decode:#16a34a;
--green-lt-url-encode-decode:#f0fdf4;
--orange-url-encode-decode:#ea580c;
--orange-lt-url-encode-decode:#fff7ed;
--red-url-encode-decode:#dc2626;


/* BOX SHADOW GENERATOR */
--bg-box-shadow:#fafaf8;
--surface-box-shadow:#ffffff;
--surface2-box-shadow:#f3f4f6;
--border-box-shadow:#e5e7eb;
--text-box-shadow:#111827;
--muted-box-shadow:#6b7280;
--purple-box-shadow:#8b5cf6;
--purple-lt-box-shadow:#f5f3ff;
--pink-box-shadow:#ec4899;


/* CSS TOOL */
--primary-lt-css-tool:linear-gradient(135deg, #c0aee9 0%, #ecb6d1 100%);


/* FLEXBOX GENERATOR */
--bg-flexbox:#fffef7;
--surface-flexbox:#ffffff;
--border-flexbox:#e8e8dc;
--text-flexbox:#1c1c14;
--muted-flexbox:#78786a;
--yellow-flexbox:#f59e0b;
--yellow-dk-flexbox:#b45309;
--yellow-lt-flexbox:#fffbeb;
--teal-flexbox:#0d9488;
--teal-lt-flexbox:#f0fdfa;
--red-flexbox:#ef4444;

/* CSS GRID GENERATOR */
--bg-css-grid:#f0eee8;
--surface-css-grid:#ffffff;
--border-css-grid:#d8d5cc;
--text-css-grid:#1a1714;
--muted-css-grid:#7a7668;
--ink-css-grid:#1a1714;
--coral-css-grid:#ff5733;
--coral-lt-css-grid:#fff2ef;
--blue-css-grid:#1d4ed8;

/* OPEN GRAPH GENERATOR */
--primary-open-graph:#5b21d6;
--primary-2-open-graph:#7c3aed;
--primary-lt-open-graph:#f5f3ff;
--accent-open-graph:#22c1ff;
--text-open-graph:#111827;
--muted-open-graph:#6b7280;
--border-open-graph:#e5e7eb;
--bg-open-graph:#f8f9fc;
--white-open-graph:#fff;
--ok-open-graph:#16a34a;

/* COLOR PALETTE GENERATOR */
--primary-color-palette:#6d4aff;
--primary-dark-color-palette:#5a3ce8;
--primary-lt-color-palette:#f3f0ff;
--text-color-palette:#111827;
--muted-color-palette:#6b7280;
--border-color-palette:#e5e7eb;
--bg-color-palette:#f7f7fb;
--white-color-palette:#fff;

/* FAVICON GENERATOR */

--primary-favicon:#7c3aed;--primary-lt-favicon:#f5f3ff;--accent-favicon:#a78bfa;--text-favicon:#111827;--muted-favicon:#6b7280;--border-favicon:#e5e7eb;--bg-favicon:#f9fafb;--white-favicon:#fff;

/* CASE CONVERTER */
--primary-lt-text-tools:#5ffd845e;

--primary-case-converter:#ed3a3a;--primary-lt-case-converter:#f5f3ff;--accent-case-converter:#a78bfa;--text-case-converter:#111827;--muted-case-converter:#6b7280;--border-case-converter:#e5e7eb;--bg-case-converter:#f9fafb;--white-case-converter:#fff;

/* REMOVE DUPLICATE LINES */
--primary-remove-duplicate-lines:#d12e0ea1;--primary-lt-remove-duplicate-lines:#f5f3ff;--accent-remove-duplicate-lines:#a78bfa;--text-remove-duplicate-lines:#111827;--muted-remove-duplicate-lines:#6b7280;--border-remove-duplicate-lines:#e5e7eb;--bg-remove-duplicate-lines:#f9fafb;--white-remove-duplicate-lines:#fff;

/* TEXT SORTER */
--primary-text-sorter:#7a00fca1;--primary-lt-text-sorter:#f5f3ff;--accent-text-sorter:#a78bfa;--text-text-sorter:#111827;--muted-text-sorter:#6b7280;--border-text-sorter:#e5e7eb;--bg-text-sorter:#f9fafb;--white-text-sorter:#fff;

/* REVERSE TEXT */
--primary-reverse-text:#7c3aed;--primary-lt-reverse-text:#f5f3ff;--accent-reverse-text:#a78bfa;--text-reverse-text:#111827;--muted-reverse-text:#6b7280;--border-reverse-text:#e5e7eb;--bg-reverse-text:#f9fafb;--white-reverse-text:#fff;

/* REMOVE EMPTY LINES */
--primary-remove-empty-lines:#48326f;--primary-lt-remove-empty-lines:#f5f3ff;--accent-remove-empty-lines:#a78bfa;--text-remove-empty-lines:#111827;--muted-remove-empty-lines:#6b7280;--border-remove-empty-lines:#e5e7eb;--bg-remove-empty-lines:#f9fafb;--white-remove-empty-lines:#fff;

/* FIND AND REPLACE */
--primary-find-and-replace:#d601c8;--primary-lt-find-and-replace:#f5f3ff;--accent-find-and-replace:#d601c8;--text-find-and-replace:#111827;--muted-find-and-replace:#6b7280;--border-find-and-replace:#e5e7eb;--bg-find-and-replace:#f9fafb;--white-find-and-replace:#fff;

/* MARKDOWN EDITOR */
--primary-markdown-editor:#1d6aa9;--primary-lt-markdown-editor:#f5f3ff;--accent-markdown-editor:#1d6aa9;--text-markdown-editor:#111827;--muted-markdown-editor:#6b7280;--border-markdown-editor:#e5e7eb;--bg-markdown-editor:#f9fafb;--white-markdown-editor:#fff;

/* UNIQUE CODE CONVERTER */
--primary-unique-code-converter:#00a70b;--primary-lt-unique-code-converter:#f5f3ff;--accent-unique-code-converter:#1d6aa9;--text-unique-code-converter:#111827;--muted-unique-code-converter:#6b7280;--border-unique-code-converter:#e5e7eb;--bg-unique-code-converter:#f9fafb;--white-unique-code-converter:#fff;

/* ASCII CONVERTER */
--primary-ascii-converter:#00a70b;--primary-lt-ascii-converter:#f5f3ff;--accent-ascii-converter:#1d6aa9;--text-ascii-converter:#111827;--muted-ascii-converter:#6b7280;--border-ascii-converter:#e5e7eb;--bg-ascii-converter:#f9fafb;--white-ascii-converter:#fff;


/* DATA SANITIZER */
--primary-data-sanitizer:#db2777;--primary-dk-data-sanitizer:#9d174d;--primary-lt-data-sanitizer:#fdf2f8;--accent-data-sanitizer:#f472b6;--text-data-sanitizer:#0f172a;--muted-data-sanitizer:#64748b;--border-data-sanitizer:#e2e8f0;--bg-data-sanitizer:#f8fafc;--white-data-sanitizer:#fff;--ok-data-sanitizer:#16a34a;--ok-lt-data-sanitizer:#f0fdf4;

/* JSON PATH EXTRACTOR */
--primary-json-path-extractor:#4f46e5;--primary-dk-json-path-extractor:#3730a3;--primary-lt-json-path-extractor:#eef2ff;--accent-json-path-extractor:#818cf8;--text-json-path-extractor:#0f172a;--muted-json-path-extractor:#64748b;--border-json-path-extractor:#e2e8f0;--bg-json-path-extractor:#f8fafc;--white-json-path-extractor:#fff;--ok-json-path-extractor:#16a34a;--bad-json-path-extractor:#dc2626;--bad-lt-json-path-extractor:#fef2f2;

/* WEBHOOK TESTER */
--primary-webhook-tester:#0d9488;--primary-lt-webhook-tester:#f0fdfa;--accent-webhook-tester:#2dd4bf;--text-webhook-tester:#111827;--muted-webhook-tester:#6b7280;--border-webhook-tester:#e5e7eb;--bg-webhook-tester:#f9fafb;--white-webhook-tester:#fff;

/* IMAGE CROP AND RESIZE */
--primary-image-crop-resize:#4f46e5;--primary-lt-image-crop-resize:#eef2ff;--accent-image-crop-resize:#06b6d4;--text-image-crop-resize:#111827;--muted-image-crop-resize:#6b7280;--border-image-crop-resize:#e5e7eb;--bg-image-crop-resize:#f9fafb;--white-image-crop-resize:#fff;

/* CLOUDL TOOLS HOME PAGE */
--primary-lt-cloud-tools:#ffdabd;

/* AWS CRON GENERATOR */
--primary-aws-cron-generator:#b45309;--primary-lt-aws-cron-generator:#fffbeb;--accent-aws-cron-generator:#f59e0b;--text-aws-cron-generator:#111827;--muted-aws-cron-generator:#6b7280;--border-aws-cron-generator:#e5e7eb;--bg-aws-cron-generator:#f9fafb;--white-aws-cron-generator:#fff;


/* AZURE CRON GENERATOR */
--primary-azure-cron-generator:#0078d4;--primary-lt-azure-cron-generator:#eff6fc;--accent-azure-cron-generator:#50b0ff;--text-azure-cron-generator:#111827;--muted-azure-cron-generator:#6b7280;--border-azure-cron-generator:#e5e7eb;--bg-azure-cron-generator:#f9fafb;--white-azure-cron-generator:#fff;

/* YAML TO TOML CONVERTER */
--primary-yaml-to-toml:#e11d48;--primary-lt-yaml-to-toml:#fff1f2;--accent-yaml-to-toml:#fb7185;--text-yaml-to-toml:#111827;--muted-yaml-to-toml:#6b7280;--border-yaml-to-toml:#e5e7eb;--bg-yaml-to-toml:#f9fafb;--white-yaml-to-toml:#fff;


/* YAML TO JSON CONVERTER */
--primary-yaml-to-json:#0d9488;--primary-lt-yaml-to-json:#f0fdfa;--accent-yaml-to-json:#2dd4bf;--text-yaml-to-json:#111827;--muted-yaml-to-json:#6b7280;--border-yaml-to-json:#e5e7eb;--bg-yaml-to-json:#f9fafb;--white-yaml-to-json:#fff;

/* SLUGIFY SSTRING */

--primary-slugify-string:#0d9488;--primary-lt-slugify-string:#f0fdfa;--accent-slugify-string:#2dd4bf;--text-slugify-string:#111827;--muted-slugify-string:#6b7280;--border-slugify-string:#e5e7eb;--bg-slugify-string:#f9fafb;--white-slugify-string:#fff;

/* MERMAID LIVE EDITOR */
--primary-mermaid-editor:#7c3aed;--primary-lt-mermaid-editor:#f5f3ff;--accent-mermaid-editor-mermaid-editor:#a78bfa;--text-mermaid-editor:#111827;--muted-mermaid-editor:#6b7280;--border-mermaid-editor:#e5e7eb;--bg-mermaid-editor:#f9fafb;--white-mermaid-editor:#fff;
/* GOOGLE CLOUD CRON GENERATOR */
--primary-google-cron-generator:#1a73e8;--primary-lt-google-cron-generator:#e8f0fe;--accent-google-cron-generator:#4285f4;--text-google-cron-generator:#111827;--muted-google-cron-generator:#6b7280;--border-google-cron-generator:#e5e7eb;--bg-google-cron-generator:#f9fafb;--white-google-cron-generator:#fff;--dark-google-cron-generator:#174ea6;

/* IAM POLICY VALIDATOR */
--primary-iam-policy-validator:#4338ca;--primary-lt-iam-policy-validator:#eef2ff;--accent-iam-policy-validator:#06b6d4;--text-iam-policy-validator:#111827;--muted-iam-policy-validator:#6b7280;--border-iam-policy-validator:#e5e7eb;--bg-iam-policy-validator:#f9fafb;--white-iam-policy-validator:#fff;--dark-iam-policy-validator:#312e81;--danger-iam-policy-validator:#dc2626;--warn-iam-policy-validator:#d97706;--ok-iam-policy-validator:#059669;


/* S3 Bucket Policy Generator */
--primary-s3-bucket-policy-generator:#0f766e;--primary-lt-s3-bucket-policy-generator:#f0fdfa;--accent-s3-bucket-policy-generator:#14b8a6;--text-s3-bucket-policy-generator:#111827;--muted-s3-bucket-policy-generator:#6b7280;--border-s3-bucket-policy-generator:#e5e7eb;--bg-s3-bucket-policy-generator:#f9fafb;--white-s3-bucket-policy-generator:#fff;--dark-s3-bucket-policy-generator:#115e59;--danger-s3-bucket-policy-generator:#dc2626;

/* TERRAFORM VARIABLE GENERATOR */
/* --primary-terraform-variable:#0f766e;--primary-lt-terraform-variable:#f0fdfa;--accent-terraform-variable:#14b8a6;--text-terraform-variable:#111827;--muted-terraform-variable:#6b7280;--border-terraform-variable:#e5e7eb;--bg-terraform-variable:#f9fafb;--white-terraform-variable:#fff;--dark-terraform-variable:#115e59;--danger-terraform-variable:#dc2626; */
--primary-terraform-variable:#7c3aed;--primary-lt-terraform-variable:#f5f3ff;--accent-terraform-variable:#a78bfa;--text-terraform-variable:#111827;--muted-terraform-variable:#6b7280;--border-terraform-variable:#e5e7eb;--bg-terraform-variable:#f9fafb;--white-terraform-variable:#fff;--dark-terraform-variable:#5b21b6;--danger-terraform-variable:#dc2626;

/* UPI-CHARGE_CALCULATOR */
--primary-upi-charge:#4338ca;--primary-lt-upi-charge:#eef2ff;--accent-upi-charge:#6366f1;--text-upi-charge:#111827;--muted-upi-charge:#6b7280;--border-upi-charge:#e5e7eb;--bg-upi-charge:#f9fafb;--white-upi-charge:#fff;--dark-upi-charge:#3730a3;--danger-upi-charge:#dc2626;--good-upi-charge:#059669;

/* TERRAFORM FORMATTER */
--primary-terraform-formatter:#be123c;--primary-lt-terraform-formatter:#fff1f2;--accent-terraform-formatter:#fb7185;--text-terraform-formatter:#111827;--muted-terraform-formatter:#6b7280;--border-terraform-formatter:#e5e7eb;--bg-terraform-formatter:#f9fafb;--white-terraform-formatter:#fff;--dark-terraform-formatter:#881337;--danger-terraform-formatter:#dc2626;--ok-terraform-formatter:#059669;

/* TERRAFORM VALIDATOR */
--primary-terraform-validator:#2563eb;--primary-lt-terraform-validator:#eff6ff;--accent-terraform-validator:#60a5fa;--text-terraform-validator:#111827;--muted-terraform-validator:#6b7280;--border-terraform-validator:#e5e7eb;--bg-terraform-validator:#f9fafb;--white-terraform-validator:#fff;--dark-terraform-validator:#1e3a8a;--danger-terraform-validator:#dc2626;--warn-terraform-validator:#d97706;--ok-terraform-validator:#059669;

/* Kubernetes Resource Calculator */

--primary-kubernetes-resource-calcualtor:#326ce5;--primary-lt-kubernetes-resource-calcualtor:#eef4ff;--accent-kubernetes-resource-calcualtor:#5b8def;--text-kubernetes-resource-calcualtor:#111827;--muted-kubernetes-resource-calcualtor:#6b7280;--border-kubernetes-resource-calcualtor:#e5e7eb;--bg-kubernetes-resource-calcualtor:#f9fafb;--white-kubernetes-resource-calcualtor:#fff;--dark-kubernetes-resource-calcualtor:#1f3d99;--danger-kubernetes-resource-calcualtor:#dc2626;--warn-kubernetes-resource-calcualtor:#d97706;--ok-kubernetes-resource-calcualtor:#059669;
/* DOCKER RESOURCE CALCULATOR */
--primary-docker-resource-calculator:#2496ED;--primary-lt-docker-resource-calculator:#e9f5fe;--accent-docker-resource-calculator:#0db7ed;--text-docker-resource-calculator:#0b1220;--muted-docker-resource-calculator:#64748b;--border-docker-resource-calculator:#e2e8f0;--bg-docker-resource-calculator:#f7fafc;--white-docker-resource-calculator:#fff;--dark-docker-resource-calculator:#043b6b;--danger-docker-resource-calculator:#dc2626;--warn-docker-resource-calculator:#c2760c;--ok-docker-resource-calculator:#0a8a5f;


/* SHOPIFY PROFIR MARGIN CALCULATOR */
--primary-shopify-profit-margin:#008060;--primary-lt-shopify-profit-margin:#e6f5f1;--accent-shopify-profit-margin:#00a878;--text-shopify-profit-margin:#0f1a17;--muted-shopify-profit-margin:#697a75;--border-shopify-profit-margin:#e1e8e5;--bg-shopify-profit-margin:#f7faf9;--white-shopify-profit-margin:#fff;--dark-shopify-profit-margin:#004c3f;--danger-shopify-profit-margin:#dc2626;--warn-shopify-profit-margin:#c2760c;--ok-shopify-profit-margin:#059669;

/* OCR TOOL */
--ink-ocr-tool:#14213d;
--ink-soft-ocr-tool:#3a4562;
--paper-ocr-tool:#f3f5f8;
--panel-ocr-tool:#ffffff;
--border-ocr-tool:#dfe3ea;
--muted-ocr-tool:#647089;
--accent-ocr-tool:#ffb703;
--accent-deep-ocr-tool:#c98a00;
--teal-ocr-tool:#0f9b8e;
--teal-soft-ocr-tool:#e3f6f3;
--danger-ocr-tool:#e5484d;
--danger-soft-ocr-tool:#fdecec;
--warn-ocr-tool:#d97706;
--warn-soft-ocr-tool:#fdf3e2;
--radius-ocr-tool:14px;
--shadow-ocr-tool:0 1px 2px rgba(20,33,61,.04), 0 8px 24px -12px rgba(20,33,61,.18);
--font-display-ocr-tool:'Space Grotesk',sans-serif;
--font-body-ocr-tool:'Inter',sans-serif;
--font-mono-ocr-tool:'JetBrains Mono',monospace;


/* NORMAL DISTRIBUTION CALCUALTOR */
--primary-normal-distribution:#4f46e5;--primary-rgb-normal-distribution:79,70,229;--primary-lt-normal-distribution:#eef0fe;--accent-normal-distribution:#7c3aed;
--text-normal-distribution:#14162b;--muted-normal-distribution:#656b85;--border-normal-distribution:#e3e5f2;--bg-normal-distribution:#f6f7fc;--panel-normal-distribution:#fff;
--heading-normal-distribution:#1e1b4b;--headline-bg-normal-distribution:#312e81;
--danger-normal-distribution:#dc2626;--warn-normal-distribution:#c2760c;--ok-normal-distribution:#059669;


/* DATA FORMATTER AND CONVERTER HEADER */
--primary-lt-header-data-formatter-converter:#f9cece;

/* SQL QUERY FORMATTER */
  --primary-sql-query-formatter:#0d9488;--primary-rgb-sql-query-formatter:13,148,136;--primary-lt-sql-query-formatter:#e6f5f3;--accent-sql-query-formatter:#f59e0b;
  --text-sql-query-formatter:#14162b;--muted-sql-query-formatter:#656b85;--border-sql-query-formatter:#e3e5f2;--bg-sql-query-formatter:#f5f7f7;--panel-sql-query-formatter:#fff;
  --heading-sql-query-formatter:#0f2e2c;--headline-bg-sql-query-formatter:#0f2e2c;
  --danger-sql-query-formatter:#dc2626;--warn-sql-query-formatter:#c2760c;--ok-sql-query-formatter:#059669;
  --code-bg-sql-query-formatter:#0f2e2c;--code-bg-panel-sql-query-formatter:#0c2624;
  --tok-keyword-sql-query-formatter:#5eead4;--tok-func-sql-query-formatter:#f0abfc;--tok-string-sql-query-formatter:#fbbf24;--tok-number-sql-query-formatter:#93c5fd;--tok-comment-sql-query-formatter:#7d9490;--tok-punct-sql-query-formatter:#c7d2d0;--tok-op-sql-query-formatter:#fca5a5;--tok-plain-sql-query-formatter:#e7f3f1;


  /* CSV TO MARKDOWN TABLE CONVERTER */
  --primary-csv-to-markdown-table:#0d9488;--primary-lt-csv-to-markdown-table:#e6f7f5;--accent-csv-to-markdown-table:#14b8a6;--text-csv-to-markdown-table:#152522;--muted-csv-to-markdown-table:#647873;--border-csv-to-markdown-table:#dbe9e6;--bg-csv-to-markdown-table:#f4faf9;--white-csv-to-markdown-table:#fff;--dark-csv-to-markdown-table:#0f6f63;--danger-csv-to-markdown-table:#dc2626;--warn-csv-to-markdown-table:#c2760c;--ok-csv-to-markdown-table:#059669;

  /* JSON TO JSONL CONVERTER */
  --primary-json-to-jsonl:#d97706;--primary-lt-json-to-jsonl:#fdf1e0;--accent-json-to-jsonl:#f59e0b;--text-json-to-jsonl:#221c14;--muted-json-to-jsonl:#7a6f60;--border-json-to-jsonl:#ece2d2;--bg-json-to-jsonl:#fbf8f3;--white-json-to-jsonl:#fff;--dark-json-to-jsonl:#92400e;--danger-json-to-jsonl:#dc2626;--warn-json-to-jsonl:#c2760c;--ok-json-to-jsonl:#059669;
/* PHP ARRAY TO JSON CONVERTER */
--primary-php-array-to-json:#7c3aed;--primary-lt-php-array-to-json:#f1eafe;--accent-php-array-to-json:#8b5cf6;--text-php-array-to-json:#1c1730;--muted-php-array-to-json:#6f6a85;--border-php-array-to-json:#e6e1f5;--bg-php-array-to-json:#f8f6fd;--white-php-array-to-json:#fff;--dark-php-array-to-json:#4c1d95;--danger-php-array-to-json:#dc2626;--warn-php-array-to-json:#c2760c;--ok-php-array-to-json:#059669;


/* SECURITY UTILITIES HOME HEADER*/
--primary-lt-header-security-utilities:#cee4da;


/* SECURITY UTILITIES */
--primary-security-utilities:#6366f1;--primary-lt-security-utilities:#eef0fe;--accent-security-utilities:#8b5cf6;--text-security-utilities:#1e1b2e;--muted-security-utilities:#6b6580;--border-security-utilities:#e3e0f5;--bg-security-utilities:#f7f6fd;--white-security-utilities:#fff;--dark-security-utilities:#4338ca;--danger-security-utilities-security-utilities:#dc2626;--warn:#c2760c;--ok-security-utilities:#059669;


/* SPRITE SHEET SPLITTERS */
--primary-sprite-sheet-splitter:#ea580c;--primary-lt-sprite-sheet-splitter:#fff1e8;--accent-sprite-sheet-splitter:#f97316;--text-sprite-sheet-splitter:#241a12;--muted-sprite-sheet-splitter:#78695c;--border-sprite-sheet-splitter:#f0ddce;--bg-sprite-sheet-splitter:#fdf8f4;--white-sprite-sheet-splitter:#fff;--dark-sprite-sheet-splitter:#c2410c;--danger-sprite-sheet-splitter:#dc2626;--warn-sprite-sheet-splitter:#c2760c;--ok-sprite-sheet-splitter:#059669;


/* RESIZE ANIMATED WEBP */
--primary-resize-animated-webp:#2563eb;--primary-lt-resize-animated-webp:#eaf1ff;--accent-resize-animated-webp:#3b82f6;--text-resize-animated-webp:#151b2e;--muted-resize-animated-webp:#66708c;--border-resize-animated-webp:#dfe6f5;--bg-resize-animated-webp:#f6f8fd;--white-resize-animated-webp:#fff;--dark-resize-animated-webp:#1d4ed8;--danger-resize-animated-webp:#dc2626;--warn-resize-animated-webp:#c2760c;--ok-resize-animated-webp:#059669;


/* SHA256 CHECKSUM VERIFIER */
--primary-sha256-checksum-verifier:#2563eb;--primary-lt-sha256-checksum-verifier:#eaf1ff;--accent-sha256-checksum-verifier:#3b82f6;--text-sha256-checksum-verifier:#141c2e;--muted-sha256-checksum-verifier:#64708a;--border-sha256-checksum-verifier:#dde5f5;--bg-sha256-checksum-verifier:#f5f8fd;--white-sha256-checksum-verifier:#fff;--dark-sha256-checksum-verifier:#1d4ed8;--danger-sha256-checksum-verifier:#dc2626;--warn-sha256-checksum-verifier:#c2760c;--ok-sha256-checksum-verifier:#059669;

/* DMARC RECORD GENERATOR */

--primary-dmarc-record-generator:#4f46e5;--primary-lt-dmarc-record-generator:#eef0ff;--accent-dmarc-record-generator:#14b8a6;--text-dmarc-record-generator:#141c2e;--muted-dmarc-record-generator:#64708a;--border-dmarc-record-generator:#dde2f5;--bg-dmarc-record-generator:#f5f6fd;--white-dmarc-record-generator:#fff;--dark-dmarc-record-generator:#4338ca;--danger-dmarc-record-generator:#dc2626;--warn-dmarc-record-generator:#c2760c;--ok-dmarc-record-generator:#059669;

/* LANGCHAIN CONVERTER */
--primary-langchain-converter:#0d9488;--primary-lt-langchain-converter:#e6f7f5;--accent-langchain-converter:#f59e0b;--text-langchain-converter:#12201d;--muted-langchain-converter:#5f7570;--border-langchain-converter:#d9e9e6;--bg-langchain-converter:#f4faf9;--white-langchain-converter:#fff;--dark-langchain-converter:#0f766e;--danger-langchain-converter:#dc2626;--warn-langchain-converter:#c2760c;--ok-langchain-converter:#059669;


/* CLEAN TEXT FOR LLM TRAINING DATA */
--primary-clean-text-for-llm:#7c3aed;--primary-lt-clean-text-for-llm:#f3ecff;--accent-clean-text-for-llm:#06b6d4;--text-clean-text-for-llm:#151a2e;--muted-clean-text-for-llm:#666f8c;--border-clean-text-for-llm:#e1def5;--bg-clean-text-for-llm:#f8f7fd;--white-clean-text-for-llm:#fff;--dark-clean-text-for-llm:#6d28d9;--danger-clean-text-for-llm:#dc2626;--warn-clean-text-for-llm:#c2760c;--ok-clean-text-for-llm:#059669;


/* CLAUDE TOKEN AND COST ESTIMATOR */
--primary-claude-token-cost-estimator:#7c3aed;--primary-lt-claude-token-cost-estimator:#f1eafe;--accent-claude-token-cost-estimator:#0d9488;--accent-lt-claude-token-cost-estimator:#e6f7f5;
  --text-claude-token-cost-estimator:#171523;--muted-claude-token-cost-estimator:#665f7d;--border-claude-token-cost-estimator:#e3daf7;--bg-claude-token-cost-estimator:#f8f6fd;--white-claude-token-cost-estimator:#fff;--dark-claude-token-cost-estimator:#6d28d9;
  --danger-claude-token-cost-estimator:#dc2626;--warn-claude-token-cost-estimator:#c2760c;--ok-claude-token-cost-estimator:#059669;


  /* FBX TO OBJ */
  --primary-fbx-to-obj:#ea580c;--primary-lt-fbx-to-obj:#fef1e8;--accent-fbx-to-obj:#0891b2;--accent-lt-fbx-to-obj:#e6f6f9;
  --text-fbx-to-obj:#211a14;--muted-fbx-to-obj:#7a6a5c;--border-fbx-to-obj:#f0ddc9;--bg-fbx-to-obj:#fdf8f3;--white-fbx-to-obj:#fff;--dark-fbx-to-obj:#c2410c;
  --danger-fbx-to-obj:#dc2626;--warn-fbx-to-obj:#c2760c;--ok-fbx-to-obj:#059669;

/* BASE 64 IMAGE TOOL KIT */
--primary-base64-image:#0d9488;--primary-lt-base64-image:#f0fdfa;--accent-base64-image:#14b8a6;--text-base64-image:#111827;--muted-base64-image:#6b7280;--border-base64-image:#e5e7eb;--bg-base64-image:#f9fafb;--white-base64-image:#fff;--dark-base64-image:#0f766e;--danger-base64-image:#dc2626;--good-base64-image:#059669;

/* JWT TOOLKIT */
--primary-jwt-toolkit:#7c3aed;--primary-lt-jwt-toolkit:#f5f3ff;--accent-jwt-toolkit:#8b5cf6;--text-jwt-toolkit:#111827;--muted-jwt-toolkit:#6b7280;--border-jwt-toolkit:#e5e7eb;--bg-jwt-toolkit:#f9fafb;--white-jwt-toolkit:#fff;--dark-jwt-toolkit:#5b21b6;--danger-jwt-toolkit:#dc2626;--good-jwt-toolkit:#059669;

/* DATA CONVERSION TOOL */
--primary-data-conversion-tool:#d97706;--primary-lt-data-conversion-tool:#fffbeb;--accent-data-conversion-tool:#f59e0b;--text-data-conversion-tool:#111827;--muted-data-conversion-tool:#6b7280;--border-data-conversion-tool:#e5e7eb;--bg-data-conversion-tool:#f9fafb;--white-data-conversion-tool:#fff;--dark-data-conversion-tool:#92400e;--danger-data-conversion-tool:#dc2626;--good-data-conversion-tool:#059669;
 --warning-data-conversion-tool:    #efd7ff;
 --warning-lt-data-conversion-tool: #efd7ff;


 /* DUMMY CREDIT CARD GENERATOR */
 --primary-dummy-credit-card:#4338ca;
  --primary-dark-dummy-credit-card:#3730a3;
  --primary-light-dummy-credit-card:#e0e7ff;
  --accent-dummy-credit-card:#f59e0b;
  --muted-dummy-credit-card:#5b6472;
  --good-dummy-credit-card:#16a34a;
  --danger-dummy-credit-card:#dc2626;
  --bg-dummy-credit-card:#f5f6fa;
  --card-bg-dummy-credit-card:#ffffff;
  --card-border-dummy-credit-card:#e3e6ef;
  --text-dummy-credit-card:#1f2937;
  --input-bg-dummy-credit-card:#ffffff;


  /* POSTMAN TO CURL CONVERTER */
  --primary-postman-to-curl:#4f46e5;--primary-lt-postman-to-curl:#eef0fd;--accent-postman-to-curl:#7c3aed;--text-postman-to-curl:#1c1b29;--muted-postman-to-curl:#6b6a7c;--border-postman-to-curl:#e4e3f0;--bg-postman-to-curl:#f7f7fc;--white-postman-to-curl:#fff;--dark-postman-to-curl:#3730a3;--danger-postman-to-curl:#dc2626;--warn-postman-to-curl:#c2760c;--ok-postman-to-curl:#059669;

/* CSS NEON GLOW TEXT GENERATOR */
--primary-css-neon-glow-text-generator:#ec4899;--primary-lt-css-neon-glow-text-generator:#fce7f5;--accent-css-neon-glow-text-generator:#22d3ee;--text-css-neon-glow-text-generator:#221826;--muted-css-neon-glow-text-generator:#7a7086;--border-css-neon-glow-text-generator:#ece2f0;--bg-css-neon-glow-text-generator:#faf8fc;--white-css-neon-glow-text-generator:#fff;--dark-css-neon-glow-text-generator:#a3186f;--danger-css-neon-glow-text-generator:#dc2626;--warn-css-neon-glow-text-generator:#c2760c;--ok-css-neon-glow-text-generator:#059669;

/* PDF TOOLS */
--primary-pdf-tools:#4f46e5;
--primary-dk-pdf-tools:#3730a3;
--primary-lt-pdf-tools:#eef2ff;
--border-pdf-tools:#e2e8f0;
--muted-pdf-tools:#64748b;
--text-pdf-tools:#1e293b;
--bg-pdf-tools:#f8fafc;
--success-pdf-tools:#16a34a;
--success-lt-pdf-tools:#f0fdf4;
--danger-pdf-tools:#dc2626;
--danger-lt-pdf-tools:#fef2f2;
--info-lt-pdf-tools:#eff6ff;
--info-tx-pdf-tools:#1d4ed8;
--amber-pdf-tools:#b45309;
--amber-lt-pdf-tools:#fffbeb;


}

/* DARK THEMEN FOR OCR TOOL */
html[data-theme="dark"]{
  --ink-ocr-tool:#eef1f7;
  --ink-soft-ocr-tool:#c2cae0;
  --paper-ocr-tool:#0f172a;
  --panel-ocr-tool:#182338;
  --border-ocr-tool:#2b3653;
  --muted-ocr-tool:#8b96b3;
  --accent-ocr-tool:#ffc94d;
  --accent-deep-ocr-tool:#ffb703;
  --teal-ocr-tool:#2dd4c2;
  --teal-soft-ocr-tool:#12332f;
  --danger-ocr-tool:#ff6b6f;
  --danger-soft-ocr-tool:#3a1c1f;
  --warn-ocr-tool:#f4a53a;
  --warn-soft-ocr-tool:#3a2c11;
  --shadow-ocr-tool:0 1px 2px rgba(0,0,0,.3), 0 12px 32px -14px rgba(0,0,0,.6);
}

* { box-sizing: border-box; }

body {
  font-family: 'Plus Jakarta Sans', sans-serif;
  background: var(--bg);
  color: var(--text);
  font-size: 15px;
  line-height: 1.6;
}

/* ── SKIP NAV (accessibility + SEO) ── */
.skip-nav {
  position: absolute;
  top: -100px;
  left: 0;
  background: var(--primary);
  color: #fff;
  padding: 8px 16px;
  z-index: 9999;
  transition: top .2s;
}
.skip-nav:focus { top: 0; }

/* ═══════════════════════════════════
   NAVBAR
═══════════════════════════════════ */
.navbar {
  background: var(--white) !important;
  border-bottom: 1px solid var(--border);
  min-height: var(--nav-h);
  padding: 0;
}

.navbar-brand {
  font-weight: 800;
  font-size: 18px;
  color: var(--primary) !important;
  letter-spacing: -0.02em;
  display: flex;
  align-items: center;
  gap: 8px;
}

.brand-icon {
  width: 30px; height: 30px;
  background: var(--primary);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
}

.nav-link {
  color: var(--muted) !important;
  font-weight: 500;
  font-size: 14px;
  padding: 8px 12px !important;
  border-radius: 6px;
  display: flex; align-items: center; gap: 5px;
  transition: background .12s, color .12s;
}
.nav-link:hover, .nav-link.show {
  color: var(--primary) !important;
  background: var(--primary-lt);
}
.nav-link .bi-chevron-down { font-size: 10px; transition: transform .2s; }
.nav-link.show .bi-chevron-down { transform: rotate(180deg); }

/* Dropdown */
.dropdown-menu {
  border: 1px solid var(--border) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.08) !important;
  padding: 8px !important;
  min-width: 200px;
  margin-top: 4px !important;
}
.dropdown-item {
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--muted);
  padding: 8px 12px;
  display: flex; align-items: center; gap: 9px;
  transition: background .1s, color .1s;
}
.dropdown-item:hover {
  background: var(--primary-lt);
  color: var(--primary);
}
.dropdown-item i { font-size: 14px; width: 16px; text-align: center; }

.nav-badge {
  font-size: 10px;
  font-weight: 700;
  background: var(--primary);
  color: #fff;
  padding: 1px 6px;
  border-radius: 999px;
  margin-left: 2px;
}

/* ═══════════════════════════════════
   AD SLOT STYLES
   AdSense requires visible, clearly
   labeled ad containers
═══════════════════════════════════ */
.ad-slot {
  background: #f0f4ff;
  border: 1px dashed #b0bdf7;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #9ca3af;
  font-size: 12px;
  overflow: hidden;
  position: relative;
}
.ad-slot::before {
  content: 'Advertisement';
  position: absolute;
  top: 6px; left: 50%;
  transform: translateX(-50%);
  font-size: 10px;
  color: #9ca3af;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.ad-slot-leaderboard { width: 100%; height: 90px; }
.ad-slot-rectangle   { width: 100%; height: 250px; }
.ad-slot-sidebar     { width: 100%; height: 600px; }
.ad-slot-banner      { width: 100%; height: 60px; }

/* Replace .ad-slot background with the actual adsbygoogle tag after approval */

/* ═══════════════════════════════════
   HERO
═══════════════════════════════════ */
.hero {
  background: linear-gradient(135deg, #1a56db 0%, #1e40af 100%);
  color: #fff;
  padding: 64px 0 56px;
  position: relative;
  overflow: hidden;
}
.hero::before {
  content: '';
  position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.hero h1 {
  font-size: clamp(28px, 4vw, 46px);
  font-weight: 800;
  letter-spacing: -0.03em;
  line-height: 1.15;
}
.hero p {
  font-size: 16px;
  opacity: .85;
  max-width: 520px;
  line-height: 1.7;
}
.hero-search {
  display: flex;
  max-width: 460px;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 10px;
  overflow: hidden;
}
.hero-search input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #fff;
  font-size: 14px;
  padding: 11px 16px;
  font-family: inherit;
}
.hero-search input::placeholder { color: rgba(255,255,255,.6); }
.hero-search button {
  background: #fff;
  border: none;
  color: var(--primary);
  font-size: 14px;
  font-weight: 700;
  padding: 0 20px;
  cursor: pointer;
  font-family: inherit;
}
.hero-stats {
  display: flex;
  gap: 32px;
  margin-top: 32px;
}
.hero-stat-val {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
.hero-stat-label {
  font-size: 12px;
  opacity: .7;
  margin-top: 2px;
}

/* ═══════════════════════════════════
   SECTION TITLES
═══════════════════════════════════ */
.section-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--primary);
  margin-bottom: 6px;
}
.section-title {
  font-size: clamp(22px, 3vw, 30px);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text);
  margin-bottom: 6px;
}
.section-sub {
  font-size: 15px;
  color: var(--muted);
}

/* ═══════════════════════════════════
   CALCULATOR CARDS
═══════════════════════════════════ */
.calc-card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 20px;
  text-decoration: none;
  display: block;
  transition: transform .15s, box-shadow .15s, border-color .15s;
  height: 100%;
}
.calc-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
  border-color: #c7d7ff;
  text-decoration: none;
}
.calc-icon {
  width: 44px; height: 44px;
  border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
  margin-bottom: 14px;
}
.calc-card h3 {
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
  margin-bottom: 4px;
}
.calc-card p {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 12px;
  line-height: 1.5;
}
.calc-tag {
  font-size: 11px;
  font-weight: 600;
  padding: 3px 8px;
  border-radius: 999px;
}

/* Category colors */
.cat-finance .calc-icon { background: var(--primary-lt); }
.cat-finance .calc-tag  { background: var(--primary-lt); color: var(--primary); }
.cat-health  .calc-icon { background: var(--success-lt); }
.cat-health  .calc-tag  { background: var(--success-lt); color: var(--success); }
.cat-tools   .calc-icon { background: #f3f0ff; }
.cat-tools   .calc-tag  { background: #f3f0ff; color: #5b21b6; }
.cat-image   .calc-icon { background: var(--warning-lt); }
.cat-image   .calc-tag  { background: var(--warning-lt); color: var(--warning); }
.cat-pdf   .calc-icon { background: var(--danger-lt); }
.cat-pdf   .calc-tag  { background: var(--danger-lt); color: var(--danger); }
.cat-date-time   .calc-icon { background: var(--primary-lt); }
.cat-date-time   .calc-tag  { background: var(--primary-lt); color: var(--primary); }
.cat-entertainment   .calc-icon { background: var(--primary-lt-entertainment); }
.cat-entertainment   .calc-tag  { background: var(--primary-lt-entertainment); color:#333; }

.cat-text-tools   .calc-icon { background: var(--primary-lt-text-tools); }
.cat-text-tools   .calc-tag  { background: var(--primary-lt-text-tools); color:#333; }
.cat-header-text-tools{ background: var(--primary-lt-text-tools); border-color: #ebf0ff;; }
/* .calc-card-css-tool{background:var(--white-);border:1px solid var(--border-love);border-radius:16px;padding:28px;margin-bottom:20px;} */


.cat-css-tool  .calc-icon { background: var(--primary-lt-css-tool); }
.cat-css-tool  .calc-tag  { background: var(--primary-lt-css-tool); color:#333; }
.cat-header-css-tool{ background: var(--primary-lt-css-tool); border-color: #ebf0ff;; }
.calc-card-css-tool{background:var(--white-love);border:1px solid var(--border-love);border-radius:16px;padding:28px;margin-bottom:20px;}


.cloud-tools-heading { background: var(--primary-lt-cloud-tools); }
.cat-header-cloud-tools   .calc-icon { background: var(--primary-lt-cloud-tools); }
.cat-header-cloud-tools { background: var(--primary-lt-cloud-tools); }
.cat-cloud-tools  .calc-tag  { background: var(--primary-lt-cloud-tools); color:#333; }
.cat-cloud-tools  .calc-icon  { background: var(--primary-lt-cloud-tools); color:#333; }

.cat-header-data-formatter-converter  { background: var(--primary-lt-header-data-formatter-converter); }
.cat-data-formatter-converter   .calc-icon { background: var(--primary-lt-header-data-formatter-converter); }
.cat-data-formatter-converter   .calc-tag  { background: var(--primary-lt-header-data-formatter-converter); color:#333; }

/*  */
.cat-header-security-utilities  { background: var(--primary-lt-header-security-utilities); }
.cat-security-utilities   .calc-icon { background: var(--primary-lt-header-security-utilities); }
.cat-security-utilities   .calc-tag  { background: var(--primary-lt-header-security-utilities); color:#333; }

/* DATA CONVERSTION TOOLS */

.cat-data-converstion-tool   .calc-icon { background: var(--warning-lt-data-conversion-tool); }
.cat-data-converstion-tool   .calc-tag  { background: var(--warning-lt-data-conversion-tool); color: var(--text); }
.cat-header-data-converstion-tool   { background: var(--warning-lt-data-conversion-tool); border-color: #fcd34d; }


/* ═══════════════════════════════════
   POPULAR / TRENDING BADGE
═══════════════════════════════════ */
.hot-badge {
  font-size: 10px;
  font-weight: 700;
  background: #dc2626;
  color: #fff;
  padding: 2px 7px;
  border-radius: 999px;
  margin-left: 6px;
  vertical-align: middle;
}

/* ═══════════════════════════════════
   CATEGORY HEADER CARDS
═══════════════════════════════════ */
.cat-header {
  border-radius: 14px;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid transparent;
  margin-bottom: 20px;
}
.cat-header-finance { background: var(--primary-lt); border-color: #c7d7ff; }
.cat-header-health  { background: var(--success-lt); border-color: #a7f3d0; }
.cat-header-tools   { background: #f3f0ff; border-color: #ddd6fe; }
.cat-header-image   { background: var(--warning-lt); border-color: #fcd34d; }
.cat-header-pdf   { background: var(--danger-lt); border-color: #fde8e8; }
.cat-header-date-time   { background: var(--primary-lt); border-color: #ebf0ff;; }

.cat-header-icon {
  width: 46px; height: 46px;
  border-radius: 12px;
  background: var(--white);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
  box-shadow: 0 2px 8px rgba(0,0,0,.08);
}
.cat-header h2 {
  font-size: 16px;
  font-weight: 800;
  margin: 0 0 2px;
  letter-spacing: -0.01em;
}
.cat-header p { font-size: 12px; color: var(--muted); margin: 0; }

/* ═══════════════════════════════════
   CONTENT / ABOUT SECTION (SEO)
   Google requires real, helpful content
   for AdSense approval
═══════════════════════════════════ */
.content-section {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 32px;
}
.content-section h2 {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.02em;
  margin-bottom: 12px;
}
.content-section p {
  color: var(--muted);
  font-size: 14px;
  line-height: 1.8;
  margin-bottom: 16px;
}
.content-section h3 {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 8px;
  margin-top: 24px;
}

/* ═══════════════════════════════════
   FAQ (Structured data helps SEO)
═══════════════════════════════════ */
.faq-item {
  border-bottom: 1px solid var(--border);
  padding: 14px 0;
}
.faq-item:last-child { border-bottom: none; }
.faq-q {
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.faq-a {
  font-size: 13.5px;
  color: var(--muted);
  line-height: 1.7;
  padding-top: 8px;
  display: none;
}
.faq-item.open .faq-a { display: block; }
.faq-item.open .faq-icon { transform: rotate(45deg); }
.faq-icon { transition: transform .2s; font-size: 18px; color: var(--muted); }

/* ═══════════════════════════════════
   SIDEBAR
═══════════════════════════════════ */
.sidebar-widget {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 20px;
  margin-bottom: 20px;
}
.sidebar-widget h4 {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 14px;
  color: var(--text);
}
.sidebar-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid var(--border);
  text-decoration: none;
  color: var(--muted);
  font-size: 13px;
  font-weight: 500;
  transition: color .12s;
}
.sidebar-link:last-child { border-bottom: none; }
.sidebar-link:hover { color: var(--primary); }
.sidebar-link i { font-size: 14px; color: var(--primary); width: 16px; }

/* ═══════════════════════════════════
   FOOTER
═══════════════════════════════════ */
footer {
  background: var(--white);
  border-top: 1px solid var(--border);
  padding: 48px 0 24px;
  margin-top: 64px;
}
.footer-brand {
  font-weight: 800;
  font-size: 17px;
  color: var(--primary);
  letter-spacing: -0.02em;
  margin-bottom: 10px;
}
.footer-desc {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.7;
  max-width: 280px;
}
.footer-col h5 {
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--text);
  margin-bottom: 14px;
}
.footer-link {
  display: block;
  font-size: 13px;
  color: var(--muted);
  text-decoration: none;
  padding: 4px 0;
  transition: color .12s;
}
.footer-link:hover { color: var(--primary); }
.footer-bottom {
  border-top: 1px solid var(--border);
  padding-top: 20px;
  margin-top: 32px;
  font-size: 12px;
  color: var(--muted);
}

/* ═══════════════════════════════════
   BREADCRUMB (SEO signal)
═══════════════════════════════════ */
.breadcrumb-item a { color: var(--primary); text-decoration: none; }
.breadcrumb-item.active { color: var(--muted); }
.breadcrumb-item + .breadcrumb-item::before { color: var(--muted); }

/* ═══════════════════════════════════
   RESPONSIVE TWEAKS
═══════════════════════════════════ */
@media (max-width: 768px) {
  .hero { padding: 40px 0; }
  .hero-stats { gap: 20px; }
  .ad-slot-sidebar { height: 250px; }
}

/* EMI PAGE */
.navbar { background:var(--white)!important; border-bottom:1px solid var(--border); }
  .navbar-brand { font-weight:800; font-size:18px; color:var(--primary)!important; }
  .nav-link { color:var(--muted)!important; font-weight:500; font-size:14px; }
  .nav-link:hover { color:var(--primary)!important; }
  .page-hero-emi { background:linear-gradient(135deg,#1a56db 0%,#1e40af 100%); color:#fff; padding:40px 0 32px; }
  .page-hero-emi h1 { font-size:clamp(22px,3vw,34px); font-weight:800; letter-spacing:-0.03em; }
  .page-hero-emi p { font-size:15px; opacity:.85; }
  .breadcrumb-item a { color:rgba(255,255,255,.8); text-decoration:none; }
  .breadcrumb-item.active { color:rgba(255,255,255,.6); }
  .breadcrumb-item+.breadcrumb-item::before { color:rgba(255,255,255,.4); }
  .calc-emi-card { background:var(--white); border:1px solid var(--border); border-radius:16px; padding:28px; }
  .result-box-emi { background:linear-gradient(135deg,#1a56db,#1e40af); color:#fff; border-radius:14px; padding:24px; }
  .result-val { font-size:32px; font-weight:800; letter-spacing:-0.03em; }
  .result-label { font-size:12px; opacity:.75; margin-top:2px; }
  .result-mini { background:rgba(255,255,255,.12); border-radius:10px; padding:14px; text-align:center; }
  .result-mini-val { font-size:18px; font-weight:800; }
  .result-mini-label { font-size:11px; opacity:.75; margin-top:2px; }
  .form-label { font-size:13px; font-weight:700; color:var(--text); margin-bottom:6px; }
  .form-control, .form-select {
    border:1.5px solid var(--border); border-radius:10px; font-size:14px; font-weight:600;
    padding:10px 14px; font-family:inherit; transition:border-color .15s;
  }
  .form-control:focus, .form-select:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(26,86,219,.1); outline:none; }
  .input-group-text { background:var(--bg); border:1.5px solid var(--border); border-radius:10px; font-size:13px; font-weight:700; color:var(--muted); }
  .range-slider-emi { width:100%; accent-color:var(--primary); }
  .btn-calc { background:var(--primary); color:#fff; border:none; border-radius:10px; padding:12px 28px; font-weight:700; font-size:15px; width:100%; font-family:inherit; cursor:pointer; transition:opacity .15s; }
  .btn-calc:hover { opacity:.9; }
  .loan-type-btn { border:1.5px solid var(--border); border-radius:10px; padding:10px 16px; font-size:13px; font-weight:700; cursor:pointer; background:var(--white); color:var(--muted); transition:all .15s; display:flex; align-items:center; gap:7px; }
  .loan-type-btn.active { border-color:var(--primary); background:var(--primary-lt); color:var(--primary); }
  .amort-table { font-size:13px; }
  .amort-table thead th { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--muted); background:var(--bg); border:none; padding:10px 12px; }
  .amort-table tbody td { padding:10px 12px; border-bottom:1px solid var(--border); vertical-align:middle; }
  .amort-table tbody tr:last-child td { border-bottom:none; }
  .progress-bar-emi { height:8px; border-radius:999px; background:var(--border); overflow:hidden; }
  .progress-bar-emi-fill { height:100%; border-radius:999px; background:var(--primary); transition:width .5s; }
  .section-title { font-size:20px; font-weight:800; letter-spacing:-0.02em; margin-bottom:8px; }
  .content-block { background:var(--white); border:1px solid var(--border); border-radius:14px; padding:28px; margin-bottom:20px; }
  .content-block h2 { font-size:20px; font-weight:800; letter-spacing:-0.02em; margin-bottom:10px; }
  .content-block h3 { font-size:16px; font-weight:700; margin:20px 0 8px; }
  .content-block p { color:var(--muted); font-size:14px; line-height:1.8; margin-bottom:12px; }
  .formula-box { background:var(--primary-lt); border:1px solid #c7d7ff; border-radius:10px; padding:16px 20px; font-family:monospace; font-size:14px; color:var(--primary); margin:16px 0; letter-spacing:0.02em; }
  .faq-item { border-bottom:1px solid var(--border); padding:14px 0; }
  .faq-item:last-child { border-bottom:none; }
  .faq-q { font-size:14px; font-weight:700; cursor:pointer; display:flex; justify-content:space-between; align-items:center; }
  .faq-a { font-size:13.5px; color:var(--muted); line-height:1.7; padding-top:8px; display:none; }
  .faq-item.open .faq-a { display:block; }
  .faq-item.open .faq-icon { transform:rotate(45deg); }
  .faq-icon { transition:transform .2s; font-size:18px; color:var(--muted); }
  .sidebar-widget { background:var(--white); border:1px solid var(--border); border-radius:14px; padding:20px; margin-bottom:20px; }
  .sidebar-widget h4 { font-size:14px; font-weight:700; margin-bottom:14px; }
  .sidebar-link { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--border); text-decoration:none; color:var(--muted); font-size:13px; font-weight:500; transition:color .12s; }
  .sidebar-link:last-child { border-bottom:none; }
  .sidebar-link:hover { color:var(--primary); }
  .sidebar-link i { color:var(--primary); width:16px; }
  .ad-slot { background:#f0f4ff; border:1px dashed #b0bdf7; border-radius:8px; display:flex; align-items:center; justify-content:center; color:#9ca3af; font-size:12px; position:relative; }
  .ad-slot::before { content:'Advertisement'; position:absolute; top:6px; left:50%; transform:translateX(-50%); font-size:10px; color:#9ca3af; letter-spacing:.06em; text-transform:uppercase; }
  .ad-slot-rectangle { width:100%; height:250px; }
  .ad-slot-leaderboard { width:100%; height:90px; }
  .example-card { background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:16px; }
  .example-card h5 { font-size:13px; font-weight:700; margin-bottom:8px; }
  .example-row { display:flex; justify-content:space-between; font-size:13px; padding:4px 0; border-bottom:1px solid var(--border); color:var(--muted); }
  .example-row:last-child { border-bottom:none; }
  .example-row strong { color:var(--text); }
  footer { background:var(--white); border-top:1px solid var(--border); padding:32px 0 20px; margin-top:56px; }
  .footer-bottom { border-top:1px solid var(--border); padding-top:16px; margin-top:24px; font-size:12px; color:var(--muted); }
  .footer-link { display:block; font-size:13px; color:var(--muted); text-decoration:none; padding:3px 0; }
  .footer-link:hover { color:var(--primary); }
  .tag-badge { font-size:11px; font-weight:600; padding:3px 9px; border-radius:999px; background:var(--primary-lt); color:var(--primary); }

  /* SIP PAGE */
  .page-hero-sip { background:linear-gradient(135deg,#057a55 0%,#065f46 100%);color:#fff;padding:40px 0 32px;} 
  .page-hero-sip h1 { font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em; }
  .page-hero-sip p { font-size:15px; opacity:.85; }
  .result-box-sip { background:linear-gradient(135deg,#057a55,#065f46); color:#fff; border-radius:14px; padding:24px; }
  .calc-sip-card { background:var(--white-sip); border:1px solid var(--border-sip); border-radius:16px; padding:28px; }
  .preset-btn:hover,.preset-btn.active{border-color:var(--primary-sip);background:var(--primary-sip-lt);color:var(--primary-sip);}
  .preset-btn{border:1.5px solid var(--border-sip);border-radius:8px;padding:6px 14px;font-size:12px;font-weight:700;cursor:pointer;background:var(--white-sip);color:var(--muted-sip);transition:all .15s;}
  .range-slider-sip { width:100%; accent-color:var(--primary-sip); }
  .formula-box-sip { background:var(--primary-sip-lt); border:1px solid #c7d7ff; border-radius:10px; padding:16px 20px; font-family:monospace; font-size:14px; color:var(--primary-sip); margin:16px 0; letter-spacing:0.02em; }
  .comparison-card{background:var(--bg-sip);border:1px solid var(--border-sip);border-radius:10px;padding:16px;text-align:center;}
  .comparison-card .val{font-size:20px;font-weight:800;color:var(--primary-sip);}
  .comparison-card .label{font-size:12px;color:var(--muted-sip);margin-top:4px;}
  .tag-green{font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--primary-sip-lt);color:var(--primary-sip);}

  /* BMI */
  .bmi-meter-wrap{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:24px;}
  .bmi-score{font-size:64px;font-weight:800;letter-spacing:-0.04em;text-align:center;margin:8px 0;}
  .bmi-category{font-size:18px;font-weight:700;text-align:center;margin-bottom:16px;}
  .bmi-bar-track{height:16px;border-radius:999px;background:linear-gradient(to right,#3b82f6 0%,#22c55e 25%,#f59e0b 50%,#ef4444 75%,#dc2626 100%);position:relative;margin:8px 0 20px;}
  .bmi-needle{position:absolute;top:-6px;width:4px;height:28px;background:var(--text);border-radius:2px;transform:translateX(-50%);transition:left .5s;}
  .bmi-labels{display:flex;justify-content:space-between;font-size:11px;color:var(--muted);font-weight:600;margin-top:4px;}
  .bmi-ranges{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;}
  .bmi-range-item{border-radius:10px;padding:10px 14px;font-size:12px;}
  .page-hero-bmi { background:linear-gradient(135deg,#7c3aed 0%,#5b21b6 100%);color:#fff;padding:40px 0 32px;} 
  .page-hero-bmi h1 {font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
  .page-hero-bmi p { font-size:15px; opacity:.85; }
  .calc-bmi-card { background:var(--white-bmi); border:1px solid var(--border-bmi); border-radius:16px; padding:28px; }
  .preset-btn:hover,.preset-btn.active{border-color:var(--primary-bmi);background:var(--primary-bmi-lt);color:var(--primary-bmi);}
  .preset-btn{border:1.5px solid var(--border-bmi);border-radius:8px;padding:6px 14px;font-size:12px;font-weight:700;cursor:pointer;background:var(--white-bmi);color:var(--muted-bmi);transition:all .15s;}
  .range-slider-bmi { width:100%; accent-color:var(--primary-bmi); }
  .formula-box { background:var(--primary-bmi-lt); border:1px solid #c7d7ff; border-radius:10px; padding:16px 20px; font-family:monospace; font-size:14px; color:var(--primary-bmi); margin:16px 0; letter-spacing:0.02em; }
  .unit-btn{border:1.5px solid var(--border-bmi);border-radius:8px;padding:8px 20px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white-bmi);color:var(--muted-bmi);transition:all .15s;}
  .unit-btn.active{border-color:var(--primary-bmi);background:var(--primary-bmi-lt);color:var(--primary-bmi);}
  .range-underweight{background:#eff6ff;border:1px solid #bfdbfe;}
  .range-normal{background:#f0fdf4;border:1px solid #bbf7d0;}
  .range-overweight{background:#fffbeb;border:1px solid #fde68a;}
  .range-obese{background:#fef2f2;border:1px solid #fecaca;}
  .health-tip{background:var(--primary-bmi-lt);border:1px solid #ddd6fe;border-radius:10px;padding:14px 16px;font-size:13px;color:#5b21b6;margin-top:16px;}
  .metric-card{background:var(--bg-bmi);border:1px solid var(--border-bmi);border-radius:10px;padding:16px;text-align:center;}
  .metric-val{font-size:20px;font-weight:800;color:var(--primary-bmi);}
  .metric-label{font-size:12px;color:var(--muted-bmi);margin-top:4px;}
  .bmi-table{font-size:13px;border-radius:10px;overflow:hidden;border:1px solid var(--border);}
  .bmi-table th{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--bg);border:none;padding:10px 14px;}
  .bmi-table td{padding:10px 14px;border-bottom:1px solid var(--border);}
  .bmi-table tr:last-child td{border-bottom:none;}



  /* Image Converter */

 
  .calc-image-converter-card{background:var(--white-image-converter);border:1px solid var(--border-image-converter);border-radius:16px;padding:28px;}
    /* Drop zone */
    .drop-zone{border:2.5px dashed #fcd34d;border-radius:16px;background:#fffbeb;padding:48px 24px;text-align:center;cursor:pointer;transition:all .2s;position:relative;}
    .drop-zone:hover,.drop-zone.drag-over{background:#fef3c7;border-color:var(--accent-image-converter-image-converter);}
    .drop-zone input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
    .drop-icon{font-size:48px;margin-bottom:12px;}
    .drop-title{font-size:16px;font-weight:700;color:var(--text-image-converter);margin-bottom:6px;}
    .drop-sub{font-size:13px;color:var(--muted-image-converter-image-converter);}
    /* Format buttons */
    .fmt-btn{border:1.5px solid var(--border-image-converter);border-radius:10px;padding:10px 16px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white-image-converter);color:var(--muted-image-converter);transition:all .15s;min-width:80px;text-align:center;}
    .fmt-btn:hover{border-color:var(--accent-image-converter-image-converter);color:var(--primary-image-converter-image-converter);}
    .fmt-btn.active{border-color:var(--accent-image-converter);background:var(--primary-image-converter-lt);color:var(--primary-image-converter);}
    /* Preview area */
    .preview-area{background:var(--bg-image-converter);border:1px solid var(--border-image-converter);border-radius:12px;padding:16px;min-height:200px;display:flex;align-items:center;justify-content:center;}
    .preview-img{max-width:100%;max-height:300px;border-radius:8px;object-fit:contain;}
    .file-info{background:var(--primary-image-converter-lt);border:1px solid #fcd34d;border-radius:10px;padding:14px 16px;font-size:13px;}
    .info-row{display:flex;justify-content:space-between;padding:3px 0;}
    .info-row:not(:last-child){border-bottom:1px solid #fde68a;}
    /* Quality slider */
    .quality-slider{accent-color:var(--accent-image-converter);width:100%;}
    /* Convert button */
    .btn-convert{background:var(--primary-image-converter);color:#fff;border:none;border-radius:10px;padding:13px 32px;font-weight:700;font-size:15px;cursor:pointer;font-family:inherit;transition:opacity .15s;display:inline-flex;align-items:center;gap:8px;}
    .btn-convert:hover{opacity:.9;}
    .btn-convert:disabled{opacity:.5;cursor:not-allowed;}
    /* Download button */
    .btn-download{background:#22c55e;color:#fff;border:none;border-radius:10px;padding:13px 32px;font-weight:700;font-size:15px;cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;gap:8px;text-decoration:none;}
    .btn-download:hover{opacity:.9;color:#fff;}
    /* Status */
    .status-badge{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:6px 14px;border-radius:999px;}
    .status-success{background:#f0fdf4;color:#22c55e;border:1px solid #bbf7d0;}
    .status-error{background:#fef2f2;color:#ef4444;border:1px solid #fecaca;}
    .status-processing{background:#eff6ff;color:#3b82f6;border:1px solid #bfdbfe;}
    /* Format cards (supported formats section) */
    .format-card{background:var(--white);border:1px solid var(--border-image-converter);border-radius:10px;padding:16px;text-align:center;}
    .format-card .fmt-name{font-size:16px;font-weight:800;color:var(--primary-image-converter);margin-bottom:4px;}
    .format-card p{font-size:12px;color:var(--muted-image-converter);margin:0;line-height:1.5;}
    .section-title{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:8px;}
    .content-block{background:var(--white);border:1px solid var(--border-image-converter);border-radius:14px;padding:28px;margin-bottom:20px;}
    .content-block h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
    .content-block h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
    .content-block p{color:var(--muted-image-converter);font-size:14px;line-height:1.8;margin-bottom:12px;}
    .faq-item{border-bottom:1px solid var(--border-image-converter);padding:14px 0;}
    .faq-item:last-child{border-bottom:none;}
    .faq-q{font-size:14px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
    .faq-a{font-size:13.5px;color:var(--muted-image-converter);line-height:1.7;padding-top:8px;display:none;}
    .faq-item.open .faq-a{display:block;}
    .faq-item.open .faq-icon{transform:rotate(45deg);}
    .faq-icon{transition:transform .2s;font-size:18px;color:var(--muted-image-converter);}
    .sidebar-widget{background:var(--white);border:1px solid var(--border-image-converter);border-radius:14px;padding:20px;margin-bottom:20px;}
    .sidebar-widget h4{font-size:14px;font-weight:700;margin-bottom:14px;}
    .sidebar-link{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-image-converter);text-decoration:none;color:var(--muted-image-converter);font-size:13px;font-weight:500;transition:color .12s;}
    .sidebar-link:last-child{border-bottom:none;}
    .sidebar-link:hover{color:#1a56db;}
    .sidebar-link i{color:#1a56db;width:16px;}
    .ad-slot{background:#fffbeb;border:1px dashed #fcd34d;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#9ca3af;font-size:12px;position:relative;}
    .ad-slot::before{content:'Advertisement';position:absolute;top:6px;left:50%;transform:translateX(-50%);font-size:10px;color:#9ca3af;letter-spacing:.06em;text-transform:uppercase;}
    .ad-slot-rectangle{width:100%;height:250px;}
    .ad-slot-leaderboard{width:100%;height:90px;}
    .privacy-note{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:10px;padding:12px 16px;font-size:13px;color:#057a55;display:flex;align-items:center;gap:8px;}
    .page-hero-image-converter{background:linear-gradient(135deg,#b45309 0%,#92400e 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-image-converter h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    #convertedResult{display:none;}


    /* GST */
    /* ── CALC HERO STRIP ── */
    /* ── SKIP NAV ── */
    .skip-nav {
      position: absolute; top: -100px; left: 0;
      background: var(--primary); color: #fff;
      padding: 8px 16px; z-index: 9999; transition: top .2s;
    }
    .skip-nav:focus { top: 0; }

    /* ── NAVBAR ── */
    .navbar {
      background: var(--white) !important;
      border-bottom: 1px solid var(--border);
      min-height: var(--nav-h); padding: 0;
    }
    .navbar-brand {
      font-weight: 800; font-size: 18px;
      color: var(--primary) !important;
      letter-spacing: -0.02em;
      display: flex; align-items: center; gap: 8px;
    }
    .brand-icon {
      width: 30px; height: 30px; background: var(--primary);
      border-radius: 8px; display: flex; align-items: center; justify-content: center;
    }
    .nav-link {
      color: var(--muted) !important; font-weight: 500; font-size: 14px;
      padding: 8px 12px !important; border-radius: 6px;
      display: flex; align-items: center; gap: 5px;
      transition: background .12s, color .12s;
    }
    .nav-link:hover, .nav-link.show { color: var(--primary) !important; background: var(--primary-lt); }
    .nav-link .bi-chevron-down { font-size: 10px; transition: transform .2s; }
    .nav-link.show .bi-chevron-down { transform: rotate(180deg); }
    .dropdown-menu {
      border: 1px solid var(--border) !important; border-radius: 12px !important;
      box-shadow: 0 8px 24px rgba(0,0,0,.08) !important;
      padding: 8px !important; min-width: 200px; margin-top: 4px !important;
    }
    .dropdown-item {
      border-radius: 8px; font-size: 13.5px; font-weight: 500;
      color: var(--muted); padding: 8px 12px;
      display: flex; align-items: center; gap: 9px;
      transition: background .1s, color .1s;
    }
    .dropdown-item:hover { background: var(--primary-lt); color: var(--primary); }
    .dropdown-item i { font-size: 14px; width: 16px; text-align: center; }

    /* ── AD SLOTS ── */
    .ad-slot {
      background: #f0f4ff; border: 1px dashed #b0bdf7;
      border-radius: 8px; display: flex;
      align-items: center; justify-content: center;
      text-align: center; color: #9ca3af;
      font-size: 12px; overflow: hidden; position: relative;
    }
    .ad-slot::before {
      content: 'Advertisement';
      position: absolute; top: 6px; left: 50%;
      transform: translateX(-50%);
      font-size: 10px; color: #9ca3af;
      letter-spacing: .06em; text-transform: uppercase;
    }
    .ad-slot-leaderboard { width: 100%; height: 90px; }
    .ad-slot-rectangle   { width: 100%; height: 250px; }
    .ad-slot-sidebar     { width: 100%; height: 600px; }

    /* ── CALC HERO STRIP ── */
    .calc-hero {
      background: linear-gradient(135deg, var(--accent) 0%, var(--accent-dk) 100%);
      padding: 36px 0 32px;
      position: relative; overflow: hidden;
    }
    .calc-hero::before {
      content: '';
      position: absolute; inset: 0;
      background: url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M20 20h20v20H20zM0 0h20v20H0z'/%3E%3C/g%3E%3C/svg%3E");
    }
    .calc-hero-badge {
      display: inline-flex; align-items: center; gap: 6px;
      background: rgba(255,255,255,.15);
      border: 1px solid rgba(255,255,255,.25);
      border-radius: 999px; padding: 4px 12px;
      font-size: 11px; font-weight: 700;
      color: rgba(255,255,255,.9);
      letter-spacing: .05em; text-transform: uppercase;
      margin-bottom: 12px;
    }
    .calc-hero h1 {
      font-size: clamp(22px, 3.5vw, 36px);
      font-weight: 800; color: #fff;
      letter-spacing: -0.025em; line-height: 1.15;
      margin-bottom: 8px;
    }
    .calc-hero p {
      font-size: 14px; color: rgba(255,255,255,.8);
      max-width: 480px; line-height: 1.7;
    }
    .calc-hero-icon {
      width: 72px; height: 72px;
      background: rgba(255,255,255,.15);
      border: 2px solid rgba(255,255,255,.25);
      border-radius: 18px;
      display: flex; align-items: center; justify-content: center;
      font-size: 32px;
    }

    /* ── MAIN CALCULATOR CARD ── */
    .calc-card-main {
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: 16px;
      overflow: hidden;
      box-shadow: 0 4px 20px rgba(0,0,0,.06);
    }
    .calc-card-header {
      background: var(--accent-lt);
      border-bottom: 1px solid var(--border);
      padding: 18px 24px;
      display: flex; align-items: center; gap: 10px;
    }
    .calc-card-header h2 {
      font-size: 15px; font-weight: 700; color: var(--accent);
    }
    .calc-card-body { padding: 24px; }

    /* ── FORM ELEMENTS ── */
    .form-label {
      font-size: 13px; font-weight: 600;
      color: var(--text); margin-bottom: 6px;
    }
    .form-control, .form-select {
      border: 1.5px solid var(--border);
      border-radius: 10px;
      font-size: 14px; font-weight: 500;
      padding: 10px 14px;
      color: var(--text);
      font-family: inherit;
      transition: border-color .15s, box-shadow .15s;
    }
    .form-control:focus, .form-select:focus {
      border-color: var(--accent);
      box-shadow: 0 0 0 3px rgba(26,86,219,.12);
      outline: none;
    }
    .input-group-text {
      background: var(--bg); border: 1.5px solid var(--border);
      border-right: none; border-radius: 10px 0 0 10px;
      font-weight: 700; color: var(--muted); font-size: 14px;
      padding: 10px 14px;
    }
    .input-group .form-control { border-left: none; border-radius: 0 10px 10px 0; }

    /* GST Toggle buttons */
    .gst-toggle {
      display: flex; gap: 8px; flex-wrap: wrap;
    }
    .gst-toggle input { display: none; }
    .gst-toggle label {
      padding: 8px 16px; border-radius: 8px;
      border: 1.5px solid var(--border);
      font-size: 13px; font-weight: 600;
      color: var(--muted); cursor: pointer;
      transition: all .15s;
    }
    .gst-toggle input:checked + label {
      background: var(--primary); border-color: var(--primary);
      color: #fff; box-shadow: 0 2px 8px rgba(26,86,219,.25);
    }

    /* Mode toggle */
    .mode-toggle {
      display: flex; background: var(--bg);
      border: 1px solid var(--border); border-radius: 10px;
      padding: 4px; gap: 4px;
    }
    .mode-btn {
      flex: 1; padding: 8px 12px; border-radius: 7px;
      border: none; font-family: inherit; font-size: 13px;
      font-weight: 600; cursor: pointer; transition: all .15s;
      background: transparent; color: var(--muted);
    }
    .mode-btn.active {
      background: var(--white); color: var(--primary);
      box-shadow: 0 1px 6px rgba(0,0,0,.1);
    }

    /* Calculate button */
    .btn-calc {
      background: linear-gradient(135deg, var(--primary) 0%, var(--primary) 100%);
      color: #fff; border: none; border-radius: 10px;
      padding: 13px 28px; font-size: 14px; font-weight: 700;
      font-family: inherit; cursor: pointer; width: 100%;
      transition: transform .12s, box-shadow .12s;
      display: flex; align-items: center; justify-content: center; gap: 8px;
    }
    .btn-calc:hover {
      transform: translateY(-1px);
      box-shadow: 0 6px 20px rgba(26,86,219,.35);
    }
    .btn-calc:active { transform: translateY(0); }

    .btn-reset {
      background: transparent; color: var(--muted);
      border: 1.5px solid var(--border); border-radius: 10px;
      padding: 12px 20px; font-size: 13px; font-weight: 600;
      font-family: inherit; cursor: pointer; width: 100%;
      transition: all .12s;
    }
    .btn-reset:hover { border-color: var(--accent); color: var(--accent); }

    /* ── RESULT PANEL ── */
    .result-panel {
      background: linear-gradient(135deg, #f0f7ff 0%, #e8f4fd 100%);
      border: 1.5px solid #c7d7ff;
      border-radius: 14px; padding: 22px;
      display: none;
    }
    .result-panel.show { display: block; animation: fadeSlide .3s ease; }
    @keyframes fadeSlide {
      from { opacity: 0; transform: translateY(8px); }
      to   { opacity: 1; transform: translateY(0); }
    }

    .result-main {
      text-align: center; padding: 16px 0 20px;
      border-bottom: 1px solid #c7d7ff; margin-bottom: 16px;
    }
    .result-main-label {
      font-size: 12px; font-weight: 700;
      text-transform: uppercase; letter-spacing: .08em;
      color: var(--primary); margin-bottom: 6px;
    }
    .result-main-val {
      font-size: 36px; font-weight: 800;
      color: var(--primary); letter-spacing: -0.03em;
    }

    .result-row {
      display: flex; justify-content: space-between;
      align-items: center; padding: 8px 0;
      border-bottom: 1px solid rgba(199,215,255,.5);
      font-size: 13.5px;
    }
    .result-row:last-child { border-bottom: none; }
    .result-row-label { color: var(--muted); font-weight: 500; }
    .result-row-val { font-weight: 700; color: var(--text); }
    .result-row-val.green { color: var(--success); }
    .result-row-val.blue { color: var(--accent); }

    /* ── BREAKDOWN TABLE ── */
    .breakdown-table {
      width: 100%; border-collapse: collapse; font-size: 13px;
    }
    .breakdown-table th {
      background: var(--accent); color: #fff;
      padding: 10px 14px; font-weight: 700;
      font-size: 12px; text-align: left;
    }
    .breakdown-table th:first-child { border-radius: 8px 0 0 0; }
    .breakdown-table th:last-child  { border-radius: 0 8px 0 0; }
    .breakdown-table td {
      padding: 10px 14px; border-bottom: 1px solid var(--border);
      color: var(--text); font-weight: 500;
    }
    .breakdown-table tr:last-child td { border-bottom: none; }
    .breakdown-table tr:nth-child(even) td { background: var(--bg); }

    /* ── CONTENT / SEO SECTIONS ── */
    .content-card {
      background: var(--white);
      border: 1px solid var(--border);
      border-radius: 14px; padding: 28px;
      margin-bottom: 20px;
    }
    .content-card h2 {
      font-size: 19px; font-weight: 800;
      letter-spacing: -0.02em; margin-bottom: 12px; color: var(--text);
    }
    .content-card h3 {
      font-size: 15px; font-weight: 700;
      margin: 20px 0 8px; color: var(--text);
    }
    .content-card p {
      font-size: 14px; color: var(--muted);
      line-height: 1.8; margin-bottom: 12px;
    }
    .content-card ul {
      list-style: none; padding: 0;
    }
    .content-card ul li {
      font-size: 14px; color: var(--muted);
      padding: 5px 0; padding-left: 20px; position: relative; line-height: 1.6;
    }
    .content-card ul li::before {
      content: '→'; position: absolute; left: 0;
      color: var(--accent); font-weight: 700;
    }

    /* Formula box */
    .formula-box-gst {
      background: #f0f4ff; border-left: 3px solid var(--primary);
      border-radius: 0 8px 8px 0; padding: 14px 16px;
      font-family: 'Courier New', monospace; font-size: 13px;
      color: var(--primary); margin: 12px 0;
      overflow-x: auto;
    }

    /* GST Slab table */
    .slab-table {
      width: 100%; border-collapse: collapse; font-size: 13.5px;
      border-radius: 10px; overflow: hidden;
    }
    .slab-table th {
      background: var(--primary); color: #fff;
      padding: 11px 14px; font-size: 12px; font-weight: 700;
      text-align: left;
    }
    .slab-table td {
      padding: 10px 14px; border-bottom: 1px solid var(--border);
      color: var(--text); vertical-align: top;
    }
    .slab-table tr:last-child td { border-bottom: none; }
    .slab-table tr:nth-child(even) td { background: var(--bg); }

    .slab-pill {
      display: inline-block; padding: 3px 10px; border-radius: 999px;
      font-size: 12px; font-weight: 700;
    }
    .slab-5  { background: #d1fae5; color: #065f46; }
    .slab-12 { background: #dbeafe; color: #1e40af; }
    .slab-18 { background: #ede9fe; color: #5b21b6; }
    .slab-28 { background: #fee2e2; color: #991b1b; }

    /* ── FAQ ── */
    .faq-item {
      border-bottom: 1px solid var(--border); padding: 14px 0;
    }
    .faq-item:last-child { border-bottom: none; }
    .faq-q {
      font-size: 14px; font-weight: 700; color: var(--text);
      cursor: pointer; display: flex;
      justify-content: space-between; align-items: center; gap: 12px;
    }
    .faq-a {
      font-size: 13.5px; color: var(--muted);
      line-height: 1.7; padding-top: 8px; display: none;
    }
    .faq-item.open .faq-a { display: block; }
    .faq-item.open .faq-icon { transform: rotate(45deg); }
    .faq-icon { transition: transform .2s; font-size: 18px; color: var(--muted); flex-shrink: 0; }

    /* ── SIDEBAR ── */
    .sidebar-widget {
      background: var(--white); border: 1px solid var(--border);
      border-radius: 14px; padding: 20px; margin-bottom: 20px;
    }
    .sidebar-widget h4 {
      font-size: 13px; font-weight: 700; margin-bottom: 14px; color: var(--text);
    }
    .sidebar-link {
      display: flex; align-items: center; gap: 10px;
      padding: 8px 0; border-bottom: 1px solid var(--border);
      text-decoration: none; color: var(--muted);
      font-size: 13px; font-weight: 500; transition: color .12s;
    }
    .sidebar-link:last-child { border-bottom: none; }
    .sidebar-link:hover { color: var(--accent); }
    .sidebar-link i { font-size: 14px; color: var(--accent); width: 16px; }

    /* Related calc cards */
    .related-card {
      display: flex; align-items: center; gap: 12px;
      padding: 10px 12px; border: 1px solid var(--border);
      border-radius: 10px; text-decoration: none;
      color: var(--text); transition: all .12s;
      background: var(--white); margin-bottom: 8px;
    }
    .related-card:hover {
      border-color: var(--accent); background: var(--accent-lt);
      color: var(--accent);
    }
    .related-card-icon {
      width: 36px; height: 36px; border-radius: 9px;
      background: var(--accent-lt); display: flex;
      align-items: center; justify-content: center;
      font-size: 16px; flex-shrink: 0;
    }
    .related-card-text { font-size: 13px; font-weight: 600; }
    .related-card-sub  { font-size: 11px; color: var(--muted); margin-top: 1px; }

    /* Info chips */
    .info-chip {
      display: inline-flex; align-items: center; gap: 5px;
      background: var(--bg); border: 1px solid var(--border);
      border-radius: 999px; padding: 4px 12px;
      font-size: 12px; font-weight: 600; color: var(--muted);
    }
    .info-chip i { font-size: 11px; color: var(--success); }

    /* ── FOOTER ── */
    footer {
      background: var(--white); border-top: 1px solid var(--border);
      padding: 48px 0 24px; margin-top: 64px;
    }
    .footer-brand { font-weight: 800; font-size: 17px; color: var(--primary); letter-spacing: -0.02em; margin-bottom: 10px; }
    .footer-desc  { font-size: 13px; color: var(--muted); line-height: 1.7; max-width: 280px; }
    .footer-col h5 { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--text); margin-bottom: 14px; }
    .footer-link { display: block; font-size: 13px; color: var(--muted); text-decoration: none; padding: 4px 0; transition: color .12s; }
    .footer-link:hover { color: var(--primary); }
    .footer-bottom { border-top: 1px solid var(--border); padding-top: 20px; margin-top: 32px; font-size: 12px; color: var(--muted); }
    

    @media (max-width: 768px) {
      .calc-hero { padding: 24px 0; }
      .calc-card-body { padding: 16px; }
      .content-card { padding: 18px; }
      .ad-slot-sidebar { height: 250px; }
    }
    /* INCOME TAX */
    .regime-tab{border:1.5px solid var(--border);border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white);color:var(--muted);transition:all .15s;}
    .regime-tab.active{border-color:var(--primary);background:var(--primary-lt);color:var(--primary);}
    .badge-new{font-size:10px;background:#dcfce7;color:#166534;border-radius:6px;padding:2px 7px;font-weight:700;vertical-align:middle;}
    .badge-rec{font-size:10px;background:#fef3c7;color:#92400e;border-radius:6px;padding:2px 7px;font-weight:700;vertical-align:middle;}

    .result-box-income-tax{background:linear-gradient(135deg,#1a56db,#1e3a8a);color:#fff;border-radius:14px;padding:24px;}
    .result-val-income-tax{font-size:32px;font-weight:800;letter-spacing:-0.03em;}
    .result-label-income-tax{font-size:12px;opacity:.75;margin-top:2px;}
    .result-mini-income-tax{background:rgba(255,255,255,.12);border-radius:10px;padding:14px;text-align:center;}
    .result-mini-val-income-tax{font-size:18px;font-weight:800;}
    .result-mini-label-income-tax{font-size:11px;opacity:.75;margin-top:2px;}
    .breakdown-row-income-tax{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--border);font-size:13px;}
    .breakdown-row-income-tax:last-child{border-bottom:none;}
    .breakdown-row-income-tax .lbl{color:var(--muted);}
    .breakdown-row-income-tax .val{font-weight:700;color:var(--text);}
    .breakdown-row-income-tax.total .lbl{font-weight:700;color:var(--text);}
    .breakdown-row-income-tax.total .val{color:var(--primary);font-size:15px;}


    /* Percentage */
    .calc-card-percentage{background:var(--white-percentage);border:1px solid var(--border-percentage);border-radius:16px;padding:28px;margin-bottom:20px;}
    .calc-card-percentage h3{font-size:15px;font-weight:800;margin-bottom:16px;display:flex;align-items:center;gap:8px;}
    .calc-card-percentage h3 .icon{font-size:20px;}
    .page-hero-percentage{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-percentage h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-btn{background:var(--primary-percentage);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s;font-family:inherit;}
    .calc-btn:hover{background:#6d28d9;}
    .form-label-percentage{font-size:13px;font-weight:700;color:var(--text-percentage);margin-bottom:6px;}
    .form-control-percentage{border:1.5px solid var(--border-percentage);border-radius:10px;font-size:14px;font-weight:600;padding:10px 14px;font-family:inherit;transition:border-color .15s;}
    .form-control-percentage:focus{border-color:var(--primary-percentage);box-shadow:0 0 0 3px rgba(124,58,237,.1);outline:none;}
    .input-group-text-percentage{background:var(--bg-percentage);border:1.5px solid var(--border-percentage);border-radius:10px;font-size:13px;font-weight:700;color:var(--muted-percentage);}


    /* Electricity */
    .page-hero-electricity{background:linear-gradient(135deg,#d97706 0%,#92400e 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-electricity h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-card-electricity{background:var(--white-electricity);border:1px solid var(--border-electricity);border-radius:16px;padding:28px;margin-bottom:20px;}
    .appliance-row{display:grid;grid-template-columns:1fr 80px 80px 80px 36px;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--border-electricity);}
    .appliance-row.header{font-size:11px;font-weight:700;color:var(--muted-electricity);text-transform:uppercase;letter-spacing:.05em;padding-bottom:6px;}
    .appliance-row .form-control{padding:7px 10px;font-size:13px;}
    .add-btn{border:1.5px dashed var(--primary-electricity);border-radius:10px;padding:10px;font-size:13px;font-weight:700;color:var(--primary-electricity);cursor:pointer;background:var(--primary-lt-electricity);width:100%;transition:all .15s;}
    .add-btn:hover{background:var(--accent-electricity);color:#fff;border-style:solid;}
    .del-btn{background:none;border:none;color:#ef4444;font-size:18px;cursor:pointer;padding:4px;}

    .result-box-electricity{background:linear-gradient(135deg,#d97706,#92400e);color:#fff;border-radius:14px;padding:24px;}
    .result-val-electricity{font-size:32px;font-weight:800;letter-spacing:-0.03em;}
    .result-label-electricity{font-size:12px;opacity:.75;margin-top:2px;}
    .result-mini-electricity{background:rgba(255,255,255,.12);border-radius:10px;padding:14px;text-align:center;}
    .result-mini-val-electricity{font-size:18px;font-weight:800;}
    .result-mini-label-electricity{font-size:11px;opacity:.75;margin-top:2px;}
    .appliance-breakdown{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--border-electricity);font-size:13px;}
    .appliance-breakdown:last-child{border-bottom:none;}
    .content-block-electricity{background:var(--white-electricity);border:1px solid var(--border-electricity);border-radius:14px;padding:28px;margin-bottom:20px;}
    .content-block-electricity h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
    .content-block-electricity h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
    .content-block-electricity p{color:var(--muted-electricity);font-size:14px;line-height:1.8;margin-bottom:12px;}

    .tariff-table{width:100%;border-collapse:collapse;font-size:13px;}
    .tariff-table th{background:var(--primary-lt-electricity);color:var(--primary-electricity);font-weight:700;padding:10px 14px;text-align:left;}
    .tariff-table td{padding:9px 14px;border-bottom:1px solid var(--border-electricity);}

    /* PF Interest Calculator */
    .page-hero-pf{background:linear-gradient(135deg,#059669 0%,#064e3b 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-pf h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-card-pf{background:var(--white-pf);border:1px solid var(--border-pf);border-radius:16px;padding:28px;margin-bottom:20px;}

    .year-row{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--border);}
    .year-row:last-child{border-bottom:none;}
    .year-bar-wrap{flex:1;background:var(--border);border-radius:999px;height:8px;overflow:hidden;position:relative;}

    .result-box-pf{background:linear-gradient(135deg,#059669,#064e3b);color:#fff;border-radius:14px;padding:24px;}
    .result-val-pf{font-size:32px;font-weight:800;letter-spacing:-0.03em;}
    .result-label-pf{font-size:12px;opacity:.75;margin-top:2px;}
    .result-mini-pf{background:rgba(255,255,255,.12);border-radius:10px;padding:14px;text-align:center;}
    .result-mini-val-pf{font-size:18px;font-weight:800;}
    .result-mini-label-pf{font-size:11px;opacity:.75;margin-top:2px;}
    .info-badge{background:var(--primary-lt-pf);border:1px solid #a7f3d0;border-radius:8px;padding:10px 14px;font-size:13px;color:var(--primary-pf);font-weight:600;margin-bottom:16px;}

    .form-label-pf{font-size:13px;font-weight:700;color:var(--text-pf);margin-bottom:6px;}
    .form-control-pf{border:1.5px solid var(--border-pf);border-radius:10px;font-size:14px;font-weight:600;padding:10px 14px;font-family:inherit;transition:border-color .15s;}
    .form-control-pf:focus{border-color:var(--primary-pf);box-shadow:0 0 0 3px rgba(5,150,105,.1);outline:none;}
    .input-group-text-pf{background:var(--bg-pf);border:1.5px solid var(--border-pf);border-radius:10px;font-size:13px;font-weight:700;color:var(--muted-pf);}

    .content-block-pf{background:var(--white-pf);border:1px solid var(--border-pf);border-radius:14px;padding:28px;margin-bottom:20px;}
    .content-block-pf h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
    .content-block-pf h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
    .content-block-pf p{color:var(--muted-pf);font-size:14px;line-height:1.8;margin-bottom:12px;}

    .formula-box-pf{background:var(--primary-lt-pf);border:1px solid #a7f3d0;border-radius:10px;padding:16px 20px;font-family:monospace;font-size:14px;color:var(--primary-pf);margin:16px 0;}
    .range-slider-pf{width:100%;accent-color:var(--primary-pf);}

    /* Credit Card Interest Calcualtor */
    .page-hero-credit-card{background:linear-gradient(135deg,#dc2626 0%,#7f1d1d 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-credit-card h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-card-credit-card{background:var(--white-credit-card);border:1px solid var(--border-credit-card);border-radius:16px;padding:28px;margin-bottom:20px;}
    .tab-btn{border:1.5px solid var(--border-credit-card);border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white-credit-card);color:var(--muted-credit-card);transition:all .15s;}
    .tab-btn.active{border-color:var(--primary-credit-card);background:var(--primary-lt-credit-card);color:var(--primary-credit-card);}

    .result-box-credit-card{background:linear-gradient(135deg,#dc2626,#7f1d1d);color:#fff;border-radius:14px;padding:24px;}
    .result-box-credit-card.green{background:linear-gradient(135deg,#059669,#064e3b);}
    .result-val-credit-card{font-size:32px;font-weight:800;letter-spacing:-0.03em;}
    .result-label-credit-card{font-size:12px;opacity:.75;margin-top:2px;}
    .result-mini-credit-card{background:rgba(255,255,255,.12);border-radius:10px;padding:14px;text-align:center;}
    .result-mini-val-credit-card{font-size:18px;font-weight:800;}
    .result-mini-label-credit-card{font-size:11px;opacity:.75;margin-top:2px;}
    .warning-box{background:var(--primary-lt-credit-card);border:1px solid #fca5a5;border-radius:10px;padding:14px 18px;font-size:13px;color:var(--primary-credit-card);margin-bottom:16px;}
    .payoff-row{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px solid var(--border);font-size:13px;}
    .payoff-row:last-child{border-bottom:none;}
    .formula-box-credit-card{background:var(--primary-lt-credit-card);border:1px solid #fca5a5;border-radius:10px;padding:16px 20px;font-family:monospace;font-size:14px;color:var(--primary-credit-card);margin:16px 0;}

    .page-hero-calorie{background:linear-gradient(135deg,#0891b2 0%,#164e63 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-calorie h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-card-calorie{background:var(--white-calorie);border:1px solid var(--border-calorie);border-radius:16px;padding:28px;margin-bottom:20px;}
    .gender-btn{border:1.5px solid var(--border-calorie);border-radius:10px;padding:10px 24px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white-calorie);color:var(--muted-calorie);transition:all .15s;}
    .gender-btn.active{border-color:var(--primary-calorie);background:var(--primary-lt-calorie);color:var(--primary-calorie);}
    .result-box-calorie{background:linear-gradient(135deg,#0891b2,#164e63);color:#fff;border-radius:14px;padding:24px;}
    .result-val-calorie{font-size:40px;font-weight:800;letter-spacing:-0.03em;}
    .result-label-calorie{font-size:12px;opacity:.75;margin-top:2px;}

    .goal-card{border-radius:12px;padding:16px;text-align:center;border:2px solid transparent;cursor:pointer;transition:all .2s;}
    .goal-card.lose{background:#fef2f2;border-color:#fca5a5;}
    .goal-card.lose .val{color:#dc2626;}
    .goal-card.maintain{background:#f0fdf4;border-color:#86efac;}
    .goal-card.maintain .val{color:#16a34a;}
    .goal-card.gain{background:#eff6ff;border-color:#93c5fd;}
    .goal-card.gain .val{color:#1d4ed8;}
    .goal-card .val{font-size:22px;font-weight:800;}
    .goal-card .label{font-size:11px;font-weight:600;margin-top:4px;color:var(--muted-calorie);}
    .goal-card .desc{font-size:10px;color:var(--muted-calorie);margin-top:2px;}
    .formula-box-calorie{background:var(--primary-lt-calorie);border:1px solid #a5f3fc;border-radius:10px;padding:16px 20px;font-family:monospace;font-size:14px;color:var(--primary-calorie);margin:16px 0;}
    .macro-bar{background:var(--border-calorie);border-radius:999px;height:10px;overflow:hidden;margin-bottom:4px;}
    .macro-bar div{height:100%;border-radius:999px;}

    /* Body Fat */
    .page-hero-body-fat{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-body-fat h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-card-body-fat{background:var(--white-body-fat);border:1px solid var(--border-body-fat);border-radius:16px;padding:28px;margin-bottom:20px;}
    .gender-btn-body-fat{border:1.5px solid var(--border-body-fat);border-radius:10px;padding:10px 24px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white-body-fat);color:var(--muted-body-fat);transition:all .15s;}
    .gender-btn-body-fat.active{border-color:var(--primary-body-fat);background:var(--primary-lt-body-fat);color:var(--primary-body-fat);}
    .method-tab{border:1.5px solid var(--border-body-fat);border-radius:10px;padding:8px 18px;font-size:12px;font-weight:700;cursor:pointer;background:var(--white-body-fat);color:var(--muted-body-fat);transition:all .15s;}
    .method-tab.active{border-color:var(--primary-body-fat);background:var(--primary-lt-body-fat);color:var(--primary-body-fat);}

    .result-center-body-fat{text-align:center;padding:28px;background:linear-gradient(135deg,#7c3aed,#4c1d95);border-radius:14px;color:#fff;margin-bottom:16px;}
    .result-big-body-fat{font-size:56px;font-weight:800;line-height:1;}
    .result-label-big-body-fat{font-size:14px;opacity:.8;margin-top:4px;}

    .bf-range-bar{display:flex;height:20px;border-radius:10px;overflow:hidden;margin:12px 0 4px;}
    .bf-range-bar div{flex:1;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:#fff;}
    .cat-badge{display:inline-block;padding:6px 18px;border-radius:999px;font-size:13px;font-weight:700;margin-top:10px;}

    .content-block-body-fat{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:28px;margin-bottom:20px;}
    .content-block-body-fat h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
    .content-block-body-fat h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
    .content-block-body-fat p{color:var(--muted);font-size:14px;line-height:1.8;margin-bottom:12px;}
    .bf-table-body-fat{width:100%;border-collapse:collapse;font-size:13px;}
    .bf-table-body-fat th{background:var(--primary-lt-body-fat);color:var(--primary-body-fat);font-weight:700;padding:10px 14px;text-align:left;}
    .bf-table-body-fat td{padding:9px 14px;border-bottom:1px solid var(--border-body-fat);}
    .bf-table-body-fat tr:nth-child(even) td{background:var(--bg-body-fat);}

    /* JSON Formatter */
    .page-hero-json{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-json h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .tool-card-json{background:var(--white-json);border:1px solid var(--border-json);border-radius:16px;padding:24px;margin-bottom:20px;}
    .tool-btn-json{border:1.5px solid var(--border);border-radius:10px;padding:9px 18px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white-json);color:var(--text-json);transition:all .15s;font-family:inherit;}
    .tool-btn-json:hover{border-color:var(--primary-json);color:var(--primary-json);}
    .tool-btn-json.primary{background:var(--primary-json);color:#fff;border-color:var(--primary-json);}
    .tool-btn-json.primary:hover{background:#6d28d9;}
    .tool-btn-json.success{background:#16a34a;color:#fff;border-color:#16a34a;}
    .tool-btn-json.danger{background:#dc2626;color:#fff;border-color:#dc2626;}

    .code-area{font-family:'Fira Code',monospace;font-size:13px;background:var(--code-bg-json);color:#cdd6f4;border:none;border-radius:12px;padding:16px;width:100%;resize:vertical;min-height:280px;outline:none;line-height:1.7;}
    .output-area{font-family:'Fira Code',monospace;font-size:13px;background:var(--code-bg-json);border-radius:12px;padding:16px;min-height:280px;color:#cdd6f4;white-space:pre-wrap;word-break:break-all;overflow:auto;line-height:1.7;}
    .status-bar{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:8px;font-size:13px;font-weight:600;}
    .status-ok{background:#d1fae5;color:#065f46;}
    .status-err{background:#fee2e2;color:#991b1b;}
    .status-idle{background:var(--bg);color:var(--muted-json);}
    .json-key{color:#89b4fa;}
    .json-string{color:#a6e3a1;}
    .json-number{color:#fab387;}
    .json-bool{color:#f38ba8;}
    .json-null{color:#9399b2;}


    /* Password Generator */
    .page-hero-password{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-password h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .tool-card-password{background:var(--white-password);border:1px solid var(--border-password);border-radius:16px;padding:28px;margin-bottom:20px;}
    .pwd-display{font-family:'Fira Code',monospace;font-size:20px;font-weight:600;background:#1e1e2e;color:#cdd6f4;border-radius:12px;padding:20px 24px;letter-spacing:.05em;word-break:break-all;min-height:72px;display:flex;align-items:center;position:relative;}
    .check-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border);font-size:14px;cursor:pointer;user-select:none;}
    .check-row:last-child{border-bottom:none;}
    .check-row input[type=checkbox]{width:18px;height:18px;accent-color:var(--primary-password);cursor:pointer;}
    .len-slider{-webkit-appearance:none;width:100%;height:8px;border-radius:4px;background:var(--border);outline:none;}
    .len-slider::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--primary-password);cursor:pointer;box-shadow:0 2px 6px rgba(124,58,237,.4);}
    .tool-btn-password{border:1.5px solid var(--border-password);border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white-password);color:var(--text);transition:all .15s;font-family:inherit;}
    .tool-btn-password:hover{border-color:var(--primary-password);color:var(--primary-password);}
    .tool-btn-password.primary{background:var(--primary-password);color:#fff;border-color:var(--primary-password);}
    .tool-btn-password.primary:hover{background:#6d28d9;}
    .pwd-history{list-style:none;padding:0;margin:0;}
    .pwd-history li{font-family:'Fira Code',monospace;font-size:13px;padding:8px 12px;background:var(--bg);border-radius:8px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:background .15s;}
    .pwd-history li:hover{background:var(--primary-lt-password);}
    .strength-bar{height:8px;border-radius:4px;background:var(--border-password);overflow:hidden;margin:12px 0 4px;}
    .strength-fill{height:100%;border-radius:4px;transition:width .4s,background .4s;}

    /* Word Counter */
    .page-hero-word{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-word h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .breadcrumb-item a{color:rgba(255,255,255,.8);text-decoration:none;}
    .breadcrumb-item.active{color:rgba(255,255,255,.6);}
    .breadcrumb-item+.breadcrumb-item::before{color:rgba(255,255,255,.4);}
    .tool-card-word{background:var(--white-word);border:1px solid var(--border);border-radius:16px;padding:24px;margin-bottom:20px;}
    .stat-tile-word{background:var(--primary-lt-word);border-radius:12px;padding:18px;text-align:center;}
    .stat-big-word{font-size:32px;font-weight:800;color:var(--primary-word);line-height:1;}
    .stat-label-word{font-size:12px;color:var(--muted-word);margin-top:4px;font-weight:600;}
    .tool-btn-word{border:1.5px solid var(--border-word);border-radius:10px;padding:8px 16px;font-size:13px;font-weight:700;cursor:pointer;background:var(--white-word);color:var(--text-word);transition:all .15s;font-family:inherit;}
    .tool-btn-word:hover{border-color:var(--primary-word);color:var(--primary-word);}
    .text-area-word{font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;border:1.5px solid var(--border-word);border-radius:12px;padding:16px;width:100%;resize:vertical;min-height:320px;outline:none;line-height:1.8;transition:border-color .15s;}
    .text-area-word:focus{border-color:var(--primary-word);box-shadow:0 0 0 3px rgba(124,58,237,.1);}
    .platform-bar-word{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
    .plat-badge-word{padding:6px 12px;border-radius:8px;font-size:12px;font-weight:700;}
    .plat-ok-word{background:#d1fae5;color:#065f46;}
    .plat-warn-word{background:#fef3c7;color:#92400e;}
    .plat-over-word{background:#fee2e2;color:#991b1b;}
    .content-block-word{background:var(--white-word);border:1px solid var(--border-word);border-radius:14px;padding:28px;margin-bottom:20px;}
    .content-block-word h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
    .content-block-word h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
    .content-block-word p{color:var(--muted-word);font-size:14px;line-height:1.8;margin-bottom:12px;}
    .bf-table-word{width:100%;border-collapse:collapse;font-size:13px;}
    .bf-table-word th{background:var(--primary-lt-word);color:var(--primary-word);font-weight:700;padding:10px 14px;text-align:left;}
    .bf-table-word td{padding:9px 14px;border-bottom:1px solid var(--border-word);}
    .bf-table-word tr:nth-child(even) td{background:var(--bg-word);}

    /* Love Calcualtor */
    .page-hero-love{background:linear-gradient(135deg, #590086 0%, #d451db 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-love h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .btn-calc-love{background:linear-gradient(135deg, #590086 0%, #d451db 100%);color:#fff;border:none;border-radius:10px;padding:12px 32px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;width:100%;}
    .btn-calc-love:hover{opacity:.9;}
    .calc-card-love{background:var(--white-love);border:1px solid var(--border-love);border-radius:16px;padding:28px;margin-bottom:20px;}
    .result-hero-love{background:linear-gradient(135deg, #590086 0%, #d451db 100%);border-radius:14px;color:#fff;padding:28px;text-align:center;margin-bottom:16px;}
    .result-big-love{font-size:64px;font-weight:800;line-height:1;}
    .breakdown-row-love{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border-love);font-size:14px;}
    .breakdown-row-love:last-child{border-bottom:none;}
    .breakdown-row-love.total{font-weight:800;font-size:15px;color:var(--primary-love);}
    .bf-table-love{width:100%;border-collapse:collapse;font-size:13px;}
    .bf-table-love th{background:var(--primary-lt-love);color:var(--primary-love);font-weight:700;padding:10px 14px;text-align:left;}
    .bf-table-love td{padding:9px 14px;border-bottom:1px solid var(--border-love);}
    .bf-table-love tr:nth-child(even) td{background:var(--bg-love);}

    /* entertainment */
    .cat-header-entertainment{ background: var(--primary-lt-entertainment); border-color: #ebf0ff;; }
    .calc-card-entertainment{background:var(--white-love);border:1px solid var(--border-love);border-radius:16px;padding:28px;margin-bottom:20px;}

    /* Image Size Compressor */
    .page-hero-image-compressor{background:linear-gradient(135deg, #318293 0%, #386872 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-image-compressor h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .drop-zone-image-compressor{border:2.5px dashed var(--accent-image-compressor);border-radius:16px;background:var(--primary-lt-image-compressor);padding:48px 24px;text-align:center;cursor:pointer;transition:all .2s;position:relative;}
    .drop-zone-image-compressor:hover,.drop-zone.drag-over{border-color:var(--primary-image-compressor);background:#ede9fe;}
    .drop-zone-image-compressor input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
    .drop-zone-image-compressor-icon{font-size:48px;margin-bottom:12px;line-height:1;}
    .drop-zone-image-compressor-label{font-size:16px;font-weight:700;color:var(--primary-image-compressor);margin-bottom:4px;}
    .drop-zone-image-compressor-sub{font-size:13px;color:var(--muted-image-compressor);}
    .calc-card-image-compressor{background:var(--white-image-compressor);border:1px solid var(--border-image-compressor);border-radius:16px;padding:28px;margin-bottom:20px;}
    .bf-table-image-compressor{width:100%;border-collapse:collapse;font-size:13px;}
    .bf-table-image-compressor th{background:var(--primary-lt-image-compressor);color:var(--primary-image-compressor);font-weight:700;padding:10px 14px;text-align:left;}
    .bf-table-image-compressor td{padding:9px 14px;border-bottom:1px solid var(--border-image-compressor);}
    .bf-table-image-compressor tr:nth-child(even) td{background:var(--bg-image-compressor);}
    .section-divider-image-compressor{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-image-compressor);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-image-compressor);}
    .form-label-image-compressor{font-size:13px;font-weight:700;color:var(--text-image-compressor);margin-bottom:6px;}
    .btn-calc-image-compressor{background:linear-gradient(135deg, #318293 0%, #386872 100%);color:#fff;border:none;border-radius:10px;padding:12px 32px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;}
    .btn-calc-image-compressor:hover{opacity:.9;}
    .btn-outline-purple-image-compressor{background:transparent;color:var(--primary-image-compressor);border:2px solid var(--primary-image-compressor);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
    .btn-outline-purple-image-compressor:hover{background:var(--primary-lt-image-compressor);}
    .form-label-image-compressor{font-size:13px;font-weight:700;color:var(--text-image-compressor);margin-bottom:6px;}
    .range-wrap-image-compressor{position:relative;}
    input[class=image-compressor]{width:100%;accent-color:var(--primary-image-compressor);height:6px;border-radius:3px;cursor:pointer;}
     /* Stats card */
     .stat-box-image-compressor{background:var(--bg-image-compressor);border:1px solid var(--border-image-compressor);border-radius:12px;padding:16px 20px;text-align:center;}
     .stat-big-image-compressor{font-size:24px;font-weight:800;color:var(--primary-image-compressor);}
     .stat-label-image-compressor{font-size:12px;font-weight:600;color:var(--muted-image-compressor);margin-top:2px;}
     /* Savings bar */
    .savings-bar-wrap-image-compressor{background:#addee8;border-radius:99px;height:12px;overflow:hidden;margin:8px 0 4px;}
    .savings-bar-fill-image-compressor{height:100%;border-radius:99px;background:linear-gradient(135deg, #318293 0%, #386872 100%);transition:width .6s ease;}
    .batch-item-image-compressor{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--border-image-compressor);}
    .batch-item-image-compressor:last-child{border-bottom:none;}
    .batch-thumb-image-compressor{width:44px;height:44px;object-fit:cover;border-radius:8px;border:1px solid var(--border-image-compressor);}
    .batch-name-image-compressor{font-size:13px;font-weight:700;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    /* CTC Calcualtor */
    .page-hero-ctc{background:linear-gradient(135deg,#0891b2 0%,#0e7490 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-ctc h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-card-ctc{background:var(--white-ctc);border:1px solid var(--border-ctc);border-radius:16px;padding:28px;margin-bottom:20px;}
    .result-hero-ctc{background:linear-gradient(135deg,#0891b2,#0e7490);border-radius:14px;color:#fff;padding:28px;text-align:center;margin-bottom:16px;}
    .result-big-ctc{font-size:48px;font-weight:800;line-height:1;}
    .breakdown-row-ctc{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid var(--border-ctc);font-size:14px;}
    .breakdown-row-ctc:last-child{border-bottom:none;}
    .breakdown-row-ctc.total{font-weight:800;font-size:15px;color:var(--primary-ctc);}
    .breakdown-row-ctc.deduction{color:#dc2626;}
    .bf-table-ctc{width:100%;border-collapse:collapse;font-size:13px;}
    .bf-table-ctc th{background:var(--primary-lt-ctc);color:var(--primary-ctc);font-weight:700;padding:10px 14px;text-align:left;}
    .bf-table-ctc td{padding:9px 14px;border-bottom:1px solid var(--border-ctc);}
    .bf-table-ctc tr:nth-child(even) td{background:var(--bg-ctc);}

    /* Invoice Generator */
    .page-hero-invoice{background:linear-gradient(135deg,#16a34a 0%,#14532d 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-invoice h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-card-invoice{background:var(--white-invoice);border:1px solid var(--border-invoice);border-radius:16px;padding:28px;margin-bottom:20px;}
    .section-divider-invoice{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-invoice);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-invoice);}
      /* Items table */
      .items-table{width:100%;border-collapse:collapse;}
      .items-table th{font-size:12px;font-weight:700;color:var(--muted-invoice);text-transform:uppercase;letter-spacing:.04em;padding:8px 10px;border-bottom:2px solid var(--border-invoice);}
      .items-table td{padding:6px 4px;vertical-align:middle;}
      .items-table .form-control{padding:8px 10px;font-size:13px;}
      .content-block-invoice{background:var(--white-invoice);border:1px solid var(--border-invoice);border-radius:14px;padding:28px;margin-bottom:20px;}
      .content-block-invoice h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
      .content-block-invoice h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
      .content-block-invoice p{color:var(--muted-invoice);font-size:14px;line-height:1.8;margin-bottom:12px;}
      .bf-table-invoice{width:100%;border-collapse:collapse;font-size:13px;}
      .bf-table-invoice th{background:var(--primary-lt-invoice);color:var(--primary-invoice);font-weight:700;padding:10px 14px;text-align:left;}
      .bf-table-invoice td{padding:9px 14px;border-bottom:1px solid var(--border-invoice);}
      .bf-table-invoice tr:nth-child(even) td{background:var(--bg-invoice);}

      /* Invoice Preview */
      .invoice-preview{background:var(--white-invoice);border:1px solid var(--border-invoice);border-radius:14px;padding:32px;margin-bottom:20px;}
      .inv-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:28px;}
      .inv-logo{font-size:22px;font-weight:800;color:var(--primary-invoice);}
      .inv-title{font-size:28px;font-weight:800;color:var(--primary-invoice);letter-spacing:-0.03em;}
      .inv-section{margin-bottom:20px;}
      .inv-label{font-size:11px;font-weight:700;color:var(--muted-invoice);text-transform:uppercase;letter-spacing:.05em;}
      .inv-value{font-size:14px;font-weight:600;margin-top:2px;}
      .inv-items-table{width:100%;border-collapse:collapse;margin:16px 0;}
      .inv-items-table th{background:var(--primary-lt-invoice);color:var(--primary-invoice);font-size:12px;font-weight:700;padding:10px 12px;text-align:left;}
      .inv-items-table td{padding:10px 12px;border-bottom:1px solid var(--border-invoice);font-size:13px;}
      .inv-items-table tr:last-child td{border-bottom:none;}
      .inv-totals{background:var(--bg-invoice);border-radius:10px;padding:16px 20px;}
      .inv-total-row{display:flex;justify-content:space-between;font-size:14px;padding:4px 0;}
      .inv-total-row.grand{font-size:17px;font-weight:800;color:var(--primary-invoice);border-top:2px solid var(--border-invoice);margin-top:8px;padding-top:10px;}
      .btn-calc-invoice{background:linear-gradient(135deg,#16a34a 0%,#14532d 100%);color:#fff;border:none;border-radius:10px;padding:12px 32px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;}
      .btn-calc-invoice:hover{opacity:.9;}
      .btn-outline-purple-invoice{background:transparent;color:var(--primary-invoice);border:2px solid var(--primary-invoice);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
      .btn-outline-purple-invoice:hover{background:var(--primary-lt-invoice);}
      .btn-danger-soft-invoice{background:transparent;color:#dc2626;border:2px solid #fca5a5;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
      .btn-danger-soft-invoice:hover{background:#fef2f2;}
      @media print{
        .no-print{display:none!important;}
        body{background:#fff;}
        .invoice-preview{border:none;padding:0;}
        footer,
        .footer,
        #footer {
            display: none !important;
        }
       
      }

      /* PDF Tools */
      .page-hero-pdf{background:linear-gradient(135deg,#dc2626 0%,#7f1d1d 100%);color:#fff;padding:40px 0 32px;}
      .page-hero-pdf h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}

       /* Privacy badge */
      .privacy-badge-pdf{display:inline-flex;align-items:center;gap:6px;background:#f0fdf4;border:1px solid #86efac;border-radius:999px;padding:4px 12px;font-size:11px;font-weight:700;color:#15803d;margin-bottom:18px;}

       /* Tool grid on overview */
    .tool-cards-grid-pdf{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px;margin-bottom:24px;}
    .tool-overview-card-pdf{background:var(--white-pdf);border:1.5px solid var(--border-pdf);border-radius:12px;padding:18px;cursor:pointer;transition:all .15s;text-align:center;}
    .tool-overview-card-pdf:hover{border-color:var(--primary-pdf);background:var(--primary-lt-pdf);transform:translateY(-2px);}
    .tool-overview-card-pdf i{font-size:28px;color:var(--primary-pdf);display:block;margin-bottom:8px;}
    .tool-overview-card-pdf .toc-name{font-size:13px;font-weight:700;}
    .tool-overview-card-pdf .toc-desc{font-size:11px;color:var(--muted-pdf);margin-top:2px;}

    .form-label-pdf{font-size:13px;font-weight:700;color:var(--text-pdf);margin-bottom:6px;}
    .form-control-pdf,.form-select-pdf{border:1.5px solid var(--border-pdf);border-radius:10px;font-size:14px;font-weight:600;padding:10px 14px;font-family:inherit;transition:border-color .15s;}
    .form-control-pdf:focus,.form-select-pdf:focus{border-color:var(--primary-pdf);box-shadow:0 0 0 3px rgba(220,38,38,.1);outline:none;}


      .tool-tabs-pdf{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px;}
      .tool-tab-pdf{display:flex;align-items:center;gap:7px;padding:9px 16px;border:1.5px solid var(--border-pdf);border-radius:10px;background:var(--white-pdf);cursor:pointer;font-size:13px;font-weight:700;color:var(--muted-pdf);transition:all .15s;font-family:inherit;}
      .tool-tab-pdf i{font-size:15px;}
      .tool-tab-pdf:hover{border-color:var(--primary-pdf);color:var(--primary-pdf);background:var(--primary-lt-pdf);}
      .tool-tab-pdf.active{border-color:var(--primary-pdf);background:var(--primary-lt-pdf);color:var(--primary-pdf);}
  
      /* Cards */
      .calc-card-pdf{background:var(--white-pdf);border:1px solid var(--border-pdf);border-radius:16px;padding:28px;margin-bottom:20px;}
      .content-block-pdf{background:var(--white-pdf);border:1px solid var(--border-pdf);border-radius:14px;padding:28px;margin-bottom:20px;}
      .content-block-pdf h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
      .content-block-pdf h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
      .content-block-pdf p{color:var(--muted);font-size:14px;line-height:1.8;margin-bottom:12px;}
  
      /* Tool panel */
      .tool-panel-pdf{display:none;}
      .tool-panel-pdf.active{display:block;}
      .tool-title-pdf{font-size:18px;font-weight:800;letter-spacing:-0.02em;margin-bottom:4px;}
      .tool-desc-pdf{font-size:13px;color:var(--muted-pdf);margin-bottom:22px;}
  
      /* Drop zone */
      .drop-zone-pdf{border:2.5px dashed var(--border-pdf);border-radius:14px;padding:40px 24px;text-align:center;cursor:pointer;transition:all .2s;background:#fafbfd;position:relative;}
      .drop-zone-pdf:hover,.drop-zone.drag-over{border-color:var(--primary-pdf);background:var(--primary-lt-pdf);}
      .drop-zone-pdf input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
      .drop-zone-pdf .dz-icon{font-size:40px;color:var(--primary-pdf);margin-bottom:10px;display:block;}
      .drop-zone-pdf .dz-label{font-size:14px;font-weight:700;color:var(--text-pdf);margin-bottom:4px;}
      .drop-zone-pdf .dz-sub{font-size:12px;color:var(--muted-pdf);}

      .btn-action-pdf{width:100%;padding:13px;background:var(--primary-pdf);color:#fff;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;font-family:inherit;transition:background .15s;margin-top:18px;}
      .btn-action-pdf:hover{background:#b91c1c;}
      .btn-action-pdf:disabled{background:#fca5a5;cursor:not-allowed;}

      .section-heading-pdf{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--muted-pdf);margin-bottom:14px;}
      .page-grid-pdf{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px;margin-top:16px;}
      .page-thumb-pdf{border:2px solid var(--border-pdf);border-radius:8px;overflow:hidden;cursor:pointer;position:relative;transition:border-color .15s;}
      .page-thumb-pdf:hover{border-color:var(--primary-pdf);}
      .page-thumb-pdf.selected{border-color:var(--primary-pdf);background:var(--primary-lt-pdf);}
      .page-thumb-pdf canvas{width:100%;display:block;}
      .page-thumb-pdf .pg-num{font-size:10px;font-weight:700;text-align:center;padding:3px 0;color:var(--muted-pdf);background:var(--bg-pdf);}
      .page-thumb-pdf .pg-check{position:absolute;top:4px;right:4px;width:18px;height:18px;background:var(--primary-pdf);border-radius:50%;display:none;align-items:center;justify-content:center;color:#fff;font-size:10px;}
      .page-thumb-pdf.selected .pg-check{display:flex;}
      .rotate-btn-group-pdf{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
      .rotate-btn-pdf{padding:8px 16px;border:1.5px solid var(--border-pdf);border-radius:8px;background:var(--white-pdf);cursor:pointer;font-size:12px;font-weight:700;color:var(--muted-pdf);display:flex;align-items:center;gap:6px;font-family:inherit;transition:all .15s;}
      .rotate-btn-pdf:hover,.rotate-btn-pdf.active{border-color:var(--primary-pdf);color:var(--primary-pdf);background:var(--primary-lt-pdf);}
      
      .status-box{border-radius:10px;padding:14px 18px;font-size:13px;font-weight:600;margin-top:14px;display:none;}
      .status-box.info{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe;}
      .status-box.success{background:#f0fdf4;color:#15803d;border:1px solid #86efac;}
      .status-box.error{background:#fef2f2;color:#dc2626;border:1px solid #fca5a5;}
      .progress-bar-wrap{background:var(--border);border-radius:999px;height:8px;overflow:hidden;margin-top:8px;}
      .progress-bar-fill{height:100%;border-radius:999px;background:var(--primary);width:0%;transition:width .3s;}

      /* QR Generator */
      .page-hero-qr{background:linear-gradient(135deg,#0891b2 0%,#164e63 100%);color:#fff;padding:40px 0 32px;}
    .page-hero-qr h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
    .calc-card-qr{background:var(--white-qr);border:1px solid var(--border-qr);border-radius:16px;padding:28px;margin-bottom:20px;}
    .content-block-qr{background:var(--white-qr);border:1px solid var(--border-qr);border-radius:14px;padding:28px;margin-bottom:20px;}
    .content-block-qr h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
    .content-block-qr h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
    .content-block-qr p{color:var(--muted-qr);font-size:14px;line-height:1.8;margin-bottom:12px;}


    /* Type selector */
    .type-grid-qr{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:22px;}
    @media(max-width:600px){.type-grid{grid-template-columns:repeat(3,1fr);}}
    .type-btn-qr{display:flex;flex-direction:column;align-items:center;gap:5px;border:1.5px solid var(--border-qr);border-radius:10px;padding:11px 4px;background:var(--white-qr);cursor:pointer;font-size:11.5px;font-weight:700;color:var(--muted-qr);transition:all .15s;font-family:inherit;}
    .type-btn-qr svg{width:22px;height:22px;}
    .type-btn-qr:hover{border-color:var(--primary-qr);background:var(--primary-lt-qr);color:var(--primary-qr);}
    .type-btn-qr.active{border-color:var(--primary-qr);background:var(--primary-lt-qr);color:var(--primary-qr);}
    .section-heading-qr{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--muted-qr);margin-bottom:14px;}
    .placeholder-msg-qr{color:var(--muted-qr);font-size:13px;text-align:center;line-height:1.7;}

     /* Download buttons */
     .btn-dl-green-qr{width:100%;padding:12px;background:#16a34a;color:#fff;border:none;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px;font-family:inherit;margin-bottom:10px;transition:background .15s;}
     .btn-dl-green-qr:hover{background:#15803d;}
     .btn-dl-outline-qr{width:100%;padding:10px;background:var(--white-qr);color:var(--text-qr);border:1.5px solid var(--border-qr);border-radius:10px;font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;font-family:inherit;transition:all .15s;}
     .btn-dl-outline-qr:hover{border-color:var(--primary-qr);color:var(--primary);}
     .color-wrap-qr{display:flex;align-items:center;gap:8px;border:1.5px solid var(--border-qr);border-radius:10px;padding:7px 12px;background:#fafbfd;}
     .color-wrap-qr input[type="color"]{width:26px;height:26px;border:none;background:none;cursor:pointer;padding:0;border-radius:4px;}
     .color-wrap-qr input[type="text"]{border:none;background:none;font-size:13px;width:100%;outline:none;color:var(--text-qr);font-family:monospace;font-weight:700;}

     /* QR Style selector */
    .qr-style-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:18px;}
    .qr-style-btn{border:1.5px solid var(--border-qr);border-radius:8px;padding:8px 4px;background:none;cursor:pointer;font-size:11px;font-weight:700;color:var(--muted-qr);display:flex;flex-direction:column;align-items:center;gap:4px;transition:all .15s;font-family:inherit;}
    .qr-style-btn.active{border-color:var(--primary-qr);background:var(--primary-lt-qr);color:var(--primary-qr);}
    .qr-style-btn svg{width:38px;height:38px;}

    /* Generate button */
    .btn-generate-qr{width:100%;padding:13px;background:var(--primary-qr);color:#fff;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .15s;font-family:inherit;margin-top:8px;}
    .btn-generate-qr:hover{background:#0e7490;}

    .popular-grid-qr{display:grid;grid-template-columns:repeat(3,1fr);gap:4px 16px;}
    @media(max-width:600px){.popular-grid{grid-template-columns:1fr 1fr;}}
    .pop-item-qr{display:flex;align-items:flex-start;gap:9px;padding:8px 0;border-bottom:1px solid var(--border-qr);}
    .pop-item-qr:nth-last-child(-n+3){border-bottom:none;}
    .pop-item-qr strong{font-size:12.5px;display:block;}
    .pop-item-qr span{font-size:11px;color:var(--muted-qr);}

    /* Preview */
    .preview-box-qr{background:#f8faff;border:1.5px solid var(--border-qr);border-radius:12px;padding:22px;display:flex;align-items:center;justify-content:center;min-height:200px;margin-bottom:14px;}
    #qr-output{display:flex;align-items:center;justify-content:center;}
    #qr-output canvas,#qr-output img{border-radius:6px;}
    .placeholder-msg-qr{color:var(--muted-qr);font-size:13px;text-align:center;line-height:1.7;}

    /* JSON CONVERTER */
    /* HERO */
.hero-json-converter { padding: 48px 24px 32px; text-align: center; position: relative; overflow: hidden; }
.hero-json-converter::before { content: ''; position: absolute; top: -60px; left: 50%; transform: translateX(-50%); width: 600px; height: 300px; background: radial-gradient(ellipse, rgba(108,99,255,.2) 0%, transparent 70%); pointer-events: none; }
.hero-tag-json-converter { display: inline-flex; align-items: center; gap: 6px; background: var(--primary-glow-json-converter); border: 1px solid rgba(108,99,255,.3); border-radius: 99px; padding: 4px 14px; font-size: 12px; font-weight: 700; color: var(--primary-json-converter); margin-bottom: 18px; }
.hero-json-converter h1 { font-size: clamp(28px, 4vw, 48px); font-weight: 900; letter-spacing: -0.04em; line-height: 1.1; margin-bottom: 14px; }
.hero-json-converter h1 span.accent { background: linear-gradient(135deg, var(--primary-json-converter), #a855f7); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; }
.hero-json-converter p { color: var(--muted-json-converter); font-size: 15px; max-width: 560px; margin: 0 auto 24px; }
.hero-badges-json-converter { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.hero-badge-json-converter { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: var(--muted-json-converter); }
.hero-badge-json-converter i { color: var(--green-json-converter); }

/* MAIN LAYOUT */
.main-json-converter { max-width: 1400px; margin: 0 auto; padding: 0 20px 60px; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto 1fr; gap: 16px; }
@media (max-width: 900px) { .main-json-converter { grid-template-columns: 1fr; } }

/* PANEL */
.panel-json-converter { background: var(--surface-json-converter); border: 1px solid var(--border-json-converter); border-radius: var(--radius-json-converter); overflow: hidden; }
.panel-header-json-converter { padding: 14px 18px; border-bottom: 1px solid var(--border-json-converter); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.panel-title-json-converter { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 13px;color: #fff; }
.step-badge-json-converter { width: 20px; height: 20px; background: var(--primary-json-converter); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; color: #fff; flex-shrink: 0; }
.panel-actions-json-converter { display: flex; gap: 6px; }
.btn-sm-json-converter { padding: 5px 12px; border-radius: var(--radius-sm-json-converter); border: 1px solid var(--border-json-converter); background: var(--surface2-json-converter); color: var(--muted-json-converter); font-size: 11px; font-weight: 600; cursor: pointer; font-family: var(--sans-json-converter); transition: all .15s; display: flex; align-items: center; gap: 5px; }
.btn-sm-json-converter:hover { border-color: var(--border-light-json-converter); color: var(--text-json-converter); }
.btn-sm-json-converter.danger:hover { border-color: var(--red-json-converter); color: var(--red-json-converter); }

/* EDITOR */
.editor-wrap-json-converter { position: relative; }
#json-input-json-converter { width: 100%; min-height: 340px; max-height: 480px; background: transparent; border: none; outline: none; resize: vertical; font-family: var(--mono-json-converter); font-size: 12.5px; line-height: 1.7; color: var(--text-json-converter); padding: 16px; display: block; }
.editor-footer-json-converter { padding: 8px 18px; border-top: 1px solid var(--border-json-converter); display: flex; align-items: center; justify-content: space-between; font-size: 11px; color: var(--muted-json-converter); }
.status-dot-json-converter { width: 6px; height: 6px; border-radius: 50%; display: inline-block; margin-right: 5px; }
.dot-ok-json-converter { background: var(--green-json-converter); box-shadow: 0 0 6px var(--green-json-converter); }
.dot-err-json-converter { background: var(--red-json-converter); box-shadow: 0 0 6px var(--red-json-converter); }
.dot-idle-json-converter { background: var(--muted2-json-converter); }

/* UPLOAD ZONE */
.upload-zone-json-converter { margin: 12px 18px; border: 2px dashed var(--border-json-converter); border-radius: var(--radius-sm-json-converter); padding: 18px; text-align: center; cursor: pointer; transition: all .2s; position: relative; }
.upload-zone-json-converter input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.upload-zone-json-converter:hover, .upload-zone.drag { border-color: var(--primary-json-converter); background: var(--primary-glow-json-converter); }
.upload-zone-json-converter p { font-size: 12px; color: var(--muted-json-converter); margin-top: 5px; }



/* TABLE PREVIEW */
.preview-wrap-json-converter { overflow: auto; max-height: 360px; }
.data-table-json-converter { width: 100%; border-collapse: collapse; font-size: 12px; }
.data-table-json-converter th { background: var(--surface2-json-converter); color: var(--primary-json-converter); font-weight: 700; padding: 8px 12px; text-align: left; white-space: nowrap; position: sticky; top: 0; border-bottom: 1px solid var(--border-json-converter); font-size: 11px; text-transform: uppercase; letter-spacing: .05em; }
.data-table-json-converter td { padding: 7px 12px; border-bottom: 1px solid var(--border); color: var(--text-json-converter); white-space: nowrap; max-width: 200px; overflow: hidden; text-overflow: ellipsis; }
.data-table-json-converter tr:hover td { background: var(--surface2-json-converter); }
.data-table-json-converter .null-val { color: var(--muted2-json-converter); font-style: italic; }
.data-table-json-converter .bool-t { color: var(--green-json-converter); font-weight: 700; }
.data-table-json-converter .bool-f { color: var(--red-json-converter); font-weight: 700; }
.data-table-json-converter .num-val { color: var(--blue-json-converter); }
.data-table-json-converter .arr-val { color: var(--orange-json-converter); }


/* RAW PREVIEW */
#raw-preview-json-converter { font-family: var(--mono-json-converter); font-size: 11.5px; line-height: 1.7; color: var(--muted-json-converter); padding: 16px; white-space: pre-wrap; word-break: break-all; max-height: 360px; overflow: auto; }



/* STATS BAR */
.stats-bar-json-converter { display: flex; gap: 20px; padding: 10px 18px; border-top: 1px solid var(--border-json-converter); flex-wrap: wrap; }
.stat-json-converter { display: flex; flex-direction: column; gap: 1px; }
.stat-val-json-converter { font-size: 15px; font-weight: 800; color: var(--text-json-converter); }
.stat-key-json-converter { font-size: 10px; font-weight: 600; color: var(--muted-json-converter); text-transform: uppercase; letter-spacing: .05em; }

/* TOOLS PANEL — full width */
.tools-row-json-converter { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.tool-card-json-converter { background: var(--surface-json-converter); border: 1px solid var(--border-json-converter); border-radius: var(--radius-json-converter); padding: 18px; cursor: pointer; transition: all .2s; }
.tool-card-json-converter:hover { border-color: var(--primary-json-converter); transform: translateY(-2px); background: var(--surface2-json-converter); }
.tool-card-json-converter i { font-size: 22px; color: var(--primary-json-converter); display: block; margin-bottom: 8px; }
.tool-card-json-converter h3 { font-size: 13px; font-weight: 700; margin-bottom: 3px; }
.tool-card-json-converter p { font-size: 11px; color: var(--muted-json-converter); line-height: 1.5; }

/* OPTIONS PANEL */
.options-row-json-converter { display: flex; flex-wrap: wrap; gap: 10px; padding: 12px 18px; border-top: 1px solid var(--border-json-converter); }
.opt-group-json-converter { display: flex; flex-direction: column; gap: 4px; min-width: 120px; }
.opt-label-json-converter { font-size: 10px; font-weight: 700; color: var(--muted-json-converter); text-transform: uppercase; letter-spacing: .05em; }
.opt-select-json-converter, .opt-input-json-converter { background: var(--surface2-json-converter); border: 1px solid var(--border-json-converter); border-radius: var(--radius-sm-json-converter); color: var(--text-json-converter); font-family: var(--sans-json-converter); font-size: 12px; font-weight: 500; padding: 6px 10px; outline: none; transition: border-color .15s; }
.opt-select-json-converter:focus, .opt-input-json-converter:focus { border-color: var(--primary-json-converter); }
.opt-input-json-converter { width: 120px; }
.toggle-wrap-json-converter { display: flex; align-items: center; gap: 8px; padding-top: 14px; }
.toggle-json-converter { width: 34px; height: 19px; background: var(--surface2-json-converter); border: 1px solid var(--border-json-converter); border-radius: 99px; cursor: pointer; position: relative; transition: background .2s; flex-shrink: 0; }
.toggle-json-converter.on { background: var(--primary-json-converter); border-color: var(--primary-json-converter); }
.toggle-json-converter::after { content: ''; position: absolute; top: 2px; left: 2px; width: 13px; height: 13px; background: #fff; border-radius: 50%; transition: left .2s; }
.toggle-json-converter.on::after { left: 17px; }
.toggle-label-json-converter { font-size: 12px; font-weight: 600; color: var(--muted-json-converter); cursor: pointer; }



/* EXPORT BUTTONS */
.export-row-json-converter { padding: 16px 18px; display: flex; flex-wrap: wrap; gap: 10px; border-top: 1px solid var(--border-json-converter); }
.btn-export-json-converter { display: flex; align-items: center; gap: 8px; padding: 10px 20px; border-radius: var(--radius-sm-json-converter); border: none; font-family: var(--sans-json-converter); font-size: 13px; font-weight: 700; cursor: pointer; transition: all .15s; }
.btn-xlsx-json-converter { background: linear-gradient(135deg, #16a34a, #15803d); color: #fff; }
.btn-xlsx-json-converter:hover { background: linear-gradient(135deg, #22c55e, #16a34a); transform: translateY(-1px); }
.btn-csv-json-converter { background: linear-gradient(135deg, #2563eb, #1d4ed8); color: #fff; }
.btn-csv-json-converter:hover { background: linear-gradient(135deg, #3b82f6, #2563eb); transform: translateY(-1px); }
.btn-tsv-json-converter { background: linear-gradient(135deg, #7c3aed, #6d28d9); color: #fff; }
.btn-tsv-json-converter:hover { transform: translateY(-1px); }
.btn-xml-json-converter { background: linear-gradient(135deg, #b45309, #92400e); color: #fff; }
.btn-xml-json-converter:hover { transform: translateY(-1px); }
.btn-sql-json-converter { background: linear-gradient(135deg, #0f766e, #0d9488); color: #fff; }
.btn-sql-json-converter:hover { transform: translateY(-1px); }
.btn-html-exp-json-converter { background: linear-gradient(135deg, #9333ea, #7e22ce); color: #fff; }
.btn-html-exp-json-converter:hover { transform: translateY(-1px); }
.btn-markdown-json-converter { background: linear-gradient(135deg, #374151, #1f2937); color: #fff; border: 1px solid var(--border-light-json-converter); }
.btn-markdown-json-converter:hover { transform: translateY(-1px); }
.btn-copy-json-converter { background: var(--surface2-json-converter); color: var(--text-json-converter); border: 1px solid var(--border-json-converter); }
.btn-copy-json-converter:hover { border-color: var(--border-light-json-converter); transform: translateY(-1px); }


/* TOAST */
.toast-json-converter { position: fixed; bottom: 24px; right: 24px; background: var(--surface2-json-converter); border: 1px solid var(--border-json-converter); border-radius: var(--radius-sm-json-converter); padding: 12px 18px; font-size: 13px; font-weight: 600; color: var(--text-json-converter); z-index: 300; display: flex; align-items: center; gap: 8px; transform: translateY(100px); opacity: 0; transition: all .3s; max-width: 320px; box-shadow: var(--shadow-json-converter); }
.toast-json-converter.show { transform: translateY(0); opacity: 1; }
.toas-json-convertert.ok i { color: var(--green-json-converter); }
.toast-json-converter.err i { color: var(--red-json-converter); }

/* ERROR BOX */
.err-box-json-converter { margin: 0 18px 12px; background: rgba(239,68,68,.08); border: 1px solid rgba(239,68,68,.25); border-radius: var(--radius-sm-json-converter); padding: 10px 14px; font-size: 12px; color: #fca5a5; display: none; }



/* VIEW TOGGLE */
.view-toggle-json-converter { display: flex; gap: 4px; }
.vtab-json-converter { padding: 4px 10px; border-radius: 6px; border: 1px solid transparent; font-size: 11px; font-weight: 600; cursor: pointer; color: var(--muted-json-converter); background: none; font-family: var(--sans-json-converter); transition: all .15s; }
.vtab-json-converter.active { background: var(--primary-json-converter); color: #fff; border-color: var(--primary-json-converter); }


/* MODAL */
.modal-bg-json-converter { position: fixed; inset: 0; background: rgba(0,0,0,.7); backdrop-filter: blur(4px); z-index: 200; display: none; align-items: center; justify-content: center; padding: 20px; }
.modal-bg-json-converter.show { display: flex; }
.modal-json-converter { background: var(--surface-json-converter); border: 1px solid var(--border-json-converter); border-radius: 16px; width: 100%; max-width: 560px; max-height: 80vh; overflow-y: auto; }
.modal-header-json-converter { padding: 18px 20px; border-bottom: 1px solid var(--border-json-converter); display: flex; align-items: center; justify-content: space-between; }
.modal-header-json-converter h2 { font-size: 16px; font-weight: 700; }
.modal-close-json-converter { background: none; border: none; color: var(--muted-json-converter); font-size: 20px; cursor: pointer; }
.modal-body-json-converter { padding: 20px; }
.modal-body-json-converter pre { background: var(--bg-json-converter); border-radius: var(--radius-sm-json-converter); padding: 16px; font-family: var(--mono-json-converter); font-size: 11px; color: var(--muted-json-converter); overflow-x: auto; white-space: pre-wrap; max-height: 300px; overflow-y: auto; }


/* SECTION LABEL */
.section-label-json-converter { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; color: var(--muted2-json-converter); padding: 14px 18px 8px; }

/* SCROLLBAR */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-light-json-converter); border-radius: 99px; }
::-webkit-scrollbar-thumb:hover { background: var(--muted2-json-converter); }


/* DUMMY DATA GENERATOR */

 /* ── HERO ── */
 .page-hero-dummy-data{background:linear-gradient(135deg,#dc2626 0%,#7f1d1d 100%);color:#fff;padding:40px 0 32px;}
 .page-hero-dummy-data h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
 .breadcrumb-item-dummy-data a{color:rgba(255,255,255,.8);text-decoration:none;}
 .breadcrumb-item-dummy-data.active{color:rgba(255,255,255,.6);}
 .breadcrumb-item-dummy-data+.breadcrumb-item-dummy-data::before{color:rgba(255,255,255,.4);}


    /* ── TOOL TABS ── */
    .tool-tabs-dummy-data{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:24px;}
    .tool-tab-dummy-data{display:flex;align-items:center;gap:7px;padding:9px 16px;border:1.5px solid var(--border-dummy-data);border-radius:10px;background:var(--white-dummy-data);cursor:pointer;font-size:13px;font-weight:700;color:var(--muted-dummy-data);transition:all .15s;font-family:inherit;}
    .tool-tab-dummy-data i{font-size:15px;}
    .tool-tab-dummy-data:hover{border-color:var(--primary-dummy-data);color:var(--primary-dummy-data);background:var(--primary-lt-dummy-data);}
    .tool-tab-dummy-data.active{border-color:var(--primary-dummy-data);background:var(--primary-lt-dummy-data);color:var(--primary-dummy-data);}

    /* ── CARDS ── */
    .calc-card-dummy-data{background:var(--white-dummy-data);border:1px solid var(--border-dummy-data);border-radius:16px;padding:28px;margin-bottom:20px;}
    .content-block-dummy-data{background:var(--white-dummy-data);border:1px solid var(--border-dummy-data);border-radius:14px;padding:28px;margin-bottom:20px;}
    .content-block-dummy-data h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
    .content-block-dummy-data h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
    .content-block-dummy-data p{color:var(--muted-dummy-data);font-size:14px;line-height:1.8;margin-bottom:12px;}

    /* ── PANELS ── */
    .tool-panel-dummy-data{display:none;}
    .tool-panel-dummy-data.active{display:block;}
    .tool-title-dummy-data{font-size:18px;font-weight:800;letter-spacing:-0.02em;margin-bottom:4px;}
    .tool-desc-dummy-data{font-size:13px;color:var(--muted-dummy-data);margin-bottom:22px;}
    .section-heading-dummy-data{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--muted-dummy-data);margin-bottom:14px;}

     /* ── PRIVACY BADGE ── */
     .privacy-badge-dummy-data{display:inline-flex;align-items:center;gap:6px;background:#f0fdf4;border:1px solid #86efac;border-radius:999px;padding:4px 12px;font-size:11px;font-weight:700;color:#15803d;margin-bottom:18px;}

      /* ── TEMPLATE CARDS ── */
    .template-grid-dummy-data{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;margin-bottom:22px;}
    .tmpl-card-dummy-data{background:var(--white-dummy-data);border:1.5px solid var(--border-dummy-data);border-radius:12px;padding:16px;cursor:pointer;transition:all .15s;text-align:center;}
    .tmpl-card-dummy-data:hover{border-color:var(--primary-dummy-data);background:var(--primary-lt-dummy-data);transform:translateY(-2px);}
    .tmpl-card-dummy-data i{font-size:26px;color:var(--primary-dummy-data);display:block;margin-bottom:6px;}
    .tmpl-card-dummy-data .tc-name{font-size:12px;font-weight:700;}
    .tmpl-card-dummy-data .tc-fields{font-size:11px;color:var(--muted-dummy-data);margin-top:2px;}


      /* ── RECORD SLIDER ── */
    .record-slider-wrap-dummy-data{background:var(--bg-dummy-data);border:1px solid var(--border-dummy-data);border-radius:12px;padding:16px 20px;}
      input[class="range-dummy-data"]{accent-color:var(--primary-dummy-data);width:100%;}
      .slider-labels-dummy-data{display:flex;justify-content:space-between;font-size:11px;color:var(--muted-dummy-data);font-weight:600;margin-top:4px;}
      .stat-mini-dummy-data{background:var(--primary-lt-dummy-data);border:1px solid var(--primary-mid-dummy-data);border-radius:10px;padding:12px 16px;text-align:center;}
      .stat-mini-dummy-data .sv{font-size:20px;font-weight:800;color:var(--primary-dummy-data);letter-spacing:-0.02em;}
      .stat-mini-dummy-data .sl{font-size:11px;color:var(--muted-dummy-data);font-weight:600;margin-top:2px;}
  
        /* ── SCHEMA TABLE ── */
    .schema-table-dummy-data{width:100%;border-collapse:collapse;font-size:13px;}
    .schema-table-dummy-data th{background:var(--bg);padding:9px 10px;text-align:left;font-weight:700;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--border);}
    .schema-table-dummy-data td{padding:9px 10px;border-bottom:1px solid var(--border);vertical-align:middle;}
    .schema-table-dummy-data tr:last-child td{border-bottom:none;}
    .schema-table-dummy-data tr:hover td{background:var(--bg);}
    .drag-handle-dummy-data{cursor:grab;color:#ccc;font-size:16px;user-select:none;}
    .type-pill-dummy-data{display:inline-flex;align-items:center;gap:5px;background:var(--primary-lt-dummy-data);border:1px solid var(--primary-mid-dummy-data);border-radius:6px;padding:3px 8px;font-size:11px;font-weight:700;color:var(--primary-dummy-data);}
    .options-pill-dummy-data{display:inline-block;background:var(--bg);border:1px solid var(--border-dummy-data);border-radius:5px;padding:2px 7px;font-size:11px;font-weight:600;color:var(--muted-dummy-data);}
    .field-action-btn-dummy-data{background:none;border:none;cursor:pointer;color:var(--muted-dummy-data);font-size:15px;padding:2px 4px;transition:color .12s;line-height:1;}
    .field-action-btn-dummy-data:hover{color:var(--primary-dummy-data);}
    .field-action-btn-dummy-data.del:hover{color:#ef4444;}


    /* ── BUTTONS ── */
    .btn-action-dummy-data{width:100%;padding:13px;background:var(--primary-dummy-data);color:#fff;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;font-family:inherit;transition:background .15s;margin-top:18px;}
    .btn-action-dummy-data:hover{background:#b91c1c;}
    .btn-action-dummy-data:disabled{background:#fca5a5;cursor:not-allowed;}
    .btn-sm-action-dummy-data{padding:7px 14px;border:1.5px solid var(--border);border-radius:8px;background:var(--white-dummy-data);cursor:pointer;font-size:12px;font-weight:700;color:var(--text-dummy-data);font-family:inherit;display:inline-flex;align-items:center;gap:5px;transition:all .15s;}
    .btn-sm-action-dummy-data:hover{border-color:var(--primary-dummy-data);color:var(--primary-dummy-data);background:var(--primary-lt-dummy-data);}
    .btn-sm-action-dummy-data.red{background:var(--primary-dummy-data);color:#fff;border-color:var(--primary-dummy-data);}
    .btn-sm-action-dummy-data.red:hover{background:#b91c1c;}

     /* ── VIEW TABS ── */
     .view-tabs-dummy-data{display:flex;gap:4px;background:var(--bg-dummy-data);border:1px solid var(--border-dummy-data);border-radius:8px;padding:3px;width:fit-content;margin-bottom:14px;}
     .view-tab-dummy-data{padding:5px 14px;border:none;background:transparent;border-radius:6px;font-size:12px;font-weight:700;color:var(--muted-dummy-data);cursor:pointer;font-family:inherit;transition:all .15s;}
     .view-tab-dummy-data.active{background:var(--white-dummy-data);color:var(--primary-dummy-data);box-shadow:0 1px 3px rgba(0,0,0,.1);}
 
       /* ── ADD FIELD MODAL ── */
    .modal-overlay-dummy-data{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:2000;align-items:center;justify-content:center;}
    .modal-overlay-dummy-data.open{display:flex;}
    .modal-box-dummy-data{background:var(--white-dummy-data);border-radius:16px;padding:26px;width:420px;max-width:95vw;box-shadow:0 20px 60px rgba(0,0,0,.2);}
    .modal-box-dummy-data h3{font-size:16px;font-weight:800;margin-bottom:18px;}
    .modal-actions-dummy-data{display:flex;gap:8px;justify-content:flex-end;margin-top:18px;}

     /* ── GEN OVERLAY ── */
     .gen-overlay-dummy-data{display:none;position:fixed;inset:0;background:rgba(127,29,29,.65);z-index:3000;align-items:center;justify-content:center;flex-direction:column;gap:16px;}
     .gen-overlay-dummy-data.open{display:flex;}
     .gen-spinner-dummy-data{width:50px;height:50px;border:5px solid rgba(255,255,255,.25);border-top-color:#fff;border-radius:50%;animation:spin .75s linear infinite;}
     @keyframes spin{to{transform:rotate(360deg);}}
     .gen-label-dummy-data{color:#fff;font-size:16px;font-weight:800;letter-spacing:-.01em;}
 
     /* ── TOAST ── */
     .toast-wrap-dummy-data{position:fixed;bottom:22px;right:22px;z-index:4000;}
     .toast-msg-dummy-data{background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:700;box-shadow:0 4px 20px rgba(0,0,0,.25);transform:translateY(60px);opacity:0;transition:all .3s;margin-top:8px;}
     .toast-msg-dummy-data.show{transform:translateY(0);opacity:1;}

      /* ── EXPORT BUTTONS ── */
    .export-grid-dummy-data{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
    .exp-btn-dummy-data{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;border:1.5px solid var(--border-dummy-data);border-radius:10px;cursor:pointer;font-size:11px;font-weight:700;color:var(--muted-dummy-data);background:var(--white-dummy-data);transition:all .15s;font-family:inherit;}
    .exp-btn-dummy-data i{font-size:20px;}
    .exp-btn-dummy-data:hover{border-color:var(--primary-dummy-data);color:var(--primary-dummy-data);background:var(--primary-lt-dummy-data);transform:translateY(-1px);}

     /* ── CODE BLOCK ── */
     .code-block-dummy-data{background:#1e1b2e;border-radius:10px;padding:16px;overflow-x:auto;font-family:'Courier New',monospace;font-size:12px;line-height:1.7;color:#e2e8f0;position:relative;max-height:320px;overflow-y:auto;}
     .code-block-dummy-data .json-key{color:#a78bfa;}
     .code-block-dummy-data .json-str{color:#6ee7b7;}
     .code-block-dummy-data .json-num{color:#fcd34d;}
     .code-block-dummy-data .json-bool{color:#f87171;}
     .code-block-dummy-data .sql-kw{color:#c084fc;}
     .copy-code-btn-dummy-data{position:absolute;top:10px;right:10px;background:rgba(255,255,255,.12);color:#e2e8f0;border:none;border-radius:6px;padding:4px 10px;font-size:11px;cursor:pointer;font-family:inherit;}
     .copy-code-btn-dummy-data:hover{background:rgba(255,255,255,.22);}

       /* ── DATA PREVIEW TABLE ── */
    .data-table-wrap-dummy-data{overflow-x:auto;border:1px solid var(--border-dummy-data);border-radius:10px;}
    .data-tbl-dummy-data{width:100%;border-collapse:collapse;font-size:12px;min-width:600px;}
    .data-tbl-dummy-data th{background:var(--bg-dummy-data);padding:8px 12px;text-align:left;font-weight:700;color:var(--muted-dummy-data);font-size:11px;border-bottom:1px solid var(--border-dummy-data);white-space:nowrap;position:sticky;top:0;}
    .data-tbl-dummy-data td{padding:7px 12px;border-bottom:1px solid var(--border);white-space:nowrap;max-width:160px;overflow:hidden;text-overflow:ellipsis;}
    .data-tbl-dummy-data tr:last-child td{border-bottom:none;}
    .data-tbl-dummy-data tr:hover td{background:var(--bg-dummy-data);}
    .badge-true-dummy-data{background:#dcfce7;color:#15803d;padding:1px 7px;border-radius:999px;font-size:10px;font-weight:700;}
    .badge-false-dummy-data{background:#fee2e2;color:#dc2626;padding:1px 7px;border-radius:999px;font-size:10px;font-weight:700;}


  /* ── PAGINATION ── */
  .pg-wrap-dummy-data{display:flex;align-items:center;gap:5px;flex-wrap:wrap;margin-top:12px;}
  .pg-btn-dummy-data{padding:4px 10px;border:1.5px solid var(--border-dummy-data);border-radius:7px;background:var(--white-dummy-data);cursor:pointer;font-size:12px;font-weight:700;color:var(--text-dummy-data);font-family:inherit;transition:all .15s;}
  .pg-btn-dummy-data:hover,.pg-btn.active{background:var(--primary-dummy-data);color:#fff;border-color:var(--primary-dummy-data);}
  .pg-info-dummy-data{font-size:12px;color:var(--muted-dummy-data);margin-left:auto;}



/* RESUME GENERATOR */

.page-hero-resume-generator { background:linear-gradient(135deg,#1f4e3d 0%,#065f46 100%);color:#fff;padding:40px 0 32px;} 
  .page-hero-resume-generator h1 { font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em; }
  .page-hero-resume-generator p { font-size:15px; opacity:.85; }


/* ---------- App shell ---------- */
.app-resume-generator{display:grid;grid-template-columns:380px 1fr;min-height:100vh;}
.sidebar-resume-generator{background:var(--panel-resume-generator);border-right:1px solid var(--line-resume-generator);overflow-y:auto;max-height:100vh;padding:24px;}
.stage-resume-generator{padding:32px;overflow-y:auto;max-height:100vh;display:flex;flex-direction:column;align-items:center;gap:20px;}

.brand-resume-generator{display:flex;align-items:center;gap:10px;margin-bottom:18px;}
.brand-resume-generator .mark{width:30px;height:30px;border-radius:7px;background:var(--accent-resume-generator);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:14px;font-family:Georgia,serif;}
.brand-resume-generator h1{font-size:17px;letter-spacing:.2px;}

.section-block-resume-generator{margin-bottom:22px;border-bottom:1px solid var(--line-resume-generator);padding-bottom:18px;}
.section-block-resume-generator:last-child{border-bottom:none;}
.section-title-resume-generator{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-resume-generator);font-weight:600;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;}

.field-resume-generator{margin-bottom:10px;}
.field-resume-generator label{display:block;font-size:12px;color:var(--muted-resume-generator);margin-bottom:4px;}
.field-resume-generator input,.field, textarea{
  width:100%;padding:9px 10px;border:1px solid var(--line-resume-generator);border-radius:7px;
  font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink-resume-generator);
}
.field-resume-generator textarea{resize:vertical;min-height:60px;line-height:1.4;}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:8px;}

.entry-card-resume-generator{border:1px solid var(--line-resume-generator);border-radius:9px;padding:12px;margin-bottom:10px;background:#fbfbf9;position:relative;}
.entry-card-resume-generator .remove-btn{position:absolute;top:8px;right:8px;background:none;border:none;color:#b3473c;font-size:12px;cursor:pointer;font-weight:600;}
.add-btn-resume-generator{
  width:100%;padding:9px;border:1px dashed #b9b6ac;border-radius:7px;background:none;
  color:var(--accent-resume-generator);font-size:13px;font-weight:600;cursor:pointer;margin-top:4px;
}
.add-btn-resume-generator:hover{background:#f1f5f2;}

.tmpl-grid-resume-generator{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:8px;}
.tmpl-card-resume-generator{border:2px solid var(--line-resume-generator);border-radius:8px;padding:6px 4px;text-align:center;cursor:pointer;font-size:11px;color:var(--muted-resume-generator);background:#fff;}
.tmpl-card-resume-generator.active{border-color:var(--accent-resume-generator);color:var(--accent-resume-generator);font-weight:700;}
.tmpl-swatch-resume-generator{height:34px;border-radius:5px;margin-bottom:5px;}
.sw-classic-resume-generator{background:linear-gradient(180deg,#1f4e3d 0 28%,#fff 28%);}
.sw-modern-resume-generator{background:linear-gradient(90deg,#1c1f26 0 32%,#fff 32%);}
.sw-minimal-resume-generator{background:#fff;border:1px solid #ddd;}

.toolbar-resume-generator{width:100%;max-width:780px;display:flex;justify-content:space-between;align-items:center;}
.toolbar-resume-generator .hint{font-size:12.5px;color:var(--muted-resume-generator);}
.dl-btn-resume-generator{
  background:var(--accent-resume-generator);color:#fff;border:none;padding:11px 20px;border-radius:8px;
  font-size:13.5px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:8px;
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}
.dl-btn-resume-generator:hover{background:#193f32;}

/* ---------- Resume paper ---------- */
.paper-wrap{width:100%;max-width:780px;}
#resumePaper{
  width:780px;min-height:1010px;background:#fff;box-shadow:0 8px 30px rgba(0,0,0,.12);
  font-family:Georgia,'Times New Roman',serif;color:#1f2126;
}

/* ===== Classic template ===== */
.tpl-classic-resume-generator{padding:46px 54px;}
.tpl-classic-resume-generator .head{text-align:center;border-bottom:3px solid var(--accent-resume-generator);padding-bottom:14px;margin-bottom:18px;}
.tpl-classic-resume-generator .head h1{font-size:30px;letter-spacing:.5px;color:#16261f;}
.tpl-classic-resume-generator .head .role{font-size:14px;color:var(--accent-resume-generator);margin-top:4px;font-style:italic;}
.tpl-classic-resume-generator .contactline{font-family:Arial,sans-serif;font-size:11.5px;color:#444;margin-top:8px;letter-spacing:.2px;}
.tpl-classic-resume-generator .contactline span:not(:last-child)::after{content:"  •  ";color:#aaa;}
.tpl-classic-resume-generator h2.sec{font-family:Arial,sans-serif;font-size:12.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-resume-generator);border-bottom:1px solid #ccc6b8;padding-bottom:4px;margin:18px 0 10px;}
.tpl-classic-resume-generator .item{margin-bottom:12px;}
.tpl-classic-resume-generator .item-top{display:flex;justify-content:space-between;font-family:Arial,sans-serif;}
.tpl-classic-resume-generator .item-top .t1{font-weight:700;font-size:13.5px;color:#1c1f26;}
.tpl-classic-resume-generator .item-top .t2{font-size:12px;color:var(--muted-resume-generator);font-style:italic;}
.tpl-classic-resume-generator .item-sub{font-family:Arial,sans-serif;font-size:12px;color:var(--accent2-resume-generator);margin-top:1px;font-weight:600;}
.tpl-classic-resume-generator .item p{font-family:Arial,sans-serif;font-size:12.5px;color:#333;margin:5px 0 0;line-height:1.5;white-space:pre-line;}
.tpl-classic-resume-generator .skills-wrap{display:flex;flex-wrap:wrap;gap:7px;}
.tpl-classic-resume-generator .skill-pill{font-family:Arial,sans-serif;font-size:11.5px;border:1px solid #c9c4b6;padding:3px 10px;border-radius:20px;color:#3a3a3a;}
.tpl-classic-resume-generator .summary{font-family:Arial,sans-serif;font-size:12.8px;line-height:1.55;color:#333;}

/* ===== Modern template (sidebar) ===== */
.tpl-modern{display:grid;grid-template-columns:255px 1fr;min-height:1010px;font-family:Arial,sans-serif;}
.tpl-modern .side{background:#1c1f26;color:#eceae3;padding:36px 26px;}
.tpl-modern .side h1{font-size:23px;line-height:1.2;color:#fff;}
.tpl-modern .side .role{font-size:12.5px;color:#b9d7c6;margin-top:5px;letter-spacing:.03em;text-transform:uppercase;}
.tpl-modern .side .blk{margin-top:26px;}
.tpl-modern .side .blk h3{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#9aa39c;margin-bottom:8px;border-bottom:1px solid #3a3f3a;padding-bottom:5px;}
.tpl-modern .side .contact-line{font-size:11.5px;margin-bottom:6px;color:#dad7cd;word-break:break-word;}
.tpl-modern .side .skill-pill{display:inline-block;background:#2c3530;color:#cfe8d8;font-size:11px;padding:3px 9px;border-radius:5px;margin:0 5px 6px 0;}
.tpl-modern .main{padding:38px 34px;}
.tpl-modern .main h2.sec{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:#1c1f26;margin:0 0 12px;padding-bottom:6px;border-bottom:2px solid #1f4e3d;}
.tpl-modern .main .section-gap{margin-bottom:22px;}
.tpl-modern .item-top{display:flex;justify-content:space-between;}
.tpl-modern .item-top .t1{font-weight:700;font-size:13.5px;}
.tpl-modern .item-top .t2{font-size:11.5px;color:var(--muted);}
.tpl-modern .item-sub{font-size:12px;color:var(--accent);font-weight:700;margin-top:1px;}
.tpl-modern .item p{font-size:12.3px;color:#333;margin:5px 0 0;line-height:1.5;white-space:pre-line;}
.tpl-modern .summary{font-size:12.6px;line-height:1.55;color:#333;}
.tpl-modern .item{margin-bottom:14px;}

/* ===== Minimal template ===== */
.tpl-minimal{padding:50px 58px;font-family:'Helvetica Neue',Arial,sans-serif;}
.tpl-minimal .head h1{font-size:27px;font-weight:300;letter-spacing:.04em;color:#111;}
.tpl-minimal .head .role{font-size:13px;color:#777;margin-top:3px;letter-spacing:.05em;}
.tpl-minimal .contactline{font-size:11px;color:#888;margin-top:10px;}
.tpl-minimal .contactline span:not(:last-child)::after{content:" / ";color:#ccc;}
.tpl-minimal h2.sec{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#111;margin:24px 0 12px;font-weight:700;}
.tpl-minimal .item{margin-bottom:14px;}
.tpl-minimal .item-top{display:flex;justify-content:space-between;}
.tpl-minimal .item-top .t1{font-weight:600;font-size:13px;color:#111;}
.tpl-minimal .item-top .t2{font-size:11px;color:#999;}
.tpl-minimal .item-sub{font-size:11.5px;color:#555;margin-top:1px;}
.tpl-minimal .item p{font-size:12px;color:#444;margin:6px 0 0;line-height:1.6;white-space:pre-line;}
.tpl-minimal .summary{font-size:12.3px;line-height:1.65;color:#444;}
.tpl-minimal .skills-wrap{display:flex;flex-wrap:wrap;gap:18px;}
.tpl-minimal .skill-pill{font-size:11.5px;color:#333;border-bottom:1px solid #ddd;padding-bottom:1px;}
.tpl-minimal .head{border-bottom:1px solid #e5e5e5;padding-bottom:16px;}

@media (max-width:980px){
  .app{grid-template-columns:1fr;}
  .sidebar{max-height:none;border-right:none;border-bottom:1px solid var(--line-resume-generator);}
  .stage{max-height:none;}
  #resumePaper{width:100%;min-width:340px;transform:none;}
}
@media print{
  body *{visibility:hidden;}
  #resumePaper,#resumePaper *{visibility:visible;}
  #resumePaper{position:absolute;left:0;top:0;box-shadow:none;width:100%;}
}
.content-block-resume-generator{background:var(--white-pf);border:1px solid var(--border-pf);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block--resume-generator h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-resume-generator h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-resume-generator p{color:var(--muted-pf);font-size:14px;line-height:1.8;margin-bottom:12px;}

/* TIMESTAMP CONVERTER */
.page-hero-timestamp{background:linear-gradient(135deg,#0d9488 0%,#115e59 100%);color:#fff;padding:32px 0 26px;}
.page-hero-timestamp h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-timestamp{background:var(--white-timestamp);border:1px solid var(--border-timestamp);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-timestamp h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.live-clock-timestamp{background:linear-gradient(135deg,#0d9488,#115e59);border-radius:14px;color:#fff;padding:22px;text-align:center;}
.live-clock-timestamp .ts{font-size:30px;font-weight:800;font-family:'JetBrains Mono',monospace;letter-spacing:-0.01em;}
.live-clock-timestamp .sub{font-size:12.5px;opacity:.85;margin-top:4px;}
.tab-pane-timestamp{display:none;}
.tab-pane-timestamp.active{display:block;}
.nav-tabs-custom-timestamp{display:flex;gap:6px;border-bottom:1.5px solid var(--border-timestamp);margin-bottom:18px;}
.nav-tabs-custom-timestamp .tab{padding:9px 4px;font-size:13px;font-weight:700;color:var(--muted-timestamp);cursor:pointer;border-bottom:2.5px solid transparent;margin-right:14px;}
.nav-tabs-custom-timestamp .tab.active{color:var(--primary-timestamp);border-color:var(--primary-timestamp);}

.btn-primary-custom-timestamp{background:linear-gradient(135deg,#0d9488,#115e59);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:13.5px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-timestamp:hover{opacity:.9;}
.btn-outline-custom-timestamp{background:var(--white-timestamp);border:1.5px solid var(--border-timestamp);border-radius:9px;padding:7px 12px;font-size:12.5px;font-weight:700;color:var(--text-timestamp);cursor:pointer;}
.btn-outline-custom-timestamp:hover{border-color:var(--primary-timestamp);color:var(--primary-timestamp);}
.input-group-unit{display:flex;gap:8px;}

.unit-toggle-timestamp{display:flex;border:1.5px solid var(--border-timestamp);border-radius:10px;overflow:hidden;}
.unit-toggle-timestamp button{flex:1;border:none;background:var(--white-timestamp);padding:8px 10px;font-size:12px;font-weight:700;color:var(--muted-timestamp);cursor:pointer;font-family:inherit;}
.unit-toggle-timestamp button.active{background:var(--primary-timestamp);color:#fff;}

.result-row-timestamp{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--bg-timestamp);border:1px solid var(--border-timestamp);border-radius:10px;padding:11px 14px;margin-bottom:8px;}
.result-row-timestamp .k{font-size:11.5px;font-weight:700;color:var(--muted-timestamp);text-transform:uppercase;letter-spacing:.04em;min-width:120px;}
.result-row-timestamp .v{font-size:13.5px;font-weight:700;font-family:'JetBrains Mono',monospace;text-align:right;word-break:break-all;}
.copy-btn-timestamp{width:28px;height:28px;border-radius:7px;border:1.5px solid var(--border-timestamp);background:var(--white-timestamp);display:flex;align-items:center;justify-content:center;color:var(--muted-timestamp);cursor:pointer;font-size:12px;flex-shrink:0;}
.copy-btn-timestamp:hover{border-color:var(--primary-timestamp);color:var(--primary-timestamp);}
.copy-btn-timestamp.copied{border-color:#16a34a;color:#16a34a;}

.bf-table-timestamp{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-timestamp th{background:var(--primary-lt-timestamp);color:var(--primary-dk-timestamp);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-timestamp td{padding:9px 14px;border-bottom:1px solid var(--border-timestamp);font-family:'JetBrains Mono',monospace;font-size:12.5px;}
.bf-table-timestamp tr:nth-child(even) td{background:var(--bg-timestamp);}
.tz-pill-timestamp{font-size:11px;font-weight:700;color:var(--primary-timestamp);background:var(--primary-lt-timestamp);border-radius:7px;padding:2px 8px;}


/* AI LOGO GENERATOR */
.page-hero-ai-logo{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);;color:#fff;padding:32px 0 26px;}
.page-hero-ai-logo h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-ai-logo{background:var(--white-ai-logo);border:1px solid var(--border-ai-logo);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-ai-logo h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.logo-grid-ai-logo{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
@media(max-width:560px){.logo-grid{grid-template-columns:1fr;}}
.logo-card-ai-logo{background:var(--white-ai-logo);border:1.5px solid var(--border-ai-logo);border-radius:14px;padding:0;overflow:hidden;transition:box-shadow .15s,border-color .15s;cursor:pointer;}
.logo-card-ai-logo:hover{border-color:var(--accent-ai-logo);box-shadow:0 6px 18px rgba(124,58,237,.1);}
.logo-card-ai-logo .stage{height:160px;display:flex;align-items:center;justify-content:center;padding:18px;}
.logo-card-ai-logo .stage svg{max-width:100%;max-height:100%;}
.logo-card-ai-logo .bar{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;border-top:1px solid var(--border-ai-logo);background:var(--bg-ai-logo);}
.logo-card-ai-logo .bar .lbl{font-size:11px;font-weight:700;color:var(--muted-ai-logo);}
.style-chip-ai-logo{border:1.5px solid var(--border-ai-logo);border-radius:10px;padding:9px 6px;text-align:center;cursor:pointer;font-size:11.5px;font-weight:700;}
.style-chip-ai-logo.active{border-color:var(--primary);background:var(--primary-lt-ai-logo);color:var(--primary-ai-logo);}
.style-chip-ai-logo i{display:block;font-size:18px;margin-bottom:3px;}

.palette-swatch-ai-logo{display:flex;gap:3px;height:28px;border-radius:8px;overflow:hidden;cursor:pointer;border:2px solid transparent;}
.palette-swatch-ai-logo.active{border-color:#111827;}
.palette-swatch-ai-logo span{flex:1;}
.icon-pick-ai-logo{width:42px;height:42px;border-radius:9px;border:1.5px solid var(--border-ai-logo);display:flex;align-items:center;justify-content:center;font-size:17px;cursor:pointer;color:var(--muted-ai-logo);}
.icon-pick-ai-logo.active{border-color:var(--primary-ai-logo);background:var(--primary-lt-ai-logo);color:var(--primary-ai-logo);}
.btn-primary-custom-ai-logo{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:12px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;width:100%;}
.btn-primary-custom-ai-logo:hover{opacity:.9;}

.empty-state-ai-logo{text-align:center;color:var(--muted-ai-logo);font-size:13px;padding:60px 16px;}
.modal-backdrop-custom-ai-logo{position:fixed;inset:0;background:rgba(17,24,39,.6);display:none;align-items:center;justify-content:center;z-index:1000;padding:16px;}
.modal-backdrop-custom-ai-logo.show{display:flex;}
.modal-box-ai-logo{background:var(--white-ai-logo);border-radius:16px;padding:26px;max-width:420px;width:100%;text-align:center;}
.modal-box-ai-logo .stage-big{height:220px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;border:1px solid var(--border-ai-logo);border-radius:12px;}
.btn-outline-custom-ai-logo{background:var(--white-ai-logo);border:1.5px solid var(--border-ai-logo);border-radius:9px;padding:7px 12px;font-size:12.5px;font-weight:700;color:var(--text-ai-logo);cursor:pointer;}
.btn-outline-custom-ai-logo:hover{border-color:var(--primary-ai-logo);color:var(--primary-ai-logo);}

/* CSS GRADIENT GENERATOR */


/* HERO */
.hero-css-gradient{padding:60px 32px 40px;text-align:center;position:relative;overflow:hidden;}
.hero-css-gradient::before{content:'';position:absolute;top:-80px;left:50%;transform:translateX(-50%);width:600px;height:400px;background:radial-gradient(ellipse,rgba(124,58,237,.18) 0%,transparent 70%);pointer-events:none;}
.hero-css-gradient h1{font-size:clamp(28px,5vw,52px);font-weight:900;letter-spacing:-0.04em;background:linear-gradient(135deg,#fff 0%,#a78bfa 50%,#06b6d4 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.1;margin-bottom:12px;}
.hero-css-gradient p{color:var(--muted-css-gradient);font-size:16px;max-width:500px;margin:0 auto;}

/* MAIN LAYOUT */
.app-css-gradient{max-width:1100px;margin:0 auto;padding:0 24px 60px;display:grid;grid-template-columns:320px 1fr;gap:24px;}
@media(max-width:768px){.app{grid-template-columns:1fr;}}

/* PANEL */
.panel-css-gradient{background:var(--surface-css-gradient);border:1px solid var(--border-css-gradient);border-radius:16px;padding:24px;}
.panel-title-css-gradient{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-css-gradient);margin-bottom:20px;}

/* TYPE SELECTOR */
.type-tabs-css-gradient{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:24px;}
.type-tab-css-gradient{padding:10px 6px;border:1px solid var(--border-css-gradient);border-radius:10px;background:transparent;color:var(--muted-css-gradient);font-family:'Inter',sans-serif;font-size:12px;font-weight:700;cursor:pointer;transition:.2s;text-align:center;}
.type-tab-css-gradient.active{border-color:var(--accent1-css-gradient);background:rgba(124,58,237,.12);color:#a78bfa;}
.type-tab-css-gradient:hover:not(.active){border-color:var(--border-css-gradient);color:var(--text-css-gradient);}


/* CONTROLS */
.control-group-css-gradient{margin-bottom:20px;}
.control-label-css-gradient{font-size:11.5px;font-weight:700;color:var(--muted-css-gradient);margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;}
.control-label-css-gradient span{color:var(--text-css-gradient);font-family:'Fira Code',monospace;}
input[type=range]{width:100%;height:4px;accent-color:var(--accent1-css-gradient);cursor:pointer;border-radius:2px;}


/* DIRECTION */
.direction-grid-css-gradient{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:8px;}
.dir-btn-css-gradient{padding:9px 4px;border:1px solid var(--border-css-gradient);border-radius:8px;background:transparent;color:var(--muted-css-gradient);font-size:15px;cursor:pointer;text-align:center;transition:.2s;}
.dir-btn-css-gradient.active{border-color:var(--accent2-css-gradient);background:rgba(6,182,212,.12);color:var(--accent2-css-gradient);}
.dir-btn-css-gradient:hover:not(.active){color:var(--text-css-gradient);}

/* COLOR STOPS */
.stops-list-css-gradient{display:flex;flex-direction:column;gap:8px;margin-bottom:12px;}
.stop-row-css-gradient{display:flex;align-items:center;gap:8px;}
.stop-color-css-gradient{width:36px;height:36px;border-radius:8px;border:2px solid var(--border-css-gradient);cursor:pointer;padding:2px;background:none;}
.stop-color-css-gradient::-webkit-color-swatch-wrapper{padding:0;}
.stop-color-css-gradient::-webkit-color-swatch{border:none;border-radius:4px;}
.stop-pos-css-gradient{flex:1;font-family:'Fira Code',monospace;font-size:12px;font-weight:600;color:var(--text-css-gradient);background:var(--surface2-css-gradient);border:1px solid var(--border-css-gradient);border-radius:8px;padding:8px 10px;outline:none;}
.stop-pos-css-gradient:focus{border-color:var(--accent1-css-gradient);}
.stop-del-css-gradient{width:30px;height:30px;border-radius:8px;border:1px solid var(--border-css-gradient);background:transparent;color:var(--muted-css-gradient);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;}
.stop-del-css-gradient:hover{border-color:#ef4444;color:#ef4444;}
.btn-add-css-gradient{width:100%;padding:9px;border:1px dashed var(--border-css-gradient);border-radius:10px;background:transparent;color:var(--muted-css-gradient);font-family:'Inter',sans-serif;font-size:12px;font-weight:700;cursor:pointer;transition:.2s;}
.btn-add-css-gradient:hover{border-color:var(--accent1-css-gradient);color:#a78bfa;}

/* PRESETS */
.presets-grid-css-gradient{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.preset-swatch-css-gradient{height:50px;border-radius:10px;cursor:pointer;border:2px solid transparent;transition:.2s;}
.preset-swatch-css-gradient:hover{transform:scale(1.05);border-color:var(--text-css-gradient);}


/* PREVIEW */
.preview-box-css-gradient{width:100%;aspect-ratio:16/9;border-radius:16px;border:1px solid var(--border-css-gradient);margin-bottom:20px;transition:background .3s;}
.preview-full-css-gradient{border-radius:12px;overflow:hidden;margin-bottom:20px;}
.preview-cards-css-gradient{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px;}
.preview-card-css-gradient{height:80px;border-radius:10px;border:1px solid var(--border-css-gradient);}


/* CODE OUTPUT */
.code-block-css-gradient{background:var(--bg-css-gradient);border:1px solid var(--border-css-gradient);border-radius:12px;padding:16px;font-family:'Fira Code',monospace;font-size:12.5px;line-height:1.6;color:#a78bfa;word-break:break-all;position:relative;}
.code-header-css-gradient{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
.code-title-css-gradient{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-css-gradient);}
.copy-btn-css-gradient{padding:7px 14px;border-radius:8px;border:1px solid var(--border);background:var(--surface2-css-gradient);color:var(--muted-css-gradient);font-family:'Inter',sans-serif;font-size:11px;font-weight:700;cursor:pointer;transition:.2s;display:flex;align-items:center;gap:5px;}
.copy-btn-css-gradient:hover{border-color:var(--accent2-css-gradient);color:var(--accent2-css-gradient);}
.copy-btn-css-gradient.copied{border-color:#10b981;color:#10b981;}

/* URL ENCODER AND DECODER */

/* HERO STRIP */
.hero-strip-url-encode-decode{background:linear-gradient(90deg,#1e40af,#2563eb,#0ea5e9);padding:28px 32px;color:#fff;}
.hero-strip-url-encode-decode h1{font-size:clamp(22px,4vw,38px);font-weight:800;letter-spacing:-.03em;margin-bottom:6px;}
.hero-strip-url-encode-decode p{font-size:14px;opacity:.85;}
/* TAB NAV */
.tab-nav-url-encode-decode{display:flex;background:var(--surface-url-encode-decode);border-bottom:2px solid var(--border-url-encode-decode);padding:0 32px;overflow-x:auto;}
.tab-btn-url-encode-decode{padding:14px 20px;border:none;background:none;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:700;color:var(--muted-url-encode-decode);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;white-space:nowrap;display:flex;align-items:center;gap:6px;}
.tab-btn-url-encode-decode.active{color:var(--accent-url-encode-decode);border-bottom-color:var(--accent-url-encode-decode);}
.tab-btn-url-encode-decode:hover:not(.active){color:var(--text-url-encode-decode);}

.card-url-encode-decode{background:var(--surface-url-encode-decode);border:1px solid var(--border-url-encode-decode);border-radius:14px;margin-bottom:20px;overflow:hidden;}
.card-head-url-encode-decode{padding:16px 20px;border-bottom:1px solid var(--border-url-encode-decode);display:flex;align-items:center;justify-content:space-between;}
.card-title-url-encode-decode{font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted-url-encode-decode);display:flex;align-items:center;gap:8px;}
.card-title-url-encode-decode .dot{width:8px;height:8px;border-radius:50%;}
.card-body-url-encode-decode{padding:20px;}

.tab-pane-url-encode-decode{display:none;}
.tab-pane-url-encode-decode.active{display:block;}


.action-row-url-encode-decode{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.btn-url-encode-decode{padding:9px 18px;border-radius:9px;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:700;cursor:pointer;display:flex;align-items:center;gap:6px;border:1.5px solid transparent;transition:.15s;}
.btn-primary-url-encode-decode{background:var(--accent-url-encode-decode);color:#fff;border-color:var(--accent-url-encode-decode);}
.btn-primary-url-encode-decode:hover{background:#1d4ed8;}
.btn-outline-url-encode-decode{background:var(--surface-url-encode-decode);border-color:var(--border-url-encode-decode);color:var(--text-url-encode-decode);}
.btn-outline-url-encode-decode:hover{border-color:var(--accent-url-encode-decode);color:var(--accent-url-encode-decode);}
.btn-green-url-encode-decode{background:var(--green-lt-url-encode-decode);border-color:var(--green-url-encode-decode);color:var(--green-url-encode-decode);}
.btn-orange-url-encode-decode{background:var(--orange-lt-url-encode-decode);border-color:var(--orange-url-encode-decode);color:var(--orange-url-encode-decode);}
.btn-sm-url-encode-decode{padding:6px 12px;font-size:11.5px;}

/* MAIN */
.url-encode-decode{max-width:1000px;margin:0 auto;padding:32px 24px 60px;}


textarea.textarea-url-encode-decode{width:100%;font-family:'JetBrains Mono',monospace;font-size:13px;font-weight:500;line-height:1.6;background:var(--surface2-url-encode-decode);border:1.5px solid var(--border-url-encode-decode);border-radius:10px;padding:14px;resize:vertical;color:var(--text-url-encode-decode);outline:none;min-height:110px;}
textarea.textarea-url-encode-decode:focus{border-color:var(--accent-url-encode-decode);background:var(--surface-url-encode-decode);}
textarea.textarea-url-encode-decode.success{border-color:var(--green-url-encode-decode);}
textarea.textarea-url-encode-decode.error{border-color:var(--red-url-encode-decode);}

/* STATUS BAR */
.status-bar-url-encode-decode{display:flex;align-items:center;gap:12px;padding:8px 0;font-size:11.5px;font-family:'JetBrains Mono',monospace;color:var(--muted-url-encode-decode);}
.status-dot-url-encode-decode{width:6px;height:6px;border-radius:50%;background:var(--muted-url-encode-decode);}
.status-dot-url-encode-decode.ok{background:var(--green-url-encode-decode);}
.status-dot-url-encode-decode.err{background:var(--red-url-encode-decode);}

.arrow-row-url-encode-decode{text-align:center;padding:8px 0;color:var(--muted-url-encode-decode);font-size:22px;}

/* QUERY PARSE */
.query-table-url-encode-decode{width:100%;border-collapse:collapse;font-size:13px;}
.query-table-url-encode-decode th{text-align:left;padding:10px 12px;background:var(--surface2-url-encode-decode);font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted-url-encode-decode);}
.query-table-url-encode-decode td{padding:10px 12px;border-top:1px solid var(--border-url-encode-decode);font-family:'JetBrains Mono',monospace;font-size:12.5px;word-break:break-all;}
.query-table-url-encode-decode tr:hover td{background:var(--accent-lt-url-encode-decode);}
.badge-url-encode-decode{display:inline-block;font-size:10px;font-weight:700;padding:2px 7px;border-radius:4px;}
.badge-key-url-encode-decode{background:#fef3c7;color:#92400e;}
.badge-val-url-encode-decode{background:var(--accent-lt-url-encode-decode);color:var(--accent-url-encode-decode);}


/* CHARS TABLE */
.ref-grid-url-encode-decode{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;}
.ref-item-url-encode-decode{background:var(--surface2-url-encode-decode);border:1px solid var(--border-url-encode-decode);border-radius:8px;padding:10px;text-align:center;}
.ref-char-url-encode-decode{font-size:18px;font-family:'JetBrains Mono',monospace;font-weight:700;color:var(--accent-url-encode-decode);display:block;}
.ref-enc-url-encode-decode{font-size:11px;font-family:'JetBrains Mono',monospace;color:var(--orange-url-encode-decode);margin-top:2px;}
.ref-name-url-encode-decode{font-size:10.5px;color:var(--muted-url-encode-decode);margin-top:2px;}

/* BOX SHADOW GENERATOR */


/* HERO */
.hero-box-shadow{background:linear-gradient(135deg,#8b5cf6 0%,#ec4899 100%);color:#fff;padding:36px 32px;display:flex;align-items:center;gap:24px;}
.hero-text-box-shadow h1{font-size:clamp(24px,4vw,40px);font-weight:900;letter-spacing:-.03em;margin-bottom:8px;}
.hero-text-box-shadow p{font-size:14px;opacity:.9;max-width:480px;}
.hero-badge-box-shadow{background:rgba(255,255,255,.15);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.25);border-radius:12px;padding:12px 20px;font-size:12px;font-weight:700;font-family:'IBM Plex Mono',monospace;white-space:nowrap;}


/* LAYOUT */
.layout-box-shadow{display:grid;grid-template-columns:340px 1fr;gap:0;min-height:calc(100vh - 200px);}
@media(max-width:820px){.layout{grid-template-columns:1fr;}}

/* SIDEBAR */
.sidebar-box-shadow{background:var(--surface-box-shadow);border-right:1px solid var(--border-box-shadow);padding:24px;overflow-y:auto;}
.section-head-box-shadow{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-box-shadow);margin-bottom:16px;margin-top:24px;padding-top:24px;border-top:1px solid var(--border-box-shadow);}
.section-head-box-shadow:first-child{margin-top:0;padding-top:0;border-top:none;}

/* LAYER LIST */
.layer-item-box-shadow{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:10px;border:1.5px solid var(--border-box-shadow);margin-bottom:8px;cursor:pointer;transition:.15s;background:var(--surface-box-shadow);}
.layer-item-box-shadow.active{border-color:var(--purple-box-shadow);background:var(--purple-lt-box-shadow);}
.layer-item-box-shadow:hover:not(.active){border-color:var(--muted-box-shadow);}
.layer-swatch-box-shadow{width:24px;height:24px;border-radius:6px;border:1px solid rgba(0,0,0,.1);flex-shrink:0;}
.layer-name-box-shadow{flex:1;font-size:13px;font-weight:700;}
.layer-toggle-box-shadow{cursor:pointer;font-size:14px;color:var(--muted-box-shadow);padding:2px;}
.layer-del-box-shadow{cursor:pointer;color:var(--muted-box-shadow);font-size:14px;padding:2px;}
.layer-del-box-shadow:hover{color:#ef4444;}
.btn-add-layer-box-shadow{width:100%;padding:10px;border:2px dashed var(--border-box-shadow);border-radius:10px;background:transparent;font-family:'Nunito',sans-serif;font-size:13px;font-weight:700;color:var(--muted-box-shadow);cursor:pointer;}
.btn-add-layer-box-shadow:hover{border-color:var(--purple-box-shadow);color:var(--purple-box-shadow);}

/* SLIDERS */
.slider-group-box-shadow{margin-bottom:16px;}
.slider-label-box-shadow{display:flex;justify-content:space-between;font-size:12.5px;font-weight:700;margin-bottom:7px;}
.slider-label-box-shadow .val{font-family:'IBM Plex Mono',monospace;color:var(--purple-box-shadow);font-weight:600;}
input[type=range]{width:100%;height:5px;accent-color:var(--purple-box-shadow);cursor:pointer;}
.color-row-box-shadow{display:flex;gap:10px;align-items:center;margin-bottom:16px;}
input[type=color]{width:46px;height:40px;border-radius:9px;border:1.5px solid var(--border-box-shadow);padding:3px;cursor:pointer;background:none;}
input[type=color]::-webkit-color-swatch-wrapper{padding:0;}
input[type=color]::-webkit-color-swatch{border:none;border-radius:5px;}
.hex-input-box-shadow{flex:1;padding:9px 12px;border:1.5px solid var(--border-box-shadow);border-radius:9px;font-family:'IBM Plex Mono',monospace;font-size:13px;font-weight:600;background:var(--surface2-box-shadow);color:var(--text-box-shadow);outline:none;}
.hex-input-box-shadow:focus{border-color:var(--purple-box-shadow);}
.toggle-row-box-shadow{display:flex;align-items:center;justify-content:space-between;padding:10px 0;}
.toggle-label-box-shadow{font-size:13px;font-weight:700;}
.toggle-box-shadow{position:relative;width:40px;height:22px;}
.toggle-box-shadow input{opacity:0;width:0;height:0;}
.toggle-slider-box-shadow{position:absolute;inset:0;background:var(--border-box-shadow);border-radius:11px;cursor:pointer;transition:.2s;}
.toggle-slider-box-shadow::before{content:'';position:absolute;width:16px;height:16px;left:3px;top:3px;background:white;border-radius:50%;transition:.2s;}
.toggle-box-shadow input:checked+.toggle-slider{background:var(--purple-box-shadow);}
.toggle-box-shadow input:checked+.toggle-slider::before{transform:translateX(18px);}


/* PREVIEW */
.preview-area-box-shadow{padding:40px;display:flex;flex-direction:column;gap:24px;}
.preview-canvas-box-shadow{flex:1;background:repeating-conic-gradient(#e5e7eb 0% 25%, white 0% 50%) 0 0 / 20px 20px;border-radius:16px;display:flex;align-items:center;justify-content:center;min-height:300px;position:relative;}
.preview-card-box-shadow {width:200px;height:140px;background:white;border-radius:16px;transition:box-shadow .3s;}
.bg-options-box-shadow {display:flex;gap:8px;flex-wrap:wrap;}
.bg-opt-box-shadow {width:36px;height:36px;border-radius:8px;cursor:pointer;border:2px solid transparent;transition:.15s;}
.bg-opt-box-shadow .active{border-color:var(--purple);}
.bg-opt-box-shadow :hover{transform:scale(1.08);}


/* CODE */
.code-panel-box-shadow{background:var(--surface-box-shadow);border:1px solid var(--border-box-shadow);border-radius:14px;overflow:hidden;}
.code-top-box-shadow{padding:14px 18px;border-bottom:1px solid var(--border-box-shadow);display:flex;justify-content:space-between;align-items:center;}
.code-top-title-box-shadow{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.code-body-box-shadow{padding:18px;font-family:'IBM Plex Mono',monospace;font-size:13px;line-height:1.7;color:#7c3aed;background:var(--bg-box-shadow);}
.btn-box-shadow{padding:9px 18px;border-radius:9px;font-family:'Nunito',sans-serif;font-size:13px;font-weight:800;cursor:pointer;border:1.5px solid transparent;transition:.15s;display:flex;align-items:center;gap:6px;}
.btn-purple-box-shadow{background:var(--purple-box-shadow);color:#fff;border-color:var(--purple-box-shadow);}
.btn-purple-box-shadow:hover{background:#7c3aed;}
.btn-outline-box-shadow{background:var(--surface-box-shadow);border-color:var(--border-box-shadow);color:var(--text-box-shadow);}
.btn-outline-box-shadow:hover{border-color:var(--purple-box-shadow);color:var(--purple-box-shadow);}
.btn-sm-box-shadow{padding:6px 12px;font-size:12px;}
.btn.copied-box-shadow{border-color:#16a34a;color:#16a34a;background:#f0fdf4;}

/* PRESETS */
.preset-grid-box-shadow{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.preset-item-box-shadow{padding:12px;border:1.5px solid var(--border-box-shadow);border-radius:10px;cursor:pointer;transition:.15s;text-align:center;}
.preset-item-box-shadow:hover{border-color:var(--purple-box-shadow);background:var(--purple-lt-box-shadow);}
.preset-box-box-shadow{width:100%;height:50px;background:white;border-radius:8px;margin-bottom:6px;}
.preset-name-box-shadow{font-size:10.5px;font-weight:700;color:var(--muted-box-shadow);}


/* FLEXBOX GENERATOR */

/* HERO */
.hero-flexbox{background:var(--yellow-flexbox);padding:32px;display:flex;justify-content:space-between;align-items:center;gap:20px;}
.hero-flexbox h1{font-size:clamp(24px,5vw,44px);font-weight:800;letter-spacing:-.04em;color:var(--yellow-dk-flexbox);line-height:1.05;margin-bottom:8px;}
.hero-flexbox p{font-size:15px;color:rgba(0,0,0,.55);max-width:460px;}
.hero-preview-flexbox{display:flex;gap:6px;align-items:center;background:rgba(0,0,0,.08);border-radius:14px;padding:16px 20px;}
.hero-box-flexbox{width:28px;height:28px;background:var(--yellow-dk-flexbox);border-radius:6px;opacity:.7;}

/* LAYOUT */
.page-flexbox{display:grid;grid-template-columns:1fr 320px;min-height:calc(100vh - 160px);}
@media(max-width:900px){.page{grid-template-columns:1fr;}}

/* MAIN CANVAS */
.canvas-area-flexbox{padding:28px;border-right:1px solid var(--border-flexbox);}
.section-label-flexbox{font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted-flexbox);margin-bottom:12px;display:flex;align-items:center;gap:6px;}
.section-label-flexbox::after{content:'';flex:1;height:1px;background:var(--border-flexbox);}

/* FLEX PREVIEW */
.flex-preview-wrap-flexbox{background:var(--surface-flexbox);border:2px solid var(--border-flexbox);border-radius:16px;padding:20px;margin-bottom:24px;position:relative;min-height:250px;}
.flex-container-flexbox{min-height:200px;border:2px dashed var(--yellow-flexbox);border-radius:12px;padding:10px;transition:all .25s;}
.flex-item-flexbox{background:var(--yellow-flexbox);color:var(--yellow-dk-flexbox);border-radius:8px;font-weight:800;font-size:13px;font-family:'DM Mono',monospace;display:flex;align-items:center;justify-content:center;min-width:50px;min-height:50px;cursor:default;user-select:none;position:relative;transition:all .25s;}
.flex-item-flexbox .item-num{pointer-events:none;}
.flex-item-flexbox.highlight{background:var(--teal-flexbox);color:#fff;}
.flex-item-flexbox:nth-child(1){opacity:1;}
.flex-item-flexbox:nth-child(2){opacity:.85;}
.flex-item-flexbox:nth-child(3){opacity:.7;}
.flex-item-flexbox:nth-child(4){opacity:.55;}
.flex-item-flexbox:nth-child(5){opacity:.4;}

/* ITEM CONTROLS */
.item-controls-flexbox{display:flex;align-items:center;gap:10px;margin-bottom:24px;flex-wrap:wrap;}
.item-count-btn-flexbox{width:34px;height:34px;border-radius:50%;border:2px solid var(--border-flexbox);background:var(--surface-flexbox);font-size:18px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-flexbox);}
.item-count-btn-flexbox:hover{border-color:var(--yellow-flexbox);background:var(--yellow-lt-flexbox);}
.item-count-display-flexbox{font-size:14px;font-weight:800;color:var(--text-flexbox);min-width:80px;text-align:center;}
.width-hint-flexbox{font-size:11.5px;color:var(--muted-flexbox);font-weight:600;}
input[type=range]{accent-color:var(--yellow-flexbox);}
.size-input-flexbox{width:70px;padding:6px 10px;border:1.5px solid var(--border-flexbox);border-radius:8px;font-family:'DM Mono',monospace;font-size:13px;font-weight:600;color:var(--text-flexboxt);background:var(--surface-flexbox);outline:none;}
.size-input-flexbox:focus{border-color:var(--yellow-flexbox);}

/* PROPERTY GRID */
.props-grid-flexbox{display:grid;gap:20px;}
.prop-block-flexbox{background:var(--surface-flexbox);border:1px solid var(--border-flexbox);border-radius:14px;padding:16px;}
.prop-name-flexbox{font-size:12.5px;font-weight:800;color:var(--text-flexbox);margin-bottom:4px;font-family:'DM Mono',monospace;}
.prop-desc-flexbox{font-size:11.5px;color:var(--muted-flexbox);margin-bottom:12px;line-height:1.5;}
.prop-options-flexbox{display:flex;flex-wrap:wrap;gap:6px;}
.prop-btn-flexbox{padding:7px 12px;border:1.5px solid var(--border-flexbox);border-radius:8px;background:var(--surface-flexbox);font-family:'DM Sans',sans-serif;font-size:12px;font-weight:700;color:var(--muted-flexbox);cursor:pointer;transition:.15s;font-family:'DM Mono',monospace;}
.prop-btn-flexbox:hover:not(.active){border-color:var(--text-flexbox);color:var(--text-flexbox);}
.prop-btn-flexbox.active{background:var(--text-flexbox);color:var(--yellow-flexbox);border-color:var(--text-flexbox);}

/* SIDEBAR */
.sidebar-flexbox{padding:24px;}
.code-card-flexbox{background:var(--text-flexbox);border-radius:14px;overflow:hidden;margin-bottom:20px;}
.code-card-head-flexbox{padding:12px 16px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.1);}
.code-card-title-flexbox{font-size:10.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);}
.btn-copy-flexbox{padding:6px 14px;border-radius:7px;border:1px solid rgba(255,255,255,.2);background:transparent;color:rgba(255,255,255,.7);font-family:'DM Sans',sans-serif;font-size:11.5px;font-weight:700;cursor:pointer;}
.btn-copy-flexbox:hover{background:rgba(255,255,255,.1);}
.btn-copy-flexbox.copied{border-color:var(--teal-flexbox);color:var(--teal-flexbox);}
.code-body-flexbox{padding:16px;font-family:'DM Mono',monospace;font-size:12.5px;line-height:1.8;color:#fbbf24;}
.code-prop-flexbox{color:#67e8f9;}
.code-val-flexbox{color:#a3e635;}

/* CHEATSHEET */
.cheat-item-flexbox{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid var(--border-flexbox);}
.cheat-item-flexbox:last-child{border-bottom:none;}
.cheat-code-flexbox{font-family:'DM Mono',monospace;font-size:11.5px;font-weight:600;color:var(--teal-flexbox);min-width:130px;padding-top:2px;}
.cheat-desc-flexbox{font-size:12px;color:var(--muted-flexbox);line-height:1.5;}

/* CSS GRID GENERATOR */

/* HEADER — newspaper masthead feel */
.masthead-css-grid{border-bottom:3px solid var(--ink-css-grid);padding:16px 32px;background:var(--surface-css-grid);display:flex;align-items:baseline;justify-content:space-between;gap:20px;}
.masthead-css-grid h1{font-size:clamp(20px,4vw,36px);font-weight:800;letter-spacing:-.04em;line-height:1;}
.masthead-sub-css-grid{font-family:'Syne Mono',monospace;font-size:11px;color:var(--muted-css-grid);text-align:right;line-height:1.6;}
.rule-bar-css-grid{height:6px;background:var(--ink-css-grid);}
.rule-bar-thin-css-grid{height:2px;background:var(--ink-css-grid);}

/* COLUMNS LAYOUT */
.outer-css-grid{display:grid;grid-template-columns:280px 1fr 280px;min-height:calc(100vh - 100px);}
@media(max-width:1000px){.outer{grid-template-columns:1fr;}}

/* PANELS */
.panel-css-grid{border-right:1px solid var(--border-css-grid);padding:24px;}
.panel-css-grid:last-child{border-right:none;border-left:1px solid var(--border-css-grid);}
.panel-title-css-grid{font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--muted-css-grid);padding-bottom:12px;margin-bottom:16px;border-bottom:1.5px solid var(--border-css-grid);}

/* GRID CONTROLS */
.ctrl-group-css-grid{margin-bottom:20px;}
.ctrl-label-css-grid{font-size:12.5px;font-weight:700;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;}
.ctrl-label-css-grid .val{font-family:'Syne Mono',monospace;color:var(--coral-css-grid);}
input[type=range]{width:100%;accent-color:var(--coral-css-grid);height:4px;}
.number-row-css-grid{display:flex;align-items:center;gap:8px;}
.num-btn-css-grid{width:30px;height:30px;border-radius:6px;border:1.5px solid var(--border-css-grid);background:var(--surface-css-grid);font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-css-grid);}
.num-btn-css-grid:hover{border-color:var(--coral-css-grid);color:var(--coral-css-grid);}
.num-display-css-grid{font-family:'Syne Mono',monospace;font-size:18px;font-weight:700;min-width:40px;text-align:center;}

/* TEXT INPUT */
.mono-input-css-grid{width:100%;padding:9px 12px;border:1.5px solid var(--border-css-grid);border-radius:8px;font-family:'Syne Mono',monospace;font-size:13px;font-weight:600;background:var(--surface-css-grid);color:var(--text-css-grid);outline:none;}
.mono-input-css-grid:focus{border-color:var(--coral-css-grid);}
.input-hint-css-grid{font-size:11px;color:var(--muted-css-grid);margin-top:4px;font-family:'Syne Mono',monospace;}

/* QUICK VALUES */
.quick-vals-css-grid{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px;}
.qv-css-grid{padding:4px 9px;border:1.5px solid var(--border-css-grid);border-radius:5px;font-family:'Syne Mono',monospace;font-size:11px;font-weight:700;cursor:pointer;color:var(--muted-css-grid);background:var(--surface-css-grid);}
.qv-css-grid:hover{border-color:var(--coral-css-grid);color:var(--coral-css-grid);}

/* GRID CANVAS */
.canvas-area-css-grid{padding:32px;background:var(--bg-css-grid);}
.canvas-title-css-grid{font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase;color:var(--muted-css-grid);padding-bottom:12px;margin-bottom:20px;border-bottom:1.5px solid var(--border-css-grid);}
.grid-wrapper-css-grid{background:var(--surface-css-grid);border:2px solid var(--ink-css-grid);border-radius:0;padding:16px;margin-bottom:24px;min-height:280px;}
.the-grid-css-grid{display:grid;gap:0;width:100%;min-height:240px;}
.grid-cell-css-grid{border:1px dashed rgba(26,23,20,.15);background:transparent;position:relative;min-height:60px;transition:background .15s;cursor:default;}
.grid-cell-css-grid.span-highlight{background:rgba(255,87,51,.08);border-color:var(--coral-css-grid);}

/* DEMO ITEMS */
.demo-items-css-grid{display:flex;flex-direction:column;gap:10px;margin-top:12px;}
.demo-item-row-css-grid{display:flex;align-items:center;gap:8px;}
.color-pick-css-grid{width:28px;height:28px;border-radius:6px;border:1.5px solid var(--border-css-grid);cursor:pointer;padding:2px;}
.color-pick-css-grid::-webkit-color-swatch-wrapper{padding:0;}
.color-pick-css-grid::-webkit-color-swatch{border:none;border-radius:3px;}
.small-input-css-grid{width:55px;padding:6px 8px;border:1.5px solid var(--border-css-grid);border-radius:7px;font-family:'Syne Mono',monospace;font-size:12px;font-weight:700;background:var(--surface-css-grid);color:var(--text-css-grid);outline:none;}
.small-input-css-grid:focus{border-color:var(--coral-css-grid);}
.demo-label-css-grid{font-size:12px;font-weight:700;color:var(--muted-css-grid);min-width:20px;text-align:center;}

/* CODE OUTPUT */
.code-wrap-css-grid{background:var(--ink-css-grid);border-radius:10px;overflow:hidden;}
.code-top-css-grid{padding:12px 16px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.1);}
.code-top-label-css-grid{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45);}
.btn-copy-css-grid{padding:6px 14px;border-radius:7px;border:1px solid rgba(255,255,255,.2);background:transparent;color:rgba(255,255,255,.65);font-family:'Syne',sans-serif;font-size:11px;font-weight:700;cursor:pointer;}
.btn-copy-css-grid:hover{background:rgba(255,255,255,.1);}
.btn-copy-css-grid.copied{border-color:var(--coral-css-grid);color:var(--coral-css-grid);}
.code-content-css-grid{padding:16px;font-family:'Syne Mono',monospace;font-size:12.5px;line-height:1.85;color:#ff9473;white-space:pre-wrap;word-break:break-all;}
.cp{color:#93c5fd;}.cv{color:#86efac;}.cc{color:rgba(255,255,255,.3);}

/* VISUAL GRID PREVIEW */
.visual-preview-css-grid{margin-top:16px;}
.vp-grid-css-grid{gap:6px;display:grid;}
.vp-cell-css-grid{border-radius:6px;min-height:50px;display:flex;align-items:center;justify-content:center;font-family:'Syne Mono',monospace;font-size:12px;font-weight:700;color:rgba(255,255,255,.9);}


/* OPEN GRAPH GENERATOR */
.topbar-open-graph{background:var(--white-open-graph);border-bottom:1px solid var(--border-open-graph);padding:16px 0;}
.brand-icon-open-graph{width:40px;height:40px;border-radius:11px;background:linear-gradient(135deg,var(--primary-2-open-graph),var(--primary-open-graph));display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;flex-shrink:0;}
.brand-title-open-graph{font-weight:800;font-size:19px;letter-spacing:-0.02em;margin:0;}
.brand-sub-open-graph{font-size:12.5px;color:var(--muted-open-graph);margin:0;}
.btn-ghost-open-graph{background:var(--white-open-graph);border:1.5px solid var(--border);border-radius:9px;padding:9px 14px;font-size:13px;font-weight:700;color:var(--text-open-graph);cursor:pointer;}
.btn-ghost-open-graph:hover{border-color:var(--primary-2-open-graph);}
.btn-grad-open-graph{background:linear-gradient(135deg,var(--primary-2-open-graph),var(--primary-open-graph));color:#fff;border:none;border-radius:9px;padding:9px 16px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-grad-open-graph:hover{opacity:.92;}
.btn-grad-block-open-graph{width:100%;}

.panel-open-graph{background:var(--white-open-graph);border:1px solid var(--border-open-graph);border-radius:14px;padding:22px;margin-bottom:18px;}
.panel-open-graph h2{font-size:14.5px;font-weight:800;margin-bottom:16px;}
.form-label-open-graph{font-size:12.5px;font-weight:700;margin-bottom:5px;display:flex;justify-content:space-between;align-items:center;}
.form-label-open-graph .req{color:#ef4444;}
.form-label-open-graph .hint-right{font-size:11px;color:var(--muted-open-graph);font-weight:600;}
.input-icon-open-graph{position:relative;}
.input-icon-open-graph i.bi{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted-open-graph);font-size:14px;}
.input-icon-open-graph .form-control{padding-left:34px;}
.form-control,.form-select{border:1.5px solid var(--border-open-graph);border-radius:9px;font-size:13px;font-weight:600;padding:9px 12px;font-family:inherit;}
.form-control:focus,.form-select:focus{border-color:var(--primary-2-open-graph);box-shadow:0 0 0 3px rgba(124,58,237,.1);outline:none;}
.help-text-open-graph{font-size:11.5px;color:var(--muted-open-graph);margin-top:4px;}

.upload-box-open-graph{border:1.5px dashed var(--border-open-graph);border-radius:12px;padding:22px;text-align:center;background:#fafafe;}
.upload-box-open-graph i{font-size:22px;color:var(--muted-open-graph);}
.upload-box-open-graph p{font-size:12.5px;color:var(--muted-open-graph);margin:6px 0 12px;}

.platform-tabs-open-graph{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.ptab-open-graph{display:flex;align-items:center;gap:6px;border:1.5px solid var(--border-open-graph);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;background:var(--white-open-graph);cursor:pointer;color:var(--text-open-graph);}
.ptab-open-graph.active{border-color:var(--primary-2-open-graph);background:var(--primary-lt-open-graph);color:var(--primary-2-open-graph);}
.ptab-open-graph i,.ptab svg{font-size:14px;}

.preview-card-open-graph{border:1px solid var(--border-open-graph);border-radius:12px;overflow:hidden;}
.preview-header-open-graph{padding:12px 14px;display:flex;gap:10px;align-items:center;}
.preview-avatar-open-graph{width:36px;height:36px;border-radius:50%;background:var(--primary-lt-open-graph);display:flex;align-items:center;justify-content:center;color:var(--primary-2-open-graph);font-size:16px;flex-shrink:0;}
.preview-name-open-graph{font-weight:700;font-size:13px;}
.preview-meta-open-graph{font-size:11px;color:var(--muted-open-graph);}
.preview-text-open-graph{padding:0 14px 10px;font-size:12.5px;color:#374151;}
.preview-image-wrap-open-graph{height:230px;background:linear-gradient(135deg,#7c3aed,#4c1d95);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
.preview-image-wrap-open-graph img{width:100%;height:100%;object-fit:cover;}
.preview-image-fallback-open-graph{color:#fff;text-align:center;padding:20px;}
.preview-footer-open-graph{padding:12px 14px;border-top:1px solid var(--border-open-graph);}
.preview-domain-open-graph{font-size:10.5px;letter-spacing:.04em;color:var(--muted-open-graph);font-weight:700;text-transform:uppercase;}
.preview-title-open-graph{font-weight:800;font-size:14px;margin:3px 0 4px;}
.preview-desc-open-graph{font-size:12px;color:var(--muted-open-graph);line-height:1.5;}
.preview-actions-open-graph{display:flex;gap:18px;padding:10px 14px;border-top:1px solid var(--border-open-graph);font-size:12px;color:var(--muted-open-graph);font-weight:600;}
.preview-actions-open-graph span{display:flex;align-items:center;gap:6px;}

.preview-twitter-img-open-graph{height:230px;background:linear-gradient(135deg,#7c3aed,#4c1d95);}
.preview-tw-card-open-graph{border:1px solid var(--border-open-graph);border-radius:14px;overflow:hidden;}

.info-note-open-graph{background:#eef2ff;border:1px solid #c7d2fe;border-radius:10px;padding:10px 14px;font-size:12px;color:#3730a3;display:flex;gap:8px;align-items:flex-start;}

.tips-list-open-graph{font-size:12.5px;color:#374151;margin:0;padding-left:18px;}
.tips-list-open-graph li{margin-bottom:6px;}

.code-box-open-graph{background:#0f172a;color:#cbd5e1;border-radius:12px;padding:16px;font-family:'Space Grotesk',monospace;font-size:11.5px;line-height:1.7;max-height:480px;overflow:auto;white-space:pre-wrap;word-break:break-word;}
.code-box-open-graph .tag{color:#7dd3fc;}
.code-box-open-graph .attr{color:#fbbf24;}
.code-box-open-graph .val{color:#86efac;}
.code-box-open-graph .comment{color:#64748b;}

.platform-grid-open-graph{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;text-align:center;}
.platform-grid-open-graph .pg-item{font-size:12px;font-weight:700;color:var(--text-open-graph);}
.platform-grid-open-graph .pg-icon{width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;margin:0 auto 6px;font-size:17px;color:#fff;}

.copied-toast-open-graph{position:fixed;bottom:24px;right:24px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:700;opacity:0;transform:translateY(10px);transition:.2s;pointer-events:none;z-index:999;}
.copied-toast-open-graph.show{opacity:1;transform:translateY(0);}

.advanced-toggle-open-graph{font-size:12.5px;font-weight:700;color:var(--primary-2-open-graph);background:none;border:none;cursor:pointer;display:flex;align-items:center;gap:6px;padding:0;}
.advanced-body-open-graph{display:none;margin-top:14px;padding-top:14px;border-top:1px dashed var(--border);}
.advanced-body-open-graph.show{display:block;}

/* /* COLOR PALETTE GENERATOR */
.wrap-color-palette{max-width:780px;margin:0 auto;}
.header-color-palette{display:flex;align-items:center;gap:14px;margin-bottom:22px;}
.header-color-palette .logo{width:46px;height:46px;border-radius:14px;background:var(--primary-lt-color-palette);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;}
.header-color-palette h1{font-size:23px;font-weight:800;margin:0 0 3px;letter-spacing:-0.02em;}
.header-color-palette p{margin:0;color:var(--muted-color-palette);font-size:13.5px;}
.card-color-palette{background:var(--white);border:1px solid var(--border-color-palette);border-radius:16px;padding:20px;margin-bottom:18px;box-shadow:0 1px 2px rgba(0,0,0,.02);}
.mode-row-color-palette{display:flex;flex-wrap:wrap;gap:8px;}
.mode-btn-color-palette{border:1.5px solid var(--border-color-palette);background:var(--white-color-palette);border-radius:9px;padding:8px 16px;font-size:13px;font-weight:600;color:var(--text-color-palette);cursor:pointer;font-family:inherit;}
.mode-btn-color-palette.active{background:var(--primary-color-palette);border-color:var(--primary-color-palette);color:#fff;}
.mode-btn-color-palette:not(.active):hover{border-color:var(--primary-color-palette);color:var(--primary-color-palette);}


.palette-grid-color-palette{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
@media(max-width:620px){.palette-grid{grid-template-columns:repeat(2,1fr);}}
.swatch-block-color-palette{display:flex;flex-direction:column;gap:8px;}
.swatch-color-palette{height:115px;border-radius:12px;cursor:pointer;border:1px solid rgba(0,0,0,.04);position:relative;}
.swatch-color-palette .copy-flag{position:absolute;top:8px;right:8px;background:rgba(17,24,39,.85);color:#fff;font-size:10px;font-weight:700;padding:3px 8px;border-radius:6px;opacity:0;transition:opacity .15s;}
.swatch-color-palette.copied .copy-flag{opacity:1;}
.swatch-meta-color-palette{display:flex;align-items:center;justify-content:space-between;font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:700;}
.swatch-meta-color-palette .icons{display:flex;gap:6px;color:var(--muted-color-palette);}
.swatch-meta-color-palette .icons i{cursor:pointer;font-size:13px;}
.swatch-meta-color-palette .icons i:hover{color:var(--primary-color-palette);}
.lock-btn-color-palette{width:100%;border:1.5px solid var(--border-color-palette);border-radius:9px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;background:var(--white);color:var(--muted-color-palette);font-size:13px;}
.lock-btn-color-palette.locked{border-color:var(--primary-color-palette);background:var(--primary-lt-color-palette);color:var(--primary-color-palette);}


.section-title-color-palette{font-size:14.5px;font-weight:800;margin-bottom:14px;}
.controls-grid-color-palette{display:grid;grid-template-columns:1fr 1fr;gap:24px;}
@media(max-width:620px){.controls-grid{grid-template-columns:1fr;}}
.label-row-color-palette{display:flex;justify-content:space-between;font-size:12.5px;font-weight:700;margin-bottom:6px;}
.label-row-color-palette span.val{color:var(--primary-color-palette);font-weight:800;}
.size-row-color-palette{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px;}
.size-btn-color-palette{width:34px;height:34px;border-radius:9px;border:1.5px solid var(--border-color-palette);background:var(--white-color-palette);font-weight:700;font-size:13px;cursor:pointer;}
.size-btn-color-palette.active{background:var(--primary-color-palette);border-color:var(--primary-color-palette);color:#fff;}
.select-ctl-color-palette{width:100%;border:1.5px solid var(--border-color-palette);border-radius:9px;padding:9px 12px;font-size:13.5px;font-weight:600;font-family:inherit;background:var(--white-color-palette);}
input[class=range-color-palette]{width:100%;accent-color:var(--primary-color-palette);}
.gen-btn-color-palette{background:var(--primary-color-palette);color:#fff;border:none;border-radius:10px;padding:11px 0;width:100%;font-size:14px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;}
.gen-btn-color-palette:hover{background:var(--primary-dark-color-palette);}
.lock-grid-color-palette{display:flex;gap:8px;}
.lock-grid-color-palette .lock-btn{width:40px;flex:none;}


.row-between-color-palette{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.gradient-bar-color-palette{height:74px;border-radius:12px;overflow:hidden;display:flex;margin-bottom:10px;}
.gradient-bar-color-palette span{flex:1;}
.gradient-labels-color-palette{display:flex;justify-content:space-between;font-family:'JetBrains Mono',monospace;font-size:11.5px;font-weight:700;color:var(--muted-color-palette);}

.export-grid-color-palette{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
@media(max-width:560px){.export-grid{grid-template-columns:repeat(2,1fr);}}
.export-btn-color-palette{border:1.5px solid var(--border-color-palette);border-radius:10px;padding:11px 8px;font-size:12.5px;font-weight:700;background:var(--white-color-palette);cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;}
.export-btn-color-palette:hover{border-color:var(--primary-color-palette);color:var(--primary-color-palette);}

.tips-color-palette{background:var(--primary-lt-color-palette);border-radius:14px;padding:16px 18px;font-size:13px;color:#3f3a66;}
.tips-color-palette .t-title{font-weight:800;display:flex;align-items:center;gap:7px;margin-bottom:6px;color:var(--primary-dark-color-palette);}

/* FAVICON GENERATOR */
.page-hero-favicon{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:32px 0 26px;}
.page-hero-favicon h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-favicon{background:var(--white-favicon);border:1px solid var(--border-favicon);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-favicon h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.form-label{font-size:12.5px;font-weight:700;margin-bottom:5px;}
.form-control,.form-select{border:1.5px solid var(--border-favicon);border-radius:10px;font-size:13.5px;font-weight:600;padding:9px 12px;font-family:inherit;}
.form-control:focus,.form-select:focus{border-color:var(--primary-favicon);box-shadow:0 0 0 3px rgba(124,58,237,.1);outline:none;}
textarea.form-control{font-family:'Space Grotesk',monospace;resize:vertical;}
.btn-primary-custom-favicon{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-favicon:hover{opacity:.9;}
.btn-outline-custom-favicon{background:var(--white-favicon-favicon);border:1.5px solid var(--border-favicon);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text-favicon);cursor:pointer;}
.btn-outline-custom-favicon:hover{border-color:var(--primary-favicon);color:var(--primary-favicon);}
.btn-outline-custom-favicon.active{border-color:var(--primar-favicony);background:var(--primary-lt);color:var(--primary-favicon);}


/* CASE CONVERTER */
.page-hero-case-converter{background:linear-gradient(43deg, #ed3a3a 0%, #ea7575 100%);;color:#fff;padding:32px 0 26px;}
.page-hero-case-converter h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-case-converter{background:var(--white);border:1px solid var(--border-case-converter);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-case-converter h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}

.btn-primary-custom-case-converter{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-case-converter:hover{opacity:.9;}
.btn-outline-custom-case-converter{background:var(--white);border:1.5px solid var(--border-case-converter);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text);cursor:pointer;}
.btn-outline-custom-case-converter:hover{border-color:var(--primary-case-converter);color:var(--primary-case-converter);}
.btn-outline-custom-case-converter.active{border-color:var(--primary-case-converter);background:var(--primary-lt-case-converter);color:var(--primary-case-converter);}

/* REMOVE DUPLICATE LINES */

.page-hero-remove-duplicate-lines{background:linear-gradient(135deg,#d12e0ea1 0%,#d12e0ea1 100%);color:#fff;padding:32px 0 26px;}
.page-hero-remove-duplicate-lines h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-remove-duplicate-lines{background:var(--white-remove-duplicate-lines);border:1px solid var(--border-remove-duplicate-lines);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-remove-duplicate-lines h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.btn-primary-custom-remove-duplicate-lines{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-remove-duplicate-lines:hover{opacity:.9;}
.btn-outline-custom-remove-duplicate-lines{background:var(--white-remove-duplicate-lines);border:1.5px solid var(--border);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text);cursor:pointer;}
.btn-outline-custom-remove-duplicate-lines:hover{border-color:var(--primary-remove-duplicate-lines);color:var(--primary-remove-duplicate-lines);}
.btn-outline-custom-remove-duplicate-lines.active{border-color:var(--primary-remove-duplicate-lines);background:var(--primary-lt-remove-duplicate-lines);color:var(--primary-remove-duplicate-lines);}

/* TEXT SORTER */

.page-hero-text-sorter{background:linear-gradient(135deg,#6203c5a1 0%,#7a00fca1 100%);color:#fff;padding:32px 0 26px;}
.page-hero-text-sorter h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-text-sorter{background:var(--white-text-sorter);border:1px solid var(--border-text-sorter);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-text-sorter h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.btn-primary-custom-text-sorter{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-text-sorter:hover{opacity:.9;}
.btn-outline-custom-text-sorter{background:var(--white-text-sorter);border:1.5px solid var(--border);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text-text-sorter);cursor:pointer;}
.btn-outline-custom-text-sorter:hover{border-color:var(--primary-text-sorter);color:var(--primary-text-sorter);}
.btn-outline-custom-text-sorter.active{border-color:var(--primary-text-sorter);background:var(--primary-lt-text-sorter);color:var(--primary-text-sorter);}

/* REVERSE TEXT */

.page-hero-reverse-text{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);;color:#fff;padding:32px 0 26px;}
.page-hero-reverse-text h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-reverse-text{background:var(--white-reverse-text);border:1px solid var(--border-reverse-text);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-reverse-text h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.btn-primary-custom-reverse-text{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-reverse-text:hover{opacity:.9;}
.btn-outline-custom-reverse-text{background:var(--white-text-sorter);border:1.5px solid var(--border-reverse-text);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text-reverse-text);cursor:pointer;}
.btn-outline-custom-reverse-text:hover{border-color:var(--primary-reverse-text);color:var(--primary-reverse-text);}
.btn-outline-custom-reverse-text.active{border-color:var(--primary-text-sorter);background:var(--primary-lt-reverse-text);color:var(--primary-reverse-text);}


/* REMOVE EMPTY LINES */

.page-hero-remove-empty-lines{background:linear-gradient(135deg, #48326f 0%, #38215b 100%);color:#fff;padding:32px 0 26px;}
.page-hero-remove-empty-lines h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-remove-empty-lines{background:var(--white-remove-empty-lines);border:1px solid var(--border-remove-empty-lines);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-remove-empty-lines h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.btn-primary-custom-remove-empty-lines{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-remove-empty-lines:hover{opacity:.9;}
.btn-outline-custom-remove-empty-lines{background:var(--white-remove-empty-lines);border:1.5px solid var(--border-remove-empty-lines);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text-remove-empty-lines);cursor:pointer;}
.btn-outline-custom-remove-empty-lines:hover{border-color:var(--primary-remove-empty-lines);color:var(--primary-remove-empty-lines);}
.btn-outline-custom-remove-empty-lines.active{border-color:var(--primary-remove-empty-lines);background:var(--primary-lt-remove-empty-lines);color:var(--primary-remove-empty-lines);}

/* FIND AND REPLACE */

.page-hero-find-and-replace{background:linear-gradient(135deg, #d601c8 0%, #7a0989 100%);color:#fff;padding:32px 0 26px;}
.page-hero-find-and-replace h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-find-and-replace{background:var(--white-find-and-replace);border:1px solid var(--border-find-and-replace);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-find-and-replace h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.btn-primary-custom-find-and-replace{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-find-and-replace:hover{opacity:.9;}
.btn-outline-custom-find-and-replace{background:var(--white-find-and-replace);border:1.5px solid var(--border-find-and-replace);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text-markdown-editor);cursor:pointer;}
.btn-outline-custom-find-and-replace:hover{border-color:var(--primary-find-and-replace);color:var(--primary-remove-empty-lines);}
.btn-outline-custom-find-and-replace.active{border-color:var(--primary-find-and-replace);background:var(--primary-lt-find-and-replace);color:var(--primary-find-and-replace);}

/* MARKDOWN EDITOR */

.page-hero-markdown-editor{background:linear-gradient(135deg, #1d6aa9 0%, #0e25a9 100%);color:#fff;padding:32px 0 26px;}
.page-hero-markdown-editor h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-markdown-editor{background:var(--white-markdown-editor);border:1px solid var(--border-markdown-editor);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-markdown-editor h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.btn-primary-custom-markdown-editor{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-markdown-editor:hover{opacity:.9;}
.btn-outline-custom-markdown-editor{background:var(--white-markdown-editor);border:1.5px solid var(--border-markdown-editor);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text-markdown-editor);cursor:pointer;}
.btn-outline-custom-markdown-editor:hover{border-color:var(--primary-markdown-editor);color:var(--primary-markdown-editor);}
.btn-outline-custom-markdown-editor.active{border-color:var(--primary-markdown-editor);background:var(--primary-lt-markdown-editor);color:var(--primary-markdown-editor);}

/* UNIQUE CODE CONVERTER */

.page-hero-unique-code-converter{background:linear-gradient(135deg, #00a70b 0%, #2fbd12 100%);;color:#fff;padding:32px 0 26px;}
.page-hero-unique-code-converter h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-unique-code-converter{background:var(--white-unique-code-converter);border:1px solid var(--border-unique-code-converter);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-unique-code-converter h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.btn-primary-custom-unique-code-converter{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-unique-code-converter:hover{opacity:.9;}
.btn-outline-custom-unique-code-converter{background:var(--white-unique-code-converter);border:1.5px solid var(--border-unique-code-converter);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text-unique-code-converter);cursor:pointer;}
.btn-outline-custom-unique-code-converter:hover{border-color:var(--primary-unique-code-converter);color:var(--primary-unique-code-converter);}
.btn-outline-custom-unique-code-converter.active{border-color:var(--primary-unique-code-converter);background:var(--primary-lt-unique-code-converter);color:var(--primary-unique-code-converter);}


/* ASCII CONVERTER */

.page-hero-ascii-converter{background:linear-gradient(135deg, #00a70b 0%, #2fbd12 100%);;color:#fff;padding:32px 0 26px;}
.page-hero-ascii-converter h1{font-size:clamp(20px,3vw,30px);font-weight:800;letter-spacing:-0.03em;}
.panel-ascii-converter{background:var(--white-ascii-converter);border:1px solid var(--border-ascii-converter);border-radius:16px;padding:24px;margin-bottom:20px;}
.panel-ascii-converter h2{font-size:15.5px;font-weight:800;margin-bottom:14px;display:flex;align-items:center;gap:8px;}
.btn-primary-custom-ascii-converter{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 20px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;}
.btn-primary-custom-ascii-converter:hover{opacity:.9;}
.btn-outline-custom-ascii-converter{background:var(--white-ascii-converter);border:1.5px solid var(--border-ascii-converter);border-radius:9px;padding:8px 14px;font-size:12.5px;font-weight:700;color:var(--text-ascii-converter);cursor:pointer;}
.btn-outline-custom-ascii-converter:hover{border-color:var(--primary-ascii-converter);color:var(--primary-ascii-converter);}
.btn-outline-custom-ascii-converter.active{border-color:var(--primary-ascii-converter);background:var(--primary-lt-ascii-converter);color:var(--primary-ascii-converter);}

/* DATA SANITIZER */
.page-hero-data-sanitizer{background:linear-gradient(135deg,#be185d 0%,#500724 100%);color:#fff;padding:40px 0 32px;}
.page-hero-data-sanitizer h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.breadcrumb-item-data-sanitizer a{color:rgba(255,255,255,.8);text-decoration:none;}
.breadcrumb-item-data-sanitizer.active{color:rgba(255,255,255,.6);}
.breadcrumb-item-data-sanitizer+.breadcrumb-item::before{color:rgba(255,255,255,.4);}
.calc-card-data-sanitizer{background:var(--white-data-sanitizer);border:1px solid var(--border-data-sanitizer);border-radius:16px;padding:26px;margin-bottom:20px;}
.content-block-data-sanitizer{background:var(--white-data-sanitizer);border:1px solid var(--border-data-sanitizer);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-data-sanitizer h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-data-sanitizer h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-data-sanitizer p{color:var(--muted-data-sanitizer);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-data-sanitizer{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-data-sanitizer th{background:var(--primary-lt-data-sanitizer);color:var(--primary-dk-data-sanitizer);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-data-sanitizer td{padding:9px 14px;border-bottom:1px solid var(--border-data-sanitizer);}
.bf-table-data-sanitizer tr:nth-child(even) td{background:var(--bg-data-sanitizer);}
.faq-item-data-sanitizer{border-bottom:1px solid var(--border-data-sanitizer);padding:14px 0;}
.faq-item-data-sanitizer:last-child{border-bottom:none;}
.faq-q-data-sanitizer{font-size:14px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
.faq-a-data-sanitizer{font-size:13.5px;color:var(--muted-data-sanitizer);line-height:1.7;padding-top:8px;display:none;}
.faq-item.open-data-sanitizer .faq-a{display:block;}
.faq-item.open-data-sanitizer .faq-icon{transform:rotate(45deg);}
.faq-icon-data-sanitizer{transition:transform .2s;font-size:18px;color:var(--muted-data-sanitizer);}
.sidebar-widget-data-sanitizer{background:var(--white-data-sanitizer);border:1px solid var(--border-data-sanitizer);border-radius:14px;padding:20px;margin-bottom:20px;}
.sidebar-widget-data-sanitizer h4{font-size:14px;font-weight:700;margin-bottom:14px;}
.sidebar-link-data-sanitizer{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-data-sanitizer);text-decoration:none;color:var(--muted-data-sanitizer);font-size:13px;font-weight:500;transition:color .12s;}
.sidebar-link-data-sanitizer:last-child{border-bottom:none;}
.sidebar-link-data-sanitizer:hover{color:#1a56db;}
.sidebar-link-data-sanitizer i{color:#1a56db;width:16px;}


.btn-calc-data-sanitizer{background:linear-gradient(135deg,#db2777,#9d174d);color:#fff;border:none;border-radius:10px;padding:12px 32px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;}
.btn-calc-data-sanitizer:hover{opacity:.9;}
.btn-outline-purple-data-sanitizer{background:transparent;color:var(--primary-dk-data-sanitizer);border:2px solid var(--primary-data-sanitizer);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-outline-purple-data-sanitizer:hover{background:var(--primary-lt-data-sanitizer);}
.btn-sm-pink-data-sanitizer{background:var(--primary-lt-data-sanitizer);color:var(--primary-dk-data-sanitizer);border:1.5px solid #fbcfe8;border-radius:8px;padding:6px 14px;font-size:12.5px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .12s;}
.btn-sm-pink-data-sanitizer:hover{background:#fce7f3;}

.section-divider-data-sanitizer{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-data-sanitizer);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-data-sanitizer);display:flex;justify-content:space-between;align-items:center;}
.opt-row-data-sanitizer{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px solid var(--border-data-sanitizer);}
.opt-row-data-sanitizer:last-child{border-bottom:none;}
.opt-row-data-sanitizer input[type=checkbox]{width:18px;height:18px;margin-top:2px;accent-color:var(--primary-data-sanitizer);cursor:pointer;flex-shrink:0;}
.opt-text-data-sanitizer label{font-size:13.5px;font-weight:700;cursor:pointer;display:block;}
.opt-text-data-sanitizer span{font-size:12px;color:var(--muted-data-sanitizer);}
.stat-pill-data-sanitizer{background:var(--primary-lt-data-sanitizer);border-radius:10px;padding:10px 14px;text-align:center;flex:1;min-width:90px;}
.stat-pill-data-sanitizer .n{font-size:18px;font-weight:800;color:var(--primary-dk-data-sanitizer);}
.stat-pill-data-sanitizer .l{font-size:10.5px;font-weight:700;color:var(--muted-data-sanitizer);text-transform:uppercase;letter-spacing:.04em;}
.copied-toast-data-sanitizer{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#111827;color:#fff;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .2s;z-index:9999;}
.copied-toast-data-sanitizer.show{opacity:1;}
/* .form-label-data-sanitizer{font-size:13px;font-weight:700;color:var(--text-data-sanitizer);margin-bottom:6px;} */
.form-control-data-sanitizer,.form-select{border:1.5px solid var(--border-data-sanitizer);border-radius:10px;font-size:14px;font-weight:600;padding:10px 14px;font-family:inherit;transition:border-color .15s;}
.form-control-data-sanitizer:focus,.form-select:focus{border-color:var(--primary-data-sanitizer);box-shadow:0 0 0 3px rgba(219,39,119,.12);outline:none;}
textarea.form-control-data-sanitizer{font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12.5px;font-weight:500;line-height:1.6;}

/* JSON PATH EXTRACTOR */

.page-hero-json-path-extractor{background:linear-gradient(135deg,#4338ca 0%,#1e1b4b 100%);color:#fff;padding:40px 0 32px;}
.page-hero-json-path-extractor h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-json-path-extractor{background:var(--white-json-path-extractor);border:1px solid var(--border-json-path-extractor);border-radius:16px;padding:26px;margin-bottom:20px;}
.content-block-json-path-extractor{background:var(--white-json-path-extractor);border:1px solid var(--border-json-path-extractor);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-json-path-extractor h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-json-path-extractor h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-json-path-extractor p{color:var(--muted-json-path-extractor);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-json-path-extractor{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-json-path-extractor th{background:var(--primary-lt-json-path-extractor);color:var(--primary-dk-json-path-extractor);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-json-path-extractor td{padding:9px 14px;border-bottom:1px solid var(--border-json-path-extractor);}
.bf-table-json-path-extractor code{background:#f1f5f9;padding:2px 6px;border-radius:4px;font-size:12px;}
.bf-table-json-path-extractor tr:nth-child(even) td{background:var(--bg-json-path-extractor);}
.faq-item-json-path-extractor{border-bottom:1px solid var(--border-json-path-extractor);padding:14px 0;}
.faq-item-json-path-extractor:last-child{border-bottom:none;}
.faq-q-json-path-extractor{font-size:14px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
.faq-a-json-path-extractor{font-size:13.5px;color:var(--muted-json-path-extractor);line-height:1.7;padding-top:8px;display:none;}
.faq-item.open-json-path-extractor .faq-a{display:block;}
.faq-item.open-json-path-extractor .faq-icon{transform:rotate(45deg);}
.faq-icon-json-path-extractor{transition:transform .2s;font-size:18px;color:var(--muted-json-path-extractor);}
.sidebar-widget-json-path-extractor{background:var(--white-json-path-extractor);border:1px solid var(--border-json-path-extractor);border-radius:14px;padding:20px;margin-bottom:20px;}
.sidebar-widget-json-path-extractor h4{font-size:14px;font-weight:700;margin-bottom:14px;}
.sidebar-link-json-path-extractor{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-json-path-extractor);text-decoration:none;color:var(--muted-json-path-extractor);font-size:13px;font-weight:500;transition:color .12s;}
.sidebar-link-json-path-extractor:last-child{border-bottom:none;}
.sidebar-link-json-path-extractor:hover{color:#1a56db;}
.sidebar-link-json-path-extractor i{color:#1a56db;width:16px;}
.btn-sm-indigo-json-path-extractor{background:var(--primary-lt-json-path-extractor);color:var(--primary-dk-json-path-extractor);border:1.5px solid #c7d2fe;border-radius:8px;padding:6px 14px;font-size:12.5px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .12s;}
.btn-sm-indigo-json-path-extractor:hover{background:#e0e7ff;}
.section-divider-json-path-extractor{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-json-path-extractor);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-json-path-extractor);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px;}
.stat-pill-json-path-extractor{background:var(--primary-lt-json-path-extractor);border-radius:10px;padding:10px 14px;text-align:center;flex:1;min-width:90px;}
.stat-pill-json-path-extractor .n{font-size:18px;font-weight:800;color:var(--primary-dk-json-path-extractor);}
.stat-pill-json-path-extractor .l{font-size:10.5px;font-weight:700;color:var(--muted-json-path-extractor);text-transform:uppercase;letter-spacing:.04em;}
.error-banner-json-path-extractor{display:none;background:var(--bad-lt-json-path-extractor);border:1.5px solid #fecaca;color:var(--bad-json-path-extractor);border-radius:10px;padding:10px 14px;font-size:13px;font-weight:600;margin-top:10px;}
/* JSON code editor textarea */
.json-editor-json-path-extractor{background:#0f172a;color:#e2e8f0;border:1.5px solid #1e293b;border-radius:12px;font-family:'SFMono-Regular',Consolas,Menlo,monospace;font-size:12.8px;line-height:1.65;padding:14px;width:100%;resize:vertical;}
.json-editor-json-path-extractor:focus{outline:none;border-color:var(--primary-json-path-extractor);}
/* Path panel */
.path-panel-json-path-extractor{background:var(--primary-lt-json-path-extractor);border:1.5px solid #c7d2fe;border-radius:14px;padding:20px;margin-bottom:20px;}
.path-row-json-path-extractor{display:flex;align-items:center;gap:8px;margin-bottom:10px;}
.path-row-json-path-extractor:last-child{margin-bottom:0;}
.path-label-json-path-extractor{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--primary-dk-json-path-extractor);width:120px;flex-shrink:0;}
.path-box-json-path-extractor{background:#0f172a;color:#a5f3fc;font-family:'SFMono-Regular',Consolas,Menlo,monospace;font-size:13px;padding:9px 12px;border-radius:8px;overflow-x:auto;white-space:nowrap;flex:1;}
.copy-btn-sm-json-path-extractor{background:#fff;border:1.5px solid #c7d2fe;color:var(--primary-dk-json-path-extractor);border-radius:8px;padding:8px 10px;cursor:pointer;font-size:14px;flex-shrink:0;transition:all .12s;}
.copy-btn-sm-json-path-extractor:hover{background:var(--primary-json-path-extractor);color:#fff;border-color:var(--primary-json-path-extractor);}
.path-breadcrumb-json-path-extractor{font-size:12.5px;color:var(--primary-dk-json-path-extractor);font-weight:600;margin-bottom:14px;word-break:break-all;}
/* Tree viewer */
.tree-wrap-json-path-extractor{background:#0f172a;border-radius:12px;padding:14px 10px;overflow:auto;max-height:600px;font-family:'SFMono-Regular',Consolas,Menlo,monospace;font-size:12.8px;line-height:1.8;color:#cbd5e1;}
.tn-row-json-path-extractor{display:flex;align-items:baseline;white-space:pre;border-radius:4px;}
.tn-row-json-path-extractor:hover{background:rgba(255,255,255,.045);}
.tn-toggle-json-path-extractor{width:14px;flex-shrink:0;cursor:pointer;color:#64748b;user-select:none;text-align:center;}
.tn-key-json-path-extractor{color:#7dd3fc;cursor:pointer;padding:1px 3px;border-radius:3px;}
.tn-key-json-path-extractor:hover{background:rgba(125,211,252,.18);}
.tn-colon-json-path-extractor{color:#64748b;margin-right:5px;}
.tn-val-json-path-extractor{cursor:pointer;padding:1px 3px;border-radius:3px;}
.tn-val-json-path-extractor:hover{background:rgba(255,255,255,.1);}
.tn-string-json-path-extractor{color:#86efac;}
.tn-number-json-path-extractor{color:#fbbf24;}
.tn-boolean-json-path-extractor{color:#f472b6;}
.tn-null-json-path-extractor{color:#f472b6;font-style:italic;}
.tn-badge-json-path-extractor{color:#94a3b8;}
.tn-badge-array-json-path-extractor{color:#c4b5fd;}
.tn-badge-object-json-path-extractor{color:#93c5fd;}
.tn-selected-json-path-extractor{outline:1.5px solid #818cf8;background:rgba(79,70,229,.35)!important;}
.tn-search-match-json-path-extractor{background:rgba(250,204,21,.28)!important;}
.tn-more-json-path-extractor{background:transparent;border:1px dashed #475569;color:#94a3b8;font-size:11.5px;padding:2px 10px;border-radius:6px;cursor:pointer;font-family:inherit;margin:2px 0;}
.tn-more-json-path-extractor:hover{border-color:#818cf8;color:#c7d2fe;}
.tree-placeholder-json-path-extractor{padding:50px 20px;text-align:center;color:#64748b;font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;}
.copied-toast-json-path-extractor{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#111827;color:#fff;padding:10px 20px;border-radius:10px;font-size:13px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .2s;z-index:9999;}
.copied-toast-json-path-extractor.show{opacity:1;}


/* WEBHOOK TESTER */
.page-hero-webhook-tester{background:linear-gradient(135deg,#0d9488 0%,#134e4a 100%);color:#fff;padding:40px 0 32px;}
.page-hero-webhook-tester h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-webhook-tester{background:var(--white-webhook-tester);border:1px solid var(--border-webhook-tester);border-radius:16px;padding:28px;margin-bottom:20px;}

.content-block-webhook-tester{background:var(--white-webhook-tester);border:1px solid var(--border-webhook-tester);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-webhook-tester h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-webhook-tester h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-webhook-tester p{color:var(--muted-webhook-tester);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-webhook-tester{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-webhook-tester th{background:var(--primary-lt-webhook-tester);color:var(--primary-webhook-tester);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-webhook-tester td{padding:9px 14px;border-bottom:1px solid var(--border-webhook-tester);}
.bf-table-webhook-tester tr:nth-child(even) td{background:var(--bg-webhook-tester);}
.faq-item-webhook-tester{border-bottom:1px solid var(--border-webhook-tester);padding:14px 0;}
.faq-item-webhook-tester:last-child{border-bottom:none;}
.faq-q-webhook-tester{font-size:14px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
.faq-a-webhook-tester{font-size:13.5px;color:var(--muted-webhook-tester);line-height:1.7;padding-top:8px;display:none;}
.faq-item-webhook-tester.open .faq-a{display:block;}
.faq-item-webhook-tester.open .faq-icon{transform:rotate(45deg);}
.faq-icon-webhook-tester{transition:transform .2s;font-size:18px;color:var(--muted-webhook-tester);}
.sidebar-widget-webhook-tester{background:var(--white-webhook-tester);border:1px solid var(--border-webhook-tester);border-radius:14px;padding:20px;margin-bottom:20px;}
.sidebar-widget-webhook-tester h4{font-size:14px;font-weight:700;margin-bottom:14px;}
.sidebar-link-webhook-tester{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--border-webhook-tester);text-decoration:none;color:var(--muted-webhook-tester);font-size:13px;font-weight:500;transition:color .12s;}
.sidebar-link-webhook-tester:last-child{border-bottom:none;}
.sidebar-link-webhook-tester:hover{color:#1a56db;}

.btn-outline-purple-webhook-tester{background:transparent;color:var(--primary-webhook-tester);border:2px solid var(--primary-webhook-tester);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-outline-purple-webhook-tester:hover{background:var(--primary-lt);}
.btn-danger-soft-webhook-tester{background:transparent;color:#dc2626;border:2px solid #fca5a5;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-danger-soft-webhook-tester:hover{background:#fef2f2;}
.section-divider-webhook-tester{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-webhook-tester);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border);}

/* Webhook-specific */
.url-box-webhook-tester{display:flex;align-items:center;gap:10px;background:var(--primary-lt-webhook-tester);border:1.5px solid #99f6e4;border-radius:12px;padding:14px 16px;flex-wrap:wrap;}
.url-text-webhook-tester{flex:1;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:14px;font-weight:600;color:var(--primary-webhook-tester);word-break:break-all;min-width:200px;}
.status-dot-webhook-tester{width:8px;height:8px;border-radius:50%;background:#22c55e;display:inline-block;margin-right:6px;animation:pulse 1.6s infinite;}
.status-dot-webhook-tester.off{background:#9ca3af;animation:none;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(34,197,94,.5);}70%{box-shadow:0 0 0 7px rgba(34,197,94,0);}100%{box-shadow:0 0 0 0 rgba(34,197,94,0);}}
.status-pill-webhook-tester{display:inline-flex;align-items:center;font-size:12px;font-weight:700;color:#16a34a;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:999px;padding:4px 10px;}
.status-pill-webhook-tester.off{color:#6b7280;background:#f3f4f6;border-color:var(--border-webhook-tester);}
.req-list-webhook-tester{max-height:520px;overflow-y:auto;}
.req-item-webhook-tester{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--border);border-radius:10px;margin-bottom:8px;cursor:pointer;transition:all .12s;}
.req-item-webhook-tester:hover{border-color:var(--primary-webhook-tester);background:var(--primary-lt-webhook-tester);}
.req-item-webhook-tester.active{border-color:var(--primary-webhook-tester);background:var(--primary-lt-webhook-tester);}
.method-badge-webhook-tester{font-size:11px;font-weight:800;padding:3px 9px;border-radius:6px;letter-spacing:.02em;min-width:56px;text-align:center;}
.method-GET-webhook-tester{background:#dbeafe;color:#1d4ed8;}
.method-POST-webhook-tester{background:#dcfce7;color:#15803d;}
.method-PUT-webhook-tester{background:#fef3c7;color:#b45309;}
.method-PATCH-webhook-tester{background:#fde68a;color:#92400e;}
.method-DELETE-webhook-tester{background:#fee2e2;color:#b91c1c;}
.method-OTHER-webhook-tester{background:#e5e7eb;color:#374151;}
.req-meta-webhook-tester{flex:1;min-width:0;}
.req-path-webhook-tester{font-size:13px;font-weight:700;color:var(--text-webhook-tester);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.req-time-webhook-tester{font-size:11.5px;color:var(--muted-webhook-tester);}
.req-ip-webhook-tester{font-size:11px;color:var(--muted-webhook-tester);white-space:nowrap;}
.empty-state-webhook-tester{text-align:center;padding:48px 16px;color:var(--muted-webhook-tester);}
.empty-state-webhook-tester i{font-size:38px;color:#99f6e4;margin-bottom:12px;display:block;}
.detail-tabs-webhook-tester{display:flex;gap:4px;border-bottom:1.5px solid var(--border-webhook-tester);margin-bottom:14px;}
.detail-tab-webhook-tester{font-size:13px;font-weight:700;color:var(--muted-webhook-tester);padding:9px 14px;cursor:pointer;border-bottom:2px solid transparent;}
.detail-tab-webhook-tester.active{color:var(--primary-webhook-tester);border-color:var(--primary-webhook-tester);}
.detail-pane-webhook-tester{display:none;}
.detail-pane-webhook-tester.active{display:block;}
pre.code-block-webhook-tester{background:#0f172a;color:#e2e8f0;border-radius:10px;padding:16px;font-size:12.5px;line-height:1.6;overflow-x:auto;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;max-height:360px;}
.kv-table-webhook-tester{width:100%;font-size:12.5px;border-collapse:collapse;}
.kv-table-webhook-tester td{padding:6px 8px;border-bottom:1px solid var(--border-webhook-tester);vertical-align:top;}
.kv-table-webhook-tester td:first-child{font-weight:700;color:var(--primary-webhook-tester);width:34%;white-space:nowrap;}
.kv-table-webhook-tester td:last-child{color:var(--text-webhook-tester);word-break:break-all;}
.copy-btn-webhook-tester{background:var(--white);border:1.5px solid var(--border-webhook-tester);border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;color:var(--text-webhook-tester);cursor:pointer;transition:all .12s;}
.copy-btn-webhook-tester:hover{border-color:var(--primary-webhook-tester);color:var(--primary-webhook-tester);}
.toast-box-webhook-tester{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-webhook-tester.show{opacity:1;transform:translateY(0);}
.count-badge-webhook-tester{background:var(--primary-webhook-tester);color:#fff;font-size:11px;font-weight:800;border-radius:999px;padding:2px 9px;margin-left:6px;}

/* IMAGE CROP AND RESIZE */
.page-hero-image-crop-resize{background:linear-gradient(135deg,#4f46e5 0%,#1e1b4b 100%);color:#fff;padding:40px 0 32px;}
.page-hero-image-crop-resize h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-image-crop-resize{background:var(--white-image-crop-resize);border:1px solid var(--border-image-crop-resize);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-image-crop-resize{background:var(--white-image-crop-resize);border:1px solid var(--border-image-crop-resize);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-image-crop-resize h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-image-crop-resize h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-image-crop-resize p{color:var(--muted-image-crop-resize);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-image-crop-resize{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-image-crop-resize th{background:var(--primary-lt-image-crop-resize);color:var(--primary-image-crop-resize);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-image-crop-resize td{padding:9px 14px;border-bottom:1px solid var(--border-image-crop-resize);}
.bf-table-image-crop-resize tr:nth-child(even) td{background:var(--bg-image-crop-resize);}

.btn-calc-image-crop-resize{background:linear-gradient(135deg,#4f46e5,#1e1b4b);color:#fff;border:none;border-radius:10px;padding:12px 32px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;}
.btn-calc-image-crop-resize:hover{opacity:.9;}
.btn-calc-image-crop-resize:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-image-crop-resize{background:transparent;color:var(--primary-image-crop-resize);border:2px solid var(--primary-image-crop-resize);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-outline-purple-image-crop-resize:hover{background:var(--primary-lt-image-crop-resize);}
.btn-outline-purple-image-crop-resize:disabled{opacity:.5;cursor:not-allowed;}
.btn-danger-soft-image-crop-resize{background:transparent;color:#dc2626;border:2px solid #fca5a5;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-danger-soft-image-crop-resize:hover{background:#fef2f2;}
.btn-icon-image-crop-resize{background:var(--white-image-crop-resize);color:var(--text-image-crop-resize);border:1.5px solid var(--border-image-crop-resize);border-radius:9px;padding:8px 12px;font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-icon-image-crop-resize:hover{border-color:var(--primary-image-crop-resize);color:var(--primary-image-crop-resize);background:var(--primary-lt-image-crop-resize);}
.section-divider-image-crop-resize{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-image-crop-resize);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-image-crop-resize);}

/* Cropper-specific */
.dropzone-image-crop-resize{border:2px dashed #c7d2fe;border-radius:12px;background:var(--primary-lt-image-crop-resize);padding:40px 20px;text-align:center;cursor:pointer;transition:all .15s;}
.dropzone-image-crop-resize:hover,.dropzone.dragover{border-color:var(--primary-image-crop-resize);background:#e0e7ff;}
.dropzone-image-crop-resize i{font-size:32px;color:var(--primary-image-crop-resize);margin-bottom:8px;display:block;}
.toolbar-image-crop-resize{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px;}
.stage-wrap-image-crop-resize{background:repeating-conic-gradient(#f3f4f6 0% 25%,#fff 0% 50%) 50%/20px 20px;border:1.5px solid var(--border-image-crop-resize);border-radius:12px;padding:16px;display:flex;align-items:center;justify-content:center;min-height:260px;overflow:hidden;}
.crop-stage-image-crop-resize{position:relative;display:inline-block;line-height:0;user-select:none;}
.crop-stage-image-crop-resize img{display:block;max-width:100%;max-height:480px;width:auto;height:auto;}
.crop-box-image-crop-resize{position:absolute;border:1.5px dashed #fff;box-shadow:0 0 0 2000px rgba(17,24,39,.55),inset 0 0 0 1px rgba(0,0,0,.3);cursor:move;touch-action:none;}
.crop-box-image-crop-resize::before,.crop-box::after{content:'';position:absolute;background:rgba(255,255,255,.35);}
.crop-box-image-crop-resize::before{left:33.333%;right:33.333%;top:0;bottom:0;border-left:1px dashed rgba(255,255,255,.6);border-right:1px dashed rgba(255,255,255,.6);background:transparent;}
.crop-box-image-crop-resize::after{top:33.333%;bottom:33.333%;left:0;right:0;border-top:1px dashed rgba(255,255,255,.6);border-bottom:1px dashed rgba(255,255,255,.6);background:transparent;}
.handle-image-crop-resize{position:absolute;width:14px;height:14px;background:#fff;border:2px solid var(--primary-image-crop-resize);border-radius:50%;touch-action:none;}
.handle-image-crop-resize.nw{top:-7px;left:-7px;cursor:nwse-resize;}
.handle-image-crop-resize.ne{top:-7px;right:-7px;cursor:nesw-resize;}
.handle-image-crop-resize.sw{bottom:-7px;left:-7px;cursor:nesw-resize;}
.handle-image-crop-resize.se{bottom:-7px;right:-7px;cursor:nwse-resize;}
.dim-pill-image-crop-resize{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--muted-image-crop-resize);background:var(--bg-image-crop-resize);border:1px solid var(--border-image-crop-resize);border-radius:999px;padding:5px 12px;}
.link-toggle-image-crop-resize{width:34px;height:34px;border-radius:9px;border:1.5px solid var(--border-image-crop-resize);background:var(--white-image-crop-resize);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--muted-image-crop-resize);flex-shrink:0;transition:all .15s;}
.link-toggle-image-crop-resize.active{border-color:var(--primary-image-crop-resize);color:var(--primary-image-crop-resize);background:var(--primary-lt-image-crop-resize);}
.toast-box-image-crop-resize{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-image-crop-resize.show{opacity:1;transform:translateY(0);}
.warn-box-image-crop-resize{background:#eef2ff;border:1px solid #c7d2fe;border-radius:10px;padding:12px 14px;font-size:12.5px;color:#3730a3;line-height:1.6;}
.quality-row-image-crop-resize{display:none;}
.quality-row-image-crop-resize.show{display:flex;}
.file-pill-image-crop-resize{display:inline-flex;align-items:center;gap:8px;background:var(--white-image-crop-resize);border:1.5px solid var(--border-image-crop-resize);border-radius:999px;padding:6px 14px;font-size:12.5px;font-weight:700;margin-top:10px;}

/* AWS CRON GENERATOR */
.page-hero-aws-cron-generator{background:linear-gradient(135deg,#b45309 0%,#78350f 100%);color:#fff;padding:40px 0 32px;}
.page-hero-aws-cron-generator h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-aws-cron-generator{background:var(--white-aws-cron-generator);border:1px solid var(--border-aws-cron-generator);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-aws-cron-generator{background:var(--white-aws-cron-generator);border:1px solid var(--border-aws-cron-generator);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-aws-cron-generator h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-aws-cron-generator p{color:var(--muted-aws-cron-generator);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-aws-cron-generator{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-aws-cron-generator th{background:var(--primary-lt-aws-cron-generator);color:var(--primary-aws-cron-generator);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-aws-cron-generator td{padding:9px 14px;border-bottom:1px solid var(--border-aws-cron-generator);}

.section-divider-aws-cron-generator{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-aws-cron-generator);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-aws-cron-generator);}
.result-box-aws-cron-generator{background:var(--primary-lt-aws-cron-generator);border:1.5px solid #fde68a;border-radius:12px;padding:16px;font-size:15px;font-weight:700;color:#78350f;min-height:50px;display:flex;align-items:center;word-break:break-all;}
.field-inputs-aws-cron-generator{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;}
@media (max-width:760px){.field-inputs-aws-cron-generator{grid-template-columns:repeat(3,1fr);}}
.field-inputs-aws-cron-generator .fi label{font-size:10px;font-weight:700;color:var(--muted-aws-cron-generator);text-transform:uppercase;margin-bottom:4px;display:block;}
.tab-row-aws-cron-generator{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border-aws-cron-generator);}
.tab-btn-aws-cron-generator{background:transparent;border:none;font-size:14px;font-weight:700;color:var(--muted-aws-cron-generator);padding:10px 4px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;}
.tab-btn-aws-cron-generator.active{color:var(--primary-aws-cron-generator);border-bottom-color:var(--primary-aws-cron-generator);}
.tab-panel-aws-cron-generator{display:none;}
.tab-panel-aws-cron-generator.active{display:block;}
.error-text-aws-cron-generator{color:#dc2626;font-size:13px;font-weight:600;margin-top:8px;}
.code-box-aws-cron-generator{background:#111827;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;}
.code-copy-btn-aws-cron-generator{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-aws-cron-generator{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-aws-cron-generator.show{opacity:1;transform:translateY(0);}
.form-check-label-aws-cron-generator{font-size:13px;font-weight:600;}
.preset-btn-aws-cron-generator{font-size:12px;font-weight:700;background:var(--bg-aws-cron-generator);border:1px solid var(--border-aws-cron-generator);border-radius:999px;padding:5px 12px;cursor:pointer;color:var(--muted)-aws-cron-generator;}
.preset-btn-aws-cron-generator:hover{border-color:var(--primary-aws-cron-generator);color:var(--primary-aws-cron-generator);}

.page-hero-azure-cron-generator{background:linear-gradient(135deg,#0078d4 0%,#003a6e 100%);color:#fff;padding:40px 0 32px;}
.page-hero-azure-cron-generator h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-azure-cron-generator{background:var(--white-azure-cron-generator);border:1px solid var(--border-azure-cron-generator);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-azure-cron-generator{background:var(--white-azure-cron-generator);border:1px solid var(--border-azure-cron-generator);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-azure-cron-generator h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-azure-cron-generator p{color:var(--muted-azure-cron-generator);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-azure-cron-generator{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-azure-cron-generator th{background:var(--primary-lt-azure-cron-generator);color:var(--primary-azure-cron-generator);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-azure-cron-generator td{padding:9px 14px;border-bottom:1px solid var(--border-azure-cron-generator);}
.section-divider-azure-cron-generator{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-azure-cron-generator);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-azure-cron-generator);}
.result-box-azure-cron-generator{background:var(--primary-lt-azure-cron-generator);border:1.5px solid #b3d9f7;border-radius:12px;padding:16px;font-size:16px;font-weight:700;color:#003a6e;min-height:50px;display:flex;align-items:center;}
.field-inputs-azure-cron-generator{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;}
@media (max-width:760px){.field-inputs{grid-template-columns:repeat(3,1fr);}}
.field-inputs-azure-cron-generator .fi label{font-size:10px;font-weight:700;color:var(--muted-azure-cron-generator);text-transform:uppercase;margin-bottom:4px;display:block;}
.error-text-azure-cron-generator{color:#dc2626;font-size:13px;font-weight:600;margin-top:8px;}
.code-box-azure-cron-generator{background:#111827;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;}
.code-copy-btn-azure-cron-generator{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-azure-cron-generator{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-azure-cron-generator.show{opacity:1;transform:translateY(0);}
.preset-btn-azure-cron-generator{font-size:12px;font-weight:700;background:var(--bg);border:1px solid var(--border-azure-cron-generator);border-radius:999px;padding:5px 12px;cursor:pointer;color:var(--muted-azure-cron-generator);}
.preset-btn-azure-cron-generator:hover{border-color:var(--primary-azure-cron-generator);color:var(--primary-azure-cron-generator);}


/* YAML TO TOML CONVERTER */

.page-hero-yaml-to-toml{background:linear-gradient(135deg,#e11d48 0%,#881337 100%);color:#fff;padding:40px 0 32px;}
.page-hero-yaml-to-toml h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-yaml-to-toml{background:var(--white-yaml-to-toml);border:1px solid var(--border-yaml-to-toml);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-yaml-to-toml{background:var(--white-yaml-to-toml);border:1px solid var(--border-yaml-to-toml);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-yaml-to-toml h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-yaml-to-toml h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-yaml-to-toml p{color:var(--muted-yaml-to-toml);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-yaml-to-toml{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-yaml-to-toml th{background:var(--primary-lt-yaml-to-toml);color:var(--primary-yaml-to-toml);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-yaml-to-toml td{padding:9px 14px;border-bottom:1px solid var(--border-yaml-to-toml);}
.bf-table-yaml-to-toml tr:nth-child(even) td{background:var(--bg-yaml-to-toml);}
.bf-table-yaml-to-toml code{font-size:12.5px;}

.btn-calc-yaml-to-toml{background:linear-gradient(135deg,#e11d48,#881337);color:#fff;border:none;border-radius:10px;padding:12px 32px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;}
.btn-calc-yaml-to-toml:hover{opacity:.9;}
.btn-outline-purple-yaml-to-toml{background:transparent;color:var(--primary-yaml-to-toml);border:2px solid var(--primary-yaml-to-toml);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-outline-purple-yaml-to-toml:hover{background:var(--primary-lt-yaml-to-toml);}
.btn-danger-soft-yaml-to-toml{background:transparent;color:#dc2626;border:2px solid #fca5a5;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-danger-soft-yaml-to-toml:hover{background:#fef2f2;}
.status-pill-yaml-to-toml{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#6b7280;background:#f3f4f6;border:1px solid var(--border-yaml-to-toml);border-radius:999px;padding:4px 12px;}
.status-pill-yaml-to-toml.ok{color:#be123c;background:#fff1f2;border-color:#fecdd3;}
.status-pill-yaml-to-toml.err{color:#dc2626;background:#fef2f2;border-color:#fca5a5;}
.warn-box-yaml-to-toml{background:#fff1f2;border:1px solid #fecdd3;border-radius:10px;padding:12px 14px;font-size:12.5px;color:#881337;line-height:1.6;}
.caveat-box-yaml-to-toml{background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:10px 14px;font-size:12px;color:#92400e;line-height:1.6;margin-top:10px;display:none;}
.caveat-box-yaml-to-toml.show{display:block;}
.caveat-box-yaml-to-toml ul{margin:4px 0 0;padding-left:18px;}
.toast-box-yaml-to-toml{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-yaml-to-toml.show{opacity:1;transform:translateY(0);}
.textarea-yaml-to-toml.form-control{border:1.5px solid var(--border-yaml-to-toml);border-radius:10px;font-size:13.5px;font-weight:500;padding:14px;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;transition:border-color .15s;resize:vertical;}
.textarea-yaml-to-toml.form-control:focus{border-color:var(--primary-yaml-to-toml);box-shadow:0 0 0 3px rgba(225,29,72,.1);outline:none;}

/* YAML TO JSON CONVERTER */
.page-hero-yaml-to-json{background:linear-gradient(135deg,#0d9488 0%,#134e4a 100%);color:#fff;padding:40px 0 32px;}
.page-hero-yaml-to-json h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-yaml-to-json{background:var(--white--yaml-to-json);border:1px solid var(--border-yaml-to-json);border-radius:16px;padding:28px;margin-bottom:20px;}

.textarea-yaml-to-json.form-control{border:1.5px solid var(--border-yaml-to-json);border-radius:10px;font-size:13.5px;font-weight:500;padding:14px;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;transition:border-color .15s;resize:vertical;}
.textarea-yaml-to-json.form-control:focus{border-color:var(--primary-yaml-to-json);box-shadow:0 0 0 3px rgba(13,148,136,.1);outline:none;}
.content-yaml-to-json-block{background:var(--white-yaml-to-json);border:1px solid var(--border-yaml-to-json);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-yaml-to-json h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-yaml-to-json h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-yaml-to-json p{color:var(--muted-yaml-to-json);font-size:14px;line-height:1.8;margin-bottom:12px;}
.btn-calc-yaml-to-json{background:linear-gradient(135deg,#0d9488,#134e4a);color:#fff;border:none;border-radius:10px;padding:12px 32px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;}
.btn-calc-yaml-to-json:hover{opacity:.9;}
.btn-outline-purple-yaml-to-json{background:transparent;color:var(--primary-yaml-to-json);border:2px solid var(--primary-yaml-to-json);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-outline-purple-yaml-to-json:hover{background:var(--primary-lt-yaml-to-json);}
.btn-danger-soft-yaml-to-json{background:transparent;color:#dc2626;border:2px solid #fca5a5;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-danger-soft-yaml-to-json:hover{background:#fef2f2;}
.status-pill-yaml-to-json{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#6b7280;background:#f3f4f6;border:1px solid var(--border-yaml-to-json);border-radius:999px;padding:4px 12px;}
.status-pill-yaml-to-json.ok{color:#0d9488;background:#f0fdfa;border-color:#99f6e4;}
.status-pill-yaml-to-json.err{color:#dc2626;background:#fef2f2;border-color:#fca5a5;}
.warn-box-yaml-to-json{background:#f0fdfa;border:1px solid #99f6e4;border-radius:10px;padding:12px 14px;font-size:12.5px;color:#134e4a;line-height:1.6;}
.toast-box-yaml-to-json{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-yaml-to-json.show{opacity:1;transform:translateY(0);}


/* SLUGIFY STRING */
.page-hero-slugify-string{background:linear-gradient(135deg,#0d9488 0%,#134e4a 100%);color:#fff;padding:40px 0 32px;}
.page-hero-slugify-string h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-slugify-string{background:var(--white-slugify-string);border:1px solid var(--border-slugify-string);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-slugify-string{background:var(--white-slugify-string);border:1px solid var(--border-slugify-string);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-slugify-string h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-slugify-string h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-slugify-string p{color:var(--muted-slugify-string);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-slugify-string{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-slugify-string th{background:var(--primary-lt-slugify-string);color:var(--primary-slugify-string);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-slugify-string td{padding:9px 14px;border-bottom:1px solid var(--border-slugify-string);}
.bf-table-slugify-string tr:nth-child(even) td{background:var(--bg-slugify-string);}
.bf-table-slugify-string code{font-size:12.5px;}

.btn-calc-slugify-string{background:linear-gradient(135deg,#0d9488,#134e4a);color:#fff;border:none;border-radius:10px;padding:12px 32px;font-size:15px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;}
.btn-calc-slugify-string:hover{opacity:.9;}
.btn-outline-purple-slugify-string{background:transparent;color:var(--primary-slugify-string);border:2px solid var(--primary-slugify-string);border-radius:10px;padding:10px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-outline-purple-slugify-string:hover{background:var(--primary-lt-slugify-string);}
.btn-danger-soft-slugify-string{background:transparent;color:#dc2626;border:2px solid #fca5a5;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-danger-soft-slugify-string:hover{background:#fef2f2;}
.section-divider-slugify-string{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-slugify-string);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-slugify-string);display:flex;justify-content:space-between;align-items:center;}
.result-box-slugify-string{background:var(--primary-lt-slugify-string);border:1.5px solid #99f6e4;border-radius:12px;padding:18px 20px;font-size:16px;font-weight:700;color:#134e4a;min-height:56px;display:flex;align-items:center;word-break:break-all;}
.toast-box{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box.show{opacity:1;transform:translateY(0);}

 /* Tabs */
 .tab-row-slugify-string{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border-slugify-string);}
 .tab-btn-slugify-string{background:transparent;border:none;font-family:inherit;font-size:14px;font-weight:700;color:var(--muted-slugify-string);padding:10px 4px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;}
 .tab-btn-slugify-string.active{color:var(--primary-slugify-string);border-bottom-color:var(--primary-slugify-string);}
 .tab-panel-slugify-string{display:none;}
 .tab-panel-slugify-string.active{display:block;}
 .opt-row-slugify-string{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end;margin-bottom:16px;}
 .opt-group-slugify-string{min-width:150px;}
 .form-check-label-slugify-string{font-size:13px;font-weight:600;color:var(--text-slugify-string);}
 .dropzone-slugify-string{border:2px dashed var(--border-slugify-string);border-radius:12px;padding:28px 16px;text-align:center;cursor:pointer;transition:all .15s;background:var(--bg-slugify-string);}
 .dropzone-slugify-string:hover, .dropzone.dragover{border-color:var(--primary-slugify-string);background:var(--primary-lt-slugify-string);}
 .dropzone-slugify-string i{font-size:28px;color:var(--primary-slugify-string);}
 .dropzone-slugify-string p{margin:8px 0 0;font-size:13px;color:var(--muted-slugify-string);font-weight:600;}
 .dropzone-slugify-string .fname{color:var(--primary-slugify-string);font-weight:700;}

 .results-wrap-slugify-string{max-height:420px;overflow-y:auto;border:1px solid var(--border-slugify-string);border-radius:12px;}
.results-table-slugify-string{width:100%;border-collapse:collapse;font-size:13px;}
.results-table-slugify-string thead th{position:sticky;top:0;background:var(--primary-lt-slugify-string);color:var(--primary-slugify-string);font-weight:700;padding:9px 12px;text-align:left;z-index:1;}
.results-table-slugify-string td{padding:8px 12px;border-bottom:1px solid var(--border-slugify-string);vertical-align:top;}
.results-table-slugify-string tr:last-child td{border-bottom:none;}

.orig-cell-slugify-string{color:var(--muted-slugify-string);}
.slug-cell-slugify-string{font-family:monospace;font-weight:700;color:#0f766e;}
.row-copy-btn-slugify-string{background:transparent;border:1px solid var(--border-slugify-string);border-radius:6px;padding:3px 8px;font-size:11px;font-weight:700;color:var(--muted-slugify-string);cursor:pointer;}
.row-copy-btn-slugify-string:hover{border-color:var(--primary-slugify-string);color:var(--primary-slugify-string);}
.empty-hint-slugify-string{padding:32px 16px;text-align:center;color:var(--muted-slugify-string);font-size:13px;}
.stat-pill-slugify-string{background:var(--primary-lt-slugify-string);border:1px solid #99f6e4;border-radius:999px;padding:4px 12px;font-size:12px;font-weight:700;color:#0f766e;}
textarea.mono-slugify-string{min-height:200px;resize:vertical;}

/* MERMAID LIVE EDITOR */
.page-hero-mermaid-editor{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:40px 0 32px;}
.page-hero-mermaid-editor h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-mermaid-editor{background:var(--white-mermaid-editor);border:1px solid var(--border-mermaid-editor);border-radius:16px;padding:24px;margin-bottom:20px;}
.content-block-mermaid-editor{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-mermaid-editor h2{font-size:20px;font-weight:800;letter-spacing:-0.02em;margin-bottom:10px;}
.content-block-mermaid-editor h3{font-size:16px;font-weight:700;margin:20px 0 8px;}
.content-block-mermaid-editor p{color:var(--muted-mermaid-editor);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-mermaid-editor{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-mermaid-editor th{background:var(--primary-lt-mermaid-editor);color:var(--primary-mermaid-editor);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-mermaid-editor td{padding:9px 14px;border-bottom:1px solid var(--border-mermaid-editor);}
.bf-table-mermaid-editor tr:nth-child(even) td{background:var(--bg-mermaid-editor);}
.bf-table-mermaid-editor code{font-size:12.5px;}

.btn-calc-mermaid-editor{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;font-family:inherit;cursor:pointer;transition:opacity .15s;}
.btn-calc-mermaid-editor:hover{opacity:.9;}
.btn-outline-purple-mermaid-editor{background:transparent;color:var(--primary-mermaid-editor);border:2px solid var(--primary-mermaid-editor);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-outline-purple-mermaid-editor:hover{background:var(--primary-lt);}
.btn-danger-soft-mermaid-editor{background:transparent;color:#dc2626;border:2px solid #fca5a5;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:all .15s;}
.btn-danger-soft-mermaid-editor:hover{background:#fef2f2;}
.section-divider-mermaid-editor{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-mermaid-editor);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-mermaid-editor);display:flex;justify-content:space-between;align-items:center;}
.result-box-mermaid-editor{background:var(--primary-lt-mermaid-editor);border:1.5px solid #ddd6fe;border-radius:12px;padding:18px;min-height:360px;display:flex;align-items:center;justify-content:center;overflow:auto;position:relative;}
.result-box-mermaid-editor svg{max-width:100%;height:auto;}
.preset-btn-mermaid-editor{font-size:12px;font-weight:700;background:var(--bg-mermaid-editor);border:1px solid var(--border-mermaid-editor);border-radius:999px;padding:5px 12px;cursor:pointer;color:var(--muted-mermaid-editor);}
.preset-btn-mermaid-editor:hover{border-color:var(--primary-mermaid-editor);color:var(--primary-mermaid-editor);}
.preset-btn-mermaid-editor.active{background:var(--primary-lt-mermaid-editor);border-color:var(--primary-mermaid-editor);color:var(--primary-mermaid-editor);}
.error-text-mermaid-editor{color:#dc2626;font-size:13px;font-weight:600;margin-top:6px;white-space:pre-wrap;}
.toast-box-mermaid-editor{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-mermaid-editor.show{opacity:1;transform:translateY(0);}
#cronInputWrap textarea{resize:vertical;min-height:280px;}
.zoom-controls-mermaid-editor{position:absolute;top:10px;right:10px;display:flex;gap:6px;}
.zoom-btn-mermaid-editor{background:#fff;border:1px solid var(--border);border-radius:8px;width:30px;height:30px;font-size:14px;font-weight:700;color:var(--muted-mermaid-editor);cursor:pointer;display:flex;align-items:center;justify-content:center;}
.zoom-btn-mermaid-editor:hover{border-color:var(--primary-mermaid-editor);color:var(--primary-mermaid-editor);}


/* GOOGLE CLOUD CRON GENERATOR */
.page-hero-google-cron-generator{background:linear-gradient(135deg,#1a73e8 0%,#174ea6 100%);color:#fff;padding:40px 0 32px;}
.page-hero-google-cron-generator h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-google-cron-generator{background:var(--white-google-cron-generator);border:1px solid var(--border-google-cron-generator);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-google-cron-generator{background:var(--white-google-cron-generator);border:1px solid var(--border-google-cron-generator);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-google-cron-generator h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-google-cron-generator p{color:var(--muted-google-cron-generator);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-google-cron-generator{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-google-cron-generator th{background:var(--primary-lt-google-cron-generator);color:var(--dark-google-cron-generator);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-google-cron-generator td{padding:9px 14px;border-bottom:1px solid var(--border-google-cron-generator);}

.section-divider-google-cron-generator{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-google-cron-generator);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-google-cron-generator);}
.result-box-google-cron-generator{background:var(--primary-lt-google-cron-generator);border:1.5px solid #aecbfa;border-radius:12px;padding:16px;font-size:15px;font-weight:700;color:var(--dark-google-cron-generator);min-height:50px;display:flex;align-items:center;word-break:break-all;}
.field-inputs-google-cron-generator{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;}
@media (max-width:760px){.field-inputs{grid-template-columns:repeat(3,1fr);}}
.field-inputs-google-cron-generator .fi label{font-size:10px;font-weight:700;color:var(--muted-google-cron-generator);text-transform:uppercase;margin-bottom:4px;display:block;}
.error-text-google-cron-generator{color:#dc2626;font-size:13px;font-weight:600;margin-top:8px;}
.code-box-google-cron-generator{background:#111827;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;}
.code-copy-btn-google-cron-generator{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-google-cron-generator{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-google-cron-generator.show{opacity:1;transform:translateY(0);}
.preset-btn-google-cron-generator{font-size:12px;font-weight:700;background:var(--bg-google-cron-generator);border:1px solid var(--border-google-cron-generator);border-radius:999px;padding:5px 12px;cursor:pointer;color:var(--muted-google-cron-generator);}
.preset-btn-google-cron-generator:hover{border-color:var(--primary-google-cron-generator);color:var(--primary-google-cron-generator);}

/* IAM POLICY VALIDATOR */
.page-hero-iam-policy-validator{background:linear-gradient(135deg,#4338ca 0%,#1e1b4b 100%);color:#fff;padding:40px 0 32px;}
.page-hero-iam-policy-validator h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-iam-policy-validator{background:var(--white-iam-policy-validator);border:1px solid var(--border-iam-policy-validator);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-iam-policy-validator{background:var(--white-iam-policy-validator);border:1px solid var(--border-iam-policy-validator);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-iam-policy-validator h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-iam-policy-validator p{color:var(--muted-iam-policy-validator);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-iam-policy-validator{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-iam-policy-validator th{background:var(--primary-lt-iam-policy-validator);color:var(--dark-iam-policy-validator);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-iam-policy-validator td{padding:9px 14px;border-bottom:1px solid var(--border-iam-policy-validator);}

.btn-calc-iam-policy-validator{background:linear-gradient(135deg,#4338ca,#1e1b4b);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple{background:transparent;color:var(--primary-iam-policy-validator);border:2px solid var(--primary-iam-policy-validator);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple:hover{background:var(--primary-lt);}
.section-divider-iam-policy-validator{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-iam-policy-validator);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-iam-policy-validator);}
.tab-row-iam-policy-validator{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border-iam-policy-validator);}
.tab-btn-iam-policy-validator{background:transparent;border:none;font-size:14px;font-weight:700;color:var(--muted-iam-policy-validator);padding:10px 4px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;}
.tab-btn-iam-policy-validator.active{color:var(--primary-iam-policy-validator);border-bottom-color:var(--primary-iam-policy-validator);}
.tab-panel-iam-policy-validator{display:none;}
.tab-panel-iam-policy-validator.active{display:block;}
.preset-btn-iam-policy-validator{font-size:12px;font-weight:700;background:var(--bg-iam-policy-validator);border:1px solid var(--border-iam-policy-validator);border-radius:999px;padding:5px 12px;cursor:pointer;color:var(--muted-iam-policy-validator);}
.preset-btn-iam-policy-validator:hover{border-color:var(--primary-iam-policy-validator);color:var(--primary-iam-policy-validator);}
.result-panel-iam-policy-validator{border-radius:12px;padding:16px;margin-top:16px;}
.result-item-iam-policy-validator{display:flex;gap:10px;align-items:flex-start;padding:8px 0;font-size:13.5px;border-bottom:1px solid var(--border-iam-policy-validator);}
.result-item-iam-policy-validator:last-child{border-bottom:none;}
.result-item-iam-policy-validator i{margin-top:2px;flex-shrink:0;}
.badge-count-iam-policy-validator{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;}
.toast-box-iam-policy-validator{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-iam-policy-validator.show{opacity:1;transform:translateY(0);}
.textarea-iam-policy-validator.form-control.mono{min-height:260px;resize:vertical;}

/* S3 Bucket Policy Generator */
.page-hero-s3-bucket-policy-generator{background:linear-gradient(135deg,#0f766e 0%,#134e4a 100%);color:#fff;padding:40px 0 32px;}
.page-hero-s3-bucket-policy-generator h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-s3-bucket-policy-generator{background:var(--white-s3-bucket-policy-generator);border:1px solid var(--border-s3-bucket-policy-generator);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-s3-bucket-policy-generator{background:var(--white-s3-bucket-policy-generator);border:1px solid var(--border-s3-bucket-policy-generator);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-s3-bucket-policy-generator h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-s3-bucket-policy-generator p{color:var(--muted-s3-bucket-policy-generator);font-size:14px;line-height:1.8;margin-bottom:12px;}
.content-block-s3-bucket-policy-generator h3{font-size:15px;font-weight:600;margin-bottom:10px;}

.bf-table-s3-bucket-policy-generator{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-s3-bucket-policy-generator th{background:var(--primary-lt-s3-bucket-policy-generator);color:var(--dark-s3-bucket-policy-generator);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-s3-bucket-policy-generator td{padding:9px 14px;border-bottom:1px solid var(--border-s3-bucket-policy-generator);}

.btn-calc-s3-bucket-policy-generator{background:linear-gradient(135deg,#0f766e,#134e4a);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-s3-bucket-policy-generator{background:transparent;color:var(--primary-s3-bucket-policy-generator);border:2px solid var(--primary-s3-bucket-policy-generator);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-s3-bucket-policy-generator:hover{background:var(--primary-lt-s3-bucket-policy-generator);}
.btn-ghost-sm-s3-bucket-policy-generator{background:transparent;border:1px solid var(--border-s3-bucket-policy-generator);color:var(--muted-s3-bucket-policy-generator);border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer;}
.btn-ghost-sm-s3-bucket-policy-generator:hover{border-color:var(--danger-s3-bucket-policy-generator);color:var(--danger-s3-bucket-policy-generator);}
.section-divider-s3-bucket-policy-generator{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-s3-bucket-policy-generator);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-s3-bucket-policy-generator);}
.result-box-s3-bucket-policy-generator{background:var(--primary-lt-s3-bucket-policy-generator);border:1.5px solid #99f6e4;border-radius:12px;padding:16px;}
.code-box-s3-bucket-policy-generator{background:#111827;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;}
.code-copy-btn-s3-bucket-policy-generator{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-s3-bucket-policy-generator{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-s3-bucket-policy-generator.show{opacity:1;transform:translateY(0);}
.preset-btn-s3-bucket-policy-generator{font-size:12px;font-weight:700;background:var(--bg-s3-bucket-policy-generator);border:1px solid var(--border-s3-bucket-policy-generator);border-radius:999px;padding:7px 14px;cursor:pointer;color:var(--muted-s3-bucket-policy-generator);}
.preset-btn-s3-bucket-policy-generator:hover{border-color:var(--primary-s3-bucket-policy-generator);color:var(--primary-s3-bucket-policy-generator);}
.stmt-card-s3-bucket-policy-generator{border:1.5px solid var(--border-s3-bucket-policy-generator);border-radius:12px;padding:18px;margin-bottom:16px;position:relative;background:#fafafa;}
.stmt-card-s3-bucket-policy-generator h5{font-size:13px;font-weight:800;color:var(--dark-s3-bucket-policy-generator);margin-bottom:12px;text-transform:uppercase;letter-spacing:.04em;}
.check-grid-s3-bucket-policy-generator{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;}
@media (max-width:600px){.check-grid{grid-template-columns:1fr;}}
.form-check-label-s3-bucket-policy-generator{font-size:12.5px;font-weight:600;}

/* TERRAFORM VARIABLE GENERATOR */

.page-hero-terraform-variable{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:40px 0 32px;}
.page-hero-terraform-variable h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-terraform-variable{background:var(--white-terraform-variable);border:1px solid var(--border-terraform-variable);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-terraform-variable{background:var(--white-terraform-variable);border:1px solid var(--border-terraform-variable);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-terraform-variable h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-terraform-variable h3{font-size:15px;font-weight:700;margin-bottom:10px;}
.content-block-terraform-variable p{color:var(--muted-terraform-variable);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-terraform-variable{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-terraform-variable th{background:var(--primary-lt-terraform-variable);color:var(--dark-terraform-variable);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-terraform-variable td{padding:9px 14px;border-bottom:1px solid var(--border-terraform-variable);}

.btn-calc-terraform-variable{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-terraform-variable{background:transparent;color:var(--primary-terraform-variable);border:2px solid var(--primary-terraform-variable);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-terraform-variable:hover{background:var(--primary-lt-terraform-variable);}
.btn-ghost-sm-terraform-variable{background:transparent;border:1px solid var(--border-terraform-variable);color:var(--muted-terraform-variable);border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer;}
.btn-ghost-sm-terraform-variable:hover{border-color:var(--danger-terraform-variable);color:var(--danger-terraform-variable);}
.section-divider-terraform-variable{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-terraform-variable);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-terraform-variable);}
.tab-row-terraform-variable{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border);flex-wrap:wrap;}
.tab-btn-terraform-variable{background:transparent;border:none;font-size:14px;font-weight:700;color:var(--muted);padding:10px 4px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;}
.tab-btn-terraform-variable.active{color:var(--primary-terraform-variable);border-bottom-color:var(--primary-terraform-variable);}
.tab-panel-terraform-variable{display:none;}
.tab-panel-terraform-variable.active{display:block;}
.code-box-terraform-variable{background:#111827;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;max-height:420px;overflow:auto;}
.code-copy-btn-terraform-variable{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-terraform-variable{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-terraform-variable.show{opacity:1;transform:translateY(0);}
.var-card-terraform-variable{border:1.5px solid var(--border-terraform-variable);border-radius:12px;padding:16px;margin-bottom:14px;position:relative;background:#fafafa;}
.error-text-terraform-variable{color:#dc2626;font-size:13px;font-weight:600;margin-top:8px;}
.textarea-terraform-variable.form-control.mono{min-height:220px;resize:vertical;}

/* UPI CHARGES CALCUALTOE */
.page-hero-upi-charge{background:linear-gradient(135deg,#4338ca 0%,#312e81 100%);color:#fff;padding:40px 0 32px;}
.page-hero-upi-charge h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-upi-charge{background:var(--white-upi-charge);border:1px solid var(--border-upi-charge);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-upi-charge{background:var(--white-upi-charge);border:1px solid var(--border-upi-charge);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-upi-charge h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-upi-charge h3{font-size:15px;font-weight:700;margin-bottom:10px;}

.content-block-upi-charge p{color:var(--muted-upi-charge);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-upi-charge{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-upi-charge th{background:var(--primary-lt-upi-charge);color:var(--dark-upi-charge);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-upi-charge td{padding:9px 14px;border-bottom:1px solid var(--border-upi-charge);}

.btn-calc-upi-charge{background:linear-gradient(135deg,#4338ca,#312e81);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-upi-charge{background:transparent;color:var(--primary-upi-charge);border:2px solid var(--primary-upi-charge);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-upi-charge:hover{background:var(--primary-lt-upi-charge);}
.btn-ghost-sm-upi-charge{background:transparent;border:1px solid var(--border-upi-charge);color:var(--muted-upi-charge);border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer;}
.btn-ghost-sm-upi-charge:hover{border-color:var(--danger-upi-charge);color:var(--danger-upi-charge);}
.section-divider-upi-charge{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-upi-charge);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border);}
.result-box-upi-charge{background:var(--primary-lt-upi-charge);border:1.5px solid #c7d2fe;border-radius:12px;padding:16px;}
.result-row-upi-charge{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px dashed #c7d2fe;font-size:13.5px;}
.result-row-upi-charge:last-child{border-bottom:none;}
.result-row-upi-charge .lbl{color:var(--muted);font-weight:600;}
.result-row-upi-charge .val{font-weight:800;color:var(--text-upi-charge);font-family:'SFMono-Regular',Consolas,monospace;}
.result-row-upi-charge.total .val{color:var(--dark-upi-charge);font-size:17px;}
.badge-free-upi-charge{background:#d1fae5;color:var(--good-upi-charge);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.badge-charge-upi-charge{background:#fee2e2;color:var(--danger-upi-charge);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.code-box-upi-charge{background:#111827;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;}
.code-copy-btn-upi-charge{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-upi-charge{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-upi-charge.show{opacity:1;transform:translateY(0);}
.preset-btn-upi-charge{font-size:12px;font-weight:700;background:var(--bg-upi-charge);border:1px solid var(--border-upi-charge);border-radius:999px;padding:7px 14px;cursor:pointer;color:var(--muted-upi-charge);}
.preset-btn-upi-charge:hover{border-color:var(--primary-upi-charge);color:var(--primary-upi-charge);}
.preset-btn-upi-charge.active{border-color:var(--primary-upi-charge);color:var(--primary-upi-charge);background:var(--primary-lt-upi-charge);}
.form-check-label-upi-charge{font-size:12.5px;font-weight:600;}
.who-pays-toggle-upi-charge{display:flex;border:1.5px solid var(--border-upi-charge);border-radius:10px;overflow:hidden;width:fit-content;}
.who-pays-toggle-upi-charge button{border:none;background:var(--white-upi-charge);padding:9px 16px;font-size:12.5px;font-weight:700;color:var(--muted-upi-charge);cursor:pointer;}
.who-pays-toggle-upi-charge button.active{background:var(--primary-upi-charge);color:#fff;}


/* TERRAFORM FORMATER */
.page-hero-terraform-formatter{background:linear-gradient(135deg,#be123c 0%,#4c0519 100%);color:#fff;padding:40px 0 32px;}
.page-hero-terraform-formatter h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-terraform-formatter{background:var(--white-terraform-formatter);border:1px solid var(--border-terraform-formatter);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-terraform-formatter{background:var(--white-terraform-formatter);border:1px solid var(--border-terraform-formatter);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-terraform-formatter h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-terraform-formatter h3{font-size:15px;font-weight:700;margin-bottom:10px;}

.textarea-terraform-formatter.form-control.mono{min-height:340px;resize:vertical;}
.content-block-terraform-formatter p{color:var(--muted-terraform-formatter);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-terraform-formatter{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-terraform-formatter th{background:var(--primary-lt-terraform-formatter);color:var(--dark-terraform-formatter);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-terraform-formatter td{padding:9px 14px;border-bottom:1px solid var(--border-terraform-formatter);}
.btn-calc-terraform-formatter{background:linear-gradient(135deg,#be123c,#4c0519);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-terraform-formatter{background:transparent;color:var(--primary-terraform-formatter);border:2px solid var(--primary-terraform-formatter);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-terraform-formatter:hover{background:var(--primary-lt-terraform-formatter);}
.section-divider-terraform-formatter{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-terraform-formatter);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-terraform-formatter);}
.code-box-terraform-formatter{background:#111827;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre;word-break:normal;overflow-x:auto;position:relative;margin-top:0;min-height:340px;}
.code-copy-btn-terraform-formatter{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-terraform-formatter{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-terraform-formatter.show{opacity:1;transform:translateY(0);}
.stat-badge-terraform-formatter{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;background:#d1fae5;color:var(--ok);}
.col-head-terraform-formatter{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-terraform-formatter);margin-bottom:8px;}

.diff-wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin-top:12px;}
.diff-card{border-radius:10px;overflow:hidden;}
.diff-card.before{background:#fef2f2;}
.diff-card.after{background:#f0fdf4;}
.diff-label{padding:8px 14px;font-size:12px;font-weight:700;}
.diff-card.before .diff-label{color:var(--danger);}
.diff-card.after .diff-label{color:var(--ok);}
.diff-card pre{margin:0;padding:0 14px 14px;overflow-x:auto;}
.diff-card code{font-family:'SFMono-Regular',Consolas,monospace;font-size:12.5px;line-height:1.7;}
.diff-card.before code{color:#991b1b;}
.diff-card.after code{color:#065f46;}

/* TERRAFORM VALIDATOR */
.page-hero-terraform-validator{background:linear-gradient(135deg,#2563eb 0%,#1e3a8a 100%);color:#fff;padding:40px 0 32px;}
.page-hero-terraform-validator h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-terraform-validator{background:var(--white-terraform-validator);border:1px solid var(--border-terraform-validator);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-terraform-validator{background:var(--white-terraform-validator);border:1px solid var(--border-terraform-validator);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-terraform-validator h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-terraform-validator h3{font-size:15px;font-weight:700;margin-bottom:10px;}

.content-block-terraform-validator p{color:var(--muted-terraform-validator);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-terraform-validator{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-terraform-validator th{background:var(--primary-lt-terraform-validator);color:var(--dark-terraform-validator);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-terraform-validator td{padding:9px 14px;border-bottom:1px solid var(--border-terraform-validator);}

.btn-calc-terraform-validator{background:linear-gradient(135deg,#2563eb,#1e3a8a);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-terraform-validator{background:transparent;color:var(--primary-terraform-validator);border:2px solid var(--primary-terraform-validator);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-terraform-validator:hover{background:var(--primary-lt-terraform-validator);}
.section-divider-terraform-validator{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-terraform-validator);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-terraform-validator);}
.result-panel-terraform-validator{border-radius:12px;padding:4px 16px;margin-top:16px;border:1px solid var(--border-terraform-validator);}
.result-item-terraform-validator{display:flex;gap:10px;align-items:flex-start;padding:10px 0;font-size:13.5px;border-bottom:1px solid var(--border-terraform-validator);}
.result-item-terraform-validator:last-child{border-bottom:none;}
.result-item-terraform-validator i{margin-top:2px;flex-shrink:0;}
.result-item-terraform-validator .line-tag{font-family:monospace;font-size:11.5px;color:var(--muted-terraform-validator);background:var(--bg-terraform-validator);border-radius:5px;padding:1px 6px;margin-right:6px;}
.badge-count-terraform-validator{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;padding:5px 12px;border-radius:999px;}
.toast-box-terraform-validator{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-terraform-validator.show{opacity:1;transform:translateY(0);}
.preset-btn-terraform-validator{font-size:12px;font-weight:700;background:var(--bg-terraform-validator);border:1px solid var(--border-terraform-validator);border-radius:999px;padding:5px 12px;cursor:pointer;color:var(--muted);}
.preset-btn-terraform-validator:hover{border-color:var(--primary-terraform-validator);color:var(--primary-terraform-validator);}
.textarea-terraform-validator.form-control.mono{min-height:320px;resize:vertical;}


/* KUBERNETES RESOURCE CALCUALTOR */
.page-hero-kubernetes-resource-calcualtor{background:linear-gradient(135deg,#326ce5 0%,#1a2f6e 100%);color:#fff;padding:40px 0 32px;}
.page-hero-kubernetes-resource-calcualtor h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-kubernetes-resource-calcualtor{background:var(--white-kubernetes-resource-calcualtor);border:1px solid var(--border-kubernetes-resource-calcualtor);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-kubernetes-resource-calcualtor{background:var(--white-kubernetes-resource-calcualtor);border:1px solid var(--border-kubernetes-resource-calcualtor);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-kubernetes-resource-calcualtor h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-kubernetes-resource-calcualtor h3{font-size:15px;font-weight:700;margin-bottom:10px;}

.content-block-kubernetes-resource-calcualtor p{color:var(--muted-kubernetes-resource-calcualtor);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-kubernetes-resource-calcualtor{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-kubernetes-resource-calcualtor th{background:var(--primary-lt-kubernetes-resource-calcualtor);color:var(--dark-kubernetes-resource-calcualtor);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-kubernetes-resource-calcualtor td{padding:9px 14px;border-bottom:1px solid var(--border-kubernetes-resource-calcualtor);}

.btn-calc-kubernetes-resource-calcualtor{background:linear-gradient(135deg,#326ce5,#1a2f6e);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-kubernetes-resource-calcualtor{background:transparent;color:var(--primary-kubernetes-resource-calcualtor);border:2px solid var(--primary-kubernetes-resource-calcualtor);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-kubernetes-resource-calcualtor:hover{background:var(--primary-lt-kubernetes-resource-calcualtor);}
.section-divider-kubernetes-resource-calcualtor{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-kubernetes-resource-calcualtor);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-kubernetes-resource-calcualtor);}
.tab-row-kubernetes-resource-calcualtor{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border-kubernetes-resource-calcualtor);}
.tab-btn-kubernetes-resource-calcualtor{background:transparent;border:none;font-size:14px;font-weight:700;color:var(--muted-kubernetes-resource-calcualtor);padding:10px 4px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;}
.tab-btn-kubernetes-resource-calcualtor.active{color:var(--primary-kubernetes-resource-calcualtor);border-bottom-color:var(--primary-kubernetes-resource-calcualtor);}
.tab-panel-kubernetes-resource-calcualtor{display:none;}
.tab-panel-kubernetes-resource-calcualtor.active{display:block;}
.result-box-kubernetes-resource-calcualtor{background:var(--primary-lt-kubernetes-resource-calcualtor);border:1.5px solid #bfdbfe;border-radius:12px;padding:16px;margin-top:12px;}
.stat-row-kubernetes-resource-calcualtor{display:flex;justify-content:space-between;padding:6px 0;font-size:13.5px;border-bottom:1px dashed var(--border-kubernetes-resource-calcualtor);}
.stat-row-kubernetes-resource-calcualtor:last-child{border-bottom:none;}
.stat-row-kubernetes-resource-calcualtor .val{font-weight:800;color:var(--dark-kubernetes-resource-calcualtor);}
.code-box-kubernetes-resource-calcualtor{background:#111827;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;}
.code-copy-btn-kubernetes-resource-calcualtor{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-kubernetes-resource-calcualtor{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-kubernetes-resource-calcualtor.show{opacity:1;transform:translateY(0);}
.warn-text-kubernetes-resource-calcualtor{color:var(--warn-kubernetes-resource-calcualtor);font-size:12.5px;font-weight:600;margin-top:8px;}


/* DOCKER RESOURCE CALCULATOR */
.page-hero-docker-resource-calculator{background:linear-gradient(135deg,#2496ED 0%,#043b6b 100%);color:#fff;padding:40px 0 32px;}
.page-hero-docker-resource-calculator h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-docker-resource-calculator{background:var(--white-docker-resource-calculator);border:1px solid var(--border-docker-resource-calculator);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-docker-resource-calculator{background:var(--white-docker-resource-calculator);border:1px solid var(--border-docker-resource-calculator);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-docker-resource-calculator h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-docker-resource-calculator h3{font-size:15.5px;font-weight:800;margin:18px 0 8px;color:var(--dark-docker-resource-calculator);}
.content-block-docker-resource-calculator p{color:var(--muted-docker-resource-calculator);font-size:14px;line-height:1.8;margin-bottom:12px;}
.content-block-docker-resource-calculator li{color:var(--muted-docker-resource-calculator);font-size:14px;line-height:1.8;}
.bf-table-docker-resource-calculator{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-docker-resource-calculator th{background:var(--primary-lt-docker-resource-calculator);color:var(--dark-docker-resource-calculator);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-docker-resource-calculator td{padding:9px 14px;border-bottom:1px solid var(--border-docker-resource-calculator);}

.btn-calc-docker-resource-calculator{background:linear-gradient(135deg,#2496ED,#043b6b);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-docker-resource-calculator{background:transparent;color:var(--primary-docker-resource-calculator);border:2px solid var(--primary-docker-resource-calculator);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-docker-resource-calculator:hover{background:var(--primary-lt-docker-resource-calculator);}
.section-divider-docker-resource-calculator{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-docker-resource-calculator);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border);}
.tab-row-docker-resource-calculator{display:flex;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border-docker-resource-calculator);}
.tab-btn-docker-resource-calculator{background:transparent;border:none;font-size:14px;font-weight:700;color:var(--muted-docker-resource-calculator);padding:10px 4px;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;}
.tab-btn-docker-resource-calculator.active{color:var(--primary-docker-resource-calculator);border-bottom-color:var(--primary-docker-resource-calculator);}
.tab-panel-docker-resource-calculator{display:none;}
.tab-panel-docker-resource-calculator.active{display:block;}
.result-box-docker-resource-calculator{background:var(--primary-lt-docker-resource-calculator);border:1.5px solid #bfe3fb;border-radius:12px;padding:16px;margin-top:12px;}
.stat-row-docker-resource-calculator{display:flex;justify-content:space-between;padding:6px 0;font-size:13.5px;border-bottom:1px dashed var(--border-docker-resource-calculator);}
.stat-row-docker-resource-calculator:last-child{border-bottom:none;}
.stat-row-docker-resource-calculator .val{font-weight:800;color:var(--dark-docker-resource-calculator);}
.code-box-docker-resource-calculator{background:#0b1220;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;}
.code-copy-btn-docker-resource-calculator{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-docker-resource-calculator{position:fixed;bottom:20px;right:20px;background:#0b1220;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-docker-resource-calculator.show{opacity:1;transform:translateY(0);}
.warn-text-docker-resource-calculator{color:var(--warn-docker-resource-calculator);font-size:12.5px;font-weight:600;margin-top:8px;}


/* SHOPIFY PROFIT MARGIN CALCUALTOR */
.page-hero-shopify-profit-margin{background:linear-gradient(135deg,#008060 0%,#003326 100%);color:#fff;padding:40px 0 32px;}
.page-hero-shopify-profit-margin h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-shopify-profit-margin{background:var(--white-shopify-profit-margin);border:1px solid var(--border-shopify-profit-margin);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-shopify-profit-margin{background:var(--white-shopify-profit-margin);border:1px solid var(--border-shopify-profit-margin);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-shopify-profit-margin h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-shopify-profit-margin h3{font-size:15.5px;font-weight:800;margin:18px 0 8px;color:var(--dark-shopify-profit-margin);}
.content-block-shopify-profit-margin p{color:var(--muted-shopify-profit-margin);font-size:14px;line-height:1.8;margin-bottom:12px;}
.content-block-shopify-profit-margin li{color:var(--muted-shopify-profit-margin);font-size:14px;line-height:1.8;}
.bf-table-shopify-profit-margin{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-shopify-profit-margin th{background:var(--primary-lt-shopify-profit-margin);color:var(--dark-shopify-profit-margin);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-shopify-profit-margin td{padding:9px 14px;border-bottom:1px solid var(--border-shopify-profit-margin);}

.btn-calc-shopify-profit-margin{background:linear-gradient(135deg,#008060,#003326);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-shopify-profit-margin{background:transparent;color:var(--primary-shopify-profit-margin);border:2px solid var(--primary-shopify-profit-margin);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-shopify-profit-margin:hover{background:var(--primary-lt-shopify-profit-margin);}
.section-divider-shopify-profit-margin{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-shopify-profit-margin);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-shopify-profit-margin);}
.group-label-shopify-profit-margin{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-shopify-profit-margin);margin:22px 0 10px;padding-top:14px;border-top:1px solid var(--border-shopify-profit-margin);}
.group-label-shopify-profit-margin:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.result-box-shopify-profit-margin{background:var(--primary-lt-shopify-profit-margin);border:1.5px solid #b9e2d4;border-radius:12px;padding:16px;margin-top:12px;}
.stat-row-shopify-profit-margin{display:flex;justify-content:space-between;padding:6px 0;font-size:13.5px;border-bottom:1px dashed var(--border);}
.stat-row-shopify-profit-margin:last-child{border-bottom:none;}
.stat-row-shopify-profit-margin .val{font-weight:800;color:var(--dark-shopify-profit-margin);}
.stat-row-shopify-profit-margin .val.neg{color:var(--danger-shopify-profit-margin);}
.headline-box-shopify-profit-margin{background:var(--dark-shopify-profit-margin);border-radius:12px;padding:18px 20px;margin-top:12px;color:#fff;display:flex;flex-wrap:wrap;gap:20px;}
.headline-item-shopify-profit-margin{flex:1;min-width:140px;}
.headline-item-shopify-profit-margin .lbl{font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:#bfe6d9;margin-bottom:4px;}
.headline-item-shopify-profit-margin .num{font-size:22px;font-weight:800;}
.warn-text-shopify-profit-margin{color:var(--warn-shopify-profit-margin);font-size:12.5px;font-weight:600;margin-top:8px;}

/* OCR TOOL */
.wrap-ocr-tool{max-width:1180px;margin:0 auto;padding:0 20px;}
/* ---------- header ---------- */
header.topbar-ocr-tool{position:sticky;top:0;z-index:40;background:color-mix(in srgb, var(--panel-ocr-tool) 92%, transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-ocr-tool);}
.topbar-inner-ocr-tool{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;max-width:1180px;margin:0 auto;}
.brand-ocr-tool{display:flex;align-items:center;gap:10px;font-family:var(--font-display-ocr-tool);font-weight:700;font-size:19px;letter-spacing:-.02em;}
.brand-mark-ocr-tool{width:34px;height:34px;border-radius:9px;background:linear-gradient(150deg,var(--accent-ocr-tool),var(--accent-deep-ocr-tool));display:flex;align-items:center;justify-content:center;position:relative;flex-shrink:0;}
.brand-mark-ocr-tool svg{width:19px;height:19px;}
.brand small-ocr-tool{display:block;font-family:var(--font-body-ocr-tool);font-weight:500;font-size:11px;color:var(--muted-ocr-tool);letter-spacing:0;margin-top:1px;}
.theme-toggle-ocr-tool{border:1.5px solid var(--border-ocr-tool);background:var(--panel-ocr-tool);width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ink-ocr-tool);font-size:16px;transition:.15s;}
.theme-toggle-ocr-tool:hover{border-color:var(--accent-deep-ocr-tool);color:var(--accent-deep-ocr-tool);}


/* ---------- hero / dropzone ---------- */
.hero-ocr-tool{padding:38px 0 8px;}
.hero-ocr-tool h1{font-family:var(--font-display-ocr-tool);font-size:clamp(24px,3.4vw,34px);font-weight:700;letter-spacing:-.03em;margin:0 0 6px;}
.hero-ocr-tool p{color:var(--muted-ocr-tool);font-size:14.5px;margin:0 0 24px;max-width:560px;}

.dropzone-ocr-tool{position:relative;border-radius:18px;background:var(--panel-ocr-tool);border:1px solid var(--border-ocr-tool);padding:46px 24px;text-align:center;cursor:pointer;transition:border-color .15s, background .15s;overflow:hidden;}
.dropzone-ocr-tool.dragover{border-color:var(--accent-deep-ocr-tool);background:var(--teal-soft-ocr-tool);}
.dz-corner-ocr-tool{position:absolute;width:22px;height:22px;border:2.5px solid var(--accent-deep-ocr-tool);opacity:.55;}
.dz-corner-ocr-tool.tl{top:14px;left:14px;border-right:none;border-bottom:none;border-radius:6px 0 0 0;}
.dz-corner-ocr-tool.tr{top:14px;right:14px;border-left:none;border-bottom:none;border-radius:0 6px 0 0;}
.dz-corner-ocr-tool.bl{bottom:14px;left:14px;border-right:none;border-top:none;border-radius:0 0 0 6px;}
.dz-corner-ocr-tool.br{bottom:14px;right:14px;border-left:none;border-top:none;border-radius:0 0 6px 0;}
.dz-icon-ocr-tool{width:52px;height:52px;border-radius:50%;background:var(--teal-soft-ocr-tool);color:var(--teal-ocr-tool);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:22px;}
.dropzone-ocr-tool h3{font-family:var(--font-display-ocr-tool);font-size:17px;margin:0 0 4px;font-weight:600;}
.dropzone-ocr-tool p{color:var(--muted-ocr-tool);font-size:13px;margin:0;}
.dropzone-ocr-tool .fmt{margin-top:14px;font-size:11.5px;color:var(--muted-ocr-tool);letter-spacing:.03em;text-transform:uppercase;font-weight:600;}
#fileInput-ocr-tool{display:none;}


/* ---------- options ---------- */
.options-bar-ocr-tool{margin-top:20px;background:var(--panel-ocr-tool);border:1px solid var(--border-ocr-tool);border-radius:var(--radius-ocr-tool);padding:18px 20px;display:grid;grid-template-columns:1.1fr 1.6fr;gap:22px;}
@media (max-width:820px){.options-bar{grid-template-columns:1fr;}}
.opt-label-ocr-tool{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-ocr-tool);margin-bottom:9px;}
.lang-grid-ocr-tool{display:flex;flex-wrap:wrap;gap:7px;}
.lang-chip-ocr-tool{border:1.5px solid var(--border-ocr-tool);border-radius:20px;padding:5px 12px;font-size:12.5px;font-weight:600;cursor:pointer;user-select:none;color:var(--ink-soft-ocr-tool);transition:.12s;}
.lang-chip-ocr-tool.active{background:var(--ink-ocr-tool);border-color:var(--ink-ocr-tool);color:var(--paper-ocr-tool);}
html[data-theme="dark"] .lang-chip-ocr-tool.active{background:var(--accent-ocr-tool);border-color:var(--accent-ocr-tool);color:#1b1200;}
.toggle-grid-ocr-tool{display:grid;grid-template-columns:1fr 1fr;gap:9px 18px;}
@media (max-width:520px){.toggle-grid{grid-template-columns:1fr;}}
.toggle-row-ocr-tool{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-bottom:1px dashed var(--border-ocr-tool);}
.toggle-row-ocr-tool:last-child{border-bottom:none;}
.toggle-row-ocr-tool .tlabel{font-size:13px;font-weight:600;}
.toggle-row-ocr-tool .thint{font-size:11px;color:var(--muted-ocr-tool);font-weight:500;}
.switch-ocr-tool{position:relative;width:38px;height:22px;flex-shrink:0;}
.switch-ocr-tool input{opacity:0;width:0;height:0;}
.slider-ocr-tool{position:absolute;inset:0;background:var(--border-ocr-tool);border-radius:20px;cursor:pointer;transition:.15s;}
.slider-ocr-tool::before{content:'';position:absolute;width:16px;height:16px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.15s;}
.switch-ocr-tool input:checked + .slider-ocr-tool{background:var(--teal-ocr-tool);}
.switch-ocr-tool input:checked + .slider-ocr-tool::before{transform:translateX(16px);}

.action-row-ocr-tool{display:flex;align-items:center;justify-content:space-between;margin-top:16px;gap:12px;flex-wrap:wrap;}
.batch-status-ocr-tool{font-size:12.5px;color:var(--muted-ocr-tool);font-weight:600;}
.btn-ocr-tool{border:none;border-radius:10px;padding:9px 16px;font-size:13px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.13s;font-family:var(--font-body-ocr-tool);}
.btn-primary-ocr-tool{background:var(--ink-ocr-tool);color:var(--paper-ocr-tool);}
.btn-primary-ocr-tool:hover{background:var(--ink-soft-ocr-tool);}
html[data-theme="dark"] .btn-primary-ocr-tool{background:var(--accent-ocr-tool);color:#1b1200;}
.btn-ghost-ocr-tool{background:transparent;border:1.5px solid var(--border-ocr-tool);color:var(--ink-soft-ocr-tool);}
.btn-ghost-ocr-tool:hover{border-color:var(--danger-ocr-tool);color:var(--danger-ocr-tool);}
.btn-sm-ocr-tool{padding:6px 11px;font-size:12px;border-radius:8px;}
.btn:disabled-ocr-tool{opacity:.45;cursor:not-allowed;}


/* ---------- results ---------- */
.results-ocr-tool{margin-top:26px;display:flex;flex-direction:column;gap:16px;}
.empty-state-ocr-tool{text-align:center;padding:40px 20px;color:var(--muted-ocr-tool);font-size:13.5px;}
.empty-state-ocr-tool i{font-size:26px;display:block;margin-bottom:8px;color:var(--border-ocr-tool);}

.card-ocr-tool{background:var(--panel-ocr-tool);border:1px solid var(--border-ocr-tool);border-radius:var(--radius-ocr-tool);box-shadow:var(--shadow-ocr-tool);overflow:hidden;}
.card-head-ocr-tool{display:flex;gap:14px;padding:16px 18px;align-items:flex-start;}
.thumb-ocr-tool{width:76px;height:76px;border-radius:10px;object-fit:cover;background:var(--paper-ocr-tool);border:1px solid var(--border-ocr-tool);flex-shrink:0;position:relative;overflow:hidden;}
.thumb-wrap-ocr-tool{position:relative;width:76px;height:76px;flex-shrink:0;}
.scanbeam-ocr-tool{position:absolute;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent,var(--accent-ocr-tool) 30%,var(--accent-ocr-tool) 70%,transparent);box-shadow:0 0 8px 1px var(--accent-ocr-tool);top:0;display:none;}
.thumb-wrap.scanning .scanbeam-ocr-tool{display:block;animation:sweep 1.6s linear infinite;}
@keyframes sweep{0%{top:0;}100%{top:100%;}}
.card-title-ocr-tool{font-weight:700;font-size:14px;margin:0 0 3px;word-break:break-all;}
.card-meta-ocr-tool{font-size:11.5px;color:var(--muted-ocr-tool);display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.badge-ocr-tool{display:inline-flex;align-items:center;gap:4px;font-size:10.5px;font-weight:700;padding:3px 8px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;}
.badge-queued-ocr-tool{background:var(--border-ocr-tool);color:var(--muted-ocr-tool);}
.badge-processing-ocr-tool{background:var(--warn-soft-ocr-tool);color:var(--warn-ocr-tool);}
.badge-done-ocr-tool{background:var(--teal-soft-ocr-tool);color:var(--teal-ocr-tool);}
.badge-error-ocr-tool{background:var(--danger-soft-ocr-tool);color:var(--danger-ocr-tool);}
.conf-badge-ocr-tool{font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:20px;}
.conf-hi-ocr-tool{background:var(--teal-soft-ocr-tool);color:var(--teal-ocr-tool);}
.conf-mid-ocr-tool{background:var(--warn-soft-ocr-tool);color:var(--warn-ocr-tool);}
.conf-lo-ocr-tool{background:var(--danger-soft-ocr-tool);color:var(--danger-ocr-tool);}
.card-actions-ocr-tool{margin-left:auto;display:flex;gap:6px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end;}
.icon-btn-ocr-tool{width:32px;height:32px;border-radius:8px;border:1.5px solid var(--border-ocr-tool);background:transparent;color:var(--ink-soft-ocr-tool);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;transition:.12s;}
.icon-btn-ocr-tool:hover{border-color:var(--ink-ocr-tool);color:var(--ink-ocr-tool);}
.icon-btn-ocr-tool.danger:hover{border-color:var(--danger-ocr-tool);color:var(--danger-ocr-tool);}


.card-body-ocr-tool{border-top:1px solid var(--border-ocr-tool);padding:14px 18px 18px;}
.progress-track-ocr-tool{height:5px;border-radius:4px;background:var(--border-ocr-tool);overflow:hidden;margin:4px 0 12px;}
.progress-fill-ocr-tool{height:100%;background:linear-gradient(90deg,var(--accent-deep-ocr-tool),var(--accent-ocr-tool));width:0%;transition:width .2s ease;}
.result-tabs-ocr-tool{display:flex;gap:4px;margin-bottom:10px;flex-wrap:wrap;}
.tab-btn-ocr-tool{border:1.5px solid var(--border-ocr-tool);background:transparent;padding:5px 12px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;color:var(--muted-ocr-tool);}
.tab-btn-ocr-tool.active{background:var(--ink-ocr-tool);border-color:var(--ink-ocr-tool);color:var(--paper-ocr-tool);}
html[data-theme="dark"] .tab-btn-ocr-tool.active{background:var(--accent-ocr-tool);border-color:var(--accent-ocr-tool);color:#1b1200;}
.pane-ocr-tool{display:none;}
.pane-ocr-tool.active{display:block;}
textarea.extract-ocr-tool{width:100%;min-height:130px;font-family:var(--font-mono-ocr-tool);font-size:12.5px;line-height:1.6;border:1px solid var(--border-ocr-tool);border-radius:10px;padding:12px;resize:vertical;background:var(--paper-ocr-tool);color:var(--ink-ocr-tool);}
.table-wrap-ocr-tool{overflow:auto;border:1px solid var(--border-ocr-tool);border-radius:10px;max-height:280px;}
table.extracted-ocr-tool{border-collapse:collapse;width:100%;font-size:12px;font-family:var(--font-mono-ocr-tool);}
table.extracted-ocr-tool td{border:1px solid var(--border-ocr-tool);padding:5px 8px;white-space:nowrap;}
.info-line-ocr-tool{font-size:12px;color:var(--muted-ocr-tool);margin:6px 0;display:flex;gap:14px;flex-wrap:wrap;}
.info-line-ocr-tool b{color:var(--ink-ocr-tool);}
.dl-row-ocr-tool{display:flex;gap:7px;margin-top:12px;flex-wrap:wrap;}
.dl-btn-ocr-tool{border:1.5px solid var(--border-ocr-tool);background:transparent;border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;color:var(--ink-soft-ocr-tool);cursor:pointer;display:inline-flex;align-items:center;gap:5px;}
.dl-btn-ocr-tool:hover{border-color:var(--teal-ocr-tool);color:var(--teal-ocr-tool);}
.error-msg-ocr-tool{color:var(--danger-ocr-tool);font-size:12.5px;font-weight:600;}
.barcode-chip-ocr-tool{display:inline-flex;align-items:center;gap:6px;background:var(--teal-soft-ocr-tool);color:var(--teal-ocr-tool);font-size:12px;font-weight:700;padding:5px 10px;border-radius:8px;margin-bottom:6px;}


/* NORMAL DISTRIBUTION CALCULATOR */
.page-hero-normal-distribution{background:linear-gradient(135deg,#4f46e5 0%,#1e1b4b 100%);color:#fff;padding:40px 0 32px;}
.page-hero-normal-distribution h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-normal-distribution{background:var(--panel-normal-distribution);border:1px solid var(--border-normal-distribution);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-normal-distribution{background:var(--panel-normal-distribution);border:1px solid var(--border-normal-distribution);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-normal-distribution h2{font-size:20px;font-weight:800;margin-bottom:10px;color:var(--heading-normal-distribution);}
.content-block-normal-distribution h3{font-size:15.5px;font-weight:800;margin:18px 0 8px;color:var(--heading-normal-distribution);}
.content-block-normal-distribution p{color:var(--muted-normal-distribution);font-size:14px;line-height:1.8;margin-bottom:12px;}
.content-block-normal-distribution li{color:var(--muted-normal-distribution);font-size:14px;line-height:1.8;}
.bf-table-normal-distribution{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-normal-distribution th{background:var(--primary-lt-normal-distribution);color:var(--heading-normal-distribution);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-normal-distribution td{padding:9px 14px;border-bottom:1px solid var(--border-normal-distribution);}
.bf-table-normal-distribution tr.clickable{cursor:pointer;}
.bf-table-normal-distribution tr.clickable:hover td{background:var(--primary-lt-normal-distribution);}

.section-divider-normal-distribution{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-normal-distribution);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-normal-distribution);}
.group-label-normal-distribution{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--heading-normal-distribution);margin:22px 0 10px;padding-top:14px;border-top:1px solid var(--border-normal-distribution);}
.group-label-normal-distribution:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.result-box-normal-distribution{background:var(--primary-lt-normal-distribution);border:1.5px solid rgba(var(--primary-rgb-normal-distribution),.25);border-radius:12px;padding:16px;margin-top:12px;}
.stat-row-normal-distribution{display:flex;justify-content:space-between;padding:6px 0;font-size:13.5px;border-bottom:1px dashed var(--border-normal-distribution);gap:10px;}
.stat-row-normal-distribution:last-child{border-bottom:none;}
.stat-row-normal-distribution .val{font-weight:800;color:var(--heading-normal-distribution);text-align:right;}
.stat-row-normal-distribution .val.neg{color:var(--danger-normal-distribution);}
.headline-box-normal-distribution{background:var(--headline-bg-normal-distribution);border-radius:12px;padding:18px 20px;margin-top:12px;color:#fff;display:flex;flex-wrap:wrap;gap:20px;}
.headline-item-normal-distribution{flex:1;min-width:150px;}
.headline-item-normal-distribution .lbl{font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:#c7c9fb;margin-bottom:4px;}
.headline-item-normal-distribution .num{font-size:21px;font-weight:800;}
.warn-text-normal-distribution{color:var(--warn-normal-distribution);font-size:12.5px;font-weight:600;margin-top:8px;}


.mode-tabs-normal-distribution{display:flex;flex-wrap:wrap;gap:8px;}
.mode-btn-normal-distribution{border:1.5px solid var(--border-normal-distribution);background:var(--panel-normal-distribution);color:var(--muted-normal-distribution);border-radius:20px;padding:8px 14px;font-size:12.5px;font-weight:700;cursor:pointer;transition:.13s;}
.mode-btn-normal-distribution.active{background:var(--primary-normal-distribution);border-color:var(--primary-normal-distribution);color:#fff;}

.chart-card-normal-distribution{background:var(--panel-normal-distribution);border:1px solid var(--border-normal-distribution);border-radius:14px;padding:20px;margin-top:16px;}
.chart-toolbar-normal-distribution{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;flex-wrap:wrap;gap:8px;}
.chart-legend-normal-distribution{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--muted-normal-distribution);font-weight:600;}
.chart-legend-normal-distribution span{display:inline-flex;align-items:center;gap:5px;}
.legend-dot-normal-distribution{width:9px;height:9px;border-radius:50%;display:inline-block;}
.zoom-controls-normal-distribution{display:flex;gap:6px;}
.zoom-btn-normal-distribution{width:30px;height:30px;border-radius:8px;border:1.5px solid var(--border-normal-distribution);background:var(--panel-normal-distribution);color:var(--text-normal-distribution);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:14px;}
.zoom-btn-normal-distribution:hover{border-color:var(--primary-normal-distribution);color:var(--primary-normal-distribution);}
.chart-wrap-normal-distribution{position:relative;width:100%;}
.chart-wrap-normal-distribution svg{width:100%;height:auto;display:block;cursor:crosshair;}
.chart-tooltip-normal-distribution{position:absolute;pointer-events:none;background:var(--heading-normal-distribution);color:#fff;font-size:11.5px;font-weight:600;padding:6px 10px;border-radius:8px;transform:translate(-50%,-115%);white-space:nowrap;opacity:0;transition:opacity .08s;z-index:5;}
.chart-tooltip-normal-distribution.show{opacity:1;}


.action-row-normal-distribution{display:flex;align-items:center;justify-content:flex-end;margin-top:16px;gap:8px;flex-wrap:wrap;}
.btn-tool-normal-distribution{border:1.5px solid var(--border-normal-distribution);background:var(--panel-normal-distribution);color:var(--text-normal-distribution);border-radius:10px;padding:9px 15px;font-size:12.5px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;}
.btn-tool-normal-distribution:hover{border-color:var(--primary-normal-distribution);color:var(--primary-normal-distribution);}
.btn-tool-normal-distribution.primary{background:var(--primary-normal-distribution);border-color:var(--primary-normal-distribution);color:#fff;}
.btn-tool-normal-distribution.primary:hover{opacity:.9;color:#fff;}

.formula-box-normal-distribution{background:var(--primary-lt-normal-distribution);border:1px solid rgba(var(--primary-rgb-normal-distribution),.25);border-radius:10px;padding:14px 16px;font-size:14.5px;font-weight:600;color:var(--heading);margin:10px 0 16px;text-align:center;letter-spacing:.01em;}



/* SQL QUERY FORMATTER */


.page-hero-sql-query-formatter{background:linear-gradient(135deg,#0d9488 0%,#0f2e2c 100%);color:#fff;padding:40px 0 32px;}
.page-hero-sql-query-formatter h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-sql-query-formatter{background:var(--panel-sql-query-formatter);border:1px solid var(--border-sql-query-formatter);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-sql-query-formatter{background:var(--panel-sql-query-formatter);border:1px solid var(--border-sql-query-formatter);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-sql-query-formatter h2{font-size:20px;font-weight:800;margin-bottom:10px;color:var(--heading-sql-query-formatter);}
.content-block-sql-query-formatter h3{font-size:15.5px;font-weight:800;margin:18px 0 8px;color:var(--heading-sql-query-formatter);}
.content-block-sql-query-formatter p{color:var(--muted-sql-query-formatter);font-size:14px;line-height:1.8;margin-bottom:12px;}
.content-block-sql-query-formatter li{color:var(--muted-sql-query-formatter);font-size:14px;line-height:1.8;}
.bf-table-sql-query-formatter{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-sql-query-formatter th{background:var(--primary-lt-sql-query-formatter);color:var(--heading-sql-query-formatter);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-sql-query-formatter td{padding:9px 14px;border-bottom:1px solid var(--border-sql-query-formatter);}
.bf-table-sql-query-formatter tr.clickable{cursor:pointer;}
.bf-table-sql-query-formatter tr.clickable:hover td{background:var(--primary-lt-sql-query-formatter);}

.form-control,.form-select-sql-query-formatter{border:1.5px solid var(--border-sql-query-formatter);border-radius:10px;font-size:14px;font-weight:600;padding:10px 14px;font-family:inherit;background:var(--panel-sql-query-formatter);color:var(--text-sql-query-formatter);}
.form-control:focus,.form-select-sql-query-formatter:focus{border-color:var(--primary-sql-query-formatter);box-shadow:0 0 0 3px rgba(var(--primary-rgb-sql-query-formatter),.15);outline:none;}


.theme-btn-sql-query-formatter{border:1.5px solid var(--border-sql-query-formatter);background:var(--panel-sql-query-formatter);width:34px;height:34px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;color:var(--text-sql-query-formatter);cursor:pointer;font-size:14px;}
.theme-btn-sql-query-formatter:hover{border-color:var(--primary-sql-query-formatter);color:var(--primary-sql-query-formatter);}

.section-divider-sql-query-formatter{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-sql-query-formatter);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-sql-query-formatter);}
.group-label-sql-query-formatter{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--heading-sql-query-formatter);margin:22px 0 10px;padding-top:14px;border-top:1px solid var(--border-sql-query-formatter);}
.group-label-sql-query-formatter:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.result-box-sql-query-formatter{background:var(--primary-lt-sql-query-formatter);border:1.5px solid rgba(var(--primary-rgb-sql-query-formatter),.25);border-radius:12px;padding:16px;margin-top:12px;}
.stat-row-sql-query-formatter{display:flex;justify-content:space-between;padding:6px 0;font-size:13.5px;border-bottom:1px dashed var(--border);gap:10px;}
.stat-row-sql-query-formatter:last-child{border-bottom:none;}
.stat-row-sql-query-formatter .val{font-weight:800;color:var(--heading-sql-query-formatter);text-align:right;}
.stat-row-sql-query-formatter .val.neg{color:var(--danger-sql-query-formatter);}
.headline-box-sql-query-formatter{background:var(--headline-bg-sql-query-formatter);border-radius:12px;padding:18px 20px;margin-top:12px;color:#fff;display:flex;flex-wrap:wrap;gap:20px;}
.headline-item-sql-query-formatter{flex:1;min-width:130px;}
.headline-item-sql-query-formatter .lbl{font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:#a7ded6;margin-bottom:4px;}
.headline-item-sql-query-formatter .num{font-size:21px;font-weight:800;}
.warn-text-sql-query-formatter{color:var(--warn-sql-query-formatter);font-size:12.5px;font-weight:600;margin-top:8px;}

.mode-tabs-sql-query-formatter{display:flex;flex-wrap:wrap;gap:8px;}
.mode-btn-sql-query-formatter{border:1.5px solid var(--border-sql-query-formatter);background:var(--panel-sql-query-formatter);color:var(--muted-sql-query-formatter);border-radius:20px;padding:8px 14px;font-size:12.5px;font-weight:700;cursor:pointer;transition:.13s;}
.mode-btn-sql-query-formatter.active{background:var(--primary-sql-query-formatter);border-color:var(--primary-sql-query-formatter);color:#fff;}
.mini-toggle-sql-query-formatter{display:flex;border:1.5px solid var(--border-sql-query-formatter);border-radius:10px;overflow:hidden;width:fit-content;}
.mini-toggle-sql-query-formatter button{border:none;background:var(--panel-sql-query-formatter);color:var(--muted-sql-query-formatter);padding:9px 14px;font-size:12.5px;font-weight:700;cursor:pointer;border-right:1px solid var(--border-sql-query-formatter);}
.mini-toggle-sql-query-formatter button:last-child{border-right:none;}
.mini-toggle-sql-query-formatter button.active{background:var(--primary-sql-query-formatter);color:#fff;}
.check-pill-sql-query-formatter{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--border-sql-query-formatter);border-radius:10px;padding:9px 14px;font-size:12.5px;font-weight:700;color:var(--text-sql-query-formatter);cursor:pointer;user-select:none;background:var(--panel-sql-query-formatter);}
.check-pill-sql-query-formatter input{width:15px;height:15px;accent-color:var(--primary-sql-query-formatter);}

.editor-card-sql-query-formatter{background:var(--panel-sql-query-formatter);border:1px solid var(--border-sql-query-formatter);border-radius:14px;padding:16px;margin-top:16px;}
.editor-toolbar-sql-query-formatter{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;flex-wrap:wrap;gap:8px;}
.editor-label-sql-query-formatter{font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-sql-query-formatter);}
.editor-actions-sql-query-formatter{display:flex;gap:6px;}
.icon-btn-sql-query-formatter{width:30px;height:30px;border-radius:8px;border:1.5px solid var(--border-sql-query-formatter);background:var(--panel-sql-query-formatter);color:var(--text-sql-query-formatter);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;}
.icon-btn-sql-query-formatter:hover{border-color:var(--primary-sql-query-formatter);color:var(--primary-sql-query-formatter);}
textarea.sql-input-sql-query-formatter{width:100%;min-height:340px;resize:vertical;border:1.5px solid var(--border-sql-query-formatter);border-radius:10px;background:var(--code-bg-panel-sql-query-formatter);color:var(--tok-plain-sql-query-formatter);font-size:13.5px;line-height:1.65;padding:14px 16px;font-family:'JetBrains Mono',monospace;}
textarea.sql-input-sql-query-formatter:focus{outline:none;border-color:var(--primary-sql-query-formatter);}
.output-box-sql-query-formatter{width:100%;min-height:340px;max-height:560px;overflow:auto;border:1.5px solid var(--border-sql-query-formatter);border-radius:10px;background:var(--code-bg-sql-query-formatter);color:var(--tok-plain-sql-query-formatter);font-size:13.5px;line-height:1.65;padding:14px 16px;margin:0;white-space:pre;}
.tok-keyword-sql-query-formatter{color:var(--tok-keyword-sql-query-formatter);font-weight:700;}
.tok-func-sql-query-formatter{color:var(--tok-func-sql-query-formatter);font-weight:600;}
.tok-string-sql-query-formatter{color:var(--tok-string-sql-query-formatter);}
.tok-number-sql-query-formatter{color:var(--tok-number-sql-query-formatter);}
.tok-comment-sql-query-formatter{color:var(--tok-comment-sql-query-formatter);font-style:italic;}
.tok-punct-sql-query-formatter{color:var(--tok-punct-sql-query-formatter);}
.tok-op-sql-query-formatter{color:var(--tok-op-sql-query-formatter);}
.tok-plain-sql-query-formatter{color:var(--tok-plain-sql-query-formatter);}

.action-row-sql-query-formatter{display:flex;align-items:center;justify-content:flex-end;margin-top:16px;gap:8px;flex-wrap:wrap;}
.btn-tool-sql-query-formatter{border:1.5px solid var(--border-sql-query-formatter);background:var(--panel-sql-query-formatter);color:var(--text-sql-query-formatter);border-radius:10px;padding:9px 15px;font-size:12.5px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;}
.btn-tool-sql-query-formatter:hover{border-color:var(--primary-sql-query-formatter);color:var(--primary-sql-query-formatter);}
.btn-tool-sql-query-formatter.primary{background:var(--primary-sql-query-formatter);border-color:var(--primary-sql-query-formatter);color:#fff;}
.btn-tool-sql-query-formatter.primary:hover{opacity:.9;color:#fff;}

.formula-box-sql-query-formatter{background:var(--code-bg-sql-query-formatter);border:1px solid rgba(var(--primary-rgb-sql-query-formatter),.25);border-radius:10px;padding:14px 16px;font-size:12.5px;font-weight:500;color:var(--tok-plain-sql-query-formatter);margin:10px 0 16px;font-family:'JetBrains Mono',monospace;white-space:pre-wrap;line-height:1.6;}
.formula-box-sql-query-formatter .arrow{color:var(--accent-sql-query-formatter);font-weight:700;display:block;text-align:center;margin:4px 0;font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:.06em;}


/* CSV TO MARKDOWN TABLE CONVERTER */
.page-hero-csv-to-markdown-table{background:linear-gradient(135deg,#0d9488 0%,#0f3d38 100%);color:#fff;padding:40px 0 32px;}
.page-hero-csv-to-markdown-table h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-csv-to-markdown-table{background:var(--white-csv-to-markdown-table);border:1px solid var(--border-csv-to-markdown-table);border-radius:16px;padding:28px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-csv-to-markdown-table{background:var(--white-csv-to-markdown-table);border:1px solid var(--border-csv-to-markdown-table);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-csv-to-markdown-table h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-csv-to-markdown-table h3{font-size:15.5px;font-weight:800;margin:18px 0 8px;color:var(--dark-csv-to-markdown-table);}
.content-block-csv-to-markdown-table p{color:var(--muted-csv-to-markdown-table);font-size:14px;line-height:1.8;margin-bottom:12px;}
.content-block-csv-to-markdown-table li{color:var(--muted-csv-to-markdown-table);font-size:14px;line-height:1.8;}
.bf-table-csv-to-markdown-table{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-csv-to-markdown-table th{background:var(--primary-lt-csv-to-markdown-table);color:var(--dark-csv-to-markdown-table);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-csv-to-markdown-table td{padding:9px 14px;border-bottom:1px solid var(--border-csv-to-markdown-table);}

.btn-calc-csv-to-markdown-table{background:linear-gradient(135deg,#0d9488,#0f6f63);color:#fff;border:none;border-radius:10px;padding:12px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-calc-csv-to-markdown-table:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-csv-to-markdown-table{background:transparent;color:var(--primary-csv-to-markdown-table);border:2px solid var(--primary-csv-to-markdown-table);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-csv-to-markdown-table:hover{background:var(--primary-lt-csv-to-markdown-table);}
.btn-chip-csv-to-markdown-table{background:var(--white-csv-to-markdown-table);border:1.5px solid var(--border-csv-to-markdown-table);border-radius:10px;padding:9px 6px;font-size:13px;font-weight:700;cursor:pointer;color:var(--text-csv-to-markdown-table);width:100%;}
.btn-chip-csv-to-markdown-table.active{background:var(--primary);border-color:var(--primary);color:#fff;}
.section-divider-csv-to-markdown-table{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-csv-to-markdown-table);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-csv-to-markdown-table);}
.group-label-csv-to-markdown-table{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-csv-to-markdown-table);margin:22px 0 10px;padding-top:14px;border-top:1px solid var(--border-csv-to-markdown-table);}
.group-label-csv-to-markdown-table:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-csv-to-markdown-table{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode-csv-to-markdown-table .warn-box-csv-to-markdown-table{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;}
body.dark-mode-csv-to-markdown-table .ok-box-csv-to-markdown-table{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}



/* ---- dropzone ---- */
.dropzone-csv-to-markdown-table{border:2px dashed var(--border-csv-to-markdown-table);border-radius:16px;padding:28px 20px;text-align:center;cursor:pointer;background:var(--primary-lt-csv-to-markdown-table);transition:border-color .15s ease,background .15s ease;}
.dropzone-csv-to-markdown-table.drag{border-color:var(--primary-csv-to-markdown-table);}
.dropzone-csv-to-markdown-table h3{font-size:14.5px;font-weight:800;margin:8px 0 4px;}
.dropzone-csv-to-markdown-table p{font-size:12.5px;color:var(--muted-csv-to-markdown-table);margin:0 0 12px;}
.dropzone-csv-to-markdown-table .formats{font-size:10.5px;color:var(--muted-csv-to-markdown-table);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}

.file-card-csv-to-markdown-table{display:flex;align-items:center;gap:14px;background:var(--primary-lt-csv-to-markdown-table);border:1px solid var(--border-csv-to-markdown-table);border-radius:12px;padding:12px 16px;margin-top:14px;}
.file-card-csv-to-markdown-table .fi{width:38px;height:38px;border-radius:10px;background:var(--primary-csv-to-markdown-table);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.file-card-csv-to-markdown-table .fname{font-weight:800;font-size:13.5px;word-break:break-all;}
.file-card-csv-to-markdown-table .fmeta{font-size:11.5px;color:var(--muted-csv-to-markdown-table);font-weight:600;}
.file-card-csv-to-markdown-table .rm{margin-left:auto;background:none;border:none;color:var(--muted-csv-to-markdown-table);font-size:20px;cursor:pointer;flex-shrink:0;}
.file-card-csv-to-markdown-table .rm:hover{color:var(--danger-csv-to-markdown-table);}

.chip-row-csv-to-markdown-table{display:flex;gap:8px;flex-wrap:wrap;}
.chip-row-csv-to-markdown-table .col{flex:1;min-width:74px;}


.tab-row-csv-to-markdown-table{display:flex;gap:6px;background:var(--primary-lt-csv-to-markdown-table);border-radius:10px;padding:4px;margin-bottom:12px;}
.tab-btn-csv-to-markdown-table{flex:1;border:none;background:transparent;padding:8px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted-csv-to-markdown-table);}
.tab-btn-csv-to-markdown-table.active{background:var(--white-csv-to-markdown-table);color:var(--dark-csv-to-markdown-table);box-shadow:0 1px 3px rgba(0,0,0,.08);}

.preview-wrap-csv-to-markdown-table{overflow-x:auto;border:1px solid var(--border-csv-to-markdown-table);border-radius:10px;background:var(--white-csv-to-markdown-table);}
.preview-table-csv-to-markdown-table{width:100%;border-collapse:collapse;font-size:12.5px;white-space:nowrap;}
.preview-table-csv-to-markdown-table th{background:var(--primary-lt-csv-to-markdown-table);color:var(--dark-csv-to-markdown-table);font-weight:800;padding:8px 12px;text-align:left;border-bottom:2px solid var(--border-csv-to-markdown-table);position:sticky;top:0;}
.preview-table-csv-to-markdown-table td{padding:7px 12px;border-bottom:1px solid var(--border);color:var(--text-csv-to-markdown-table);}
.preview-table-csv-to-markdown-table tr:last-child td{border-bottom:none;}
.md-output-csv-to-markdown-table{width:100%;min-height:220px;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12.5px;line-height:1.6;background:var(--bg);border:1px solid var(--border-csv-to-markdown-table);border-radius:10px;padding:14px;color:var(--text-csv-to-markdown-table);resize:vertical;}
.icon-toggle-csv-to-markdown-table{background:var(--white-csv-to-markdown-table);border:1.5px solid var(--border);border-radius:10px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-csv-to-markdown-table);font-size:15px;}
.icon-toggle-csv-to-markdown-table:hover{border-color:var(--primary-csv-to-markdown-table);}
.form-check-input-csv-to-markdown-table:checked{background-color:var(--primary-csv-to-markdown-table);border-color:var(--primary-csv-to-markdown-table);}
.form-check-label-csv-to-markdown-table{font-size:13px;font-weight:600;color:var(--text-csv-to-markdown-table);}
.stat-pill-csv-to-markdown-table{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-csv-to-markdown-table);color:var(--dark-csv-to-markdown-table);margin-right:6px;}


/* JSON TO JSONL CONVERTER */
.page-hero-json-to-jsonl{background:linear-gradient(135deg,#d97706 0%,#5a2e06 100%);color:#fff;padding:40px 0 32px;}
.page-hero-json-to-jsonl h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-json-to-jsonl{background:var(--white-json-to-jsonl);border:1px solid var(--border-json-to-jsonl);border-radius:16px;padding:28px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-json-to-jsonl{background:var(--white-json-to-jsonl);border:1px solid var(--border-json-to-jsonl);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-json-to-jsonl h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-json-to-jsonl h3{font-size:15.5px;font-weight:800;margin:18px 0 8px;color:var(--dark);}
.content-block-json-to-jsonl p{color:var(--muted-json-to-jsonl);font-size:14px;line-height:1.8;margin-bottom:12px;}
.content-block-json-to-jsonl li{color:var(--muted-json-to-jsonl);font-size:14px;line-height:1.8;}
.bf-table-json-to-jsonl{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-json-to-jsonl th{background:var(--primary-lt-json-to-jsonl);color:var(--dark-json-to-jsonl);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-json-to-jsonl td{padding:9px 14px;border-bottom:1px solid var(--border-json-to-jsonl);}
.form-control,.form-select-json-to-jsonl{border:1.5px solid var(--border-json-to-jsonl);border-radius:10px;font-size:14px;font-weight:600;padding:10px 14px;font-family:inherit;background:var(--white-json-to-jsonl);color:var(--text-json-to-jsonl);}
.form-control:focus,.form-select-json-to-jsonl:focus{border-color:var(--primary-json-to-jsonl);box-shadow:0 0 0 3px rgba(217,119,6,.14);outline:none;}


.btn-calc-json-to-jsonl{background:linear-gradient(135deg,#d97706,#92400e);color:#fff;border:none;border-radius:10px;padding:12px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-calc-json-to-jsonl:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-json-to-jsonl{background:transparent;color:var(--primary-json-to-jsonl);border:2px solid var(--primary-json-to-jsonl);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-json-to-jsonl:hover{background:var(--primary-lt-json-to-jsonl);}
.section-divider-json-to-jsonl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-json-to-jsonl);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-json-to-jsonl);}
.group-label-json-to-jsonl{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-json-to-jsonl);margin:22px 0 10px;padding-top:14px;border-top:1px solid var(--border-json-to-jsonl);}
.group-label-json-to-jsonl:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-json-to-jsonl{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode-json-to-jsonl .warn-box{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-json-to-jsonl{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode-json-to-jsonl .ok-box{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.danger-box-json-to-jsonl{background:#fdecec;border:1px solid #f5b5b5;color:#a01c1c;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode-json-to-jsonl .danger-box-json-to-jsonl{background:#3a1414;border-color:#6b2323;color:#f5a3a3;}

/* ---- dropzone ---- */
.dropzone-json-to-jsonl{border:2px dashed var(--border-json-to-jsonl);border-radius:16px;padding:28px 20px;text-align:center;cursor:pointer;background:var(--primary-lt-json-to-jsonl);transition:border-color .15s ease,background .15s ease;}
.dropzone-json-to-jsonl.drag{border-color:var(--primary-json-to-jsonl);}
.dropzone-json-to-jsonl h3{font-size:14.5px;font-weight:800;margin:8px 0 4px;}
.dropzone-json-to-jsonl p{font-size:12.5px;color:var(--muted-json-to-jsonl);margin:0 0 12px;}
.dropzone-json-to-jsonl .formats{font-size:10.5px;color:var(--muted-json-to-jsonl);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}

.file-card-json-to-jsonl{display:flex;align-items:center;gap:14px;background:var(--primary-lt-json-to-jsonl);border:1px solid var(--border-json-to-jsonl);border-radius:12px;padding:12px 16px;margin-top:14px;}
.file-card-json-to-jsonl .fi{width:38px;height:38px;border-radius:10px;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.file-card-json-to-jsonl .fname{font-weight:800;font-size:13.5px;word-break:break-all;}
.file-card-json-to-jsonl .fmeta{font-size:11.5px;color:var(--muted-json-to-jsonl);font-weight:600;}
.file-card-json-to-jsonl .rm{margin-left:auto;background:none;border:none;color:var(--muted-json-to-jsonl);font-size:20px;cursor:pointer;flex-shrink:0;}
.file-card-json-to-jsonl .rm:hover{color:var(--danger);}

.tab-row-json-to-jsonl{display:flex;gap:6px;background:var(--primary-lt-json-to-jsonl);border-radius:10px;padding:4px;margin-bottom:12px;}
.tab-btn-json-to-jsonl{flex:1;border:none;background:transparent;padding:8px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted)-json-to-jsonl;}
.tab-btn-json-to-jsonl.active{background:var(--white-json-to-jsonl);color:var(--dark-json-to-jsonl);box-shadow:0 1px 3px rgba(0,0,0,.08);}

.jsonl-output-json-to-jsonl{width:100%;min-height:260px;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12.5px;line-height:1.6;background:var(--bg-json-to-jsonl);border:1px solid var(--border-json-to-jsonl);border-radius:10px;padding:14px;color:var(--text-json-to-jsonl);resize:vertical;}
.icon-toggle-json-to-jsonl{background:var(--white-json-to-jsonl);border:1.5px solid var(--border-json-to-jsonl);border-radius:10px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-json-to-jsonl);font-size:15px;}
.icon-toggle-json-to-jsonl:hover{border-color:var(--primary-json-to-jsonl);}
.stat-pill-json-to-jsonl{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-json-to-jsonl);color:var(--dark-json-to-jsonl);margin-right:6px;margin-bottom:6px;}
.stat-pill-json-to-jsonl.ok{background:#e9f9f2;color:#046645;}
.stat-pill-json-to-jsonl.err{background:#fdecec;color:#a01c1c;}
.status-badge-json-to-jsonl{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;}
.status-badge-json-to-jsonl.valid{background:#e9f9f2;color:#046645;}
.status-badge-json-to-jsonl.invalid{background:#fdecec;color:#a01c1c;}
.status-badge-json-to-jsonl.idle{background:var(--primary-lt-json-to-jsonl);color:var(--dark-json-to-jsonl);}
.formula-box-json-to-jsonl{background:var(--dark-json-to-jsonl);border:1px solid rgba(var(--primary-rgb-sql-query-formatter),.25);border-radius:10px;padding:14px 16px;font-size:12.5px;font-weight:500;color:var(--tok-plain-sql-query-formatter);margin:10px 0 16px;font-family:'JetBrains Mono',monospace;white-space:pre-wrap;line-height:1.6;}
.formula-box-json-to-jsonl .arrow{color:var(--accent-sql-query-formatter);font-weight:700;display:block;text-align:center;margin:4px 0;font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;text-transform:uppercase;letter-spacing:.06em;}


/* PHP ARRAY TO JSON CONVERTER */
.page-hero-php-array-to-json{background:linear-gradient(135deg,#7c3aed 0%,#2e1065 100%);color:#fff;padding:40px 0 32px;}
.page-hero-php-array-to-json h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-php-array-to-json{background:var(--white-php-array-to-json);border:1px solid var(--border-php-array-to-json);border-radius:16px;padding:28px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-php-array-to-json{background:var(--white-php-array-to-json);border:1px solid var(--border-php-array-to-json);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-php-array-to-json h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-php-array-to-json h3{font-size:15.5px;font-weight:800;margin:18px 0 8px;color:var(--dark-php-array-to-json);}
.content-block-php-array-to-json p{color:var(--muted-php-array-to-json);font-size:14px;line-height:1.8;margin-bottom:12px;}
.content-block-php-array-to-json li{color:var(--muted-php-array-to-json);font-size:14px;line-height:1.8;}
.bf-table-php-array-to-json{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-php-array-to-json th{background:var(--primary-lt-php-array-to-json);color:var(--dark-php-array-to-json);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-php-array-to-json td{padding:9px 14px;border-bottom:1px solid var(--border-php-array-to-json);}

.btn-calc-php-array-to-json{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:12px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-calc-php-array-to-json:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-php-array-to-json{background:transparent;color:var(--primary-php-array-to-json);border:2px solid var(--primary-php-array-to-json);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-php-array-to-json:hover{background:var(--primary-lt-php-array-to-json);}
.btn-chip-php-array-to-json{background:var(--white-php-array-to-json);border:1.5px solid var(--border-php-array-to-json);border-radius:10px;padding:9px 6px;font-size:13px;font-weight:700;cursor:pointer;color:var(--text-php-array-to-json);width:100%;}
.btn-chip-php-array-to-json.active{background:var(--primary-php-array-to-json);border-color:var(--primary-php-array-to-json);color:#fff;}
.chip-row-php-array-to-json{display:flex;gap:8px;flex-wrap:wrap;}
.chip-row-php-array-to-json .col{flex:1;min-width:110px;}
.section-divider-php-array-to-json{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-php-array-to-json);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-php-array-to-json);}
.group-label-php-array-to-json{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-php-array-to-json);margin:22px 0 10px;padding-top:14px;border-top:1px solid var(--border-php-array-to-json);}
.group-label-php-array-to-json:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-php-array-to-json{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode-php-array-to-json .warn-box-php-array-to-json{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-php-array-to-json{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode-php-array-to-json .ok-box{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.danger-box-php-array-to-json{background:#fdecec;border:1px solid #f5b5b5;color:#a01c1c;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .danger-box-php-array-to-json{background:#3a1414;border-color:#6b2323;color:#f5a3a3;}


.jsonl-output-php-array-to-json{width:100%;min-height:260px;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12.5px;line-height:1.6;background:var(--bg-php-array-to-json);border:1px solid var(--border-php-array-to-json);border-radius:10px;padding:14px;color:var(--text-php-array-to-json);resize:vertical;}
.icon-toggle-php-array-to-json{background:var(--white-php-array-to-json);border:1.5px solid var(--border-php-array-to-json);border-radius:10px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-php-array-to-json);font-size:15px;}
.icon-toggle-box-php-array-to-json:hover{border-color:var(--primary-php-array-to-json);}
.stat-pill-php-array-to-json{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-php-array-to-json);color:var(--dark-php-array-to-json);margin-right:6px;margin-bottom:6px;}
.stat-pill-php-array-to-json.ok{background:#e9f9f2;color:#046645;}
.stat-pill-php-array-to-json.err{background:#fdecec;color:#a01c1c;}
.status-badge-php-array-to-json{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;}
.status-badge-php-array-to-json.valid{background:#e9f9f2;color:#046645;}
.status-badge--php-array-to-json.invalid{background:#fdecec;color:#a01c1c;}
.status-badge-php-array-to-json.idle{background:var(--primary-lt-php-array-to-json);color:var(--dark-php-array-to-json);}

.textarea-php-array-to-json.form-control{font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12.5px;font-weight:500;}
.textarea-php-array-to-json.form-control.invalid{border-color:var(--danger);box-shadow:0 0 0 3px rgba(220,38,38,.12);}


/* UTM GENERATOR */
.page-hero-security-utilities{background:linear-gradient(135deg,#6366f1 0%,#312e81 100%);color:#fff;padding:40px 0 32px;}
.page-hero-security-utilities h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-security-utilities{background:var(--white-security-utilities);border:1px solid var(--border-security-utilities);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-security-utilities{background:var(--white-security-utilities);border:1px solid var(--border-security-utilities);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-security-utilities h2{font-size:19px;font-weight:800;margin-bottom:10px;}
.content-block-security-utilities p{color:var(--muted-security-utilities);font-size:13.5px;line-height:1.75;margin-bottom:10px;}

.btn-calc-security-utilities{background:linear-gradient(135deg,#6366f1,#4338ca);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-security-utilities:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-security-utilities{background:transparent;color:var(--primary-security-utilities);border:1.5px solid var(--primary-security-utilities);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-security-utilities:hover{background:var(--primary-lt-security-utilities);}
.btn-ghost-security-utilities{background:var(--primary-lt-security-utilities);color:var(--dark-security-utilities);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;}
.btn-ghost-security-utilities:hover{filter:brightness(0.95);}
.btn-danger-ghost-security-utilities{background:#fdecea;color:var(--danger-security-utilities);border:none;border-radius:8px;padding:5px 8px;font-size:12px;cursor:pointer;}
body.dark-mode .btn-danger-ghost-security-utilities{background:#3a1a1a;}
.group-label-security-utilities{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-security-utilities);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-security-utilities);}
.group-label-security-utilities:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-security-utilities{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .warn-box-security-utilities{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-security-utilities{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;}
body.dark-mode .ok-box-security-utilities{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.dropzone-security-utilities{border:2px dashed var(--border-security-utilities);border-radius:14px;padding:22px 16px;text-align:center;cursor:pointer;background:var(--primary-lt-security-utilities);transition:border-color .15s ease;}
.dropzone-security-utilities.drag{border-color:var(--primary-security-utilities);}
.dropzone-security-utilities h3{font-size:13.5px;font-weight:800;margin:6px 0 3px;}
.dropzone-security-utilities p{font-size:12px;color:var(--muted-security-utilities);margin:0 0 10px;}
.dropzone-security-utilities .formats{font-size:10px;color:var(--muted-security-utilities);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}
.file-card-security-utilities{display:flex;align-items:center;gap:12px;background:var(--primary-lt-security-utilities);border:1px solid var(--border-security-utilities);border-radius:12px;padding:10px 14px;margin-top:12px;}
.file-card-security-utilities .fi{width:34px;height:34px;border-radius:9px;background:var(--primary-security-utilities);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;flex-shrink:0;}
.file-card-security-utilities .fname{font-weight:800;font-size:12.5px;word-break:break-all;}
.file-card-security-utilities .fmeta{font-size:11px;color:var(--muted-security-utilities);font-weight:600;}
.file-card-security-utilities .rm{margin-left:auto;background:none;border:none;color:var(--muted-security-utilities);font-size:18px;cursor:pointer;}
.tab-row-security-utilities{display:flex;gap:6px;background:var(--primary-lt-security-utilities);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-security-utilities{flex:1;min-width:110px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted);}
.tab-btn-security-utilities.active{background:var(--white-security-utilities);color:var(--dark-security-utilities);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-security-utilities{background:var(--white-security-utilities);border:1.5px solid var(--border-security-utilities);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-security-utilities);font-size:14px;}
.stat-pill-security-utilities{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-security-utilities);color:var(--dark-security-utilities);margin-right:6px;margin-bottom:6px;}
.stat-pill-security-utilities.bad{background:#fdecea;color:var(--danger-security-utilities);}
.stat-pill-security-utilities.warn{background:#fff7ea;color:#8a5a06;}
.preset-chip-security-utilities{background:var(--white-security-utilities);border:1.5px solid var(--border-security-utilities);border-radius:20px;padding:6px 12px;font-size:11.5px;font-weight:700;cursor:pointer;color:var(--text-security-utilities);}
.preset-chip-security-utilities:hover{border-color:var(--primary-security-utilities);color:var(--dark-security-utilities);}
.form-check-label-security-utilities{font-size:12.5px;font-weight:600;color:var(--text-security-utilities);}
.char-count-security-utilities{font-size:10.5px;color:var(--muted-security-utilities);text-align:right;margin-top:2px;}
.char-count-security-utilities.over{color:var(--danger-security-utilities);font-weight:700;}

/* table */
.utm-table-wrap-security-utilities{overflow:auto;border:1px solid var(--border-security-utilities);border-radius:12px;max-height:560px;background:var(--white-security-utilities);}
table.utm-table-security-utilities{width:100%;border-collapse:collapse;font-size:12.5px;min-width:1180px;}
table.utm-table-security-utilities th{position:sticky;top:0;background:var(--primary-lt-security-utilities);color:var(--dark-security-utilities);font-weight:800;padding:9px 10px;text-align:left;border-bottom:2px solid var(--border);white-space:nowrap;cursor:pointer;z-index:2;}
table.utm-table-security-utilities th.nosort{cursor:default;}
table.utm-table-security-utilities td{padding:5px 6px;border-bottom:1px solid var(--border-security-utilities);vertical-align:middle;}
table.utm-table-security-utilities tr.invalid-row td{background:rgba(220,38,38,.05);}
table.utm-table-security-utilities tr.dup-row td{background:rgba(194,118,12,.07);}
table.utm-table-security-utilities input.cell-input{width:100%;min-width:100px;border:1px solid transparent;background:transparent;border-radius:6px;padding:6px 7px;font-size:12px;font-weight:600;color:var(--text-security-utilities);font-family:inherit;}
table.utm-table-security-utilities input.cell-input:focus{border-color:var(--primary-security-utilities);background:var(--white-security-utilities);outline:none;box-shadow:0 0 0 2px rgba(99,102,241,.12);}
table.utm-table-security-utilities td.url-cell{max-width:280px;}
table.utm-table-security-utilities td.url-cell .url-text{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:'SFMono-Regular',Consolas,monospace;font-size:11px;color:var(--dark-security-utilities);}
.row-actions-security-utilities{display:flex;gap:4px;white-space:nowrap;}
.row-badge-security-utilities{display:inline-block;font-size:9.5px;font-weight:800;padding:2px 6px;border-radius:8px;background:#fdecea;color:var(--danger);margin-left:4px;}
.row-badge-security-utilities.dup{background:#fff2dc;color:#8a5a06;}
.modal-backdrop-custom-security-utilities{position:fixed;inset:0;background:rgba(15,10,35,.5);display:none;align-items:center;justify-content:center;z-index:2000;padding:16px;}
.modal-backdrop-custom-security-utilities.show{display:flex;}
.modal-box-security-utilities{background:var(--white-security-utilities);border-radius:16px;padding:24px;max-width:520px;width:100%;max-height:85vh;overflow:auto;}
.modal-box-security-utilities h3{font-size:16px;font-weight:800;margin-bottom:14px;}
.close-x-security-utilities{position:absolute;top:16px;right:18px;background:none;border:none;font-size:20px;color:var(--muted-security-utilities);cursor:pointer;}
.custom-param-row-security-utilities{display:flex;gap:6px;margin-bottom:6px;}
.qr-preview-security-utilities{display:flex;flex-direction:column;align-items:center;gap:10px;padding:10px;}
.diff-table-security-utilities td.diff{background:#fff2dc;}
.diff-table-security-utilities td.same{color:var(--ok);}

.form-control,.form-select-security-utilities{border:1.5px solid var(--border);border-radius:10px;font-size:13.5px;font-weight:600;padding:9px 12px;font-family:inherit;background:var(--white);color:var(--text);}
.form-control:focus,.form-select-security-utilities:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(99,102,241,.14);outline:none;}


/* SPRITE SHEET SPLITTER */
.page-hero-sprite-sheet-splitter{background:linear-gradient(135deg,#ea580c 0%,#7c2d12 100%);color:#fff;padding:40px 0 32px;}
.page-hero-sprite-sheet-splitter h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-sprite-sheet-splitter{background:var(--white-sprite-sheet-splitter);border:1px solid var(--border-sprite-sheet-splitter);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-sprite-sheet-splitter{background:var(--white-sprite-sheet-splitter);border:1px solid var(--border-sprite-sheet-splitter);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-sprite-sheet-splitter h2{font-size:19px;font-weight:800;margin-bottom:10px;}
.content-block-sprite-sheet-splitter h3{font-size:15px;font-weight:600;margin-bottom:10px;}
.content-block-sprite-sheet-splitter p{color:var(--muted);font-size:13.5px;line-height:1.75;margin-bottom:10px;}

.btn-calc-sprite-sheet-splitter{background:linear-gradient(135deg,#ea580c,#c2410c);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-sprite-sheet-splitter:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-sprite-sheet-splitter{background:transparent;color:var(--primary-sprite-sheet-splitter);border:1.5px solid var(--primary-sprite-sheet-splitter);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-sprite-sheet-splitter:hover{background:var(--primary-lt-sprite-sheet-splitter);}
.btn-ghost-sprite-sheet-splitter{background:var(--primary-lt-sprite-sheet-splitter);color:var(--dark-sprite-sheet-splitter);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-ghost-sprite-sheet-splitter.active{background:var(--primary-sprite-sheet-splitter);color:#fff;}
.group-label-sprite-sheet-splitter{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-sprite-sheet-splitter);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-sprite-sheet-splitter);}
.group-label-sprite-sheet-splitter:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-sprite-sheet-splitter{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode-sprite-sheet-splitter .warn-box-sprite-sheet-splitter{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-sprite-sheet-splitter{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;}
body.dark-mode .ok-box-sprite-sheet-splitter{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.dropzone-sprite-sheet-splitter{border:2px dashed var(--border-sprite-sheet-splitter);border-radius:14px;padding:24px 16px;text-align:center;cursor:pointer;background:var(--primary-lt-sprite-sheet-splitter);transition:border-color .15s ease;}
.dropzone-sprite-sheet-splitter.drag{border-color:var(--primary-sprite-sheet-splitter);}
.dropzone-sprite-sheet-splitter h3{font-size:13.5px;font-weight:800;margin:6px 0 3px;}
.dropzone-sprite-sheet-splitter p{font-size:12px;color:var(--muted-sprite-sheet-splitter);margin:0 0 10px;}
.dropzone-sprite-sheet-splitter .formats{font-size:10px;color:var(--muted-sprite-sheet-splitter);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}

.tab-row-sprite-sheet-splitter{display:flex;gap:6px;background:var(--primary-lt-sprite-sheet-splitter);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-sprite-sheet-splitter{flex:1;min-width:110px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted);}
.tab-btn-sprite-sheet-splitter.active{background:var(--white-sprite-sheet-splitter);color:var(--dark-sprite-sheet-splitter);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-sprite-sheet-splitter{background:var(--white-sprite-sheet-splitter);border:1.5px solid var(--border-sprite-sheet-splitter);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark);font-size:14px;}
.stat-pill-sprite-sheet-splitter{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-sprite-sheet-splitter);color:var(--dark);margin-right:6px;margin-bottom:6px;}
.stat-pill-sprite-sheet-splitter.bad{background:#fdecea;color:var(--danger-sprite-sheet-splitter);}
.sheet-chip-sprite-sheet-splitter{display:flex;align-items:center;gap:8px;background:var(--white-sprite-sheet-splitter);border:1.5px solid var(--border-sprite-sheet-splitter);border-radius:10px;padding:7px 10px;font-size:12px;font-weight:700;cursor:pointer;}
.sheet-chip-sprite-sheet-splitter.active{border-color:var(--primary-sprite-sheet-splitter);background:var(--primary-lt-sprite-sheet-splitter);color:var(--dark-sprite-sheet-splitter);}
.sheet-chip-sprite-sheet-splitter img{width:22px;height:22px;object-fit:contain;background:repeating-conic-gradient(#ddd 0% 25%, transparent 0% 50%) 50%/8px 8px;border-radius:4px;}
.sheet-chip-sprite-sheet-splitter .rm{background:none;border:none;color:var(--muted-sprite-sheet-splitter);font-size:14px;cursor:pointer;}
.checkerboard-sprite-sheet-splitter{background-image:repeating-conic-gradient(#e3ddd6 0% 25%, transparent 0% 50%);background-size:16px 16px;}
body.dark-mode .checkerboard-sprite-sheet-splitter{background-image:repeating-conic-gradient(#3a2e21 0% 25%, transparent 0% 50%);}
.preview-scroll-sprite-sheet-splitter{overflow:auto;border:1px solid var(--border-sprite-sheet-splitter);border-radius:12px;max-height:520px;position:relative;}
#previewCanvas{display:block;cursor:crosshair;image-rendering:pixelated;}
.thumb-grid-sprite-sheet-splitter{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px;max-height:280px;overflow:auto;padding:4px;border:1px solid var(--border-sprite-sheet-splitter);border-radius:10px;}
.thumb-sprite-sheet-splitter{position:relative;border:2px solid var(--border-sprite-sheet-splitter);border-radius:8px;overflow:hidden;cursor:pointer;aspect-ratio:1;background:var(--white-sprite-sheet-splitter);}
.thumb-sprite-sheet-splitter.selected{border-color:var(--primary-sprite-sheet-splitter);}
.thumb-sprite-sheet-splitter canvas,.thumb img{width:100%;height:100%;object-fit:contain;}
.thumb-sprite-sheet-splitter .idx{position:absolute;bottom:2px;left:2px;background:rgba(0,0,0,.55);color:#fff;font-size:9px;padding:1px 4px;border-radius:4px;}
.thumb-sprite-sheet-splitter .chk{position:absolute;top:3px;right:3px;width:15px;height:15px;}
.range-row{display:flex;align-items:center;gap:8px;}
.range-row-sprite-sheet-splitter input[type=range]{flex:1;}
.range-val-sprite-sheet-splitter{font-size:11.5px;font-weight:700;color:var(--dark-sprite-sheet-splitter);min-width:38px;text-align:right;}
.combine-thumb-sprite-sheet-splitter{display:flex;align-items:center;gap:10px;background:var(--primary-lt-sprite-sheet-splitter);border:1px solid var(--border-sprite-sheet-splitter);border-radius:10px;padding:8px 12px;margin-bottom:6px;}
.combine-thumb-sprite-sheet-splitter img{width:34px;height:34px;object-fit:contain;background:var(--white-sprite-sheet-splitter);border-radius:6px;}
.combine-thumb-sprite-sheet-splitter .name{font-size:12px;font-weight:700;flex:1;word-break:break-all;}
.form-control,.form-select-sprite-sheet-splitter{border:1.5px solid var(--border-sprite-sheet-splitter);border-radius:10px;font-size:13.5px;font-weight:600;padding:9px 12px;font-family:inherit;background:var(--white-sprite-sheet-splitter);color:var(--text-sprite-sheet-splitter);}
.form-control:focus,.form-select-sprite-sheet-splitter:focus{border-color:var(--primary-sprite-sheet-splitter);box-shadow:0 0 0 3px rgba(234,88,12,.14);outline:none;}


/* RESIZE ANIMATED WEBP */
.page-hero-resize-animated-webp{background:linear-gradient(135deg,#2563eb 0%,#1e1b4b 100%);color:#fff;padding:40px 0 32px;}
.page-hero-resize-animated-webp h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-resize-animated-webp{background:var(--white-resize-animated-webp);border:1px solid var(--border-resize-animated-webp);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-resize-animated-webp{background:var(--white-resize-animated-webp);border:1px solid var(--border-resize-animated-webp);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-resize-animated-webp h2{font-size:19px;font-weight:800;margin-bottom:10px;}
.content-block-resize-animated-webp p{color:var(--muted-resize-animated-webp);font-size:13.5px;line-height:1.75;margin-bottom:10px;}
.content-block-resize-animated-webp h3{font-size:15.5px;font-weight:800;margin:18px 0 8px;color:var(--dark-resize-animated-webp);}
.btn-calc-resize-animated-webp{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-resize-animated-webp:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-resize-animated-webp{background:transparent;color:var(--primary-resize-animated-webp);border:1.5px solid var(--primary-resize-animated-webp);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-resize-animated-webp:hover{background:var(--primary-lt-resize-animated-webp);}
.btn-outline-purple-resize-animated-webp:disabled{opacity:.5;cursor:not-allowed;}
.btn-ghost-resize-animated-webp{background:var(--primary-lt-resize-animated-webp);color:var(--dark-resize-animated-webp);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-ghost-resize-animated-webp.active{background:var(--primary-resize-animated-webp);color:#fff;}
.group-label-resize-animated-webp{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-resize-animated-webp);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-resize-animated-webp);}
.group-label-resize-animated-webp:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-resize-animated-webp{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}

body.dark-mode .warn-box-resize-animated-webp{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-resize-animated-webp{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;}
body.dark-mode .ok-box-resize-animated-webp{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.dropzone-resize-animated-webp{border:2px dashed var(--border-resize-animated-webp);border-radius:14px;padding:24px 16px;text-align:center;cursor:pointer;background:var(--primary-lt-resize-animated-webp);transition:border-color .15s ease;}
.dropzone-resize-animated-webp.drag{border-color:var(--primary-resize-animated-webp);}
.dropzone-resize-animated-webp h3{font-size:13.5px;font-weight:800;margin:6px 0 3px;}
.dropzone-resize-animated-webp p{font-size:12px;color:var(--muted-resize-animated-webp);margin:0 0 10px;}
.dropzone-resize-animated-webp .formats{font-size:10px;color:var(--muted-resize-animated-webp);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}
.tab-row-resize-animated-webp{display:flex;gap:6px;background:var(--primary-lt-resize-animated-webp);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-resize-animated-webp{flex:1;min-width:110px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted);}
.tab-btn-resize-animated-webp.active{background:var(--white-resize-animated-webp);color:var(--dark-resize-animated-webp);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-resize-animated-webp{background:var(--white-resize-animated-webp);border:1.5px solid var(--border-resize-animated-webp);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark);font-size:14px;}
.stat-pill-resize-animated-webp{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-resize-animated-webp);color:var(--dark-resize-animated-webp);margin-right:6px;margin-bottom:6px;}


.stat-pill-resize-animated-webp.bad{background:#fdecea;color:var(--danger-resize-animated-webp);}
.file-chip-resize-animated-webp{display:flex;align-items:center;gap:8px;background:var(--white);border:1.5px solid var(--border-resize-animated-webp);border-radius:10px;padding:7px 10px;font-size:12px;font-weight:700;cursor:pointer;}
.file-chip-resize-animated-webp.active{border-color:var(--primary);background:var(--primary-lt);color:var(--dark);}
.file-chip-resize-animated-webp img{width:22px;height:22px;object-fit:contain;background:repeating-conic-gradient(#ddd 0% 25%, transparent 0% 50%) 50%/8px 8px;border-radius:4px;}
.file-chip-resize-animated-webp .rm{background:none;border:none;color:var(--muted);font-size:14px;cursor:pointer;}
.checkerboard-resize-animated-webp{background-image:repeating-conic-gradient(#e3ddd6 0% 25%, transparent 0% 50%);background-size:16px 16px;}
body.dark-mode .checkerboard-resize-animated-webp{background-image:repeating-conic-gradient(#22283c 0% 25%, transparent 0% 50%);}
.preview-pair-resize-animated-webp{display:flex;gap:14px;flex-wrap:wrap;}
.preview-box-resize-animated-webp{flex:1;min-width:220px;border:1px solid var(--border-resize-animated-webp);border-radius:12px;padding:12px;text-align:center;}
.preview-box-resize-animated-webp canvas{max-width:100%;image-rendering:pixelated;}
.preview-box-resize-animated-webp .lbl{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted-resize-animated-webp);margin-bottom:8px;}
.thumb-strip-resize-animated-webp{display:flex;gap:8px;overflow-x:auto;padding:6px 2px;border:1px solid var(--border-resize-animated-webp);border-radius:10px;}
.frame-thumb-resize-animated-webp{position:relative;flex:0 0 auto;width:64px;height:64px;border:2px solid var(--border-resize-animated-webp);border-radius:8px;overflow:hidden;cursor:pointer;background:var(--white-resize-animated-webp);}
.frame-thumb-resize-animated-webp.selected{border-color:var(--primary);}
.frame-thumb-resize-animated-webp.current{outline:2px solid var(--ok);outline-offset:1px;}
.frame-thumb-resize-animated-webp canvas{width:100%;height:100%;object-fit:contain;}
.frame-thumb-resize-animated-webp .idx{position:absolute;bottom:1px;left:1px;background:rgba(0,0,0,.55);color:#fff;font-size:8.5px;padding:1px 3px;border-radius:4px;}
.frame-thumb-resize-animated-webp .chk{position:absolute;top:2px;right:2px;width:13px;height:13px;}
.range-row-resize-animated-webp{display:flex;align-items:center;gap:8px;}
.range-row-resize-animated-webp input[class=range-resize-animated-webp]{flex:1;accent-color: #2563eb;}
.range-val-resize-animated-webp{font-size:11.5px;font-weight:700;color:var(--dark-resize-animated-webp);min-width:44px;text-align:right;}
.progress-wrap-resize-animated-webp{height:8px;border-radius:6px;background:var(--primary-lt-resize-animated-webp);overflow:hidden;margin-top:10px;display:none;}
.progress-bar-fill-resize-animated-webp{height:100%;background:linear-gradient(90deg,#2563eb,#60a5fa);width:0%;transition:width .15s ease;}
.meta-table-resize-animated-webp{width:100%;font-size:12.5px;border-collapse:collapse;}
.meta-table-resize-animated-webp td{padding:5px 4px;border-bottom:1px dashed var(--border-resize-animated-webp);}
.meta-table-resize-animated-webp td:first-child{color:var(--muted-resize-animated-webp);font-weight:600;width:52%;}
.meta-table-resize-animated-webp td:last-child{font-weight:700;text-align:right;}

.form-control,.form-select{border:1.5px solid var(--border-resize-animated-webp);border-radius:10px;font-size:13.5px;font-weight:600;padding:9px 12px;font-family:inherit;background:var(--white-resize-animated-webp);color:var(--text-resize-animated-webp);}
.form-control:focus,.form-select:focus{border-color:var(--primary-resize-animated-webp);box-shadow:0 0 0 3px rgba(37,99,235,.14);outline:none;}


/* SHA256 CHECKSUM VERIFIER */
.page-hero-sha256-checksum-verifier{background:linear-gradient(135deg,#2563eb 0%,#0b1f4d 100%);color:#fff;padding:40px 0 32px;}
.page-hero-sha256-checksum-verifier h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-sha256-checksum-verifier{background:var(--white-sha256-checksum-verifier);border:1px solid var(--border-sha256-checksum-verifier);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.hero-badges-sha256-checksum-verifier{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.hero-badge-sha256-checksum-verifier{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;}
.content-block-sha256-checksum-verifier{background:var(--white-sha256-checksum-verifier);border:1px solid var(--border-sha256-checksum-verifier);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-sha256-checksum-verifier h2{font-size:19px;font-weight:800;margin-bottom:10px;}
.content-block-sha256-checksum-verifier p{color:var(--muted-sha256-checksum-verifier);font-size:13.5px;line-height:1.75;margin-bottom:10px;}

.btn-calc-sha256-checksum-verifier{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-sha256-checksum-verifier:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-sha256-checksum-verifier{background:transparent;color:var(--primary-sha256-checksum-verifier);border:1.5px solid var(--primary-sha256-checksum-verifier);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-sha256-checksum-verifier:hover{background:var(--primary-lt-sha256-checksum-verifier);}
.btn-ghost-sha256-checksum-verifier{background:var(--primary-lt-sha256-checksum-verifier);color:var(--dark-sha256-checksum-verifier);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-ghost-sha256-checksum-verifier.active{background:var(--primary-sha256-checksum-verifier);color:#fff;}
.btn-danger-ghost-sha256-checksum-verifier{background:#fdecea;color:var(--danger-sha256-checksum-verifier);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.group-label-sha256-checksum-verifier{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-sha256-checksum-verifier);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-sha256-checksum-verifier);}
.group-label-sha256-checksum-verifier:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-sha256-checksum-verifier{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .warn-box-sha256-checksum-verifier{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-sha256-checksum-verifier{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .ok-box-sha256-checksum-verifier{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.bad-box-sha256-checksum-verifier{background:#fdecea;border:1px solid #f3b3ab;color:#9a1c12;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .bad-box-sha256-checksum-verifier{background:#3a1210;border-color:#6b241d;color:#f4a89f;}
.dropzone-sha256-checksum-verifier{border:2px dashed var(--border-sha256-checksum-verifier);border-radius:14px;padding:24px 16px;text-align:center;cursor:pointer;background:var(--primary-lt-sha256-checksum-verifier);transition:border-color .15s ease;}
.dropzone-sha256-checksum-verifier.drag{border-color:var(--primary-sha256-checksum-verifier);}
.dropzone-sha256-checksum-verifier h3{font-size:13.5px;font-weight:800;margin:6px 0 3px;}
.dropzone-sha256-checksum-verifier p{font-size:12px;color:var(--muted-sha256-checksum-verifier);margin:0 0 10px;}
.dropzone-sha256-checksum-verifier .formats{font-size:10px;color:var(--muted-sha256-checksum-verifier);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}

.tab-row-sha256-checksum-verifier{display:flex;gap:6px;background:var(--primary-lt-sha256-checksum-verifier);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-sha256-checksum-verifier{flex:1;min-width:110px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted-sha256-checksum-verifier);}
.tab-btn-sha256-checksum-verifier.active{background:var(--white-sha256-checksum-verifier);color:var(--dark-sha256-checksum-verifier);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-sha256-checksum-verifier{background:var(--white-sha256-checksum-verifier);border:1.5px solid var(--border-sha256-checksum-verifier);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-sha256-checksum-verifier);font-size:14px;}
.stat-pill-sha256-checksum-verifier{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-sha256-checksum-verifier);color:var(--dark-sha256-checksum-verifier);margin-right:6px;margin-bottom:6px;}
.stat-pill-sha256-checksum-verifier.bad{background:#fdecea;color:var(--danger-sha256-checksum-verifier);}
.stat-pill-sha256-checksum-verifier.ok{background:#e9f9f2;color:var(--ok-sha256-checksum-verifier);}
.algo-check-sha256-checksum-verifier{display:flex;align-items:center;gap:6px;background:var(--white-sha256-checksum-verifier);border:1.5px solid var(--border-sha256-checksum-verifier);border-radius:10px;padding:7px 12px;font-size:12.5px;font-weight:700;cursor:pointer;}
.algo-check-sha256-checksum-verifier input{margin:0;}
.algo-check-sha256-checksum-verifier.active{border-color:var(--primary-sha256-checksum-verifier);background:var(--primary-lt-sha256-checksum-verifier);color:var(--dark-sha256-checksum-verifier);}
.file-row-sha256-checksum-verifier{background:var(--white-sha256-checksum-verifier);border:1.5px solid var(--border-sha256-checksum-verifier);border-radius:12px;padding:14px 16px;margin-bottom:12px;}
.file-row-sha256-checksum-verifier.dup{border-color:var(--warn-sha256-checksum-verifier);}
.file-row-sha256-checksum-verifier .fr-top{display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;}
.fr-icon-sha256-checksum-verifier{width:38px;height:38px;border-radius:9px;background:var(--primary-lt-sha256-checksum-verifier);color:var(--dark-sha256-checksum-verifier);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.fr-name-sha256-checksum-verifier{font-size:13.5px;font-weight:700;word-break:break-all;}
.fr-meta-sha256-checksum-verifier{font-size:11px;color:var(--muted-sha256-checksum-verifier);margin-top:2px;}
.badge-status-sha256-checksum-verifier{font-size:10.5px;font-weight:800;padding:4px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;}
.badge-pending-sha256-checksum-verifier{background:#f0f1f5;color:var(--muted-sha256-checksum-verifier);}
.badge-hashing-sha256-checksum-verifier{background:#fff7ea;color:var(--warn-sha256-checksum-verifier);}
.badge-verified-sha256-checksum-verifier{background:#e9f9f2;color:var(--ok-sha256-checksum-verifier);}
.badge-mismatch-sha256-checksum-verifier{background:#fdecea;color:var(--danger-sha256-checksum-verifier);}
.badge-nocheck-sha256-checksum-verifier{background:var(--primary-lt-sha256-checksum-verifier);color:var(--dark-sha256-checksum-verifier);}

.progress-mini-sha256-checksum-verifier{height:6px;border-radius:6px;background:var(--primary-lt-sha256-checksum-verifier);overflow:hidden;margin-top:8px;}
.progress-mini-sha256-checksum-verifier .bar{height:100%;background:linear-gradient(90deg,#2563eb,#3b82f6);width:0%;transition:width .15s ease;}
.fr-stats-sha256-checksum-verifier{display:flex;gap:14px;font-size:11px;color:var(--muted-sha256-checksum-verifier);margin-top:5px;flex-wrap:wrap;}
.hash-row-sha256-checksum-verifier{display:flex;align-items:center;gap:8px;background:var(--primary-lt-sha256-checksum-verifier);border-radius:8px;padding:6px 10px;margin-top:6px;}
.hash-row-sha256-checksum-verifier .algo-lbl{font-size:10.5px;font-weight:800;color:var(--dark-sha256-checksum-verifier);min-width:62px;}
.hash-row-sha256-checksum-verifier code{font-size:11.5px;word-break:break-all;flex:1;color:var(--text);}
.hash-row-sha256-checksum-verifier button{border:none;background:none;color:var(--dark-sha256-checksum-verifier);cursor:pointer;font-size:13px;flex-shrink:0;}
.diff-match-sha256-checksum-verifier{color:var(--ok-sha256-checksum-verifier);}
.diff-mismatch-sha256-checksum-verifier{background:#fdecea;color:var(--danger-sha256-checksum-verifier);border-radius:2px;}
body.dark-mode .diff-mismatch-sha256-checksum-verifier{background:#3a1210;}
.expected-input-sha256-checksum-verifier{font-family:monospace;font-size:11.5px;}
.history-row-sha256-checksum-verifier{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid var(--border-sha256-checksum-verifier);font-size:12px;}
.history-row-sha256-checksum-verifier:last-child{border-bottom:none;}
.dashboard-grid-sha256-checksum-verifier{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;}
.dash-tile-sha256-checksum-verifier{background:var(--primary-lt-sha256-checksum-verifier);border-radius:12px;padding:14px;text-align:center;}
.dash-tile-sha256-checksum-verifier .num{font-size:22px;font-weight:800;color:var(--dark-sha256-checksum-verifier);}
.dash-tile-sha256-checksum-verifier .lbl{font-size:10.5px;font-weight:700;color:var(--muted-sha256-checksum-verifier);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}
.compat-row-sha256-checksum-verifier{display:flex;align-items:center;gap:8px;font-size:12px;padding:4px 0;}
.compat-ok-sha256-checksum-verifier{color:var(--ok-sha256-checksum-verifier);}
.compat-bad-sha256-checksum-verifier{color:var(--danger-sha256-checksum-verifier);}
.cmd-block-sha256-checksum-verifier{background:#0e1526;color:#d8e2fa;border-radius:10px;padding:12px 14px;font-family:monospace;font-size:12px;overflow-x:auto;margin-top:6px;white-space:pre;}
.range-row-sha256-checksum-verifier{display:flex;align-items:center;gap:8px;}

.form-text-hint-sha256-checksum-verifier{font-size:11.5px;color:var(--muted);margin-top:4px;}

/* DMARC RECORD GENERATOR */
.page-hero-dmarc-record-generator{background:linear-gradient(135deg,#4f46e5 0%,#0b0f3d 100%);color:#fff;padding:40px 0 32px;}
.page-hero-dmarc-record-generator h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}
.hero-badges-dmarc-record-generator{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.hero-badge-dmarc-record-generator{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;}
.calc-card-dmarc-record-generator{background:var(--white-dmarc-record-generator);border:1px solid var(--border-dmarc-record-generator);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-dmarc-record-generator{background:var(--white-dmarc-record-generator);border:1px solid var(--border-dmarc-record-generator);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-dmarc-record-generator h2{font-size:19px;font-weight:800;margin-bottom:10px;}
.content-block-dmarc-record-generator p{color:var(--muted-dmarc-record-generator);font-size:13.5px;line-height:1.75;margin-bottom:10px;}
.content-block-dmarc-record-generator h3{font-size:15px;font-weight:600;margin-bottom:10px;}

.btn-calc-dmarc-record-generator{background:linear-gradient(135deg,#4f46e5,#4338ca);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-dmarc-record-generator:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-dmarc-record-generator{background:transparent;color:var(--primary-dmarc-record-generator);border:1.5px solid var(--primary-dmarc-record-generator);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-dmarc-record-generator:hover{background:var(--primary-lt-dmarc-record-generator);}
.btn-ghost-dmarc-record-generator{background:var(--primary-lt-dmarc-record-generator);color:var(--dark-dmarc-record-generator);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-ghost-dmarc-record-generator.active{background:var(--primary-dmarc-record-generator);color:#fff;}
.btn-danger-ghost-dmarc-record-generator{background:#fdecea;color:var(--danger-dmarc-record-generator);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.group-label-dmarc-record-generator{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-dmarc-record-generator);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-dmarc-record-generator);}
.group-label-dmarc-record-generator:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-dmarc-record-generator{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .warn-box-dmarc-record-generator{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-dmarc-record-generator{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .ok-box-dmarc-record-generator{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.bad-box-dmarc-record-generator{background:#fdecea;border:1px solid #f3b3ab;color:#9a1c12;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .bad-box-dmarc-record-generator{background:#3a1210;border-color:#6b241d;color:#f4a89f;}
.tab-row-dmarc-record-generator{display:flex;gap:6px;background:var(--primary-lt-dmarc-record-generator);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-dmarc-record-generator{flex:1;min-width:150px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted-dmarc-record-generator);}
.tab-btn-dmarc-record-generator.active{background:var(--white-dmarc-record-generator);color:var(--dark-dmarc-record-generator);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-dmarc-record-generator{background:var(--white-dmarc-record-generator);border:1.5px solid var(--border-dmarc-record-generator);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-dmarc-record-generator);font-size:14px;}
.stat-pill-dmarc-record-generator{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-dmarc-record-generator);color:var(--dark-dmarc-record-generator);margin-right:6px;margin-bottom:6px;}

.stat-pill-dmarc-record-generator.bad{background:#fdecea;color:var(--danger-dmarc-record-generator);}
.stat-pill-dmarc-record-generator.ok{background:#e9f9f2;color:var(--ok-dmarc-record-generator);}
.tag-row-dmarc-record-generator{display:flex;align-items:flex-start;gap:10px;background:var(--primary-lt-dmarc-record-generator);border-radius:10px;padding:10px 12px;margin-top:8px;}
.tag-row-dmarc-record-generator .tag-lbl{font-size:11px;font-weight:800;color:var(--dark-dmarc-record-generator);min-width:52px;padding-top:1px;}
.tag-row-dmarc-record-generator .tag-val{font-family:monospace;font-size:12px;color:var(--text-dmarc-record-generator);font-weight:700;}
.tag-row-dmarc-record-generator .tag-desc{font-size:12px;color:var(--muted-dmarc-record-generator);margin-top:2px;line-height:1.5;}
.tag-row-dmarc-record-generator button{border:none;background:none;color:var(--dark-dmarc-record-generator);cursor:pointer;font-size:13px;flex-shrink:0;}
.badge-status-dmarc-record-generator{font-size:10.5px;font-weight:800;padding:4px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;}
.badge-ok-dmarc-record-generator{background:#e9f9f2;color:var(--ok-dmarc-record-generator);}
.badge-bad-dmarc-record-generator{background:#fdecea;color:var(--danger-dmarc-record-generator);}
.badge-warn-dmarc-record-generator{background:#fff7ea;color:var(--warn-dmarc-record-generator);}
.badge-neutral-dmarc-record-generator{background:var(--primary-lt-dmarc-record-generator);color:var(--dark-dmarc-record-generator);}
.dashboard-grid-dmarc-record-generator{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;}
.dash-tile-dmarc-record-generator{background:var(--primary-lt-dmarc-record-generator);border-radius:12px;padding:14px;text-align:center;}
.dash-tile-dmarc-record-generator .num{font-size:22px;font-weight:800;color:var(--dark-dmarc-record-generator);}
.dash-tile-dmarc-record-generator .lbl{font-size:10.5px;font-weight:700;color:var(--muted-dmarc-record-generator);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}
.record-output-dmarc-record-generator{font-family:monospace;font-size:13px;word-break:break-all;background:var(--primary-lt-dmarc-record-generator);border:1.5px solid var(--border-dmarc-record-generator);border-radius:10px;padding:12px 14px;min-height:60px;white-space:pre-wrap;}
.ref-table-dmarc-record-generator{width:100%;font-size:11.5px;border-collapse:collapse;}
.ref-table-dmarc-record-generator th,.ref-table td{padding:6px 4px;border-bottom:1px solid var(--border-dmarc-record-generator);text-align:left;vertical-align:top;}
.ref-table-dmarc-record-generator th{color:var(--dark-dmarc-record-generator);font-weight:800;}
.ref-table-dmarc-record-generator td.tagname{font-family:monospace;font-weight:700;color:var(--text);white-space:nowrap;}
.checkbox-pill-dmarc-record-generator{display:inline-flex;align-items:center;gap:6px;background:var(--white);border:1.5px solid var(--border-dmarc-record-generator);border-radius:10px;padding:7px 12px;font-size:12.5px;font-weight:700;cursor:pointer;}
.checkbox-pill-dmarc-record-generator input{margin:0;}
.checkbox-pill-dmarc-record-generator.active{border-color:var(--primary-dmarc-record-generator);background:var(--primary-lt-dmarc-record-generator);color:var(--dark);}
.loading-spin-dmarc-record-generator{display:inline-block;width:14px;height:14px;border:2px solid var(--border-dmarc-record-generator);border-top-color:var(--primary-dmarc-record-generator);border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}


/* LANGCHAIN CONVERTER */
.page-hero-langchain-converter{background:linear-gradient(135deg,#0d9488 0%,#08201d 100%);color:#fff;padding:40px 0 32px;}
.page-hero-langchain-converter h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}
.hero-badges-langchain-converter{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.hero-badge-langchain-converter{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;}
.calc-card-langchain-converter{background:var(--white-langchain-converter);border:1px solid var(--border-langchain-converter);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.form-text-hint-langchain-converter{font-size:11px;color:var(--muted-langchain-converter);margin-top:4px;}
.content-block-langchain-converter{background:var(--white-langchain-converter);border:1px solid var(--border-langchain-converter);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-langchain-converter h2{font-size:19px;font-weight:800;margin-bottom:10px;}
.content-block-langchain-converter p{color:var(--muted-langchain-converter);font-size:13.5px;line-height:1.75;margin-bottom:10px;}

.btn-calc-langchain-converter{background:linear-gradient(135deg,#0d9488,#0f766e);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-langchain-converter:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-langchain-converter{background:transparent;color:var(--primary-langchain-converter);border:1.5px solid var(--primary-langchain-converter);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-langchain-converter:hover{background:var(--primary-lt-langchain-converter);}
.btn-ghost-langchain-converter{background:var(--primary-lt-langchain-converter);color:var(--dark-langchain-converter);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-ghost-langchain-converter.active{background:var(--primary-langchain-converter);color:#fff;}
.btn-danger-ghost-langchain-converter{background:#fdecea;color:var(--danger-langchain-converter);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.group-label-langchain-converter{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-langchain-converter);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-langchain-converter);display:flex;align-items:center;justify-content:space-between;gap:8px;}
.group-label-langchain-converter:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-langchain-converter{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .warn-box-langchain-converter{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-langchain-converter{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .ok-box-langchain-converter{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.bad-box-langchain-converter{background:#fdecea;border:1px solid #f3b3ab;color:#9a1c12;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .bad-box-langchain-converter{background:#3a1210;border-color:#6b241d;color:#f4a89f;}
.dropzone-langchain-converter{border:2px dashed var(--border-langchain-converter);border-radius:14px;padding:24px 16px;text-align:center;cursor:pointer;background:var(--primary-lt-langchain-converter);transition:border-color .15s ease;}
.dropzone-langchain-converter.drag{border-color:var(--primary-langchain-converter);}
.dropzone-langchain-converter h3{font-size:13.5px;font-weight:800;margin:6px 0 3px;}
.dropzone-langchain-converter p{font-size:12px;color:var(--muted-langchain-converter);margin:0 0 10px;}
.dropzone-langchain-converter .formats{font-size:10px;color:var(--muted-langchain-converter);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}

.tab-row-langchain-converter{display:flex;gap:6px;background:var(--primary-lt-langchain-converter);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-langchain-converter{flex:1;min-width:150px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted-langchain-converter);}
.tab-btn-langchain-converter.active{background:var(--white-langchain-converter);color:var(--dark-langchain-converter);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-langchain-converter{background:var(--white-langchain-converter);border:1.5px solid var(--border-langchain-converter);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark);font-size:14px;}
.stat-pill-langchain-converter{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-langchain-converter);color:var(--dark-langchain-converter);margin-right:6px;margin-bottom:6px;}
.stat-pill-langchain-converter.bad{background:#fdecea;color:var(--danger-langchain-converter);}
.stat-pill-langchain-converter.ok{background:#e9f9f2;color:var(--ok-langchain-converter);}
.dashboard-grid-langchain-converter{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;}
.dash-tile-langchain-converter{background:var(--primary-lt-langchain-converter);border-radius:12px;padding:12px;text-align:center;}
.dash-tile-langchain-converter .num{font-size:20px;font-weight:800;color:var(--dark-langchain-converter);}
.dash-tile-langchain-converter .lbl{font-size:10px;font-weight:700;color:var(--muted-langchain-converter);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}
.field-table-langchain-converter{width:100%;font-size:12.5px;border-collapse:collapse;}
.field-table-langchain-converter th{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--dark-langchain-converter);text-align:left;padding:6px 8px;border-bottom:1.5px solid var(--border-langchain-converter);}
.field-table-langchain-converter td{padding:7px 8px;border-bottom:1px solid var(--border-langchain-converter);vertical-align:middle;}
.field-table-langchain-converter .fname{font-family:monospace;font-weight:700;}
.type-badge-langchain-converter{font-size:9.5px;font-weight:800;padding:2px 7px;border-radius:10px;background:var(--primary-lt-langchain-converter);color:var(--dark-langchain-converter);text-transform:uppercase;}
.chip-row-langchain-converter{display:flex;align-items:center;gap:8px;background:var(--primary-lt-langchain-converter);border-radius:10px;padding:7px 10px;margin-bottom:6px;flex-wrap:wrap;}
.chip-row-langchain-converter .chip-name{font-family:monospace;font-weight:700;font-size:12px;flex:1;min-width:80px;}
.chip-row-langchain-converter button{border:none;background:none;color:var(--dark-langchain-converter);cursor:pointer;font-size:13px;}
.preview-pane-langchain-converter{border:1.5px solid var(--border-langchain-converter);border-radius:10px;padding:12px;height:340px;overflow:auto;font-family:monospace;font-size:12px;white-space:pre-wrap;word-break:break-word;background:var(--white-langchain-converter);line-height:1.6;}

.jk-langchain-converter{color:var(--dark-langchain-converter);font-weight:700;}
.js-langchain-converter{color:var(--ok-langchain-converter);}
.jn-langchain-converter{color:#b45309;}
.jb-langchain-converter{color:var(--warn-langchain-converter);font-weight:700;}
.jz-langchain-converter{color:var(--muted-langchain-converter);font-style:italic;}
.cmd-block-langchain-converter{background:#0e1526;color:#d8e2fa;border-radius:10px;padding:12px 14px;font-family:monospace;font-size:12px;overflow-x:auto;margin-top:6px;white-space:pre;max-height:420px;overflow-y:auto;}
.custom-row-langchain-converter{display:flex;gap:8px;margin-bottom:8px;flex-wrap:wrap;align-items:center;}
.custom-row-langchain-converter input{flex:1;min-width:110px;}
.vdb-grid-langchain-converter{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;}
.vdb-btn-langchain-converter{background:var(--white-langchain-converter);border:1.5px solid var(--border-langchain-converter);border-radius:10px;padding:9px 10px;font-size:12px;font-weight:700;cursor:pointer;text-align:center;}
.vdb-btn-langchain-converter.active{border-color:var(--primary-langchain-converter);background:var(--primary-lt-langchain-converter);color:var(--dark-langchain-converter);}
.file-row-langchain-converter{background:var(--white-langchain-converter);border:1.5px solid var(--border-langchain-converter);border-radius:12px;padding:12px 14px;margin-bottom:10px;}
.file-row-langchain-converter .fr-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.fr-icon-langchain-converter{width:34px;height:34px;border-radius:9px;background:var(--primary-lt-langchain-converter);color:var(--dark-langchain-converter);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;}
.fr-name-langchain-converter{font-size:13px;font-weight:700;}

/* CLEAN TEXT FOR LLM TRANING DATA */
.page-hero-clean-text-for-llm{background:linear-gradient(135deg,#7c3aed 0%,#0e0b2e 100%);color:#fff;padding:40px 0 32px;}
.page-hero-clean-text-for-llm h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}

.hero-badges-clean-text-for-llm{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.hero-badge-clean-text-for-llm{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;}
.calc-card-clean-text-for-llm{background:var(--white-clean-text-for-llm);border:1px solid var(--border-clean-text-for-llm);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}

.form-text-hint-clean-text-for-llm{font-size:11px;color:var(--muted-clean-text-for-llm);margin-top:4px;}
.content-block-clean-text-for-llm{background:var(--white-clean-text-for-llm);border:1px solid var(--border-clean-text-for-llm);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-clean-text-for-llm h2{font-size:19px;font-weight:800;margin-bottom:10px;}
.content-block-clean-text-for-llm h3{font-size:15px;font-weight:600;margin-bottom:10px;}
.content-block-clean-text-for-llm p{color:var(--muted-clean-text-for-llm);font-size:13.5px;line-height:1.75;margin-bottom:10px;}

.btn-calc-clean-text-for-llm{background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-clean-text-for-llm:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-clean-text-for-llm{background:transparent;color:var(--primary-clean-text-for-llm);border:1.5px solid var(--primary-clean-text-for-llm);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-clean-text-for-llm:hover{background:var(--primary-lt-clean-text-for-llm);}
.btn-ghost-clean-text-for-llm{background:var(--primary-lt-clean-text-for-llm);color:var(--dark-clean-text-for-llm);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-ghost-clean-text-for-llm.active{background:var(--primary-clean-text-for-llm);color:#fff;}
.btn-danger-ghost-clean-text-for-llm{background:#fdecea;color:var(--danger-clean-text-for-llm);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.group-label-clean-text-for-llm{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-clean-text-for-llm);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-clean-text-for-llm);display:flex;align-items:center;justify-content:space-between;gap:8px;}
.group-label-clean-text-for-llm:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-clean-text-for-llm{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .warn-box-clean-text-for-llm{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-clean-text-for-llm{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .ok-box-clean-text-for-llm{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.bad-box-clean-text-for-llm{background:#fdecea;border:1px solid #f3b3ab;color:#9a1c12;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .bad-box-clean-text-for-llm{background:#3a1210;border-color:#6b241d;color:#f4a89f;}
.dropzone-clean-text-for-llm{border:2px dashed var(--border-clean-text-for-llm);border-radius:14px;padding:24px 16px;text-align:center;cursor:pointer;background:var(--primary-lt-clean-text-for-llm);transition:border-color .15s ease;}
.dropzone-clean-text-for-llm.drag{border-color:var(--primary-clean-text-for-llm);}
.dropzone-clean-text-for-llm h3{font-size:13.5px;font-weight:800;margin:6px 0 3px;}
.dropzone-clean-text-for-llm p{font-size:12px;color:var(--muted-clean-text-for-llm);margin:0 0 10px;}
.dropzone-clean-text-for-llm .formats{font-size:10px;color:var(--muted-clean-text-for-llm);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}


.tab-row-clean-text-for-llm{display:flex;gap:6px;background:var(--primary-lt-clean-text-for-llm);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-clean-text-for-llm{flex:1;min-width:130px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted-clean-text-for-llm);}
.tab-btn-clean-text-for-llm.active{background:var(--white-clean-text-for-llm);color:var(--dark-clean-text-for-llm);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-clean-text-for-llm{background:var(--white-clean-text-for-llm);border:1.5px solid var(--border-clean-text-for-llm);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-clean-text-for-llm);font-size:14px;}
.stat-pill-clean-text-for-llm{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-clean-text-for-llm);color:var(--dark-clean-text-for-llm);margin-right:6px;margin-bottom:6px;}
.stat-pill-clean-text-for-llm.bad{background:#fdecea;color:var(--danger-clean-text-for-llm);}
.stat-pill-clean-text-for-llm.ok{background:#e9f9f2;color:var(--ok-clean-text-for-llm);}
.preset-btn-clean-text-for-llm{background:var(--white-clean-text-for-llm);border:1.5px solid var(--border-clean-text-for-llm);border-radius:12px;padding:10px 12px;font-size:12px;font-weight:700;cursor:pointer;text-align:left;display:flex;flex-direction:column;gap:2px;width:100%;height:100%;}
.preset-btn-clean-text-for-llm:hover{border-color:var(--primary-clean-text-for-llm);}
.preset-btn-clean-text-for-llm .p-desc{font-size:10.5px;font-weight:600;color:var(--muted-clean-text-for-llm);}
.op-check-clean-text-for-llm{display:flex;align-items:flex-start;gap:8px;background:var(--white-clean-text-for-llm);border:1.5px solid var(--border-clean-text-for-llm);border-radius:10px;padding:8px 10px;font-size:12px;font-weight:600;cursor:pointer;}
.op-check-clean-text-for-llm input{margin-top:2px;}
.op-check-clean-text-for-llm.active{border-color:var(--primary-clean-text-for-llm);background:var(--primary-lt-clean-text-for-llm);}
.op-grid-clean-text-for-llm{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;}
.dashboard-grid-clean-text-for-llm{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px;}
.dash-tile-clean-text-for-llm{background:var(--primary-lt-clean-text-for-llm);border-radius:12px;padding:12px;text-align:center;}
.dash-tile-clean-text-for-llm .num{font-size:20px;font-weight:800;color:var(--dark-clean-text-for-llm);}
.dash-tile-clean-text-for-llm .lbl{font-size:10px;font-weight:700;color:var(--muted-clean-text-for-llm);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}
.preview-pane-clean-text-for-llm{border:1.5px solid var(--border-clean-text-for-llm);border-radius:10px;padding:12px;height:340px;overflow:auto;font-family:monospace;font-size:12.5px;white-space:pre-wrap;word-break:break-word;background:var(--white-clean-text-for-llm);line-height:1.6;}
.diff-removed-clean-text-for-llm{background:#fdecea;color:var(--danger-clean-text-for-llm);text-decoration:line-through;border-radius:2px;}
body.dark-mode .diff-removed-clean-text-for-llm{background:#3a1210;}
.diff-added-clean-text-for-llm{background:#e9f9f2;color:var(--ok-clean-text-for-llm);border-radius:2px;}
body.dark-mode .diff-added-clean-text-for-llm{background:#0c2f24;}


textarea.mono{font-family:monospace;font-size:12.5px;}
.file-row-clean-text-for-llm{background:var(--white-clean-text-for-llm);border:1.5px solid var(--border-clean-text-for-llm);border-radius:12px;padding:12px 14px;margin-bottom:10px;}
.file-row-clean-text-for-llm .fr-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.fr-icon-clean-text-for-llm{width:34px;height:34px;border-radius:9px;background:var(--primary-lt-clean-text-for-llm);color:var(--dark-clean-text-for-llm);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;}
.fr-name-clean-text-for-llm{font-size:13px;font-weight:700;word-break:break-all;}
.fr-meta-clean-text-for-llm{font-size:11px;color:var(--muted-clean-text-for-llm);margin-top:2px;}
.custom-row-clean-text-for-llm{display:flex;gap:8px;margin-bottom:8px;flex-wrap:wrap;align-items:center;}
.custom-row-clean-text-for-llm input{flex:1;min-width:110px;}
.badge-status-clean-text-for-llm{font-size:10.5px;font-weight:800;padding:4px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;}
.badge-neutral-clean-text-for-llm{background:var(--primary-lt-clean-text-for-llm);color:var(--dark-clean-text-for-llm);}
.report-row-clean-text-for-llm{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;padding:7px 4px;border-bottom:1px solid var(--border-clean-text-for-llm);}
.report-row-clean-text-for-llm:last-child{border-bottom:none;}
.report-row-clean-text-for-llm .cnt{font-weight:800;color:var(--dark-clean-text-for-llm);}
.cmd-block-clean-text-for-llm{background:#0e1526;color:#d8e2fa;border-radius:10px;padding:12px 14px;font-family:monospace;font-size:12px;overflow-x:auto;margin-top:6px;white-space:pre;}
kbd{background:var(--primary-lt-clean-text-for-llm);color:var(--dark-clean-text-for-llm);border-radius:5px;padding:2px 6px;font-size:11px;font-weight:800;}

/* CLAUDE TOKEN AND COST ESTIMATOR */

.page-hero-claude-token-cost-estimator{background:linear-gradient(135deg,#7c3aed 0%,#1e0a4d 100%);color:#fff;padding:40px 0 32px;}
.page-hero-claude-token-cost-estimator h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}
.hero-badges-claude-token-cost-estimator{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.hero-badge-claude-token-cost-estimator{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;}
.calc-card-claude-token-cost-estimator{background:var(--white);border:1px solid var(--border-claude-token-cost-estimator);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}

.content-block-claude-token-cost-estimator{background:var(--white-claude-token-cost-estimator);border:1px solid var(--border-claude-token-cost-estimator);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-claude-token-cost-estimator h1{font-size:25px;font-weight:800;margin-bottom:10px;}
.content-block-claude-token-cost-estimator h2{font-size:15px;font-weight:800;margin-bottom:10px;}
.content-block-claude-token-cost-estimator h3{font-size:15px;font-weight:600;margin-bottom:10px;}

.content-block-claude-token-cost-estimator p{color:var(--muted-claude-token-cost-estimator);font-size:13.5px;line-height:1.75;margin-bottom:10px;}

.btn-calc-claude-token-cost-estimator{background:linear-gradient(135deg,#7c3aed,#6d28d9);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-claude-token-cost-estimator:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-claude-token-cost-estimator{background:transparent;color:var(--primary-claude-token-cost-estimator);border:1.5px solid var(--primary-claude-token-cost-estimator);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-claude-token-cost-estimator:hover{background:var(--primary-lt-claude-token-cost-estimator);}
.btn-ghost-claude-token-cost-estimator{background:var(--primary-lt-claude-token-cost-estimator);color:var(--dark-claude-token-cost-estimator);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-ghost-claude-token-cost-estimator.active{background:var(--primary-claude-token-cost-estimator);color:#fff;}
.btn-danger-ghost-claude-token-cost-estimator{background:#fdecea;color:var(--danger-claude-token-cost-estimator);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.group-label-claude-token-cost-estimator{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-claude-token-cost-estimator);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-claude-token-cost-estimator);}
.group-label-claude-token-cost-estimator:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-claude-token-cost-estimator{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}

body.dark-mode .warn-box-claude-token-cost-estimator{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-claude-token-cost-estimator{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .ok-box-claude-token-cost-estimator{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.bad-box-claude-token-cost-estimator{background:#fdecea;border:1px solid #f3b3ab;color:#9a1c12;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .bad-box-claude-token-cost-estimator{background:#3a1210;border-color:#6b241d;color:#f4a89f;}
.info-box-claude-token-cost-estimator{background:var(--accent-lt-claude-token-cost-estimator);border:1px solid #9fd8d1;color:#0a5c53;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .info-box-claude-token-cost-estimator{border-color:#1c5a52;color:#7fdccf;}
.dropzone-claude-token-cost-estimator{border:2px dashed var(--border-claude-token-cost-estimator);border-radius:14px;padding:20px 16px;text-align:center;cursor:pointer;background:var(--primary-lt-claude-token-cost-estimator);transition:border-color .15s ease;}
.dropzone-claude-token-cost-estimator.drag{border-color:var(--primary-claude-token-cost-estimator);}
.dropzone-claude-token-cost-estimator h3{font-size:13.5px;font-weight:800;margin:6px 0 3px;}
.dropzone-claude-token-cost-estimator p{font-size:12px;color:var(--muted-claude-token-cost-estimator);margin:0 0 10px;}
.dropzone-claude-token-cost-estimator .formats{font-size:10px;color:var(--muted-claude-token-cost-estimator);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}
.tab-row-claude-token-cost-estimator{display:flex;gap:6px;background:var(--primary-lt-claude-token-cost-estimator);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-claude-token-cost-estimator{flex:1;min-width:110px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted-claude-token-cost-estimator);}
.tab-btn-claude-token-cost-estimator.active{background:var(--white-claude-token-cost-estimator);color:var(--dark-claude-token-cost-estimator);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-claude-token-cost-estimator{background:var(--white-claude-token-cost-estimator);border:1.5px solid var(--border-claude-token-cost-estimator);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-claude-token-cost-estimator);font-size:14px;}
.stat-pill-claude-token-cost-estimator{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-claude-token-cost-estimator);color:var(--dark-claude-token-cost-estimator);margin-right:6px;margin-bottom:6px;}
.stat-pill-claude-token-cost-estimator.bad{background:#fdecea;color:var(--danger-claude-token-cost-estimator);}
.stat-pill-claude-token-cost-estimator.ok{background:#e9f9f2;color:var(--ok-claude-token-cost-estimator);}


.dashboard-grid-claude-token-cost-estimator{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;}
.dash-tile-claude-token-cost-estimator{background:var(--primary-lt-claude-token-cost-estimator);border-radius:12px;padding:14px;text-align:center;}
.dash-tile-claude-token-cost-estimator .num{font-size:22px;font-weight:800;color:var(--dark-claude-token-cost-estimator);}
.dash-tile-claude-token-cost-estimator .lbl{font-size:10.5px;font-weight:700;color:var(--muted-claude-token-cost-estimator);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}
.editor-wrap-claude-token-cost-estimator{position:relative;}
#mainInput{width:100%;min-height:340px;resize:vertical;border:1.5px solid var(--border-claude-token-cost-estimator);border-radius:12px;padding:14px;font-family:'JetBrains Mono',monospace;font-size:12.8px;line-height:1.65;background:var(--white);color:var(--text);}
#mainInput:focus{outline:none;border-color:var(--primary-claude-token-cost-estimator);box-shadow:0 0 0 3px rgba(124,58,237,.14);}
.editor-toolbar-claude-token-cost-estimator{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px;}
.progress-track-claude-token-cost-estimator{height:9px;border-radius:6px;background:var(--primary-lt-claude-token-cost-estimator);overflow:hidden;}
.progress-track-claude-token-cost-estimator .bar{height:100%;background:linear-gradient(90deg,#7c3aed,#0d9488);width:0%;transition:width .2s ease;}
.progress-track-claude-token-cost-estimator .bar.danger{background:linear-gradient(90deg,#dc2626,#c2760c);}
.progress-track-claude-token-cost-estimator .bar.warn{background:linear-gradient(90deg,#c2760c,#f0b429);}
.section-block-claude-token-cost-estimator{border:1.5px solid var(--border-claude-token-cost-estimator);border-radius:10px;padding:10px 12px;margin-bottom:8px;background:var(--white-claude-token-cost-estimator);}
.section-block-claude-token-cost-estimator .sec-tag{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--dark-claude-token-cost-estimator);background:var(--primary-lt-claude-token-cost-estimator);padding:3px 8px;border-radius:6px;}
.heat-item-claude-token-cost-estimator{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;margin-bottom:5px;font-size:12px;}
.heat-bar-claude-token-cost-estimator{flex:1;height:8px;border-radius:5px;background:var(--primary-lt-claude-token-cost-estimator);overflow:hidden;}
.heat-bar-claude-token-cost-estimator i{display:block;height:100%;background:linear-gradient(90deg,#0d9488,#c2760c,#dc2626);}
.heat-txt-claude-token-cost-estimator{max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted-claude-token-cost-estimator);}
.heat-tok-claude-token-cost-estimator{font-weight:800;color:var(--dark-claude-token-cost-estimator);min-width:52px;text-align:right;}
.chip-claude-token-cost-estimator{display:inline-flex;align-items:center;gap:6px;background:var(--primary-lt-claude-token-cost-estimator);color:var(--dark-claude-token-cost-estimator);border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;cursor:pointer;border:1.5px solid transparent;}

.chip-claude-token-cost-estimator:hover{border-color:var(--primary-claude-token-cost-estimator);}
.kbd-claude-token-cost-estimator{background:var(--primary-lt-claude-token-cost-estimator);border:1px solid var(--border-claude-token-cost-estimator);border-radius:5px;padding:1px 6px;font-size:11px;font-family:monospace;font-weight:700;color:var(--dark-claude-token-cost-estimator);}
.table-clean-claude-token-cost-estimator{width:100%;font-size:12.5px;border-collapse:collapse;}
.table-clean-claude-token-cost-estimator th{text-align:left;color:var(--muted-claude-token-cost-estimator);font-weight:700;text-transform:uppercase;font-size:10.5px;letter-spacing:.04em;padding:8px 10px;border-bottom:2px solid var(--border-claude-token-cost-estimator);}
.table-clean-claude-token-cost-estimator td{padding:9px 10px;border-bottom:1px solid var(--border-claude-token-cost-estimator);vertical-align:top;}
.table-clean-claude-token-cost-estimator tr:last-child td{border-bottom:none;}
.badge-status-claude-token-cost-estimator{font-size:10.5px;font-weight:800;padding:4px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;}
.badge-ok-claude-token-cost-estimator{background:#e9f9f2;color:var(--ok-claude-token-cost-estimator);}
.badge-warn-claude-token-cost-estimator{background:#fff7ea;color:var(--warn-claude-token-cost-estimator);}
.badge-bad-claude-token-cost-estimator{background:#fdecea;color:var(--danger-claude-token-cost-estimator);}
.preview-box-claude-token-cost-estimator{border:1.5px solid var(--border-claude-token-cost-estimator);border-radius:10px;padding:14px;background:var(--white-claude-token-cost-estimator);max-height:340px;overflow:auto;font-size:13px;}
.preview-box-claude-token-cost-estimator pre{background:#0e1526;color:#d8e2fa;padding:10px;border-radius:8px;overflow-x:auto;}
.history-row-claude-token-cost-estimator{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px solid var(--border-claude-token-cost-estimator);font-size:12px;}
.history-row-claude-token-cost-estimator:last-child{border-bottom:none;}
.range-row-claude-token-cost-estimator{display:flex;align-items:center;gap:8px;}
.small-note-claude-token-cost-estimator{font-size:11px;color:var(--muted-claude-token-cost-estimator);}
textarea.form-control{font-family:inherit;}
.samp-list-claude-token-cost-estimator{display:flex;flex-wrap:wrap;gap:6px;}

/* FBX TO OBJ */
.page-hero-fbx-to-obj{background:linear-gradient(135deg,#ea580c 0%,#4a1a05 100%);color:#fff;padding:40px 0 32px;}
.page-hero-fbx-to-obj h1{font-size:clamp(22px,3vw,32px);font-weight:800;letter-spacing:-0.03em;}
.hero-badges-fbx-to-obj{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.hero-badge-fbx-to-obj{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:5px 12px;font-size:11.5px;font-weight:700;}
.calc-card-fbx-to-obj{background:var(--white-fbx-to-obj);border:1px solid var(--border-fbx-to-obj);border-radius:16px;padding:26px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-fbx-to-obj{background:var(--white-fbx-to-obj);border:1px solid var(--border-fbx-to-obj);border-radius:14px;padding:26px;margin-bottom:20px;}
.content-block-fbx-to-obj h2{font-size:19px;font-weight:800;margin-bottom:10px;}
.content-block-fbx-to-obj p{color:var(--muted-fbx-to-obj);font-size:13.5px;line-height:1.75;margin-bottom:10px;}

.btn-calc-fbx-to-obj{background:linear-gradient(135deg,#ea580c,#c2410c);color:#fff;border:none;border-radius:10px;padding:10px 20px;font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-calc-fbx-to-obj:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-fbx-to-obj{background:transparent;color:var(--primary-fbx-to-obj);border:1.5px solid var(--primary-fbx-to-obj);border-radius:10px;padding:8px 16px;font-size:12.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-outline-purple-fbx-to-obj:hover{background:var(--primary-lt-fbx-to-obj);}
.btn-outline-purple-fbx-to-obj:disabled{opacity:.5;cursor:not-allowed;}
.btn-ghost-fbx-to-obj{background:var(--primary-lt-fbx-to-obj);color:var(--dark-fbx-to-obj);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.btn-ghost-fbx-to-obj.active{background:var(--primary-fbx-to-obj);color:#fff;}
.btn-danger-ghost-fbx-to-obj{background:#fdecea;color:var(--danger);border:none;border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;white-space:nowrap;}
.group-label-fbx-to-obj{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-fbx-to-obj);margin:20px 0 10px;padding-top:14px;border-top:1px solid var(--border-fbx-to-obj);}
.group-label-fbx-to-obj:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-fbx-to-obj{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .warn-box-fbx-to-obj{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-fbx-to-obj{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .ok-box-fbx-to-obj{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.bad-box-fbx-to-obj{background:#fdecea;border:1px solid #f3b3ab;color:#9a1c12;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .bad-box-fbx-to-obj{background:#3a1210;border-color:#6b241d;color:#f4a89f;}
.info-box-fbx-to-obj{background:var(--accent-lt-fbx-to-obj);border:1px solid #9ed3dd;color:#0a5a68;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}


body.dark-mode .info-box-fbx-to-obj{border-color:#175a68;color:#7fd6e6;}
.dropzone-fbx-to-obj{border:2px dashed var(--border-fbx-to-obj);border-radius:14px;padding:22px 16px;text-align:center;cursor:pointer;background:var(--primary-lt-fbx-to-obj);transition:border-color .15s ease;}
.dropzone-fbx-to-obj.drag{border-color:var(--primary-fbx-to-obj);}
.dropzone-fbx-to-obj h3{font-size:13.5px;font-weight:800;margin:6px 0 3px;}
.dropzone-fbx-to-obj p{font-size:12px;color:var(--muted-fbx-to-obj);margin:0 0 10px;}
.dropzone-fbx-to-obj .formats{font-size:10px;color:var(--muted-fbx-to-obj);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}
.tab-row-fbx-to-obj{display:flex;gap:6px;background:var(--primary-lt-fbx-to-obj);border-radius:10px;padding:4px;margin-bottom:14px;flex-wrap:wrap;}
.tab-btn-fbx-to-obj{flex:1;min-width:110px;border:none;background:transparent;padding:9px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted-fbx-to-obj);}
.tab-btn-fbx-to-obj.active{background:var(--white-fbx-to-obj);color:var(--dark-fbx-to-obj);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.icon-toggle-fbx-to-obj{background:var(--white-fbx-to-obj);border:1.5px solid var(--border-fbx-to-obj);border-radius:10px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-fbx-to-obj);font-size:14px;}
.stat-pill-fbx-to-obj{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-fbx-to-obj);color:var(--dark-fbx-to-obj);margin-right:6px;margin-bottom:6px;}

.dashboard-grid-fbx-to-obj{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;}
.dash-tile-fbx-to-obj{background:var(--primary-lt-fbx-to-obj);border-radius:12px;padding:14px;text-align:center;}
.dash-tile-fbx-to-obj .num{font-size:20px;font-weight:800;color:var(--dark-fbx-to-obj);}
.dash-tile-fbx-to-obj .lbl{font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}
.chip-row-fbx-to-obj{display:flex;flex-wrap:wrap;gap:8px;}
.chip-fbx-to-obj{display:inline-flex;align-items:center;gap:6px;background:var(--white-fbx-to-obj);border:1.5px solid var(--border-fbx-to-obj);border-radius:10px;padding:7px 12px;font-size:12.5px;font-weight:700;cursor:pointer;}
.chip-fbx-to-obj.active{border-color:var(--primary-fbx-to-obj);background:var(--primary-lt-fbx-to-obj);color:var(--dark-fbx-to-obj);}
.viewer-wrap-fbx-to-obj{position:relative;border:1.5px solid var(--border-fbx-to-obj);border-radius:14px;overflow:hidden;background:#FFF;height:420px;}
.viewer-wrap-fbx-to-obj canvas{display:block;width:100%;height:100%;}
.viewer-toolbar-fbx-to-obj{position:absolute;top:10px;left:10px;right:10px;display:flex;flex-wrap:wrap;gap:6px;z-index:5;}
.vt-btn-fbx-to-obj{background:rgba(20,15,10,.65);color:#fff;border:1px solid rgba(255,255,255,.25);border-radius:8px;padding:6px 10px;font-size:11.5px;font-weight:700;cursor:pointer;backdrop-filter:blur(4px);}
.vt-btn-fbx-to-obj.active{background:var(--primary-fbx-to-obj);border-color:var(--primary-fbx-to-obj);}
.viewer-empty-fbx-to-obj{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#8a7a68;font-size:13px;flex-direction:column;gap:8px;text-align:center;padding:20px;}
.progress-track-fbx-to-obj{height:9px;border-radius:6px;background:var(--primary-lt-fbx-to-obj);overflow:hidden;}
.progress-track-fbx-to-obj .bar{height:100%;background:linear-gradient(90deg,#ea580c,#0891b2);width:0%;transition:width .2s ease;}
.log-box-fbx-to-obj{background:#12100e;color:#d9cdbf;font-family:'JetBrains Mono',monospace;font-size:11.5px;border-radius:10px;padding:12px 14px;max-height:220px;overflow-y:auto;white-space:pre-wrap;}
.mat-row-fbx-to-obj{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1.5px solid var(--border-fbx-to-obj);border-radius:10px;margin-bottom:6px;background:var(--white-fbx-to-obj);}
.mat-swatch-fbx-to-obj{width:22px;height:22px;border-radius:5px;border:1px solid var(--border-fbx-to-obj);flex-shrink:0;}
.file-row-fbx-to-obj{background:var(--white-fbx-to-obj);border:1.5px solid var(--border-fbx-to-obj);border-radius:12px;padding:12px 14px;margin-bottom:10px;}
.file-row-fbx-to-obj .fr-top{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
.fr-icon-fbx-to-obj{width:34px;height:34px;border-radius:8px;background:var(--primary-lt-fbx-to-obj);color:var(--dark-fbx-to-obj);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;}
.badge-status-fbx-to-obj{font-size:10.5px;font-weight:800;padding:4px 10px;border-radius:20px;text-transform:uppercase;letter-spacing:.03em;}
.badge-pending-fbx-to-obj{background:#f0ede8;color:var(--muted-fbx-to-obj);}
.badge-working-fbx-to-obj{background:#fff7ea;color:var(--warn-fbx-to-obj);}
.badge-done-fbx-to-obj{background:#e9f9f2;color:var(--ok-fbx-to-obj);}
.badge-error-fbx-to-obj{background:#fdecea;color:var(--danger-fbx-to-obj);}
.tool-card-fbx-to-obj{border:1.5px solid var(--border-fbx-to-obj);border-radius:12px;padding:14px;background:var(--white-fbx-to-obj);height:100%;}
.tool-card-fbx-to-obj h5{font-size:13px;font-weight:800;margin-bottom:4px;}
.tool-card-fbx-to-obj p{font-size:11.5px;color:var(--muted-fbx-to-obj);margin-bottom:8px;}
.small-note-fbx-to-obj{font-size:11px;color:var(--muted-fbx-to-obj);}
.range-row-fbx-to-obj{display:flex;align-items:center;gap:8px;}
.kbd-fbx-to-obj{background:var(--primary-lt-fbx-to-obj);border:1px solid var(--border-fbx-to-obj);border-radius:5px;padding:1px 6px;font-size:11px;font-family:monospace;font-weight:700;color:var(--dark-fbx-to-obj);}

/* BASE 64 IMAGE TOOL KIT */

.page-hero-base64-image{background:linear-gradient(135deg,#0d9488 0%,#134e4a 100%);color:#fff;padding:40px 0 32px;}
.page-hero-base64-image h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-base64-image{background:var(--white-base64-image);border:1px solid var(--border-base64-image);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-base64-image{background:var(--white-base64-image);border:1px solid var(--border-base64-image);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-base64-image h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-base64-image p{color:var(--muted-base64-image);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-base64-image{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-base64-image th{background:var(--primary-lt-base64-image);color:var(--dark-base64-image);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-base64-image td{padding:9px 14px;border-bottom:1px solid var(--border-base64-image);}

.btn-calc-base64-image{background:linear-gradient(135deg,#0d9488,#134e4a);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-base64-image{background:transparent;color:var(--primary-base64-image);border:2px solid var(--primary-base64-image);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-base64-image:hover{background:var(--primary-lt-base64-image);}
.btn-ghost-sm-base64-image{background:transparent;border:1px solid var(--border-base64-image);color:var(--muted-base64-image);border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer;}
.btn-ghost-sm-base64-image:hover{border-color:var(--danger-base64-image);color:var(--danger-base64-image);}
.section-divider-base64-image{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-base64-image);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-base64-image);}
.result-box-base64-image{background:var(--primary-lt-base64-image);border:1.5px solid #99f6e4;border-radius:12px;padding:16px;}
.result-row-base64-image{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px dashed #99f6e4;font-size:13.5px;gap:10px;}
.result-row-base64-image:last-child{border-bottom:none;}
.result-row-base64-image .lbl{color:var(--muted-base64-image);font-weight:600;}
.result-row-base64-image .val{font-weight:800;color:var(--text-base64-image);font-family:'SFMono-Regular',Consolas,monospace;text-align:right;word-break:break-word;}
.result-row-base64-image.total .val{color:var(--dark-base64-image);font-size:17px;}
.badge-free-base64-image{background:#d1fae5;color:var(--good-base64-image);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.badge-charge-base64-image{background:#fee2e2;color:var(--danger-base64-image);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.code-box-base64-image{background:#0b1220;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;max-height:260px;overflow:auto;}
.code-copy-btn-base64-image{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}

.toast-box-base64-image{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-base64-image.show{opacity:1;transform:translateY(0);}
.preset-btn-base64-image{font-size:12px;font-weight:700;background:var(--bg-base64-image);border:1px solid var(--border-base64-image);border-radius:999px;padding:7px 14px;cursor:pointer;color:var(--muted-base64-image);}
.preset-btn-base64-image:hover{border-color:var(--primary-base64-image);color:var(--primary-base64-image);}
.preset-btn-base64-image.active{border-color:var(--primary-base64-image);color:var(--primary-base64-image);background:var(--primary-lt-base64-image);}
.form-check-label-base64-image{font-size:12.5px;font-weight:600;}
.who-pays-toggle-base64-image{display:flex;border:1.5px solid var(--border-base64-image);border-radius:10px;overflow:hidden;width:fit-content;}
.who-pays-toggle-base64-image button{border:none;background:var(--white-base64-image);padding:9px 16px;font-size:12.5px;font-weight:700;color:var(--muted-base64-image);cursor:pointer;}
.who-pays-toggle-base64-image button.active{background:var(--primary-base64-image);color:#fff;}
.dropzone-base64-image{border:2px dashed var(--border-base64-image);border-radius:14px;padding:34px 18px;text-align:center;cursor:pointer;background:var(--bg-base64-image);transition:.15s;}
.dropzone-base64-image.hover{border-color:var(--primary-base64-image);background:var(--primary-lt-base64-image);}
.dropzone-base64-image i{font-size:30px;color:var(--dark-base64-image);}
.tab-panel-base64-image{display:none;}
.tab-panel-base64-image.active{display:block;}
.thumb-card-base64-image{border:1px solid var(--border-base64-image);border-radius:12px;padding:12px;background:var(--bg-base64-image);margin-bottom:12px;}
.thumb-card-base64-image img{max-width:100%;max-height:160px;border-radius:8px;display:block;margin:0 auto 10px;background:repeating-conic-gradient(#e5e7eb 0% 25%,transparent 0% 50%) 50%/16px 16px;}
textarea.form-control{resize:vertical;min-height:130px;}
.lang-tab-base64-image{display:inline-block;font-size:12px;font-weight:700;padding:6px 12px;border-radius:8px;cursor:pointer;color:var(--muted-base64-image);border:1px solid var(--border-base64-image);margin:0 4px 6px 0;}
.lang-tab-base64-image.active{background:var(--primary-base64-image);border-color:var(--primary-base64-image);color:#fff;}
.info-grid-base64-image{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;}
.info-cell-base64-image{background:var(--bg-base64-image);border:1px solid var(--border-base64-image);border-radius:10px;padding:10px 12px;}
.info-cell-base64-image .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-base64-image);font-weight:700;}
.info-cell-base64-image .v{font-size:13.5px;font-weight:800;font-family:'SFMono-Regular',Consolas,monospace;word-break:break-word;}
.range-lbl-base64-image{display:flex;justify-content:space-between;font-size:12px;color:var(--muted-base64-image);font-weight:600;}
#toggleDark{border:1px solid var(--border-base64-image);background:var(--white-base64-image);color:var(--muted-base64-image);border-radius:8px;padding:6px 10px;font-size:14px;cursor:pointer;}
.form-control,.form-select{background:var(--white);color:var(--text);border:1.5px solid var(--border);border-radius:10px;font-size:14px;font-weight:600;padding:10px 14px;font-family:inherit;}
.form-control:focus,.form-select:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(13,148,136,.15);outline:none;}
.form-control.mono,textarea.mono{font-family:'SFMono-Regular',Consolas,monospace;font-size:13px;}

/* JWT TOOLKIT */
.page-hero-jwt-toolkit{background:linear-gradient(135deg,#7c3aed 0%,#4c1d95 100%);color:#fff;padding:40px 0 32px;}
.page-hero-jwt-toolkit h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-jwt-toolkit{background:var(--white-jwt-toolkit);border:1px solid var(--border-jwt-toolkit);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-jwt-toolkit{background:var(--white-jwt-toolkit);border:1px solid var(--border-jwt-toolkit);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-jwt-toolkit h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-jwt-toolkit p{color:var(--muted-jwt-toolkit);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-jwt-toolkit{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-jwt-toolkit th{background:var(--primary-lt-jwt-toolkit);color:var(--dark-jwt-toolkit);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-jwt-toolkit td{padding:9px 14px;border-bottom:1px solid var(--border-jwt-toolkit);}

.btn-calc-jwt-toolkit{background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-jwt-toolkit{background:transparent;color:var(--primary-jwt-toolkit);border:2px solid var(--primary-jwt-toolkit);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-jwt-toolkit:hover{background:var(--primary-lt-jwt-toolkit);}
.btn-ghost-sm-jwt-toolkit{background:transparent;border:1px solid var(--border);color:var(--muted-jwt-toolkit);border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer;}
.btn-ghost-sm-jwt-toolkit:hover{border-color:var(--danger-jwt-toolkit);color:var(--danger-jwt-toolkit);}
.section-divider-jwt-toolkit{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-jwt-toolkit);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-jwt-toolkit);}
.result-box-jwt-toolkit{background:var(--primary-lt-jwt-toolkit);border:1.5px solid #c4b5fd;border-radius:12px;padding:16px;}
.result-row-jwt-toolkit{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px dashed #c4b5fd;font-size:13.5px;gap:10px;}
.result-row-jwt-toolkit:last-child{border-bottom:none;}
.result-row-jwt-toolkit .lbl{color:var(--muted-jwt-toolkit);font-weight:600;}
.result-row-jwt-toolkit .val{font-weight:800;color:var(--text-jwt-toolkit);font-family:'SFMono-Regular',Consolas,monospace;text-align:right;word-break:break-word;}
.result-row-jwt-toolkit.total .val{color:var(--dark-jwt-toolkit);font-size:17px;}
.badge-free-jwt-toolkit{background:#d1fae5;color:var(--good-jwt-toolkit);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.badge-charge-jwt-toolkit{background:#fee2e2;color:var(--danger-jwt-toolkit);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.badge-warn-jwt-toolkit{background:#fef3c7;color:#b45309;font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.code-box-jwt-toolkit{background:#0f0a1e;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;max-height:300px;overflow:auto;}
.code-box-jwt-toolkit .key{color:#c4b5fd;} .code-box .str{color:#86efac;} .code-box .num{color:#fca5a5;} .code-box .bool{color:#fcd34d;} .code-box .null{color:#94a3b8;}
.code-copy-btn-jwt-toolkit{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}

.toast-box-jwt-toolkit{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}
.toast-box-jwt-toolkit.show{opacity:1;transform:translateY(0);}
.preset-btn-jwt-toolkit{font-size:12px;font-weight:700;background:var(--bg-jwt-toolkit);border:1px solid var(--border-jwt-toolkit);border-radius:999px;padding:7px 14px;cursor:pointer;color:var(--muted-jwt-toolkit);}
.preset-btn-jwt-toolkit:hover{border-color:var(--primary-jwt-toolkit);color:var(--primary-jwt-toolkit);}
.preset-btn-jwt-toolkit.active{border-color:var(--primary-jwt-toolkit);color:var(--primary-jwt-toolkit);background:var(--primary-lt-jwt-toolkit);}
.form-check-label-jwt-toolkit{font-size:12.5px;font-weight:600;}
.who-pays-toggle-jwt-toolkit{display:flex;border:1.5px solid var(--border-jwt-toolkit);border-radius:10px;overflow:hidden;width:fit-content;}
.who-pays-toggle-jwt-toolkit button{border:none;background:var(--white-jwt-toolkit);padding:9px 16px;font-size:12.5px;font-weight:700;color:var(--muted-jwt-toolkit);cursor:pointer;}
.who-pays-toggle-jwt-toolkit button.active{background:var(--primary-jwt-toolkit);color:#fff;}
.tab-panel-jwt-toolkit{display:none;}
.tab-panel-jwt-toolkit.active{display:block;}
textarea.form-control{resize:vertical;min-height:110px;}
.jwt-part-jwt-toolkit{font-family:'SFMono-Regular',Consolas,monospace;font-size:13px;word-break:break-all;padding:2px 3px;border-radius:4px;}
.jwt-header-jwt-toolkit{background:#fee2e2;color:#991b1b;}
.jwt-payload-jwt-toolkit{background:#dbeafe;color:#1e3a8a;}
.jwt-sig-jwt-toolkit{background:#d1fae5;color:#065f46;}
body.dark .jwt-header-jwt-toolkit{background:#3f1d1d;color:#fca5a5;}
body.dark .jwt-payload-jwt-toolkit{background:#1e2a4a;color:#93c5fd;}
body.dark .jwt-sig-jwt-toolkit{background:#0f2e22;color:#86efac;}
.lang-tab-jwt-toolkit{display:inline-block;font-size:12px;font-weight:700;padding:6px 12px;border-radius:8px;cursor:pointer;color:var(--muted-jwt-toolkit);border:1px solid var(--border-jwt-toolkit);margin:0 4px 6px 0;}
.lang-tab-jwt-toolkit.active{background:var(--primary-jwt-toolkit);border-color:var(--primary-jwt-toolkit);color:#fff;}
.info-grid-jwt-toolkit{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;}
.info-cell-jwt-toolkit{background:var(--bg);border:1px solid var(--border-jwt-toolkit);border-radius:10px;padding:10px 12px;}
.info-cell-jwt-toolkit .k{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted-jwt-toolkit);font-weight:700;}
.info-cell-jwt-toolkit .v{font-size:13.5px;font-weight:800;font-family:'SFMono-Regular',Consolas,monospace;word-break:break-word;}
.check-row-jwt-toolkit{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border-jwt-toolkit);font-size:13.5px;}
.check-row-jwt-toolkit:last-child{border-bottom:none;}
.check-row-jwt-toolkit i{width:18px;text-align:center;}
.score-bar-jwt-toolkit{height:10px;border-radius:999px;background:var(--border-jwt-toolkit);overflow:hidden;}
.score-bar-jwt-toolkit .fill{height:100%;border-radius:999px;transition:width .3s;}
#toggleDark{border:1px solid var(--border-jwt-toolkit);background:var(--white-jwt-toolkit);color:var(--muted-jwt-toolkit);border-radius:8px;padding:6px 10px;font-size:14px;cursor:pointer;}


/* DATA CONVERSION TOOL */
.page-hero-data-conversion-tool{background:linear-gradient(135deg,#d97706 0%,#78350f 100%);color:#fff;padding:40px 0 32px;}
.page-hero-data-conversion-tool h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-data-conversion-tool{background:var(--white-data-conversion-tool);border:1px solid var(--border-data-conversion-tool);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-data-conversion-tool{background:var(--white);border:1px solid var(--border-data-conversion-tool);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-data-conversion-tool h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-data-conversion-tool p{color:var(--muted-data-conversion-tool);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-data-conversion-tool{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-data-conversion-tool th{background:var(--primary-lt-data-conversion-tool);color:var(--dark-data-conversion-tool);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-data-conversion-tool td{padding:9px 14px;border-bottom:1px solid var(--border-data-conversion-tool);}

.btn-calc-data-conversion-tool{background:linear-gradient(135deg,#d97706,#78350f);color:#fff;border:none;border-radius:10px;padding:11px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-outline-purple-data-conversion-tool{background:transparent;color:var(--primary-data-conversion-tool);border:2px solid var(--primary-data-conversion-tool);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-data-conversion-tool:hover{background:var(--primary-lt-data-conversion-tool);}
.btn-ghost-sm-data-conversion-tool{background:transparent;border:1px solid var(--border-data-conversion-tool);color:var(--muted-data-conversion-tool);border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer;}
.btn-ghost-sm-data-conversion-tool:hover{border-color:var(--danger-data-conversion-tool);color:var(--danger-data-conversion-tool);}
.section-divider-data-conversion-tool{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted-data-conversion-tool);margin-bottom:14px;padding-bottom:8px;border-bottom:1px solid var(--border-data-conversion-tool);}
.result-box-data-conversion-tool{background:var(--primary-lt-data-conversion-tool);border:1.5px solid #fcd34d;border-radius:12px;padding:16px;}
.result-row-data-conversion-tool{display:flex;justify-content:space-between;align-items:center;padding:8px 0;border-bottom:1px dashed #fcd34d;font-size:13.5px;gap:10px;}
.result-row-data-conversion-tool:last-child{border-bottom:none;}
.result-row-data-conversion-tool .lbl{color:var(--muted-data-conversion-tool);font-weight:600;}
.result-row-data-conversion-tool .val{font-weight:800;color:var(--text-data-conversion-tool);font-family:'SFMono-Regular',Consolas,monospace;text-align:right;word-break:break-word;}
.result-row-data-conversion-tool.total .val{color:var(--dark-data-conversion-tool);font-size:17px;}
.badge-free-data-conversion-tool{background:#d1fae5;color:var(--good-data-conversion-tool);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.badge-charge-data-conversion-tool{background:#fee2e2;color:var(--danger-data-conversion-tool);font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.badge-warn-data-conversion-tool{background:#fef3c7;color:#b45309;font-weight:700;font-size:11px;padding:3px 9px;border-radius:999px;}
.code-box-data-conversion-tool{background:#1c1408;color:#e5e7eb;border-radius:10px;padding:14px;font-family:monospace;font-size:12.5px;line-height:1.7;white-space:pre-wrap;word-break:break-word;position:relative;margin-top:10px;max-height:340px;overflow:auto;}
.code-copy-btn-data-conversion-tool{position:absolute;top:8px;right:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#e5e7eb;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.toast-box-data-conversion-tool{position:fixed;bottom:20px;right:20px;background:#111827;color:#fff;padding:10px 18px;border-radius:10px;font-size:13px;font-weight:600;opacity:0;transform:translateY(8px);transition:all .2s;pointer-events:none;z-index:9999;}

.toast-box-data-conversion-tool.show{opacity:1;transform:translateY(0);}
.preset-btn-data-conversion-tool{font-size:12px;font-weight:700;background:var(--bg-data-conversion-tool);border:1px solid var(--border-data-conversion-tool);border-radius:999px;padding:7px 14px;cursor:pointer;color:var(--muted);}
.preset-btn-data-conversion-tool:hover{border-color:var(--primary-data-conversion-tool);color:var(--primary-data-conversion-tool);}
.preset-btn-data-conversion-tool.active{border-color:var(--primary-data-conversion-tool);color:var(--primary-data-conversion-tool);background:var(--primary-lt-data-conversion-tool);}
.form-check-label-data-conversion-tool{font-size:12.5px;font-weight:600;}
.who-pays-toggle-data-conversion-tool{display:flex;border:1.5px solid var(--border-data-conversion-tool);border-radius:10px;overflow:hidden;width:fit-content;flex-wrap:wrap;}
.who-pays-toggle-data-conversion-tool button{border:none;background:var(--white-data-conversion-tool);padding:9px 16px;font-size:12.5px;font-weight:700;color:var(--muted-data-conversion-tool);cursor:pointer;}
.who-pays-toggle-data-conversion-tool button.active{background:var(--primary-data-conversion-tool);color:#fff;}
.tab-panel-data-conversion-tool{display:none;}
.tab-panel-data-conversion-tool.active{display:block;}
textarea.form-control{resize:vertical;min-height:150px;}
.dropzone-data-conversion-tool{border:2px dashed var(--border-data-conversion-tool);border-radius:14px;padding:22px 18px;text-align:center;cursor:pointer;background:var(--bg-data-conversion-tool);transition:.15s;}
.dropzone-data-conversion-tool.hover{border-color:var(--primary-data-conversion-tool);background:var(--primary-lt-data-conversion-tool);}
.dropzone-data-conversion-tool i{font-size:24px;color:var(--dark-data-conversion-tool);}
.opt-chip-data-conversion-tool{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;background:var(--bg-data-conversion-tool);border:1px solid var(--border-data-conversion-tool);border-radius:999px;padding:6px 12px;cursor:pointer;color:var(--muted);}
.opt-chip-data-conversion-tool input{accent-color:var(--primary-data-conversion-tool);}
.lang-tab-data-conversion-tool{display:inline-block;font-size:12px;font-weight:700;padding:6px 12px;border-radius:8px;cursor:pointer;color:var(--muted-data-conversion-tool);border:1px solid var(--border-data-conversion-tool);margin:0 4px 6px 0;}
.lang-tab-data-conversion-tool.active{background:var(--primary-data-conversion-tool);border-color:var(--primary-data-conversion-tool);color:#fff;}
.check-row-data-conversion-tool{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border-data-conversion-tool);font-size:13.5px;}
.check-row-data-conversion-tool:last-child{border-bottom:none;}
.check-row-data-conversion-tool i{width:18px;text-align:center;}
#toggleDark{border:1px solid var(--border-data-conversion-tool);background:var(--white-data-conversion-tool);color:var(--muted-data-conversion-tool);border-radius:8px;padding:6px 10px;font-size:14px;cursor:pointer;}
.direction-arrow-data-conversion-tool{font-size:11px;color:var(--muted-data-conversion-tool);text-transform:uppercase;letter-spacing:.04em;font-weight:700;}


/* DUMMY CREDIT CARD GENERATOR */
.page-hero-dummy-credit-card{
  background:linear-gradient(135deg,#4338ca 0%,#1e1b4b 100%);
  color:#fff;
  padding:40px 0 56px;
  position:relative;
}
.page-hero-dummy-credit-card h1{font-weight:800; font-size:27px; margin-bottom:6px;}
.page-hero-dummy-credit-card p{opacity:.9; margin:0; font-size:14.5px;}
.breadcrumb-wrap-dummy-credit-card a{color:#c7d2fe; text-decoration:none; font-size:13px;}
.breadcrumb-wrap-dummy-credit-card span{color:#c7d2fe; font-size:13px;}

.dark-toggle-dummy-credit-card{
  position:absolute; top:20px; right:16px;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  color:#fff;
  border-radius:999px;
  padding:8px 14px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
}
.dark-toggle-dummy-credit-card:hover{background:rgba(255,255,255,.2);}

.container-narrow-dummy-credit-card{max-width:1180px; margin:0 auto; padding:0 16px;}

.layout-dummy-credit-card{
  display:grid;
  grid-template-columns:1fr 300px;
  gap:24px;
  margin-top:-30px;
  padding-bottom:60px;
}
.calc-card-dummy-credit-card{
  background:var(--card-bg);
  border:1px solid var(--card-border-dummy-credit-card);
  border-radius:16px;
  padding:26px;
  box-shadow:0 10px 30px rgba(15,23,42,.06);
}
.calc-card-dummy-credit-card h5{font-weight:800; margin-bottom:4px;}
.calc-card-dummy-credit-card .sub{color:var(--muted-dummy-credit-card); font-size:13.5px; margin-bottom:20px;}

.section-divider-dummy-credit-card{
  font-weight:700;
  font-size:12px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--primary);
  border-bottom:1px solid var(--card-border-dummy-credit-card);
  padding-bottom:8px;
  margin:20px 0 14px;
}

.card-type-grid-dummy-credit-card{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(120px,1fr));
  gap:10px;
}
.card-type-btn-dummy-credit-card{
  border:1.5px solid var(--card-border-dummy-credit-card);
  background:var(--input-bg);
  border-radius:12px;
  padding:12px 10px;
  text-align:center;
  cursor:pointer;
  font-size:13px;
  font-weight:700;
  color:var(--text-dummy-credit-card);
  transition:.12s;
}
.card-type-btn-dummy-credit-card i{display:block; font-size:20px; margin-bottom:6px; color:var(--muted-dummy-credit-card);}
.card-type-btn-dummy-credit-card.active{
  border-color:var(--primary-dummy-credit-card);
  background:var(--primary-light-dummy-credit-card);
  color:var(--primary-dark-dummy-credit-card);
}
.card-type-btn-dummy-credit-card.active i{color:var(--primary-dark-dummy-credit-card);}

.field-label{font-size:12.5px; font-weight:700; color:var(--text-dummy-credit-card); margin-bottom:6px; display:block;}
.select-field-dummy-credit-card, input.form-control-sm-teal{
  border:1px solid var(--card-border-dummy-credit-card);
  border-radius:8px;
  padding:9px 10px;
  font-size:13.5px;
  width:100%;
  background:var(--input-bg-dummy-credit-card);
  color:var(--text-dummy-credit-card);
}
.select-field-dummy-credit-card:focus, input.form-control-sm-teal:focus{outline:none; border-color:var(--primary-dummy-credit-card);}

.opt-chip-dummy-credit-card{
  display:inline-flex; align-items:center; gap:6px;
  border:1px solid var(--card-border-dummy-credit-card);
  background:var(--input-bg-dummy-credit-card);
  padding:8px 13px;
  border-radius:999px;
  font-size:13px;
  cursor:pointer;
  user-select:none;
  color:var(--text-dummy-credit-card);
}
.opt-chip-dummy-credit-card input{accent-color:var(--primary-dummy-credit-card);}

.btn-calc-dummy-credit-card{
  background:var(--primary-dummy-credit-card);
  color:#fff;
  border:none;
  border-radius:10px;
  padding:11px 22px;
  font-weight:700;
  font-size:14px;
}
.btn-calc-dummy-credit-card:hover{background:var(--primary-dark-dummy-credit-card); color:#fff;}
.btn-calc-dummy-credit-card:disabled{opacity:.5; cursor:not-allowed;}

.btn-outline-indigo-dummy-credit-card{
  background:var(--input-bg-dummy-credit-card);
  color:var(--primary-dark-dummy-credit-card);
  border:1px solid var(--card-border-dummy-credit-card);
  border-radius:10px;
  padding:9px 16px;
  font-weight:600;
  font-size:13.5px;
}
.btn-outline-indigo-dummy-credit-card:hover{background:var(--primary-light-dummy-credit-card);}
.btn-outline-indigo-dummy-credit-card:disabled{opacity:.5; cursor:not-allowed;}

.result-box-dummy-credit-card{
  border:1px solid var(--card-border-dummy-credit-card);
  border-radius:12px;
  overflow:hidden;
  background:var(--input-bg-dummy-credit-card);
}


.table-wrap-dummy-credit-card{max-height:520px; overflow:auto;}
table.cc-table-dummy-credit-card{width:100%; border-collapse:collapse; font-size:13px;}
table.cc-table-dummy-credit-card thead th{
  position:sticky; top:0;
  background:var(--primary-light-dummy-credit-card);
  color:var(--primary-dark-dummy-credit-card);
  padding:10px 12px;
  text-align:left;
  font-weight:700;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.03em;
  border-bottom:1px solid var(--card-border-dummy-credit-card);
}
table.cc-table-dummy-credit-card td{
  padding:9px 12px;
  border-bottom:1px solid var(--card-border-dummy-credit-card);
  font-family:'Courier New', monospace;
  white-space:nowrap;
  color:var(--text-dummy-credit-card);
}
table.cc-table-dummy-credit-card tbody tr:hover{background:var(--primary-light-dummy-credit-card);}
.badge-type-dummy-credit-card{
  display:inline-block; padding:2px 9px; border-radius:999px;
  font-size:10.5px; font-weight:700; letter-spacing:.02em;
  background:var(--primary-dummy-credit-card); color:#fff;
  font-family:'Plus Jakarta Sans', sans-serif;
}
.copy-row-btn-dummy-credit-card{
  border:none; background:transparent; color:var(--muted-dummy-credit-card); cursor:pointer; font-size:14px;
}
.copy-row-btn-dummy-credit-card:hover{color:var(--primary-dummy-credit-card);}

.stat-pill-dummy-credit-card{
  display:inline-flex; align-items:center; gap:6px;
  background:var(--primary-light-dummy-credit-card);
  color:var(--primary-dark-dummy-credit-card);
  font-weight:700;
  font-size:12.5px;
  padding:6px 12px;
  border-radius:999px;
  margin-right:8px;
}

.warning-box-dummy-credit-card{
  border:1px solid #fde68a;
  background:#fffbeb;
  color:#92400e;
  border-radius:10px;
  padding:12px 14px;
  font-size:13px;
  display:flex;
  gap:10px;
  align-items:flex-start;
}
body.dark .warning-box-dummy-credit-card{ background:#3f2d0a; border-color:#78530f; color:#fcd34d; }
.warning-box-dummy-credit-card i{font-size:16px; margin-top:1px;}

.sidebar-widget-dummy-credit-card{
  background:var(--card-bg-dummy-credit-card);
  border:1px solid var(--card-border-dummy-credit-card);
  border-radius:16px;
  padding:20px;
  margin-bottom:20px;
}
.sidebar-widget-dummy-credit-card h4{font-size:15px; font-weight:800; margin-bottom:12px;}
.feature-row-dummy-credit-card{display:flex; align-items:flex-start; gap:8px; font-size:13.5px; color:var(--text-dummy-credit-card); padding:6px 0;}
.feature-row-dummy-credit-card i{color:var(--good-dummy-credit-card); margin-top:2px;}

.toast-box-dummy-credit-card{
  position:fixed; bottom:20px; left:50%; transform:translateX(-50%) translateY(20px);
  background:#1f2937; color:#fff; padding:10px 18px; border-radius:8px;
  font-size:13.5px; opacity:0; pointer-events:none; transition:.25s; z-index:9999;
}
.toast-box-dummy-credit-card.show{opacity:1; transform:translateX(-50%) translateY(0);}

.content-block-dummy-credit-card{
  background:var(--card-bg-dummy-credit-card);
  border:1px solid var(--card-border-dummy-credit-card);
  border-radius:16px;
  padding:26px 28px;
  margin-top:22px;
  font-size:14.5px;
  line-height:1.7;
  color:var(--text-dummy-credit-card);
}
.content-block-dummy-credit-card h2{font-size:18px; font-weight:800; margin:18px 0 8px;}
.content-block-dummy-credit-card h2:first-child{margin-top:0;}
.content-block-dummy-credit-card ul{padding-left:20px;}

body.dark-dummy-credit-card{
  --primary-dummy-credit-card:#818cf8;
  --primary-dark-dummy-credit-card:#a5b4fc;
  --primary-light-dummy-credit-card:#312e81;
  --muted-dummy-credit-card:#9ca3af;
  --bg-dummy-credit-card:#0f1117;
  --card-bg-dummy-credit-card:#171a23;
  --card-border-dummy-credit-card:#2a2e3a;
  --text-dummy-credit-card:#e5e7eb;
  --input-bg-dummy-credit-card:#1f2330;
}

/* POSTMAN TO CURL CONVERTER */
.page-hero-postman-to-curl{background:linear-gradient(135deg,#4f46e5 0%,#1e1b4b 100%);color:#fff;padding:40px 0 32px;}
.page-hero-postman-to-curl h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-postman-to-curl{background:var(--white-postman-to-curl);border:1px solid var(--border-postman-to-curl);border-radius:16px;padding:28px;margin-bottom:20px;transition:background .2s ease,border-color .2s ease;}
.content-block-postman-to-curl{background:var(--white-postman-to-curl);border:1px solid var(--border-postman-to-curl);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-postman-to-curl h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-postman-to-curl p{color:var(--muted-postman-to-curl);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-postman-to-curl{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-postman-to-curl th{background:var(--primary-lt-postman-to-curl);color:var(--dark-postman-to-curl);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-postman-to-curl td{padding:9px 14px;border-bottom:1px solid var(--border-postman-to-curl);}

.btn-calc-postman-to-curl{background:linear-gradient(135deg,#4f46e5,#312e81);color:#fff;border:none;border-radius:10px;padding:12px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-calc-postman-to-curl:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-postman-to-curl{background:transparent;color:var(--primary-postman-to-curl);border:2px solid var(--primary-postman-to-curl);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-postman-to-curl:hover{background:var(--primary-lt-postman-to-curl);}
.btn-sm-ghost-postman-to-curl{background:transparent;border:1.5px solid var(--border-postman-to-curl);color:var(--muted-postman-to-curl);border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;cursor:pointer;}
.btn-sm-ghost-postman-to-curl:hover{border-color:var(--primary-postman-to-curl);color:var(--dark-postman-to-curl);}
.group-label-postman-to-curl{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-postman-to-curl);margin:22px 0 10px;padding-top:14px;border-top:1px solid var(--border-postman-to-curl);}
.group-label-postman-to-curl:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.warn-box-postman-to-curl{background:#fff7ea;border:1px solid #f3d9a5;color:#8a5a06;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .warn-box-postman-to-curl{background:#3a2c0c;border-color:#5c4413;color:#f0c766;}
.ok-box-postman-to-curl{background:#e9f9f2;border:1px solid #a9e4c9;color:#046645;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .ok-box-postman-to-curl{background:#0c2f24;border-color:#175b41;color:#6fe3b6;}
.danger-box-postman-to-curl{background:#fdecec;border:1px solid #f5b5b5;color:#a01c1c;border-radius:10px;padding:10px 14px;font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:8px;align-items:flex-start;}
body.dark-mode .danger-box-postman-to-curl{background:#3a1414;border-color:#6b2323;color:#f5a3a3;}


.dropzone-postman-to-curl{border:2px dashed var(--border-postman-to-curl);border-radius:16px;padding:28px 20px;text-align:center;cursor:pointer;background:var(--primary-lt-postman-to-curl);transition:border-color .15s ease,background .15s ease;}
.dropzone-postman-to-curl.drag{border-color:var(--primary-postman-to-curl);}
.dropzone-postman-to-curl h3{font-size:14.5px;font-weight:800;margin:8px 0 4px;}
.dropzone-postman-to-curl p{font-size:12.5px;color:var(--muted-postman-to-curl);margin:0 0 12px;}
.dropzone-postman-to-curl .formats{font-size:10.5px;color:var(--muted-postman-to-curl);letter-spacing:.04em;text-transform:uppercase;font-weight:700;}
input[type=file]{display:none;}

.file-card-postman-to-curl{display:flex;align-items:center;gap:14px;background:var(--primary-lt-postman-to-curl);border:1px solid var(--border-postman-to-curl);border-radius:12px;padding:12px 16px;margin-top:14px;}
.file-card-postman-to-curl .fi{width:38px;height:38px;border-radius:10px;background:var(--primary-postman-to-curl);color:#fff;display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.file-card-postman-to-curl .fname{font-weight:800;font-size:13.5px;word-break:break-all;}
.file-card-postman-to-curl .fmeta{font-size:11.5px;color:var(--muted-postman-to-curl);font-weight:600;}
.file-card-postman-to-curl .rm{margin-left:auto;background:none;border:none;color:var(--muted-postman-to-curl);font-size:20px;cursor:pointer;flex-shrink:0;}
.file-card-postman-to-curl .rm:hover{color:var(--danger-postman-to-curl);}

.tab-row-postman-to-curl{display:flex;gap:6px;background:var(--primary-lt-postman-to-curl);border-radius:10px;padding:4px;margin-bottom:12px;}
.tab-btn-postman-to-curl{flex:1;border:none;background:transparent;padding:8px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted-postman-to-curl);}
.tab-btn-postman-to-curl.active{background:var(--white-postman-to-curl);color:var(--dark-postman-to-curl);box-shadow:0 1px 3px rgba(0,0,0,.08);}

.icon-toggle-postman-to-curl{background:var(--white-postman-to-curl);border:1.5px solid var(--border-postman-to-curl);border-radius:10px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-postman-to-curl);font-size:15px;}
.icon-toggle-postman-to-curl:hover{border-color:var(--primary-postman-to-curl);}
.stat-pill-postman-to-curl{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-postman-to-curl);color:var(--dark-postman-to-curl);margin-right:6px;margin-bottom:6px;}
.stat-pill-postman-to-curl.ok{background:#e9f9f2;color:#046645;}
.stat-pill-postman-to-curl.err{background:#fdecec;color:#a01c1c;}
.status-badge-postman-to-curl{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;padding:5px 10px;border-radius:20px;}
.status-badge-postman-to-curl.valid{background:#e9f9f2;color:#046645;}
.status-badge-postman-to-curl.invalid{background:#fdecec;color:#a01c1c;}
.status-badge-postman-to-curl.idle{background:var(--primary-lt-postman-to-curl);color:var(--dark-postman-to-curl);}


.opt-chip-postman-to-curl{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--border-postman-to-curl);background:var(--white-postman-to-curl);padding:8px 13px;border-radius:999px;font-size:12.5px;font-weight:600;cursor:pointer;user-select:none;color:var(--text-postman-to-curl);}
.opt-chip-postman-to-curl input{accent-color:var(--primary-postman-to-curl);}

.req-card-postman-to-curl{border:1px solid var(--border-postman-to-curl);border-radius:12px;margin-bottom:14px;overflow:hidden;background:var(--bg-postman-to-curl);}
.req-head-postman-to-curl{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--white-postman-to-curl);border-bottom:1px solid var(--border-postman-to-curl);flex-wrap:wrap;}
.method-badge-postman-to-curl{font-size:11px;font-weight:800;padding:3px 9px;border-radius:6px;letter-spacing:.03em;}
.method-GET-postman-to-curl{background:#e0f2fe;color:#0369a1;}
.method-POST-postman-to-curl{background:#dcfce7;color:#15803d;}
.method-PUT-postman-to-curl{background:#fef3c7;color:#92400e;}
.method-PATCH-postman-to-curl{background:#fae8ff;color:#86198f;}
.method-DELETE-postman-to-curl{background:#fee2e2;color:#b91c1c;}
.method-OTHER-postman-to-curl{background:var(--primary-lt-postman-to-curl);color:var(--dark-postman-to-curl);}
.req-name-postman-to-curl{font-weight:700;font-size:13.5px;flex:1;min-width:120px;}
.req-path-postman-to-curl{font-size:11px;color:var(--muted-postman-to-curl);font-weight:600;}
.req-copy-btn-postman-to-curl{background:transparent;border:1.5px solid var(--border-postman-to-curl);color:var(--muted-postman-to-curl);border-radius:8px;padding:6px 12px;font-size:12px;font-weight:700;cursor:pointer;}
.req-copy-btn-postman-to-curl:hover{border-color:var(--primary-postman-to-curl);color:var(--dark-postman-to-curl);}
.req-body-postman-to-curl{padding:0;}
.req-body-postman-to-curl pre{margin:0;padding:14px 16px;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12px;line-height:1.7;white-space:pre-wrap;word-break:break-word;color:var(--text-postman-to-curl);}

.jsonl-output-postman-to-curl{width:100%;min-height:180px;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12px;line-height:1.6;background:var(--bg-postman-to-curl);border:1px solid var(--border-postman-to-curl);border-radius:10px;padding:14px;color:var(--text-postman-to-curl);resize:vertical;}
.textarea-postman-to-curl.form-control{font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12.5px;font-weight:500;}
.textarea-postman-to-curl.form-control.invalid{border-color:var(--danger-postman-to-curl);box-shadow:0 0 0 3px rgba(220,38,38,.12);}
.form-control,.form-select-postman-to-curl{border:1.5px solid var(--border-postman-to-curl);border-radius:10px;font-size:14px;font-weight:600;padding:10px 14px;font-family:inherit;background:var(--white-postman-to-curl);color:var(--text-postman-to-curl);}
.form-control:focus,.form-select-postman-to-curl:focus{border-color:var(--primary-postman-to-curl);box-shadow:0 0 0 3px rgba(79,70,229,.14);outline:none;}
.faq-item-postman-to-curl{border-bottom:1px solid var(--border-postman-to-curl);padding:14px 0;}
.faq-item-postman-to-curl:last-child{border-bottom:none;}
.faq-q-postman-to-curl{font-size:14px;font-weight:700;cursor:pointer;display:flex;justify-content:space-between;align-items:center;}
.faq-a-postman-to-curl{font-size:13.5px;color:var(--muted-postman-to-curl);line-height:1.7;padding-top:8px;display:none;}
.faq-item.open .faq-a-postman-to-curl{display:block;}
.faq-item.open .faq-icon-postman-to-curl{transform:rotate(45deg);}
.faq-icon-postman-to-curl{transition:transform .2s;font-size:18px;color:var(--muted-postman-to-curl);}

body.dark-mode-postman-to-curl{--text-postman-to-curl:#eceafc;--muted-postman-to-curl:#a6a3c2;--border-postman-to-curl:#2c2a42;--bg-postman-to-curl:#131226;--white-postman-to-curl:#1b1a33;--primary-lt-postman-to-curl:#232055;--dark-postman-to-curl:#a5b4fc;}


/* CSS NEON GLOW TEXT GENERATOR */
.page-hero-css-neon-glow-text-generator{background:linear-gradient(135deg,#ec4899 0%,#1e0b2e 100%);color:#fff;padding:40px 0 32px;}
.page-hero-css-neon-glow-text-generator h1{font-size:clamp(22px,3vw,34px);font-weight:800;letter-spacing:-0.03em;}
.calc-card-css-neon-glow-text-generator{background:var(--white-css-neon-glow-text-generator);border:1px solid var(--border-css-neon-glow-text-generator);border-radius:16px;padding:28px;margin-bottom:20px;}
.content-block-css-neon-glow-text-generator{background:var(--white-css-neon-glow-text-generator);border:1px solid var(--border-css-neon-glow-text-generator);border-radius:14px;padding:28px;margin-bottom:20px;}
.content-block-css-neon-glow-text-generator h2{font-size:20px;font-weight:800;margin-bottom:10px;}
.content-block-css-neon-glow-text-generator p{color:var(--muted-css-neon-glow-text-generator);font-size:14px;line-height:1.8;margin-bottom:12px;}
.bf-table-css-neon-glow-text-generator{width:100%;border-collapse:collapse;font-size:13px;}
.bf-table-css-neon-glow-text-generator th{background:var(--primary-lt-css-neon-glow-text-generator);color:var(--dark-css-neon-glow-text-generator);font-weight:700;padding:10px 14px;text-align:left;}
.bf-table-css-neon-glow-text-generator td{padding:9px 14px;border-bottom:1px solid var(--border-css-neon-glow-text-generator);}

.btn-calc-css-neon-glow-text-generator{background:linear-gradient(135deg,#ec4899,#7e22ce);color:#fff;border:none;border-radius:10px;padding:12px 24px;font-size:14px;font-weight:700;cursor:pointer;}
.btn-calc-css-neon-glow-text-generator:disabled{opacity:.5;cursor:not-allowed;}
.btn-outline-purple-css-neon-glow-text-generator{background:transparent;color:var(--primary-css-neon-glow-text-generator);border:2px solid var(--primary-css-neon-glow-text-generator);border-radius:10px;padding:9px 20px;font-size:13px;font-weight:700;cursor:pointer;}
.btn-outline-purple-css-neon-glow-text-generator:hover{background:var(--primary-lt-css-neon-glow-text-generator);}
.group-label-css-neon-glow-text-generator{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--dark-css-neon-glow-text-generator);margin:22px 0 10px;padding-top:14px;border-top:1px solid var(--border-css-neon-glow-text-generator);}
.group-label-css-neon-glow-text-generator:first-of-type{margin-top:0;padding-top:0;border-top:none;}
.icon-toggle-css-neon-glow-text-generator{background:var(--white-css-neon-glow-text-generator);border:1.5px solid var(--border);border-radius:10px;width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--dark-css-neon-glow-text-generator);font-size:15px;}
.icon-toggle-css-neon-glow-text-generator:hover{border-color:var(--primary-css-neon-glow-text-generator);}
.stat-pill-css-neon-glow-text-generator{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:20px;background:var(--primary-lt-css-neon-glow-text-generator);color:var(--dark-css-neon-glow-text-generator);margin-right:6px;margin-bottom:6px;}
.tab-row-css-neon-glow-text-generator{display:flex;gap:6px;background:var(--primary-lt-css-neon-glow-text-generator);border-radius:10px;padding:4px;margin-bottom:12px;}
.tab-btn-css-neon-glow-text-generator{flex:1;border:none;background:transparent;padding:8px 10px;font-size:12.5px;font-weight:700;border-radius:8px;cursor:pointer;color:var(--muted);}
.tab-btn-css-neon-glow-text-generator.active{background:var(--white-css-neon-glow-text-generator);color:var(--dark-css-neon-glow-text-generator);box-shadow:0 1px 3px rgba(0,0,0,.08);}


/* ---- swatches ---- */
.swatch-grid-css-neon-glow-text-generator{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:10px;}
.swatch-btn-css-neon-glow-text-generator{border:2px solid var(--border-css-neon-glow-text-generator);border-radius:12px;padding:10px 6px;text-align:center;cursor:pointer;background:var(--white-css-neon-glow-text-generator);font-size:11px;font-weight:700;color:var(--text-css-neon-glow-text-generator);}
.swatch-btn-css-neon-glow-text-generator.active{border-color:var(--primary-css-neon-glow-text-generator);box-shadow:0 0 0 3px rgba(236,72,153,.14);}
.swatch-dot-css-neon-glow-text-generator{width:26px;height:26px;border-radius:50%;margin:0 auto 6px;box-shadow:0 0 10px currentColor;}
.custom-color-row-css-neon-glow-text-generator{display:flex;align-items:center;gap:10px;margin-top:12px;}
input[type=color]{width:44px;height:38px;border:1.5px solid var(--border-css-neon-glow-text-generator);border-radius:8px;padding:2px;background:var(--white-css-neon-glow-text-generator);cursor:pointer;}

.bg-swatch-grid-css-neon-glow-text-generator{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:10px;}
.bg-swatch-css-neon-glow-text-generator{border:2px solid var(--border-css-neon-glow-text-generator);border-radius:12px;height:56px;cursor:pointer;position:relative;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px;font-size:10.5px;font-weight:700;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6);}
.bg-swatch-css-neon-glow-text-generator.active{border-color:var(--primary-css-neon-glow-text-generator);box-shadow:0 0 0 3px rgba(236,72,153,.14);}
.bg-swatch-css-neon-glow-text-generator.transparent-swatch{background-image:linear-gradient(45deg,#ccc 25%,transparent 25%),linear-gradient(-45deg,#ccc 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ccc 75%),linear-gradient(-45deg,transparent 75%,#ccc 75%);background-size:12px 12px;background-position:0 0,0 6px,6px -6px,-6px 0px;color:#333;text-shadow:none;}

/* ---- anim grid ---- */
.anim-grid-css-neon-glow-text-generator{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;}
.anim-btn-css-neon-glow-text-generator{border:1.5px solid var(--border-css-neon-glow-text-generator);border-radius:10px;padding:10px 12px;text-align:left;cursor:pointer;background:var(--white-css-neon-glow-text-generator);font-size:12.5px;font-weight:700;color:var(--text-css-neon-glow-text-generator);}
.anim-btn-css-neon-glow-text-generator small{display:block;font-weight:500;color:var(--muted-css-neon-glow-text-generator);font-size:10.5px;margin-top:2px;}
.anim-btn-css-neon-glow-text-generator.active{border-color:var(--primary-css-neon-glow-text-generator);background:var(--primary-lt-css-neon-glow-text-generator);color:var(--dark-css-neon-glow-text-generator);}

/* ---- preview ---- */
.preview-stage-css-neon-glow-text-generator{border-radius:16px;padding:60px 20px;display:flex;align-items:center;justify-content:center;min-height:220px;transition:background .2s ease;overflow:hidden;position:relative;}
.preview-stage-css-neon-glow-text-generator.transparent-bg{background-image:linear-gradient(45deg,#3a3a3a 25%,transparent 25%),linear-gradient(-45deg,#3a3a3a 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#3a3a3a 75%),linear-gradient(-45deg,transparent 75%,#3a3a3a 75%);background-color:#222;background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0px;}
.preview-note-css-neon-glow-text-generator{position:absolute;bottom:10px;right:14px;font-size:10.5px;color:rgba(255,255,255,.5);font-weight:600;}

.code-tabs-css-neon-glow-text-generator{display:flex;gap:6px;background:var(--primary-lt-css-neon-glow-text-generator);border-radius:10px;padding:4px;margin-bottom:0;}
.code-panel-css-neon-glow-text-generator{display:none;}
.code-panel-css-neon-glow-text-generator.active{display:block;}
.code-box-css-neon-glow-text-generator{background:#161020;border:1px solid var(--border-css-neon-glow-text-generator);border-radius:0 0 10px 10px;padding:16px;font-family:'SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;font-size:12px;line-height:1.7;color:#f3e9fb;max-height:340px;overflow:auto;white-space:pre-wrap;word-break:break-word;}


/* PDF TOOLS */


.page-hero-pdf-tools{background:linear-gradient(135deg,var(--primary-pdf-tools) 0%,var(--primary-dk-pdf-tools) 100%);color:#fff;padding:38px 0;}
.page-hero-pdf-tools .breadcrumb-item a{color:rgba(255,255,255,.75);text-decoration:none;}
.page-hero-pdf-tools .breadcrumb-item.active{color:#fff;}
.page-hero-pdf-tools h1{font-weight:800;font-size:28px;}
.page-hero-pdf-tools p{color:rgba(255,255,255,.85);font-size:14.5px;}

.privacy-badge-pdf-tools{display:inline-flex;align-items:center;gap:8px;background:var(--success-lt-pdf-tools);color:var(--success-pdf-tools);border:1px solid #bbf7d0;border-radius:999px;padding:7px 16px;font-size:12.5px;font-weight:700;margin-bottom:20px;}

.tool-cards-grid-pdf-tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-bottom:26px;}
.tool-overview-card-pdf-tools{background:#fff;border:1.5px solid var(--border-pdf-tools);border-radius:14px;padding:18px 14px;text-align:center;cursor:pointer;transition:all .15s;}
.tool-overview-card-pdf-tools:hover{border-color:var(--primary-pdf-tools);box-shadow:0 8px 20px rgba(79,70,229,.12);transform:translateY(-2px);}
.tool-overview-card-pdf-tools i{font-size:24px;color:var(--primary-pdf-tools);margin-bottom:8px;display:block;}
.tool-overview-card-pdf-tools .toc-name{font-weight:700;font-size:13.5px;margin-bottom:3px;}
.tool-overview-card-pdf-tools .toc-desc{font-size:11.5px;color:var(--muted-pdf);line-height:1.4;}

.tool-tabs-pdf-tools{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px;border-bottom:1px solid var(--border-pdf-tools);padding-bottom:16px;}
.tool-tab-pdf-tools{background:#fff;border:1.5px solid var(--border-pdf-tools);border-radius:999px;padding:8px 16px;font-size:13px;font-weight:700;color:var(--muted-pdf-tools);cursor:pointer;display:flex;align-items:center;gap:7px;transition:all .15s;}
.tool-tab-pdf-tools:hover{border-color:var(--primary-pdf-tools);color:var(--primary-pdf);}
.tool-tab-pdf-tools.active{background:var(--primary-pdf-tools);border-color:var(--primary-pdf-tools);color:#fff;}

.calc-card-pdf-tools{background:#fff;border:1px solid var(--border-pdf);border-radius:16px;padding:30px;box-shadow:0 2px 10px rgba(15,23,42,.04);display:none;margin-bottom:30px;}
.calc-card-pdf-tools.active{display:block;}
.tool-title-pdf-tools{font-size:21px;font-weight:800;margin-bottom:6px;}
.tool-desc-pdf-tools{font-size:14px;color:var(--muted-pdf);margin-bottom:22px;line-height:1.6;}

.drop-zone-pdf-tools{position:relative;border:2px dashed var(--border-pdf-tools);border-radius:14px;padding:42px 20px;text-align:center;cursor:pointer;transition:all .15s;background:var(--bg-pdf-tools);}
.drop-zone-pdf-tools:hover,.drop-zone-pdf.drag-over{border-color:var(--primary-pdf-tools);background:var(--primary-lt-pdf-tools);}
.drop-zone-pdf-tools input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%;}
.drop-zone-pdf-tools .dz-icon{font-size:32px;color:var(--primary-pdf-tools);display:block;margin-bottom:10px;}
.drop-zone-pdf-tools .dz-label{font-weight:700;font-size:14.5px;}
.drop-zone-pdf-tools .dz-sub{font-size:12px;color:var(--muted-pdf-tools);margin-top:4px;}

.file-list-pdf-tools{margin-top:16px;display:flex;flex-direction:column;gap:8px;}
.file-item-pdf-tools{display:flex;align-items:center;gap:10px;background:var(--bg-pdf-tools);border:1px solid var(--border-pdf-tools);border-radius:10px;padding:9px 12px;font-size:13px;}
.fi-icon-pdf-tools{color:var(--primary-pdf-tools);font-size:16px;}
.fi-name-pdf-tools{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;}
.fi-size-pdf-tools{color:var(--muted-pdf-tools);font-size:11.5px;}
.fi-remove-pdf-tools{background:none;border:none;color:var(--muted-pdf-tools);cursor:pointer;padding:4px 6px;border-radius:6px;}
.fi-remove-pdf-tools:hover{background:var(--danger-lt-pdf-tools);color:var(--danger-pdf-tools);}

.btn-action-pdf-tools{width:100%;background:var(--primary-pdf-tools);color:#fff;border:none;border-radius:12px;padding:14px;font-weight:800;font-size:15px;margin-top:20px;display:flex;align-items:center;justify-content:center;gap:8px;transition:background .15s;}
.btn-action-pdf-tools:hover{background:var(--primary-dk-pdf-tools);}

.status-box-pdf-tools{display:none;margin-top:16px;padding:13px 16px;border-radius:10px;font-size:13.5px;font-weight:600;}
.status-box-pdf-tools.info{display:block;background:var(--info-lt-pdf-tools);color:var(--info-tx-pdf-tools);}
.status-box-pdf-tools.success{display:block;background:var(--success-lt-pdf-tools);color:var(--success-pdf-tools);}
.status-box-pdf-tools.error{display:block;background:var(--danger-lt-pdf-tools);color:var(--danger-pdf-tools);}

.section-heading-pdf-tools{font-size:13px;font-weight:800;color:var(--text-pdf-tools);margin-bottom:10px;text-transform:uppercase;letter-spacing:.03em;}

.page-grid-pdf-tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;max-height:420px;overflow-y:auto;padding:4px;}
.page-thumb-pdf-tools{position:relative;border:2px solid var(--border-pdf-tools);border-radius:10px;overflow:hidden;cursor:pointer;background:#fff;transition:all .15s;}
.page-thumb-pdf-tools:hover{border-color:var(--primary-pdf-tools);}
.page-thumb-pdf-tools.selected{border-color:var(--primary-pdf-tools);box-shadow:0 0 0 3px var(--primary-lt-pdf-tools);}
.page-thumb-pdf-tools canvas{width:100%;display:block;border-bottom:1px solid var(--border-pdf-tools);}
.page-thumb-pdf-tools .pg-check{position:absolute;top:6px;right:6px;width:20px;height:20px;border-radius:50%;background:#fff;border:1.5px solid var(--border-pdf-tools);display:flex;align-items:center;justify-content:center;font-size:11px;color:transparent;}
.page-thumb-pdf-tools.selected .pg-check{background:var(--primary-pdf-tools);border-color:var(--primary-pdf-tools);color:#fff;}
.page-thumb-pdf-tools .pg-num{font-size:10.5px;text-align:center;padding:4px;color:var(--muted-pdf-tools);font-weight:700;}

.form-label{font-size:12.5px;font-weight:700;color:var(--text-pdf-tools);margin-bottom:6px;}
.form-control,.form-select{border-radius:10px;border:1.5px solid var(--border-pdf-tools);font-size:13.5px;}
.form-control:focus,.form-select:focus{border-color:var(--primary-pdf-tools);box-shadow:0 0 0 3px var(--primary-lt-pdf-tools);}

.info-note-pdf-tools{font-size:12px;color:var(--muted-pdf-tools);background:var(--bg-pdf-tools);border:1px solid var(--border-pdf-tools);border-radius:10px;padding:10px 12px;margin-top:10px;line-height:1.5;}
.info-note-pdf-tools i{color:var(--primary-pdf-tools);margin-right:5px;}

.content-block-pdf-tools{background:#fff;border:1px solid var(--border-pdf-tools);border-radius:16px;padding:32px;margin-bottom:24px;}
.content-block-pdf-tools h2{font-size:19px;font-weight:800;margin-top:26px;margin-bottom:10px;}
.content-block-pdf-tools h2:first-child{margin-top:0;}
.content-block-pdf-tools p{font-size:14px;color:#334155;line-height:1.75;}
.content-block-pdf-tools table{font-size:13px;}


/* ── Category sections on home page ───────────────────────────── */
.cat-section-pdf-tools{margin-bottom:34px;}
.cat-section-head-pdf-tools{display:flex;align-items:baseline;gap:10px;margin-bottom:14px;}
.cat-section-head-pdf-tools h2{font-size:16px;font-weight:800;margin:0;}
.cat-section-head-pdf-tools .cat-count{font-size:12px;color:var(--muted-pdf-tools);font-weight:600;}

.tool-grid-pdf-tools{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px;}
.tool-card-pdf-tools{
  position:relative;
  background:#fff;border:1.5px solid var(--border-pdf-tools);border-radius:14px;
  padding:20px 18px;text-decoration:none;color:inherit;
  transition:all .15s;display:block;
}
.tool-card-pdf-tools:hover{border-color:var(--primary-pdf-tools);box-shadow:0 8px 20px rgba(79,70,229,.12);transform:translateY(-2px);}
.tool-card-pdf-tools i.tc-icon{font-size:22px;color:var(--primary-pdf-tools);margin-bottom:10px;display:block;}
.tool-card-pdf-tools .tc-name{font-weight:700;font-size:14px;margin-bottom:4px;}
.tool-card-pdf-tools .tc-desc{font-size:12px;color:var(--muted-pdf-tools);line-height:1.4;}
.tool-card-pdf-tools .tc-badge{
  position:absolute;top:14px;right:14px;
  font-size:9.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  background:var(--amber-lt-pdf-tools);color:var(--amber-pdf-tools);border:1px solid #fde68a;
  border-radius:999px;padding:3px 9px;
}
.rotate-btn-group-pdf-tools{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;}
.rotate-btn-pdf-tools{padding:8px 16px;border:1.5px solid var(--border-pdf-tools);border-radius:8px;background:var(--white-pdf);cursor:pointer;font-size:12px;font-weight:700;color:var(--muted-pdf);display:flex;align-items:center;gap:6px;font-family:inherit;transition:all .15s;}
.rotate-btn-pdf-tools:hover,.rotate-btn-pdf-tools.active{border-color:var(--primary-pdf-tools);color:var(--primary-pdf-tools);background:var(--primary-lt-pdf-tools);}