:root{
  --v2-purple:#5b35ee;
  --v2-blue:#168cf0;
  --v2-ink:#15213a;
  --v2-muted:#6f7a93;
  --v2-bg:#f5f8ff;
  --v2-card:#ffffff;
  --v2-max:460px;
}

*,*::before,*::after{box-sizing:border-box}
html,body,#root{width:100%;max-width:100%;min-width:0;margin:0;overflow-x:hidden}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{background:#eef3ff}
button,input{font:inherit}
img,svg{max-width:100%}

/* Home uses a mobile-app shell at every viewport size. */
.appShell:has(.v2Home)>.topbar,
.appShell:has(.v2Home)>.sidebar,
.appShell:has(.v2Home)>.navBackdrop{display:none!important}
.appShell:has(.v2Home){
  display:block!important;
  width:100%!important;
  max-width:var(--v2-max)!important;
  min-width:0!important;
  min-height:100dvh!important;
  margin:0 auto!important;
  background:var(--v2-bg)!important;
  overflow-x:hidden!important;
  position:relative!important;
}
.appShell:has(.v2Home)>.content{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  min-height:100dvh!important;
  margin:0!important;
  padding:0!important;
  overflow-x:hidden!important;
  background:transparent!important;
}

.v2Home{
  width:100%;
  min-width:0;
  min-height:100dvh;
  margin:0;
  padding:0 14px calc(76px + env(safe-area-inset-bottom));
  overflow-x:hidden;
  color:var(--v2-ink);
  background:linear-gradient(180deg,#f6f8ff 0%,#fff 58%,#f7f9ff 100%);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

/* Compact header, inspired by the mobile reference. */
.v2Hero{
  position:relative;
  z-index:1;
  width:calc(100% + 28px);
  min-height:168px;
  margin:0 -14px 0;
  padding:14px 14px 32px;
  color:#fff;
  background:linear-gradient(132deg,#6331ee 0%,#3157ee 52%,#168bf0 100%);
  border-radius:0 0 28px 28px;
  overflow:visible;
}
.v2Hero::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    radial-gradient(circle at 82% 8%,rgba(255,255,255,.15),transparent 28%),
    radial-gradient(circle at 5% 92%,rgba(135,56,255,.28),transparent 33%);
}
.v2HeroTop,.v2Greeting,.v2Search{position:relative;z-index:2;width:100%;max-width:100%;min-width:0;margin-inline:auto}
.v2HeroTop{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;min-height:42px}
.v2MenuGlyph{display:grid;place-items:center;width:30px;height:36px;color:#fff;font-size:26px;font-weight:400;line-height:1;opacity:.98}
.v2Brand{display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden}
.v2Brand img{flex:0 0 auto;width:38px;height:38px;object-fit:cover;border-radius:12px;box-shadow:0 6px 18px rgba(23,27,85,.18)}
.v2Brand span{display:grid;min-width:0;line-height:1.02}
.v2Brand strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(14px,4.5vw,18px);font-weight:900;letter-spacing:.01em}
.v2Brand small{margin-top:4px;color:#edf0ff;font-size:clamp(8px,2.5vw,10px);font-weight:800;letter-spacing:.25em;white-space:nowrap}
.v2HeroTools{display:flex;align-items:center;gap:7px}
.v2Bell,.v2Avatar{position:relative;display:grid;place-items:center;flex:0 0 auto;width:34px;height:34px;padding:0;border:0;border-radius:12px;color:#fff;background:rgba(255,255,255,.14);font-size:16px;cursor:pointer}
.v2Avatar{border-radius:50%;background:#fff;color:var(--v2-purple);font-size:14px;font-weight:900}
.v2Bell i,.v2NavBadgeWrap i{position:absolute;right:-4px;top:-5px;display:grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:99px;background:#ff4f58;color:#fff;font-size:9px;font-style:normal;line-height:1}
.v2Greeting{margin-top:10px;padding-right:2px}
.v2Greeting h1{margin:0;font-size:clamp(20px,6.2vw,25px);line-height:1.16;font-weight:900;letter-spacing:-.01em;overflow-wrap:anywhere}
.v2Greeting p{margin:5px 0 0;color:#ecf0ff;font-size:clamp(11px,3.3vw,13px);line-height:1.4}
.v2Search{
  display:flex;
  align-items:center;
  gap:9px;
  height:48px;
  margin-top:12px;
  padding:0 12px;
  color:#17213c;
  background:#fff;
  border:1px solid rgba(224,229,245,.9);
  border-radius:16px;
  box-shadow:0 12px 28px rgba(40,55,128,.17);
  transform:translateY(23px);
}
.v2Search>span{flex:0 0 auto;font-size:26px;line-height:1;transform:rotate(-12deg)}
.v2Search input{min-width:0;flex:1;width:100%;border:0;outline:0;background:transparent;color:#1a2542;font-size:clamp(11px,3.4vw,13px)}
.v2Search input::placeholder{color:#7d87a0;text-overflow:ellipsis}
.v2Search button{flex:0 0 auto;width:28px;height:32px;padding:0;border:0;background:transparent;color:#555db3;font-size:20px;cursor:pointer}

/* Weekly challenge: compact, readable, and no overflow. */
.v2Challenge{
  position:relative;
  width:100%;
  min-width:0;
  min-height:164px;
  margin:42px auto 16px;
  padding:16px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 76px;
  grid-template-areas:"copy ring" "win win";
  align-items:center;
  gap:10px 12px;
  text-align:left;
  color:var(--v2-ink);
  background:#fff;
  border:1px solid #e9edf8;
  border-radius:22px;
  box-shadow:0 10px 26px rgba(65,75,130,.08);
  cursor:pointer;
  overflow:hidden;
}
.v2Challenge::after{content:"";position:absolute;right:-42px;top:-50px;width:150px;height:150px;border-radius:50%;background:linear-gradient(145deg,rgba(80,72,238,.07),rgba(36,142,241,.03));pointer-events:none}
.v2ChallengeCopy{grid-area:copy;position:relative;z-index:1;min-width:0}
.v2ChallengeCopy small{display:block;color:#6150dc;font-size:clamp(8.5px,2.5vw,10px);font-weight:900;letter-spacing:.065em}
.v2ChallengeCopy h2{margin:6px 0 5px;font-size:clamp(17px,5.2vw,21px);line-height:1.18;font-weight:900;color:#17213c}
.v2ChallengeCopy p{margin:0 0 9px;color:#66718a;font-size:clamp(10.5px,3.2vw,12.5px);line-height:1.42}
.v2ChallengeBar{width:100%;height:9px;border-radius:99px;background:#e9edf6;overflow:hidden}
.v2ChallengeBar i{display:block;height:100%;width:36%;border-radius:inherit;background:linear-gradient(90deg,#13c77f,#54d995)}
.v2ChallengeCopy em{display:block;margin-top:6px;color:#65708a;font-size:clamp(9px,2.6vw,10.5px);font-style:normal;line-height:1.3}
.v2ChallengeRing{grid-area:ring;position:relative;z-index:1;justify-self:end;width:72px;height:72px;border-radius:50%;display:grid;place-content:center;text-align:center;background:conic-gradient(#39d29b 0 36%,#e8ebf6 36%);box-shadow:inset 0 0 0 9px #fff}
.v2ChallengeRing b{font-size:20px;line-height:1;font-weight:900;color:#4c42d8}
.v2ChallengeRing span{margin-top:3px;color:#65708a;font-size:9px}
.v2ChallengeWin{grid-area:win;position:relative;z-index:1;width:100%;min-width:0;padding:8px 10px;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:8px;row-gap:1px;text-align:left;color:#17345a;background:linear-gradient(90deg,#eef8ff,#f1fbf6);border:1px solid #e1eef4;border-radius:13px}
.v2ChallengeWin>span{grid-row:1/3;font-size:25px;line-height:1}
.v2ChallengeWin b{font-size:clamp(10px,3vw,11.5px);line-height:1.25;overflow-wrap:anywhere}
.v2ChallengeWin small{grid-column:2;color:#4770c8;font-size:9.5px;line-height:1.2}

.v2ServicesWrap{width:100%;min-width:0;margin:0 auto 16px}
.v2SectionHead{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;margin:0 1px 10px}
.v2SectionHead h2{min-width:0;margin:0;color:#17213c;font-size:clamp(17px,5vw,20px);line-height:1.2;font-weight:900}
.v2SectionHead button{flex:0 0 auto;max-width:48%;padding:3px 0;border:0;background:transparent;color:#5c3bee;font-size:clamp(10px,3vw,12px);font-weight:800;white-space:nowrap;cursor:pointer}
.v2ServiceGrid{width:100%;min-width:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.v2ServiceCard{min-width:0;min-height:132px;padding:13px 11px;display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto 1fr;align-items:start;gap:8px 5px;border:0;border-radius:18px;text-align:left;color:var(--v2-ink);box-shadow:0 8px 18px rgba(74,86,136,.07);cursor:pointer;overflow:hidden}
.v2ServiceCard.books{background:linear-gradient(145deg,#edf7ff,#e4f1ff)}
.v2ServiceCard.exams{background:linear-gradient(145deg,#fff2f7,#ffe9f0)}
.v2ServiceCard.english,.v2ServiceCard.lessons{background:linear-gradient(145deg,#effff8,#e3faef)}
.v2ServiceCard.game{background:linear-gradient(145deg,#fff9e9,#fff1d7)}
.v2ServiceCard.gov{background:linear-gradient(145deg,#f4efff,#eeeaff)}
.v2ServiceIcon{grid-column:1;width:40px;height:40px;display:grid;place-items:center;border-radius:13px;background:#fff;box-shadow:0 6px 14px rgba(70,80,130,.07);font-size:21px;line-height:1}
.v2Chevron{grid-column:2;grid-row:1;align-self:center;color:#263251;font-size:22px;line-height:1}
.v2ServiceCopy{grid-column:1/-1;min-width:0;display:grid;align-content:start;gap:4px}
.v2ServiceCopy b{min-width:0;color:#18233e;font-size:clamp(12px,3.8vw,15px);line-height:1.18;font-weight:900;overflow-wrap:anywhere}
.v2ServiceCopy small{color:#68738a;font-size:clamp(9px,2.9vw,11px);line-height:1.34;overflow-wrap:anywhere}
/* Odd final service is compact and spans the width instead of leaving a broken half-row. */
.v2ServiceCard:last-child:nth-child(odd){grid-column:1/-1;min-height:92px;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:1fr;align-items:center;column-gap:10px}
.v2ServiceCard:last-child:nth-child(odd) .v2ServiceIcon{grid-column:1;grid-row:1}
.v2ServiceCard:last-child:nth-child(odd) .v2ServiceCopy{grid-column:2;grid-row:1}
.v2ServiceCard:last-child:nth-child(odd) .v2Chevron{grid-column:3;grid-row:1}

.v2Leaderboard{width:100%;min-width:0;margin:0 auto 14px;padding:13px;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;border:1px solid #edf0f7;border-radius:18px;background:#fff;color:var(--v2-ink);box-shadow:0 8px 20px rgba(74,86,136,.06);text-align:left;cursor:pointer}
.v2LeaderIcon{width:44px;height:44px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(145deg,#5b35ee,#733cf3);font-size:21px}
.v2LeaderCopy{min-width:0;display:grid;gap:3px}.v2LeaderCopy b{font-size:14px;line-height:1.2}.v2LeaderCopy small{color:#65708a;font-size:10px;line-height:1.3}
.v2MiniBars{height:36px;display:flex;align-items:end;gap:4px}.v2MiniBars i{width:8px;border-radius:5px 5px 2px 2px;background:linear-gradient(#8c9cff,#55a9f4)}.v2MiniBars i:nth-child(1){height:18px}.v2MiniBars i:nth-child(2){height:28px}.v2MiniBars i:nth-child(3){height:36px}
.v2LeaderNote{grid-column:1/-1;padding:8px 10px;border:1px solid #e0e4ff;border-radius:11px;background:#f5f6ff;color:#3058b8;font-size:10px;line-height:1.3}

.v2Progress{width:100%;min-width:0;margin:0 auto;padding:12px 10px 13px;border:1px solid #eaf0fb;border-radius:18px;background:#fff;box-shadow:0 8px 20px rgba(74,86,136,.05)}
.v2Progress .v2SectionHead{margin-bottom:9px}
.v2SubjectStrip,.v2SubjectCards{width:100%;min-width:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}
.v2SubjectStrip button,.v2SubjectCards button{min-width:0;padding:9px 4px 8px;border:0;border-radius:13px;background:#f7f9ff;color:#17213c;text-align:center;cursor:pointer;overflow:hidden}
.v2SubjectStrip button:nth-child(1){background:#fff2f5}.v2SubjectStrip button:nth-child(2){background:#effbf7}.v2SubjectStrip button:nth-child(3){background:#fff8e9}.v2SubjectStrip button:nth-child(4){background:#edf6ff}.v2SubjectStrip button:nth-child(5){background:#f4efff}
.v2SubjectStrip b,.v2SubjectCards b{display:block;min-width:0;min-height:22px;margin:0;color:#18233e;font-size:clamp(8.2px,2.65vw,10.5px);line-height:1.12;font-weight:900;white-space:normal;overflow-wrap:anywhere}
.v2SubjectBar{display:block;width:100%;height:5px;margin:8px 0 5px;border-radius:99px;background:#e2e7f1;overflow:hidden}
.v2SubjectBar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#6539ef,#3185ef)}
.v2SubjectStrip small,.v2SubjectCards small{display:block;color:#65708a;font-size:clamp(8px,2.45vw,9.5px);font-weight:700;white-space:nowrap}
.v2ProgressSummary{margin-top:10px;padding:9px;display:grid;grid-template-columns:1fr 1fr;gap:6px;border-radius:13px;background:linear-gradient(90deg,#fbfcff,#f2f8ff)}
.v2ProgressSummary div{min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:5px;align-items:center}.v2ProgressSummary div span{grid-row:1/3;font-size:19px}.v2ProgressSummary b{font-size:11px;line-height:1.1}.v2ProgressSummary small{color:#65708a;font-size:9px;line-height:1.2}.v2ProgressSummary p{grid-column:1/-1;margin:0;padding:7px 8px;border-radius:9px;background:#eaf5ff;color:#2f5bb6;font-size:9.5px;font-weight:700;line-height:1.3}

.v2BottomNav{
  position:fixed;
  z-index:90;
  left:50%;
  bottom:0;
  transform:translateX(-50%);
  width:min(100%,var(--v2-max));
  min-width:0;
  height:calc(64px + env(safe-area-inset-bottom));
  padding:6px 5px calc(6px + env(safe-area-inset-bottom));
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  align-items:center;
  background:rgba(255,255,255,.98);
  backdrop-filter:blur(16px);
  border-top:1px solid #e8edf5;
  box-shadow:0 -8px 22px rgba(55,65,110,.07);
}
.v2BottomNav button{min-width:0;padding:2px 0;border:0;background:transparent;color:#727a8d;display:grid;place-items:center;gap:3px;cursor:pointer;overflow:visible}
.v2BottomNav button>span{position:relative;font-size:20px;line-height:1}.v2BottomNav small{max-width:100%;font-size:clamp(8.5px,2.6vw,10.5px);font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.v2BottomNav button.active{color:#5b35ee}.v2BottomNav button.active>span{transform:scale(1.06)}
.v2NavBadgeWrap{position:relative}

/* Extra-tight phones */
@media(max-width:350px){
  .v2Home{padding-inline:10px}
  .v2Hero{width:calc(100% + 20px);margin-inline:-10px;padding-inline:10px}
  .v2HeroTop{gap:5px}.v2MenuGlyph{width:26px;font-size:23px}.v2Brand{gap:6px}.v2Brand img{width:34px;height:34px}.v2HeroTools{gap:4px}.v2Bell,.v2Avatar{width:31px;height:31px}
  .v2Greeting h1{font-size:19px}.v2Greeting p{font-size:10.5px}.v2Search{height:45px;padding-inline:10px}
  .v2Challenge{padding:13px;grid-template-columns:minmax(0,1fr) 65px;gap:8px}.v2ChallengeRing{width:64px;height:64px;box-shadow:inset 0 0 0 8px #fff}.v2ChallengeRing b{font-size:18px}
  .v2ServiceGrid{gap:8px}.v2ServiceCard{min-height:125px;padding:11px 9px}.v2ServiceIcon{width:36px;height:36px;font-size:19px}.v2ServiceCopy b{font-size:11.5px}.v2ServiceCopy small{font-size:8.7px}
  .v2Progress{padding-inline:7px}.v2SubjectStrip,.v2SubjectCards{gap:3px}.v2SubjectStrip button,.v2SubjectCards button{padding-inline:2px}.v2SubjectStrip b,.v2SubjectCards b{font-size:7.8px}.v2SubjectStrip small,.v2SubjectCards small{font-size:7.5px}
}

/* Larger phones (412-480) get a little more breathing room but keep the same proportions. */
@media(min-width:412px) and (max-width:480px){
  .v2Home{padding-inline:16px}.v2Hero{width:calc(100% + 32px);margin-inline:-16px;padding-inline:16px}.v2ServiceCard{min-height:138px;padding:14px 13px}.v2ServiceIcon{width:43px;height:43px}.v2Progress{padding-inline:12px}
}

/* Desktop/tablet: keep the app centered instead of stretching into a desktop site. */
@media(min-width:481px){
  body{padding:18px 0 24px}
  .appShell:has(.v2Home){border-radius:28px;box-shadow:0 18px 55px rgba(36,49,95,.14)!important;overflow:hidden!important}
  .v2BottomNav{bottom:24px;border:1px solid #e8edf5;border-bottom:0;border-radius:18px 18px 0 0}
}

/* =========================================================
   v36 — dual responsive shell only
   Keep the approved UI design; adjust only viewport fit.
   ========================================================= */

/* Mobile: use almost the full screen width with a small safe gutter. */
@media (max-width: 767px){
  body{padding:0!important;background:#f5f8ff!important}
  .appShell:has(.v2Home){
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  .appShell:has(.v2Home)>.content{width:100%!important;max-width:none!important}
  .v2Home{padding-left:8px!important;padding-right:8px!important}
  .v2Hero{
    width:calc(100% + 16px)!important;
    margin-left:-8px!important;
    margin-right:-8px!important;
    padding-left:12px!important;
    padding-right:12px!important;
  }
  .v2BottomNav{width:100%!important;max-width:none!important;left:0!important;transform:none!important}
}

/* Small phones: preserve the same design while keeping an edge-safe 6px gutter. */
@media (max-width: 350px){
  .v2Home{padding-left:6px!important;padding-right:6px!important}
  .v2Hero{width:calc(100% + 12px)!important;margin-left:-6px!important;margin-right:-6px!important;padding-left:10px!important;padding-right:10px!important}
}

/* Larger phones must not re-introduce the old 16px outer gutter. */
@media (min-width:412px) and (max-width:767px){
  .v2Home{padding-left:8px!important;padding-right:8px!important}
  .v2Hero{width:calc(100% + 16px)!important;margin-left:-8px!important;margin-right:-8px!important;padding-left:12px!important;padding-right:12px!important}
}

/* Desktop/tablet mode: same visual language, but comfortable on a computer. */
@media (min-width:768px){
  :root{--v2-desktop-max:860px}
  body{padding:22px 18px 30px!important;background:#eef3ff!important}
  .appShell:has(.v2Home){
    width:min(100%,var(--v2-desktop-max))!important;
    max-width:var(--v2-desktop-max)!important;
    margin:0 auto!important;
    border-radius:30px!important;
    box-shadow:0 22px 64px rgba(36,49,95,.15)!important;
    overflow:hidden!important;
  }
  .appShell:has(.v2Home)>.content{width:100%!important;max-width:100%!important}
  .v2Home{padding-left:22px!important;padding-right:22px!important;padding-bottom:100px!important}
  .v2Hero{
    width:calc(100% + 44px)!important;
    margin-left:-22px!important;
    margin-right:-22px!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }
  .v2HeroTop,.v2Greeting,.v2Search{max-width:100%!important}
  .v2Greeting h1{font-size:28px!important}
  .v2Greeting p{font-size:14px!important}
  .v2Search input{font-size:14px!important}

  /* Six existing services become a neat 3×2 desktop grid; content and actions stay unchanged. */
  .v2ServiceGrid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:12px!important}
  .v2ServiceCard{min-height:142px!important}
  .v2ServiceCard:last-child:nth-child(odd){grid-column:auto!important;min-height:142px!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-rows:auto 1fr!important;align-items:start!important}
  .v2ServiceCard:last-child:nth-child(odd) .v2ServiceIcon{grid-column:1!important;grid-row:1!important}
  .v2ServiceCard:last-child:nth-child(odd) .v2ServiceCopy{grid-column:1/-1!important;grid-row:2!important}
  .v2ServiceCard:last-child:nth-child(odd) .v2Chevron{grid-column:2!important;grid-row:1!important}

  .v2BottomNav{
    width:min(100%,var(--v2-desktop-max))!important;
    max-width:var(--v2-desktop-max)!important;
    bottom:0!important;
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
  }
}


/* =========================================================
   v37 — desktop width only
   Mobile and tablet rules above remain unchanged.
   ========================================================= */
@media (min-width:1024px){
  :root{--v2-desktop-max:1120px}
  body{padding:24px 24px 32px!important}
  .appShell:has(.v2Home){
    width:min(calc(100vw - 64px),var(--v2-desktop-max))!important;
    max-width:var(--v2-desktop-max)!important;
  }
  .v2Home{padding-left:28px!important;padding-right:28px!important}
  .v2Hero{
    width:calc(100% + 56px)!important;
    margin-left:-28px!important;
    margin-right:-28px!important;
    padding-left:30px!important;
    padding-right:30px!important;
  }
  .v2BottomNav{
    width:min(calc(100vw - 64px),var(--v2-desktop-max))!important;
    max-width:var(--v2-desktop-max)!important;
  }
}

@media (min-width:1440px){
  :root{--v2-desktop-max:1180px}
}


/* =========================================================
   v38 — desktop edge-to-edge only
   Mobile (<768px) and tablet (768–1023px) remain unchanged.
   ========================================================= */
@media (min-width:1024px){
  body{
    padding:0!important;
    background:#f5f8ff!important;
  }
  .appShell:has(.v2Home){
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    overflow-x:hidden!important;
  }
  .appShell:has(.v2Home)>.content{
    width:100%!important;
    max-width:none!important;
  }
  .v2Home{
    width:100%!important;
    max-width:none!important;
    padding-left:32px!important;
    padding-right:32px!important;
  }
  .v2Hero{
    width:calc(100% + 64px)!important;
    margin-left:-32px!important;
    margin-right:-32px!important;
    padding-left:40px!important;
    padding-right:40px!important;
    border-radius:0 0 30px 30px!important;
  }
  .v2HeroTop,.v2Greeting,.v2Search,
  .v2Challenge,.v2ServicesWrap,.v2Leaderboard,.v2Progress{
    width:100%!important;
    max-width:none!important;
  }
  .v2BottomNav{
    width:100%!important;
    max-width:none!important;
    left:0!important;
    transform:none!important;
    bottom:0!important;
    border-radius:0!important;
  }
}

@media (min-width:1440px){
  .v2Home{padding-left:44px!important;padding-right:44px!important}
  .v2Hero{
    width:calc(100% + 88px)!important;
    margin-left:-44px!important;
    margin-right:-44px!important;
    padding-left:52px!important;
    padding-right:52px!important;
  }
}

/* v39 Grade-8 visual theme — dimensions from v38 remain unchanged */
:root{--v2-purple:#5a36ef;--v2-blue:#087ef1;--v2-ink:#102247;--v2-muted:#5f7091;--v2-bg:#f7faff;--v2-green:#18c889}
body{background:#f6f9ff!important}
.v2Home{background:linear-gradient(180deg,#f8fbff 0%,#fff 56%,#f7faff 100%)!important;color:var(--v2-ink)!important}
.v2Hero{background:radial-gradient(circle at 92% 18%,rgba(67,230,211,.28),transparent 24%),radial-gradient(circle at 6% 92%,rgba(104,59,242,.28),transparent 30%),linear-gradient(128deg,#5b36ef 0%,#1f66ef 52%,#079be9 100%)!important;box-shadow:0 16px 38px rgba(30,86,207,.18)!important}
.v2Hero::before{background:radial-gradient(circle at 78% 8%,rgba(255,255,255,.18),transparent 24%),linear-gradient(150deg,transparent 65%,rgba(44,221,184,.16) 65%,rgba(44,221,184,.16) 100%)!important}
.v2Brand img{background:#fff!important;padding:4px!important;object-fit:contain!important;box-shadow:0 8px 22px rgba(25,41,115,.18)!important}.v2Brand strong{color:#fff!important}.v2Brand small{color:#f0f4ff!important}.v2Bell{background:rgba(255,255,255,.14)!important;border:1px solid rgba(255,255,255,.12)!important}.v2Avatar{box-shadow:0 5px 16px rgba(25,50,125,.18)!important;border:2px solid rgba(255,255,255,.72)!important}.v2Greeting h1{color:#fff!important;text-shadow:0 2px 10px rgba(24,54,140,.12)!important}.v2Greeting p{color:#eaf3ff!important}
.v2DateChip{position:absolute;z-index:3;right:14px;top:73px;display:flex;align-items:center;gap:7px;max-width:126px;padding:6px 9px;border:1px solid rgba(255,255,255,.28);border-radius:14px;background:rgba(255,255,255,.12);backdrop-filter:blur(10px);color:#fff;box-shadow:0 6px 18px rgba(19,55,146,.08)}
.v2DateIcon{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;background:rgba(255,255,255,.16);font-size:15px;line-height:1}.v2DateChip>span:last-child{min-width:0;display:grid;line-height:1.08}.v2DateChip b{font-size:10px;font-weight:900}.v2DateChip small{margin-top:2px;font-size:7.8px;color:#eef5ff;white-space:nowrap}
@media(max-width:350px){.v2DateChip{right:10px;top:76px;max-width:102px;padding:5px 7px;gap:5px}.v2DateIcon{width:22px;height:22px;font-size:13px}.v2DateChip b{font-size:8.5px}.v2DateChip small{font-size:6.7px}.v2Greeting{padding-right:102px}}
@media(min-width:351px) and (max-width:767px){.v2Greeting{padding-right:122px}}
@media(min-width:768px){.v2DateChip{right:24px;top:76px;max-width:145px;padding:7px 10px}.v2DateChip b{font-size:11px}.v2DateChip small{font-size:8.5px}.v2Greeting{padding-right:150px}}
@media(min-width:1024px){.v2DateChip{right:40px}}@media(min-width:1440px){.v2DateChip{right:52px}}
.v2Search{background:rgba(255,255,255,.98)!important;border-color:rgba(211,225,248,.95)!important;box-shadow:0 14px 32px rgba(35,70,151,.15)!important}.v2Search>span{color:#0c2653!important}.v2Search input{color:#20355b!important;font-weight:500}.v2Search input::placeholder{color:#6f7e9c!important}.v2Search button{color:#233b70!important}
.v2Challenge{background:linear-gradient(180deg,#fff 0%,#fff 78%,#fbfdff 100%)!important;border-color:#e5ecf7!important;box-shadow:0 12px 30px rgba(58,79,136,.08)!important}.v2Challenge::after{background:radial-gradient(circle,rgba(93,69,238,.08),rgba(31,142,241,.02) 68%,transparent 70%)!important}.v2ChallengeCopy small{color:#5639ec!important}.v2ChallengeCopy h2{color:#0f2144!important}.v2ChallengeCopy p,.v2ChallengeCopy em{color:#61708d!important}.v2ChallengeBar{background:#e4eaf4!important}.v2ChallengeBar i{background:linear-gradient(90deg,#0fc880,#44daa0)!important;box-shadow:0 2px 8px rgba(24,200,137,.24)}.v2ChallengeRing{background:conic-gradient(#16c88d 0 36%,#e9eef8 36%)!important;box-shadow:inset 0 0 0 9px #fff,0 7px 20px rgba(39,77,163,.07)!important}.v2ChallengeRing b{color:#4e32e4!important}.v2ChallengeWin{background:linear-gradient(90deg,#eefaff,#edfcf5)!important;border-color:#d4efe6!important;color:#12264a!important}
.v2SectionHead h2{color:#102247!important}.v2SectionHead button{color:#5638ef!important}.v2ServiceCard{border:1px solid rgba(222,230,244,.68)!important;box-shadow:0 9px 22px rgba(51,74,126,.07)!important;transition:transform .18s ease,box-shadow .18s ease!important}.v2ServiceCard:hover{transform:translateY(-2px)!important;box-shadow:0 14px 26px rgba(51,74,126,.11)!important}.v2ServiceCard.books{background:linear-gradient(145deg,#eef8ff,#dff0ff)!important}.v2ServiceCard.exams{background:linear-gradient(145deg,#fff4f7,#ffe7ed)!important}.v2ServiceCard.english{background:linear-gradient(145deg,#f0fff9,#e0faef)!important}.v2ServiceCard.game{background:linear-gradient(145deg,#fff9ec,#fff0cf)!important}.v2ServiceCard.gov{background:linear-gradient(145deg,#f6f2ff,#ebe6ff)!important}.v2ServiceCard.lessons{background:linear-gradient(145deg,#edfff9,#dff8ed)!important}.v2ServiceIcon{border:1px solid rgba(227,234,246,.9)!important;background:rgba(255,255,255,.93)!important;box-shadow:0 6px 15px rgba(45,66,120,.08)!important}.v2ServiceCopy b{color:#102247!important}.v2ServiceCopy small{color:#5d6e8d!important}.v2Chevron{color:#102247!important;font-weight:900}
.v2Progress{background:rgba(255,255,255,.96)!important;border-color:#e6edf8!important;box-shadow:0 9px 24px rgba(57,77,132,.055)!important}.v2SubjectStrip button,.v2SubjectCards button{border:1px solid rgba(224,231,243,.72)!important;box-shadow:0 6px 14px rgba(48,71,122,.045)!important}.v2SubjectStrip button:nth-child(1){background:linear-gradient(150deg,#fff3f5,#ffe5eb)!important}.v2SubjectStrip button:nth-child(2){background:linear-gradient(150deg,#effdf8,#dcf8ed)!important}.v2SubjectStrip button:nth-child(3){background:linear-gradient(150deg,#fff9ed,#fff0cb)!important}.v2SubjectStrip button:nth-child(4){background:linear-gradient(150deg,#edf7ff,#dfefff)!important}.v2SubjectStrip button:nth-child(5){background:linear-gradient(150deg,#f6f1ff,#eae3ff)!important}
.v2SubjectIcon{display:grid;place-items:center;min-height:24px;margin:0 auto 4px;color:#0a62d8;font-size:21px;font-weight:900;line-height:1}.v2SubjectStrip button:nth-child(1) .v2SubjectIcon{color:#f04465}.v2SubjectStrip button:nth-child(2) .v2SubjectIcon{color:#08ad7d}.v2SubjectStrip button:nth-child(3) .v2SubjectIcon{color:#ef9f00}.v2SubjectStrip button:nth-child(4) .v2SubjectIcon{color:#1689e9}.v2SubjectStrip button:nth-child(5) .v2SubjectIcon{color:#6d35e8;font-size:12px;letter-spacing:-3px}.v2SubjectStrip b,.v2SubjectCards b{color:#12254a!important}.v2SubjectStrip small,.v2SubjectCards small{color:#536889!important}.v2SubjectBar{background:#e2e9f3!important}.v2SubjectStrip button:nth-child(1) .v2SubjectBar i{background:linear-gradient(90deg,#ff4269,#f26a83)!important}.v2SubjectStrip button:nth-child(2) .v2SubjectBar i{background:linear-gradient(90deg,#02b981,#29cf9c)!important}.v2SubjectStrip button:nth-child(3) .v2SubjectBar i{background:linear-gradient(90deg,#f2a500,#ffc337)!important}.v2SubjectStrip button:nth-child(4) .v2SubjectBar i{background:linear-gradient(90deg,#0b83ee,#3da8ff)!important}.v2SubjectStrip button:nth-child(5) .v2SubjectBar i{background:linear-gradient(90deg,#6a35e7,#9d5df4)!important}
.v2BottomNav{background:rgba(255,255,255,.985)!important;border-top-color:#e2e9f4!important;box-shadow:0 -10px 28px rgba(41,63,112,.08)!important}.v2BottomNav button{color:#5d6b84!important}.v2BottomNav button>span{filter:grayscale(.88) saturate(.35);opacity:.9}.v2BottomNav button.active{color:#075fe8!important}.v2BottomNav button.active>span{filter:none;opacity:1}.v2BottomNav button.active small{font-weight:900!important}.v2BottomNav button.active::after{content:"";display:block;width:18px;height:3px;margin-top:-1px;border-radius:99px;background:#4a35ef}.v2Bell i,.v2NavBadgeWrap i{background:#ff4f5f!important;box-shadow:0 3px 8px rgba(255,79,95,.25)!important}


/* =========================================================
   v40 — finish the approved Grade-8 visual theme only.
   Keep all v38/v39 sizing and functionality unchanged.
   ========================================================= */

/* Top-right learning illustration from the approved mobile mockup. */
.v2HeroDecor{
  position:absolute;z-index:2;right:10px;top:116px;width:94px;height:62px;
  pointer-events:none;display:flex;align-items:flex-end;justify-content:flex-end;
}
.v2BookStack{position:relative;width:82px;height:56px;filter:drop-shadow(0 7px 12px rgba(22,70,142,.16))}
.v2BookStack .book{position:absolute;right:0;height:16px;border-radius:5px 7px 7px 5px;color:#fff;font-size:7.5px;line-height:16px;font-weight:900;text-align:center;letter-spacing:.01em;box-shadow:0 2px 5px rgba(28,60,120,.13)}
.v2BookStack .b1{bottom:32px;width:64px;background:linear-gradient(90deg,#ff718a,#ef4d6b)}
.v2BookStack .b2{bottom:16px;width:72px;background:linear-gradient(90deg,#ffad4c,#ff8841)}
.v2BookStack .b3{bottom:0;width:80px;background:linear-gradient(90deg,#19c9ac,#13a9bb)}
.v2Pencils{position:absolute;right:10px;bottom:46px;font-size:17px;font-style:normal;transform:rotate(-8deg)}
.v2HeroDecor>em{position:absolute;right:-2px;top:-21px;width:83px;color:#fff;font-family:"Segoe Print","Comic Sans MS",cursive;font-size:10px;font-weight:700;line-height:1.08;text-align:right;transform:rotate(-5deg);text-shadow:0 2px 6px rgba(8,65,128,.18)}

/* Keep the same header height; simply leave a visual pocket for the illustration. */
@media (min-width:351px) and (max-width:767px){
  .v2Search{width:calc(100% - 104px)!important;margin-left:0!important;margin-right:auto!important}
}
@media (max-width:350px){
  .v2HeroDecor{right:7px;top:119px;width:76px;transform:scale(.82);transform-origin:right top}
  .v2HeroDecor>em{display:none}
  .v2Search{width:calc(100% - 76px)!important;margin-left:0!important;margin-right:auto!important}
}
@media (min-width:768px){
  .v2HeroDecor{right:26px;top:105px;width:120px;height:72px;transform:scale(1.12);transform-origin:right top}
  .v2Search{width:calc(100% - 148px)!important;margin-left:0!important;margin-right:auto!important}
}
@media (min-width:1024px){
  .v2HeroDecor{right:46px;top:102px;transform:scale(1.2);transform-origin:right top}
  .v2Search{width:calc(100% - 180px)!important}
}
@media (min-width:1440px){.v2HeroDecor{right:60px}}

/* More vivid Grade-8 card palette while preserving the same layout. */
.v2ServiceCard.books{background:linear-gradient(145deg,#e1f4ff,#c9eaff)!important;border-color:#cbe8fb!important}
.v2ServiceCard.exams{background:linear-gradient(145deg,#ffeaf0,#ffd6e1)!important;border-color:#ffd5df!important}
.v2ServiceCard.english{background:linear-gradient(145deg,#e5fff2,#c9f4df)!important;border-color:#cef0df!important}
.v2ServiceCard.game{background:linear-gradient(145deg,#fff6d8,#ffe6a8)!important;border-color:#f7e2ae!important}
.v2ServiceCard.gov{background:linear-gradient(145deg,#f0eaff,#ddd2ff)!important;border-color:#ddd3fa!important}
.v2ServiceCard.lessons{background:linear-gradient(145deg,#e3fff3,#c9f1df)!important;border-color:#caeddd!important}
.v2ServiceIcon{background:#fff!important;border:0!important;box-shadow:0 7px 17px rgba(39,65,126,.11)!important}
.v2ServiceCard.books .v2ServiceIcon{box-shadow:0 7px 18px rgba(27,128,240,.18)!important}
.v2ServiceCard.exams .v2ServiceIcon{box-shadow:0 7px 18px rgba(239,76,111,.17)!important}
.v2ServiceCard.english .v2ServiceIcon,.v2ServiceCard.lessons .v2ServiceIcon{box-shadow:0 7px 18px rgba(16,173,119,.17)!important}
.v2ServiceCard.game .v2ServiceIcon{box-shadow:0 7px 18px rgba(232,159,19,.18)!important}
.v2ServiceCard.gov .v2ServiceIcon{box-shadow:0 7px 18px rgba(101,67,224,.17)!important}

/* Real subject cover images instead of generic glyphs. */
.v2SubjectIcon{width:34px!important;height:34px!important;min-height:34px!important;margin:0 auto 5px!important;border-radius:10px!important;overflow:hidden!important;background:#fff!important;box-shadow:0 5px 12px rgba(42,64,118,.11)!important;padding:0!important}
.v2SubjectThumb{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important;border-radius:10px!important}
.v2SubjectStrip button:nth-child(1){background:linear-gradient(150deg,#ffecef,#ffdce4)!important}
.v2SubjectStrip button:nth-child(2){background:linear-gradient(150deg,#e7fbf3,#cef3e2)!important}
.v2SubjectStrip button:nth-child(3){background:linear-gradient(150deg,#fff5db,#ffe7aa)!important}
.v2SubjectStrip button:nth-child(4){background:linear-gradient(150deg,#e5f3ff,#cfe7ff)!important}
.v2SubjectStrip button:nth-child(5){background:linear-gradient(150deg,#f0e9ff,#dfd1ff)!important}

/* Brighter progress accents. */
.v2ChallengeBar i{background:linear-gradient(90deg,#08bd7a,#29dc9b)!important}
.v2ChallengeRing{background:conic-gradient(#00c88c 0 36%,#e8edf7 36%)!important}
.v2ChallengeWin{background:linear-gradient(90deg,#e7f9ff,#e6fbf1)!important;border-color:#c9ecdf!important}

/* Bottom navigation treatment from the approved reference. */
.v2BottomNav{
  background:#fff!important;
  border-top:1px solid #e0e8f3!important;
  border-radius:24px 24px 0 0!important;
  box-shadow:0 -12px 30px rgba(35,57,108,.12)!important;
  padding-top:7px!important;
}
.v2BottomNav button{color:#5c687d!important;gap:4px!important}
.v2BottomNav button>span{font-size:22px!important;filter:grayscale(.92) saturate(.2)!important;opacity:.92!important}
.v2BottomNav button.active{color:#075fe8!important}
.v2BottomNav button.active>span{filter:none!important;opacity:1!important;transform:scale(1.08)!important}
.v2BottomNav button.active::after{width:22px!important;height:3px!important;background:#3f36f1!important}

/* Student avatar and date chip read more clearly at a glance. */
.v2Avatar{font-size:18px!important;background:#fff!important}
.v2DateIcon{background:rgba(255,255,255,.2)!important}
.v2DateChip{background:rgba(255,255,255,.14)!important;border-color:rgba(255,255,255,.34)!important;box-shadow:0 8px 18px rgba(13,57,140,.12)!important}

/* v41 — SUBJECT CARDS ONLY: textbook-cover presentation */
.v2Progress .v2SubjectStrip.v2SubjectCards{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
@media(min-width:640px){
  .v2Progress .v2SubjectStrip.v2SubjectCards{grid-template-columns:repeat(4,minmax(0,1fr))!important}
}
.v2Progress .v2SubjectStrip.v2SubjectCards button{
  min-height:148px!important;
  padding:10px 5px 9px!important;
  border-radius:16px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
}
.v2Progress .v2SubjectStrip.v2SubjectCards .v2SubjectIcon{
  width:58px!important;
  height:76px!important;
  min-height:76px!important;
  margin:0 auto 7px!important;
  border-radius:9px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:0 6px 14px rgba(36,55,102,.16)!important;
  padding:0!important;
}
.v2Progress .v2SubjectStrip.v2SubjectCards .v2SubjectThumb{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  border-radius:9px!important;
}
.v2Progress .v2SubjectStrip.v2SubjectCards b{
  min-height:auto!important;
  margin:0 0 7px!important;
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:900!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  max-width:100%!important;
}
.v2Progress .v2SubjectStrip.v2SubjectCards .v2SubjectBar{
  width:100%!important;
  height:7px!important;
  margin:0 0 6px!important;
}
.v2Progress .v2SubjectStrip.v2SubjectCards small{
  font-size:10px!important;
  line-height:1!important;
  font-weight:800!important;
}

@media(max-width:480px){
  .v2Progress .v2SubjectStrip.v2SubjectCards{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards button{min-height:130px!important;padding:8px 3px 7px!important;border-radius:14px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards .v2SubjectIcon{width:46px!important;height:61px!important;min-height:61px!important;margin-bottom:6px!important;border-radius:8px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards .v2SubjectThumb{border-radius:8px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards b{font-size:9.5px!important;margin-bottom:6px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards .v2SubjectBar{height:6px!important;margin-bottom:5px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards small{font-size:8.5px!important}
}

@media(min-width:1024px){
  .v2Progress .v2SubjectStrip.v2SubjectCards{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards button{min-height:168px!important;padding:12px 8px 10px!important;border-radius:18px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards .v2SubjectIcon{width:68px!important;height:88px!important;min-height:88px!important;margin-bottom:8px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards b{font-size:13px!important}
  .v2Progress .v2SubjectStrip.v2SubjectCards small{font-size:10.5px!important}
}

/* v42-fix5: Home subject section removed by request */
.v2Home > .v2Progress{display:none!important}


/* v43 — only two requested refinements: bottom dock mask + 3 background choices */
.v2BottomNav{isolation:isolate;overflow:visible!important}
:root[data-guul-theme="soft"]{--guul-page-bg:#fffdf8;--guul-page-bg-2:#f8fbff}
:root[data-guul-theme="mint"]{--guul-page-bg:#f2fbf7;--guul-page-bg-2:#f8fffc}
:root[data-guul-theme="lavender"]{--guul-page-bg:#f3f5ff;--guul-page-bg-2:#faf9ff}
html[data-guul-theme] body:has(.v2Home){background:var(--guul-page-bg)!important}
html[data-guul-theme] .appShell:has(.v2Home),
html[data-guul-theme] .appShell:has(.v2Home)>.content{background:var(--guul-page-bg)!important}
html[data-guul-theme] .v2Home{background:linear-gradient(180deg,var(--guul-page-bg-2) 0%,var(--guul-page-bg) 48%,var(--guul-page-bg-2) 100%)!important}

.v2ThemeChooser{
  width:min(220px,62vw);
  margin:8px auto 8px;
  padding:5px 10px;
  display:flex;
  align-items:center;
  justify-content:space-around;
  gap:14px;
  border:1px solid rgba(219,226,240,.86);
  border-radius:999px;
  background:rgba(255,255,255,.78);
  box-shadow:0 7px 20px rgba(42,62,108,.07);
  backdrop-filter:blur(12px);
}
.v2ThemeChooser button{
  appearance:none;
  width:24px;
  height:24px;
  padding:0;
  border:3px solid #fff;
  border-radius:50%;
  cursor:pointer;
  box-shadow:0 0 0 1px #dbe2ef,0 4px 10px rgba(40,58,104,.13);
  transition:transform .16s ease,box-shadow .16s ease;
}
.v2ThemeChooser button.themeSoft{background:linear-gradient(135deg,#fffdf8,#f2f6ff)}
.v2ThemeChooser button.themeMint{background:linear-gradient(135deg,#dff8ec,#f4fff9)}
.v2ThemeChooser button.themeLavender{background:linear-gradient(135deg,#e5e8ff,#f7f1ff)}
.v2ThemeChooser button.active{transform:scale(1.16);box-shadow:0 0 0 2px #6544ee,0 5px 13px rgba(74,53,239,.2)}
.v2ThemeChooser button:focus-visible{outline:3px solid rgba(74,53,239,.26);outline-offset:3px}

@media(max-width:767px){
  .v2BottomNav{bottom:0!important}
  .v2Home{padding-bottom:calc(86px + env(safe-area-inset-bottom))!important}
  .v2BottomNav::before{
    content:"";
    position:absolute;
    z-index:-1;
    left:0;
    right:0;
    top:18px;
    bottom:calc(-18px - env(safe-area-inset-bottom));
    background:#fff;
  }
  .v2ThemeChooser{width:min(190px,58vw);margin-top:7px;margin-bottom:7px;padding:4px 9px}
  .v2ThemeChooser button{width:22px;height:22px}
}


/* v50 — ONLY the page background changes with the 3 theme buttons.
   All service cards, icons, text colors, challenge/search cards and bottom navigation keep the approved original design. */
:root[data-guul-theme="soft"]{
  --guul-page-bg:#fff5df;
  --guul-page-bg-2:#fffaf0;
}
:root[data-guul-theme="lavender"]{
  --guul-page-bg:#eee8ff;
  --guul-page-bg-2:#f8f4ff;
}
:root[data-guul-theme="mint"]{
  --guul-page-bg:#e7fff4;
  --guul-page-bg-2:#f5fffb;
}
html[data-guul-theme] body:has(.v2Home),
html[data-guul-theme] .appShell:has(.v2Home),
html[data-guul-theme] .appShell:has(.v2Home)>.content{
  background:var(--guul-page-bg)!important;
}
html[data-guul-theme] .v2Home{
  background:linear-gradient(180deg,var(--guul-page-bg-2) 0%,var(--guul-page-bg) 48%,var(--guul-page-bg-2) 100%)!important;
}
/* Theme-picker previews: warm ivory, mint, lavender. */
.v2ThemeChooser button.themeSoft{background:#fff1cd!important}
.v2ThemeChooser button.themeMint{background:#c9f6e1!important}
.v2ThemeChooser button.themeLavender{background:#ded7ff!important}
/* Keep the approved header layout (menu icon hidden). */
.v2MenuGlyph{display:none!important}
.v2HeroTop{grid-template-columns:minmax(0,1fr) auto!important}
.v2Avatar.isEmoji{font-size:18px!important}
/* At 100%, use a fully green disc and move the text slightly upward. */
.v2ChallengeRing.isFull{
  background:linear-gradient(145deg,#35d996 0%,#20c981 58%,#12b970 100%)!important;
  box-shadow:0 9px 23px rgba(20,185,111,.22),0 0 0 8px rgba(43,211,140,.10)!important;
}
.v2ChallengeRing.isFull b,
.v2ChallengeRing.isFull span{
  display:block!important;
  position:relative!important;
  top:-4px!important;
  transform:none!important;
}
.v2ChallengeRing.isFull b{
  color:#087548!important;
  font-size:20px!important;
  line-height:1!important;
  margin:0!important;
}
.v2ChallengeRing.isFull span{
  color:#0b7047!important;
  font-weight:800!important;
  margin-top:2px!important;
}