@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800;900&family=Spectral:wght@500;600;700;800&display=swap');

:root{
  --eg-bg:#0b1028;
  --eg-bg-2:#0e1330;
  --eg-panel:#101733;
  --eg-panel-2:#141b3a;
  --eg-card:#141b3a;
  --eg-card-2:#101733;
  --eg-ink:#eaecf7;
  --eg-muted:#9aa3c7;
  --eg-line:#262f57;
  --eg-cyan:#46c6c6;
  --eg-gold:#c9a24a;
  --eg-gold-2:#e3c877;
  --eg-violet:#6b4fb0;
  --eg-coral:#ff7a4d;
  --eg-ok:#46d39a;
  --eg-shadow:0 24px 68px rgba(0,0,0,.38);

  --bg:var(--eg-bg);
  --bg2:var(--eg-panel);
  --card:var(--eg-card);
  --card2:var(--eg-card-2);
  --ink:var(--eg-ink);
  --muted:var(--eg-muted);
  --line:var(--eg-line);
  --accent:var(--eg-cyan);
  --accent2:var(--eg-violet);
  --gold:var(--eg-gold-2);
  --ok:var(--eg-ok);
  --warn:var(--eg-gold-2);
  --shadow:var(--eg-shadow);
}

*{box-sizing:border-box}
html{background:var(--eg-bg)}
body{
  font-family:Manrope,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif!important;
  background:
    radial-gradient(900px 520px at 82% -8%, rgba(70,198,198,.13) 0%, transparent 55%),
    radial-gradient(760px 560px at -12% 110%, rgba(107,79,176,.16) 0%, transparent 55%),
    linear-gradient(180deg,var(--eg-bg-2),var(--eg-bg))!important;
  color:var(--eg-ink);
}
h1,h2,h3,.name,.title,.t,.utitle,.kid-name,.zone-title,.section-title{font-family:Spectral,Georgia,serif;letter-spacing:-.015em}
a{color:inherit}

.eg-brand,.brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--eg-ink)}
.eg-brand img,.brand img{filter:drop-shadow(0 3px 12px rgba(70,198,198,.35))}

.card,.hero,.zone,.unit,.mat,.tile,.widget,.challenge,.deck,.kid-card,.subject-hero{
  border-color:var(--eg-line)!important;
  box-shadow:0 18px 48px rgba(0,0,0,.22);
}
.card,.zone,.tile,.widget,.mat,.unit,.deck,.kid-card{
  background:linear-gradient(180deg,var(--eg-card),var(--eg-card-2))!important;
}
.go,.save,a.play,.deck .play,.btn.primary,.wgo,.challenge .cta,.kid-actions a,.parent-actions a:hover{
  background:linear-gradient(180deg,var(--eg-gold-2),var(--eg-gold))!important;
  color:#2a1e08!important;
  box-shadow:0 12px 30px rgba(201,162,74,.22);
}
.tile:hover,.mat:hover,.challenge:hover{border-color:var(--eg-cyan)!important}

.eg-shell{width:min(1180px,calc(100% - 28px));margin-inline:auto}
.eg-topline{display:flex;align-items:center;gap:16px;justify-content:space-between;margin-bottom:18px}
.eg-section-title{display:flex;align-items:center;gap:10px;margin:26px 2px 14px;font-family:Spectral,Georgia,serif;font-weight:800;font-size:20px;color:var(--eg-ink)}
.eg-section-title .eg-chip{margin-left:auto;font-family:Manrope,sans-serif;font-size:11px;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:6px 10px;border:1px solid rgba(227,200,119,.28);color:var(--eg-gold-2);background:rgba(201,162,74,.08)}
.eg-icon-img{width:58px;height:58px;object-fit:contain;display:block;filter:drop-shadow(0 8px 18px rgba(0,0,0,.32))}
.eg-badge-img{width:34px;height:34px;object-fit:contain;display:block}
.eg-wallet{display:flex;gap:8px;flex-wrap:wrap}
.eg-pill{background:rgba(255,255,255,.045);border:1px solid var(--eg-line);border-radius:13px;padding:8px 12px;text-align:center;min-width:70px}
.eg-pill strong{display:block;font-family:Spectral,Georgia,serif;color:var(--eg-gold-2);font-size:20px;line-height:1}.eg-pill span{font-size:11px;color:var(--eg-muted);font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.eg-activity{display:flex;flex-direction:column;gap:7px}.eg-activity-row{background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:8px 10px;color:var(--eg-muted);font-size:12px;line-height:1.28}.eg-activity-row b{display:block;color:var(--eg-ink);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* V3.1 home parent */
.parent-cockpit.on{display:block!important}.parent-cockpit{padding:20px!important}.kids-grid{display:flex!important;flex-direction:column!important;gap:14px!important}.kid-card{display:grid!important;grid-template-columns:230px 1fr 275px 150px!important;gap:18px!important;align-items:stretch!important;border-left:4px solid var(--kid-color,var(--eg-cyan))!important;border-radius:18px!important}.kid-top{align-items:flex-start!important}.kid-emoji{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:#0e1533;border:1px solid var(--kid-color,var(--eg-cyan));font-size:30px!important;flex:0 0 auto}.kid-meta{color:var(--eg-muted);font-size:12px;line-height:1.35}.kid-week{grid-template-columns:repeat(8,1fr)!important;align-items:end}.kid-day{min-height:58px;display:flex;flex-direction:column;justify-content:end}.kid-actions{align-content:end}.kid-actions a{background:linear-gradient(180deg,var(--eg-gold-2),var(--eg-gold))!important;color:#2a1e08!important}.kid-actions a.secondary{background:rgba(255,255,255,.04)!important;color:var(--eg-muted)!important;border:1px solid var(--eg-line)!important}
@media(max-width:980px){.kid-card{grid-template-columns:1fr!important}.kid-week{grid-template-columns:repeat(8,1fr)!important}.eg-wallet{margin-top:8px}}
@media(max-width:560px){.eg-shell{width:min(100% - 22px,1180px)}.kid-week{grid-template-columns:repeat(4,1fr)!important}.eg-icon-img{width:48px;height:48px}.eg-topline{align-items:flex-start}.hero .name{font-size:2rem!important}}

/* V3.1 subject/programme */
.subject-hero{border-left:4px solid var(--eg-cyan)!important}.subject-hero h1{font-family:Spectral,Georgia,serif!important}.switch button.on,.pf.on{background:linear-gradient(180deg,var(--eg-gold-2),var(--eg-gold))!important;color:#2a1e08!important;border-color:transparent!important;font-weight:900}.deck .t{font-family:Spectral,Georgia,serif;font-size:16px}.decks{grid-template-columns:1fr!important}.deck{display:grid!important;grid-template-columns:44px 1fr 190px 135px!important;align-items:center!important;gap:14px!important}.deck .meta{min-width:0}.deck .play{justify-self:end}.eg-chapter-num{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-family:Spectral,Georgia,serif;font-weight:800;background:rgba(70,198,198,.14);border:1px solid rgba(70,198,198,.28);color:var(--eg-ink)}
@media(max-width:760px){.deck{grid-template-columns:40px 1fr!important}.deck .meta,.deck .play{grid-column:2}.deck .play{justify-self:start}}


/* v0.9.9 — Programme rows: keep CTAs inside chapter rows on V3.1 pages. */
.deck{grid-template-columns:44px minmax(0,1fr) minmax(130px,170px) minmax(104px,124px)!important;overflow:hidden!important}
.deck .play{max-width:124px!important;width:100%!important;padding:8px 10px!important;text-align:center!important}
.deck > div:last-child{min-width:0!important;max-width:124px!important;justify-self:end!important}
@media(max-width:760px){.deck > div:last-child{grid-column:2!important;justify-self:start!important;max-width:160px!important}.deck .play{max-width:160px!important}}


/* v0.10.0 — P1 V3.1 harmonisation for legacy static pages. */
body{font-family:Manrope,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif!important;background:radial-gradient(1000px 620px at 82% -12%,rgba(70,198,198,.18),transparent 58%),radial-gradient(760px 540px at -8% 108%,rgba(107,79,176,.24),transparent 60%),var(--bg,#0b1028)!important}
h1,h2,h3,.eg-title{font-family:Spectral,Georgia,serif;letter-spacing:-.025em}.back{display:inline-flex;align-items:center;gap:8px;color:var(--eg-muted,#9aa6d4)!important;text-decoration:none!important;font-weight:900}.back::before{content:"";width:18px;height:18px;background:url('/assets-edugame/brand/logo-mark.png') center/contain no-repeat;filter:drop-shadow(0 4px 9px rgba(0,0,0,.28))}.eg-page-icon,.em img,.ic img,.avatar img,.badge-img{width:100%;height:100%;object-fit:contain;display:block}.eg-page-icon{width:42px;height:42px;filter:drop-shadow(0 9px 18px rgba(0,0,0,.28))}.eg-title-row{display:flex;align-items:center;gap:12px;margin:12px 0 6px}.eg-title-row h1{margin:0!important}.eg-chip{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--eg-line,#2c3766);background:rgba(255,255,255,.045);border-radius:999px;padding:6px 10px;font-weight:900;font-size:.76rem;color:var(--eg-muted,#9aa6d4)}.mod .em,.item .ic,.best .em{width:44px;height:44px;min-width:44px;border-radius:15px;background:linear-gradient(180deg,rgba(70,198,198,.14),rgba(255,255,255,.035));border:1px solid rgba(70,198,198,.24);display:grid;place-items:center;overflow:hidden;font-size:0!important}.mod .em img,.item .ic img,.best .em img{width:74%;height:74%;object-fit:contain}.badge .e,.tro .e,.b .em{font-size:0!important}.badge .e img,.tro .e img,.b .em img{width:54px;height:54px;object-fit:contain}.b .em img{margin:auto}.hero,.summary,.card,.b,.mod,.item,.box{box-shadow:0 18px 50px rgba(0,0,0,.28)!important}.save,.btn,.play,.state.ok{background:linear-gradient(135deg,var(--eg-violet,#6b4fb0),var(--eg-cyan,#46c6c6))!important;color:#fff!important}@media(max-width:560px){.eg-title-row{align-items:flex-start}.eg-page-icon{width:36px;height:36px}.mod .em,.item .ic,.best .em{width:38px;height:38px;min-width:38px}}


/* v0.10.0 hotfix — badge icons must never inherit native 512px asset size. */
.eg-badge-icon{width:28px!important;height:28px!important;min-width:28px!important;object-fit:contain!important;display:inline-block!important;vertical-align:middle;filter:drop-shadow(0 4px 9px rgba(0,0,0,.22))}.eg-badge-icon:not(.on){opacity:.38;filter:grayscale(1)}.badges{align-items:center}.mod{min-height:74px!important}.mod .badges{min-width:96px}
@media(max-width:560px){.eg-badge-icon{width:24px!important;height:24px!important;min-width:24px!important}.mod .badges{min-width:0}}
