:root{
  --bg:#f6f5ff;--card:#fff;--navy:#07133f;--text:#384467;--muted:#70779a;
  --purple:#5742e8;--purple2:#4730cd;--soft:#efecff;--border:#e1def2;
  --shadow:0 18px 45px rgba(20,24,70,.08);--green:#168044;--orange:#e67800;
}

/* ===== HatchElite background upgrade pack ===== */
:root{
  --he-bg-main:url("assets/assets_webp/backgrounds/bg_main_navy_glow.webp");
  --he-bg-stars:url("assets/assets_webp/game/effects/03_gold_sparkle_cluster.webp");
  --he-bg-bubbles:url("assets/assets_webp/game/effects/12_soft_dotted_side_pattern.webp");
  --he-profile-castle:url("assets/assets_webp/backgrounds/bg_profile_castle_panel.webp");
  --he-atmosphere-card:#fff;
  --he-atmosphere-border:rgba(213,207,244,.92);
  --he-atmosphere-shadow:0 18px 44px rgba(6,13,48,.18);
}
html,
body{
  min-height:100%;
}
body{
  background-color:#020b2d!important;
  background-image:
    radial-gradient(circle at 50% 0%,rgba(114,85,255,.32),transparent 28%),
    var(--he-bg-main)!important;
  background-size:cover!important;
  background-position:center top!important;
  background-attachment:fixed!important;
}
body::before,
body::after{
  content:"";
  position:fixed;
  inset:78px 0 0;
  pointer-events:none;
  z-index:0;
}
body::before{
  background-image:
    var(--he-bg-stars),
    var(--he-bg-stars);
  background-repeat:no-repeat,no-repeat;
  background-position:left 5vw top 9vh,right 6vw top 22vh;
  background-size:150px auto,126px auto;
  opacity:.58;
}
body::after{
  background-image:var(--he-bg-bubbles);
  background-repeat:no-repeat;
  background-position:center top;
  background-size:100% 100%;
  opacity:.34;
}
.app-shell,
main,
.page{
  position:relative;
  z-index:1;
}
.app-shell,
main{
  background:transparent!important;
}
.topbar,
.topbar.app-header,
body.game-route-mode .topbar.app-header,
body.dragon-studio-mode .topbar.app-header{
  background:#fff!important;
  border-bottom:1px solid rgba(221,216,244,.9)!important;
  box-shadow:0 4px 18px rgba(8,13,50,.08)!important;
  z-index:30!important;
}
.page,
#homePage.page,
#levelPage.page,
.study-page,
.profile-page,
.dragon-studio-page,
.buy-egg-page,
.dragon-collection-page,
.badges-page,
.help-center-page{
  background:transparent!important;
}
.hero h1,
.hero p,
.level-hero h1,
.level-hero p,
.game-hero h2,
.game-hero p{
  color:#fff!important;
  text-shadow:0 10px 28px rgba(0,0,0,.25);
}
.info-pill,
.free-banner{
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(223,218,255,.82)!important;
  box-shadow:0 14px 32px rgba(4,10,40,.16)!important;
}
.decor.dots{
  background-image:radial-gradient(rgba(150,113,255,.95) 2px,transparent 2px)!important;
  opacity:.78!important;
}
.decor.circle-left,
.decor.circle-right{
  border:1px solid rgba(142,118,255,.32)!important;
  background:rgba(102,80,238,.12)!important;
  box-shadow:0 0 40px rgba(102,80,238,.16)!important;
}
.panel,
.exam-card,
.level-card,
.feature-strip,
.feature-row,
.full-access-unlocks,
.pricing-comparison,
.plan-summary-strip,
.modal,
.modal-content,
.summary-card,
.study-promo-card,
.sidebar-action-card,
.main-study-card,
.progress-panel,
.review-panel,
.badge-mini,
.mini-test,
.profile-dash-hero,
.profile-dash-card,
.leader-mini-card,
.invite-mini-card,
.dash-stat-tile,
.profile-settings-group,
.profile-help-search,
.profile-help-questions button,
.hatchelite-game-card,
.he-featured-game-card,
.he-daily-reward-card,
.ds-dashboard .ds-card,
.ds-dashboard .ds-summary-row article,
.ds-dashboard .ds-summary-row button,
.ds-dashboard .ds-gallery-tile,
.ds-dashboard .ds-feed-item,
.ds-dashboard .meta-pill{
  background-color:var(--he-atmosphere-card)!important;
  border-color:var(--he-atmosphere-border)!important;
  box-shadow:var(--he-atmosphere-shadow)!important;
}
.home-page .premium-feature-row,
.home-page .home-strip,
.full-access-unlocks,
.profile-dash-hero,
.learning-snapshot-card,
.profile-account-card,
.profile-help-card{
  border-radius:22px!important;
}
.profile-approved-dashboard{
  position:relative!important;
  max-width:1380px!important;
}
.profile-approved-dashboard::before,
.profile-approved-dashboard::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:-1;
}
.profile-approved-dashboard::before{
  width:130px;
  height:130px;
  left:-72px;
  top:92px;
  background:var(--he-bg-stars) center/contain no-repeat;
  opacity:.54;
}
.profile-approved-dashboard::after{
  width:220px;
  height:220px;
  right:-120px;
  top:250px;
  border:1px solid rgba(154,128,255,.28);
  border-radius:50%;
  background:rgba(100,76,220,.12);
  box-shadow:0 0 58px rgba(107,81,230,.12);
}
.profile-dash-hero{
  overflow:hidden!important;
  border-radius:24px!important;
}
.profile-dash-hero::after{
  content:"";
  position:absolute;
  right:24px;
  bottom:14px;
  width:110px;
  height:70px;
  background:var(--he-bg-stars) center/contain no-repeat;
  opacity:.24;
  pointer-events:none;
}
.profile-studio-card{
  min-height:312px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  border-color:rgba(177,161,255,.8)!important;
}
.profile-studio-card::before{
  background-image:var(--he-profile-castle)!important;
  background-size:cover!important;
  background-position:center right!important;
}
.profile-studio-card::after{
  background:
    linear-gradient(90deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.88) 34%,rgba(255,255,255,.2) 58%,rgba(9,15,62,.22) 100%)!important;
}
.profile-studio-card .profile-card-heading h3,
.profile-studio-card .profile-studio-copy h4,
.profile-studio-card .profile-xp-row,
.profile-studio-card .profile-xp-row b,
.profile-studio-card .profile-badge-strip>span{
  color:#081247!important;
  text-shadow:none!important;
}
.profile-studio-card .profile-studio-copy p,
.profile-studio-card .profile-studio-copy small{
  color:#172054!important;
}
.profile-studio-card .profile-kicker{
  background:linear-gradient(180deg,#7258f7,#5437df)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.36)!important;
}
.profile-studio-card .profile-xp-bar{
  background:rgba(85,70,160,.18)!important;
}
.profile-studio-card .profile-xp-bar i{
  background:linear-gradient(90deg,#6c55f2,#9d84ff)!important;
}
.profile-studio-card .profile-badge-strip{
  background:rgba(5,14,58,.9)!important;
  border-top:1px solid rgba(255,255,255,.18)!important;
}
.profile-studio-card .profile-badge-strip>span{
  color:#fff!important;
}
.profile-studio-card .profile-badge-strip::before{
  background:var(--he-bg-stars) center/contain no-repeat!important;
  opacity:.2!important;
}
.he-games-select-page,
.he-game-route,
.dragon-studio-v2,
.dragon-studio-v2.ds-dashboard,
body.game-route-mode .study-page{
  background:transparent!important;
}
.he-games-select-page::before,
.he-game-route::before,
.dragon-studio-v2.ds-dashboard::before{
  background-image:
    var(--he-bg-stars),
    var(--he-bg-bubbles)!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:left 5% top 8%,right top!important;
  background-size:128px auto,100% 100%!important;
  opacity:.26!important;
}
.ds-dashboard .ds-card{
  background-color:rgba(255,255,255,.94)!important;
}
.footer{
  color:rgba(238,242,255,.76)!important;
  background:transparent!important;
}
.footer button{
  color:#d4ccff!important;
}

/* Unified dark fantasy game page system. Logic and markup stay unchanged. */
:root{
  --game-page-bg-top:#08152f;
  --game-page-bg-mid:#0a1b3d;
  --game-page-bg-bot:#091733;
  --game-card-dark-top:rgba(9,21,50,.98);
  --game-card-dark-bot:rgba(11,26,60,.98);
  --game-panel-light:#fdfdff;
  --game-panel-border:rgba(188,196,238,.35);
  --game-line-soft:rgba(138,150,234,.22);
  --game-text-light:#f7f8ff;
  --game-text-muted:#c9d1ff;
  --game-text-dark:#17234c;
  --game-purple-1:#8a73ff;
  --game-purple-2:#5d4eff;
}

.hatchelite-game-page.stoke-fire-page,
.hatchelite-game-page.forge-scale-page,
.hatchelite-game-page.dragon-flight-page,
.hatchelite-game-page.hatchery-match-page,
.hatchelite-game-page.term-definition-page,
.hatchelite-game-page.dragons-whisper-page{
  min-height:100vh!important;
  background:
    radial-gradient(circle at 12% 18%,rgba(114,88,255,.16),transparent 22%),
    radial-gradient(circle at 88% 20%,rgba(140,160,255,.08),transparent 20%),
    linear-gradient(180deg,var(--game-page-bg-top) 0%,var(--game-page-bg-mid) 50%,var(--game-page-bg-bot) 100%)!important;
  color:var(--game-text-light)!important;
}
.hatchelite-game-page.stoke-fire-page:before,
.hatchelite-game-page.forge-scale-page:before,
.hatchelite-game-page.dragon-flight-page:before,
.hatchelite-game-page.hatchery-match-page:before,
.hatchelite-game-page.term-definition-page:before,
.hatchelite-game-page.dragons-whisper-page:before{
  content:""!important;
  position:absolute!important;
  inset:72px 0 0!important;
  background-image:
    url("assets/assets_webp/game/effects/03_gold_sparkle_cluster.webp"),
    url("assets/assets_webp/game/effects/11_background_star_pattern.webp")!important;
  background-size:520px auto,560px auto!important;
  background-position:left 2% top 18px,right 7% top 80px!important;
  background-repeat:repeat,repeat!important;
  opacity:.15!important;
  pointer-events:none!important;
}

.hatchelite-game-page .he-game-topbar{
  background:#fff!important;
  border-bottom:1px solid #e9e5ff!important;
  box-shadow:0 8px 24px rgba(4,10,30,.08)!important;
}
.hatchelite-game-page .he-game-topbar nav button,
.hatchelite-game-page .he-game-topbar .he-game-brand{
  color:var(--he-navy)!important;
}

.stoke-title-block h1,.forge-title-block h1,.flight-title-block h1,
.hatchery-title-block h1,.term-title-block h1,.whisper-title-block h1{
  color:#fff!important;
  text-shadow:0 8px 24px rgba(0,0,0,.28)!important;
}
.stoke-title-block p,.forge-title-block p,.flight-title-block p,
.hatchery-title-block p,.term-title-block p,.whisper-title-block p{
  color:#e9ecff!important;
}

.stoke-stat-pill,.forge-stat-pill,.flight-stat-pill,
.hatchery-stat-pill,.term-stat-pill,.whisper-stat-pill,
.hatchelite-game-page .game-how-button{
  background:rgba(10,23,52,.82)!important;
  border:1px solid rgba(138,150,234,.24)!important;
  border-radius:999px!important;
  color:var(--game-text-light)!important;
  box-shadow:0 8px 18px rgba(0,0,0,.18)!important;
}
.stoke-stat-pill b,.forge-stat-pill b,.flight-stat-pill b,
.hatchery-stat-pill b,.term-stat-pill b,.whisper-stat-pill b,
.stoke-stat-pill strong,.forge-stat-pill strong,.flight-stat-pill strong,
.hatchery-stat-pill strong,.term-stat-pill strong,.whisper-stat-pill strong{
  color:#fff!important;
}

.stoke-board,.forge-board,.flight-board,.hatchery-board,.term-board,.whisper-board{
  background:var(--game-panel-light)!important;
  border:1px solid var(--game-panel-border)!important;
  border-radius:28px!important;
  box-shadow:0 24px 50px rgba(5,12,35,.34)!important;
  color:var(--game-text-dark)!important;
}
.flight-board:before{
  opacity:.56!important;
}

.stoke-panel,.forge-panel,.flight-panel,.hatchery-panel,.term-panel,.whisper-panel,
.stoke-encouragement,.flight-reward-card,.term-reward-card,.whisper-reward-card,
.hatchelite-game-page .game-visual-card,
.stoke-right-col .game-practice-controls,
.forge-right-col .game-practice-controls,
.flight-right-col .game-practice-controls,
.hatchery-right-col .game-practice-controls,
.term-right-col .game-practice-controls,
.whisper-right-col .game-practice-controls,
.stoke-word-list-button,.forge-word-list-button,.flight-word-list-button,
.hatchery-word-list-button,.term-word-list-button,.whisper-word-list-button{
  background:linear-gradient(180deg,var(--game-card-dark-top),var(--game-card-dark-bot))!important;
  border:1px solid var(--game-line-soft)!important;
  color:var(--game-text-light)!important;
  box-shadow:0 12px 28px rgba(4,10,30,.30)!important;
}
.hatchelite-game-page .game-visual-card{
  border-radius:22px!important;
}
.hatchelite-game-page .game-visual-card img{
  background:#0c1738!important;
}
.stoke-panel h2,.forge-panel h2,.flight-panel h2,.hatchery-panel h2,.term-panel h2,.whisper-panel h2,
.treasure-progress-card.treasure-rewards-card h2,
.whisper-path-card>b,.treasure-progress-card>b,.nursery-goal-panel>b,
.armor-progress-count,.flight-progress-bar b,.term-reward-card span b,
.whisper-reward-card b,.whisper-reward-card span{
  color:#fff!important;
}
.stoke-panel p,.forge-panel p,.flight-panel p,.hatchery-panel p,.term-panel p,.whisper-panel p,
.stoke-step p,.forge-step p,.flight-step p,.hatchery-step p,.term-step p,.whisper-step p,
.stoke-encouragement span,.flight-reward-card span,.term-reward-card span,.whisper-reward-card p,
.hatchelite-game-page .game-practice-controls label,
.hatchelite-game-page .game-practice-controls small{
  color:var(--game-text-muted)!important;
}

.stoke-right-col .game-practice-controls select,
.forge-right-col .game-practice-controls select,
.flight-right-col .game-practice-controls select,
.hatchery-right-col .game-practice-controls select,
.term-right-col .game-practice-controls select,
.whisper-right-col .game-practice-controls select{
  background:rgba(7,14,37,.78)!important;
  border-color:rgba(151,162,238,.28)!important;
  color:#fff!important;
}

.stoke-hint-button,.forge-hint-button,.flight-hint-button,.hatchery-hint-button,.term-hint-button,.whisper-hint-button,
.stoke-right-col .game-practice-controls button,
.forge-right-col .game-practice-controls button,
.flight-right-col .game-practice-controls button,
.hatchery-right-col .game-practice-controls button,
.term-right-col .game-practice-controls button,
.whisper-right-col .game-practice-controls button,
.ignite-button,.forge-button,.send-soaring-button,.term-check-button,.translate-whisper-button.primary-whisper-submit{
  background:linear-gradient(180deg,var(--game-purple-1) 0%,var(--game-purple-2) 100%)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 12px 26px rgba(95,78,255,.32)!important;
}
.stoke-word-list-button,.forge-word-list-button,.flight-word-list-button,
.hatchery-word-list-button,.term-word-list-button,.whisper-word-list-button{
  color:#dcd7ff!important;
}

.stoke-action-bar,.forge-action-bar,.hatchery-progress-strip{
  background:#f8f7ff!important;
  border:1px solid #e7e2ff!important;
}
.term-reset-button,.hatchery-ghost-button,.listen-again-button,.reset-whisper-button{
  background:#fff!important;
  color:#6546f3!important;
  border:1.5px solid #7c4dff!important;
  box-shadow:0 10px 22px rgba(82,64,160,.08)!important;
}
.whisper-actions .translate-whisper-button:not(.primary-whisper-submit){
  background:#fff!important;
  color:#6546f3!important;
}

.term-reward-path:before,.whisper-reward-path:before,
.reward-progress div,.armor-progress-bar div,.flight-progress-bar div,
.hatchery-progress-bar,.term-progress-bar,.whisper-progress-bar{
  background:rgba(199,205,255,.22)!important;
}
.hatchling-collection span,
.armor-item{
  background:rgba(255,255,255,.08)!important;
  border-color:rgba(178,188,255,.22)!important;
  color:var(--game-text-muted)!important;
}
.hatchling-collection span.filled,
.armor-item--unlocked{
  background:rgba(255,255,255,.13)!important;
  color:#fff!important;
}

@media(max-width:1100px){
  .stoke-title-block h1,.forge-title-block h1,.flight-title-block h1,
  .hatchery-title-block h1,.term-title-block h1,.whisper-title-block h1{
    text-shadow:0 6px 18px rgba(0,0,0,.24)!important;
  }
}
@media(max-width:760px){
  body::before{
    background-size:110px auto,96px auto;
    background-position:left -20px top 120px,right -14px top 260px;
    opacity:.42;
  }
  body::after{
    background-size:150% 100%;
    opacity:.24;
  }
  .hero h1,
  .level-hero h1{
    text-shadow:0 8px 22px rgba(0,0,0,.28);
  }
  .profile-studio-card::after{
    background:linear-gradient(180deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.84) 56%,rgba(8,13,54,.14) 100%)!important;
  }
}
*{box-sizing:border-box}html,body{overflow-x:hidden}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;background:linear-gradient(180deg,#fbfbff,#f5f3ff);color:var(--navy)}
button,select{font-family:inherit}.hidden{display:none!important}
.topbar{height:78px;background:rgba(255,255,255,.96);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 54px;position:sticky;top:0;z-index:20;box-shadow:0 3px 16px rgba(20,24,70,.04)}
.brand{border:0;background:none;display:flex;align-items:center;gap:13px;cursor:pointer}.boom-logo{width:128px;height:58px;display:flex;align-items:center;justify-content:center;position:relative;font-size:28px;font-weight:1000;font-style:italic;color:white;-webkit-text-stroke:2.4px #061343;text-shadow:2px 3px 0 rgba(7,19,63,.22);transform:rotate(-5deg)}
.boom-logo:before{content:"";position:absolute;inset:3px;z-index:-1;background:linear-gradient(135deg,#ffd22b,#ff8a00);clip-path:polygon(50% 0,59% 25%,83% 9%,73% 36%,100% 43%,74% 53%,91% 78%,62% 67%,54% 100%,43% 70%,14% 91%,28% 59%,0 54%,27% 40%,10% 12%,39% 27%)}
.brand-copy{text-align:left;line-height:1.1}.brand-copy>span{display:block;font-size:24px;font-weight:900;color:var(--purple);letter-spacing:-.3px}.brand-copy small{display:block;margin-top:6px;font-size:14px;font-weight:800;color:var(--navy)}
.header-center{position:absolute;left:50%;transform:translateX(-50%);font-size:22px;font-weight:900;color:var(--navy)}
.main-nav{display:flex;align-items:center;gap:32px}.main-nav button{border:0;background:none;font-size:16.5px;font-weight:750;color:var(--navy);cursor:pointer;padding:12px 0;position:relative;display:inline-flex;align-items:center;gap:6px}.main-nav button .ui-inline-icon{width:16px;height:16px;vertical-align:middle}.main-nav button.active{color:var(--purple)}.main-nav button.active:after{content:"";position:absolute;height:3px;border-radius:9px;background:var(--purple);left:0;right:0;bottom:-13px}
.login-link{display:flex;align-items:center;gap:8px;color:var(--purple)!important}.user-outline{font-size:30px}.study-actions{display:flex;align-items:center;gap:12px;position:relative}.invite-btn{height:44px;padding:0 24px;border:1.5px solid var(--purple);border-radius:999px;background:white;color:var(--purple);font-weight:850;font-size:16px}.avatar-btn{width:54px;height:54px;border:0;border-radius:50%;background:linear-gradient(180deg,#7755f3,#442cbf);color:white;font-size:28px;font-weight:900}.chev{border:0;background:none;color:var(--navy);font-size:22px}.avatar-menu{position:absolute;right:0;top:62px;background:white;border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);padding:8px;width:170px}.avatar-menu button{display:block;width:100%;text-align:left;border:0;background:white;padding:12px;border-radius:10px;font-weight:750;color:var(--navy)}.avatar-menu button:hover{background:var(--soft)}
.page{min-height:calc(100vh - 78px);max-width:1320px;margin:0 auto;padding:42px 34px 46px;position:relative;overflow-x:clip}.decor{position:absolute;pointer-events:none}.dots{left:-80px;top:110px;width:90px;height:90px;background-image:radial-gradient(#cbc6ff 2px,transparent 2px);background-size:15px 15px}.circle-left{width:70px;height:70px;left:20px;top:76px;border-radius:50%;background:rgba(87,66,232,.06)}.circle-right{width:250px;height:250px;right:-145px;top:-20px;border-radius:50%;border:2px solid rgba(87,66,232,.09)}
.hero{text-align:center}.compact-hero{margin-bottom:36px}.hero h1{margin:0 0 16px;font-size:58px;line-height:1.05;font-weight:1000;letter-spacing:-1.5px}.hero p{margin:0;font-size:20px;line-height:1.42;color:var(--text);font-weight:500}.info-pill{display:inline-flex;align-items:center;gap:8px;margin-top:22px;padding:10px 22px;background:var(--soft);color:var(--purple);border-radius:999px;font-weight:850;font-size:16px}
.exam-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.exam-card{background:white;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);padding:24px;display:grid;grid-template-columns:205px 1fr;grid-template-rows:1fr auto;gap:10px 25px;min-height:315px}.mascot-wrap{width:190px;height:190px;border-radius:50%;background:linear-gradient(180deg,#f0f3ff,#f8f6ff);display:flex;align-items:center;justify-content:center;font-size:84px;align-self:center;filter:drop-shadow(0 12px 18px rgba(32,36,80,.08));position:relative}.mascot-wrap:after{content:"✦ ✧";position:absolute;right:18px;top:22px;color:#b7b1ff;font-size:20px;letter-spacing:8px}.exam-copy{align-self:center}.exam-copy h2{margin:0 0 8px;font-size:42px;line-height:1;font-weight:1000;letter-spacing:-.5px}.exam-copy p{margin:0 0 18px;color:var(--text);font-size:16.5px;line-height:1.42;max-width:390px}.chips{display:grid;grid-template-columns:repeat(3,auto);gap:10px 12px}.chips span{min-width:96px;padding:8px 13px;border-radius:999px;border:1.5px solid #d8d2ff;background:#fbfaff;text-align:center;color:var(--purple);font-weight:900;font-size:14px}.primary-wide{grid-column:1/-1;border:0;border-radius:12px;background:linear-gradient(180deg,#5a45ea,#4932cd);color:white;font-size:20px;font-weight:950;min-height:56px;box-shadow:0 12px 24px rgba(73,50,205,.22);cursor:pointer}.primary-wide.small{min-height:46px;font-size:16px;padding:0 20px}.primary-wide span{margin-left:16px}.secondary-wide{min-height:46px;border:1.3px solid var(--border);background:white;border-radius:12px;color:var(--text);font-weight:800;font-size:15px}
.feature-strip{margin-top:26px;background:white;border:1px solid var(--border);border-radius:17px;box-shadow:var(--shadow);padding:22px 28px;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}.feature{display:flex;align-items:center;gap:14px;border-right:1px solid var(--border);min-width:0}.feature:last-child{border-right:0}.feature i,.full-feature i{width:56px;height:56px;border-radius:50%;background:#f0edff;color:var(--purple);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:26px;font-weight:900;flex:0 0 auto}.feature b{display:block;font-size:15.5px;font-weight:950}.feature span{display:block;margin-top:5px;color:var(--text);font-size:13.5px;line-height:1.35}
.level-hero{margin-bottom:26px}.level-hero h1{font-size:52px}.level-hero p{font-size:18px}.level-grid{display:grid;gap:18px;justify-content:center}.level-grid.isee{grid-template-columns:repeat(3, 1fr)}.level-grid.ssat{grid-template-columns:repeat(2, minmax(340px, 470px))}
.level-card{background:white;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:18px 18px 16px;display:grid;grid-template-columns:78px 1fr;gap:12px 16px;min-height:238px}.level-card .level-icon{width:68px;height:68px;border-radius:50%;background:#f0f3ff;display:flex;align-items:center;justify-content:center;font-size:38px}.level-card h3{margin:0 0 5px;font-size:23px;font-weight:1000}.level-card p{margin:0;color:var(--text);font-size:14px;line-height:1.35}.level-card .grade{color:var(--purple);font-weight:900}.level-card .level-feature{grid-column:1/-1;border-top:1px solid var(--border);padding-top:13px;text-align:center;color:var(--text);font-size:13px}.pricing-row{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--border);border-radius:12px;overflow:hidden}.price-choice{padding:9px 8px;text-align:left;border-right:1px solid var(--border);font-size:12px}.price-choice:last-child{border-right:0}.price-choice b{font-size:13px}.radio{display:inline-block;width:16px;height:16px;border:1.5px solid #9ea5c2;border-radius:50%;margin-right:6px;vertical-align:-3px}.radio.on{border:5px solid var(--purple)}.price-choice small{display:block;margin-left:24px;color:var(--muted);font-size:10px}.tag{display:inline-block;background:#ffe19b;border-radius:8px;padding:2px 6px;font-size:10px;font-weight:900;margin-left:24px}.level-card .start{grid-column:1/-1;min-height:44px;font-size:15.5px}
.level-count-line{grid-column:1/-1;text-align:center;color:#7a74a6;font-size:12.5px;font-weight:500;margin-top:-6px}
.feature-panel{margin-top:22px;background:white;border:1px solid var(--border);border-radius:17px;box-shadow:var(--shadow);padding:18px 24px 24px}.feature-panel h2{text-align:center;margin:0 0 20px;font-size:24px}.feature-row{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}.full-feature{display:grid;grid-template-columns:56px 1fr;grid-template-rows:auto auto;gap:5px 12px;align-items:center}.full-feature b{font-size:14.5px}.full-feature span{grid-column:2;color:var(--text);font-size:12.8px;line-height:1.35}.green{color:var(--green)!important}.orange{color:var(--orange)!important}
.study-page{max-width:1380px;padding-top:28px}.mode-tabs{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-bottom:18px}.mode-tabs button{border:1.5px solid var(--border);background:white;border-radius:999px;padding:13px 30px;font-size:16px;font-weight:850;color:var(--navy);box-shadow:0 6px 18px rgba(20,24,70,.04);cursor:pointer}.mode-tabs button.active{background:linear-gradient(180deg,#7156f1,#4d36d1);color:white}.free-banner{margin:0 auto 18px;max-width:500px;border-radius:999px;background:var(--soft);display:flex;align-items:center;justify-content:center;gap:22px;padding:10px 12px;color:var(--purple);font-weight:850}.free-banner button{border:0;border-radius:9px;background:linear-gradient(180deg,#5a45ea,#4932cd);color:white;padding:8px 28px;font-weight:900}
.study-layout{display:grid;grid-template-columns:235px 1fr 280px;gap:22px}.panel{background:white;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow)}.side-col,.right-col{display:flex;flex-direction:column;gap:18px}.panel h3{margin:0 0 16px;font-size:18px;font-weight:950}.progress-panel,.quick-panel,.review-panel,.badge-mini,.mini-test{padding:18px}.progress-item{display:flex;gap:13px;padding:13px 0;border-bottom:1px solid #eceaf7}.progress-item:last-child{border-bottom:0}.progress-item i{width:46px;height:46px;border-radius:50%;background:var(--soft);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:24px}.progress-item span,.progress-item small{display:block;color:var(--text);font-size:12px}.progress-item b{display:block;font-size:20px;line-height:1.1}.link-btn{border:0;background:none;color:var(--purple);font-weight:850;padding:0;text-decoration:underline;cursor:pointer}.quick-panel button{display:block;width:100%;text-align:left;border:0;background:white;border-bottom:1px solid #eceaf7;padding:12px 2px;font-weight:800;color:var(--text);cursor:pointer}.set-menu{margin-top:10px;background:#fbfaff;border:1px solid var(--border);border-radius:12px;padding:8px}.set-list{max-height:170px;overflow:auto}.set-menu button{border:0!important;border-radius:8px;padding:9px!important;background:transparent!important}.set-menu button:hover{background:var(--soft)!important}
.main-study-card{padding:24px 30px;min-height:520px}.card-top{display:flex;justify-content:space-between;align-items:center;color:var(--text)}.flash-switch{display:inline-flex;border:1.5px solid var(--border);border-radius:999px;overflow:hidden;background:white}.flash-switch button{border:0;background:white;padding:8px 15px;font-weight:850;color:var(--text);cursor:pointer}.flash-switch button.active{background:var(--purple);color:white}.word-display{text-align:center;padding:36px 0 18px}.word-display h2{font-size:58px;margin:0 0 14px;font-weight:1000;letter-spacing:-1px}.ipa{font-size:21px;color:var(--muted)}.pos-pill{display:inline-block;background:var(--soft);color:var(--purple);border-radius:9px;padding:6px 12px;margin-left:10px;font-weight:850}.reveal-box{margin:24px auto;border:1.6px dashed #c8bfff;border-radius:15px;padding:24px;text-align:center;max-width:620px;color:var(--text)}.reveal-box button{margin-top:12px;border:0;background:linear-gradient(180deg,#5a45ea,#4932cd);color:white;border-radius:10px;padding:13px 34px;font-weight:950;font-size:16px}.answer-panel{margin:22px auto;max-width:660px;background:#fbfaff;border:1px solid var(--border);border-radius:14px;padding:18px;text-align:left}.answer-panel h4{margin:0 0 10px}.answer-panel p{color:var(--text);line-height:1.48}.action-row{display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:14px;margin-top:22px}.action-row button{min-height:48px;border-radius:11px;font-weight:950;font-size:16px;cursor:pointer}.known{border:1.5px solid #3caf5d;background:white;color:#15903b}.review{border:1.5px solid #f08a39;background:white;color:#db6400}.next{border:0;background:linear-gradient(180deg,#5a45ea,#4932cd);color:white}
.question-title{text-align:center}.question-title h2{font-size:34px;margin:28px 0 10px}.choices{display:grid;gap:12px;margin:22px auto;max-width:650px}.choices button{min-height:50px;border:1.5px solid var(--border);background:white;border-radius:12px;text-align:left;padding:0 18px;font-size:16px;font-weight:800;color:var(--navy);cursor:pointer}.choices button.selected{border-color:var(--purple);background:var(--soft)}.choices button.correct{border-color:#21a552;background:#edf9f0}.choices button.wrong{border-color:#e85a5a;background:#fff0f0}
.review-panel p,.mini-test p{color:var(--text);font-size:12px}.weak-row{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #eceaf7;padding:8px 0;font-size:13px}.diff{border-radius:8px;padding:3px 8px;font-size:11px;font-weight:850}.diff.hard{background:#ffecec;color:#da3535}.diff.medium{background:#fff0d8;color:#e07800}.diff.easy{background:#eaf8ef;color:#168044}.link-center,.badge-mini h3 button{border:0;background:none;color:var(--purple);font-weight:850;cursor:pointer}.mini-badges{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.mini-badge{font-size:22px;text-align:center}.mini-badge small{display:block;font-size:10px}.select-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0}.select-row select{height:40px;border:1px solid var(--border);border-radius:10px;padding:0 8px;font-weight:750;color:var(--navy)}
.profile-page{max-width:1180px;padding-top:26px}.back-practice{border:0;background:var(--soft);color:var(--purple);font-weight:900;border-radius:999px;padding:10px 18px;margin-bottom:14px}.profile-hero{padding:26px 34px;display:grid;grid-template-columns:180px 1fr 330px;gap:30px;align-items:center}.profile-avatar{width:150px;height:150px;border-radius:50%;background:linear-gradient(180deg,#7a5cf2,#432bc0);color:white;display:flex;align-items:center;justify-content:center;font-size:70px;font-weight:950;position:relative}.profile-avatar span{position:absolute;right:8px;bottom:15px;width:36px;height:36px;border-radius:50%;background:white;color:var(--text);font-size:16px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow)}.profile-main h1{margin:0 0 18px;font-size:36px}.profile-line{display:flex;gap:14px;border-bottom:1px solid var(--border);padding:12px 0}.profile-line:last-child{border-bottom:0}.profile-line small,.profile-line span{display:block;color:var(--text);font-size:13px}.profile-line b{display:block;font-size:18px}.profile-upgrade{border-left:1px solid var(--border);padding-left:28px}.profile-upgrade p{color:var(--text);font-size:14px;line-height:1.4}.profile-grid{display:grid;grid-template-columns:1.15fr 1fr .95fr;gap:18px;margin-top:18px}.profile-grid>.panel{padding:20px}.metric-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.metric{border:1px solid var(--border);border-radius:14px;padding:14px}.metric i{font-style:normal;font-size:26px}.metric small,.metric span{display:block;color:var(--text);font-size:12px}.metric b{display:block;font-size:25px}.report-btn{width:100%;border:0;background:var(--soft);color:var(--purple);font-weight:900;border-radius:10px;min-height:42px;margin-top:12px}.badge-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.badge{border-radius:15px;text-align:center;padding:12px 6px;background:linear-gradient(180deg,#fbfaff,#f1efff);border:1px solid var(--border)}.badge i{display:block;font-style:normal;font-size:34px}.badge b{display:block;font-size:12px}.link-right{float:right;border:0;background:none;color:var(--purple);font-weight:850}.share-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.share-row button{height:86px;border:1px solid var(--border);background:white;border-radius:13px;color:var(--purple);font-size:24px}.share-row span{display:block;font-size:12px;color:var(--text);font-weight:800}.invite-box{margin-top:18px;border:1.5px dashed #c9c1f4;border-radius:14px;padding:18px;color:var(--purple);cursor:pointer}.invite-box span{display:block;color:var(--text);font-size:12px;margin-top:5px}.account-settings{padding:20px;margin-top:18px}.settings-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}.settings-grid button{display:grid;grid-template-columns:38px 1fr 16px;grid-template-rows:auto auto;border:0;background:white;text-align:left;gap:2px 12px;padding:12px;border-radius:12px;color:var(--navy);cursor:pointer}.settings-grid button:hover{background:#fbfaff}.settings-grid i{grid-row:1/3;font-style:normal;font-size:25px;color:var(--purple);align-self:center}.settings-grid b{font-size:15px}.settings-grid span{font-size:12px;color:var(--text);white-space:normal}.settings-grid em{grid-row:1/3;grid-column:3;font-style:normal;color:var(--purple);align-self:center}.red{color:#d83b3b!important}.family-panel{padding:18px;margin-top:18px}.family-panel p{color:var(--text)}.family-list{display:grid;grid-template-columns:1fr 1fr auto;gap:12px}.family-list div,.family-list button{border:1px solid var(--border);border-radius:12px;background:white;padding:12px}.family-list span{display:block;color:var(--text);font-size:13px}
.footer{text-align:center;color:#7c82a0;font-size:12px;padding:18px}.footer button{border:0;background:none;color:var(--purple);margin-left:14px}.modal-backdrop{position:fixed;inset:0;background:rgba(7,19,63,.32);z-index:50}.modal{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);width:min(560px,92vw);max-height:86vh;overflow:auto;background:white;border-radius:18px;box-shadow:0 30px 80px rgba(7,19,63,.24);z-index:60;padding:28px}.modal.wide{width:min(900px,94vw)}.modal-close{position:absolute;right:16px;top:14px;border:0;background:#f4f2ff;border-radius:50%;width:34px;height:34px;font-size:22px}.modal h2{margin:0 0 14px}.plan-grid{display:grid;gap:12px}.plan-grid button{border:1px solid var(--border);background:white;border-radius:14px;padding:18px;text-align:left}.plan-grid b,.plan-grid span{display:block}.plan-grid b{font-size:20px;color:var(--purple)}.plan-grid span{color:var(--text);margin-top:5px}.settings-form{display:grid;gap:14px}.settings-form label{font-weight:850}.settings-form select,.copy-input{display:block;width:100%;height:42px;border:1px solid var(--border);border-radius:10px;margin-top:7px;padding:0 12px}.locked-setting{background:#fbfaff;border:1px solid var(--border);border-radius:12px;padding:12px;color:var(--text)}.summary-card{background:#fbfaff;border:1px solid var(--border);border-radius:14px;padding:16px;color:var(--text)}.report-table{width:100%;border-collapse:collapse;margin:14px 0}.report-table th,.report-table td{border-bottom:1px solid var(--border);padding:10px;text-align:left}.all-badges{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.all-badges .badge{opacity:.72}.all-badges .badge.unlocked{opacity:1;border-color:#a996ff}
@media(max-width:1050px){.topbar{padding:0 22px}.main-nav{gap:18px}.header-center{display:none}.exam-grid,.level-grid.isee,.level-grid.ssat,.study-layout,.profile-grid,.profile-hero{grid-template-columns:1fr}.exam-card{grid-template-columns:170px 1fr}.feature-strip,.feature-row{grid-template-columns:1fr 1fr}.feature{border-right:0}.profile-upgrade{border-left:0;padding-left:0}.settings-grid{grid-template-columns:1fr 1fr}.family-list{grid-template-columns:1fr}.study-layout{max-width:720px;margin:0 auto}}
@media(max-width:720px){.topbar{height:auto;flex-direction:column;padding:12px}.main-nav{flex-wrap:wrap;justify-content:center}.page{padding:28px 16px}.hero h1{font-size:40px}.hero p{font-size:16px}.exam-card{grid-template-columns:1fr;text-align:center}.mascot-wrap{margin:0 auto}.chips{justify-content:center}.feature-strip,.feature-row,.profile-grid,.metric-grid,.settings-grid,.all-badges{grid-template-columns:1fr}.study-layout{grid-template-columns:1fr}.profile-hero{grid-template-columns:1fr}.profile-avatar{margin:auto}}

/* ===== v3 refinements: payment modal, retries, analogy format, and phone layout ===== */
.price-choice{cursor:pointer;transition:.15s ease}.price-choice.selected{background:#fbfaff}.pay-list{margin:16px 0 20px;color:var(--text);line-height:1.8}.payment-note{font-size:12px;color:var(--muted)}
.yearly-choice{
  display:grid!important;
  grid-template-columns:auto minmax(0,1fr)!important;
  align-items:start!important;
  column-gap:6px!important;
}
.yearly-choice .radio{
  margin-right:0!important;
}
.yearly-price-copy{
  display:block!important;
  min-width:0!important;
}
.yearly-choice b,
.yearly-choice small,
.yearly-choice .tag{
  display:block!important;
  margin-left:0!important;
}
.yearly-choice small{
  white-space:nowrap!important;
  font-size:clamp(9px,.9vw,11px)!important;
  line-height:1.2!important;
}
.yearly-choice .tag{
  width:max-content!important;
  margin-top:4px!important;
}
.choices button{display:flex;align-items:center;gap:12px}.choice-letter{width:28px;height:28px;border-radius:50%;background:#f0edff;color:var(--purple);display:inline-flex;align-items:center;justify-content:center;font-weight:950;flex:0 0 auto}.choices button.correct .choice-letter{background:#daf7e2;color:#168044}.choices button.wrong .choice-letter{background:#ffe0e0;color:#c92323}.analogy-title h2{font-size:34px;line-height:1.18}.analogy-choices button{font-family:inherit}

@media(max-width:900px){
  .topbar{height:auto;min-height:68px;padding:10px 16px;gap:10px}.brand{gap:8px}.boom-logo{width:92px;height:42px;font-size:21px}.brand-copy>span{font-size:18px}.brand-copy small{font-size:11px;margin-top:4px}.main-nav{gap:12px}.main-nav button{font-size:14px}.study-actions{gap:8px}.invite-btn{height:38px;padding:0 14px;font-size:13px}.avatar-btn{width:42px;height:42px;font-size:22px}
  .page{max-width:760px;padding:24px 14px 34px}.hero h1{font-size:36px;letter-spacing:-.8px}.hero p{font-size:15px}.info-pill{font-size:13px;padding:8px 14px;margin-top:14px}.compact-hero{margin-bottom:22px}
  .exam-grid{grid-template-columns:1fr;gap:16px}.exam-card{grid-template-columns:118px 1fr;min-height:0;padding:16px;gap:10px 14px;border-radius:16px}.mascot-wrap{width:108px;height:108px;font-size:54px}.mascot-wrap:after{font-size:13px;right:9px;top:11px}.exam-copy{text-align:left}.exam-copy h2{font-size:30px}.exam-copy p{font-size:13.5px;line-height:1.35;margin-bottom:12px}.chips{gap:7px;grid-template-columns:repeat(3,minmax(0,1fr))}.chips span{min-width:auto;padding:7px 8px;font-size:12px}.primary-wide{min-height:46px;font-size:17px;border-radius:10px}
  .feature-strip{grid-template-columns:1fr 1fr;gap:10px;margin-top:16px;padding:14px}.feature{gap:10px;padding:8px;border-right:0}.feature i,.full-feature i{width:42px;height:42px;font-size:20px}.feature b{font-size:13px}.feature span{font-size:12px}
  .level-hero h1{font-size:34px}.level-hero p{font-size:14px}.level-grid.isee,.level-grid.ssat{grid-template-columns:1fr;gap:14px}.level-card{grid-template-columns:60px 1fr;min-height:0;padding:14px}.level-card .level-icon{width:54px;height:54px;font-size:30px}.level-card h3{font-size:20px}.level-card p{font-size:13px}.level-card .level-feature{font-size:12px;padding-top:10px}.price-choice{padding:8px 6px}.price-choice b{font-size:12px}.price-choice small{font-size:9px;margin-left:20px}.radio{width:14px;height:14px;margin-right:4px}.radio.on{border-width:4px}.tag{font-size:9px;margin-left:20px}.level-card .start{min-height:40px;font-size:14px}
  .feature-panel{padding:14px;margin-top:16px}.feature-panel h2{font-size:20px}.feature-row{grid-template-columns:1fr;gap:10px}.full-feature{grid-template-columns:42px 1fr;gap:2px 10px;padding:7px 0}.full-feature b{font-size:13px}.full-feature span{font-size:12px}
  .study-page{padding-top:16px}.mode-tabs{justify-content:flex-start;overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}.mode-tabs button{padding:10px 18px;font-size:13px;white-space:nowrap}.free-banner{font-size:13px;gap:10px}.free-banner button{padding:7px 16px}.study-layout{grid-template-columns:1fr;gap:14px}.main-study-card{min-height:auto;padding:18px 14px}.word-display{padding:24px 0 12px}.word-display h2{font-size:38px}.question-title h2{font-size:27px}.choices{gap:9px}.choices button{min-height:44px;font-size:14px}.action-row{grid-template-columns:1fr;gap:10px}.action-row button{min-height:42px;font-size:14px}.reveal-box{padding:16px}.answer-panel{padding:14px}.side-col,.right-col{gap:12px}.panel{border-radius:14px}.progress-panel,.quick-panel,.review-panel,.badge-mini,.mini-test{padding:14px}
  .profile-page{padding-top:16px}.profile-hero{grid-template-columns:1fr;gap:16px;padding:18px;text-align:left}.profile-avatar{width:110px;height:110px;font-size:54px;margin:0 auto}.profile-main h1{font-size:28px;text-align:center}.profile-upgrade{border-left:0;padding-left:0}.profile-grid{grid-template-columns:1fr;gap:14px}.settings-grid{grid-template-columns:1fr}.settings-grid button{grid-template-columns:34px 1fr 16px}.family-list{grid-template-columns:1fr}.all-badges{grid-template-columns:repeat(2,1fr)}
}

@media(max-width:520px){
  .topbar{align-items:stretch}.brand{align-self:flex-start}.main-nav{width:100%;justify-content:space-between}.main-nav button{font-size:13px}.login-link .user-outline{display:none}.page{padding-left:10px;padding-right:10px}.hero h1{font-size:30px}.hero p br{display:none}.info-pill{white-space:normal;text-align:center}.exam-card{grid-template-columns:1fr;text-align:center}.exam-copy{text-align:center}.mascot-wrap{margin:0 auto;width:92px;height:92px;font-size:46px}.chips span{font-size:11px;padding:6px 7px}.exam-copy h2{font-size:28px}.primary-wide{min-height:42px;font-size:15px}.feature-strip{grid-template-columns:1fr}.feature{align-items:flex-start}.level-card{grid-template-columns:52px 1fr}.pricing-row{grid-template-columns:1fr}.price-choice{border-right:0;border-bottom:1px solid var(--border)}.price-choice:last-child{border-bottom:0}.profile-avatar{margin:auto}.modal{padding:20px}.all-badges{grid-template-columns:1fr 1fr}.header-center{display:none!important}
}

/* ===== v4 polish: smaller flashcard definition, profile redesign, SSAT card chips, sounds/tag tools ===== */
.word-display.definition-front{max-width:900px;margin:0 auto;padding:36px 24px 28px}
.word-display.definition-front h2{font-size:42px!important;line-height:1.24!important;letter-spacing:-.8px;max-width:850px;margin:0 auto;color:var(--navy)}
.flash-answer p{font-size:15px;line-height:1.65}.flash-answer h4{font-size:18px;margin-bottom:8px}
.card-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px}.card-tools button{border:0;background:#f5f2ff;border-radius:50%;width:34px;height:34px;cursor:pointer;font-size:17px;transition:.15s ease}.tag-btn.active{background:#ffe8ea;color:#d92946;box-shadow:0 0 0 2px #ffb7c2 inset}.sound-btn:hover,.tag-btn:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(71,53,199,.13)}
.progress-panel{padding:18px!important}.progress-panel h3{font-size:20px!important;margin-bottom:14px}.progress-item{gap:14px!important;padding:14px 0!important}.progress-item i{width:54px!important;height:54px!important;font-size:24px!important;flex:0 0 54px!important}.progress-item span{font-size:14px!important}.progress-item b{font-size:23px!important;line-height:1.12!important}.progress-item small{font-size:13px!important}.progress-item #levelTextSmall{font-size:20px!important;line-height:1.16!important;max-width:190px;display:block}.link-btn{font-size:13px!important}
.exam-card .chips.ssat{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));max-width:330px}.exam-card .chips.ssat span{text-align:center}.exam-card .fox{font-size:68px}.exam-card{align-items:center}.exam-copy p{max-width:430px}
.home-strip{align-items:center}.home-strip .feature{min-width:0}.home-strip .feature i{flex:0 0 54px}.home-strip .feature div{min-width:0}.home-strip .feature b{white-space:nowrap}.home-strip .feature span{line-height:1.35}.home-strip .feature:last-child i{font-size:25px;position:relative;overflow:hidden}.home-strip .feature:last-child{padding-right:4px}
.profile-page{max-width:1320px}.profile-hero{grid-template-columns:210px 1fr 360px!important;padding:22px 28px!important;gap:28px!important;align-items:center}.profile-avatar{width:150px!important;height:150px!important;font-size:74px!important;margin:auto}.profile-main h1{font-size:34px!important;margin-bottom:12px}.profile-line{gap:14px!important;padding:11px 0!important}.profile-line>span,.profile-line>i{font-size:24px}.profile-line small{font-size:12px}.profile-line b{font-size:17px!important}.profile-line span{font-size:13px}.profile-upgrade{padding-left:28px!important}.profile-upgrade p{font-size:14px!important;line-height:1.45;margin-bottom:14px}.profile-upgrade .primary-wide{min-height:46px!important;font-size:16px!important;border-radius:11px}.secondary-wide{min-height:42px!important;font-size:15px!important;border-radius:11px!important}.profile-grid{grid-template-columns:1.05fr .95fr .95fr!important;gap:18px!important}.profile-grid>.panel{padding:20px!important}.profile-grid h3{font-size:20px!important}.metric-grid{gap:12px!important}.metric{min-height:112px!important;padding:13px!important}.metric i{font-size:25px!important}.metric b{font-size:25px!important}.metric small,.metric span{font-size:12px!important}.badge-grid{grid-template-columns:repeat(3,1fr)!important;gap:12px!important}.badge{min-height:104px!important;padding:12px 8px!important}.badge i{font-size:32px!important}.badge b{font-size:12px!important;line-height:1.25}.share-row{gap:12px!important}.share-row button{height:84px!important;font-size:25px!important}.invite-box{display:flex;align-items:center;gap:14px;padding:16px!important;font-size:15px}.invite-box b{display:block}.invite-box span{font-size:12px!important;line-height:1.45}.account-settings{padding:22px 24px!important}.settings-grid{grid-template-columns:repeat(5,1fr)!important;gap:10px!important}.settings-grid button{grid-template-columns:38px 1fr 16px!important;padding:12px 10px!important}.settings-grid b{font-size:15px!important}.settings-grid span{font-size:12px!important;line-height:1.35}.family-panel{display:none}.legal-text{color:var(--text);font-size:14px;line-height:1.65}.legal-text h3{color:var(--navy);margin:18px 0 6px;font-size:18px}.legal-text p{margin:0 0 10px}
@media(max-width:1100px){.profile-hero{grid-template-columns:160px 1fr!important}.profile-upgrade{grid-column:1/-1;border-left:0!important;padding-left:0!important;display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center}.profile-upgrade p{grid-column:1/-1}.profile-grid{grid-template-columns:1fr!important}.settings-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:900px){.word-display.definition-front h2{font-size:27px!important;line-height:1.28!important}.word-display.definition-front{padding:20px 8px}.card-tools button{width:31px;height:31px}.progress-item #levelTextSmall{font-size:17px!important}.exam-card .chips.ssat{grid-template-columns:repeat(2,1fr);max-width:none}.profile-hero{grid-template-columns:1fr!important;padding:18px!important}.profile-avatar{width:112px!important;height:112px!important;font-size:56px!important}.profile-main h1{text-align:center;font-size:28px!important}.profile-upgrade{display:block}.settings-grid{grid-template-columns:1fr!important}.badge-grid{grid-template-columns:repeat(2,1fr)!important}.home-strip .feature b{white-space:normal}}
@media(max-width:520px){.word-display h2{font-size:42px!important}.word-display.definition-front h2{font-size:22px!important}.progress-panel h3{font-size:18px!important}.progress-item{grid-template-columns:46px 1fr!important}.progress-item i{width:46px!important;height:46px!important;font-size:21px!important}.progress-item b{font-size:19px!important}.exam-card .chips.ssat{grid-template-columns:1fr 1fr}.home-strip .feature{display:grid;grid-template-columns:44px 1fr}.home-strip .feature i{width:44px!important;height:44px!important}.profile-grid>.panel{padding:16px!important}.metric-grid{grid-template-columns:1fr!important}.badge-grid{grid-template-columns:1fr 1fr!important}.share-row{grid-template-columns:1fr 1fr 1fr}.share-row button{height:72px!important;font-size:21px!important}.invite-box{display:block}.account-settings{padding:16px!important}}

/* =========================
   BoomPrep v5 polish updates
   ========================= */
/* 1) Home feature strip: match clean horizontal reference and prevent invite icon clipping */
.home-strip{
  padding:18px 22px!important;
  gap:0!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:center!important;
}
.home-strip .feature{
  gap:16px!important;
  padding:0 20px!important;
  min-height:78px!important;
  align-items:center!important;
  border-right:1px solid var(--border)!important;
}
.home-strip .feature:last-child{border-right:0!important;padding-right:10px!important;}
.home-strip .feature i{
  width:58px!important;height:58px!important;flex:0 0 58px!important;
  border-radius:50%!important;font-size:28px!important;overflow:visible!important;
}
.home-strip .feature i.invite-icon{font-size:27px!important;letter-spacing:-4px;padding-right:3px;}
.home-strip .feature b{font-size:15px!important;line-height:1.15!important;white-space:nowrap!important;}
.home-strip .feature span{font-size:13px!important;line-height:1.32!important;max-width:170px;}

/* 2) Full-access strip: compact like reference */
.feature-panel{
  padding:14px 28px 20px!important;
  margin-top:18px!important;
  border-radius:16px!important;
}
.feature-panel h2{
  margin:0 0 14px!important;
  font-size:21px!important;
  letter-spacing:-.2px!important;
}
.feature-row{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:center!important;
}
.full-feature{
  grid-template-columns:46px 1fr!important;
  gap:3px 10px!important;
  min-height:70px!important;
}
.full-feature i{
  width:46px!important;height:46px!important;font-size:23px!important;flex:0 0 46px!important;
}
.full-feature b{font-size:13.2px!important;line-height:1.1!important;}
.full-feature span{font-size:12px!important;line-height:1.32!important;}

/* 3) Synonym question: remove extra title spacing and move target word up */
.compact-question{padding-top:2px!important;}
.compact-question .synonym-word{padding:28px 0 26px!important;}
.compact-question .synonym-word h2{font-size:44px!important;line-height:1.05!important;}

/* 4) Smaller study sidebar progress text */
.progress-panel{padding:16px!important;}
.progress-panel h3{font-size:18px!important;margin-bottom:10px!important;}
.progress-item{gap:11px!important;padding:11px 0!important;}
.progress-item i{width:42px!important;height:42px!important;font-size:21px!important;flex:0 0 42px!important;}
.progress-item span{font-size:12.5px!important;line-height:1.1!important;}
.progress-item b{font-size:19px!important;line-height:1.12!important;}
.progress-item small{font-size:12px!important;line-height:1.25!important;}
.progress-item #levelTextSmall{font-size:17px!important;line-height:1.14!important;max-width:160px!important;}
.progress-item .link-btn{font-size:12.5px!important;margin-top:3px;}

/* 5) Account dropdown: cleaner menu with icons, upgrade, report, settings */
.avatar-menu{
  width:235px!important;
  padding:10px!important;
  border-radius:18px!important;
  box-shadow:0 20px 55px rgba(21,22,70,.16)!important;
}
.avatar-menu button{
  display:flex!important;align-items:center!important;gap:12px!important;
  width:100%!important;padding:12px 14px!important;border-radius:12px!important;
  font-size:14.5px!important;font-weight:850!important;color:var(--navy)!important;
}
.avatar-menu button:hover{background:var(--soft)!important;color:var(--purple)!important;}
.avatar-menu button span{width:22px;text-align:center;font-size:16px;}

/* 6) Share & Invite block: reference-style top actions + dashed promo */
.share-row{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:12px!important;margin-top:14px!important;}
.share-row button{
  height:82px!important;border:1px solid var(--border)!important;border-radius:14px!important;
  background:#fff!important;color:var(--purple)!important;display:flex!important;
  flex-direction:column!important;align-items:center!important;justify-content:center!important;
  font-size:25px!important;font-weight:850!important;box-shadow:none!important;
}
.share-row button span{font-size:11.5px!important;color:var(--text)!important;margin-top:7px!important;}
.invite-box{
  margin-top:20px!important;border:1.5px dashed #c8c0ff!important;border-radius:16px!important;
  padding:15px 16px!important;display:grid!important;grid-template-columns:48px 1fr 22px!important;
  gap:13px!important;align-items:center!important;cursor:pointer!important;background:#fff!important;
}
.invite-box>i{
  width:48px;height:48px;border-radius:50%;background:var(--soft);display:flex;align-items:center;justify-content:center;
  font-style:normal;font-size:24px;color:var(--purple);
}
.invite-box b{font-size:14.5px!important;color:var(--purple)!important;line-height:1.25!important;display:block!important;}
.invite-box span{font-size:12px!important;color:var(--text)!important;line-height:1.35!important;margin-top:4px;display:block!important;}
.invite-box em{font-style:normal;font-size:28px;color:var(--purple);}

/* 7) Progress summary cards: more like reference */
.metric-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:12px!important;}
.metric{
  min-height:104px!important;border:1px solid var(--border)!important;border-radius:15px!important;
  padding:14px 14px!important;background:#fff!important;display:grid!important;
  grid-template-columns:52px 1fr!important;grid-template-rows:auto auto auto!important;gap:2px 12px!important;
  align-items:center!important;
}
.metric i{
  grid-row:1/4!important;width:50px!important;height:50px!important;border-radius:50%!important;
  background:var(--soft)!important;display:flex!important;align-items:center!important;justify-content:center!important;
  font-style:normal!important;font-size:24px!important;color:var(--purple)!important;
}
.metric i.metric-check{background:#e9f6eb!important;color:#37a04b!important;font-size:30px!important;}
.metric i.metric-clip{background:#edf5ff!important;color:#2b86ff!important;}
.metric i.metric-fire{background:#fff2df!important;color:#e97822!important;}
.metric small{font-size:11px!important;font-weight:800!important;color:var(--text)!important;}
.metric b{font-size:24px!important;line-height:1!important;color:var(--navy)!important;}
.metric span{font-size:11.5px!important;color:var(--muted)!important;}
.report-btn{height:42px!important;border-radius:11px!important;font-size:13px!important;margin-top:14px!important;}

/* 8) Badge visuals: illustrated shield-like style */
.badge-grid{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:14px!important;}
.badge{
  border:0!important;background:transparent!important;box-shadow:none!important;text-align:center!important;
  min-height:122px!important;padding:2px 3px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;
}
.badge i{
  width:82px!important;height:76px!important;margin-bottom:8px!important;color:#fff!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  font-style:normal!important;font-size:30px!important;font-weight:1000!important;
  text-shadow:0 2px 3px rgba(0,0,0,.18)!important;
  clip-path:polygon(50% 0,88% 14%,100% 48%,79% 88%,50% 100%,21% 88%,0 48%,12% 14%)!important;
  box-shadow:0 8px 12px rgba(35,30,100,.18)!important;
  position:relative!important;
}
.badge-style-0 i{background:linear-gradient(160deg,#b78cff,#5d39cf)!important;}
.badge-style-1 i{background:linear-gradient(160deg,#7bd783,#1d8f3a)!important;}
.badge-style-2 i{background:linear-gradient(160deg,#67b4ff,#255fd4)!important;}
.badge-style-3 i{background:linear-gradient(160deg,#ffd45b,#f07b19)!important;}
.badge-style-4 i{background:linear-gradient(160deg,#b89aff,#6d45df)!important;}
.badge-style-5 i{background:linear-gradient(160deg,#ffb34e,#e45617)!important;}
.badge b{font-size:12.2px!important;line-height:1.18!important;color:var(--purple)!important;}
.mini-badges{grid-template-columns:repeat(4,1fr)!important;gap:9px!important;}
.mini-badge{display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;}
.mini-badge i{width:45px;height:42px;clip-path:polygon(50% 0,88% 14%,100% 48%,79% 88%,50% 100%,21% 88%,0 48%,12% 14%);display:flex;align-items:center;justify-content:center;color:white;font-style:normal;font-weight:950;font-size:17px;}
.mini-badge small{font-size:9.5px!important;line-height:1.1!important;}

/* 9) Profile upgrade action spacing like reference */
.profile-upgrade{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:14px!important;}
.profile-upgrade p{margin:0 0 2px!important;}
.profile-upgrade .primary-wide.small{height:46px!important;min-height:46px!important;font-size:15px!important;border-radius:12px!important;}
.profile-upgrade .secondary-wide{height:43px!important;min-height:43px!important;font-size:14px!important;border-radius:12px!important;}
.profile-grid>.panel{border-radius:16px!important;}

@media(max-width:1100px){
  .home-strip{grid-template-columns:repeat(2,1fr)!important;}
  .home-strip .feature{border-right:0!important;border-bottom:1px solid var(--border)!important;}
  .home-strip .feature:nth-last-child(-n+1){border-bottom:0!important;}
  .feature-row{grid-template-columns:repeat(2,1fr)!important;}
}
@media(max-width:720px){
  .home-strip{grid-template-columns:1fr!important;padding:14px!important;}
  .home-strip .feature{padding:10px 4px!important;min-height:66px!important;}
  .feature-row{grid-template-columns:1fr!important;gap:8px!important;}
  .feature-panel{padding:14px 16px!important;}
  .compact-question .synonym-word h2{font-size:34px!important;}
  .metric-grid{grid-template-columns:1fr!important;}
  .badge-grid{grid-template-columns:repeat(2,1fr)!important;}
  .invite-box{grid-template-columns:42px 1fr 18px!important;padding:13px!important;}
  .invite-box>i{width:42px;height:42px;font-size:22px;}
}

/* ==========================
   BoomPrep v6 updates
   ========================== */
/* 1) Study card tag icon: real tag shape, grey until marked red */
.tag-btn{
  background:#f3f2fb!important;
  border-radius:50%!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#9aa0b8!important;
  box-shadow:none!important;
}
.tag-btn .tag-shape{
  width:21px;height:15px;display:inline-block;position:relative;
  background:#9aa0b8;border-radius:3px 5px 5px 3px;
  transform:rotate(-38deg);
  transition:.18s ease;
}
.tag-btn .tag-shape:before{
  content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:white;
  right:2px;top:3.5px;box-shadow:0 0 0 1.5px rgba(0,0,0,.08) inset;
}
.tag-btn .tag-shape:after{
  content:"";position:absolute;right:-4px;top:0;width:0;height:0;
  border-top:7.5px solid transparent;border-bottom:7.5px solid transparent;border-left:6px solid #9aa0b8;
  transition:.18s ease;
}
.tag-btn.active{background:#ffe8ec!important;box-shadow:0 0 0 2px #f7b8c3 inset!important;}
.tag-btn.active .tag-shape{background:#d4374a!important;}
.tag-btn.active .tag-shape:after{border-left-color:#d4374a!important;}
.tag-btn:hover .tag-shape{transform:rotate(-38deg) scale(1.08);}

/* 2) Home page 2x2 product cards with coming-soon styles */
.exam-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr));}
.coming-soon-card{opacity:.94;position:relative;}
.coming-soon-card .mascot-wrap{font-size:72px;background:linear-gradient(180deg,#f3f4ff,#fbfaff);}
.soon-pill{display:inline-flex;align-items:center;width:max-content;padding:5px 10px;border-radius:999px;background:#fff4d8;color:#b26a00;font-weight:950;font-size:11px;margin-bottom:8px;}
.primary-wide.disabled{background:linear-gradient(180deg,#b8b2e9,#9d96d5)!important;box-shadow:none!important;cursor:pointer;}
.chips.coming{grid-template-columns:repeat(2,auto);}
.chips.coming span{min-width:120px;background:#fffaf0;color:#9d6800;border-color:#f0d699;}

/* 3) SSAT card chips stay clean after adding four choices */
.exam-card .chips.ssat{grid-template-columns:repeat(2,minmax(120px,1fr))!important;max-width:340px!important;}
.exam-card .chips.ssat span{min-width:0!important;}

/* 4) Primary-level question labels */
.mode-tabs button{white-space:nowrap;}

@media(max-width:1050px){
  .exam-grid.compact{grid-template-columns:1fr!important;max-width:760px;margin-left:auto;margin-right:auto;}
}
@media(max-width:720px){
  .exam-grid.compact{grid-template-columns:1fr!important;}
  .coming-soon-card .mascot-wrap{font-size:48px!important;}
  .chips.coming{grid-template-columns:1fr 1fr!important;}
  .chips.coming span{min-width:0!important;font-size:11px!important;}
}

/* ==========================
   BoomPrep v7 updates
   ========================== */
/* 1) Smaller definition display */
.word-display.definition-front h2{
  font-size:40px!important;
  line-height:1.22!important;
  max-width:980px!important;
  margin:0 auto!important;
  letter-spacing:-.6px!important;
}
@media(max-width:900px){.word-display.definition-front h2{font-size:25px!important;line-height:1.28!important}}
@media(max-width:520px){.word-display.definition-front h2{font-size:20px!important;line-height:1.35!important}}

/* 2) Replace tag marker with star marker */
.tag-btn{display:none!important;}
.star-btn{
  width:46px;height:46px;border:0;border-radius:50%;background:#f3f2fb;color:#b8b6ca;
  display:inline-flex;align-items:center;justify-content:center;font-size:28px;font-weight:900;cursor:pointer;
  transition:.18s ease;box-shadow:none;
}
.star-btn.active{background:#fff5d7;color:#f4bd29;box-shadow:0 0 0 2px #f4d982 inset;}
.star-btn:hover{transform:translateY(-1px);background:#fff8e5;color:#f4bd29;}

/* 3) Product cards use dragon exam icons */
.mascot-wrap.image-mascot{font-size:0!important;background:linear-gradient(180deg,#f1efff,#fbfbff)!important;overflow:hidden;}
.mascot-wrap.image-mascot:after{display:none!important;}
.mascot-wrap.image-mascot img{width:100%;height:100%;object-fit:contain;display:block;}
.exam-copy h2{font-size:34px!important;line-height:1.05!important;}
@media(max-width:720px){.exam-copy h2{font-size:28px!important}.mascot-wrap.image-mascot{width:150px!important;height:150px!important}}

/* 4) Word set dropdown text smaller and regular */
.set-menu button,.set-list button{
  font-size:13px!important;
  font-weight:500!important;
  line-height:1.25!important;
  padding:9px 10px!important;
}
.set-list{max-height:230px!important;overflow:auto!important;padding-right:4px!important;}

/* 5) Progress report dashboard */
.locked-report{text-align:center;padding:34px 20px;border:1px solid var(--border);border-radius:18px;background:#fbfaff;}
.locked-report .lock-icon{font-size:44px;margin-bottom:8px;}
.report-dashboard{display:grid;gap:18px;}
.report-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.report-metrics div{border:1px solid var(--border);border-radius:16px;background:#fff;padding:18px;text-align:center;box-shadow:0 8px 20px rgba(23,28,80,.04);}
.report-metrics b{display:block;font-size:32px;color:var(--navy);line-height:1;}
.report-metrics span{display:block;color:var(--text);font-size:13px;margin-top:7px;}
.report-card{border:1px solid var(--border);border-radius:18px;background:#fff;padding:18px 20px;}
.report-card h3{margin:0 0 12px;font-size:20px;color:var(--navy);}
.revised-report .analytics-metrics{grid-template-columns:repeat(3,minmax(0,1fr));}
.revised-report .analytics-metric-card{text-align:left;}
.memory-path-report{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px;align-items:stretch;}
.memory-path-report div{position:relative;border:1px solid var(--border);border-radius:14px;background:#fbfaff;padding:14px 8px;text-align:center;}
.memory-path-report b{display:block;font-size:26px;color:var(--navy);line-height:1;}
.memory-path-report span{display:block;margin-top:6px;color:var(--text);font-size:12px;font-weight:850;}
.memory-path-report i{position:absolute;right:-11px;top:50%;transform:translateY(-50%);z-index:1;color:var(--purple);font-style:normal;font-weight:950;}
.weekly-bar small{display:block;color:var(--text);font-size:10px;margin-top:4px;white-space:nowrap;}
.big-progress{height:18px;border-radius:999px;background:#eef0fb;overflow:hidden;}
.big-progress i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#44bf74,#95df83);}
.big-progress.purple i{background:linear-gradient(90deg,#6552e8,#9b8cff);}
.set-progress{display:grid;grid-template-columns:80px 1fr 55px;gap:12px;align-items:center;margin:10px 0;}
.set-progress .bar{height:12px;border-radius:999px;background:#eef0fb;overflow:hidden;}
.set-progress .bar i{display:block;height:100%;border-radius:999px;background:#6552e8;}
.weak-chip-list{display:flex;flex-wrap:wrap;gap:10px;}
.weak-chip-list span{padding:8px 12px;border-radius:999px;background:var(--soft);color:var(--purple);font-weight:800;}
@media(max-width:760px){.report-metrics,.revised-report .analytics-metrics{grid-template-columns:repeat(2,1fr)}.set-progress{grid-template-columns:1fr}.report-metrics b{font-size:26px}.memory-path-report{grid-template-columns:repeat(2,minmax(0,1fr))}.memory-path-report i{display:none}}

/* 6) Badge images from assets */
.badge img{width:88px!important;height:88px!important;object-fit:contain!important;margin-bottom:6px!important;filter:drop-shadow(0 8px 10px rgba(30,30,90,.16));}
.badge i{display:none!important;}
.mini-badge img{width:50px;height:50px;object-fit:contain;filter:drop-shadow(0 5px 7px rgba(30,30,90,.14));}
.mini-badge i{display:none!important;}
.all-badges .badge img{width:78px!important;height:78px!important;}

/* 7) Avatar image buttons */
.avatar-image-btn{padding:0!important;overflow:hidden;background:#fff!important;border:2px solid #ded9ff!important;}
.avatar-image-btn img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.profile-avatar.avatar-large{border:0;background:transparent;position:relative;cursor:pointer;padding:0;}
.profile-avatar.avatar-large img{width:100%;height:100%;object-fit:cover;border-radius:50%;box-shadow:0 12px 25px rgba(28,30,78,.12);}
.avatar-picker{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:18px;}
.avatar-choice{border:2px solid transparent;background:#fff;border-radius:22px;padding:8px;cursor:pointer;box-shadow:0 8px 18px rgba(23,28,80,.06);}
.avatar-choice.selected{border-color:var(--purple);background:#f4f1ff;}
.avatar-choice img{width:100%;aspect-ratio:1/1;object-fit:contain;display:block;}
@media(max-width:720px){.avatar-picker{grid-template-columns:repeat(3,1fr);gap:10px}}


/* =========================
   BoomPrep v8 product expansion updates
   ========================= */
.product-grid.exam-grid.compact{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}
.product-card.exam-card{
  display:flex!important;
  flex-direction:column!important;
  min-height:350px!important;
  padding:17px 18px!important;
  text-align:center!important;
  justify-content:space-between!important;
  gap:10px!important;
}
.product-card .mascot-wrap.image-mascot{
  width:122px!important;height:122px!important;margin:0 auto!important;border-radius:50%!important;
}
.product-card .exam-copy{align-self:stretch!important;text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important;gap:7px!important;}
.product-card .exam-copy h2{font-size:26px!important;line-height:1.05!important;margin:0!important;}
.product-card .exam-copy p{font-size:13.5px!important;line-height:1.32!important;margin:0!important;max-width:300px!important;min-height:52px!important;}
.product-card .chips{display:flex!important;flex-wrap:wrap!important;justify-content:center!important;gap:6px!important;max-width:315px!important;}
.product-card .chips span{min-width:auto!important;padding:5px 9px!important;font-size:11px!important;}
.product-card .primary-wide{min-height:42px!important;font-size:14.5px!important;border-radius:11px!important;}
.product-card.coming-soon-card{opacity:.96!important;}
.level-grid.g212{grid-template-columns:repeat(4,minmax(220px,1fr))!important;}
.level-grid.ssat{grid-template-columns:repeat(3,minmax(260px,1fr))!important;}
.level-card .level-icon{font-size:0!important;background:linear-gradient(180deg,#f2f0ff,#fff)!important;}
.level-card .level-icon::before{content:"🐉";font-size:34px;}
.set-menu button,.set-list button{font-size:12.5px!important;font-weight:500!important;line-height:1.2!important;padding:7px 8px!important;color:#424765!important;}
.set-list{max-height:180px!important;}
.badge img{width:92px!important;height:92px!important;object-fit:contain!important;}
.mini-badge img{width:52px!important;height:52px!important;object-fit:contain!important;}
.avatar-choice img{width:86px!important;height:86px!important;object-fit:contain!important;}
.avatar-picker{grid-template-columns:repeat(4,1fr)!important;}
.avatar-image-btn img,.avatar-large img{object-fit:cover!important;}
.ui-inline-icon,.dash-icon,.help-section-icon,.game-stat-icon{width:20px;height:20px;object-fit:contain;vertical-align:-4px}
.mode-tab-icon img,.mode-tab-lock img,.mode-tab-sparkle img{width:19px;height:19px;object-fit:contain;display:block}
.game-v2-pill .game-stat-icon{width:22px;height:22px;margin-right:4px}
.help-section-card h2 .help-section-icon,.ds-card h2 .ui-inline-icon,.profile-dash-card h3 .ui-inline-icon{width:24px;height:24px;margin-right:8px}
.support-form label>.ui-inline-icon,.support-modal-title .ui-inline-icon{width:22px;height:22px;margin-right:7px}
.support-success-view .ui-inline-icon{width:34px;height:34px}
@media(max-width:1050px){.product-grid.exam-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))!important}.level-grid.g212,.level-grid.ssat{grid-template-columns:repeat(2,minmax(240px,1fr))!important}}
@media(max-width:650px){.product-grid.exam-grid.compact,.level-grid.g212,.level-grid.ssat{grid-template-columns:1fr!important}.product-card.exam-card{min-height:auto!important}.product-card .mascot-wrap.image-mascot{width:120px!important;height:120px!important}.avatar-picker{grid-template-columns:repeat(3,1fr)!important}}
@media(max-width:650px){.level-card{grid-template-columns:88px 1fr!important}.level-icon.egg-icon{width:72px!important;height:72px!important}.level-icon.egg-icon img{width:72px!important;height:72px!important}.level-card h3{font-size:22px!important}}


/* ===== Phase 1: Games, Coins, Dragon Studio, Leaderboard ===== */
.coin-wallet{border:1.8px solid var(--border);background:#fff9e8;color:#6b4a00;border-radius:999px;min-height:42px;padding:0 16px;font-weight:950;box-shadow:0 8px 18px rgba(80,60,0,.06);cursor:pointer}.coin-wallet span{color:#1d1760}.avatar-menu button{gap:10px}.games-home{padding:10px}.game-hero{text-align:center;margin-bottom:22px}.game-hero h2{font-size:38px;margin:0 0 8px}.game-hero p{color:var(--text);font-size:17px}.game-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.game-card{border:1px solid var(--border);background:linear-gradient(180deg,#fff,#f8f6ff);border-radius:18px;padding:22px;text-align:left;cursor:pointer;min-height:170px;box-shadow:0 12px 26px rgba(26,24,80,.06)}.game-card.live{border-color:#c6bafd;background:linear-gradient(180deg,#fff,#f1edff)}.game-card span{font-size:42px;display:block;margin-bottom:10px}.game-card b{display:block;font-size:22px;color:var(--navy);margin-bottom:8px}.game-card small{display:block;color:var(--text);line-height:1.45;font-size:14px}.game-card em{display:block;margin-top:14px;color:var(--purple);font-weight:950;font-style:normal}.coin-rules{margin-top:18px;border:1px dashed #c7bfff;border-radius:16px;padding:16px;text-align:center;background:#fbfaff}.coin-rules h3{margin:0 0 6px}.coin-rules p{margin:0;color:var(--text)}.match-head{display:flex;justify-content:space-between;align-items:center;gap:18px;margin-bottom:18px}.match-head h2{font-size:34px;margin:0 0 5px}.match-head p{margin:0;color:var(--text)}.match-score{display:grid;grid-template-columns:repeat(2,auto);gap:2px 12px;text-align:center;background:#f2efff;border-radius:16px;padding:12px 18px}.match-score b{font-size:24px;color:var(--purple)}.match-score span{font-size:12px;color:var(--text)}.match-board{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.match-card{border:2px solid var(--border);border-radius:16px;background:#fff;min-height:116px;padding:12px;display:flex;flex-direction:column;justify-content:center;gap:8px;cursor:pointer;transition:.16s}.match-card small{color:var(--purple);font-weight:900;font-size:11px;letter-spacing:.08em}.match-card span{font-size:15px;line-height:1.3;color:var(--navy);font-weight:800}.match-card.word{background:#fbfaff}.match-card.selected{border-color:var(--purple);box-shadow:0 0 0 4px rgba(92,72,232,.12)}.match-card.matched{background:#ecfaef;border-color:#56b866}.match-card.wrong{background:#fff0f0;border-color:#e35a5a;animation:shake .28s}@keyframes shake{0%,100%{transform:translateX(0)}30%{transform:translateX(-5px)}70%{transform:translateX(5px)}}.game-actions,.game-complete{margin-top:18px;display:flex;gap:12px;justify-content:center;align-items:center}.game-actions button,.game-complete button,.dragon-wallet button{border:0;background:var(--purple);color:white;font-weight:950;border-radius:12px;min-height:42px;padding:0 18px;cursor:pointer}.game-complete{background:#f7f4ff;border-radius:16px;padding:18px;display:block;text-align:center}.game-complete button{margin:6px}.phase1-grid{display:grid;grid-template-columns:1fr .8fr .9fr;gap:18px;margin-top:18px}.dragon-card,.leaderboard-card{cursor:pointer}.dragon-preview-mini{display:flex;gap:16px;align-items:center}.dragon-preview-mini img{width:86px;height:86px;object-fit:cover;border-radius:22px;background:#f1efff;border:1px solid var(--border)}.dragon-preview-mini b,.dragon-preview-mini span{display:block}.dragon-preview-mini span{color:var(--text);font-size:13px;margin-top:5px}.coin-big{display:flex;align-items:baseline;gap:10px;margin:20px 0}.coin-big b{font-size:48px;color:#e0a21b}.coin-big span{font-weight:900;color:var(--text)}.coin-card p{color:var(--text);line-height:1.45}.mini-leaderboard{padding-left:20px}.mini-leaderboard li{margin:10px 0}.mini-leaderboard span{float:right;color:var(--text);font-size:13px}.dragon-studio{display:grid;grid-template-columns:300px 1fr;gap:20px}.dragon-display,.dragon-wallet,.dragon-store{border:1px solid var(--border);border-radius:18px;background:#fff;padding:18px}.dragon-display{text-align:center;grid-row:span 2}.dragon-display img{width:180px;height:180px;object-fit:cover;border-radius:32px;background:#f1efff}.dragon-display h3{font-size:26px;margin:12px 0 4px}.dragon-display p,.dragon-display small,.equipped-line{color:var(--text)}.equipped-line{margin-top:12px;background:#fbfaff;border-radius:12px;padding:10px}.dragon-wallet h3{font-size:28px;margin:0 0 8px}.dragon-wallet p{color:var(--text)}.dragon-store{grid-column:2}.store-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.store-item{border:1px solid var(--border);border-radius:14px;padding:12px;text-align:center;background:#fbfaff}.store-item i{font-style:normal;font-size:32px}.store-item b,.store-item span,.store-item em{display:block}.store-item b{font-size:14px;margin-top:4px}.store-item span{font-size:11px;color:var(--text);margin-top:4px}.store-item em{font-style:normal;font-weight:900;color:#b77800;margin:8px 0}.store-item.owned em{color:#2f8f4e}.store-item button{border:0;background:var(--purple);color:#fff;border-radius:999px;padding:7px 14px;font-weight:900;cursor:pointer}.leader-tabs{display:flex;gap:10px;margin-bottom:16px}.leader-tabs button{border:1px solid var(--border);background:#fff;border-radius:999px;padding:9px 16px;font-weight:900}.leader-tabs .active{background:var(--purple);color:#fff}.leaderboard-list{display:grid;gap:12px}.leader-row{display:grid;grid-template-columns:60px 52px 1fr auto;gap:12px;align-items:center;border:1px solid var(--border);border-radius:16px;background:#fff;padding:12px}.leader-row b{font-size:20px;color:var(--purple)}.leader-row img{width:52px;height:52px;object-fit:cover;border-radius:14px;background:#f1efff}.leader-row span{font-weight:950}.leader-row em{font-style:normal;color:var(--text);font-weight:850}.leader-note{color:var(--text);background:#fbfaff;border-radius:12px;padding:12px}.report-metrics{grid-template-columns:repeat(5,1fr)!important}.report-card:nth-child(4) .set-progress:nth-child(odd) .bar i{background:linear-gradient(90deg,#44d7b6,#6c5cff)}.big-progress i{background:linear-gradient(90deg,#43d7b5,#6c5cff,#ff6aa2)!important}
@media(max-width:950px){.game-grid,.phase1-grid,.dragon-studio{grid-template-columns:1fr}.dragon-store{grid-column:1}.store-grid{grid-template-columns:repeat(2,1fr)}.match-board{grid-template-columns:repeat(2,1fr)}.match-head{display:block}.report-metrics{grid-template-columns:1fr 1fr!important}.leader-row{grid-template-columns:42px 42px 1fr}.leader-row em{grid-column:3}}
@media(max-width:520px){.game-hero h2{font-size:28px}.match-board{grid-template-columns:1fr}.match-card{min-height:88px}.store-grid{grid-template-columns:1fr}.coin-wallet{min-height:36px;padding:0 12px}.phase1-grid{grid-template-columns:1fr}.dragon-display img{width:140px;height:140px}.report-metrics{grid-template-columns:1fr!important}}

/* ===== Phase 2: HatchElite logo, egg icons, extra games ===== */
.hatch-brand{min-width:260px;max-width:330px;padding:0!important;overflow:hidden;}
.hatch-logo-img{display:block;width:255px;height:auto;object-fit:contain;}
@media(max-width:760px){.hatch-brand{min-width:190px;max-width:220px}.hatch-logo-img{width:205px}.topbar{padding-left:14px;padding-right:14px}}
.level-icon.egg-icon{background:linear-gradient(180deg,#f7f5ff,#fff)!important;border-radius:22px!important;width:78px!important;height:78px!important;box-shadow:inset 0 0 0 1px #e4e0fb;overflow:hidden;}
.level-icon.egg-icon::before{content:none!important;}
.level-icon.egg-icon img{width:100%;height:100%;object-fit:contain;padding:4px;display:block;}
.quest-panel{border:1px solid var(--border);border-radius:18px;background:linear-gradient(135deg,#fff,#f5f2ff);box-shadow:0 14px 30px rgba(20,24,70,.05);padding:18px;margin-bottom:18px}.quest-panel h3{margin:0 0 12px;font-size:22px}.quest-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.quest-item{border:1px solid var(--border);background:#fff;border-radius:14px;padding:12px}.quest-item b,.quest-item span,.quest-item em{display:block}.quest-item b{font-size:13px;color:var(--navy)}.quest-item span{font-size:12px;color:var(--text);margin-top:5px}.quest-item em{font-style:normal;font-size:12px;color:#b77800;font-weight:900;margin-top:6px}.mini-bar,.game-progress,.big-progress{height:10px;background:#ece9ff;border-radius:999px;overflow:hidden}.mini-bar{height:7px;margin-top:8px}.mini-bar i,.game-progress i{display:block;height:100%;background:linear-gradient(90deg,#47d7b6,#6c5cff,#ff75a9);border-radius:inherit}.phase2-game-grid{grid-template-columns:repeat(3,1fr)}.action-game{padding:10px}.action-game-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:18px}.action-game-head h2{font-size:34px;margin:0}.action-game-head p{color:var(--text);margin:6px 0 0}.game-icon{font-size:46px;display:inline-block;margin-bottom:6px}.action-score{display:grid;grid-template-columns:repeat(2,auto);gap:4px 14px;background:#f3efff;border-radius:18px;padding:14px 18px;text-align:center}.action-score b{font-size:25px;color:var(--purple)}.action-score span{font-size:12px;color:var(--text)}.game-visual{border:1px solid var(--border);border-radius:20px;background:linear-gradient(180deg,#fff,#faf8ff);padding:20px;margin:12px 0 18px;text-align:center}.climb-track{height:230px;border-radius:18px;background:linear-gradient(180deg,#dff4ff,#f4ffe6);position:relative;overflow:hidden}.climb-track .tree{position:absolute;left:50%;bottom:0;transform:translateX(-50%);font-size:118px;opacity:.82}.dragon-climber{position:absolute;left:50%;transform:translateX(-50%);font-size:42px;transition:.4s}.hatch-egg{font-size:118px;filter:drop-shadow(0 18px 14px rgba(60,40,110,.18));animation:eggPulse 1.5s infinite}.hatch-egg.hatched{font-size:122px;animation:none}.chest-row{display:flex;justify-content:center;gap:28px;font-size:58px}.chest-row span{filter:grayscale(1);opacity:.38;transform:scale(.92);transition:.2s}.chest-row span.open{filter:none;opacity:1;transform:scale(1.08)}.speed-meter b{display:block;font-size:80px;color:var(--purple);line-height:.95}.speed-meter span{font-weight:900;color:var(--text)}.game-question{margin-top:18px}.game-question h3{text-align:center;font-size:24px;margin:0 0 16px}.game-question h3 em{font-style:normal;color:var(--purple)}.compact-game-choices{max-width:760px;margin:0 auto}.phase2-complete{border:1px solid #c7bfff;background:linear-gradient(135deg,#f9f5ff,#fff8e8)}.store-item img{width:72px;height:72px;object-fit:contain;display:block;margin:0 auto 6px}.dragon-store h3:after{content:'  • Egg Shells, Crowns, Accessories, Effects';font-size:13px;color:var(--text);font-weight:600}.game-progress-list{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.game-progress-list span{border:1px solid var(--border);border-radius:12px;padding:12px;background:#fbfaff;color:var(--text)}.game-progress-list b{display:block;color:var(--purple);font-size:24px}.future-card{background:linear-gradient(135deg,#fff,#f5faff)}.colorful-card{background:linear-gradient(135deg,#ffffff,#fff6fb)}
@keyframes eggPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06) rotate(-2deg)}}
@media(max-width:1050px){.phase2-game-grid,.quest-grid{grid-template-columns:repeat(2,1fr)}.action-game-head{display:block}.action-score{margin-top:12px;display:inline-grid}.game-progress-list{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.phase2-game-grid,.quest-grid,.game-progress-list{grid-template-columns:1fr}.hatch-egg{font-size:86px}.climb-track{height:180px}.chest-row{font-size:42px;gap:14px}.speed-meter b{font-size:58px}.game-question h3{font-size:20px}}

/* ===== Phase 3 Dragon Game System ===== */
.phase3-games .game-hero{
  background: linear-gradient(135deg,#fff,#f4f0ff);
  border:1px solid var(--border);
  border-radius:28px;
  padding:28px;
  box-shadow:var(--shadow);
  text-align:center;
}
.phase3-games .game-hero h2{font-size:34px;margin:0 0 8px;color:var(--navy)}
.phase3-game-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:18px}
.phase3-game-grid .game-card{min-height:210px;text-align:left;align-items:flex-start;justify-content:space-between;background:linear-gradient(180deg,#fff,#fbfaff)}
.phase3-game-grid .game-card span{font-size:46px;display:block;margin-bottom:8px}
.phase3-game-grid .game-card b{font-size:20px;color:var(--navy)}
.phase3-game-grid .game-card small{font-size:14px;line-height:1.45;color:var(--text);font-weight:650}
.phase3-game-grid .game-card em{color:var(--purple);font-weight:900;font-style:normal}
.phase3-game-grid .game-card.egg{background:linear-gradient(135deg,#fff8ed,#fff)}
.phase3-game-grid .game-card.hoard{background:linear-gradient(135deg,#fff8dc,#fff)}
.phase3-game-grid .game-card.fire{background:linear-gradient(135deg,#fff1e8,#fff)}
.phase3-game-grid .game-card.flight{background:linear-gradient(135deg,#eef8ff,#fff)}
.phase3-game-grid .game-card.hatchery{background:linear-gradient(135deg,#f4fff1,#fff)}
.phase3-game-grid .game-card.forge{background:linear-gradient(135deg,#f3f3ff,#fff)}
.dragon-game{background:#fff;border:1px solid var(--border);border-radius:28px;box-shadow:var(--shadow);padding:28px;max-width:1100px;margin:0 auto}
.dragon-game-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:22px}
.dragon-game-head h2{font-size:32px;margin:0 0 6px;color:var(--navy)}
.dragon-game-head p{margin:0;color:var(--text);font-size:16px}
.hoard-layout{display:grid;grid-template-columns:1fr 1.35fr;gap:22px}
.chest-column,.key-column{background:#fbfaff;border:1px solid var(--border);border-radius:22px;padding:18px}
.chest-column h3,.key-column h3{margin:0 0 14px;color:var(--navy)}
.hoard-chest,.hoard-key{width:100%;border:2px solid #e3dff5;background:#fff;border-radius:16px;padding:14px 16px;margin:8px 0;text-align:left;font-weight:850;color:var(--navy);cursor:pointer;transition:.15s ease;display:flex;gap:10px;align-items:center}
.hoard-key{font-weight:650;line-height:1.35}
.hoard-key.selected{border-color:var(--purple);background:#f1edff;box-shadow:0 8px 18px rgba(80,64,220,.12)}
.hoard-key.used,.hoard-chest.matched{opacity:.6;background:#ecfff0;border-color:#58b866;text-decoration:line-through}
.hoard-chest.wrong{border-color:#e35959;background:#fff0f0;animation:shake .35s}
.fire-board,.forge-board{text-align:center;background:#fbfaff;border:1px solid var(--border);border-radius:24px;padding:24px}
.dragon-flame{font-size:72px;transition:.2s ease}.dragon-flame.full{filter:drop-shadow(0 12px 20px rgba(255,120,30,.35));transform:scale(1.05)}
.heat-gauge{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:20px 0}
.heat-slot{border:2px dashed #d8d1ff;border-radius:18px;min-height:95px;background:#fff;color:var(--navy);font-weight:850;cursor:pointer}.heat-slot small{display:block;color:var(--purple);font-size:12px;margin-bottom:8px}.heat-slot.filled{border-style:solid;background:#fff5ed}.heat-slot.wrong{border-color:#e96b45;animation:shake .35s}
.fire-choices,.letter-bank,.forge-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.fire-choices button,.letter-bank button,.forge-actions button{border:1px solid var(--border);background:#fff;border-radius:999px;padding:11px 18px;font-weight:850;color:var(--navy);cursor:pointer}.fire-choices button:hover,.letter-bank button:hover{border-color:var(--purple);color:var(--purple)}
.flight-sky{position:relative;min-height:210px;border-radius:24px;background:linear-gradient(180deg,#eff8ff,#fff);border:1px solid var(--border);overflow:hidden;margin-bottom:22px}.flight-sky:before,.flight-sky:after{content:'☁️';position:absolute;font-size:80px;opacity:.45}.flight-sky:before{left:10%;top:40px}.flight-sky:after{right:12%;bottom:10px}.flight-dragon{position:absolute;top:28px;font-size:60px;transition:.25s ease;z-index:2}.cloud-sentence{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);background:#fff;border:1px solid var(--border);border-radius:22px;padding:18px 24px;font-size:22px;font-weight:850;color:var(--navy);box-shadow:var(--shadow);width:min(760px,80%)}
.hatchery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.egg-card{min-height:110px;border:2px solid #e3dff5;border-radius:18px;background:linear-gradient(180deg,#fff,#f7f5ff);font-size:40px;cursor:pointer;color:var(--navy);font-weight:850;transition:.15s ease}.egg-card.open{font-size:15px;background:#fff}.egg-card small{display:block;text-transform:uppercase;font-size:10px;color:var(--purple);margin-bottom:6px}.egg-card span{display:block;line-height:1.25}.egg-card.matched{background:#efffed;border-color:#5ac76b}.egg-card.wrong{background:#fff0f0;border-color:#e26464;animation:shake .35s}
.armor-dragon{font-size:78px}.forge-word{min-height:60px;background:#fff;border:2px dashed #d8d1ff;border-radius:18px;margin:18px auto;padding:16px;max-width:560px;font-size:28px;font-weight:950;color:var(--navy);letter-spacing:2px}.forge-word.wrong{border-color:#e26464;background:#fff0f0;animation:shake .35s}.letter-bank button{text-transform:uppercase;font-size:20px;min-width:44px}.game-complete{background:linear-gradient(135deg,#f2efff,#fff);border:1px solid var(--border);border-radius:22px;margin-top:18px;padding:20px;text-align:center}.game-complete h3{margin:0 0 6px;font-size:26px;color:var(--navy)}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media(max-width:900px){.phase3-game-grid{grid-template-columns:1fr}.dragon-game-head,.hoard-layout{grid-template-columns:1fr;display:grid}.hatchery-grid{grid-template-columns:repeat(2,1fr)}.heat-gauge{grid-template-columns:1fr}.cloud-sentence{font-size:17px;width:86%}}

/* Phase 4 refinements: polished game UI + CogAT chip/header fixes */
.cogat-batteries{grid-template-columns:repeat(3,minmax(0,1fr))!important;max-width:430px}
.study-actions{gap:14px}.coin-wallet{order:2}.invite-btn{order:1}.avatar-image-btn{order:3}.chev{order:4}.avatar-menu{order:5}

/* Game dashboard thumbnails */
.phase3-game-grid .game-card{position:relative;overflow:hidden;min-height:180px;text-align:left;padding:22px;border-radius:24px;background:linear-gradient(145deg,#fff,#f7f4ff);border:1.5px solid #e2dcff;box-shadow:0 18px 36px rgba(71,54,180,.12)}
.phase3-game-grid .game-card span{font-size:40px;width:68px;height:68px;border-radius:22px;display:flex;align-items:center;justify-content:center;background:#f0edff;margin-bottom:12px}
.phase3-game-grid .game-card b{font-size:22px;color:var(--navy);display:block;margin-bottom:8px}.phase3-game-grid .game-card small{font-size:14px;color:#4b5274;line-height:1.4;display:block}.phase3-game-grid .game-card em{position:absolute;right:20px;bottom:18px;font-style:normal;color:var(--purple);font-weight:900}

/* Premium game frames inspired by the reference mockups */
.dragon-game{background:linear-gradient(180deg,#fbfbff,#f5f2ff);border:1.5px solid #ded8ff;border-radius:28px;box-shadow:0 24px 60px rgba(74,57,197,.14);padding:24px;position:relative;overflow:hidden}
.dragon-game:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 12% 10%,rgba(118,92,255,.12),transparent 22%),radial-gradient(circle at 88% 16%,rgba(255,205,74,.12),transparent 18%);pointer-events:none}.dragon-game>*{position:relative;z-index:1}
.dragon-game-head{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center;margin-bottom:20px;text-align:left}.dragon-game-head h2{font-size:44px;margin:0;color:var(--navy);letter-spacing:-1px}.dragon-game-head p{font-size:16px;color:#4b5274;margin:6px 0 0;line-height:1.4}.action-score{display:grid;grid-template-columns:repeat(2,auto);gap:2px 8px;align-items:center;background:#fff;border:1.5px solid #ded8ff;border-radius:20px;padding:12px 18px;min-width:190px;box-shadow:0 8px 24px rgba(75,62,180,.08)}.action-score b{font-size:20px;color:var(--purple)}.action-score span{font-size:12px;color:#586078;font-weight:800}
.hoard-layout,.fire-board,.forge-board{background:#fff;border:1.5px solid #e4defd;border-radius:24px;box-shadow:0 16px 36px rgba(70,56,178,.10);padding:22px}.hoard-layout{display:grid;grid-template-columns:1fr 1fr;gap:26px}.chest-column h3,.key-column h3{font-size:22px;color:var(--purple);text-align:center}.hoard-chest,.hoard-key{min-height:66px;border:1.5px solid #ded8ff;border-radius:16px;background:#fff;box-shadow:0 7px 18px rgba(75,62,180,.06);font-size:16px}.hoard-chest span{font-size:30px;margin-right:10px}.hoard-key{padding:14px 18px}.hoard-key.selected{border-color:#7755f3;background:#f3efff}.hoard-chest.matched,.hoard-key.used{background:#f1fff3;border-color:#58c66c}.hoard-chest.wrong{background:#fff0f0;border-color:#e66868}
.fire-board{text-align:center}.dragon-flame{font-size:88px;margin:8px auto 12px;width:180px;height:150px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle,#fff4cf,#fff 70%)}.dragon-flame.full{background:radial-gradient(circle,#ffe3a2,#ff7e45 45%,#fff 72%);filter:drop-shadow(0 0 20px rgba(255,126,69,.45))}.fire-board h3{font-size:34px;margin:0;color:var(--navy)}.fire-board h3 em{color:var(--purple);font-style:normal}.heat-gauge{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:22px 0}.heat-slot{min-height:120px;border:2px dashed #cfc7ff;border-radius:20px;background:linear-gradient(180deg,#fff,#fbf9ff);font-weight:900}.heat-slot small{display:block;color:var(--purple);font-size:13px;margin-bottom:10px}.heat-slot b{font-size:18px}.heat-slot.filled{border-style:solid;background:#fff7e8;border-color:#ffb15f}.heat-slot.wrong{border-color:#e66868;background:#fff0f0}.fire-choices button,.letter-bank button{border:1.5px solid #ded8ff;background:#fff;border-radius:16px;padding:14px 22px;margin:6px;font-weight:900;color:var(--navy);box-shadow:0 8px 18px rgba(75,62,180,.08);cursor:pointer}
.flight-sky{position:relative;min-height:270px;border-radius:26px;background:linear-gradient(135deg,#cfe7ff,#fff3d5 48%,#dcd5ff);overflow:hidden;border:1.5px solid #ded8ff;box-shadow:inset 0 -30px 80px rgba(73,50,205,.10)}.flight-sky:before{content:"☁️ ☁️ ☁️";position:absolute;font-size:54px;left:7%;top:30%;opacity:.75}.flight-sky:after{content:"☁️ ☁️";position:absolute;font-size:64px;right:8%;bottom:18%;opacity:.78}.flight-dragon{position:absolute;top:36px;font-size:70px;transition:.3s;filter:drop-shadow(0 12px 12px rgba(0,0,0,.12))}.cloud-sentence{font-size:21px;line-height:1.35}.compact-game-choices{margin-top:18px}
.hatchery-grid{background:#fff;border:1.5px solid #ded8ff;border-radius:26px;box-shadow:0 16px 36px rgba(70,56,178,.10);padding:18px}.egg-card{min-height:128px;border-radius:22px;background:linear-gradient(180deg,#fff,#f5f2ff);box-shadow:0 10px 22px rgba(75,62,180,.08)}.egg-card:not(.open){font-size:54px}.egg-card.matched{background:#f1fff3;box-shadow:0 0 0 3px rgba(79,199,98,.18),0 10px 22px rgba(75,62,180,.08)}
.forge-board{text-align:center}.armor-dragon{font-size:96px;filter:drop-shadow(0 12px 16px rgba(75,62,180,.18))}.forge-word{background:linear-gradient(180deg,#fff,#fbf9ff);border-radius:20px}.forge-actions button,.game-actions button,.game-complete button{border:0;border-radius:14px;background:linear-gradient(180deg,#5a45ea,#4932cd);color:white;font-weight:900;padding:12px 20px;margin:6px;cursor:pointer}.game-complete{border:1.5px solid #ded8ff;background:linear-gradient(135deg,#fff7dd,#f2efff);border-radius:24px}.game-complete h3{font-size:28px;color:var(--navy)}
@media(max-width:900px){.dragon-game-head{grid-template-columns:1fr}.dragon-game-head h2{font-size:34px}.hoard-layout{grid-template-columns:1fr}.heat-gauge{grid-template-columns:1fr}.action-score{width:100%;min-width:0}.cogat-batteries{grid-template-columns:1fr!important}.study-actions{flex-wrap:wrap;justify-content:center}}


/* HatchElite Version 13 image integration */
.product-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.product-card .image-mascot img{max-width:190px;max-height:190px;object-fit:contain;filter:drop-shadow(0 16px 20px rgba(87,66,232,.12));}
.hatch-logo-img{max-height:64px;object-fit:contain;}
.level-icon.egg-icon img{width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 10px 14px rgba(78,60,180,.18));}
.title-icon{width:44px;height:44px;object-fit:contain;vertical-align:middle;margin-right:8px;}
.v13-game-hero{display:flex;align-items:center;justify-content:center;gap:20px;background:linear-gradient(135deg,#fff,#f3efff);border:1px solid #ded8ff;border-radius:24px;padding:18px;margin-bottom:18px;text-align:left;}
.v13-game-hero img{width:96px;height:96px;object-fit:contain;}
.v13-game-hero h2{margin:0 0 5px;font-size:34px;}
.v13-game-hero p{margin:0;color:var(--text);}
.v13-game-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
.v13-game-card{min-height:330px!important;padding:0!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;overflow:hidden;}
.v13-game-card>img{width:100%;height:175px;object-fit:cover;display:block;}
.v13-game-card b,.v13-game-card small{padding-left:18px;padding-right:18px;}
.v13-game-card b{padding-top:14px;}
.v13-game-card em{position:static!important;margin:auto 18px 16px auto;}
.game-hero-art{margin:-4px 0 22px;border-radius:24px;overflow:hidden;border:1px solid #ded8ff;box-shadow:0 18px 38px rgba(56,47,155,.14);background:#fff;}
.game-hero-art img{width:100%;height:320px;object-fit:cover;display:block;}
.hoard-chest,.hoard-key,.fire-word{display:flex!important;align-items:center;gap:12px;}
.hoard-chest img,.hoard-key img,.fire-word img{width:44px;height:44px;object-fit:contain;flex:0 0 auto;}
.fire-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;align-items:start;}
.fire-challenge,.fire-bank{background:#fff;border:1px solid var(--border);border-radius:20px;padding:18px;}
.base-word{font-size:54px;font-weight:1000;letter-spacing:-1px;color:var(--navy);text-align:center;margin:10px 0 16px;}
.heat-slot img{width:42px;height:42px;object-fit:contain;display:block;margin:0 auto 4px;}
.v13-flight-sky{position:relative;height:190px;border-radius:22px;background:linear-gradient(135deg,#eaf7ff,#f5efff);margin:16px 0;overflow:hidden;border:1px solid var(--border);}
.flight-dragon-img{position:absolute;top:24px;transform:translateX(-50%);transition:.4s;}
.flight-dragon-img img{width:120px;height:120px;object-fit:contain;filter:drop-shadow(0 12px 16px rgba(24,44,120,.22));}
.wind-choices .choice{display:flex;align-items:center;gap:10px;}
.wind-choices .choice img{width:34px;height:34px;object-fit:contain;}
.v13-hatchery-grid .egg-card img{width:54px;height:54px;object-fit:contain;display:block;margin:4px auto;}
.forge-visual{display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:12px;}
.forge-visual img{width:88px;height:88px;object-fit:contain;}
.forge-slots{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:center;margin:16px 0;min-height:82px;}
.crystal-letter,.crystal-slot{width:64px;height:64px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;background-size:contain;background-repeat:no-repeat;background-position:center;font-size:0;filter:drop-shadow(0 8px 10px rgba(82,70,190,.16));}
.crystal-slot{border:2px dashed #bdb4ff;background:rgba(255,255,255,.68);}
.v13-letter-bank{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
.v13-letter-bank button{border:0;background:transparent;padding:0;cursor:pointer;}
.v13-letter-bank .crystal-letter{width:58px;height:58px;}
.avatar-choice img{object-fit:contain!important;background:#fbfaff;}
@media(max-width:900px){.product-grid,.v13-game-grid,.fire-layout{grid-template-columns:1fr}.game-hero-art img{height:230px}.v13-game-hero{flex-direction:column;text-align:center}.v13-game-card{min-height:0!important}.v13-game-card>img{height:160px}}

/* Homepage viewport polish */
.home-page{padding-top:34px!important}
.home-page .compact-hero{margin-bottom:30px!important}
.home-page .hero h1{font-size:clamp(42px,4.4vw,56px)!important;margin-bottom:12px!important}
.home-page .hero p{font-size:18px!important;line-height:1.4!important}
.home-page .info-pill{margin-top:18px!important}
@media(max-width:900px){
  .study-layout .main-study-card{order:1}
  .study-layout .side-col{order:2}
  .study-layout .right-col{order:3}
}
@media(max-width:520px){
  .home-page .hero h1{font-size:38px!important}
  .home-page .hero p{font-size:16px!important}
}

/* Spaced review and gating polish */
.locked-tab{opacity:.72}
.chev{width:34px;height:34px;border-radius:50%;display:inline-flex!important;align-items:center;justify-content:center;background:#f4f2ff!important;color:#5742e8!important;font-size:18px!important;line-height:1!important}
.review-schedule-card{display:grid;gap:10px;margin:18px auto;max-width:760px}
.review-due-row{display:grid;grid-template-columns:1fr auto auto;gap:8px 12px;align-items:center;border:1px solid var(--border);border-radius:14px;background:#fff;padding:13px 14px;text-align:left;box-shadow:0 8px 18px rgba(23,28,80,.04)}
.review-due-row b{display:block;font-size:17px;color:var(--navy);line-height:1.2}
.review-due-row span,.review-due-row small{display:block;color:var(--text);font-size:12.5px;line-height:1.35}
.review-due-row small{grid-column:1/-1}
.review-due-row em{font-style:normal;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:900}
.review-due-row strong{font-size:12px;color:#384467}
.forget-critical{background:#ffe8e8;color:#c92f2f}
.forget-high{background:#fff0d8;color:#c66b00}
.forget-medium{background:#eef0ff;color:#5742e8}
.forget-warm-up{background:#eaf8ef;color:#168044}

.memory-path-home{margin-top:26px;background:linear-gradient(135deg,#fff,#f7f4ff);border:1px solid var(--border);border-radius:20px;box-shadow:var(--shadow);padding:26px;display:grid;grid-template-columns:minmax(0,1fr);gap:20px}
.memory-copy{max-width:860px;margin:0 auto;text-align:center}.memory-copy .eyebrow{display:inline-block;border-radius:999px;background:#f0edff;color:var(--purple);font-weight:950;font-size:13px;padding:7px 13px;margin-bottom:10px}.memory-copy h2{font-size:34px;margin:0 0 10px;color:var(--navy)}.memory-copy p{margin:0 auto;color:var(--text);font-size:16px;line-height:1.55;max-width:780px}.memory-copy strong{display:block;margin:12px 0 16px;color:var(--navy)}
.memory-timeline,.how-memory-band{display:flex;align-items:center;justify-content:center;gap:9px;flex-wrap:wrap}.memory-timeline span,.how-memory-band b,.memory-mini-path span{border:1.5px solid #ded8ff;background:#fff;border-radius:999px;padding:9px 13px;color:var(--purple);font-weight:950;font-size:13px;box-shadow:0 8px 18px rgba(75,62,180,.06)}.memory-timeline i,.how-memory-band i{width:22px;height:2px;background:#c9c0ff;border-radius:99px}
.upgrade-highlight{border:1px solid #ded8ff;background:#fbfaff;border-radius:14px;padding:12px 14px;margin:12px 0}.upgrade-highlight b,.upgrade-highlight span{display:block}.upgrade-highlight b{color:var(--purple)}.upgrade-highlight span{color:var(--text);font-size:13px;margin-top:4px}
#howModal ol{display:none}.how-lede{color:var(--text);font-size:16px;line-height:1.5}.how-steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:16px 0}.how-steps div{border:1px solid var(--border);background:#fff;border-radius:14px;padding:14px}.how-steps b,.how-steps span{display:block}.how-steps b{color:var(--navy);font-size:16px}.how-steps span{color:var(--text);font-size:13px;line-height:1.4;margin-top:5px}.how-memory-band{border:1px dashed #c9c0ff;background:#fbfaff;border-radius:16px;padding:14px;margin-top:14px}.memory-mini-path{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:16px}.home-how-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;border:1px solid var(--border);background:#fff;color:var(--purple);border-radius:999px;min-height:34px;padding:0 14px;font-weight:900;cursor:pointer;box-shadow:0 8px 18px rgba(80,60,160,.06)}.home-how-link img{width:18px;height:18px;object-fit:contain}.how-modal{width:min(780px,94vw)!important;padding:24px!important}.how-modal-head{display:grid;grid-template-columns:52px minmax(0,1fr);gap:14px;align-items:start;margin-bottom:16px;padding-right:44px}.how-title-icon{width:52px;height:52px;border-radius:18px;background:#f3efff;border:1px solid var(--border);display:grid;place-items:center}.how-title-icon img{width:30px;height:30px;object-fit:contain}.how-modal-head h2{margin:0 0 6px!important;color:var(--navy);font-size:30px}.how-modal-head p{margin:0;color:var(--text);font-size:15px;line-height:1.45;font-weight:650}.how-work-sections{display:grid;gap:12px}.how-work-card{display:grid;grid-template-columns:58px minmax(0,1fr);gap:14px;border:1px solid var(--border);background:linear-gradient(180deg,#fff,#fbfaff);border-radius:18px;padding:14px}.how-work-card>img{width:58px;height:58px;object-fit:contain;border-radius:16px;background:#fff}.how-work-card h3{margin:0 0 6px;color:var(--navy);font-size:17px}.how-work-card p{margin:0;color:var(--text);font-size:13.5px;line-height:1.5}.how-work-card small{display:block;color:#5f6785;font-weight:750;line-height:1.4;margin-top:9px}.how-work-card .how-memory-band{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;margin:10px 0 0;padding:10px}.how-work-card .how-memory-band b{font-size:12px;color:var(--purple);background:#fff;border:1px solid #ded8ff;border-radius:999px;padding:6px 9px}.how-work-card .how-memory-band i{width:12px;height:2px;background:#c9c0ff;border-radius:999px}.how-closing-line{text-align:center;color:var(--navy);font-size:18px;font-weight:950;margin:16px 0 12px}.how-learn-more{display:flex;align-items:center;justify-content:center;width:min(280px,100%);min-height:46px;margin:0 auto;border:0;border-radius:14px;background:linear-gradient(135deg,#7b5cff,#5135df);color:white;font-size:15px;font-weight:950;cursor:pointer;box-shadow:0 12px 28px rgba(82,64,160,.18)}
.memory-info-btn{margin-top:10px;border:1.5px solid #ded8ff;background:#fff;color:var(--purple);border-radius:999px;padding:9px 16px;font-weight:950;cursor:pointer}
@media(max-width:720px){.memory-path-home{padding:18px}.memory-copy h2{font-size:26px}.memory-timeline,.how-memory-band{gap:6px}.memory-timeline i,.how-memory-band i{display:none}.how-steps{grid-template-columns:1fr}.how-modal{padding:20px 16px!important}.how-modal-head{grid-template-columns:42px minmax(0,1fr);gap:10px}.how-title-icon{width:42px;height:42px;border-radius:14px}.how-title-icon img{width:24px;height:24px}.how-modal-head h2{font-size:24px!important}.how-modal-head p{font-size:13px}.how-work-card{grid-template-columns:1fr;padding:13px}.how-work-card>img{width:48px;height:48px}.how-work-card .how-memory-band{justify-content:flex-start}.home-how-link{margin-top:10px}}

.home-strip .feature-icon{background:#f0edff!important;overflow:hidden;padding:8px}
.home-strip .feature-icon img{width:100%;height:100%;object-fit:contain;display:block}
.home-strip .feature b{white-space:normal!important;font-size:14px!important;line-height:1.18!important}
.home-strip .feature span{font-size:12.5px!important;line-height:1.32!important;max-width:none!important}
@media(max-width:1180px){.home-strip{grid-template-columns:repeat(2,1fr)!important}.home-strip .feature{border-right:0!important;border-bottom:1px solid var(--border)!important}.home-strip .feature:last-child{border-bottom:0!important}}

.home-page .home-strip{margin-top:34px;padding:30px 32px!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:0!important;border-radius:22px!important;background:#fff!important;align-items:stretch!important}
.home-page .home-strip .feature{display:grid!important;grid-template-columns:116px minmax(0,1fr)!important;gap:18px!important;align-items:center!important;min-height:132px!important;padding:0 28px!important;border-right:1.5px solid #dfdcf0!important;border-bottom:0!important}
.home-page .home-strip .feature:last-child{border-right:0!important}
.home-page .home-strip .feature-icon{width:104px!important;height:104px!important;border-radius:50%!important;flex:0 0 104px!important;background:#f0edff!important;padding:14px!important;box-shadow:none!important}
.home-page .home-strip .feature-icon img{width:100%!important;height:100%!important;object-fit:contain!important}
.home-page .home-strip .feature b{font-size:20px!important;line-height:1.22!important;color:var(--navy)!important;letter-spacing:0!important;margin:0 0 16px!important}
.home-page .home-strip .feature span{font-size:16px!important;line-height:1.42!important;color:var(--text)!important;max-width:220px!important}
@media(max-width:1280px){.home-page .home-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}.home-page .home-strip .feature{border-right:0!important;border-bottom:1.5px solid #dfdcf0!important}.home-page .home-strip .feature:nth-child(odd){border-right:1.5px solid #dfdcf0!important}.home-page .home-strip .feature:last-child{border-right:0!important;border-bottom:0!important}}
@media(max-width:720px){.home-page .home-strip{grid-template-columns:1fr!important;padding:18px!important}.home-page .home-strip .feature{grid-template-columns:82px 1fr!important;min-height:104px!important;padding:14px 4px!important;border-right:0!important}.home-page .home-strip .feature:nth-child(odd){border-right:0!important}.home-page .home-strip .feature-icon{width:76px!important;height:76px!important;padding:10px!important}.home-page .home-strip .feature b{font-size:17px!important;margin-bottom:8px!important}.home-page .home-strip .feature span{font-size:14px!important;max-width:none!important}}

/* Premium homepage feature row */
.home-page .premium-feature-row{
  width:100%!important;
  max-width:none!important;
  margin:34px auto 0!important;
  padding:28px 24px!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;
  background:#ffffff!important;
  border:1px solid #d9d8e8!important;
  border-radius:22px!important;
  box-shadow:0 18px 44px rgba(29,31,78,.08)!important;
}
.home-page .premium-feature-row .feature-item{
  min-width:0!important;
  min-height:150px!important;
  padding:0 22px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:20px!important;
  border-right:1px solid #d9d8e8!important;
  border-bottom:0!important;
  background:transparent!important;
}
.home-page .premium-feature-row .feature-item:last-child{border-right:0!important}
.feature-icon-circle{
  width:112px!important;
  height:112px!important;
  min-width:112px!important;
  border-radius:50%!important;
  background:transparent!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  box-shadow:none!important;
  padding:0!important;
}
.feature-icon-circle img{
  width:118px!important;
  height:118px!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
}
.feature-text{min-width:0!important;text-align:left!important}
.feature-text h3{
  margin:0 0 14px!important;
  color:#0d1b5e!important;
  font-size:21px!important;
  line-height:1.22!important;
  font-weight:1000!important;
  letter-spacing:0!important;
}
.feature-text p{
  margin:0!important;
  color:#49557a!important;
  font-size:15.5px!important;
  line-height:1.5!important;
  font-weight:500!important;
}
@media(max-width:1250px){
  .home-page .premium-feature-row{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:22px!important}
  .home-page .premium-feature-row .feature-item{padding:22px!important;border-right:0!important;border-bottom:1px solid #d9d8e8!important}
  .home-page .premium-feature-row .feature-item:nth-child(odd){border-right:1px solid #d9d8e8!important}
  .home-page .premium-feature-row .feature-item:last-child{border-bottom:0!important;border-right:0!important}
}
@media(max-width:720px){
  .home-page .premium-feature-row{grid-template-columns:1fr!important;padding:16px!important}
  .home-page .premium-feature-row .feature-item{padding:18px 4px!important;gap:16px!important;border-right:0!important;border-bottom:1px solid #d9d8e8!important}
  .home-page .premium-feature-row .feature-item:nth-child(odd){border-right:0!important}
  .feature-icon-circle{width:104px!important;height:104px!important;min-width:104px!important}
  .feature-icon-circle img{width:108px!important;height:108px!important}
  .feature-text h3{font-size:19px!important;margin-bottom:8px!important}
  .feature-text p{font-size:14.5px!important}
}

/* Pricing comparison page */
.level-benefits-hidden{display:none!important}
.level-grid.ssat{grid-template-columns:repeat(3,minmax(260px,1fr))!important;max-width:1120px;margin:0 auto}
.level-grid.ssat .level-card{min-height:176px!important;grid-template-columns:98px 1fr!important;grid-template-rows:1fr auto!important;align-items:center!important;padding:22px!important}
.level-grid.ssat .level-card .level-icon{width:88px!important;height:88px!important;background:linear-gradient(180deg,#f2f0ff,#fff)!important}
.level-grid.ssat .level-card .level-icon img{width:88px!important;height:88px!important;object-fit:contain!important}
.level-grid.ssat .level-card .level-feature,.level-grid.ssat .level-card .pricing-row{display:none!important}
.level-grid.ssat .level-card .start{grid-column:1/-1!important;align-self:end!important;margin-top:12px!important}
.pricing-comparison{max-width:1120px;margin:22px auto 0;background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow);padding:18px 20px 22px}
.pricing-comparison h2{text-align:center;margin:0 0 12px;font-size:25px;color:var(--navy)}
.comparison-scroll{overflow-x:auto;border:1px solid #dddcec;border-radius:12px}
.comparison-table{width:100%;min-width:820px;border-collapse:collapse;background:#fff;color:var(--navy)}
.comparison-table th,.comparison-table td{border-bottom:1px solid #dddcec;border-right:1px solid #dddcec;padding:8px 12px;text-align:center;font-size:15px}
.comparison-table th:last-child,.comparison-table td:last-child{border-right:0}
.comparison-table th{background:#fbfaff;font-weight:950}
.comparison-table td:first-child{text-align:left;font-weight:850;display:flex;align-items:center;gap:12px}
.comparison-table td:first-child img{width:22px;height:22px;object-fit:contain;flex:0 0 auto}
.comparison-table .check-icon{width:18px;height:18px;object-fit:contain}
.comparison-table .limited{color:#293454;font-weight:650;background:transparent}
.comparison-table .nope{color:#e00000;font-size:24px;font-weight:950;line-height:1}
.comparison-table .yearly-col{background:#fff7e5;border-left:1.5px solid #ffc44d;border-right:1.5px solid #ffc44d}
.comparison-table th.yearly-col{border-top:1.5px solid #ffc44d;border-top-left-radius:10px;border-top-right-radius:10px}
.comparison-table tbody tr:last-child .yearly-col{border-bottom:1.5px solid #ffc44d}
.comparison-table .price-row td{font-size:19px;font-weight:1000;padding:12px}
.pricing-actions{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:18px;margin-top:14px;align-items:center}
.pricing-cta{min-height:48px;border-radius:10px;font-size:18px;font-weight:950;cursor:pointer}
.pricing-cta.free{background:#fff;color:var(--purple);border:1.5px solid var(--purple)}
.pricing-cta.monthly{background:linear-gradient(180deg,#5a45ea,#4932cd);color:#fff;border:0}
.pricing-cta.yearly{background:linear-gradient(180deg,#ffd767,#ffb414);color:#07133f;border:0}
.pricing-cta.selected{box-shadow:0 0 0 4px rgba(87,66,232,.12)}
@media(max-width:1050px){.level-grid.ssat{grid-template-columns:1fr!important;max-width:620px}.pricing-actions{grid-template-columns:1fr}.pricing-actions span{display:none}.pricing-cta{width:100%}}
@media(max-width:620px){.pricing-comparison{padding:14px}.pricing-comparison h2{font-size:22px}.level-grid.ssat .level-card{grid-template-columns:86px 1fr!important;padding:18px!important}.level-grid.ssat .level-card .level-icon,.level-grid.ssat .level-card .level-icon img{width:76px!important;height:76px!important}}

/* Pic 1 pricing cards + light Full Access block */
.level-grid.ssat{grid-template-columns:repeat(3,minmax(280px,1fr))!important;max-width:1200px!important;gap:18px!important}
.level-grid.ssat .level-card{display:flex!important;flex-direction:column!important;align-items:stretch!important;min-height:270px!important;padding:18px!important;position:relative!important}
.level-grid.ssat .level-card{grid-template-columns:none!important;grid-template-rows:none!important}
.level-grid.ssat .level-card>.level-icon{position:absolute!important;width:78px!important;height:78px!important}
.level-grid.ssat .level-card>.level-icon img{width:78px!important;height:78px!important;object-fit:contain!important}
.level-grid.ssat .level-card>div:nth-child(2){margin-left:104px!important;min-height:78px!important;display:flex!important;flex-direction:column!important;justify-content:center!important}
.level-grid.ssat .level-card h3{font-size:24px!important;margin-bottom:8px!important}
.level-grid.ssat .level-card p{font-size:15px!important}
.level-grid.ssat .level-card .level-feature{display:block!important;border-top:1px solid #dddcec!important;margin-top:16px!important;padding:14px 0!important;text-align:center!important;color:#384467!important;font-size:13.5px!important}
.level-grid.ssat .level-card .pricing-row{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;min-height:72px!important;border:1px solid #dddcec!important;border-radius:12px!important;overflow:hidden!important;margin-top:0!important}
.level-grid.ssat .level-card .price-choice{display:block!important;min-height:72px!important;padding:12px 10px!important;background:#fff!important;border-right:1px solid #dddcec!important;font-size:13px!important;cursor:pointer}
.level-grid.ssat .level-card .price-choice:last-child{border-right:0!important}
.level-grid.ssat .level-card .price-choice b{font-size:14px!important;color:#07133f!important}
.level-grid.ssat .level-card .price-choice small{font-size:12px!important;margin-left:24px!important;color:#49557a!important;line-height:1.2!important}
.level-grid.ssat .level-card .price-choice .tag{display:inline-block!important;margin-left:24px!important;margin-top:4px!important;background:#f3d06a!important;color:#07133f!important;border-radius:999px!important;padding:3px 10px!important;font-size:11px!important;font-weight:950!important}
.level-grid.ssat .level-card .start{margin-top:auto!important;min-height:50px!important;font-size:18px!important}
.full-access-unlocks{max-width:1200px;margin:18px auto 0;background:#fff;border:1px solid #dddcec;border-radius:18px;box-shadow:var(--shadow);padding:18px 24px 22px}
.full-access-unlocks h2{text-align:center;color:#07133f;font-size:24px;margin:0 0 18px}.full-access-unlocks h2 span{color:#5742e8;font-size:18px}
.unlock-icon-row{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:0;margin-bottom:22px}
.unlock-icon-item{display:grid;justify-items:center;text-align:center;gap:8px;padding:0 12px;border-right:1px solid #dddcec}
.unlock-icon-item:last-child{border-right:0}
.unlock-icon-item i{width:62px;height:62px;border-radius:50%;background:#f0eefc;display:flex;align-items:center;justify-content:center}
.unlock-icon-item img{width:34px;height:34px;object-fit:contain;display:block}
.unlock-icon-item b{font-size:14px;line-height:1.25;color:#07133f}
.plan-summary-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #dddcec;border-radius:12px;overflow:hidden}
.plan-summary-card{display:grid;grid-template-columns:92px 1fr;gap:16px;align-items:center;min-height:116px;padding:18px 24px;text-align:left;background:#fff;border:0;border-right:1px solid #dddcec;color:#07133f;cursor:pointer}
.plan-summary-card:last-child{border-right:0}
.plan-summary-card i{width:70px;height:70px;border-radius:50%;background:#f0eefc;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:34px;color:#5742e8}
.plan-summary-card h3{margin:0 0 7px;font-size:20px;color:#07133f}.plan-summary-card p{margin:0;color:#49557a;font-size:14.5px;line-height:1.4}.plan-summary-card strong{font-weight:950;color:#07133f}.plan-summary-card.yearly{background:#fff8e8;border:1.5px solid #f2c454}.plan-summary-card.yearly i{background:#fff;border:2px solid #f4de9a;color:#d4a21c}.plan-summary-card.yearly em{display:inline-block;margin-top:7px;background:#f3d06a;color:#07133f;border-radius:999px;padding:4px 14px;font-style:normal;font-weight:950;font-size:13px}
@media(max-width:1050px){.level-grid.ssat{grid-template-columns:1fr!important;max-width:650px!important}.unlock-icon-row{grid-template-columns:repeat(4,1fr);gap:16px}.unlock-icon-item:nth-child(4n){border-right:0}.plan-summary-strip{grid-template-columns:1fr}.plan-summary-card{border-right:0;border-bottom:1px solid #dddcec}.plan-summary-card:last-child{border-bottom:0}}
@media(max-width:620px){.level-grid.ssat .level-card>div:nth-child(2){margin-left:92px!important}.level-grid.ssat .level-card .pricing-row{grid-template-columns:1fr!important}.level-grid.ssat .level-card .price-choice{border-right:0!important;border-bottom:1px solid #dddcec!important}.unlock-icon-row{grid-template-columns:repeat(2,1fr)}.unlock-icon-item{border-right:0}.plan-summary-card{grid-template-columns:70px 1fr;padding:16px}.plan-summary-card i{width:56px;height:56px;font-size:26px}}

/* Pricing page final layout tuning */
#levelPage{max-width:1500px!important}
.level-grid.ssat{
  max-width:1500px!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:24px!important;
}
.level-grid.ssat .level-card{
  min-height:330px!important;
  padding:24px!important;
  border-radius:22px!important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
}
.level-grid.ssat .level-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(79,70,229,.16)!important;
  border-color:rgba(91,77,246,.28)!important;
}
.level-grid.ssat .level-card>.level-icon{
  width:90px!important;
  height:90px!important;
}
.level-grid.ssat .level-card>.level-icon img{
  width:88px!important;
  height:88px!important;
}
.level-grid.ssat .level-card>div:nth-child(2){
  margin-left:120px!important;
  min-height:90px!important;
}
.level-grid.ssat .level-card .level-feature{
  margin-top:18px!important;
  padding:15px 0!important;
}
.level-grid.ssat .level-card .pricing-row{
  min-height:78px!important;
}
.level-grid.ssat .level-card .price-choice{
  min-height:78px!important;
  transition:all .2s ease!important;
  cursor:pointer!important;
}
.level-grid.ssat .level-card .price-choice:hover{
  background:#f3f1ff!important;
  box-shadow:inset 0 0 0 1px rgba(91,77,246,.25)!important;
}
.level-grid.ssat .level-card .price-choice.selected{
  background:#fafaff!important;
}
.level-grid.ssat .level-card .price-choice .tag{
  display:inline-block!important;
  margin-top:4px!important;
  padding:2px 10px!important;
  border-radius:999px!important;
  background:#f7d879!important;
  color:#111827!important;
  font-size:12px!important;
  font-weight:900!important;
  font-style:italic!important;
}
.level-grid.ssat .level-card .start{
  width:100%!important;
  margin-top:18px!important;
  padding:14px 20px!important;
  min-height:54px!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,#6256f6 0%,#4f46e5 100%)!important;
  color:#fff!important;
  font-weight:900!important;
  font-size:18px!important;
  text-align:center!important;
  box-shadow:0 10px 22px rgba(79,70,229,.22)!important;
  align-self:stretch!important;
}
.full-access-unlocks{
  max-width:1500px!important;
  margin-top:18px!important;
  padding:22px 26px!important;
  border-radius:24px!important;
}
.unlock-icon-row{
  grid-template-columns:repeat(8,1fr)!important;
  gap:0!important;
  margin-top:18px!important;
  margin-bottom:20px!important;
}
.unlock-icon-item{
  padding:8px 10px!important;
  border-right:1px solid #eceafd!important;
}
.unlock-icon-item:last-child{border-right:none!important}
.unlock-icon-item i{
  width:54px!important;
  height:54px!important;
  margin:0 auto 8px!important;
}
.unlock-icon-item img{
  width:28px!important;
  height:28px!important;
}
.unlock-icon-item b{
  font-size:14px!important;
  font-weight:900!important;
  line-height:1.15!important;
}
.plan-summary-strip{
  margin-top:20px!important;
  grid-template-columns:repeat(3,1fr)!important;
  border:1px solid #e4e2f7!important;
  border-radius:18px!important;
  overflow:hidden!important;
}
.plan-summary-card{
  display:grid!important;
  grid-template-columns:58px 1fr!important;
  align-items:center!important;
  gap:16px!important;
  padding:18px 22px!important;
  min-height:112px!important;
  transition:all .2s ease!important;
}
.plan-summary-card:hover{background:#faf9ff!important}
.plan-summary-card.yearly:hover{background:#fff6dc!important}
.plan-summary-card i{
  width:58px!important;
  height:58px!important;
  font-size:28px!important;
}
.plan-summary-card h3{
  font-size:20px!important;
  margin-bottom:4px!important;
}
.plan-summary-card p{
  font-size:14px!important;
  line-height:1.45!important;
  margin:0!important;
}
@media(max-width:1050px){
  .level-grid.ssat{grid-template-columns:1fr!important;max-width:680px!important}
  .unlock-icon-row{grid-template-columns:repeat(4,1fr)!important}
  .unlock-icon-item:nth-child(4n){border-right:0!important}
  .plan-summary-strip{grid-template-columns:1fr!important}
}
@media(max-width:620px){
  .level-grid.ssat .level-card{min-height:0!important;padding:18px!important}
  .level-grid.ssat .level-card>.level-icon{width:76px!important;height:76px!important}
  .level-grid.ssat .level-card>.level-icon img{width:74px!important;height:74px!important}
  .level-grid.ssat .level-card>div:nth-child(2){margin-left:92px!important;min-height:76px!important}
  .unlock-icon-row{grid-template-columns:repeat(2,1fr)!important}
  .unlock-icon-item{border-right:0!important}
  .plan-summary-card{grid-template-columns:58px 1fr!important}
}


.game-stage-v2{padding:8px 6px 18px;position:relative;overflow:hidden}
.study-layout.game-layout{grid-template-columns:minmax(0,1fr);max-width:1220px;margin:0 auto}
.study-layout.game-layout .side-col,.study-layout.game-layout .right-col{display:none}
.study-layout.game-layout .main-study-card{padding:24px}
.game-stage-v2:before,.game-stage-v2:after{content:"";position:absolute;border:2px solid #e4defd;border-radius:999px;opacity:.7;z-index:0}
.game-stage-v2:before{width:102px;height:102px;right:36px;top:50px}
.game-stage-v2:after{width:74px;height:74px;left:28px;top:68px;background:#f2efff}
.game-v2-head,.game-v2-board,.game-answer-strip,.game-v2-footer{position:relative;z-index:1}
.game-v2-head{text-align:center;display:grid;gap:14px;justify-items:center;margin-bottom:18px}
.game-v2-head h2{font-size:46px;line-height:1.02;margin:0;color:var(--navy);letter-spacing:0}
.game-v2-head p{font-size:16px;color:#384166;margin:8px 0 0}
.game-v2-head strong{display:block;color:var(--purple);font-size:16px;margin-top:10px}
.game-v2-stats{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.game-v2-pill{min-width:150px;display:flex;align-items:center;justify-content:center;gap:8px;border:1.5px solid #ded8ff;border-radius:999px;background:#fff;box-shadow:0 10px 22px rgba(72,56,178,.08);padding:10px 18px;font-weight:950;color:var(--purple)}
.game-v2-pill b{font-size:18px;color:var(--navy)}.game-v2-pill small{font-size:12px;color:#56607c;font-weight:850}
.game-v2-board{display:grid;grid-template-columns:280px minmax(360px,1fr) 280px;gap:18px;align-items:start}
.game-v2-panel{background:#fff;border:1.5px solid #ded8ff;border-radius:20px;padding:18px;box-shadow:0 14px 32px rgba(71,54,180,.09)}
.game-v2-panel h3{text-align:center;color:var(--purple);font-size:22px;margin:0 0 8px}
.game-v2-panel p{color:#3f4868;font-size:14px;line-height:1.42;margin:0 0 14px;text-align:center}
.game-v2-center{text-align:center;min-width:0}
.game-v2-art{width:100%;height:330px;object-fit:cover;border-radius:28px;display:block;box-shadow:0 18px 42px rgba(42,35,140,.14)}
.game-center-banner{width:min(560px,92%);margin:-18px auto 0;background:linear-gradient(180deg,#6b55ef,#4932cd);color:#fff;border-radius:20px;padding:14px 22px;font-size:21px;font-weight:950;box-shadow:0 10px 24px rgba(73,50,205,.22);position:relative}
.v2-list{display:grid;gap:10px}.v2-list button{width:100%;min-height:58px}
.game-stage-v2 .hoard-chest,.game-stage-v2 .hoard-key,.game-stage-v2 .fire-word,.game-stage-v2 .choice{border:1.5px solid #ded8ff;border-radius:15px;background:#fff;box-shadow:0 8px 18px rgba(75,62,180,.06);padding:12px 14px;color:var(--navy);cursor:pointer}
.game-stage-v2 .hoard-chest,.game-stage-v2 .hoard-key,.game-stage-v2 .fire-word,.game-stage-v2 .wind-choice{display:flex!important;align-items:center;gap:10px;text-align:left;font-weight:900}
.game-stage-v2 .hoard-chest img,.game-stage-v2 .hoard-key img,.game-stage-v2 .fire-word img,.game-stage-v2 .wind-choice img{width:38px;height:38px;object-fit:contain}
.game-stage-v2 .hoard-chest>span,.game-stage-v2 .wind-choice>span{width:30px;height:30px;display:grid;place-items:center;border-radius:999px;background:#f1edff;color:var(--purple);font-weight:950;flex:0 0 auto}
.game-stage-v2 .hoard-key span,.game-stage-v2 .wind-choice b{font-size:14px;line-height:1.35}
.game-stage-v2 .matched,.game-stage-v2 .used,.scale-list .done{background:#efffed!important;border-color:#59c66b!important}
.base-word{font-size:42px;font-weight:1000;color:var(--navy);text-align:center;margin:4px 0 12px}
.game-hint{background:#fbfaff;border:1px solid #eee9ff;border-radius:14px;padding:10px!important}
.v2-heat{grid-template-columns:1fr;gap:10px;margin:12px 0 0}.v2-heat .heat-slot{min-height:84px;padding:10px}
.sentence-card{background:#fbfaff;border:1px solid #e5dfff;border-radius:18px;padding:24px 18px;font-size:22px;line-height:1.55;color:var(--navy);font-weight:850}
.flight-meter{height:74px;position:relative;margin:-78px auto 10px;width:88%}.flight-meter span{position:absolute;top:0;transform:translateX(-50%);transition:.3s}.flight-meter img{width:86px;height:86px;object-fit:contain;filter:drop-shadow(0 12px 14px rgba(20,36,110,.18))}
.v2-hatchery-grid{grid-template-columns:repeat(4,1fr);padding:14px;gap:10px}.v2-hatchery-grid .egg-card{min-height:104px}.v2-hatchery-grid .egg-card span{font-size:14px}
.game-steps{margin:16px 0 0;padding-left:22px;color:#29355d;font-weight:800;line-height:1.8}.hatchling-mini{display:grid;grid-template-columns:1fr 1fr;gap:10px}.hatchling-mini span{border:1px solid #ded8ff;border-radius:14px;padding:8px;text-align:center}.hatchling-mini img{width:58px;height:58px;object-fit:contain}.hatchling-mini b{display:block;font-size:12px;color:var(--navy)}
.forge-preview{display:flex;justify-content:center;align-items:center;gap:12px;margin:-78px auto 10px}.forge-preview img{width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 10px 12px rgba(62,48,160,.15))}
.scale-list{display:grid;gap:9px}.scale-list span{display:flex;align-items:center;gap:10px;border:1px solid #ded8ff;border-radius:14px;padding:9px;background:#fbfaff}.scale-list img{width:34px;height:34px;object-fit:contain}.scale-list b{font-size:13px;color:var(--navy)}
.game-answer-strip{margin:18px auto 0;background:#fffdf7;border:1.5px solid #efd790;border-radius:18px;padding:16px;max-width:980px;box-shadow:0 12px 26px rgba(117,88,0,.08)}
.game-answer-strip h3{margin:0 0 10px;color:#7a5600}.game-answer-strip ul{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:0;padding:0;list-style:none}.game-answer-strip li{background:#fff;border-radius:12px;padding:10px 12px}.game-answer-strip b,.game-answer-strip span{display:block}.game-answer-strip b{color:var(--navy)}.game-answer-strip span{font-size:13px;line-height:1.4;color:#48506c}
.game-v2-footer{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:20px}.game-v2-footer button{border-radius:999px;min-height:46px;padding:0 22px;font-weight:950;cursor:pointer}.primary-game-btn{border:0;background:linear-gradient(180deg,#6b55ef,#4932cd);color:#fff}.soft-game-btn{border:1.5px solid #ded8ff;background:#fff;color:var(--purple)}
.answer-panel p{font-size:15px}.answer-panel p b{font-size:inherit;line-height:inherit}.word-display h2{letter-spacing:0}.definition-front .word-display h2,.sentence-card b{font-size:inherit}

.report-metrics div:nth-child(1){background:linear-gradient(135deg,#ffffff,#effbf5)}
.report-metrics div:nth-child(2){background:linear-gradient(135deg,#ffffff,#f2efff)}
.report-metrics div:nth-child(3){background:linear-gradient(135deg,#ffffff,#eef8ff)}
.report-metrics div:nth-child(4){background:linear-gradient(135deg,#ffffff,#fff4e1)}
.report-metrics div:nth-child(5){background:linear-gradient(135deg,#ffffff,#fff1f6)}

@media(max-width:1100px){.game-v2-board{grid-template-columns:1fr}.game-v2-art{height:300px}.game-v2-panel{order:2}.game-v2-center{order:1}.game-v2-right{order:3}.game-answer-strip ul{grid-template-columns:1fr}}
@media(max-width:620px){.game-v2-head h2{font-size:34px}.game-v2-art{height:220px;border-radius:20px}.game-center-banner{font-size:16px}.game-v2-pill{min-width:130px}.v2-hatchery-grid{grid-template-columns:repeat(2,1fr)}.sentence-card{font-size:18px}.base-word{font-size:34px}}
.review-health{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:6px 0 12px}
.review-health b{font-size:38px;color:var(--purple);line-height:1}
.review-health span{font-weight:900;color:var(--navy)}
.review-health strong{margin-left:auto;color:#c66b00}
.locked-report.in-card{box-shadow:none}
.locked-panel{position:relative;opacity:.82}
.locked-panel:after{content:"Full Access";position:absolute;right:12px;top:12px;border-radius:999px;background:#f1edff;color:#5742e8;font-size:11px;font-weight:950;padding:5px 8px}
@media(max-width:720px){.review-due-row{grid-template-columns:1fr}.review-health strong{margin-left:0}.chev{align-self:center}}


/* =========================
   Version 14: My Dragon dashboard
   ========================= */
.clickable-card{cursor:pointer;transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease}.clickable-card:hover{transform:translateY(-5px);box-shadow:0 22px 55px rgba(62,45,178,.14);border-color:#cfc6ff}.clickable-card:focus{outline:3px solid rgba(87,66,232,.22);outline-offset:4px}
#dragonModal.wide{max-width:1500px;width:min(96vw,1500px)}
.dragon-dashboard-v14{font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#07133f;background:linear-gradient(180deg,#fbfbff,#f7f3ff);padding:20px;border-radius:28px}.dragon-topline{display:grid;grid-template-columns:1fr repeat(3,180px);gap:16px;align-items:center;margin-bottom:16px}.dragon-topline h2{margin:0;font-size:34px;letter-spacing:-.5px}.dragon-topline p{margin:4px 0 0;color:#566080;font-weight:650}.dragon-stat{height:72px;border:1px solid #e4def7;background:#fff;border-radius:20px;display:flex;align-items:center;gap:10px;padding:12px 18px;box-shadow:0 14px 30px rgba(41,35,110,.06)}.dragon-stat img{width:42px;height:42px;object-fit:contain}.dragon-stat b{font-size:25px}.dragon-stat span{display:block;font-size:12px;color:#626b91;font-weight:800}.dragon-main-grid{display:grid;grid-template-columns:300px 1fr 360px;gap:18px}.dragon-card,.dragon-hero-card{border:1px solid #ded8f4;background:rgba(255,255,255,.94);border-radius:24px;box-shadow:0 16px 38px rgba(39,32,105,.07)}.dragon-profile-card{padding:18px;text-align:center}.dragon-profile-img{width:210px;height:210px;object-fit:contain;border-radius:22px;background:linear-gradient(180deg,#fff,#f5f1ff)}.dragon-profile-card h3{font-size:27px;margin:10px 0}.egg-badge{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;border-radius:999px;background:#f1edff;color:#4c38ce;font-weight:900}.egg-badge img{width:22px;height:22px}.dragon-profile-card p{color:#3f486b}.big-progress{height:11px;background:#e9e5fb;border-radius:999px;overflow:hidden;margin:14px 0 8px}.big-progress i{display:block;height:100%;background:linear-gradient(90deg,#684df1,#b795ff);border-radius:999px}.equipped-line{margin:16px 0;padding:10px;border-radius:16px;background:#f7f4ff;font-weight:850}.equipped-line img{width:20px;vertical-align:middle}.mini-goal{margin-top:16px;border-top:1px solid #ebe6fa;padding-top:14px}.mini-goal b,.mini-goal span{display:block}.daily-check{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;margin:10px 4px 0;border-radius:10px;border:2px solid #d5d1e4;background:#fff;color:#fff;font-weight:1000}.daily-check.done{background:#56b85d;border-color:#56b85d}.dragon-mood{margin-top:12px;background:#f1edff;border-radius:15px;padding:11px;color:#5742e8}.dragon-hero-card{overflow:hidden;position:relative;min-height:520px;background:linear-gradient(180deg,#eef4ff 0%,#fff 66%)}.hero-copy{position:absolute;z-index:2;left:28px;top:22px}.hero-copy h3{font-size:30px;color:#4d35d4;margin:0 0 4px}.hero-copy b{font-size:18px}.hero-copy p{max-width:300px;line-height:1.5;color:#334064}.hero-egg-img{display:block;width:100%;height:320px;object-fit:contain;padding:24px 50px 0;background:radial-gradient(circle at 50% 48%,rgba(121,96,255,.25),rgba(255,255,255,0) 55%)}.hatch-progress-wrap{padding:16px 22px 14px;background:#fff;border-top:1px solid #eee8ff}.hatch-progress-wrap b{display:block;margin-bottom:10px}.hatch-dots{display:grid;grid-template-columns:repeat(49,1fr);gap:4px}.hatch-dot{height:18px;border-radius:999px;background:#e6e3f2;border:1px solid #d5d0eb}.hatch-dot.filled{background:linear-gradient(180deg,#9be4ff,#6b55f0)}.hatch-dot.current{outline:3px solid rgba(245,160,45,.35)}.hatch-labels{display:flex;justify-content:space-between;color:#6c7190;font-size:12px;margin-top:6px}.daily-goal-strip{margin:16px 22px 20px;padding:14px 16px;border:1px solid #e7e1f7;border-radius:18px;display:flex;align-items:center;gap:12px;background:#fff}.daily-goal-strip img{width:44px;height:44px}.daily-goal-strip span{color:#59617e}.daily-goal-strip button{margin-left:auto;border:0;border-radius:13px;background:#5b45e8;color:#fff;padding:12px 16px;font-weight:950}.nurture-card{padding:20px}.nurture-card h3{font-size:23px;margin:0 0 4px}.nurture-card>p{margin:0 0 14px;color:#5e6688}.nurture-task{width:100%;display:grid;grid-template-columns:48px 1fr auto auto;gap:12px;align-items:center;text-align:left;border:1px solid #e1dcf3;border-radius:17px;background:#fff;margin:10px 0;padding:12px;cursor:pointer}.nurture-task:hover{background:#f9f7ff;border-color:#cfc6ff}.nurture-task img{width:48px;height:48px;object-fit:contain}.nurture-task b{display:block}.nurture-task small{display:block;color:#66708f;margin-top:3px}.nurture-task em{font-style:normal;color:#128438;font-weight:1000}.nurture-task strong{color:#c27300}.bonus-banner{display:flex;align-items:center;gap:14px;margin-top:14px;border-radius:18px;background:linear-gradient(135deg,#eee7ff,#c9b4ff);padding:12px}.bonus-banner img{width:74px;height:58px;object-fit:contain}.bonus-banner b{display:block}.bonus-banner small{color:#4b5273}.dragon-bottom-grid{display:grid;grid-template-columns:300px 1fr;gap:18px;margin-top:18px}.journal-card{padding:18px}.journal-card h3,.store-wide h3{margin:0 0 5px}.journal-card p{margin:0 0 12px;color:#59617e}.journal-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.journal-row img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:16px;background:#f3f0ff;border:1px solid #e4def7}.journal-card button{width:100%;margin-top:12px;border:1px solid #d8d0f3;background:#f7f4ff;border-radius:15px;padding:12px;color:#5742e8;font-weight:950}.store-wide{padding:18px}.store-title{display:flex;justify-content:space-between;gap:14px;align-items:center}.store-title h3 img{width:30px;vertical-align:middle}.store-tabs{display:flex;gap:8px;flex-wrap:wrap}.store-tabs span{padding:8px 13px;border-radius:999px;background:#f7f4ff;color:#4b5377;font-weight:800}.store-tabs .active{background:#6650ee;color:#fff}.dragon-store-row{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:14px;margin-top:14px}.dragon-store-card{border:1px solid #ded8f4;border-radius:18px;text-align:center;padding:12px;background:#fff}.dragon-store-card img{width:96px;height:96px;object-fit:contain}.dragon-store-card b{display:block}.dragon-store-card span{display:block;color:#9a6a10;font-weight:900;margin:4px 0 10px}.dragon-store-card.owned span{color:#328348}.dragon-store-card button{border:0;border-radius:999px;background:#5a45e8;color:#fff;padding:9px 22px;font-weight:950}.dragon-store-card.owned button{background:#5bb86b}@media(max-width:1100px){.dragon-topline{grid-template-columns:1fr 1fr}.dragon-main-grid,.dragon-bottom-grid{grid-template-columns:1fr}.dragon-store-row{grid-template-columns:repeat(2,1fr)}}

/* Final homepage/Page 2 feature strip sizing */
.home-page{
  overflow-x:visible!important;
}
.home-page .premium-feature-row{
  width:min(96vw,1600px)!important;
  max-width:none!important;
  margin:48px 0 0 50%!important;
  transform:translateX(-50%)!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:stretch!important;
  gap:0!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #dedcf0!important;
  border-radius:22px!important;
  box-shadow:0 20px 50px rgba(31,24,88,.08)!important;
}
.home-page .premium-feature-row .feature-item{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:18px!important;
  min-width:0!important;
  min-height:0!important;
  padding:28px 22px!important;
  border-right:1px solid #dedcf0!important;
  border-bottom:0!important;
  background:transparent!important;
}
.home-page .premium-feature-row .feature-item:last-child{border-right:0!important}
.home-page .premium-feature-row .feature-icon-circle{
  width:86px!important;
  height:86px!important;
  min-width:86px!important;
  border-radius:50%!important;
  background:transparent!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  padding:0!important;
  box-shadow:none!important;
}
.home-page .premium-feature-row .feature-icon-circle img{
  width:92px!important;
  height:92px!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
}
.home-page .premium-feature-row .feature-text{min-width:0!important;text-align:left!important}
.home-page .premium-feature-row .feature-text h3{
  margin:0 0 10px!important;
  color:#08144f!important;
  font-size:20px!important;
  line-height:1.15!important;
  font-weight:900!important;
  letter-spacing:0!important;
}
.home-page .premium-feature-row .feature-text p{
  margin:0!important;
  color:#4c567a!important;
  font-size:15px!important;
  line-height:1.45!important;
  font-weight:500!important;
}
@media(max-width:1200px){
  .home-page .premium-feature-row{
    width:min(94vw,920px)!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .home-page .premium-feature-row .feature-item{
    border-right:0!important;
    border-bottom:1px solid #dedcf0!important;
  }
  .home-page .premium-feature-row .feature-item:nth-child(odd){border-right:1px solid #dedcf0!important}
  .home-page .premium-feature-row .feature-item:last-child{
    border-right:0!important;
    border-bottom:0!important;
  }
}
@media(max-width:640px){
  .home-page .premium-feature-row{
    width:calc(100vw - 28px)!important;
    grid-template-columns:1fr!important;
    margin-top:32px!important;
  }
  .home-page .premium-feature-row .feature-item{
    padding:22px 18px!important;
    border-right:0!important;
    border-bottom:1px solid #dedcf0!important;
  }
  .home-page .premium-feature-row .feature-item:nth-child(odd){border-right:0!important}
  .home-page .premium-feature-row .feature-item:last-child{border-bottom:0!important}
  .home-page .premium-feature-row .feature-icon-circle{
    width:72px!important;
    height:72px!important;
    min-width:72px!important;
  }
  .home-page .premium-feature-row .feature-icon-circle img{
    width:78px!important;
    height:78px!important;
  }
}

.data-debug-panel{
  position:fixed;
  right:16px;
  bottom:16px;
  z-index:90;
  width:min(420px,calc(100vw - 32px));
  max-height:58vh;
  overflow:auto;
  padding:14px;
  border:1px solid #dedcf0;
  border-radius:16px;
  background:rgba(255,255,255,.96);
  box-shadow:0 18px 45px rgba(20,24,70,.16);
  color:#07133f;
  font-size:12px;
}
.data-debug-panel b,.data-debug-panel span{display:block}
.data-debug-panel b{font-size:14px;margin-bottom:8px;color:#5742e8}
.data-debug-panel span{margin:3px 0}
.data-debug-panel pre{
  margin:10px 0 0;
  padding:10px;
  border-radius:10px;
  background:#f6f5fb;
  white-space:pre-wrap;
  font-size:11px;
  line-height:1.35;
}

.set-menu{
  display:grid;
  gap:10px;
}
.set-menu>button{
  display:inline-flex!important;
  justify-content:center!important;
  align-items:center!important;
  min-height:34px!important;
  border:1px solid #ded8ff!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#5742e8!important;
  font-size:12px!important;
  font-weight:900!important;
}
.study-range-card{
  display:grid;
  gap:12px;
  padding:12px;
  border:1px solid #e2def6;
  border-radius:16px;
  background:linear-gradient(180deg,#fff,#fbfaff);
}
.study-range-header,.study-range-main,.set-nav-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.study-range-header strong,.study-range-main b{
  color:#07133f;
}
.study-range-header span,.study-range-main small{
  color:#566080;
  font-weight:800;
}
.study-range-main{
  align-items:flex-start;
  flex-direction:column;
}
.set-progress-bar{
  height:9px;
  border-radius:999px;
  background:#ece9ff;
  overflow:hidden;
}
.set-progress-bar i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#5b45e8,#8f7cff);
}
.set-nav-row button{
  flex:1;
  min-height:34px;
  border:1px solid #d8d2ff;
  border-radius:10px;
  background:#fff;
  color:#5742e8;
  font-weight:900;
  cursor:pointer;
}
.set-nav-row button:disabled{
  opacity:.45;
  cursor:not-allowed;
}
.jump-set-label{
  display:grid;
  gap:6px;
  color:#4c567a;
  font-size:12px;
  font-weight:900;
}
.jump-set-label select{
  width:100%;
  min-height:38px;
  border:1px solid #ded8ff;
  border-radius:10px;
  background:#fff;
  color:#07133f;
  font-weight:800;
  padding:0 10px;
}
.flashcard-status{
  flex-wrap:wrap;
  gap:10px;
}
.flashcard-status>span{
  font-weight:900;
  color:#5742e8;
  background:#f1edff;
  border-radius:999px;
  padding:7px 12px;
}

.password-modal{
  width:min(460px,calc(100vw - 32px))!important;
  border-radius:22px!important;
  box-shadow:0 26px 70px rgba(24,20,78,.2)!important;
}
.password-modal h2{
  color:#08144f;
  font-size:28px;
  line-height:1.1;
  margin:0 0 8px;
}
.password-modal p{
  margin:0 0 18px;
  color:#4c567a;
  font-size:14px;
  line-height:1.45;
}
.password-form{
  display:grid;
  gap:13px;
}
.password-form label{
  display:grid;
  gap:7px;
  color:#0d1b5e;
  font-size:13px;
  font-weight:900;
}
.password-form input{
  width:100%;
  min-height:46px;
  border:1px solid #dedcf0;
  border-radius:12px;
  background:#fbfaff;
  color:#08144f;
  padding:0 14px;
  font:inherit;
  font-size:14px;
  outline:none;
  transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;
}
.password-form input:focus{
  border-color:#6a58f6;
  background:#fff;
  box-shadow:0 0 0 4px rgba(106,88,246,.12);
}
.password-message{
  min-height:20px;
  font-size:13px;
  font-weight:850;
  line-height:1.35;
}
.password-message.error{color:#d63333}
.password-message.success{color:#267a43}
.password-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:2px;
}
.password-actions button{
  min-height:46px;
  border-radius:12px;
  font-weight:950;
  cursor:pointer;
}
.password-cancel{
  border:1px solid #d8d5ee;
  background:#fff;
  color:#0d1b5e;
}
.password-submit{
  border:0;
  background:linear-gradient(180deg,#6256f6,#4f46e5);
  color:#fff;
  box-shadow:0 12px 22px rgba(79,70,229,.22);
}

/* Phase 5: analytics-style Detailed Progress Report */
#progressModal.modal.wide{
  width:min(1120px,94vw)!important;
  padding:24px!important;
  background:#f8f7fd!important;
}
#progressModal h2{
  color:#08144f;
  font-size:30px;
  line-height:1.1;
  margin:0 0 14px;
}
#parentSummary.summary-card{
  margin:0 0 14px!important;
  border:1px solid #dedcf0!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 12px 28px rgba(24,20,78,.06)!important;
  color:#33405f!important;
  font-size:15px!important;
  line-height:1.45!important;
}
.analytics-report{
  display:grid;
  gap:14px;
}
.analytics-metrics{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:10px;
}
.analytics-metric-card{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:10px;
  align-items:center;
  min-height:86px;
  padding:12px;
  border:1px solid #dedcf0;
  border-radius:16px;
  background:#fff;
  box-shadow:0 12px 28px rgba(24,20,78,.06);
}
.analytics-metric-card img{
  width:42px;
  height:42px;
  object-fit:contain;
}
.analytics-metric-card span,
.analytics-metric-card small{
  display:block;
  color:#4c567a;
  font-size:11px;
  line-height:1.25;
  font-weight:800;
}
.analytics-metric-card b{
  display:block;
  color:#08144f;
  font-size:25px;
  line-height:1;
  margin:4px 0;
}
.analytics-chart-row{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.analytics-card{
  border:1px solid #dedcf0;
  border-radius:18px;
  background:#fff;
  box-shadow:0 14px 32px rgba(24,20,78,.07);
  padding:16px;
}
.analytics-card h3{
  margin:0 0 13px;
  color:#08144f;
  font-size:18px;
  line-height:1.15;
  font-weight:950;
}
.chart-card{
  text-align:center;
  min-height:248px;
}
.chart-card p{
  margin:12px 0 0;
  color:#4c567a;
  font-size:13px;
  line-height:1.4;
}
.analytics-donut{
  position:relative;
  width:150px;
  height:150px;
  margin:4px auto 8px;
}
.analytics-donut svg{
  width:150px;
  height:150px;
  transform:rotate(-90deg);
}
.analytics-donut circle{
  fill:none;
  stroke-width:13;
}
.analytics-donut .track{stroke:#ece9ff}
.analytics-donut .value{
  stroke:#6654f1;
  stroke-linecap:round;
}
.analytics-donut.risk .value{stroke:#f2b84b}
.analytics-donut b{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#08144f;
  font-size:30px;
  line-height:1;
}
.completion-chart{
  height:24px;
  border-radius:999px;
  overflow:hidden;
  background:#ece9ff;
  margin:58px 10px 16px;
}
.completion-chart i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#5b45e8,#8f7cff);
}
.completion-number{
  display:block;
  color:#08144f;
  font-size:34px;
  line-height:1;
}
.review-health-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  margin:6px 0 10px;
}
.review-health-grid span{
  border:1px solid #eceafd;
  border-radius:12px;
  padding:10px;
  color:#4c567a;
  font-size:12px;
  font-weight:850;
}
.review-health-grid b{
  display:block;
  color:#08144f;
  font-size:22px;
}
.analytics-grid-2{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:14px;
}
.analytics-grid-2.lower{
  grid-template-columns:1fr 1fr;
}
.analytics-card-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}
.analytics-link-btn{
  border:0;
  background:#f1edff;
  color:#5742e8;
  border-radius:999px;
  min-height:30px;
  padding:0 12px;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}
.analytics-set-list{
  display:grid;
  gap:9px;
}
.analytics-set-row{
  display:grid;
  grid-template-columns:72px 54px 1fr;
  align-items:center;
  gap:10px;
  color:#08144f;
  font-size:13px;
  font-weight:850;
}
.analytics-set-row div{
  height:10px;
  overflow:hidden;
  border-radius:999px;
  background:#ece9ff;
}
.analytics-set-row i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#45d3b1,#6a58f6);
}
.weekly-chart{
  height:190px;
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:9px;
  align-items:end;
}
.weekly-bar{
  display:grid;
  grid-template-rows:1fr auto auto;
  gap:5px;
  text-align:center;
  color:#4c567a;
  font-size:11px;
  font-weight:850;
}
.weekly-bar div{
  height:140px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  border-radius:12px;
  background:#f4f2ff;
  overflow:hidden;
}
.weekly-bar i{
  display:block;
  width:100%;
  min-height:4px;
  border-radius:12px 12px 0 0;
  background:linear-gradient(180deg,#8f7cff,#5b45e8);
}
.analytics-game-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px;
}
.analytics-game-card{
  min-height:94px;
  border:1px solid #eceafd;
  border-radius:14px;
  background:#fbfaff;
  display:grid;
  place-items:center;
  text-align:center;
  padding:10px 8px;
}
.analytics-game-card i{
  font-style:normal;
  font-size:25px;
}
.analytics-game-card span{
  color:#4c567a;
  font-size:11px;
  font-weight:850;
}
.analytics-game-card b{
  color:#5742e8;
  font-size:24px;
  line-height:1;
}
.recommendation-card{
  background:linear-gradient(135deg,#fff,#f4f1ff);
}
.recommendation-card p{
  margin:8px 0;
  color:#33405f;
  font-size:14px;
  line-height:1.45;
}
.recommendation-card small{
  display:block;
  margin-top:10px;
  color:#6a728f;
  font-weight:800;
}
.analytics-chip-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.analytics-chip-list span{
  border:1px solid #dedcf0;
  border-radius:999px;
  background:#f5f3ff;
  color:#5742e8;
  padding:8px 11px;
  font-size:12px;
  font-weight:900;
}
.analytics-chip-list span b,
.analytics-chip-list span small{
  display:block;
}
.analytics-chip-list span small{
  color:#6a728f;
  font-size:10px;
  margin-top:2px;
}
.analytics-empty{
  margin:8px 0 0;
  color:#6a728f;
  font-size:13px;
  line-height:1.4;
  font-weight:750;
}
@media(max-width:1040px){
  .analytics-metrics{grid-template-columns:repeat(3,1fr)}
  .analytics-chart-row,.analytics-grid-2,.analytics-grid-2.lower{grid-template-columns:1fr}
  .analytics-game-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:620px){
  #progressModal.modal.wide{padding:18px!important}
  .analytics-metrics,.analytics-game-grid{grid-template-columns:1fr}
  .analytics-set-row{grid-template-columns:1fr}
  .weekly-chart{gap:5px}
  .review-health-grid{grid-template-columns:1fr}
}

/* Phase 6: practice page compact polish */
.app-shell,
.home-page{
  overflow-x:hidden!important;
}
.study-page{
  max-width:1480px!important;
  padding:14px 22px 28px!important;
}
.study-page .free-banner{
  width:max-content!important;
  max-width:calc(100vw - 36px)!important;
  margin:0 auto 14px!important;
  padding:8px 14px!important;
  border-radius:999px!important;
  gap:12px!important;
  font-size:13px!important;
  line-height:1.25!important;
}
.study-page .free-banner button{
  min-height:30px!important;
  padding:6px 16px!important;
  border-radius:999px!important;
}
.study-page .study-layout{
  grid-template-columns:250px minmax(0,1fr) 285px!important;
  gap:16px!important;
  align-items:start!important;
}
.study-page .panel{
  border-color:#dedcf0!important;
  box-shadow:0 14px 32px rgba(24,20,78,.07)!important;
}
.study-page .progress-panel,
.study-page .quick-panel,
.study-page .review-panel,
.study-page .badge-mini,
.study-page .mini-test{
  padding:14px!important;
  border-radius:16px!important;
}
.study-page .panel h3{
  margin-bottom:11px!important;
  font-size:16px!important;
  line-height:1.2!important;
}
.study-page .progress-item{
  display:flex!important;
  grid-template-columns:none!important;
  gap:10px!important;
  padding:10px 0!important;
  align-items:center!important;
}
.study-page .progress-item i{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  flex:0 0 44px!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,#fbfaff 0%,#f0edff 100%)!important;
  font-size:26px!important;
  box-shadow:inset 0 0 0 1px rgba(124,92,255,.1)!important;
}
.study-page .progress-item i img{
  width:26px!important;
  height:26px!important;
  object-fit:contain!important;
  display:block!important;
}
.study-page .progress-item span,
.study-page .progress-item small{
  font-size:11px!important;
  line-height:1.3!important;
}
.study-page .progress-item b,
.study-page .progress-item #levelTextSmall{
  font-size:18px!important;
  line-height:1.12!important;
  max-width:160px!important;
}
.study-page .quick-panel button{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:9px 2px!important;
  font-size:13px!important;
}
.study-page .panel-title-icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:22px!important;
  height:22px!important;
  margin-right:6px!important;
  border-radius:8px!important;
  background:#f0edff!important;
  color:var(--purple)!important;
  font-size:14px!important;
  line-height:1!important;
  vertical-align:-2px!important;
}
.study-page .quick-action-icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:42px!important;
  height:42px!important;
  flex:0 0 42px!important;
  border-radius:15px!important;
  background:linear-gradient(180deg,#fbfaff 0%,#f0edff 100%)!important;
  color:var(--purple)!important;
  font-size:26px!important;
  line-height:1!important;
  box-shadow:inset 0 0 0 1px rgba(124,92,255,.1)!important;
}
.study-page .quick-action-icon img{
  width:25px!important;
  height:25px!important;
  object-fit:contain!important;
  display:block!important;
}
.study-page .set-list{
  max-height:none!important;
  overflow:visible!important;
}
.study-range-card,
.study-range-card *{
  font-size:12px!important;
  line-height:1.3!important;
}
.study-range-card{
  gap:8px!important;
  padding:10px 12px!important;
  overflow:hidden!important;
}
.study-range-title{
  font-size:12px!important;
  font-weight:700!important;
}
.study-range-meta,
.study-range-meta *{
  font-size:11px!important;
  line-height:1.35!important;
}
.study-page .set-nav-row button{
  min-height:30px!important;
  padding:5px 8px!important;
  font-size:11px!important;
}
.study-page .jump-set-label,
.study-page .jump-set-label select{
  font-size:11px!important;
}
.study-page .main-study-card{
  min-height:500px!important;
  padding:22px!important;
  border-radius:20px!important;
}
.study-page .word-display{
  padding:26px 0 12px!important;
}
.study-page .word-display h2{
  font-size:52px!important;
  line-height:1.05!important;
  letter-spacing:0!important;
}
.study-page .reveal-box{
  margin:18px auto!important;
  padding:18px!important;
}
.study-page .answer-panel{
  margin:16px auto!important;
  padding:16px!important;
}
.study-page .action-row{
  gap:12px!important;
  margin-top:18px!important;
}
.study-page .action-row button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:46px!important;
  border-radius:14px!important;
  font-size:15px!important;
  line-height:1!important;
  font-family:inherit!important;
  text-align:center!important;
}
.study-page .action-row .next,
.study-page .action-row button:last-child{
  background:linear-gradient(180deg,#6256f6,#4f46e5)!important;
  color:#fff!important;
  border:0!important;
}
.study-page .review-panel p,
.study-page .mini-test p{
  font-size:11px!important;
  line-height:1.35!important;
  margin-bottom:10px!important;
}
.study-page .weak-row{
  padding:7px 0!important;
  font-size:12px!important;
}
.study-page .mini-badges{
  gap:6px!important;
}
.study-page .mini-badge img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
.study-page .mini-badge small{
  font-size:9px!important;
  line-height:1.15!important;
}
.study-page .mini-test.locked-panel:after{
  display:none!important;
  content:none!important;
}
.study-page .select-row{
  gap:8px!important;
  margin:12px 0!important;
}
.study-page .select-row select{
  height:36px!important;
  font-size:12px!important;
}
.study-page .mode-tabs{
  margin-bottom:12px!important;
  gap:8px!important;
}
.study-page .mode-tabs button{
  min-height:38px!important;
  padding:8px 16px!important;
  border-radius:999px!important;
  font-size:13px!important;
}
@media(max-width:1180px){
  .study-page .study-layout{grid-template-columns:1fr!important}
}
@media(max-width:680px){
  .study-page{padding:12px!important}
  .study-page .word-display h2{font-size:40px!important}
  .study-page .action-row{grid-template-columns:1fr!important}
}

/* v14.18 profile dashboard and compact practice polish */
.chev,.avatar-menu{display:none!important}
.avatar-image-btn{
  cursor:pointer!important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
}
.avatar-image-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(87,66,232,.18);
  border-color:#cfc8ff!important;
}
.free-banner{
  width:max-content;
  max-width:calc(100vw - 36px);
  margin:0 auto 14px!important;
  padding:8px 14px!important;
  border-radius:999px!important;
  font-size:13px!important;
  line-height:1.25!important;
}
.free-banner button{
  min-height:30px!important;
  padding:6px 14px!important;
  border-radius:999px!important;
}
.study-page{
  max-width:1540px!important;
  padding:14px 22px 28px!important;
}
.mode-tabs{
  margin-bottom:12px!important;
  gap:8px!important;
}
.mode-tabs button{
  min-height:38px!important;
  padding:8px 16px!important;
  border-radius:999px!important;
  font-size:13px!important;
}
.study-layout{
  grid-template-columns:250px minmax(0,1fr) 285px!important;
  gap:16px!important;
  align-items:start!important;
}
.panel{
  border-color:#dedcf0!important;
  box-shadow:0 14px 32px rgba(24,20,78,.07)!important;
}
.progress-panel,.quick-panel,.review-panel,.badge-mini,.mini-test{
  padding:14px!important;
  border-radius:16px!important;
}
.panel h3{
  margin-bottom:11px!important;
  font-size:16px!important;
  line-height:1.2!important;
}
.progress-item{
  gap:10px!important;
  padding:10px 0!important;
}
.progress-item i{
  width:38px!important;
  height:38px!important;
  min-width:38px!important;
  font-size:18px!important;
  background:#f0edff!important;
}
.progress-item i img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
.progress-item b{font-size:18px!important}
.progress-item span,.progress-item small{font-size:11px!important;line-height:1.3!important}
.quick-panel button{
  padding:9px 2px!important;
  font-size:13px!important;
}
.set-list{
  max-height:none!important;
  overflow:visible!important;
}
.study-range-card,
.study-range-card *{
  font-size:12px!important;
  line-height:1.3!important;
}
.study-range-card{
  gap:8px!important;
  padding:10px 12px!important;
  overflow:hidden!important;
}
.study-range-header strong,.study-range-main b{
  font-size:12px!important;
  line-height:1.25!important;
}
.study-range-header span,.study-range-main small,.jump-set-label{
  font-size:11px!important;
  line-height:1.35!important;
}
.set-nav-row button{
  min-height:30px!important;
  padding:5px 8px!important;
  font-size:11px!important;
}
.jump-set-label select{
  min-height:32px!important;
  font-size:11px!important;
}
.main-study-card{
  min-height:520px!important;
  padding:22px!important;
  border-radius:20px!important;
}
.word-display{
  padding:28px 0 12px!important;
}
.word-display h2{
  font-size:54px!important;
  line-height:1.05!important;
}
.flashcard-tools,.flashcard-status{
  gap:9px!important;
}
.action-row{
  gap:12px!important;
}
.action-row button{
  min-height:46px!important;
  border-radius:14px!important;
}
.action-row .next,.action-row button:last-child{
  background:linear-gradient(180deg,#6256f6,#4f46e5)!important;
  color:#fff!important;
}
.review-panel p,.mini-test p{
  font-size:11px!important;
  line-height:1.35!important;
  margin-bottom:10px!important;
}
.weak-row{
  padding:7px 0!important;
  font-size:12px!important;
}
.mini-badges{
  gap:6px!important;
}
.mini-badge img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
.mini-badge small{
  font-size:9px!important;
  line-height:1.15!important;
}
.mini-test.locked-panel:after{display:none!important}
.select-row select{
  height:36px!important;
  font-size:12px!important;
}

.profile-page{
  max-width:1500px!important;
  padding:16px 28px 24px!important;
  margin:0 auto!important;
}
.profile-dashboard{
  display:grid;
  gap:12px;
  width:100%;
  max-width:1420px;
  margin:0 auto;
}
.profile-dash-hero{
  display:grid;
  grid-template-columns:132px minmax(0,1fr) auto;
  gap:22px;
  align-items:center;
  padding:20px 28px!important;
  border-radius:20px!important;
}
.profile-avatar-button{
  border:0;
  background:transparent;
  padding:0;
  cursor:pointer;
}
.profile-dash-avatar{
  width:126px;
  height:126px;
  border-radius:50%;
  object-fit:cover;
  background:#f0edff;
  box-shadow:0 14px 35px rgba(41,31,112,.14);
}
.profile-dash-main h1{
  margin:0 0 12px;
  color:#08144f;
  font-size:32px;
  line-height:1;
  font-weight:950;
  letter-spacing:0;
}
.profile-meta-row,.profile-quick-stats{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 18px;
  color:#0d1b5e;
  font-size:14px;
  font-weight:750;
}
.profile-meta-row strong{
  color:#5742e8;
  margin-left:4px;
}
.profile-quick-stats{
  margin-top:15px;
  gap:12px 24px;
}
.dash-icon{
  width:22px;
  height:22px;
  object-fit:contain;
  vertical-align:middle;
}
.profile-dash-actions{
  display:flex;
  justify-content:flex-end;
  gap:12px;
  flex-wrap:wrap;
}
.dash-soft-btn,.dash-primary-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:52px;
  padding:0 22px;
  border-radius:13px;
  font-weight:900;
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;
}
.dash-soft-btn:hover{
  transform:translateY(-1px);
  border-color:#bfb7ff;
  background:#faf9ff;
  box-shadow:0 10px 18px rgba(31,24,88,.08);
}
.dash-primary-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 18px 34px rgba(79,70,229,.28);
}
.dash-soft-btn{
  color:#0d1b5e;
  background:#fff;
  border:1px solid #d8d5ee;
}
.dash-primary-btn{
  color:#fff;
  background:linear-gradient(180deg,#6256f6,#4f46e5);
  border:0;
  box-shadow:0 14px 26px rgba(79,70,229,.24);
}
.dash-primary-btn .dash-icon{filter:brightness(0) invert(1)}
.profile-row{
  display:grid;
  gap:12px;
}
.profile-row-2{grid-template-columns:1fr 1fr}
.profile-row-3{grid-template-columns:1.1fr 1fr 1.15fr}
.profile-dash-card{
  padding:15px!important;
  border-radius:18px!important;
}
.profile-dash-card h3{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0 0 14px!important;
  color:#08144f;
  font-size:18px!important;
  line-height:1.15!important;
  font-weight:950!important;
}
.profile-dash-card h3 button{
  margin-left:auto;
  border:0;
  background:transparent;
  color:#5742e8;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}
.profile-dash-card h3 small{
  margin-left:auto;
  color:#6f6a86;
  font-size:12px;
  font-weight:850;
  white-space:nowrap;
}
.dash-stat-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.dash-stat-tile{
  min-height:86px;
  padding:11px 12px;
  border:1px solid #dedcf0;
  border-radius:13px;
  display:grid;
  grid-template-columns:46px 1fr;
  grid-template-rows:auto auto;
  align-items:center;
  column-gap:10px;
}
.dash-stat-tile img{
  grid-row:1/3;
  width:48px;
  height:48px;
  object-fit:contain;
}
.dash-stat-tile span{
  color:#34405f;
  font-size:11px;
  font-weight:850;
}
.dash-stat-tile b{
  color:#08144f;
  font-size:26px;
  line-height:1;
}
.dash-stat-tile.streak b{color:#ff5b1a}
.plan-action-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border-bottom:1px solid #eceafd;
  padding-bottom:13px;
}
.plan-action-grid button{
  min-height:58px;
  border:0;
  border-right:1px solid #e3e0f2;
  background:transparent;
  color:#08144f;
  font-weight:850;
  cursor:pointer;
  display:grid;
  place-items:center;
  gap:4px;
  transition:background .18s ease,box-shadow .18s ease;
}
.plan-action-grid button:hover{
  background:#faf9ff;
  box-shadow:inset 0 0 0 1px rgba(91,77,246,.12);
}
.plan-action-grid .dash-icon{
  width:24px;
  height:24px;
}
.plan-action-grid button:last-child{border-right:0}
.plan-action-grid small{
  color:#4c567a;
  font-size:11px;
  font-weight:850;
}
.upgrade-callout{
  margin-top:12px;
  min-height:46px;
  border-radius:12px;
  background:#f2efff;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 14px;
  color:#283353;
  font-size:13px;
  font-weight:750;
}
.upgrade-callout button{
  margin-left:auto;
  border:0;
  background:transparent;
  color:#5742e8;
  font-weight:950;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:3px;
}
.dash-progress-row{
  display:grid;
  grid-template-columns:150px 1fr 42px;
  align-items:center;
  gap:10px;
  margin:12px 0;
  color:#0d1b5e;
  font-size:13px;
  font-weight:850;
}
.dash-progress-row div,.mini-progress{
  height:8px;
  border-radius:999px;
  background:#e7e5ef;
  overflow:hidden;
}
.dash-progress-row i,.mini-progress i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:#6a58f6;
}
.overall-accuracy{
  margin-top:22px;
  min-height:54px;
  border:1px solid #dedcf0;
  border-radius:12px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 14px;
  color:#0d1b5e;
  font-weight:900;
}
.overall-accuracy b{
  margin-left:auto;
  font-size:28px;
}
.profile-badge-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}
.profile-badge-grid button{
  border:0;
  background:transparent;
  color:#5742e8;
  font-size:12px;
  font-weight:850;
  cursor:pointer;
}
.profile-badge-grid img{
  display:block;
  width:64px;
  height:64px;
  object-fit:contain;
  margin:0 auto 6px;
}
.ui-inline-icon{
  width:18px;
  height:18px;
  object-fit:contain;
  vertical-align:-4px;
  margin-right:6px;
  background:transparent;
  flex:0 0 auto;
}
.control-label-row{
  display:flex;
  align-items:center;
  gap:6px;
}
.control-label-row .ui-inline-icon,
button .ui-inline-icon,
.buy-egg-meta .ui-inline-icon,
.buy-egg-status .ui-inline-icon,
.starter-badge-row .ui-inline-icon{
  margin-right:0;
}
button .ui-inline-icon{
  width:17px;
  height:17px;
  vertical-align:-3px;
}
.profile-meta-row .ui-inline-icon,
.profile-quick-stats .ui-inline-icon,
.profile-dash-card h3 .ui-inline-icon,
.overall-accuracy .ui-inline-icon{
  width:24px;
  height:24px;
}
.studio-badge-preview-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.studio-badge-preview-grid button{
  position:relative;
  min-height:116px;
  border:1px solid #eeeafc;
  border-radius:16px;
  background:#fff;
  padding:10px 8px;
}
.studio-badge-preview-grid button.locked img{
  filter:grayscale(1) contrast(.82) brightness(1.08);
  opacity:.48;
}
.badge-preview-image-wrap{
  position:relative;
  display:block;
  width:58px;
  height:58px;
  margin:0 auto 6px;
}
.badge-preview-image-wrap img{
  width:58px;
  height:58px;
  margin:0;
}
.studio-badge-preview-grid em,
.badge-progress{
  display:block;
  height:7px;
  border-radius:999px;
  overflow:hidden;
  background:#e7e0ff;
  margin-top:7px;
}
.studio-badge-preview-grid em b,
.badge-progress i{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#6b4df5,#9b7cff);
}
.invite-mini-card,.leader-mini-card{
  border:1px solid #dedcf0;
  border-radius:13px;
  padding:12px;
}
.invite-mini-card{
  display:grid;
  grid-template-columns:38px 1fr auto;
  gap:12px;
  align-items:center;
}
.invite-mini-card b,.leader-mini-card h4{
  color:#08144f;
  font-size:15px;
  margin:0;
}
.invite-mini-card span{
  display:block;
  color:#4c567a;
  font-size:12px;
  line-height:1.35;
}
.invite-mini-card button{
  min-width:86px;
  min-height:34px;
  border:1px solid #6a58f6;
  border-radius:9px;
  background:#fff;
  color:#5742e8;
  font-weight:900;
  cursor:pointer;
}
.leader-mini-card{
  margin-top:10px;
}
.leader-mini-card h4{
  display:flex;
  align-items:center;
}
.leader-mini-card h4 span{
  font-weight:700;
  margin-left:4px;
}
.leader-mini-card h4 button{
  margin-left:auto;
  border:0;
  background:transparent;
  color:#5742e8;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}
.leader-mini-card ol{
  margin:10px 0 0;
  padding-left:18px;
  display:grid;
  gap:8px;
}
.leader-mini-card li{
  color:#08144f;
  font-size:13px;
  font-weight:850;
}
.leader-mini-card li span{
  float:right;
  color:#4c567a;
  font-size:12px;
  font-weight:700;
}
.bottom-row{grid-template-columns:1fr 1fr 1.15fr}
.hatch-card h3 img{
  width:22px;
  height:22px;
  object-fit:contain;
}
.hatch-body{
  display:grid;
  grid-template-columns:82px 1fr auto;
  align-items:center;
  gap:14px;
}
.hatch-body>img{
  width:78px;
  height:78px;
  object-fit:contain;
}
.hatch-body b,.study-points-card b{
  display:block;
  color:#08144f;
  font-size:16px;
}
.hatch-body span,.study-points-card p,.study-points-card span{
  color:#4c567a;
  font-size:12px;
  line-height:1.4;
}
.hatch-body button{
  min-width:116px;
  min-height:44px;
  border:1px solid #6a58f6;
  border-radius:10px;
  background:#fff;
  color:#5742e8;
  font-weight:950;
  cursor:pointer;
}
.study-points-card{
  position:relative;
  overflow:hidden;
}
.study-points-card>div b{
  color:#5742e8;
  font-size:36px;
  line-height:1;
}
.study-points-card>img{
  position:absolute;
  right:18px;
  bottom:12px;
  width:102px;
  opacity:.9;
}
.quick-link-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
}
.quick-link-row button{
  min-height:54px;
  border:0;
  border-right:1px solid #e3e0f2;
  background:transparent;
  color:#08144f;
  font-weight:900;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font-size:12px;
}
.quick-link-row button .dash-icon{
  width:22px;
  height:22px;
}
.quick-link-row button .dash-icon:last-child{
  width:15px;
  height:15px;
}
.quick-link-row button:last-child{border-right:0}

/* Uploaded asset display: keep eggs, dragons, and badges on clean white stages. */
.image-stage,
.egg-thumbnail,
.dragon-thumbnail,
.badge-thumbnail{
  background:#ffffff!important;
  border:1px solid #eeeafc!important;
  border-radius:16px!important;
  overflow:hidden!important;
}
img.image-stage,
img.egg-thumbnail,
img.dragon-thumbnail,
img.badge-thumbnail,
.image-stage img,
.egg-thumbnail img,
.dragon-thumbnail img,
.badge-thumbnail img{
  background:#ffffff!important;
  object-fit:contain!important;
}

/* My Studio combined profile + dragon dashboard */
.my-studio-dashboard{
  gap:14px;
}
.my-studio-hero{
  grid-template-columns:132px minmax(0,1fr) minmax(260px,auto);
}
.my-studio-subtitle{
  margin:0 0 12px;
  color:#4c567a;
  font-size:15px;
  line-height:1.35;
  font-weight:700;
}
.my-studio-row-1{
  grid-template-columns:1fr 1.2fr 1fr;
}
.my-studio-row-2{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.my-studio-row-3,
.my-studio-bottom-row{
  grid-template-columns:1fr 1fr;
}
.quick-links-card{
  grid-column:1/-1;
}
.studio-current-card h3 img{
  width:24px;
  height:24px;
  object-fit:contain;
}
.studio-creature-preview{
  display:grid;
  grid-template-columns:150px 1fr;
  gap:16px;
  align-items:center;
}
.studio-creature-preview>img{
  width:150px;
  height:150px;
  object-fit:contain;
  border-radius:22px;
  background:#fff;
  border:1px solid #e5e0f7;
  box-shadow:0 14px 30px rgba(58,45,132,.08);
}
.studio-creature-preview b,
.studio-hatch-stage b{
  display:block;
  color:#08144f;
  font-size:22px;
  line-height:1.08;
}
.studio-current-copy{
  min-width:0;
}
.studio-current-kicker{
  display:block;
  margin:0 0 5px!important;
  color:#5f4ae8!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:950!important;
}
.studio-creature-preview span,
.studio-creature-preview small,
.studio-hatch-stage span,
.studio-hatch-stage p{
  display:block;
  color:#4c567a;
  font-size:13px;
  line-height:1.35;
  margin-top:5px;
}
.studio-current-copy em{
  display:block;
  margin-top:7px;
  color:#16245c;
  font-size:13px;
  font-style:normal;
  font-weight:900;
}
.starter-badge-row{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  margin-top:10px;
}
.starter-badge-row i{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:0 10px;
  border-radius:999px;
  background:#f4f1ff;
  border:1px solid #d8d0ff;
  color:#5b45e8;
  font-size:11px;
  font-style:normal;
  font-weight:950;
}
.studio-current-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
}
.studio-current-actions button{
  min-height:34px;
  border-radius:999px;
  padding:0 13px;
  border:1px solid #cfc8ff;
  background:#fff;
  color:#5742e8;
  font-size:12px;
  font-weight:950;
  cursor:pointer;
}
.studio-current-actions button:first-child{
  background:linear-gradient(180deg,#6657f4,#5140dc);
  color:#fff;
  border-color:transparent;
}
.studio-hatch-stage{
  display:grid;
  grid-template-columns:130px 1fr;
  gap:16px;
  align-items:center;
}
.studio-hatch-stage>img{
  width:130px;
  height:130px;
  object-fit:contain;
  border-radius:20px;
  background:#fff;
  border:1px solid #e5e0f7;
}
.studio-hatch-stage>img.hatching-chamber-main-img{
  width:168px;
  height:168px;
}
.hatch-flow-steps{
  display:grid;
  grid-template-columns:auto 1fr auto 1fr auto;
  align-items:center;
  gap:8px;
  margin-top:14px;
}
.hatch-flow-steps span{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:34px;
  padding:0 10px;
  border-radius:999px;
  background:#fff;
  border:1px solid #e6e0fb;
  color:#5d6685;
  font-size:12px;
  font-weight:900;
  text-align:center;
}
.hatch-flow-steps span.active{
  color:#5742e8;
  background:#f4f1ff;
  border-color:#cfc6ff;
}
.hatch-flow-steps i{
  display:block;
  height:2px;
  border-radius:999px;
  background:#dcd6f6;
}
.claim-dragon-btn{
  width:100%;
  min-height:42px;
  margin-top:14px;
  border:0;
  border-radius:14px;
  background:linear-gradient(180deg,#6657f4,#5140dc);
  color:#fff;
  font-size:15px;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 12px 24px rgba(81,64,220,.2);
}
.hatch-progress-wrap.compact{
  margin-top:14px;
  padding:0;
  border:0;
  background:transparent;
}
.studio-task{
  width:100%;
  display:grid;
  grid-template-columns:42px 1fr auto;
  gap:12px;
  align-items:center;
  text-align:left;
  border:1px solid #dedcf0;
  border-radius:14px;
  background:#fff;
  padding:10px 12px;
  margin-bottom:10px;
  cursor:pointer;
}
.studio-task:hover{
  border-color:#c8bfff;
  background:#fbfaff;
}
.studio-task:disabled{
  cursor:default;
  opacity:.86;
}
.studio-task.done{
  background:#f3fff6;
  border-color:#bdebc7;
}
.studio-task img{
  width:42px;
  height:42px;
  object-fit:contain;
}
.studio-task b,
.studio-task small{
  display:block;
}
.studio-task b{
  color:#08144f;
  font-size:14px;
}
.studio-task small{
  color:#4c567a;
  font-size:12px;
  margin-top:2px;
}
.studio-task strong{
  color:#b77800;
  font-size:14px;
}
.studio-task.done strong{
  color:#23864d;
}
.studio-task-note{
  margin:0 0 10px;
  color:#4c567a;
  font-size:12px;
  line-height:1.35;
  font-weight:700;
}
.studio-bonus-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-top:10px;
  padding:10px 12px;
  border-radius:14px;
  background:#fff8e8;
  border:1px solid #f3dfaf;
}
.studio-bonus-row.ready{
  background:#f3fff6;
  border-color:#bdebc7;
}
.studio-bonus-row b,
.studio-bonus-row small{
  display:block;
}
.studio-bonus-row b{
  color:#08144f;
  font-size:13px;
}
.studio-bonus-row small{
  color:#8a6813;
  font-size:12px;
  margin-top:2px;
  font-weight:800;
}
.studio-bonus-row em{
  color:#5742e8;
  font-style:normal;
  font-size:13px;
  font-weight:950;
}
.studio-nurture-rule{
  margin-top:10px;
  color:#4c567a;
  font-size:12px;
  line-height:1.35;
  font-weight:750;
}
.studio-mini-goal{
  margin-top:8px;
  padding-top:10px;
}
.studio-achievements-card .profile-badge-grid{
  margin-bottom:12px;
}
.studio-quick-links{
  border-top:1px solid #eceafd;
  padding-top:8px;
}
.studio-store-grid,
.studio-collection-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.studio-store-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:-4px 0 12px;
}
.studio-store-tabs button{
  min-height:30px;
  border:1px solid #d9d3ff;
  border-radius:999px;
  background:#fff;
  color:#5742e8;
  padding:0 11px;
  font-size:11px;
  font-weight:950;
  cursor:pointer;
}
.studio-store-tabs button.active{
  background:#5a45e8;
  border-color:#5a45e8;
  color:#fff;
}
.studio-store-tile,
.studio-collection-tile{
  border:1px solid #dedcf0;
  border-radius:16px;
  background:#fff;
  text-align:center;
  padding:12px 10px;
}
.studio-store-tile img,
.studio-collection-tile img{
  width:86px;
  height:86px;
  object-fit:contain;
  border-radius:14px;
  background:#fff;
}
.studio-store-tile b,
.studio-store-tile span,
.studio-collection-tile b,
.studio-collection-tile span{
  display:block;
}
.studio-store-tile b,
.studio-collection-tile b{
  color:#08144f;
  font-size:13px;
  margin-top:6px;
}
.studio-store-tile span,
.studio-collection-tile span{
  color:#4c567a;
  font-size:11px;
  font-weight:800;
  margin:3px 0 2px;
}
.studio-store-tile em{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  color:#9a6a10;
  font-size:11px;
  font-style:normal;
  font-weight:950;
  margin-bottom:8px;
}
.studio-store-tile.owned span,
.studio-collection-tile.unlocked span{
  color:#328348;
}
.studio-collection-tile.locked{
  opacity:.62;
}
.studio-collection-image-wrap{
  position:relative;
  width:86px;
  height:86px;
  margin:0 auto;
}
.studio-collection-image-wrap img{
  width:86px;
  height:86px;
}
.studio-collection-tile.locked img{
  filter:grayscale(1) contrast(.82) brightness(1.08);
  opacity:.58;
}
.dragon-lock-icon{
  position:absolute;
  right:6px;
  bottom:6px;
  width:26px;
  height:26px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#fff;
  color:#5a45e8;
  border:1px solid #dcd5ff;
  font-size:13px;
  box-shadow:0 8px 16px rgba(82,64,160,.12);
}
.dragon-lock-icon img{
  width:16px!important;
  height:16px!important;
  padding:0!important;
  margin:0!important;
  object-fit:contain;
  filter:none!important;
  opacity:1!important;
  background:transparent!important;
}
.studio-store-tile button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:32px;
  width:100%;
  border:0;
  border-radius:12px;
  padding:0 8px;
  background:#5a45e8;
  color:#fff;
  font-size:11px;
  font-weight:900;
  cursor:pointer;
}
.studio-store-tile.owned button{
  background:#5bb86b;
}
.studio-store-tile button:disabled{
  cursor:default;
  opacity:.9;
}
.studio-store-tile:not(.owned) button:disabled{
  background:#f4f1ff;
  color:#5742e8;
}
.collection-progress-line{
  display:grid;
  grid-template-columns:auto 1fr 44px;
  gap:10px;
  align-items:center;
  margin-bottom:12px;
  color:#4c567a;
  font-size:13px;
  font-weight:850;
}
.buy-egg-page{
  min-height:calc(100vh - 78px);
  background:
    radial-gradient(circle at 12% 12%, rgba(124,92,255,.08), transparent 30%),
    radial-gradient(circle at 86% 8%, rgba(255,211,105,.12), transparent 24%),
    linear-gradient(180deg,#fff 0%,#faf8ff 48%,#f5f2ff 100%);
  padding:26px 28px 44px;
}
.buy-egg-shell{
  max-width:1460px;
  margin:0 auto;
  display:grid;
  gap:18px;
}
.buy-egg-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:24px 26px;
}
.buy-egg-header h1{
  margin:10px 0 6px;
  color:#07113f;
  font-size:42px;
  line-height:1.04;
  font-weight:950;
  letter-spacing:0;
}
.buy-egg-header p{
  margin:0;
  max-width:760px;
  color:#4d587a;
  font-size:15px;
  line-height:1.45;
  font-weight:650;
}
.buy-egg-wallet{
  min-width:150px;
  height:58px;
  border:1px solid #efe2bd;
  border-radius:999px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:#fff8e8;
  color:#08144f;
  box-shadow:0 12px 24px rgba(145,104,18,.08);
}
.buy-egg-wallet img{
  width:28px;
  height:28px;
  object-fit:contain;
}
.buy-egg-wallet b{
  font-size:18px;
  font-weight:950;
}
.buy-egg-wallet span{
  color:#6f5c2c;
  font-size:13px;
  font-weight:850;
}
.buy-egg-controls{
  display:grid;
  grid-template-columns:minmax(280px,1fr) 210px 230px;
  gap:14px;
  align-items:end;
  padding:18px;
}
.buy-egg-controls label{
  display:grid;
  gap:7px;
  color:#1a2458;
  font-size:13px;
  font-weight:900;
}
.buy-egg-controls input,
.buy-egg-controls select{
  height:46px;
  border:1.5px solid #dcd5ff;
  border-radius:14px;
  background:#fff;
  color:#111a4d;
  padding:0 14px;
  font:inherit;
  font-weight:800;
  outline:none;
}
.buy-egg-controls input:focus,
.buy-egg-controls select:focus{
  border-color:#7b5cff;
  box-shadow:0 0 0 4px rgba(123,92,255,.12);
}
.buy-egg-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
  align-items:stretch;
}
.buy-egg-card{
  display:flex;
  flex-direction:column;
  min-height:430px;
  padding:16px;
  border-color:#e1dcff;
}
.buy-egg-media{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-bottom:14px;
}
.buy-egg-media>div{
  min-width:0;
  text-align:center;
}
.buy-egg-media img{
  width:100%;
  height:132px;
  padding:8px;
  display:block;
  object-fit:contain;
  background:#fff;
  border:1px solid #eeeafc;
  border-radius:16px;
}
.buy-egg-media span{
  display:block;
  margin-top:5px;
  color:#6e7090;
  font-size:11px;
  font-weight:850;
}
.buy-egg-card h3{
  margin:0;
  color:#08144f;
  font-size:20px;
  line-height:1.1;
  font-weight:950;
}
.buy-egg-card p{
  margin:5px 0 12px;
  color:#59627f;
  font-size:13px;
  line-height:1.25;
  font-weight:750;
}
.buy-egg-meta{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:12px;
}
.buy-egg-meta span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  border:1px solid #ddd6ff;
  border-radius:999px;
  padding:6px 9px;
  background:#fbfaff;
  color:#5742e8;
  font-size:11px;
  line-height:1;
  font-weight:900;
}
.buy-egg-status{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  margin-top:auto;
  border-radius:13px;
  padding:10px 12px;
  background:#f7f4ff;
  color:#5644cf;
  font-size:12px;
  font-weight:950;
  text-align:center;
}
.buy-egg-card.owned .buy-egg-status{
  background:#f0fff4;
  color:#287a3d;
}
.buy-egg-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:12px;
}
.buy-egg-actions button{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  min-height:42px;
  border:0;
  border-radius:13px;
  background:linear-gradient(180deg,#6d55f6,#4d37df);
  color:#fff;
  font-size:12px;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 10px 20px rgba(79,55,223,.16);
}
.buy-egg-actions button:last-child{
  background:#fff;
  color:#5742e8;
  border:1.5px solid #cfc6ff;
  box-shadow:none;
}
.buy-egg-actions button:disabled{
  cursor:default;
  background:#f2efff;
  border:1px solid #e1dcff;
  color:#756fa3;
  box-shadow:none;
}
.buy-egg-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:16px;
  color:#303a5f;
  font-weight:900;
}
.buy-egg-pagination button{
  height:40px;
  min-width:110px;
  border:1.5px solid #cfc6ff;
  border-radius:999px;
  background:#fff;
  color:#5742e8;
  font-size:13px;
  font-weight:950;
  cursor:pointer;
}
.buy-egg-pagination button:disabled{
  opacity:.45;
  cursor:default;
}
.buy-egg-empty{
  grid-column:1/-1;
  padding:28px;
  color:#4d587a;
  font-weight:900;
  text-align:center;
}
.dragon-collection-page{
  min-height:calc(100vh - 78px);
  background:
    radial-gradient(circle at 14% 10%, rgba(124,92,255,.08), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(255,211,105,.12), transparent 24%),
    linear-gradient(180deg,#fff 0%,#faf8ff 48%,#f5f2ff 100%);
  padding:26px 28px 44px;
}
.dragon-collection-shell{
  max-width:1460px;
  margin:0 auto;
  display:grid;
  gap:18px;
}
.dragon-collection-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:24px 26px;
}
.dragon-collection-header h1{
  margin:10px 0 6px;
  color:#07113f;
  font-size:42px;
  line-height:1.04;
  font-weight:950;
  letter-spacing:0;
}
.dragon-collection-header p{
  margin:0;
  max-width:720px;
  color:#4d587a;
  font-size:15px;
  line-height:1.45;
  font-weight:650;
}
.dragon-collection-summary{
  min-width:220px;
  display:grid;
  gap:7px;
  border:1px solid #e1dcff;
  border-radius:20px;
  padding:14px 16px;
  background:#fff;
  box-shadow:0 12px 24px rgba(82,64,160,.08);
}
.dragon-collection-summary b{
  color:#08144f;
  font-size:24px;
  font-weight:950;
}
.dragon-collection-summary span{
  color:#5742e8;
  font-size:13px;
  font-weight:900;
}
.dragon-collection-controls{
  display:grid;
  grid-template-columns:minmax(280px,1fr) 210px 230px;
  gap:14px;
  align-items:end;
  padding:18px;
}
.dragon-collection-controls label{
  display:grid;
  gap:7px;
  color:#1a2458;
  font-size:13px;
  font-weight:900;
}
.dragon-collection-controls input,
.dragon-collection-controls select{
  height:46px;
  border:1.5px solid #dcd5ff;
  border-radius:14px;
  background:#fff;
  color:#111a4d;
  padding:0 14px;
  font:inherit;
  font-weight:800;
  outline:none;
}
.dragon-collection-grid-full{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
  align-items:stretch;
}
.dragon-collection-card{
  display:flex;
  flex-direction:column;
  padding:16px;
  min-height:300px;
  border-color:#e1dcff;
  text-align:center;
}
.dragon-collection-image-stage{
  position:relative;
  height:150px;
  border:1px solid #eeeafc;
  border-radius:18px;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  margin-bottom:12px;
}
.dragon-collection-image-stage img{
  width:100%;
  height:100%;
  padding:10px;
  object-fit:contain;
  background:#fff;
}
.dragon-collection-card.locked .dragon-collection-image-stage img{
  filter:grayscale(1) contrast(.82) brightness(1.08);
  opacity:.42;
}
.dragon-collection-card h3{
  margin:0;
  color:#08144f;
  font-size:18px;
  line-height:1.12;
  font-weight:950;
}
.dragon-collection-card p{
  margin:7px 0 12px;
  color:#59627f;
  font-size:12px;
  line-height:1.35;
  font-weight:750;
}
.dragon-collection-empty{
  grid-column:1/-1;
  padding:28px;
  color:#4d587a;
  font-weight:900;
  text-align:center;
}
.badges-page{
  min-height:calc(100vh - 78px);
  background:
    radial-gradient(circle at 14% 10%, rgba(124,92,255,.08), transparent 30%),
    radial-gradient(circle at 88% 12%, rgba(255,211,105,.12), transparent 24%),
    linear-gradient(180deg,#fff 0%,#faf8ff 48%,#f5f2ff 100%);
  padding:26px 28px 44px;
}
.badges-shell{
  max-width:1460px;
  margin:0 auto;
  display:grid;
  gap:18px;
}
.badges-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:24px 26px;
}
.badges-header h1{
  margin:10px 0 6px;
  color:#07113f;
  font-size:42px;
  line-height:1.04;
  font-weight:950;
  letter-spacing:0;
}
.badges-header p{
  margin:0;
  max-width:760px;
  color:#4d587a;
  font-size:15px;
  line-height:1.45;
  font-weight:650;
}
.badges-controls{
  display:grid;
  grid-template-columns:minmax(280px,1fr) 210px 230px;
  gap:14px;
  align-items:end;
  padding:18px;
}
.badges-controls label{
  display:grid;
  gap:7px;
  color:#1a2458;
  font-size:13px;
  font-weight:900;
}
.badges-controls input,
.badges-controls select{
  height:46px;
  border:1.5px solid #dcd5ff;
  border-radius:14px;
  background:#fff;
  color:#111a4d;
  padding:0 14px;
  font:inherit;
  font-weight:800;
  outline:none;
}
.badges-grid-full,
.all-badges{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:18px;
  align-items:stretch;
}
.badge-collection-card{
  position:relative;
  display:flex;
  flex-direction:column;
  padding:16px;
  min-height:270px;
  border-color:#e1dcff;
  text-align:center;
  background:#fff;
  border-radius:20px;
}
.badge-collection-card.compact{
  min-height:230px;
  border:1px solid #e1dcff;
}
.badge-image-stage{
  position:relative;
  height:132px;
  border:1px solid #eeeafc;
  border-radius:18px;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  margin-bottom:12px;
}
.badge-image-stage img{
  width:100%;
  height:100%;
  padding:12px;
  object-fit:contain;
  background:#fff;
}
.badge-collection-card.locked .badge-image-stage img,
.badge-collection-card.in-progress .badge-image-stage img{
  filter:grayscale(1) contrast(.86) brightness(1.06);
  opacity:.48;
}
.badge-collection-card.in-progress .badge-image-stage img{
  opacity:.68;
}
.badge-collection-card h3{
  margin:0;
  color:#08144f;
  font-size:17px;
  line-height:1.12;
  font-weight:950;
}
.badge-collection-card p{
  margin:7px 0 12px;
  color:#59627f;
  font-size:12px;
  line-height:1.35;
  font-weight:800;
}

@media(max-width:1180px){
  .study-layout{grid-template-columns:1fr!important}
  .profile-dash-hero{grid-template-columns:120px 1fr}
  .profile-dash-actions{grid-column:1/-1;justify-content:flex-start}
  .profile-row-2,.profile-row-3,.bottom-row{grid-template-columns:1fr}
  .my-studio-row-1,.my-studio-row-2,.my-studio-bottom-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .my-studio-row-3{grid-template-columns:1fr}
  .studio-tasks-card,.quick-links-card{grid-column:1/-1}
  .dash-stat-grid{grid-template-columns:repeat(2,1fr)}
  .quick-link-row{grid-template-columns:repeat(2,1fr)}
  .studio-store-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .studio-collection-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .buy-egg-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .buy-egg-controls{grid-template-columns:1fr 1fr}
  .dragon-collection-grid-full{grid-template-columns:repeat(3,minmax(0,1fr))}
  .dragon-collection-controls{grid-template-columns:1fr 1fr}
  .badges-grid-full,.all-badges{grid-template-columns:repeat(3,minmax(0,1fr))}
  .badges-controls{grid-template-columns:1fr 1fr}
}
@media(max-width:680px){
  .profile-page,.study-page{padding:12px!important}
  .profile-dash-hero{grid-template-columns:1fr;text-align:center}
  .my-studio-dashboard{display:grid}
  .my-studio-hero{order:1}
  .my-studio-row-1,.my-studio-row-2,.my-studio-row-3,.my-studio-bottom-row{display:contents}
  .studio-current-card{order:2}
  .studio-hatching-card{order:3}
  .studio-tasks-card{order:4;grid-column:auto}
  .learning-snapshot-card{order:5}
  .readiness-card{order:6}
  .studio-store-preview{order:7}
  .studio-collection-card{order:8}
  .studio-achievements-card{order:9}
  .quick-links-card{order:10;grid-column:auto}
  .plan-actions-card{order:11}
  .community-card{order:12}
  .profile-dash-avatar{width:112px;height:112px}
  .profile-meta-row,.profile-quick-stats,.profile-dash-actions{justify-content:center}
  .dash-stat-grid,.plan-action-grid,.profile-badge-grid,.quick-link-row{grid-template-columns:1fr}
  .plan-action-grid button,.quick-link-row button{border-right:0;border-bottom:1px solid #e3e0f2}
  .dash-progress-row{grid-template-columns:1fr 1fr 38px}
  .hatch-body,.invite-mini-card,.studio-creature-preview,.studio-hatch-stage{grid-template-columns:1fr;text-align:center}
  .studio-creature-preview>img,.studio-hatch-stage>img{margin:0 auto}
  .studio-collection-grid{grid-template-columns:1fr 1fr}
  .studio-store-grid{
    display:flex;
    overflow-x:auto;
    gap:12px;
    padding-bottom:6px;
    scroll-snap-type:x mandatory;
  }
  .studio-store-tile{
    min-width:160px;
    scroll-snap-align:start;
  }
  .buy-egg-page{padding:14px}
  .buy-egg-header{display:grid;padding:18px}
  .buy-egg-header h1{font-size:34px}
  .buy-egg-wallet{justify-content:flex-start;padding:0 16px}
  .buy-egg-controls{grid-template-columns:1fr}
  .buy-egg-grid{grid-template-columns:1fr}
  .buy-egg-card{min-height:auto}
  .buy-egg-pagination{flex-wrap:wrap}
  .dragon-collection-page{padding:14px}
  .dragon-collection-header{display:grid;padding:18px}
  .dragon-collection-header h1{font-size:34px}
  .dragon-collection-controls{grid-template-columns:1fr}
  .dragon-collection-grid-full{grid-template-columns:1fr 1fr;gap:12px}
  .dragon-collection-card{min-height:auto;padding:12px}
  .dragon-collection-image-stage{height:120px}
  .badges-page{padding:14px}
  .badges-header{display:grid;padding:18px}
  .badges-header h1{font-size:34px}
  .badges-controls{grid-template-columns:1fr}
  .badges-grid-full,.all-badges{grid-template-columns:1fr 1fr;gap:12px}
  .badge-collection-card{min-height:auto;padding:12px}
  .badge-image-stage{height:118px}
  .studio-badge-preview-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .leader-mini-card li span{float:none;display:block;margin-top:2px}
  .word-display h2{font-size:42px!important}
}
/* ===== HatchElite Games Phase 1 design system ===== */
:root{
  --he-navy:#070d4d;
  --he-purple:#6338f5;
  --he-purple-2:#7c4dff;
  --he-light-purple:#f5f2ff;
  --he-border:#ded7ff;
  --he-gold:#ffb52e;
  --he-success:#22c55e;
  --he-danger:#ff4b2b;
  --he-card-bg:rgba(255,255,255,.92);
  --he-shadow:0 18px 45px rgba(75,55,180,.12);
  --he-soft-shadow:0 8px 24px rgba(76,56,180,.10);
  --he-radius-xl:28px;
  --he-radius-lg:22px;
  --he-radius-md:16px;
}
.he-card{background:var(--he-card-bg);border:1px solid var(--he-border);border-radius:var(--he-radius-xl);box-shadow:var(--he-shadow)}
.he-panel{background:rgba(255,255,255,.96);border:1px solid var(--he-border);border-radius:var(--he-radius-lg);box-shadow:var(--he-soft-shadow);padding:22px}
.he-panel h2{display:flex;align-items:center;gap:12px;margin:0 0 16px;color:var(--he-purple);font-size:22px;font-weight:1000}
.he-panel h2 img{width:36px;height:36px;object-fit:contain}
.he-title{margin:0;color:var(--he-navy);font-size:clamp(46px,5.2vw,72px);line-height:.98;font-weight:1000;letter-spacing:-1px;text-align:center}
.he-subtitle{margin:14px auto 0;max-width:920px;color:#24305f;font-size:19px;line-height:1.45;text-align:center;font-weight:650}
.he-stat-row{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:22px}
.he-stat-pill{min-width:190px;min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 22px;border-radius:999px;background:rgba(255,255,255,.88);border:1px solid var(--he-border);box-shadow:var(--he-soft-shadow);color:var(--he-purple);font-weight:900}
.he-stat-pill img{width:30px;height:30px;object-fit:contain}
.he-stat-pill strong{color:var(--he-navy);font-size:20px}
.he-primary-button,.he-ghost-button{border-radius:999px;min-height:54px;padding:0 28px;font-size:18px;font-weight:1000;cursor:pointer}
.he-primary-button{border:0;background:linear-gradient(180deg,var(--he-purple-2),var(--he-purple));color:white;box-shadow:0 14px 28px rgba(99,56,245,.24)}
.he-primary-button:disabled{opacity:.64;cursor:not-allowed;transform:none!important}
.he-ghost-button{border:1.5px solid var(--he-border);background:white;color:var(--he-purple)}
.he-progress-track{height:16px;background:#e8e4ff;border-radius:999px;overflow:hidden}
.he-progress-fill{display:block;height:100%;background:linear-gradient(90deg,var(--he-purple),var(--he-purple-2));border-radius:999px}
.he-hover-lift{transition:transform 180ms ease,box-shadow 180ms ease}
.he-hover-lift:hover{transform:translateY(-3px);box-shadow:0 20px 46px rgba(99,56,245,.18)}
.he-game-route{position:relative;width:min(96vw,1720px);margin:-8px auto 0;padding:0 0 18px;background:linear-gradient(180deg,#ffffff 0%,#faf9ff 42%,#f7f5ff 100%);overflow:hidden}
.study-layout.game-layout{grid-template-columns:minmax(0,1fr)!important;max-width:min(96vw,1720px)!important;margin:0 auto!important}
.study-layout.game-layout .side-col,.study-layout.game-layout .right-col{display:none!important}
.study-layout.game-layout .main-study-card:has(.he-game-route),
.study-layout.game-layout .main-study-card.game-route-card{grid-column:1/-1!important;width:100%!important;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
body.game-route-mode .topbar,
body.game-route-mode .mode-tabs,
body.game-route-mode .free-banner{display:none!important}
body.game-route-mode .study-page{max-width:none!important;padding:0!important}
.he-game-route:before{content:"";position:absolute;inset:0;background-image:url("assets/assets_webp/game/effects/11_background_star_pattern.webp");background-size:520px auto;opacity:.12;pointer-events:none}
.he-game-topbar{position:relative;z-index:1;min-height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;border-bottom:1px solid #e9e5ff;background:rgba(255,255,255,.9);border-radius:0 0 18px 18px}
.he-game-brand{border:0;background:transparent;cursor:pointer}.he-game-brand img{height:54px;width:auto;display:block}
.he-game-topbar nav{display:flex;align-items:center;gap:34px}.he-game-topbar nav button{border:0;background:transparent;color:var(--he-navy);font-size:17px;font-weight:900;cursor:pointer;position:relative;padding:25px 0}
.he-game-topbar nav button.active{color:var(--he-purple)}.he-game-topbar nav button.active:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;border-radius:99px;background:var(--he-purple)}
.he-game-header{position:relative;z-index:1;padding:30px 24px 18px;text-align:center}
.he-route-sparkle{position:absolute;z-index:0;pointer-events:none;opacity:.55}.he-route-sparkle.one{left:29%;top:104px;width:86px}.he-route-sparkle.two{right:26%;top:118px;width:70px}
.he-game-shell{position:relative;z-index:1;display:grid;grid-template-columns:300px minmax(620px,1fr) 360px;gap:32px;max-width:1720px;margin:0 auto;padding:22px 28px 36px;align-items:start}
.he-game-left,.he-game-right{display:flex;flex-direction:column;gap:22px}
.he-game-main{min-width:0}.he-game-board{min-height:520px;padding:34px;display:flex;flex-direction:column;justify-content:center;gap:28px;text-align:center}
.he-game-board h2{margin:0;color:var(--he-purple);font-size:28px;font-weight:1000}
.he-placeholder-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.he-placeholder-grid article{min-height:174px;padding:22px;border:1px solid var(--he-border);border-radius:22px;background:linear-gradient(180deg,#fff,#fbfaff);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}
.he-placeholder-grid img{width:72px;height:72px;object-fit:contain}.he-placeholder-grid b{font-size:19px;color:var(--he-navy)}.he-placeholder-grid span{font-size:14px;line-height:1.4;color:#4c5786}
.he-game-actions{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}
.he-hero-art-card{padding:14px;overflow:hidden}.he-hero-art-card img{display:block;width:100%;max-height:390px;object-fit:cover;border-radius:22px}
.he-reward-panel h2 img{width:54px;height:54px}.he-reward-panel p,.he-hint-panel p{color:#33406f;line-height:1.45}
.he-instruction-list{display:grid;gap:18px}.he-instruction-step{display:grid;grid-template-columns:42px 1fr;gap:14px;align-items:center}.he-instruction-step span{width:42px;height:42px;border-radius:50%;background:linear-gradient(180deg,var(--he-purple-2),var(--he-purple));display:flex;align-items:center;justify-content:center;color:white;font-weight:1000;box-shadow:var(--he-soft-shadow)}.he-instruction-step p{margin:0;color:#24305f;font-size:15.5px;line-height:1.45;font-weight:650}
.he-word-list-button{width:100%}
.he-game-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.he-game-card-grid .game-card img{height:156px!important;object-fit:cover!important;border-radius:18px!important}
.he-games-landing .game-card small{min-height:42px}
.he-sparkle-decor{position:absolute;pointer-events:none}
.he-games-select-page{position:relative;width:min(96vw,1500px);margin:0 auto 42px;padding:0 0 42px;background:linear-gradient(180deg,#fff 0%,#fbfaff 45%,#f6f4ff 100%);overflow:hidden}
.he-games-select-page:before{content:"";position:absolute;inset:72px 0 0;background-image:url("assets/assets_webp/game/effects/11_background_star_pattern.webp");background-size:560px auto;opacity:.11;pointer-events:none}
.he-games-decor{position:absolute;pointer-events:none;z-index:0}.he-games-decor.sparkle-left{left:28%;top:142px;width:86px;opacity:.6}.he-games-decor.sparkle-right{right:26%;top:150px;width:78px;opacity:.5}.he-games-decor.glow{right:9%;top:210px;width:84px;opacity:.23}
.he-games-hero-block{position:relative;z-index:1;max-width:1000px;margin:0 auto 34px;padding:52px 24px 8px;text-align:center}
.he-games-hero-block h1{margin:0;color:var(--he-navy);font-size:clamp(44px,5vw,70px);line-height:1;font-weight:1000;letter-spacing:-1.2px}
.he-games-hero-block p{max-width:900px;margin:16px auto 0;color:#263365;font-size:20px;line-height:1.45;font-weight:650}
.he-games-hero-block small{display:block;margin:12px auto 0;color:var(--he-purple);font-weight:850;font-size:15px}
.he-featured-game-card{position:relative;z-index:1;display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:22px;max-width:1320px;margin:0 auto 30px;padding:24px 28px;border-radius:30px;border:1px solid rgba(180,165,255,.48);background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(245,242,255,.94));box-shadow:0 22px 56px rgba(75,55,180,.13);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease,border-color 180ms ease}
.he-featured-game-card:hover,.he-featured-game-card:focus-visible{transform:translateY(-4px);box-shadow:0 28px 68px rgba(99,56,245,.2);border-color:rgba(99,56,245,.46);outline:none}
.he-featured-copy h2{margin:12px 0 10px;color:var(--he-navy);font-size:34px;line-height:1.08;font-weight:1000}.he-featured-copy p{margin:0 0 20px;color:#3d4773;font-size:18px;line-height:1.45}.he-status-pill{display:inline-flex;align-items:center;border-radius:999px;padding:8px 14px;background:#fff6dc;border:1px solid #ffd779;color:#7c4a00;font-size:13px;font-weight:1000}
.he-featured-image{height:238px;border-radius:24px;overflow:hidden;background:linear-gradient(135deg,#f5f2ff,#fff);box-shadow:inset 0 0 0 1px rgba(222,215,255,.9)}.he-featured-image img{width:100%;height:100%;object-fit:cover;display:block}
.he-games-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;max-width:1320px;margin:0 auto}
.hatchelite-game-card{position:relative;overflow:hidden;border-radius:28px;background:rgba(255,255,255,.94);border:1px solid rgba(180,165,255,.45);box-shadow:0 18px 45px rgba(75,55,180,.12);padding:20px;transition:transform 180ms ease,box-shadow 180ms ease,border-color 180ms ease;cursor:pointer;display:flex;flex-direction:column;min-height:560px}
.hatchelite-game-card:before{content:"";position:absolute;right:-36px;top:-36px;width:122px;height:122px;background:radial-gradient(circle,rgba(124,92,255,.16),transparent 68%);opacity:0;transition:opacity 180ms ease;pointer-events:none}
.hatchelite-game-card:hover,.hatchelite-game-card:focus-visible{transform:translateY(-4px);box-shadow:0 24px 60px rgba(99,56,245,.2);border-color:rgba(99,56,245,.45);outline:none}.hatchelite-game-card:hover:before,.hatchelite-game-card:focus-visible:before{opacity:.72}
.game-card-image-wrap{height:218px;border-radius:22px;overflow:hidden;background:linear-gradient(135deg,#f5f2ff,#fff);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 0 0 1px rgba(222,215,255,.85)}
.game-card-image{width:100%;height:100%;object-fit:cover;display:block}
.game-card-content{display:flex;flex-direction:column;gap:13px;flex:1;padding-top:18px}.game-card-content h2{margin:0;color:var(--he-navy);font-size:26px;line-height:1.08;font-weight:1000;letter-spacing:-.2px}.game-card-content p{margin:0;color:#465174;font-size:15.5px;line-height:1.45}
.game-card-status{display:flex;justify-content:space-between;gap:8px}.game-card-status span{display:inline-flex;border-radius:999px;padding:6px 10px;background:#f7f5ff;border:1px solid var(--he-border);color:var(--he-purple);font-size:12px;font-weight:900}.game-card-status span:last-child{background:#fff7df;border-color:#f8d782;color:#8a5b00}
.he-game-wallet{display:inline-flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin:0 auto 18px;padding:10px 14px;border:1px solid rgba(180,165,255,.58);border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 10px 24px rgba(75,55,180,.1)}
.he-game-wallet span{display:inline-flex;align-items:center;gap:7px;color:var(--he-navy);font-weight:950;font-size:14px}.he-game-wallet img{width:25px;height:25px;object-fit:contain}
.he-daily-reward-card{position:relative;z-index:1;display:flex;align-items:center;gap:18px;max-width:1320px;margin:0 auto 28px;padding:18px 22px;border-radius:26px;border:1px solid rgba(180,165,255,.52);background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,250,234,.94));box-shadow:0 18px 42px rgba(75,55,180,.12)}
.he-daily-reward-card>img{width:76px;height:76px;object-fit:contain;flex:0 0 auto}.he-daily-reward-card h2{margin:4px 0 4px;color:var(--he-navy);font-size:26px;line-height:1;font-weight:1000}.he-daily-reward-card p{margin:0;color:#465174;font-size:15px}.he-daily-reward-card b{display:block;margin-top:7px;color:var(--he-purple);font-size:14px}
.game-card-badge{display:flex;align-items:center;gap:9px;min-height:38px;padding:8px 10px;border-radius:16px;background:#f8f6ff;border:1px solid #e5deff;color:#4c3bab;font-weight:950;font-size:13px}.game-card-badge img{width:32px;height:32px;object-fit:contain}.game-card-badge.locked{color:#6e7390;background:#fbfaff}.game-card-badge.locked img{filter:grayscale(1);opacity:.7}.game-card-badge.earned{background:linear-gradient(135deg,#fff7df,#f3efff);border-color:#d7c6ff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.7)}
.game-card-progress{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:auto}.game-card-progress span{padding:10px;border-radius:14px;background:#fbfaff;border:1px solid #eeeaff;color:#59617f;font-weight:800;font-size:12px}.game-card-progress b{display:block;padding:0!important;margin-top:2px;color:var(--he-navy);font-size:18px}.hatchelite-game-card.completed{border-color:rgba(99,56,245,.55);box-shadow:0 20px 54px rgba(99,56,245,.17)}
.game-completion-backdrop{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:22px;background:rgba(8,11,46,.42);backdrop-filter:blur(5px)}
.game-completion-modal{position:relative;width:min(720px,94vw);max-height:92vh;overflow:hidden;border-radius:30px;border:1px solid rgba(222,215,255,.95);background:linear-gradient(180deg,#fff,#fbfaff);box-shadow:0 34px 90px rgba(24,13,90,.35);padding:28px 36px 30px;text-align:center;color:var(--he-navy)}
.completion-confetti{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18;pointer-events:none}.completion-dragon{position:relative;width:132px;height:132px;object-fit:contain;margin:0 auto 6px;filter:drop-shadow(0 16px 18px rgba(99,56,245,.2))}
.completion-reward-image-wrap{position:relative;width:min(360px,72vw);margin:0 auto 12px;padding:8px;border-radius:24px;background:#fff;border:1px solid rgba(124,92,255,.16);box-shadow:0 14px 32px rgba(82,64,160,.1)}
.completion-reward-image{display:block;width:100%;height:min(220px,30vh);object-fit:cover;object-position:center;border-radius:20px;background:#f7f3ff;filter:drop-shadow(0 12px 16px rgba(99,56,245,.16))}
.completion-reward-fallback{height:min(220px,30vh);place-items:center;border-radius:20px;background:linear-gradient(180deg,#fbf9ff,#f1ecff);color:#6047dd;font-weight:950}
.completion-song-button{right:18px!important;bottom:18px!important}
.game-completion-modal h2{position:relative;margin:12px 0 6px;color:var(--he-navy);font-size:clamp(30px,4vw,42px);line-height:1.05;font-weight:1000}.game-completion-modal p{position:relative;margin:0 auto 14px;color:#465174;font-size:17px;line-height:1.35;max-width:520px}
.completion-reward-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0}.completion-reward-grid span{min-height:72px;padding:12px 16px;border-radius:18px;background:white;border:1px solid #e9e4ff;box-shadow:0 8px 18px rgba(75,55,180,.08);display:flex;flex-direction:column;align-items:center;justify-content:center}.completion-reward-grid b{display:block;color:var(--he-purple);font-size:30px;line-height:1}.completion-reward-grid small{display:block;color:#59617f;font-weight:850;font-size:15px;margin-top:6px}
.reward-inline-list{position:relative;display:flex;flex-direction:column;gap:7px;margin:12px 0 12px;align-items:center}.reward-inline-item{display:flex;align-items:center;justify-content:center;gap:10px;color:#4f46b8;font-size:18px;font-weight:900;line-height:1.25}.reward-inline-item img{width:34px;height:34px;object-fit:contain}.reward-inline-item.earned{color:#6b4b00}
.completion-actions{position:relative;display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:12px}.completion-primary,.completion-secondary{border:0;border-radius:999px;min-height:52px;padding:0 30px;font-size:18px;font-weight:1000;cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.completion-primary{background:linear-gradient(135deg,#7c4dff,#4f2de6);color:#fff;box-shadow:0 14px 28px rgba(99,56,245,.3)}.completion-secondary{background:#fff;color:var(--he-purple);border:1px solid var(--he-border)}.completion-primary:hover,.completion-secondary:hover{transform:translateY(-2px)}
.hatchelite-games-page button:focus-visible,.hatchelite-game-page button:focus-visible,.game-completion-modal button:focus-visible{outline:3px solid rgba(99,56,245,.34);outline-offset:3px}
.hatchelite-game-page button:disabled,.hatchelite-games-page button:disabled,.game-completion-modal button:disabled{opacity:.55;cursor:not-allowed;box-shadow:none!important;transform:none!important}
.game-completion-modal{animation:he-modal-in 220ms ease both}@keyframes he-modal-in{from{transform:translateY(10px) scale(.98);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}
.game-tags{display:flex;gap:8px;flex-wrap:wrap}.game-tag{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:7px 11px;background:#f3efff;color:var(--he-purple);border:1px solid var(--he-border);font-weight:800;font-size:13px}.game-tag.difficulty{background:#fff9e8;color:#8a5b00;border-color:#f4d889}
.best-for{margin-top:auto;padding:13px 14px;border-radius:17px;background:#fbfaff;border:1px solid #eeeaff}.best-for b{display:block;color:var(--he-navy);font-size:13px;margin-bottom:4px}.best-for span{display:block;color:#515b81;font-size:13.5px;line-height:1.35}
.play-game-button{width:100%;border:none;border-radius:999px;padding:14px 18px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-weight:900;font-size:16px;box-shadow:0 12px 26px rgba(99,56,245,.28);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.play-game-button:hover,.play-game-button:focus-visible{transform:translateY(-2px);box-shadow:0 16px 34px rgba(99,56,245,.36);outline:2px solid rgba(99,56,245,.22);outline-offset:2px}
.stoke-fire-page{position:relative;min-height:100vh;background:linear-gradient(180deg,#fff 0%,#fbfaff 45%,#f6f4ff 100%);overflow:hidden;color:var(--he-navy)}
.stoke-fire-page:before{content:"";position:absolute;inset:72px 0 0;background-image:url("assets/assets_webp/game/effects/11_background_star_pattern.webp");background-size:560px auto;opacity:.1;pointer-events:none}
.stoke-fire-page .he-game-topbar{position:relative;z-index:3}
.stoke-sparkle{position:absolute;z-index:0;pointer-events:none;opacity:.55}.stoke-sparkle.one{left:29%;top:122px;width:84px}.stoke-sparkle.two{right:29%;top:128px;width:76px}
.stoke-title-block{position:relative;z-index:1;text-align:center;padding:34px 24px 16px}.stoke-title-block h1{margin:0;color:var(--he-navy);font-size:clamp(42px,5vw,68px);line-height:.98;font-weight:1000;letter-spacing:-1px}.stoke-title-block p{margin:14px auto 0;color:#263365;font-size:20px;font-weight:650}
.stoke-stat-row{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:22px}.stoke-stat-pill{min-height:58px;min-width:190px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 22px;border-radius:999px;background:rgba(255,255,255,.9);border:1px solid var(--he-border);box-shadow:var(--he-soft-shadow);color:var(--he-purple);font-weight:950}.stoke-stat-pill>img{width:32px;height:32px;object-fit:contain}.stoke-stat-pill strong{color:var(--he-navy);font-size:21px}.stoke-stat-pill em{display:inline-flex;gap:3px;font-style:normal}.stoke-stat-pill em img{width:24px;height:24px;object-fit:contain;filter:saturate(.9)}
.stoke-game-shell{position:relative;z-index:1;display:grid;grid-template-columns:minmax(250px,300px) minmax(560px,1fr) minmax(300px,360px);gap:24px;max-width:1720px;margin:0 auto;padding:22px 28px 38px;align-items:start}.stoke-left-col,.stoke-right-col{display:flex;flex-direction:column;gap:22px}.stoke-main-col{min-width:0}
.stoke-panel{background:rgba(255,255,255,.94);border:1px solid var(--he-border);border-radius:24px;box-shadow:var(--he-soft-shadow);padding:24px}.stoke-panel h2{display:flex;align-items:center;gap:10px;margin:0 0 16px;color:var(--he-purple);font-size:24px;font-weight:1000}.stoke-panel p{margin:0;color:#2f3a6a;line-height:1.45;font-weight:600}
.stoke-step{display:grid;grid-template-columns:44px 42px 1fr;gap:12px;align-items:center;padding:18px 0;border-top:1px solid #ece8ff}.stoke-step:first-of-type{border-top:0}.stoke-step b{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,var(--he-purple-2),var(--he-purple));color:white;font-size:19px;box-shadow:var(--he-soft-shadow)}.stoke-step i{font-style:normal;font-size:29px;color:var(--he-purple);text-align:center}.stoke-step p{font-size:15.5px}
.hint-panel{background:linear-gradient(180deg,#fff,#f8f5ff)}.stoke-hint-button,.stoke-word-list-button{width:100%;min-height:58px;border:0;border-radius:20px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:18px;font-weight:1000;box-shadow:0 14px 28px rgba(99,56,245,.25);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.stoke-hint-button{margin-top:18px;display:flex;align-items:center;justify-content:center;gap:18px}.stoke-hint-button b{width:34px;height:34px;border-radius:50%;background:white;color:var(--he-purple);display:flex;align-items:center;justify-content:center}.stoke-hint-button:disabled{opacity:.55;cursor:not-allowed}.stoke-word-list-button{border:1px solid var(--he-border);background:white;color:var(--he-purple)}
.stoke-board{position:relative;overflow:hidden;min-height:596px;padding:32px;border-radius:28px;background:rgba(255,255,255,.95);border:1px solid var(--he-border);box-shadow:var(--he-shadow);text-align:center}.base-label{display:flex;align-items:center;justify-content:center;gap:16px;color:var(--he-purple);font-size:24px;font-weight:1000}.base-label span{width:46px;height:2px;background:#cdc3ff}.stoke-base-word{margin:2px 0 18px;color:var(--he-navy);font-size:clamp(56px,6vw,76px);line-height:1;font-weight:1000;letter-spacing:-1px}.intensity-scale{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;gap:10px;max-width:690px;margin:0 auto}.intensity-scale span{font-size:32px}.intensity-scale i{height:14px;border-radius:999px;background:linear-gradient(90deg,#52bdf5,#7c4dff,#ffbf4d,#ff4b2b);box-shadow:0 8px 18px rgba(124,77,255,.16)}.scale-labels{display:flex;justify-content:space-between;max-width:570px;margin:10px auto 28px;color:var(--he-purple);font-weight:850}
.heat-slots{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-bottom:24px}.stoke-heat-slot{position:relative;min-height:158px;border:2px dashed #c9bfff;border-radius:24px;background:linear-gradient(180deg,#fff,#fbfaff);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;color:var(--he-purple);cursor:pointer;transition:transform 180ms ease,border-color 180ms ease,box-shadow 180ms ease,background 180ms ease}.stoke-heat-slot:hover,.stoke-heat-slot:focus-visible{transform:translateY(-2px);border-color:var(--he-purple);box-shadow:0 16px 34px rgba(99,56,245,.12);outline:none}.stoke-heat-slot img{width:46px;height:46px;object-fit:contain}.stoke-heat-slot small{font-size:16px;font-weight:950}.stoke-heat-slot b{font-size:22px;color:var(--he-navy);line-height:1.1}.stoke-heat-slot em{font-size:12px;font-style:normal;color:#7a80a5}.stoke-heat-slot.filled{border-style:solid;background:#fff}.stoke-heat-slot.wrong{border-color:#ff725c;background:#fff6f4;animation:stoke-shake 360ms ease}.stoke-heat-slot.slot-2 small{color:#ee3f23}.slot-number{position:absolute;top:-18px;width:42px;height:42px;border-radius:50%;background:#f4f1ff;border:1px solid var(--he-border);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:1000;color:var(--he-purple);box-shadow:var(--he-soft-shadow)}
.stoke-word-bank{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:0 auto 16px;padding:18px;border:1px solid #eeeaff;border-radius:20px;background:#fbfaff}.stoke-word-card{min-height:70px;border:1px solid var(--he-border);border-radius:18px;background:white;color:var(--he-navy);display:flex;align-items:center;justify-content:center;gap:18px;font-size:22px;font-weight:1000;cursor:grab;box-shadow:0 10px 22px rgba(75,55,180,.09);transition:transform 180ms ease,border-color 180ms ease,box-shadow 180ms ease}.stoke-word-card:hover,.stoke-word-card:focus-visible,.stoke-word-card.selected{transform:translateY(-3px);border-color:var(--he-purple);box-shadow:0 18px 34px rgba(99,56,245,.16);outline:none}.stoke-word-card i{font-style:normal;color:#b5a8ff}.empty-bank{grid-column:1/-1;color:#687093;font-weight:800;padding:18px}
.stoke-feedback{min-height:40px;display:flex;align-items:center;justify-content:center;border-radius:16px;margin:4px 0 16px;padding:8px 14px;font-weight:850}.stoke-feedback.neutral{background:#f7f5ff;color:var(--he-purple)}.stoke-feedback.success{background:#ecfdf3;color:#15803d}.stoke-feedback.error{background:#fff0ee;color:#c8351b}
.stoke-action-bar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:14px 18px;border-radius:22px;background:#fbfaff;border:1px solid #eeeaff}.stoke-action-bar span{display:flex;align-items:center;gap:8px;color:var(--he-purple);font-size:18px;font-weight:900}.stoke-action-bar span img{width:30px;height:30px}.stoke-fill-track{height:16px;border-radius:999px;background:#e8e4ff;overflow:hidden}.stoke-fill-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--he-purple),var(--he-purple-2));transition:width 220ms ease}.ignite-button{min-height:64px;border:0;border-radius:22px;padding:0 32px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:22px;font-weight:1000;box-shadow:0 14px 30px rgba(99,56,245,.28);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.ignite-button:hover:not(:disabled),.stoke-hint-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 18px 38px rgba(99,56,245,.36)}.ignite-button:disabled{opacity:.55;cursor:not-allowed}
.stoke-dragon-card{height:430px;padding:14px;border-radius:30px;background:white;border:1px solid var(--he-border);box-shadow:var(--he-shadow);overflow:hidden}.stoke-dragon-card img{display:block;width:100%;height:100%;object-fit:cover;border-radius:22px}.reward-panel h2{justify-content:center}.reward-copy{display:grid;grid-template-columns:76px 1fr;gap:14px;align-items:center;margin:12px 0}.reward-copy img{width:76px;height:76px;object-fit:contain}.reward-progress{display:grid;grid-template-columns:auto 1fr 44px;align-items:center;gap:12px;color:var(--he-purple);font-size:18px}.reward-progress div{height:14px;border-radius:999px;background:#e8e4ff;overflow:hidden}.reward-progress i{display:block;height:100%;background:linear-gradient(90deg,var(--he-purple),var(--he-purple-2));border-radius:inherit}.reward-progress img{width:44px;height:44px;object-fit:contain}.fire-keeper-complete{display:block;margin-top:16px;text-align:center;color:#15803d;font-size:18px}.stoke-encouragement{display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:center;padding:20px 24px;border-radius:24px;background:linear-gradient(180deg,#fff,#f8f5ff);border:1px solid var(--he-border);box-shadow:var(--he-soft-shadow);font-weight:750;color:#273568}.stoke-encouragement img{width:48px;height:48px;object-fit:contain}
.stoke-effect{position:absolute;left:50%;top:50%;z-index:5;pointer-events:none;transform:translate(-50%,-50%);animation:stoke-pop-fade 900ms ease forwards}.success-effect{width:min(52%,420px)}.wrong-effect{width:min(42%,320px)}
.stoke-word-list-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:rgba(10,12,50,.38);backdrop-filter:blur(4px)}.stoke-word-list-modal{position:relative;width:min(760px,94vw);max-height:min(720px,86vh);overflow:auto;border-radius:28px;background:white;border:1px solid var(--he-border);box-shadow:0 30px 80px rgba(20,14,74,.28);padding:28px}.stoke-word-list-modal h2{margin:0;color:var(--he-navy);font-size:30px}.stoke-word-list-modal p{margin:8px 0 18px;color:#59617f}.stoke-word-list-table{display:grid;gap:10px}.stoke-word-list-table div{display:grid;grid-template-columns:140px 1fr;gap:8px 16px;padding:13px 14px;border:1px solid #eeeaff;border-radius:16px;background:#fbfaff}.stoke-word-list-table b{color:var(--he-navy)}.stoke-word-list-table span{color:var(--he-purple);font-weight:900}.stoke-word-list-table small{grid-column:2;color:#59617f}.modal-close{position:absolute;right:18px;top:16px;width:42px;height:42px;border:0;border-radius:50%;background:#f3efff;color:var(--he-navy);font-size:24px;cursor:pointer}
@keyframes stoke-pop-fade{0%{opacity:0;transform:translate(-50%,-50%) scale(.75)}22%{opacity:1;transform:translate(-50%,-50%) scale(1.02)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.16)}}@keyframes stoke-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media(max-width:1280px){.stoke-game-shell{grid-template-columns:280px minmax(0,1fr)}.stoke-right-col{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.stoke-encouragement{grid-column:1/-1}.stoke-dragon-card{height:360px}}
@media(max-width:860px){.stoke-title-block{padding-top:26px}.stoke-game-shell{grid-template-columns:1fr;padding:18px 14px}.stoke-right-col{display:flex}.heat-slots,.stoke-word-bank{grid-template-columns:1fr}.stoke-action-bar{grid-template-columns:1fr;text-align:center}.stoke-action-bar span{justify-content:center}.stoke-dragon-card{height:300px}.stoke-step{grid-template-columns:38px 34px 1fr}.stoke-sparkle{display:none}.stoke-word-list-table div{grid-template-columns:1fr}.stoke-word-list-table small{grid-column:1}}
.forge-scale-page{position:relative;min-height:100vh;background:linear-gradient(180deg,#fff 0%,#fbfaff 44%,#f6f4ff 100%);overflow:hidden;color:var(--he-navy)}
.forge-scale-page:before{content:"";position:absolute;inset:72px 0 0;background-image:url("assets/assets_webp/game/effects/11_background_star_pattern.webp");background-size:560px auto;opacity:.1;pointer-events:none}.forge-scale-page .he-game-topbar{position:relative;z-index:3}
.forge-sparkle{position:absolute;z-index:0;pointer-events:none;opacity:.55}.forge-sparkle.one{left:27%;top:118px;width:84px}.forge-sparkle.two{right:25%;top:132px;width:76px}
.forge-title-block{position:relative;z-index:1;text-align:center;padding:34px 24px 16px}.forge-title-block h1{margin:0;color:var(--he-navy);font-size:clamp(40px,4.8vw,66px);line-height:.98;font-weight:1000;letter-spacing:-1px}.forge-title-block p{margin:14px auto 0;color:#263365;font-size:20px;font-weight:650}
.forge-stat-row{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:22px}.forge-stat-pill{min-height:58px;min-width:190px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 20px;border-radius:999px;background:rgba(255,255,255,.9);border:1px solid var(--he-border);box-shadow:var(--he-soft-shadow);color:var(--he-purple);font-weight:950}.forge-stat-pill>img{width:32px;height:32px;object-fit:contain}.forge-stat-pill strong{color:var(--he-navy);font-size:21px}.forge-stat-pill em{display:inline-flex;gap:2px;font-style:normal}.forge-stat-pill em img{width:22px;height:22px;object-fit:contain}
.forge-game-shell{position:relative;z-index:1;display:grid;grid-template-columns:minmax(250px,300px) minmax(560px,1fr) minmax(300px,360px);gap:24px;max-width:1720px;margin:0 auto;padding:22px 28px 38px;align-items:start}.forge-left-col,.forge-right-col{display:flex;flex-direction:column;gap:22px}.forge-main-col{min-width:0}
.forge-panel{background:rgba(255,255,255,.94);border:1px solid var(--he-border);border-radius:24px;box-shadow:var(--he-soft-shadow);padding:24px}.forge-panel h2{display:flex;align-items:center;gap:10px;margin:0 0 16px;color:var(--he-purple);font-size:24px;font-weight:1000}.forge-panel p{margin:0;color:#2f3a6a;line-height:1.45;font-weight:600}
.forge-step{display:grid;grid-template-columns:44px 42px 1fr;gap:12px;align-items:center;padding:18px 0;border-top:1px solid #ece8ff}.forge-step:first-of-type{border-top:0}.forge-step b{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,var(--he-purple-2),var(--he-purple));color:white;font-size:19px;box-shadow:var(--he-soft-shadow)}.forge-step i{font-style:normal;font-size:28px;color:var(--he-purple);text-align:center}.forge-step p{font-size:15.5px}
.forge-hint-button,.forge-word-list-button{width:100%;min-height:58px;border:0;border-radius:20px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:18px;font-weight:1000;box-shadow:0 14px 28px rgba(99,56,245,.25);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.forge-hint-button{margin-top:18px;display:flex;align-items:center;justify-content:center;gap:18px}.forge-hint-button b{width:34px;height:34px;border-radius:50%;background:white;color:var(--he-purple);display:flex;align-items:center;justify-content:center}.forge-hint-button:disabled{opacity:.55;cursor:not-allowed}.forge-word-list-button{border:1px solid var(--he-border);background:white;color:var(--he-purple)}
.forge-board{position:relative;overflow:hidden;min-height:596px;padding:30px;border-radius:28px;background:rgba(255,255,255,.95);border:1px solid var(--he-border);box-shadow:var(--he-shadow);text-align:center}.forge-clue-head{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--he-purple);font-size:24px;font-weight:1000}.forge-clue-head img{width:36px;height:36px;object-fit:contain}.forge-clue-box{margin:18px auto 24px;padding:20px 22px;border:1px solid #e7e2ff;border-radius:22px;background:linear-gradient(180deg,#fbfaff,#fff);max-width:780px;text-align:left}.forge-clue-box p{margin:0;color:var(--he-navy);font-size:20px;line-height:1.45;font-weight:850}.forge-clue-box small{display:block;margin-top:10px;color:#445078;font-size:15px;line-height:1.4}
.forge-answer-slots{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;margin:0 auto 22px}.forge-answer-slot{width:60px;height:70px;border:2px dashed #c9bfff;border-radius:16px;background:linear-gradient(180deg,#fff,#fbfaff);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:var(--he-purple);cursor:pointer;box-shadow:0 8px 18px rgba(75,55,180,.06);transition:transform 180ms ease,border-color 180ms ease,box-shadow 180ms ease}.forge-answer-slot:hover,.forge-answer-slot:focus-visible{transform:translateY(-2px);border-color:var(--he-purple);outline:none}.forge-answer-slot.filled{border-style:solid;background:linear-gradient(180deg,#fff,#f8f5ff)}.forge-answer-slot.locked{border-color:#f0c85c;background:#fff8dc}.forge-answer-slot.wrong{border-color:#ff725c;background:#fff6f4}.forge-answer-slot span{font-size:32px;font-weight:1000;color:var(--he-navy);line-height:1}.forge-answer-slot small{font-size:10px;color:#7a80a5;font-weight:800}.forge-answer-slots.shake{animation:forge-shake 360ms ease}
.forge-tile-tools{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 auto 12px;padding:12px 16px;border-radius:18px;background:#f7f5ff;color:var(--he-purple);font-weight:850}.forge-tile-tools button{border:1px solid var(--he-border);border-radius:999px;background:white;color:var(--he-purple);padding:9px 14px;font-weight:900;cursor:pointer}.forge-tile-tools button:disabled{opacity:.55;cursor:not-allowed}
.forge-letter-bank{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;min-height:104px;margin:0 auto 16px;padding:18px;border:1px solid #eeeaff;border-radius:22px;background:#fbfaff}.forge-letter-tile{position:relative;width:66px;height:66px;border:0;border-radius:17px;background:linear-gradient(180deg,#fff,#dfefff);box-shadow:0 8px 0 #8bbceb,0 14px 22px rgba(75,55,180,.14);cursor:grab;transition:transform 180ms ease,box-shadow 180ms ease}.forge-letter-tile b{position:relative;z-index:1;color:var(--he-navy);font-size:34px;font-weight:1000}.forge-letter-tile.green{background:linear-gradient(180deg,#fff,#dcf6df);box-shadow:0 8px 0 #81c98c,0 14px 22px rgba(75,55,180,.14)}.forge-letter-tile.orange{background:linear-gradient(180deg,#fff,#ffe2bd);box-shadow:0 8px 0 #f3ad64,0 14px 22px rgba(75,55,180,.14)}.forge-letter-tile.purple{background:linear-gradient(180deg,#fff,#eadcff);box-shadow:0 8px 0 #b28bf4,0 14px 22px rgba(75,55,180,.14)}.forge-letter-tile.pink{background:linear-gradient(180deg,#fff,#ffddeb);box-shadow:0 8px 0 #ef8eb8,0 14px 22px rgba(75,55,180,.14)}.forge-letter-tile.gray{background:linear-gradient(180deg,#fff,#edf0f6);box-shadow:0 8px 0 #b6bdca,0 14px 22px rgba(75,55,180,.14)}.forge-letter-tile:hover,.forge-letter-tile:focus-visible,.forge-letter-tile.selected{transform:translateY(-4px);box-shadow:0 9px 0 #7d64dd,0 18px 34px rgba(99,56,245,.18);outline:2px solid rgba(99,56,245,.2)}
.forge-feedback{min-height:40px;display:flex;align-items:center;justify-content:center;border-radius:16px;margin:4px 0 16px;padding:8px 14px;font-weight:850}.forge-feedback.neutral{background:#f7f5ff;color:var(--he-purple)}.forge-feedback.success{background:#ecfdf3;color:#15803d}.forge-feedback.error{background:#fff0ee;color:#c8351b}
.forge-action-bar{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;padding:14px 18px;border-radius:22px;background:#fbfaff;border:1px solid #eeeaff}.forge-action-bar span{display:flex;align-items:center;gap:8px;color:var(--he-purple);font-size:18px;font-weight:900}.forge-action-bar span img{width:30px;height:30px}.forge-fill-track{height:16px;border-radius:999px;background:#e8e4ff;overflow:hidden}.forge-fill-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--he-purple),var(--he-purple-2));transition:width 220ms ease}.forge-button{min-height:64px;border:0;border-radius:22px;padding:0 30px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:21px;font-weight:1000;box-shadow:0 14px 30px rgba(99,56,245,.28);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:transform 180ms ease,box-shadow 180ms ease}.forge-button img{width:30px;height:30px;object-fit:contain}.forge-button:hover:not(:disabled),.forge-hint-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 18px 38px rgba(99,56,245,.36)}.forge-button:disabled{opacity:.55;cursor:not-allowed}
.forge-dragon-card{height:430px;padding:14px;border-radius:30px;background:white;border:1px solid var(--he-border);box-shadow:var(--he-shadow);overflow:hidden}.forge-dragon-card img{display:block;width:100%;height:100%;object-fit:cover;border-radius:22px}.armor-progress-icons{display:flex;gap:7px;justify-content:center;margin:18px 0}.armor-progress-icons img{width:42px;height:42px;object-fit:contain}.armor-progress-bar b{display:block;color:var(--he-purple);font-size:18px;margin-bottom:10px}.armor-progress-bar div{height:14px;border-radius:999px;background:#e8e4ff;overflow:hidden}.armor-progress-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--he-purple),var(--he-purple-2));border-radius:inherit}.armor-complete{display:block;margin-top:14px;color:#15803d;text-align:center}
.armor-preview-list{display:grid;gap:10px}.armor-preview-list div{display:grid;grid-template-columns:42px 1fr 28px;align-items:center;gap:12px;padding:9px 10px;border:1px solid #eeeaff;border-radius:15px;background:#fbfaff}.armor-preview-list img{width:42px;height:42px;object-fit:contain}.armor-preview-list span{font-weight:900;color:var(--he-purple)}.armor-preview-list b{color:#16a34a;font-size:22px}.armor-preview-list div:not(.done){opacity:.55}
.forge-effect{position:absolute;left:50%;top:48%;z-index:5;pointer-events:none;transform:translate(-50%,-50%);animation:forge-pop-fade 950ms ease forwards}.forge-spark-effect{width:min(48%,360px)}.forge-flash-effect{width:min(34%,260px);top:68%;left:72%}
.forge-word-list-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:rgba(10,12,50,.38);backdrop-filter:blur(4px)}.forge-word-list-modal{position:relative;width:min(820px,94vw);max-height:min(720px,86vh);overflow:auto;border-radius:28px;background:white;border:1px solid var(--he-border);box-shadow:0 30px 80px rgba(20,14,74,.28);padding:28px}.forge-word-list-modal h2{margin:0;color:var(--he-navy);font-size:30px}.forge-word-list-modal p{margin:8px 0 18px;color:#59617f}.forge-word-list-table{display:grid;gap:10px}.forge-word-list-table div{display:grid;grid-template-columns:150px 1fr;gap:8px 16px;padding:13px 14px;border:1px solid #eeeaff;border-radius:16px;background:#fbfaff}.forge-word-list-table b{color:var(--he-navy)}.forge-word-list-table span{color:#33406f;font-weight:750}.forge-word-list-table small,.forge-word-list-table em{grid-column:2;color:#59617f;font-style:normal}
@keyframes forge-pop-fade{0%{opacity:0;transform:translate(-50%,-50%) scale(.72)}22%{opacity:1;transform:translate(-50%,-50%) scale(1.02)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.12)}}@keyframes forge-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media(max-width:1280px){.forge-game-shell{grid-template-columns:280px minmax(0,1fr)}.forge-right-col{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.forge-dragon-card{height:360px}}
@media(max-width:860px){.forge-title-block{padding-top:26px}.forge-game-shell{grid-template-columns:1fr;padding:18px 14px}.forge-right-col{display:flex}.forge-action-bar{grid-template-columns:1fr;text-align:center}.forge-action-bar span{justify-content:center}.forge-dragon-card{height:300px}.forge-step{grid-template-columns:38px 34px 1fr}.forge-sparkle{display:none}.forge-answer-slot{width:50px;height:58px}.forge-letter-tile{width:56px;height:56px}.forge-letter-tile b{font-size:29px}.forge-word-list-table div{grid-template-columns:1fr}.forge-word-list-table small,.forge-word-list-table em{grid-column:1}}
.dragon-flight-page{position:relative;min-height:100vh;background:linear-gradient(180deg,#fff 0%,#fafdff 42%,#f5f3ff 100%);overflow:hidden;color:var(--he-navy)}
.dragon-flight-page:before{content:"";position:absolute;inset:72px 0 0;background-image:url("assets/assets_webp/game/effects/11_background_star_pattern.webp");background-size:560px auto;opacity:.1;pointer-events:none}.dragon-flight-page .he-game-topbar{position:relative;z-index:3}
.flight-sparkle{position:absolute;z-index:0;pointer-events:none;opacity:.52}.flight-sparkle.one{left:29%;top:124px;width:82px}.flight-sparkle.two{right:27%;top:126px;width:76px}
.flight-title-block{position:relative;z-index:1;text-align:center;padding:34px 24px 16px}.flight-title-block h1{margin:0;color:var(--he-navy);font-size:clamp(40px,4.8vw,66px);line-height:.98;font-weight:1000;letter-spacing:-1px}.flight-title-block p{margin:14px auto 0;max-width:960px;color:#263365;font-size:20px;font-weight:650}
.flight-stat-row{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:22px}.flight-stat-pill{min-height:58px;min-width:190px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:10px 20px;border-radius:999px;background:rgba(255,255,255,.9);border:1px solid var(--he-border);box-shadow:var(--he-soft-shadow);color:var(--he-purple);font-weight:950}.flight-stat-pill>img{width:32px;height:32px;object-fit:contain}.flight-stat-pill strong{color:var(--he-navy);font-size:21px}.flight-stat-pill em{display:inline-flex;gap:2px;font-style:normal}.flight-stat-pill em img{width:24px;height:24px;object-fit:contain}
.flight-game-shell{position:relative;z-index:1;display:grid;grid-template-columns:minmax(250px,300px) minmax(560px,1fr) minmax(300px,360px);gap:24px;max-width:1720px;margin:0 auto;padding:22px 28px 38px;align-items:start}.flight-left-col,.flight-right-col{display:flex;flex-direction:column;gap:22px}.flight-main-col{min-width:0}
.flight-panel{background:rgba(255,255,255,.94);border:1px solid var(--he-border);border-radius:24px;box-shadow:var(--he-soft-shadow);padding:24px}.flight-panel h2{display:flex;align-items:center;gap:10px;margin:0 0 16px;color:var(--he-purple);font-size:24px;font-weight:1000}.flight-panel p{margin:0;color:#2f3a6a;line-height:1.45;font-weight:600}
.flight-step{display:grid;grid-template-columns:44px 42px 1fr;gap:12px;align-items:center;padding:18px 0;border-top:1px solid #ece8ff}.flight-step:first-of-type{border-top:0}.flight-step b{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,var(--he-purple-2),var(--he-purple));color:white;font-size:19px;box-shadow:var(--he-soft-shadow)}.flight-step i{font-style:normal;font-size:28px;color:var(--he-purple);text-align:center}.flight-step p{font-size:15.5px}
.flight-hint-button,.flight-word-list-button{width:100%;min-height:58px;border:0;border-radius:20px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:18px;font-weight:1000;box-shadow:0 14px 28px rgba(99,56,245,.25);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.flight-hint-button{margin-top:18px;display:flex;align-items:center;justify-content:center;gap:18px}.flight-hint-button b{width:34px;height:34px;border-radius:50%;background:white;color:var(--he-purple);display:flex;align-items:center;justify-content:center}.flight-hint-button:disabled{opacity:.55;cursor:not-allowed}.flight-word-list-button{border:1px solid var(--he-border);background:white;color:var(--he-purple)}
.flight-board{position:relative;overflow:hidden;min-height:596px;padding:30px;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.97),rgba(246,251,255,.96));border:1px solid var(--he-border);box-shadow:var(--he-shadow);text-align:center}.flight-board:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 24%,rgba(97,180,255,.14),transparent 30%),radial-gradient(circle at 84% 20%,rgba(255,210,104,.18),transparent 30%);pointer-events:none}.flight-board>*{position:relative;z-index:1}
.flight-challenge-label{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--he-purple);font-size:24px;font-weight:1000}.flight-challenge-label img{width:34px;height:34px;object-fit:contain}.flight-sentence-card{margin:18px auto 22px;padding:22px;border:1px solid #e4e6ff;border-radius:24px;background:linear-gradient(180deg,#fff,#f5faff);box-shadow:inset 0 0 0 1px rgba(255,255,255,.8);max-width:780px}.flight-sentence-card p{margin:0;color:var(--he-navy);font-size:25px;line-height:1.45;font-weight:900}.flight-sentence-card small{display:block;margin-top:12px;color:#445078;font-size:15px;text-align:left}.flight-blank{display:inline-block;min-width:112px;margin:0 3px;border-bottom:4px dotted var(--he-purple);color:transparent}
.flight-choice-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:0 auto 20px;max-width:790px}.flight-answer-card{min-height:108px;border:1.5px solid #e0dcf7;border-radius:22px;background:white;display:grid;grid-template-columns:42px 42px 1fr;align-items:center;gap:14px;padding:16px 18px;text-align:left;color:var(--he-navy);box-shadow:0 10px 24px rgba(75,55,180,.08);cursor:pointer;transition:transform 180ms ease,border-color 180ms ease,box-shadow 180ms ease,background 180ms ease}.flight-answer-card:hover:not(:disabled),.flight-answer-card:focus-visible{transform:translateY(-3px);border-color:var(--he-purple);box-shadow:0 18px 36px rgba(99,56,245,.16);outline:none}.flight-answer-card span{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#f3efff;color:var(--he-purple);font-size:18px;font-weight:1000}.flight-answer-card img{width:38px;height:38px;object-fit:contain}.flight-answer-card b{font-size:22px;line-height:1.1}.flight-answer-card.selected{border-color:var(--he-purple);background:#fbfaff;box-shadow:0 18px 36px rgba(99,56,245,.16)}.flight-answer-card.wrong{border-color:#ff725c;background:#fff4f1;animation:flight-shake 360ms ease}.flight-answer-card.disabled-choice{opacity:.35;cursor:not-allowed;filter:grayscale(.5)}
.flight-path{position:relative;height:118px;margin:6px auto 14px;max-width:820px;display:flex;align-items:center;justify-content:space-between;padding:0 34px}.flight-path-line{position:absolute;left:9%;right:9%;top:51%;width:82%;height:26px;object-fit:fill;opacity:.58}.flight-progress-dragon{position:absolute;top:17px;width:58px;height:58px;object-fit:contain;transform:translateX(-50%);transition:left 320ms ease;z-index:2}.flight-start-cloud,.flight-finish-flag{width:44px;height:44px;object-fit:contain;z-index:1}.cloud-step{position:relative;z-index:1;width:66px;height:66px;display:grid;place-items:center}.cloud-step img{width:64px;height:64px;object-fit:contain}.cloud-step b{position:absolute;color:var(--he-purple);font-size:16px;font-weight:1000}.cloud-step.cleared{filter:saturate(1.2)}.cloud-step.active{transform:translateY(-4px)}
.flight-feedback{min-height:40px;display:flex;align-items:center;justify-content:center;border-radius:16px;margin:4px 0 16px;padding:8px 14px;font-weight:850}.flight-feedback.neutral{background:#f7f5ff;color:var(--he-purple)}.flight-feedback.success{background:#ecfdf3;color:#15803d}.flight-feedback.error{background:#fff0ee;color:#c8351b}
.send-soaring-button{width:min(620px,100%);min-height:66px;border:0;border-radius:999px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:24px;font-weight:1000;box-shadow:0 16px 34px rgba(99,56,245,.3);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:14px;transition:transform 180ms ease,box-shadow 180ms ease}.send-soaring-button img{width:42px;height:32px;object-fit:contain}.send-soaring-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 20px 42px rgba(99,56,245,.38)}.send-soaring-button:disabled{opacity:.55;cursor:not-allowed}
.flight-dragon-card{height:430px;padding:14px;border-radius:30px;background:white;border:1px solid var(--he-border);box-shadow:var(--he-shadow);overflow:hidden}.flight-dragon-card img{display:block;width:100%;height:100%;object-fit:cover;border-radius:22px}.flight-progress-clouds{display:flex;gap:5px;justify-content:center;margin:18px 0}.flight-progress-clouds img{width:42px;height:42px;object-fit:contain}.flight-progress-bar b{display:block;color:var(--he-purple);font-size:18px;margin-bottom:10px}.flight-progress-bar div{height:14px;border-radius:999px;background:#e8e4ff;overflow:hidden}.flight-progress-bar i{display:block;height:100%;background:linear-gradient(90deg,#4cb8ff,var(--he-purple));border-radius:inherit}.flight-complete{display:block;margin-top:14px;color:#15803d;text-align:center;line-height:1.35}.flight-reward-card{display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:center;padding:20px 24px;border-radius:24px;background:linear-gradient(180deg,#fff,#f8f5ff);border:1px solid var(--he-border);box-shadow:var(--he-soft-shadow);font-weight:750;color:#273568}.flight-reward-card img{width:50px;height:50px;object-fit:contain}
.flight-effect{position:absolute;left:50%;top:45%;z-index:5;pointer-events:none;transform:translate(-50%,-50%);animation:flight-pop-fade 950ms ease forwards}.sunshine-effect{width:min(48%,360px)}.storm-effect{width:min(38%,280px);top:35%}
.flight-word-list-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:rgba(10,12,50,.38);backdrop-filter:blur(4px)}.flight-word-list-modal{position:relative;width:min(840px,94vw);max-height:min(720px,86vh);overflow:auto;border-radius:28px;background:white;border:1px solid var(--he-border);box-shadow:0 30px 80px rgba(20,14,74,.28);padding:28px}.flight-word-list-modal h2{margin:0;color:var(--he-navy);font-size:30px}.flight-word-list-modal p{margin:8px 0 18px;color:#59617f}.flight-word-list-table{display:grid;gap:10px}.flight-word-list-table div{display:grid;grid-template-columns:140px 1fr;gap:8px 16px;padding:13px 14px;border:1px solid #eeeaff;border-radius:16px;background:#fbfaff}.flight-word-list-table b{color:var(--he-navy)}.flight-word-list-table span{color:#33406f;font-weight:750}.flight-word-list-table small,.flight-word-list-table em{grid-column:2;color:#59617f;font-style:normal}
@keyframes flight-pop-fade{0%{opacity:0;transform:translate(-50%,-50%) scale(.72)}22%{opacity:1;transform:translate(-50%,-50%) scale(1.02)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.12)}}@keyframes flight-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
@media(max-width:1280px){.flight-game-shell{grid-template-columns:280px minmax(0,1fr)}.flight-right-col{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.flight-reward-card{grid-column:1/-1}.flight-dragon-card{height:360px}}
@media(max-width:860px){.flight-title-block{padding-top:26px}.flight-game-shell{grid-template-columns:1fr;padding:18px 14px}.flight-right-col{display:flex}.flight-choice-grid{grid-template-columns:1fr}.flight-dragon-card{height:300px}.flight-step{grid-template-columns:38px 34px 1fr}.flight-sparkle{display:none}.flight-sentence-card p{font-size:20px}.flight-path{padding:0 8px}.cloud-step{width:52px}.cloud-step img{width:52px}.flight-progress-dragon{width:48px;height:48px}.flight-word-list-table div{grid-template-columns:1fr}.flight-word-list-table small,.flight-word-list-table em{grid-column:1}}

.hatchery-match-page{position:relative;min-height:100vh;background:linear-gradient(180deg,#fff 0%,#fbfff9 40%,#f6f3ff 100%);overflow:hidden;color:var(--he-navy)}
.hatchery-match-page:before{content:"";position:absolute;inset:72px 0 0;background-image:url("assets/assets_webp/game/effects/11_background_star_pattern.webp");background-size:560px auto;opacity:.1;pointer-events:none}.hatchery-match-page .he-game-topbar{position:relative;z-index:3}
.hatchery-sparkle{position:absolute;z-index:1;pointer-events:none;opacity:.45}.hatchery-sparkle.one{top:118px;left:27%;width:90px}.hatchery-sparkle.two{top:150px;right:7%;width:105px}
.hatchery-title-block{position:relative;z-index:2;text-align:center;padding:34px 20px 18px}.hatchery-title-block h1{margin:0;color:var(--he-navy);font-size:clamp(42px,5vw,72px);line-height:.96;font-weight:1000;letter-spacing:0}.hatchery-title-block p{margin:14px auto 0;max-width:840px;color:#253266;font-size:21px;font-weight:650}
.hatchery-stat-row{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:24px}.hatchery-stat-pill{min-height:58px;display:inline-flex;align-items:center;gap:12px;border:1px solid var(--he-border);border-radius:999px;background:rgba(255,255,255,.9);box-shadow:var(--he-soft-shadow);padding:9px 24px;color:var(--he-purple);font-size:18px;font-weight:900}.hatchery-stat-pill>img{width:36px;height:36px;object-fit:contain}.hatchery-stat-pill strong{color:var(--he-navy);font-size:22px}.hatchery-stat-pill em{display:flex;gap:4px}.hatchery-stat-pill em img{width:24px;height:24px;object-fit:contain}
.hatchery-game-shell{position:relative;z-index:2;display:grid;grid-template-columns:300px minmax(680px,1fr)360px;gap:32px;max-width:1720px;margin:0 auto;padding:22px 28px 44px}.hatchery-left-col,.hatchery-right-col{display:grid;gap:20px;align-content:start}.hatchery-panel,.hatchery-board,.hatchery-dragon-card{background:rgba(255,255,255,.94);border:1px solid var(--he-border);border-radius:28px;box-shadow:var(--he-shadow)}.hatchery-panel{padding:24px}.hatchery-panel h2{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:var(--he-purple);font-size:24px}.hatchery-panel p{margin:0 0 16px;color:#33406f;line-height:1.45;font-weight:600}
.hatchery-step{display:grid;grid-template-columns:42px 42px 1fr;align-items:center;gap:14px;padding:18px 0;border-top:1px solid #eeeaff}.hatchery-step b{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;display:grid;place-items:center;box-shadow:0 8px 16px rgba(99,56,245,.24)}.hatchery-step i{font-size:28px;font-style:normal;color:var(--he-purple)}.hatchery-step p{margin:0;color:#26336a;font-size:16px}
.hatchery-hint-button,.hatchery-word-list-button{width:100%;min-height:58px;border:0;border-radius:20px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:18px;font-weight:1000;box-shadow:0 14px 28px rgba(99,56,245,.25);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.hatchery-hint-button{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:18px}.hatchery-hint-button b{width:34px;height:34px;border-radius:50%;background:white;color:var(--he-purple);display:grid;place-items:center}.hatchery-hint-button:disabled{opacity:.55;cursor:not-allowed}.hatchery-word-list-button{border:1px solid var(--he-border);background:white;color:var(--he-purple)}
.hatchery-hint-button:hover:not(:disabled),.hatchery-word-list-button:hover,.hatchery-ghost-button:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(99,56,245,.26)}
.hatchery-board{position:relative;padding:22px;overflow:hidden}.hatchery-board-title{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 18px;padding:13px 18px;border-radius:18px;background:#f7f4ff;border:1px solid #e7e1ff;color:var(--he-purple)}.hatchery-board-title b{font-size:24px}.hatchery-board-title span{color:#4b557d;font-weight:750}
.hatchery-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.hatchery-egg-card{position:relative;min-height:154px;border:0;background:transparent;perspective:900px;cursor:pointer}.hatchery-egg-card:disabled{cursor:default}.egg-card-inner{position:absolute;inset:0;transition:transform 420ms ease;transform-style:preserve-3d}.hatchery-egg-card.open .egg-card-inner{transform:rotateY(180deg)}.egg-card-front,.egg-card-back{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;backface-visibility:hidden;border-radius:24px;border:1px solid #ded7ff;background:linear-gradient(180deg,#fff,#f7f4ff);box-shadow:0 14px 28px rgba(75,55,180,.12);overflow:hidden}.egg-card-front img{width:84px;height:84px;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(99,56,245,.18))}.egg-card-front:after{content:"?";position:absolute;right:16px;top:10px;color:#8a7cff;font-size:28px;font-weight:1000;opacity:.5}.egg-card-back{transform:rotateY(180deg);gap:8px;padding:14px;text-align:center}.egg-card-back small{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--he-purple);font-weight:1000}.egg-card-back b{color:var(--he-navy);font-size:clamp(13px,1.2vw,18px);line-height:1.2;max-height:78px;overflow:hidden}.egg-card-back img{width:46px;height:46px;object-fit:contain}.hatchery-egg-card.matched .egg-card-back{border-color:rgba(34,197,94,.45);background:linear-gradient(180deg,#fff,#effff3);box-shadow:0 0 0 3px rgba(34,197,94,.16),0 14px 28px rgba(75,55,180,.1)}.hatchery-egg-card.wrong .egg-card-back{border-color:rgba(255,75,43,.6);background:#fff5f2;animation:hatchery-shake 360ms ease}.hatchery-egg-card.hinted .egg-card-front,.hatchery-egg-card.hinted .egg-card-back{box-shadow:0 0 0 4px rgba(255,181,46,.35),0 18px 34px rgba(255,181,46,.2);border-color:#ffcf57}
.hatchery-feedback{min-height:44px;margin-top:16px;display:grid;place-items:center;border-radius:18px;background:#f7f4ff;border:1px solid #e7e1ff;color:#4f46e5;font-weight:900;text-align:center;padding:10px 14px}.hatchery-feedback.success{background:#effff3;color:#16803b;border-color:#bbf7d0}.hatchery-feedback.error{background:#fff3f1;color:#c2410c;border-color:#fed7aa}.hatchery-feedback.hint{background:#fff9e8;color:#8a5a00;border-color:#ffe3a3}
.hatchery-progress-strip{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;margin-top:16px;padding:14px;border-radius:20px;background:#fbfaff;border:1px solid #eeeaff}.hatchery-progress-strip span{display:flex;align-items:center;gap:8px;color:var(--he-purple);font-weight:1000}.hatchery-progress-strip img{width:32px;height:32px;object-fit:contain}.hatchery-progress-strip div,.hatchery-progress-bar{height:13px;border-radius:999px;background:#ebe7ff;overflow:hidden}.hatchery-progress-strip i,.hatchery-progress-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#7c4dff,#22c55e)}.hatchery-ghost-button{border:1px solid var(--he-border);border-radius:999px;background:white;color:var(--he-purple);font-weight:950;padding:12px 18px;cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}
.hatchery-dragon-card{height:300px;overflow:hidden;padding:0}.hatchery-dragon-card img{width:100%;height:100%;object-fit:cover;display:block}.hatchling-collection{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.hatchling-collection span{min-height:108px;border:1px solid #eeeaff;border-radius:18px;background:#fbfaff;display:grid;place-items:center;padding:10px;text-align:center;color:#7b7f99;font-weight:900}.hatchling-collection span.filled{background:#fff;border-color:#d9d2ff;color:var(--he-purple);box-shadow:0 10px 22px rgba(75,55,180,.08)}.hatchling-collection img{width:58px;height:58px;object-fit:contain}.hatchling-collection b{font-size:13px}.nursery-goal-panel>b{display:block;color:var(--he-navy);font-size:22px;margin-bottom:10px}.hatchery-progress-bar{height:15px}
.hatchery-effect{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:240px;height:240px;object-fit:contain;z-index:5;pointer-events:none;animation:hatchery-pop-fade 900ms ease forwards}.hatchery-effect.wrong-effect{width:180px;height:180px}
.hatchery-word-list-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:rgba(10,12,50,.38);backdrop-filter:blur(4px)}.hatchery-word-list-modal{position:relative;width:min(860px,94vw);max-height:min(720px,86vh);overflow:auto;border-radius:28px;background:white;border:1px solid var(--he-border);box-shadow:0 30px 80px rgba(20,14,74,.28);padding:28px}.hatchery-word-list-modal h2{margin:0;color:var(--he-navy);font-size:30px}.hatchery-word-list-modal p{margin:8px 0 18px;color:#59617f}.hatchery-word-list-table{display:grid;gap:10px}.hatchery-word-list-table div{display:grid;grid-template-columns:140px 1fr;gap:8px 16px;padding:13px 14px;border:1px solid #eeeaff;border-radius:16px;background:#fbfaff}.hatchery-word-list-table b{color:var(--he-navy)}.hatchery-word-list-table span{color:#33406f;font-weight:750}.hatchery-word-list-table small,.hatchery-word-list-table em{grid-column:2;color:#59617f;font-style:normal}
@keyframes hatchery-shake{0%,100%{transform:translateX(0) rotateY(180deg)}25%{transform:translateX(-6px) rotateY(180deg)}75%{transform:translateX(6px) rotateY(180deg)}}@keyframes hatchery-pop-fade{0%{transform:translate(-50%,-50%) scale(.75);opacity:0}22%{opacity:1}100%{transform:translate(-50%,-50%) scale(1.2);opacity:0}}
@media(max-width:1180px){.hatchery-game-shell{grid-template-columns:280px minmax(0,1fr);}.hatchery-right-col{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.hatchery-dragon-card{height:240px}.hatchling-collection{grid-template-columns:repeat(3,1fr)}}
@media(max-width:860px){.hatchery-title-block{padding-top:26px}.hatchery-game-shell{grid-template-columns:1fr;padding:18px 14px}.hatchery-right-col{grid-template-columns:1fr}.hatchery-card-grid{grid-template-columns:repeat(3,1fr)}.hatchery-egg-card{min-height:142px}.hatchery-sparkle{display:none}.hatchery-progress-strip{grid-template-columns:1fr}.hatchery-step{grid-template-columns:38px 34px 1fr}.hatchery-word-list-table div{grid-template-columns:1fr}.hatchery-word-list-table small,.hatchery-word-list-table em{grid-column:1}}
@media(max-width:560px){.hatchery-card-grid{grid-template-columns:repeat(2,1fr);gap:12px}.hatchery-egg-card{min-height:132px}.egg-card-back b{font-size:13px}.hatchery-title-block h1{font-size:38px}.hatchery-stat-pill{width:100%;justify-content:center}.hatchery-board{padding:14px}.hatchery-board-title{display:grid;text-align:center}}

.term-definition-page{position:relative;min-height:100vh;background:linear-gradient(180deg,#fff 0%,#fbfaff 42%,#f7f4ff 100%);overflow:hidden;color:var(--he-navy)}
.term-definition-page:before{content:"";position:absolute;inset:72px 0 0;background-image:url("assets/assets_webp/game/effects/11_background_star_pattern.webp");background-size:560px auto;opacity:.1;pointer-events:none}.term-definition-page .he-game-topbar{position:relative;z-index:3}
.term-sparkle{position:absolute;z-index:1;pointer-events:none;opacity:.48}.term-sparkle.one{top:122px;left:28%;width:92px}.term-sparkle.two{top:156px;right:8%;width:112px}
.term-title-block{position:relative;z-index:2;text-align:center;padding:34px 20px 18px}.term-title-block h1{margin:0;color:var(--he-navy);font-size:clamp(40px,4.7vw,68px);line-height:.98;font-weight:1000;letter-spacing:0}.term-title-block p{margin:14px auto 0;max-width:920px;color:#253266;font-size:21px;font-weight:650}
.term-stat-row{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:24px}.term-stat-pill{min-height:58px;display:inline-flex;align-items:center;gap:12px;border:1px solid var(--he-border);border-radius:999px;background:rgba(255,255,255,.92);box-shadow:var(--he-soft-shadow);padding:9px 24px;color:var(--he-purple);font-size:18px;font-weight:900}.term-stat-pill>img{width:36px;height:36px;object-fit:contain}.term-stat-pill strong{color:var(--he-navy);font-size:22px}.term-stat-pill em{display:flex;gap:4px}.term-stat-pill em img{width:22px;height:22px;object-fit:contain}
.term-game-shell{position:relative;z-index:2;display:grid;grid-template-columns:300px minmax(720px,1fr)360px;gap:32px;max-width:1720px;margin:0 auto;padding:22px 28px 44px}.term-left-col,.term-right-col{display:grid;gap:20px;align-content:start}.term-panel,.term-board,.term-dragon-card{background:rgba(255,255,255,.94);border:1px solid var(--he-border);border-radius:28px;box-shadow:var(--he-shadow)}.term-panel{padding:24px}.term-panel h2{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:var(--he-purple);font-size:24px}.term-panel p{margin:0 0 16px;color:#33406f;line-height:1.45;font-weight:600}
.term-step{display:grid;grid-template-columns:42px 42px 1fr;align-items:center;gap:14px;padding:18px 0;border-top:1px solid #eeeaff}.term-step b{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;display:grid;place-items:center;box-shadow:0 8px 16px rgba(99,56,245,.24)}.term-step i{font-size:27px;font-style:normal;color:var(--he-purple)}.term-step p{margin:0;color:#26336a;font-size:16px}
.term-hint-button,.term-word-list-button{width:100%;min-height:58px;border:0;border-radius:20px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:18px;font-weight:1000;box-shadow:0 14px 28px rgba(99,56,245,.25);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.term-hint-button{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:18px}.term-hint-button b{width:34px;height:34px;border-radius:50%;background:white;color:var(--he-purple);display:grid;place-items:center}.term-hint-button:disabled{opacity:.55;cursor:not-allowed}.term-word-list-button{border:1px solid var(--he-border);background:white;color:var(--he-purple)}
.term-hint-button:hover:not(:disabled),.term-word-list-button:hover{transform:translateY(-2px);box-shadow:0 18px 36px rgba(99,56,245,.26)}
.term-board{position:relative;min-height:650px;padding:24px;overflow:hidden}.term-board-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0 0 18px;padding:13px 18px;border-radius:18px;background:#f7f4ff;border:1px solid #e7e1ff;color:var(--he-purple)}.term-board-head b{font-size:24px}.term-board-head span{color:#4b557d;font-weight:750}.term-columns{position:relative;z-index:2;display:grid;grid-template-columns:minmax(230px,1fr) minmax(300px,1.25fr);gap:90px}.term-column,.definition-column{display:grid;gap:13px;align-content:start}.term-column h2,.definition-column h2{text-align:center;margin:0 0 4px;color:var(--he-purple);font-size:23px}
.term-card,.definition-card{position:relative;min-height:76px;border:1px solid #ded7ff;border-radius:20px;background:rgba(255,255,255,.96);box-shadow:0 10px 24px rgba(75,55,180,.1);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease,border-color 180ms ease,background 180ms ease;color:var(--he-navy)}.term-card{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 12px 14px 20px;background-image:linear-gradient(180deg,rgba(255,255,255,.96),rgba(250,248,255,.96))}.definition-card{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:12px;padding:13px 18px 13px 10px;text-align:left;background-image:linear-gradient(180deg,rgba(255,255,255,.98),rgba(250,252,255,.96))}.term-card:hover:not(:disabled),.definition-card:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 16px 32px rgba(99,56,245,.16);border-color:rgba(99,56,245,.42)}.term-card b{font-size:21px;line-height:1.1}.term-card small{display:block;margin-top:3px;color:#68708e;font-weight:700}.definition-card span{font-size:15px;line-height:1.3;font-weight:750;color:#243060}.connection-circle{width:30px;height:30px;object-fit:contain;filter:drop-shadow(0 4px 8px rgba(99,56,245,.12));flex:0 0 auto}.term-card.selected{border-color:#7c4dff;box-shadow:0 0 0 4px rgba(124,77,255,.16),0 18px 34px rgba(99,56,245,.18);background:#fbf8ff}.definition-card.targetable{border-color:#cfc6ff}.term-card.matched,.definition-card.matched{background:#f1fff5;border-color:rgba(34,197,94,.44);box-shadow:0 0 0 3px rgba(34,197,94,.12),0 12px 26px rgba(75,55,180,.08)}.term-card.wrong,.definition-card.wrong{background:#fff4f1;border-color:rgba(255,75,43,.58);animation:term-shake 360ms ease}.term-card.hinted,.definition-card.hinted{border-color:#ffcf57;box-shadow:0 0 0 4px rgba(255,181,46,.24),0 16px 30px rgba(255,181,46,.14)}
.term-connection-svg{position:absolute;z-index:1;inset:88px 18px 88px;pointer-events:none}.term-connection-path{stroke:url(#termPurpleLine);stroke-width:7;fill:none;stroke-linecap:round;filter:url(#termGlow);stroke-dasharray:900;stroke-dashoffset:900;animation:term-line-draw 600ms ease forwards}.term-preview-path{stroke:#b8a9ff;stroke-width:4;fill:none;stroke-linecap:round;stroke-dasharray:12 12;opacity:.55}
.term-feedback{position:relative;z-index:3;min-height:44px;margin-top:18px;display:grid;place-items:center;border-radius:18px;background:#f7f4ff;border:1px solid #e7e1ff;color:#4f46e5;font-weight:900;text-align:center;padding:10px 14px}.term-feedback.success{background:#effff3;color:#16803b;border-color:#bbf7d0}.term-feedback.error{background:#fff3f1;color:#c2410c;border-color:#fed7aa}.term-feedback.hint{background:#fff9e8;color:#8a5a00;border-color:#ffe3a3}
.term-effect{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:220px;height:220px;object-fit:contain;z-index:5;pointer-events:none;animation:term-pop-fade 900ms ease forwards}.term-effect.wrong-effect{width:260px;height:100px;opacity:.82;filter:hue-rotate(115deg) saturate(1.4)}
.term-dragon-card{height:360px;overflow:hidden;padding:0}.term-dragon-card img{width:100%;height:100%;object-fit:cover;display:block}.treasure-progress-card{text-align:center}.treasure-chest-img{width:118px;height:118px;object-fit:contain;margin:4px auto 8px;display:block}.treasure-progress-card>b{display:block;color:var(--he-navy);font-size:22px;margin-bottom:10px}.treasure-progress-card strong{display:block;margin-top:12px;color:#9a6400;font-size:18px}.term-progress-bar{height:15px;border-radius:999px;background:#ebe7ff;overflow:hidden}.term-progress-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#7c4dff,#ffb52e)}.term-reward-card{display:flex;align-items:center;gap:16px;padding:20px;border-radius:24px;border:1px solid #eeeaff;background:rgba(255,255,255,.9);box-shadow:var(--he-soft-shadow);color:#33406f;font-weight:800}.term-reward-card img{width:58px;height:58px;object-fit:contain}
.term-word-list-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:rgba(10,12,50,.38);backdrop-filter:blur(4px)}.term-word-list-modal{position:relative;width:min(860px,94vw);max-height:min(720px,86vh);overflow:auto;border-radius:28px;background:white;border:1px solid var(--he-border);box-shadow:0 30px 80px rgba(20,14,74,.28);padding:28px}.term-word-list-modal h2{margin:0;color:var(--he-navy);font-size:30px}.term-word-list-modal p{margin:8px 0 18px;color:#59617f}.term-word-list-table{display:grid;gap:10px}.term-word-list-table div{display:grid;grid-template-columns:140px 1fr;gap:8px 16px;padding:13px 14px;border:1px solid #eeeaff;border-radius:16px;background:#fbfaff}.term-word-list-table b{color:var(--he-navy)}.term-word-list-table span{color:#33406f;font-weight:750}.term-word-list-table small,.term-word-list-table em{grid-column:2;color:#59617f;font-style:normal}
@keyframes term-line-draw{to{stroke-dashoffset:0}}@keyframes term-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}@keyframes term-pop-fade{0%{transform:translate(-50%,-50%) scale(.75);opacity:0}22%{opacity:1}100%{transform:translate(-50%,-50%) scale(1.18);opacity:0}}
@media(max-width:1180px){.term-game-shell{grid-template-columns:280px minmax(0,1fr)}.term-right-col{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.term-dragon-card{height:260px}.term-columns{gap:56px}}
@media(max-width:860px){.term-title-block{padding-top:26px}.term-game-shell{grid-template-columns:1fr;padding:18px 14px}.term-right-col{grid-template-columns:1fr}.term-columns{grid-template-columns:1fr;gap:22px}.term-connection-svg{display:none}.term-board{min-height:auto;padding:16px}.term-card,.definition-card{min-height:68px}.term-card .term-circle{order:-1}.term-card{justify-content:flex-start}.term-sparkle{display:none}.term-step{grid-template-columns:38px 34px 1fr}.term-word-list-table div{grid-template-columns:1fr}.term-word-list-table small,.term-word-list-table em{grid-column:1}}
@media(max-width:560px){.term-title-block h1{font-size:36px}.term-stat-pill{width:100%;justify-content:center}.term-board-head{display:grid;text-align:center}.term-card b{font-size:18px}.definition-card span{font-size:14px}}

.dragons-whisper-page{position:relative;min-height:100vh;background:linear-gradient(180deg,#fff 0%,#fffaf3 36%,#f7f3ff 100%);overflow:hidden;color:var(--he-navy)}
.dragons-whisper-page:before{content:"";position:absolute;inset:72px 0 0;background-image:url("assets/assets_webp/game/effects/11_background_star_pattern.webp");background-size:560px auto;opacity:.11;pointer-events:none}.dragons-whisper-page .he-game-topbar{position:relative;z-index:3}
.whisper-sparkle{position:absolute;z-index:1;pointer-events:none;opacity:.5}.whisper-sparkle.one{top:120px;left:28%;width:105px}.whisper-sparkle.two{top:150px;right:8%;width:100px}
.whisper-title-block{position:relative;z-index:2;text-align:center;padding:34px 20px 18px}.whisper-title-block h1{margin:0;color:var(--he-navy);font-size:clamp(42px,5vw,70px);line-height:.98;font-weight:1000;letter-spacing:0}.whisper-title-block p{margin:14px auto 0;max-width:920px;color:#253266;font-size:21px;font-weight:650}
.whisper-stat-row{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin-top:24px}.whisper-stat-pill{min-height:58px;display:inline-flex;align-items:center;gap:12px;border:1px solid var(--he-border);border-radius:999px;background:rgba(255,255,255,.92);box-shadow:var(--he-soft-shadow);padding:9px 24px;color:var(--he-purple);font-size:18px;font-weight:900}.whisper-stat-pill>img{width:36px;height:36px;object-fit:contain}.whisper-stat-pill strong{color:var(--he-navy);font-size:22px}
.whisper-game-shell{position:relative;z-index:2;display:grid;grid-template-columns:300px minmax(720px,1fr)360px;gap:32px;max-width:1720px;margin:0 auto;padding:22px 28px 44px}.whisper-left-col,.whisper-right-col{display:grid;gap:20px;align-content:start}.whisper-panel,.whisper-board,.whisper-dragon-card{background:rgba(255,255,255,.94);border:1px solid var(--he-border);border-radius:28px;box-shadow:var(--he-shadow)}.whisper-panel{padding:24px}.whisper-panel h2{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:var(--he-purple);font-size:24px}.whisper-panel p{margin:0 0 16px;color:#33406f;line-height:1.45;font-weight:600}
.whisper-step{display:grid;grid-template-columns:42px 42px 1fr;align-items:center;gap:14px;padding:18px 0;border-top:1px solid #eeeaff}.whisper-step b{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;display:grid;place-items:center;box-shadow:0 8px 16px rgba(99,56,245,.24)}.whisper-step i{font-size:27px;font-style:normal;color:var(--he-purple)}.whisper-step p{margin:0;color:#26336a;font-size:16px}
.whisper-hint-button,.whisper-word-list-button{width:100%;min-height:58px;border:0;border-radius:20px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:18px;font-weight:1000;box-shadow:0 14px 28px rgba(99,56,245,.25);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.whisper-hint-button{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:18px}.whisper-hint-button b{width:34px;height:34px;border-radius:50%;background:white;color:var(--he-purple);display:grid;place-items:center}.whisper-hint-button:disabled{opacity:.55;cursor:not-allowed}.whisper-word-list-button{border:1px solid var(--he-border);background:white;color:var(--he-purple)}.whisper-hint-button:hover:not(:disabled),.whisper-word-list-button:hover,.listen-again-button:hover,.translate-whisper-button:hover,.send-whisper-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 18px 36px rgba(99,56,245,.26)}
.whisper-board{position:relative;min-height:680px;padding:28px;overflow:hidden;text-align:center}.sound-wave-bg{position:absolute;left:50%;top:130px;transform:translateX(-50%);width:min(760px,92%);height:260px;object-fit:cover;opacity:.23;pointer-events:none}.speaker-button{position:relative;z-index:2;width:154px;height:154px;border:0;border-radius:50%;background:radial-gradient(circle,#fff 0%,#f4edff 58%,#e3d9ff 100%);display:grid;place-items:center;margin:20px auto 8px;cursor:pointer;box-shadow:0 18px 46px rgba(99,56,245,.25),0 0 0 10px rgba(255,255,255,.75);transition:transform 180ms ease,box-shadow 180ms ease}.speaker-button img{width:142px;height:142px;object-fit:contain}.speaker-button:hover,.speaker-button.speaking{transform:translateY(-3px) scale(1.02);box-shadow:0 22px 60px rgba(99,56,245,.34),0 0 0 14px rgba(255,220,129,.38)}.speaker-button.speaking:after{content:"";position:absolute;inset:-16px;border-radius:50%;border:3px solid rgba(255,181,46,.55);animation:whisper-pulse 900ms ease infinite}.speaker-caption{position:relative;z-index:2;margin:0 0 22px;color:var(--he-purple);font-weight:1000;font-size:18px}
.whisper-clue-card,.whisper-translation{position:relative;z-index:2;margin:0 auto 16px;max-width:760px;border:1px solid #e6defe;border-radius:22px;background:rgba(255,255,255,.9);box-shadow:0 10px 24px rgba(75,55,180,.08);padding:18px 22px;text-align:left}.whisper-clue-card b,.whisper-translation>b{display:block;color:var(--he-purple);font-size:19px;margin-bottom:7px}.whisper-clue-card span,.whisper-translation span{display:block;color:#26336a;font-weight:750;line-height:1.45}.whisper-translation{background:#fffaf0;border-color:#ffe2a5}.whisper-translation span+span{margin-top:6px}.whisper-input-area{position:relative;z-index:2;display:block;margin:14px auto 16px}.whisper-hidden-input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}.whisper-letter-boxes{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;max-width:850px;margin:0 auto;cursor:text}.whisper-letter-box{width:60px;height:60px;background-size:100% 100%;background-repeat:no-repeat;display:grid;place-items:center;color:var(--he-navy);font-size:30px;font-weight:1000;text-transform:uppercase;filter:drop-shadow(0 8px 12px rgba(75,55,180,.1))}.whisper-letter-box.filled{color:#10175f}.whisper-letter-box.hinted{color:#7a4a00}.whisper-letter-boxes.shake{animation:whisper-shake 360ms ease}
.whisper-actions{position:relative;z-index:2;display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin:10px 0 14px}.listen-again-button,.translate-whisper-button{border:1px solid var(--he-border);border-radius:999px;background:white;color:var(--he-purple);font-weight:1000;font-size:16px;padding:12px 20px;display:inline-flex;align-items:center;gap:9px;cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.listen-again-button img,.translate-whisper-button img{width:28px;height:28px;object-fit:contain}.whisper-feedback{position:relative;z-index:2;min-height:44px;margin:0 auto 14px;max-width:760px;display:grid;place-items:center;border-radius:18px;background:#f7f4ff;border:1px solid #e7e1ff;color:#4f46e5;font-weight:900;text-align:center;padding:10px 14px}.whisper-feedback.success{background:#fff8df;color:#8a5a00;border-color:#ffd978}.whisper-feedback.error{background:#fff3f1;color:#c2410c;border-color:#fed7aa}.whisper-feedback.hint{background:#fff9e8;color:#8a5a00;border-color:#ffe3a3}.send-whisper-button{position:relative;z-index:2;border:0;border-radius:999px;min-width:300px;padding:17px 28px;background:linear-gradient(135deg,#7c4dff,#4f2de6);color:white;font-size:21px;font-weight:1000;box-shadow:0 16px 32px rgba(99,56,245,.3);cursor:pointer;transition:transform 180ms ease,box-shadow 180ms ease}.send-whisper-button:disabled{opacity:.5;cursor:not-allowed}
.whisper-effect{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:280px;height:200px;object-fit:contain;z-index:5;pointer-events:none;animation:whisper-pop-fade 1000ms ease forwards}.whisper-effect.wrong-effect{width:190px;height:150px}
.whisper-dragon-card{height:370px;overflow:hidden;padding:0}.whisper-dragon-card img{width:100%;height:100%;object-fit:cover;display:block}.whisper-reward-path{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:8px 0 14px;position:relative}.whisper-reward-path:before{content:"";position:absolute;left:28px;right:28px;top:31px;height:6px;border-radius:999px;background:#e7e2ff}.whisper-reward-path span{position:relative;z-index:1;display:grid;place-items:center;gap:4px;color:#8b87aa;font-weight:1000}.whisper-reward-path img{width:58px;height:58px;object-fit:contain;border-radius:18px;background:#f5f1ff;padding:8px;border:1px solid #eeeaff}.whisper-reward-path span.done img{background:#fff8df;border-color:#ffd978;box-shadow:0 0 0 4px rgba(255,181,46,.16)}.whisper-path-card>b{display:block;color:var(--he-navy);font-size:22px;margin-bottom:10px}.whisper-progress-bar{height:15px;border-radius:999px;background:#ebe7ff;overflow:hidden}.whisper-progress-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#7c4dff,#ffb52e)}.whisper-reward-card{display:flex;align-items:center;gap:16px;padding:20px;border-radius:24px;border:1px solid #eeeaff;background:rgba(255,255,255,.9);box-shadow:var(--he-soft-shadow);color:#33406f;font-weight:800}.whisper-reward-card img{width:70px;height:70px;object-fit:contain}.whisper-reward-card b{display:block;color:var(--he-purple);font-size:19px}.whisper-reward-card span{display:block;color:var(--he-navy);font-weight:1000}.whisper-reward-card p{margin:4px 0 0;color:#59617f;font-size:14px}
.whisper-word-list-backdrop{position:fixed;inset:0;z-index:50;display:grid;place-items:center;padding:24px;background:rgba(10,12,50,.38);backdrop-filter:blur(4px)}.whisper-word-list-modal{position:relative;width:min(860px,94vw);max-height:min(720px,86vh);overflow:auto;border-radius:28px;background:white;border:1px solid var(--he-border);box-shadow:0 30px 80px rgba(20,14,74,.28);padding:28px}.whisper-word-list-modal h2{margin:0;color:var(--he-navy);font-size:30px}.whisper-word-list-modal p{margin:8px 0 18px;color:#59617f}.whisper-word-list-table{display:grid;gap:10px}.whisper-word-list-table div{display:grid;grid-template-columns:140px 1fr;gap:8px 16px;padding:13px 14px;border:1px solid #eeeaff;border-radius:16px;background:#fbfaff}.whisper-word-list-table b{color:var(--he-navy)}.whisper-word-list-table span{color:#33406f;font-weight:750}.whisper-word-list-table small,.whisper-word-list-table em{grid-column:2;color:#59617f;font-style:normal}
@keyframes whisper-pulse{0%{transform:scale(.96);opacity:.75}100%{transform:scale(1.18);opacity:0}}@keyframes whisper-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-7px)}75%{transform:translateX(7px)}}@keyframes whisper-pop-fade{0%{transform:translate(-50%,-50%) scale(.75);opacity:0}22%{opacity:1}100%{transform:translate(-50%,-50%) scale(1.2);opacity:0}}
@media(max-width:1180px){.whisper-game-shell{grid-template-columns:280px minmax(0,1fr)}.whisper-right-col{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}.whisper-dragon-card{height:260px}.whisper-letter-box{width:54px;height:54px;font-size:27px}}
@media(max-width:860px){.whisper-title-block{padding-top:26px}.whisper-game-shell{grid-template-columns:1fr;padding:18px 14px}.whisper-right-col{grid-template-columns:1fr}.whisper-board{min-height:auto;padding:18px}.speaker-button{width:132px;height:132px}.speaker-button img{width:122px;height:122px}.sound-wave-bg{top:106px;height:220px}.whisper-sparkle{display:none}.whisper-step{grid-template-columns:38px 34px 1fr}.whisper-word-list-table div{grid-template-columns:1fr}.whisper-word-list-table small,.whisper-word-list-table em{grid-column:1}}
@media(max-width:560px){.whisper-title-block h1{font-size:38px}.whisper-stat-pill{width:100%;justify-content:center}.whisper-letter-box{width:43px;height:43px;font-size:22px}.whisper-letter-boxes{gap:7px}.send-whisper-button{min-width:0;width:100%;font-size:18px}.whisper-actions{display:grid}}
@media(max-width:1100px){.he-games-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.he-featured-game-card{grid-template-columns:1fr}.he-featured-image{height:270px}}
@media(max-width:700px){.he-games-select-page{width:100%;padding:0 14px 28px}.he-games-hero-block{padding-top:36px}.he-games-grid{grid-template-columns:1fr;gap:20px}.hatchelite-game-card{min-height:0}.game-card-image-wrap{height:210px}.he-featured-game-card{padding:18px}.he-featured-image{height:220px}.he-game-topbar nav{gap:14px}.he-games-decor{display:none}}
@media(max-width:700px){.he-game-wallet{border-radius:22px}.he-daily-reward-card{align-items:flex-start;padding:16px}.he-daily-reward-card>img{width:58px;height:58px}.game-card-progress,.completion-reward-grid{grid-template-columns:1fr 1fr}.game-completion-modal{max-height:94vh;overflow-y:auto;padding:20px 18px 22px}.completion-reward-image{height:min(180px,28vh)}.completion-reward-fallback{height:min(180px,28vh)}.game-completion-modal h2{font-size:28px}.game-completion-modal p{font-size:15px}.completion-dragon{width:104px;height:104px}.reward-inline-item{font-size:15px}.reward-inline-item img{width:30px;height:30px}.stoke-word-list-table div,.forge-word-list-table div,.flight-word-list-table div,.hatchery-word-list-table div,.term-word-list-table div,.whisper-word-list-table div{grid-template-columns:1fr}.stoke-word-list-table small,.forge-word-list-table small,.forge-word-list-table em,.flight-word-list-table small,.flight-word-list-table em,.hatchery-word-list-table small,.hatchery-word-list-table em,.term-word-list-table small,.term-word-list-table em,.whisper-word-list-table small,.whisper-word-list-table em{grid-column:auto}.completion-actions button{width:100%;min-height:48px}}
@media(max-width:1280px){.he-game-shell{grid-template-columns:280px minmax(0,1fr);}.he-game-right{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.he-game-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:820px){.he-game-topbar{flex-direction:column;padding:12px 16px}.he-game-topbar nav{gap:16px;flex-wrap:wrap;justify-content:center}.he-game-topbar nav button{font-size:14px;padding:8px 0}.he-game-shell{grid-template-columns:1fr;padding:18px 14px}.he-game-right{grid-template-columns:1fr}.he-placeholder-grid{grid-template-columns:1fr}.he-stat-pill{min-width:0;width:100%;}.he-game-card-grid{grid-template-columns:1fr!important}.he-title{font-size:40px}.he-subtitle{font-size:16px}.he-game-board{min-height:0;padding:22px}.he-route-sparkle{display:none}}

.study-source-buttons{display:grid;gap:6px;margin-bottom:12px}.set-menu .study-source-buttons button.active{background:var(--purple)!important;color:white!important;box-shadow:0 8px 18px rgba(87,66,232,.18)}.empty-study-state{text-align:center;max-width:620px;margin:70px auto;padding:28px;border:1px dashed var(--border);border-radius:18px;background:#fbfaff}.empty-study-state h2{margin:0 0 10px;color:var(--navy);font-size:28px}.empty-study-state p{color:var(--text);margin:0 0 18px}.summary-empty-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.summary-empty-actions .summary-outline{min-height:42px;padding:0 18px;border:1.5px solid var(--border);border-radius:12px;background:#fff;color:var(--purple);font-weight:950;cursor:pointer}
.practice-card-header{display:grid;grid-template-columns:32px 1fr auto auto;align-items:center;gap:12px;width:100%;margin-bottom:24px}.practice-card-header .header-left{display:flex;align-items:center;justify-content:flex-start}.essential-dot,.essential-dot-placeholder{width:9px;height:9px;display:inline-block;flex-shrink:0}.essential-dot{border-radius:999px;background:#ef4444}.header-counter{font-size:13px;font-weight:700;color:#6b7280;text-align:center}.header-toggle{display:flex;align-items:center;justify-content:center}.header-actions{display:flex;align-items:center;gap:8px}.question-header{grid-template-columns:32px 1fr auto auto;margin-bottom:20px}.question-header .header-spacer{display:none}.question-title>span{display:none}.practice-card-header+.question-title h2{margin-top:8px}.practice-card-header+.compact-question .synonym-word{padding-top:18px!important}
@media(max-width:640px){.flashcard-header{grid-template-columns:24px 1fr auto;row-gap:10px}.flashcard-header .header-toggle{grid-column:1/-1;justify-content:center}.question-header{grid-template-columns:24px 1fr auto}.header-counter{text-align:center}}
@media (prefers-reduced-motion: reduce){
  .hatchelite-games-page *,.hatchelite-game-page *,.game-completion-modal *{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
    scroll-behavior:auto!important;
  }
}

/* Phase A: compact Games landing page */
.he-games-select-page{
  width:min(100%,1440px)!important;
  margin:0 auto 32px!important;
  padding:0 24px 30px!important;
  background:linear-gradient(180deg,#fff 0%,#fbfaff 52%,#f7f5ff 100%)!important;
  overflow:hidden!important;
}
.he-games-select-page:before{display:none!important}
.he-games-select-page .he-game-topbar{
  margin:0 -10px 0!important;
  min-height:74px!important;
  border-radius:0 0 18px 18px!important;
  box-shadow:0 8px 22px rgba(75,55,180,.08)!important;
}
.he-games-select-page .he-game-brand img{height:58px!important}
.he-games-select-page .he-game-topbar nav{gap:34px!important}
.he-games-select-page .he-game-topbar nav button{font-size:16px!important;padding:24px 0 20px!important}
.he-games-select-page .he-games-decor.sparkle-left{left:13%!important;top:138px!important;width:82px!important;opacity:.52!important}
.he-games-select-page .he-games-decor.sparkle-right{right:10%!important;top:156px!important;width:82px!important;opacity:.55!important}
.he-games-select-page .he-games-decor.glow{display:none!important}
.he-games-hero-block{
  max-width:1040px!important;
  margin:0 auto 18px!important;
  padding:12px 24px 0!important;
}
.he-games-hero-block h1{
  font-size:clamp(32px,4vw,48px)!important;
  line-height:1!important;
  letter-spacing:-.6px!important;
  margin:0 0 8px!important;
}
.he-games-hero-block p{
  margin:0 auto 6px!important;
  max-width:940px!important;
  font-size:17px!important;
  line-height:1.35!important;
}
.he-games-hero-block small{
  margin-top:6px!important;
  font-size:14px!important;
  line-height:1.3!important;
  color:var(--he-purple)!important;
  font-weight:750!important;
}
.he-game-wallet{
  display:flex!important;
  justify-content:center!important;
  gap:12px!important;
  margin:0 auto 16px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.he-game-wallet span{
  min-width:138px!important;
  min-height:46px!important;
  height:46px!important;
  padding:6px 14px!important;
  border:1px solid rgba(180,165,255,.55)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 10px 24px rgba(75,55,180,.09)!important;
  display:grid!important;
  grid-template-columns:30px auto!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0 10px!important;
  color:var(--he-navy)!important;
}
.he-game-wallet img{grid-row:1/3!important;width:28px!important;height:28px!important;object-fit:contain!important}
.he-game-wallet b{font-size:20px!important;line-height:1!important;font-weight:1000!important}
.he-game-wallet small{font-size:12px!important;font-weight:700!important;color:#171d5d!important;line-height:1!important}
.he-daily-reward-card{
  max-width:1320px!important;
  min-height:62px!important;
  margin:0 auto 24px!important;
  padding:8px 16px!important;
  border-radius:20px!important;
  border:1px solid rgba(240,202,111,.7)!important;
  background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(255,250,235,.96))!important;
  box-shadow:0 10px 24px rgba(75,55,180,.08)!important;
  display:flex!important;
  align-items:center!important;
  gap:18px!important;
}
.he-daily-reward-card>img{width:50px!important;height:50px!important;object-fit:contain!important}
.he-daily-reward-card .he-status-pill{
  flex:0 0 auto!important;
  padding:9px 16px!important;
  font-size:14px!important;
  color:#814b00!important;
  background:#fffaf0!important;
  border-color:#f2d48a!important;
}
.he-daily-reward-card p{
  flex:1 1 auto!important;
  margin:0!important;
  color:#17225f!important;
  font-size:15px!important;
  font-weight:800!important;
}
.he-daily-reward-card b{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0!important;
  color:var(--he-navy)!important;
  font-size:14px!important;
}
.he-daily-reward-card b span{display:inline-flex!important;align-items:center!important;gap:4px!important}
.he-daily-reward-card b img{width:22px!important;height:22px!important;object-fit:contain!important}
.daily-claim-button{
  flex:0 0 auto!important;
  min-width:142px!important;
  min-height:42px!important;
  border:0!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,#744cff,#4f2de6)!important;
  color:white!important;
  font-size:15px!important;
  font-weight:1000!important;
  cursor:pointer!important;
  box-shadow:0 10px 20px rgba(99,56,245,.24)!important;
}
.daily-claim-button:disabled{opacity:.72!important;cursor:not-allowed!important}
.he-featured-game-card{display:none!important}
.he-games-grid{
  max-width:1320px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
}
.hatchelite-game-card{
  min-height:274px!important;
  height:auto!important;
  overflow:visible!important;
  padding:14px!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.96)!important;
  border:1px solid rgba(180,165,255,.56)!important;
  box-shadow:0 11px 28px rgba(75,55,180,.09)!important;
  display:grid!important;
  grid-template-columns:42% minmax(0,1fr)!important;
  gap:14px!important;
  cursor:pointer!important;
  transition:transform 180ms ease,box-shadow 180ms ease,border-color 180ms ease!important;
}
.hatchelite-game-card:before{display:none!important;content:none!important;background:none!important}
.hatchelite-game-card:hover,.hatchelite-game-card:focus-visible{
  transform:translateY(-3px)!important;
  box-shadow:0 18px 40px rgba(99,56,245,.16)!important;
  border-color:rgba(99,56,245,.35)!important;
  outline:none!important;
}
.hatchelite-game-card:focus-visible{box-shadow:0 0 0 4px rgba(99,56,245,.18),0 18px 40px rgba(99,56,245,.16)!important}
.game-card-image-wrap{
  width:100%!important;
  height:100%!important;
  min-height:220px!important;
  max-height:250px!important;
  border-radius:18px!important;
  background:#f5f2ff!important;
  box-shadow:inset 0 0 0 1px rgba(222,215,255,.8)!important;
  overflow:hidden!important;
}
.game-card-image{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
  border-radius:0!important;
}
.game-card-content{
  min-width:0!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  padding:4px 2px 0 0!important;
}
.game-card-content h2{
  margin:0!important;
  color:var(--he-navy)!important;
  font-size:21px!important;
  line-height:1.1!important;
  font-weight:1000!important;
  letter-spacing:-.2px!important;
}
.game-card-content p{
  margin:0!important;
  color:#1b2660!important;
  font-size:13.8px!important;
  line-height:1.35!important;
  font-weight:650!important;
}
.game-tags{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  margin:2px 0 0!important;
}
.game-tag{
  min-height:24px!important;
  display:inline-flex!important;
  align-items:center!important;
  border-radius:999px!important;
  padding:4px 10px!important;
  background:#f5f2ff!important;
  border:1px solid #ece7ff!important;
  color:var(--he-purple)!important;
  font-size:12px!important;
  font-weight:1000!important;
}
.game-tag.difficulty{
  background:#eff9f0!important;
  border-color:#d7efdc!important;
  color:#2d7b35!important;
}
.dragons-whisper .game-tag.difficulty{
  background:#fff0f0!important;
  border-color:#ffdada!important;
  color:#c63030!important;
}
.game-card-progress{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:8px!important;
  margin:auto 0 2px!important;
}
.game-card-progress span{
  position:relative!important;
  padding:0 0 0 24px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:#1a2360!important;
  font-size:11.5px!important;
  font-weight:800!important;
}
.game-card-progress span:first-child:before{content:"🏆";position:absolute;left:0;top:2px;font-size:15px}
.game-card-progress span:last-child:before{content:"▶";position:absolute;left:2px;top:2px;font-size:14px;color:#2520a0}
.game-card-progress b{
  display:block!important;
  margin:1px 0 0!important;
  padding:0!important;
  color:var(--he-navy)!important;
  font-size:16px!important;
  line-height:1!important;
}
.play-game-button{
  width:100%!important;
  min-height:42px!important;
  height:42px!important;
  flex-shrink:0!important;
  margin-top:0!important;
  border:0!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,#744cff,#4f2de6)!important;
  color:white!important;
  font-size:14.5px!important;
  font-weight:1000!important;
  box-shadow:0 10px 20px rgba(99,56,245,.25)!important;
  cursor:pointer!important;
  transition:transform 180ms ease,box-shadow 180ms ease!important;
}
.play-game-button:hover,.play-game-button:focus-visible{
  transform:translateY(-1px)!important;
  box-shadow:0 14px 26px rgba(99,56,245,.3)!important;
  outline:none!important;
}
.he-games-footer-note{
  max-width:1320px!important;
  margin:26px auto 0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  color:#29366e!important;
  font-size:15px!important;
  font-weight:650!important;
}
.he-games-footer-note img{width:24px!important;height:24px!important;object-fit:contain!important}
@media(max-width:1100px){
  .he-games-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .hatchelite-game-card{height:auto!important;min-height:274px!important}
  .he-daily-reward-card{flex-wrap:wrap!important}
  .he-daily-reward-card p{flex-basis:42%!important}
  .he-games-hero-block h1{font-size:40px!important}
}
@media(max-width:820px){
  .he-games-select-page .he-game-topbar{margin:0 -10px!important}
  .he-games-select-page .he-game-topbar nav{gap:16px!important}
  .he-game-wallet{flex-wrap:wrap!important}
  .he-games-hero-block{padding-top:14px!important}
}
@media(max-width:700px){
  .he-games-select-page{padding:0 14px 28px!important}
  .he-games-grid{grid-template-columns:1fr!important}
  .hatchelite-game-card{
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    grid-template-columns:1fr!important;
  }
  .game-card-image-wrap{height:190px!important;min-height:190px!important;max-height:190px!important}
  .he-games-hero-block h1{font-size:clamp(30px,9vw,36px)!important}
  .he-games-hero-block p{font-size:15px!important}
  .he-games-hero-block small{font-size:13px!important}
  .he-game-wallet span{min-width:112px!important}
  .he-daily-reward-card{
    align-items:center!important;
    gap:12px!important;
  }
  .he-daily-reward-card p,.he-daily-reward-card b{flex-basis:100%!important}
  .daily-claim-button{width:100%!important}
.he-games-decor{display:none!important}
}

/* ===== Home page compact redesign with reading tracks ===== */
#homePage.page{
  max-width:1400px;
  padding:16px 28px 6px;
  min-height:auto;
}
#homePage .compact-hero{
  margin-bottom:12px!important;
}
#homePage .hero h1{
  font-size:clamp(34px,3.6vw,46px)!important;
  line-height:1;
  letter-spacing:-.8px;
  margin-bottom:7px!important;
}
#homePage .hero p{
  max-width:820px;
  margin:0 auto;
  font-size:clamp(13.5px,1.25vw,15.5px)!important;
  line-height:1.28;
}
#homePage .info-pill{
  margin-top:9px!important;
  padding:6px 14px!important;
  font-size:12px!important;
}
#homePage .home-product-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
  align-items:stretch!important;
}
#homePage .product-card.exam-card{
  min-height:220px!important;
  padding:10px 12px!important;
  gap:5px!important;
  border-radius:16px!important;
}
#homePage .product-card .mascot-wrap.image-mascot{
  width:82px!important;
  height:82px!important;
  flex:0 0 auto!important;
  background:linear-gradient(180deg,#f6f4ff,#fff)!important;
  box-shadow:inset 0 0 0 1px #ebe7ff;
  filter:drop-shadow(0 8px 13px rgba(32,36,80,.08));
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  padding:3px;
}
#homePage .product-card .exam-copy{
  gap:4px!important;
}
#homePage .product-card .exam-copy h2{
  font-size:18.5px!important;
  line-height:1.05!important;
  letter-spacing:-.2px!important;
}
#homePage .product-card .exam-copy p{
  max-width:310px!important;
  min-height:0!important;
  margin:0!important;
  font-size:11.1px!important;
  line-height:1.22!important;
}
#homePage .product-card .chips{
  gap:4px!important;
  max-width:320px!important;
}
#homePage .product-card .chips span{
  padding:3px 6px!important;
  min-width:auto!important;
  font-size:9.2px!important;
  line-height:1.05!important;
}
#homePage .product-card .soon-pill{
  align-self:center;
  margin-bottom:0;
  padding:4px 9px;
  border-radius:999px;
  background:#f1edff;
  color:var(--purple);
  font-size:9.6px;
  font-weight:900;
}
#homePage .product-card .primary-wide{
  min-height:32px!important;
  height:32px!important;
  border-radius:10px!important;
  font-size:12.2px!important;
  box-shadow:0 8px 16px rgba(73,50,205,.18)!important;
}
#homePage .product-card .primary-wide.disabled{
  background:#eeecf8!important;
  color:#79739d!important;
  box-shadow:none!important;
}
#homePage .home-strip.feature-strip{
  margin-top:10px;
  padding:9px 12px;
  gap:6px;
  border-radius:15px;
}
#homePage .home-strip .feature{
  gap:8px;
}
#homePage .home-strip .feature-icon-circle{
  width:30px!important;
  height:30px!important;
  flex:0 0 30px!important;
}
#homePage .home-strip .feature-icon-circle img{
  width:24px!important;
  height:24px!important;
  object-fit:contain!important;
}
#homePage .home-strip .feature-text h3{
  margin:0 0 3px!important;
  font-size:11.2px!important;
  line-height:1.08!important;
}
#homePage .home-strip .feature-text p{
  margin:0!important;
  font-size:9.4px!important;
  line-height:1.16!important;
}
.footer{
  padding:6px 18px 8px;
  font-size:11px;
}

@media(max-width:1050px){
  #homePage .home-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #homePage .home-strip.feature-strip{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Compact game selection cards: thin inline score/played row. */
.he-games-select-page .he-games-grid{
  gap:18px!important;
  align-items:stretch!important;
}
.he-games-select-page .hatchelite-game-card{
  min-height:0!important;
  height:100%!important;
  padding:14px!important;
  border-radius:22px!important;
}
.he-games-select-page .game-card-image-wrap{
  height:150px!important;
  min-height:150px!important;
  max-height:150px!important;
  margin:0 0 12px!important;
  border-radius:16px!important;
}
.he-games-select-page .game-card-content{
  gap:8px!important;
  padding:0!important;
}
.he-games-select-page .game-card-content h2{
  margin:0 0 4px!important;
  font-size:22px!important;
  line-height:1.1!important;
}
.he-games-select-page .game-card-content h2:after{
  margin:8px auto 0!important;
}
.he-games-select-page .game-card-content p{
  min-height:36px!important;
  margin:0!important;
  font-size:13px!important;
  line-height:1.35!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
.he-games-select-page .game-tags{
  gap:8px!important;
  margin:0!important;
}
.he-games-select-page .game-tag{
  min-height:22px!important;
  padding:5px 12px!important;
  font-size:11px!important;
  line-height:1!important;
}
.he-games-select-page .game-card-progress{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  width:100%!important;
  height:26px!important;
  min-height:26px!important;
  padding:0 12px!important;
  margin:4px 0 10px!important;
  border-top:1px solid rgba(110,90,220,.18)!important;
  background:transparent!important;
  border-radius:0!important;
  gap:8px!important;
}
.he-games-select-page .game-card-progress span,
.he-games-select-page .game-card-progress .game-card-stat{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  border-radius:0!important;
  color:#0b1150!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
.he-games-select-page .game-card-progress span:before{
  content:none!important;
  display:none!important;
}
.he-games-select-page .game-card-stat-icon{
  display:inline-grid!important;
  place-items:center!important;
  width:13px!important;
  height:13px!important;
  font-size:12px!important;
  line-height:1!important;
}
.he-games-select-page .game-card-stat-label{
  color:#4d5474!important;
  font-size:10px!important;
  font-weight:750!important;
  line-height:1!important;
}
.he-games-select-page .game-card-progress b,
.he-games-select-page .game-card-stat-value{
  display:inline!important;
  margin:0 0 0 2px!important;
  padding:0!important;
  color:#0b1150!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:950!important;
}
.he-games-select-page .game-card-stat-divider{
  display:block!important;
  width:1px!important;
  height:14px!important;
  flex:0 0 1px!important;
  background:rgba(110,90,220,.25)!important;
}
.he-games-select-page .play-game-button{
  height:42px!important;
  min-height:42px!important;
  margin:auto 0 0!important;
  border-radius:12px!important;
  font-size:15px!important;
  font-weight:850!important;
}
@media(max-width:700px){
  .he-games-select-page .game-card-image-wrap{
    height:150px!important;
    min-height:150px!important;
  }
  .he-games-select-page .game-card-progress{
    padding:0 8px!important;
  }
}
@media(max-width:650px){
  #homePage.page{
    padding:18px 16px 8px;
  }
  #homePage .home-product-grid{
    grid-template-columns:1fr!important;
  }
  #homePage .product-card.exam-card{
    min-height:auto!important;
  }
  #homePage .home-strip.feature-strip{
    grid-template-columns:1fr;
  }
  #homePage .home-strip .feature{
    border-right:0;
  }
}

/* ===== Home page reference alignment: horizontal cards + stronger feature icons ===== */
#homePage .home-product-grid{
  gap:18px!important;
}
#homePage .product-card.exam-card{
  display:grid!important;
  grid-template-columns:170px minmax(0,1fr)!important;
  grid-template-rows:1fr!important;
  align-items:center!important;
  min-height:0!important;
  height:238px!important;
  padding:15px 18px!important;
  gap:0 16px!important;
  text-align:left!important;
  overflow:visible!important;
}
#homePage .product-card .mascot-wrap.image-mascot{
  grid-column:1!important;
  grid-row:1!important;
  width:145px!important;
  height:145px!important;
  margin:0!important;
  justify-self:center!important;
  align-self:center!important;
  border-radius:999px!important;
  background:radial-gradient(circle,#ffffff 0 42%,#f1edff 43% 100%)!important;
  box-shadow:inset 0 0 0 1px #e6e0ff,0 10px 20px rgba(57,50,130,.08)!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:139px!important;
  height:139px!important;
  max-height:160px!important;
  padding:0!important;
  object-fit:contain!important;
}
#homePage .product-card .exam-copy{
  grid-column:2!important;
  grid-row:1!important;
  align-self:start!important;
  align-items:flex-start!important;
  text-align:left!important;
  gap:6px!important;
  padding-bottom:42px!important;
}
#homePage .product-card .exam-copy h2{
  font-size:22px!important;
  line-height:1.06!important;
  margin:0!important;
  text-align:left!important;
}
#homePage .product-card .exam-copy p{
  max-width:290px!important;
  font-size:12px!important;
  line-height:1.22!important;
  text-align:left!important;
}
#homePage .product-card .chips{
  justify-content:flex-start!important;
  max-width:300px!important;
  gap:5px!important;
}
#homePage .product-card .chips span{
  padding:3px 7px!important;
  font-size:9.8px!important;
}
#homePage .product-card .soon-pill{
  align-self:flex-start!important;
  background:#fff0c8!important;
  color:#a36a00!important;
  padding:5px 13px!important;
  font-size:11px!important;
  margin-bottom:0!important;
}
#homePage .product-card .primary-wide{
  grid-column:2!important;
  grid-row:1!important;
  justify-self:start!important;
  align-self:end!important;
  width:176px!important;
  min-height:38px!important;
  height:38px!important;
  font-size:13.5px!important;
}
#homePage .product-card.coming-soon-card .primary-wide{
  background:#ddd8f4!important;
  color:#756fa3!important;
  cursor:not-allowed!important;
  box-shadow:none!important;
}
#homePage .product-card.coming-soon-card .chips span{
  border-color:#e7c879!important;
  color:#a37921!important;
  background:#fffaf0!important;
}
#homePage .home-strip.feature-strip{
  min-height:120px!important;
  padding:18px 22px!important;
  gap:0!important;
  border-radius:20px!important;
}
#homePage .home-strip .feature{
  display:grid!important;
  grid-template-columns:78px 1fr!important;
  align-items:center!important;
  gap:12px!important;
  padding:0 12px!important;
}
#homePage .home-strip .feature-icon-circle{
  width:68px!important;
  height:68px!important;
  flex:0 0 68px!important;
  border-radius:999px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#f0edff!important;
  justify-self:center!important;
}
#homePage .home-strip .feature-icon-circle img{
  width:52px!important;
  height:52px!important;
  object-fit:contain!important;
}
#homePage .home-strip .feature-text h3{
  font-size:14.2px!important;
  line-height:1.1!important;
  font-weight:950!important;
  margin:0 0 6px!important;
}
#homePage .home-strip .feature-text p{
  font-size:11.4px!important;
  line-height:1.22!important;
}
.footer{
  padding:10px 0 14px!important;
  font-size:13px!important;
}

@media(max-width:1120px){
  #homePage .product-card.exam-card{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto!important;
    height:auto!important;
    min-height:0!important;
    padding:16px 18px!important;
    text-align:center!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    width:138px!important;
    height:138px!important;
    grid-column:1!important;
    grid-row:auto!important;
    margin:0 auto!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:132px!important;
    height:132px!important;
  }
  #homePage .product-card .exam-copy{
    grid-column:1!important;
    grid-row:auto!important;
    align-items:center!important;
    text-align:center!important;
    padding-bottom:0!important;
  }
  #homePage .product-card .exam-copy h2,
  #homePage .product-card .exam-copy p{
    text-align:center!important;
  }
  #homePage .product-card .chips{
    justify-content:center!important;
  }
  #homePage .product-card .primary-wide{
    grid-column:1!important;
    grid-row:auto!important;
    justify-self:center!important;
  }
  #homePage .product-card .soon-pill{
    align-self:center!important;
  }
}
@media(max-width:650px){
  #homePage .product-card.exam-card{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto!important;
    height:auto!important;
    min-height:0!important;
    text-align:center!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot,
  #homePage .product-card .exam-copy,
  #homePage .product-card .primary-wide{
    grid-column:1!important;
    grid-row:auto!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    margin:0 auto!important;
  }
  #homePage .product-card .exam-copy{
    align-items:center!important;
    text-align:center!important;
  }
  #homePage .product-card .exam-copy h2,
  #homePage .product-card .exam-copy p{
    text-align:center!important;
  }
  #homePage .product-card .chips{
    justify-content:center!important;
  }
  #homePage .product-card .primary-wide{
    justify-self:center!important;
    width:100%!important;
  }
  #homePage .product-card .soon-pill{
    align-self:center!important;
  }
  #homePage .home-strip .feature{
    grid-template-columns:76px 1fr!important;
    padding:0!important;
  }
}

/* ===== Home page final card/icon cleanup ===== */
#homePage .home-product-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
}
#homePage .product-card.exam-card{
  display:grid!important;
  grid-template-columns:190px minmax(0,1fr)!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  gap:20px!important;
  height:auto!important;
  min-height:252px!important;
  padding:20px 22px!important;
  border-radius:22px!important;
  text-align:left!important;
}
#homePage .product-card .mascot-wrap.image-mascot{
  grid-column:1!important;
  grid-row:1 / span 2!important;
  width:170px!important;
  height:170px!important;
  margin:0!important;
  justify-self:center!important;
  align-self:center!important;
  border-radius:50%!important;
  background:radial-gradient(circle at center,#ffffff 0%,#f4f1ff 78%,#efeafd 100%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  flex-shrink:0!important;
  box-shadow:inset 0 0 0 1px #ebe6ff,0 10px 20px rgba(57,50,130,.08)!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:122px!important;
  height:122px!important;
  max-width:122px!important;
  max-height:122px!important;
  object-fit:contain!important;
  display:block!important;
  padding:0!important;
}
#homePage .product-card .exam-copy{
  grid-column:2!important;
  grid-row:1!important;
  align-self:center!important;
  align-items:flex-start!important;
  text-align:left!important;
  gap:0!important;
  padding-bottom:0!important;
  min-width:0!important;
}
#homePage .product-card .exam-copy h2{
  margin:0 0 8px 0!important;
  font-size:24px!important;
  line-height:1.05!important;
  font-weight:900!important;
  text-align:left!important;
}
#homePage .product-card .exam-copy p{
  margin:0 0 10px 0!important;
  font-size:14px!important;
  line-height:1.38!important;
  max-width:95%!important;
  min-height:0!important;
  text-align:left!important;
}
#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-start!important;
  gap:8px!important;
  margin-bottom:0!important;
  max-width:95%!important;
}
#homePage .product-card .chips span{
  padding:5px 12px!important;
  border-radius:999px!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1!important;
}
#homePage .product-card.coming-soon-card .chips span{
  border-color:#dfbf68!important;
  color:#a67a10!important;
  background:#fffaf0!important;
}
#homePage .product-card .soon-pill{
  display:inline-flex!important;
  width:fit-content!important;
  padding:6px 14px!important;
  border-radius:999px!important;
  background:#ffe9b8!important;
  color:#a87914!important;
  font-size:12px!important;
  font-weight:800!important;
  margin:0 0 8px 0!important;
  align-self:flex-start!important;
}
#homePage .product-card .primary-wide{
  grid-column:2!important;
  grid-row:2!important;
  align-self:end!important;
  justify-self:start!important;
  width:210px!important;
  height:46px!important;
  min-height:46px!important;
  border-radius:14px!important;
  font-size:15px!important;
  font-weight:800!important;
}
#homePage .product-card.coming-soon-card .primary-wide{
  background:#dcd6f2!important;
  color:#7a73a7!important;
  box-shadow:none!important;
  cursor:not-allowed!important;
}
#homePage .home-strip.feature-strip{
  display:grid!important;
  grid-template-columns:repeat(5,1fr)!important;
  align-items:center!important;
  padding:14px 18px!important;
  border-radius:20px!important;
  min-height:110px!important;
  gap:0!important;
}
#homePage .home-strip .feature{
  display:grid!important;
  grid-template-columns:86px 1fr!important;
  align-items:center!important;
  gap:14px!important;
  padding:12px 14px!important;
  border-right:1px solid #ebe6f7!important;
}
#homePage .home-strip .feature:last-child{
  border-right:0!important;
}
#homePage .home-strip .feature-icon-circle{
  width:74px!important;
  height:74px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at center,#ffffff 0%,#f4f0ff 75%,#eee8ff 100%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  justify-self:center!important;
}
#homePage .home-strip .feature-icon-circle img{
  width:48px!important;
  height:48px!important;
  object-fit:contain!important;
  display:block!important;
  padding:0!important;
}
#homePage .home-strip .feature-text h3{
  margin:0 0 6px 0!important;
  font-size:17px!important;
  line-height:1.1!important;
  font-weight:900!important;
}
#homePage .home-strip .feature-text p{
  margin:0!important;
  font-size:13px!important;
  line-height:1.35!important;
}

@media(max-width:1120px){
  #homePage .home-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #homePage .product-card.exam-card{
    grid-template-columns:160px minmax(0,1fr)!important;
    height:auto!important;
    min-height:240px!important;
    padding:18px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    width:145px!important;
    height:145px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:112px!important;
    height:112px!important;
  }
  #homePage .home-strip.feature-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #homePage .home-strip .feature:nth-child(2n){
    border-right:0!important;
  }
}
@media(max-width:650px){
  #homePage .home-product-grid{
    grid-template-columns:1fr!important;
  }
  #homePage .product-card.exam-card{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto!important;
    height:auto!important;
    text-align:center!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot,
  #homePage .product-card .exam-copy,
  #homePage .product-card .primary-wide{
    grid-column:1!important;
    grid-row:auto!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    margin:0 auto!important;
  }
  #homePage .product-card .exam-copy{
    align-items:center!important;
    text-align:center!important;
    padding-bottom:0!important;
  }
  #homePage .product-card .exam-copy h2,
  #homePage .product-card .exam-copy p{
    text-align:center!important;
  }
  #homePage .product-card .chips{
    justify-content:center!important;
  }
  #homePage .product-card .primary-wide{
    justify-self:center!important;
    width:100%!important;
  }
  #homePage .product-card .soon-pill{
    align-self:center!important;
  }
  #homePage .home-strip.feature-strip{
    grid-template-columns:1fr!important;
  }
  #homePage .home-strip .feature{
    border-right:0!important;
    padding:12px 4px!important;
  }
}

/* Home card layout update: dragon top, content middle, button bottom. */
#homePage .home-product-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}
#homePage .product-card.exam-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
  min-height:300px!important;
  height:100%!important;
  padding:18px 20px 16px!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
#homePage .product-card .mascot-wrap.image-mascot{
  width:100%!important;
  height:auto!important;
  min-height:132px!important;
  margin:0 0 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  filter:none!important;
  overflow:visible!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:132px!important;
  height:132px!important;
  max-width:132px!important;
  max-height:132px!important;
  object-fit:contain!important;
  display:block!important;
  transform:none!important;
}
#homePage .product-card .exam-copy{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
  flex:1 1 auto!important;
  width:100%!important;
  height:auto!important;
  padding:0!important;
}
#homePage .product-card .exam-copy h2{
  margin:0 0 10px 0!important;
  font-size:22px!important;
  line-height:1.08!important;
  font-weight:900!important;
  text-align:center!important;
}
#homePage .product-card .exam-copy p{
  margin:0 auto 12px auto!important;
  font-size:12px!important;
  line-height:1.35!important;
  max-width:82%!important;
  text-align:center!important;
}
#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  gap:7px!important;
  margin:0 auto 14px auto!important;
  max-width:92%!important;
}
#homePage .product-card .chips span{
  font-size:10px!important;
  line-height:1!important;
  padding:4px 9px!important;
  border-radius:999px!important;
  font-weight:800!important;
}
#homePage .product-card .soon-pill{
  align-self:center!important;
  margin:0 0 10px 0!important;
}
#homePage .product-card .primary-wide{
  position:static!important;
  width:calc(100% - 36px)!important;
  max-width:none!important;
  height:42px!important;
  min-height:42px!important;
  margin-top:auto!important;
  align-self:center!important;
  border-radius:13px!important;
  font-size:12px!important;
  font-weight:900!important;
}

@media(max-width:1024px){
  #homePage .home-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #homePage .product-card.exam-card{
    min-height:300px!important;
  }
}
@media(max-width:640px){
  #homePage .home-product-grid{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  #homePage .product-card.exam-card{
    min-height:auto!important;
    padding:18px 16px 16px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    min-height:118px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:118px!important;
    height:118px!important;
    max-width:118px!important;
    max-height:118px!important;
  }
  #homePage .product-card .exam-copy h2{
    font-size:20px!important;
  }
  #homePage .product-card .exam-copy p{
    font-size:12px!important;
    max-width:92%!important;
  }
#homePage .product-card .primary-wide{
  width:100%!important;
}
}

/* Games page compact polish only: rewards row, descriptions, and card spacing. */
.he-games-select-page .he-game-wallet{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  margin:0 auto 12px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.he-games-select-page .he-game-wallet span{
  min-width:112px!important;
  height:38px!important;
  min-height:38px!important;
  padding:5px 10px!important;
  border-radius:14px!important;
  display:grid!important;
  grid-template-columns:24px auto!important;
  grid-template-rows:auto auto!important;
  gap:0 8px!important;
  align-items:center!important;
  justify-content:center!important;
}
.he-games-select-page .he-game-wallet img{
  grid-row:1/3!important;
  width:24px!important;
  height:24px!important;
}
.he-games-select-page .he-game-wallet b{
  font-size:16px!important;
  line-height:1!important;
  font-weight:950!important;
}
.he-games-select-page .he-game-wallet small{
  font-size:10.5px!important;
  line-height:1!important;
  font-weight:650!important;
}
.he-games-select-page .he-games-hero-block{
  padding-top:8px!important;
  margin-bottom:14px!important;
}
.he-games-select-page .he-games-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}
.he-games-select-page .hatchelite-game-card{
  min-height:274px!important;
  height:100%!important;
  display:grid!important;
  grid-template-columns:42% minmax(0,1fr)!important;
  gap:14px!important;
  padding:14px!important;
  align-items:stretch!important;
}
.he-games-select-page .game-card-content{
  display:flex!important;
  flex-direction:column!important;
  gap:9px!important;
  padding:6px 2px 0 0!important;
  min-height:0!important;
}
.he-games-select-page .game-card-content h2{
  margin:0 0 2px!important;
  font-size:21px!important;
  line-height:1.08!important;
  font-weight:1000!important;
}
.he-games-select-page .game-card-content p{
  margin:0!important;
  font-size:12.5px!important;
  line-height:1.34!important;
  font-weight:500!important;
  color:#475174!important;
}
.he-games-select-page .game-tags{
  margin:2px 0 0!important;
  gap:6px!important;
}
.he-games-select-page .game-card-progress{
  margin:auto 0 8px!important;
}
.he-games-select-page .play-game-button{
  margin-top:0!important;
  align-self:flex-end!important;
}
@media(max-width:1100px){
  .he-games-select-page .he-games-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:700px){
  .he-games-select-page .he-games-grid{
    grid-template-columns:1fr!important;
  }
  .he-games-select-page .hatchelite-game-card{
    grid-template-columns:1fr!important;
    min-height:0!important;
  }
  .he-games-select-page .he-game-wallet{
    gap:8px!important;
  }
  .he-games-select-page .he-game-wallet span{
    min-width:104px!important;
  }
}

/* Match reference: top dragon, centered title/description, pills, bottom button. */
#homePage .product-card.exam-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
  min-height:318px!important;
  padding:16px 20px 14px!important;
}
#homePage .product-card .mascot-wrap.image-mascot{
  width:100%!important;
  height:138px!important;
  min-height:138px!important;
  margin:0 0 6px!important;
  display:flex!important;
  align-items:flex-end!important;
  justify-content:center!important;
  background:transparent!important;
  border-radius:0!important;
  box-shadow:none!important;
  filter:none!important;
  overflow:visible!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:168px!important;
  height:168px!important;
  max-width:168px!important;
  max-height:168px!important;
  object-fit:contain!important;
  transform:none!important;
  filter:drop-shadow(0 10px 12px rgba(57,50,130,.13))!important;
}
#homePage .product-card .exam-copy{
  width:100%!important;
  flex:1 1 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  text-align:center!important;
  padding:0!important;
}
#homePage .product-card .exam-copy h2{
  font-size:22px!important;
  line-height:1.08!important;
  font-weight:900!important;
  margin:0 0 8px!important;
  color:#07113f!important;
  text-align:center!important;
}
#homePage .product-card .exam-copy p{
  font-size:12.5px!important;
  line-height:1.35!important;
  font-weight:500!important;
  color:#303a5f!important;
  max-width:82%!important;
  margin:0 auto 13px!important;
  text-align:center!important;
}
#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  gap:8px!important;
  margin:0 auto 14px!important;
  max-width:96%!important;
}
#homePage .product-card .chips span{
  font-size:10.5px!important;
  line-height:1!important;
  font-weight:800!important;
  padding:5px 11px!important;
  border-radius:999px!important;
}
#homePage .product-card .primary-wide{
  width:100%!important;
  max-width:none!important;
  height:42px!important;
  min-height:42px!important;
  margin-top:auto!important;
  align-self:stretch!important;
  border-radius:13px!important;
  font-size:14px!important;
  font-weight:900!important;
}

@media(max-width:640px){
  #homePage .product-card.exam-card{
    min-height:auto!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    height:122px!important;
    min-height:122px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:145px!important;
    height:145px!important;
    max-width:145px!important;
    max-height:145px!important;
  }
}

/* Final desktop correction: keep horizontal cards compact without clipping buttons. */
@media(min-width:1121px){
  #homePage .product-card.exam-card{
    grid-template-columns:190px minmax(0,1fr)!important;
    grid-template-rows:1fr!important;
    height:252px!important;
    min-height:0!important;
    position:relative!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    grid-row:1!important;
  }
  #homePage .product-card .exam-copy{
    grid-row:1!important;
    padding-bottom:56px!important;
  }
  #homePage .product-card .primary-wide{
    position:absolute!important;
    left:232px!important;
    bottom:20px!important;
    grid-row:auto!important;
  }
}
@media(min-width:651px) and (max-width:1120px){
  #homePage .product-card.exam-card{
    grid-template-columns:160px minmax(0,1fr)!important;
    grid-template-rows:1fr!important;
    height:270px!important;
    min-height:0!important;
    position:relative!important;
    text-align:left!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    grid-column:1!important;
    grid-row:1!important;
    margin:0!important;
  }
  #homePage .product-card .exam-copy{
    grid-column:2!important;
    grid-row:1!important;
    align-items:flex-start!important;
    text-align:left!important;
    padding-bottom:56px!important;
  }
  #homePage .product-card .exam-copy h2,
  #homePage .product-card .exam-copy p{
    text-align:left!important;
  }
  #homePage .product-card .chips{
    justify-content:flex-start!important;
  }
  #homePage .product-card .primary-wide{
    position:absolute!important;
    left:198px!important;
    bottom:18px!important;
    grid-row:auto!important;
    justify-self:start!important;
  }
  #homePage .product-card .soon-pill{
    align-self:flex-start!important;
  }
}
@media(max-width:650px){
  #homePage .product-card .primary-wide{
    position:static!important;
  }
}

/* Final first-page balance: smaller dragons, tighter wording, compact icons. */
@media(min-width:1121px){
  #homePage.page{
    padding-top:14px!important;
  }
  #homePage .compact-hero{
    margin-bottom:14px!important;
  }
  #homePage .hero h1{
    font-size:44px!important;
    margin-bottom:6px!important;
  }
  #homePage .hero p{
    font-size:15px!important;
  }
  #homePage .info-pill{
    margin-top:9px!important;
    padding:5px 15px!important;
    font-size:12px!important;
  }
  #homePage .product-card.exam-card{
    grid-template-columns:166px minmax(0,1fr)!important;
    gap:16px!important;
    height:226px!important;
    padding:16px 18px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    width:152px!important;
    height:152px!important;
    background:radial-gradient(circle at center,#ffffff 0%,#f5f1ff 76%,#eee9ff 100%)!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:116px!important;
    height:116px!important;
    max-width:116px!important;
    max-height:116px!important;
  }
  #homePage .product-card .exam-copy{
    padding-bottom:48px!important;
  }
  #homePage .product-card .exam-copy h2{
    font-size:21px!important;
    margin-bottom:7px!important;
  }
  #homePage .product-card .exam-copy p{
    font-size:12.2px!important;
    line-height:1.28!important;
    margin-bottom:9px!important;
    max-width:100%!important;
  }
  #homePage .product-card .chips{
    gap:6px!important;
    max-width:100%!important;
  }
  #homePage .product-card .chips span{
    padding:4px 9px!important;
    font-size:10.4px!important;
  }
  #homePage .product-card .soon-pill{
    padding:4px 12px!important;
    font-size:10.8px!important;
    margin-bottom:7px!important;
  }
  #homePage .product-card .primary-wide{
    left:200px!important;
    bottom:16px!important;
    width:200px!important;
    height:42px!important;
    min-height:42px!important;
    font-size:14px!important;
  }
  #homePage .home-strip.feature-strip{
    min-height:96px!important;
    padding:12px 16px!important;
    margin-top:14px!important;
  }
  #homePage .home-strip .feature{
    grid-template-columns:68px 1fr!important;
    gap:10px!important;
    padding:8px 12px!important;
  }
  #homePage .home-strip .feature-icon-circle{
    width:58px!important;
    height:58px!important;
  }
  #homePage .home-strip .feature-icon-circle img{
    width:42px!important;
    height:42px!important;
  }
  #homePage .home-strip .feature-text h3{
    font-size:13.4px!important;
    line-height:1.08!important;
    margin-bottom:4px!important;
  }
  #homePage .home-strip .feature-text p{
    font-size:10.8px!important;
    line-height:1.22!important;
  }
  .footer{
    padding-top:7px!important;
    padding-bottom:9px!important;
    font-size:12px!important;
  }
}

/* Final first-page fix: clean images, in-card buttons, compact feature row. */
@media(min-width:1121px){
  #homePage .home-product-grid{
    gap:16px!important;
  }
  #homePage .product-card.exam-card{
    display:grid!important;
    grid-template-columns:178px minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr) 40px!important;
    column-gap:18px!important;
    row-gap:8px!important;
    height:226px!important;
    min-height:0!important;
    padding:16px 18px!important;
    overflow:hidden!important;
    position:relative!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    grid-column:1!important;
    grid-row:1 / 3!important;
    width:168px!important;
    height:176px!important;
    margin:0!important;
    justify-self:center!important;
    align-self:center!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    filter:drop-shadow(0 12px 14px rgba(57,50,130,.14))!important;
    overflow:visible!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:164px!important;
    height:164px!important;
    max-width:164px!important;
    max-height:164px!important;
    object-fit:contain!important;
  }
  #homePage .product-card .exam-copy{
    grid-column:2!important;
    grid-row:1!important;
    align-self:start!important;
    padding:0!important;
    min-width:0!important;
  }
  #homePage .product-card .exam-copy h2{
    font-size:21px!important;
    line-height:1.06!important;
    margin:0 0 7px!important;
  }
  #homePage .product-card .exam-copy p{
    font-size:12px!important;
    line-height:1.25!important;
    margin:0 0 8px!important;
    max-width:100%!important;
  }
  #homePage .product-card .chips{
    gap:5px!important;
    max-width:100%!important;
  }
  #homePage .product-card .chips span{
    padding:4px 8px!important;
    font-size:10px!important;
  }
  #homePage .product-card .soon-pill{
    padding:4px 11px!important;
    font-size:10.5px!important;
    margin:0 0 6px!important;
  }
  #homePage .product-card .primary-wide{
    position:static!important;
    grid-column:2!important;
    grid-row:2!important;
    align-self:end!important;
    justify-self:start!important;
    width:100%!important;
    max-width:220px!important;
    height:40px!important;
    min-height:40px!important;
    border-radius:12px!important;
    font-size:14px!important;
  }
  #homePage .home-strip.feature-strip{
    min-height:92px!important;
    margin-top:14px!important;
    padding:12px 18px!important;
  }
  #homePage .home-strip .feature{
    grid-template-columns:56px 1fr!important;
    gap:10px!important;
    padding:8px 12px!important;
  }
  #homePage .home-strip .feature-icon-circle{
    width:52px!important;
    height:52px!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    overflow:visible!important;
  }
  #homePage .home-strip .feature-icon-circle img{
    width:52px!important;
    height:52px!important;
    object-fit:contain!important;
    filter:drop-shadow(0 8px 10px rgba(57,50,130,.12))!important;
  }
  #homePage .home-strip .feature-text h3{
    font-size:13px!important;
    line-height:1.08!important;
    margin:0 0 4px!important;
  }
  #homePage .home-strip .feature-text p{
    font-size:10.5px!important;
    line-height:1.2!important;
  }
}

/* Final reference polish: soft circles, larger art, tidy in-card controls. */
#homePage .home-product-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
}
#homePage .product-card.exam-card{
  display:grid!important;
  grid-template-columns:190px minmax(0,1fr)!important;
  grid-template-rows:1fr auto!important;
  align-items:center!important;
  column-gap:18px!important;
  row-gap:10px!important;
  height:auto!important;
  min-height:238px!important;
  padding:18px 20px!important;
  border-radius:24px!important;
  border:1px solid #e7e2f4!important;
  background:#fff!important;
  box-shadow:0 6px 18px rgba(60,40,120,.05)!important;
  overflow:hidden!important;
  position:relative!important;
  text-align:left!important;
}
#homePage .product-card .mascot-wrap.image-mascot{
  grid-column:1!important;
  grid-row:1 / 3!important;
  width:180px!important;
  height:180px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at center,#ffffff 0%,#f5f2ff 72%,#eee8ff 100%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  justify-self:center!important;
  align-self:center!important;
  margin:0!important;
  box-shadow:none!important;
  filter:none!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:132px!important;
  height:132px!important;
  max-width:132px!important;
  max-height:132px!important;
  object-fit:contain!important;
  display:block!important;
  padding:0!important;
  filter:drop-shadow(0 10px 12px rgba(57,50,130,.16))!important;
}
#homePage .product-card .exam-copy{
  grid-column:2!important;
  grid-row:1!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  align-items:flex-start!important;
  text-align:left!important;
  gap:0!important;
  padding:0!important;
  min-width:0!important;
}
#homePage .product-card .exam-copy h2{
  margin:0 0 8px 0!important;
  font-size:23px!important;
  line-height:1.08!important;
  font-weight:900!important;
  color:#16245c!important;
  text-align:left!important;
}
#homePage .product-card .exam-copy p{
  margin:0 0 10px 0!important;
  font-size:13px!important;
  line-height:1.32!important;
  color:#4f5a7b!important;
  max-width:100%!important;
  min-height:0!important;
  text-align:left!important;
}
#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-start!important;
  gap:7px!important;
  margin:0!important;
  max-width:100%!important;
}
#homePage .product-card .chips span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:5px 10px!important;
  border-radius:999px!important;
  font-size:11px!important;
  font-weight:700!important;
  line-height:1!important;
  border:1.5px solid #b8b2ff!important;
  color:#6a5ce7!important;
  background:#fff!important;
}
#homePage .product-card.coming-soon-card .chips span{
  border-color:#dfbf68!important;
  color:#a67a10!important;
  background:#fffaf0!important;
}
#homePage .product-card .soon-pill{
  display:inline-flex!important;
  align-items:center!important;
  width:fit-content!important;
  padding:5px 13px!important;
  border-radius:999px!important;
  background:#ffe9b8!important;
  color:#a87914!important;
  font-size:11px!important;
  font-weight:800!important;
  margin:0 0 8px 0!important;
  align-self:flex-start!important;
}
#homePage .product-card .primary-wide{
  position:static!important;
  grid-column:2!important;
  grid-row:2!important;
  align-self:end!important;
  justify-self:start!important;
  width:100%!important;
  max-width:210px!important;
  height:42px!important;
  min-height:42px!important;
  border-radius:14px!important;
  font-size:14px!important;
  font-weight:800!important;
}
#homePage .product-card.coming-soon-card .primary-wide{
  background:#ddd7f1!important;
  color:#7b73a8!important;
  box-shadow:none!important;
  cursor:not-allowed!important;
}
#homePage .home-strip.feature-strip{
  display:grid!important;
  grid-template-columns:repeat(5,1fr)!important;
  align-items:center!important;
  border:1px solid #e7e2f4!important;
  border-radius:24px!important;
  background:#fff!important;
  overflow:hidden!important;
  margin-top:18px!important;
  min-height:108px!important;
  padding:0!important;
  gap:0!important;
}
#homePage .home-strip .feature{
  display:grid!important;
  grid-template-columns:78px 1fr!important;
  align-items:center!important;
  gap:12px!important;
  padding:16px 14px!important;
  border-right:1px solid #ece7f7!important;
}
#homePage .home-strip .feature:last-child{
  border-right:none!important;
}
#homePage .home-strip .feature-icon-circle{
  width:68px!important;
  height:68px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at center,#ffffff 0%,#f4f0ff 72%,#eee7ff 100%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  box-shadow:none!important;
}
#homePage .home-strip .feature-icon-circle img{
  width:50px!important;
  height:50px!important;
  object-fit:contain!important;
  display:block!important;
  padding:0!important;
  filter:none!important;
}
#homePage .home-strip .feature-text h3{
  margin:0 0 5px 0!important;
  font-size:14px!important;
  line-height:1.1!important;
  font-weight:900!important;
  color:#18245c!important;
}
#homePage .home-strip .feature-text p{
  margin:0!important;
  font-size:11px!important;
  line-height:1.25!important;
  color:#4f5a7b!important;
}

@media(min-width:1121px){
  #homePage .product-card.exam-card{
    grid-template-columns:178px minmax(0,1fr)!important;
    height:268px!important;
    min-height:0!important;
    padding:14px 18px!important;
    column-gap:16px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    width:168px!important;
    height:168px!important;
    align-self:center!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:128px!important;
    height:128px!important;
    max-width:128px!important;
    max-height:128px!important;
  }
  #homePage .product-card .exam-copy h2{
    font-size:21px!important;
    margin-bottom:6px!important;
  }
  #homePage .product-card .exam-copy p{
    font-size:12px!important;
    line-height:1.25!important;
    margin-bottom:8px!important;
  }
  #homePage .product-card .chips{
    gap:5px!important;
  }
  #homePage .product-card .chips span{
    padding:4px 8px!important;
    font-size:10px!important;
  }
  #homePage .product-card .primary-wide{
    height:40px!important;
    min-height:40px!important;
  }
  #homePage .home-strip.feature-strip{
    min-height:96px!important;
    margin-top:14px!important;
  }
  #homePage .home-strip .feature{
    grid-template-columns:76px 1fr!important;
    padding:12px 12px!important;
  }
  #homePage .home-strip .feature-icon-circle{
    width:74px!important;
    height:74px!important;
    min-width:74px!important;
    max-width:74px!important;
    justify-self:start!important;
  }
  #homePage .home-strip .feature-icon-circle img{
    width:52px!important;
    height:52px!important;
  }
  #homePage .home-strip .feature-text h3{
    font-size:13.4px!important;
  }
  #homePage .home-strip .feature-text p{
    font-size:10.7px!important;
    line-height:1.2!important;
  }
}

/* Remove visible square image backgrounds inside circular art holders. */
#homePage .product-card .mascot-wrap.image-mascot,
#homePage .home-strip .feature-icon-circle{
  overflow:hidden!important;
  isolation:isolate!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  mix-blend-mode:multiply!important;
  border-radius:0!important;
  background:transparent!important;
  transform:scale(1.08)!important;
}
#homePage .home-strip .feature-icon-circle img{
  mix-blend-mode:multiply!important;
  border-radius:0!important;
  background:transparent!important;
  transform:scale(1.06)!important;
}

/* Hide baked-in square edges by zooming dragon art beyond the circular mask. */
#homePage .product-card .mascot-wrap.image-mascot{
  overflow:hidden!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:205px!important;
  height:205px!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:contain!important;
  transform:none!important;
}
@media(min-width:651px) and (max-width:1120px){
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:185px!important;
    height:185px!important;
  }
}
@media(max-width:650px){
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:188px!important;
    height:188px!important;
  }
}

/* Home page typography and spacing cleanup only. */
#homePage .product-card .exam-copy{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  height:100%!important;
  padding-top:10px!important;
  padding-right:8px!important;
  padding-bottom:8px!important;
}
#homePage .product-card .exam-copy h2{
  font-size:24px!important;
  line-height:1.08!important;
  font-weight:900!important;
  margin:0 0 10px 0!important;
  color:#111a4d!important;
}
#homePage .product-card .exam-copy p{
  font-size:14px!important;
  line-height:1.42!important;
  font-weight:500!important;
  margin:0 0 12px 0!important;
  color:#4d587a!important;
}
#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin-bottom:12px!important;
  align-content:flex-start!important;
}
#homePage .product-card .chips span{
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
}
#homePage .product-card .soon-pill{
  margin-bottom:10px!important;
}
#homePage .product-card .primary-wide{
  align-self:end!important;
  margin-top:auto!important;
}
#homePage .home-strip .feature{
  align-items:center!important;
}
#homePage .home-strip .feature-text{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
#homePage .home-strip .feature-text h3{
  font-size:16px!important;
  line-height:1.12!important;
  font-weight:900!important;
  margin:0 0 6px 0!important;
}
#homePage .home-strip .feature-text p{
  font-size:13px!important;
  line-height:1.35!important;
  margin:0!important;
}

/* Final game-mode repair: keep game pages out of the flashcard dashboard columns. */
body.game-route-mode .study-page{
  max-width:none!important;
  width:100%!important;
  padding:0!important;
}
body.game-route-mode .study-page .study-layout.game-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  gap:0!important;
}
body.game-route-mode .study-page .study-layout.game-layout .side-col,
body.game-route-mode .study-page .study-layout.game-layout .right-col,
body.game-route-mode .study-page .study-layout.game-layout .study-quick-row{
  display:none!important;
}
body.game-route-mode .study-page .study-layout.game-layout .study-center-col{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
}
body.game-route-mode .study-page .study-layout.game-layout .main-study-card.game-route-card{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}
body.game-route-mode .he-games-select-page{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
}
body.game-route-mode .he-games-select-page .he-games-grid,
body.game-route-mode .he-games-select-page .he-daily-reward-card{
  width:min(92vw,1320px)!important;
  max-width:1320px!important;
}
body.game-route-mode .he-games-select-page .game-card-progress span:first-child:before{
  content:"\1F3C6"!important;
}
body.game-route-mode .he-games-select-page .game-card-progress span:last-child:before{
  content:"\25B6"!important;
}

/* Hatchery Match-Up asset integration and cleanup. */
.hatchery-match-page .hatchery-game-shell{
  grid-template-columns:300px minmax(660px,1fr) 320px!important;
  gap:24px!important;
  max-width:1500px!important;
}
.hatchery-match-page .hatchery-left-col,
.hatchery-match-page .hatchery-right-col{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}
.hatchery-match-page .hatchery-dragon-card.game-visual-card{
  height:320px!important;
  padding:12px!important;
  border-radius:24px!important;
}
.hatchery-match-page .hatchery-dragon-card.game-visual-card img{
  border-radius:20px!important;
  object-fit:cover!important;
  object-position:center!important;
}
.hatchery-match-page .hatchery-panel.hint-panel{
  padding:18px!important;
  border-radius:22px!important;
}
.hatchery-match-page .hatchery-panel.hint-panel h2{
  margin-bottom:8px!important;
  font-size:20px!important;
}
.hatchery-match-page .hatchery-panel.hint-panel p{
  margin-bottom:12px!important;
  font-size:13px!important;
  line-height:1.35!important;
}
.hatchery-match-page .hatchery-hint-button,
.hatchery-match-page .hatchery-word-list-button{
  min-height:48px!important;
  border-radius:16px!important;
  font-size:16px!important;
}
.hatchery-match-page .hatchery-board{
  padding:22px!important;
  border-radius:26px!important;
}
.hatchery-match-page .hatchery-card-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  grid-auto-rows:145px!important;
  gap:16px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  align-items:stretch!important;
  justify-items:stretch!important;
  overflow:visible!important;
}
.hatchery-match-page .hatchery-egg-card{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:145px!important;
  min-height:145px!important;
  max-height:145px!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  border-radius:18px!important;
  overflow:hidden!important;
  transform:none!important;
  perspective:none!important;
}
.hatchery-match-page .egg-card-inner{
  position:static!important;
  inset:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:145px!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  box-sizing:border-box!important;
  overflow:hidden!important;
  transform:none!important;
  transform-style:flat!important;
  transition:none!important;
}
.hatchery-match-page .egg-card-front,
.hatchery-match-page .egg-card-back{
  position:static!important;
  inset:auto!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:145px!important;
  min-height:0!important;
  margin:0!important;
  box-sizing:border-box!important;
  border-radius:18px!important;
  transform:none!important;
  backface-visibility:visible!important;
  overflow:hidden!important;
}
.hatchery-match-page .egg-card-front{
  display:none!important;
}
.hatchery-match-page .egg-card-front{
  background:#f7f3ff!important;
}
.hatchery-match-page .egg-card-front:after{
  display:none!important;
}
.hatchery-match-page .egg-card-front img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  padding:8px!important;
  filter:none!important;
}
.hatchery-match-page .egg-card-back{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-direction:column!important;
  background:#fff!important;
  border-color:#ded7ff!important;
}
.hatchery-match-page .egg-card-back small{
  color:#6b4df5!important;
}
.hatchery-match-page .egg-card-back b{
  color:#07113f!important;
  font-weight:900!important;
}
.hatchery-match-page .egg-card-back img{
  width:52px!important;
  height:52px!important;
  object-fit:contain!important;
}
.hatchery-match-page .hatchery-mini-egg{
  width:16px!important;
  height:20px!important;
  object-fit:contain!important;
  opacity:.35!important;
  filter:grayscale(.35)!important;
}
.hatchery-match-page .hatchery-mini-egg.filled{
  opacity:1!important;
  filter:none!important;
}
.hatchery-match-page .hatchery-stat-pill.egg-meter>img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
.hatchery-match-page .hatchling-collection{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
.hatchery-match-page .hatchling-collection span{
  min-height:92px!important;
  border-radius:16px!important;
  padding:8px!important;
}
.hatchery-match-page .hatchling-collection span.locked{
  opacity:.68!important;
  background:#fbfaff!important;
}
.hatchery-match-page .hatchling-collection span.future{
  grid-column:1 / -1!important;
  min-height:86px!important;
}
.hatchery-match-page .hatchling-collection img{
  width:54px!important;
  height:54px!important;
  object-fit:contain!important;
}
.hatchery-match-page .hatchling-collection b{
  margin-top:3px!important;
  color:#5b4de3!important;
  font-size:12px!important;
  line-height:1.15!important;
}
.hatchery-match-page .nursery-goal-panel p{
  font-size:13px!important;
  line-height:1.35!important;
}
.hatchery-match-page .hatchery-egg-card{
  height:145px!important;
  min-height:145px!important;
  max-height:145px!important;
}
.hatchery-match-page .egg-card-back{
  gap:0!important;
  padding:12px!important;
}
.hatchery-match-page .egg-card-back small{
  margin:0!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:.07em!important;
}
.hatchery-match-page .egg-card-back b{
  display:block!important;
  width:100%!important;
  max-height:none!important;
  overflow:hidden!important;
  color:#071044!important;
  font-size:18px!important;
  line-height:1.2!important;
  font-weight:600!important;
  word-break:normal!important;
  overflow-wrap:anywhere!important;
}
.hatchery-match-page .hatchery-egg-card[data-card-kind="word"] .egg-card-back b{
  font-size:18px!important;
  line-height:1.2!important;
  font-weight:600!important;
}
.hatchery-match-page .hatchery-egg-card[data-card-kind="definition"] .egg-card-back b{
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:450!important;
}
.hatchery-match-page .egg-card-back img,
.hatchery-match-page .egg-card-back .hatchery-match-icon{
  display:none!important;
}
.hatchery-clean-fallback{
  display:block!important;
  width:100%!important;
  height:100%!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#f7f3ff,#fff)!important;
}
@media(max-width:1100px){
  .hatchery-match-page .hatchery-game-shell{
    grid-template-columns:1fr!important;
    max-width:860px!important;
  }
  .hatchery-match-page .hatchery-main-col{order:1!important}
  .hatchery-match-page .hatchery-right-col{order:2!important}
  .hatchery-match-page .hatchery-left-col{order:3!important}
}
@media(max-width:900px){
  .hatchery-match-page .hatchery-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:640px){
  .hatchery-match-page .hatchery-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }
  .hatchery-match-page .hatchery-egg-card{
    height:128px!important;
    min-height:128px!important;
    max-height:128px!important;
  }
.hatchery-match-page .hatchery-dragon-card.game-visual-card{
    height:260px!important;
  }
}

/* Full Help Center page */
.help-center-page{
  max-width:1320px!important;
  margin:0 auto!important;
}
.help-center-shell{
  display:grid!important;
  gap:16px!important;
}
.help-center-hero{
  text-align:center!important;
  padding:28px 24px!important;
  border-radius:24px!important;
}
.help-center-hero h1{
  margin:0 0 8px!important;
  color:#07113f!important;
  font-size:42px!important;
  line-height:1.05!important;
  font-weight:950!important;
}
.help-center-hero p{
  margin:0 auto 18px!important;
  max-width:760px!important;
  color:#4f5878!important;
  line-height:1.45!important;
  font-weight:650!important;
}
.help-search-bar{
  width:min(620px,100%)!important;
  min-height:50px!important;
  margin:0 auto!important;
  border:1px solid #ded8ff!important;
  background:#fff!important;
  border-radius:18px!important;
  padding:0 16px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  box-shadow:0 12px 26px rgba(75,55,180,.06)!important;
}
.help-search-bar img{
  width:16px!important;
  height:20px!important;
}
.help-search-bar input{
  border:0!important;
  outline:0!important;
  width:100%!important;
  font:inherit!important;
  color:#07113f!important;
}
.help-section-stack{
  display:grid!important;
  gap:16px!important;
}
.help-section-card{
  border-radius:24px!important;
  padding:20px!important;
}
.help-section-card h2{
  margin:0 0 14px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  color:#07113f!important;
  font-size:24px!important;
}
.help-section-card h2 span{
  width:38px!important;
  height:38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:#f3efff!important;
  color:#6546f3!important;
  font-size:20px!important;
}
.help-faq-list{
  display:grid!important;
  gap:10px!important;
}
.help-faq-card{
  border:1px solid #e4def7!important;
  border-radius:18px!important;
  background:#fff!important;
  overflow:hidden!important;
  box-shadow:0 8px 18px rgba(82,64,160,.04)!important;
}
.help-faq-card summary{
  list-style:none!important;
  cursor:pointer!important;
  padding:16px 18px!important;
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:16px!important;
  color:#07113f!important;
  font-weight:900!important;
}
.help-faq-card summary::-webkit-details-marker{
  display:none!important;
}
.help-faq-card summary span{
  flex:0 0 auto!important;
  width:28px!important;
  height:28px!important;
  border-radius:50%!important;
  display:grid!important;
  place-items:center!important;
  background:#f3efff!important;
  color:#6546f3!important;
  font-size:20px!important;
  line-height:1!important;
}
.help-faq-card[open] summary span{
  transform:rotate(45deg)!important;
}
.help-faq-answer{
  border-top:1px solid #eeeafc!important;
  padding:16px 18px 18px!important;
  color:#394260!important;
  line-height:1.55!important;
  font-weight:550!important;
}
.help-faq-answer p{
  margin:0 0 12px!important;
}
.help-faq-answer ul,
.help-faq-answer ol{
  margin:8px 0 14px 22px!important;
  padding:0!important;
}
.help-faq-answer li{
  margin:5px 0!important;
}
.help-memory-path{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:14px 0!important;
}
.help-memory-path span{
  padding:8px 11px!important;
  border-radius:999px!important;
  background:#f3efff!important;
  color:#5e45e8!important;
  font-size:12px!important;
  font-weight:900!important;
}
.help-table-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:12px!important;
  margin-top:14px!important;
}
.help-word-table{
  border:1px solid #eeeafc!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:#fbfaff!important;
}
.help-word-table h4{
  margin:0!important;
  padding:12px 14px!important;
  color:#07113f!important;
  font-size:15px!important;
}
.help-word-table table{
  width:100%!important;
  border-collapse:collapse!important;
  background:#fff!important;
}
.help-word-table th,
.help-word-table td{
  padding:9px 10px!important;
  border-top:1px solid #eeeafc!important;
  text-align:left!important;
  font-size:12px!important;
  color:#394260!important;
}
.help-word-table th{
  color:#5e45e8!important;
  font-weight:900!important;
  background:#f7f4ff!important;
}
.help-disclaimer{
  padding:14px!important;
  border-radius:16px!important;
  background:#f7f4ff!important;
  border:1px solid #e4def7!important;
  color:#4f5878!important;
}
.help-support-actions{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:10px!important;
  margin:12px 0 14px!important;
}
.help-support-actions button{
  min-height:42px!important;
  padding:0 16px!important;
  border:0!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#7b5cff,#5135df)!important;
  color:#fff!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.modal-backdrop.support-backdrop{
  background:rgba(18,15,48,.36)!important;
  backdrop-filter:blur(5px)!important;
}
.support-modal{
  width:min(720px,calc(100vw - 32px))!important;
  max-height:min(88vh,860px)!important;
  overflow:auto!important;
  border-radius:28px!important;
  border:1px solid #ded8ff!important;
  box-shadow:0 30px 80px rgba(31,24,90,.22)!important;
  padding:24px!important;
}
.support-close{
  top:18px!important;
  right:18px!important;
}
.support-modal-title{
  display:grid!important;
  grid-template-columns:48px minmax(0,1fr)!important;
  gap:14px!important;
  align-items:start!important;
  padding-right:42px!important;
  margin-bottom:18px!important;
}
.support-title-icon{
  width:48px!important;
  height:48px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:16px!important;
  background:#f3efff!important;
  color:#6546f3!important;
  font-size:24px!important;
  font-weight:900!important;
}
.support-modal-title h2{
  margin:0 0 6px!important;
  color:#07113f!important;
  font-size:28px!important;
}
.support-modal-title p{
  margin:0!important;
  color:#5f6785!important;
  line-height:1.42!important;
  font-weight:650!important;
}
.support-form{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:14px!important;
}
.support-form label{
  display:grid!important;
  gap:7px!important;
  color:#10184f!important;
  font-size:13px!important;
  font-weight:900!important;
}
.support-form input,
.support-form select,
.support-form textarea{
  width:100%!important;
  border:1px solid #ded8ff!important;
  background:#fff!important;
  color:#07113f!important;
  border-radius:14px!important;
  min-height:46px!important;
  padding:0 13px!important;
  font:inherit!important;
  font-weight:650!important;
  outline:0!important;
}
.support-form input:focus,
.support-form select:focus,
.support-form textarea:focus{
  border-color:#7b5cff!important;
  box-shadow:0 0 0 4px rgba(123,92,255,.12)!important;
}
.support-message-field,
.support-upload-field,
.support-error,
.support-actions{
  grid-column:1 / -1!important;
}
.support-form textarea{
  min-height:118px!important;
  resize:vertical!important;
  padding:12px 13px!important;
  line-height:1.45!important;
}
#supportCounter{
  justify-self:end!important;
  color:#7a7892!important;
  font-size:12px!important;
  font-weight:800!important;
}
.support-upload-field>span{
  color:#756fa3!important;
  font-size:12px!important;
  font-weight:750!important;
}
.support-upload-field{
  position:relative!important;
}
.support-upload-field input{
  position:absolute!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  height:92px!important;
  opacity:0!important;
  cursor:pointer!important;
  z-index:2!important;
}
.support-upload-box{
  position:relative!important;
  border:1.5px dashed #c8bfff!important;
  background:#fbfaff!important;
  border-radius:18px!important;
  min-height:92px!important;
  display:grid!important;
  place-items:center!important;
  text-align:center!important;
  padding:16px!important;
  cursor:pointer!important;
}
.support-upload-box b{
  color:#6546f3!important;
  font-size:15px!important;
}
.support-upload-box small,
.support-upload-box em{
  color:#6f6a86!important;
  font-size:12px!important;
  font-style:normal!important;
}
.support-error{
  min-height:20px!important;
  color:#b42318!important;
  font-size:13px!important;
  font-weight:800!important;
}
.support-actions{
  display:flex!important;
  justify-content:flex-end!important;
  gap:12px!important;
  margin-top:2px!important;
}
.support-cancel,
.support-submit{
  min-width:120px!important;
  height:44px!important;
  border-radius:14px!important;
  font-size:15px!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.support-cancel{
  background:#fff!important;
  color:#6546f3!important;
  border:1px solid #c8bfff!important;
}
.support-submit{
  background:linear-gradient(135deg,#7b5cff,#5135df)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 14px 28px rgba(83,58,221,.18)!important;
}
.support-success-view{
  text-align:center!important;
  padding:28px 18px!important;
}
.support-success-view>span{
  width:58px!important;
  height:58px!important;
  display:grid!important;
  place-items:center!important;
  margin:0 auto 14px!important;
  border-radius:50%!important;
  background:#f0fff4!important;
  color:#1e9b4f!important;
  font-size:30px!important;
  font-weight:1000!important;
}
.support-success-view h2{
  margin:0 0 8px!important;
  color:#07113f!important;
}
.support-success-view p{
  margin:0 auto 18px!important;
  max-width:420px!important;
  color:#5f6785!important;
  line-height:1.45!important;
}
@media(max-width:680px){
  .support-modal{
    width:calc(100vw - 20px)!important;
    max-height:90vh!important;
    padding:18px!important;
    border-radius:22px!important;
  }
  .support-modal-title,
  .support-form{
    grid-template-columns:1fr!important;
  }
  .support-modal-title{
    padding-right:34px!important;
  }
  .support-title-icon{
    width:42px!important;
    height:42px!important;
  }
  .support-actions{
    flex-direction:column-reverse!important;
  }
  .support-cancel,
  .support-submit{
    width:100%!important;
  }
}
.help-faq-card.hidden,
.help-section-card.hidden{
  display:none!important;
}
@media(max-width:980px){
  .help-table-grid{
    grid-template-columns:1fr!important;
  }
  .help-center-hero h1{
    font-size:34px!important;
  }
}
@media(max-width:560px){
  .help-center-page{
    padding:14px!important;
  }
  .help-center-hero,
  .help-section-card{
    padding:16px!important;
  }
  .help-faq-card summary{
    padding:14px!important;
    align-items:flex-start!important;
  }
  .help-faq-answer{
    padding:14px!important;
  }
}

/* Approved My Profile layout cleanup */
.profile-approved-dashboard{
  max-width:1320px!important;
  margin:0 auto!important;
  display:grid!important;
  gap:16px!important;
}
.profile-approved-top-row,
.profile-approved-bottom-row{
  display:grid!important;
  grid-template-columns:minmax(0,1.35fr) minmax(320px,.85fr)!important;
  gap:16px!important;
  align-items:stretch!important;
}
.profile-approved-snapshot-row{
  display:block!important;
}
.profile-card-heading{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-bottom:14px!important;
}
.profile-card-heading h3{
  margin:0!important;
}
.profile-card-heading button{
  border:0!important;
  background:#f3efff!important;
  color:#5e45e8!important;
  border-radius:999px!important;
  padding:8px 12px!important;
  font-size:13px!important;
  font-weight:900!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  cursor:pointer!important;
}
.profile-card-heading button img{
  width:14px!important;
  height:14px!important;
}
.profile-studio-card{
  min-height:360px!important;
}
.profile-studio-body{
  display:grid!important;
  grid-template-columns:210px minmax(0,1fr)!important;
  gap:22px!important;
  align-items:center!important;
}
.profile-studio-dragon{
  width:210px!important;
  height:210px!important;
  object-fit:contain!important;
  border-radius:24px!important;
  background:#fff!important;
  border:1px solid #eeeafc!important;
  box-shadow:0 16px 34px rgba(75,55,180,.08)!important;
}
.profile-kicker{
  display:inline-flex!important;
  color:#6b55f0!important;
  background:#f2efff!important;
  border-radius:999px!important;
  padding:6px 10px!important;
  font-size:12px!important;
  font-weight:900!important;
}
.profile-studio-copy h4{
  margin:10px 0 4px!important;
  font-size:28px!important;
  line-height:1.08!important;
  color:#07113f!important;
}
.profile-studio-copy p,
.profile-studio-copy small{
  color:#5c6485!important;
  font-weight:650!important;
}
.profile-xp-row{
  display:flex!important;
  justify-content:space-between!important;
  gap:10px!important;
  margin-top:16px!important;
  font-size:13px!important;
  color:#4f5878!important;
  font-weight:850!important;
}
.profile-xp-bar{
  height:10px!important;
  background:#e9e5fb!important;
  border-radius:999px!important;
  overflow:hidden!important;
  margin:8px 0 10px!important;
}
.profile-xp-bar i{
  display:block!important;
  height:100%!important;
  border-radius:inherit!important;
  background:linear-gradient(90deg,#6b4df5,#a681ff)!important;
}
.profile-enter-studio{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin-top:16px!important;
  min-height:44px!important;
  padding:0 24px!important;
  border:0!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#7b5cff,#5135df)!important;
  color:#fff!important;
  font-weight:900!important;
  cursor:pointer!important;
  box-shadow:0 14px 28px rgba(83,58,221,.2)!important;
}
.profile-studio-divider{
  height:1px!important;
  background:linear-gradient(90deg,transparent,#ded8ff,transparent)!important;
  margin:18px 0 12px!important;
}
.profile-badge-strip{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:14px!important;
}
.profile-badge-strip>span{
  color:#07113f!important;
  font-size:14px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
.profile-badge-strip>div{
  display:flex!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
}
.profile-badge-strip button{
  border:1px solid #eeeafc!important;
  background:#fff!important;
  border-radius:13px!important;
  width:42px!important;
  height:42px!important;
  padding:4px!important;
  cursor:pointer!important;
}
.profile-badge-strip img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}
.profile-community-card{
  min-height:360px!important;
}
.profile-ranking-card{
  margin-bottom:12px!important;
}
.profile-ranking-card .current-user{
  background:#f4f0ff!important;
  border-radius:12px!important;
  padding:8px 10px!important;
}
.learning-snapshot-card .dash-stat-grid{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
}
.profile-encouragement{
  margin:14px 0 0!important;
  padding:14px 16px!important;
  border-radius:16px!important;
  background:#f7f4ff!important;
  color:#3f486b!important;
  font-weight:750!important;
}
.profile-account-card{
  padding:16px!important;
}
.profile-account-card>h3{
  margin:0 0 10px!important;
  font-size:18px!important;
}
.profile-settings-groups{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
}
.profile-settings-group{
  border:1px solid #eeeafc!important;
  background:#fbfaff!important;
  border-radius:14px!important;
  padding:12px 14px!important;
  min-height:auto!important;
}
.profile-settings-group h4{
  margin:0 0 7px!important;
  color:#5e45e8!important;
  font-size:13px!important;
  line-height:1.15!important;
  font-weight:900!important;
}
.profile-settings-group p{
  margin:0 0 7px!important;
  color:#4f5878!important;
  font-size:12px!important;
  line-height:1.25!important;
}
.profile-settings-group p b{
  color:#10184f!important;
  font-weight:900!important;
}
.profile-settings-group button{
  width:100%!important;
  min-height:34px!important;
  border:0!important;
  background:transparent!important;
  color:#10184f!important;
  border-radius:10px!important;
  margin-top:2px!important;
  padding:0 6px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:800!important;
  cursor:pointer!important;
  text-align:left!important;
}
.profile-settings-group button:hover{
  background:#fff!important;
}
.profile-settings-group button img{
  width:16px!important;
  height:16px!important;
  object-fit:contain!important;
  flex:0 0 auto!important;
}
.profile-settings-group .profile-settings-primary{
  background:linear-gradient(135deg,#7b5cff,#5135df)!important;
  color:white!important;
  border:0!important;
  min-height:36px!important;
  justify-content:center!important;
  padding:0 10px!important;
  margin-top:8px!important;
  border-radius:11px!important;
  box-shadow:0 8px 16px rgba(82,64,160,.12)!important;
}
.profile-settings-group .subtle-danger{
  color:#a14141!important;
}
.profile-toggle-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  cursor:pointer!important;
  color:#10184f!important;
  font-weight:800!important;
  font-size:12px!important;
  min-height:34px!important;
}
.profile-toggle-row span{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}
.profile-toggle-row img{
  width:16px!important;
  height:16px!important;
}
.profile-toggle-row input{
  display:none!important;
}
.profile-toggle-row i{
  width:42px!important;
  height:24px!important;
  border-radius:999px!important;
  background:#d8d2ef!important;
  position:relative!important;
  flex:0 0 auto!important;
}
.profile-toggle-row i:after{
  content:""!important;
  position:absolute!important;
  width:18px!important;
  height:18px!important;
  left:3px!important;
  top:3px!important;
  border-radius:50%!important;
  background:white!important;
  box-shadow:0 3px 8px rgba(0,0,0,.15)!important;
}
.profile-toggle-row input:checked+i{
  background:#6b4df5!important;
}
.profile-toggle-row input:checked+i:after{
  transform:translateX(18px)!important;
}
.profile-help-search{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  border:1px solid #ded8ff!important;
  background:#fff!important;
  border-radius:14px!important;
  padding:0 12px!important;
  min-height:42px!important;
  margin-bottom:12px!important;
}
.profile-help-search img{
  width:18px!important;
  height:18px!important;
}
.profile-help-search input{
  border:0!important;
  outline:0!important;
  width:100%!important;
  font:inherit!important;
  color:#07113f!important;
}
.profile-help-questions{
  display:grid!important;
  gap:8px!important;
}
.profile-help-questions button{
  text-align:left!important;
  border:1px solid #eeeafc!important;
  background:#fbfaff!important;
  border-radius:12px!important;
  min-height:38px!important;
  padding:8px 12px!important;
  color:#10184f!important;
  font-weight:800!important;
  cursor:pointer!important;
}
.profile-help-actions{
  display:flex!important;
  gap:10px!important;
  margin-top:14px!important;
}
.profile-help-actions button{
  flex:1!important;
  min-height:42px!important;
  border-radius:14px!important;
  border:1px solid #ded8ff!important;
  background:#fff!important;
  color:#5e45e8!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.profile-help-actions button:first-child{
  border:0!important;
  color:white!important;
  background:linear-gradient(135deg,#7b5cff,#5135df)!important;
}
@media(max-width:1100px){
  .profile-approved-top-row,
  .profile-approved-bottom-row{
    grid-template-columns:1fr!important;
  }
  .learning-snapshot-card .dash-stat-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:720px){
  .profile-studio-body,
  .profile-settings-groups{
    grid-template-columns:1fr!important;
  }
  .profile-studio-dragon{
    margin:0 auto!important;
  }
  .profile-badge-strip{
    align-items:flex-start!important;
    flex-direction:column!important;
  }
  .profile-badge-strip>div{
    justify-content:flex-start!important;
  }
  .learning-snapshot-card .dash-stat-grid{
    grid-template-columns:1fr 1fr!important;
  }
}

/* Final Study dashboard balance pass. Keep this at the end so older phase overrides do not win. */
.study-page .study-layout{grid-template-columns:245px minmax(620px,1fr) 285px!important;gap:16px!important;align-items:start!important}
.study-page .side-col,.study-page .right-col,.study-page .study-center-col{gap:12px!important}
.study-page .progress-panel{padding:14px 16px!important}
.study-page .progress-panel h3,.study-page .review-panel h3{font-size:17px!important;line-height:1.15!important;margin-bottom:10px!important}
.study-page .progress-item{display:grid!important;grid-template-columns:38px minmax(0,1fr)!important;gap:10px!important;align-items:center!important;padding:8px 0!important}
.study-page .progress-item i{width:38px!important;height:38px!important;flex-basis:38px!important}
.study-page .progress-item i img{width:23px!important;height:23px!important;object-fit:contain!important}
.study-page .progress-item span{display:block!important;color:#4f5878!important;font-size:11.5px!important;font-weight:650!important;line-height:1.15!important}
.study-page .progress-item small{display:none!important}
.study-page .progress-item b,.study-page .progress-item #levelTextSmall{display:block!important;margin-top:2px!important;color:#0b1248!important;font-size:16px!important;font-weight:900!important;line-height:1.12!important}
.study-page .progress-item .link-btn{display:inline-block!important;margin-top:3px!important;color:#5d46e8!important;font-size:11.5px!important;font-weight:850!important;text-decoration:underline!important}
.study-page .review-panel{padding:14px 16px!important}
.study-page .review-panel p{margin:0 0 6px!important;font-size:11.5px!important;line-height:1.3!important;color:#706b86!important}
.study-page .weak-row{min-height:31px!important;padding:5px 0!important;gap:8px!important;font-size:12.5px!important}
.study-page .review-panel .link-center{margin-top:8px!important;font-size:12px!important}
.study-page .main-study-card{min-height:420px!important;padding:20px 26px!important;position:relative!important;overflow:visible!important}
.study-page .card-top{min-height:38px!important}
.study-page .word-display{padding:18px 0 8px!important}
.study-page .word-display h2{font-size:46px!important}
.study-page .reveal-box{margin:12px auto!important;padding:15px!important}
.study-page .action-row{margin-top:14px!important}
.study-page .study-quick-row{grid-template-columns:minmax(120px,.75fr) minmax(260px,1.35fr) minmax(145px,.9fr)!important;gap:10px!important;padding:10px!important;align-items:stretch!important;overflow:visible!important}
.study-page .study-quick-row>button{min-height:48px!important;padding:7px 10px!important;border-radius:14px!important}
.study-page #studyRangeButton{grid-template-columns:36px minmax(0,1fr) 16px!important}
.study-page #studyRangeButton b{font-size:13px!important}
.study-page #studyRangeButton small{font-size:10.8px!important}
.study-page .quick-action-icon{width:34px!important;height:34px!important}
.study-page .quick-action-icon img{width:22px!important;height:22px!important}
.study-page .right-col .study-promo-card{min-height:118px!important;padding:14px!important;border-radius:18px!important}
.study-page .right-col .study-promo-copy h3{font-size:18px!important;line-height:1.08!important}
.study-page .right-col .study-promo-copy p{font-size:12.5px!important;line-height:1.32!important;margin-bottom:9px!important}
.study-page .right-col .study-promo-copy button{height:38px!important;min-height:38px!important;border-radius:13px!important;font-size:14px!important}
.study-page .game-zone-card>img{width:118px!important;height:100px!important}
.study-page .dragon-studio-card{min-height:112px!important}
.study-page .dragon-studio-card>img:not(.baby-dragon-peek){width:72px!important;height:72px!important}
.study-page .right-col>.badge-mini{padding:14px!important;border-radius:18px!important}
.study-page .right-col>.badge-mini h3{font-size:17px!important;margin-bottom:10px!important}
.study-page .right-col .mini-badges{gap:7px!important}
.study-page .right-col .mini-badge img{width:46px!important;height:46px!important}
.study-page .right-col .mini-badge small{font-size:10.5px!important}
.study-page .essential-ribbon{top:16px!important;left:16px!important;width:30px!important;height:auto!important;max-height:54px!important;object-fit:contain!important}
body.range-popover-open::after{content:""!important;display:block!important;position:fixed!important;inset:0!important;z-index:80!important;background:rgba(20,18,55,.26)!important;backdrop-filter:blur(1px)!important}
.study-page .study-quick-row .set-menu{position:fixed!important;top:50%!important;left:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;width:min(430px,calc(100vw - 36px))!important;max-height:min(78vh,620px)!important;border-radius:22px!important;z-index:95!important}
.study-page .study-quick-row .set-menu::before{display:none!important}
.range-popover-panel{border-radius:22px!important}
.modal,.modal.wide,.modal-content,#settingsModal{border-radius:22px!important}
@media(max-width:1180px){.study-page .study-layout{grid-template-columns:1fr!important;max-width:820px!important}.study-page .study-quick-row{grid-template-columns:1fr!important}}

/* Final Profile compact dashboard pass. Keep last so older profile phases do not win. */
.profile-page{
  max-width:1420px!important;
  padding-top:14px!important;
}
.profile-page .profile-approved-dashboard{
  max-width:1340px!important;
  gap:18px!important;
}
.profile-page .profile-reward-summary-row,
.profile-page .profile-avatar-button,
.profile-page .snapshot-message-bar{
  display:none!important;
}
.profile-page .profile-dash-hero{
  min-height:0!important;
  height:auto!important;
  padding:18px 28px!important;
  border-radius:24px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:18px 24px!important;
  align-items:center!important;
  border:1px solid rgba(155,135,255,.36)!important;
  background:linear-gradient(135deg,rgba(20,30,72,.92),rgba(19,29,65,.82))!important;
  box-shadow:0 18px 44px rgba(2,8,28,.22),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.profile-page .profile-dash-main{
  min-width:0!important;
}
.profile-page .profile-dash-main h1{
  margin:0 0 12px!important;
  color:#fff!important;
  font-size:24px!important;
  line-height:1.1!important;
  font-weight:950!important;
}
.profile-page .profile-meta-row,
.profile-page .profile-quick-stats{
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:0!important;
  color:#fff!important;
}
.profile-page .profile-meta-row span,
.profile-page .profile-quick-stats span{
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  min-height:34px!important;
  padding:0 13px!important;
  border-radius:12px!important;
  border:1px solid rgba(159,175,244,.24)!important;
  background:rgba(255,255,255,.045)!important;
  color:#f6f7ff!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
.profile-page .profile-meta-row strong,
.profile-page .profile-meta-row b{
  color:#fff!important;
  margin:0!important;
}
.profile-page .profile-meta-row{
  margin-bottom:8px!important;
}
.profile-page .profile-dash-actions{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(130px,1fr))!important;
  gap:12px!important;
  justify-content:end!important;
  align-items:center!important;
}
.profile-page .dash-soft-btn,
.profile-page .dash-primary-btn{
  min-height:40px!important;
  padding:0 16px!important;
  border-radius:12px!important;
  font-size:13px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.profile-page .dash-soft-btn{
  background:rgba(255,255,255,.045)!important;
  border:1px solid rgba(159,175,244,.25)!important;
  color:#fff!important;
}
.profile-page .dash-primary-btn{
  background:linear-gradient(180deg,#7057ff,#4f35df)!important;
  color:#fff!important;
}
.profile-page .profile-approved-top-row{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
  gap:18px!important;
  align-items:stretch!important;
}
.profile-page .profile-studio-card,
.profile-page .profile-community-card,
.profile-page .learning-snapshot-card,
.profile-page .profile-account-card,
.profile-page .profile-help-card{
  border-radius:24px!important;
  border:1px solid rgba(155,135,255,.34)!important;
  box-shadow:0 18px 44px rgba(2,8,28,.22),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.profile-page .profile-studio-card,
.profile-page .profile-community-card{
  height:220px!important;
  min-height:0!important;
  padding:18px 22px!important;
}
.profile-page .profile-studio-card::after{
  background:linear-gradient(90deg,rgba(18,22,91,.72),rgba(36,29,124,.44))!important;
}
.profile-page .profile-community-card::after{
  background:linear-gradient(180deg,rgba(36,26,119,.28),rgba(43,29,128,.20))!important;
}
.profile-page .profile-card-heading{
  min-height:0!important;
  margin:0 0 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
}
.profile-page .profile-card-heading h3,
.profile-page .learning-snapshot-card .profile-card-heading h3,
.profile-page .profile-account-card>h3,
.profile-page .profile-help-card>h3{
  margin:0!important;
  font-size:18px!important;
  line-height:1.15!important;
  font-weight:950!important;
}
.profile-page .profile-card-heading h3 .profile-new-icon{
  width:24px!important;
  height:24px!important;
}
.profile-page .profile-community-card .profile-card-heading button,
.profile-page .learning-snapshot-card .profile-card-heading button{
  min-height:30px!important;
  padding:0 14px!important;
  border-radius:999px!important;
  font-size:11px!important;
  font-weight:950!important;
}
.profile-page .profile-studio-body{
  display:grid!important;
  grid-template-columns:170px minmax(0,1fr)!important;
  gap:18px!important;
  align-items:center!important;
}
.profile-page .profile-studio-dragon{
  width:165px!important;
  height:148px!important;
  min-height:0!important;
  padding:0!important;
  object-fit:contain!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  filter:drop-shadow(0 18px 18px rgba(0,0,0,.22))!important;
}
.profile-page .profile-studio-card .profile-kicker{
  margin:0 0 5px!important;
  min-height:24px!important;
  padding:0 11px!important;
  font-size:10px!important;
  line-height:1!important;
}
.profile-page .profile-studio-copy h4{
  margin:0 0 4px!important;
  font-size:18px!important;
  line-height:1.1!important;
}
.profile-page .profile-studio-copy p{
  margin:0 0 7px!important;
  font-size:12px!important;
  line-height:1.25!important;
  font-weight:800!important;
}
.profile-page .profile-xp-row{
  margin-top:6px!important;
  font-size:12px!important;
}
.profile-page .profile-xp-bar{
  height:9px!important;
  margin:7px 0 8px!important;
}
.profile-page .profile-studio-action-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
}
.profile-page .profile-studio-action-row small{
  display:none!important;
}
.profile-page .profile-enter-studio{
  min-width:128px!important;
  min-height:34px!important;
  margin:0 0 0 auto!important;
  padding:0 15px!important;
  border-radius:12px!important;
  font-size:12px!important;
}
.profile-page .profile-badge-strip{
  min-height:46px!important;
  margin-top:9px!important;
  padding:8px 12px!important;
  border-radius:15px!important;
  gap:12px!important;
}
.profile-page .badge-strip-icon{
  width:34px!important;
  height:34px!important;
  flex-basis:34px!important;
  border-radius:10px!important;
}
.profile-page .badge-strip-icon .profile-new-icon{
  width:22px!important;
  height:22px!important;
}
.profile-page .badge-strip-left{
  gap:9px!important;
}
.profile-page .badge-strip-left b{
  font-size:13px!important;
}
.profile-page .badge-strip-left small{
  display:none!important;
}
.profile-page .badge-strip-right{
  gap:7px!important;
}
.profile-page .badge-chip,
.profile-page .badge-count-chip{
  width:34px!important;
  height:34px!important;
  flex-basis:34px!important;
  padding:4px!important;
  border-radius:10px!important;
  font-size:13px!important;
}
.profile-page .practice-circle-coming-soon{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:54px minmax(0,1fr) auto!important;
  grid-template-rows:auto auto!important;
  align-items:center!important;
  gap:9px 14px!important;
  padding:16px 18px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.92)!important;
  border:1px solid rgba(255,255,255,.76)!important;
  box-shadow:0 12px 28px rgba(20,18,74,.08)!important;
}
.profile-page .practice-circle-icon{
  grid-row:1 / 3!important;
  width:46px!important;
  height:46px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:14px!important;
  background:#eeeaff!important;
  border:1px solid #dcd5ff!important;
}
.profile-page .practice-circle-icon .profile-new-icon{
  width:28px!important;
  height:28px!important;
}
.profile-page .practice-circle-copy h4{
  margin:0 0 4px!important;
  color:#0b1040!important;
  font-size:17px!important;
  line-height:1.1!important;
  font-weight:950!important;
}
.profile-page .practice-circle-copy p{
  margin:0!important;
  color:#19234f!important;
  font-size:12px!important;
  line-height:1.25!important;
  font-weight:800!important;
}
.profile-page .practice-circle-coming-soon>button{
  min-height:34px!important;
  padding:0 18px!important;
  border:0!important;
  border-radius:12px!important;
  background:linear-gradient(180deg,#7057ff,#4f35df)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:950!important;
  cursor:pointer!important;
}
.profile-page .practice-circle-list{
  grid-column:2 / 4!important;
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
.profile-page .practice-circle-list b,
.profile-page .practice-circle-list span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:28px!important;
  padding:0 13px!important;
  border-radius:999px!important;
  border:1px solid #d9d2ff!important;
  background:#eeeaff!important;
  color:#5135df!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:900!important;
}
.profile-page .learning-snapshot-card{
  padding:18px 22px!important;
  border-radius:24px!important;
}
.profile-page .snapshot-metric-grid{
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:12px!important;
}
.profile-page .dash-stat-tile{
  min-height:62px!important;
  padding:9px 12px!important;
  grid-template-columns:34px minmax(0,1fr)!important;
  column-gap:10px!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.04)!important;
  border-color:rgba(159,175,244,.24)!important;
}
.profile-page .dash-stat-tile>img{
  width:32px!important;
  height:32px!important;
}
.profile-page .dash-stat-tile span{
  color:#f6f7ff!important;
  font-size:10.5px!important;
  line-height:1.1!important;
}
.profile-page .dash-stat-tile b{
  color:#fff!important;
  font-size:19px!important;
  line-height:1!important;
}
.profile-page .snapshot-insight-grid{
  display:grid!important;
  grid-template-columns:1.1fr 1.1fr 1.3fr!important;
  gap:14px!important;
  margin-top:14px!important;
}
.profile-page .snapshot-mini-panel{
  min-height:80px!important;
  padding:12px 14px!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(159,175,244,.22)!important;
}
.profile-page .snapshot-mini-panel h4{
  margin:0 0 9px!important;
  color:#ffe97f!important;
  font-size:13px!important;
  line-height:1.15!important;
  font-weight:950!important;
}
.profile-page .snapshot-mini-panel p{
  margin:8px 0 0!important;
  color:#f6f7ff!important;
  font-size:12px!important;
  line-height:1.2!important;
}
.profile-page .snapshot-health-meter{
  height:7px!important;
}
.profile-page .snapshot-set-row{
  display:grid!important;
  grid-template-columns:48px 48px minmax(0,1fr)!important;
  gap:8px!important;
  align-items:center!important;
  min-height:18px!important;
  color:#fff!important;
  font-size:11px!important;
}
.profile-page .snapshot-set-row span,
.profile-page .snapshot-set-row b{
  color:#fff!important;
  font-size:11px!important;
  line-height:1!important;
}
.profile-page .snapshot-set-row i{
  height:7px!important;
}
.profile-page .snapshot-week-chart{
  height:48px!important;
  align-items:end!important;
}
.profile-page .snapshot-week-bar{
  gap:5px!important;
}
.profile-page .snapshot-week-bar i{
  width:42px!important;
  min-height:6px!important;
}
.profile-page .snapshot-week-bar b{
  color:#fff!important;
  font-size:11px!important;
}
.profile-page .profile-approved-bottom-row{
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
  gap:18px!important;
  align-items:stretch!important;
}
@media(max-width:1180px){
  .profile-page .profile-dash-hero,
  .profile-page .profile-approved-top-row,
  .profile-page .profile-approved-bottom-row{
    grid-template-columns:1fr!important;
  }
  .profile-page .profile-dash-actions{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .profile-page .profile-studio-card,
  .profile-page .profile-community-card{
    height:auto!important;
  }
  .profile-page .snapshot-metric-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .profile-page .snapshot-insight-grid{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:720px){
  .profile-page{
    padding-top:10px!important;
  }
  .profile-page .profile-dash-hero,
  .profile-page .profile-studio-card,
  .profile-page .profile-community-card,
  .profile-page .learning-snapshot-card{
    padding:16px!important;
    border-radius:20px!important;
  }
  .profile-page .profile-dash-actions,
  .profile-page .profile-studio-body,
  .profile-page .practice-circle-coming-soon{
    grid-template-columns:1fr!important;
  }
  .profile-page .dash-soft-btn,
  .profile-page .dash-primary-btn,
  .profile-page .profile-enter-studio,
  .profile-page .practice-circle-coming-soon>button{
    width:100%!important;
  }
  .profile-page .profile-studio-dragon{
    width:150px!important;
    height:130px!important;
    margin:0 auto!important;
  }
  .profile-page .practice-circle-icon{
    grid-row:auto!important;
  }
  .profile-page .practice-circle-list{
    grid-column:1!important;
  }
  .profile-page .profile-badge-strip{
    flex-direction:row!important;
    align-items:center!important;
  }
  .profile-page .badge-strip-left div{
    display:none!important;
  }
  .profile-page .snapshot-metric-grid{
    grid-template-columns:1fr 1fr!important;
  }
  .profile-page .snapshot-week-bar i{
    width:28px!important;
  }
}
@media(max-width:760px){.study-page .study-quick-row .set-menu{top:auto!important;left:0!important;right:0!important;bottom:0!important;transform:none!important;width:100%!important;max-height:75vh!important;border-radius:24px 24px 0 0!important}}

/* Flashcards Study Range: compact trigger plus floating popover/bottom sheet. */
.study-page .study-quick-row{overflow:visible!important}
.study-page #studyRangeButton{position:relative!important;display:grid!important;grid-template-columns:42px minmax(0,1fr) 18px!important;align-items:center!important;gap:10px!important}
.study-page #studyRangeButton b{display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:13.5px!important;line-height:1.15!important}
.study-page #studyRangeButton small{display:block!important;margin-top:3px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#706b86!important;font-size:11px!important;font-weight:650!important;line-height:1.2!important}
.study-page #studyRangeButton .range-chevron{color:#6a55e8!important;font-size:22px!important;font-style:normal!important;line-height:1!important}
.study-page .study-quick-row .set-menu{position:absolute!important;top:76px!important;left:calc(33.333% + 4px)!important;right:auto!important;width:min(430px,calc(100vw - 40px))!important;max-height:min(72vh,560px)!important;overflow:auto!important;z-index:90!important;margin:0!important;padding:0!important;border:1px solid #ded8ff!important;border-radius:22px!important;background:#fff!important;box-shadow:0 22px 52px rgba(31,24,92,.18)!important}
.study-page .study-quick-row .set-menu.hidden{display:none!important}
.study-page .study-quick-row .set-menu::before{content:""!important;position:absolute!important;top:-8px!important;left:44px!important;width:16px!important;height:16px!important;transform:rotate(45deg)!important;background:#fff!important;border-left:1px solid #ded8ff!important;border-top:1px solid #ded8ff!important}
.range-popover-panel{position:relative!important;display:grid!important;gap:14px!important;padding:20px!important}
.range-popover-header h3{margin:0 0 4px!important;color:#0b1248!important;font-size:21px!important;font-weight:950!important}
.range-popover-header p{margin:0!important;color:#6f6a86!important;font-size:13px!important;font-weight:600!important}
.range-type-buttons{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
.range-type-btn{min-height:38px!important;border:1px solid #ded8ff!important;border-radius:999px!important;background:#fff!important;color:#594fe0!important;font-size:12.5px!important;font-weight:850!important;cursor:pointer!important}
.range-type-btn.active{border-color:transparent!important;background:linear-gradient(180deg,#765df6,#563fdc)!important;color:#fff!important;box-shadow:0 10px 22px rgba(86,63,220,.2)!important}
.range-current-card{display:grid!important;grid-template-columns:1fr auto!important;gap:6px 12px!important;padding:14px!important;border:1px solid #ebe6ff!important;border-radius:18px!important;background:#fbfaff!important}
.range-current-card b,.range-current-card strong{color:#141b55!important;font-size:16px!important;font-weight:950!important}
.range-current-card span,.range-current-card small{color:#6f6a86!important;font-size:12px!important;font-weight:650!important}
.range-current-card small,.range-current-card .set-progress-bar{grid-column:1/-1!important}
.study-range-section{display:grid!important;gap:9px!important;padding:12px!important;border:1px solid #ebe6ff!important;border-radius:16px!important;background:#fff!important}
.study-range-section>b{color:#151b55!important;font-size:13px!important;font-weight:900!important}
.study-range-buttons{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
.study-range-btn{min-height:36px!important;border:1px solid #ded8ff!important;border-radius:12px!important;background:#fff!important;color:#594fe0!important;font-size:12px!important;font-weight:850!important;cursor:pointer!important}
.study-range-btn.active{border-color:transparent!important;background:linear-gradient(180deg,#765df6,#563fdc)!important;color:#fff!important;box-shadow:0 8px 18px rgba(86,63,220,.16)!important}
.selected-set-controls{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
.selected-set-controls label{display:grid!important;gap:4px!important;color:#6f6a86!important;font-size:11.5px!important;font-weight:800!important}
.selected-set-controls input{width:100%!important;height:36px!important;border:1px solid #ded8ff!important;border-radius:12px!important;background:#fbfaff!important;color:#141b55!important;font-size:14px!important;font-weight:900!important;text-align:center!important}
.set-progress-bar{height:9px!important;border-radius:999px!important;background:#e9e3ff!important;overflow:hidden!important}
.set-progress-bar i{display:block!important;height:100%!important;border-radius:inherit!important;background:linear-gradient(90deg,#6a4df0,#9275ff)!important}
.range-jump-section>b{display:block!important;margin-bottom:8px!important;color:#151b55!important;font-size:13px!important;font-weight:900!important}
.range-jump-list{display:grid!important;gap:8px!important;max-height:210px!important;overflow:auto!important;padding-right:2px!important}
.range-option{display:flex!important;align-items:center!important;gap:10px!important;width:100%!important;min-height:42px!important;padding:9px 11px!important;border:1px solid #ece7ff!important;border-radius:14px!important;background:#fff!important;color:#27305c!important;font-size:12.5px!important;font-weight:800!important;text-align:left!important;cursor:pointer!important}
.range-option i{color:#7158f5!important;font-style:normal!important;font-size:12px!important}
.range-option.selected{border-color:#8d78ff!important;background:#f4f0ff!important;box-shadow:inset 4px 0 0 #6b4df5!important}
.range-actions{display:flex!important;justify-content:space-between!important;gap:10px!important}
.range-actions button{width:auto!important;min-width:118px!important;height:42px!important;border-radius:14px!important;font-size:14px!important;font-weight:900!important;cursor:pointer!important}
.range-cancel{border:1px solid #cfc6ff!important;background:#fff!important;color:#5f4ce8!important}
.range-apply{border:0!important;background:linear-gradient(180deg,#765df6,#563fdc)!important;color:#fff!important;box-shadow:0 10px 22px rgba(86,63,220,.2)!important}
.study-page .review-panel h3{margin-bottom:8px!important}
.study-page .review-panel h3 em{color:#5f4ce8!important;font-style:normal!important;font-weight:900!important}
.study-page .review-panel p{margin:0 0 8px!important;font-size:11.5px!important;line-height:1.3!important;color:#706b86!important}
.study-page .weak-row{min-height:34px!important;padding:6px 0!important;gap:8px!important;font-size:12.5px!important}
.study-page .weak-row span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.study-page .weak-row .diff{flex-shrink:0!important;padding:3px 7px!important;font-size:10.5px!important}
body.range-popover-open::after{content:""!important;display:none!important}
@media(max-width:760px){
  body.range-popover-open::after{display:block!important;position:fixed!important;inset:0!important;z-index:80!important;background:rgba(15,18,54,.34)!important}
  .study-page .study-quick-row .set-menu{position:fixed!important;inset:auto 0 0 0!important;width:100%!important;max-height:75vh!important;border-radius:24px 24px 0 0!important;z-index:95!important}
  .study-page .study-quick-row .set-menu::before{display:none!important}
  .range-popover-panel{padding:18px 18px 22px!important}
.range-type-buttons{grid-template-columns:1fr!important}
.study-range-buttons{grid-template-columns:1fr!important}
.selected-set-controls{grid-template-columns:1fr!important}
}

.study-page .set-menu .range-type-btn{border:1px solid #ded8ff!important;background:#fff!important;color:#594fe0!important;font-size:12.5px!important;font-weight:850!important;padding:0 12px!important;text-align:center!important}
.study-page .set-menu .range-type-btn.active{border-color:transparent!important;background:linear-gradient(180deg,#765df6,#563fdc)!important;color:#fff!important}
.study-page .set-menu .range-option{background:#fff!important;color:#27305c!important;font-size:12.5px!important;font-weight:800!important;padding:9px 11px!important}
.study-page .set-menu .range-option.selected{background:#f4f0ff!important;color:#27305c!important}
.study-page .set-menu .range-cancel{background:#fff!important;color:#5f4ce8!important;padding:0 16px!important}
.study-page .set-menu .range-apply{background:linear-gradient(180deg,#765df6,#563fdc)!important;color:#fff!important;padding:0 16px!important}

/* Study dashboard alignment refinement: tighter columns, modal-style Study Range, compact progress. */
.study-page .study-layout{
  grid-template-columns:245px minmax(620px,1fr) 285px!important;
  gap:16px!important;
  align-items:start!important;
}
.study-page .side-col,
.study-page .right-col,
.study-page .study-center-col{
  gap:12px!important;
}
.study-page .progress-panel{
  padding:14px 16px!important;
}
.study-page .progress-panel h3,
.study-page .review-panel h3{
  font-size:17px!important;
  line-height:1.15!important;
  margin-bottom:10px!important;
}
.study-page .progress-item{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  gap:10px!important;
  align-items:center!important;
  padding:8px 0!important;
}
.study-page .progress-item i{
  width:38px!important;
  height:38px!important;
  flex-basis:38px!important;
}
.study-page .progress-item i img{
  width:23px!important;
  height:23px!important;
  object-fit:contain!important;
}
.study-page .progress-item span{
  display:block!important;
  color:#4f5878!important;
  font-size:11.5px!important;
  font-weight:650!important;
  line-height:1.15!important;
}
.study-page .progress-item small{
  display:none!important;
}
.study-page .progress-item b,
.study-page .progress-item #levelTextSmall{
  display:block!important;
  margin-top:2px!important;
  color:#0b1248!important;
  font-size:16px!important;
  font-weight:900!important;
  line-height:1.12!important;
}
.study-page .progress-item .link-btn{
  display:inline-block!important;
  margin-top:3px!important;
  color:#5d46e8!important;
  font-size:11.5px!important;
  font-weight:850!important;
  text-decoration:underline!important;
}
.study-page .review-panel{
  padding:14px 16px!important;
}
.study-page .review-panel p{
  margin-bottom:6px!important;
}
.study-page .weak-row{
  min-height:31px!important;
  padding:5px 0!important;
}
.study-page .review-panel .link-center{
  margin-top:8px!important;
  font-size:12px!important;
}
.study-page .main-study-card{
  min-height:420px!important;
  padding:20px 26px!important;
}
.study-page .card-top{
  min-height:38px!important;
}
.study-page .word-display{
  padding:18px 0 8px!important;
}
.study-page .word-display h2{
  font-size:46px!important;
}
.study-page .reveal-box{
  margin:12px auto!important;
  padding:15px!important;
}
.study-page .action-row{
  margin-top:14px!important;
}
.study-page .study-quick-row{
  grid-template-columns:minmax(120px,.75fr) minmax(260px,1.35fr) minmax(145px,.9fr)!important;
  gap:10px!important;
  padding:10px!important;
  align-items:stretch!important;
}
.study-page .study-quick-row>button{
  min-height:48px!important;
  padding:7px 10px!important;
  border-radius:14px!important;
}
.study-page #studyRangeButton{
  grid-template-columns:36px minmax(0,1fr) 16px!important;
}
.study-page #studyRangeButton b{
  font-size:13px!important;
}
.study-page #studyRangeButton small{
  font-size:10.8px!important;
}
.study-page .quick-action-icon{
  width:34px!important;
  height:34px!important;
}
.study-page .quick-action-icon img{
  width:22px!important;
  height:22px!important;
}
.study-page .right-col .study-promo-card{
  min-height:118px!important;
  padding:14px!important;
  border-radius:18px!important;
}
.study-page .right-col .study-promo-copy h3{
  font-size:18px!important;
  line-height:1.08!important;
}
.study-page .right-col .study-promo-copy p{
  font-size:12.5px!important;
  line-height:1.32!important;
  margin-bottom:9px!important;
}
.study-page .right-col .study-promo-copy button{
  height:38px!important;
  min-height:38px!important;
  border-radius:13px!important;
  font-size:14px!important;
}
.study-page .game-zone-card>img{
  width:118px!important;
  height:100px!important;
}
.study-page .dragon-studio-card{
  min-height:112px!important;
}
.study-page .dragon-studio-card>img:not(.baby-dragon-peek){
  width:72px!important;
  height:72px!important;
}
.study-page .right-col>.badge-mini{
  padding:14px!important;
  border-radius:18px!important;
}
.study-page .right-col>.badge-mini h3{
  font-size:17px!important;
  margin-bottom:10px!important;
}
.study-page .right-col .mini-badges{
  gap:7px!important;
}
.study-page .right-col .mini-badge img{
  width:46px!important;
  height:46px!important;
}
.study-page .right-col .mini-badge small{
  font-size:10.5px!important;
}
.study-page .essential-ribbon{
  top:16px!important;
  left:16px!important;
  width:30px!important;
  height:auto!important;
  max-height:54px!important;
  object-fit:contain!important;
}
body.range-popover-open::after{
  display:block!important;
  position:fixed!important;
  inset:0!important;
  z-index:80!important;
  background:rgba(20,18,55,.26)!important;
  backdrop-filter:blur(1px)!important;
}
.study-page .study-quick-row .set-menu{
  position:fixed!important;
  top:50%!important;
  left:50%!important;
  right:auto!important;
  bottom:auto!important;
  transform:translate(-50%,-50%)!important;
  width:min(430px,calc(100vw - 36px))!important;
  max-height:min(78vh,620px)!important;
  border-radius:22px!important;
  z-index:95!important;
}
.study-page .study-quick-row .set-menu::before{
  display:none!important;
}
.range-popover-panel{
  border-radius:22px!important;
}
.modal,
.modal.wide,
.modal-content,
#settingsModal{
  border-radius:22px!important;
}
@media(max-width:1180px){
  .study-page .study-layout{
    grid-template-columns:1fr!important;
    max-width:820px!important;
  }
  .study-page .study-quick-row{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:760px){
  .study-page .study-quick-row .set-menu{
    top:auto!important;
    left:0!important;
    right:0!important;
    bottom:0!important;
    transform:none!important;
    width:100%!important;
    max-height:75vh!important;
    border-radius:24px 24px 0 0!important;
  }
}

/* Level selection hero: match the Page 1 "Choose Your Test" scale. */
#levelPage.page{
  padding-top:28px!important;
}
#levelPage .level-hero{
  margin-bottom:14px!important;
}
#levelPage .level-hero h1{
  margin:0 0 7px!important;
  font-size:clamp(34px,3.6vw,46px)!important;
  line-height:1!important;
  font-weight:1000!important;
  letter-spacing:-.8px!important;
  color:var(--navy)!important;
}
#levelPage .level-hero p{
  margin:0 auto!important;
  max-width:820px!important;
  font-size:clamp(13.5px,1.25vw,15.5px)!important;
  line-height:1.28!important;
  font-weight:500!important;
  color:var(--text)!important;
}
#levelPage .level-hero .info-pill{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  margin-top:9px!important;
  padding:6px 14px!important;
  border-radius:999px!important;
  background:var(--soft)!important;
  color:var(--purple)!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
#levelPage .level-hero .info-pill b{
  font-weight:850!important;
}
@media(max-width:520px){
  #levelPage.page{
    padding-top:22px!important;
  }
  #levelPage .level-hero{
    margin-bottom:14px!important;
  }
  #levelPage .level-hero h1{
    font-size:38px!important;
    letter-spacing:-.8px!important;
    margin-bottom:6px!important;
  }
  #levelPage .level-hero p{
    font-size:15px!important;
    line-height:1.3!important;
  }
  #levelPage .level-hero .info-pill{
    padding:5px 15px!important;
    font-size:12px!important;
    white-space:normal!important;
    text-align:center!important;
  }
}

/* Study page mode navigation: larger, playful, and easier to tap. */
.study-page .mode-tabs{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-wrap:nowrap!important;
  gap:18px!important;
  margin:4px auto 22px!important;
  padding:18px 10px 8px!important;
  overflow:visible!important;
  scrollbar-width:thin!important;
}
.study-page .mode-tabs .mode-tab{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:11px!important;
  height:52px!important;
  min-height:52px!important;
  padding:0 24px!important;
  border-radius:18px!important;
  border:1.5px solid #ddd8ff!important;
  background:#fff!important;
  color:var(--navy)!important;
  font-size:16px!important;
  line-height:1!important;
  font-weight:700!important;
  box-shadow:0 10px 24px rgba(24,20,78,.07)!important;
  white-space:nowrap!important;
  cursor:pointer!important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease!important;
  overflow:visible!important;
}
.study-page .mode-tabs .mode-tab:hover{
  transform:translateY(-2px)!important;
  border-color:#8f7cff!important;
  box-shadow:0 16px 30px rgba(91,69,232,.14)!important;
}
.study-page .mode-tabs .mode-tab.active{
  border-color:transparent!important;
  background:linear-gradient(180deg,#7358f5 0%,#4d36d1 100%)!important;
  color:#fff!important;
  box-shadow:0 14px 30px rgba(91,69,232,.24)!important;
}
.study-page .mode-tabs .mode-tab-icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:16px!important;
  height:20px!important;
  min-width:16px!important;
  font-size:20px!important;
  line-height:1!important;
}
.study-page .mode-tabs .mode-tab-label{
  display:inline-block!important;
}
.study-page .mode-tabs .mode-tab-games{
  position:relative!important;
  padding-right:30px!important;
  overflow:visible!important;
}
.study-page .mode-tabs .mode-tab-games:not(.active){
  border-color:#c9c0ff!important;
  background:linear-gradient(180deg,#fff 0%,#fbf9ff 100%)!important;
}
.study-page .mode-tabs .mode-tab-games .mode-tab-sparkle{
  color:#ffd45b!important;
  font-size:16px!important;
  line-height:1!important;
  margin-left:-5px!important;
}
.study-page .mode-tabs .mode-tab-fun{
  position:absolute!important;
  top:-10px!important;
  right:18px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  height:24px!important;
  min-width:44px!important;
  padding:0 10px!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#ffe36d 0%,#f7c83d 100%)!important;
  color:#372600!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:900!important;
  white-space:nowrap!important;
  box-shadow:0 4px 10px rgba(0,0,0,.18)!important;
  z-index:8!important;
  pointer-events:none!important;
}
.study-page .mode-tabs .mode-tab-lock{
  font-size:14px!important;
  line-height:1!important;
  margin-left:-4px!important;
}
@media(max-width:900px){
  .study-page .mode-tabs{
    justify-content:flex-start!important;
    gap:12px!important;
    padding:18px 8px 8px!important;
    overflow-x:auto!important;
    overflow-y:visible!important;
  }
  .study-page .mode-tabs .mode-tab{
    padding:0 20px!important;
    font-size:15px!important;
  }
}
@media(max-width:520px){
  .study-page .mode-tabs{
    margin-bottom:18px!important;
    padding-top:18px!important;
  }
  .study-page .mode-tabs .mode-tab{
    height:52px!important;
    min-height:52px!important;
    padding:0 18px!important;
    font-size:15px!important;
  }
  .study-page .mode-tabs .mode-tab-fun{
    top:-9px!important;
    right:12px!important;
  }
}

/* Study Page Phase 1 approved assets. */
.study-page .study-center-col{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
  min-width:0!important;
}
.study-page .study-center-col .main-study-card{
  width:100%!important;
}
.study-page .study-promo-card{
  position:relative!important;
  overflow:hidden!important;
  min-height:154px!important;
  padding:18px 16px!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#fff 0%,#f8f5ff 100%)!important;
  border-color:#d9d1ff!important;
}
.study-page .game-zone-card{
  background:
    radial-gradient(circle at 88% 18%,rgba(255,209,47,.24),transparent 30%),
    linear-gradient(135deg,#ffffff 0%,#f4efff 54%,#eee8ff 100%)!important;
  border:1.5px solid #cfc4ff!important;
  box-shadow:0 18px 38px rgba(91,69,232,.13)!important;
}
.study-page .game-zone-card:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 22px 44px rgba(91,69,232,.18)!important;
}
.study-page .study-promo-card>img{
  position:absolute!important;
  right:6px!important;
  bottom:8px!important;
  width:142px!important;
  height:122px!important;
  object-fit:contain!important;
  object-position:center!important;
  pointer-events:none!important;
}
.study-page .study-promo-card .baby-dragon-peek{
  right:78px!important;
  bottom:2px!important;
  width:82px!important;
  height:82px!important;
  opacity:.95!important;
}
.study-page .study-promo-copy{
  position:relative!important;
  z-index:1!important;
  max-width:150px!important;
}
.study-page .study-promo-copy h3{
  margin:0 0 8px!important;
  color:var(--purple)!important;
  font-size:20px!important;
  line-height:1.1!important;
}
.study-page .study-promo-copy p{
  margin:0 0 14px!important;
  color:var(--navy)!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:650!important;
}
.study-page .study-promo-copy button{
  min-height:38px!important;
  border:0!important;
  border-radius:12px!important;
  padding:0 14px!important;
  background:linear-gradient(180deg,#7358f5,#4d36d1)!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:900!important;
  cursor:pointer!important;
  box-shadow:0 10px 20px rgba(91,69,232,.18)!important;
}
.study-page .game-zone-card .study-promo-copy button{
  width:96px!important;
  height:48px!important;
  min-height:48px!important;
  border-radius:14px!important;
  font-size:14px!important;
}
.study-page .game-zone-card .study-promo-copy button:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 14px 26px rgba(91,69,232,.24)!important;
}
.study-page .dragon-studio-card{
  min-height:146px!important;
  padding-right:128px!important;
  background:
    radial-gradient(circle at 88% 22%,rgba(124,92,255,.12),transparent 34%),
    linear-gradient(135deg,#fff 0%,#fbf9ff 100%)!important;
  border:1.5px solid #ded8ff!important;
  box-shadow:0 14px 32px rgba(24,20,78,.07)!important;
}
.study-page .dragon-studio-card>img:not(.baby-dragon-peek){
  right:4px!important;
  bottom:12px!important;
  width:120px!important;
  height:110px!important;
}
.study-page .dragon-studio-card .study-promo-copy button{
  width:86px!important;
  height:42px!important;
  min-height:42px!important;
  border-radius:13px!important;
  background:linear-gradient(180deg,#7358f5,#4d36d1)!important;
  color:#fff!important;
  box-shadow:0 10px 20px rgba(91,69,232,.16)!important;
}
.study-page .dragon-studio-card .study-promo-copy button:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 14px 26px rgba(91,69,232,.22)!important;
}
.study-page .study-reward-banner{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:16px!important;
  align-items:center!important;
  min-height:124px!important;
  padding:16px 20px!important;
  border:1px solid #d9d1ff!important;
  border-radius:20px!important;
  background:linear-gradient(135deg,#ffffff 0%,#f7f3ff 52%,#efeaff 100%)!important;
  box-shadow:0 14px 32px rgba(24,20,78,.07)!important;
}
.study-page .study-reward-copy{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  min-width:0!important;
}
.study-page .study-reward-copy>img{
  width:82px!important;
  height:74px!important;
  object-fit:contain!important;
  flex:0 0 82px!important;
}
.study-page .study-reward-copy b{
  display:block!important;
  color:var(--navy)!important;
  font-size:21px!important;
  line-height:1.12!important;
  margin-bottom:6px!important;
}
.study-page .study-reward-copy span{
  display:block!important;
  color:var(--text)!important;
  font-size:14px!important;
  line-height:1.35!important;
}
.study-page .study-reward-icons{
  display:flex!important;
  gap:12px!important;
  align-items:center!important;
}
.study-page .study-reward-icons span{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  min-width:82px!important;
  min-height:78px!important;
  padding:7px 9px!important;
  border:1px solid #e3def7!important;
  border-radius:16px!important;
  background:#fff!important;
  color:var(--purple)!important;
  font-size:12px!important;
  font-weight:900!important;
}
.study-page .study-reward-icons img{
  width:42px!important;
  height:42px!important;
  object-fit:contain!important;
}
.study-page .mini-badges{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:12px!important;
  align-items:start!important;
}
.study-page .mini-badge img{
  width:54px!important;
  height:54px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 7px 10px rgba(30,30,90,.15))!important;
}
.study-page .mini-badge small{
  font-size:11px!important;
  line-height:1.16!important;
  color:var(--navy)!important;
  font-weight:800!important;
}
.study-page .badge-mini{
  padding:16px!important;
  border-radius:20px!important;
  background:#fff!important;
  border:1px solid #ded8ff!important;
}
.study-page .badge-mini h3{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin:0 0 14px!important;
  font-size:20px!important;
  line-height:1.1!important;
}
.study-page .badge-mini h3 button{
  flex:0 0 auto!important;
  font-size:14px!important;
  font-weight:900!important;
  color:var(--purple)!important;
}
.study-page .mini-badge{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  text-align:center!important;
}
@media(max-width:1180px){
  .study-page .study-reward-banner{
    grid-template-columns:1fr!important;
  }
  .study-page .study-reward-icons{
    justify-content:center!important;
    flex-wrap:wrap!important;
  }
}
@media(max-width:680px){
  .study-page .study-promo-card>img{
    width:104px!important;
    height:92px!important;
  }
  .study-page .study-reward-copy{
    flex-direction:column!important;
    align-items:center!important;
    text-align:center!important;
    gap:8px!important;
  }
  .study-page .study-reward-copy>img{
    width:68px!important;
    height:64px!important;
    flex-basis:68px!important;
  }
  .study-page .study-reward-copy b{
    font-size:18px!important;
  }
  .study-page .study-reward-banner{
    min-height:0!important;
    padding:16px!important;
  }
  .study-page .study-reward-icons{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
  }
  .study-page .study-reward-icons span{
    min-width:0!important;
    min-height:70px!important;
    padding:7px 6px!important;
  }
  .study-page .study-reward-icons img{
    width:36px!important;
    height:36px!important;
  }
}

/* Study Page Phase 2: visible My Dragon header action. */
.study-actions .my-dragon-btn,
.study-actions .avatar-image-btn.my-dragon-btn{
  order:3!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
  width:auto!important;
  min-width:166px!important;
  height:52px!important;
  min-height:52px!important;
  padding:5px 18px 5px 6px!important;
  border:0!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#7358f5 0%,#4d36d1 100%)!important;
  color:#fff!important;
  font-size:16px!important;
  line-height:1!important;
  font-weight:700!important;
  box-shadow:0 14px 30px rgba(91,69,232,.22)!important;
  cursor:pointer!important;
  overflow:visible!important;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease!important;
}
.study-actions .my-dragon-btn:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 18px 36px rgba(91,69,232,.30)!important;
  filter:saturate(1.05)!important;
}
.study-actions .my-dragon-btn img,
.study-actions .avatar-image-btn.my-dragon-btn img{
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  background:#fff!important;
  box-shadow:0 4px 12px rgba(16,18,79,.18)!important;
  display:block!important;
}
.study-actions .my-dragon-btn span{
  display:inline-block!important;
  color:#fff!important;
  white-space:nowrap!important;
}
@media(max-width:720px){
  .study-actions .my-dragon-btn,
  .study-actions .avatar-image-btn.my-dragon-btn{
    min-width:52px!important;
    width:52px!important;
    padding:5px!important;
    gap:0!important;
  }
  .study-actions .my-dragon-btn span{
    display:none!important;
  }
}

/* Study Page Phase 3: replace essential dot with a bookmark ribbon. */
.study-page .main-study-card{
  position:relative!important;
  overflow:visible!important;
}
.study-page .practice-card-header{
  grid-template-columns:1fr auto auto!important;
  position:static!important;
}
.study-page .practice-card-header .header-left,
.study-page .essential-dot,
.study-page .essential-dot-placeholder{
  display:none!important;
}
.study-page .essential-ribbon{
  position:absolute!important;
  top:18px!important;
  left:-6px!important;
  width:30px!important;
  height:auto!important;
  max-height:none!important;
  display:block!important;
  object-fit:contain!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:0 8px 16px rgba(225,29,72,.2)!important;
  z-index:8!important;
}
.study-page .essential-ribbon:after{
  content:none!important;
}
@media(max-width:640px){
  .study-page .essential-ribbon{
    top:14px!important;
    left:-4px!important;
    width:28px!important;
  }
}

/* Study Page approved arrangement: center badges/test row, compact main card, collapsed range menu. */
.study-page .study-layout{
  grid-template-columns:250px minmax(560px,1fr) 285px!important;
  gap:18px!important;
}
.study-page .study-center-col{
  gap:16px!important;
}
.study-page .study-center-bottom-row{
  display:grid!important;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)!important;
  gap:16px!important;
  align-items:stretch!important;
}
.study-page .study-center-bottom-row .badge-mini,
.study-page .study-center-bottom-row .mini-test{
  min-height:160px!important;
  margin:0!important;
}
.study-page .right-col{
  gap:16px!important;
}
.study-page .right-col>.badge-mini,
.study-page .right-col>.mini-test{
  display:none!important;
}
.study-page .main-study-card{
  min-height:470px!important;
  padding:22px 28px!important;
}
.study-page .word-display{
  padding:26px 0 12px!important;
}
.study-page .reveal-box{
  margin:16px auto!important;
}
.study-page .action-row{
  margin-top:16px!important;
}
.study-page .quick-panel{
  position:relative!important;
  overflow:visible!important;
}
.study-page .quick-panel .set-menu{
  position:absolute!important;
  left:14px!important;
  right:14px!important;
  top:132px!important;
  z-index:20!important;
  display:grid!important;
  gap:8px!important;
  max-height:320px!important;
  overflow:auto!important;
  padding:10px!important;
  background:#fff!important;
  border:1px solid #d9d1ff!important;
  border-radius:16px!important;
  box-shadow:0 18px 36px rgba(24,20,78,.16)!important;
}
.study-page .quick-panel .set-menu.hidden{
  display:none!important;
}
.study-page .quick-panel .set-list{
  max-height:190px!important;
  overflow:auto!important;
}
.study-page .free-banner span{
  font-size:13px!important;
  line-height:1.2!important;
}
@media(max-width:1180px){
  .study-page .study-layout{
    grid-template-columns:1fr!important;
    max-width:760px!important;
  }
  .study-page .study-center-col{
    order:1!important;
  }
  .study-page .side-col{
    order:2!important;
  }
  .study-page .right-col{
    order:3!important;
  }
}
@media(max-width:680px){
  .study-page .study-center-bottom-row{
    grid-template-columns:1fr!important;
  }
  .study-page .main-study-card{
    min-height:auto!important;
    padding:18px 14px!important;
  }
}

/* Dragon's Whisper: compact Whisper Path progress row so all five steps fit inside the card. */
.dragons-whisper-page .whisper-path-card{
  padding:18px!important;
  overflow:hidden!important;
}

/* Study Page refinement: flatter promo cards and Page 2-like scale. */
.study-page .study-layout{
  gap:16px!important;
}
.study-page .study-center-col{
  gap:14px!important;
}
.study-page .right-col{
  gap:14px!important;
}
.study-page .study-promo-card{
  min-height:132px!important;
  padding:16px!important;
  border-radius:18px!important;
}
.study-page .study-promo-copy{
  max-width:158px!important;
}
.study-page .study-promo-copy h3{
  font-size:20px!important;
  line-height:1.08!important;
  font-weight:800!important;
  white-space:nowrap!important;
  margin-bottom:8px!important;
}
.study-page .study-promo-copy p{
  font-size:14px!important;
  line-height:1.4!important;
  font-weight:500!important;
  color:#6f6a86!important;
  margin-bottom:12px!important;
}
.study-page .study-promo-copy button,
.study-page .game-zone-card .study-promo-copy button,
.study-page .dragon-studio-card .study-promo-copy button{
  width:auto!important;
  min-width:84px!important;
  height:44px!important;
  min-height:44px!important;
  padding:0 22px!important;
  border-radius:15px!important;
  font-size:16px!important;
  font-weight:700!important;
  box-shadow:0 8px 16px rgba(91,69,232,.14)!important;
}
.study-page .game-zone-card>img{
  width:128px!important;
  height:112px!important;
  right:4px!important;
  bottom:6px!important;
}
.study-page .dragon-studio-card{
  min-height:128px!important;
  padding-right:82px!important;
}
.study-page .dragon-studio-card .study-promo-copy{
  max-width:188px!important;
}
.study-page .dragon-studio-card>img:not(.baby-dragon-peek){
  width:80px!important;
  height:78px!important;
  right:6px!important;
  bottom:10px!important;
}
.study-page .dragon-studio-card .baby-dragon-peek{
  display:none!important;
}
.study-page .main-study-card{
  min-height:440px!important;
  padding:20px 26px!important;
}
.study-page .word-display{
  padding:22px 0 10px!important;
}
.study-page .word-display h2{
  font-size:48px!important;
}
.study-page .reveal-box{
  margin:14px auto!important;
  padding:16px!important;
}
.study-page .study-reward-banner{
  min-height:112px!important;
  padding:14px 18px!important;
}
.study-page .study-reward-copy>img{
  width:72px!important;
  height:66px!important;
  flex-basis:72px!important;
}
.study-page .study-reward-copy b{
  font-size:19px!important;
}
.study-page .study-reward-icons span{
  min-height:70px!important;
  min-width:104px!important;
}
.study-page .study-reward-icons img{
  width:36px!important;
  height:36px!important;
}
.study-page .study-center-bottom-row{
  gap:14px!important;
}
.study-page .study-center-bottom-row .badge-mini,
.study-page .study-center-bottom-row .mini-test{
  min-height:148px!important;
}

/* Study Page test cleanup: no mini-test on Study, quick actions under card, badges in right rail. */
.study-page .study-reward-banner,
.study-page .study-center-bottom-row,
.study-page .mini-test{
  display:none!important;
}
.study-page .study-layout{
  grid-template-columns:250px minmax(590px,1fr) 285px!important;
}
.study-page .side-col,
.study-page .right-col{
  gap:14px!important;
}
.study-page .study-quick-row{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  padding:12px!important;
  border-radius:18px!important;
}
.study-page .study-quick-row>button{
  border:1px solid #e5e0fb!important;
  border-radius:14px!important;
  min-height:56px!important;
  padding:8px 10px!important;
  background:#fff!important;
  justify-content:flex-start!important;
}
.study-page .study-quick-row .set-menu{
  position:absolute!important;
  left:12px!important;
  right:12px!important;
  top:76px!important;
  z-index:30!important;
}
.study-page .right-col>.badge-mini{
  display:block!important;
}
@media(max-width:1180px){
  .study-page .study-quick-row{
    grid-template-columns:1fr!important;
  }
}

/* Generated Test setup card. */
.study-page .generated-test-setup{
  display:grid!important;
  gap:14px!important;
}
.study-page .generated-test-title{
  margin-bottom:0!important;
}
.study-page .generated-test-title h2{
  font-size:38px!important;
  line-height:1.05!important;
  margin:0 0 8px!important;
}
.study-page .generated-test-card{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px 24px!important;
  max-width:780px!important;
  margin:0 auto!important;
  padding:16px!important;
  border:1px solid #ded8ff!important;
  border-radius:20px!important;
  background:#fbfaff!important;
}
.study-page .generated-test-card label{
  display:grid!important;
  gap:7px!important;
  color:var(--navy)!important;
  font-size:13px!important;
  font-weight:900!important;
  width:100%!important;
  min-width:0!important;
}
.study-page .generated-test-card select{
  width:100%!important;
  box-sizing:border-box!important;
  height:44px!important;
  border:1px solid #d8d2f2!important;
  border-radius:12px!important;
  padding:0 12px!important;
  color:var(--navy)!important;
  font-weight:800!important;
  background:#fff!important;
}
.study-page .generated-test-card .test-smart-toggle{
  grid-column:1!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-height:44px!important;
  padding:0 4px!important;
  color:#5f5a78!important;
  font-size:13px!important;
  font-weight:750!important;
}
.study-page .generated-test-card .primary-wide{
  grid-column:2!important;
  min-height:44px!important;
  border-radius:13px!important;
  font-size:15px!important;
}
.study-page .test-helper,
.study-page .generated-test-status{
  margin:0 auto!important;
  max-width:780px!important;
  color:#6f6a86!important;
  text-align:center!important;
  font-size:13px!important;
  line-height:1.4!important;
}
.study-page .test-helper.warning{
  color:#b45309!important;
  background:#fff8e8!important;
  border:1px solid #f1d08a!important;
  border-radius:12px!important;
  padding:8px 12px!important;
}
.study-page .generated-test-status{
  margin:14px auto 0!important;
  padding:8px 12px!important;
  border-radius:999px!important;
  background:#f4f1ff!important;
  color:var(--purple)!important;
  font-weight:900!important;
}
@media(max-width:760px){
  .study-page .generated-test-card{
    grid-template-columns:1fr!important;
  }
  .study-page .generated-test-card .test-smart-toggle{
    grid-column:auto!important;
  }
  .study-page .generated-test-card .primary-wide{
    grid-column:auto!important;
  }
}
.dragons-whisper-page .whisper-path-card h2{
  margin:0 0 8px!important;
  font-size:26px!important;
  line-height:1.08!important;
}
.dragons-whisper-page .whisper-path-card p{
  margin:0 0 12px!important;
  font-size:15px!important;
  line-height:1.35!important;
  font-weight:650!important;
}
.dragons-whisper-page .whisper-reward-path{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:start!important;
  justify-items:center!important;
  gap:4px!important;
  width:100%!important;
  margin:8px 0 12px!important;
  position:relative!important;
}
.dragons-whisper-page .whisper-reward-path:before{
  left:9%!important;
  right:9%!important;
  top:21px!important;
  height:3px!important;
  border-radius:999px!important;
  background:#e8e2ff!important;
}
.dragons-whisper-page .whisper-reward-path span{
  width:100%!important;
  min-width:0!important;
  display:grid!important;
  justify-items:center!important;
  gap:5px!important;
  color:#8f8aa8!important;
  font-size:13px!important;
  line-height:1!important;
}
.dragons-whisper-page .whisper-reward-path img{
  width:42px!important;
  height:42px!important;
  padding:5px!important;
  border-radius:14px!important;
  background:#f5f1ff!important;
  border:1px solid #eeeaff!important;
  object-fit:contain!important;
}
.dragons-whisper-page .whisper-reward-path span.done img{
  box-shadow:0 0 0 3px rgba(255,181,46,.14)!important;
}
.dragons-whisper-page .whisper-reward-path span b{
  font-size:13px!important;
  line-height:1!important;
  font-weight:950!important;
}
.dragons-whisper-page .whisper-path-card>b{
  margin:0 0 8px!important;
  font-size:18px!important;
  line-height:1.1!important;
}
.dragons-whisper-page .whisper-progress-bar{
  height:11px!important;
}

/* Hatchery fallback visuals when no replacement hatchery images are present in the master pack. */
.hatchery-visual-fallback{
  min-height:320px;
  border-radius:20px;
  background:radial-gradient(circle at center,#fff 0%,#f7f3ff 64%,#efe9ff 100%);
  display:grid;
  place-items:center;
  align-content:center;
  gap:10px;
  color:#6546f3;
  text-align:center;
}
.hatchery-visual-fallback span{
  font-size:86px;
  line-height:1;
  filter:drop-shadow(0 12px 18px rgba(82,64,160,.12));
}
.hatchery-visual-fallback b{
  color:#10184f;
  font-size:20px;
  line-height:1.1;
}
.hatchery-stat-emoji,
.hatchery-mini-egg{
  display:inline-grid;
  place-items:center;
  width:26px;
  height:26px;
  font-style:normal;
  font-size:20px;
  line-height:1;
}
.hatchery-mini-egg{
  width:18px;
  height:18px;
  font-size:15px;
}
.hatchling-collection i,
.egg-card-front i,
.hatchery-match-icon{
  display:grid;
  place-items:center;
  font-style:normal;
  line-height:1;
}
.hatchling-collection i{
  width:46px;
  height:46px;
  font-size:30px;
  border-radius:16px;
  background:#f5f1ff;
}
.egg-card-front i{
  width:100%;
  height:100%;
  font-size:46px;
}
.hatchery-match-icon{
  margin-top:8px;
  font-size:34px;
}
.game-card-image-fallback{
  width:100%;
  height:100%;
  min-height:180px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:radial-gradient(circle at center,#fff 0%,#f8f5ff 62%,#eee8ff 100%);
}
.game-card-image-fallback span{
  font-size:86px;
  line-height:1;
  filter:drop-shadow(0 12px 18px rgba(82,64,160,.12));
}

/* Stoke the Fire scale pass: smaller title, tighter center board, balanced side columns. */
.stoke-fire-page .stoke-title-block{
  padding:24px 20px 12px!important;
}
.stoke-fire-page .stoke-title-block h1{
  font-size:52px!important;
  line-height:1.05!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
  margin:0 0 10px!important;
}
.stoke-fire-page .stoke-title-block p{
  font-size:18px!important;
  line-height:1.45!important;
  font-weight:600!important;
  margin:0 auto!important;
  max-width:900px!important;
}
.stoke-fire-page .stoke-game-shell{
  grid-template-columns:280px minmax(580px,1fr) 300px!important;
  gap:24px!important;
  max-width:1420px!important;
  margin:24px auto 0!important;
  padding:0 24px 36px!important;
}
.stoke-fire-page .stoke-board{
  min-height:0!important;
  padding:28px 30px 24px!important;
  border-radius:28px!important;
  box-shadow:0 16px 36px rgba(82,64,160,.08)!important;
}
.stoke-fire-page .base-label{
  gap:10px!important;
  font-size:16px!important;
  line-height:1.2!important;
  font-weight:800!important;
  margin-bottom:6px!important;
}
.stoke-fire-page .base-label span{
  width:34px!important;
}
.stoke-fire-page .stoke-base-word{
  margin:0 0 18px!important;
  font-size:64px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
}
.stoke-fire-page .intensity-scale{
  grid-template-columns:28px 1fr 28px!important;
  gap:8px!important;
  max-width:560px!important;
}
.stoke-fire-page .intensity-scale span{
  font-size:22px!important;
}
.stoke-fire-page .intensity-scale i{
  height:12px!important;
}
.stoke-fire-page .scale-labels{
  max-width:500px!important;
  margin:8px auto 18px!important;
  font-size:14px!important;
  font-weight:700!important;
  color:#6f6a8c!important;
}
.stoke-fire-page .heat-slots{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  margin:12px 0 18px!important;
}
.stoke-fire-page .stoke-heat-slot{
  min-height:160px!important;
  border-radius:24px!important;
  padding:14px 12px 12px!important;
  gap:6px!important;
}
.stoke-fire-page .slot-number{
  top:-14px!important;
  width:34px!important;
  height:34px!important;
  font-size:16px!important;
  font-weight:800!important;
}
.stoke-fire-page .stoke-heat-slot img{
  width:28px!important;
  height:28px!important;
}
.stoke-fire-page .stoke-heat-slot small{
  font-size:14px!important;
  font-weight:800!important;
  margin-top:8px!important;
}
.stoke-fire-page .stoke-heat-slot b{
  font-size:20px!important;
  line-height:1.2!important;
  font-weight:900!important;
  margin-top:2px!important;
}
.stoke-fire-page .stoke-heat-slot em{
  font-size:11px!important;
}
.stoke-fire-page .stoke-word-bank{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:14px!important;
  margin:0 auto 14px!important;
  padding:12px!important;
  border-radius:18px!important;
}
.stoke-fire-page .stoke-word-card{
  min-height:72px!important;
  border-radius:20px!important;
  padding:10px 14px!important;
  gap:10px!important;
  font-size:18px!important;
  font-weight:900!important;
}
.stoke-fire-page .stoke-word-card i{
  font-size:16px!important;
}
.stoke-fire-page .stoke-feedback{
  min-height:36px!important;
  margin:2px 0 12px!important;
  padding:8px 12px!important;
  border-radius:14px!important;
  font-size:15px!important;
  font-weight:750!important;
}
.stoke-fire-page .stoke-action-bar{
  grid-template-columns:minmax(0,1fr) minmax(120px,.8fr) 240px!important;
  gap:16px!important;
  padding:12px 14px!important;
  border-radius:18px!important;
}
.stoke-fire-page .stoke-action-bar span{
  font-size:16px!important;
  font-weight:800!important;
}
.stoke-fire-page .stoke-action-bar span img{
  width:24px!important;
  height:24px!important;
}
.stoke-fire-page .stoke-fill-track{
  height:12px!important;
}
.stoke-fire-page .ignite-button{
  min-height:60px!important;
  border-radius:20px!important;
  padding:0 24px!important;
  font-size:18px!important;
  font-weight:900!important;
}
.stoke-fire-page .stoke-panel{
  padding:16px!important;
}
.stoke-fire-page .stoke-panel h2{
  margin-bottom:10px!important;
  font-size:20px!important;
}
.stoke-fire-page .stoke-panel p{
  font-size:14px!important;
}
.stoke-fire-page .stoke-hint-button,
.stoke-fire-page .stoke-word-list-button{
  min-height:48px!important;
  border-radius:16px!important;
  font-size:15px!important;
}
.stoke-fire-page .stoke-hint-button{
  margin-top:12px!important;
}
.stoke-fire-page .stoke-hint-button b{
  width:28px!important;
  height:28px!important;
}
@media(max-width:900px){
  .stoke-fire-page .stoke-title-block h1{
    font-size:44px!important;
  }
  .stoke-fire-page .stoke-title-block p{
    font-size:16px!important;
  }
  .stoke-fire-page .stoke-base-word{
    font-size:52px!important;
  }
  .stoke-fire-page .stoke-game-shell{
    grid-template-columns:1fr!important;
  }
  .stoke-fire-page .stoke-action-bar{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:640px){
  .stoke-fire-page .stoke-title-block h1{
    font-size:34px!important;
  }
  .stoke-fire-page .stoke-title-block p{
    font-size:15px!important;
  }
  .stoke-fire-page .stoke-base-word{
    font-size:42px!important;
  }
  .stoke-fire-page .heat-slots,
  .stoke-fire-page .stoke-word-bank{
    grid-template-columns:1fr!important;
  }
}

/* Shared game practice controls: compact selector + shuffle button. */
.hatchelite-game-page .game-practice-controls{
  position:relative;
  z-index:4;
  max-width:760px;
  margin:10px auto 16px;
  padding:10px 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
  border:1px solid #e4ddff;
  border-radius:18px;
  background:rgba(255,255,255,.9);
  box-shadow:0 10px 24px rgba(73,49,180,.08);
}
.hatchelite-game-page .game-practice-controls label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#17205a;
  font-size:13px;
  font-weight:900;
}
.hatchelite-game-page .game-practice-controls select{
  height:36px;
  min-width:190px;
  padding:0 34px 0 12px;
  border:1.5px solid #cfc5ff;
  border-radius:12px;
  background:#fff;
  color:#2d2475;
  font:800 13px/1 "Nunito Sans", Inter, sans-serif;
  outline:none;
}
.hatchelite-game-page .game-practice-controls select:focus{
  border-color:#6a4df6;
  box-shadow:0 0 0 3px rgba(106,77,246,.16);
}
.hatchelite-game-page .game-practice-controls button{
  height:36px;
  padding:0 14px;
  border:0;
  border-radius:12px;
  background:linear-gradient(180deg,#7658ff,#5135de);
  color:#fff;
  font:900 13px/1 "Nunito Sans", Inter, sans-serif;
  cursor:pointer;
  box-shadow:0 8px 18px rgba(82,53,220,.2);
}
.hatchelite-game-page .game-practice-controls button:hover{
  transform:translateY(-1px);
  box-shadow:0 12px 24px rgba(82,53,220,.25);
}
.hatchelite-game-page .game-practice-controls small{
  flex-basis:100%;
  text-align:center;
  color:#6f5bc4;
  font-size:12px;
  font-weight:700;
}
@media(max-width:640px){
  .hatchelite-game-page .game-practice-controls{
    margin:8px 16px 14px;
    align-items:stretch;
  }
  .hatchelite-game-page .game-practice-controls label,
  .hatchelite-game-page .game-practice-controls select,
  .hatchelite-game-page .game-practice-controls button{
    width:100%;
  }
  .hatchelite-game-page .game-practice-controls label{
    justify-content:space-between;
  }
}

/* Forge the Dragon Scale compact mockup refinement. */
.forge-scale-page .forge-game-shell{
  max-width:1540px!important;
  grid-template-columns:minmax(240px,280px) minmax(620px,1fr) minmax(300px,340px)!important;
  gap:22px!important;
  padding:20px 32px 38px!important;
}
.forge-scale-page .forge-board{
  min-height:auto!important;
  padding:24px!important;
}
.forge-scale-page .forge-clue-box{
  margin:14px auto 18px!important;
  padding:16px 18px!important;
}
.forge-scale-page .forge-clue-box p{
  font-size:18px!important;
  line-height:1.38!important;
}
.forge-scale-page .forge-answer-slots{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  flex-wrap:nowrap!important;
  gap:clamp(4px,.6vw,10px)!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
  margin:0 auto 18px!important;
}
.forge-scale-page .forge-answer-slot{
  width:var(--slot-size,52px)!important;
  height:var(--slot-size,52px)!important;
  min-width:var(--slot-size,52px)!important;
  border-radius:14px!important;
}
.forge-scale-page .forge-answer-slot span{
  font-size:calc(var(--slot-size,52px) * .48)!important;
}
.forge-scale-page .forge-answer-slot small{
  font-size:9px!important;
}
.forge-scale-page .forge-tile-tools{
  margin:0 auto 10px!important;
  padding:10px 12px!important;
  gap:10px!important;
}
.forge-scale-page .forge-tile-tools span{
  font-size:13px!important;
}
.forge-scale-page .forge-tile-tools button{
  padding:8px 12px!important;
  font-size:12px!important;
}
.forge-scale-page .forge-letter-bank{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:clamp(6px,.8vw,12px)!important;
  flex-wrap:nowrap!important;
  max-width:100%!important;
  min-height:82px!important;
  overflow:hidden!important;
  margin:0 auto 12px!important;
  padding:14px!important;
}
.forge-scale-page .forge-letter-tile{
  width:var(--tile-size,54px)!important;
  height:var(--tile-size,54px)!important;
  min-width:var(--tile-size,54px)!important;
  border-radius:14px!important;
}
.forge-scale-page .forge-letter-tile b{
  font-size:calc(var(--tile-size,54px) * .45)!important;
}
.forge-scale-page .forge-letter-tile.letter-tile--used{
  opacity:.15!important;
  pointer-events:none!important;
  cursor:default!important;
  transform:none!important;
}
.forge-scale-page .forge-feedback{
  min-height:34px!important;
  margin:2px 0 12px!important;
  padding:7px 12px!important;
  font-size:14px!important;
}
.forge-scale-page .forge-action-bar{
  grid-template-columns:minmax(190px,auto) 1fr auto!important;
  gap:14px!important;
  padding:12px 14px!important;
  border-radius:18px!important;
}
.forge-scale-page .forge-action-bar span{
  font-size:15px!important;
}
.forge-scale-page .forge-action-bar span img{
  width:24px!important;
  height:24px!important;
}
.forge-scale-page .forge-fill-track{
  height:10px!important;
}
.forge-scale-page .forge-button{
  min-height:48px!important;
  border-radius:16px!important;
  padding:0 22px!important;
  font-size:17px!important;
}
.forge-scale-page .forge-button img{
  width:24px!important;
  height:24px!important;
}
.forge-scale-page .forge-right-col{
  gap:16px!important;
}
.forge-scale-page .forge-dragon-card{
  height:320px!important;
  padding:12px!important;
  border-radius:24px!important;
}
.forge-scale-page .forge-dragon-card img{
  border-radius:20px!important;
  object-fit:cover!important;
  object-position:center!important;
}
.forge-scale-page .combined-armor-card{
  border-radius:24px!important;
  padding:20px!important;
}
.forge-scale-page .combined-armor-card h2{
  margin-bottom:8px!important;
  font-size:22px!important;
}
.forge-scale-page .combined-armor-card p{
  font-size:14px!important;
  line-height:1.35!important;
}
.forge-scale-page .armor-progress-count{
  font-size:18px;
  font-weight:900;
  color:#6546f3;
  margin-top:10px;
}
.forge-scale-page .armor-progress-bar{
  margin:8px 0 16px!important;
}
.forge-scale-page .armor-progress-bar div{
  height:10px!important;
}
.forge-scale-page .armor-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.forge-scale-page .armor-item{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  padding:8px 10px;
  border-radius:14px;
  background:#fbfaff;
  border:1px solid rgba(124,92,255,.12);
}
.forge-scale-page .armor-item--full{
  grid-column:1 / -1;
}
.forge-scale-page .armor-item img{
  width:26px;
  height:26px;
  object-fit:contain;
  flex-shrink:0;
}
.forge-scale-page .armor-item-label{
  font-size:12px;
  font-weight:800;
  color:#7358f5;
  white-space:nowrap;
}
.forge-scale-page .armor-item b{
  margin-left:auto;
  color:#16a34a;
  font-size:16px;
}
.forge-scale-page .armor-item--locked{
  opacity:.55;
}
.forge-scale-page .armor-item--unlocked{
  opacity:1;
  border-color:rgba(92,211,111,.45);
  background:#f4fff6;
}
@media(max-width:1280px){
  .forge-scale-page .forge-game-shell{
    grid-template-columns:260px minmax(0,1fr)!important;
  }
  .forge-scale-page .forge-right-col{
    grid-column:1/-1;
    display:grid!important;
    grid-template-columns:1fr 1fr;
  }
}
@media(max-width:860px){
  .forge-scale-page .forge-game-shell{
    grid-template-columns:1fr!important;
    padding:18px 14px!important;
  }
  .forge-scale-page .forge-right-col{
    display:flex!important;
  }
  .forge-scale-page .forge-action-bar{
    grid-template-columns:1fr!important;
  }
  .forge-scale-page .forge-answer-slot{
    width:clamp(30px,var(--slot-size,42px),46px)!important;
    height:clamp(30px,var(--slot-size,42px),46px)!important;
    min-width:clamp(30px,var(--slot-size,42px),46px)!important;
  }
  .forge-scale-page .forge-letter-tile{
    width:clamp(32px,var(--tile-size,44px),48px)!important;
    height:clamp(32px,var(--tile-size,44px),48px)!important;
    min-width:clamp(32px,var(--tile-size,44px),48px)!important;
  }
}

/* Shared compact game layout: visual left, board center, rewards right. */
.hatchelite-game-page .how-panel{
  display:none!important;
}
.hatchelite-game-page .game-how-button{
  height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0 16px;
  border-radius:999px;
  border:1px solid rgba(124,92,255,.28);
  background:#fff;
  color:#6546f3;
  font:900 15px/1 "Nunito Sans", Inter, sans-serif;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(82,64,160,.08);
  transition:transform 180ms ease,background 180ms ease;
}
.hatchelite-game-page .game-how-button svg{
  width:19px;
  height:19px;
  stroke:currentColor;
  stroke-width:2.2;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.hatchelite-game-page .game-how-button:hover{
  background:#f5f1ff;
  transform:translateY(-1px);
}
.stoke-stat-row,.forge-stat-row,.flight-stat-row,.hatchery-stat-row,.term-stat-row,.whisper-stat-row{
  gap:14px!important;
  margin-top:18px!important;
}
.stoke-stat-pill,.forge-stat-pill,.flight-stat-pill,.hatchery-stat-pill,.term-stat-pill,.whisper-stat-pill{
  min-height:44px!important;
  min-width:auto!important;
  padding:7px 16px!important;
  font-size:15px!important;
}
.stoke-stat-pill>img,.forge-stat-pill>img,.flight-stat-pill>img,.hatchery-stat-pill>img,.term-stat-pill>img,.whisper-stat-pill>img{
  width:26px!important;
  height:26px!important;
}
.stoke-stat-pill strong,.forge-stat-pill strong,.flight-stat-pill strong,.hatchery-stat-pill strong,.term-stat-pill strong,.whisper-stat-pill strong{
  font-size:18px!important;
}
.stoke-stat-pill em img,.forge-stat-pill em img,.flight-stat-pill em img,.hatchery-stat-pill em img,.term-stat-pill em img{
  width:18px!important;
  height:18px!important;
}
.stoke-game-shell,.forge-game-shell,.flight-game-shell,.hatchery-game-shell,.term-game-shell,.whisper-game-shell{
  display:grid!important;
  grid-template-columns:300px minmax(640px,1fr) 320px!important;
  gap:24px!important;
  align-items:start!important;
  max-width:1500px!important;
  margin:28px auto 0!important;
  padding:0 28px 40px!important;
}
.stoke-left-col,.forge-left-col,.flight-left-col,.hatchery-left-col,.term-left-col,.whisper-left-col,
.stoke-right-col,.forge-right-col,.flight-right-col,.hatchery-right-col,.term-right-col,.whisper-right-col{
  display:flex!important;
  flex-direction:column!important;
  gap:16px!important;
  align-content:start!important;
}
.stoke-main-col,.forge-main-col,.flight-main-col,.hatchery-main-col,.term-main-col,.whisper-main-col{
  min-width:0!important;
}
.stoke-right-col>.stoke-dragon-card:not(.game-visual-card),
.forge-right-col>.forge-dragon-card:not(.game-visual-card),
.flight-right-col>.flight-dragon-card:not(.game-visual-card),
.hatchery-right-col>.hatchery-dragon-card:not(.game-visual-card),
.term-right-col>.term-dragon-card:not(.game-visual-card),
.whisper-right-col>.whisper-dragon-card:not(.game-visual-card){
  display:none!important;
}
.hatchelite-game-page .game-visual-card{
  display:block!important;
  height:auto!important;
  min-height:0!important;
  padding:12px!important;
  border-radius:24px!important;
  background:#fff!important;
  border:1px solid rgba(124,92,255,.16)!important;
  box-shadow:0 16px 36px rgba(82,64,160,.08)!important;
  overflow:hidden!important;
}
.hatchelite-game-page .game-visual-card img{
  width:100%!important;
  height:320px!important;
  display:block!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:20px!important;
  background:#f7f3ff!important;
}
.hatchelite-game-page .reward-visual-card{
  position:relative!important;
}
.hatchelite-game-page .reward-visual-card>img{
  position:relative;
  z-index:1;
  transition:filter .22s ease, transform .28s ease;
}
.hatchelite-game-page .reward-visual-card.is-revealing>img{
  animation:rewardRevealPop 1180ms ease both;
}
.reward-css-glow{
  position:absolute;
  inset:16px;
  z-index:0;
  border-radius:22px;
  background:radial-gradient(circle at 50% 48%,rgba(124,92,255,.32),rgba(255,255,255,0) 66%);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
}
.reward-visual-card.is-revealing .reward-css-glow{
  opacity:1;
  animation:rewardGlowPulse 1180ms ease both;
}
.reward-fx-video{
  position:absolute;
  inset:12px;
  z-index:3;
  width:calc(100% - 24px);
  height:calc(100% - 24px);
  border-radius:20px;
  object-fit:cover;
  mix-blend-mode:screen;
  pointer-events:none;
}
.reward-fx-glow{opacity:.72}
.reward-fx-flash{opacity:.86}
.reward-fx-sparkle,.reward-fx-notes,.reward-fx-lightTrail,.reward-fx-eggCrack{opacity:.9}
.reward-fx-lightning{opacity:.95}
.reward-image-fallback{
  min-height:320px;
  display:grid;
  place-items:center;
  border-radius:20px;
  background:linear-gradient(180deg,#fbf9ff,#f1ecff);
  color:#6047dd;
  font-weight:900;
  text-align:center;
}
.dragon-song-button{
  position:absolute;
  right:22px;
  bottom:22px;
  z-index:5;
  border:1px solid rgba(124,92,255,.24);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:#5c43db;
  box-shadow:0 10px 24px rgba(82,64,160,.16);
  padding:8px 12px;
  font-weight:850;
  font-size:12px;
  line-height:1;
  cursor:pointer;
}
.dragon-song-button span{
  display:inline-grid;
  place-items:center;
  width:18px;
  height:18px;
  margin-right:5px;
  border-radius:50%;
  background:#eee9ff;
}
@keyframes rewardRevealPop{
  0%{filter:brightness(1) saturate(1);transform:scale(1)}
  35%{filter:brightness(1.2) saturate(1.2);transform:scale(1.015)}
  62%{filter:brightness(1.42) saturate(1.28);transform:scale(1.035)}
  100%{filter:brightness(1) saturate(1);transform:scale(1)}
}
@keyframes rewardGlowPulse{
  0%{opacity:0;transform:scale(.96)}
  35%{opacity:.95;transform:scale(1.04)}
  100%{opacity:0;transform:scale(1.1)}
}
.stoke-panel,.forge-panel,.flight-panel,.hatchery-panel,.term-panel,.whisper-panel{
  padding:18px!important;
  border-radius:24px!important;
}
.stoke-encouragement,.flight-reward-card,.term-reward-card,.whisper-reward-card{
  padding:16px!important;
  border-radius:20px!important;
}
.dragon-flight-page .flight-board{
  min-height:auto!important;
  padding:22px!important;
}
.dragon-flight-page .flight-path{
  height:96px!important;
  margin:2px auto 14px!important;
}
.dragon-flight-page .flight-challenge-label{
  font-size:20px!important;
}
.dragon-flight-page .flight-sentence-card{
  margin:12px auto 14px!important;
  padding:16px 18px!important;
  border-radius:20px!important;
}
.dragon-flight-page .flight-sentence-card p{
  font-size:21px!important;
  line-height:1.36!important;
}
.dragon-flight-page .flight-choice-grid{
  gap:12px!important;
  margin-bottom:14px!important;
}
.dragon-flight-page .flight-answer-card{
  min-height:82px!important;
  padding:12px 14px!important;
  border-radius:18px!important;
  grid-template-columns:34px 34px 1fr!important;
}
.dragon-flight-page .flight-answer-card span,
.dragon-flight-page .flight-answer-card img{
  width:32px!important;
  height:32px!important;
}
.dragon-flight-page .flight-answer-card b{
  font-size:18px!important;
}
.dragon-flight-page .send-soaring-button{
  min-height:52px!important;
  font-size:18px!important;
}
.dragon-flight-page .send-soaring-button img{
  width:32px!important;
  height:24px!important;
}
.reward-progress,.forge-scale-page .armor-grid,.hatchling-collection{
  gap:8px!important;
}
.hatchling-collection span{
  min-height:82px!important;
  padding:8px!important;
}
.hatchling-collection img{
  width:46px!important;
  height:46px!important;
}
.game-how-backdrop{
  position:fixed;
  inset:0;
  z-index:80;
  display:grid;
  place-items:center;
  padding:22px;
  background:rgba(11,14,48,.36);
  backdrop-filter:blur(4px);
}
.game-how-modal{
  position:relative;
  width:min(460px,94vw);
  border-radius:26px;
  background:#fff;
  border:1px solid rgba(124,92,255,.18);
  box-shadow:0 28px 80px rgba(26,18,84,.28);
  padding:26px;
  color:#17205a;
}
.game-how-modal h2{
  margin:0 0 16px;
  color:#6546f3;
  font-size:28px;
  font-weight:1000;
}
.game-how-modal ol{
  margin:0;
  padding-left:24px;
  display:grid;
  gap:10px;
}
.game-how-modal li{
  font-size:16px;
  line-height:1.35;
  font-weight:750;
}
.game-how-modal p{
  margin:16px 0 0;
  padding:12px 14px;
  border-radius:16px;
  background:#f7f4ff;
  color:#38436d;
  font-size:14px;
  line-height:1.35;
}
.game-how-close{
  position:absolute;
  right:14px;
  top:12px;
  width:34px;
  height:34px;
  border:0;
  border-radius:50%;
  background:#f4f0ff;
  color:#6546f3;
  font-size:24px;
  font-weight:900;
  cursor:pointer;
}
@media(max-width:1100px){
  .stoke-game-shell,.forge-game-shell,.flight-game-shell,.hatchery-game-shell,.term-game-shell,.whisper-game-shell{
    grid-template-columns:1fr!important;
    padding:0 22px 36px!important;
  }
  .stoke-main-col,.forge-main-col,.flight-main-col,.hatchery-main-col,.term-main-col,.whisper-main-col{
    order:1;
  }
  .stoke-right-col,.forge-right-col,.flight-right-col,.hatchery-right-col,.term-right-col,.whisper-right-col{
    order:2;
  }
  .stoke-left-col,.forge-left-col,.flight-left-col,.hatchery-left-col,.term-left-col,.whisper-left-col{
    order:3;
  }
  .hatchelite-game-page .game-visual-card img{
    height:280px!important;
  }
}
@media(max-width:640px){
  .stoke-game-shell,.forge-game-shell,.flight-game-shell,.hatchery-game-shell,.term-game-shell,.whisper-game-shell{
    padding:0 16px 32px!important;
    gap:18px!important;
  }
  .hatchelite-game-page .game-visual-card img{
    height:240px!important;
  }
  .hatchelite-game-page .game-how-button{
    width:auto!important;
  }
  .game-how-modal{
    padding:22px 18px;
  }
}

/* Shared game layout follow-up: left visual + compact hint, right controls + rewards. */
.hatchelite-game-page .game-visual-card{
  padding:10px!important;
}
.hatchelite-game-page .game-visual-card img{
  height:350px!important;
  object-fit:cover!important;
  object-position:center!important;
  transform:scale(1.06);
  transform-origin:center;
  background:#f7f3ff!important;
}
.hatchelite-game-page .hint-panel{
  padding:14px 16px!important;
  border-radius:20px!important;
}
.hatchelite-game-page .hint-panel h2{
  margin:0 0 8px!important;
  font-size:18px!important;
  gap:8px!important;
}
.hatchelite-game-page .hint-panel p{
  margin:0 0 10px!important;
  font-size:13px!important;
  line-height:1.32!important;
  font-weight:650!important;
}
.stoke-hint-button,.forge-hint-button,.flight-hint-button,.hatchery-hint-button,.term-hint-button,.whisper-hint-button{
  min-height:42px!important;
  margin-top:10px!important;
  border-radius:16px!important;
  font-size:14px!important;
  gap:10px!important;
}
.stoke-hint-button b,.forge-hint-button b,.flight-hint-button b,.hatchery-hint-button b,.term-hint-button b,.whisper-hint-button b{
  width:26px!important;
  height:26px!important;
  font-size:13px!important;
}
.stoke-word-list-button,.forge-word-list-button,.flight-word-list-button,.hatchery-word-list-button,.term-word-list-button,.whisper-word-list-button{
  min-height:42px!important;
  border-radius:16px!important;
  font-size:14px!important;
}
.stoke-right-col .game-practice-controls,
.forge-right-col .game-practice-controls,
.flight-right-col .game-practice-controls,
.hatchery-right-col .game-practice-controls,
.term-right-col .game-practice-controls,
.whisper-right-col .game-practice-controls{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:14px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:10px!important;
  align-items:stretch!important;
  justify-content:stretch!important;
  border-radius:22px!important;
  background:#fff!important;
  border:1px solid rgba(124,92,255,.16)!important;
  box-shadow:0 16px 36px rgba(82,64,160,.08)!important;
}
.stoke-right-col .game-practice-controls label,
.forge-right-col .game-practice-controls label,
.flight-right-col .game-practice-controls label,
.hatchery-right-col .game-practice-controls label,
.term-right-col .game-practice-controls label,
.whisper-right-col .game-practice-controls label{
  width:100%!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:7px!important;
  font-size:13px!important;
}
.stoke-right-col .game-practice-controls select,
.forge-right-col .game-practice-controls select,
.flight-right-col .game-practice-controls select,
.hatchery-right-col .game-practice-controls select,
.term-right-col .game-practice-controls select,
.whisper-right-col .game-practice-controls select{
  width:100%!important;
  min-width:0!important;
  height:36px!important;
}
.stoke-right-col .game-practice-controls button,
.forge-right-col .game-practice-controls button,
.flight-right-col .game-practice-controls button,
.hatchery-right-col .game-practice-controls button,
.term-right-col .game-practice-controls button,
.whisper-right-col .game-practice-controls button{
  width:100%!important;
  height:38px!important;
  border-radius:14px!important;
}
.stoke-right-col .game-practice-controls small,
.forge-right-col .game-practice-controls small,
.flight-right-col .game-practice-controls small,
.hatchery-right-col .game-practice-controls small,
.term-right-col .game-practice-controls small,
.whisper-right-col .game-practice-controls small{
  font-size:11px!important;
  line-height:1.25!important;
}
@media(max-width:1100px){
  .hatchelite-game-page .game-visual-card img{
    height:300px!important;
  }
}
@media(max-width:640px){
  .hatchelite-game-page .game-visual-card img{
    height:250px!important;
    transform:scale(1.03);
  }
}

/* Dragon's Whisper typing cleanup and light HatchElite background. */
.dragons-whisper-page{
  background:
    radial-gradient(circle at 20% 12%, rgba(124,92,255,.08), transparent 28%),
    radial-gradient(circle at 80% 18%, rgba(255,214,102,.10), transparent 24%),
    linear-gradient(180deg,#ffffff 0%,#f8f6ff 48%,#f5f2ff 100%)!important;
  color:#070b3f!important;
  overflow-x:hidden!important;
}
.dragons-whisper-page:before{
  opacity:.055!important;
}
.dragons-whisper-page .sound-wave-bg{
  display:none!important;
}
.dragons-whisper-page .speaker-button{
  width:118px!important;
  height:118px!important;
  border:5px solid rgba(255,255,255,.9)!important;
  background:linear-gradient(180deg,#8f5cff 0%,#5f44f3 100%)!important;
  color:#fff!important;
  box-shadow:0 18px 40px rgba(92,70,255,.25),0 0 0 10px rgba(255,255,255,.62)!important;
}
.dragons-whisper-page .speaker-button svg{
  width:58px;
  height:58px;
  stroke:currentColor;
  stroke-width:2;
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.dragons-whisper-page .speaker-button img{
  display:none!important;
}
.dragons-whisper-page .speaker-caption{
  margin-bottom:16px!important;
  font-size:15px!important;
}
.dragons-whisper-page .whisper-board{
  min-height:auto!important;
  padding:24px!important;
}
.dragons-whisper-page .whisper-input-area{
  margin:14px auto 12px!important;
}
.dragons-whisper-page .whisper-hidden-input{
  position:absolute!important;
  opacity:0!important;
  pointer-events:none!important;
  width:1px!important;
  height:1px!important;
}
.dragons-whisper-page .whisper-letter-boxes{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:9px!important;
  max-width:850px!important;
  margin:0 auto!important;
  cursor:text!important;
}
.dragons-whisper-page .whisper-letter-box{
  width:54px!important;
  height:54px!important;
  border-radius:14px!important;
  border:2px solid rgba(124,92,255,.35)!important;
  background:#fff!important;
  background-image:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:28px!important;
  font-weight:900!important;
  color:#070b3f!important;
  line-height:1!important;
  text-transform:uppercase!important;
  box-shadow:0 6px 14px rgba(92,70,255,.08)!important;
  filter:none!important;
}
.dragons-whisper-page .whisper-letter-box--filled{
  border-color:#7b5cff!important;
  background:#f7f3ff!important;
}
.dragons-whisper-page .whisper-letter-box--hint{
  border-color:#f5b942!important;
  background:#fff8e8!important;
  color:#2b2260!important;
}
.dragons-whisper-page .whisper-letter-box--correct{
  border-color:#41c96b!important;
  background:#f0fff4!important;
}
.dragons-whisper-page .whisper-letter-box--incorrect{
  border-color:#ef476f!important;
  background:#fff0f4!important;
}
.dragons-whisper-page .whisper-letter-box--active{
  position:relative!important;
  border-color:#5f45f4!important;
  background:#fff!important;
  box-shadow:0 0 0 5px rgba(124,92,255,.13),0 12px 24px rgba(92,70,255,.18)!important;
  animation:whisper-active-pulse 1.05s ease-in-out infinite!important;
}
.dragons-whisper-page .whisper-letter-box--active::after{
  content:"";
  position:absolute;
  right:10px;
  top:50%;
  width:2px;
  height:58%;
  border-radius:999px;
  background:#5f45f4;
  transform:translateY(-50%);
  animation:whisper-cursor-blink .9s steps(2,start) infinite;
}
.dragons-whisper-page .whisper-letter-box--active.whisper-letter-box--filled::after{
  right:7px;
  height:48%;
}
.dragons-whisper-page .whisper-type-helper{
  display:block;
  margin-top:9px;
  color:#6b6494;
  font-size:13px;
  font-weight:800;
  text-align:center;
}
.dragons-whisper-page .whisper-type-helper.ready{
  color:#5b43e8;
}
@keyframes whisper-active-pulse{
  0%,100%{transform:translateY(0);box-shadow:0 0 0 4px rgba(124,92,255,.12),0 10px 22px rgba(92,70,255,.16)}
  50%{transform:translateY(-2px);box-shadow:0 0 0 7px rgba(124,92,255,.2),0 16px 30px rgba(92,70,255,.22)}
}
@keyframes whisper-cursor-blink{
  0%,45%{opacity:1}
  46%,100%{opacity:0}
}
.dragons-whisper-page .whisper-actions{
  gap:10px!important;
  margin:10px 0 12px!important;
}
.dragons-whisper-page .listen-again-button,
.dragons-whisper-page .reset-whisper-button,
.dragons-whisper-page .translate-whisper-button{
  min-height:42px!important;
  border:1.5px solid rgba(124,92,255,.28)!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#6546f3!important;
  font-size:15px!important;
  font-weight:1000!important;
  padding:10px 18px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  cursor:pointer!important;
}
.dragons-whisper-page .translate-whisper-button.primary-whisper-submit{
  min-width:230px!important;
  border-color:transparent!important;
  background:linear-gradient(180deg,#7657ff 0%,#5539df 100%)!important;
  color:#fff!important;
  box-shadow:0 12px 24px rgba(88,59,222,.24)!important;
}
.dragons-whisper-page .translate-whisper-button.primary-whisper-submit:disabled{
  opacity:.55!important;
  cursor:not-allowed!important;
  box-shadow:none!important;
}
.dragons-whisper-page .listen-again-button img,
.dragons-whisper-page .translate-whisper-button img{
  display:none!important;
}
.dragons-whisper-page .send-whisper-button{
  min-width:260px!important;
  padding:15px 26px!important;
  font-size:19px!important;
}
@media(max-width:560px){
  .dragons-whisper-page .whisper-letter-box{
    width:43px!important;
    height:43px!important;
    font-size:22px!important;
  }
  .dragons-whisper-page .whisper-actions{
    display:grid!important;
  }
  .dragons-whisper-page .send-whisper-button{
    width:100%!important;
    min-width:0!important;
  }
}

/* Term & Definition Match cleanup: compact Pic 2 layout and simple connection UI. */
.term-definition-page{
  overflow-x:hidden!important;
}
.term-definition-page .he-game-topbar,
.term-definition-page .term-title-block,
.term-definition-page .term-game-shell{
  max-width:1540px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.term-title-block{
  padding:24px 32px 8px!important;
}
.term-title-block h1{
  font-size:clamp(42px,5vw,68px)!important;
  line-height:1.05!important;
  letter-spacing:-.02em!important;
}
.term-title-block p{
  margin-top:10px!important;
  font-size:18px!important;
  line-height:1.35!important;
  font-weight:600!important;
}
.term-stat-row{
  margin-top:20px!important;
  gap:22px!important;
}
.term-stat-pill{
  min-height:48px!important;
  padding:7px 20px!important;
  font-size:16px!important;
}
.term-stat-pill>img{
  width:30px!important;
  height:30px!important;
}
.term-stat-pill strong{
  font-size:20px!important;
}
.term-stat-pill em img{
  width:18px!important;
  height:18px!important;
}
.term-game-shell{
  grid-template-columns:270px minmax(680px,1fr) 330px!important;
  gap:28px!important;
  align-items:start!important;
  padding:24px 32px 40px!important;
  overflow-x:hidden!important;
}
.term-left-col,
.term-right-col{
  gap:18px!important;
}
.term-panel{
  border-radius:24px!important;
  padding:24px!important;
}
.term-panel h2{
  font-size:22px!important;
  margin-bottom:12px!important;
}
.term-step{
  grid-template-columns:36px 34px 1fr!important;
  gap:12px!important;
  padding:14px 0!important;
}
.term-step b{
  width:34px!important;
  height:34px!important;
  font-size:16px!important;
}
.term-step i{
  font-size:23px!important;
}
.term-step p,
.term-panel p{
  font-size:15px!important;
  line-height:1.4!important;
}
.term-hint-button,
.term-word-list-button{
  min-height:52px!important;
  border-radius:18px!important;
  font-size:16px!important;
}
.term-board{
  min-height:0!important;
  padding:22px!important;
  border-radius:24px!important;
  overflow:hidden!important;
}
.term-board-head{
  display:none!important;
}
.term-board-head{
  margin-bottom:16px!important;
  padding:11px 16px!important;
  border-radius:16px!important;
}
.term-board-head b{
  font-size:22px!important;
}
.term-board-head span{
  font-size:14px!important;
}
.term-columns{
  grid-template-columns:minmax(240px,1fr) minmax(290px,1.15fr)!important;
  gap:74px!important;
}
.term-column,
.definition-column{
  gap:11px!important;
}
.term-column h2,
.definition-column h2{
  font-size:21px!important;
  margin-bottom:6px!important;
}
.term-card,
.definition-card{
  min-height:66px!important;
  border-radius:16px!important;
  box-shadow:0 8px 18px rgba(75,55,180,.07)!important;
}
.term-card{
  padding:12px 12px 12px 18px!important;
}
.definition-card{
  grid-template-columns:34px 1fr!important;
  gap:10px!important;
  padding:12px 16px 12px 10px!important;
}
.term-card b{
  font-size:19px!important;
}
.term-card small{
  font-size:12px!important;
}
.definition-card span{
  font-size:14px!important;
  line-height:1.32!important;
  font-weight:700!important;
}
.connection-circle{
  width:24px!important;
  height:24px!important;
  filter:none!important;
}
.term-card.selected{
  background:#fbf8ff!important;
  border-color:#7c4dff!important;
  box-shadow:0 0 0 3px rgba(124,77,255,.14),0 10px 20px rgba(99,56,245,.12)!important;
}
.term-card.matched,
.definition-card.matched{
  background:#f7f1ff!important;
  border-color:rgba(124,77,255,.66)!important;
  box-shadow:0 0 0 3px rgba(124,77,255,.12),0 8px 18px rgba(75,55,180,.08)!important;
}
.term-card.match-color-1,
.definition-card.match-color-1{
  background:#f4f0ff!important;
  border-color:#7b5cff!important;
}
.term-card.match-color-2,
.definition-card.match-color-2{
  background:#eef6ff!important;
  border-color:#5da7ff!important;
}
.term-card.match-color-3,
.definition-card.match-color-3{
  background:#f0fff4!important;
  border-color:#41c96b!important;
}
.term-card.match-color-4,
.definition-card.match-color-4{
  background:#fff8e8!important;
  border-color:#f5b942!important;
}
.term-card.match-color-5,
.definition-card.match-color-5{
  background:#fff0f7!important;
  border-color:#f472b6!important;
}
.term-card.matched,
.definition-card.matched{
  color:#111a4d!important;
  opacity:1!important;
}
.term-card.matched .connection-circle,
.definition-card.matched .connection-circle{
  filter:none!important;
  opacity:1!important;
}
.match-badge{
  display:inline-grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  margin-right:9px!important;
  border-radius:50%!important;
  background:#7b5cff!important;
  color:#fff!important;
  font-style:normal!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:900!important;
  vertical-align:middle!important;
}
.match-color-2 .match-badge{background:#5da7ff!important}
.match-color-3 .match-badge{background:#41c96b!important}
.match-color-4 .match-badge{background:#f5b942!important;color:#352400!important}
.match-color-5 .match-badge{background:#f472b6!important}
.definition-card .match-badge{
  margin-right:8px!important;
}
.term-connection-svg{
  display:none!important;
}
.term-connection-path{
  display:none!important;
}
.term-preview-path,
.term-effect.wrong-effect{
  display:none!important;
}
.term-feedback{
  min-height:38px!important;
  margin-top:14px!important;
  padding:8px 12px!important;
  border-radius:14px!important;
  font-size:14px!important;
}
.term-board-actions{
  display:flex!important;
  justify-content:space-between!important;
  gap:20px!important;
  margin-top:18px!important;
}
.term-reset-button,
.term-check-button{
  min-height:52px!important;
  border-radius:16px!important;
  font-size:16px!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.term-reset-button{
  width:210px!important;
  border:1.5px solid #7c4dff!important;
  background:#fff!important;
  color:#6c45ed!important;
}
.term-check-button{
  flex:1!important;
  max-width:330px!important;
  border:0!important;
  background:linear-gradient(135deg,#7c4dff,#4f2de6)!important;
  color:#fff!important;
  box-shadow:0 14px 28px rgba(99,56,245,.22)!important;
}
.term-dragon-card{
  height:240px!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
.term-dragon-card img{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
}
.treasure-progress-card.treasure-rewards-card{
  padding:20px!important;
  border-radius:22px!important;
  text-align:left!important;
}
.treasure-progress-card.treasure-rewards-card h2{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin-bottom:10px!important;
  font-size:22px!important;
}
.treasure-progress-card.treasure-rewards-card h2 img{
  width:28px!important;
  height:28px!important;
  object-fit:contain!important;
}
.treasure-progress-card.treasure-rewards-card p{
  margin:0 0 16px!important;
  text-align:left!important;
  font-size:14px!important;
}
.term-reward-path{
  position:relative!important;
  display:grid!important;
  grid-template-columns:repeat(5,1fr)!important;
  gap:8px!important;
  align-items:end!important;
  margin:4px 0 12px!important;
}
.term-reward-path:before{
  content:""!important;
  position:absolute!important;
  left:10%!important;
  right:10%!important;
  bottom:14px!important;
  height:2px!important;
  background:#d9d2ff!important;
  z-index:0!important;
}
.term-reward-path span{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  justify-items:center!important;
  gap:5px!important;
}
.term-reward-path img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
.term-reward-path .chest-step img{
  width:44px!important;
  height:44px!important;
}
.term-reward-path b{
  display:grid!important;
  place-items:center!important;
  width:26px!important;
  height:26px!important;
  border-radius:50%!important;
  background:#6c45ed!important;
  color:#fff!important;
  font-size:13px!important;
  line-height:1!important;
}
.term-reward-path span:not(.done){
  opacity:.72!important;
}
.term-progress-bar{
  height:10px!important;
}
.term-reward-card{
  border-radius:20px!important;
  padding:16px!important;
  align-items:center!important;
}
.term-reward-card img{
  width:46px!important;
  height:46px!important;
}
.term-reward-card span{
  display:grid!important;
  gap:3px!important;
  font-size:14px!important;
}
.term-reward-card span b{
  color:#6c45ed!important;
  font-size:18px!important;
}
@media(max-width:1280px){
  .term-game-shell{
    grid-template-columns:250px minmax(620px,1fr) 300px!important;
    gap:22px!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }
  .term-columns{
    gap:52px!important;
  }
}
@media(max-width:1080px){
  .term-game-shell{
    grid-template-columns:1fr!important;
  }
  .term-right-col{
    grid-template-columns:1fr 1fr!important;
  }
  .term-dragon-card{
    height:260px!important;
  }
}
@media(max-width:700px){
  .term-title-block{
    padding:22px 16px 8px!important;
  }
  .term-game-shell{
    padding:18px 14px 34px!important;
  }
  .term-columns,
  .term-right-col{
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  .term-connection-svg{
    display:none!important;
  }
  .term-board-actions{
    flex-direction:column!important;
  }
  .term-reset-button,
  .term-check-button{
    width:100%!important;
    max-width:none!important;
  }
}
@keyframes term-simple-line-in{
  from{opacity:0}
  to{opacity:1}
}

/* FINAL HOME PAGE OVERRIDE: clean vertical cards with divider and stacked feature strip. */
#homePage .home-product-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}
#homePage .product-card.exam-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
  min-height:420px!important;
  height:100%!important;
  padding:22px 20px 18px!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
#homePage .product-card .mascot-wrap.image-mascot{
  order:1!important;
  width:142px!important;
  height:142px!important;
  margin:0 auto 12px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at center, #fff 0%, #f8f6ff 72%, #f1edff 100%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
  filter:drop-shadow(0 10px 16px rgba(58,44,130,.08))!important;
  align-self:center!important;
}
#homePage .product-card .mascot-wrap.image-mascot:after{
  display:none!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:130px!important;
  height:130px!important;
  object-fit:contain!important;
  display:block!important;
  transform:scale(1.12)!important;
}
#homePage .product-card .exam-copy{
  order:2!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:100%!important;
  height:auto!important;
  flex:1 1 auto!important;
  padding:0!important;
  text-align:center!important;
}
#homePage .product-card .exam-copy h2{
  width:100%!important;
  margin:0 0 12px!important;
  color:#101b52!important;
  font-size:22px!important;
  line-height:1.08!important;
  font-weight:950!important;
  letter-spacing:-.01em!important;
  text-align:center!important;
}
#homePage .product-card .exam-copy h2:after{
  content:""!important;
  display:block!important;
  width:88%!important;
  height:1px!important;
  margin:12px auto 0!important;
  background:linear-gradient(to right, transparent, rgba(190,181,230,.68), transparent)!important;
}
#homePage .product-card .exam-copy p{
  max-width:90%!important;
  margin:0 auto 14px!important;
  color:#4e587d!important;
  font-size:13px!important;
  line-height:1.4!important;
  font-weight:500!important;
  text-align:center!important;
}
#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px!important;
  width:100%!important;
  margin:0 auto 16px!important;
}
#homePage .product-card .chips span{
  min-width:0!important;
  padding:5px 12px!important;
  border-radius:999px!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:850!important;
}
#homePage .product-card .primary-wide{
  order:3!important;
  position:static!important;
  grid-column:auto!important;
  grid-row:auto!important;
  align-self:center!important;
  justify-self:auto!important;
  width:calc(100% - 16px)!important;
  max-width:none!important;
  min-height:46px!important;
  height:46px!important;
  margin:auto 0 0!important;
  border-radius:14px!important;
  font-size:14px!important;
  font-weight:900!important;
}
#homePage .home-strip.feature-strip{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;
  min-height:160px!important;
  margin-top:26px!important;
  padding:20px 18px!important;
  align-items:stretch!important;
  overflow:visible!important;
}
#homePage .home-strip .feature{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:0!important;
  min-height:0!important;
  padding:12px 14px!important;
  text-align:center!important;
  border-right:1px solid #e8e4f4!important;
  border-bottom:0!important;
}
#homePage .home-strip .feature:last-child{
  border-right:0!important;
}
#homePage .home-strip .feature-icon-circle{
  width:72px!important;
  height:72px!important;
  margin:0 auto 10px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at center, #fff 0%, #f5f1ff 72%, #eee8ff 100%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
}
#homePage .home-strip .feature-icon-circle img{
  width:58px!important;
  height:58px!important;
  object-fit:contain!important;
  display:block!important;
}
#homePage .home-strip .feature-text{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
}
#homePage .home-strip .feature-text h3{
  margin:0 0 6px!important;
  color:#16245c!important;
  font-size:16px!important;
  line-height:1.1!important;
  font-weight:900!important;
  text-align:center!important;
}
#homePage .home-strip .feature-text p{
  margin:0!important;
  color:#4e587d!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:500!important;
  text-align:center!important;
}
@media(max-width:1024px){
  #homePage .home-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #homePage .home-strip.feature-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #homePage .home-strip .feature{
    border-right:0!important;
    border-bottom:1px solid #e8e4f4!important;
  }
  #homePage .home-strip .feature:nth-child(odd){
    border-right:1px solid #e8e4f4!important;
  }
  #homePage .home-strip .feature:last-child{
    border-bottom:0!important;
  }
}
@media(max-width:640px){
  #homePage .home-product-grid,
  #homePage .home-strip.feature-strip{
    grid-template-columns:1fr!important;
  }
  #homePage .product-card.exam-card{
    min-height:0!important;
    padding:20px 16px 16px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    width:132px!important;
    height:132px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:120px!important;
    height:120px!important;
  }
  #homePage .product-card .primary-wide{
    width:100%!important;
  }
  #homePage .home-strip .feature,
  #homePage .home-strip .feature:nth-child(odd){
    border-right:0!important;
  }
}

/* Final dragon image cleanup: hide PNG square edges inside the home cards. */
#homePage .product-card .mascot-wrap.image-mascot{
  background:transparent!important;
  overflow:visible!important;
  filter:drop-shadow(0 12px 18px rgba(42,34,105,.12))!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  border-radius:50%!important;
  -webkit-mask-image:radial-gradient(circle at center, #000 0 62%, rgba(0,0,0,.9) 70%, transparent 82%)!important;
  mask-image:radial-gradient(circle at center, #000 0 62%, rgba(0,0,0,.9) 70%, transparent 82%)!important;
  mix-blend-mode:multiply!important;
}

/* Home card button text size. */
#homePage .product-card .primary-wide{
  font-size:18px!important;
  font-weight:900!important;
  line-height:1!important;
}

/* Home page final card layout: dragon, title, divider, copy, pills, full-width button. */
#homePage .home-product-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch!important;
}
#homePage .product-card.exam-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
  min-height:420px!important;
  height:100%!important;
  padding:22px 20px 18px!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
#homePage .product-card .mascot-wrap.image-mascot{
  order:1!important;
  width:142px!important;
  height:142px!important;
  margin:0 auto 12px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at center, #fff 0%, #f8f6ff 72%, #f1edff 100%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
  filter:drop-shadow(0 10px 16px rgba(58,44,130,.08))!important;
  align-self:center!important;
}
#homePage .product-card .mascot-wrap.image-mascot:after{
  display:none!important;
}
#homePage .product-card .mascot-wrap.image-mascot img{
  width:130px!important;
  height:130px!important;
  object-fit:contain!important;
  display:block!important;
  transform:scale(1.12)!important;
}
#homePage .product-card .exam-copy{
  order:2!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:100%!important;
  height:auto!important;
  flex:1 1 auto!important;
  padding:0!important;
  text-align:center!important;
}
#homePage .product-card .exam-copy h2{
  width:100%!important;
  margin:0 0 12px!important;
  color:#101b52!important;
  font-size:22px!important;
  line-height:1.08!important;
  font-weight:950!important;
  letter-spacing:-.01em!important;
  text-align:center!important;
}
#homePage .product-card .exam-copy h2:after{
  content:""!important;
  display:block!important;
  width:88%!important;
  height:1px!important;
  margin:12px auto 0!important;
  background:linear-gradient(to right, transparent, rgba(190,181,230,.68), transparent)!important;
}
#homePage .product-card .exam-copy p{
  max-width:90%!important;
  margin:0 auto 14px!important;
  color:#4e587d!important;
  font-size:13px!important;
  line-height:1.4!important;
  font-weight:500!important;
  text-align:center!important;
}
#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px!important;
  width:100%!important;
  margin:0 auto 16px!important;
}
#homePage .product-card .chips span{
  min-width:0!important;
  padding:5px 12px!important;
  border-radius:999px!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:850!important;
}
#homePage .product-card .primary-wide{
  order:3!important;
  position:static!important;
  grid-column:auto!important;
  grid-row:auto!important;
  align-self:center!important;
  justify-self:auto!important;
  width:calc(100% - 16px)!important;
  max-width:none!important;
  min-height:46px!important;
  height:46px!important;
  margin:auto 0 0!important;
  border-radius:14px!important;
  font-size:14px!important;
  font-weight:900!important;
}
#homePage .home-strip.feature-strip{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:0!important;
  min-height:160px!important;
  margin-top:26px!important;
  padding:20px 18px!important;
  align-items:stretch!important;
  overflow:visible!important;
}
#homePage .home-strip .feature{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:0!important;
  min-height:0!important;
  padding:12px 14px!important;
  text-align:center!important;
  border-right:1px solid #e8e4f4!important;
  border-bottom:0!important;
}
#homePage .home-strip .feature:last-child{
  border-right:0!important;
}
#homePage .home-strip .feature-icon-circle{
  width:72px!important;
  height:72px!important;
  margin:0 auto 10px!important;
  border-radius:50%!important;
  background:radial-gradient(circle at center, #fff 0%, #f5f1ff 72%, #eee8ff 100%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:visible!important;
}
#homePage .home-strip .feature-icon-circle img{
  width:58px!important;
  height:58px!important;
  object-fit:contain!important;
  display:block!important;
}
#homePage .home-strip .feature-text{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  text-align:center!important;
}
#homePage .home-strip .feature-text h3{
  margin:0 0 6px!important;
  color:#16245c!important;
  font-size:16px!important;
  line-height:1.1!important;
  font-weight:900!important;
  text-align:center!important;
}
#homePage .home-strip .feature-text p{
  margin:0!important;
  color:#4e587d!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:500!important;
  text-align:center!important;
}
@media(max-width:1024px){
  #homePage .home-product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #homePage .home-strip.feature-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #homePage .home-strip .feature{
    border-right:0!important;
    border-bottom:1px solid #e8e4f4!important;
  }
  #homePage .home-strip .feature:nth-child(odd){
    border-right:1px solid #e8e4f4!important;
  }
  #homePage .home-strip .feature:last-child{
    border-bottom:0!important;
  }
}
@media(max-width:640px){
  #homePage .home-product-grid,
  #homePage .home-strip.feature-strip{
    grid-template-columns:1fr!important;
  }
  #homePage .product-card.exam-card{
    min-height:0!important;
    padding:20px 16px 16px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    width:132px!important;
    height:132px!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:120px!important;
    height:120px!important;
  }
  #homePage .product-card .primary-wide{
    width:100%!important;
  }
  #homePage .home-strip .feature,
  #homePage .home-strip .feature:nth-child(odd){
    border-right:0!important;
  }
}

/* User request: reduce home card wording size only by about 40%. */
#homePage .product-card .exam-copy h2{
  font-size:16px!important;
  line-height:1.08!important;
}
#homePage .product-card .exam-copy p{
  font-size:8px!important;
  line-height:1.35!important;
}
#homePage .product-card .chips span{
  font-size:7px!important;
}

/* Page 1 typography only: match level-card font and reduce wording size. */
.home-page,
.home-page *{
  font-family:'Nunito Sans',sans-serif!important;
}
#homePage .product-card .exam-copy{
  display:flex!important;
  flex-direction:column!important;
  height:100%!important;
}
#homePage .product-card .exam-copy h2{
  font-size:14px!important;
  line-height:1.15!important;
  font-weight:900!important;
  letter-spacing:-.01em!important;
}
#homePage .product-card .exam-copy p{
  font-size:9px!important;
  line-height:1.35!important;
  font-weight:500!important;
}
#homePage .product-card .chips span{
  font-size:8px!important;
  padding:3px 8px!important;
  font-weight:800!important;
}
#homePage .product-card .soon-pill{
  font-size:8px!important;
  padding:4px 10px!important;
  font-weight:800!important;
}
#homePage .product-card .primary-wide{
  font-size:10px!important;
  font-weight:900!important;
  margin-top:auto!important;
}
#homePage .home-strip .feature-text h3{
  font-size:10px!important;
  line-height:1.15!important;
  font-weight:900!important;
}
#homePage .home-strip .feature-text p{
  font-size:8px!important;
  line-height:1.35!important;
  font-weight:500!important;
}

/* Match first-page typography to the level-selection page. */
#homePage .hero h1{
  color:var(--navy)!important;
  font-weight:1000!important;
  letter-spacing:-1.2px!important;
}
#homePage .hero p{
  color:var(--text)!important;
  font-weight:500!important;
}
#homePage .product-card .exam-copy h2{
  color:var(--navy)!important;
  font-weight:1000!important;
  letter-spacing:-.25px!important;
}
#homePage .product-card .exam-copy p{
  color:var(--text)!important;
  font-size:13.2px!important;
  line-height:1.35!important;
  font-weight:500!important;
}
#homePage .product-card .chips span{
  font-weight:850!important;
}
#homePage .product-card .primary-wide{
  font-weight:950!important;
}
#homePage .home-strip .feature-text h3{
  color:var(--navy)!important;
  font-weight:950!important;
}
#homePage .home-strip .feature-text p{
  color:var(--text)!important;
  font-weight:500!important;
}
@media(min-width:651px) and (max-width:1120px){
  #homePage .home-product-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #homePage .product-card.exam-card{grid-template-columns:165px minmax(0,1fr)!important;min-height:250px!important;padding:18px!important}
  #homePage .product-card .mascot-wrap.image-mascot{width:154px!important;height:154px!important}
  #homePage .product-card .mascot-wrap.image-mascot img{width:118px!important;height:118px!important}
  #homePage .home-strip.feature-strip{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  #homePage .home-strip .feature:nth-child(2n){border-right:none!important}
}
@media(max-width:650px){
  #homePage .home-product-grid{
    grid-template-columns:1fr!important;
  }
  #homePage .product-card.exam-card{
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto auto!important;
    height:auto!important;
    min-height:0!important;
    text-align:center!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot,
  #homePage .product-card .exam-copy,
  #homePage .product-card .primary-wide{
    grid-column:1!important;
    grid-row:auto!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot{
    width:156px!important;
    height:156px!important;
    margin:0 auto!important;
  }
  #homePage .product-card .mascot-wrap.image-mascot img{
    width:118px!important;
    height:118px!important;
  }
  #homePage .product-card .exam-copy{
    align-items:center!important;
    text-align:center!important;
  }
  #homePage .product-card .exam-copy h2,
  #homePage .product-card .exam-copy p{
    text-align:center!important;
  }
  #homePage .product-card .chips{
    justify-content:center!important;
  }
  #homePage .product-card .soon-pill{
    align-self:center!important;
  }
  #homePage .product-card .primary-wide{
    width:100%!important;
    max-width:100%!important;
    justify-self:center!important;
  }
  #homePage .home-strip.feature-strip{
    grid-template-columns:1fr!important;
  }
  #homePage .home-strip .feature{
    border-right:none!important;
  }
}

/* Home card typography pass: match level-card feel without changing layout or images. */
#homePage .product-card .exam-copy{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  height:100%!important;
  padding-top:10px!important;
  padding-right:10px!important;
  padding-bottom:10px!important;
}
#homePage .product-card .exam-copy h2{
  font-size:26px!important;
  line-height:1.08!important;
  font-weight:900!important;
  color:#07113f!important;
  margin:0 0 12px 0!important;
}
#homePage .product-card .exam-copy p{
  font-size:13.5px!important;
  line-height:1.4!important;
  font-weight:500!important;
  color:#303a5f!important;
  margin:0 0 14px 0!important;
}
#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  margin:0 0 10px 0!important;
  align-content:flex-start!important;
}
#homePage .product-card .chips span{
  padding:4px 10px!important;
  font-size:12px!important;
  line-height:1!important;
  font-weight:800!important;
}
#homePage .product-card .primary-wide{
  position:static!important;
  grid-column:2!important;
  grid-row:2!important;
  align-self:end!important;
  justify-self:start!important;
  margin-top:auto!important;
}

/* Final home button sizing: match Level page "Start the Level" button. */
#homePage .product-card .primary-wide,
#homePage .product-card .primary-wide.disabled{
  min-height:44px!important;
  height:44px!important;
  font-size:15.5px!important;
  font-weight:950!important;
  line-height:1!important;
  border-radius:12px!important;
}
#homePage .product-card .primary-wide span{
  font-size:15.5px!important;
  line-height:1!important;
  margin-left:12px!important;
}

/* Games page card redesign: vertical image/title/divider/details/button layout only. */
.he-games-select-page .he-games-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:22px!important;
  align-items:stretch!important;
}
.he-games-select-page .hatchelite-game-card{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  min-height:520px!important;
  height:100%!important;
  padding:18px 18px 16px!important;
  border-radius:24px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #dcd5ff!important;
  box-shadow:0 8px 20px rgba(70,55,150,.06)!important;
}
.he-games-select-page .game-card-image-wrap{
  width:100%!important;
  height:190px!important;
  min-height:190px!important;
  max-height:190px!important;
  margin:0 0 14px!important;
  border-radius:18px!important;
  overflow:hidden!important;
  background:#f5f2ff!important;
}
.he-games-select-page .game-card-image{
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
}
.he-games-select-page .game-card-content{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  flex:1 1 auto!important;
  min-height:0!important;
  width:100%!important;
  gap:0!important;
  padding:0!important;
  text-align:center!important;
}
.he-games-select-page .game-card-content h2{
  width:100%!important;
  margin:0 0 12px!important;
  color:#10184f!important;
  font-size:24px!important;
  line-height:1.08!important;
  font-weight:900!important;
  text-align:center!important;
  letter-spacing:-.01em!important;
}
.he-games-select-page .game-card-content h2:after{
  content:""!important;
  display:block!important;
  width:88%!important;
  height:1px!important;
  margin:12px auto 0!important;
  background:linear-gradient(to right, transparent, #d9d3f3, transparent)!important;
}
.he-games-select-page .game-card-content p{
  max-width:92%!important;
  margin:0 auto 14px!important;
  color:#465174!important;
  font-size:14px!important;
  line-height:1.4!important;
  font-weight:500!important;
  text-align:center!important;
}
.he-games-select-page .game-tags{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  gap:8px!important;
  width:100%!important;
  margin:0 0 16px!important;
}
.he-games-select-page .game-tag{
  padding:6px 13px!important;
  border-radius:999px!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:800!important;
}
.he-games-select-page .game-card-progress{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:12px!important;
  width:100%!important;
  margin:0 0 16px!important;
}
.he-games-select-page .game-card-progress span{
  display:block!important;
  text-align:center!important;
  color:#1c2457!important;
  font-size:12px!important;
  line-height:1.2!important;
  font-weight:800!important;
}
.he-games-select-page .game-card-progress b{
  display:block!important;
  margin-top:4px!important;
  color:#10184f!important;
  font-size:20px!important;
  line-height:1!important;
  font-weight:900!important;
}
.he-games-select-page .game-card-progress span{
  position:relative!important;
  display:grid!important;
  grid-template-columns:auto auto!important;
  justify-content:center!important;
  align-items:center!important;
  column-gap:8px!important;
  padding-left:0!important;
}
.he-games-select-page .game-card-progress span:first-child:before,
.he-games-select-page .game-card-progress span:last-child:before{
  position:static!important;
  transform:none!important;
  display:grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  font-size:25px!important;
  line-height:1!important;
  grid-row:1 / 3!important;
}
.he-games-select-page .game-card-progress span:first-child:before{
  content:"🏆"!important;
}
.he-games-select-page .game-card-progress span:last-child:before{
  content:"▶"!important;
  color:#241ca3!important;
  font-size:27px!important;
}
.he-games-select-page .play-game-button{
  width:100%!important;
  height:50px!important;
  min-height:50px!important;
  margin:auto 0 0!important;
  border-radius:14px!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:900!important;
  align-self:stretch!important;
}
@media(max-width:1100px){
  .he-games-select-page .he-games-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:700px){
  .he-games-select-page .he-games-grid{
    grid-template-columns:1fr!important;
  }
  .he-games-select-page .hatchelite-game-card{
    min-height:auto!important;
  }
  .he-games-select-page .game-card-image-wrap{
    height:180px!important;
    min-height:180px!important;
    max-height:180px!important;
  }
}

/* Games wallet stats: compact one-line pills. */
.he-games-select-page .he-game-wallet{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  margin:0 auto 12px!important;
}
.he-games-select-page .he-game-wallet span{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-width:0!important;
  height:34px!important;
  min-height:34px!important;
  padding:5px 14px!important;
  border-radius:999px!important;
  white-space:nowrap!important;
}
.he-games-select-page .he-game-wallet img{
  width:22px!important;
  height:22px!important;
  flex:0 0 22px!important;
  object-fit:contain!important;
}
.he-games-select-page .he-game-wallet b{
  font-size:18px!important;
  line-height:1!important;
  font-weight:950!important;
}
.he-games-select-page .he-game-wallet small{
  font-size:12px!important;
  line-height:1!important;
  font-weight:650!important;
  color:#18225b!important;
}
#homePage .home-strip .feature{
  align-items:center!important;
}
#homePage .home-strip .feature-text{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
}
#homePage .home-strip .feature-text h3{
  font-size:16px!important;
  line-height:1.12!important;
  font-weight:900!important;
  margin:0 0 6px 0!important;
}
#homePage .home-strip .feature-text p{
  font-size:13px!important;
  line-height:1.35!important;
  margin:0!important;
}
/* My Dragon Studio phase 1 static reference layout */
.dragon-studio-v2{min-height:100vh;padding:22px 28px 34px;background:radial-gradient(circle at 16% 8%,rgba(124,92,255,.08),transparent 28%),linear-gradient(180deg,#fff 0%,#fbfaff 55%,#f7f5ff 100%);color:#071044}
.ds-header{display:grid;grid-template-columns:190px 1fr;gap:20px;align-items:start;max-width:1520px;margin:0 auto 16px}.ds-back{height:44px;border:1px solid #cfc8ff;background:#fff;border-radius:12px;color:#5140e8;font-size:15px;font-weight:900;cursor:pointer;box-shadow:0 10px 22px rgba(82,64,160,.06)}.ds-header h1{margin:0;font-size:34px;line-height:1;font-weight:950;letter-spacing:0;color:#071044}.ds-header h1 span{color:#7a65ff}.ds-header p{margin:8px 0 0;color:#27356e;font-size:15px;font-weight:700}
.ds-stats-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;max-width:1280px;margin:0 auto 12px}.ds-stats-row article{display:grid;grid-template-columns:92px 1fr;align-items:center;gap:18px;min-height:124px;background:#fff;border:1px solid #ded8ff;border-radius:18px;padding:18px 24px;box-shadow:0 16px 36px rgba(82,64,160,.06)}.ds-stats-row img{width:72px;height:72px;object-fit:contain}.ds-stats-row b,.ds-stats-row small{display:block}.ds-stats-row b{font-size:16px;color:#071044}.ds-stats-row strong{display:inline-block;margin-top:8px;font-size:34px;line-height:1;color:#071044}.ds-stats-row span{margin-left:8px;font-size:14px;font-weight:800;color:#071044}.ds-stats-row small{margin-top:10px;color:#465181;font-size:13px;font-weight:650}.ds-stats-row i{display:block;width:170px;height:8px;margin-top:8px;border-radius:999px;background:#e5e2f2;overflow:hidden}.ds-stats-row i em{display:block;height:100%;border-radius:inherit;background:#5b45e8}
.ds-grid{display:grid;grid-template-columns:minmax(390px,1.02fr) minmax(480px,1.24fr) minmax(300px,.78fr);gap:14px;max-width:1520px;margin:0 auto}.ds-col{display:grid;gap:14px;align-content:start}.ds-card{background:#fff;border:1px solid #ded8ff;border-radius:16px;padding:16px 20px;box-shadow:0 14px 30px rgba(82,64,160,.055);overflow:hidden}.ds-card h2{margin:0 0 8px;color:#071044;font-size:21px;line-height:1.1;font-weight:950}.ds-card p{margin:0;color:#374274;font-size:14px;line-height:1.35;font-weight:650}.ds-card button{border:1px solid #cfc8ff;background:#fff;color:#5140e8;border-radius:10px;min-height:36px;padding:0 18px;font-size:14px;font-weight:900;cursor:pointer}
.ds-dragon-main{display:grid;grid-template-columns:235px 1fr;gap:16px;align-items:center}.ds-dragon-main>img{width:235px;height:235px;object-fit:contain}.ds-dragon-main h3{margin:8px 0;color:#071044;font-size:27px;line-height:1.05}.ds-dragon-main span,.ds-dragon-main em{display:inline-flex;align-items:center;gap:6px;border:1px solid #d8d1ff;border-radius:10px;background:#f7f4ff;color:#4e3fd8;font-style:normal;font-weight:900;padding:8px 13px}.ds-dragon-main em{margin:8px 0}.ds-dragon-main p{margin:8px 0;color:#25305f;font-size:16px}.ds-dragon-main button{margin-top:14px;width:170px}
.ds-family>div{display:flex;align-items:end;gap:14px;margin:8px 0 12px}.ds-family span{display:grid;gap:5px;justify-items:center;color:#504c72;font-size:12px;font-weight:900}.ds-family img{width:48px;height:48px;object-fit:contain}.ds-family .locked img,.ds-badges img.locked,.ds-egg-tier.locked img{filter:grayscale(1) contrast(.75);opacity:.38}.ds-family b{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#f1efff;color:#5140e8}.ds-family button,.ds-badges button{width:100%}.ds-family .more,.ds-family .last{padding-bottom:4px}
.ds-selected-dragon{display:flex;justify-content:space-between;align-items:center;margin:12px 0;padding:8px 12px;border:1px solid #d8d1ff;border-radius:10px;background:#fbfaff;color:#1b265a;font-size:13px;font-weight:850}.ds-selected-dragon span{display:grid;gap:2px}.ds-selected-dragon small{font-size:11px;color:#6f6a86;font-weight:750}.ds-selected-dragon button{min-height:28px;border:0;background:transparent;padding:0;color:#5140e8}.ds-feed-notice{margin:-2px 0 10px;padding:9px 10px;border:1px solid #eeeafb;border-radius:10px;background:#fff9fb;color:#7b4560;font-size:12px;font-weight:750}.ds-feed-notice button{min-height:26px;margin-left:8px;padding:0 10px;font-size:12px}.ds-feed-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.ds-feed-item{border:1px solid #ded8ff;border-radius:10px;background:#fff;text-align:center;padding:7px 5px}.ds-feed-item.disabled{opacity:.48;cursor:not-allowed}.ds-feed-item b{display:block;min-height:26px;color:#071044;font-size:10px;line-height:1.15}.ds-feed-item img{width:54px;height:54px;object-fit:contain}.ds-feed-item span{display:inline-flex;align-items:center;justify-content:center;gap:3px;font-weight:950;color:#071044}.ds-feed-item span img{width:15px;height:15px}.ds-feed footer,.ds-hatchery footer{margin-top:12px;text-align:center;color:#465181;font-size:13px;font-weight:750}
.ds-hatch{min-height:398px}.ds-hatch-title{display:flex;align-items:center;gap:14px;margin:16px 0 6px}.ds-hatch-title strong{display:inline-flex;border-radius:999px;background:#f5f2ff;padding:10px 25px;color:#5b45e8;font-size:31px;line-height:1;font-weight:950}.ds-hatch-title img{width:34px;height:34px;object-fit:contain}.ds-days{--hatch-progress:0%;display:grid;grid-template-columns:repeat(7,1fr);align-items:end;gap:0;margin:22px 0 14px;position:relative}.ds-days:before{content:"";position:absolute;left:6%;right:6%;top:58px;height:8px;border-radius:999px;background:linear-gradient(90deg,#7059ff 0 var(--hatch-progress),#cfd0d6 var(--hatch-progress));z-index:0}.ds-day{position:relative;z-index:1;text-align:center;display:grid;justify-items:center;gap:8px}.ds-day b{font-size:12px;color:#071044}.ds-day>img{width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(82,64,160,.12))}.ds-day.current>img{filter:drop-shadow(0 0 14px rgba(112,89,255,.45))}.ds-day.hatch>img{width:86px;height:86px;filter:drop-shadow(0 0 16px rgba(255,205,68,.75))}.ds-day span{display:grid;place-items:center;width:26px;height:26px;border:1px solid #c9c2ff;border-radius:50%;background:#fff;color:#5140e8;font-weight:950}.ds-hatch-empty .ds-day:not(.hatch)>img{opacity:.5}.ds-hatch small{display:block;text-align:center;color:#27356e;font-size:13px}.ds-hatch>button{display:flex;align-items:center;justify-content:center;gap:8px;width:310px;margin:12px auto 0;border:0;background:linear-gradient(180deg,#6957f4,#513fdc);color:#fff;box-shadow:0 12px 22px rgba(82,64,160,.18);font-size:18px}.ds-hatch>button img{width:22px;height:22px}
.ds-egg-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin-top:16px}.ds-egg-tier{min-height:190px;border:1px solid #ded8ff;border-radius:12px;background:#fff;text-align:center;padding:10px 8px}.ds-egg-tier b,.ds-egg-tier small,.ds-egg-tier span,.ds-egg-tier em{display:block}.ds-egg-tier b{font-size:12px;color:#071044}.ds-egg-tier small{min-height:16px;color:#243065;font-size:10px;font-weight:800}.ds-egg-tier>img{width:80px;height:92px;object-fit:contain;margin:8px auto}.ds-egg-tier span{display:inline-flex;align-items:center;justify-content:center;gap:4px;color:#071044;font-size:18px;font-weight:950}.ds-egg-tier span img{width:18px;height:18px}.ds-egg-tier em{color:#2c8a43;font-size:13px;font-style:normal;font-weight:900}.ds-hatchery footer{border-radius:10px;background:#f0edff;color:#5140e8;font-size:16px;padding:9px}
.ds-task-row{display:grid;grid-template-columns:22px 1fr auto 58px;gap:8px;align-items:center;min-height:31px;border-top:1px solid #eeeafb;color:#071044}.ds-task-row b{font-size:13px}.ds-check{display:grid;place-items:center;width:16px;height:16px;border:1px solid #b8bad4;border-radius:4px;color:#fff;font-size:11px}.ds-check.done{background:#72a959;border-color:#72a959}.ds-task-row em{display:flex;align-items:center;gap:5px;color:#243065;font-size:13px;font-style:normal;font-weight:850}.ds-task-row em img{width:16px;height:16px}.ds-task-row button{min-height:25px;border-radius:8px;padding:0 12px;font-size:13px}.ds-tasks footer{margin-top:14px;padding:10px 12px;border-radius:12px;background:#f5f2ff;color:#374274;font-size:12px;line-height:1.3;text-align:center}
.ds-badges>div{display:grid;grid-template-columns:repeat(9,1fr);gap:9px;margin:14px 0}.ds-badges img{width:43px;height:43px;object-fit:contain}.ds-badges img.earned{filter:drop-shadow(0 6px 8px rgba(82,64,160,.12))}.ds-share p{font-size:13px}.ds-share button{display:block;width:230px;margin:14px auto 0;border:0;background:linear-gradient(180deg,#6957f4,#513fdc);color:#fff;box-shadow:0 10px 20px rgba(82,64,160,.16)}
.ds-family>div button{width:auto;min-height:0;padding:0;border:0;background:transparent;border-radius:0;display:grid;gap:5px;justify-items:center;color:#504c72;font-size:12px;font-weight:900}.ds-family>div button small{max-width:62px;min-height:24px;color:#6f6a86;font-size:9px;line-height:1.12}.ds-family>div button.mood-happy small{color:#208349}.ds-family>div button.mood-sad small{color:#a26131}.ds-family>div button.mood-dormant img{opacity:.48;filter:grayscale(1) contrast(.85)}
.ds-family .locked img,.ds-badges .locked img{filter:grayscale(1) contrast(.75);opacity:.38}
.ds-family>button,.ds-badges>button{width:100%}
.ds-feed-item{min-height:0}
.ds-badges>div button{min-height:0;padding:0;border:0;background:transparent}
.ds-badges .earned img{filter:drop-shadow(0 6px 8px rgba(82,64,160,.12))}
.full-badge-modal{display:grid;gap:12px}.full-badge-modal>p{margin:0;color:#465181;font-size:13px;font-weight:700}.full-badge-modal>b{color:#5140e8}.full-badge-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;max-height:52vh;overflow:auto;padding:4px}.full-badge-grid button{display:grid;gap:5px;justify-items:center;min-height:94px;padding:8px;border:1px solid #eeeafb;border-radius:12px;background:#fff;color:#071044}.full-badge-grid button.locked{opacity:.52}.full-badge-grid button.locked img{filter:grayscale(1) contrast(.78)}.full-badge-grid img{width:48px;height:48px;object-fit:contain}.full-badge-grid span{font-size:10px;font-weight:850;text-align:center}.badge-detail-card{display:grid;gap:13px;justify-items:center}.badge-detail-image{width:150px;height:150px;object-fit:contain;background:#fff;border:1px solid #eeeafb;border-radius:18px}.badge-detail-card h3{margin:0;color:#071044;font-size:24px}.badge-detail-card dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;width:100%;margin:0}.badge-detail-card div:not(.dragon-detail-actions){padding:10px;border:1px solid #eeeafb;border-radius:12px;background:#fbfaff}.badge-detail-card dt{font-size:11px;font-weight:850;color:#6f6a86}.badge-detail-card dd{margin:4px 0 0;font-size:13px;font-weight:900;color:#071044}.share-builder{display:grid;gap:14px}.share-builder h3{margin:0 0 8px;color:#071044;font-size:16px}.share-type-row{display:flex;gap:8px;flex-wrap:wrap}.share-type-row button{width:auto;min-height:34px;border:1px solid #ded8ff;background:#fff;color:#5140e8}.share-type-row button.active{border:0;background:linear-gradient(180deg,#6957f4,#513fdc);color:#fff}.share-item-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-height:190px;overflow:auto}.share-item-grid button{display:grid;gap:5px;justify-items:center;min-height:92px;padding:8px;border:1px solid #ded8ff;border-radius:12px;background:#fff;color:#071044}.share-item-grid button.selected{border-color:#7059ff;background:#f5f2ff}.share-item-grid img{width:48px;height:48px;object-fit:contain}.share-item-grid span{font-size:11px;font-weight:850;text-align:center}.share-card-preview{display:grid;justify-items:center;gap:7px;margin:0 auto;padding:16px;width:min(310px,100%);border:1px solid #ded8ff;border-radius:20px;background:linear-gradient(180deg,#fff,#f7f4ff);box-shadow:0 14px 30px rgba(82,64,160,.08);text-align:center}.share-card-preview .share-card-logo{color:#5140e8;font-size:18px;font-weight:950}.share-card-preview img{width:118px;height:118px;object-fit:contain;background:#fff;border:1px solid #eeeafb;border-radius:18px}.share-card-preview span{padding:4px 10px;border-radius:999px;background:#ede9ff;color:#5140e8;font-size:12px;font-weight:900}.share-card-preview h3{margin:2px 0 0;font-size:20px}.share-card-preview p{margin:0;color:#374274;font-size:13px;font-weight:750}.share-card-preview small,.share-card-preview footer{color:#6f6a86;font-size:11px;font-weight:750}.share-card-preview.empty{min-height:160px;place-content:center;color:#6f6a86}
.coin-reward-toast{position:fixed;right:24px;bottom:24px;z-index:1000;display:grid;grid-template-columns:auto 1fr;gap:3px 9px;align-items:center;max-width:min(330px,calc(100vw - 32px));padding:13px 16px;border:1px solid rgba(245,181,43,.38);border-radius:16px;background:#fff;color:#071044;box-shadow:0 18px 42px rgba(82,64,160,.16);opacity:0;transform:translateY(18px) scale(.96);transition:opacity .24s ease,transform .24s ease;pointer-events:none}.coin-reward-toast:not(.coin-reward-pop){grid-template-columns:1fr}.coin-reward-toast.show{opacity:1;transform:translateY(0) scale(1)}.coin-reward-toast i{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(180deg,#ffe28a,#f6a800);font-style:normal;box-shadow:0 6px 14px rgba(217,145,0,.28);animation:coinRewardBounce 1.1s ease both}.coin-reward-toast b{font-size:15px;font-weight:950;color:#5140e8}.coin-reward-toast span{font-size:12px;line-height:1.35;color:#5f6586;font-weight:700}.coin-reward-pop.show b{animation:coinRewardRise 1.1s ease both}@keyframes coinRewardBounce{0%{transform:translateY(-12px) scale(.72);opacity:.2}35%{transform:translateY(2px) scale(1.16);opacity:1}60%{transform:translateY(-3px) scale(.98)}100%{transform:translateY(0) scale(1)}}@keyframes coinRewardRise{0%{transform:translateY(6px);opacity:.2}35%,75%{transform:translateY(-3px);opacity:1}100%{transform:translateY(-8px);opacity:.72}}
.ds-egg-tier.active{border-color:#7059ff;box-shadow:0 0 0 3px rgba(112,89,255,.12),0 14px 30px rgba(82,64,160,.08)}.ds-egg-tier.disabled-buy{opacity:.72}.ds-egg-tier.disabled-buy em{color:#8b6070}.egg-modal-copy{display:block;color:#313a66;font-weight:750;line-height:1.45}.egg-modal-actions{display:flex;gap:10px;align-items:center;margin-top:16px}.egg-modal-actions button{width:auto;min-width:128px}.hatch-success-visual{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;margin:14px 0 4px;padding:12px;border:1px solid #eeeafb;border-radius:16px;background:#fbfaff}.hatch-success-visual img{width:86px;height:86px;object-fit:contain;background:#fff;border-radius:14px}.hatch-success-visual span{color:#5140e8;font-size:24px;font-weight:950}.feed-dragon-picker{display:grid;gap:10px;margin-top:10px}.feed-dragon-picker button{display:grid;grid-template-columns:54px 1fr;align-items:center;gap:12px;width:100%;min-height:68px;border:1px solid #ded8ff;border-radius:14px;background:#fff;text-align:left;color:#071044}.feed-dragon-picker button.selected{border-color:#7059ff;background:#f5f2ff}.feed-dragon-picker img{width:52px;height:52px;object-fit:contain}.feed-dragon-picker b,.feed-dragon-picker small{display:block}.feed-dragon-picker small{margin-top:3px;color:#6f6a86}.dragon-detail-card{display:grid;gap:16px}.dragon-detail-image{width:190px;height:190px;object-fit:contain;margin:0 auto;background:#fff;border:1px solid #eeeafb;border-radius:18px}.dragon-detail-info h3{margin:0 0 10px;color:#071044;font-size:24px}.dragon-detail-info dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0}.dragon-detail-info div{padding:10px;border:1px solid #eeeafb;border-radius:12px;background:#fbfaff}.dragon-detail-info dt{font-size:11px;font-weight:850;color:#6f6a86}.dragon-detail-info dd{margin:4px 0 0;font-size:13px;font-weight:900;color:#071044}.dragon-detail-actions{display:flex;gap:9px;flex-wrap:wrap}.dragon-detail-actions button{width:auto;min-width:132px}.avatar-picker-modal{display:grid;gap:18px}.avatar-picker-modal h3{margin:0 0 10px;color:#071044;font-size:18px}.avatar-pick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.avatar-pick-card{display:grid;gap:7px;justify-items:center;padding:12px;border:1px solid #ded8ff;border-radius:14px;background:#fff;text-align:center}.avatar-pick-card.current{border-color:#7059ff;background:#f5f2ff}.avatar-pick-card img{width:82px;height:82px;object-fit:contain}.avatar-pick-card b{font-size:13px;color:#071044}.avatar-pick-card span{min-height:28px;color:#6f6a86;font-size:11px;font-weight:800}.avatar-pick-card button{min-height:30px;padding:0 14px;border:0;background:linear-gradient(180deg,#6957f4,#513fdc);color:#fff}.avatar-empty{padding:12px;border:1px dashed #ded8ff;border-radius:12px;color:#6f6a86;font-weight:750}
@media(max-width:1180px){.ds-grid{grid-template-columns:1fr 1fr}.ds-right{grid-column:1/-1;grid-template-columns:repeat(3,minmax(0,1fr))}.ds-stats-row{grid-template-columns:1fr}.ds-feed-grid{grid-template-columns:repeat(4,1fr)}}@media(max-width:760px){.dragon-studio-v2{padding:16px}.ds-header{grid-template-columns:1fr}.ds-grid{display:flex;flex-direction:column}.ds-col,.ds-right{display:contents}.ds-my-dragon{order:1}.ds-hatch{order:2}.ds-family{order:3}.ds-feed{order:4}.ds-hatchery{order:5}.ds-tasks{order:6}.ds-badges{order:7}.ds-share{order:8}.ds-dragon-main{grid-template-columns:1fr;text-align:center}.ds-dragon-main>img{margin:auto}.ds-stats-row article{grid-template-columns:70px 1fr}.ds-days{grid-template-columns:repeat(4,1fr);gap:12px}.ds-days:before{display:none}.ds-egg-grid{grid-template-columns:repeat(2,1fr)}.ds-feed-grid{grid-template-columns:repeat(2,1fr)}.ds-badges>div{grid-template-columns:repeat(6,1fr)}.full-badge-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.share-item-grid,.avatar-pick-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dragon-detail-info dl,.badge-detail-card dl{grid-template-columns:1fr}.dragon-detail-actions button{width:100%}.modal{width:calc(100vw - 24px)!important;max-height:88vh!important;padding:18px!important}.dragon-studio-asset-fallback{background:#fff}}

/* My Dragon Studio target reference refinement */
body.dragon-studio-mode .topbar{
  display:none!important;
}
body.dragon-studio-mode .page.profile-page.dragon-studio-page{
  max-width:none!important;
  width:100%!important;
  padding:0!important;
}
.dragon-studio-v2{
  padding:26px 28px 38px!important;
}
.ds-header{
  grid-template-columns:220px 1fr!important;
  max-width:1580px!important;
  margin:0 auto 22px!important;
  gap:24px!important;
  align-items:start!important;
}
.ds-back{
  height:48px!important;
  border-radius:12px!important;
  font-size:17px!important;
}
.ds-header h1{
  font-size:38px!important;
  line-height:.95!important;
}
.ds-header p{
  font-size:16px!important;
  margin-top:10px!important;
}
.ds-stats-row{
  max-width:1320px!important;
  gap:24px!important;
  margin:0 auto 14px!important;
}
.ds-stats-row article{
  min-height:132px!important;
  grid-template-columns:96px 1fr!important;
  padding:20px 26px!important;
  border-radius:18px!important;
}
.ds-stats-row img{
  width:78px!important;
  height:78px!important;
}
.ds-stats-row b{
  font-size:17px!important;
}
.ds-stats-row strong{
  font-size:36px!important;
}
.ds-grid{
  max-width:1580px!important;
  grid-template-columns:minmax(420px,1.08fr) minmax(560px,1.32fr) minmax(320px,.82fr)!important;
  gap:18px!important;
}
.ds-col{
  gap:18px!important;
}
.ds-card{
  border-radius:18px!important;
  padding:18px 22px!important;
}
.ds-card h2{
  font-size:23px!important;
  margin-bottom:10px!important;
}
.ds-card p{
  font-size:15px!important;
}
.ds-dragon-main{
  grid-template-columns:260px 1fr!important;
  gap:18px!important;
}
.ds-dragon-main>img{
  width:260px!important;
  height:260px!important;
}
.ds-dragon-main h3{
  font-size:30px!important;
}
.ds-dragon-main p{
  font-size:17px!important;
}
.ds-dragon-main button{
  width:190px!important;
  min-height:42px!important;
}
.ds-family>div{
  gap:16px!important;
}
.ds-family img{
  width:54px!important;
  height:54px!important;
}
.ds-family b{
  width:26px!important;
  height:26px!important;
}
.ds-selected-dragon{
  padding:10px 14px!important;
  font-size:14px!important;
}
.ds-feed-grid{
  gap:10px!important;
}
.ds-feed-item{
  padding:8px 6px!important;
}
.ds-feed-item img{
  width:62px!important;
  height:62px!important;
}
.ds-hatch{
  min-height:420px!important;
}
.ds-hatch-title strong{
  font-size:34px!important;
  padding:12px 28px!important;
}
.ds-hatch-title img{
  width:38px!important;
  height:38px!important;
}
.ds-days{
  margin:28px 0 16px!important;
}
.ds-day>img{
  width:70px!important;
  height:70px!important;
}
.ds-day.hatch>img{
  width:96px!important;
  height:96px!important;
}
.ds-hatch>button{
  width:330px!important;
  min-height:42px!important;
}
.ds-egg-grid{
  gap:12px!important;
}
.ds-egg-tier{
  min-height:214px!important;
  padding:12px 9px!important;
}
.ds-egg-tier>img{
  width:92px!important;
  height:108px!important;
}
.ds-task-row{
  min-height:36px!important;
  grid-template-columns:24px 1fr auto 64px!important;
}
.ds-task-row b{
  font-size:14px!important;
}
.ds-task-row button{
  min-height:29px!important;
}
.ds-badges>div{
  grid-template-columns:repeat(7,1fr)!important;
  gap:12px!important;
}
.ds-badges img{
  width:50px!important;
  height:50px!important;
}
.ds-share button{
  min-height:44px!important;
  width:250px!important;
}
@media(max-width:1180px){
  body.dragon-studio-mode .topbar{display:flex!important}
  .ds-header,.ds-grid,.ds-stats-row{max-width:100%!important}
  .ds-grid{grid-template-columns:1fr 1fr!important}
  .ds-right{grid-column:1/-1;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@media(min-width:1181px) and (max-width:1450px){
  .dragon-studio-v2{padding:22px 24px 34px!important}
  .ds-header{grid-template-columns:220px 1fr!important;max-width:1240px!important}
  .ds-stats-row{max-width:1240px!important;gap:18px!important}
  .ds-stats-row article{grid-template-columns:78px 1fr!important;min-height:112px!important;padding:16px 20px!important}
  .ds-stats-row img{width:64px!important;height:64px!important}
  .ds-grid{max-width:1240px!important;grid-template-columns:minmax(360px,1fr) minmax(450px,1.24fr) minmax(270px,.78fr)!important;gap:14px!important}
  .ds-card{padding:16px 18px!important}
  .ds-dragon-main{grid-template-columns:220px 1fr!important;gap:14px!important}
  .ds-dragon-main>img{width:220px!important;height:220px!important}
  .ds-dragon-main h3{font-size:26px!important}
  .ds-dragon-main span,.ds-dragon-main em{padding:7px 10px!important}
  .ds-dragon-main button{width:160px!important}
  .ds-hatch-title strong{font-size:30px!important}
  .ds-day>img{width:62px!important;height:62px!important}
  .ds-day.hatch>img{width:84px!important;height:84px!important}
  .ds-egg-tier{min-height:190px!important}
  .ds-egg-tier>img{width:76px!important;height:92px!important}
  .ds-task-row{grid-template-columns:22px 1fr auto 56px!important;gap:7px!important}
  .ds-task-row b{font-size:12.5px!important}
  .ds-badges>div{grid-template-columns:repeat(6,1fr)!important}
  .ds-badges img{width:43px!important;height:43px!important}
}
@media(max-width:760px){
  .dragon-studio-v2{padding:16px!important}
  .ds-header{grid-template-columns:1fr!important}
  .ds-dragon-main{grid-template-columns:1fr!important}
  .ds-dragon-main>img{width:220px!important;height:220px!important}
  .ds-stats-row article{grid-template-columns:72px 1fr!important}
  .ds-stats-row img{width:62px!important;height:62px!important}
  .ds-badges>div{grid-template-columns:repeat(6,1fr)!important}
}

/* My Dragon Studio dashboard visual refresh. */
body.dragon-studio-mode .topbar{
  display:none!important;
}
body.dragon-studio-mode .page.profile-page.dragon-studio-page{
  max-width:none!important;
  width:100%!important;
  padding:0!important;
}
.dragon-studio-v2.ds-dashboard{
  --ds-navy:#090c4a;
  --ds-purple:#5f43ea;
  --ds-soft:#f5f2ff;
  --ds-border:#dcd5ff;
  min-height:100vh!important;
  padding:0 20px 18px!important;
  background:
    radial-gradient(circle at 5% 8%,rgba(130,102,255,.13),transparent 26%),
    radial-gradient(circle at 92% 18%,rgba(185,211,255,.22),transparent 27%),
    linear-gradient(180deg,#fff 0%,#fbfaff 46%,#f6f3ff 100%)!important;
  color:var(--ds-navy)!important;
}
.ds-dashboard .ds-topnav{
  display:grid;
  grid-template-columns:250px 1fr auto;
  align-items:center;
  gap:18px;
  min-height:64px;
  max-width:1760px;
  margin:0 auto 12px;
  padding:0 4px;
  border-bottom:1px solid rgba(207,200,255,.7);
}
.ds-dashboard .ds-brand{
  border:0;
  background:transparent;
  padding:0;
  width:205px;
  text-align:left;
  cursor:pointer;
}
.ds-dashboard .ds-brand img{
  width:198px;
  height:auto;
  object-fit:contain;
  display:block;
}
.ds-dashboard .ds-topnav nav{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:34px;
  min-width:0;
}
.ds-dashboard .ds-topnav nav button{
  position:relative;
  border:0;
  background:transparent;
  color:var(--ds-navy);
  font-size:16px;
  font-weight:850;
  padding:21px 0 18px;
  cursor:pointer;
}
.ds-dashboard .ds-topnav nav button.active{
  color:#4d31e8;
}
.ds-dashboard .ds-topnav nav button.active:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:8px;
  height:3px;
  border-radius:999px;
  background:#5d41ed;
}
.ds-dashboard .ds-nav-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:12px;
}
.ds-dashboard .ds-nav-actions button{
  min-height:42px;
  border:1px solid #c8bdff;
  background:#fff;
  color:#4d31e8;
  border-radius:999px;
  padding:0 18px;
  font-size:15px;
  font-weight:900;
  cursor:pointer;
  box-shadow:0 8px 20px rgba(65,48,150,.06);
}
.ds-dashboard .ds-coin-pill{
  gap:8px;
  display:inline-flex;
  align-items:center;
  color:var(--ds-navy)!important;
}
.ds-dashboard .ds-coin-pill img{
  width:24px;
  height:24px;
  object-fit:contain;
}
.ds-dashboard .ds-avatar-pill{
  display:inline-flex;
  gap:6px;
  align-items:center;
  padding:0 8px 0 4px!important;
}
.ds-dashboard .ds-avatar-pill img{
  width:38px;
  height:38px;
  object-fit:contain;
  border-radius:50%;
  background:#f1efff;
}
.ds-dashboard .ds-summary-row{
  max-width:1760px!important;
  margin:0 auto 12px!important;
  display:grid!important;
  grid-template-columns:1fr 1fr 1.05fr 1.05fr 1.15fr!important;
  gap:18px!important;
}
.ds-dashboard .ds-summary-row article,
.ds-dashboard .ds-summary-row button{
  display:grid!important;
  grid-template-columns:64px 1fr auto!important;
  align-items:center!important;
  column-gap:14px!important;
  height:72px!important;
  min-height:72px!important;
  padding:10px 18px!important;
  border:1px solid var(--ds-border)!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.88)!important;
  box-shadow:0 14px 30px rgba(73,56,151,.07)!important;
  text-align:left!important;
}
.ds-dashboard .ds-summary-row button{
  cursor:pointer!important;
  color:var(--ds-navy)!important;
}
.ds-dashboard .ds-summary-row img{
  grid-row:1/3;
  width:24px!important;
  height:24px!important;
  object-fit:contain!important;
}
.ds-dashboard .ds-summary-row strong,
.ds-dashboard .ds-summary-row b{
  display:block;
  font-size:24px;
  line-height:1;
  color:var(--ds-navy);
  font-weight:950;
}
.ds-dashboard .ds-summary-row span{
  display:block;
  margin:4px 0 0!important;
  color:#5a5f8e;
  font-size:12px;
  font-weight:800;
}
.ds-dashboard .ds-summary-row i{
  grid-column:3;
  grid-row:1/3;
  color:#5d41ed;
  font-size:26px;
  font-style:normal;
  font-weight:900;
}
.ds-dashboard .ds-dashboard-grid{
  max-width:1760px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:1fr 1.55fr 1fr!important;
  grid-template-areas:
    "dragon hatch tasks"
    "family hatchery badges"
    "feed feed share";
  gap:16px!important;
  align-items:stretch!important;
}
.ds-dashboard .ds-card{
  position:relative;
  border:1px solid var(--ds-border)!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.92)!important;
  box-shadow:0 15px 32px rgba(73,56,151,.075)!important;
  padding:14px 16px!important;
  overflow:hidden!important;
}
.ds-dashboard .ds-card:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 96% 10%,rgba(132,103,255,.11),transparent 17%),
    radial-gradient(circle at 4% 92%,rgba(132,103,255,.08),transparent 14%);
}
.ds-dashboard .ds-card>*{
  position:relative;
  z-index:1;
}
.ds-dashboard .ds-card h2{
  display:flex;
  align-items:center;
  gap:9px;
  margin:0 0 9px!important;
  color:var(--ds-navy)!important;
  font-size:20px!important;
  font-weight:950!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-ui-icon,
.ds-dashboard .ui-inline-icon{
  width:22px;
  height:22px;
  object-fit:contain;
  flex:0 0 auto;
}
.ds-dashboard .ds-card h2 .ds-ui-icon,
.ds-dashboard .ds-card h2 .ui-inline-icon{
  width:22px!important;
  height:22px!important;
  filter:none!important;
  opacity:1!important;
}
.ds-dashboard .ds-my-dragon{grid-area:dragon}
.ds-dashboard .ds-hatch{grid-area:hatch}
.ds-dashboard .ds-tasks{grid-area:tasks}
.ds-dashboard .ds-family{grid-area:family}
.ds-dashboard .ds-hatchery{grid-area:hatchery}
.ds-dashboard .ds-badges{grid-area:badges}
.ds-dashboard .ds-feed{grid-area:feed}
.ds-dashboard .ds-share{grid-area:share}
.ds-dashboard .ds-my-dragon{
  min-height:330px;
  display:grid!important;
  align-content:center!important;
  background:linear-gradient(135deg,#fff 0%,#fff 54%,#f9f4ff 100%)!important;
}
.ds-dashboard .ds-my-dragon:before{
  content:"";
  position:absolute;
  left:20px;
  top:50px;
  width:205px;
  height:205px;
  background:radial-gradient(circle,rgba(140,203,255,.22),transparent 67%);
  pointer-events:none;
}
.ds-dashboard .ds-dragon-main{
  grid-template-columns:minmax(210px,1.18fr) minmax(160px,.96fr)!important;
  gap:10px!important;
  align-items:center!important;
}
.ds-dashboard .ds-dragon-main>img{
  width:270px!important;
  height:270px!important;
  max-width:100%!important;
  object-fit:contain!important;
  filter:drop-shadow(0 18px 22px rgba(80,71,170,.13));
}
.ds-dashboard .ds-dragon-main h3{
  margin:8px 0!important;
  font-size:21px!important;
  line-height:1.12!important;
  color:var(--ds-navy)!important;
}
.ds-dashboard .ds-dragon-main span,
.ds-dashboard .ds-dragon-main em{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  width:max-content!important;
  max-width:100%!important;
  padding:7px 11px!important;
  border:0!important;
  border-radius:10px!important;
  background:#f1edff!important;
  color:#4d31e8!important;
  font-size:13px!important;
  font-weight:950!important;
  font-style:normal!important;
}
.ds-dashboard .ds-dragon-main p{
  display:flex;
  align-items:center;
  gap:7px;
  margin:8px 0!important;
  color:#252f67!important;
  font-size:14px!important;
  font-weight:800!important;
}
.ds-dashboard .ds-hatched-date{
  display:grid;
  grid-template-columns:30px 1fr;
  gap:2px 8px;
  align-items:center;
  width:128px;
  margin:10px 0;
  padding:9px;
  border:1px solid #ddd6ff;
  border-radius:12px;
  background:#fff;
  color:var(--ds-navy);
  font-size:12px;
  font-weight:850;
}
.ds-dashboard .ds-hatched-date img{grid-row:1/3}
.ds-dashboard .ds-hatched-date small{
  font-size:11px;
  color:#54608b;
}
.ds-dashboard .ds-dragon-main button{
  width:150px!important;
  min-height:36px!important;
  margin-top:4px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
}
.ds-dashboard .ds-hatch{
  min-height:330px!important;
  padding:15px 26px!important;
  color:#fff!important;
  background:
    linear-gradient(180deg,rgba(11,15,82,.1),rgba(24,13,86,.18)),
    url("assets/assets_webp/backgrounds/bg_soft_celestial_alt.webp") center/cover no-repeat!important;
  border-color:rgba(177,167,255,.62)!important;
  box-shadow:0 18px 38px rgba(38,25,120,.17)!important;
}
.ds-dashboard .ds-hatch:after{
  background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(0,0,0,.04));
}
.ds-dashboard .ds-hatch h2,
.ds-dashboard .ds-hatch p,
.ds-dashboard .ds-hatch small,
.ds-dashboard .ds-hatch .ds-day b{
  color:#fff!important;
  text-shadow:0 1px 10px rgba(0,0,0,.25);
}
.ds-dashboard .ds-hatch h2{
  justify-content:flex-start;
}
.ds-dashboard .ds-hatch-title{
  justify-content:center!important;
  margin:8px 0 6px!important;
}
.ds-dashboard .ds-hatch-title strong{
  min-width:210px!important;
  justify-content:center!important;
  padding:9px 32px!important;
  border:1px solid rgba(255,255,255,.45)!important;
  background:rgba(28,22,100,.48)!important;
  color:#fff!important;
  font-size:31px!important;
  box-shadow:inset 0 0 22px rgba(255,255,255,.09);
}
.ds-dashboard .ds-hatch-title img{
  display:none;
}
.ds-dashboard .ds-hatch>p{
  text-align:center;
  font-size:13px!important;
  font-weight:850!important;
}
.ds-dashboard .ds-days{
  margin:26px 0 12px!important;
}
.ds-dashboard .ds-days:before{
  top:60px!important;
  left:7%!important;
  right:7%!important;
  height:7px!important;
  background:linear-gradient(90deg,rgba(122,93,255,.9) 0 var(--hatch-progress),rgba(255,255,255,.42) var(--hatch-progress))!important;
  box-shadow:0 0 18px rgba(131,107,255,.55);
}
.ds-dashboard .ds-day{
  gap:5px!important;
}
.ds-dashboard .ds-day>img{
  width:66px!important;
  height:66px!important;
  filter:drop-shadow(0 0 18px rgba(72,211,255,.55))!important;
}
.ds-dashboard .ds-day.done>img{
  filter:drop-shadow(0 0 22px rgba(75,215,255,.72))!important;
}
.ds-dashboard .ds-day:not(.done):not(.current):not(.hatch)>img{
  opacity:.72;
  filter:grayscale(.82) drop-shadow(0 0 8px rgba(255,255,255,.25))!important;
}
.ds-dashboard .ds-day.hatch>img{
  width:82px!important;
  height:82px!important;
  filter:drop-shadow(0 0 28px rgba(255,220,90,.95))!important;
}
.ds-dashboard .ds-day span{
  width:31px!important;
  height:31px!important;
  border-color:rgba(255,255,255,.72)!important;
  background:rgba(12,17,76,.28)!important;
  color:#fff!important;
}
.ds-dashboard .ds-hatch>button{
  width:320px!important;
  min-height:48px!important;
  border-radius:13px!important;
  background:linear-gradient(180deg,#8065ff,#5636da)!important;
  box-shadow:0 12px 28px rgba(17,10,76,.38)!important;
}
.ds-dashboard .ds-task-row{
  grid-template-columns:22px 1fr auto 64px!important;
  min-height:34px!important;
  padding:3px 0!important;
  border-top:1px solid #eeeafb!important;
}
.ds-dashboard .ds-check.done{
  background:#58ac50!important;
  border-color:#58ac50!important;
}
.ds-dashboard .ds-task-row b{
  font-size:13px!important;
  color:var(--ds-navy)!important;
}
.ds-dashboard .ds-task-row button{
  min-height:25px!important;
  border-radius:9px!important;
  background:linear-gradient(180deg,#765ef4,#593edb)!important;
  color:#fff!important;
  border:0!important;
}
.ds-dashboard .ds-task-row em img{
  content:url("assets/assets_webp/icons/universal/icon_coins.svg");
}
.ds-dashboard .ds-tasks footer,
.ds-dashboard .ds-feed footer{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  margin-top:10px!important;
  padding:10px 12px!important;
  color:#4e42d7!important;
  background:#f0ecff!important;
  border-radius:14px!important;
  font-size:12px!important;
  text-align:center!important;
}
.ds-dashboard .ds-gallery-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
}
.ds-dashboard .ds-gallery-tile{
  display:grid!important;
  place-items:center!important;
  gap:4px!important;
  min-height:116px!important;
  padding:7px 6px!important;
  border:1px solid #ded8ff!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.9)!important;
  color:var(--ds-navy)!important;
  text-align:center!important;
  cursor:pointer!important;
}
.ds-dashboard .ds-gallery-tile img{
  width:78px!important;
  height:70px!important;
  object-fit:contain!important;
}
.ds-dashboard .ds-gallery-tile b{
  width:100%;
  min-height:24px;
  color:var(--ds-navy)!important;
  font-size:11px!important;
  line-height:1.15!important;
  font-weight:900!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:normal!important;
}
.ds-dashboard .ds-family .ds-gallery-tile.locked img{
  filter:none!important;
  opacity:1!important;
}
.ds-dashboard .ds-family .ds-gallery-tile b{
  font-size:10px!important;
  line-height:1.1!important;
  letter-spacing:-.01em;
}
.ds-dashboard .ds-hatchery .ds-gallery-tile img{
  width:88px!important;
  height:82px!important;
}
.ds-dashboard .ds-hatchery .ds-gallery-tile b{
  font-size:11px!important;
}
.ds-dashboard .ds-family>button,
.ds-dashboard .ds-hatchery>button,
.ds-dashboard .ds-badges>button{
  display:flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px!important;
  width:100%!important;
  margin-top:10px!important;
  color:#4d31e8!important;
  font-size:14px!important;
  font-weight:950!important;
}
.ds-dashboard .ds-family,
.ds-dashboard .ds-hatchery{
  display:grid!important;
  grid-template-rows:auto 1fr auto!important;
  align-content:stretch!important;
}
.ds-dashboard .ds-family .ds-gallery-grid,
.ds-dashboard .ds-hatchery .ds-gallery-grid{
  align-self:center!important;
}
.ds-dashboard .ds-badges{
  align-self:stretch!important;
  display:grid!important;
  grid-template-rows:auto 1fr auto!important;
  gap:12px!important;
  min-height:100%!important;
  padding:18px!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fff 0%,#fff 72%,#fbf8ff 100%)!important;
}
.ds-dashboard .ds-badges>div{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-auto-rows:1fr!important;
  gap:10px!important;
  margin:0!important;
  align-self:stretch!important;
}
.ds-dashboard .ds-badges>div button{
  min-height:122px!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid #ded8ff!important;
  border-radius:13px!important;
  background:#fff!important;
  padding:9px 8px!important;
  box-shadow:0 8px 18px rgba(73,55,160,.05)!important;
}
.ds-dashboard .ds-badges img{
  width:78px!important;
  height:78px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 12px 10px rgba(60,45,130,.12))!important;
}
.ds-dashboard .ds-badges .locked img{
  opacity:.45!important;
  filter:grayscale(1) contrast(.82)!important;
}
.ds-dashboard .ds-feed{
  padding:13px 16px!important;
}
.ds-dashboard .ds-feed h2{
  margin-bottom:8px!important;
}
.ds-dashboard .ds-feed h2 small{
  margin-left:auto;
  color:#4e5a87;
  font-size:12px;
  font-weight:700;
}
.ds-dashboard .ds-selected-dragon{
  display:none!important;
}
.ds-dashboard .ds-feed-grid{
  grid-template-columns:repeat(8,minmax(0,1fr))!important;
  gap:10px!important;
}
.ds-dashboard .ds-feed-item{
  display:grid!important;
  min-height:104px!important;
  padding:8px 6px!important;
  border-radius:10px!important;
  background:#fff!important;
  border:1px solid #ded8ff!important;
}
.ds-dashboard .ds-feed-item b{
  min-height:24px!important;
  font-size:10px!important;
  line-height:1.12!important;
}
.ds-dashboard .ds-feed-item img{
  width:66px!important;
  height:48px!important;
  object-fit:contain!important;
  margin:auto!important;
}
.ds-dashboard .ds-feed-item span img{
  width:15px!important;
  height:15px!important;
}
.ds-dashboard .ds-feed-item span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:4px!important;
  width:100%!important;
  color:var(--ds-navy)!important;
  font-weight:950!important;
}
.ds-dashboard .ds-share{
  display:grid!important;
  grid-template-columns:1fr 150px!important;
  gap:12px!important;
  align-items:center!important;
  min-height:148px!important;
  background:linear-gradient(135deg,#fff 0%,#fbf7ff 62%,#f1ebff 100%)!important;
}
.ds-dashboard .ds-share>img{
  width:145px;
  height:120px;
  object-fit:contain;
  filter:drop-shadow(0 14px 20px rgba(88,65,180,.16));
}
.ds-dashboard .ds-share button{
  display:inline-flex!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px!important;
  width:210px!important;
  min-height:48px!important;
  margin-top:16px!important;
  border:0!important;
  border-radius:10px!important;
  background:linear-gradient(180deg,#765ef4,#5635d8)!important;
  color:#fff!important;
  box-shadow:0 12px 22px rgba(79,55,189,.2)!important;
}
.ds-dashboard .ds-share button img{
  width:24px;
  height:24px;
}
.full-collection-modal{
  display:grid;
  gap:12px;
}
.full-collection-modal>p{
  margin:0;
  color:#465181;
  font-size:13px;
  font-weight:750;
}
.full-collection-modal>b{
  color:#5140e8;
  font-size:15px;
}
.full-collection-grid{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:10px!important;
  max-height:58vh!important;
  overflow:auto!important;
  padding:4px!important;
}
.collection-tile{
  position:relative;
  display:grid!important;
  justify-items:center!important;
  align-content:start!important;
  gap:6px!important;
  min-height:128px!important;
  padding:10px 8px!important;
  border:1px solid #ded8ff!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#071044!important;
  cursor:pointer!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
.collection-tile.unlocked:hover{
  transform:translateY(-1px);
  border-color:#b9adff!important;
  box-shadow:0 14px 26px rgba(82,64,160,.12);
}
.collection-tile img{
  width:72px!important;
  height:72px!important;
  object-fit:contain!important;
}
.collection-tile span{
  color:#071044!important;
  font-size:11px!important;
  line-height:1.15!important;
  font-weight:900!important;
  text-align:center!important;
}
.collection-tile em{
  color:#5140e8!important;
  font-size:10px!important;
  font-style:normal!important;
  font-weight:900!important;
}
.collection-tile.locked{
  background:linear-gradient(180deg,#fff,#f7f7fb)!important;
  color:#777b94!important;
}
.collection-tile.locked img{
  filter:grayscale(1) contrast(.72)!important;
  opacity:.45!important;
}
.collection-tile.locked span,
.collection-tile.locked em{
  color:#85889d!important;
}
.collection-tile.locked:after{
  content:"";
  position:absolute;
  top:9px;
  right:9px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:rgba(91,86,126,.12);
}
.collection-tile.active{
  border-color:#7059ff!important;
  box-shadow:0 0 0 3px rgba(112,89,255,.12);
}
.egg-collection-grid .collection-tile img{
  width:78px!important;
  height:78px!important;
}
.badge-collection-grid .collection-tile img{
  width:66px!important;
  height:66px!important;
}
.coin-store-modal{
  display:grid;
  gap:16px;
}
.coin-store-modal>p{
  margin:0;
  color:#465181;
  font-size:14px;
  font-weight:750;
  line-height:1.4;
}
.coin-package-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}
.coin-package-card{
  position:relative;
  display:grid;
  justify-items:center;
  gap:7px;
  min-height:176px;
  padding:16px 12px;
  border:1px solid #ded8ff;
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#f7f4ff);
  box-shadow:0 12px 26px rgba(82,64,160,.08);
  text-align:center;
}
.coin-package-card small{
  position:absolute;
  top:9px;
  right:9px;
  padding:4px 8px;
  border-radius:999px;
  background:#fff1b9;
  color:#8a6200;
  font-size:10px;
  font-weight:950;
}
.coin-package-card img{
  width:32px;
  height:32px;
  object-fit:contain;
}
.coin-package-card h3{
  margin:0;
  color:#071044;
  font-size:17px;
}
.coin-package-card b{
  color:#5140e8;
  font-size:20px;
}
.coin-package-card button{
  min-height:34px;
  padding:0 16px;
  border:0;
  border-radius:999px;
  background:linear-gradient(180deg,#6957f4,#513fdc);
  color:#fff;
  font-weight:950;
  cursor:pointer;
}
.coin-use-note{
  padding:13px;
  border:1px solid #eeeafb;
  border-radius:16px;
  background:#fbfaff;
}
.coin-use-note h3{
  margin:0 0 10px;
  color:#071044;
  font-size:15px;
}
.coin-use-note div{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.coin-use-note span{
  padding:7px 10px;
  border-radius:999px;
  background:#fff;
  color:#5140e8;
  font-size:12px;
  font-weight:900;
  border:1px solid #eeeafb;
}
@media(max-width:1320px){
  .ds-dashboard .ds-topnav{
    grid-template-columns:200px 1fr;
  }
  .ds-dashboard .ds-nav-actions{
    grid-column:1/-1;
    justify-content:flex-end;
    margin-bottom:8px;
  }
  .ds-dashboard .ds-topnav nav{
    gap:20px;
  }
  .ds-dashboard .ds-summary-row{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  .ds-dashboard .ds-dashboard-grid{
    grid-template-columns:1fr 1fr!important;
    grid-template-areas:
      "dragon hatch"
      "tasks tasks"
      "family hatchery"
      "badges share"
      "feed feed";
  }
}
@media(max-width:760px){
  .dragon-studio-v2.ds-dashboard{
    padding:0 12px 18px!important;
  }
  .ds-dashboard .ds-topnav{
    grid-template-columns:1fr!important;
    gap:8px;
    padding:12px 0;
  }
  .ds-dashboard .ds-brand{
    width:180px;
  }
  .ds-dashboard .ds-brand img{
    width:180px;
  }
  .ds-dashboard .ds-topnav nav{
    justify-content:flex-start;
    gap:16px;
    overflow:auto;
    padding-bottom:4px;
  }
  .ds-dashboard .ds-topnav nav button{
    flex:0 0 auto;
    padding:8px 0 12px;
  }
  .ds-dashboard .ds-nav-actions{
    justify-content:flex-start;
    overflow:auto;
  }
  .ds-dashboard .ds-summary-row{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
  .ds-dashboard .ds-dashboard-grid{
    display:flex!important;
    flex-direction:column!important;
  }
  .ds-dashboard .ds-my-dragon{order:1}
  .ds-dashboard .ds-hatch{order:2}
  .ds-dashboard .ds-family{order:3}
  .ds-dashboard .ds-feed{order:4}
  .ds-dashboard .ds-hatchery{order:5}
  .ds-dashboard .ds-tasks{order:6}
  .ds-dashboard .ds-badges{order:7}
  .ds-dashboard .ds-share{order:8}
  .ds-dashboard .ds-dragon-main{
    grid-template-columns:1fr!important;
    text-align:center!important;
  }
  .ds-dashboard .ds-dragon-main>img{
    margin:auto!important;
    width:220px!important;
    height:220px!important;
  }
  .ds-dashboard .ds-dragon-main div{
    display:grid;
    justify-items:center;
  }
  .ds-dashboard .ds-hatch{
    padding:16px 12px!important;
  }
  .ds-dashboard .ds-hatch-title strong{
    min-width:0!important;
    font-size:27px!important;
  }
  .ds-dashboard .ds-days{
    grid-template-columns:repeat(4,1fr)!important;
    gap:12px!important;
  }
  .ds-dashboard .ds-days:before{
    display:none!important;
  }
  .ds-dashboard .ds-hatch>button{
    width:100%!important;
  }
  .ds-dashboard .ds-gallery-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .ds-dashboard .ds-feed h2{
    display:block!important;
  }
  .ds-dashboard .ds-feed h2 small{
    display:block;
    margin:6px 0 0;
  }
  .ds-dashboard .ds-feed-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .ds-dashboard .ds-badges>div{
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .ds-dashboard .ds-badges img{
    width:52px!important;
    height:52px!important;
  }
  .ds-dashboard .ds-share{
    grid-template-columns:1fr!important;
    text-align:center;
  }
  .ds-dashboard .ds-share>img{
    margin:auto;
  }
  .ds-dashboard .ds-share button{
    width:100%!important;
  }
  .full-collection-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    max-height:62vh!important;
  }
  .coin-package-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Level card pricing cleanup: compact, balanced columns across G2-12 / ISEE / SSAT. */
.level-card .pricing-row,
.level-grid.ssat .level-card .pricing-row{
  display:grid!important;
  grid-template-columns:minmax(0,.95fr) minmax(0,.95fr) minmax(0,1.1fr)!important;
  min-height:0!important;
  border-radius:12px!important;
  overflow:hidden!important;
}
.level-card .price-choice,
.level-grid.ssat .level-card .price-choice{
  display:grid!important;
  grid-template-columns:1fr!important;
  justify-items:center!important;
  align-content:start!important;
  gap:3px!important;
  min-height:68px!important;
  padding:8px 5px 7px!important;
  text-align:center!important;
  background:#fff!important;
  font-size:12px!important;
  line-height:1.15!important;
}
.level-card .price-choice .radio,
.level-grid.ssat .level-card .price-choice .radio{
  display:block!important;
  width:14px!important;
  height:14px!important;
  margin:0 auto 2px!important;
  border-width:1.4px!important;
  flex:0 0 auto!important;
}
.level-card .price-choice .radio.on,
.level-grid.ssat .level-card .price-choice .radio.on{
  border-width:4px!important;
}
.level-card .price-choice b,
.level-grid.ssat .level-card .price-choice b{
  display:block!important;
  margin:0!important;
  color:#07133f!important;
  font-size:12.5px!important;
  line-height:1.12!important;
  font-weight:950!important;
  white-space:nowrap!important;
}
.level-card .price-choice small,
.level-grid.ssat .level-card .price-choice small{
  display:block!important;
  margin:0!important;
  color:#59617f!important;
  font-size:10.5px!important;
  line-height:1.12!important;
  font-weight:750!important;
}
.level-card .yearly-choice,
.level-grid.ssat .level-card .yearly-choice{
  gap:2px!important;
  padding-left:3px!important;
  padding-right:3px!important;
}
.level-card .yearly-price-copy,
.level-grid.ssat .level-card .yearly-price-copy{
  display:grid!important;
  justify-items:center!important;
  gap:3px!important;
  width:100%!important;
  min-width:0!important;
}
.level-card .yearly-choice small,
.level-grid.ssat .level-card .yearly-choice small{
  white-space:nowrap!important;
  max-width:100%!important;
  padding:0 2px!important;
  font-size:clamp(8px,.62vw,9.5px)!important;
  line-height:1.05!important;
  letter-spacing:0!important;
}
.level-card .price-choice .tag,
.level-grid.ssat .level-card .price-choice .tag{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  margin:1px 0 0!important;
  padding:2px 7px!important;
  border-radius:999px!important;
  background:#ffe19b!important;
  color:#07133f!important;
  font-size:9.5px!important;
  line-height:1.1!important;
  font-weight:950!important;
  white-space:nowrap!important;
}
@media(max-width:620px){
  .level-card .pricing-row,
  .level-grid.ssat .level-card .pricing-row{
    grid-template-columns:1fr!important;
  }
  .level-card .price-choice,
  .level-grid.ssat .level-card .price-choice{
    min-height:58px!important;
    padding:8px 10px!important;
  }
}

/* Clean game headers: remove static sparkle/firework/star-pattern decorations. */
.he-game-route::before,
.stoke-fire-page::before,
.forge-scale-page::before,
.dragon-flight-page::before,
.hatchery-match-page::before,
.term-definition-page::before,
.dragons-whisper-page::before{
  display:none!important;
  background-image:none!important;
}
.he-route-sparkle,
.stoke-sparkle,
.forge-sparkle,
.flight-sparkle,
.hatchery-sparkle,
.term-sparkle,
.whisper-sparkle{
  display:none!important;
}

/* Profile visual refresh using uploaded profile_new assets. */
.profile-new-icon{
  width:22px!important;
  height:22px!important;
  object-fit:contain!important;
  vertical-align:middle!important;
  flex:0 0 auto!important;
}
.profile-dash-hero .profile-new-icon{
  width:16px!important;
  height:20px!important;
}
.profile-dash-actions .profile-new-icon{
  width:16px!important;
  height:20px!important;
}
.profile-approved-dashboard{
  max-width:1380px!important;
}
.profile-studio-card,
.profile-community-card{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  border-color:rgba(188,177,255,.6)!important;
}
.profile-studio-card::before,
.profile-community-card::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-2!important;
  background-size:cover!important;
  background-position:center!important;
}
.profile-studio-card::after,
.profile-community-card::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  pointer-events:none!important;
}
.profile-studio-card::before{
  background-image:url("assets/assets_webp/my-profile-backgrounds/bg_profile_dragon_studio_panel.webp")!important;
}
.profile-studio-card::after{
  background:linear-gradient(90deg,rgba(13,21,87,.54),rgba(21,19,102,.34))!important;
}
.profile-community-card::before{
  background-image:url("assets/assets_webp/my-profile-backgrounds/bg_profile_community_panel.webp")!important;
}
.profile-community-card::after{
  background:linear-gradient(180deg,rgba(27,22,112,.28),rgba(44,30,133,.2))!important;
}
.profile-studio-card .profile-card-heading h3,
.profile-studio-card .profile-studio-copy h4,
.profile-studio-card .profile-xp-row,
.profile-studio-card .profile-xp-row b,
.profile-studio-card .profile-badge-strip>span{
  color:#fff!important;
}
.profile-studio-card .profile-studio-copy p,
.profile-studio-card .profile-studio-copy small{
  color:rgba(255,255,255,.86)!important;
}
.profile-studio-card .profile-kicker{
  color:#fff!important;
  background:rgba(124,92,255,.55)!important;
  border:1px solid rgba(255,255,255,.16)!important;
}
.profile-studio-dragon{
  background:#fff!important;
  border:1px solid rgba(255,255,255,.92)!important;
  box-shadow:0 18px 36px rgba(0,0,0,.18)!important;
}
.profile-studio-card .profile-xp-bar{
  background:rgba(255,255,255,.24)!important;
  border:1px solid rgba(255,255,255,.18)!important;
}
.profile-studio-card .profile-xp-bar i{
  background:linear-gradient(90deg,#8d79ff,#d8ceff)!important;
}
.profile-enter-studio{
  gap:8px!important;
  border:1px solid rgba(255,255,255,.36)!important;
  background:linear-gradient(135deg,#8d70ff,#5331dd)!important;
}
.profile-enter-studio .profile-new-icon{
  width:22px!important;
  height:22px!important;
}
.profile-studio-divider{
  background:linear-gradient(90deg,rgba(255,255,255,.08),rgba(255,255,255,.45),rgba(255,255,255,.08))!important;
}
.profile-badge-strip>span{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
}
.profile-badge-strip>span .profile-new-icon{
  width:28px!important;
  height:28px!important;
}
.profile-community-card .profile-card-heading h3{
  color:#fff!important;
}
.profile-community-card .profile-card-heading button{
  background:#fff!important;
  color:#5135df!important;
  box-shadow:0 10px 20px rgba(20,18,74,.12)!important;
}
.profile-community-card .leader-mini-card,
.profile-community-card .invite-mini-card{
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(255,255,255,.76)!important;
  box-shadow:0 12px 28px rgba(20,18,74,.08)!important;
}
.dash-stat-tile>img{
  width:52px!important;
  height:52px!important;
  object-fit:contain!important;
}
.profile-encouragement{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
}
.profile-encouragement .profile-new-icon{
  width:28px!important;
  height:28px!important;
}
.profile-account-card h3,
.profile-help-card h3,
.profile-settings-group h4{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}
.profile-settings-group h4 .profile-new-icon{
  width:18px!important;
  height:18px!important;
}
.profile-settings-primary .profile-new-icon{
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.1))!important;
}
.profile-help-questions button{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
}
.profile-help-questions button .profile-new-icon{
  width:16px!important;
  height:16px!important;
}
.profile-help-actions button{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
}
.profile-help-actions button .profile-new-icon{
  width:16px!important;
  height:20px!important;
}
@media(max-width:720px){
  .profile-studio-card::after{
    background:rgba(13,21,87,.58)!important;
  }
  .profile-community-card::after{
    background:rgba(44,30,133,.3)!important;
  }
}

/* Compact How HatchElite Works modal. */
.how-modal{
  width:min(820px,92vw)!important;
  max-height:88vh!important;
  overflow:auto!important;
  padding:22px 28px 24px!important;
  border-radius:24px!important;
  border:1px solid #e3ddff!important;
  background:#fff!important;
  box-shadow:0 28px 80px rgba(20,18,74,.25)!important;
}
.how-modal .modal-close{
  top:18px!important;
  right:20px!important;
  width:34px!important;
  height:34px!important;
  background:transparent!important;
  color:#34345f!important;
  font-size:34px!important;
  line-height:1!important;
}
.how-modal-head{
  grid-template-columns:76px minmax(0,1fr)!important;
  gap:16px!important;
  align-items:center!important;
  margin-bottom:18px!important;
  padding-right:50px!important;
}
.how-title-icon{
  width:70px!important;
  height:70px!important;
  border-radius:50%!important;
  background:#efe9ff!important;
  border:0!important;
}
.how-title-icon img{
  width:52px!important;
  height:52px!important;
  object-fit:contain!important;
}
.how-modal-head h2{
  margin:0 0 8px!important;
  color:#070b3f!important;
  font-size:32px!important;
  line-height:1.05!important;
  font-weight:1000!important;
  letter-spacing:0!important;
}
.how-modal-head p{
  max-width:640px!important;
  color:#071044!important;
  font-size:15.5px!important;
  line-height:1.45!important;
  font-weight:650!important;
}
.how-work-sections{
  gap:14px!important;
}
.how-work-card{
  grid-template-columns:72px minmax(0,1fr)!important;
  gap:14px!important;
  padding:10px 2px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
.how-work-card>img{
  width:60px!important;
  height:60px!important;
  justify-self:center!important;
  border-radius:50%!important;
  background:#efe9ff!important;
  object-fit:contain!important;
}
.how-work-card h3{
  margin:0 0 5px!important;
  color:#070b3f!important;
  font-size:18px!important;
  line-height:1.18!important;
  font-weight:1000!important;
}
.how-work-card p{
  margin:0!important;
  color:#071044!important;
  font-size:14px!important;
  line-height:1.42!important;
  font-weight:600!important;
}
.how-memory-path{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  margin:14px 0 9px!important;
  padding:10px 12px!important;
  border-radius:14px!important;
  background:#eee9ff!important;
  border:1px solid #e1d9ff!important;
  overflow:hidden!important;
}
.how-memory-path span{
  display:grid!important;
  justify-items:center!important;
  gap:3px!important;
  min-width:45px!important;
  color:#160b67!important;
  font-weight:950!important;
}
.how-memory-path span img{
  width:30px!important;
  height:30px!important;
  object-fit:contain!important;
}
.how-memory-path span b{
  font-size:10px!important;
  line-height:1.05!important;
  white-space:nowrap!important;
}
.how-memory-path i{
  flex:0 0 auto!important;
  color:#5b35e6!important;
  font-style:normal!important;
  font-size:16px!important;
  font-weight:1000!important;
}
.how-reminder-bar{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  margin:0!important;
  padding:8px 12px!important;
  border-radius:12px!important;
  background:#f0ecff!important;
  color:#11134f!important;
  font-size:13px!important;
  line-height:1.3!important;
  font-weight:650!important;
}
.how-reminder-bar img{
  width:28px!important;
  height:28px!important;
  object-fit:contain!important;
  flex:0 0 auto!important;
}
.how-closing-line{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:16px!important;
  margin:18px 0 14px!important;
  padding:13px 16px!important;
  border-radius:14px!important;
  border:1px solid #d9ceff!important;
  background:linear-gradient(180deg,#fff,#f4efff)!important;
  color:#4b25e6!important;
  font-size:18px!important;
  line-height:1.15!important;
  font-weight:1000!important;
  text-align:center!important;
}
.how-closing-line img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
.how-learn-more{
  width:min(420px,100%)!important;
  min-height:52px!important;
  gap:18px!important;
  border-radius:14px!important;
  background:linear-gradient(135deg,#6f38ff,#4d22df)!important;
  color:#fff!important;
  font-size:17px!important;
  box-shadow:0 14px 28px rgba(82,35,220,.22)!important;
}
.how-learn-more b{
  font-size:24px!important;
  line-height:1!important;
}
@media(max-width:820px){
  .how-modal{
    padding:20px 16px 22px!important;
    max-height:92vh!important;
  }
  .how-modal-head{
    grid-template-columns:58px minmax(0,1fr)!important;
    padding-right:42px!important;
  }
  .how-title-icon{
    width:54px!important;
    height:54px!important;
  }
  .how-title-icon img{
    width:40px!important;
    height:40px!important;
  }
  .how-modal-head h2{
    font-size:25px!important;
  }
  .how-modal-head p{
    font-size:13.5px!important;
  }
  .how-work-card{
    grid-template-columns:54px minmax(0,1fr)!important;
    gap:10px!important;
  }
  .how-work-card>img{
    width:48px!important;
    height:48px!important;
  }
  .how-memory-path{
    justify-content:flex-start!important;
    overflow-x:auto!important;
  }
  .how-closing-line{
    gap:8px!important;
    font-size:15px!important;
  }
  .how-closing-line img{
    width:26px!important;
    height:26px!important;
  }
}

/* Final compact game selection card pass. Keep score/played as the thinnest row. */
.he-games-select-page .he-games-grid{gap:18px!important;align-items:stretch!important}
.he-games-select-page .hatchelite-game-card{min-height:0!important;height:100%!important;padding:14px!important;border-radius:22px!important}
.he-games-select-page .game-card-image-wrap{height:150px!important;min-height:150px!important;max-height:150px!important;margin:0 0 12px!important;border-radius:16px!important}
.he-games-select-page .game-card-content{gap:8px!important;padding:0!important}
.he-games-select-page .game-card-content h2{margin:0 0 4px!important;font-size:22px!important;line-height:1.1!important}
.he-games-select-page .game-card-content h2:after{margin:8px auto 0!important}
.he-games-select-page .game-card-content p{min-height:36px!important;margin:0!important;font-size:13px!important;line-height:1.35!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
.he-games-select-page .game-tags{gap:8px!important;margin:0!important}
.he-games-select-page .game-tag{min-height:22px!important;padding:5px 12px!important;font-size:11px!important;line-height:1!important}
.he-games-select-page .game-card-progress{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;height:26px!important;min-height:26px!important;padding:0 12px!important;margin:4px 0 10px!important;border-top:1px solid rgba(110,90,220,.18)!important;background:transparent!important;border-radius:0!important;gap:8px!important}
.he-games-select-page .game-card-progress span,.he-games-select-page .game-card-progress .game-card-stat{display:flex!important;align-items:center!important;justify-content:center!important;gap:5px!important;padding:0!important;border:0!important;background:transparent!important;border-radius:0!important;color:#0b1150!important;font-size:10px!important;line-height:1!important;font-weight:800!important;white-space:nowrap!important}
.he-games-select-page .game-card-progress span:before,
.he-games-select-page .game-card-progress span:first-child:before,
.he-games-select-page .game-card-progress span:last-child:before{content:""!important;display:none!important;width:0!important;height:0!important;font-size:0!important}
body.game-route-mode .he-games-select-page .game-card-progress span:before,
body.game-route-mode .he-games-select-page .game-card-progress span:first-child:before,
body.game-route-mode .he-games-select-page .game-card-progress span:last-child:before{content:""!important;display:none!important;width:0!important;height:0!important;font-size:0!important}
.he-games-select-page .game-card-stat-icon{display:inline-grid!important;place-items:center!important;width:13px!important;height:13px!important;font-size:12px!important;line-height:1!important}
.he-games-select-page .game-card-stat-label{color:#4d5474!important;font-size:10px!important;font-weight:750!important;line-height:1!important}
.he-games-select-page .game-card-progress b,.he-games-select-page .game-card-stat-value{display:inline!important;margin:0 0 0 2px!important;padding:0!important;color:#0b1150!important;font-size:12px!important;line-height:1!important;font-weight:950!important}
.he-games-select-page .game-card-stat-divider{display:block!important;width:1px!important;height:14px!important;flex:0 0 1px!important;background:rgba(110,90,220,.25)!important}
.he-games-select-page .play-game-button{height:42px!important;min-height:42px!important;margin:auto 0 0!important;border-radius:12px!important;font-size:15px!important;font-weight:850!important}
@media(max-width:700px){.he-games-select-page .game-card-image-wrap{height:150px!important;min-height:150px!important}.he-games-select-page .game-card-progress{padding:0 8px!important}}

/* Unified logged-in app header. */
body.game-route-mode .topbar.app-header,
body.dragon-studio-mode .topbar.app-header,
.topbar.app-header{
  display:flex!important;
  position:sticky!important;
  top:0!important;
  z-index:80!important;
  width:100%!important;
  height:76px!important;
  min-height:76px!important;
  padding:0 28px!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  background:#fff!important;
  border-bottom:1px solid rgba(105,85,235,.16)!important;
  border-radius:0!important;
  box-shadow:0 4px 18px rgba(42,35,120,.04)!important;
}
.app-header-logo{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  cursor:pointer!important;
}
.app-header-logo img{
  width:168px!important;
  height:54px!important;
  object-fit:contain!important;
}
.header-level-pill{
  height:34px!important;
  padding:0 14px!important;
  border-radius:999px!important;
  border:1px solid rgba(105,85,235,.28)!important;
  background:#fff!important;
  color:#11154f!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  font-size:13px!important;
  font-weight:850!important;
  box-shadow:0 6px 16px rgba(75,55,180,.06)!important;
  cursor:pointer!important;
  white-space:nowrap!important;
}
.student-switcher-wrap{
  display:flex!important;
  align-items:center!important;
  margin:0!important;
}
.student-switcher{
  height:34px!important;
  padding:0 34px 0 14px!important;
  border-radius:999px!important;
  border:1px solid rgba(105,85,235,.28)!important;
  background:#fff!important;
  color:#11154f!important;
  font-size:13px!important;
  font-weight:900!important;
  box-shadow:0 6px 16px rgba(75,55,180,.06)!important;
  cursor:pointer!important;
  outline:none!important;
}
.student-switcher:focus{
  border-color:#6547f5!important;
  box-shadow:0 0 0 3px rgba(101,71,245,.14)!important;
}
.app-nav{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:30px!important;
  flex:1 1 auto!important;
}
.app-nav-link{
  height:76px!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:0!important;
  border:0!important;
  border-bottom:4px solid transparent!important;
  background:transparent!important;
  color:#10144f!important;
  font-size:15px!important;
  font-weight:850!important;
  cursor:pointer!important;
}
.app-nav-link .ui-inline-icon{
  width:18px!important;
  height:18px!important;
}
.app-nav-link.active{
  color:#6547f5!important;
  border-bottom-color:#6547f5!important;
}
.header-actions{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
}
.header-status-pill{
  height:34px!important;
  padding:0 14px!important;
  border-radius:999px!important;
  border:1px solid rgba(105,85,235,.22)!important;
  background:#fff!important;
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
  color:#11154f!important;
  font-size:13px!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
.header-status-pill img{
  width:18px!important;
  height:18px!important;
  object-fit:contain!important;
}
.header-avatar-button{
  border:0!important;
  background:transparent!important;
  padding:0!important;
  cursor:pointer!important;
}
.header-avatar{
  width:44px!important;
  height:44px!important;
  border-radius:999px!important;
  border:2px solid rgba(105,85,235,.22)!important;
  object-fit:cover!important;
  background:#fff!important;
}
.mobile-menu-button{
  display:none!important;
  align-items:center!important;
  justify-content:center!important;
  width:40px!important;
  height:34px!important;
  border:1px solid rgba(105,85,235,.22)!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#6547f5!important;
  font-size:20px!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.app-header-mobile-menu{
  position:absolute!important;
  right:18px!important;
  top:66px!important;
  z-index:90!important;
  display:grid!important;
  gap:4px!important;
  min-width:190px!important;
  padding:8px!important;
  border:1px solid rgba(105,85,235,.18)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 18px 42px rgba(42,35,120,.16)!important;
}
.app-header-mobile-menu.hidden{display:none!important}
.app-header-mobile-menu button{
  min-height:38px!important;
  border:0!important;
  border-radius:10px!important;
  background:transparent!important;
  color:#10144f!important;
  font-size:13px!important;
  font-weight:850!important;
  text-align:left!important;
  padding:0 10px!important;
}
.app-header-mobile-menu button:hover{background:#f4f1ff!important;color:#6547f5!important}
.game-page-back-row{
  width:min(96vw,1500px)!important;
  margin:18px auto 0!important;
  position:relative!important;
  z-index:4!important;
}
.page-back-button{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  height:34px!important;
  padding:0 14px!important;
  border-radius:999px!important;
  border:1px solid rgba(105,85,235,.22)!important;
  background:#fff!important;
  color:#6547f5!important;
  font-size:13px!important;
  font-weight:850!important;
  text-decoration:none!important;
  cursor:pointer!important;
}
.he-games-select-page .he-games-hero-block .he-game-wallet{display:none!important}
@media(max-width:1080px){
  .app-header-logo img{width:142px!important}
  .app-nav{gap:20px!important}
  .header-status-pill{padding:0 10px!important}
}
@media(max-width:900px){
  .topbar.app-header{padding:0 14px!important;gap:10px!important}
  .app-header-logo img{width:126px!important}
  .app-nav{display:none!important}
  .header-status-pill{display:none!important}
  .mobile-menu-button{display:flex!important}
  .header-level-pill{max-width:calc(100vw - 230px)!important;overflow:hidden!important;text-overflow:ellipsis!important}
}
@media(max-width:520px){
  .app-header-logo img{width:112px!important}
  .header-level-pill{font-size:11px!important;padding:0 9px!important;max-width:120px!important}
}

/* My Dragon premium card refinement */
.ds-dashboard .ds-my-dragon{
  min-height:0!important;
  align-content:start!important;
  overflow:visible!important;
  padding:clamp(24px,2.2vw,36px)!important;
  border:1px solid rgba(140,110,255,.22)!important;
  border-radius:32px!important;
  background:#fff!important;
  box-shadow:
    0 0 0 2px rgba(255,255,255,.9),
    0 0 38px rgba(95,45,210,.55),
    0 0 90px rgba(40,10,95,.75)!important;
}
.ds-dashboard .ds-my-dragon:before,
.ds-dashboard .ds-my-dragon:after{
  display:none!important;
}
.ds-dashboard .ds-my-dragon h2{
  margin:0 0 26px!important;
  font-size:clamp(28px,2.25vw,42px)!important;
  line-height:1.05!important;
  letter-spacing:0!important;
  color:#090947!important;
}
.ds-dashboard .ds-my-dragon h2 .ds-ui-icon{
  width:34px!important;
  height:34px!important;
}
.ds-dashboard .ds-dragon-main{
  grid-template-columns:minmax(220px,.95fr) minmax(230px,1fr)!important;
  gap:clamp(18px,2vw,32px)!important;
  align-items:center!important;
}
.ds-dashboard .dragon-avatar-frame{
  width:100%!important;
  aspect-ratio:1/1!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  border:1px solid rgba(150,125,255,.22)!important;
  border-radius:26px!important;
  background:#fff!important;
}
.ds-dashboard .dragon-avatar-frame img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  background:#fff!important;
  filter:none!important;
}
.ds-dashboard .dragon-info-stack{
  display:grid!important;
  gap:16px!important;
  align-content:center!important;
}
.ds-dashboard .dragon-info-stack h3{
  margin:0!important;
  font-size:clamp(38px,3vw,58px)!important;
  line-height:1!important;
  color:#090947!important;
  letter-spacing:0!important;
}
.ds-dashboard .dragon-info-stack .dragon-egg-pill{
  display:inline-flex!important;
  align-items:center!important;
  gap:12px!important;
  width:max-content!important;
  max-width:100%!important;
  min-height:58px!important;
  padding:0 26px!important;
  border:1px solid rgba(150,125,255,.25)!important;
  border-radius:20px!important;
  background:linear-gradient(180deg,#fff 0%,#f7f2ff 100%)!important;
  color:#5b45e8!important;
  font-size:clamp(20px,1.4vw,29px)!important;
  font-weight:900!important;
  font-style:normal!important;
}
.ds-dashboard .dragon-info-stack .dragon-egg-pill img{
  width:32px!important;
  height:32px!important;
}
.ds-dashboard .dragon-mood-row{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  width:min(100%,260px)!important;
  min-height:76px!important;
  padding:14px 22px!important;
  border:1px solid rgba(150,125,255,.25)!important;
  border-radius:20px!important;
  background:#fff!important;
  color:#090947!important;
  box-shadow:0 10px 24px rgba(95,45,210,.08)!important;
}
.ds-dashboard .dragon-mood-row span{
  display:inline-flex!important;
  width:auto!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:inherit!important;
}
.ds-dashboard .dragon-mood-row .mood-emoji{
  font-size:34px!important;
  line-height:1!important;
}
.ds-dashboard .dragon-mood-row .mood-label{
  font-size:clamp(23px,1.7vw,32px)!important;
  font-weight:950!important;
  line-height:1!important;
}
.ds-dashboard .dragon-mood-row .mood-info{
  margin-left:auto!important;
  width:34px!important;
  height:34px!important;
  align-items:center!important;
  justify-content:center!important;
  border:2px solid rgba(170,150,255,.35)!important;
  border-radius:999px!important;
  color:#c0b3ff!important;
  font-size:19px!important;
  font-weight:950!important;
  font-family:Georgia,serif!important;
}
.ds-dashboard .mood-tooltip{
  display:none!important;
  position:absolute!important;
  right:-18px!important;
  top:-44px!important;
  z-index:5!important;
  padding:10px 16px!important;
  border:1px solid rgba(130,90,255,.35)!important;
  border-radius:12px!important;
  background:#fff!important;
  color:#5a45e8!important;
  font-weight:800!important;
  box-shadow:0 8px 22px rgba(95,45,210,.22)!important;
  white-space:nowrap!important;
}
.ds-dashboard .dragon-mood-row:hover .mood-tooltip,
.ds-dashboard .dragon-mood-row:focus-within .mood-tooltip{
  display:block!important;
}
.ds-dashboard .dragon-info-stack .ds-hatched-date{
  width:min(100%,270px)!important;
  min-height:82px!important;
  grid-template-columns:44px 1fr!important;
  gap:3px 14px!important;
  align-items:center!important;
  margin:0!important;
  padding:16px 18px!important;
  border:1px solid rgba(150,125,255,.25)!important;
  border-radius:20px!important;
  background:#fff!important;
  color:#090947!important;
  font-size:20px!important;
  box-shadow:0 10px 24px rgba(95,45,210,.07)!important;
}
.ds-dashboard .dragon-info-stack .ds-hatched-date img{
  grid-row:1/3!important;
  width:36px!important;
  height:36px!important;
}
.ds-dashboard .dragon-info-stack .ds-hatched-date b{
  font-size:19px!important;
  line-height:1.05!important;
  white-space:nowrap!important;
}
.ds-dashboard .dragon-info-stack .ds-hatched-date small{
  font-size:18px!important;
  line-height:1.15!important;
  color:#6b6688!important;
  font-weight:900!important;
}
.ds-dashboard .dragon-info-stack .change-avatar-button{
  width:min(100%,320px)!important;
  min-height:64px!important;
  margin-top:2px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  border:2px solid rgba(120,85,255,.45)!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,#fff 0%,#f4efff 100%)!important;
  color:#5b45e8!important;
  font-size:clamp(20px,1.45vw,28px)!important;
  font-weight:950!important;
  box-shadow:0 10px 24px rgba(95,45,210,.22)!important;
}
.ds-dashboard .dragon-info-stack .change-avatar-button img{
  width:34px!important;
  height:34px!important;
}
@media(max-width:1200px){
  .ds-dashboard .ds-dragon-main{
    grid-template-columns:1fr!important;
  }
  .ds-dashboard .dragon-info-stack{
    justify-items:center!important;
    text-align:center!important;
  }
  .ds-dashboard .dragon-mood-row,
  .ds-dashboard .dragon-info-stack .ds-hatched-date,
  .ds-dashboard .dragon-info-stack .change-avatar-button{
    width:100%!important;
    max-width:320px!important;
  }
}
@media(max-width:760px){
  .ds-dashboard .ds-my-dragon{
    padding:22px!important;
    border-radius:26px!important;
  }
  .ds-dashboard .ds-my-dragon h2{
    margin-bottom:18px!important;
  }
  .ds-dashboard .dragon-info-stack h3{
    font-size:36px!important;
  }
  .ds-dashboard .dragon-info-stack .dragon-egg-pill,
  .ds-dashboard .dragon-info-stack .ds-hatched-date small{
    font-size:18px!important;
  }
}

/* Paired Dragon Family / Egg Hatchery previews */
.ds-dashboard .ds-family,
.ds-dashboard .ds-hatchery{
  display:grid!important;
  grid-template-rows:auto 1fr auto!important;
  gap:12px!important;
  padding:18px!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fff 0%,#fff 72%,#fbf8ff 100%)!important;
}
.ds-dashboard .ds-family h2,
.ds-dashboard .ds-hatchery h2{
  margin:0!important;
  font-size:22px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-family .ds-gallery-grid,
.ds-dashboard .ds-hatchery .ds-gallery-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  grid-auto-rows:1fr!important;
  gap:10px!important;
  align-self:stretch!important;
}
.ds-dashboard .ds-family .ds-gallery-tile,
.ds-dashboard .ds-hatchery .ds-gallery-tile{
  min-height:122px!important;
  height:100%!important;
  display:grid!important;
  grid-template-rows:1fr auto!important;
  justify-items:center!important;
  align-items:center!important;
  gap:7px!important;
  padding:9px 8px!important;
  border:1px solid #ded8ff!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:0 8px 18px rgba(73,55,160,.05)!important;
}
.ds-dashboard .ds-family .ds-gallery-tile img,
.ds-dashboard .ds-hatchery .ds-gallery-tile img{
  width:92px!important;
  height:72px!important;
  object-fit:contain!important;
  margin:0!important;
}
.ds-dashboard .ds-hatchery .ds-gallery-tile img{
  width:88px!important;
  height:78px!important;
}
.ds-dashboard .ds-family .ds-gallery-tile b,
.ds-dashboard .ds-hatchery .ds-gallery-tile b{
  min-height:28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#070b42!important;
  font-size:11px!important;
  line-height:1.08!important;
  font-weight:950!important;
  text-align:center!important;
}
.ds-dashboard .ds-family>button,
.ds-dashboard .ds-hatchery>button,
.ds-dashboard .ds-badges>button{
  min-height:40px!important;
  margin-top:2px!important;
  border:1px solid #d8d1ff!important;
  border-radius:12px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.ds-dashboard .ds-badges>div{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;
}

/* Flashcard definition view readability pass */
.study-page .main-study-card{
  min-height:360px!important;
  padding:18px 24px!important;
}
.study-page .word-display{
  padding:14px 0 6px!important;
}
.study-page .word-display.definition-front{
  max-width:760px!important;
  padding:12px 18px 6px!important;
}
.study-page .word-display.definition-front h2{
  max-width:660px!important;
  margin:0 auto!important;
  color:#232b5f!important;
  font-size:clamp(18px,1.65vw,24px)!important;
  line-height:1.42!important;
  font-weight:500!important;
  letter-spacing:0!important;
}
.study-page .reveal-box{
  max-width:560px!important;
  margin:10px auto!important;
  padding:13px 16px!important;
  font-size:14px!important;
  line-height:1.35!important;
}
.study-page .reveal-box button{
  margin-top:10px!important;
  padding:10px 24px!important;
  font-size:14px!important;
}
.study-page .answer-panel.flash-answer{
  max-width:620px!important;
  margin:12px auto!important;
  padding:14px 16px!important;
}
.study-page .answer-panel.flash-answer p{
  margin:8px 0!important;
  font-size:14px!important;
  line-height:1.45!important;
  font-weight:500!important;
}
.study-page .answer-panel.flash-answer p>b{
  font-weight:700!important;
}
.study-page .action-row{
  margin-top:12px!important;
}
@media(max-width:760px){
  .ds-dashboard .ds-family .ds-gallery-grid,
  .ds-dashboard .ds-hatchery .ds-gallery-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .study-page .word-display.definition-front h2{
    font-size:18px!important;
    line-height:1.38!important;
  }
}

/* Dragon Studio compact icy dashboard pass */
.dragon-studio-v2.ds-dashboard{
  width:min(1880px,calc(100vw - 28px))!important;
  margin:0 auto!important;
  padding:10px 14px 14px!important;
}
.ds-dashboard .ds-summary-row{
  max-width:none!important;
  margin:0 auto 10px!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:10px!important;
}
.ds-dashboard .ds-summary-row article,
.ds-dashboard .ds-summary-row button{
  height:54px!important;
  min-height:54px!important;
  grid-template-columns:36px minmax(0,1fr) auto!important;
  column-gap:10px!important;
  padding:8px 12px!important;
  border-radius:14px!important;
  box-shadow:0 4px 14px rgba(78,52,180,.08)!important;
}
.ds-dashboard .ds-summary-row img{
  width:24px!important;
  height:24px!important;
}
.ds-dashboard .ds-summary-row strong,
.ds-dashboard .ds-summary-row b{
  font-size:20px!important;
  line-height:1!important;
  white-space:normal!important;
}
.ds-dashboard .ds-summary-row span{
  margin:2px 0 0!important;
  font-size:10px!important;
  line-height:1.05!important;
}
.ds-dashboard .ds-summary-row i{
  font-size:20px!important;
}
.ds-dashboard .ds-dashboard-grid{
  max-width:none!important;
  grid-template-columns:1.02fr 1.28fr .86fr!important;
  gap:10px!important;
}
.ds-dashboard .ds-card{
  border-radius:16px!important;
  padding:12px!important;
  box-shadow:0 4px 14px rgba(78,52,180,.08)!important;
}
.ds-dashboard .ds-card h2{
  margin-bottom:8px!important;
  font-size:14px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-card h2 .ds-ui-icon,
.ds-dashboard .ds-card h2 .ui-inline-icon{
  width:18px!important;
  height:18px!important;
}
.ds-dashboard .my-dragon-card{
  min-height:350px!important;
  display:block!important;
  overflow:hidden!important;
  padding:16px 18px 14px!important;
  border:1px solid rgba(146,125,255,.24)!important;
  border-radius:18px!important;
  background:#f6f7ff url("assets/my-dragon-studio-batch/optimized-my-dragon-studio-webp/my-dragon-card/bg_my_dragon_icy_ruins.webp") center/cover no-repeat!important;
  box-shadow:0 6px 18px rgba(74,49,172,.1)!important;
}
.ds-dashboard .my-dragon-card:before{
  content:none!important;
  display:none!important;
  background:none!important;
  pointer-events:none!important;
}
.ds-dashboard .my-dragon-card:after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.02) 48%,rgba(14,24,70,.12))!important;
  pointer-events:none!important;
  z-index:0!important;
}
.ds-dashboard .my-dragon-card>.card-inner{
  position:relative!important;
  z-index:1!important;
  height:100%!important;
  min-height:324px!important;
  display:flex!important;
  flex-direction:column!important;
}
.ds-dashboard .my-dragon-header{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  margin:2px 0 6px!important;
}
.ds-dashboard .my-dragon-header img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
.ds-dashboard .my-dragon-header h2{
  margin:0!important;
  color:#16205e!important;
  font-size:18px!important;
  font-weight:950!important;
  line-height:1.05!important;
}
.ds-dashboard .my-dragon-hero{
  flex:1 1 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:4px 0 2px!important;
}
.ds-dashboard .my-dragon-art-frame{
  width:100%!important;
  max-width:290px!important;
  height:205px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid rgba(223,214,255,.8)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.86)!important;
  box-shadow:0 8px 22px rgba(64,44,146,.12)!important;
  backdrop-filter:blur(2px)!important;
}
.ds-dashboard .my-dragon-art-frame img{
  width:92%!important;
  height:92%!important;
  object-fit:contain!important;
  background:transparent!important;
  filter:none!important;
}
.ds-dashboard .my-dragon-name{
  margin:4px 0 10px!important;
  color:#1d2d73!important;
  text-align:center!important;
  font-size:34px!important;
  font-weight:950!important;
  line-height:1!important;
}
.ds-dashboard .my-dragon-meta-bar{
  min-height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  padding:8px 12px!important;
  border:1px solid rgba(220,210,255,.95)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.84)!important;
  box-shadow:0 4px 14px rgba(64,44,146,.08)!important;
}
.ds-dashboard .meta-pill{
  min-width:0!important;
  min-height:0!important;
  width:auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#2a2d63!important;
  font-size:13px!important;
  font-weight:850!important;
  line-height:1.05!important;
  white-space:nowrap!important;
}
.ds-dashboard .meta-pill img,
.ds-dashboard .meta-pill .ds-ui-icon,
.ds-dashboard .meta-pill .ui-inline-icon{
  width:16px!important;
  height:20px!important;
  object-fit:contain!important;
}
.ds-dashboard .meta-pill .mood-emoji{
  font-size:21px!important;
  line-height:1!important;
}
.ds-dashboard .meta-divider{
  width:1px!important;
  align-self:stretch!important;
  background:rgba(132,111,214,.3)!important;
}
.ds-dashboard .my-dragon-meta-bar .mood-tooltip{
  top:-38px!important;
  right:auto!important;
  left:0!important;
}
.ds-dashboard .my-dragon-meta-bar .dragon-mood-row{
  cursor:pointer!important;
  transition:transform .2s ease,color .2s ease!important;
}
.ds-dashboard .my-dragon-meta-bar .dragon-mood-row.mood-sad{
  color:#1d2a5b!important;
}
.ds-dashboard .my-dragon-meta-bar .dragon-mood-row.mood-happy{
  color:#166534!important;
  transform:scale(1.04)!important;
}
.ds-dashboard .my-dragon-meta-bar .dragon-mood-row .mood-label{
  color:inherit!important;
}
.ds-dashboard .my-dragon-meta-bar .mood-tooltip{
  padding:8px 12px!important;
  border:1px solid rgba(130,90,255,.22)!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#081144!important;
  box-shadow:0 10px 24px rgba(45,35,110,.16)!important;
  font-size:12px!important;
  font-weight:900!important;
}
.ds-dashboard .my-dragon-meta-bar .mood-tooltip:after{
  content:""!important;
  position:absolute!important;
  left:18px!important;
  bottom:-6px!important;
  width:10px!important;
  height:10px!important;
  border-right:1px solid rgba(130,90,255,.22)!important;
  border-bottom:1px solid rgba(130,90,255,.22)!important;
  background:#fff!important;
  transform:rotate(45deg)!important;
}
.ds-dashboard .ds-hatch{
  min-height:350px!important;
  padding:12px 14px!important;
}
.ds-dashboard .ds-hatch-title strong{
  min-width:150px!important;
  padding:6px 20px!important;
  font-size:20px!important;
}
.ds-dashboard .ds-hatch-title{
  margin:4px 0!important;
}
.ds-dashboard .ds-hatch>p{
  margin:4px 0 8px!important;
  font-size:11px!important;
}
.ds-dashboard .ds-days{
  margin:16px 0 8px!important;
  transform:scale(.95)!important;
  transform-origin:top center!important;
}
.ds-dashboard .ds-day>img{
  width:54px!important;
  height:54px!important;
}
.ds-dashboard .ds-day.hatch>img{
  width:66px!important;
  height:66px!important;
}
.ds-dashboard .ds-hatch>small{
  font-size:11px!important;
}
.ds-dashboard .ds-hatch>button{
  min-height:40px!important;
  width:260px!important;
  padding:0 20px!important;
  border-radius:12px!important;
  font-size:16px!important;
}
.ds-dashboard .ds-tasks{
  min-height:350px!important;
  padding:10px 12px!important;
}
.ds-dashboard .ds-tasks h2{
  margin-bottom:2px!important;
}
.ds-dashboard .ds-tasks>p{
  margin:0 0 6px!important;
  font-size:11px!important;
}
.ds-dashboard .ds-task-row{
  grid-template-columns:16px 1fr auto 48px!important;
  min-height:26px!important;
  gap:6px!important;
  padding:2px 0!important;
}
.ds-dashboard .ds-check{
  width:14px!important;
  height:14px!important;
}
.ds-dashboard .ds-task-row b,
.ds-dashboard .ds-task-row em{
  font-size:11px!important;
  line-height:1.05!important;
}
.ds-dashboard .ds-task-row button{
  min-width:42px!important;
  min-height:22px!important;
  height:22px!important;
  padding:0 8px!important;
  border-radius:8px!important;
  font-size:11px!important;
}
.ds-dashboard .ds-tasks footer{
  margin-top:6px!important;
  padding:6px 8px!important;
  border-radius:10px!important;
  font-size:10px!important;
  line-height:1.15!important;
}
.ds-dashboard .ds-family,
.ds-dashboard .ds-hatchery,
.ds-dashboard .ds-badges{
  padding:10px!important;
  border-radius:16px!important;
  gap:8px!important;
}
.ds-dashboard .ds-family .ds-gallery-grid,
.ds-dashboard .ds-hatchery .ds-gallery-grid,
.ds-dashboard .ds-badges>div{
  gap:8px!important;
}
.ds-dashboard .ds-family .ds-gallery-tile,
.ds-dashboard .ds-hatchery .ds-gallery-tile,
.ds-dashboard .ds-badges>div button{
  min-height:88px!important;
  padding:7px 6px!important;
  border-radius:10px!important;
}
.ds-dashboard .ds-family .ds-gallery-tile img,
.ds-dashboard .ds-hatchery .ds-gallery-tile img{
  width:104px!important;
  height:58px!important;
  object-fit:contain!important;
}
.ds-dashboard .ds-hatchery .ds-gallery-tile img{
  width:74px!important;
  height:64px!important;
}
.ds-dashboard .ds-badges img{
  width:54px!important;
  height:54px!important;
  object-fit:contain!important;
  filter:none!important;
}
.ds-dashboard .ds-badges img.earned,
.ds-dashboard .ds-badges .earned img,
.ds-dashboard .ds-badges img.locked,
.ds-dashboard .ds-badges .locked img{
  filter:none!important;
}
.ds-dashboard .ds-badges>div button{
  background:#fff!important;
  box-shadow:none!important;
}
.ds-dashboard .ds-family .ds-gallery-tile b,
.ds-dashboard .ds-hatchery .ds-gallery-tile b{
  min-height:22px!important;
  margin-top:2px!important;
  font-size:10px!important;
  line-height:1.05!important;
  font-weight:850!important;
}
.ds-dashboard .ds-family>button,
.ds-dashboard .ds-hatchery>button,
.ds-dashboard .ds-badges>button{
  min-height:28px!important;
  height:28px!important;
  margin-top:6px!important;
  border-radius:9px!important;
  font-size:11px!important;
}
.ds-dashboard .ds-feed{
  padding:10px!important;
}
.ds-dashboard .ds-feed h2{
  margin-bottom:6px!important;
  font-size:14px!important;
}
.ds-dashboard .ds-feed h2 small{
  font-size:10px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-feed-grid{
  gap:8px!important;
}
.ds-dashboard .ds-feed-item{
  min-height:62px!important;
  padding:6px 4px!important;
  border-radius:10px!important;
}
.ds-dashboard .ds-feed-item b{
  min-height:18px!important;
  font-size:9px!important;
  line-height:1.05!important;
}
.ds-dashboard .ds-feed-item img{
  width:28px!important;
  height:28px!important;
}
.ds-dashboard .ds-feed-item span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  justify-self:center!important;
  gap:5px!important;
  width:auto!important;
  margin:0 auto!important;
  font-size:10px!important;
}
.ds-dashboard .ds-feed-item span img{
  width:13px!important;
  height:13px!important;
  margin:0!important;
}
.ds-dashboard .ds-share{
  padding:10px 12px!important;
}
.ds-dashboard .ds-share h2{
  margin-bottom:4px!important;
  font-size:14px!important;
}
.ds-dashboard .ds-share p{
  font-size:11px!important;
  line-height:1.2!important;
}
.ds-dashboard .ds-share>img{
  width:74px!important;
  height:74px!important;
}
.ds-dashboard .ds-hatchery .ds-gallery-tile img,
.egg-collection-grid .collection-tile img,
.ds-dashboard .ds-share>img,
.share-magic-img{
  display:block!important;
  object-fit:contain!important;
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.ds-dashboard .ds-share button{
  min-height:30px!important;
  height:30px!important;
  padding:0 12px!important;
  border-radius:9px!important;
  font-size:11px!important;
}

/* My Profile top summary strip: keep labels contained inside fixed-height cards. */
.ds-dashboard .ds-summary-row{
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}
.ds-dashboard .ds-summary-row article,
.ds-dashboard .ds-summary-row button{
  min-width:0!important;
  overflow:hidden!important;
  height:72px!important;
  min-height:72px!important;
  padding:10px 16px!important;
  column-gap:12px!important;
}
.ds-dashboard .ds-summary-row article{
  grid-template-columns:42px minmax(0,1fr) minmax(0,max-content)!important;
}
.ds-dashboard .ds-summary-row button{
  grid-template-columns:42px minmax(0,1fr) 18px!important;
  grid-template-rows:auto auto!important;
}
.ds-dashboard .ds-summary-row img{
  width:24px!important;
  height:24px!important;
  justify-self:center!important;
  flex:0 0 auto!important;
}
.ds-dashboard .ds-summary-row article strong{
  min-width:0!important;
  overflow:hidden!important;
  color:inherit!important;
  font-size:clamp(22px,1.55vw,30px)!important;
  line-height:1!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.ds-dashboard .ds-summary-row article span{
  min-width:0!important;
  max-width:100%!important;
  margin:0!important;
  align-self:center!important;
  color:inherit!important;
  font-size:clamp(11px,.82vw,14px)!important;
  line-height:1.08!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.ds-dashboard .ds-summary-row button b{
  grid-column:2!important;
  grid-row:1!important;
  min-width:0!important;
  max-width:100%!important;
  overflow-wrap:anywhere!important;
  color:inherit!important;
  font-size:clamp(18px,1.18vw,22px)!important;
  line-height:1.02!important;
  letter-spacing:0!important;
}
.ds-dashboard .ds-summary-row button span{
  grid-column:2!important;
  grid-row:2!important;
  min-width:0!important;
  max-width:100%!important;
  margin:2px 0 0!important;
  color:rgba(235,232,255,.76)!important;
  font-size:clamp(10px,.72vw,12px)!important;
  line-height:1.1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.ds-dashboard .ds-summary-row button i{
  grid-column:3!important;
  grid-row:1/3!important;
  align-self:center!important;
  justify-self:end!important;
  min-width:18px!important;
  font-size:22px!important;
  line-height:1!important;
  flex-shrink:0!important;
}
@media(max-width:900px){
  .ds-dashboard .ds-summary-row{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .ds-dashboard .ds-summary-row button b{
    font-size:20px!important;
  }
}
@media(max-width:520px){
  .ds-dashboard .ds-summary-row{
    grid-template-columns:1fr!important;
  }
  .ds-dashboard .ds-summary-row article,
  .ds-dashboard .ds-summary-row button{
    padding:10px 14px!important;
  }
  .ds-dashboard .ds-summary-row button b{
    font-size:19px!important;
    line-height:1.08!important;
  }
  .ds-dashboard .ds-summary-row button span{
    font-size:12px!important;
  }
}
@media(max-width:1180px){
  .ds-dashboard .ds-summary-row{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .ds-dashboard .ds-dashboard-grid{
    grid-template-columns:1fr!important;
    grid-template-areas:"dragon" "hatch" "tasks" "family" "hatchery" "badges" "feed" "share"!important;
  }
}
@media(max-width:760px){
  .ds-dashboard .ds-summary-row{
    grid-template-columns:1fr!important;
  }
  .ds-dashboard .my-dragon-card>.card-inner{
    min-height:330px!important;
  }
  .ds-dashboard .my-dragon-art-frame{
    height:210px!important;
  }
  .ds-dashboard .my-dragon-name{
    font-size:30px!important;
  }
  .ds-dashboard .my-dragon-meta-bar{
    flex-wrap:wrap!important;
    justify-content:center!important;
  }
  .ds-dashboard .meta-divider{
    display:none!important;
  }
}

/* Dragon Studio typography and spacing balance pass. */
.ds-dashboard,
.ds-dashboard *{
  letter-spacing:0!important;
  box-sizing:border-box!important;
}
.ds-dashboard .ds-card{
  padding:14px!important;
  overflow:hidden!important;
}
.ds-dashboard .ds-card h2{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  min-width:0!important;
  margin:0 0 9px!important;
  color:#fff!important;
  font-size:16px!important;
  line-height:1.18!important;
  font-weight:900!important;
  overflow-wrap:anywhere!important;
}
.ds-dashboard .ds-card p,
.ds-dashboard .ds-card small,
.ds-dashboard .ds-card footer{
  font-size:12px!important;
  line-height:1.35!important;
}
.ds-dashboard .ds-summary-row article,
.ds-dashboard .ds-summary-row button{
  height:64px!important;
  min-height:64px!important;
  padding:9px 13px!important;
  align-items:center!important;
}
.ds-dashboard .ds-summary-row article{
  grid-template-columns:36px minmax(0,1fr) minmax(0,max-content)!important;
}
.ds-dashboard .ds-summary-row button{
  grid-template-columns:36px minmax(0,1fr) 16px!important;
}
.ds-dashboard .ds-summary-row article strong{
  font-size:24px!important;
  line-height:1!important;
}
.ds-dashboard .ds-summary-row article span{
  font-size:12px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-summary-row button b{
  font-size:17px!important;
  line-height:1.12!important;
}
.ds-dashboard .ds-summary-row button span{
  font-size:11px!important;
  line-height:1.15!important;
}
.ds-dashboard .ds-summary-row article strong,
.ds-dashboard .ds-summary-row article span,
.ds-dashboard .ds-summary-row button b,
.ds-dashboard .ds-summary-row button span{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.ds-dashboard .ds-summary-row button b{
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
.ds-dashboard .my-dragon-card{
  min-height:360px!important;
}
.ds-dashboard .my-dragon-card>.card-inner{
  min-height:332px!important;
}
.ds-dashboard .my-dragon-header h2{
  color:#16205e!important;
  font-size:19px!important;
  line-height:1.15!important;
}
.ds-dashboard .my-dragon-art-frame{
  height:196px!important;
}
.ds-dashboard .my-dragon-name{
  max-width:100%!important;
  margin:6px 0 10px!important;
  font-size:28px!important;
  line-height:1.08!important;
  overflow-wrap:anywhere!important;
}
.ds-dashboard .my-dragon-meta-bar{
  min-height:46px!important;
  padding:7px 10px!important;
  gap:7px!important;
}
.ds-dashboard .meta-pill{
  max-width:100%!important;
  font-size:12px!important;
  line-height:1.2!important;
}
.ds-dashboard .meta-pill span{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.ds-dashboard .ds-hatch{
  min-height:360px!important;
}
.ds-dashboard .ds-hatch-title{
  gap:10px!important;
  margin:4px 0 6px!important;
}
.ds-dashboard .ds-hatch-title strong{
  min-width:128px!important;
  padding:6px 14px!important;
  font-size:18px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-hatch>p{
  margin:4px 0 9px!important;
  font-size:12px!important;
  line-height:1.3!important;
}
.ds-dashboard .ds-days{
  max-width:100%!important;
  gap:6px!important;
  margin:14px 0 8px!important;
}
.ds-dashboard .ds-day{
  min-width:0!important;
  text-align:center!important;
}
.ds-dashboard .ds-day b{
  display:block!important;
  font-size:10px!important;
  line-height:1.1!important;
  white-space:nowrap!important;
}
.ds-dashboard .ds-day>img{
  width:50px!important;
  height:50px!important;
}
.ds-dashboard .ds-day.hatch>img{
  width:60px!important;
  height:60px!important;
}
.ds-dashboard .ds-hatch>small{
  display:block!important;
  font-size:12px!important;
  line-height:1.3!important;
}
.ds-dashboard .ds-hatch>button{
  width:min(240px,100%)!important;
  min-height:36px!important;
  height:36px!important;
  padding:0 14px!important;
  font-size:13px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-tasks{
  min-height:360px!important;
  padding:12px 14px!important;
}
.ds-dashboard .ds-tasks h2{
  margin-bottom:4px!important;
}
.ds-dashboard .ds-tasks>p{
  margin:0 0 8px!important;
  font-size:12px!important;
  line-height:1.25!important;
}
.ds-dashboard .ds-task-row{
  grid-template-columns:18px minmax(0,1fr) auto 52px!important;
  min-height:31px!important;
  gap:7px!important;
  padding:3px 0!important;
  align-items:center!important;
}
.ds-dashboard .ds-check{
  width:16px!important;
  height:16px!important;
}
.ds-dashboard .ds-task-row b{
  min-width:0!important;
  font-size:13px!important;
  line-height:1.18!important;
  overflow-wrap:anywhere!important;
}
.ds-dashboard .ds-task-row em{
  font-size:12px!important;
  line-height:1.1!important;
  white-space:nowrap!important;
}
.ds-dashboard .ds-task-row button{
  min-width:48px!important;
  min-height:26px!important;
  height:26px!important;
  padding:0 10px!important;
  border-radius:9px!important;
  font-size:12px!important;
  line-height:1!important;
}
.ds-dashboard .ds-tasks footer{
  margin-top:8px!important;
  padding:8px 10px!important;
  font-size:11px!important;
  line-height:1.25!important;
}
.ds-dashboard .ds-family,
.ds-dashboard .ds-hatchery,
.ds-dashboard .ds-badges,
.ds-dashboard .ds-feed,
.ds-dashboard .ds-share{
  padding:12px!important;
}
.ds-dashboard .ds-family .ds-gallery-grid,
.ds-dashboard .ds-hatchery .ds-gallery-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
}
.ds-dashboard .ds-family .ds-gallery-tile,
.ds-dashboard .ds-hatchery .ds-gallery-tile,
.ds-dashboard .ds-badges>div button{
  min-height:96px!important;
  padding:7px 6px!important;
}
.ds-dashboard .ds-family .ds-gallery-tile b,
.ds-dashboard .ds-hatchery .ds-gallery-tile b{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  min-height:25px!important;
  max-height:30px!important;
  font-size:11px!important;
  line-height:1.15!important;
  overflow:hidden!important;
  overflow-wrap:anywhere!important;
}
.ds-dashboard .ds-family>button,
.ds-dashboard .ds-hatchery>button,
.ds-dashboard .ds-badges>button{
  min-height:32px!important;
  height:32px!important;
  padding:0 12px!important;
  font-size:12px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-badges>div{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
}
.ds-dashboard .ds-feed h2{
  flex-wrap:wrap!important;
  font-size:16px!important;
  line-height:1.18!important;
}
.ds-dashboard .ds-feed h2 small{
  flex-basis:100%!important;
  margin-top:2px!important;
  font-size:11px!important;
  line-height:1.25!important;
  font-weight:700!important;
}
.ds-dashboard .ds-feed-grid{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:8px!important;
}
.ds-dashboard .ds-feed-item{
  min-height:76px!important;
  padding:7px 5px!important;
}
.ds-dashboard .ds-feed-item b{
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  min-height:25px!important;
  max-height:30px!important;
  font-size:10.5px!important;
  line-height:1.15!important;
  overflow:hidden!important;
  overflow-wrap:anywhere!important;
}
.ds-dashboard .ds-feed-item span{
  font-size:11px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-share{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
}
.ds-dashboard .ds-share h2{
  font-size:16px!important;
  line-height:1.18!important;
}
.ds-dashboard .ds-share p{
  margin:0 0 9px!important;
  font-size:12px!important;
  line-height:1.35!important;
}
.ds-dashboard .ds-share button{
  min-height:34px!important;
  height:34px!important;
  padding:0 13px!important;
  font-size:12px!important;
  line-height:1.1!important;
}
.ds-dashboard .ds-share>img{
  width:68px!important;
  height:68px!important;
  flex:0 0 auto!important;
}
@media(max-width:1180px){
  .ds-dashboard .ds-card{
    padding:14px!important;
  }
  .ds-dashboard .ds-summary-row article,
  .ds-dashboard .ds-summary-row button{
    height:auto!important;
    min-height:62px!important;
  }
  .ds-dashboard .ds-family .ds-gallery-grid,
  .ds-dashboard .ds-hatchery .ds-gallery-grid,
  .ds-dashboard .ds-badges>div{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}
@media(max-width:760px){
  .dragon-studio-v2.ds-dashboard{
    width:min(100%,calc(100vw - 16px))!important;
    padding:8px!important;
  }
  .ds-dashboard .ds-card h2,
  .ds-dashboard .ds-feed h2,
  .ds-dashboard .ds-share h2{
    font-size:15px!important;
  }
  .ds-dashboard .my-dragon-name{
    font-size:25px!important;
  }
  .ds-dashboard .my-dragon-meta-bar{
    align-items:stretch!important;
  }
  .ds-dashboard .meta-pill{
    justify-content:center!important;
    font-size:12px!important;
  }
  .ds-dashboard .ds-days{
    transform:none!important;
  }
  .ds-dashboard .ds-task-row{
    grid-template-columns:18px minmax(0,1fr) 48px!important;
  }
  .ds-dashboard .ds-task-row em{
    display:none!important;
  }
  .ds-dashboard .ds-family .ds-gallery-grid,
  .ds-dashboard .ds-hatchery .ds-gallery-grid,
  .ds-dashboard .ds-badges>div,
  .ds-dashboard .ds-feed-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .ds-dashboard .ds-share{
    align-items:flex-start!important;
  }
}
@media(max-width:420px){
  .ds-dashboard .ds-summary-row article,
  .ds-dashboard .ds-summary-row button{
    grid-template-columns:32px minmax(0,1fr) 14px!important;
    padding:8px 10px!important;
  }
  .ds-dashboard .ds-summary-row article strong{
    font-size:22px!important;
  }
  .ds-dashboard .ds-summary-row button b{
    font-size:16px!important;
  }
  .ds-dashboard .ds-family .ds-gallery-grid,
  .ds-dashboard .ds-hatchery .ds-gallery-grid,
  .ds-dashboard .ds-badges>div,
  .ds-dashboard .ds-feed-grid{
    grid-template-columns:1fr!important;
  }
  .ds-dashboard .ds-share>img{
    width:56px!important;
    height:56px!important;
  }
}

/* Dragon Studio: stepped 7-day hatch tracker path. */
.ds-dashboard .ds-hatch{
  min-height:520px!important;
}
.ds-dashboard .ds-hatch .ds-days{
  --node-w:72px;
  width:min(100%,760px)!important;
  min-height:340px!important;
  margin:16px auto 12px!important;
  display:grid!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  grid-template-rows:repeat(3,106px)!important;
  gap:0!important;
  align-items:end!important;
  justify-items:center!important;
  position:relative!important;
  transform:none!important;
}
.ds-dashboard .ds-hatch .ds-days:before{
  content:none!important;
}
.ds-dashboard .ds-hatch-connector{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  overflow:visible!important;
  z-index:0!important;
  pointer-events:none!important;
}
.ds-dashboard .ds-hatch-connector path{
  fill:none!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.ds-dashboard .ds-hatch-connector .ds-hatch-path-base{
  stroke:rgba(197,178,255,.42)!important;
  stroke-width:8!important;
}
.ds-dashboard .ds-hatch-connector .ds-hatch-path-glow{
  stroke:rgba(154,122,255,.34)!important;
  stroke-width:14!important;
  filter:drop-shadow(0 0 12px rgba(150,116,255,.5))!important;
}
.ds-dashboard .ds-hatch-connector circle{
  fill:#b397ff!important;
  filter:drop-shadow(0 0 9px rgba(177,145,255,.75))!important;
}
.ds-dashboard .ds-hatch .ds-day{
  width:var(--node-w)!important;
  min-width:var(--node-w)!important;
  display:grid!important;
  justify-items:center!important;
  align-content:end!important;
  gap:6px!important;
  position:relative!important;
  z-index:1!important;
}
.ds-dashboard .ds-hatch .ds-day-1{grid-column:1 / span 2!important;grid-row:1!important}
.ds-dashboard .ds-hatch .ds-day-2{grid-column:3 / span 2!important;grid-row:1!important}
.ds-dashboard .ds-hatch .ds-day-3{grid-column:5 / span 2!important;grid-row:1!important}
.ds-dashboard .ds-hatch .ds-day-4{grid-column:2 / span 2!important;grid-row:2!important}
.ds-dashboard .ds-hatch .ds-day-5{grid-column:4 / span 2!important;grid-row:2!important}
.ds-dashboard .ds-hatch .ds-day-6{grid-column:2 / span 2!important;grid-row:3!important}
.ds-dashboard .ds-hatch .ds-day-7{grid-column:4 / span 2!important;grid-row:3!important}
.ds-dashboard .ds-hatch .ds-day b{
  order:2!important;
  display:block!important;
  width:100%!important;
  margin:0!important;
  text-align:center!important;
  font-size:8px!important;
  line-height:1!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}
.ds-dashboard .ds-hatch .ds-day>img{
  order:1!important;
  width:52px!important;
  height:58px!important;
  object-fit:contain!important;
}
.ds-dashboard .ds-hatch .ds-day.hatch>img{
  width:64px!important;
  height:70px!important;
  margin-bottom:-4px!important;
}
.ds-dashboard .ds-hatch .ds-day span{
  order:3!important;
  width:32px!important;
  height:32px!important;
  margin-top:0!important;
}
.ds-dashboard .ds-hatch>small{
  margin-top:0!important;
}

@media(max-width:760px){
  .ds-dashboard .ds-hatch{
    min-height:500px!important;
  }
  .ds-dashboard .ds-hatch .ds-days{
    --node-w:58px;
    min-height:306px!important;
    grid-template-rows:repeat(3,96px)!important;
    margin:14px auto 10px!important;
  }
  .ds-dashboard .ds-hatch-connector{
    transform:scale(.96)!important;
    transform-origin:center!important;
  }
  .ds-dashboard .ds-hatch .ds-day b{
    font-size:7.5px!important;
  }
  .ds-dashboard .ds-hatch .ds-day>img{
    width:44px!important;
    height:50px!important;
  }
  .ds-dashboard .ds-hatch .ds-day.hatch>img{
    width:56px!important;
    height:62px!important;
  }
  .ds-dashboard .ds-hatch .ds-day span{
    width:28px!important;
    height:28px!important;
  }
}

/* Egg Hatch Progress: reference layout with switch button and centered Day 7 egg. */
.ds-dashboard .ds-hatch{
  min-height:860px!important;
  padding:28px 36px 34px!important;
  position:relative!important;
  overflow:hidden!important;
}
.ds-dashboard .ds-hatch-header{
  position:relative!important;
  z-index:3!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
}
.ds-dashboard .ds-hatch-header h2{
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  gap:16px!important;
  color:#fff!important;
  font-size:40px!important;
  line-height:1!important;
  font-weight:950!important;
  text-shadow:0 4px 16px rgba(0,0,0,.4)!important;
}
.ds-dashboard .ds-hatch-header h2 img{
  width:38px!important;
  height:38px!important;
}
.ds-dashboard .switch-hatching-egg-btn{
  height:34px!important;
  min-height:34px!important;
  padding:0 16px!important;
  border-radius:13px!important;
  border:2px solid rgba(220,210,255,.55)!important;
  background:linear-gradient(135deg,#9b7cff 0%,#6c4de8 100%)!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:950!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  box-shadow:0 8px 18px rgba(69,45,190,.28),inset 0 1px 0 rgba(255,255,255,.28)!important;
  white-space:nowrap!important;
}
.ds-dashboard .switch-hatching-egg-btn:hover{
  transform:translateY(-1px)!important;
  box-shadow:0 10px 22px rgba(69,45,190,.34),inset 0 1px 0 rgba(255,255,255,.32)!important;
}
.ds-dashboard .switch-hatching-egg-btn span{
  font-size:16px!important;
  line-height:1!important;
}
.ds-dashboard .ds-hatch-title{
  justify-content:center!important;
  margin:18px 0 12px!important;
}
.ds-dashboard .ds-hatch-title strong{
  min-width:150px!important;
  min-height:44px!important;
  padding:0 20px!important;
  border-radius:999px!important;
  border:2px solid rgba(130,105,255,.5)!important;
  background:rgba(7,10,42,.9)!important;
  color:#fff!important;
  font-size:22px!important;
  line-height:1!important;
  font-weight:950!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-shadow:0 0 22px rgba(138,105,255,.35),inset 0 0 16px rgba(255,255,255,.06)!important;
}
.ds-dashboard .ds-hatch>p{
  margin:0 0 14px!important;
  text-align:center!important;
  color:rgba(235,230,255,.95)!important;
  font-size:13px!important;
  line-height:1.25!important;
  font-weight:850!important;
  text-shadow:0 3px 12px rgba(0,0,0,.4)!important;
}
.ds-dashboard .ds-hatch .ds-days{
  --node-w:150px;
  width:min(100%,860px)!important;
  min-height:600px!important;
  margin:-4px auto 0!important;
  grid-template-columns:repeat(6,minmax(0,1fr))!important;
  grid-template-rows:128px 128px 128px 176px!important;
  align-items:center!important;
}
.ds-dashboard .ds-hatch-connector{
  height:520px!important;
  top:46px!important;
  bottom:auto!important;
}
.ds-dashboard .ds-hatch-connector .ds-hatch-path-base{
  stroke:rgba(202,178,255,.7)!important;
  stroke-width:10!important;
}
.ds-dashboard .ds-hatch-connector .ds-hatch-path-glow{
  stroke:rgba(164,115,255,.55)!important;
  stroke-width:20!important;
  filter:drop-shadow(0 0 14px rgba(167,116,255,.72))!important;
}
.ds-dashboard .ds-hatch .ds-day{
  width:var(--node-w)!important;
  min-width:var(--node-w)!important;
  align-content:center!important;
  gap:8px!important;
}
.ds-dashboard .ds-hatch .ds-day-1{grid-column:1 / span 2!important;grid-row:1!important}
.ds-dashboard .ds-hatch .ds-day-2{grid-column:5 / span 2!important;grid-row:1!important}
.ds-dashboard .ds-hatch .ds-day-3{grid-column:1 / span 2!important;grid-row:2!important}
.ds-dashboard .ds-hatch .ds-day-4{grid-column:5 / span 2!important;grid-row:2!important}
.ds-dashboard .ds-hatch .ds-day-5{grid-column:1 / span 2!important;grid-row:3!important}
.ds-dashboard .ds-hatch .ds-day-6{grid-column:5 / span 2!important;grid-row:3!important}
.ds-dashboard .ds-hatch .ds-day-7{grid-column:3 / span 2!important;grid-row:4!important}
.ds-dashboard .ds-hatch .ds-day b{
  order:1!important;
  width:100%!important;
  color:#243065!important;
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:850!important;
  text-align:center!important;
  text-shadow:none!important;
}
.ds-dashboard .ds-hatch .ds-day>img{
  order:2!important;
  width:84px!important;
  height:96px!important;
  filter:drop-shadow(0 0 16px rgba(255,255,255,.34))!important;
}
.ds-dashboard .ds-hatch .ds-day.current>img,
.ds-dashboard .ds-hatch .ds-day.done>img{
  filter:drop-shadow(0 0 24px rgba(106,221,255,.78))!important;
}
.ds-dashboard .ds-hatch .ds-day.hatch>img{
  width:150px!important;
  height:150px!important;
  margin:0!important;
  filter:drop-shadow(0 0 22px rgba(255,216,112,.6))!important;
}
.ds-dashboard .ds-hatch .ds-day span{
  order:3!important;
  width:96px!important;
  height:22px!important;
  border:0!important;
  border-radius:50%!important;
  background:radial-gradient(ellipse at center,rgba(154,115,255,.72) 0%,rgba(34,24,92,.5) 56%,rgba(34,24,92,0) 72%)!important;
}
.ds-dashboard .ds-hatch .ds-day span img{
  display:none!important;
}
.ds-dashboard .ds-hatch .ds-day.hatch span{
  width:196px!important;
  height:34px!important;
}
.ds-dashboard .ds-hatch>small{
  display:block!important;
  margin:-8px auto 22px!important;
  color:#fff!important;
  font-size:24px!important;
  line-height:1.15!important;
  font-weight:950!important;
  text-align:center!important;
  white-space:nowrap!important;
  text-shadow:0 3px 12px rgba(0,0,0,.55)!important;
}
.ds-dashboard .ds-hatch>button{
  width:min(620px,calc(100% - 220px))!important;
  height:86px!important;
  min-height:86px!important;
  margin:0 auto!important;
  border-radius:28px!important;
  border:3px solid rgba(220,210,255,.55)!important;
  background:linear-gradient(135deg,#a983ff 0%,#6c4de8 100%)!important;
  color:#fff!important;
  font-size:30px!important;
  font-weight:950!important;
  gap:18px!important;
  box-shadow:0 18px 36px rgba(68,45,185,.38),inset 0 2px 0 rgba(255,255,255,.28)!important;
}
.ds-dashboard .ds-hatch>button img{
  width:30px!important;
  height:30px!important;
}
.hatching-egg-picker .collection-tile.active{
  outline:3px solid rgba(132,103,255,.55)!important;
  box-shadow:0 0 0 6px rgba(132,103,255,.14)!important;
}

@media(max-width:760px){
  .ds-dashboard .ds-hatch{
    min-height:720px!important;
    padding:18px 16px 24px!important;
  }
  .ds-dashboard .ds-hatch-header{
    align-items:flex-start!important;
  }
  .ds-dashboard .ds-hatch-header h2{
    font-size:25px!important;
    gap:10px!important;
  }
  .ds-dashboard .ds-hatch-header h2 img{
    width:28px!important;
    height:28px!important;
  }
  .ds-dashboard .switch-hatching-egg-btn{
    height:32px!important;
    min-height:32px!important;
    padding:0 12px!important;
    border-radius:12px!important;
    font-size:12px!important;
  }
  .ds-dashboard .switch-hatching-egg-btn span{
    font-size:15px!important;
  }
  .ds-dashboard .ds-hatch-title strong{
    min-width:126px!important;
    min-height:40px!important;
    border-width:2px!important;
    font-size:20px!important;
  }
  .ds-dashboard .ds-hatch>p{
    font-size:12px!important;
  }
  .ds-dashboard .ds-hatch .ds-days{
    --node-w:86px;
    min-height:440px!important;
    grid-template-rows:96px 96px 96px 140px!important;
  }
  .ds-dashboard .ds-hatch-connector{
    height:390px!important;
    top:46px!important;
  }
  .ds-dashboard .ds-hatch .ds-day b{
    font-size:12px!important;
    color:#243065!important;
    font-weight:850!important;
  }
  .ds-dashboard .ds-hatch .ds-day>img{
    width:54px!important;
    height:64px!important;
  }
  .ds-dashboard .ds-hatch .ds-day.hatch>img{
    width:96px!important;
    height:96px!important;
  }
  .ds-dashboard .ds-hatch .ds-day span{
    width:68px!important;
    height:17px!important;
  }
  .ds-dashboard .ds-hatch .ds-day.hatch span{
    width:126px!important;
    height:24px!important;
  }
  .ds-dashboard .ds-hatch>small{
    margin-top:-4px!important;
    font-size:16px!important;
  }
  .ds-dashboard .ds-hatch>button{
    width:100%!important;
    height:58px!important;
    min-height:58px!important;
    border-radius:20px!important;
    font-size:18px!important;
  }
}

/* My Dragon bottom info bar: balanced three-part layout. */
.ds-dashboard .my-dragon-card .my-dragon-meta-bar{
  width:calc(100% - 44px)!important;
  max-width:760px!important;
  min-height:64px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 1px minmax(0,1fr) 1px minmax(0,1fr)!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:0!important;
  margin:0 auto!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid rgba(168,178,255,.26)!important;
  border-radius:18px!important;
  background:rgba(5,8,32,.76)!important;
  box-shadow:0 12px 30px rgba(3,6,24,.24),inset 0 1px 0 rgba(255,255,255,.06)!important;
  backdrop-filter:blur(4px)!important;
}
.ds-dashboard .my-dragon-card .meta-divider{
  width:1px!important;
  height:auto!important;
  min-height:100%!important;
  align-self:stretch!important;
  background:linear-gradient(180deg,transparent,rgba(170,180,255,.28),transparent)!important;
}
.ds-dashboard .my-dragon-card .meta-pill{
  width:100%!important;
  min-width:0!important;
  min-height:64px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#f7f8ff!important;
  font-size:14px!important;
  font-weight:900!important;
  line-height:1.1!important;
  text-align:center!important;
  white-space:nowrap!important;
  transform:none!important;
}
.ds-dashboard .my-dragon-card .meta-pill span{
  min-width:0!important;
  max-width:100%!important;
  color:inherit!important;
  font:inherit!important;
  line-height:inherit!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.ds-dashboard .my-dragon-card .meta-pill img,
.ds-dashboard .my-dragon-card .meta-pill .ds-ui-icon,
.ds-dashboard .my-dragon-card .meta-pill .ui-inline-icon{
  width:16px!important;
  height:20px!important;
  flex:0 0 20px!important;
  object-fit:contain!important;
}
.ds-dashboard .my-dragon-card .meta-pill .mood-emoji{
  width:24px!important;
  height:24px!important;
  flex:0 0 24px!important;
  display:inline-grid!important;
  place-items:center!important;
  border-radius:6px!important;
  background:rgba(255,255,255,.07)!important;
  font-size:19px!important;
  line-height:1!important;
}
.ds-dashboard .my-dragon-card .dragon-mood-row.mood-happy,
.ds-dashboard .my-dragon-card .dragon-mood-row.mood-sad,
.ds-dashboard .my-dragon-card .dragon-mood-row.mood-dormant{
  color:#f7f8ff!important;
  transform:none!important;
}
.ds-dashboard .my-dragon-card .change-avatar-button{
  cursor:pointer!important;
}
@media(max-width:760px){
  .ds-dashboard .my-dragon-card .my-dragon-meta-bar{
    width:calc(100% - 20px)!important;
    min-height:58px!important;
    border-radius:16px!important;
  }
  .ds-dashboard .my-dragon-card .meta-pill{
    min-height:58px!important;
    gap:6px!important;
    padding:0 8px!important;
    font-size:12px!important;
  }
  .ds-dashboard .my-dragon-card .meta-pill img,
  .ds-dashboard .my-dragon-card .meta-pill .ds-ui-icon,
  .ds-dashboard .my-dragon-card .meta-pill .ui-inline-icon{
    width:17px!important;
    height:17px!important;
    flex-basis:17px!important;
  }
  .ds-dashboard .my-dragon-card .meta-pill .mood-emoji{
    width:16px!important;
    height:20px!important;
    flex-basis:20px!important;
    font-size:16px!important;
  }
}
@media(max-width:420px){
  .ds-dashboard .my-dragon-card .my-dragon-meta-bar{
    width:100%!important;
  }
  .ds-dashboard .my-dragon-card .meta-pill{
    min-height:54px!important;
    padding:0 5px!important;
    font-size:10.5px!important;
  }
}

/* HatchElite study page layout: match the balanced three-column mockup. */
.study-page{
  max-width:1760px!important;
  padding:14px 26px 34px!important;
}
.study-page .free-banner{
  margin-bottom:22px!important;
}
.study-page .study-layout{
  display:grid!important;
  grid-template-columns:320px minmax(620px,1fr) 360px!important;
  gap:24px!important;
  align-items:stretch!important;
  max-width:none!important;
  width:100%!important;
  margin:0 auto!important;
}
.study-page .side-col,
.study-page .right-col,
.study-page .study-center-col{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
  min-width:0!important;
}
.study-page .study-center-col{
  height:100%!important;
}
.study-page .main-study-card{
  flex:1 1 auto!important;
  min-height:720px!important;
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  padding:34px 30px 44px!important;
  border-radius:20px!important;
}
.study-page .word-display{
  flex:1 1 auto!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  padding:48px 0 28px!important;
}
.study-page .reveal-box,
.study-page .answer-panel{
  flex:0 0 auto!important;
}
.study-page .action-row{
  flex:0 0 auto!important;
  margin-top:28px!important;
}
.study-page .progress-panel,
.study-page .review-panel,
.study-page .right-col>.study-promo-card,
.study-page .right-col>.badge-mini,
.study-page .sidebar-action-card{
  border-radius:20px!important;
}
.study-page .progress-panel,
.study-page .review-panel{
  padding:24px!important;
}
.study-page .right-col>.badge-mini{
  display:block!important;
  padding:22px!important;
}
.study-page .right-col>.badge-mini h3{
  font-size:26px!important;
  margin-bottom:18px!important;
}
.study-page .right-col .mini-badges{
  gap:12px!important;
}
.study-page .right-col .mini-badge img{
  width:58px!important;
  height:58px!important;
}
.study-page .right-col .mini-badge small{
  font-size:12px!important;
  line-height:1.15!important;
}
.study-page .badge-view-all-btn{
  min-width:126px!important;
  min-height:50px!important;
  margin-top:16px!important;
  border:0!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,#7358f5,#4d36d1)!important;
  color:#fff!important;
  font-size:16px!important;
  font-weight:800!important;
  box-shadow:0 10px 22px rgba(91,69,232,.18)!important;
}
.study-page .sidebar-action-card{
  width:100%!important;
  min-height:86px!important;
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:14px!important;
  padding:16px 20px!important;
  border:1px solid var(--border)!important;
  background:#fff!important;
  color:var(--text)!important;
  text-align:left!important;
  font-size:16px!important;
  font-weight:850!important;
  cursor:pointer!important;
  box-shadow:var(--shadow)!important;
}
.study-page .shuffle-deck-card{
  grid-template-columns:52px minmax(0,1fr)!important;
}
.study-page .quick-action-icon{
  width:52px!important;
  height:52px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:18px!important;
  background:#f4f1ff!important;
  flex:0 0 auto!important;
}
.study-page .quick-action-icon img{
  width:34px!important;
  height:34px!important;
  object-fit:contain!important;
}
.study-page .study-range-shell{
  position:relative!important;
  width:100%!important;
}
.study-page #studyRangeButton{
  position:relative!important;
  min-height:86px!important;
  grid-template-columns:52px minmax(0,1fr) 18px!important;
}
.study-page #studyRangeButton b{
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:var(--navy)!important;
  font-size:15px!important;
  line-height:1.15!important;
  font-weight:900!important;
}
.study-page #studyRangeButton small{
  display:block!important;
  margin-top:5px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#625f7a!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:650!important;
}
.study-page #studyRangeButton .range-chevron{
  color:#5b45e8!important;
  font-size:30px!important;
  font-style:normal!important;
  line-height:1!important;
}
.study-page .study-range-shell .set-menu,
.study-page .study-quick-row .set-menu,
.study-page .quick-panel .set-menu{
  position:absolute!important;
  top:98px!important;
  left:0!important;
  right:auto!important;
  bottom:auto!important;
  transform:none!important;
  width:min(430px,calc(100vw - 52px))!important;
  max-height:min(72vh,560px)!important;
  margin:0!important;
  padding:0!important;
  overflow:auto!important;
  z-index:95!important;
  border:1px solid #ded8ff!important;
  border-radius:22px!important;
  background:#fff!important;
  box-shadow:0 22px 52px rgba(31,24,92,.18)!important;
}
.study-page .study-range-shell .set-menu.hidden{
  display:none!important;
}
.study-page .study-range-shell .set-menu::before{
  content:""!important;
  position:absolute!important;
  top:-8px!important;
  left:26px!important;
  width:16px!important;
  height:16px!important;
  transform:rotate(45deg)!important;
  background:#fff!important;
  border-left:1px solid #ded8ff!important;
  border-top:1px solid #ded8ff!important;
}
.study-page .right-col .study-promo-card{
  min-height:178px!important;
  padding:26px 24px!important;
}
.study-page .game-zone-card>img{
  width:158px!important;
  height:134px!important;
}
.study-page .dragon-studio-card>img:not(.baby-dragon-peek){
  width:112px!important;
  height:106px!important;
}
.study-page .study-promo-copy h3{
  font-size:26px!important;
}
.study-page .study-promo-copy p{
  font-size:16px!important;
}
.study-page .study-promo-copy button,
.study-page .game-zone-card .study-promo-copy button,
.study-page .dragon-studio-card .study-promo-copy button{
  min-height:50px!important;
  border-radius:16px!important;
}
@media(max-width:1320px){
  .study-page .study-layout{
    grid-template-columns:300px minmax(540px,1fr) 340px!important;
    gap:20px!important;
  }
}
@media(max-width:1180px){
  .study-page{
    max-width:860px!important;
    padding:14px 18px 32px!important;
  }
  .study-page .study-layout{
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  .study-page .study-center-col{
    order:1!important;
  }
  .study-page .side-col{
    order:2!important;
  }
  .study-page .right-col{
    order:3!important;
  }
  .study-page .main-study-card{
    min-height:620px!important;
  }
}
@media(max-width:760px){
  .study-page{
    padding:12px 12px 28px!important;
  }
  .study-page .main-study-card{
    min-height:540px!important;
    padding:22px 16px 24px!important;
  }
  .study-page .word-display{
    padding:32px 0 20px!important;
  }
  .study-page .sidebar-action-card,
  .study-page #studyRangeButton{
    min-height:76px!important;
    grid-template-columns:46px minmax(0,1fr) 16px!important;
    padding:13px 16px!important;
  }
  .study-page .shuffle-deck-card{
    grid-template-columns:46px minmax(0,1fr)!important;
  }
  .study-page .quick-action-icon{
    width:46px!important;
    height:46px!important;
  }
  .study-page .quick-action-icon img{
    width:30px!important;
    height:30px!important;
  }
  .study-page .study-range-shell .set-menu,
  .study-page .study-quick-row .set-menu,
  .study-page .quick-panel .set-menu{
    position:fixed!important;
    inset:auto 0 0 0!important;
    transform:none!important;
    width:100%!important;
    max-height:75vh!important;
    border-radius:24px 24px 0 0!important;
    z-index:95!important;
  }
  .study-page .study-range-shell .set-menu::before{
    display:none!important;
  }
}

/* ===== HatchElite background upgrade final cascade ===== */
body{
  background-color:#020b2d!important;
  background-image:
    radial-gradient(circle at 50% 0%,rgba(114,85,255,.32),transparent 28%),
    var(--he-bg-main)!important;
  background-size:cover!important;
  background-position:center top!important;
  background-attachment:fixed!important;
}
body::before,
body::after{
  content:"";
  position:fixed;
  inset:78px 0 0;
  pointer-events:none;
  z-index:0;
}
body::before{
  background-image:var(--he-bg-stars),var(--he-bg-stars)!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:left 5vw top 9vh,right 6vw top 22vh!important;
  background-size:150px auto,126px auto!important;
  opacity:.58!important;
}
body::after{
  background-image:var(--he-bg-bubbles)!important;
  background-repeat:no-repeat!important;
  background-position:center top!important;
  background-size:100% 100%!important;
  opacity:.34!important;
}
.app-shell,
main,
.page{
  position:relative!important;
  z-index:1!important;
}
.app-shell,
main,
.page,
#homePage.page,
#levelPage.page,
.study-page,
.profile-page,
.dragon-studio-page,
.he-games-select-page,
.he-game-route,
.dragon-studio-v2,
.dragon-studio-v2.ds-dashboard{
  background:transparent!important;
}
.topbar,
.topbar.app-header,
body.game-route-mode .topbar.app-header,
body.dragon-studio-mode .topbar.app-header{
  background:#fff!important;
  border-bottom:1px solid rgba(221,216,244,.9)!important;
  box-shadow:0 4px 18px rgba(8,13,50,.08)!important;
  z-index:30!important;
}
.hero h1,
.hero p,
.level-hero h1,
.level-hero p,
.he-games-select-page .he-games-hero-block h1,
.he-games-select-page .he-games-hero-block p,
.he-game-route .he-title,
.he-game-route .he-subtitle{
  color:#fff!important;
  text-shadow:0 10px 28px rgba(0,0,0,.25)!important;
}
.panel,
.exam-card,
.level-card,
.feature-strip,
.feature-row,
.full-access-unlocks,
.pricing-comparison,
.plan-summary-strip,
.profile-dash-hero,
.profile-dash-card,
.leader-mini-card,
.invite-mini-card,
.dash-stat-tile,
.profile-settings-group,
.profile-help-search,
.profile-help-questions button,
.hatchelite-game-card,
.he-featured-game-card,
.he-daily-reward-card,
.ds-dashboard .ds-card,
.ds-dashboard .ds-summary-row article,
.ds-dashboard .ds-summary-row button,
.ds-dashboard .ds-gallery-tile,
.ds-dashboard .ds-feed-item,
.ds-dashboard .meta-pill{
  background-color:#fff!important;
  border-color:rgba(213,207,244,.92)!important;
  box-shadow:0 18px 44px rgba(6,13,48,.18)!important;
}
.profile-studio-card::before{
  background-image:var(--he-profile-castle)!important;
  background-size:cover!important;
  background-position:center right!important;
}
.profile-studio-card::after{
  background:linear-gradient(90deg,rgba(255,255,255,.96) 0%,rgba(255,255,255,.88) 34%,rgba(255,255,255,.2) 58%,rgba(9,15,62,.22) 100%)!important;
}
.profile-studio-card .profile-card-heading h3,
.profile-studio-card .profile-studio-copy h4,
.profile-studio-card .profile-xp-row,
.profile-studio-card .profile-xp-row b{
  color:#081247!important;
  text-shadow:none!important;
}
.profile-studio-card .profile-studio-copy p,
.profile-studio-card .profile-studio-copy small{
  color:#172054!important;
}
.profile-studio-card .profile-badge-strip{
  background:rgba(5,14,58,.9)!important;
}
.profile-studio-card .profile-badge-strip>span{
  color:#fff!important;
}
.profile-approved-dashboard::before{
  background:var(--he-bg-stars) center/contain no-repeat!important;
}
.he-games-select-page::before,
.he-game-route::before,
.dragon-studio-v2.ds-dashboard::before{
  background-image:var(--he-bg-stars),var(--he-bg-bubbles)!important;
  background-repeat:no-repeat,no-repeat!important;
  background-position:left 5% top 8%,right top!important;
  background-size:128px auto,100% 100%!important;
  opacity:.26!important;
}
.footer{
  color:rgba(238,242,255,.76)!important;
  background:transparent!important;
}
.footer button{
  color:#d4ccff!important;
}

/* Final unified game page cascade. Keep this last so page-specific polish cannot undo it. */
.hatchelite-game-page.stoke-fire-page,
.hatchelite-game-page.forge-scale-page,
.hatchelite-game-page.dragon-flight-page,
.hatchelite-game-page.hatchery-match-page,
.hatchelite-game-page.term-definition-page,
.hatchelite-game-page.dragons-whisper-page{
  min-height:100vh!important;
  background:
    radial-gradient(circle at 12% 18%,rgba(114,88,255,.16),transparent 22%),
    radial-gradient(circle at 88% 20%,rgba(140,160,255,.08),transparent 20%),
    linear-gradient(180deg,#08152f 0%,#0a1b3d 50%,#091733 100%)!important;
  color:#f7f8ff!important;
}

/* Compact dark-glass Profile dashboard cards. */
.profile-page .profile-dash-hero,
.profile-page .profile-account-card,
.profile-page .profile-help-card{
  position:relative!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 10% 0%,rgba(126,105,255,.24),transparent 32%),
    radial-gradient(circle at 92% 12%,rgba(255,213,120,.10),transparent 24%),
    linear-gradient(135deg,rgba(14,25,58,.96),rgba(29,25,77,.94) 48%,rgba(9,18,44,.98))!important;
  border:1px solid rgba(190,180,255,.34)!important;
  box-shadow:0 18px 40px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.07)!important;
  color:#f7f8ff!important;
  backdrop-filter:blur(12px)!important;
}
.profile-page .profile-dash-hero{
  min-height:104px!important;
  grid-template-columns:82px minmax(0,1fr) auto!important;
  gap:16px!important;
  align-items:center!important;
  padding:14px 18px!important;
  border-radius:22px!important;
}
.profile-page .profile-avatar-button{
  width:78px!important;
  height:78px!important;
  padding:0!important;
}
.profile-page .profile-dash-avatar{
  width:78px!important;
  height:78px!important;
  border-radius:22px!important;
  object-fit:contain!important;
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(190,180,255,.28)!important;
  box-shadow:0 12px 24px rgba(0,0,0,.22)!important;
}
.profile-page .profile-dash-main h1{
  margin:0 0 7px!important;
  color:#ffe49a!important;
  font-size:24px!important;
  line-height:1.05!important;
}
.profile-page .profile-meta-row,
.profile-page .profile-quick-stats{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  margin:0!important;
}
.profile-page .profile-meta-row{
  margin-bottom:6px!important;
}
.profile-page .profile-meta-row span,
.profile-page .profile-quick-stats span{
  min-height:28px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  padding:4px 9px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.075)!important;
  border:1px solid rgba(150,165,245,.20)!important;
  color:#cfd6ff!important;
  font-size:12px!important;
  font-weight:750!important;
  line-height:1.15!important;
}
.profile-page .profile-meta-row b,
.profile-page .profile-quick-stats b{
  color:#cfd6ff!important;
  font-weight:850!important;
}
.profile-page .profile-meta-row strong{
  color:#ffffff!important;
  font-weight:950!important;
}
.profile-page .profile-dash-hero .profile-new-icon{
  width:16px!important;
  height:16px!important;
}
.profile-page .profile-dash-actions{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:8px!important;
  min-width:0!important;
}
.profile-page .profile-dash-actions button{
  min-height:34px!important;
  height:34px!important;
  padding:0 12px!important;
  border-radius:12px!important;
  font-size:12px!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
.profile-page .profile-dash-actions .dash-soft-btn{
  color:#f7f8ff!important;
  background:rgba(255,255,255,.08)!important;
  border:1px solid rgba(190,180,255,.24)!important;
  box-shadow:none!important;
}
.profile-page .profile-dash-actions .dash-primary-btn{
  color:#fff!important;
  background:linear-gradient(180deg,#8a73ff,#5d4eff)!important;
  border:1px solid rgba(198,184,255,.52)!important;
  box-shadow:0 10px 20px rgba(95,78,255,.24)!important;
}
.profile-page .profile-new-icon,
.profile-page .ui-inline-icon,
.profile-page .profile-dash-actions button img,
.profile-page .profile-card-heading h3 img,
.profile-page .profile-meta-row img,
.profile-page .profile-quick-stats img,
.profile-page .profile-settings-group h4 img,
.profile-page .profile-settings-group button img,
.profile-page .profile-help-card img{
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
  outline:0!important;
}
.profile-page .profile-approved-bottom-row{
  grid-template-columns:minmax(0,1.28fr) minmax(320px,.72fr)!important;
  gap:14px!important;
  align-items:stretch!important;
}
.profile-page .profile-account-card,
.profile-page .profile-help-card{
  padding:14px!important;
  border-radius:20px!important;
}
.profile-page .profile-account-card>h3,
.profile-page .profile-help-card>h3{
  margin:0 0 10px!important;
  color:#ffe49a!important;
  font-size:18px!important;
  line-height:1.1!important;
}
.profile-page .profile-account-card>h3 .profile-new-icon,
.profile-page .profile-help-card>h3 .profile-new-icon{
  width:16px!important;
  height:20px!important;
}
.profile-page .profile-settings-groups{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
}
.profile-page .profile-settings-group{
  min-height:0!important;
  padding:10px!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.065)!important;
  border:1px solid rgba(150,165,245,.20)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.profile-page .profile-settings-group h4{
  margin:0 0 6px!important;
  color:#f7f8ff!important;
  font-size:12.5px!important;
}
.profile-page .profile-settings-group h4 .profile-new-icon{
  width:15px!important;
  height:15px!important;
}
.profile-page .profile-settings-group p{
  margin:0 0 5px!important;
  color:#c9d1f4!important;
  font-size:11.5px!important;
}
.profile-page .profile-settings-group p b{
  color:#fff!important;
}
.profile-page .profile-settings-group button{
  min-height:28px!important;
  margin-top:1px!important;
  padding:0 6px!important;
  color:#e9ecff!important;
  border-radius:9px!important;
  font-size:11.5px!important;
  background:transparent!important;
}
.profile-page .profile-settings-group button:hover{
  background:rgba(255,255,255,.08)!important;
}
.profile-page .profile-settings-group button img{
  width:14px!important;
  height:14px!important;
}
.profile-page .profile-settings-group .profile-settings-primary{
  min-height:31px!important;
  margin-top:6px!important;
  color:#fff!important;
  background:linear-gradient(180deg,#8a73ff,#5d4eff)!important;
  border:1px solid rgba(198,184,255,.42)!important;
  box-shadow:0 8px 16px rgba(95,78,255,.20)!important;
}
.profile-page .profile-settings-group .subtle-danger{
  color:#ffb4b4!important;
}
.profile-page .profile-toggle-row{
  min-height:30px!important;
  color:#e9ecff!important;
  font-size:11.5px!important;
}
.profile-page .profile-toggle-row img{
  width:14px!important;
  height:14px!important;
}
.profile-page .profile-toggle-row i{
  width:38px!important;
  height:22px!important;
  background:rgba(255,255,255,.16)!important;
  border:1px solid rgba(190,180,255,.22)!important;
}
.profile-page .profile-toggle-row i:after{
  width:16px!important;
  height:16px!important;
}
.profile-page .profile-toggle-row input:checked+i{
  background:#6b4df5!important;
}
.profile-page .profile-toggle-row input:checked+i:after{
  transform:translateX(16px)!important;
}
.profile-page .profile-help-search{
  min-height:34px!important;
  margin-bottom:8px!important;
  padding:0 10px!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.075)!important;
  border:1px solid rgba(150,165,245,.22)!important;
}
.profile-page .profile-help-search img{
  width:15px!important;
  height:15px!important;
}
.profile-page .profile-help-search input{
  color:#fff!important;
  font-size:12px!important;
  background:transparent!important;
}
.profile-page .profile-help-search input::placeholder{
  color:#aeb8e8!important;
}
.profile-page .profile-help-questions{
  gap:6px!important;
}
.profile-page .profile-help-questions button{
  min-height:32px!important;
  padding:6px 9px!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.06)!important;
  border:1px solid rgba(150,165,245,.18)!important;
  color:#f2f4ff!important;
  font-size:11.5px!important;
  font-weight:800!important;
  line-height:1.18!important;
}
.profile-page .profile-help-questions button:hover{
  background:rgba(255,255,255,.10)!important;
}
.profile-page .profile-help-questions button .profile-new-icon{
  width:14px!important;
  height:14px!important;
}
.profile-page .profile-help-actions{
  gap:8px!important;
  margin-top:10px!important;
}
.profile-page .profile-help-actions button{
  min-height:32px!important;
  height:32px!important;
  border-radius:11px!important;
  background:rgba(255,255,255,.075)!important;
  border:1px solid rgba(190,180,255,.24)!important;
  color:#f7f8ff!important;
  font-size:11.5px!important;
  font-weight:900!important;
}
.profile-page .profile-help-actions button:first-child{
  background:linear-gradient(180deg,#8a73ff,#5d4eff)!important;
  border-color:rgba(198,184,255,.42)!important;
  color:#fff!important;
}
@media(max-width:1120px){
  .profile-page .profile-dash-hero{
    grid-template-columns:82px minmax(0,1fr)!important;
  }
  .profile-page .profile-dash-actions{
    grid-column:1 / -1!important;
    justify-content:flex-start!important;
  }
  .profile-page .profile-approved-bottom-row{
    grid-template-columns:1fr!important;
  }
}
@media(max-width:720px){
  .profile-page .profile-avatar-button,
  .profile-page .profile-dash-avatar{
    width:60px!important;
    height:60px!important;
    border-radius:18px!important;
  }
  .profile-page .profile-dash-hero{
    grid-template-columns:1fr!important;
    text-align:center!important;
    justify-items:center!important;
    padding:16px!important;
  }
  .profile-page .profile-dash-actions,
  .profile-page .profile-meta-row,
  .profile-page .profile-quick-stats{
    justify-content:center!important;
  }
  .profile-page .profile-settings-groups{
    grid-template-columns:1fr!important;
  }
  .profile-page .profile-help-actions{
    flex-direction:column!important;
  }
}

/* Shared non-blocking coin reward feedback. */
.coin-reward-stack{
  position:fixed!important;
  right:max(18px,env(safe-area-inset-right))!important;
  bottom:max(18px,env(safe-area-inset-bottom))!important;
  z-index:10050!important;
  display:grid!important;
  gap:10px!important;
  justify-items:end!important;
  pointer-events:none!important;
}
.coin-reward-toast{
  position:relative!important;
  right:auto!important;
  bottom:auto!important;
  display:grid!important;
  grid-template-columns:44px auto!important;
  align-items:center!important;
  gap:10px!important;
  min-width:156px!important;
  max-width:min(280px,calc(100vw - 32px))!important;
  padding:10px 14px 10px 10px!important;
  border-radius:999px!important;
  border:1px solid rgba(255,216,112,.46)!important;
  background:
    radial-gradient(circle at 15% 10%,rgba(255,223,111,.20),transparent 40%),
    linear-gradient(180deg,rgba(13,24,55,.94),rgba(7,15,36,.94))!important;
  box-shadow:0 0 24px rgba(100,82,255,.28),0 16px 34px rgba(0,0,0,.32)!important;
  color:#fff!important;
  opacity:0!important;
  transform:translateY(18px) scale(.92)!important;
  transition:opacity .22s ease,transform .22s ease!important;
}
.coin-reward-toast.show{
  opacity:1!important;
  transform:translateY(0) scale(1)!important;
}
.coin-reward-toast i{
  grid-row:1 / 2!important;
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  width:44px!important;
  height:44px!important;
  border-radius:50%!important;
  background:radial-gradient(circle,#fff5bf 0%,#ffd65f 46%,#e79a13 100%)!important;
  box-shadow:0 8px 20px rgba(218,154,25,.34),inset 0 2px 3px rgba(255,255,255,.55)!important;
  animation:coinRewardDropPop 1.15s cubic-bezier(.2,.9,.25,1.2) both!important;
}
.coin-reward-toast i img{
  width:28px!important;
  height:28px!important;
  object-fit:contain!important;
}
.coin-reward-toast b{
  color:#fff6be!important;
  font-size:17px!important;
  line-height:1!important;
  font-weight:1000!important;
  text-shadow:0 0 14px rgba(255,216,112,.28)!important;
  animation:coinRewardTextRise 1.15s ease both!important;
}
.coin-reward-toast span{
  grid-column:2!important;
  color:#dbe2ff!important;
  font-size:11.5px!important;
  line-height:1.2!important;
  font-weight:750!important;
}
.coin-reward-toast em{
  position:absolute!important;
  inset:-8px!important;
  border-radius:999px!important;
  background:
    radial-gradient(circle at 18% 36%,rgba(255,232,147,.85) 0 2px,transparent 3px),
    radial-gradient(circle at 78% 30%,rgba(173,151,255,.75) 0 2px,transparent 3px),
    radial-gradient(circle at 64% 80%,rgba(255,255,255,.70) 0 1.5px,transparent 2.5px)!important;
  opacity:0!important;
  animation:coinRewardSparkle 1.15s ease both!important;
}
.coin-reward-toast.bonus{
  border-color:rgba(188,170,255,.62)!important;
  box-shadow:0 0 28px rgba(126,105,255,.36),0 16px 34px rgba(0,0,0,.32)!important;
}
.coin-reward-toast.bonus b{
  color:#ffffff!important;
}
.hatch-goal-toast{
  max-width:min(310px,calc(100vw - 32px))!important;
  padding:10px 14px!important;
  border-radius:16px!important;
  border:1px solid rgba(150,165,245,.28)!important;
  background:linear-gradient(180deg,rgba(12,22,52,.94),rgba(7,15,36,.94))!important;
  color:#f7f8ff!important;
  box-shadow:0 0 22px rgba(100,82,255,.24),0 14px 28px rgba(0,0,0,.28)!important;
  opacity:0!important;
  transform:translateY(12px)!important;
  transition:opacity .22s ease,transform .22s ease!important;
}
.hatch-goal-toast.show{
  opacity:1!important;
  transform:translateY(0)!important;
}
.hatch-goal-toast b{
  display:block!important;
  color:#ffe49a!important;
  font-size:13px!important;
  font-weight:950!important;
}
.limit-warning-modal{
  border:1px solid rgba(190,180,255,.34)!important;
  background:
    radial-gradient(circle at 14% 4%,rgba(126,105,255,.22),transparent 34%),
    linear-gradient(180deg,rgba(12,24,56,.98),rgba(6,14,34,.98))!important;
  color:#f7f8ff!important;
  box-shadow:0 24px 70px rgba(0,0,0,.35)!important;
}
.limit-warning-modal h2{
  color:#ffe49a!important;
}
.limit-warning-modal #comingSoonText,
.limit-warning-modal .egg-modal-copy{
  color:#dbe2ff!important;
  font-weight:750!important;
  line-height:1.45!important;
}
.limit-warning-modal .egg-modal-actions{
  display:none!important;
}
.header-coin-help-wrap{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
}
.ds-inline-help{
  margin-left:auto!important;
  min-height:28px!important;
  padding:0 10px!important;
  border-radius:999px!important;
  border:1px solid rgba(190,180,255,.30)!important;
  background:rgba(255,255,255,.08)!important;
  color:#ffe49a!important;
  font-size:11px!important;
  font-weight:900!important;
  cursor:pointer!important;
}
.coin-guide-modal{
  width:min(720px,calc(100vw - 48px))!important;
  max-height:calc(100vh - 48px)!important;
  overflow:auto!important;
  padding:0!important;
  border-radius:30px!important;
  border:1px solid rgba(158,143,255,.56)!important;
  background:
    radial-gradient(circle at 12% 8%,rgba(126,105,255,.24),transparent 28%),
    radial-gradient(circle at 86% 20%,rgba(255,214,95,.10),transparent 20%),
    linear-gradient(180deg,rgba(10,20,52,.98),rgba(5,13,33,.98))!important;
  box-shadow:0 30px 80px rgba(0,0,0,.50),0 0 42px rgba(100,82,255,.28)!important;
  color:#f7f8ff!important;
}
.coin-guide-close,
.hatcher-guide-close{
  top:16px!important;
  right:16px!important;
  z-index:100!important;
  pointer-events:auto!important;
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
  border:1px solid rgba(190,180,255,.28)!important;
  cursor:pointer!important;
  display:grid!important;
  place-items:center!important;
}
.coin-guide-shell{
  position:relative!important;
  z-index:1!important;
  padding:28px 32px 26px!important;
  display:grid!important;
  gap:12px!important;
}
.coin-guide-header{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:14px!important;
  text-align:left!important;
  padding:0 42px 4px!important;
}
.coin-guide-header>img{
  width:58px!important;
  height:58px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 0 18px rgba(126,105,255,.45))!important;
}
.coin-guide-header span{
  display:block!important;
  color:#fff!important;
  font-size:34px!important;
  line-height:1!important;
  font-weight:1000!important;
}
.coin-guide-header h2{
  margin:6px 0 0!important;
  color:#fff!important;
  font-size:24px!important;
  line-height:1.12!important;
  font-weight:950!important;
}
.coin-guide-card{
  padding:14px 16px!important;
  border-radius:20px!important;
  border:1px solid rgba(150,165,245,.22)!important;
  background:rgba(255,255,255,.055)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.coin-guide-card h3{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin:0 0 10px!important;
  color:#ffe49a!important;
  font-size:18px!important;
  font-weight:950!important;
}
.coin-guide-card h3 img{
  width:24px!important;
  height:24px!important;
  object-fit:contain!important;
}
.coin-guide-earn-list{
  list-style:none!important;
  margin:0!important;
  padding:0!important;
  display:grid!important;
  gap:6px!important;
}
.coin-guide-earn-list li{
  display:grid!important;
  grid-template-columns:42px 26px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  padding:7px 0!important;
  border-bottom:1px solid rgba(150,165,245,.16)!important;
}
.coin-guide-earn-list li:last-child{
  border-bottom:0!important;
}
.coin-guide-row-icon{
  display:grid!important;
  place-items:center!important;
  width:42px!important;
  height:34px!important;
  border-radius:12px!important;
  background:rgba(126,105,255,.24)!important;
  border:1px solid rgba(190,180,255,.22)!important;
}
.coin-guide-icon{
  width:24px!important;
  height:24px!important;
  object-fit:contain!important;
  display:block!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.coin-guide-earn-list li>b,
.coin-guide-hatch-steps b{
  display:grid!important;
  place-items:center!important;
  width:24px!important;
  height:24px!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#8a73ff,#5d4eff)!important;
  color:#fff!important;
  font-size:12px!important;
  font-weight:950!important;
}
.coin-guide-earn-list p{
  margin:0!important;
  color:#f7f8ff!important;
  font-size:13px!important;
  line-height:1.24!important;
  font-weight:750!important;
}
.coin-guide-earn-list strong{
  color:#ffe49a!important;
  white-space:nowrap!important;
  font-size:13px!important;
  font-weight:950!important;
}
.coin-guide-limits p{
  margin:6px 0!important;
  color:#dbe2ff!important;
  font-size:13px!important;
  line-height:1.34!important;
  font-weight:750!important;
}
.coin-guide-hatch-steps{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
}
.coin-guide-hatch-steps span{
  display:grid!important;
  gap:6px!important;
  justify-items:center!important;
  text-align:center!important;
  color:#f7f8ff!important;
  font-size:12px!important;
  line-height:1.25!important;
  font-weight:800!important;
}
.coin-guide-note{
  margin:12px 0!important;
  color:#c9d1f4!important;
  font-size:12px!important;
  line-height:1.35!important;
  font-weight:750!important;
}
.coin-guide-care-card{
  display:block!important;
  width:100%!important;
  padding:12px 16px!important;
}
.coin-guide-care-card h3{
  margin-bottom:6px!important;
}
.coin-guide-care-icon{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.coin-guide-care-card p{
  margin:0!important;
  color:#dbe2ff!important;
  font-size:13px!important;
  line-height:1.35!important;
  font-weight:750!important;
}
.coin-guide-care-card p b,
.coin-guide-care-card p strong{
  color:#fff!important;
  font-weight:950!important;
}
.coin-guide-progress-grid{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:10px!important;
}
.coin-guide-progress-card{
  padding:10px 12px!important;
  border-radius:14px!important;
  border:1px solid rgba(150,165,245,.20)!important;
  background:rgba(255,255,255,.06)!important;
}
.coin-guide-progress-card b{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  color:#f7f8ff!important;
  font-size:13px!important;
  font-weight:900!important;
}
.coin-guide-progress-card b img{
  width:18px!important;
  height:18px!important;
}
.coin-guide-progress-card>i{
  display:block!important;
  height:8px!important;
  margin-top:9px!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,#8a73ff 0 var(--coin-guide-progress),rgba(255,255,255,.13) var(--coin-guide-progress))!important;
  border:1px solid rgba(190,180,255,.20)!important;
}
.coin-guide-dots{
  display:flex!important;
  gap:8px!important;
  margin-top:10px!important;
  justify-content:center!important;
}
.coin-guide-dots span{
  width:12px!important;
  height:12px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.16)!important;
}
.coin-guide-dots span.filled{
  background:linear-gradient(180deg,#a892ff,#6f5dff)!important;
  box-shadow:0 0 12px rgba(126,105,255,.45)!important;
}
.coin-guide-actions{
  display:grid!important;
  justify-items:center!important;
  gap:10px!important;
  padding-top:2px!important;
}
.coin-guide-actions button{
  width:min(320px,100%)!important;
  min-height:48px!important;
  border:0!important;
  border-radius:16px!important;
  background:linear-gradient(180deg,#8a73ff,#5d4eff)!important;
  color:#fff!important;
  font-size:18px!important;
  font-weight:950!important;
  cursor:pointer!important;
  box-shadow:0 14px 28px rgba(95,78,255,.30)!important;
}
.coin-guide-actions a{
  color:#b9aaff!important;
  font-size:13px!important;
  font-weight:900!important;
  text-decoration:none!important;
}
@keyframes coinRewardDropPop{
  0%{transform:translateY(-22px) scale(.62) rotate(-18deg);opacity:.1}
  32%{transform:translateY(3px) scale(1.17) rotate(8deg);opacity:1}
  58%{transform:translateY(-5px) scale(.98) rotate(-4deg)}
  100%{transform:translateY(0) scale(1) rotate(0)}
}
@keyframes coinRewardTextRise{
  0%{transform:translateY(10px);opacity:.25}
  38%,72%{transform:translateY(-3px);opacity:1}
  100%{transform:translateY(-7px);opacity:.88}
}
@keyframes coinRewardSparkle{
  0%,18%{opacity:0;transform:scale(.72)}
  45%{opacity:1;transform:scale(1)}
  100%{opacity:0;transform:scale(1.12)}
}
@media(max-width:640px){
  .coin-reward-stack{
    right:12px!important;
    bottom:12px!important;
  }
  .coin-reward-toast{
    min-width:142px!important;
    grid-template-columns:38px auto!important;
    padding:8px 12px 8px 8px!important;
  }
  .coin-reward-toast i{
    width:38px!important;
    height:38px!important;
  }
  .coin-reward-toast i img{
    width:24px!important;
    height:24px!important;
  }
  .coin-reward-toast b{
    font-size:15px!important;
  }
  .coin-guide-modal{
    width:calc(100vw - 24px)!important;
  }
  .coin-guide-shell{
    padding:22px 18px!important;
  }
  .coin-guide-header{
    justify-content:flex-start!important;
    padding-right:46px!important;
  }
  .coin-guide-header span{
    font-size:26px!important;
  }
  .coin-guide-header h2{
    font-size:19px!important;
  }
  .coin-guide-earn-list li{
    grid-template-columns:34px 22px minmax(0,1fr)!important;
  }
  .coin-guide-earn-list strong{
    grid-column:3!important;
    justify-self:start!important;
  }
  .coin-guide-row-icon{
    width:34px!important;
  }
  .coin-guide-hatch-steps,
  .coin-guide-progress-grid{
    grid-template-columns:1fr!important;
  }
}
.hatchelite-game-page.stoke-fire-page:before,
.hatchelite-game-page.forge-scale-page:before,
.hatchelite-game-page.dragon-flight-page:before,
.hatchelite-game-page.hatchery-match-page:before,
.hatchelite-game-page.term-definition-page:before,
.hatchelite-game-page.dragons-whisper-page:before{
  background-image:url("assets/assets_webp/game/effects/03_gold_sparkle_cluster.webp"),url("assets/assets_webp/game/effects/11_background_star_pattern.webp")!important;
  background-repeat:repeat,repeat!important;
  background-position:left 2% top 18px,right 7% top 80px!important;
  background-size:520px auto,560px auto!important;
  opacity:.15!important;
}
.hatchelite-game-page .he-game-topbar{
  background:#fff!important;
  border-bottom:1px solid #e9e5ff!important;
  box-shadow:0 8px 24px rgba(4,10,30,.08)!important;
}
.stoke-title-block h1,.forge-title-block h1,.flight-title-block h1,
.hatchery-title-block h1,.term-title-block h1,.whisper-title-block h1{
  color:#fff!important;
  text-shadow:0 8px 24px rgba(0,0,0,.28)!important;
}
.stoke-title-block p,.forge-title-block p,.flight-title-block p,
.hatchery-title-block p,.term-title-block p,.whisper-title-block p{
  color:#e9ecff!important;
}
.stoke-stat-pill,.forge-stat-pill,.flight-stat-pill,
.hatchery-stat-pill,.term-stat-pill,.whisper-stat-pill,
.hatchelite-game-page .game-how-button{
  background:rgba(10,23,52,.82)!important;
  border:1px solid rgba(138,150,234,.24)!important;
  color:#f6f7ff!important;
  box-shadow:0 8px 18px rgba(0,0,0,.18)!important;
}
.stoke-stat-pill b,.forge-stat-pill b,.flight-stat-pill b,
.hatchery-stat-pill b,.term-stat-pill b,.whisper-stat-pill b,
.stoke-stat-pill strong,.forge-stat-pill strong,.flight-stat-pill strong,
.hatchery-stat-pill strong,.term-stat-pill strong,.whisper-stat-pill strong{
  color:#fff!important;
}
.stoke-board,.forge-board,.flight-board,.hatchery-board,.term-board,.whisper-board{
  background:#fdfdff!important;
  border:1px solid rgba(188,196,238,.35)!important;
  border-radius:28px!important;
  box-shadow:0 24px 50px rgba(5,12,35,.34)!important;
  color:#17234c!important;
}
.stoke-panel,.forge-panel,.flight-panel,.hatchery-panel,.term-panel,.whisper-panel,
.stoke-encouragement,.flight-reward-card,.term-reward-card,.whisper-reward-card,
.hatchelite-game-page .game-visual-card,
.stoke-right-col .game-practice-controls,
.forge-right-col .game-practice-controls,
.flight-right-col .game-practice-controls,
.hatchery-right-col .game-practice-controls,
.term-right-col .game-practice-controls,
.whisper-right-col .game-practice-controls,
.stoke-word-list-button,.forge-word-list-button,.flight-word-list-button,
.hatchery-word-list-button,.term-word-list-button,.whisper-word-list-button{
  background:linear-gradient(180deg,rgba(9,21,50,.98),rgba(11,26,60,.98))!important;
  border:1px solid rgba(138,150,234,.22)!important;
  color:#f7f8ff!important;
  box-shadow:0 12px 28px rgba(4,10,30,.30)!important;
}
.hatchelite-game-page .game-visual-card img{
  background:#0c1738!important;
}
.stoke-panel h2,.forge-panel h2,.flight-panel h2,.hatchery-panel h2,.term-panel h2,.whisper-panel h2,
.treasure-progress-card.treasure-rewards-card h2,
.whisper-path-card>b,.treasure-progress-card>b,.nursery-goal-panel>b,
.armor-progress-count,.flight-progress-bar b,.term-reward-card span b,
.whisper-reward-card b,.whisper-reward-card span{
  color:#fff!important;
}
.stoke-panel p,.forge-panel p,.flight-panel p,.hatchery-panel p,.term-panel p,.whisper-panel p,
.stoke-step p,.forge-step p,.flight-step p,.hatchery-step p,.term-step p,.whisper-step p,
.stoke-encouragement span,.flight-reward-card span,.term-reward-card span,.whisper-reward-card p,
.hatchelite-game-page .game-practice-controls label,
.hatchelite-game-page .game-practice-controls small{
  color:#c9d1ff!important;
}
.stoke-right-col .game-practice-controls select,
.forge-right-col .game-practice-controls select,
.flight-right-col .game-practice-controls select,
.hatchery-right-col .game-practice-controls select,
.term-right-col .game-practice-controls select,
.whisper-right-col .game-practice-controls select{
  background:rgba(7,14,37,.78)!important;
  border-color:rgba(151,162,238,.28)!important;
  color:#fff!important;
}
.stoke-hint-button,.forge-hint-button,.flight-hint-button,.hatchery-hint-button,.term-hint-button,.whisper-hint-button,
.stoke-right-col .game-practice-controls button,
.forge-right-col .game-practice-controls button,
.flight-right-col .game-practice-controls button,
.hatchery-right-col .game-practice-controls button,
.term-right-col .game-practice-controls button,
.whisper-right-col .game-practice-controls button,
.ignite-button,.forge-button,.send-soaring-button,.term-check-button,.translate-whisper-button.primary-whisper-submit{
  background:linear-gradient(180deg,#8a73ff 0%,#5d4eff 100%)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 12px 26px rgba(95,78,255,.32)!important;
}
.term-reset-button,.hatchery-ghost-button,.listen-again-button,.reset-whisper-button{
  background:#fff!important;
  color:#6546f3!important;
  border:1.5px solid #7c4dff!important;
  box-shadow:0 10px 22px rgba(82,64,160,.08)!important;
}
.hatchling-collection span,.armor-item{
  background:rgba(255,255,255,.08)!important;
  border-color:rgba(178,188,255,.22)!important;
  color:#c9d1ff!important;
}
.hatchling-collection span.filled,.armor-item--unlocked{
  background:rgba(255,255,255,.13)!important;
  color:#fff!important;
}

/* Study card interaction update */
.study-page .flashcard-flip-card{
  display:flex;
  align-items:center;
  justify-content:center;
  width:min(720px,100%);
  min-height:300px;
  margin:12px auto 18px;
  padding:34px 28px;
  border:1.5px solid var(--border);
  border-radius:18px;
  background:linear-gradient(180deg,#fff,#fbfaff);
  box-shadow:0 16px 34px rgba(38,33,94,.08);
  color:var(--navy);
  cursor:pointer;
  text-align:center;
}
.study-page .flashcard-flip-card:hover{
  transform:translateY(-1px);
  box-shadow:0 20px 42px rgba(38,33,94,.12);
}
.study-page .flashcard-front h2{
  margin:0!important;
  font-size:58px!important;
  letter-spacing:0!important;
}
.study-page .flashcard-back-content{
  max-width:620px;
  margin:0 auto;
}
.study-page .flashcard-back-content h2{
  margin:0 0 18px;
  font-size:42px;
  letter-spacing:0;
}
.study-page .flashcard-back-content p{
  margin:10px 0;
  color:var(--text);
  font-size:17px;
  line-height:1.55;
}
.study-page .flashcard-nav{
  display:grid;
  grid-template-columns:64px auto 64px;
  align-items:center;
  justify-content:center;
  gap:28px;
  margin:8px auto 0;
  font-weight:950;
  color:var(--navy);
}
.study-page .flashcard-nav button{
  width:52px;
  height:44px;
  border:1px solid var(--border);
  border-radius:999px;
  background:#fff;
  color:var(--purple);
  font-size:24px;
  font-weight:900;
  cursor:pointer;
}
.study-page .flashcard-nav button:hover{background:#f5f2ff}
.study-page .activity-summary-card{
  max-width:620px;
  margin:42px auto;
  text-align:center;
}
.study-page .activity-summary-card h2{
  margin:0 0 22px;
  font-size:38px;
  color:var(--navy);
}
.study-page .summary-stat-list{
  display:grid;
  gap:8px;
  margin:0 auto 24px;
  color:var(--text);
  font-size:18px;
}
.study-page .summary-stat-list p{margin:0}
.study-page .summary-actions{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
}
.study-page .summary-actions button,
.daily-weak-actions button{
  min-height:44px;
  border:1.5px solid var(--border);
  border-radius:12px;
  background:#fff;
  color:var(--purple);
  font-weight:950;
  cursor:pointer;
}
.study-page .summary-actions button:last-child,
.daily-weak-actions .primary{
  border:0;
  background:linear-gradient(180deg,#5a45ea,#4932cd);
  color:#fff;
}
.daily-weak-popup-backdrop{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(16,18,48,.36);
}
.daily-weak-popup{
  width:min(520px,100%);
  border-radius:18px;
  background:#fff;
  box-shadow:0 24px 70px rgba(20,24,70,.24);
  padding:24px;
  text-align:center;
}
.daily-weak-popup h2{margin:0 0 14px;color:var(--navy)}
.daily-weak-list{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:8px;
  margin:12px 0 20px;
}
.daily-weak-list span{
  border:1px solid var(--border);
  border-radius:999px;
  padding:7px 11px;
  background:#fbfaff;
  color:var(--text);
  font-weight:800;
}
.daily-weak-actions{
  display:flex;
  justify-content:center;
  gap:12px;
}
.feed-confirmation-backdrop{
  position:fixed!important;
  inset:0!important;
  z-index:10060!important;
  display:grid!important;
  place-items:center!important;
  padding:24px!important;
  background:rgba(2,6,24,.72)!important;
  backdrop-filter:blur(4px)!important;
}
.feed-confirmation-modal{
  position:relative!important;
  width:min(780px,calc(100vw - 36px))!important;
  max-height:calc(100vh - 36px)!important;
  overflow:auto!important;
  display:grid!important;
  justify-items:center!important;
  gap:16px!important;
  padding:38px 48px 34px!important;
  border-radius:34px!important;
  border:2px solid rgba(134,106,255,.58)!important;
  background:
    radial-gradient(circle at 50% 54%,rgba(99,58,255,.30),transparent 34%),
    radial-gradient(circle at 18% 12%,rgba(255,226,109,.10),transparent 18%),
    linear-gradient(180deg,rgba(9,17,54,.98),rgba(8,10,42,.99))!important;
  color:#fff!important;
  box-shadow:0 28px 90px rgba(0,0,0,.58),0 0 42px rgba(99,70,255,.35),inset 0 1px 0 rgba(255,255,255,.08)!important;
  text-align:center!important;
}
.feed-confirmation-close{
  position:absolute!important;
  top:18px!important;
  right:18px!important;
  width:68px!important;
  height:68px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  border:2px solid rgba(139,96,255,.95)!important;
  background:rgba(255,255,255,.08)!important;
  color:#fff!important;
  font-size:58px!important;
  line-height:.75!important;
  font-weight:300!important;
  cursor:pointer!important;
  box-shadow:0 0 24px rgba(139,96,255,.24)!important;
}
.feed-confirmation-sparkles{
  position:absolute!important;
  inset:48px 110px auto 110px!important;
  display:flex!important;
  justify-content:space-between!important;
  pointer-events:none!important;
  color:#ffe36d!important;
  font-size:38px!important;
  text-shadow:0 0 18px rgba(255,213,74,.55)!important;
}
.feed-confirmation-sparkles span:nth-child(2),
.feed-confirmation-sparkles span:nth-child(4){
  transform:scale(.72) translateY(26px)!important;
}
.feed-confirmation-modal h2{
  margin:0!important;
  color:#ffe984!important;
  font-size:64px!important;
  line-height:.95!important;
  font-weight:1000!important;
  text-shadow:0 4px 24px rgba(255,214,95,.22)!important;
}
.feed-confirmation-rule{
  width:min(280px,70%)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:16px!important;
  color:#8d70ff!important;
}
.feed-confirmation-rule i{
  height:3px!important;
  flex:1!important;
  border-radius:999px!important;
  background:linear-gradient(90deg,transparent,#6f55f5)!important;
}
.feed-confirmation-rule i:last-child{
  background:linear-gradient(90deg,#6f55f5,transparent)!important;
}
.feed-confirmation-rule b{
  font-size:30px!important;
  line-height:1!important;
}
.feed-confirmation-modal p{
  margin:0!important;
  color:#fff!important;
  font-size:30px!important;
  line-height:1.28!important;
  font-weight:900!important;
}
.feed-confirmation-modal p strong{
  color:#ffd839!important;
  font-weight:1000!important;
}
.feed-confirmation-item{
  width:min(330px,62vw)!important;
  height:min(260px,34vh)!important;
  object-fit:contain!important;
  margin:4px 0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  filter:drop-shadow(0 0 28px rgba(255,190,54,.34)) drop-shadow(0 24px 30px rgba(0,0,0,.30))!important;
}
.feed-confirmation-coins{
  width:min(500px,100%)!important;
  min-height:76px!important;
  display:grid!important;
  grid-template-columns:1fr auto 42px!important;
  align-items:center!important;
  gap:14px!important;
  padding:12px 28px!important;
  border-radius:18px!important;
  border:1px solid rgba(150,165,245,.30)!important;
  background:rgba(255,255,255,.055)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.feed-confirmation-coins span{
  color:#cfd6ff!important;
  font-size:24px!important;
  font-weight:900!important;
  text-align:left!important;
}
.feed-confirmation-coins b{
  color:#ff4f6b!important;
  font-size:46px!important;
  line-height:1!important;
  font-weight:1000!important;
}
.feed-confirmation-coins img{
  width:42px!important;
  height:42px!important;
  object-fit:contain!important;
}
.feed-confirmation-awesome{
  min-width:270px!important;
  min-height:66px!important;
  border:1px solid rgba(173,151,255,.70)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#7e5dff,#4d30df)!important;
  color:#fff!important;
  font-size:25px!important;
  font-weight:1000!important;
  cursor:pointer!important;
  box-shadow:0 18px 34px rgba(83,51,221,.34)!important;
}
@media(max-width:620px){
  .feed-confirmation-modal{
    padding:34px 18px 24px!important;
    border-radius:26px!important;
  }
  .feed-confirmation-close{
    width:48px!important;
    height:48px!important;
    font-size:42px!important;
  }
  .feed-confirmation-sparkles{
    inset:42px 70px auto 70px!important;
    font-size:28px!important;
  }
  .feed-confirmation-modal h2{
    font-size:44px!important;
  }
  .feed-confirmation-modal p{
    font-size:22px!important;
  }
  .feed-confirmation-coins{
    grid-template-columns:1fr auto 30px!important;
    padding:10px 16px!important;
  }
  .feed-confirmation-coins span{
    font-size:18px!important;
  }
  .feed-confirmation-coins b{
    font-size:36px!important;
  }
  .feed-confirmation-coins img{
    width:30px!important;
    height:30px!important;
  }
  .feed-confirmation-awesome{
    min-width:220px!important;
  }
}
.study-page .question-next-row{
  grid-template-columns:minmax(180px,260px);
  justify-content:center;
}
.study-page .action-row button:disabled{
  opacity:.48;
  cursor:not-allowed;
  box-shadow:none!important;
}
@media(max-width:620px){
  .study-page .summary-actions{grid-template-columns:1fr}
  .study-page .flashcard-front h2{font-size:42px!important}
  .study-page .flashcard-back-content h2{font-size:32px}
  .study-page .flashcard-nav{gap:14px}
}

/* Essential marker: individual study cards use the settings icon with a tooltip. */
.study-page .essential-ribbon{
  position:absolute!important;
  top:14px!important;
  left:14px!important;
  width:30px!important;
  height:30px!important;
  max-height:none!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:0 8px 16px rgba(225,29,72,.2)!important;
  z-index:8!important;
}
.study-page .essential-ribbon img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}
.study-page .essential-ribbon::after{
  display:none!important;
  content:none!important;
}
@media(max-width:640px){
  .study-page .essential-ribbon{
    top:12px!important;
    left:12px!important;
    width:28px!important;
    height:28px!important;
  }
}

/* My Profile Dragon Studio + Community reference polish. */
.profile-page .profile-approved-top-row{
  grid-template-columns:minmax(0,1.04fr) minmax(360px,.70fr)!important;
  gap:20px!important;
  align-items:stretch!important;
}
.profile-page .profile-studio-card,
.profile-page .profile-community-card{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  min-height:520px!important;
  padding:22px!important;
  border-radius:26px!important;
  border:1px solid rgba(155,135,255,.44)!important;
  background:transparent!important;
  box-shadow:0 20px 48px rgba(7,12,43,.24), inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.profile-page .profile-studio-card::before,
.profile-page .profile-community-card::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-2!important;
  border-radius:inherit!important;
  background-size:cover!important;
  background-position:center!important;
}
.profile-page .profile-studio-card::before{
  background-image:var(--he-profile-castle)!important;
}
.profile-page .profile-community-card::before{
  background-image:url("assets/assets_webp/my-profile-backgrounds/bg_profile_community_panel.webp")!important;
  background-position:center bottom!important;
}
.profile-page .profile-studio-card::after,
.profile-page .profile-community-card::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:-1!important;
  border-radius:inherit!important;
  pointer-events:none!important;
}
.profile-page .profile-studio-card::after{
  background:
    radial-gradient(circle at 90% 15%,rgba(112,85,255,.16),transparent 25%),
    linear-gradient(90deg,rgba(255,255,255,.86) 0%,rgba(255,255,255,.72) 43%,rgba(111,85,245,.14) 100%)!important;
}
.profile-page .profile-community-card::after{
  background:linear-gradient(180deg,rgba(39,27,126,.10),rgba(50,31,138,.08))!important;
}
.profile-page .profile-card-heading{
  min-height:42px!important;
  margin:0 0 18px!important;
}
.profile-page .profile-card-heading h3{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  color:#fff!important;
  font-size:24px!important;
  line-height:1.05!important;
  font-weight:950!important;
  text-shadow:0 8px 18px rgba(0,0,0,.20)!important;
}
.profile-page .profile-studio-card .profile-card-heading h3,
.profile-page .profile-studio-card .profile-studio-copy h4,
.profile-page .profile-studio-card .profile-studio-copy p,
.profile-page .profile-studio-card .profile-xp-row,
.profile-page .profile-studio-card .profile-xp-row b{
  color:#081247!important;
  text-shadow:none!important;
}
.profile-page .profile-card-heading h3 .profile-new-icon{
  width:30px!important;
  height:30px!important;
}
.profile-page .profile-community-card .profile-card-heading button{
  min-height:40px!important;
  padding:0 22px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.94)!important;
  color:#5135df!important;
  border:1px solid rgba(213,207,244,.86)!important;
  box-shadow:0 10px 20px rgba(20,18,74,.12)!important;
  font-size:14px!important;
}
.profile-page .profile-studio-body{
  display:grid!important;
  grid-template-columns:minmax(220px,300px) minmax(0,1fr)!important;
  gap:28px!important;
  align-items:center!important;
}
.profile-page .profile-studio-dragon{
  width:100%!important;
  height:320px!important;
  min-height:320px!important;
  padding:12px!important;
  object-fit:contain!important;
  border-radius:24px!important;
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(255,255,255,.82)!important;
  box-shadow:0 16px 32px rgba(45,36,130,.12)!important;
}
.profile-page .profile-studio-copy{
  min-width:0!important;
}
.profile-page .profile-studio-card .profile-kicker{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin-bottom:12px!important;
  padding:9px 20px!important;
  border-radius:999px!important;
  color:#fff!important;
  background:rgba(118,88,255,.58)!important;
  border:1px solid rgba(255,255,255,.55)!important;
  box-shadow:0 8px 18px rgba(92,65,220,.16)!important;
  font-size:14px!important;
}
.profile-page .profile-studio-copy h4{
  margin:8px 0 12px!important;
  font-size:38px!important;
  line-height:1.05!important;
  font-weight:1000!important;
}
.profile-page .profile-studio-copy p{
  margin:0 0 14px!important;
  font-size:18px!important;
  line-height:1.25!important;
  font-weight:850!important;
}
.profile-page .profile-xp-row{
  margin-top:20px!important;
  font-size:16px!important;
  line-height:1!important;
}
.profile-page .profile-xp-bar{
  height:15px!important;
  margin:11px 0 18px!important;
  border:2px solid rgba(255,255,255,.9)!important;
  background:rgba(222,226,255,.72)!important;
  box-shadow:inset 0 1px 3px rgba(28,25,92,.12)!important;
}
.profile-page .profile-studio-action-row{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:16px!important;
}
.profile-page .profile-studio-action-row small{
  margin:0!important;
  color:#11184d!important;
  font-size:16px!important;
  line-height:1.25!important;
  font-weight:850!important;
}
.profile-page .profile-enter-studio{
  min-width:190px!important;
  min-height:54px!important;
  margin:0!important;
  border-radius:16px!important;
  gap:10px!important;
  background:linear-gradient(180deg,#7d61ff,#4f35df)!important;
  box-shadow:0 15px 26px rgba(73,45,200,.24)!important;
  font-size:16px!important;
}
.profile-page .profile-studio-divider{
  display:none!important;
}
.profile-page .profile-badge-strip{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin-top:26px!important;
  padding:18px 20px!important;
  border-radius:22px!important;
  background:linear-gradient(180deg,rgba(20,28,70,.96),rgba(12,18,46,.98))!important;
  border:1px solid rgba(150,130,255,.28)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 12px 28px rgba(0,0,0,.20)!important;
}
.profile-page .badge-strip-left,
.profile-page .badge-strip-right{
  display:flex!important;
  align-items:center!important;
}
.profile-page .badge-strip-left{
  gap:14px!important;
  min-width:0!important;
}
.profile-page .badge-strip-icon{
  width:58px!important;
  height:58px!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 58px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.05)!important;
  border:1px solid rgba(150,130,255,.24)!important;
}
.profile-page .badge-strip-icon .profile-new-icon{
  width:38px!important;
  height:38px!important;
}
.profile-page .badge-strip-left b{
  display:block!important;
  color:#fff!important;
  font-size:17px!important;
  line-height:1.1!important;
  font-weight:950!important;
}
.profile-page .badge-strip-left small{
  display:block!important;
  margin-top:6px!important;
  color:rgba(235,232,255,.72)!important;
  font-size:13px!important;
  line-height:1.2!important;
  font-weight:650!important;
}
.profile-page .badge-strip-right{
  gap:10px!important;
  flex-wrap:nowrap!important;
}
.profile-page .badge-chip,
.profile-page .badge-count-chip{
  width:58px!important;
  height:58px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 58px!important;
  padding:7px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.05)!important;
  border:1px solid rgba(150,130,255,.24)!important;
  color:#fff!important;
  box-shadow:none!important;
}
.profile-page .badge-chip img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}
.profile-page .badge-count-chip{
  font-size:19px!important;
  line-height:1!important;
  font-weight:1000!important;
}
.profile-page .profile-community-card{
  display:flex!important;
  flex-direction:column!important;
  gap:18px!important;
}
.profile-page .profile-community-card .profile-card-heading{
  margin-bottom:8px!important;
}
.profile-page .profile-community-card .leader-mini-card,
.profile-page .profile-community-card .invite-mini-card{
  position:relative!important;
  z-index:1!important;
  width:100%!important;
  border-radius:22px!important;
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(226,222,246,.88)!important;
  box-shadow:0 12px 28px rgba(36,29,80,.10)!important;
}
.profile-page .profile-community-card .leader-mini-card{
  margin:0!important;
  padding:24px!important;
}
.profile-page .profile-community-card .leader-mini-card h4{
  margin:0 0 16px!important;
  color:#0b1040!important;
  font-size:21px!important;
  line-height:1.1!important;
  font-weight:950!important;
}
.profile-page .profile-community-card .leader-mini-card h4 span{
  color:inherit!important;
}
.profile-page .profile-community-card .leader-mini-card ol{
  counter-reset:profile-rank!important;
  margin:0!important;
  padding:0!important;
  list-style-position:inside!important;
  border:1px solid rgba(221,216,244,.88)!important;
  border-radius:14px!important;
  overflow:hidden!important;
  background:rgba(255,255,255,.46)!important;
}
.profile-page .profile-community-card .leader-mini-card li{
  counter-increment:profile-rank!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  min-height:52px!important;
  padding:0 16px!important;
  color:#0b1040!important;
  font-size:16px!important;
  font-weight:850!important;
  border-bottom:1px solid rgba(221,216,244,.78)!important;
}
.profile-page .profile-community-card .leader-mini-card li::before{
  content:counter(profile-rank) "."!important;
  flex:0 0 auto!important;
  margin-right:2px!important;
  color:#0b1040!important;
  font-weight:950!important;
}
.profile-page .profile-community-card .leader-mini-card li b{
  margin-right:auto!important;
}
.profile-page .profile-community-card .leader-mini-card li:last-child{
  border-bottom:0!important;
}
.profile-page .profile-community-card .leader-mini-card .current-user{
  background:transparent!important;
  border-radius:0!important;
}
.profile-page .profile-community-card .leader-mini-card li span{
  color:#485075!important;
  font-size:14px!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
.profile-page .profile-community-card .invite-mini-card{
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr) 130px!important;
  align-items:center!important;
  gap:16px!important;
  margin-top:2px!important;
  padding:22px 24px!important;
}
.profile-page .profile-community-card .invite-mini-card>.profile-new-icon{
  width:36px!important;
  height:36px!important;
  justify-self:center!important;
}
.profile-page .profile-community-card .invite-mini-card b{
  display:block!important;
  color:#0b1040!important;
  font-size:17px!important;
  line-height:1.1!important;
  font-weight:950!important;
}
.profile-page .profile-community-card .invite-mini-card span{
  display:block!important;
  margin-top:7px!important;
  color:#485075!important;
  font-size:14px!important;
  line-height:1.28!important;
  font-weight:650!important;
}
.profile-page .profile-community-card .invite-mini-card button{
  min-height:52px!important;
  border-radius:12px!important;
  border:1.5px solid #624cff!important;
  background:#fff!important;
  color:#5135df!important;
  font-size:16px!important;
  font-weight:950!important;
  box-shadow:none!important;
}
@media(max-width:1120px){
  .profile-page .profile-approved-top-row{
    grid-template-columns:1fr!important;
  }
  .profile-page .profile-studio-card,
  .profile-page .profile-community-card{
    min-height:0!important;
  }
}
@media(max-width:760px){
  .profile-page .profile-studio-card,
  .profile-page .profile-community-card{
    padding:18px!important;
    border-radius:22px!important;
  }
  .profile-page .profile-studio-body{
    grid-template-columns:1fr!important;
    gap:18px!important;
  }
  .profile-page .profile-studio-dragon{
    height:260px!important;
    min-height:260px!important;
  }
  .profile-page .profile-studio-copy h4{
    font-size:31px!important;
  }
  .profile-page .profile-studio-action-row,
  .profile-page .profile-badge-strip{
    flex-direction:column!important;
    align-items:stretch!important;
  }
  .profile-page .profile-enter-studio{
    width:100%!important;
  }
  .profile-page .badge-strip-right{
    justify-content:flex-start!important;
    flex-wrap:wrap!important;
  }
  .profile-page .profile-community-card .invite-mini-card{
    grid-template-columns:44px minmax(0,1fr)!important;
  }
  .profile-page .profile-community-card .invite-mini-card button{
    grid-column:1 / -1!important;
    width:100%!important;
  }
}

/* Absolute final Profile compact dashboard override. */
.profile-page{max-width:1420px!important;padding-top:14px!important}
.profile-page .profile-approved-dashboard{max-width:1340px!important;gap:18px!important}
.profile-page .profile-avatar-button,.profile-page .profile-reward-summary-row,.profile-page .snapshot-message-bar{display:none!important}
.profile-page .profile-dash-hero{height:auto!important;min-height:118px!important;padding:18px 28px!important;border-radius:24px!important;display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:18px!important;align-items:center!important;border:1px solid rgba(155,135,255,.36)!important;background:linear-gradient(135deg,rgba(20,30,72,.92),rgba(19,29,65,.82))!important;box-shadow:0 18px 44px rgba(2,8,28,.22),inset 0 1px 0 rgba(255,255,255,.08)!important}
.profile-page .profile-dash-main{min-width:0!important;display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:8px!important}
.profile-page .profile-dash-main h1{flex:0 0 100%!important;margin:0 0 2px!important;color:#fff!important;font-size:24px!important;line-height:1.1!important;font-weight:950!important}
.profile-page .profile-meta-row,.profile-page .profile-quick-stats{display:contents!important;margin:0!important}
.profile-page .profile-meta-row span,.profile-page .profile-quick-stats span{display:inline-flex!important;align-items:center!important;gap:7px!important;min-height:34px!important;padding:0 13px!important;border-radius:12px!important;border:1px solid rgba(159,175,244,.24)!important;background:rgba(255,255,255,.045)!important;color:#f6f7ff!important;font-size:12px!important;line-height:1!important;font-weight:850!important;white-space:nowrap!important}
.profile-page .profile-meta-row strong,.profile-page .profile-meta-row b{color:#fff!important;margin:0!important}
.profile-page .profile-dash-actions{display:grid!important;grid-template-columns:repeat(3,minmax(132px,1fr))!important;gap:12px!important;align-items:center!important;justify-content:end!important}
.profile-page .dash-soft-btn,.profile-page .dash-primary-btn{min-height:40px!important;padding:0 16px!important;border-radius:12px!important;font-size:13px!important;line-height:1!important;white-space:nowrap!important}
.profile-page .dash-soft-btn{background:rgba(255,255,255,.045)!important;border:1px solid rgba(159,175,244,.25)!important;color:#fff!important}
.profile-page .dash-primary-btn{background:linear-gradient(180deg,#7057ff,#4f35df)!important;color:#fff!important}
.profile-page .profile-approved-top-row{display:grid!important;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;gap:18px!important;align-items:stretch!important}
.profile-page .profile-studio-card,.profile-page .profile-community-card,.profile-page .learning-snapshot-card,.profile-page .profile-account-card,.profile-page .profile-help-card{border-radius:24px!important;border:1px solid rgba(155,135,255,.34)!important;box-shadow:0 18px 44px rgba(2,8,28,.22),inset 0 1px 0 rgba(255,255,255,.08)!important}
.profile-page .profile-studio-card,.profile-page .profile-community-card{height:230px!important;min-height:0!important;padding:18px 22px!important}
.profile-page .profile-studio-card::after{background:linear-gradient(90deg,rgba(18,22,91,.72),rgba(36,29,124,.44))!important}
.profile-page .profile-community-card::after{background:linear-gradient(180deg,rgba(36,26,119,.28),rgba(43,29,128,.20))!important}
.profile-page .profile-card-heading{min-height:0!important;margin:0 0 10px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}
.profile-page .profile-card-heading h3,.profile-page .learning-snapshot-card .profile-card-heading h3,.profile-page .profile-account-card>h3,.profile-page .profile-help-card>h3{margin:0!important;font-size:18px!important;line-height:1.15!important;font-weight:950!important}
.profile-page .profile-card-heading h3 .profile-new-icon{width:24px!important;height:24px!important}
.profile-page .profile-community-card .profile-card-heading button,.profile-page .learning-snapshot-card .profile-card-heading button{min-height:30px!important;padding:0 14px!important;border-radius:999px!important;font-size:11px!important;font-weight:950!important}
.profile-page .profile-studio-body{display:grid!important;grid-template-columns:170px minmax(0,1fr)!important;gap:18px!important;align-items:center!important}
.profile-page .profile-studio-dragon{width:165px!important;height:148px!important;min-height:0!important;padding:0!important;object-fit:contain!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;filter:drop-shadow(0 18px 18px rgba(0,0,0,.22))!important}
.profile-page .profile-studio-card .profile-kicker{margin:0 0 5px!important;min-height:24px!important;padding:0 11px!important;font-size:10px!important;line-height:1!important}
.profile-page .profile-studio-copy h4{margin:0 0 4px!important;font-size:18px!important;line-height:1.1!important}
.profile-page .profile-studio-copy p{margin:0 0 7px!important;font-size:12px!important;line-height:1.25!important;font-weight:800!important}
.profile-page .profile-xp-row{margin-top:6px!important;font-size:12px!important}
.profile-page .profile-xp-bar{height:9px!important;margin:7px 0 8px!important}
.profile-page .profile-studio-action-row{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important}
.profile-page .profile-studio-action-row small{display:none!important}
.profile-page .profile-enter-studio{min-width:128px!important;min-height:34px!important;margin:0 0 0 auto!important;padding:0 15px!important;border-radius:12px!important;font-size:12px!important}
.profile-page .profile-badge-strip{min-height:46px!important;margin-top:9px!important;padding:8px 12px!important;border-radius:15px!important;gap:12px!important}
.profile-page .badge-strip-icon{width:34px!important;height:34px!important;flex-basis:34px!important;border-radius:10px!important}
.profile-page .badge-strip-icon .profile-new-icon{width:22px!important;height:22px!important}
.profile-page .badge-strip-left{gap:9px!important}
.profile-page .badge-strip-left b{font-size:13px!important}
.profile-page .badge-strip-left small{display:none!important}
.profile-page .badge-strip-right{gap:7px!important}
.profile-page .badge-chip,.profile-page .badge-count-chip{width:34px!important;height:34px!important;flex-basis:34px!important;padding:4px!important;border-radius:10px!important;font-size:13px!important}
.profile-page .practice-circle-coming-soon{position:relative!important;z-index:1!important;display:grid!important;grid-template-columns:54px minmax(0,1fr) auto!important;grid-template-rows:auto auto!important;align-items:center!important;gap:9px 14px!important;padding:16px 18px!important;border-radius:18px!important;background:rgba(255,255,255,.92)!important;border:1px solid rgba(255,255,255,.76)!important;box-shadow:0 12px 28px rgba(20,18,74,.08)!important}
.profile-page .practice-circle-icon{grid-row:1 / 3!important;width:46px!important;height:46px!important;display:grid!important;place-items:center!important;border-radius:14px!important;background:#eeeaff!important;border:1px solid #dcd5ff!important}
.profile-page .practice-circle-icon .profile-new-icon{width:28px!important;height:28px!important}
.profile-page .practice-circle-copy h4{margin:0 0 4px!important;color:#0b1040!important;font-size:17px!important;line-height:1.1!important;font-weight:950!important}
.profile-page .practice-circle-copy p{margin:0!important;color:#19234f!important;font-size:12px!important;line-height:1.25!important;font-weight:800!important}
.profile-page .practice-circle-coming-soon>button{min-height:34px!important;padding:0 18px!important;border:0!important;border-radius:12px!important;background:linear-gradient(180deg,#7057ff,#4f35df)!important;color:#fff!important;font-size:12px!important;font-weight:950!important;cursor:pointer!important}
.profile-page .practice-circle-list{grid-column:2 / 4!important;display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:8px!important}
.profile-page .practice-circle-list b,.profile-page .practice-circle-list span{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:28px!important;padding:0 13px!important;border-radius:999px!important;border:1px solid #d9d2ff!important;background:#eeeaff!important;color:#5135df!important;font-size:11px!important;line-height:1!important;font-weight:900!important}
.profile-page .learning-snapshot-card{padding:18px 22px!important;border-radius:24px!important}
.profile-page .snapshot-metric-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:12px!important}
.profile-page .dash-stat-tile{min-height:62px!important;padding:9px 12px!important;grid-template-columns:34px minmax(0,1fr)!important;column-gap:10px!important;border-radius:13px!important;background:rgba(255,255,255,.04)!important;border-color:rgba(159,175,244,.24)!important}
.profile-page .dash-stat-tile>img{width:32px!important;height:32px!important}
.profile-page .dash-stat-tile span{color:#f6f7ff!important;font-size:10.5px!important;line-height:1.1!important}
.profile-page .dash-stat-tile b{color:#fff!important;font-size:19px!important;line-height:1!important}
.profile-page .snapshot-insight-grid{display:grid!important;grid-template-columns:1.1fr 1.1fr 1.3fr!important;gap:14px!important;margin-top:14px!important}
.profile-page .snapshot-mini-panel{min-height:80px!important;padding:12px 14px!important;border-radius:14px!important;background:rgba(255,255,255,.035)!important;border:1px solid rgba(159,175,244,.22)!important}
.profile-page .snapshot-mini-panel h4{margin:0 0 9px!important;color:#ffe97f!important;font-size:13px!important;line-height:1.15!important;font-weight:950!important}
.profile-page .snapshot-mini-panel p{margin:8px 0 0!important;color:#f6f7ff!important;font-size:12px!important;line-height:1.2!important}
.profile-page .snapshot-health-meter{height:7px!important}
.profile-page .snapshot-set-row{display:grid!important;grid-template-columns:48px 48px minmax(0,1fr)!important;gap:8px!important;align-items:center!important;min-height:18px!important;color:#fff!important;font-size:11px!important}
.profile-page .snapshot-set-row span,.profile-page .snapshot-set-row b{color:#fff!important;font-size:11px!important;line-height:1!important}
.profile-page .snapshot-set-row i{height:7px!important}
.profile-page .snapshot-week-chart{height:48px!important;align-items:end!important}
.profile-page .snapshot-week-bar{gap:5px!important}
.profile-page .snapshot-week-bar i{width:42px!important;min-height:6px!important}
.profile-page .snapshot-week-bar b{color:#fff!important;font-size:11px!important}
.profile-page .profile-approved-bottom-row{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;gap:18px!important;align-items:stretch!important}
@media(max-width:1180px){
  .profile-page .profile-dash-hero,.profile-page .profile-approved-top-row,.profile-page .profile-approved-bottom-row{grid-template-columns:1fr!important}
  .profile-page .profile-dash-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .profile-page .profile-studio-card,.profile-page .profile-community-card{height:auto!important}
  .profile-page .snapshot-metric-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .profile-page .snapshot-insight-grid{grid-template-columns:1fr!important}
}
@media(max-width:720px){
  .profile-page{padding-top:10px!important}
  .profile-page .profile-dash-hero,.profile-page .profile-studio-card,.profile-page .profile-community-card,.profile-page .learning-snapshot-card{padding:16px!important;border-radius:20px!important}
  .profile-page .profile-dash-actions,.profile-page .profile-studio-body,.profile-page .practice-circle-coming-soon{grid-template-columns:1fr!important}
  .profile-page .dash-soft-btn,.profile-page .dash-primary-btn,.profile-page .profile-enter-studio,.profile-page .practice-circle-coming-soon>button{width:100%!important}
  .profile-page .profile-studio-dragon{width:150px!important;height:130px!important;margin:0 auto!important}
  .profile-page .practice-circle-icon{grid-row:auto!important}
  .profile-page .practice-circle-list{grid-column:1!important}
  .profile-page .profile-badge-strip{flex-direction:row!important;align-items:center!important}
  .profile-page .badge-strip-left div{display:none!important}
  .profile-page .snapshot-metric-grid{grid-template-columns:1fr 1fr!important}
  .profile-page .snapshot-week-bar i{width:28px!important}
}
.profile-page .profile-reward-summary-row{display:none!important}

/* Profile header action alignment refinement. */
.profile-page .profile-dash-hero{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  grid-template-rows:auto auto!important;
  align-items:end!important;
  column-gap:24px!important;
  row-gap:12px!important;
  min-height:118px!important;
}

.profile-page .profile-dash-main{
  grid-column:1 / 2!important;
  grid-row:1 / 3!important;
  display:flex!important;
  flex-wrap:wrap!important;
  align-content:end!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
}

.profile-page .profile-dash-main h1{
  flex:0 0 100%!important;
  margin:0 0 2px!important;
}

.profile-page .profile-meta-row,
.profile-page .profile-quick-stats{
  display:contents!important;
}

.profile-page .profile-meta-row span,
.profile-page .profile-quick-stats span,
.profile-page .profile-dash-actions .dash-soft-btn{
  height:38px!important;
  min-height:38px!important;
  border-radius:14px!important;
  display:inline-flex!important;
  align-items:center!important;
}

.profile-page .profile-dash-actions{
  grid-column:2 / 3!important;
  grid-row:2 / 3!important;
  align-self:end!important;
  justify-self:end!important;
  margin-left:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:12px!important;
}

.profile-page .profile-dash-actions .dash-soft-btn{
  width:auto!important;
  min-width:158px!important;
  padding:0 18px!important;
  background:rgba(255,255,255,.065)!important;
  border:1px solid rgba(159,175,244,.34)!important;
}

.profile-page .profile-dash-actions .dash-primary-btn{
  display:none!important;
}

/* Final restore: Home and Level selection screens matching the approved card layouts. */
#homePage.page,
#levelPage.page{
  max-width:1920px!important;
  width:100%!important;
  margin:0 auto!important;
  padding:18px 44px 40px!important;
}

#homePage .hero,
#levelPage .level-hero{
  display:none!important;
}

#homePage .home-product-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:22px!important;
  align-items:stretch!important;
  width:100%!important;
  max-width:1840px!important;
  margin:0 auto!important;
}

#homePage .product-card.exam-card{
  position:relative!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  grid-template-rows:auto 1fr auto!important;
  min-height:520px!important;
  height:auto!important;
  padding:42px 36px 20px!important;
  border-radius:20px!important;
  background:#fff!important;
  border:1px solid rgba(216,213,238,.9)!important;
  box-shadow:0 18px 34px rgba(2,8,38,.18)!important;
  text-align:center!important;
  overflow:hidden!important;
}

#homePage .product-card .mascot-wrap.image-mascot{
  grid-column:1!important;
  grid-row:1!important;
  order:0!important;
  width:154px!important;
  height:154px!important;
  margin:0 auto 22px!important;
  background:transparent!important;
  filter:drop-shadow(0 18px 20px rgba(57,43,158,.18))!important;
}

#homePage .product-card .mascot-wrap.image-mascot:after{
  display:none!important;
}

#homePage .product-card .mascot-wrap.image-mascot img{
  width:142px!important;
  height:142px!important;
  object-fit:contain!important;
}

#homePage .product-card .exam-copy{
  grid-column:1!important;
  grid-row:2!important;
  order:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:100%!important;
  max-width:none!important;
  min-height:0!important;
  height:auto!important;
  text-align:center!important;
}

#homePage .product-card .exam-copy h2{
  width:100%!important;
  margin:0 0 12px!important;
  color:#07113f!important;
  font-size:34px!important;
  line-height:1.08!important;
  font-weight:1000!important;
  letter-spacing:-.3px!important;
  text-align:center!important;
}

#homePage .product-card .exam-copy h2:after{
  content:""!important;
  display:block!important;
  width:100%!important;
  height:1px!important;
  margin:12px auto 0!important;
  background:#e4e1f3!important;
}

#homePage .product-card .exam-copy p{
  max-width:520px!important;
  margin:0 auto 14px!important;
  color:#4d5777!important;
  font-size:16px!important;
  line-height:1.35!important;
  font-weight:600!important;
  text-align:center!important;
}

#homePage .product-card .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:center!important;
  align-items:center!important;
  gap:8px 12px!important;
  margin:0 auto!important;
}

#homePage .product-card .chips span{
  min-width:0!important;
  padding:5px 13px!important;
  border-radius:999px!important;
  border:1.5px solid #d7d0ff!important;
  background:#fbfaff!important;
  color:#654cff!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:900!important;
}

#homePage .product-card.coming-soon-card .chips span{
  border-color:#d8c17b!important;
  color:#8c732a!important;
}

#homePage .product-card .primary-wide{
  grid-column:1!important;
  grid-row:3!important;
  order:0!important;
  position:static!important;
  align-self:end!important;
  justify-self:center!important;
  width:82%!important;
  max-width:470px!important;
  height:60px!important;
  min-height:60px!important;
  margin:22px auto 0!important;
  border-radius:10px!important;
  font-size:23px!important;
  font-weight:950!important;
}

#homePage .product-card .primary-wide.disabled{
  background:#d6d0ec!important;
  color:#777399!important;
  box-shadow:none!important;
  cursor:default!important;
}

#levelPage .level-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:26px!important;
  max-width:1700px!important;
  margin:0 auto 34px!important;
  justify-content:center!important;
}

#levelPage .level-grid.ssat,
#levelPage .level-grid.isee,
#levelPage .level-grid.g212{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}

#levelPage .level-card{
  display:grid!important;
  grid-template-columns:140px minmax(0,1fr)!important;
  grid-template-rows:auto auto auto auto auto!important;
  gap:22px 24px!important;
  min-height:740px!important;
  padding:40px 40px 34px!important;
  border-radius:22px!important;
  background:#fff!important;
  border:1px solid rgba(216,213,238,.9)!important;
  box-shadow:0 18px 34px rgba(2,8,38,.18)!important;
}

#levelPage .level-card .level-icon{
  grid-column:1!important;
  grid-row:1!important;
  width:124px!important;
  height:124px!important;
  border-radius:18px!important;
  background:linear-gradient(180deg,#fbfaff,#f3f0ff)!important;
  border:1px solid #e2dcff!important;
  box-shadow:inset 0 0 0 10px rgba(255,255,255,.75),0 14px 28px rgba(83,65,200,.12)!important;
}

#levelPage .level-card .level-icon img{
  width:90px!important;
  height:90px!important;
  object-fit:contain!important;
}

#levelPage .level-card>div:nth-child(2){
  grid-column:2!important;
  grid-row:1!important;
  align-self:center!important;
}

#levelPage .level-card h3{
  margin:0 0 12px!important;
  color:#07113f!important;
  font-size:38px!important;
  line-height:1.05!important;
  font-weight:1000!important;
  letter-spacing:-.4px!important;
}

#levelPage .level-card p{
  margin:0!important;
  color:#303a5f!important;
  font-size:21px!important;
  line-height:1.2!important;
  font-weight:900!important;
}

#levelPage .level-card .grade{
  display:block!important;
  color:#604cff!important;
  font-size:22px!important;
  line-height:1.1!important;
  font-weight:1000!important;
}

#levelPage .level-card .level-feature{
  grid-column:1 / -1!important;
  grid-row:2!important;
  min-height:112px!important;
  padding:30px 0 0!important;
  border-top:1px solid #e3e0f0!important;
  color:#333d62!important;
  text-align:left!important;
  font-size:18px!important;
  line-height:1.35!important;
  font-weight:850!important;
}

#levelPage .level-count-line{
  grid-column:1 / -1!important;
  grid-row:3!important;
  margin:0!important;
  color:#777b9e!important;
  text-align:center!important;
  font-size:18px!important;
  line-height:1.2!important;
  font-weight:900!important;
}

#levelPage .level-card .pricing-row{
  grid-column:1 / -1!important;
  grid-row:4!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  min-height:166px!important;
  border:1px solid #dedbec!important;
  border-radius:15px!important;
  overflow:hidden!important;
  background:#fff!important;
}

#levelPage .level-card .price-choice{
  display:grid!important;
  grid-template-columns:1fr!important;
  justify-items:center!important;
  align-content:start!important;
  gap:9px!important;
  padding:18px 12px 12px!important;
  border-right:1px solid #dedbec!important;
  text-align:center!important;
  cursor:pointer!important;
}

#levelPage .level-card .price-choice:last-child{
  border-right:0!important;
}

#levelPage .level-card .radio{
  display:block!important;
  width:22px!important;
  height:22px!important;
  margin:0 auto 4px!important;
  border:2px solid #a5aec9!important;
  border-radius:50%!important;
}

#levelPage .level-card .radio.on{
  border:7px solid #6250ef!important;
}

#levelPage .level-card .yearly-price-copy{
  display:grid!important;
  justify-items:center!important;
  gap:6px!important;
  width:100%!important;
}

#levelPage .level-card .price-choice b{
  display:block!important;
  margin:0!important;
  color:#07113f!important;
  font-size:20px!important;
  line-height:1.05!important;
  font-weight:1000!important;
}

#levelPage .level-card .price-choice small{
  display:block!important;
  margin:0!important;
  color:#4d5777!important;
  font-size:16px!important;
  line-height:1.1!important;
  font-weight:800!important;
}

#levelPage .level-card .tag{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  margin:4px auto 0!important;
  padding:5px 13px!important;
  border-radius:999px!important;
  background:#f5d66c!important;
  color:#07113f!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:1000!important;
}

#levelPage .level-card .start{
  grid-column:1 / -1!important;
  grid-row:5!important;
  align-self:end!important;
  width:100%!important;
  min-height:82px!important;
  height:82px!important;
  margin-top:30px!important;
  border-radius:14px!important;
  font-size:28px!important;
  font-weight:1000!important;
}

#levelPage .full-access-unlocks{
  display:block!important;
  max-width:1700px!important;
  margin:0 auto!important;
  padding:34px 36px!important;
  border-radius:22px!important;
  background:#fff!important;
  border:1px solid rgba(216,213,238,.9)!important;
  box-shadow:0 18px 34px rgba(2,8,38,.18)!important;
}

#levelPage .full-access-unlocks[aria-hidden="true"],
#levelPage .full-access-unlocks.hidden{
  display:block!important;
  visibility:visible!important;
}

#levelPage .full-access-unlocks h2{
  margin:0 0 26px!important;
  color:#07113f!important;
  text-align:center!important;
  font-size:34px!important;
  line-height:1.1!important;
  font-weight:1000!important;
}

#levelPage .unlock-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
}

#levelPage .unlock-grid article{
  min-height:92px!important;
  padding:20px 18px!important;
  border-radius:16px!important;
  border:1px solid #e5e1f2!important;
  background:#fbfaff!important;
  text-align:center!important;
}

#levelPage .unlock-grid b{
  display:block!important;
  color:#07113f!important;
  font-size:17px!important;
  line-height:1.1!important;
  font-weight:1000!important;
}

#levelPage .unlock-grid span{
  display:block!important;
  margin-top:8px!important;
  color:#4d5777!important;
  font-size:13px!important;
  line-height:1.3!important;
  font-weight:700!important;
}

@media(max-width:1280px){
  #homePage .home-product-grid,
  #levelPage .level-grid,
  #levelPage .level-grid.ssat,
  #levelPage .level-grid.isee,
  #levelPage .level-grid.g212{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #levelPage .unlock-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:760px){
  #homePage.page,
  #levelPage.page{
    padding:16px!important;
  }
  #homePage .home-product-grid,
  #levelPage .level-grid,
  #levelPage .level-grid.ssat,
  #levelPage .level-grid.isee,
  #levelPage .level-grid.g212{
    grid-template-columns:1fr!important;
  }
  #homePage .product-card.exam-card{
    min-height:0!important;
    padding:28px 20px 20px!important;
  }
  #homePage .product-card .exam-copy h2{
    font-size:30px!important;
  }
  #homePage .product-card .primary-wide{
    width:100%!important;
  }
  #levelPage .level-card{
    grid-template-columns:1fr!important;
    min-height:0!important;
    padding:28px 22px!important;
    text-align:center!important;
  }
  #levelPage .level-card .level-icon,
  #levelPage .level-card>div:nth-child(2){
    grid-column:1!important;
    justify-self:center!important;
  }
  #levelPage .level-card .level-feature{
    text-align:center!important;
  }
  #levelPage .level-card .pricing-row{
    grid-template-columns:1fr!important;
  }
  #levelPage .level-card .price-choice{
    border-right:0!important;
    border-bottom:1px solid #dedbec!important;
    min-height:78px!important;
  }
  #levelPage .level-card .price-choice:last-child{
    border-bottom:0!important;
  }
  #levelPage .unlock-grid{
    grid-template-columns:1fr!important;
  }
}

/* Final hatch label refinement: match the tiny muted Practice text. */
.ds-dashboard .ds-hatch .ds-day b,
.ds-dashboard .ds-hatch .ds-day.done b,
.ds-dashboard .ds-hatch .ds-day.current b,
.ds-dashboard .ds-hatch .ds-day.hatch b{
  color:rgba(74,84,154,.62)!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:850!important;
  text-shadow:none!important;
  letter-spacing:0!important;
}

/* My Dragon footer: 3 equal sections with mood/feed and avatar actions. */
.ds-dashboard .my-dragon-card .my-dragon-footer{
  width:calc(100% - 72px)!important;
  max-width:720px!important;
  min-height:74px!important;
  margin:0 auto 14px!important;
  display:grid!important;
  grid-template-columns:1fr 1fr 1fr!important;
  align-items:stretch!important;
  gap:0!important;
  overflow:hidden!important;
  border-radius:24px!important;
  border:1px solid rgba(176,165,255,.32)!important;
  background:rgba(8,12,48,.42)!important;
  backdrop-filter:blur(4px)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 10px 24px rgba(4,5,22,.18)!important;
}
.ds-dashboard .my-dragon-card .dragon-footer-item{
  min-width:0!important;
  min-height:74px!important;
  height:auto!important;
  padding:10px 14px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:relative!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#f4f3ff!important;
  font-size:15px!important;
  line-height:1.1!important;
  font-weight:850!important;
  text-align:center!important;
}
.ds-dashboard .my-dragon-card .dragon-footer-item + .dragon-footer-item{
  border-left:1px solid rgba(176,165,255,.24)!important;
}
.ds-dashboard .my-dragon-card .dragon-mood-slot.is-sad{
  cursor:pointer!important;
}
.ds-dashboard .my-dragon-card .dragon-mood-display,
.ds-dashboard .my-dragon-card .dragon-dob-slot>span{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  min-width:0!important;
  color:#f4f3ff!important;
  font:inherit!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.ds-dashboard .my-dragon-card .dragon-dob-slot b{
  color:#b8b5ff!important;
  font:inherit!important;
}
.ds-dashboard .my-dragon-card .dragon-mood-text,
.ds-dashboard .my-dragon-card .dragon-dob-slot span,
.ds-dashboard .my-dragon-card .switch-avatar-btn span{
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
  color:inherit!important;
  font:inherit!important;
  text-shadow:0 1px 8px rgba(0,0,0,.18)!important;
  white-space:nowrap!important;
}
.ds-dashboard .my-dragon-card .dragon-mood-icon{
  width:24px!important;
  height:24px!important;
  flex:0 0 24px!important;
  display:inline-grid!important;
  place-items:center!important;
  border-radius:999px!important;
  background:rgba(123,111,255,.28)!important;
  font-size:16px!important;
  line-height:1!important;
}
.ds-dashboard .my-dragon-card .dragon-mood-hover{
  position:absolute!important;
  inset:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#ffd86a!important;
  background:rgba(74,57,168,.34)!important;
  font-size:15px!important;
  line-height:1!important;
  font-weight:900!important;
  opacity:0!important;
  pointer-events:none!important;
  transition:opacity .18s ease!important;
}
.ds-dashboard .my-dragon-card .dragon-mood-slot.is-sad:hover .dragon-mood-hover,
.ds-dashboard .my-dragon-card .dragon-mood-slot.is-sad:focus-visible .dragon-mood-hover{
  opacity:1!important;
}
.ds-dashboard .my-dragon-card .switch-avatar-btn{
  min-width:0!important;
  width:auto!important;
  max-width:100%!important;
  height:40px!important;
  min-height:40px!important;
  padding:0 14px!important;
  border-radius:16px!important;
  border:1px solid rgba(186,177,255,.34)!important;
  background:linear-gradient(135deg,rgba(132,110,255,.86),rgba(91,70,222,.86))!important;
  color:#fff!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:850!important;
  box-shadow:0 8px 18px rgba(83,62,210,.22),inset 0 1px 0 rgba(255,255,255,.12)!important;
  cursor:pointer!important;
}
.ds-dashboard .my-dragon-card .switch-avatar-btn img{
  width:16px!important;
  height:16px!important;
}
.my-dragon-feed-menu p{
  margin:0 0 14px!important;
  color:#3f486b!important;
  font-weight:800!important;
  text-align:center!important;
}
.my-dragon-feed-grid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}
.my-dragon-feed-grid .feed-option{
  min-height:118px!important;
  padding:12px!important;
  border:1px solid #ded8ff!important;
  border-radius:14px!important;
  background:#fff!important;
  color:#071044!important;
  display:grid!important;
  justify-items:center!important;
  gap:6px!important;
  font-weight:900!important;
}
.my-dragon-feed-grid .feed-option>img{
  width:54px!important;
  height:54px!important;
  object-fit:contain!important;
}
.my-dragon-feed-grid .feed-option b{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  font-size:13px!important;
}
.my-dragon-feed-grid .feed-option b img{
  width:15px!important;
  height:15px!important;
}
@media(max-width:760px){
  .ds-dashboard .my-dragon-card .my-dragon-footer{
    width:calc(100% - 20px)!important;
    min-height:68px!important;
    border-radius:20px!important;
  }
  .ds-dashboard .my-dragon-card .dragon-footer-item{
    min-height:68px!important;
    padding:10px 8px!important;
    font-size:12px!important;
  }
  .ds-dashboard .my-dragon-card .dragon-mood-icon{
    width:16px!important;
    height:20px!important;
    flex-basis:20px!important;
    font-size:15px!important;
  }
  .ds-dashboard .my-dragon-card .switch-avatar-btn{
    min-width:0!important;
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    padding:0 8px!important;
    font-size:11px!important;
  }
}

/* Final My Dragon footer cleanup: remove legacy dark pill boxes inside the bar. */
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:min(700px,calc(100% - 76px))!important;
  min-height:70px!important;
  margin:0 auto 16px!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:1fr 1fr 1fr!important;
  align-items:stretch!important;
  overflow:hidden!important;
  border-radius:24px!important;
  border:1px solid rgba(190,181,255,.34)!important;
  background:rgba(18,20,62,.24)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .meta-pill,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  min-width:0!important;
  width:100%!important;
  min-height:70px!important;
  height:70px!important;
  padding:0 12px!important;
  margin:0!important;
  border-radius:0!important;
  border-top:0!important;
  border-right:0!important;
  border-bottom:0!important;
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  outline:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  color:#f2f1ff!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:820!important;
  text-align:center!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item + .dragon-footer-item{
  border-left:1px solid rgba(190,181,255,.26)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer span,
body .ds-dashboard .my-dragon-card .my-dragon-footer b,
body .ds-dashboard .my-dragon-card .my-dragon-footer img,
body .ds-dashboard .my-dragon-card .my-dragon-footer .ds-ui-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .ui-inline-icon{
  background:transparent!important;
  background-color:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  border:0!important;
  outline:0!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  flex:0 0 22px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  background:rgba(122,113,255,.22)!important;
  font-size:14px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn span{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#f2f1ff!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:820!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b{
  color:#c9c3ff!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:820!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  width:auto!important;
  min-width:136px!important;
  max-width:100%!important;
  height:38px!important;
  min-height:38px!important;
  padding:0 12px!important;
  margin:0!important;
  border-radius:14px!important;
  border:1px solid rgba(203,194,255,.36)!important;
  background:rgba(112,91,237,.72)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 7px 16px rgba(30,24,100,.18)!important;
  font-size:14px!important;
  line-height:1!important;
  font-weight:820!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
  width:15px!important;
  height:15px!important;
}
@media(max-width:760px){
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:calc(100% - 28px)!important;
    min-height:62px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .meta-pill,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
    height:62px!important;
    min-height:62px!important;
    padding:0 6px!important;
    font-size:11px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn span{
    font-size:11px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
    min-width:0!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 8px!important;
    font-size:11px!important;
  }
}

/* My Dragon footer width refinement: extend bar so labels fit cleanly. */
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:calc(100% - 34px)!important;
  max-width:none!important;
  grid-template-columns:.72fr 1.05fr 1.38fr!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  padding-left:18px!important;
  padding-right:18px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  max-width:248px!important;
  padding-left:18px!important;
  padding-right:18px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
  overflow:visible!important;
  text-overflow:clip!important;
}
@media(max-width:760px){
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:calc(100% - 14px)!important;
    grid-template-columns:.72fr 1.02fr 1.42fr!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
    padding-left:7px!important;
    padding-right:7px!important;
  }
}

/* My Dragon control bar final reference match. */
body .ds-dashboard .my-dragon-card .my-dragon-name{
  margin:24px auto 0!important;
  position:relative!important;
  z-index:2!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:calc(100% - 42px)!important;
  max-width:none!important;
  height:104px!important;
  min-height:104px!important;
  margin:34px auto 28px!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  align-items:stretch!important;
  border-radius:30px!important;
  border:2px solid rgba(183,157,255,.58)!important;
  background:linear-gradient(180deg,rgba(38,25,91,.66),rgba(8,10,42,.84))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 18px 34px rgba(5,4,26,.3),0 0 24px rgba(142,103,255,.14)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
  height:104px!important;
  min-height:104px!important;
  padding:16px 20px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex-direction:column!important;
  gap:10px!important;
  background:transparent!important;
  box-shadow:none!important;
  border-radius:0!important;
  font-size:17px!important;
  line-height:1.05!important;
  font-weight:850!important;
  color:#fff!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item + .dragon-footer-item{
  border-left:1px solid rgba(214,196,255,.42)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  flex:0 0 44px!important;
  font-size:26px!important;
  border-radius:999px!important;
  background:radial-gradient(circle at 50% 42%,rgba(255,224,112,.98),rgba(235,139,84,.92))!important;
  box-shadow:0 0 0 6px rgba(128,91,235,.22),0 0 20px rgba(152,104,255,.28)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
  width:38px!important;
  height:38px!important;
  flex:0 0 38px!important;
  filter:drop-shadow(0 0 9px rgba(150,120,255,.38))!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
  font-size:17px!important;
  line-height:1.05!important;
  font-weight:850!important;
  color:#fff!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  padding:16px 28px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  width:100%!important;
  max-width:300px!important;
  height:72px!important;
  min-height:72px!important;
  padding:0 24px!important;
  margin:0 auto!important;
  display:inline-flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  border-radius:22px!important;
  border:2px solid rgba(208,196,255,.56)!important;
  background:linear-gradient(180deg,rgba(135,111,255,.98),rgba(82,62,194,.98))!important;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.18),0 12px 24px rgba(24,16,90,.3)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
  width:22px!important;
  height:22px!important;
  flex:0 0 22px!important;
}
@media(max-width:760px){
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:calc(100% - 22px)!important;
    height:80px!important;
    min-height:80px!important;
    margin:24px auto 18px!important;
    border-radius:22px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
    height:80px!important;
    min-height:80px!important;
    padding:10px 7px!important;
    gap:6px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
    font-size:11px!important;
    font-weight:750!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    flex-basis:28px!important;
    font-size:17px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
    width:25px!important;
    height:25px!important;
    flex-basis:25px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
    padding:10px 8px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
    height:52px!important;
    min-height:52px!important;
    padding:0 8px!important;
    gap:6px!important;
    border-radius:16px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
    width:15px!important;
    height:15px!important;
    flex-basis:15px!important;
  }
}

/* My Dragon edge-to-edge compact footer placement. */
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:calc(100% - 72px)!important;
  max-width:none!important;
  min-height:58px!important;
  height:58px!important;
  margin:42px auto 28px!important;
  grid-template-columns:.82fr 1fr 1.08fr!important;
  border-radius:22px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
  min-height:58px!important;
  height:58px!important;
  padding:5px 12px!important;
  gap:3px!important;
  font-size:11px!important;
  font-weight:560!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display{
  gap:3px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
  font-size:11px!important;
  line-height:1.05!important;
  font-weight:560!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
  width:22px!important;
  height:22px!important;
  min-width:22px!important;
  flex-basis:22px!important;
  font-size:14px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
  width:18px!important;
  height:18px!important;
  flex-basis:18px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  padding:7px 12px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  max-width:180px!important;
  height:38px!important;
  min-height:38px!important;
  padding:0 10px!important;
  gap:6px!important;
  border-radius:14px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
  width:13px!important;
  height:13px!important;
  flex-basis:13px!important;
}
@media(max-width:760px){
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:calc(100% - 20px)!important;
    min-height:54px!important;
    height:54px!important;
    margin:32px auto 18px!important;
    grid-template-columns:.78fr 1fr 1.14fr!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
    min-height:54px!important;
    height:54px!important;
    padding:4px 5px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
    font-size:9.5px!important;
    font-weight:520!important;
  }
}

/* My Dragon final target layout: lower, wider, vertical icon labels. */
body .ds-dashboard .my-dragon-card .my-dragon-name{
  margin:18px auto 0!important;
  line-height:1!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:min(86%,840px)!important;
  max-width:840px!important;
  min-height:104px!important;
  height:auto!important;
  margin:30px auto 24px!important;
  padding:0!important;
  display:grid!important;
  grid-template-columns:1fr 1fr 1.16fr!important;
  align-items:stretch!important;
  justify-content:center!important;
  gap:0!important;
  overflow:hidden!important;
  border-radius:30px!important;
  border:2px solid rgba(177,143,255,.54)!important;
  background:linear-gradient(180deg,rgba(31,21,82,.52),rgba(8,10,42,.68))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 16px 36px rgba(6,4,28,.28),0 0 22px rgba(137,96,255,.14)!important;
  backdrop-filter:blur(5px)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
  min-width:0!important;
  width:100%!important;
  min-height:104px!important;
  height:auto!important;
  padding:14px 24px!important;
  margin:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  position:relative!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  outline:0!important;
  color:#f5f2ff!important;
  font-size:18px!important;
  line-height:1.05!important;
  font-weight:900!important;
  text-align:center!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item + .dragon-footer-item{
  border-left:1px solid rgba(214,196,255,.38)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot{
  flex-direction:column!important;
  gap:9px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  min-width:0!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
  width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
  object-fit:contain!important;
  filter:drop-shadow(0 0 8px rgba(150,120,255,.36))!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  flex:0 0 46px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  background:radial-gradient(circle at 50% 42%,rgba(255,223,110,.95),rgba(234,133,82,.9))!important;
  box-shadow:0 0 0 5px rgba(129,87,235,.26),0 0 22px rgba(152,104,255,.34)!important;
  font-size:27px!important;
  line-height:1!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#f5f2ff!important;
  font-size:18px!important;
  line-height:1.05!important;
  font-weight:900!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b{
  color:#f5f2ff!important;
  font-size:18px!important;
  line-height:1.05!important;
  font-weight:900!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  padding:18px 28px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  width:100%!important;
  max-width:270px!important;
  min-width:0!important;
  height:70px!important;
  min-height:70px!important;
  padding:0 22px!important;
  margin:0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:12px!important;
  border-radius:18px!important;
  border:2px solid rgba(207,196,255,.52)!important;
  background:linear-gradient(180deg,rgba(135,111,255,.92),rgba(80,61,191,.92))!important;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.16),0 12px 24px rgba(24,16,90,.28)!important;
  color:#fff!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
  width:22px!important;
  height:22px!important;
  flex:0 0 22px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
  color:#fff!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:900!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
@media(max-width:760px){
  body .ds-dashboard .my-dragon-card .my-dragon-name{
    margin-top:14px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:calc(100% - 28px)!important;
    min-height:78px!important;
    margin:20px auto 18px!important;
    border-radius:22px!important;
    grid-template-columns:1fr 1fr 1.18fr!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
    min-height:78px!important;
    padding:10px 8px!important;
    font-size:12px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    flex-basis:30px!important;
    font-size:18px!important;
    box-shadow:0 0 0 3px rgba(129,87,235,.22)!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
    width:24px!important;
    height:24px!important;
    flex-basis:24px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b{
    font-size:12px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
    padding:12px 10px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
    height:48px!important;
    min-height:48px!important;
    padding:0 10px!important;
    border-radius:14px!important;
    gap:7px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
    font-size:12px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
    width:16px!important;
    height:16px!important;
    flex-basis:16px!important;
  }
}

/* My Dragon compact footer: match Instant Hatch button scale. */
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:min(68%,620px)!important;
  max-width:620px!important;
  min-height:64px!important;
  height:64px!important;
  margin:28px auto 24px!important;
  grid-template-columns:.9fr 1.18fr 1.28fr!important;
  border-radius:22px!important;
  border:2px solid rgba(178,148,255,.54)!important;
  background:linear-gradient(180deg,rgba(41,28,104,.54),rgba(13,14,54,.72))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 12px 26px rgba(6,4,28,.22)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
  min-height:64px!important;
  height:64px!important;
  padding:7px 14px!important;
  gap:4px!important;
  font-size:13px!important;
  line-height:1.05!important;
  font-weight:650!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot{
  gap:4px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display{
  gap:4px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
  width:26px!important;
  height:26px!important;
  min-width:26px!important;
  flex-basis:26px!important;
  font-size:16px!important;
  box-shadow:0 0 0 3px rgba(129,87,235,.2),0 0 12px rgba(152,104,255,.18)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
  width:22px!important;
  height:22px!important;
  flex-basis:22px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b{
  font-size:13px!important;
  line-height:1.05!important;
  font-weight:650!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  padding:8px 14px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  width:100%!important;
  max-width:190px!important;
  height:44px!important;
  min-height:44px!important;
  padding:0 12px!important;
  gap:7px!important;
  border-radius:16px!important;
  font-size:13px!important;
  font-weight:650!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
  font-size:13px!important;
  font-weight:650!important;
  white-space:nowrap!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
  width:15px!important;
  height:15px!important;
  flex-basis:15px!important;
}
@media(max-width:760px){
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:calc(100% - 44px)!important;
    min-height:58px!important;
    height:58px!important;
    margin:18px auto 18px!important;
    border-radius:18px!important;
    grid-template-columns:.85fr 1.2fr 1.35fr!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
    min-height:58px!important;
    height:58px!important;
    padding:6px 7px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
    font-size:10.5px!important;
    font-weight:600!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    flex-basis:22px!important;
    font-size:14px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
    height:38px!important;
    min-height:38px!important;
    padding:0 7px!important;
    gap:5px!important;
  }
}

/* My Dragon footer edge span fix: make the three boxes reach the card edges. */
body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar,
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:100%!important;
  max-width:none!important;
  min-height:104px!important;
  height:104px!important;
  margin:32px auto 24px!important;
  grid-template-columns:1fr 1fr 1.22fr!important;
  border-radius:30px!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
  min-height:104px!important;
  height:104px!important;
  padding:14px 24px!important;
  gap:10px!important;
  font-size:18px!important;
  line-height:1.05!important;
  font-weight:900!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-slot,
body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot{
  flex-direction:column!important;
  gap:10px!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display{
  flex-direction:column!important;
  gap:10px!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
  width:46px!important;
  height:46px!important;
  min-width:46px!important;
  flex-basis:46px!important;
  font-size:27px!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
  width:34px!important;
  height:34px!important;
  flex-basis:34px!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span,
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
  font-size:18px!important;
  line-height:1.05!important;
  font-weight:900!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  padding:18px 28px!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button,
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  width:100%!important;
  max-width:300px!important;
  height:70px!important;
  min-height:70px!important;
  padding:0 22px!important;
  gap:12px!important;
  border-radius:22px!important;
  font-size:18px!important;
  font-weight:900!important;
}

body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img,
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
  width:22px!important;
  height:22px!important;
  flex-basis:22px!important;
}

@media(max-width:760px){
  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar,
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:100%!important;
    min-height:80px!important;
    height:80px!important;
    margin:20px auto 18px!important;
    grid-template-columns:1fr 1fr 1.18fr!important;
    border-radius:22px!important;
  }

  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
    min-height:80px!important;
    height:80px!important;
    padding:10px 8px!important;
    gap:6px!important;
  }

  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
    font-size:12px!important;
  }

  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    flex-basis:30px!important;
    font-size:18px!important;
  }

  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
    padding:12px 10px!important;
  }

  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
    max-width:240px!important;
    height:48px!important;
    min-height:48px!important;
    padding:0 10px!important;
    gap:7px!important;
    border-radius:16px!important;
  }

  body.dragon-studio-mode .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
    width:16px!important;
    height:16px!important;
    flex-basis:16px!important;
  }
}

/* My Dragon footer final placement override: wide and below the name. */
body .ds-dashboard .my-dragon-card>.card-inner{
  padding-bottom:34px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-name{
  margin:22px auto 0!important;
  padding:0 20px!important;
  position:relative!important;
  z-index:2!important;
  line-height:1!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:calc(100% - 56px)!important;
  max-width:none!important;
  min-height:56px!important;
  height:56px!important;
  margin:54px auto 0!important;
  padding:0!important;
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:.8fr 1fr 1.08fr!important;
  border-radius:22px!important;
  overflow:hidden!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
  min-height:56px!important;
  height:56px!important;
  padding:4px 10px!important;
  font-size:10px!important;
  font-weight:520!important;
  line-height:1.05!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display{
  gap:3px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
  font-size:10px!important;
  font-weight:520!important;
  line-height:1.05!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
  width:16px!important;
  height:20px!important;
  min-width:16px!important;
  flex-basis:20px!important;
  font-size:13px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
  width:17px!important;
  height:17px!important;
  flex-basis:17px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  padding:6px 12px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  max-width:170px!important;
  height:36px!important;
  min-height:36px!important;
  padding:0 9px!important;
  gap:5px!important;
  border-radius:14px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
  width:12px!important;
  height:12px!important;
  flex-basis:12px!important;
}
@media(max-width:760px){
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:calc(100% - 18px)!important;
    margin-top:44px!important;
  }
}

/* My Dragon footer polish: unified type and balanced spacing. */
body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
  width:calc(100% - 92px)!important;
  min-height:68px!important;
  height:68px!important;
  margin:30px auto 0!important;
  grid-template-columns:.9fr 1.18fr 1.2fr!important;
  border-radius:24px!important;
  border-color:rgba(186,159,255,.58)!important;
  background:linear-gradient(180deg,rgba(36,24,88,.62),rgba(10,11,42,.76))!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 14px 28px rgba(6,4,28,.24),0 0 18px rgba(142,103,255,.12)!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
  min-height:68px!important;
  height:68px!important;
  padding:7px 14px!important;
  gap:5px!important;
  font-size:12px!important;
  font-weight:650!important;
  line-height:1.08!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-display{
  gap:5px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
  font-size:12px!important;
  font-weight:650!important;
  line-height:1.08!important;
  letter-spacing:0!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-emoji,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-icon{
  width:26px!important;
  height:26px!important;
  min-width:26px!important;
  flex-basis:26px!important;
  font-size:16px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot .ds-ui-icon,
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot img{
  width:22px!important;
  height:22px!important;
  flex-basis:22px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-avatar-slot{
  padding:9px 18px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button{
  max-width:210px!important;
  height:44px!important;
  min-height:44px!important;
  padding:0 15px!important;
  gap:7px!important;
  border-radius:16px!important;
}
body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button img{
  width:14px!important;
  height:14px!important;
  flex-basis:14px!important;
}
@media(max-width:760px){
  body .ds-dashboard .my-dragon-card .my-dragon-footer.my-dragon-meta-bar{
    width:calc(100% - 24px)!important;
    height:60px!important;
    min-height:60px!important;
    margin-top:24px!important;
    border-radius:20px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-footer-item{
    height:60px!important;
    min-height:60px!important;
    padding:5px 6px!important;
  }
  body .ds-dashboard .my-dragon-card .my-dragon-footer .mood-label,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-mood-text,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot span,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .dragon-dob-slot b,
  body .ds-dashboard .my-dragon-card .my-dragon-footer .switch-avatar-btn.change-avatar-button span{
    font-size:10px!important;
    font-weight:600!important;
  }
}

/* HatchElite Cart page */
.cart-header-btn{position:relative;min-height:38px;padding:0 13px;border:1px solid rgba(112,89,255,.22);border-radius:999px;background:linear-gradient(180deg,#ffffff,#f3f0ff);color:#071044;font-weight:950;cursor:pointer;box-shadow:0 8px 18px rgba(82,64,160,.10)}
.cart-count-badge{position:absolute;top:-7px;right:-6px;display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#5b47e9;color:#fff;font-size:11px;line-height:1}.cart-page{max-width:none!important;min-height:calc(100vh - 90px);padding:34px clamp(16px,4vw,56px)!important;background:radial-gradient(circle at 18% 8%,rgba(116,91,255,.30),transparent 30%),radial-gradient(circle at 88% 12%,rgba(78,196,255,.20),transparent 34%),linear-gradient(135deg,#071044 0%,#130b3c 48%,#23105c 100%);color:#fff}.cart-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;max-width:1180px;margin:0 auto 24px}.cart-eyebrow{display:inline-flex;align-items:center;min-height:28px;padding:0 12px;border:1px solid rgba(173,202,255,.28);border-radius:999px;background:rgba(255,255,255,.10);color:#dbeafe;font-size:12px;font-weight:950}.cart-hero h1{margin:10px 0 8px;font-size:44px;line-height:1;color:#fff}.cart-hero p{max-width:640px;margin:0;color:#d8ddff;font-size:16px;line-height:1.5;font-weight:700}.cart-hero button,.cart-empty-card button,.cart-promo-row button,.cart-checkout-btn{border:0;border-radius:14px;background:linear-gradient(180deg,#7f67ff,#5636dc);color:#fff;font-weight:950;cursor:pointer;box-shadow:0 16px 32px rgba(80,62,210,.28)}.cart-hero button{min-height:44px;padding:0 18px}.cart-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;max-width:1180px;margin:0 auto}.cart-left-column{display:grid;gap:18px}.cart-panel,.cart-summary-panel,.cart-success-banner{border:1px solid rgba(180,197,255,.22);border-radius:18px;background:rgba(255,255,255,.10);box-shadow:0 24px 64px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.13);backdrop-filter:blur(14px)}.cart-panel{padding:20px}.cart-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.cart-panel h2,.cart-summary-panel h2{margin:0;color:#fff;font-size:22px}.cart-panel-head button,.cart-item-card button{border:1px solid rgba(219,228,255,.24);background:rgba(255,255,255,.08);color:#eaf0ff;border-radius:999px;font-weight:900;cursor:pointer}.cart-panel-head button{min-height:32px;padding:0 12px}.cart-items-list{display:grid;gap:12px}.cart-item-card{display:grid;grid-template-columns:54px minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:14px;border:1px solid rgba(219,228,255,.18);border-radius:14px;background:rgba(9,13,47,.46)}.cart-item-icon{display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:linear-gradient(180deg,rgba(124,104,255,.32),rgba(71,187,255,.18))}.cart-item-icon img{width:30px;height:30px;object-fit:contain}.cart-item-card h3{margin:0 0 4px;color:#fff;font-size:17px}.cart-item-card p{margin:0;color:#cfd7ff;font-size:13px;line-height:1.35;font-weight:700}.cart-item-card em{display:inline-flex;margin-top:7px;padding:4px 9px;border-radius:999px;background:rgba(255,211,104,.18);color:#ffe6a7;font-size:11px;font-style:normal;font-weight:950}.cart-item-card strong{color:#fff;font-size:17px;white-space:nowrap}.cart-item-card button{min-height:30px;padding:0 11px}.cart-empty-card{padding:22px;border:1px dashed rgba(219,228,255,.28);border-radius:16px;text-align:center;background:rgba(255,255,255,.06)}.cart-empty-card h3{margin:0 0 8px;color:#fff}.cart-empty-card p{margin:0 0 14px;color:#cfd7ff}.cart-empty-card button{min-height:38px;padding:0 16px}.cart-promo-panel p{margin:8px 0 14px;color:#cfd7ff;font-weight:700}.cart-promo-row{display:grid;grid-template-columns:minmax(0,1fr) 110px;gap:10px}.cart-promo-row input{height:44px;border:1px solid rgba(219,228,255,.26);border-radius:12px;background:rgba(255,255,255,.92);padding:0 13px;color:#071044;font-weight:900;text-transform:uppercase}.cart-promo-row button{min-height:44px}.cart-promo-success,.cart-promo-error,.cart-success-banner{margin-top:12px;padding:11px 13px;border-radius:12px;font-weight:900;line-height:1.35}.cart-promo-success,.cart-success-banner{background:rgba(50,210,133,.16);color:#c8ffe3;border:1px solid rgba(84,234,158,.26)}.cart-promo-error{background:rgba(255,93,129,.16);color:#ffd3dd;border:1px solid rgba(255,122,151,.26)}.cart-benefits-panel ul{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:16px 0 0;padding:0}.cart-benefits-panel li{display:flex;align-items:center;gap:10px;min-height:44px;padding:10px;border:1px solid rgba(219,228,255,.16);border-radius:12px;background:rgba(255,255,255,.07);color:#edf2ff;font-weight:900}.cart-benefits-panel img{width:24px;height:24px}.cart-summary-panel{position:sticky;top:24px;align-self:start;padding:22px}.cart-summary-line,.cart-summary-total{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-bottom:1px solid rgba(219,228,255,.18);color:#dbe4ff;font-weight:850}.cart-summary-line.discount b{color:#9effcd}.cart-summary-total{border-bottom:0;color:#fff;font-size:22px;font-weight:1000}.cart-summary-note{margin:8px 0 0;color:#c8ffe3;font-weight:900;line-height:1.35}.cart-checkout-btn{width:100%;min-height:50px;margin-top:16px;font-size:17px}.cart-checkout-btn:disabled{opacity:.5;cursor:not-allowed}.cart-security-note{margin:12px 0 0;color:#c7cff7;font-size:12px;line-height:1.45;font-weight:750}@media(max-width:900px){.cart-layout{grid-template-columns:1fr}.cart-summary-panel{position:static}.cart-hero{align-items:flex-start;flex-direction:column}.cart-hero h1{font-size:36px}.cart-benefits-panel ul{grid-template-columns:1fr}}@media(max-width:560px){.cart-page{padding:22px 12px!important}.cart-item-card{grid-template-columns:44px minmax(0,1fr);align-items:start}.cart-item-icon{width:44px;height:44px}.cart-item-card strong,.cart-item-card button{grid-column:2}.cart-promo-row{grid-template-columns:1fr}.cart-header-btn{padding:0 10px;font-size:13px}}
/* Cart header visibility fix: runtime headers render this button, so keep it visible in every header mode. */
.topbar .cart-header-btn,
.header-actions .cart-header-btn,
.study-actions .cart-header-btn{
  position:relative!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  gap:6px!important;
  min-width:74px!important;
  height:38px!important;
  min-height:38px!important;
  padding:0 14px!important;
  border:1px solid rgba(112,89,255,.22)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,#6f5bff,#5238d8)!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:950!important;
  line-height:1!important;
  white-space:nowrap!important;
  opacity:1!important;
  visibility:visible!important;
  overflow:visible!important;
  cursor:pointer!important;
  box-shadow:0 10px 22px rgba(82,64,160,.18)!important;
  z-index:3!important;
}
.topbar .cart-header-btn .cart-label{
  display:inline-flex!important;
  align-items:center!important;
  gap:5px!important;
  color:inherit!important;
  white-space:nowrap!important;
}
.topbar .cart-count-badge{
  position:absolute!important;
  top:-7px!important;
  right:-6px!important;
  display:grid!important;
  place-items:center!important;
  min-width:19px!important;
  height:19px!important;
  padding:0 5px!important;
  border:2px solid #fff!important;
  border-radius:999px!important;
  background:#ff4f8b!important;
  color:#fff!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:950!important;
}
.topbar .cart-count-badge.hidden{
  display:none!important;
}
.public-header-actions{
  display:flex!important;
  align-items:center!important;
}
.app-header-mobile-menu .cart-mobile-link{
  color:#6547f5!important;
  font-weight:950!important;
}
@media(max-width:720px){
  .header-actions .cart-header-btn,
  .study-actions .cart-header-btn{
    min-width:58px!important;
    padding:0 10px!important;
    font-size:12px!important;
  }
}

/* Standardized public/app header system. */
.topbar.public-header,
.topbar.app-header{
  height:76px!important;
  min-height:76px!important;
  padding:0 clamp(28px,5vw,92px)!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:24px!important;
  background:#fff!important;
  border-bottom:4px solid #10144f!important;
  box-shadow:none!important;
  position:sticky!important;
  top:0!important;
  z-index:80!important;
}
.topbar.public-header .hatch-brand,
.topbar.app-header .app-header-logo{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex:0 0 auto!important;
  min-width:0!important;
  max-width:none!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  cursor:pointer!important;
  overflow:visible!important;
}
.topbar.public-header .hatch-logo-img,
.topbar.app-header .app-header-logo img{
  width:clamp(190px,15vw,260px)!important;
  height:64px!important;
  object-fit:contain!important;
  display:block!important;
}
.topbar.public-header .main-nav,
.topbar.app-header .app-nav{
  margin-left:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:clamp(22px,3vw,46px)!important;
  flex:0 1 auto!important;
}
.topbar.public-header .main-nav button,
.topbar.app-header .app-nav-link{
  height:76px!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  padding:0!important;
  border:0!important;
  border-bottom:4px solid transparent!important;
  border-radius:0!important;
  background:transparent!important;
  color:#10144f!important;
  font-size:16px!important;
  font-weight:900!important;
  white-space:nowrap!important;
  cursor:pointer!important;
  box-shadow:none!important;
}
.topbar.public-header .main-nav button.active,
.topbar.app-header .app-nav-link.active{
  color:#6547f5!important;
  border-bottom-color:#6547f5!important;
}
.topbar.public-header .main-nav button.active:after{
  content:none!important;
}
.topbar.public-header .main-nav .login-link{
  color:#6547f5!important;
}
.topbar.public-header .header-center,
.topbar.public-header .study-actions,
.topbar.public-header .public-header-actions,
.topbar.app-header .student-switcher-wrap,
.topbar.app-header .header-level-pill{
  display:none!important;
}
.topbar.app-header .app-nav{
  margin-left:clamp(28px,4vw,72px)!important;
  margin-right:auto!important;
  justify-content:center!important;
  flex:1 1 auto!important;
}
.topbar.app-header .header-actions{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  flex:0 0 auto!important;
}
.topbar.app-header .header-status-pill{
  height:38px!important;
  min-height:38px!important;
  padding:0 16px!important;
  border:1px solid rgba(112,89,255,.22)!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#10144f!important;
  font-size:14px!important;
  font-weight:950!important;
  box-shadow:0 8px 18px rgba(82,64,160,.08)!important;
}
.topbar.app-header .header-avatar{
  width:46px!important;
  height:46px!important;
}
@media(max-width:980px){
  .topbar.public-header,
  .topbar.app-header{
    height:auto!important;
    min-height:76px!important;
    padding:10px 18px!important;
  }
  .topbar.public-header{
    flex-wrap:wrap!important;
  }
  .topbar.public-header .main-nav{
    width:100%!important;
    justify-content:center!important;
    gap:18px!important;
  }
  .topbar.app-header .app-nav{
    display:none!important;
  }
  .topbar.app-header .mobile-menu-button{
    display:flex!important;
  }
  .topbar.app-header .header-status-pill{
    display:none!important;
  }
}
@media(max-width:560px){
  .topbar.public-header .hatch-logo-img,
  .topbar.app-header .app-header-logo img{
    width:180px!important;
    height:54px!important;
  }
  .topbar.public-header .main-nav button{
    font-size:13px!important;
  }
  .topbar.app-header .header-actions{
    gap:8px!important;
  }
}


/* Study Setting popup compact Cloudflare handoff */
body.range-popover-open::after{
  content:""!important;
  display:block!important;
  position:fixed!important;
  inset:0!important;
  z-index:80!important;
  background:
    radial-gradient(circle at 18% 22%,rgba(116,91,255,.20),transparent 28%),
    rgba(3,9,34,.72)!important;
  backdrop-filter:blur(5px)!important;
}
.study-page .study-range-shell .set-menu,
.study-page .study-quick-row .set-menu,
.study-page .quick-panel .set-menu{
  position:fixed!important;
  inset:50% auto auto 50%!important;
  transform:translate(-50%,-50%)!important;
  width:min(940px,calc(100vw - 40px))!important;
  max-width:940px!important;
  max-height:88vh!important;
  overflow:hidden!important;
  border:1px solid rgba(157,149,255,.34)!important;
  border-radius:24px!important;
  background:linear-gradient(145deg,rgba(21,28,74,.98),rgba(7,14,42,.98))!important;
  box-shadow:0 28px 90px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.study-page .study-range-shell .set-menu::before,
.study-page .study-quick-row .set-menu::before,
.study-page .quick-panel .set-menu::before{display:none!important}
.range-popover-panel.study-setting-modal{
  display:flex!important;
  flex-direction:column!important;
  gap:14px!important;
  width:100%!important;
  max-height:88vh!important;
  padding:24px 28px!important;
  overflow:hidden!important;
  color:#fff!important;
}
.range-popover-header{
  display:flex!important;
  align-items:center!important;
  gap:14px!important;
  margin:0 0 2px!important;
  padding-right:58px!important;
}
.study-setting-head-icon{
  width:52px!important;
  height:52px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 52px!important;
  border:1px solid rgba(164,153,255,.28)!important;
  border-radius:50%!important;
  background:rgba(124,92,255,.14)!important;
}
.study-setting-head-icon img{width:26px!important;height:26px!important;object-fit:contain!important}
.range-popover-header h3{
  margin:0!important;
  color:#fff!important;
  font-size:30px!important;
  line-height:1.08!important;
  font-weight:950!important;
}
.range-popover-header p{
  margin:4px 0 0!important;
  color:#c8cdfb!important;
  font-size:15px!important;
  font-weight:650!important;
}
.range-close{
  position:absolute!important;
  top:26px!important;
  right:28px!important;
  width:42px!important;
  height:42px!important;
  border:1px solid rgba(178,185,235,.28)!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.06)!important;
  color:#fff!important;
  font-size:26px!important;
}
.range-close::before{content:none!important;display:none!important}
.setting-filter-section{display:grid!important;gap:0!important}
.setting-filter-section>.setting-section-label{display:none!important}
.range-type-buttons{
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  gap:10px!important;
  margin:0!important;
}
.range-type-btn{
  min-height:42px!important;
  padding:8px 12px!important;
  border:1px solid rgba(160,170,220,.25)!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.045)!important;
  color:#f3f3ff!important;
  font-size:14px!important;
  font-weight:850!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  white-space:nowrap!important;
}
.range-type-btn.active{
  border-color:rgba(188,177,255,.82)!important;
  background:linear-gradient(135deg,#8a6cff,#5b3ff0)!important;
  color:#fff!important;
  box-shadow:0 12px 26px rgba(95,69,232,.24)!important;
}
.range-type-icon img,.setting-filter-icon{width:18px!important;height:18px!important;object-fit:contain!important}
.range-filter-helper{display:none!important}
.study-range-section{
  display:grid!important;
  gap:10px!important;
  padding:14px!important;
  border:1px solid rgba(160,170,220,.23)!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.035)!important;
}
.study-range-section>b{
  color:#fff1a8!important;
  font-size:15px!important;
  line-height:1!important;
  font-weight:900!important;
}
.study-range-buttons{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
}
.study-range-btn{
  min-height:46px!important;
  border:1px solid rgba(160,170,220,.28)!important;
  border-radius:14px!important;
  background:rgba(5,11,38,.42)!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:900!important;
}
.study-range-btn.active{
  border-color:rgba(188,177,255,.82)!important;
  background:linear-gradient(135deg,#8a6cff,#5b3ff0)!important;
  color:#fff!important;
}
.range-current-card{
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr) auto!important;
  grid-template-areas:"icon title pct" "icon detail pct" "icon bar bar"!important;
  align-items:center!important;
  gap:5px 16px!important;
  min-height:94px!important;
  padding:16px 20px!important;
  border:1px solid rgba(160,170,220,.24)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.045)!important;
}
.range-current-card::before{
  content:""!important;
  grid-area:icon!important;
  width:54px!important;
  height:54px!important;
  border-radius:16px!important;
  background:rgba(20,26,72,.92) url("assets/assets_webp/icons/universal/icon_word_list.svg") center/26px 26px no-repeat!important;
}
.range-current-card>div{grid-area:title!important;min-width:0!important}
.range-current-card b{
  color:#fff!important;
  font-size:24px!important;
  line-height:1.08!important;
  font-weight:950!important;
}
.range-current-card span{display:none!important}
.range-current-card strong{
  grid-area:pct!important;
  color:#b79cff!important;
  font-size:26px!important;
  font-weight:950!important;
}
.range-current-card small{
  grid-area:detail!important;
  color:#d6d7ff!important;
  font-size:15px!important;
  font-weight:650!important;
}
.range-current-card .set-progress-bar{
  grid-area:bar!important;
  height:8px!important;
  margin-top:4px!important;
  border-radius:999px!important;
  background:rgba(117,123,175,.26)!important;
}
.range-current-card .set-progress-bar i{background:linear-gradient(90deg,#9d70ff,#5f86ff)!important}
.range-selection-note{grid-column:1/-1!important;margin:2px 0 0!important;color:#c8cdfb!important;font-size:12px!important}
.range-jump-section{
  display:flex!important;
  flex-direction:column!important;
  min-height:230px!important;
  flex:1 1 260px!important;
  overflow:hidden!important;
}
.jump-to-set-header{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin:0 4px 10px!important;
}
.jump-to-set-header>b{
  color:#fff!important;
  font-size:17px!important;
  font-weight:950!important;
}
.range-access-note{
  color:#d9dcff!important;
  font-size:13px!important;
  font-weight:650!important;
}
.range-access-note.is-paid{color:#bff3cf!important}
.range-jump-list,.selected-set-list{
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  max-height:none!important;
  min-height:220px!important;
  overflow-y:auto!important;
  padding-right:4px!important;
}
.range-option,.selected-set-row{
  width:100%!important;
  min-height:48px!important;
  padding:9px 14px!important;
  border:1px solid rgba(160,170,220,.18)!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.045)!important;
  color:#f5f6ff!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  text-align:left!important;
}
.range-option i,.selected-set-row .set-checkbox{
  width:28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#a891ff!important;
}
.jump-set-title,.set-row-copy b{
  flex:1 1 auto!important;
  color:#f5f6ff!important;
  font-size:15px!important;
  font-weight:850!important;
}
.set-row-copy{display:grid!important;gap:2px!important;flex:1 1 auto!important}
.set-row-copy small{color:#b8bddf!important;font-size:13px!important;font-weight:650!important}
.range-option.selected,.range-option.is-selected,.selected-set-row.is-selected{
  border-color:rgba(181,164,255,.8)!important;
  background:linear-gradient(135deg,rgba(124,92,255,.66),rgba(91,54,240,.44))!important;
  box-shadow:inset 5px 0 0 #9b7cff!important;
}
.range-option.is-locked,.selected-set-row.is-locked{
  opacity:.68!important;
  cursor:pointer!important;
}
.jump-set-lock-badge{
  color:#bfc5e6!important;
  font-size:12px!important;
  font-weight:850!important;
  padding:5px 10px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.065)!important;
}
.jump-set-lock-icon{color:#bfc5e6!important;font-size:18px!important}
.set-row-check{
  width:30px!important;
  height:30px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:50%!important;
  background:rgba(166,143,255,.95)!important;
}
.selected-set-panel{
  display:flex!important;
  flex-direction:column!important;
  gap:8px!important;
  max-height:285px!important;
  overflow:hidden!important;
}
.selected-set-toolbar{display:flex!important;gap:8px!important;flex-wrap:wrap!important}
.selected-set-toolbar button{
  min-height:34px!important;
  padding:0 12px!important;
  border:1px solid rgba(160,170,220,.24)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.055)!important;
  color:#f5f6ff!important;
  font-size:12px!important;
  font-weight:850!important;
}
.selected-set-summary{margin:0!important;color:#c8cdfb!important;font-size:13px!important}
.range-actions{
  flex:0 0 auto!important;
  display:flex!important;
  justify-content:space-between!important;
  gap:16px!important;
  margin-top:0!important;
  padding-top:14px!important;
  border-top:1px solid rgba(160,170,220,.22)!important;
}
.range-actions button{
  min-width:150px!important;
  min-height:46px!important;
  border-radius:14px!important;
  padding:0 28px!important;
  font-size:15px!important;
  font-weight:900!important;
}
.range-cancel{
  border:1px solid rgba(160,170,220,.34)!important;
  background:rgba(255,255,255,.055)!important;
  color:#fff!important;
}
.range-apply{
  border:0!important;
  background:linear-gradient(135deg,#8a6cff,#5b3ff0)!important;
  color:#fff!important;
}
.range-apply:disabled{opacity:.55!important;cursor:not-allowed!important}
@media(max-width:760px){
  .study-page .study-range-shell .set-menu,
  .study-page .study-quick-row .set-menu,
  .study-page .quick-panel .set-menu{
    inset:50% auto auto 50%!important;
    transform:translate(-50%,-50%)!important;
    width:calc(100vw - 24px)!important;
    max-height:92vh!important;
    border-radius:22px!important;
  }
  .range-popover-panel.study-setting-modal{padding:18px!important;gap:12px!important;max-height:92vh!important}
  .range-popover-header{gap:10px!important;padding-right:48px!important}
  .study-setting-head-icon{width:44px!important;height:44px!important;flex-basis:44px!important}
  .range-popover-header h3{font-size:24px!important}
  .range-popover-header p{font-size:13px!important}
  .range-close{top:18px!important;right:18px!important;width:38px!important;height:38px!important}
  .range-type-buttons{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .range-type-btn{font-size:13px!important;min-height:40px!important}
  .study-range-buttons{grid-template-columns:1fr!important}
  .range-current-card{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:"title pct" "detail pct" "bar bar"!important;
    min-height:82px!important;
    padding:14px!important;
  }
  .range-current-card::before{display:none!important}
  .range-current-card b{font-size:20px!important}
  .range-current-card strong{font-size:22px!important}
  .range-current-card small{font-size:13px!important}
  .range-jump-section{min-height:220px!important}
  .range-jump-list,.selected-set-list{min-height:210px!important}
  .jump-to-set-header{align-items:flex-start!important;flex-direction:column!important;gap:4px!important}
  .range-actions button{min-width:0!important;flex:1 1 0!important;padding:0 16px!important}
}
/* Study Setting close/locked-badge final fix */
.range-close{
  width:42px!important;
  height:42px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:26px!important;
  line-height:1!important;
  font-weight:900!important;
  text-transform:none!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
}
.range-close::before,
.range-close::after{
  content:none!important;
  display:none!important;
}
.jump-set-row,
.range-option.jump-set-row,
.selected-set-row.jump-set-row{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
}
.jump-set-title,
.jump-set-row .set-row-copy,
.jump-set-row .set-row-copy b{
  flex:1 1 auto!important;
  min-width:0!important;
}
.jump-set-lock-badge,
.locked-badge,
.set-lock-badge{
  flex:0 0 auto!important;
  min-width:72px!important;
  width:auto!important;
  max-width:none!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  padding:5px 12px!important;
  border-radius:999px!important;
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:850!important;
  text-align:center!important;
}
.jump-set-lock-icon{
  flex:0 0 auto!important;
  min-width:16px!important;
  width:16px!important;
  text-align:center!important;
  overflow:visible!important;
}
/* Study Setting Locked badge anti-truncation override */
.study-setting-modal .range-jump-list .range-option.jump-set-row .jump-set-lock-badge,
.study-setting-modal .selected-set-list .selected-set-row.jump-set-row .jump-set-lock-badge,
.study-setting-modal .jump-set-row .jump-set-lock-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 104px!important;
  min-width:104px!important;
  width:104px!important;
  max-width:none!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  padding:5px 12px!important;
  box-sizing:border-box!important;
}
.study-setting-modal .jump-set-row .jump-set-title{
  min-width:0!important;
  flex:1 1 auto!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* Study Setting combined Locked badge final override */
.study-setting-modal .jump-set-row .jump-set-lock-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  flex:0 0 104px!important;
  min-width:104px!important;
  width:104px!important;
  max-width:none!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.study-setting-modal .jump-set-row .jump-set-lock-badge .jump-set-lock-icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  min-width:16px!important;
  width:16px!important;
  line-height:1!important;
  margin:0!important;
  position:static!important;
}
.study-setting-modal .range-close{
  font-size:26px!important;
}
.study-setting-modal .range-close::before,
.study-setting-modal .range-close::after{
  content:none!important;
  display:none!important;
}

/* Study Setting jump-row visual refinement */
.study-setting-modal .range-jump-section{
  min-height:auto!important;
  flex:0 0 auto!important;
  overflow:visible!important;
}
.study-setting-modal .range-jump-list{
  gap:8px!important;
  min-height:auto!important;
  max-height:none!important;
  overflow:visible!important;
  padding-right:0!important;
}
.study-setting-modal .range-option.jump-set-row{
  position:relative!important;
  display:grid!important;
  grid-template-columns:32px minmax(0,1fr) auto!important;
  align-items:center!important;
  column-gap:14px!important;
  min-height:48px!important;
  padding:9px 14px 9px 32px!important;
  overflow:visible!important;
}
.study-setting-modal .range-option.jump-set-row>i{
  grid-column:1!important;
  width:18px!important;
  height:18px!important;
  margin:0!important;
  position:static!important;
  transform:none!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  z-index:1!important;
}
.study-setting-modal .range-option.jump-set-row .jump-set-title{
  grid-column:2!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.study-setting-modal .range-option.jump-set-row .jump-set-status{
  grid-column:3!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:14px!important;
  min-width:132px!important;
  flex:0 0 auto!important;
  overflow:visible!important;
}
.study-setting-modal .range-option.jump-set-row .jump-set-lock-badge{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 76px!important;
  min-width:76px!important;
  width:76px!important;
  max-width:76px!important;
  padding:6px 13px!important;
  border-radius:999px!important;
  color:#d9dcf4!important;
  background:rgba(255,255,255,.075)!important;
  border:1px solid rgba(180,190,230,.08)!important;
  font-size:12px!important;
  font-weight:850!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.study-setting-modal .range-option.jump-set-row .jump-set-lock-icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 22px!important;
  width:22px!important;
  min-width:22px!important;
  height:22px!important;
  margin:0!important;
  position:static!important;
  transform:none!important;
  color:#b7bfdc!important;
  font-size:17px!important;
  line-height:1!important;
  overflow:visible!important;
}
.study-setting-modal .range-option.jump-set-row .set-row-check{
  grid-column:3!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 30px!important;
  width:30px!important;
  height:30px!important;
  border-radius:50%!important;
  margin-left:auto!important;
  color:#fff!important;
  background:linear-gradient(135deg,#9d85ff,#6f5df5)!important;
  box-shadow:0 8px 18px rgba(87,67,210,.35)!important;
  font-size:18px!important;
  font-weight:950!important;
  line-height:1!important;
}
.study-setting-modal .range-option.jump-set-row .set-row-check img,
.study-setting-modal .range-option.jump-set-row .set-row-check svg{
  display:none!important;
}
.study-setting-modal .range-option.jump-set-row.is-locked{
  opacity:1!important;
  color:#aeb5d0!important;
  background:rgba(255,255,255,.035)!important;
}
.study-setting-modal .range-option.jump-set-row.is-locked .jump-set-title{
  color:#aeb5d0!important;
}