VoteReederXP — Dashboard

tag in game.html. It is VISUAL-ONLY: overrides colour, glow, and one animation. No HTML, IDs, JavaScript, Supabase wiring, or Gemini's protected fixes (.kcol / .kcol-scroll / .layout / setLayout) are touched. Delete the block to revert instantly. ============================================================ */ /* 1 — STAT TICKER: collapse the five neon values into one quiet tone. (This strip was the loudest thing on the page.) */ .ti-val,.tc,.tg,.tp,.tpk,.tgr{color:rgba(255,255,255,0.58)!important;text-shadow:none!important;} .ti-lbl{color:rgba(255,255,255,0.30)!important;} .ti{border-right-color:rgba(255,255,255,0.06)!important;} /* 2 — Stop the spinning hue-shift on the avatar rings (constant motion = noise) and soften the ring gradient. */ .av-ring,.prof-av-sq{animation:none!important;background:linear-gradient(140deg,#28405c,#382c5e)!important;} /* 3 — ONE calm button language. Category is still signalled by the coloured tag + left edge on each card. Gold "Mark Complete" stays the single bright "do-it" action so the eye knows where to go. */ .t-btn,.chat-send{background:rgba(255,255,255,0.07)!important;color:rgba(255,255,255,0.82)!important;} .t-btn:hover,.chat-send:hover{filter:none!important;background:rgba(255,255,255,0.12)!important;} .mark-btn{background:#cda23a!important;color:#160f05!important;} /* 4 — Quiet the bright chrome, glows and accents. Headers stay cyan (just calmer), XP stays gold — so colour still means something. */ .chat-live{box-shadow:none!important;} .sb-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.22)!important;} .sb-title,.chat-title,.sb-count{color:#5fb6c9!important;} .sb-count{background:rgba(95,182,201,0.10)!important;border-color:rgba(95,182,201,0.25)!important;} .xp-num{color:#d6b746!important;} .xp-right{color:rgba(255,255,255,0.50)!important;} .xp-fill{background:linear-gradient(90deg,#3c87a0,#6a5a9e)!important;} .xm.now{color:#c98aa8!important;} .xm.done{color:#5fb6c9!important;} .boost-badge{background:rgba(255,255,255,0.04)!important;border-color:rgba(255,255,255,0.10)!important;} .boost-val{color:rgba(255,255,255,0.70)!important;} .boost-sub{color:rgba(255,255,255,0.40)!important;} .bell-dot{background:#b0567f!important;} /* 5 — Let the secondary panels (badges, chat) recede a touch so the real flow — pick task → board → complete — leads. Profile card stays forward. */ .badge-card,.chat-card{background:#0f1521!important;border-color:rgba(255,255,255,0.05)!important;} /* ============================================================ NAV BRAND-MATCH (CSS only) — matches the rebranded shared menu. Rajdhani is loaded via the head . Touches nav styling only — not .layout/.kcol/.kcol-scroll/setLayout()/ticker/XP pill/bell/avatar. ============================================================ */ .topbar{ background:rgba(5,1,15,0.82) !important; backdrop-filter:blur(10px); border-bottom:1px solid rgba(0,240,255,0.22) !important; } .nl{ font-family:'Rajdhani','Inter',sans-serif !important; font-size:15px !important; font-weight:700 !important; letter-spacing:.5px !important; color:rgba(255,255,255,0.62) !important; } .nl:hover{ color:#fff !important; } .nl.a{ color:#00f0ff !important; border-bottom:2px solid #00f0ff !important; text-shadow:0 0 10px rgba(0,240,255,.5); } .nav-logo{ letter-spacing:1px; } .nav-donate{ font-family:'Rajdhani','Inter',sans-serif; font-size:14px;font-weight:700;letter-spacing:.5px; color:#ffcf3f;text-decoration:none; border:1px solid rgba(255,207,63,0.45); border-radius:7px;padding:6px 14px;white-space:nowrap;transition:.15s; } .nav-donate:hover{ background:rgba(255,207,63,0.12); } .logout-btn{font-family:'Rajdhani',sans-serif;font-weight:700;font-size:13px; color:#ff5a7a;background:transparent;border:1px solid rgba(255,90,122,.45); border-radius:7px;padding:6px 14px;cursor:pointer;transition:.15s;} .logout-btn:hover{background:rgba(255,90,122,.12);} /* ============================================================ MOBILE + HIGH-CONTRAST + AVATAR PASS (accessibility) Placed LAST so it wins over base rules, the CALM-PASS block, and style.css (which may not load). Goal: bigger + higher contrast for an older user on a phone. Does NOT touch .kcol / .layout / .kcol-scroll / setLayout() or the protected scroll rules. ============================================================ */ /* 1 — PROFILE AVATAR: hard-cap at 120px so it can NEVER blow out (even if style.css fails to load), and anchor the crop to the TOP so her full head shows. Rounded square fits the head-and-shoulders portrait. */ .prof-av-sq{ width:120px!important; height:120px!important; flex:0 0 120px!important; max-width:120px!important; border-radius:16px!important; overflow:hidden!important; padding:3px!important; } .prof-av-sq-in{ width:100%!important; height:100%!important; max-width:120px!important; max-height:120px!important; border-radius:14px!important; overflow:hidden!important; } .prof-av-sq-in img{ width:100%!important; height:100%!important; max-width:120px!important; max-height:120px!important; object-fit:cover!important; object-position:top center!important; border-radius:14px!important; display:block!important; } /* 2 — ACHIEVEMENT BADGES: bigger label + icon, readable on a phone; grid stays fractional (can't overflow) and tightens its gap on small screens. */ .badge-box{ font-size:32px!important; height:64px!important; } .badge-nm{ font-size:13px!important; line-height:1.25!important; } @media(max-width:600px){ .badges-grid{ grid-template-columns:repeat(4,1fr)!important; gap:6px!important; } .badge-nm{ font-size:12px!important; } } /* 3 — XP PROGRESS BAR: thicker bar, bigger rank labels + XP numbers. */ .xp-track{ height:14px!important; } .xp-tag{ font-size:14px!important; } .xp-right{ font-size:15px!important; font-weight:800!important; } .xm{ font-size:13px!important; font-weight:700!important; } /* 4 — NO GRAY TEXT: every white-with-opacity / muted label → pure #fff at full opacity (this also overrides the CALM-PASS text muting). Saturated accents — cyan, gold, pink, purple, green, guild colors — are NOT in this list and stay as-is. */ .card-label,.xp-line-lbl,.mstat-lbl,.chat-online,.chat-msg-txt,.chat-msg-time, .t-sub,.kcard-sub,.uz-txt,.xp-tag,.ti-lbl,.ti-val,.tc,.tg,.tp,.tpk,.tgr, .xp-right,.xm,.bl .badge-nm,.prof-xpt,.chat-sep,.boost-sub,.nl{ color:#ffffff!important; opacity:1!important; } /* keep the milestone + active-nav accents distinguishable (and bright) */ .xm.done{ color:#00e5ff!important; } .xm.now{ color:#ff5aa0!important; } .nl.a{ color:#00f0ff!important; } /* 5 — DONATE: cyan outline, white letters, transparent fill, subtle glow so it pops on the black background — more prominent than the calmed buttons. */ .nav-donate{ color:#ffffff!important; border:2px solid #00e5ff!important; background:rgba(0,229,255,0.08)!important; box-shadow:0 0 12px rgba(0,229,255,0.45)!important; font-weight:800!important; text-shadow:0 0 6px rgba(0,229,255,0.55); } .nav-donate:hover{ background:rgba(0,229,255,0.18)!important; box-shadow:0 0 18px rgba(0,229,255,0.75)!important; } /* 6 — NAV THREE-ZONE: LEFT (logo+links) | MIDDLE (page extras) | RIGHT (donate, bell, logout, avatar). nav-row is already flex+space-between, so three children anchor LEFT at the start and RIGHT at the far end; the avatar is the last child of nav-right, so it's the rightmost element and never shifts when middle items change. */ .nav-middle{ display:flex; align-items:center; gap:12px; } /* Pending-review subtitle is an intentional PURPLE accent, not gray — keep it purple at full opacity. Higher specificity than the .kcard-sub white sweep above, so it wins. */ .kcard-sub.pending{ color:#bf00ff!important; opacity:1!important; }

Dashboard How to Play Leaderboard Guilds Events Learn Blog About

⚡ 2X XP

02:14:37

1,000XP · Advocate

Donate

🔔3

KR

ReederRising

Level 29 · Advocate

▼

🥇Top PlayerLibertyLifter · 3,250 XP

⭐Your RankReederRising · #12 of 847

🏆Civic ChampionMariaH_TX29 · June 2026

⚡Guild LeaderThe Momentum · 48,200 XP

🔥Hot StreakDistrictRising · 7 Days

XP Progress

1,000 / 2,500 XP (40%)

Supporter · 0 Organizer · 300 ▲ Advocate · 1,000 Builder · 3,500 Catalyst · 8,000 Change Champion · 15,000

Available Tasks 6

Event Briefing+150 XP

Town Hall: District 29 Meetup

Saturday, June 20th · 11:00 PM

Social Task+75 XP

Share "Weekend of Action" Post

Auto-detect via Facebook link.

Field Work+200 XP

Canvass Neighborhood Sector A

Manual upload / Self-report.

Auto+25 XP

Complete Daily Check-in

Auto-verified on login.

Event Briefing+100 XP

Attend Community Forum

Thursday, June 22nd · 6:00 PM

Field Work+150 XP

Phone Bank 60 Minutes

Self-report after completion.

Social Task+50 XP

Follow Karen on Instagram

Auto-detect via linked account.

Auto+25 XP

Register on VoteReederXP

One-time auto-verified bonus.

Achievement Badges 7 of 12

🥇

First Vol

🤝

Connector

📢

Amplifier

🗳️

Voter Reg

🚶

Block Walker

📞

Phone Bank

⭐

Event Hero

🔒

Civic Builder

🔒

Neighbor

🔒

Guild Founder

🔒

Champion

🔒

District

District 29 · Global Chat

23 online

Player123 (The Miners)·Just added the town hall meeting task!2m

TX29Hero (The Treasury)·Sector A block walk is almost done.5m

MariaH_TX29 (Turnout Titans)·Thanks everyone 🏆 Let's keep pushing!8m

LibertyLifter (The Momentum)·Who's coming to the weekend canvass?12m

GrassrootsGuru (The Signal)·Phone bank session in 30 mins!15m

VoteTX29 (The Treasury)·Registered 3 voters today 🗳️ +100 XP!18m

DistrictRising (District Warriors)·7 day streak 🔥 Who else?22m

Karen29Fights (The Architects)·Great turnout last night. Karen was amazing!30m

My Board

⚡ In Progress4

Canvass 10 DoorsSELF REPORT

+150 XP · Manual Verification

Phone Bank 30 MinSELF REPORT

+75 XP · Due May 24

Attend Town Hall EventSELF REPORT

+100 XP · Due May 26

Register 2 VotersSELF REPORT

+200 XP · Manual Verification

🕐 Pending Review1

Post Event SelfiePHOTO PROOF

Awaiting coordinator approval

📤

Upload Screenshot

→ Google Drive · XP instantly

✓ Complete3

Watched Welcome VideoAUTO

+25 XP · Auto Verified

Volunteer SignupAUTO

+200 XP · Auto Verified

Follow on InstagramAUTO

+50 XP · Auto Verified