:root{--ink:#0b1020;--surface:#10182c;--surface-2:#151f37;--line:rgba(255,255,255,.1);--muted:#9ca8bd;--cream:#f8f7ee;--lime:#00f2fe;--lime-deep:#00c9ff;--blue:#00c9ff;--font:'Inter',sans-serif;--display:'Space Grotesk',sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--cream);font-family:var(--font);font-size:15px;line-height:1.6}.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}.site-header{height:86px;max-width:1240px;margin:auto;padding:0 28px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:5}.brand{font-family:var(--display);font-size:19px;font-weight:700;color:var(--cream);text-decoration:none;letter-spacing:-1px;display:flex;align-items:center;gap:9px}.brand>span:last-child>span{color:var(--lime);font-weight:500}.brand-mark{background:var(--lime);color:var(--ink);width:28px;height:28px;display:grid;place-items:center;font-size:17px;clip-path:polygon(18% 0,100% 0,100% 82%,82% 100%,0 100%,0 18%)}.nav-links{display:flex;align-items:center;gap:28px}.nav-links>a,.back-link{color:#c3cada;text-decoration:none;font-size:13px;font-weight:600;transition:color .2s}.nav-links>a:hover,.back-link:hover{color:var(--lime)}.nav-discord{background:var(--lime);color:var(--ink)!important;padding:10px 16px;clip-path:polygon(6% 0,100% 0,100% 76%,94% 100%,0 100%,0 23%)}.nav-discord span{font-size:16px;margin-left:4px}.nav-toggle{display:none;background:none;border:0}.hero{min-height:600px;max-width:1240px;margin:0 auto;padding:80px 28px 75px;position:relative;overflow:hidden;display:grid;grid-template-columns:1fr 1fr;align-items:center}.hero-grid{position:absolute;right:-40px;top:0;width:57%;height:100%;background-image:linear-gradient(rgba(0,242,254,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(0,242,254,.07) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(to right,transparent,black 25%,black 70%,transparent)}.eyebrow{color:var(--lime);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1.8px;margin:0 0 16px}.eyebrow i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 4px rgba(0,242,254,.12);margin-right:9px}.hero-copy{position:relative;z-index:1}.hero h1,.section-intro h2,.plans-heading h2,.panels h2,.cta h2,.payment-intro h1{font-family:var(--display);font-size:clamp(44px,5.5vw,76px);letter-spacing:-4px;line-height:.98;margin:0 0 22px}.hero h1 em,.payment-intro em{font-style:normal;color:var(--lime)}.hero-text{max-width:510px;color:var(--muted);font-size:17px;margin-bottom:30px}.hero-text strong{color:var(--cream)}.hero-actions{display:flex;align-items:center;gap:13px}.button{font-size:13px;font-weight:800;text-decoration:none;padding:13px 20px;display:inline-block;transition:transform .2s}.button:hover{transform:translateY(-3px)}.button-primary{background:var(--lime);color:var(--ink);clip-path:polygon(5% 0,100% 0,100% 80%,95% 100%,0 100%,0 20%)}.button-primary span,.button-ghost span{font-size:17px;padding-left:8px}.button-ghost{color:var(--cream);border:1px solid var(--line);clip-path:polygon(5% 0,100% 0,100% 80%,95% 100%,0 100%,0 20%)}.hero-proof{display:flex;gap:29px;margin-top:47px}.hero-proof div{display:flex;flex-direction:column;gap:1px}.hero-proof div+div{border-left:1px solid var(--line);padding-left:29px}.hero-proof b{font-family:var(--display);font-size:22px;letter-spacing:-1px}.hero-proof span{color:var(--muted);font-size:11px}.hero-art{height:420px;position:relative;z-index:1}.moon{position:absolute;right:9%;top:6%;width:100px;height:100px;border-radius:50%;background:var(--lime);box-shadow:0 0 80px rgba(0,242,254,.25)}.cloud{position:absolute;background:rgba(255,255,255,.1);height:9px}.cloud:before,.cloud:after{content:'';position:absolute;background:inherit}.cloud:before{width:20px;height:20px;left:13px;top:-11px}.cloud:after{width:14px;height:14px;left:33px;top:-6px}.cloud-one{right:17%;top:37%;width:67px}.cloud-two{left:8%;top:22%;width:48px;opacity:.55}.server-cube{position:absolute;width:200px;height:190px;right:22%;top:33%;filter:drop-shadow(16px 24px 20px rgba(0,0,0,.36))}.cube-front{position:absolute;width:140px;height:140px;left:0;bottom:0;background:#1a3a52;border:9px solid #102738;display:grid;grid-template-columns:repeat(2,1fr);gap:10px;padding:25px}.cube-front span{background:var(--lime);box-shadow:inset 0 0 0 3px #00c9ff}.cube-side{position:absolute;left:140px;bottom:0;width:60px;height:140px;background:#0e2030;clip-path:polygon(0 0,100% 20%,100% 100%,0 100%)}.cube-top{position:absolute;left:0;top:0;width:140px;height:50px;background:#244c69;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.floating-block{position:absolute;width:25px;height:25px;background:#164e63;box-shadow:inset 0 0 0 5px #083344}.block-one{top:63%;left:8%;transform:rotate(18deg)}.block-two{right:7%;bottom:5%;transform:rotate(32deg);background:#16324a}.block-three{top:15%;right:30%;width:16px;height:16px;transform:rotate(22deg)}.art-label{font-family:var(--display);font-weight:700;letter-spacing:1px;line-height:1;position:absolute;left:7%;bottom:8%;color:#78849a;font-size:12px}.art-label span{color:var(--lime);font-size:19px}.trust-bar{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;justify-content:center;align-items:center;gap:32px;min-height:65px;padding:10px 28px;color:var(--muted);font-size:12px}.trust-bar p{margin:0}.trust-bar>div{height:14px;width:1px;background:var(--line)}.status-dot{display:inline-block;background:var(--lime);width:7px;height:7px;border-radius:50%;margin-right:7px;box-shadow:0 0 8px var(--lime)}.section-wrap{max-width:1240px;margin:0 auto;padding:110px 28px}.section-intro h2,.plans-heading h2,.panels h2,.cta h2{font-size:clamp(34px,4vw,52px);margin-bottom:0}.features{display:grid;grid-template-columns:.8fr 1.3fr;gap:80px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.feature-card{background:var(--surface);padding:28px 23px;border:1px solid var(--line);position:relative;overflow:hidden}.feature-card:after{content:'';height:3px;width:45px;position:absolute;bottom:0;left:0;background:var(--lime)}.feature-icon{color:var(--lime);font-size:30px;height:43px}.feature-card h3{font-family:var(--display);font-size:18px;margin:10px 0 8px}.feature-card p{color:var(--muted);font-size:13px;margin:0}.plans{padding-top:65px}.plans-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:38px}.plans-heading>div>p:not(.eyebrow){margin:9px 0 0;color:var(--muted)}.plan-tabs{display:flex;gap:3px;background:var(--surface);padding:4px;border:1px solid var(--line)}.tab{font-family:var(--font);font-size:12px;font-weight:700;padding:10px 15px;border:0;color:var(--muted);background:transparent;cursor:pointer}.tab.active{background:var(--lime);color:var(--ink)}.plan-set{display:none}.plan-set.active{display:block}.plans-note{display:flex;align-items:center;gap:11px;color:var(--muted);font-size:13px;margin-bottom:14px}.chip{font-size:10px;letter-spacing:1px;font-weight:800;color:var(--lime);border:1px solid rgba(0,242,254,.45);padding:3px 7px}.chip-blue{color:var(--blue);border-color:rgba(140,204,240,.45)}.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:13px}.plan-card{background:var(--surface);border:1px solid var(--line);padding:24px;min-height:263px;position:relative;transition:border .2s,transform .2s}.plan-card:hover{border-color:rgba(0,242,254,.7);transform:translateY(-5px)}.plan-card h3{font-family:var(--display);font-size:21px;margin:0 0 2px;letter-spacing:-.8px}.price{font-family:var(--display);font-size:29px;line-height:1.3;margin:0 0 17px;color:var(--lime);letter-spacing:-1px}.price small{font-family:var(--font);color:var(--muted);font-weight:500;letter-spacing:0;font-size:11px}.plan-card ul{list-style:none;margin:0 0 19px;padding:0;border-top:1px solid var(--line);padding-top:14px;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.plan-card li{color:var(--muted);font-size:11px}.plan-card li b{display:block;color:var(--cream);font-size:13px}.plan-card>a{color:var(--cream);font-size:12px;font-weight:700;text-decoration:none}.plan-card>a span{color:var(--lime);font-size:16px;margin-left:5px}.featured{border-color:rgba(0,242,254,.75);background:linear-gradient(135deg,#0e2636,#111a2e)}.popular{position:absolute;right:12px;top:12px;background:var(--lime);color:var(--ink);padding:3px 7px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.8px}.ultimate{background:linear-gradient(135deg,#13283c,#14192e)}.panels{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}.panels-copy>p:not(.eyebrow){color:var(--muted);max-width:440px;margin:18px 0 28px}.text-link{color:var(--lime);font-weight:800;font-size:13px;text-decoration:none}.text-link span{font-size:18px;padding-left:5px}.panel-list{display:grid;gap:12px}.panel-row{color:var(--cream);text-decoration:none;border:1px solid var(--line);background:var(--surface);padding:19px;display:flex;align-items:center;gap:16px;transition:transform .2s,border .2s}.panel-row:hover{transform:translateX(6px);border-color:rgba(0,242,254,.6)}.panel-icon{width:42px;height:42px;display:grid;place-items:center;background:var(--lime);color:var(--ink);font-family:var(--display);font-weight:700}.panel-icon.paid{background:var(--blue)}.panel-row span{font-size:11px;color:var(--muted)}.panel-row h3{font-family:var(--display);margin:0;font-size:18px}.panel-row>b{margin-left:auto;font-size:12px}.panel-row>b span{color:var(--lime);font-size:15px}.cta{margin-bottom:90px;background:linear-gradient(110deg,#122a36,#15243c);padding:55px 60px;display:flex;align-items:center;justify-content:space-between;position:relative;overflow:hidden}.cta:before{content:'';position:absolute;width:300px;height:300px;border:60px solid rgba(0,242,254,.06);right:-100px;top:-150px;transform:rotate(30deg)}.cta h2{font-size:42px}.cta p:not(.eyebrow){color:var(--muted);margin:10px 0 0}.cta .button{position:relative;z-index:1}footer{border-top:1px solid var(--line);max-width:1240px;margin:auto;padding:28px;display:grid;grid-template-columns:auto 1fr auto;gap:28px;align-items:center;color:var(--muted)}footer p,footer small{font-size:11px;margin:0}footer>div{display:flex;gap:18px}footer>div a{font-size:11px;color:var(--muted);text-decoration:none}.payment-page{min-height:100vh;background:radial-gradient(circle at 80% 30%,#133342,transparent 30%),var(--ink)}.back-link{font-weight:700}.payment-main{max-width:1110px;margin:40px auto 95px;padding:0 28px}.payment-card{min-height:590px;background:var(--surface);border:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;overflow:hidden}.payment-intro{padding:65px 60px}.payment-intro h1{font-size:56px}.payment-intro>p:not(.eyebrow){color:var(--muted);max-width:430px;margin-bottom:35px}.payment-steps{display:grid;gap:14px;margin-bottom:32px}.payment-steps div{display:flex;align-items:center;gap:12px}.payment-steps span{font-family:var(--display);font-size:12px;color:var(--lime);border:1px solid rgba(0,242,254,.35);width:29px;height:29px;display:grid;place-items:center}.payment-steps p{margin:0;font-size:12px;color:#d1d7e1}.qr-area{background:#0d1729;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden}.qr-glow{position:absolute;width:430px;height:430px;background:var(--lime);border-radius:50%;filter:blur(130px);opacity:.13}.qr-card{position:relative;background:#f6f7ef;padding:19px;width:315px;text-align:center;box-shadow:20px 20px 0 rgba(0,242,254,.12)}.scan-label{font-size:10px;letter-spacing:2px;color:#35425c;font-weight:800}.qr-card img{display:block;width:245px;height:245px;margin:8px auto 10px}.upi-id{background:#e8eadf;padding:9px}.upi-id span{display:block;color:#657087;font-size:9px;font-weight:800;letter-spacing:1px}.upi-id strong{font-family:var(--display);color:#111c31;font-size:16px}.qr-note{position:relative;color:var(--muted);font-size:11px;margin-top:25px}.payment-page footer{margin-top:auto}.payment-page footer small{justify-self:end}@media(max-width:900px){.features,.panels{gap:45px}.payment-intro{padding:52px 35px}.payment-intro h1{font-size:47px}}@media(max-width:720px){.site-header{height:70px;padding:0 20px}.nav-toggle{display:block;width:30px;padding:0}.nav-toggle span{height:2px;background:var(--cream);display:block;margin:5px}.nav-links{display:none;position:absolute;top:70px;left:15px;right:15px;background:#152039;border:1px solid var(--line);padding:18px;flex-direction:column;align-items:stretch;gap:14px}.nav-links.open{display:flex}.nav-links a{padding:4px 6px}.nav-discord{text-align:center}.hero{grid-template-columns:1fr;padding:58px 24px 50px;min-height:auto}.hero-art{height:290px;max-width:420px;margin:auto;width:100%}.hero h1{font-size:51px;letter-spacing:-3px}.hero-proof{margin-top:34px;gap:16px}.hero-proof div+div{padding-left:16px}.trust-bar{justify-content:flex-start;gap:15px;overflow:hidden;white-space:nowrap}.section-wrap{padding:72px 24px}.features,.panels{grid-template-columns:1fr;gap:35px}.feature-grid{grid-template-columns:1fr}.plans-heading{align-items:flex-start;flex-direction:column;gap:22px}.plan-grid{grid-template-columns:1fr}.plan-card{min-height:230px}.cta{margin:0 24px 65px;padding:40px 28px;display:block}.cta .button{margin-top:25px}.cta h2{font-size:37px}footer{margin:0 20px;padding:25px 0;grid-template-columns:1fr;gap:16px}footer>div{order:-1}.payment-main{padding:0 18px;margin:20px auto 60px}.payment-card{grid-template-columns:1fr}.payment-intro{padding:43px 27px}.payment-intro h1{font-size:44px}.qr-area{min-height:460px;padding:45px 10px}.payment-page footer{display:flex;justify-content:space-between}.payment-page footer small{justify-self:auto}.back-link{font-size:12px}} .trust-status{color:var(--muted);text-decoration:none;transition:color .15s ease;display:inline-flex;align-items:center}.trust-status:hover{color:var(--lime)}.site-offer{background:linear-gradient(90deg,#0f2430 0%,#152438 50%,#0f2430 100%);border-bottom:1px solid rgba(0,242,254,.3);padding:10px 24px;font-size:13px;color:#f8f7ee;position:relative;z-index:10}.site-offer[hidden]{display:none!important}.site-offer-inner{max-width:1240px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;text-align:center}.site-offer-inner>div{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.site-offer-inner strong{color:var(--lime);font-family:var(--display);font-weight:700;letter-spacing:-.3px}.site-offer-inner code{background:rgba(0,242,254,.15);color:var(--lime);border:1px dashed rgba(0,242,254,.5);padding:2px 8px;font-family:monospace;font-size:12px;font-weight:700;border-radius:4px;letter-spacing:.5px}.site-offer-link{background:var(--lime);color:var(--ink);padding:4px 12px;font-size:11px;font-weight:800;text-decoration:none;border-radius:3px;transition:transform .15s ease,background .15s ease;white-space:nowrap}.site-offer-link:hover{transform:scale(1.04);background:#38dbff}

/* Discord Live Chat & Community Section */
.discord-section { margin-top: 60px; margin-bottom: 60px; }
.discord-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 28px; align-items: start; margin-top: 32px; }
@media (max-width: 960px) { .discord-grid { grid-template-columns: 1fr; } }

.discord-chat-container { background: #1e1f22; border: 1px solid rgba(0, 201, 255, 0.25); border-radius: 16px; overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,0.4); display: flex; flex-direction: column; height: 540px; }
.discord-chat-header { background: #2b2d31; padding: 14px 20px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #1e1f22; }
.discord-chat-title { display: flex; align-items: center; gap: 10px; font: 700 15px 'Space Grotesk', sans-serif; color: #f2f3f5; }
.discord-chat-title i { width: 10px; height: 10px; background: #23a55a; border-radius: 50%; display: inline-block; box-shadow: 0 0 8px #23a55a; }
.discord-chat-badge { background: rgba(0, 201, 255, 0.15); color: #00c9ff; font-size: 11px; font-weight: 800; padding: 3px 10px; border-radius: 12px; border: 1px solid rgba(0,201,255,0.3); }

.discord-chat-body { display: grid; grid-template-columns: 200px 1fr; height: 480px; overflow: hidden; background: #313338; }
@media (max-width: 640px) { .discord-chat-body { grid-template-columns: 1fr; } .discord-channels-sidebar { display: none; } }

.discord-channels-sidebar { background: #2b2d31; padding: 16px 12px; border-right: 1px solid #1e1f22; display: flex; flex-direction: column; gap: 14px; overflow-y: auto; }
.discord-category { font-size: 10px; font-weight: 800; text-transform: uppercase; color: #949ba4; letter-spacing: 0.5px; margin-bottom: 4px; padding-left: 6px; }
.discord-channel-item { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 6px; color: #949ba4; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.15s ease; text-decoration: none; border: 0; background: none; width: 100%; text-align: left; }
.discord-channel-item:hover { background: rgba(255,255,255,0.07); color: #f2f3f5; }
.discord-channel-item.active { color: #00c9ff; background: rgba(0, 201, 255, 0.12); }

.discord-messages-feed { display: flex; flex-direction: column; justify-content: space-between; background: #313338; height: 100%; position: relative; }
.discord-feed-scroll { padding: 18px; overflow-y: auto; display: flex; flex-direction: column; gap: 16px; height: 410px; }
.discord-msg { display: flex; gap: 12px; align-items: flex-start; }
.discord-avatar { width: 36px; height: 36px; border-radius: 50%; background: #5865f2; color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; box-shadow: 0 2px 8px rgba(0,0,0,0.2); }
.discord-msg-content { display: flex; flex-direction: column; gap: 3px; }
.discord-msg-author { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: #f2f3f5; }
.discord-msg-author .bot-tag { background: #5865f2; color: #fff; font-size: 9px; padding: 1px 5px; border-radius: 3px; text-transform: uppercase; font-weight: 800; }
.discord-msg-author .owner-tag { background: #00c9ff; color: #090d16; font-size: 9px; padding: 1px 5px; border-radius: 3px; text-transform: uppercase; font-weight: 800; }
.discord-msg-time { font-size: 10px; color: #949ba4; font-weight: 400; }
.discord-msg-text { font-size: 13px; color: #dbdee1; line-height: 1.4; }

.discord-chat-input-wrap { padding: 12px 16px; background: #313338; border-top: 1px solid rgba(255,255,255,0.05); display: flex; gap: 10px; }
.discord-chat-input-wrap input { flex: 1; background: #383a40; border: 0; padding: 10px 14px; border-radius: 8px; color: #f2f3f5; font: 13px Inter, sans-serif; outline: none; }
.discord-chat-input-wrap input:focus { box-shadow: 0 0 0 2px #00c9ff; }
.discord-chat-input-wrap button { background: #00c9ff; color: #090d16; border: 0; padding: 0 16px; font: 700 13px 'Space Grotesk', sans-serif; border-radius: 8px; cursor: pointer; transition: all 0.2s ease; }
.discord-chat-input-wrap button:hover { background: #38dbff; transform: translateY(-1px); }

.discord-community-hub { display: flex; flex-direction: column; gap: 16px; }
.discord-widget-card { background: #1e1f22; border: 1px solid rgba(0, 201, 255, 0.25); border-radius: 16px; overflow: hidden; box-shadow: 0 10px 30px rgba(0,0,0,0.3); }
.discord-widget-header { background: #5865f2; padding: 18px 20px; color: #fff; display: flex; justify-content: space-between; align-items: center; }
.discord-widget-header h3 { font: 800 18px 'Space Grotesk', sans-serif; margin: 0; display: flex; align-items: center; gap: 10px; color: #fff; }
.discord-widget-header span { font-size: 11px; font-weight: 700; background: rgba(255,255,255,0.25); padding: 4px 10px; border-radius: 20px; }

.discord-widget-channels { padding: 16px; background: #2b2d31; display: flex; flex-direction: column; gap: 8px; }
.discord-widget-ch { display: flex; align-items: center; justify-content: space-between; padding: 9px 12px; background: #313338; border-radius: 8px; font-size: 13px; font-weight: 700; color: #dbdee1; border: 1px solid rgba(255,255,255,0.03); }
.discord-widget-ch span { color: #00c9ff; font-family: monospace; font-size: 11px; }

.discord-widget-footer { padding: 16px 20px; background: #1e1f22; display: flex; justify-content: space-between; align-items: center; border-top: 1px solid rgba(255,255,255,0.05); }
.discord-widget-footer p { margin: 0; font-size: 12px; color: #949ba4; }
.discord-widget-footer a { background: #5865f2; color: #fff; text-decoration: none; padding: 9px 18px; font: 700 13px 'Space Grotesk', sans-serif; border-radius: 8px; transition: all 0.2s ease; }
.discord-widget-footer a:hover { background: #4752c4; transform: translateY(-1px); }

.social-card-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.social-item-card { background: #181c26; border: 1px solid rgba(255,255,255,0.08); padding: 14px 16px; border-radius: 12px; display: flex; justify-content: space-between; align-items: center; text-decoration: none; transition: all 0.2s ease; }
.social-item-card:hover { border-color: #00c9ff; transform: translateY(-2px); background: #1e2433; }
.social-item-info { display: flex; flex-direction: column; }
.social-item-info strong { font: 700 14px 'Space Grotesk', sans-serif; color: #fff; }
.social-item-info small { color: #64748b; font-size: 11px; }
.social-item-icon { font-size: 18px; color: #00c9ff; }

/* Real-Time Embed Switcher */
.discord-mode-switch { display: flex; gap: 4px; background: rgba(0,0,0,0.3); padding: 3px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.08); }
.mode-btn { background: transparent; border: 0; color: #949ba4; font: 700 11px 'Space Grotesk', sans-serif; padding: 5px 11px; border-radius: 6px; cursor: pointer; transition: all 0.2s ease; }
.mode-btn:hover { color: #fff; }
.mode-btn.active { background: #00c9ff; color: #090d16; }

.discord-embed-view { width: 100%; height: 480px; }
.discord-embed-view[hidden] { display: none !important; }
.discord-embed-view iframe { width: 100%; height: 100%; border: 0; display: block; }

/* Real-Time Discord Live Feed */
.live-discord-box { background: #1e1f22; border: 1px solid rgba(0, 201, 255, 0.25); border-radius: 16px; overflow: hidden; box-shadow: 0 12px 40px rgba(0,0,0,0.4); display: flex; flex-direction: column; height: 520px; max-width: 900px; margin: 40px auto; }
.live-discord-header { background: #2b2d31; padding: 14px 20px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #1e1f22; }
.live-discord-title { display: flex; align-items: center; gap: 10px; font: 700 15px 'Space Grotesk', sans-serif; color: #f2f3f5; }
.live-discord-title i { width: 10px; height: 10px; background: #23a55a; border-radius: 50%; display: inline-block; box-shadow: 0 0 8px #23a55a; }
.live-discord-badge { background: rgba(0, 201, 255, 0.15); color: #00c9ff; font-size: 11px; font-weight: 800; padding: 3px 10px; border-radius: 12px; border: 1px solid rgba(0,201,255,0.3); }

.live-discord-feed { padding: 20px; overflow-y: auto; display: flex; flex-direction: column; gap: 16px; flex: 1; background: #313338; }
.live-msg { display: flex; gap: 12px; align-items: flex-start; animation: fadeInMsg 0.3s ease; }
@keyframes fadeInMsg { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

.live-msg-avatar { width: 36px; height: 36px; border-radius: 50%; background: #5865f2; color: #fff; font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 13px; flex-shrink: 0; }
.live-msg-content { display: flex; flex-direction: column; gap: 3px; }
.live-msg-author { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: #f2f3f5; }
.live-msg-author .bot-tag { background: #5865f2; color: #fff; font-size: 9px; padding: 1px 5px; border-radius: 3px; text-transform: uppercase; font-weight: 800; }
.live-msg-author .owner-tag { background: #00c9ff; color: #090d16; font-size: 9px; padding: 1px 5px; border-radius: 3px; text-transform: uppercase; font-weight: 800; }
.live-msg-time { font-size: 10px; color: #949ba4; font-weight: 400; }
.live-msg-text { font-size: 13px; color: #dbdee1; line-height: 1.4; word-break: break-word; }

.live-discord-input { padding: 12px 16px; background: #313338; border-top: 1px solid rgba(255,255,255,0.05); display: flex; gap: 10px; }
.live-discord-input input { flex: 1; background: #383a40; border: 0; padding: 10px 14px; border-radius: 8px; color: #f2f3f5; font: 13px Inter, sans-serif; outline: none; }
.live-discord-input input:focus { box-shadow: 0 0 0 2px #00c9ff; }
.live-discord-input button { background: #00c9ff; color: #090d16; border: 0; padding: 0 18px; font: 700 13px 'Space Grotesk', sans-serif; border-radius: 8px; cursor: pointer; transition: all 0.2s ease; }
.live-discord-input button:hover { background: #38dbff; transform: translateY(-1px); }

.social-item-card { background: #1e1f22; border: 1px solid rgba(0, 201, 255, 0.2); border-radius: 12px; padding: 14px; display: flex; align-items: center; justify-content: space-between; text-decoration: none; transition: all 0.2s ease; }
.social-item-card:hover { background: #2b2d31; border-color: #00c9ff; transform: translateY(-2px); }
.social-item-info { display: flex; flex-direction: column; gap: 2px; }
.social-item-info strong { color: #f2f3f5; font-size: 13px; font-weight: 700; }
.social-item-info small { color: #949ba4; font-size: 11px; }
.social-item-icon { font-size: 18px; }

/* Custom Social & Server Cards Stack (Matching User Reference Image) */
.social-banner-card {
  display: flex;
  align-items: center;
  gap: 16px;
  background: #0f1117;
  border-radius: 14px;
  padding: 14px 18px;
  text-decoration: none;
  position: relative;
  transition: all 0.25s ease;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
}
.social-banner-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.6);
}

.youtube-card { border: 1.5px solid #ff3b30; }
.youtube-card:hover { border-color: #ff5e54; box-shadow: 0 0 15px rgba(255, 59, 48, 0.4); }

.instagram-card { border: 1.5px solid #e1306c; }
.instagram-card:hover { border-color: #fd1d1d; box-shadow: 0 0 15px rgba(225, 48, 108, 0.4); }

.github-card { border: 1.5px solid #383a40; }
.github-card:hover { border-color: #6e7681; box-shadow: 0 0 15px rgba(110, 118, 129, 0.4); }

.discord-pill-card { border: 1.5px solid #5865f2; }
.discord-pill-card:hover { border-color: #7983f5; box-shadow: 0 0 15px rgba(88, 101, 242, 0.4); }

.status-card { border: 1.5px solid #00c9ff; }
.status-card:hover { border-color: #38dbff; box-shadow: 0 0 15px rgba(0, 201, 255, 0.4); }

.social-icon-wrapper {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #1e1f22;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  flex-shrink: 0;
}
.red-glow { background: rgba(255, 59, 48, 0.15); color: #ff3b30; }
.pink-glow { background: rgba(225, 48, 108, 0.15); color: #e1306c; }
.gray-glow { background: rgba(255, 255, 255, 0.1); color: #dbdee1; }
.blue-glow { background: rgba(88, 101, 242, 0.15); color: #5865f2; }
.cyan-glow { background: rgba(0, 201, 255, 0.15); color: #00c9ff; }

.social-banner-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
}
.social-banner-text strong {
  font: 700 15px 'Space Grotesk', sans-serif;
  color: #ffffff;
}
.social-banner-text span {
  font: 400 12px Inter, sans-serif;
  color: #949ba4;
}

.pill-join-btn {
  background: #5865f2;
  color: #ffffff;
  font: 700 12px 'Space Grotesk', sans-serif;
  padding: 6px 14px;
  border-radius: 8px;
  transition: all 0.2s ease;
}
.discord-pill-card:hover .pill-join-btn {
  background: #4752c4;
}

/* Discord Server Card Widget */
.discord-server-widget-box {
  background: #18191c;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
  display: flex;
  flex-direction: column;
}
.ds-header {
  background: #5865f2;
  padding: 16px 20px;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.ds-brand {
  font: 800 18px 'Space Grotesk', sans-serif;
  display: flex;
  align-items: center;
  gap: 10px;
}
.ds-online {
  font-size: 12px;
  font-weight: 600;
  opacity: 0.9;
}
.ds-channels {
  background: #2b2d31;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ds-channel {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 6px;
  background: transparent;
  color: #dbdee1;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
}
.ds-channel:hover {
  background: rgba(255, 255, 255, 0.05);
}
.ch-icon { font-style: normal; font-size: 14px; }
.ds-footer {
  background: #1e1f22;
  padding: 14px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.ds-footer span {
  font-size: 12px;
  color: #949ba4;
}
.ds-join-btn {
  background: #383a40;
  color: #ffffff;
  text-decoration: none;
  font: 700 12px 'Space Grotesk', sans-serif;
  padding: 8px 16px;
  border-radius: 6px;
  transition: all 0.2s ease;
}
.ds-join-btn:hover {
  background: #4e5058;
}


/* Mobile & Tablet Responsiveness Rules */
@media (max-width: 992px) {
  #discord {
    width: 100% !important;
    position: relative !important;
    left: 0 !important;
    right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 30px 16px !important;
  }

  .discord-section > div[style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }

  .live-discord-box {
    height: 520px !important;
    margin: 20px 0 !important;
  }
}

@media (max-width: 768px) {
  .site-header {
    padding: 0 16px;
    height: 70px;
  }

  .live-discord-box {
    height: 460px !important;
  }

  .live-discord-header {
    padding: 12px 14px;
    flex-wrap: wrap;
    gap: 8px;
  }

  .live-discord-title {
    font-size: 13px;
  }

  .tool-switcher {
    flex-direction: column;
    width: 100%;
  }

  .tool-tab-btn {
    width: 100%;
    justify-content: center;
  }

  .checker-card, .rgb-card {
    padding: 20px 14px !important;
    margin-bottom: 30px !important;
  }

  .stats-grid {
    grid-template-columns: 1fr !important;
  }

  .rgb-grid {
    grid-template-columns: 1fr !important;
  }
}