/* iChurch Kids Arcade — playful, accessible, responsive and dependency-free */
:root{--ink:#292a51;--muted:#757c99;--muted2:#9da3b8;--line:#e9eaf5;--purple:#6758ed;--deep:#4b3ec6;--lavender:#f0eeff;--orange:#ffbc59;--mint:#69d5bf;--sky:#eaf9ff;--surface:#fff;--page:#f8f9ff;--shadow:0 16px 45px rgba(52,56,115,.07);--shadow-hover:0 20px 48px rgba(52,56,115,.14);--radius:23px;--font:'Trebuchet MS','Segoe UI',system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--page);color:var(--ink);font:16px/1.5 var(--font);-webkit-font-smoothing:antialiased}
button,input{font:inherit}
button{cursor:pointer}
button:disabled{cursor:default}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #aa92ff;outline-offset:3px}
a{color:inherit;text-decoration:none}
svg{flex-shrink:0}
h1,h2,h3,p{margin-top:0}
h1,h2,h3{line-height:1.16;letter-spacing:-.047em}
h1{font-weight:900}
h2,h3{font-weight:850}
.app-root{min-height:100vh;min-height:100dvh}
.app-loading{display:grid;place-content:center;text-align:center;min-height:90vh;color:var(--purple)}
.loading-sun{font-size:72px;animation:twinkle 2s linear infinite}
.app-loading p{font-weight:800}
.icon-button{display:grid;place-items:center;border:1px solid var(--line);background:#fff;border-radius:14px;width:44px;height:44px;color:#686993;transition:transform .2s,background .2s}
.icon-button:hover{transform:translateY(-2px);background:#f3f0ff}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;border:none;border-radius:16px;font-weight:900;padding:14px 22px;min-height:54px;text-align:center;transition:transform .18s,box-shadow .18s,background .18s;letter-spacing:-.015em}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(1px)}
.btn-primary{background:var(--purple);color:#fff;box-shadow:0 7px 0 #4939c6,0 12px 24px rgba(104,88,237,.19)}
.btn-primary:hover{background:#5a49e8;box-shadow:0 7px 0 #4434bc,0 16px 28px rgba(104,88,237,.22)}
.btn-white{background:#fff;color:#5849cf;box-shadow:0 6px 0 rgba(46,36,145,.22)}
.btn-outline{background:#fff;color:var(--purple);border:2px solid #e1dcff}
.btn-large{font-size:17px;padding:17px 29px}
.btn-small{font-size:14px;min-height:42px;padding:10px 15px;border-radius:12px}
.text-link{display:inline-flex;align-items:center;gap:8px;color:var(--purple);background:transparent;border:0;font-weight:900;padding:0}
.eyebrow,.section-kicker,.topbar-greeting,.sidebar-label,.input-label,.teaser-label{font-size:11px;font-weight:900;letter-spacing:.15em}
.brand{display:inline-flex;align-items:center;gap:12px;white-space:nowrap}
.brand-mark{width:46px;height:46px;display:grid;place-items:center;position:relative;background:var(--purple);border-radius:15px;color:#fff;font-size:29px;transform:rotate(-7deg);box-shadow:0 5px 0 rgba(103,88,237,.2)}
.brand-mark span{position:absolute;font-size:15px;color:#ffda79;right:-4px;top:-4px}
.brand-text{display:flex;flex-direction:column;gap:0;line-height:1.07}
.brand-text strong{font-weight:1000;font-size:20px;letter-spacing:-.06em}
.brand-text em{font-style:normal;color:var(--purple)}
.brand-text small{font-weight:900;letter-spacing:.16em;font-size:8px;color:var(--muted)}
/* WELCOME */
.welcome-wrap{max-width:1450px;min-height:100vh;margin:0 auto;padding:28px clamp(24px,5vw,72px) 20px;display:flex;flex-direction:column;overflow:hidden;position:relative}
.welcome-top,.welcome-footer{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1}
.safe-tag{display:flex;align-items:center;gap:8px;background:#f1fff9;border:1px solid #d6f5e6;color:#34826c;border-radius:100px;padding:8px 15px;font-size:12px;font-weight:800}
.welcome-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,1.04fr);align-items:center;gap:22px;flex:1;padding-top:25px;padding-bottom:20px}
.welcome-left{max-width:620px;position:relative;z-index:2;padding:5px 0 0}
.eyebrow{display:inline-flex;gap:10px;align-items:center;color:var(--purple);background:#efedff;border:1px solid #e3dfff;border-radius:50px;padding:10px 14px;letter-spacing:.07em;font-size:10px;margin-bottom:24px}
.dot-live{width:8px;height:8px;background:#79cda0;border-radius:50%;box-shadow:0 0 0 4px #d6f5e2}
.welcome-left h1{font-size:clamp(44px,5.1vw,75px);line-height:1.075;margin:0 0 17px;letter-spacing:-.065em;max-width:580px}
.rainbow-word{color:var(--purple);position:relative;white-space:nowrap}
.rainbow-word:after{position:absolute;content:'';height:11px;left:4%;right:0;bottom:-8px;background:linear-gradient(90deg,#ffe381,#86e5cb,#bcb1ff);border-radius:50% 50% 38% 55%;transform:rotate(-2deg);opacity:.85;z-index:-1}
.welcome-description{font-size:17px;max-width:510px;line-height:1.7;color:var(--muted);margin-bottom:19px}
.welcome-features{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0 30px}
.welcome-features span{border-radius:100px;padding:8px 12px;border:1px solid #e6e6f0;color:#515579;background:#fff;font-weight:800;font-size:12px}
.entry-card{padding:23px 25px 19px;background:#fff;border:1px solid #efedfa;box-shadow:0 15px 45px rgba(73,65,132,.075);border-radius:24px;max-width:510px}
.entry-header{display:flex;align-items:center;gap:13px;margin-bottom:17px}
.entry-icon{display:grid;place-items:center;width:50px;height:50px;background:#fff3d8;border-radius:16px;font-size:30px}
.entry-header h2{font-size:22px;margin:0 0 3px;font-weight:1000}
.entry-header p{color:var(--muted);font-size:12px;margin:0}
.avatar-options{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:7px;margin-bottom:18px}
.avatar-button{background:#f6f7fc;border:2px solid transparent;border-radius:13px;font-size:23px;min-height:44px;line-height:1;transition:transform .15s,background .2s}
.avatar-button:hover{transform:translateY(-3px)}
.avatar-button.selected{border-color:var(--purple);background:#efedff;box-shadow:0 4px 0 #d5d0fa}
.input-label{display:block;color:#777993;font-size:10px;margin:0 0 8px}
.name-field{height:53px;display:flex;align-items:center;gap:9px;padding:0 15px;background:#fafaff;border:1.5px solid #e4e5f4;border-radius:13px;color:var(--purple)}
.name-field:focus-within{border-color:var(--purple);box-shadow:0 0 0 3px #6758ed19}
.name-field input{background:transparent;border:0;outline:0;width:100%;font-size:16px;font-weight:700;color:var(--ink)}
.name-field input::placeholder{color:#b0b2c5;font-weight:500}
.btn-enter{width:100%;margin:15px 0 10px;font-size:17px}
.privacy-note{font-size:10px;text-align:center;color:#9294a8;margin:3px 0 0}
.welcome-footer{padding:16px 0 8px;color:#9295ac;font-size:11px;font-weight:700}
.heart{color:#fc8495}
.welcome-art{min-height:675px;position:relative;align-self:stretch;max-height:810px}
.hero-aura{position:absolute;width:min(95%,660px);aspect-ratio:1;top:5%;left:1%;border-radius:50%;background:radial-gradient(circle at 50% 50%,#f0dffa 0 25%,#e9e6ff 26% 49%,#f5f0ff 49% 68%,transparent 70%)}
.hero-puff{position:absolute;color:#ffbe5c;z-index:3;text-shadow:0 2px 0 #fff}
.puff1{font-size:42px;top:3%;left:28%;animation:float 3.6s ease-in-out infinite}
.puff2{font-size:46px;right:6%;top:26%;color:#87d5d0;animation:float 4.3s ease-in-out infinite}
.puff3{font-size:34px;left:4%;bottom:24%;color:#a58aff}
.hero-card{position:absolute;box-shadow:0 24px 60px rgba(58,48,126,.17);border:7px solid #fff;overflow:hidden;z-index:2}
.hero-card-math{left:3%;top:18%;width:79%;height:360px;background:linear-gradient(180deg,#dff8ff 0 49%,#d0eed9 50% 70%,#aaaabb 71% 100%);border-radius:35px;transform:rotate(-6deg)}
.hero-card-chip{position:absolute;left:28px;top:24px;background:#fff;padding:7px 13px;border-radius:30px;font-size:12px;font-weight:1000;color:#ea8450}
.hero-card-equation{position:absolute;right:25px;top:48px;font-size:32px;font-weight:1000;color:#4b42be;letter-spacing:-.06em}
.hero-card-equation b{display:inline-block;color:#fff;background:#695ae8;padding:0 10px;border-radius:12px;transform:rotate(7deg)}
.hero-car{position:absolute;left:15%;bottom:45px;width:69%;transform:rotate(-2deg);z-index:2;filter:drop-shadow(0 15px 7px #3838582b)}
.car-svg{width:100%;height:auto;display:block}
.hero-road{position:absolute;left:0;right:0;height:24px;bottom:26px;background:repeating-linear-gradient(90deg,#fff 0 27px,transparent 27px 56px);opacity:.85}
.hero-card-word{right:1%;top:54%;width:40%;height:226px;background:#6757da;color:#fff;border-radius:33px;transform:rotate(8deg);padding:24px;display:flex;flex-direction:column;gap:10px}
.hero-card-word>span{font-size:11px;font-weight:1000;letter-spacing:.14em;color:#d6ceff}
.hero-spell{font-size:37px;font-weight:1000;white-space:nowrap}
.hero-spell i{font-style:normal;display:inline-block;background:#fff;color:#654be2;border-radius:8px;padding:0 8px;transform:rotate(-8deg)}
.hero-rocket{position:absolute;font-size:88px;right:2px;bottom:-5px;transform:rotate(-32deg);filter:drop-shadow(0 10px 10px #231c6529)}
.hero-card-bible{left:3%;bottom:11%;width:51%;height:132px;background:#fefaed;border-radius:30px;transform:rotate(-7deg);display:flex;align-items:center;justify-content:center;gap:5px;flex-direction:column}
.hero-card-bible span{font-size:30px}
.hero-card-bible b{font-size:17px;color:#5b4fd0}
.hero-card-bible small{font-size:11px;color:#9a9b7e;font-weight:800}
.hero-sticker{position:absolute;display:flex;align-items:center;justify-content:center;gap:5px;background:#ffcc72;color:#805b1a;border:4px solid white;border-radius:50%;width:127px;height:127px;font-size:30px;z-index:3;box-shadow:0 15px 20px #4e3d782e;transform:rotate(10deg)}
.hero-sticker span{font-size:11px;font-weight:1000;line-height:1.2}
.sticker-one{right:4%;top:10%}
/* SHELL / NAV */
.shell{display:flex;min-height:100vh;min-height:100dvh}
.sidebar{width:248px;flex:0 0 248px;height:100vh;height:100dvh;position:sticky;top:0;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;padding:28px 17px 18px;z-index:30}
.sidebar-head{display:flex;align-items:center;padding:0 6px;margin-bottom:55px}
.sidebar .brand-mark{width:43px;height:43px}
.sidebar .brand-text strong{font-size:19px}
.sidebar-label{color:#a2a5b9;padding:0 14px;margin-bottom:14px}
.side-nav{display:flex;flex-direction:column;gap:7px}
.nav-link{border:0;display:flex;align-items:center;text-align:left;gap:13px;padding:13px 14px;min-height:51px;border-radius:13px;background:transparent;color:#777994;font-size:14px;font-weight:800}
.nav-link:hover{background:#f6f4ff;color:#5746d2}
.nav-link.nav-active{background:#efedff;color:#5d4fe2}
.nav-link .nav-dot{width:6px;height:6px;margin-left:auto;border-radius:50%;background:var(--purple)}
.sidebar-spacer{flex:1}
.sidebar-motivation{border:1px solid #eee7ff;border-radius:18px;background:linear-gradient(135deg,#f4efff,#f9f9ff);padding:14px 16px 15px;margin-bottom:22px;text-align:center}
.motivation-emoji{font-size:47px;margin:-1px 0 4px}
.sidebar-motivation strong{display:block;font-size:15px}
.sidebar-motivation p{font-size:12px;color:#85809e;margin:5px 0 13px}
.sidebar-motivation span{font-size:10px;font-weight:900;color:#6656df;background:white;border-radius:30px;padding:7px 10px;display:block}
.player-switch{border:1px solid var(--line);background:#fafaff;border-radius:15px;display:flex;align-items:center;gap:9px;padding:10px;min-height:61px;color:#787891;text-align:left}
.switch-avatar{font-size:28px;width:42px;height:42px;background:#eeeafc;border-radius:12px;display:grid;place-items:center}
.switch-details{flex:1;min-width:0;display:flex;flex-direction:column}
.switch-details b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ink)}
.switch-details small{font-size:10px}
.sidebar-credit{text-align:center;color:#a3a3b6;font-size:10px;margin-top:13px}
.main-col{min-width:0;flex:1;display:flex;flex-direction:column}
.app-topbar{min-height:95px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:17px clamp(24px,3.5vw,56px);gap:15px}
.topbar-left{display:flex;gap:15px;align-items:center;min-width:0}
.topbar-greeting{color:#a2a5b8;font-size:10px;margin-bottom:3px}
.topbar-heading{font-size:22px;font-weight:1000;letter-spacing:-.04em;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.topbar-heading span{font-size:22px}
.topbar-right{display:flex;align-items:center;gap:12px;flex-shrink:0}
.topbar-star{display:flex;align-items:center;gap:5px;padding:10px 16px;background:#fffaf0;border:1px solid #ffefd1;border-radius:15px}
.topbar-star>span{font-size:19px}
.topbar-star b{font-size:20px}
.topbar-star small{font-size:9px;font-weight:900;letter-spacing:.08em;color:#a88d59;margin-left:1px}
.topbar-avatar{width:45px;height:45px;background:#f1eeff;border:1px solid #e6e1ff;border-radius:14px;font-size:26px}
.mobile-hamburger,.sidebar-close{display:none}
.main-content{max-width:1520px;width:100%;padding:30px clamp(24px,3.5vw,56px) 42px;margin:0 auto;flex:1}
.inside-footer{display:flex;justify-content:space-between;gap:10px;padding:18px clamp(24px,3.5vw,56px);font-size:11px;color:#a2a4b9}
/* DASHBOARD */
.dash-hero{min-height:306px;border-radius:27px;position:relative;overflow:hidden;background:linear-gradient(110deg,#6c61ea 0%,#8172f5 63%,#9990f6);color:#fff;display:flex;justify-content:space-between;align-items:center;padding:38px 45px}
.dash-hero:after{content:'';position:absolute;right:-90px;bottom:-210px;border:60px solid #ffffff13;width:460px;height:460px;border-radius:50%}
.dash-hero-copy{position:relative;z-index:2;max-width:540px}
.banner-tag{display:inline-flex;align-items:center;gap:8px;color:#fefbf3;background:#ffffff2b;border:1px solid #ffffff38;border-radius:99px;padding:7px 12px;font-size:10px;letter-spacing:.15em;font-weight:900}
.dash-hero h1{font-size:clamp(30px,3.3vw,47px);margin:16px 0 8px;line-height:1.12}
.dash-hero h1 em{font-style:normal;color:#ffe592}
.dash-hero p{font-size:14px;color:#f0eefe;max-width:400px;line-height:1.65;margin-bottom:20px}
.dash-hero .btn{padding:12px 20px;min-height:47px;font-size:13px;border-radius:13px}
.dash-hero-art{position:absolute;right:1%;bottom:-23%;width:40%;height:135%;min-width:280px}
.hero-orbit{border:2px dashed #ffffff47;border-radius:50%;position:absolute}
.orbit1{width:310px;height:310px;top:5%;left:16%;transform:rotate(22deg)}
.orbit2{width:450px;height:450px;top:-15%;left:-3%;border-color:#ffffff26}
.dash-big-star{position:absolute;font-size:142px;left:23%;top:22%;filter:drop-shadow(0 12px 14px #31288730);transform:rotate(-15deg);animation:float 4s ease-in-out infinite}
.dash-mini{position:absolute;z-index:1;background:#ffffffed;border:3px solid #ffffff;padding:7px 11px;border-radius:18px;font-size:38px;box-shadow:0 15px 30px #31288735}
.mini1{right:14%;top:13%;transform:rotate(20deg)}
.mini2{left:2%;top:36%;transform:rotate(-14deg)}
.mini3{right:5%;bottom:22%;transform:rotate(-7deg)}
.dash-star{position:absolute;color:#ffefb8;font-size:43px}
.dash-star.one{right:20%;bottom:10%}
.dash-star.two{left:7%;top:8%}
.stat-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:22px 0 35px}
.mini-stat{background:#fff;display:flex;align-items:center;gap:13px;border:1px solid var(--line);border-radius:18px;padding:17px 15px;box-shadow:0 6px 20px #52528007}
.mini-stat-emoji{width:49px;height:49px;display:grid;place-items:center;background:#f6f4ff;border-radius:15px;font-size:26px;flex-shrink:0}
.mini-stat:nth-child(1) .mini-stat-emoji{background:#fff8df}
.mini-stat:nth-child(2) .mini-stat-emoji{background:#eaf9ff}
.mini-stat:nth-child(3) .mini-stat-emoji{background:#e8fbf4}
.mini-stat:nth-child(4) .mini-stat-emoji{background:#fff0f0}
.mini-stat>span:last-child{display:flex;flex-direction:column;gap:0;min-width:0}
.mini-stat strong{font-size:24px;line-height:1.15;font-weight:1000}
.mini-stat small{font-size:11px;color:#9898af;font-weight:700;white-space:nowrap}
.section-heading{display:flex;justify-content:space-between;gap:12px;align-items:end;margin:5px 0 19px}
.section-kicker{color:#9488df;font-size:10px;margin-bottom:8px}
.section-heading h2{font-size:clamp(21px,2.2vw,28px);margin:0;letter-spacing:-.05em}
.section-heading h2 span{font-size:.8em}
.section-note{font-size:12px;color:#999ab2;font-weight:700;padding-bottom:4px}
.game-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}
.game-card{min-width:0;display:flex;flex-direction:column;border:1px solid var(--line);box-shadow:0 8px 25px #3d427c09;background:#fff;padding:0;border-radius:23px;overflow:hidden;text-align:left;transition:transform .2s,box-shadow .2s,border .2s;color:inherit}
.game-card:hover{transform:translateY(-7px);box-shadow:var(--shadow-hover);border-color:#dcd7ff}
.game-card-top{height:1px;position:relative;z-index:1}
.game-tag{position:absolute;top:17px;left:17px;color:#4e3ec1;background:#ffffffd9;border:1px solid #ffffff9c;padding:7px 11px;border-radius:50px;font-size:9px;font-weight:1000;letter-spacing:.12em}
.game-card-arrow{position:absolute;right:17px;top:14px;background:#ffffffcb;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#5549ce;transform:rotate(-35deg)}
.game-art{height:172px;overflow:hidden;position:relative}
.game-math .game-art{background:linear-gradient(#dff5fc 0 57%,#b2dca8 58% 72%,#8583a4 73%)}
.game-math .game-art:before{content:'☁️';font-size:42px;position:absolute;left:35%;top:35px;opacity:.8}
.game-card-road{position:absolute;bottom:12px;left:0;right:0;border-bottom:6px dashed #fff6e4;height:50px}
.card-car{width:52%;position:absolute;left:20%;top:-55px;transform:rotate(-3deg);filter:drop-shadow(0 14px 6px #28285824)}
.game-words .game-art{background:radial-gradient(circle at 45% 30%,#7866ed,#3c337f 115%)}
.game-words .game-art:before{content:'✦';position:absolute;color:#ffeea2;font-size:60px;top:22px;left:22%}
.game-words .game-art:after{content:'✧';position:absolute;color:#fff;font-size:34px;right:22%;bottom:20px}
.card-rocket{height:155px;width:90px;position:absolute;bottom:-15px;left:calc(50% - 45px);transform:rotate(25deg)}
.card-rocket .rocket-svg{height:155px;width:auto}
.word-stars{color:#fff;position:absolute;right:22px;top:48px;font-size:24px;letter-spacing:10px}
.game-bible .game-art{background:linear-gradient(170deg,#adead2,#c0f2dc 56%,#f6e7b8 57%)}
.game-bible .game-art:before{content:'☀️';position:absolute;left:19%;top:22px;font-size:38px}
.card-island{position:absolute;top:50px;right:14%;font-size:105px;transform:rotate(8deg)}
.card-chest{position:absolute;bottom:9px;left:19%;font-size:60px}
.game-card-body{padding:18px 20px 20px;position:relative;display:flex;flex-direction:column;flex:1}
.game-emoji{font-size:25px;margin-bottom:7px}
.game-card-body h3{font-size:21px;margin:0 0 8px}
.game-card-body p{color:var(--muted);font-size:13px;line-height:1.6;margin-bottom:20px;min-height:42px}
.game-card-foot{border-top:1px solid #f0eff7;display:flex;justify-content:space-between;align-items:center;gap:7px;padding-top:15px;margin-top:auto}
.game-card-foot span{display:flex;align-items:center;gap:4px;font-size:10px;color:#9b98ae;font-weight:800}
.game-card-foot b{font-size:10px;color:var(--purple);display:flex;align-items:center;gap:5px;white-space:nowrap}
.bottom-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;margin-top:25px}
.journey-teaser,.parents-note{display:flex;gap:18px;align-items:center;border-radius:20px;padding:25px 24px}
.journey-teaser{background:#f1efff;border:1px solid #e5e0ff}
.teaser-art{font-size:59px;align-self:flex-start;line-height:1.3}
.teaser-label{color:#8070ce}
.journey-teaser h3{font-size:19px;margin:5px 0 4px}
.journey-teaser p{font-size:12px;color:#8a85ac;line-height:1.6;margin:0 0 12px}
.parents-note{background:#fff;border:1px solid #f3e6d3;align-items:flex-start}
.note-shine{font-size:32px}
.parents-note h3{font-size:18px;margin:0 0 6px}
.parents-note p{font-size:12px;color:var(--muted);line-height:1.75;margin:0}
/* SETUP */
.setup-container,.play-wrap,.journey-page,.leaders-page,.result-wrap{max-width:1200px;margin:0 auto}
.back-link{display:inline-flex;align-items:center;gap:4px;border:0;background:transparent;color:#7f7a9f;font-weight:800;font-size:13px;padding:0 0 15px}
.back-link:hover{color:var(--purple)}
.setup-hero{min-height:238px;display:flex;align-items:center;justify-content:space-between;gap:20px;position:relative;overflow:hidden;border-radius:26px;padding:32px 40px;color:#fff}
.setup-math{background:linear-gradient(110deg,#fbad49,#f2c572)}
.setup-words{background:linear-gradient(110deg,#6350ce,#9784f4)}
.setup-bible{background:linear-gradient(110deg,#44bfa9,#85d9bb)}
.setup-hero:before{content:'';position:absolute;border:4px dashed #ffffff5c;border-radius:50%;width:330px;height:330px;right:-55px;top:-95px}
.setup-hero>div:first-child{position:relative;z-index:1;max-width:660px}
.pill-soft{display:inline-block;color:inherit;background:#ffffff35;border:1px solid #ffffff43;border-radius:100px;padding:7px 14px;font-size:10px;font-weight:900;letter-spacing:.12em}
.setup-hero h1{font-size:40px;margin:12px 0 9px}
.setup-hero p{font-size:14px;line-height:1.7;max-width:550px;margin:0 0 14px;color:#fffef6}
.setup-facts{display:flex;gap:16px;flex-wrap:wrap;color:#fff;font-size:11px;font-weight:800}
.setup-hero-emoji{font-size:135px;transform:rotate(12deg);position:relative;z-index:1;filter:drop-shadow(0 15px 20px #45317e33);line-height:1}
.setup-level-header{text-align:center;margin:37px 0 23px}
.setup-level-header h2{font-size:30px;margin:0 0 8px}
.setup-level-header p{font-size:13px;color:var(--muted);margin:0}
.level-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.level-grid-words{grid-template-columns:repeat(5,minmax(0,1fr))}
.level-choice{position:relative;display:flex;align-items:center;flex-direction:column;justify-content:center;gap:7px;min-height:171px;padding:18px 12px;background:#fff;border:2px solid #eceaf7;border-radius:20px;color:var(--ink);transition:border .2s,transform .2s,background .2s;box-shadow:0 5px 15px #4642790b}
.level-choice:hover{transform:translateY(-3px);border-color:#b9acff}
.level-choice.level-active{border-color:var(--purple);background:#f8f6ff;box-shadow:0 10px 22px #7f6eff1a}
.level-emoji{font-size:45px}
.level-choice strong{font-size:16px;line-height:1.2}
.level-choice small{color:#9c9bb3;font-size:11px;text-align:center}
.level-check{position:absolute;top:11px;right:11px;background:#d8d5e7;color:white;width:20px;height:20px;border-radius:50%;display:grid;place-items:center}
.level-active .level-check{background:var(--purple)}
.setup-start{margin:33px auto;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:19px}
.setup-encourage{color:#928caa;font-size:12px;display:flex;gap:7px;font-weight:800;align-items:center}
/* GAMEPLAY */
.play-breadcrumb{display:flex;justify-content:space-between;align-items:center;margin:-3px 0 6px;gap:10px}
.play-breadcrumb>span{font-size:11px;font-weight:800;color:#9798b3}
.play-breadcrumb b{color:#c7c7da;margin:0 6px}
.game-hud{background:#fff;border:1px solid var(--line);border-radius:18px;padding:15px 19px;margin-bottom:18px;display:flex;align-items:center;gap:24px;justify-content:space-between}
.hud-left{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.hud-avatar{width:45px;height:45px;border-radius:14px;background:#f4edff;display:grid;place-items:center;font-size:28px}
.hud-left>div{display:flex;flex-direction:column}
.hud-left strong{font-size:14px}
.hud-left small{font-size:10px;color:#a3a5ba}
.hud-progress{width:min(39%,370px);min-width:130px}
.hud-progress-top{display:flex;justify-content:space-between;gap:4px;margin:0 0 7px;font-size:10px;font-weight:900;color:#a09fb2;letter-spacing:.05em}
.hud-progress-top strong{color:var(--purple)}
.progress-track{background:#eeeff9;border-radius:40px;height:11px;overflow:hidden}
.progress-fill{background:linear-gradient(90deg,#92e5cb,#7b6ff2);border-radius:40px;height:100%;transition:width .45s ease}
.hud-scores{display:flex;gap:18px}
.hud-scores>span{display:flex;align-items:center;gap:4px;font-size:18px}
.hud-scores b{font-size:19px}
.hud-scores small{font-size:10px;color:#9a9bac;margin-left:1px}
.play-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.03fr);gap:20px;align-items:start}
.scene-column{min-width:0}
.race-scene,.rocket-scene,.treasure-scene{height:354px;border-radius:23px;overflow:hidden;position:relative;border:1px solid #ecebfa;box-shadow:0 10px 25px #34327808}
.race-scene{background:#e0f3fa}
.race-scene-head{position:absolute;top:17px;left:19px;right:18px;display:flex;justify-content:space-between;align-items:center;z-index:3;gap:5px}
.race-scene-head span{font-size:9px;letter-spacing:.08em;color:#4c6895;font-weight:1000;background:#ffffffb5;padding:8px;border-radius:20px}
.race-scene-head b{font-size:10px;color:#6c61df;background:#fff8e2;padding:7px 10px;border-radius:20px;white-space:nowrap}
.race-sky{height:42%;position:relative;overflow:hidden;background:linear-gradient(0deg,#bde9f2,#e4f8ff)}
.race-cloud{position:absolute;top:30%;font-size:44px;opacity:.87;animation:drift 15s linear infinite}
.cloud-a{left:18%}
.cloud-b{left:72%;top:12%;font-size:32px;animation-duration:25s}
.race-sun{font-size:37px;position:absolute;left:60%;top:13%}
.race-hill{position:absolute;width:65%;height:95px;border-radius:70% 70% 0 0;background:#95d6b0;bottom:-45px}
.hill-a{left:-10%}
.hill-b{right:-20%;background:#78c9a6;bottom:-55px}
.race-track{height:48%;background:#6e7697;position:relative;border-top:8px solid #b9b2a7;border-bottom:8px solid #c5bdb1;overflow:hidden}
.race-track:after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:#e7e3c9}
.track-divider{position:absolute;top:50%;left:0;right:0;height:5px;background:repeating-linear-gradient(90deg,#e8e8f6 0 30px,transparent 30px 65px);opacity:.8;animation:road 2s linear infinite}
.track-finish{position:absolute;right:4%;top:0;bottom:0;width:13px;background-color:#fff;background-image:conic-gradient(#34354c 25%,#fff 0 50%,#34354c 0 75%,#fff 0);background-size:14px 14px;opacity:.78}
.race-lane-label{position:absolute;left:14px;z-index:1;color:#d9dcff;font-size:9px;letter-spacing:.16em;font-weight:900}
.lane-label-one{top:6px}
.lane-label-two{top:53%}
.racer{position:absolute;width:126px;z-index:2;transition:left .65s cubic-bezier(.25,.9,.3,1.1);filter:drop-shadow(0 8px 4px #27284042)}
.racer-you{top:1%;transform:scale(.82)}
.racer-rival{top:50%;transform:scale(.82)}
.racer.car-boost:after{content:'💨';font-size:23px;position:absolute;right:94%;top:22%;animation:zoom .6s ease}
.scene-bottom-caption{height:10%;padding:10px;text-align:center;color:#5c6b8d;font-size:11px;font-weight:800;background:#f9fbff}
.rocket-scene{background:#46419b}
.rocket-sky{height:90%;position:relative;overflow:hidden;background:radial-gradient(circle at 78% 16%,#8173c1,#423a87 72%,#302969)}
.scene-twinkle{position:absolute;color:#f9e8a7;font-size:28px;animation:twinkle 3s infinite}
.twinkle1{left:18%;top:16%}.twinkle2{right:16%;top:35%;animation-delay:.4s}.twinkle3{left:43%;top:48%;font-size:17px;animation-delay:.9s}.twinkle4{right:35%;top:4%;font-size:17px;animation-delay:1.5s}
.scene-planet{position:absolute;right:13%;top:11%;font-size:68px;opacity:.93}
.rocket-earth{position:absolute;bottom:-106px;left:-10%;right:-10%;height:159px;border-radius:50% 50% 0 0;background:linear-gradient(#63ccca,#347eab);border-top:10px solid #85e7df}
.rocket-trail{width:12px;border-radius:100px;position:absolute;left:calc(30% + 40px);bottom:14%;background:linear-gradient(0deg,#ffaa80,#fff3b1,transparent);opacity:.3;transition:height .65s}
.rocket-fly{position:absolute;width:94px;height:164px;left:28%;z-index:2;transform:rotate(22deg);transition:bottom .7s ease;filter:drop-shadow(0 14px 12px #19145569)}
.rocket-svg{width:100%;height:100%;display:block}
.rocket-fire{transform-origin:center 170px;animation:burn .35s ease-in-out infinite alternate}
.rocket-mission{position:absolute;top:15px;left:15px;background:#ffffff25;border:1px solid #ffffff40;border-radius:14px;padding:10px 14px;color:#d8d2ff;display:flex;flex-direction:column;font-size:9px;font-weight:900;letter-spacing:.08em}
.rocket-mission strong{font-size:23px;color:#fff;line-height:1.45}
.rocket-mission small{font-size:9px;color:#d8d2ff;letter-spacing:normal}
.rocket-scene>.scene-bottom-caption{background:#faf9ff;color:#7970b2}
.treasure-scene{background:linear-gradient(#b9f0e2 0 60%,#f2e2ae 60%);height:354px}
.treasure-scene:before{content:'';position:absolute;left:-26%;right:-20%;bottom:-52px;height:175px;background:#e4cd85;border-radius:60% 40% 0 0}
.treasure-flag{position:absolute;z-index:2;top:16px;left:17px;background:#fff8dd;border-radius:30px;padding:7px 11px;font-size:10px;font-weight:900;color:#99703d}
.treasure-sun{position:absolute;right:14%;top:16px;font-size:53px}
.treasure-cloud{position:absolute;top:77px;left:34%;font-size:44px}
.treasure-palm{position:absolute;bottom:34px;right:10%;font-size:93px;transform:rotate(14deg);z-index:1}
.treasure-route{position:absolute;top:73px;bottom:15px;left:4%;right:3%;z-index:1}
.treasure-route svg{width:100%;height:100%}
.treasure-start{position:absolute;bottom:46px;left:15px;font-size:10px;font-weight:900;letter-spacing:.1em;color:#ab7d43}
.treasure-end{position:absolute;right:18%;top:54px;font-size:37px}
.treasure-steps{position:absolute;inset:0;z-index:2}
.treasure-step{position:absolute;font-size:26px;color:#9e8b6e;text-shadow:0 2px #fff}
.treasure-step.found{filter:drop-shadow(0 0 7px #fff2aa)}
.treasure-player{position:absolute;z-index:4;background:#ffffffdd;border:4px solid white;border-radius:50%;width:59px;height:59px;display:grid;place-items:center;font-size:32px;box-shadow:0 5px 12px #9571443b;transition:left .6s,top .6s}
.treasure-score{position:absolute;bottom:10px;right:15px;background:#fff9e5;border-radius:22px;padding:7px 12px;color:#a87c43;font-size:11px;font-weight:900;z-index:4}
.encouragement-line{margin:17px 2px 0;background:#fff8e6;border:1px solid #fff0c4;border-radius:15px;padding:15px;display:flex;gap:10px;align-items:flex-start;font-size:12px;line-height:1.55;color:#97845e;font-weight:700}
.encouragement-line span:first-child{font-size:23px}
.quiz-panel{background:#fff;border:1px solid var(--line);border-radius:23px;padding:25px 27px 24px;box-shadow:0 10px 32px #4447770c;min-height:460px}
.quiz-panel-header{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:22px;border-bottom:1px solid #f1f1f7}
.quiz-panel-header>span{color:#a3a5b9;font-size:10px;letter-spacing:.13em;font-weight:900}
.listen-button{border:1px solid #e8e5fb;background:#f9f7ff;color:#6f62d8;border-radius:100px;padding:7px 12px;display:flex;align-items:center;gap:6px;font-size:11px;font-weight:900}
.listen-button:hover{background:#ede9ff}
.question-tag{margin:25px 0 15px;font-size:10px;letter-spacing:.13em;color:#8e84d9;font-weight:900}
.big-equation{display:flex;align-items:center;gap:12px;justify-content:center;margin:8px 0 16px;font-size:clamp(42px,5vw,70px);font-weight:1000;letter-spacing:-.075em;line-height:1.4}
.big-equation span{display:inline-flex;align-items:center;justify-content:center}
.big-equation .plus-symbol{color:#ffb244}
.big-equation .equals-symbol{color:#a7a3c0}
.big-equation .answer-question{background:#eeeafd;color:var(--purple);border:2px dashed #b7a8fa;border-radius:18px;padding:2px 15px;min-width:68px}
.question-hint{color:#9395ab;font-size:12px;text-align:center;margin:10px auto 23px;line-height:1.5}
.pick-label{font-size:10px;font-weight:900;letter-spacing:.14em;color:#a6a7bc;margin-bottom:12px}
.answer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.answer-option{display:flex;gap:8px;align-items:center;min-height:75px;padding:14px;border:2px solid #e9eaf4;border-radius:16px;background:#fafbff;text-align:left;transition:transform .16s,border .16s,background .16s;position:relative;color:var(--ink)}
.answer-option:not(:disabled):hover{border-color:#b0a7f7;background:#f5f2ff;transform:translateY(-2px)}
.answer-option:not(:disabled):active{transform:scale(.98)}
.answer-option strong{font-size:clamp(15px,1.3vw,21px);font-weight:900;line-height:1.25;letter-spacing:-.03em}
.answer-number{font-size:11px;font-weight:900;display:grid;place-items:center;width:26px;height:26px;border:1px solid #e7e6f1;background:#fff;border-radius:8px;flex-shrink:0;color:#a5a6ba}
.answer-option.answer-correct{background:#e9fcf5;border-color:#60c9a6;color:#227e5e}
.answer-option.answer-wrong{background:#fff0f1;border-color:#f7adac;color:#b25458}
.answer-result{margin-left:auto;background:#4ec29a;color:#fff;border-radius:50%;width:23px;height:23px;display:grid;place-items:center;flex-shrink:0}
.letter-grid .answer-option{justify-content:center;min-height:80px}
.letter-grid .answer-option strong{font-size:34px}
.letter-grid .answer-number{position:absolute;left:8px;top:8px;width:22px;height:22px;font-size:9px}
.word-clue{display:flex;align-items:center;gap:12px;background:#f9f8ff;border:1px solid #ebe7fc;padding:11px 14px;border-radius:14px;margin:4px 0 20px}
.clue-emoji{width:60px;height:60px;display:grid;place-items:center;font-size:47px;background:#fff;border-radius:12px;flex:0 0 60px}
.word-clue b{font-size:9px;color:#9c92da;letter-spacing:.1em}
.word-clue p{margin:3px 0 0;color:#4f4a7a;font-weight:850;font-size:14px;line-height:1.4}
.word-display{display:flex;align-items:center;justify-content:center;flex-wrap:nowrap;gap:8px;margin:21px auto 12px}
.word-tile{width:clamp(42px,4.5vw,63px);height:clamp(53px,5vw,72px);display:grid;place-items:center;background:#f3f3fc;border:2px solid #e6e5f6;border-radius:13px;font-size:clamp(25px,2.3vw,34px);font-weight:1000;color:#3b3b69}
.word-tile-blank{background:#f4edff;border:2px dashed #ad9ef8;color:#b6aafa}
.word-tile-active{border-color:var(--purple);box-shadow:0 5px 0 #e2ddff}
.word-tile-filled{background:#dff9ed;border:2px solid #6bcea9;color:#26906c;animation:pop .35s ease}
.bible-question-mark{display:grid;place-items:center;border-radius:15px;background:#eafaf5;width:60px;height:58px;margin:9px auto 17px;font-size:36px}
.bible-question{font-size:clamp(20px,2.05vw,29px);text-align:center;line-height:1.35;letter-spacing:-.04em;min-height:80px;margin-bottom:5px}
.answer-feedback{display:flex;gap:10px;align-items:flex-start;border-radius:14px;padding:13px 14px;margin-top:15px;background:#ecfff7;border:1px solid #caf3e0;color:#218164}
.answer-feedback.feedback-miss{background:#fff9eb;border-color:#ffe9b3;color:#93723c}
.answer-feedback.feedback-neutral{background:#f2efff;border-color:#dfd9fc;color:#6857cf}
.answer-feedback strong{font-size:13px;display:block;line-height:1.45}
.answer-feedback p{font-size:11px;line-height:1.5;margin:5px 0 0;color:#797f81}
.feedback-emoji{font-size:24px}
.verse-ref{font-weight:900;color:#8f70d8}
.quiz-footer{min-height:50px;margin-top:18px;display:flex;align-items:center;justify-content:flex-end}
.quiz-quiet{display:flex;align-items:center;gap:6px;color:#b0a9c4;font-size:11px;font-weight:800}
.btn-next{min-height:46px;padding:11px 17px;border-radius:13px;font-size:13px}
.keyboard-tip{text-align:center;font-size:10px;color:#aaabc0;margin:18px 0 0;font-weight:700}
kbd{display:inline-grid;place-items:center;width:19px;height:20px;background:#fff;border:1px solid #e8e9f3;border-radius:5px;font-family:inherit;font-size:10px}
/* RESULTS */
.result-wrap{display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 240px);padding-top:12px}
.result-card{background:#fff;border:1px solid var(--line);box-shadow:var(--shadow);width:min(700px,100%);border-radius:27px;padding:35px 45px 32px;text-align:center;position:relative;overflow:hidden}
.result-sparkles{position:absolute;top:25px;left:17px;right:17px;display:flex;justify-content:space-between;color:#f2d173;font-size:23px;pointer-events:none}
.result-sparkles span{color:#a28df9}
.result-medal{width:99px;height:99px;border-radius:50%;background:radial-gradient(#fff4ce,#ffe2a5);border:5px solid #fff2c7;display:grid;place-items:center;font-size:60px;margin:4px auto 15px;box-shadow:0 8px 0 #f7dba9}
.result-kicker{display:block;font-weight:900;letter-spacing:.13em;font-size:10px;color:#9887da;margin:14px auto 8px}
.result-card h1{font-size:clamp(28px,3.6vw,44px);margin:0 0 6px}
.result-card>p{color:var(--muted);font-size:14px;margin-bottom:16px}
.result-stars{display:flex;gap:9px;justify-content:center;margin:5px auto 21px}
.result-stars span{font-size:54px;display:inline-block;filter:drop-shadow(0 5px 0 #fae4a9);line-height:1.2}
.result-stars .lit{color:#ffcb5c;animation:pop .65s ease backwards}
.result-stars .dim{color:#e8e6f2;filter:none}
.result-breakdown{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:19px 12px;background:#f7f7fe;border:1px solid #eeeef9;border-radius:18px}
.result-breakdown div{display:flex;flex-direction:column;gap:2px;align-items:center}
.result-breakdown span{font-size:24px}
.result-breakdown strong{font-size:27px;line-height:1.1}
.result-breakdown small{font-size:10px;color:#999bad;font-weight:750}
.result-save{display:flex;align-items:center;justify-content:center;gap:6px;color:#398b70;font-size:11px;font-weight:800;margin:17px auto 12px}
.result-actions{display:flex;gap:13px;justify-content:center;flex-wrap:wrap}
.result-actions .btn{font-size:14px;min-width:165px;min-height:49px}
.result-reminder{font-size:11px!important;color:#aaa4b9!important;margin-top:27px!important;margin-bottom:0!important}
/* JOURNEY */
.journey-banner,.leader-banner{border-radius:26px;padding:34px 40px;display:flex;justify-content:space-between;align-items:center;overflow:hidden;position:relative;color:white;min-height:200px}
.journey-banner{background:linear-gradient(110deg,#8774e9,#b2a0f7)}
.journey-banner:after,.leader-banner:after{position:absolute;content:'';border:3px dashed #ffffff4d;width:300px;height:300px;border-radius:50%;right:-30px;top:-95px}
.journey-banner h1,.leader-banner h1{font-size:clamp(27px,3.4vw,42px);margin:15px 0 8px;max-width:520px}
.journey-banner p,.leader-banner p{color:#fffdecbf;font-size:14px;max-width:500px;margin:0}
.journey-banner-avatar{font-size:98px;line-height:1;position:relative;z-index:1;filter:drop-shadow(0 8px 12px #45318755)}
.journey-banner-avatar span{position:absolute;font-size:36px;right:-15px;top:-12px}
.journey-stats{margin-bottom:31px}
.skills-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-bottom:33px}
.skill-card{display:flex;align-items:center;gap:12px;border:1px solid var(--line);background:white;border-radius:17px;padding:18px;text-align:left;color:var(--ink);min-width:0}
.skill-card:hover{border-color:#c4b9ff;background:#fdfcff}
.skill-icon{font-size:30px;background:#f7f5ff;padding:8px;border-radius:12px}
.skill-card>div{display:flex;flex-direction:column;min-width:0;flex:1}
.skill-card strong{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.skill-card small{color:#9d9cb5;font-size:10px}
.skill-card>b{white-space:nowrap;font-size:17px;color:var(--purple)}
.skill-card>b span{font-size:9px;color:#a1a0b5}
.skill-card>svg{color:#aba7c0}
.badge-header{margin-top:7px}
.badge-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.badge-card{min-height:181px;border-radius:20px;background:#fff;border:1px solid var(--line);text-align:center;padding:19px 10px 13px}
.badge-symbol{font-size:43px;width:65px;height:65px;display:grid;place-items:center;margin:0 auto 9px;border-radius:50%;background:#fff8e6}
.badge-card strong{font-size:13px;display:block;line-height:1.3}
.badge-card p{color:#9998ad;font-size:11px;margin:6px 0 12px;line-height:1.35}
.badge-card small{font-size:9px;letter-spacing:.08em;color:#4eae88;font-weight:1000}
.badge-locked{opacity:.64;background:#fafbfe}
.badge-locked .badge-symbol{background:#e9e9f3;filter:grayscale(.7)}
.badge-locked small{color:#a7a7b9}
.history-header{margin-top:33px}
.history-panel{background:#fff;border:1px solid var(--line);border-radius:21px;overflow:hidden}
.history-row{display:flex;align-items:center;gap:13px;padding:15px 19px;border-bottom:1px solid #f1f0f8}
.history-row:last-child{border-bottom:0}
.history-emoji{font-size:28px;width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:#f6f4ff}
.history-row>span:nth-child(2){display:flex;flex:1;flex-direction:column;gap:2px}
.history-row>span:nth-child(2) strong{font-size:13px}
.history-row>span:nth-child(2) small{font-size:11px;color:#a4a3b5}
.history-stars{font-size:16px;white-space:nowrap}
.history-row>b{font-size:12px;color:var(--purple);min-width:68px;text-align:right}
.empty-history{text-align:center;padding:36px}
.empty-history>div{font-size:52px}
.empty-history h3{font-size:20px;margin:7px 0}
.empty-history p{font-size:12px;color:#9899ae}
/* LEADERBOARD */
.leader-banner{background:linear-gradient(110deg,#4daaa6,#68d4ba)}
.leader-banner-icon{font-size:128px;position:relative;z-index:1;filter:drop-shadow(0 12px 14px #207a6a45);transform:rotate(-8deg)}
.leaders-note{display:flex;align-items:center;gap:10px;border-radius:14px;margin:19px 0;background:#fff9eb;border:1px solid #fff0ce;padding:13px 17px;color:#947e53;font-size:12px;font-weight:700}
.leader-table{background:#fff;border:1px solid var(--line);border-radius:19px;overflow:hidden}
.leader-table-head,.leader-row{display:grid;grid-template-columns:95px minmax(0,2fr) minmax(65px,.6fr) minmax(70px,.7fr) minmax(73px,.7fr);gap:8px;align-items:center;padding:13px 20px}
.leader-table-head{background:#f6f5ff;color:#9e9db5;font-size:10px;letter-spacing:.08em;font-weight:900}
.leader-row{min-height:69px;border-top:1px solid #f1eff9;font-size:13px;color:#77768f}
.leader-row.my-rank{background:#f8f6ff}
.rank-medal{font-size:21px;font-weight:900;color:#8c89a4}
.rank-player{display:flex;align-items:center;gap:11px;min-width:0}
.rank-player>span{display:grid;place-items:center;background:#f0eeff;width:40px;height:40px;border-radius:13px;font-size:24px;flex:0 0 40px}
.rank-player b{color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank-player i{font-style:normal;color:#6b5be8;background:#e8e4ff;border-radius:100px;font-size:9px;font-weight:900;padding:3px 6px}
.leader-row>strong{font-weight:900;color:#9d7a2e}
.leader-row>b:last-child{color:var(--purple)}
.leader-empty{text-align:center;padding:40px 20px}
.leader-empty>div{font-size:54px}
.leader-empty h3{font-size:22px;margin:5px 0 8px}
.leader-empty p{font-size:12px;color:#9999b2;margin:0}
.leader-disclaimer{color:#a3a1b2;font-size:11px;text-align:center;margin:17px auto}
/* FEEDBACK */
.toast{position:fixed;left:50%;bottom:max(22px,env(safe-area-inset-bottom));transform:translateX(-50%);max-width:calc(100vw - 35px);background:#2f2b64;color:#fff;padding:14px 20px;box-shadow:0 12px 40px #1917475c;z-index:150;border-radius:14px;font-size:13px;font-weight:800;animation:toast-in .24s ease}
.toast-warning{background:#765133}
.mini-sparkles{position:fixed;pointer-events:none;left:50%;top:45%;z-index:100}
.mini-sparkles i{position:absolute;font-size:23px;font-style:normal;color:#ffd56b;animation:spark 850ms ease-out var(--delay) forwards}
.confetti-layer{position:fixed;inset:0;pointer-events:none;z-index:120;overflow:hidden}
.confetti-layer span{position:absolute;width:10px;height:20px;border-radius:2px;animation:confetti-fall 3s linear forwards}
.menu-scrim{display:none}
@keyframes float{50%{transform:translateY(-14px) rotate(7deg)}}
@keyframes twinkle{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.14)}}
@keyframes road{to{background-position:-65px 0}}
@keyframes drift{50%{transform:translateX(30px)}}
@keyframes zoom{0%{opacity:1;transform:translateX(0)}100%{opacity:0;transform:translateX(-50px)}}
@keyframes burn{to{transform:scaleY(.8)}}
@keyframes pop{0%{transform:scale(.7)}60%{transform:scale(1.16)}100%{transform:scale(1)}}
@keyframes spark{to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.2) rotate(180deg)}}
@keyframes confetti-fall{to{top:110%;transform:translateX(60px) rotate(900deg)}}
@keyframes toast-in{from{opacity:0;transform:translate(-50%,18px)}to{opacity:1;transform:translate(-50%,0)}}
/* TABLET */
@media(max-width:1200px){
  .sidebar{width:223px;flex-basis:223px}
  .sidebar .brand-text strong{font-size:17px}
  .sidebar .brand-text small{font-size:7px}
  .main-content{padding-left:24px;padding-right:24px}
  .app-topbar{padding-left:24px;padding-right:24px}
  .inside-footer{padding-left:24px;padding-right:24px}
  .game-card-body{padding:15px}
  .game-card-body h3{font-size:19px}
  .game-card-foot{flex-direction:column;align-items:flex-start}
  .mini-stat{padding:12px 9px;gap:9px}
  .mini-stat-emoji{width:42px;height:42px;font-size:24px}
  .mini-stat strong{font-size:21px}
  .mini-stat small{font-size:10px}
  .quiz-panel{padding:19px}
  .racer{width:105px}
}
@media(max-width:1000px){
  .welcome-content{grid-template-columns:minmax(0,1fr) minmax(330px,.9fr);gap:0}
  .welcome-left h1{font-size:clamp(42px,5vw,61px)}
  .welcome-art{min-height:620px}
  .hero-card-math{height:300px;top:23%;width:90%}
  .hero-card-word{width:49%;height:185px;right:0;top:60%}
  .hero-card-bible{width:56%}
  .hero-spell{font-size:26px}
  .hero-rocket{font-size:70px}
  .sticker-one{top:13%;width:95px;height:95px}
  .stat-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .play-grid{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:13px}
  .game-hud{gap:10px}
  .hud-progress{width:32%}
  .hud-scores{gap:8px}
  .hud-scores small{display:none}
  .badge-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .skills-grid{grid-template-columns:repeat(1,minmax(0,1fr))}
}
/* MOBILE / SMALL TABLET */
@media(max-width:850px){
  .welcome-wrap{padding:23px 25px 18px}
  .welcome-content{grid-template-columns:1fr;padding:55px 0 25px}
  .welcome-left{max-width:650px;margin:0 auto}
  .welcome-left h1{font-size:clamp(42px,7.4vw,70px)}
  .welcome-description{max-width:640px}
  .welcome-art{position:absolute;right:-100px;top:20px;opacity:.12;width:62%;height:550px;min-height:0;pointer-events:none}
  .welcome-left{z-index:3}
  .welcome-footer{margin-top:auto}
  .sidebar{position:fixed;left:0;top:0;height:100dvh;transform:translateX(-110%);width:268px;flex-basis:auto;transition:transform .25s ease;box-shadow:0 5px 35px #2c1c4630}
  .sidebar.sidebar-open{transform:translateX(0)}
  .menu-scrim{display:block;position:fixed;inset:0;background:#21194377;border:0;z-index:25}
  .mobile-hamburger,.sidebar-close{display:grid}
  .sidebar-close{margin-left:auto;width:36px;height:36px}
  .sidebar-head{padding:0;margin-bottom:35px}
  .app-topbar{min-height:83px}
  .main-content{padding-top:22px}
  .game-grid{gap:13px}
  .game-card-body h3{font-size:18px}
  .game-card-body p{font-size:12px}
  .play-grid{grid-template-columns:1fr}
  .scene-column{order:1}
  .quiz-panel{order:2}
  .race-scene,.rocket-scene,.treasure-scene{height:270px}
  .scene-bottom-caption{padding:6px;height:12%}
  .race-sky{height:35%}
  .race-track{height:53%}
  .rocket-sky{height:88%}
  .racer{width:120px}
  .racer-you,.racer-rival{transform:scale(.9)}
  .rocket-fly{width:85px;height:140px}
  .treasure-route{top:35px}
  .treasure-palm{font-size:77px;bottom:8px}
  .treasure-player{width:49px;height:49px;font-size:29px}
  .encouragement-line{margin:8px 0 4px;padding:11px}
  .quiz-panel{min-height:0;padding:24px}
  .big-equation{font-size:62px}
  .word-tile{height:70px;width:65px}
  .bible-question{min-height:auto}
}
@media(max-width:660px){
  .welcome-top{gap:12px}
  .safe-tag{font-size:0;padding:8px}
  .safe-tag svg{width:20px;height:20px}
  .welcome-wrap{padding:20px 18px 17px}
  .welcome-content{padding:43px 0 20px}
  .welcome-left h1{font-size:clamp(40px,10.5vw,59px)}
  .welcome-description{font-size:14px;line-height:1.7}
  .eyebrow{font-size:9px;padding:8px 10px;margin-bottom:22px}
  .welcome-features{gap:6px;margin-bottom:21px}
  .welcome-features span{font-size:10px;padding:7px 9px}
  .entry-card{padding:20px 17px 16px;border-radius:19px}
  .avatar-options{gap:5px}
  .avatar-button{font-size:20px;min-height:40px;border-radius:10px}
  .entry-header h2{font-size:19px}
  .entry-icon{width:46px;height:46px;flex-shrink:0}
  .welcome-footer{flex-direction:column;gap:4px;font-size:10px}
  .welcome-art{display:none}
  .app-topbar{padding:12px 16px;min-height:77px}
  .topbar-left{gap:10px}
  .topbar-greeting{font-size:8px;letter-spacing:.1em}
  .topbar-heading{font-size:17px;max-width:190px}
  .topbar-right{gap:7px}
  .topbar-star{padding:7px 8px;border-radius:12px}
  .topbar-star>span{font-size:17px}
  .topbar-star b{font-size:17px}
  .topbar-star small{display:none}
  .sound-button{width:36px;height:36px;border-radius:11px}
  .topbar-avatar{width:38px;height:38px;border-radius:12px;font-size:23px}
  .mobile-hamburger{width:36px;height:36px}
  .main-content{padding:16px 15px 26px}
  .inside-footer{padding:14px 15px;text-align:center;flex-direction:column;gap:5px}
  .dash-hero{padding:30px 24px;min-height:284px;border-radius:19px}
  .dash-hero h1{font-size:clamp(29px,7vw,40px)}
  .dash-hero p{font-size:12px;max-width:270px}
  .dash-hero-art{width:250px;right:-125px;opacity:.54;min-width:0}
  .dash-big-star{font-size:95px;top:34%;left:18%}
  .dash-mini{font-size:28px}
  .dash-hero-copy{max-width:90%}
  .stat-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:13px 0 29px}
  .mini-stat{border-radius:14px;padding:10px 8px;gap:8px}
  .mini-stat-emoji{width:38px;height:38px;border-radius:11px;font-size:20px}
  .mini-stat strong{font-size:21px}
  .mini-stat small{font-size:9px}
  .section-heading{align-items:flex-start;flex-direction:column;gap:6px;margin-bottom:16px}
  .section-heading h2{font-size:23px}
  .section-note{font-size:11px}
  .game-grid{grid-template-columns:1fr;gap:15px}
  .game-art{height:164px}
  .game-card-body{padding:17px 19px}
  .game-card-body h3{font-size:22px}
  .game-card-body p{min-height:0;font-size:12px;margin-bottom:15px}
  .game-card-foot{flex-direction:row;align-items:center}
  .bottom-grid{grid-template-columns:1fr;gap:12px}
  .journey-teaser,.parents-note{padding:18px}
  .teaser-art{font-size:46px}
  .setup-hero{padding:22px;min-height:233px;border-radius:20px}
  .setup-hero h1{font-size:32px}
  .setup-hero p{font-size:12px}
  .setup-facts{font-size:10px;gap:7px}
  .setup-hero-emoji{font-size:68px;position:absolute;bottom:20px;right:12px;opacity:.65}
  .setup-hero>div:first-child{max-width:100%}
  .setup-level-header{margin:30px 0 20px}
  .setup-level-header h2{font-size:27px}
  .level-grid,.level-grid-words{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .level-choice{min-height:143px;padding:12px 6px}
  .level-choice strong{font-size:14px}
  .level-emoji{font-size:38px}
  .level-choice small{font-size:10px}
  .level-grid-words .level-choice:last-child{grid-column:1/-1;min-height:125px}
  .setup-start{margin:28px auto}
  .play-breadcrumb>span{font-size:10px}
  .game-hud{padding:10px 12px;border-radius:14px;display:grid;grid-template-columns:1fr auto;gap:12px;margin-bottom:12px}
  .hud-left{gap:6px}
  .hud-avatar{width:38px;height:38px;font-size:23px}
  .hud-left strong{font-size:12px}
  .hud-left small{font-size:10px}
  .hud-progress{grid-row:2;grid-column:1/3;width:100%;min-width:0}
  .hud-scores>span{font-size:16px}
  .hud-scores b{font-size:17px}
  .hud-scores{gap:9px}
  .race-scene,.rocket-scene,.treasure-scene{height:233px;border-radius:16px}
  .racer{width:100px}
  .race-scene-head{top:10px;left:10px;right:10px}
  .race-scene-head span,.race-scene-head b{font-size:8px;padding:6px}
  .race-track{height:53%}
  .racer-you{top:0}
  .racer-rival{top:50%}
  .scene-bottom-caption{font-size:10px}
  .rocket-fly{left:30%;width:72px;height:112px}
  .scene-planet{font-size:51px}
  .rocket-mission{top:9px;left:9px;padding:8px}
  .treasure-palm{font-size:70px}
  .treasure-sun{font-size:39px}
  .treasure-cloud{font-size:31px}
  .quiz-panel{padding:20px 17px 19px;border-radius:18px}
  .quiz-panel-header{padding-bottom:14px}
  .question-tag{margin:19px 0 11px}
  .big-equation{font-size:clamp(38px,10.4vw,60px);gap:7px}
  .big-equation .answer-question{min-width:45px;padding:2px 9px;border-radius:12px}
  .question-hint{font-size:11px}
  .answer-option{min-height:67px;padding:10px;gap:6px;border-radius:12px}
  .answer-option strong{font-size:17px}
  .answer-number{width:23px;height:23px;font-size:10px}
  .letter-grid .answer-option strong{font-size:31px}
  .word-display{gap:6px}
  .word-tile{width:clamp(42px,15vw,62px);height:62px;font-size:29px;border-radius:11px}
  .clue-emoji{width:52px;height:52px;flex-basis:52px;font-size:39px}
  .word-clue p{font-size:12px}
  .bible-question{font-size:23px}
  .keyboard-tip{display:none}
  .result-wrap{padding-top:0}
  .result-card{border-radius:18px;padding:29px 19px 25px}
  .result-card h1{font-size:31px}
  .result-medal{width:87px;height:87px;font-size:53px}
  .result-stars span{font-size:46px}
  .result-breakdown{padding:13px 4px;gap:2px}
  .result-breakdown strong{font-size:22px}
  .result-breakdown small{font-size:9px}
  .result-actions .btn{width:100%}
  .journey-banner,.leader-banner{padding:25px 20px;min-height:203px;border-radius:20px}
  .journey-banner h1,.leader-banner h1{font-size:29px;max-width:280px}
  .journey-banner p,.leader-banner p{font-size:12px;max-width:255px}
  .journey-banner-avatar{position:absolute;right:-8px;bottom:10px;opacity:.7;font-size:75px}
  .skills-grid{gap:10px}
  .badge-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .badge-card{min-height:162px;padding:14px 7px}
  .badge-symbol{width:54px;height:54px;font-size:35px}
  .badge-card strong{font-size:12px}
  .badge-card p{font-size:10px}
  .leader-banner-icon{font-size:72px;position:absolute;right:10px;bottom:0;opacity:.66}
  .leader-table-head,.leader-row{grid-template-columns:42px minmax(0,1.5fr) 48px 64px;gap:5px;padding:10px 9px}
  .leader-table-head>span:nth-child(3),.leader-row>span:nth-child(3){display:none}
  .rank-player{gap:5px}
  .rank-player>span{width:34px;height:34px;flex-basis:34px;font-size:21px}
  .rank-player b{font-size:11px}
  .rank-player i{display:none}
  .rank-medal{font-size:18px}
  .leader-row{font-size:11px}
  .leader-row>strong{font-size:11px}
  .history-row{padding:11px 9px;gap:7px}
  .history-emoji{width:35px;height:35px;font-size:23px}
  .history-row>span:nth-child(2) strong{font-size:12px}
  .history-stars{font-size:12px}
  .history-row>b{font-size:10px;min-width:48px}
}
@media(max-width:380px){
  .brand-text strong{font-size:18px}
  .brand-mark{width:40px;height:40px}
  .topbar-heading{max-width:148px;font-size:15px}
  .topbar-star{gap:3px}
  .topbar-right{gap:4px}
  .app-topbar{padding-left:9px;padding-right:9px}
  .main-content{padding-left:10px;padding-right:10px}
  .dash-hero{padding:25px 18px}
  .dash-hero h1{font-size:29px}
  .mini-stat small{font-size:8px}
  .answer-option strong{font-size:14px}
  .word-tile{width:41px}
  .racer{width:89px}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}