.integration-page{--integration-hero-bg: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 50%, #f1f5f9 100%);--integration-hero-border: #e5e7eb;--integration-text-primary: #1e293b;--integration-text-secondary: #475569;--integration-text-muted: #6b7280;--integration-card-bg: #ffffff;--integration-card-border: #e5e7eb;--integration-card-hover-border: #d1d5db;--integration-badge-bg: rgba(255, 255, 255, .9);--integration-badge-border: rgba(255, 255, 255, .8);--integration-code-bg: #f9fafb;--integration-code-border: #e5e7eb;--integration-step-line: #e5e7eb;--integration-step-bg: #ffffff;--integration-step-border: #e5e7eb;min-height:100vh}.integration-page .sticky-top{z-index:4}.integration-page .hero-section{background:var(--integration-hero-bg);border-bottom:1px solid var(--integration-hero-border);position:relative;overflow:hidden}.integration-page .hero-section>div{position:relative}.integration-page .hero-section:before{content:"";position:absolute;top:0;left:0;right:0;bottom: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='%236366f1' fill-opacity='0.03'%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") repeat;opacity:1}.integration-page .hero-section:after{content:"";position:absolute;top:-50%;right:-20%;width:200px;height:200px;background:radial-gradient(circle,rgba(99,102,241,.1) 0%,transparent 70%);border-radius:50%}.integration-page .hero-section .hero-content h1{color:var(--integration-text-primary)}.integration-page .hero-section .hero-content p{color:var(--integration-text-secondary)}.integration-page .feature-badges{display:flex;flex-direction:column;gap:1rem;animation:heroFadeInUp 1s ease-out .8s both}.integration-page .feature-badges .badge-item{background:var(--integration-badge-bg);padding:1.5rem;border-radius:16px;border:1px solid var(--integration-badge-border);color:var(--integration-text-secondary);font-weight:600;box-shadow:0 4px 20px #00000014;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s cubic-bezier(.175,.885,.32,1.275);position:relative;overflow:hidden}.integration-page .feature-badges .badge-item .icon{margin-right:5px;filter:opacity(.6)}[data-bs-theme=dark] .integration-page .feature-badges .badge-item .icon{filter:invert(1)}.integration-page .feature-badges .badge-item:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#6366f1,#8b5cf6,#06b6d4);opacity:0;transition:opacity .3s ease}.integration-page .feature-badges .badge-item:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 8px 30px #00000026;border-color:#6366f133}.integration-page .feature-badges .badge-item:hover:before{opacity:1}.integration-page .feature-badges .badge-item:nth-child(1){animation:heroFadeInUp 1s ease-out 1s both,badgeFloat 4s ease-in-out 2s infinite}.integration-page .feature-badges .badge-item:nth-child(1) i{color:#10b981;margin-right:.75rem;font-size:1.2rem}.integration-page .feature-badges .badge-item:nth-child(2){animation:heroFadeInUp 1s ease-out 1.2s both,badgeFloat 4s ease-in-out 2.5s infinite}.integration-page .feature-badges .badge-item:nth-child(2) i{color:#f59e0b;margin-right:.75rem;font-size:1.2rem}.integration-page .feature-badges .badge-item:nth-child(3){animation:heroFadeInUp 1s ease-out 1.4s both,badgeFloat 4s ease-in-out 3s infinite}.integration-page .feature-badges .badge-item:nth-child(3) i{color:#6366f1;margin-right:.75rem;font-size:1.2rem}.integration-page .feature-item{display:flex;gap:1rem;padding:1.5rem;background:var(--integration-card-bg);border:1px solid var(--integration-card-border);border-radius:12px;transition:all .3s ease;height:100%}.integration-page .feature-item:hover{border-color:var(--integration-card-hover-border);transform:translateY(-2px);box-shadow:0 4px 12px #00000014}.integration-page .feature-item .feature-icon{flex:0 0 48px;height:48px;background:linear-gradient(135deg,#6366f1,#8b5cf6);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.25rem;box-shadow:0 2px 8px #6366f140}.integration-page .feature-item .feature-content{flex:1}.integration-page .feature-item .feature-content h5{color:var(--integration-text-primary);margin-bottom:.5rem;font-weight:600;font-size:1.1rem}.integration-page .feature-item .feature-content p{color:var(--integration-text-muted);margin:0;line-height:1.5;font-size:.9rem}.integration-page .sticky-sidebar{position:sticky;top:2rem;align-self:flex-start}.integration-page .sticky-sidebar .card{margin-bottom:1.5rem}.integration-page .sticky-sidebar .card:last-child{margin-bottom:0}.integration-page .step-container{position:relative}.integration-page .step-container .step-item{display:flex;margin-bottom:3rem;position:relative}.integration-page .step-container .step-item:not(:last-child):after{content:"";position:absolute;left:24px;top:60px;bottom:-48px;width:1px;background:var(--integration-step-line)}.integration-page .step-container .step-item .step-number{flex:0 0 48px;height:48px;background:var(--integration-step-bg);color:var(--integration-text-secondary);border:2px solid var(--integration-step-border);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1.1rem;margin-right:1.5rem;z-index:2;position:relative;box-shadow:0 2px 4px #0000000d}.integration-page .step-container .step-item .step-content{flex:1}.integration-page .step-container .step-item .step-content h5{color:var(--integration-text-primary);margin-bottom:.75rem;font-weight:600;font-size:1.1rem}.integration-page .step-container .step-item .step-content p{color:var(--integration-text-muted);line-height:1.6;margin-bottom:1rem}.integration-page .step-container .step-item:nth-child(1){animation-delay:.1s}.integration-page .step-container .step-item:nth-child(2){animation-delay:.2s}.integration-page .step-container .step-item:nth-child(3){animation-delay:.3s}.integration-page .step-container .step-item:nth-child(4){animation-delay:.4s}.integration-page .code-block{background:var(--integration-code-bg);border:1px solid var(--integration-code-border);border-radius:8px;padding:1rem;font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,monospace;margin:1rem 0;font-size:.875rem;color:var(--integration-text-secondary)}.integration-page .card{border-radius:16px}.integration-page .card .card-header{border-top-left-radius:16px;border-top-right-radius:16px;padding:1.5rem}.integration-page .card .card-body{padding:2rem}.integration-page .btn{font-weight:500;border-radius:8px;padding:.75rem 1.5rem;border:none;transition:all .2s ease;text-decoration:none;display:inline-flex;align-items:center;font-size:.9rem}.integration-page .btn.btn-lg{padding:1rem 2rem;font-size:1rem}.integration-page .btn.btn-warning{background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;box-shadow:0 4px 14px #6366f140;border:none}.integration-page .btn.btn-warning:hover{background:linear-gradient(135deg,#5b58f0,#8751f5);transform:translateY(-2px);box-shadow:0 8px 25px #6366f159;color:#fff}.integration-page .btn.btn-outline-light{background:#fffc;color:var(--integration-text-secondary);border:1px solid rgba(99,102,241,.2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.integration-page .btn.btn-outline-light:hover{background:#fffffff2;border-color:#6366f166;color:var(--integration-text-primary);transform:translateY(-2px);box-shadow:0 4px 15px #0000001a}.integration-page .btn.btn-outline-primary{background:transparent;color:var(--integration-text-primary);border:1px solid var(--integration-card-border)}.integration-page .btn.btn-outline-primary:hover{background:var(--integration-text-primary);color:#fff;border-color:var(--integration-text-primary)}.integration-page .btn.btn-secondary{box-shadow:0 1px 3px #0000001a}.integration-page .btn.btn-secondary:hover{transform:translateY(-1px);box-shadow:0 4px 12px #00000026}.integration-page .accordion-item{border:1px solid var(--integration-card-border);border-radius:12px;margin-bottom:.5rem;overflow:hidden}.integration-page .accordion-item .accordion-button{width:100%;background:var(--integration-card-bg);border:none;padding:1.25rem 1.5rem;font-weight:500;color:var(--integration-text-primary)}.integration-page .accordion-item .accordion-button:not(.collapsed){background:var(--integration-code-bg);color:var(--integration-text-primary);box-shadow:none}.integration-page .accordion-item .accordion-button:focus{box-shadow:none;border-color:transparent}.integration-page .accordion-item .accordion-body{padding:1.5rem;background:var(--integration-card-bg)}.integration-page .accordion-item .accordion-body ul{margin:0;padding-left:1.5rem}.integration-page .accordion-item .accordion-body li{margin-bottom:.5rem;color:var(--integration-text-muted);line-height:1.6}.integration-page .card-code .card{background:var(--integration-code-bg)}.integration-page .card-code .card pre{border-radius:12px;margin:0;max-height:400px;overflow-y:auto}.integration-page .card-code .card code{font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,monospace!important;font-size:.875rem;line-height:1.7}.integration-page .card-code .card-title{font-size:.875rem;font-weight:500;color:var(--integration-text-muted)}.integration-page .card-code .card-body{padding:1.5rem}.integration-page code{background:var(--integration-code-bg);color:var(--integration-text-primary);border-radius:4px;font-size:.875rem;font-family:SF Mono,Monaco,Cascadia Code,Roboto Mono,monospace}.integration-page p code,.integration-page li code,.integration-page .alert-warning code{padding:.25rem .5rem}.integration-page .display-4{font-size:2.5rem;font-weight:700;line-height:1.2}.integration-page .lead{font-size:1.125rem;line-height:1.6}@keyframes badgeFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@media (max-width: 768px){.integration-page .hero-section{padding:2rem 0}.integration-page .hero-section:after{display:none}.integration-page .feature-badges{margin-top:2rem}.integration-page .step-container .step-item .step-number{flex:0 0 40px;height:40px;font-size:1rem;margin-right:1.5rem}.integration-page .step-container .step-item:not(:last-child):after{left:20px;top:50px}.integration-page .card-body{padding:1.5rem}}.plugin-card{background:var(--integration-card-bg);border:1px solid var(--integration-card-border);border-radius:12px;padding:1.5rem;transition:all .3s ease;height:100%;display:flex;flex-direction:column}.plugin-card:hover{border-color:var(--integration-card-hover-border);transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.plugin-card h6{color:var(--integration-text-primary);margin-bottom:.75rem;font-weight:600;font-size:1.1rem}.plugin-card p{color:var(--integration-text-muted);margin-bottom:1rem;font-size:.875rem;line-height:1.5;flex-grow:1}.plugin-card .btn{margin-top:auto}.config-checklist{list-style:none;padding-left:0;counter-reset:step-counter}.config-checklist li{counter-increment:step-counter;position:relative;padding-left:2rem;margin-bottom:.75rem;color:var(--integration-text-secondary)}.config-checklist li:before{content:counter(step-counter);position:absolute;left:0;top:0;width:1.5rem;height:1.5rem;background:var(--integration-step-bg);color:var(--integration-text-primary);border:2px solid var(--integration-step-border);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600}.info-list{display:flex;flex-direction:column;gap:1rem}.info-list .info-item{padding:.5rem 0;border-bottom:1px solid var(--integration-card-border);color:var(--integration-text-secondary)}.info-list .info-item:last-child{border-bottom:none}.info-list .info-item strong{color:var(--integration-text-primary)}html[data-bs-theme=dark] .integration-page{--integration-hero-bg: linear-gradient(135deg, #111827 0%, #1f2937 50%, #0f172a 100%);--integration-hero-border: #374151;--integration-text-primary: #f8fafc;--integration-text-secondary: #e2e8f0;--integration-text-muted: #94a3b8;--integration-card-bg: #1e293b;--integration-card-border: #334155;--integration-card-hover-border: #475569;--integration-badge-bg: rgba(30, 41, 59, .9);--integration-badge-border: rgba(51, 65, 85, .8);--integration-code-bg: #0f172a;--integration-code-border: #1e293b;--integration-step-line: #374151;--integration-step-bg: #1e293b;--integration-step-border: #374151}html[data-bs-theme=dark] .integration-page .btn-outline-primary{background:transparent;color:#7640ff;border-color:#7640ff}html[data-bs-theme=dark] .integration-page .btn-outline-primary:hover{background:#7640ff;color:#fff;border-color:#7640ff}html[data-bs-theme=dark] .integration-page .btn-outline-primary:focus,html[data-bs-theme=dark] .integration-page .btn-outline-primary:active{background:#7640ff;border-color:#7640ff;box-shadow:0 0 0 .2rem #6366f180;color:#fff}html[data-bs-theme=dark] .integration-page .btn-secondary:focus,html[data-bs-theme=dark] .integration-page .btn-secondary:active{box-shadow:0 0 0 .2rem #6366f180}html[data-bs-theme=dark] .integration-page .hero-section:before{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='%236366f1' fill-opacity='0.08'%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") repeat}html[data-bs-theme=dark] .integration-page .hero-section:after{background:radial-gradient(circle,rgba(99,102,241,.2) 0%,transparent 70%)}html[data-bs-theme=dark] .integration-page .btn-outline-light{background:#1e293bcc;color:var(--integration-text-secondary);border:1px solid rgba(99,102,241,.3)}html[data-bs-theme=dark] .integration-page .btn-outline-light:hover{background:#1e293bf2;border-color:#6366f180;color:var(--integration-text-primary)}html[data-bs-theme=dark] .integration-page .plugin-card:hover{box-shadow:0 4px 12px #0000004d}html[data-bs-theme=dark] .reward-type-card,html[data-bs-theme=dark] .customization-card,html[data-bs-theme=dark] .game-compatibility-card{padding:1rem;border:1px solid var(--bs-border-color);border-radius:.5rem;height:100%;transition:transform .2s ease}html[data-bs-theme=dark] .reward-type-card:hover,html[data-bs-theme=dark] .customization-card:hover,html[data-bs-theme=dark] .game-compatibility-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}