:root {
  --space: #6d43f3;
  --space2: #f7f4ff;
  --panel: #ffffff;
  --panel2: #ffffff;
  --line: #e5def8;
  --text: #25145f;
  --muted: #766d98;
  --cyan: #6d43f3;
  --cyan2: #6540df;
  --yellow: #ff9b43;
  --purple: #6d43f3;
  --danger: #e45069;
}

body {
  color: var(--text);
  background: #f7f4ff;
}

.app-shell {
  background:
    radial-gradient(circle at 93% 8%, #ffb35c2e 0 90px, transparent 91px),
    radial-gradient(circle at 76% 92%, #6d43f31c 0 150px, transparent 151px),
    #f7f4ff;
}

.sidebar {
  border-right: 0;
  background: #17151f;
  box-shadow: 8px 0 30px #2f17651a;
}

.brand { color: #fff; }
.brand span { color: #ff9946; }

.sidebar nav a {
  color: #d9d3e9;
  border-radius: 13px;
}

.sidebar nav a:hover {
  color: #fff;
  background: #ffffff15;
}

.sidebar nav a.active {
  color: #fff;
  background: linear-gradient(105deg, #6d43f3, #835cf4);
  box-shadow: 0 10px 24px #6d43f355;
}

.content { color: var(--text); }
.content::before {
  content: '';
  position: absolute;
  width: 130px;
  height: 130px;
  right: 4%;
  top: 22px;
  border-radius: 42% 58% 65% 35%;
  background: linear-gradient(145deg, #ff9b43, #ffca77);
  opacity: .14;
  transform: rotate(18deg);
  pointer-events: none;
}

.playful-bg::after {
  border-color: #6d43f326;
}

.page-head h1 { color: #25145f; }
.eyebrow { color: #6d43f3; }
.text-button { color: #6d43f3; font-weight: 700; }

.button {
  color: #fff;
  background: linear-gradient(105deg, #6d43f3, #835cf4);
  box-shadow: 0 9px 20px #6d43f32c;
}

.button:hover { transform: translateY(-1px); }

.welcome,
.panel,
.stats-grid article,
.advertisement-centre {
  border: 1px solid #e8e1f8;
  color: #25145f;
  background: #fff;
  box-shadow: 0 14px 35px #3d276c12;
}

.welcome {
  overflow: hidden;
  border-left: 0;
  background:
    radial-gradient(circle at 92% 30%, #ffad5b 0 42px, transparent 43px),
    linear-gradient(120deg, #fff, #faf7ff);
}

.welcome::before {
  content: '';
  width: 8px;
  align-self: stretch;
  margin: -27px 22px -27px -27px;
  background: linear-gradient(#6d43f3, #ff9b43);
}

.welcome p,
.points span,
.stats-grid span,
.panel p { color: #766d98; }

.points strong { color: #6d43f3; }

.stats-grid article { position: relative; overflow: hidden; }
.stats-grid article::after {
  content: '';
  position: absolute;
  width: 54px;
  height: 54px;
  right: -14px;
  bottom: -18px;
  border-radius: 50%;
  background: #6d43f315;
}
.stats-grid article:nth-child(1) { border-top: 4px solid #6d43f3; }
.stats-grid article:nth-child(2) { border-top: 4px solid #26b9ad; }
.stats-grid article:nth-child(3) { border-top: 4px solid #ff9b43; }

.tabs {
  border-color: #e2daf7;
  background: #f6f2ff;
}

.tab { color: #554879; }
.tab b { color: #8e7cc0; }
.tab.active {
  color: #fff;
  background: linear-gradient(105deg, #6d43f3, #835cf4);
}

.tab-pane h2 { color: #5b37d3; }
.table-wrap { border-color: #e4ddf4; background: #fff; }
th {
  color: #554879;
  background: #f4efff;
}
th, td { border-bottom-color: #ebe5f7; }
tbody tr:hover { background: #faf7ff; }
.url { color: #6d43f3; }
.badge.success { color: #087f70; background: #d9f7f0; }
.badge.warning { color: #a45b0a; background: #fff0d7; }
.badge.danger { color: #ae3048; background: #ffe1e7; }
.badge.neutral { color: #655888; background: #eee9f8; }

.notice {
  color: #18766d;
  border-color: #aee7df;
  background: #e7faf6;
}

.info-box {
  color: #5e4883;
  border-color: #e0d4ff;
  background: linear-gradient(110deg, #f0eaff, #fff8ef);
}
.info-box p { color: #766d98; }

.auth-shell {
  background:
    radial-gradient(circle at 15% 18%, #ff9b4340, transparent 23%),
    radial-gradient(circle at 85% 82%, #2ebeb442, transparent 24%),
    #f3efff;
}
.auth-card {
  color: #25145f;
  border: 1px solid #e3daf8;
  background: #fff;
  box-shadow: 0 25px 70px #452a7d24;
}
.auth-card p { color: #766d98; }

input {
  color: #25145f;
  border-color: #ded5f2;
  background: #faf8ff;
}

.landing {
  color: #25145f;
  background:
    radial-gradient(circle at 82% 18%, #ff9b4345, transparent 24%),
    radial-gradient(circle at 75% 73%, #2ebeb435, transparent 22%),
    #f7f4ff;
}
.landing .brand { color: #25145f; }
.landing .brand span { color: #6d43f3; }
.hero span { color: #6d43f3; }
.lead { color: #665b88; }

.side-mission { margin:18px 0 0; color:#ffbe7d; font-size:1.25rem; font-weight:700; line-height:1.25; }
.side-community { margin-top:46px; padding:15px; border:1px solid #ffffff18; border-radius:14px; color:#fff; background:#ffffff09; }
.side-community strong,.side-community small { display:block; }
.side-community small { margin:5px 0 0 17px; color:#aaa4b9; font-size:.7rem; }
.online-dot { display:inline-block; width:9px; height:9px; margin-right:8px; border-radius:50%; background:#38d3b9; box-shadow:0 0 0 5px #38d3b922; }
.community-dashboard { padding-bottom:70px; }
.welcome-launch { position:relative; display:grid; grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr); gap:24px; overflow:hidden; margin:0 0 24px; padding:34px 38px; border:1px solid #d8cdf4; border-radius:26px; background:linear-gradient(125deg,#fff 0 58%,#f2edff 100%); box-shadow:0 22px 55px #43247a18; }
.welcome-copy,.welcome-steps,.welcome-actions { position:relative; z-index:2; }
.welcome-copy h2 { max-width:760px; margin:7px 0 12px; color:#2c176c; font-size:clamp(1.7rem,3vw,2.55rem); line-height:1.08; }
.welcome-copy>p:last-child { max-width:720px; margin:0; color:#746991; font-size:1.03rem; line-height:1.65; }
.welcome-copy strong { color:#10a89b; }
.welcome-steps { display:grid; align-content:center; gap:10px; }
.welcome-steps span { display:grid; grid-template-columns:38px 1fr; align-items:center; gap:11px; padding:11px 14px; border-radius:15px; background:#fff; color:#5f547e; box-shadow:0 8px 24px #4020740d; }
.welcome-steps b { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#eee8ff; color:#7043eb; }
.welcome-steps .complete b { background:#d9f6f1; color:#0da99a; }
.welcome-steps .current { border:1px solid #cdbdf6; box-shadow:0 9px 28px #7043eb24; }
.inline-plus { display:inline-grid; place-items:center; width:25px; height:25px; border-radius:8px; color:#fff!important; background:#14a99f; font-size:1rem; }
.welcome-actions .button.quiet { color:#5833c2; background:#eee8ff; box-shadow:none; }
.welcome-steps small { font-size:.9rem; font-weight:750; }
.welcome-actions { grid-column:1/-1; display:flex; align-items:center; gap:17px; border-top:1px solid #e9e1f7; padding-top:20px; }
.welcome-actions .button { background:linear-gradient(135deg,#6840e9,#8751ef); color:#fff; box-shadow:0 12px 28px #6e43e838; }
.welcome-tour { color:#6540da; font-weight:800; text-decoration:none; }
.welcome-actions form { margin-left:auto; }
.welcome-actions form button { border:0; background:transparent; color:#8b819e; cursor:pointer; }
.welcome-sun { position:absolute; right:-50px; top:-65px; width:220px; height:220px; border-radius:50%; background:#ffdfbd80; }
.welcome-sun i,.welcome-sun b,.welcome-sun span { position:absolute; border-radius:50%; }
.welcome-sun i { inset:42px; border:22px solid #ffc58366; }
.welcome-sun b { width:58px; height:58px; left:-18px; bottom:20px; background:#48cbbc80; }
.welcome-sun span { width:23px; height:23px; left:33px; bottom:8px; background:#ff9147; }
@media(max-width:900px){.welcome-launch{grid-template-columns:1fr;padding:28px}.welcome-actions{flex-wrap:wrap}.welcome-actions form{margin-left:0;width:100%}}
.bundle-discovery{position:relative;display:grid;grid-template-columns:190px minmax(0,1fr) auto;align-items:center;gap:30px;overflow:hidden;margin:0 0 24px;padding:30px 34px;border-radius:26px;color:#fff;background:linear-gradient(125deg,#2b1768,#6940e8 68%,#8b53ef);box-shadow:0 22px 55px #43247a2b}.bundle-discovery h2{margin:6px 0 9px;font-size:clamp(1.55rem,2.5vw,2.25rem);line-height:1.1}.bundle-discovery p{max-width:800px;margin:0;color:#e5ddff;line-height:1.55}.bundle-discovery .eyebrow{color:#ffcb71}.bundle-discovery-art{position:relative;height:135px}.bundle-discovery-art i{position:absolute;display:grid;place-items:center;width:74px;height:74px;border:3px solid #ffffff80;border-radius:20px;color:#fff;background:#ffffff20;font-style:normal;font-weight:900;box-shadow:0 15px 30px #1f0e5133}.bundle-discovery-art i:nth-child(1){left:0;top:30px;transform:rotate(-8deg)}.bundle-discovery-art i:nth-child(2){left:53px;top:4px;z-index:2;background:#3dc7bb55}.bundle-discovery-art i:nth-child(3){left:104px;top:39px;transform:rotate(9deg);background:#ff9b4c55}.bundle-discovery-art span{position:absolute;right:2px;top:0;color:#ffd26e;font-size:1.6rem}.bundle-ready-counts{display:flex;gap:9px;margin-top:17px}.bundle-ready-counts span{padding:7px 11px;border-radius:99px;background:#ffffff18;color:#e6ddff;font-size:.75rem}.bundle-ready-counts b{color:#fff}.bundle-discovery-actions{display:grid;gap:10px;min-width:190px}.bundle-discovery-actions .button{text-align:center;color:#4e2ab5;background:#fff;box-shadow:0 12px 28px #210c553d}.bundle-discovery-actions form button{width:100%;border:0;background:transparent;color:#ddd3fb;cursor:pointer}@media(max-width:1050px){.bundle-discovery{grid-template-columns:150px 1fr}.bundle-discovery-actions{grid-column:1/-1;display:flex}.bundle-discovery-actions form{align-self:center}}@media(max-width:650px){.bundle-discovery{grid-template-columns:1fr;padding:27px}.bundle-discovery-art{display:none}.bundle-ready-counts{flex-wrap:wrap}.bundle-discovery-actions{display:grid}}
.community-dashboard .page-head h1 { font-size:clamp(1.65rem,3vw,2.35rem); }

.community-hero { position:relative; z-index:1; display:grid; grid-template-columns:1.2fr .8fr; align-items:center; min-height:360px; margin-top:28px; padding:46px 52px; overflow:hidden; border-radius:28px; color:#fff; background:linear-gradient(120deg,#5832d3,#7954f5); box-shadow:0 22px 50px #5331b832; }
.community-hero::before { content:''; position:absolute; width:280px; height:280px; right:-50px; top:-90px; border-radius:50%; background:#ffad5a; opacity:.22; }
.hero-copy { position:relative; z-index:2; }
.hero-kicker { color:#ffd19e; font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.community-hero h2 { margin:12px 0 16px; font-size:clamp(2.2rem,4.2vw,4rem); line-height:1.02; }
.community-hero h2 em { color:#ffc172; font-style:normal; }
.community-hero p { max-width:620px; margin:0 0 24px; color:#eee9ff; font-size:1rem; }
.community-hero .button { color:#4d2bc5; background:#fff; box-shadow:none; }

.community-orbit { position:relative; min-height:280px; }
.planet { position:absolute; width:155px; height:155px; left:50%; top:50%; border:9px solid #ffffff28; border-radius:50%; background:linear-gradient(145deg,#2dc2b1,#72e0ce); transform:translate(-50%,-50%); box-shadow:inset -20px -18px 0 #179b9355,0 20px 45px #32188755; }
.planet::before,.planet::after { content:''; position:absolute; border-radius:50%; background:#ffffff38; }
.planet::before { width:55px; height:24px; left:18px; top:36px; transform:rotate(-15deg); }
.planet::after { width:38px; height:17px; right:16px; bottom:35px; }
.orbit { position:absolute; left:50%; top:50%; border:2px solid #ffffff5c; border-radius:50%; transform:translate(-50%,-50%) rotate(-18deg); }
.orbit-one { width:245px; height:105px; }
.orbit-two { width:285px; height:145px; transform:translate(-50%,-50%) rotate(28deg); }
.person { position:absolute; z-index:3; width:28px; height:28px; border:7px solid #fff; border-radius:50%; background:#ff9b43; box-shadow:0 14px 0 -7px #fff; }
.person.one { left:15%; top:27%; }.person.two { right:12%; top:33%; background:#ff6f83; }.person.three { left:54%; bottom:4%; background:#ffd05e; }

.community-numbers { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; margin:20px 0; }
.community-numbers article { display:flex; gap:15px; align-items:center; padding:19px 22px; border:1px solid #e6def7; border-radius:17px; background:#fff; box-shadow:0 10px 28px #3d276c0d; }
.community-numbers strong,.community-numbers small { display:block; }
.community-numbers strong { color:#25145f; font-size:1.35rem; }.community-numbers small { color:#766d98; }
.number-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:13px; font-size:.65rem; }
.number-icon.purple { color:#6d43f3; background:#eee8ff; }.number-icon.teal { color:#22aa9e; background:#ddf8f3; }.number-icon.orange { color:#f4892b; background:#fff0df; }
.community-numbers .live-traffic-counter { position:relative; min-height:112px; padding:0; overflow:hidden; border-color:#f1d9c3; background:linear-gradient(125deg,#fff9ee 0%,#fff0e3 48%,#efe9ff 100%); }
.traffic-sky { position:absolute; inset:0; overflow:hidden; pointer-events:none; }.traffic-sky::before,.traffic-sky::after { content:''; position:absolute; border-radius:50%; }.traffic-sky::before { width:130px; height:130px; right:-30px; top:-58px; background:#ffb15d2b; box-shadow:0 0 0 18px #ffca8730; }.traffic-sky::after { width:165px; height:70px; right:10px; bottom:-50px; border:2px solid #6f48eb22; transform:rotate(-10deg); }
.traffic-sky i { position:absolute; right:62px; top:24px; width:30px; height:30px; border:7px solid #fff; border-radius:50%; background:#ffad4f; box-shadow:0 12px 0 -6px #fff,0 0 24px #ff9b4375; }.traffic-sky b,.traffic-sky span { position:absolute; width:7px; height:7px; border-radius:50%; background:#28bbae; box-shadow:0 0 0 5px #28bbae1f; }.traffic-sky b { right:24px; bottom:20px; }.traffic-sky span { right:135px; bottom:17px; background:#7b4cf2; box-shadow:0 0 0 5px #7b4cf21f; }
.traffic-reading { position:relative; z-index:1; display:flex; flex-direction:column; align-items:flex-start; width:100%; padding:17px 105px 16px 22px; }.traffic-reading .traffic-live { display:flex; align-items:center; gap:7px; color:#9a5d35; font-size:.63rem; font-weight:900; letter-spacing:.09em; }.traffic-live i { width:7px; height:7px; border-radius:50%; background:#20b6a9; box-shadow:0 0 0 4px #20b6a922; animation:trafficPulse 2s ease-out infinite; }.traffic-reading strong { margin:3px 0 0; color:#25145f; font-size:clamp(1.45rem,2.1vw,2rem); font-variant-numeric:tabular-nums; letter-spacing:-.035em; line-height:1.05; }.traffic-reading small { color:#6f668e; }.traffic-reading em { margin-top:4px; color:#a07976; font-size:.68rem; font-style:normal; }
.live-traffic-counter.traffic-updated { animation:trafficGlow .9s ease; }
@keyframes trafficPulse { 0%{box-shadow:0 0 0 0 #20b6a955} 70%,100%{box-shadow:0 0 0 8px #20b6a900} }
@keyframes trafficGlow { 50%{transform:translateY(-2px);box-shadow:0 14px 34px #ff9c4330,0 0 0 3px #29bcae24} }

.requirement-card { position:relative; display:grid; grid-template-columns:150px 1fr auto; gap:26px; align-items:center; margin:0 0 20px; padding:25px 28px; overflow:hidden; border:1px solid #e5dcf8; border-radius:21px; background:#fff; box-shadow:0 12px 32px #3d276c10; }
.requirement-notice { grid-column:1/-1; position:relative; z-index:2; margin:-5px 0 0; padding:12px 15px; border-radius:11px; font-weight:700; }.requirement-notice.success { color:#087c73; background:#ddf8f3; }.requirement-notice.error { color:#a23f50; background:#ffedf0; }
.requirement-card::after { content:''; position:absolute; right:-48px; bottom:-70px; width:180px; height:180px; border:2px dashed #784bf22b; border-radius:50%; pointer-events:none; }
.requirement-status { position:relative; z-index:1; display:grid; place-items:center; min-height:112px; padding:15px; border-radius:18px; color:#fff; text-align:center; background:linear-gradient(145deg,#6b3ee8,#8855f6); box-shadow:0 12px 26px #5e37c62b; }
.requirement-status span { font-size:2.2rem; font-weight:900; line-height:1; }.requirement-status small { margin-top:8px; font-size:.66rem; font-weight:900; letter-spacing:.09em; }
.requirement-card.complete .requirement-status { background:linear-gradient(145deg,#13a99d,#46c9bc); box-shadow:0 12px 26px #15998d28; }
.requirement-copy { position:relative; z-index:1; }.requirement-copy h2 { margin:4px 0 7px; color:#25145f; font-size:1.35rem; }.requirement-copy p:not(.eyebrow) { max-width:780px; margin:0; color:#766d98; line-height:1.55; }.requirement-copy strong { color:#24125f; }
.requirement-actions { position:relative; z-index:1; display:flex; flex-direction:column; gap:9px; min-width:210px; }.requirement-actions .button,.requirement-actions button,.requirement-shortfall { width:100%; padding:12px 16px; border:0; border-radius:11px; text-align:center; font:inherit; font-weight:800; cursor:pointer; }.requirement-actions button { color:#6240d9; background:#f0eaff; }.requirement-actions form { margin:0; }.requirement-actions .requirement-bypass { color:#fff; background:linear-gradient(105deg,#ee8145,#ffab55); box-shadow:0 9px 20px #df753328; }.requirement-shortfall { display:block; color:#8b82a7; background:#f4f0fa; }

.dashboard-columns { display:grid; grid-template-columns:1.35fr .65fr; gap:20px; }
.member-card,.next-step-card { padding:26px; border:1px solid #e6def7; border-radius:20px; background:#fff; box-shadow:0 12px 30px #3d276c10; }
.member-balance { display:flex; justify-content:space-between; align-items:center; margin:15px 0 22px; }
.member-balance span,.member-details span { color:#766d98; }.member-balance strong { display:block; color:#6d43f3; font-size:2.4rem; }
.balance-sun { width:62px; height:62px; border:10px solid #fff1d9; border-radius:50%; background:#ffad4f; box-shadow:0 0 0 8px #fff8ed; }
.member-details { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding-top:18px; border-top:1px solid #eee8f8; }
.member-details b { display:block; margin-top:4px; color:#25145f; }
.next-step-card { color:#fff; border:0; background:linear-gradient(145deg,#ed7f44,#ffae58); }
.next-step-card p { color:#fff4e8; }.next-step-card a { color:#fff; font-weight:800; }.step-badge { display:inline-block; padding:5px 9px; border-radius:99px; color:#7d3b09; background:#fff2de; font-size:.66rem; font-weight:800; }

.campaign-intro { position:relative; display:flex; justify-content:space-between; align-items:center; min-height:210px; margin-top:28px; padding:36px 42px; overflow:hidden; border-radius:24px; color:#fff; background:linear-gradient(120deg,#5733d3,#7c57f5); box-shadow:0 18px 42px #5130ad25; }
.campaign-intro h2 { margin:8px 0; font-size:clamp(2rem,4vw,3.3rem); }.campaign-intro p { max-width:730px; margin:0; color:#eee9ff; }
.campaign-spark { width:120px; height:120px; margin-right:30px; border:3px solid #ffffff80; border-radius:50%; background:#2fc5b6; box-shadow:0 0 0 24px #ffffff13,0 0 0 48px #ffb15d20; }
.campaign-options { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:20px; }
.campaign-options article { position:relative; display:flex; flex-direction:column; min-height:390px; padding:27px; overflow:hidden; border:1px solid #e5ddf5; border-radius:21px; background:#fff; box-shadow:0 12px 32px #3d276c10; }
.campaign-options article::after { content:''; position:absolute; width:95px; height:95px; right:-32px; bottom:-35px; border-radius:50%; background:#6d43f315; }
.campaign-options article:nth-child(2)::after { background:#26b9ad1c; }.campaign-options article:nth-child(3)::after { background:#ff9b4320; }
.campaign-options h2 { margin:8px 0; font-size:1.45rem; }.campaign-options p:not(.eyebrow) { flex:1; color:#766d98; }.campaign-options small { display:block; margin-top:13px; color:#8b82a7; }
.campaign-options .button { width:100%; text-align:center; }.campaign-options .button.secondary { color:#fff; background:linear-gradient(105deg,#20aa9f,#4bcfc0); }
.option-icon { display:grid; place-items:center; width:58px; height:58px; margin-bottom:22px; border-radius:18px; font-size:1.7rem; font-weight:800; }
.option-icon.direct { color:#6240d9; background:#eee8ff; }.option-icon.splash { color:#118e84; background:#ddf8f3; }.option-icon.ar { color:#d86617; background:#fff0df; }
.ar-option.locked { background:linear-gradient(145deg,#fff,#fff9f2); }.ar-option.unlocked { border-color:#ffc67f; background:linear-gradient(145deg,#fff,#fff8ef); }
.premium-label { position:absolute; right:18px; top:18px; padding:5px 9px; border-radius:99px; color:#9b510f; background:#fff0d8; font-size:.65rem; font-weight:800; }
.integration-note { margin-top:20px; padding:20px 24px; border:1px solid #dcd1f6; border-radius:16px; color:#4e347d; background:#f0eaff; }.integration-note p { margin:5px 0 0; color:#766d98; }

@media (max-width: 760px) {
  .sidebar {
    display: block;
    padding: 16px;
  }
  .sidebar nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 18px;
  }
  .app-shell { grid-template-columns: 1fr; }
  .side-community { display:none; }
  .community-hero { grid-template-columns:1fr; padding:32px 25px; }
  .community-orbit { display:none; }
  .community-numbers,.dashboard-columns { grid-template-columns:1fr; }
  .traffic-reading { padding-right:90px; }
  .requirement-card { grid-template-columns:1fr; }.requirement-status { min-height:88px; }.requirement-actions { min-width:0; }
  .campaign-options { grid-template-columns:1fr; }
  .campaign-intro { padding:28px 24px; }.campaign-spark { display:none; }
  .member-details { grid-template-columns:1fr; }
}