:root{--ink:#17283a;--soft:#546a75;--night:#10283d;--gold:#e4bd63;--gold2:#a87334;--paper:#f7f0dc;--line:rgba(35,55,66,.14);--shadow:0 22px 60px rgba(13,28,39,.18)}
*{box-sizing:border-box}html{min-height:100%;background:#10283d}body{margin:0;min-height:100vh;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:linear-gradient(135deg,#f4ead0,#d8e5dd 48%,#d3bd92);overflow-x:hidden}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}main{min-height:calc(100vh - 76px)}
.ambient-grain{position:fixed;inset:0;pointer-events:none;opacity:.035;z-index:99;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
.topbar{height:76px;padding:0 clamp(18px,4vw,58px);display:flex;align-items:center;gap:28px;background:rgba(15,38,57,.97);color:#f8f1de;box-shadow:0 8px 30px rgba(10,20,30,.18);position:relative;z-index:30}.brand{display:flex;align-items:center;gap:10px;min-width:max-content}.brand img{width:44px}.brand span{display:flex;flex-direction:column;line-height:1}.brand b{font-family:Georgia,serif}.brand small{font-size:10px;color:#d6b76b;letter-spacing:.14em;text-transform:uppercase;margin-top:4px}.topbar nav{display:flex;gap:7px;flex:1}.topbar nav a{padding:10px 12px;border-radius:10px;font-size:13px;color:#dae3e3}.topbar nav a:hover{background:rgba(255,255,255,.09)}.guardian-chip{display:flex;align-items:center;gap:9px;border:1px solid rgba(230,194,105,.25);background:rgba(255,255,255,.06);padding:7px 12px;border-radius:14px}.guardian-chip div{display:flex;flex-direction:column}.guardian-chip b{font-size:12px}.guardian-chip small{font-size:9px;color:#bdccd0}.icon-btn{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;background:rgba(255,255,255,.08);font-size:20px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:14px;padding:14px 20px;font-weight:800;cursor:pointer;transition:.2s}.btn:hover{transform:translateY(-2px)}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.primary-btn{color:#152b3e;background:linear-gradient(135deg,#f0d17e,#d8a94d);box-shadow:0 10px 25px rgba(167,115,46,.25)}.ghost-btn{background:#edf1ed;border:1px solid var(--line)}.google-btn{background:#fff;border:1px solid #d7dddf;color:#293d4c}.eyebrow,.mission-kicker{font-size:10px;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--gold2)}.notice{padding:13px 16px;border-radius:12px;margin:14px 0;font-size:13px}.notice.danger{background:#f8dedb;color:#7b2e2a;border:1px solid #e9aaa4}.notice.success{background:#ddf0e2;color:#2f6641;border:1px solid #acd3b5}
.landing-shell{min-height:100vh;padding:clamp(28px,6vw,82px);display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,.88fr);gap:clamp(30px,5vw,80px);align-items:center;background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.8),transparent 34%),linear-gradient(135deg,#f5ecd5,#dce8e0 56%,#c5a676)}.landing-copy{max-width:720px}.landing-copy h1{font-family:Georgia,serif;font-size:clamp(48px,7vw,92px);line-height:.9;margin:16px 0 24px;color:#18364b;letter-spacing:-.045em}.landing-copy h1 em{color:#a56f34}.lead{font-size:clamp(17px,2vw,22px);line-height:1.7;color:#425968}.login-card{margin-top:30px;padding:18px;max-width:460px;background:rgba(255,255,255,.62);border:1px solid rgba(255,255,255,.8);border-radius:20px;box-shadow:0 18px 45px rgba(30,49,55,.11);display:grid;gap:11px}.login-card .btn{width:100%}.login-card small{text-align:center;color:#657681;font-size:10px;line-height:1.5}.feature-row{display:flex;gap:32px;margin-top:28px}.feature-row div{display:flex;flex-direction:column}.feature-row b{font-family:Georgia,serif;font-size:28px;color:#a46e33}.feature-row span{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#5c6d75}.prologue-card{background:#122d43;border:1px solid rgba(229,198,120,.25);border-radius:30px;padding:14px;color:#eef3ef;box-shadow:0 30px 80px rgba(19,34,44,.28);position:relative}.story-badge{position:absolute;top:28px;left:28px;z-index:2;background:#8e4e4b;color:#fff0d2;padding:9px 12px;border-radius:9px;font-size:9px;font-weight:900;letter-spacing:.15em}.prologue-art{display:block;width:100%;border-radius:22px}.prologue-text{padding:14px 20px 20px}.prologue-text p{color:#bac9ce;line-height:1.55;font-size:12px}.prologue-text .king-quote{font-family:Georgia,serif;color:#edd18b;font-size:19px}
.onboarding-shell{min-height:100vh;display:grid;place-items:center;padding:30px;background:radial-gradient(circle at 50% 30%,rgba(237,209,139,.25),transparent 30%),linear-gradient(#122d43,#245267)}.onboarding-panel{width:min(620px,100%);background:rgba(250,245,230,.97);border-radius:28px;padding:clamp(28px,6vw,58px);text-align:center;box-shadow:0 40px 100px rgba(0,0,0,.28)}.crest-large{width:96px}.onboarding-panel h1{font-family:Georgia,serif;font-size:42px;margin:12px}.onboarding-panel p{color:#526672;line-height:1.65}.name-form,.admin-card{display:grid;gap:10px;text-align:left}.name-form label,.admin-card label{display:grid;gap:6px;font-size:11px;font-weight:800;color:#52636b}.name-form input,.admin-card input,.admin-card select,.collection-tools input,.collection-tools select,.table-head input{width:100%;border:1px solid #cad4d2;border-radius:12px;padding:13px;background:#fff;color:var(--ink);outline:none}.name-form input:focus,.admin-card input:focus,.admin-card select:focus{border-color:#aa7a3b;box-shadow:0 0 0 4px rgba(194,146,76,.14)}.onboarding-panel blockquote{font-family:Georgia,serif;font-size:26px;color:#1a4258;border-top:1px solid var(--line);padding-top:22px;margin-top:26px}
.game-layout{padding:20px clamp(16px,3vw,42px) 32px;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(340px,.68fr);gap:22px;min-height:calc(100vh - 76px)}.mission-strip{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.mission-strip h1{margin:5px 0 0;font-family:Georgia,serif;font-size:26px}.stage-chip{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.72);padding:8px 13px;border-radius:13px}.stage-chip>span{color:#b47c38;font-size:22px}.stage-chip div{display:flex;flex-direction:column}.stage-chip small{font-size:8px;text-transform:uppercase}.stage-chip b{font-size:11px}
.world-frame{position:relative;border-radius:24px;overflow:hidden;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.5);background:#21465f;min-height:480px}.kingdom-map{display:block;width:100%;min-height:480px}.world-hud{position:absolute;z-index:5;top:14px;right:14px;display:flex;gap:8px;align-items:center}.progress-orb{width:92px;height:92px;border-radius:50%;display:grid;place-content:center;text-align:center;background:rgba(17,41,59,.87);color:#fff;border:2px solid rgba(231,197,111,.65)}.progress-orb b{font-family:Georgia,serif;font-size:24px;color:#f2d27d}.progress-orb span{font-size:10px}.progress-orb small{font-size:7px;text-transform:uppercase;color:#bcd0d4}.sound-toggle{border:0;width:42px;height:42px;border-radius:50%;background:rgba(17,41,59,.87);color:#fff;cursor:pointer}.npc-bubble{position:absolute;right:28px;bottom:31%;background:rgba(255,255,255,.95);padding:10px 13px;border-radius:14px 14px 4px 14px;box-shadow:0 12px 30px rgba(0,0,0,.16);max-width:260px;display:flex;flex-direction:column;animation:float 4s ease-in-out infinite}.npc-bubble b{font-family:"Noto Naskh Arabic","Amiri",serif;font-size:19px;color:#1d4455}.npc-bubble span{font-size:9px;color:#61747b}.world-effect-layer{position:absolute;inset:0;pointer-events:none;z-index:12}
.green-land,.river,.grass-details,.palms,.school-building,.village,.golden-kingdom,.flowers,.animals{transition:opacity 1.1s ease}.stage-0 .green-land,.stage-0 .river,.stage-0 .grass-details,.stage-0 .palms,.stage-0 .school-building,.stage-0 .village,.stage-0 .golden-kingdom,.stage-0 .flowers,.stage-0 .animals{opacity:0}.stage-20 .green-land,.stage-20 .grass-details{opacity:1}.stage-20 .river{opacity:.3}.stage-20 .palms,.stage-20 .school-building,.stage-20 .village,.stage-20 .golden-kingdom,.stage-20 .flowers,.stage-20 .animals{opacity:0}.stage-50 .green-land,.stage-50 .grass-details,.stage-50 .river,.stage-50 .palms,.stage-50 .flowers{opacity:1}.stage-50 .school-building,.stage-50 .village,.stage-50 .golden-kingdom,.stage-50 .animals{opacity:0}.stage-100 .green-land,.stage-100 .grass-details,.stage-100 .river,.stage-100 .palms,.stage-100 .flowers,.stage-100 .school-building,.stage-100 .village,.stage-100 .animals{opacity:1}.stage-100 .golden-kingdom{opacity:0}.stage-300 .green-land,.stage-300 .grass-details,.stage-300 .river,.stage-300 .palms,.stage-300 .flowers,.stage-300 .school-building,.stage-300 .village,.stage-300 .animals,.stage-300 .golden-kingdom{opacity:1}.stage-300 .ruins{opacity:.16}.stage-unlocked{animation:worldUnlock 1.7s}
.milestones{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}.milestones>div{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:7px;padding:10px 12px;background:rgba(255,255,255,.58);border-radius:13px;filter:grayscale(1);opacity:.56}.milestones>div.done{filter:none;opacity:1;background:rgba(240,231,194,.86)}.milestones span{font-size:20px}.milestones b{font-size:12px;color:#a16e34}.milestones small{font-size:9px;color:#5f7077}
.quiz-panel,.boss-quiz{align-self:start;position:sticky;top:96px;background:rgba(248,244,231,.95);border-radius:24px;padding:18px;box-shadow:var(--shadow)}.quiz-head{display:flex;justify-content:space-between;align-items:center;padding:5px 4px 15px}.quiz-head h2{font-family:Georgia,serif;margin:4px 0 0;font-size:23px}.streak{background:#fff3d8;border:1px solid #efd49a;padding:8px 11px;border-radius:12px}.question-card{min-height:455px;background:linear-gradient(145deg,#17354c,#214f63);border-radius:20px;padding:22px;color:#fff;position:relative;overflow:hidden}.question-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 80% 12%,rgba(231,198,116,.2),transparent 28%);pointer-events:none}.category-pill{display:inline-flex;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);border-radius:999px;padding:6px 10px;font-size:8px;letter-spacing:.08em;text-transform:uppercase;color:#dae8e7}.audio-btn{position:absolute;right:18px;top:18px;border:1px solid rgba(255,255,255,.15);background:rgba(255,255,255,.09);color:#fff;width:43px;height:43px;border-radius:50%;cursor:pointer}.arabic-word{font-family:"Noto Naskh Arabic","Amiri","Scheherazade New",serif;font-size:clamp(42px,5vw,64px);text-align:center;margin:40px 0 18px;color:#f3d585;text-shadow:0 6px 20px rgba(0,0,0,.25);line-height:1.35}.question-card>p{text-align:center;color:#c8d7d8;font-size:11px}.answers{display:grid;gap:9px;position:relative}.answer-btn{display:grid;grid-template-columns:30px 1fr;align-items:center;gap:10px;text-align:left;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.075);color:#eef4ef;padding:10px 12px;border-radius:12px;cursor:pointer;transition:.15s}.answer-btn:hover{background:rgba(255,255,255,.14);transform:translateX(2px)}.answer-btn span{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;background:rgba(255,255,255,.1);font-size:10px}.answer-btn b{font-size:11px}.answer-btn.correct,.answer-btn.correct-hint{background:rgba(72,148,101,.55);border-color:#8ed0a5}.answer-btn.wrong{background:rgba(172,75,74,.55);border-color:#e49a96}.feedback{min-height:30px;margin-top:12px;text-align:center;font-size:10px;font-weight:800}.feedback.success{color:#aee2ba}.feedback.error{color:#f5b1aa}.question-shimmer{position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);transform:translateX(-100%)}.is-loading .question-shimmer{animation:shimmer 1s infinite}.quiz-footer{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:center;padding:16px 5px 2px}.quiz-footer div{display:flex;flex-direction:column}.quiz-footer span{font-size:8px;text-transform:uppercase;color:#79868b}.quiz-footer b{font-size:16px}.quiz-footer a{font-size:10px;font-weight:900;color:#9d682d}.rescued-token{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);min-width:230px;padding:18px 24px;border-radius:18px;background:rgba(18,44,61,.93);border:1px solid rgba(239,207,126,.65);color:#fff;text-align:center;box-shadow:0 20px 70px rgba(0,0,0,.3);animation:tokenRise 1.8s ease forwards}.rescued-token>span{font-size:38px;display:block}.rescued-token b{font-family:"Noto Naskh Arabic",serif;font-size:31px;color:#f0d17d;display:block}.rescued-token small{font-size:10px;color:#d4dfdd}.world-spark{position:absolute;font-size:23px;animation:sparkFly 1.15s ease-out forwards}
.collection-shell,.admin-shell{padding:clamp(24px,4vw,56px);max-width:1500px;margin:auto}.collection-hero,.admin-hero{display:flex;align-items:center;justify-content:space-between;gap:30px;background:linear-gradient(135deg,#18384e,#2e6871);color:#fff;border-radius:26px;padding:clamp(24px,4vw,44px);box-shadow:var(--shadow)}.collection-hero h1,.admin-hero h1{font-family:Georgia,serif;font-size:clamp(32px,4vw,50px);margin:8px 0}.collection-hero p,.admin-hero p{color:#c9dad8;max-width:680px;line-height:1.6}.collection-meter{display:flex;align-items:center;gap:16px;min-width:max-content}.ring{--p:0%;width:105px;height:105px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#e7c36f var(--p),rgba(255,255,255,.12) 0);position:relative}.ring:after{content:"";position:absolute;inset:9px;border-radius:50%;background:#1f4a5e}.ring span{position:relative;z-index:1;font-family:Georgia,serif;font-size:21px}.collection-meter>div:last-child{display:flex;flex-direction:column}.collection-meter b{font-size:21px}.collection-meter small{font-size:9px;color:#bed0d0;text-transform:uppercase}.collection-tools{display:grid;grid-template-columns:1fr 260px 200px;gap:12px;margin:22px 0}.word-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:13px}.word-card{position:relative;min-height:210px;border:1px solid rgba(30,54,64,.12);border-radius:18px;background:rgba(255,255,255,.72);padding:17px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;box-shadow:0 10px 25px rgba(35,52,56,.07);transition:.2s}.word-card:hover{transform:translateY(-4px);box-shadow:0 18px 32px rgba(35,52,56,.12)}.word-card.locked{background:linear-gradient(145deg,#d8d2c4,#b8b4aa);filter:saturate(.25)}.word-number{position:absolute;top:11px;left:12px;font-size:8px;color:#728087}.word-emoji{font-size:30px}.word-card b{font-family:"Noto Naskh Arabic","Amiri",serif;font-size:28px;color:#1d4758;margin:8px 0;line-height:1.35}.word-card>span:not(.word-number):not(.word-emoji){font-size:11px;color:#51666f}.word-card small{font-size:8px;text-transform:uppercase;color:#899397;margin-top:10px;text-align:center}.word-card i{position:absolute;left:0;bottom:0;height:4px;width:calc(var(--mastery)*20%);background:#d1a448}.empty-state{text-align:center;padding:60px;color:#66777e}
.boss-shell{padding:22px clamp(16px,3vw,42px);display:grid;grid-template-columns:minmax(0,1.5fr) minmax(340px,.65fr);gap:22px;min-height:calc(100vh - 76px);background:radial-gradient(circle at 35% 25%,rgba(78,91,116,.35),transparent 28%),linear-gradient(135deg,#171d2e,#27374a)}.boss-stage{color:#edf3ef}.boss-topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.boss-topline h1{font-family:Georgia,serif;margin:5px 0;font-size:29px}.keeper-health{display:grid;grid-template-columns:auto 180px auto;gap:10px;align-items:center}.keeper-health span{font-size:9px;text-transform:uppercase;color:#b8c6ca}.keeper-health>div{height:9px;background:rgba(255,255,255,.12);border-radius:99px;overflow:hidden}.keeper-health i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#c95855,#e1a658);transition:width .35s}.keeper-health b{font-size:10px}.boss-arena{height:570px;border-radius:24px;background:radial-gradient(circle at 50% 35%,rgba(115,74,131,.34),transparent 30%),linear-gradient(#17273c,#314151 63%,#202d36);position:relative;overflow:hidden;border:1px solid rgba(234,207,133,.14);box-shadow:0 30px 70px rgba(0,0,0,.3)}.boss-arena:after{content:"";position:absolute;left:0;right:0;bottom:0;height:150px;background:linear-gradient(transparent,rgba(5,14,23,.75))}.library-gate{position:absolute;left:8%;top:12%;width:34%;height:61%;background:#304c59;border:12px solid #192f3c;border-bottom:0;border-radius:120px 120px 0 0;box-shadow:inset 0 0 50px rgba(0,0,0,.35)}.library-title{text-align:center;color:#e6ca7a;font-family:"Noto Naskh Arabic",serif;font-size:20px;margin-top:35px}.shelves{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:28px}.shelves i{height:55px;border-bottom:7px solid #8b603e;background:repeating-linear-gradient(90deg,#a35942 0 8px,#d1a75d 8px 14px,#466b76 14px 22px)}.keeper{position:absolute;left:58%;top:15%;width:230px;height:340px;z-index:3;transition:.4s}.keeper-aura{position:absolute;inset:-55px;border-radius:50%;background:radial-gradient(circle,rgba(144,80,164,.35),transparent 68%);animation:pulse 3s infinite}.keeper-head{position:absolute;left:70px;top:25px;width:95px;height:92px;border-radius:50%;background:#25293a}.keeper-head span{position:absolute;top:42px;width:9px;height:5px;border-radius:50%;background:#e9ca70;box-shadow:0 0 12px #e9ca70}.keeper-head span:first-child{left:27px}.keeper-head span:last-child{right:27px}.keeper-cloak{position:absolute;left:22px;top:95px;width:190px;height:235px;background:linear-gradient(90deg,#25283a,#3c3650,#25283a);clip-path:polygon(28% 0,72% 0,100% 100%,0 100%);border-radius:80px 80px 10px 10px}.keeper-core{position:absolute;left:89px;top:155px;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:#1a2232;color:#e8c96f;font-family:Georgia,serif;font-size:34px;box-shadow:0 0 25px rgba(232,201,111,.45)}.orbit-word{position:absolute;font-family:"Noto Naskh Arabic",serif;color:#efd17d;background:rgba(23,28,42,.8);border:1px solid rgba(239,209,125,.3);border-radius:10px;padding:5px 8px;font-size:17px}.w1{left:-10px;top:65px;animation:orbit 4s infinite}.w2{right:-15px;top:130px;animation:orbit 4.5s infinite reverse}.w3{left:15px;bottom:5px;animation:orbit 5s infinite}.keeper.hit{animation:hit .42s}.keeper.defeated{animation:defeat 1.4s forwards}.hero-guardian{position:absolute;left:45%;bottom:72px;width:110px;height:180px;z-index:4}.hero-head{position:absolute;left:31px;width:54px;height:54px;border-radius:50%;background:#c88a67}.hero-head:before{content:"";position:absolute;inset:-5px 3px 21px;background:#243b4c;border-radius:30px 30px 10px 10px}.hero-body{position:absolute;left:14px;top:49px;width:86px;height:118px;background:linear-gradient(#3c7180,#214452);clip-path:polygon(20% 0,80% 0,100% 100%,0 100%)}.word-shield{position:absolute;left:-25px;top:88px;width:64px;height:78px;background:#e4c36f;color:#17354b;display:grid;place-items:center;font-family:serif;font-size:35px;clip-path:polygon(50% 0,95% 18%,85% 78%,50% 100%,15% 78%,5% 18%)}.boss-word-layer{position:absolute;inset:0;z-index:8;pointer-events:none}.flying-boss-word{position:absolute;left:67%;top:47%;font-family:"Noto Naskh Arabic",serif;font-size:30px;color:#f1d47e;background:rgba(17,37,51,.9);padding:8px 13px;border-radius:12px;border:1px solid rgba(237,204,122,.5);animation:toLibrary 1.45s forwards}.boss-lore{font-size:11px;color:#aebdc1;line-height:1.6}.boss-round{display:flex;align-items:baseline;gap:5px;padding:5px 6px 14px}.boss-round span{font-size:8px;letter-spacing:.12em;color:#8b6e41}.boss-round b{font-size:23px}.boss-reward{padding:15px 7px 3px;display:grid}.boss-reward span{font-size:8px;text-transform:uppercase;color:#92703d}.boss-reward b{font-size:14px}.boss-reward small{font-size:9px;color:#718087;line-height:1.45}.victory-modal{position:fixed;inset:0;z-index:100;background:rgba(6,14,22,.82);display:grid;place-items:center;padding:20px;opacity:0;transition:.4s}.victory-modal.show{opacity:1}.victory-card{width:min(520px,100%);background:#f7efd8;border-radius:28px;padding:44px;text-align:center}.victory-icon{font-size:55px}.victory-card h2{font-family:Georgia,serif;font-size:35px}.victory-card p{font-family:"Noto Naskh Arabic",serif;font-size:24px;color:#2a5964}.victory-card>span:not(.victory-icon){display:block;color:#61737a;margin-bottom:22px}
.admin-hero{margin-bottom:22px}.admin-stat{text-align:center;min-width:180px}.admin-stat b{font-family:Georgia,serif;font-size:54px;color:#efd17b;display:block}.admin-stat span{font-size:9px;text-transform:uppercase}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.admin-card,.word-table-card{background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.9);border-radius:20px;padding:22px;box-shadow:0 12px 35px rgba(35,52,56,.08)}.admin-card h2,.word-table-card h2{font-family:Georgia,serif;margin:0 0 6px}.form-row{display:grid;grid-template-columns:120px 1fr;gap:12px}.upload-placeholder{border:1px dashed #b8c6c4;border-radius:13px;padding:14px;background:#eef2ed;display:flex;flex-direction:column;gap:4px}.upload-placeholder code{color:#9a6b32}.upload-placeholder span{font-size:9px;color:#68787e}.word-table-card{margin-top:18px}.table-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:13px}.table-head input{max-width:320px}.table-scroll{overflow:auto;max-height:720px}table{border-collapse:collapse;width:100%;font-size:11px}th,td{padding:10px;border-bottom:1px solid #dfe5e1;text-align:left}th{position:sticky;top:0;background:#f4f1e7;z-index:2;font-size:8px;text-transform:uppercase;color:#66777c}.arabic-cell{font-family:"Noto Naskh Arabic",serif;font-size:19px}.mini-audio,.status-toggle{border:0;border-radius:8px;padding:6px 8px;font-size:9px;cursor:pointer}.mini-audio{background:#e5eee9;color:#2e6551}.status-toggle{background:#ddd;color:#666}.status-toggle.active{background:#dcefdc;color:#2c6a40}
.toast-region{position:fixed;right:20px;bottom:20px;z-index:200;display:grid;gap:9px}.toast{background:#17364b;color:#fff;padding:12px 16px;border-radius:12px;box-shadow:0 12px 35px rgba(0,0,0,.2);font-size:11px;transform:translateY(12px);opacity:0;transition:.25s}.toast.show{transform:none;opacity:1}.toast.success{border-left:4px solid #76bd83}.toast.warning{border-left:4px solid #e4b45e}
@keyframes float{50%{transform:translateY(-8px)}}@keyframes shimmer{to{transform:translateX(100%)}}@keyframes worldUnlock{40%{filter:brightness(1.45) saturate(1.25)}}@keyframes tokenRise{0%{opacity:0;transform:translate(-50%,-30%) scale(.75)}18%{opacity:1;transform:translate(-50%,-50%) scale(1.04)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-72%) scale(.95)}}@keyframes sparkFly{to{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(180deg) scale(.4)}}@keyframes pulse{50%{transform:scale(1.1);opacity:.65}}@keyframes orbit{50%{transform:translate(12px,-18px)}}@keyframes hit{20%{transform:translateX(22px) rotate(3deg);filter:brightness(1.7)}60%{transform:translateX(-10px)}}@keyframes defeat{to{transform:translateY(-60px) scale(.4);opacity:0;filter:blur(8px)}}@keyframes toLibrary{70%{left:24%;top:34%;opacity:1}100%{left:22%;top:38%;transform:scale(.4);opacity:0}}
@media(max-width:1050px){.game-layout,.boss-shell{grid-template-columns:1fr}.quiz-panel,.boss-quiz{position:static}.landing-shell{grid-template-columns:1fr}.topbar nav{display:none}.guardian-chip{margin-left:auto}}
@media(max-width:700px){.topbar{padding:0 14px;gap:10px}.brand span{display:none}.guardian-chip{padding:6px 9px}.landing-shell{padding:28px 18px}.landing-copy h1{font-size:52px}.feature-row{gap:18px}.game-layout{padding:14px 10px}.stage-chip{display:none}.world-frame,.kingdom-map{min-height:350px}.npc-bubble{right:12px;bottom:25%;max-width:190px}.milestones{grid-template-columns:1fr 1fr}.quiz-panel{padding:12px}.collection-shell,.admin-shell{padding:18px 12px}.collection-hero,.admin-hero{align-items:flex-start;flex-direction:column}.collection-tools{grid-template-columns:1fr}.word-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.word-card{min-height:180px;padding:12px}.word-card b{font-size:23px}.boss-topline{align-items:flex-start;flex-direction:column}.keeper-health{grid-template-columns:auto 150px auto}.boss-arena{height:450px}.library-gate{left:3%;width:42%}.keeper{left:52%;transform:scale(.83);transform-origin:top}.hero-guardian{left:41%;transform:scale(.8);transform-origin:bottom}.admin-grid{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.table-head{align-items:flex-start;flex-direction:column}.table-head input{max-width:none}}

/* ========================================================================== */
/* PIXEL ART SPRITE THEME — dunia, watak, perpustakaan dan Keeper            */
/* ========================================================================== */
.pixel-game-layout{background:linear-gradient(135deg,#efe7cf,#d4e2db 52%,#c2aa7e)}
.pixel-world{aspect-ratio:16/9;min-height:0;border-radius:18px;border:4px solid #1b2a40;background:#13243a;box-shadow:0 0 0 4px #d5aa52,0 0 0 8px #1b2a40,0 24px 60px rgba(15,28,40,.28);isolation:isolate}
.pixel-world:before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,rgba(0,0,0,.025) 1px 2px);mix-blend-mode:soft-light}
.pixel-world:after{content:"";position:absolute;inset:0;z-index:4;pointer-events:none;box-shadow:inset 0 0 0 3px rgba(255,226,142,.24),inset 0 -50px 90px rgba(9,17,29,.18)}
.pixel-kingdom-scenes{position:absolute;inset:0;overflow:hidden;background:#17344f}
.pixel-stage{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .65s steps(6,end),filter .65s steps(6,end);image-rendering:pixelated;image-rendering:crisp-edges;user-select:none;pointer-events:none}
.stage-0 .pixel-stage-0,.stage-20 .pixel-stage-20,.stage-50 .pixel-stage-50,.stage-100 .pixel-stage-100,.stage-300 .pixel-stage-300{opacity:1}
.stage-unlocked .pixel-stage{filter:brightness(1.34) saturate(1.18)}
.pixel-frame-corners{position:absolute;inset:8px;z-index:18;pointer-events:none}
.pixel-frame-corners i{position:absolute;width:24px;height:24px;border-color:#f1c966;border-style:solid;filter:drop-shadow(2px 2px 0 #172036)}
.pixel-frame-corners i:nth-child(1){left:0;top:0;border-width:4px 0 0 4px}.pixel-frame-corners i:nth-child(2){right:0;top:0;border-width:4px 4px 0 0}.pixel-frame-corners i:nth-child(3){left:0;bottom:0;border-width:0 0 4px 4px}.pixel-frame-corners i:nth-child(4){right:0;bottom:0;border-width:0 4px 4px 0}
.pixel-frame-corners.dark i{border-color:#7659a2;filter:drop-shadow(2px 2px 0 #090e1c)}
.pixel-world-hud{top:18px;right:18px;z-index:20}
.pixel-progress-orb{width:88px;height:88px;border-radius:0;border:3px solid #e6bd58;background:#13243ae8;box-shadow:4px 4px 0 #0b1424,inset 0 0 0 3px #29435a;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px)}
.pixel-progress-orb b{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:25px;text-shadow:2px 2px 0 #7c4f2e}.pixel-progress-orb span{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}.pixel-progress-orb small{letter-spacing:.08em}
.pixel-icon-button{border-radius:0;border:3px solid #36536c;box-shadow:3px 3px 0 #0b1424;background:#142a41;clip-path:polygon(6px 0,calc(100% - 6px) 0,100% 6px,100% calc(100% - 6px),calc(100% - 6px) 100%,6px 100%,0 calc(100% - 6px),0 6px)}
.pixel-icon-button:hover{transform:translate(-1px,-1px);box-shadow:5px 5px 0 #0b1424}
.world-npc{position:absolute;right:10%;bottom:8%;z-index:10;width:clamp(64px,7.4vw,108px);height:auto;animation:pixelNpcIdle 1.5s steps(2,end) infinite}
.world-npc img{display:block;width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges;filter:drop-shadow(5px 7px 0 rgba(13,28,40,.28))}
.world-npc .npc-shadow{position:absolute;left:14%;right:14%;bottom:-4%;height:8%;background:#15243b88;z-index:-1;transform:skewX(-18deg)}
.stage-0 .world-npc{filter:saturate(.35) brightness(.74)}
.stage-20 .world-npc,.stage-50 .world-npc,.stage-100 .world-npc,.stage-300 .world-npc{filter:none}
.pixel-speech-bubble{right:2.2%;bottom:29%;z-index:21;border-radius:0;border:3px solid #1c2c42;background:#fff8df;box-shadow:5px 5px 0 #172036;padding:10px 13px;clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,18px 100%,12px calc(100% + 8px),8px 100%,7px 100%,0 calc(100% - 7px),0 7px);animation:pixelBubble 2s steps(2,end) infinite}
.pixel-speech-bubble b{font-size:18px;color:#21465b}.pixel-speech-bubble span{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:#53616c}
.pixel-cloud-shadow{position:absolute;z-index:5;width:70px;height:8px;background:#fff3;opacity:.13;pointer-events:none;animation:pixelCloud 18s linear infinite;image-rendering:pixelated}
.pixel-cloud-shadow:before,.pixel-cloud-shadow:after{content:"";position:absolute;background:inherit}.pixel-cloud-shadow:before{width:36px;height:8px;left:14px;top:-8px}.pixel-cloud-shadow:after{width:20px;height:8px;left:23px;top:-16px}
.cloud-a{top:20%;left:-18%}.cloud-b{top:32%;left:-35%;transform:scale(.68);animation-delay:-8s;animation-duration:24s}
.pixel-stage-chip{border:3px solid #2b4257;border-radius:0;box-shadow:3px 3px 0 #9c7139;background:#fff2ce;clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 7px,100% calc(100% - 7px),calc(100% - 7px) 100%,7px 100%,0 calc(100% - 7px),0 7px)}
.pixel-stage-chip b{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.pixel-milestones>div{border-radius:0;border:2px solid #9aa59d;box-shadow:3px 3px 0 #57636a;background:#ede6d2;clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,0 calc(100% - 5px),0 5px)}
.pixel-milestones>div.done{border-color:#d0a84f;box-shadow:3px 3px 0 #8b6233;background:#fff0bd}

/* Boss arena pixel sprites */
.pixel-boss-shell{background:radial-gradient(circle at 38% 28%,rgba(84,62,111,.32),transparent 30%),linear-gradient(135deg,#111827,#25334a)}
.pixel-boss-arena{height:auto;min-height:430px;aspect-ratio:16/9;border-radius:16px;border:4px solid #0b1221;background:#10192c;box-shadow:0 0 0 4px #5e4c78,0 0 0 8px #111827,0 28px 70px rgba(0,0,0,.38);isolation:isolate}
.pixel-boss-arena:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,rgba(0,0,0,.04) 1px 2px)}
.pixel-boss-arena:after{content:"";position:absolute;inset:auto 0 0;height:35%;z-index:2;pointer-events:none;background:linear-gradient(transparent,rgba(5,9,18,.54))}
.pixel-library-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;image-rendering:pixelated;image-rendering:crisp-edges;user-select:none;pointer-events:none}
.pixel-library-label{position:absolute;left:7.8%;top:18%;z-index:6;padding:6px 11px;background:#4d3526;border:3px solid #d0a94f;color:#ffe294;box-shadow:4px 4px 0 #101829;font-family:"Noto Naskh Arabic","Amiri",serif;font-size:clamp(12px,1.25vw,18px)}
.keeper-pixel{position:absolute;left:56%;top:16%;width:clamp(128px,15vw,205px);height:auto;z-index:8;transition:none;animation:pixelKeeperIdle 1.7s steps(2,end) infinite;filter:drop-shadow(8px 10px 0 rgba(5,8,18,.35))}
.keeper-pixel>img{display:block;width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges;position:relative;z-index:2}
.keeper-pixel .keeper-aura{position:absolute;inset:-14%;border-radius:0;background:repeating-radial-gradient(circle,rgba(126,84,174,.34) 0 8%,transparent 9% 18%);filter:blur(1px);animation:pixelAura 1.8s steps(4,end) infinite;z-index:1}
.keeper-pixel .orbit-word{z-index:4;border-radius:0;border:2px solid #b68b48;background:#172038;color:#ffe28a;box-shadow:3px 3px 0 #090e1b;padding:4px 8px;font-size:clamp(13px,1.25vw,18px);animation:pixelOrbit 1.6s steps(4,end) infinite}
.keeper-pixel .w1{left:-15%;top:18%}.keeper-pixel .w2{right:-16%;top:41%;animation-delay:-.4s}.keeper-pixel .w3{left:-4%;bottom:4%;animation-delay:-.8s}
.keeper-pixel.hit{animation:pixelKeeperHit .42s steps(4,end)!important}
.keeper-pixel.defeated{animation:pixelKeeperDefeat 1.25s steps(8,end) forwards!important}
.hero-pixel{position:absolute;left:39%;bottom:8%;width:clamp(90px,10.5vw,145px);height:auto;z-index:9;animation:pixelHeroIdle 1.3s steps(2,end) infinite;filter:drop-shadow(7px 9px 0 rgba(5,8,18,.35))}
.hero-pixel img{display:block;width:100%;height:auto;image-rendering:pixelated;image-rendering:crisp-edges}
.hero-shield-letter{position:absolute;left:26.5%;top:56.5%;transform:translate(-50%,-50%);z-index:4;color:#233950;font-family:"Noto Naskh Arabic","Amiri",serif;font-size:clamp(18px,2.1vw,31px);font-weight:900;line-height:1;text-shadow:1px 1px 0 #ffe6a0}
.pixel-floor-glow{position:absolute;left:48%;bottom:8%;width:36%;height:10%;z-index:4;background:repeating-linear-gradient(90deg,transparent 0 12px,rgba(142,102,193,.26) 12px 24px);clip-path:polygon(15% 0,85% 0,100% 100%,0 100%);animation:pixelFloorGlow 1.3s steps(3,end) infinite}
.pixel-health>div{height:12px;border-radius:0;border:2px solid #0d1423;background:#263248;box-shadow:2px 2px 0 #090e1a;padding:1px}.pixel-health i{background:repeating-linear-gradient(90deg,#d55754 0 12px,#e8a348 12px 24px);transition:width .35s steps(8,end)}
.pixel-health b,.pixel-health span{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.flying-boss-word{border-radius:0;border:3px solid #ddb75b;background:#15233d;color:#ffe28b;box-shadow:5px 5px 0 #090e1a;font-family:"Noto Naskh Arabic","Amiri",serif;image-rendering:pixelated}
.pixel-victory-card{border-radius:0;border:5px solid #1c3045;box-shadow:8px 8px 0 #d2a84e;background:#fff1c9;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px)}
.victory-modal[hidden]{display:none!important}.victory-modal{pointer-events:none}.victory-modal.show{pointer-events:auto}

@keyframes pixelNpcIdle{0%,49%{transform:translateY(0)}50%,100%{transform:translateY(-3px)}}
@keyframes pixelBubble{0%,49%{transform:translateY(0)}50%,100%{transform:translateY(-3px)}}
@keyframes pixelCloud{from{transform:translateX(0)}to{transform:translateX(1450%)}}
@keyframes pixelKeeperIdle{0%,49%{transform:translateY(0)}50%,100%{transform:translateY(-5px)}}
@keyframes pixelHeroIdle{0%,49%{transform:translateY(0)}50%,100%{transform:translateY(-3px)}}
@keyframes pixelAura{0%{opacity:.45;transform:scale(.94)}50%{opacity:.8;transform:scale(1.04)}100%{opacity:.45;transform:scale(.94)}}
@keyframes pixelOrbit{0%,100%{transform:translate(0,0)}25%{transform:translate(5px,-5px)}50%{transform:translate(0,-9px)}75%{transform:translate(-5px,-4px)}}
@keyframes pixelKeeperHit{0%{transform:translateX(0);filter:brightness(1)}25%{transform:translateX(18px);filter:brightness(2) saturate(.4)}50%{transform:translateX(-12px)}75%{transform:translateX(7px)}100%{transform:translateX(0);filter:brightness(1)}}
@keyframes pixelKeeperDefeat{0%{transform:translateY(0) scale(1);opacity:1;filter:none}55%{transform:translateY(-18px) scale(.85);opacity:.9;filter:brightness(1.8)}100%{transform:translateY(-70px) scale(.2);opacity:0;filter:blur(2px)}}
@keyframes pixelFloorGlow{0%,100%{opacity:.22}50%{opacity:.62}}

@media(max-width:1050px){
    .pixel-world{aspect-ratio:16/9}.pixel-boss-arena{min-height:0;aspect-ratio:16/9}
    .keeper-pixel{width:clamp(125px,19vw,190px)}.hero-pixel{width:clamp(90px,13vw,135px)}
}
@media(max-width:700px){
    .pixel-world{aspect-ratio:4/3}.pixel-stage{object-fit:cover}.world-npc{right:8%;bottom:7%;width:66px}.pixel-speech-bubble{right:2%;bottom:28%;max-width:175px;padding:7px 9px}.pixel-speech-bubble b{font-size:15px}
    .pixel-progress-orb{width:68px;height:68px}.pixel-progress-orb b{font-size:18px}.pixel-world-hud{top:11px;right:11px}.pixel-frame-corners{inset:5px}
    .pixel-boss-arena{aspect-ratio:4/3}.pixel-library-scene{object-fit:cover}.pixel-library-label{left:5%;top:17%;font-size:11px;padding:4px 6px}
    .keeper-pixel{left:55%;top:21%;width:105px}.hero-pixel{left:34%;bottom:6%;width:76px}.keeper-pixel .orbit-word{font-size:11px;padding:3px 5px}.hero-shield-letter{font-size:17px}
}