:root {--bg-color: #ffffff;--text-color: #222222;--primary-color: #4a90e2;--secondary-color: #f4f4f4;--border-color: #ddd;--input-bg: #fff;--input-border: #ccc;}[data-theme="dark"] {--bg-color: #121212;--text-color: #eaeaea;--primary-color: #4a90e2;--secondary-color: #1e1e1e;--border-color: #444;--input-bg: #1f1f1f;--input-border: #666;}body {font-family: 'Inter', sans-serif;margin: 0;padding: 0;background: var(--bg-color);color: var(--text-color);transition: background 0.3s, color 0.3s;}.navbar {background: linear-gradient(90deg, #4f46e5, #3b82f6);padding: 16px 40px;border-bottom: none;position: sticky;top: 0;z-index: 1000;box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);}.nav-container {display: flex;justify-content: space-between;align-items: center;max-width: 1200px;margin: auto;}.logo {margin: 0;font-size: 1.6rem;font-weight: 700;color: #ffffff;letter-spacing: 1px;}.nav-links {list-style: none;display: flex;gap: 25px;padding: 0;margin: 0;}.nav-links li a {color: #ffffff;text-decoration: none;font-weight: 500;position: relative;padding: 5px 0;transition: color 0.3s;}.nav-links li a::after {content: '';position: absolute;width: 0%;height: 2px;bottom: -3px;left: 0;background: #ffd700;transition: width 0.3s;}.nav-links li a:hover {color: #ffd700;}.nav-links li a:hover::after {width: 100%;}.menu-toggle {display: none;font-size: 1.8rem;background: none;border: none;color: #fff;cursor: pointer;}.theme-toggle {position: fixed;top: 68px;right: 10px;}.theme-toggle button {background: #4f46e5;border: 2px solid #372f9e;border-radius: 5%;padding: 8px;cursor: pointer;color: #fff;transition: background 0.3s, transform 0.2s;}.theme-toggle button:hover {background: #372f9e;transform: scale(1.1);}.hero {text-align: center;padding: 40px 20px;border: 3px solid #4f46e5;border-radius: 12px;margin: 20px auto;max-width: 1200px;background: #3b30d6c2;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);}.hero h1 {margin-bottom: 10px;}.subtitle {color: var(--text-color);opacity: 0.8;margin-bottom: 30px;}.upload-container {display: flex;justify-content: center;gap: 20px;flex-wrap: wrap;}.upload-box {width: 260px;height: 200px;border: 2px dashed var(--border-color);border-radius: 10px;background: var(--secondary-color);display: flex;align-items: center;justify-content: center;cursor: pointer;transition: background 0.2s, border-color 0.2s;}.upload-box:hover {border-color: var(--primary-color);}.upload-box input {display: none;}.upload-content {text-align: center;}.upload-content h3 {margin: 10px 0 5px;}.upload-content p {font-size: 0.9rem;opacity: 0.8;}.result-container {padding: 30px 20px;}.image-container {display: flex;justify-content: center;gap: 30px;flex-wrap: wrap;}.image-box {flex: 1;min-width: 280px;text-align: center;}.image-box img {max-width: 70%;border-radius: 8px;border: 1px solid var(--border-color);transition: transform 0.3s ease, filter 0.3s ease;}#text-overlay {position: absolute;top: 50px;left: 50px;color: black;font-size: 24px;font-family: Arial, sans-serif;font-weight: normal;font-style: normal;white-space: nowrap;pointer-events: none;user-select: none;}.enhancement-controls {margin-top: 15px;padding: 10px;border: 1px solid var(--border-color);border-radius: 8px;background: var(--secondary-color);}.control-group {margin-bottom: 12px;}.control-group label {display: block;margin-bottom: 5px;font-weight: 500;}.control-group input[type=range] {width: 100%;}.reset-btn {background: var(--primary-color);border: none;padding: 8px 12px;color: #fff;border-radius: 5px;cursor: pointer;margin-top: 6px;}.reset-btn:hover {opacity: 0.9;}.text-controls {margin-top: 20px;padding: 12px;border: 1px solid var(--border-color);border-radius: 8px;background: var(--secondary-color);text-align: left;}.text-controls h4 {margin: 0 0 10px;}.text-controls input, .text-controls select, .text-controls button {margin: 6px 0;display: block;width: 100%;padding: 8px;border-radius: 6px;border: 1px solid var(--input-border);background: var(--input-bg);color: var(--text-color);font-family: inherit;}.text-controls input[type="color"] {height: 40px;padding: 0;}.text-controls button {background: var(--primary-color);color: #fff;border: none;cursor: pointer;}.text-controls button:hover {opacity: 0.9;}.move-buttons {display: flex;flex-direction: column;align-items: center;margin: 10px 0;}.move-buttons div {display: flex;gap: 10px;margin: 5px 0;}.move-buttons button {background: var(--primary-color);color: #fff;border: none;padding: 8px 14px;border-radius: 6px;cursor: pointer;font-size: 1rem;}.move-buttons button:hover {opacity: 0.9;}.copy-btn {margin-top: 15px;background: var(--primary-color);border: none;padding: 10px 16px;color: #fff;border-radius: 6px;cursor: pointer;}.copy-btn:hover {opacity: 0.9;}.button-group {text-align: center;margin: 20px 0;display: flex;justify-content: center;align-items: center;gap: 12px;}.button-group button {background: var(--primary-color);border: none;padding: 12px 20px;color: #fff;border-radius: 6px;cursor: pointer;font-size: 1rem;display: flex;align-items: center;gap: 6px;}.button-group button:hover {opacity: 0.9;}#download-format, #download-resolution {padding: 12px 14px;border-radius: 6px;border: 1px solid var(--input-border);background: var(--input-bg);color: var(--text-color);font-family: inherit;cursor: pointer;font-size: 1rem;transition: border-color 0.2s;}#download-format:hover, #download-resolution:hover {border-color: var(--primary-color);}.loading-spinner {display: none;text-align: center;}.spinner {width: 40px;height: 40px;border: 4px solid var(--border-color);border-top-color: var(--primary-color);border-radius: 50%;margin: auto;animation: spin 1s linear infinite;}@keyframes spin {to {transform: rotate(360deg);}}.spinner-content p {margin-top: 10px;}.error-message {color: red;text-align: center;margin-top: 15px;}.about-section {padding: 60px 20px;text-align: center;background: var(--bg-color);color: var(--text-color);}.about-section h2 {font-size: 2rem;margin-bottom: 16px;}.about-section p {font-size: 1.1rem;max-width: 800px;margin: 0 auto;line-height: 1.6;}.social-icons {margin-top: 15px;}.social-icons a {margin: 0 10px;font-size: 1.6rem;color: var(--primary-color);transition: color 0.3s;}.social-icons a:hover {color: #ffd700;}.footer {text-align: center;padding: 20px;background: var(--secondary-color);border-top: 1px solid var(--border-color);}.gallery-section {padding: 60px 20px;text-align: center;}.gallery-section h1 {font-size: 2.2rem;margin-bottom: 20px;}.category-buttons {margin-bottom: 30px;}.category-buttons button {margin: 0 10px;padding: 8px 16px;border: none;border-radius: 20px;background: var(--secondary-color);color: var(--text-color);cursor: pointer;transition: all 0.3s;}.category-buttons button.active, .category-buttons button:hover {background: #4f46e5;color: #fff;}.gallery-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));gap: 20px;justify-items: center;}.gallery-card {background: var(--secondary-color);border-radius: 12px;padding: 10px;box-shadow: 0 4px 10px rgba(0,0,0,0.1);transition: transform 0.3s;}.gallery-card img {max-width: 100%;border-radius: 8px;}.gallery-card:hover {transform: translateY(-5px);}.gallery-card p {margin-top: 10px;font-weight: 500;color: var(--text-color);}@media (max-width: 768px) {.menu-toggle {display: block;}.nav-links {display: none;flex-direction: column;gap: 12px;margin-top: 10px;width: 100%;background: #3b82f6;padding: 15px;border-radius: 8px;}.nav-links.active {display: flex;}.hero {padding: 20px 10px;margin: 10px;}.hero h1 {font-size: 1.8rem;}.subtitle {font-size: 1rem;}.upload-container {flex-direction: column;align-items: center;}.upload-box {width: 90%;height: 180px;}.image-container {flex-direction: column;gap: 20px;}.image-box {min-width: 100%;}.enhancement-controls, .text-controls {width: 100%;}.gallery-grid {grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));gap: 15px;}.gallery-card {width: 100%;}.about-section h2 {font-size: 1.6rem;}.about-section p {font-size: 1rem;padding: 0 10px;}.footer {font-size: 0.9rem;padding: 15px;}.button-group {flex-direction: column;}#download-format, #download-resolution {width: 100%;}}@media (max-width: 480px) {.hero h1 {font-size: 1.5rem;}.subtitle {font-size: 0.9rem;}.upload-box {height: 150px;}.gallery-grid {grid-template-columns: 1fr;}}.share-buttons {text-align: center;margin: 20px 0;}.share-buttons p {margin-bottom: 10px;font-weight: 600;}.share-buttons button {margin: 6px;padding: 10px 16px;border: none;border-radius: 6px;cursor: pointer;color: #fff;font-size: 0.95rem;display: inline-flex;align-items: center;gap: 6px;}.share-buttons button i {font-size: 1.2rem;}#share-facebook {background: #1877f2;}#share-twitter {background: #000000;}#share-linkedin {background: #0077b5;}#share-whatsapp {background: #25d366;}.share-buttons button:hover {opacity: 0.85;}.stock-backgrounds {text-align: center;margin: 30px auto;}.stock-backgrounds h3 {margin-bottom: 15px;font-size: 1.2rem;color: var(--text-color);}.stock-grid {display: flex;justify-content: center;flex-wrap: wrap;gap: 12px;}.stock-item {width: 120px;height: 80px;object-fit: cover;border-radius: 8px;cursor: pointer;border: 2px solid transparent;transition: transform 0.3s, border-color 0.3s;}.stock-item:hover {transform: scale(1.05);border-color: var(--primary-color);}.dynamic-backgrounds {text-align: center;margin: 30px auto;}.dynamic-backgrounds h3 {margin-bottom: 15px;font-size: 1.2rem;color: var(--text-color);}.dynamic-grid {display: flex;justify-content: center;flex-wrap: wrap;gap: 12px;}.dynamic-item {padding: 12px 18px;border-radius: 8px;background: var(--secondary-color);cursor: pointer;transition: transform 0.3s, background 0.3s;font-weight: 600;}.dynamic-item:hover {transform: scale(1.05);background: var(--primary-color);color: #fff;}.bulk-upload {text-align: center;margin: 30px auto;padding: 20px;border: 2px dashed var(--border-color);border-radius: 12px;background: var(--secondary-color);max-width: 800px;}.bulk-upload h3 {margin-bottom: 10px;}.bulk-upload input {margin: 15px 0;}.bulk-preview {display: grid;grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));gap: 15px;margin-top: 20px;}.bulk-item {background: var(--bg-color);padding: 10px;border-radius: 10px;box-shadow: 0 2px 6px rgba(0,0,0,0.1);text-align: center;}.bulk-item img {max-width: 100%;border-radius: 6px;margin-top: 8px;}.bulk-item button {margin-top: 8px;padding: 6px 12px;border: none;border-radius: 6px;background: var(--primary-color);color: #fff;cursor: pointer;}.bulk-item button:hover {opacity: 0.9;}