/* ============================================================================
   XRPMINING - UNIFIED DESIGN SYSTEM
   ============================================================================ */

:root {
--bg-primary: #0a0e0f;
--bg-secondary: #0f1415;
--bg-tertiary: #141a1c;
--bg-card: #121718;
--bg-card-hover: #1a2224;
--accent-primary: #4ade80;
--accent-primary-dark: #22c55e;
--accent-primary-light: #6ee7a7;
--accent-success: #4ade80;
--accent-warning: #f59e0b;
--accent-danger: #ef4444;
--text-primary: #e8f4f0;
--text-secondary: #a8c7bc;
--text-muted: #6b8a7f;
--border-color: rgba(34, 197, 94, 0.2);
--border-color-light: rgba(34, 197, 94, 0.08);
--shadow-sm: 0 1px 2px rgba(34, 197, 94, 0.08);
--shadow-md: 0 4px 6px rgba(34, 197, 94, 0.12);
--shadow-lg: 0 10px 15px rgba(34, 197, 94, 0.15);
--shadow-xl: 0 20px 25px rgba(34, 197, 94, 0.18);
--glow-primary: 0 0 15px rgba(74, 222, 128, 0.2);
--glow-intense: 0 0 30px rgba(74, 222, 128, 0.3);
--transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
--transition-base: 200ms cubic-bezier(0.4, 0, 0.2, 1);
--transition-slow: 300ms cubic-bezier(0.4, 0, 0.2, 1);
}
* {margin: 0;padding: 0;box-sizing: border-box;}
html {scroll-behavior: smooth;}
body {font-family: 'JetBrains Mono', 'Roboto Mono', 'Courier New', monospace;background: var(--bg-primary);color: var(--text-primary);line-height: 1.6;min-height: 100vh;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;background-image: radial-gradient(circle at 20% 50%, rgba(34, 197, 94, 0.02) 0%, transparent 50%), radial-gradient(circle at 80% 80%, rgba(34, 197, 94, 0.02) 0%, transparent 50%);}

::-webkit-scrollbar {width: 8px;height: 8px;}
::-webkit-scrollbar-track {background: var(--bg-secondary);}
::-webkit-scrollbar-thumb {background: var(--bg-tertiary);border-radius: 4px;}
::-webkit-scrollbar-thumb:hover {background: var(--text-muted);}
.navbar {background: var(--bg-secondary);border-bottom: 1px solid var(--border-color);backdrop-filter: blur(10px);position: sticky;top: 0;z-index: 100000;padding: 0.75rem 0;}
.navbar-brand {display: flex;align-items: center;gap: 0.75rem;font-size: 1.25rem;font-weight: 700;color: var(--text-primary) !important;transition: opacity var(--transition-fast);}
.navbar-brand:hover {opacity: 0.8;}
.navbar-brand img {width: 40px;height: 40px;border-radius: 8px;}
.navbar-toggler {border: none;padding: 0.5rem;}
.navbar-toggler:focus {box-shadow: none;}
.navbar-toggler-icon {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(248, 250, 252, 0.75)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");}
.nav-link {color: var(--text-secondary) !important;padding: 0.5rem 1rem !important;margin: 0 0.25rem;border-radius: 6px;font-weight: 500;font-size: 0.9rem;transition: all var(--transition-fast);position: relative;}
.nav-link:hover, .nav-link.active {color: var(--accent-primary) !important;background: rgba(59, 130, 246, 0.1);}
.nav-link i {margin-right: 0.5rem;font-size: 0.875rem;}
.nav-link.btn-link {border: none;background: none;}
.card {background: var(--bg-card);border: 1px solid var(--border-color);border-radius: 12px;box-shadow: var(--shadow-sm);transition: all var(--transition-base);}
.card:hover {border-color: var(--border-color-light);box-shadow: var(--shadow-md);}
.card-body {padding: 1.5rem;}
.card-title {color: var(--text-primary);font-weight: 600;margin-bottom: 0.5rem;}
.btn {border-radius: 8px;font-weight: 600;padding: 0.625rem 1.25rem;transition: all var(--transition-fast);border: none;font-size: 0.9rem;}
.btn:focus {box-shadow: none;}
.btn-primary {background: var(--accent-primary);color: white;}
.btn-primary:hover {background: var(--accent-primary-dark);transform: translateY(-1px);box-shadow: var(--shadow-md);}
.btn-gradient-primary {background: linear-gradient(135deg, var(--accent-primary), var(--accent-primary-light));color: white;}
.btn-gradient-primary:hover {background: linear-gradient(135deg, var(--accent-primary-dark), var(--accent-primary));transform: translateY(-1px);box-shadow: var(--shadow-md);}
.btn-outline-primary {border: 1px solid var(--accent-primary);color: var(--accent-primary);background: transparent;}
.btn-outline-primary:hover {background: var(--accent-primary);color: white;}
.btn-success {background: var(--accent-success);color: white;}
.btn-warning {background: var(--accent-warning);color: white;}
.btn-danger {background: var(--accent-danger);color: white;}
.btn-secondary {background: var(--bg-tertiary);color: var(--text-secondary);}
.btn-sm {padding: 0.5rem 1rem;font-size: 0.875rem;}
.btn-lg {padding: 0.75rem 1.5rem;font-size: 1rem;}
.d-grid {justify-content: center;}
.faucetpay-info-card {display: flex;align-items: center;gap: 15px;padding: 16px;background: linear-gradient(135deg, rgba(79, 209, 197, 0.1), rgba(79, 209, 197, 0.05));border: 1px solid rgba(79, 209, 197, 0.3);border-radius: 12px;transition: all 0.3s ease;position: relative;overflow: hidden;}
.faucetpay-info-card::before {content: '';position: absolute;top: 0;left: -100%;width: 100%;height: 100%;background: linear-gradient(90deg, transparent, rgba(79, 209, 197, 0.1), transparent);transition: left 0.5s ease;}
.faucetpay-info-card:hover::before {left: 100%;}
.faucetpay-info-card:hover {border-color: var(--accent-primary);box-shadow: 0 5px 20px rgba(79, 209, 197, 0.2);transform: translateY(-2px);}
.faucetpay-icon {flex-shrink: 0;width: 45px;height: 45px;display: flex;align-items: center;justify-content: center;background: var(--accent-primary);border-radius: 10px;color: white;font-size: 1.3rem;box-shadow: 0 4px 12px rgba(79, 209, 197, 0.3);}
.faucetpay-content {flex: 1;min-width: 0;}
.faucetpay-title {color: var(--text-primary);font-weight: 600;font-size: 0.9rem;margin-bottom: 4px;display: flex;align-items: center;gap: 6px;}
.faucetpay-title i {color: var(--accent-primary);font-size: 0.85rem;}
.faucetpay-description {color: var(--text-secondary);font-size: 0.8rem;margin: 0;line-height: 1.4;}
.faucetpay-signup-btn {flex-shrink: 0;display: inline-flex;align-items: center;gap: 8px;padding: 10px 18px;background: var(--accent-primary);color: white;text-decoration: none;border-radius: 8px;font-weight: 600;font-size: 0.9rem;transition: all 0.3s ease;white-space: nowrap;}
.faucetpay-signup-btn:hover {background: var(--accent-primary-light);transform: translateX(3px);box-shadow: 0 4px 12px rgba(79, 209, 197, 0.4);color: white;}
.faucetpay-signup-btn i {transition: transform 0.3s ease;}
.faucetpay-signup-btn:hover i {transform: translateX(3px);}
@media (max-width: 768px) {.faucetpay-info-card {flex-direction: column;text-align: center;gap: 12px;} .faucetpay-signup-btn {width: 100%;justify-content: center;}}
.form-label {color: var(--text-primary);font-weight: 500;margin-bottom: 0.5rem;font-size: 0.9rem;}
.form-control {background: var(--bg-primary);border: 1px solid var(--border-color);color: var(--text-primary);padding: 0.625rem 1rem;border-radius: 8px;transition: all var(--transition-fast);}
.form-control:focus {background: var(--bg-primary);border-color: var(--accent-primary);color: var(--text-primary);box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);}
.form-control::placeholder {color: var(--text-muted);}
.form-text {color: var(--text-muted);font-size: 0.85rem;}
.input-group {border-radius: 8px;overflow: hidden;}
.input-group .form-control {border-radius: 0;}
.input-group .form-control:first-child {border-top-left-radius: 8px;border-bottom-left-radius: 8px;}
.input-group .btn {border-radius: 0;}
.input-group .btn:last-child {border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
.alert {border: none;border-radius: 8px;border-left: 3px solid;padding: 1rem 1.25rem;margin-bottom: 1rem;}
.alert-success {background: rgba(16, 185, 129, 0.1);border-left-color: var(--accent-success);color: var(--text-primary);}
.alert-danger {background: rgba(239, 68, 68, 0.1);border-left-color: var(--accent-danger);color: var(--text-primary);}
.alert-warning {background: rgba(245, 158, 11, 0.1);border-left-color: var(--accent-warning);color: var(--text-primary);}
.alert-info {background: rgba(59, 130, 246, 0.1);border-left-color: var(--accent-primary);color: var(--text-primary);}
.alert i {margin-right: 0.5rem;}
.btn-close {filter: brightness(0) invert(1);opacity: 0.5;}
.btn-close:hover {opacity: 1;}
.badge {font-weight: 600;padding: 0.35rem 0.65rem;border-radius: 6px;font-size: 0.75rem;}
.badge.bg-primary {background: var(--accent-primary) !important;}
.badge.bg-success {background: var(--accent-success) !important;}
.badge.bg-warning {background: var(--accent-warning) !important;}
.badge.bg-danger {background: var(--accent-danger) !important;}
.badge.bg-secondary {background: var(--bg-tertiary) !important;}
.progress {background: var(--bg-tertiary);border-radius: 50px;overflow: hidden;height: 8px;}
.progress-bar {background: linear-gradient(90deg, var(--accent-primary), var(--accent-primary-light));transition: width 1s linear;}
.modal {z-index: 10000;}
.modal-content {background: var(--bg-card);border: 1px solid var(--border-color);border-radius: 12px;}
.modal-header {border-bottom: 1px solid var(--border-color);}
.modal-footer {border-top: 1px solid var(--border-color);}
.modal-title {color: var(--text-primary);}
.text-gradient {background: linear-gradient(135deg, var(--accent-primary), var(--accent-primary-light));-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;}
.text-muted {color: var(--text-secondary) !important;}
.gradient-text {background: linear-gradient(135deg, var(--accent-primary), var(--accent-primary-light));-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;}
.ad-slot {display: flex;justify-content: center;align-items: center;margin: 1rem auto;padding: 0.5rem;}
@media (max-width: 767px) {.hide-mobile {display: none !important;}}
@media (min-width: 768px) {.hide-desktop {display: none !important;}}
.sidebar-sticky {position: sticky;top: 80px;}
#ad-slider {position: fixed;bottom: -300px;right: 20px;background: var(--bg-card);box-shadow: var(--shadow-xl);z-index: 9999;transition: bottom 0.5s ease;border: 1px solid var(--border-color);border-radius: 8px;}
#ad-slider.active {bottom: 20px;}
.close-ad {position: absolute;top: 8px;left: 8px;background: var(--bg-tertiary);color: var(--text-primary);border: none;font-size: 16px;cursor: pointer;border-radius: 50%;width: 24px;height: 24px;line-height: 24px;text-align: center;box-shadow: var(--shadow-md);z-index: 10000;transition: all var(--transition-fast);}
.close-ad:hover {background: var(--accent-danger);color: white;}

.stats-card {background: var(--bg-card);border: 1px solid var(--border-color);border-radius: 12px;padding: 1.5rem;transition: all var(--transition-base);height: 100%;}
.stats-card:hover {transform: translateY(-2px);box-shadow: var(--shadow-md);border-color: var(--accent-primary);}
.stats-icon {width: 48px;height: 48px;border-radius: 10px;display: flex;align-items: center;justify-content: center;font-size: 1.25rem;flex-shrink: 0;}
.stats-icon.ads {background: linear-gradient(135deg, var(--accent-primary), var(--accent-primary-light));color: white;}
.stats-icon.rewards {background: linear-gradient(135deg, var(--accent-success), #34d399);color: white;}
.stats-value {font-size: 1.75rem;font-weight: 700;color: var(--text-primary);line-height: 1.2;}
.stats-label {font-size: 0.875rem;color: var(--text-secondary);margin-top: 0.25rem;}
.compact-stat-card {border-radius: 12px;padding: 1.25rem;height: 100%;position: relative;overflow: hidden;}
.compact-stat-card::before {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;opacity: 0.1;background: linear-gradient(135deg, transparent, white);}
.stat-icon-wrapper {width: 48px;height: 48px;background: rgba(255, 255, 255, 0.15);border-radius: 10px;display: flex;align-items: center;justify-content: center;flex-shrink: 0;}
.stat-content {flex: 1;}
.stat-label {font-size: 0.75rem;opacity: 0.9;text-transform: uppercase;letter-spacing: 0.5px;margin-bottom: 0.25rem;}
.stat-value {font-size: 1.5rem;font-weight: 700;line-height: 1.2;}
.stat-subtext {font-size: 0.8rem;opacity: 0.8;}
.feature-card {background: var(--bg-card);border: 1px solid var(--border-color);border-radius: 12px;padding: 1.5rem;text-align: center;transition: all var(--transition-base);height: 100%;}
.feature-card:hover {transform: translateY(-4px);box-shadow: var(--shadow-md);border-color: var(--accent-primary);}
.feature-icon-wrapper {width: 56px;height: 56px;border-radius: 12px;display: inline-flex;align-items: center;justify-content: center;margin-bottom: 1rem;}
.feature-card h5, .feature-card h6 {color: var(--text-primary);font-weight: 600;margin-bottom: 0.5rem;}
.feature-card p, .feature-card small {color: var(--text-secondary);}
.campaign-card {background: var(--bg-card);border: 1px solid var(--border-color);border-radius: 12px;transition: all var(--transition-base);height: 100%;overflow: hidden;}
.campaign-card:hover {transform: translateY(-4px);box-shadow: var(--shadow-lg);border-color: var(--accent-primary);}
.campaign-title {font-size: 1rem;font-weight: 600;color: var(--text-primary);margin-bottom: 0.75rem;min-height: 2.5rem;line-height: 1.3;}
.campaign-description {color: var(--text-secondary);font-size: 0.875rem;margin-bottom: 1rem;line-height: 1.5;height: 63px;overflow: hidden;}
.campaign-info {margin-bottom: 1rem;}
.info-item {display: flex;justify-content: space-between;align-items: center;padding: 0.5rem 0;border-bottom: 1px solid var(--border-color-light);}
.info-item:last-child {border-bottom: none;}
.info-label {color: var(--text-secondary);font-size: 0.85rem;}
.info-label i {margin-right: 0.5rem;color: var(--accent-primary);}
.info-value {font-weight: 600;color: var(--text-primary);}
.reward-highlight {color: var(--accent-success);font-size: 1rem;}
.platform-label {display: inline-block;padding: 0.25rem 0.6rem;border-radius: 6px;font-weight: 600;text-transform: uppercase;font-size: 0.7rem;letter-spacing: 0.3px;}
.platform-label.offerwall {background: rgba(59, 130, 246, 0.15);color: var(--accent-primary);border: 1px solid rgba(59, 130, 246, 0.3);}
.platform-label.bitcotasks {background: rgba(245, 158, 11, 0.15);color: var(--accent-warning);border: 1px solid rgba(245, 158, 11, 0.3);}
.btn-view-ad {display: block;width: 100%;padding: 0.75rem;background: var(--accent-primary);color: white;text-decoration: none;text-align: center;border-radius: 8px;font-weight: 600;transition: all var(--transition-fast);border: none;}
.btn-view-ad:hover {background: var(--accent-primary-dark);transform: translateY(-2px);box-shadow: var(--shadow-md);color: white;}
.btn-view-ad i {margin-right: 0.5rem;}
.platform-tabs {display: grid;grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));gap: 1rem;margin-bottom: 2rem;}
.platform-tab {background: var(--bg-card);border: 1px solid var(--border-color);border-radius: 12px;padding: 1.25rem;cursor: pointer;transition: all var(--transition-fast);text-align: center;}
.platform-tab:hover {transform: translateY(-2px);border-color: var(--accent-primary);}
.platform-tab.active {border-color: var(--accent-primary);background: rgba(59, 130, 246, 0.05);}
.tab-icon {font-size: 1.75rem;margin-bottom: 0.5rem;}
.tab-name {font-weight: 600;color: var(--text-primary);margin-bottom: 0.25rem;font-size: 0.95rem;}
.tab-count {font-size: 0.8rem;color: var(--text-secondary);}
.changelog-item {background: rgba(59, 130, 246, 0.05);border-left: 3px solid var(--accent-primary);padding: 1rem;border-radius: 8px;margin-bottom: 0.75rem;}
.changelog-icon-wrapper {width: 32px;height: 32px;background: var(--accent-primary);border-radius: 8px;display: flex;align-items: center;justify-content: center;color: white;flex-shrink: 0;font-size: 0.85rem;}
.earnings-item {background: var(--bg-card);border-radius: 12px;padding: 1rem;margin-bottom: 0.75rem;border-left: 3px solid var(--accent-primary);display: flex;align-items: center;gap: 1rem;transition: all var(--transition-fast);flex-wrap: wrap;}
.earnings-item:hover {background: var(--bg-card-hover);transform: translateX(4px);}
.user-avatar {width: 44px;height: 44px;background: linear-gradient(135deg, var(--accent-primary), var(--accent-primary-light));border-radius: 50%;display: flex;align-items: center;justify-content: center;flex-shrink: 0;}
.user-avatar i {color: white;font-size: 1.1rem;}
.badge-custom {padding: 0.35rem 0.65rem;border-radius: 6px;font-weight: 600;font-size: 0.75rem;}
.badge-platform {background: rgba(59, 130, 246, 0.15);color: var(--accent-primary);}
.badge-reward {background: var(--accent-success);color: white;}
.badge-time {background: var(--bg-tertiary);color: var(--text-secondary);}
.checkin-card {background: linear-gradient(135deg, #1e293b 0%, #334155 100%);border-radius: 12px;padding: 1.5rem;}
.checkin-stat-box {text-align: center;padding: 0.75rem;background: rgba(255, 255, 255, 0.08);border-radius: 8px;}
.checkin-stat-value {font-weight: 700;font-size: 1.25rem;color: white;}
.checkin-stat-label {font-size: 0.7rem;opacity: 0.8;color: white;}
.firewall-badge {position: fixed;bottom: 20px;right: 20px;background: var(--bg-card);border: 2px solid var(--accent-primary);border-radius: 12px;padding: 1rem 1.25rem;box-shadow: var(--shadow-xl);z-index: 1000;}
.firewall-badge-icon {width: 40px;height: 40px;background: linear-gradient(135deg, var(--accent-primary), var(--accent-primary-light));border-radius: 50%;display: flex;align-items: center;justify-content: center;}
.firewall-badge-label {color: var(--text-secondary);font-size: 0.7rem;text-transform: uppercase;letter-spacing: 0.5px;margin-bottom: 0.25rem;}
.firewall-badge-value {font-size: 1.5rem;font-weight: 700;color: var(--accent-primary);}
.firewall-badge-text {color: var(--text-secondary);font-size: 0.85rem;}
.notification-toast {position: fixed;top: 100px;right: 20px;z-index: 10000;min-width: 300px;max-width: 400px;box-shadow: var(--shadow-xl);}
.empty-state {text-align: center;padding: 4rem 2rem;}
.empty-state-icon {font-size: 4rem;color: var(--text-muted);margin-bottom: 1.5rem;opacity: 0.4;}
.empty-state h3 {font-size: 1.5rem;margin-bottom: 0.75rem;color: var(--text-primary);}
.empty-state p {color: var(--text-secondary);font-size: 1rem;}
.hero-section {padding: 3rem 0 2rem;}
.hero-title {font-size: clamp(2rem, 5vw, 3rem);font-weight: 800;text-align: center;margin-bottom: 1rem;color: var(--text-primary);}
.hero-subtitle {text-align: center;color: var(--text-secondary);font-size: clamp(1rem, 2vw, 1.125rem);margin-bottom: 2.5rem;max-width: 600px;margin-left: auto;margin-right: auto;}
.login-card {background: var(--bg-card);border: 1px solid var(--border-color);}
.section-header {text-align: center;margin-bottom: 2.5rem;}
.section-header h3 {font-size: 1.75rem;font-weight: 700;margin-bottom: 0.5rem;color: var(--text-primary);}
.section-divider {width: 50px;height: 3px;background: var(--accent-primary);margin: 1rem auto;border-radius: 2px;}
.page-header {text-align: center;padding: 2rem 0;margin-bottom: 2rem;}
.page-header h1 {font-size: 2rem;font-weight: 700;color: var(--text-primary);margin-bottom: 0.5rem;}
.page-header p {color: var(--text-secondary);font-size: 1rem;}

@keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}
@keyframes slideInDown {from {opacity: 0;transform: translateY(-20px);} to {opacity: 1;transform: translateY(0);}}
@keyframes slideInUp {from {opacity: 0;transform: translateY(50px);} to {opacity: 1;transform: translateY(0);}}
@keyframes slideInRight {from {opacity: 0;transform: translateX(100px);} to {opacity: 1;transform: translateX(0);}}
@media (max-width: 991px) {.sidebar-sticky {display: none;}}
@media (max-width: 768px) {.card-body {padding: 1.25rem;} .navbar-brand {font-size: 1.125rem;} .navbar-brand img {width: 36px;height: 36px;} .stats-value {font-size: 1.5rem;} .stat-value {font-size: 1.25rem;} .hero-title {font-size: 1.75rem;} .page-header h1 {font-size: 1.75rem;} .platform-tabs {grid-template-columns: 1fr;} #ad-slider {right: 10px;left: 10px;} .notification-toast {right: 10px;left: 10px;min-width: auto;} .firewall-badge {bottom: 10px;right: 10px;padding: 0.75rem 1rem;} .earnings-item {padding: 0.875rem;}}
@media (max-width: 576px) {.hero-section {padding: 2rem 0 1.5rem;} .section-header h3 {font-size: 1.5rem;} .compact-stat-card {padding: 1rem;} .stat-icon-wrapper {width: 40px;height: 40px;} .stat-value {font-size: 1.125rem;}}
h4, h5, h6 {color: #fff;}
.mining-hero-section {position: relative;min-height: 500px;display: flex;align-items: center;justify-content: center;overflow: hidden;margin-bottom: 5rem;border-radius: 20px;}
.mining-background {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(135deg, #1a1f36 0%, #0f1419 50%, #1a1f36 100%);overflow: hidden;}
.mining-grid {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: linear-gradient(rgba(79, 209, 197, 0.1) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 209, 197, 0.1) 1px, transparent 1px);background-size: 50px 50px;animation: gridMove 20s linear infinite;}
@keyframes gridMove {0% {transform: translate(0, 0);} 100% {transform: translate(50px, 50px);}}
.mining-particles {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.mining-particles::before, .mining-particles::after {content: "";position: absolute;width: 4px;height: 4px;background: var(--accent-primary);border-radius: 50%;box-shadow: 0 0 10px var(--accent-primary), 0 0 20px var(--accent-primary), 0 0 30px var(--accent-primary);animation: particleFloat 15s ease-in-out infinite;}
.mining-particles::before {top: 20%;left: 10%;animation-delay: 0s;}
.mining-particles::after {top: 60%;left: 80%;animation-delay: 7s;}
@keyframes particleFloat {0%, 100% {transform: translate(0, 0) scale(1);opacity: 0;} 10% {opacity: 1;} 50% {transform: translate(100px, -100px) scale(1.5);opacity: 1;} 90% {opacity: 1;}}
.mining-particles {background-image: radial-gradient(2px 2px at 20% 30%, rgba(79, 209, 197, 0.8), transparent), radial-gradient(2px 2px at 60% 70%, rgba(79, 209, 197, 0.8), transparent), radial-gradient(1px 1px at 50% 50%, rgba(79, 209, 197, 0.8), transparent), radial-gradient(2px 2px at 80% 10%, rgba(79, 209, 197, 0.8), transparent), radial-gradient(1px 1px at 30% 80%, rgba(79, 209, 197, 0.8), transparent);background-size: 200% 200%;animation: particlesAnimate 30s ease-in-out infinite;}
@keyframes particlesAnimate {0%, 100% {background-position: 0% 0%, 0% 0%, 0% 0%, 0% 0%, 0% 0%;} 25% {background-position: 100% 50%, 50% 100%, 100% 100%, 50% 50%, 100% 0%;} 50% {background-position: 50% 100%, 100% 50%, 50% 0%, 100% 100%, 0% 100%;} 75% {background-position: 0% 50%, 50% 0%, 0% 100%, 50% 50%, 100% 100%;}}
.hero-content {position: relative;z-index: 2;text-align: center;padding: 3rem 1rem;}
.hero-content .hero-title {font-size: 3rem;font-weight: 700;margin-bottom: 1rem;color: var(--text-primary);text-shadow: 0 0 20px rgba(79, 209, 197, 0.3);}
.hero-content .hero-subtitle {font-size: 1.25rem;color: var(--text-secondary);margin-bottom: 2rem;}
.modal-content {background: #050609;border: 1px solid var(--border-color);border-radius: 16px;}
.modal-header {border-bottom: 1px solid var(--border-color);background: var(--bg-secondary);}
.modal-title {color: var(--text-primary);}
.btn-close {filter: invert(1);}
@media (max-width: 768px) {.mining-hero-section {min-height: 400px;} .hero-content .hero-title {font-size: 2rem;} .hero-content .hero-subtitle {font-size: 1rem;}}
.footer-dark {position: relative;background: var(--bg-primary);border-top: 1px solid var(--border-color);margin-top: 5rem;overflow: hidden;}
.footer-background {position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0.3;pointer-events: none;}
.footer-grid {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: linear-gradient(rgba(79, 209, 197, 0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 209, 197, 0.05) 1px, transparent 1px);background-size: 30px 30px;animation: footerGridMove 30s linear infinite;}
@keyframes footerGridMove {0% {transform: translate(0, 0);} 100% {transform: translate(30px, 30px);}}
.footer-brand {display: flex;align-items: center;gap: 12px;margin-bottom: 1rem;}
.footer-logo {width: 40px;height: 40px;border-radius: 8px;}
.footer-brand-name {color: var(--text-primary);font-weight: 700;margin: 0;font-size: 1.5rem;}
.footer-tagline {color: var(--text-secondary);font-size: 0.9rem;margin-bottom: 1rem;}
.footer-tagline i {color: var(--accent-primary);margin-right: 5px;}
.footer-stats {display: flex;flex-wrap: wrap;gap: 8px;}
.stat-badge {display: inline-flex;align-items: center;gap: 5px;padding: 6px 12px;background: rgba(79, 209, 197, 0.1);border: 1px solid rgba(79, 209, 197, 0.2);border-radius: 20px;color: var(--accent-primary);font-size: 0.75rem;font-weight: 600;}
.footer-title {color: var(--text-primary);font-weight: 600;font-size: 1rem;margin-bottom: 1rem;position: relative;padding-bottom: 0.5rem;}
.footer-title::after {content: '';position: absolute;left: 0;bottom: 0;width: 40px;height: 2px;background: linear-gradient(90deg, var(--accent-primary), transparent);}
.footer-links {list-style: none;padding: 0;margin: 0;}
.footer-links li {margin-bottom: 0.75rem;}
.footer-links a {color: var(--text-secondary);text-decoration: none;transition: all 0.3s ease;display: inline-flex;align-items: center;gap: 8px;font-size: 0.9rem;}
.footer-links a:hover {color: var(--accent-primary);transform: translateX(5px);}
.footer-links a i {font-size: 0.85rem;opacity: 0.7;}
.footer-social {display: flex;gap: 12px;}
.social-link {display: flex;align-items: center;justify-content: center;width: 40px;height: 40px;background: rgba(79, 209, 197, 0.1);border: 1px solid rgba(79, 209, 197, 0.2);border-radius: 10px;color: var(--accent-primary);text-decoration: none;transition: all 0.3s ease;}
.social-link:hover {background: var(--accent-primary);color: white;transform: translateY(-3px);box-shadow: 0 5px 15px rgba(79, 209, 197, 0.3);}
.social-link i {font-size: 1.1rem;}
.footer-description {color: var(--text-secondary);font-size: 0.85rem;margin: 0;}
.footer-bottom {border-top: 1px solid var(--border-color);padding: 1.5rem 0;margin-top: 2rem;}
.footer-copyright {color: var(--text-secondary);font-size: 0.9rem;}
.footer-copyright i {color: var(--accent-primary);margin-right: 5px;}
.footer-powered {color: var(--text-secondary);font-size: 0.9rem;}
.powered-text {color: var(--text-secondary);}
.powered-link {color: var(--accent-primary);text-decoration: none;font-weight: 600;transition: all 0.3s ease;display: inline-flex;align-items: center;gap: 5px;}
.powered-link:hover {color: var(--accent-primary-light);transform: translateX(3px);}
.powered-link i {font-size: 0.9rem;}
@media (max-width: 768px) {.footer-brand {justify-content: center;} .footer-tagline, .footer-description {text-align: center;} .footer-stats {justify-content: center;} .footer-social {justify-content: center;} .footer-title::after {left: 50%;transform: translateX(-50%);}}
@media (hover: hover) {.footer-links a:hover i {opacity: 1;}}