*{box-sizing:border-box}html,body{margin:0;height:100%;background:#05070b;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{overflow:hidden}button,input{font:inherit}.app{width:min(100%,540px);height:100svh;margin:auto;background:#081019;position:relative;overflow:hidden}.screen{display:none;height:100%;overflow:hidden}.screen.on{display:block}.pad{padding:18px}.ey{font-size:10px;letter-spacing:.17em;text-transform:uppercase;color:#aab4c2;font-weight:900}.title{font-size:30px;line-height:1.02;letter-spacing:-.045em;margin:6px 0 8px}.muted{font-size:12px;line-height:1.4;color:#9fa9b7}.btn{width:100%;min-height:54px;border:0;border-radius:18px;padding:12px 16px;font-weight:950;background:#fff;color:#091018;cursor:pointer}.btn.gold{background:linear-gradient(135deg,#f5cc62,#ffe18a);box-shadow:0 10px 26px #f5cc6225}.btn.dark{background:#141b24;color:#fff;border:1px solid #ffffff18}.ico{width:43px;height:43px;border-radius:14px;border:1px solid #ffffff18;background:#121923;color:#fff;font-weight:900}.pill{padding:8px 11px;border-radius:99px;background:#0e151fcc;border:1px solid #ffffff18;font-size:11px;font-weight:900}.row{display:flex;gap:8px;align-items:center}.top{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;gap:8px}.progress{height:6px;background:#ffffff12;border-radius:99px;overflow:hidden;margin:0 12px 8px}.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,#f3ca5f,#fff0a3);transition:.35s}
.hero{display:none;background:radial-gradient(circle at 18% 16%,#d9774344,transparent 30%),radial-gradient(circle at 83% 25%,#536adf40,transparent 34%),linear-gradient(155deg,#1a2532,#080c12 70%)}.hero.on{display:flex;flex-direction:column;justify-content:space-between}.logo{font-size:72px;line-height:.78;letter-spacing:-.08em;font-weight:950}.logo b{color:#f4ce65}.heroArt{text-align:center;font-size:86px;filter:drop-shadow(0 18px 25px #0008);animation:float 3.3s ease-in-out infinite}.lead{text-align:center;font-size:18px;line-height:1.35;font-weight:850}@keyframes float{50%{transform:translateY(-9px) rotate(1deg)}}@keyframes charFloat{0%,100%{transform:translateX(-50%) translateY(0) rotate(0deg)}50%{transform:translateX(-50%) translateY(-4px) rotate(.2deg)}}
.chars{overflow:hidden!important;background:radial-gradient(circle at 50% 8%,#74d9ff24,transparent 28%),linear-gradient(#09172e,#0a2d3f 64%,#07151d)}.charWrap{height:100%;padding:10px 12px 12px;display:flex;flex-direction:column;min-height:0;overflow:hidden}.charWrap .title,.charWrap .muted{text-align:center}.charWrap .title{font-size:26px;margin:4px 0 5px}.charWrap .muted{font-size:10px;line-height:1.25;margin:0 0 7px}.charPanel{border:1px solid #ffffff20;background:#ffffff09;border-radius:28px;padding:9px;box-shadow:0 16px 34px #0006;flex:0 0 auto}.charMeta{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;margin-bottom:6px}.chip{padding:6px 10px;border-radius:99px;background:#10334a;border:1px solid #ffffff1b;font-size:11px;font-weight:900}.chip.count{background:linear-gradient(#ff6fbe,#d94a9f)}.stage{height:clamp(270px,39svh,315px);position:relative;overflow:hidden;border-radius:32px;background:linear-gradient(#102744,#173a59 38%,#1b5971 72%,#39c9ed);box-shadow:inset 0 0 70px #000a;perspective:900px;transform-style:preserve-3d;touch-action:pan-y}.stage:after{content:"";position:absolute;left:18%;right:18%;bottom:34px;height:54px;border-radius:50%;background:radial-gradient(ellipse,#47ebff99 0,#23d8ff55 35%,transparent 72%);box-shadow:0 0 28px #5befff66}.spot{position:absolute;top:-24px;width:46%;height:180px;background:linear-gradient(#fff7,transparent);clip-path:polygon(45% 0,55% 0,86% 100%,14% 100%);opacity:.55}.spot.l{left:7%}.spot.r{right:7%}.peek,.mainChar{position:absolute;object-fit:contain;filter:drop-shadow(0 18px 18px #000a);user-select:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-style:preserve-3d}.mainChar{z-index:5;width:210px;height:220px;left:50%;top:47px;transform:translateX(-50%);animation:charFloat 3.6s ease-in-out infinite;will-change:transform,opacity}.peek{z-index:3;width:105px;height:165px;top:82px;opacity:.58;filter:saturate(.55) brightness(.78) drop-shadow(0 15px 16px #0009);cursor:pointer;will-change:transform,opacity,filter}.peek.prev{left:-5px;transform:rotateY(22deg)}.peek.next{right:-5px;transform:rotateY(-22deg)}.stage.isTurning .arrow,.stage.isTurning .peek{pointer-events:none}.stage.isTurning .mainChar{animation:none!important}.stage.isTurning{cursor:grabbing}.arrow{position:absolute;z-index:8;top:58%;transform:translateY(-50%);width:54px;height:54px;border-radius:50%;border:2px solid #fff0b0;background:linear-gradient(#ffd75c,#e99b00);color:#714600;font-size:32px;font-weight:950;box-shadow:0 7px 0 #9d6500}.arrow.prev{left:12px}.arrow.next{right:12px}.charName{position:absolute;z-index:7;bottom:57px;left:50%;transform:translateX(-50%);font-size:27px;font-weight:950;white-space:nowrap;text-shadow:0 3px 10px #000}.charRole{position:absolute;z-index:7;bottom:32px;left:50%;transform:translateX(-50%);padding:6px 13px;border-radius:99px;background:#0b334bdc;border:1px solid #a7ecff44;font-size:12px;font-weight:850;white-space:nowrap}.dots{position:absolute;z-index:7;bottom:11px;left:50%;transform:translateX(-50%);display:flex;gap:7px}.dots i{width:8px;height:8px;border-radius:50%;background:#ffffff44}.dots i.on{background:#fff;box-shadow:0 0 9px #7cecff}.pickBtn{margin-top:8px;min-height:48px;background:linear-gradient(#ff79c6,#d94da4);color:#fff;box-shadow:0 8px 0 #8e2a61;font-size:21px}.charInfo{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:8px;min-height:0;flex:1;align-content:start}.charInfo .box{min-width:0}.charInfo .box:last-child{grid-column:1/-1}.box{border:1px solid #ffffff17;background:#0c1823c9;border-radius:16px;padding:8px}.stats .stat{margin:5px 0;font-size:9px}.stats .stat b{display:flex;justify-content:space-between}.meter{height:6px;border-radius:99px;background:#ffffff13;overflow:hidden;margin-top:4px}.meter i{display:block;height:100%;background:linear-gradient(90deg,#68dffb,#ffe17a)}.items{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.item{text-align:center;padding:5px 3px;border-radius:12px;background:#ffffff09;font-size:8px}.item span{display:block;font-size:22px}.lore{text-align:center;font-size:10px;line-height:1.3}.lore b{display:block;font-size:13px;margin-bottom:3px}
@media(max-height:760px){.charWrap{padding:8px 10px 10px}.charWrap .title{font-size:23px}.charWrap .muted{display:none}.stage{height:clamp(245px,38svh,285px)}.mainChar{width:190px;height:200px;top:42px}.peek{width:92px;height:145px;top:76px}.charName{font-size:24px;bottom:51px}.charRole{font-size:10px;bottom:29px}.arrow{width:50px;height:50px;font-size:29px}.pickBtn{min-height:45px;font-size:18px}.charInfo{gap:5px;margin-top:6px}.box{padding:7px}.lore{font-size:9px}.items .item{padding:4px 2px}.item span{font-size:19px}}@media(max-height:670px){.charWrap .ey{display:none}.charWrap .title{font-size:21px}.stage{height:235px}.mainChar{width:175px;height:180px;top:36px}.peek{width:82px;height:128px;top:68px}.charName{font-size:22px}.charRole{display:none}.dots{bottom:9px}.charInfo{grid-template-columns:1fr 1fr}.charInfo .box:last-child{grid-column:1/-1}.lore{display:none}}@media(prefers-reduced-motion:reduce){.mainChar{animation:none!important}}.map{overflow-y:auto!important;background:#08131a}.mapHead{padding:0 14px 10px}.guide{display:flex;gap:10px;align-items:center}.guide img{width:68px;height:78px;object-fit:contain}.worldMap{padding:0 10px 28px;position:relative}.world{height:360px;position:relative;overflow:hidden;border-radius:28px;margin-bottom:11px;border:1px solid #ffffff17;box-shadow:0 18px 34px #0008}.world .shade{position:absolute;inset:0;background:linear-gradient(180deg,#0002,#0000 38%,#0008);z-index:1}.worldTitle{position:absolute;z-index:8;left:16px;top:15px;padding:7px 11px;border-radius:99px;background:#071019ce;border:1px solid #ffffff22;font-size:11px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.env{position:absolute;object-fit:contain;filter:drop-shadow(0 13px 13px #0009);z-index:2}.env.a{width:52%;height:52%;left:-4%;bottom:0}.env.b{width:55%;height:48%;right:-3%;bottom:8%}.env.c{width:34%;height:34%;left:34%;top:20%;opacity:.9}.node{position:absolute;z-index:9;left:50%;top:56%;transform:translate(-50%,-50%);width:88px;height:88px;border-radius:30px;border:1px solid #ffffff33;background:linear-gradient(#273342,#101720);color:#fff;font-size:35px;box-shadow:0 16px 26px #0009}.node.lock{filter:grayscale(1);opacity:.55}.node.current{outline:3px solid #f5cf68;animation:pulse 1.8s ease-in-out infinite}.node.done{background:linear-gradient(#68552e,#201d17);border-color:#f2ce68aa}.bossBadge{position:absolute;right:12px;bottom:12px;z-index:8;padding:7px 10px;border-radius:99px;background:#160d1be6;border:1px solid #c883ff55;font-size:10px;font-weight:900}@keyframes pulse{50%{box-shadow:0 0 0 13px #f5cf6818,0 16px 26px #0009}}.quiz.on{display:flex;flex-direction:column;background:radial-gradient(circle at 50% 0,#253a4d77,transparent 30%),linear-gradient(#101821,#06090d)}.qbody{flex:1;min-height:0;padding:6px 11px calc(12px + env(safe-area-inset-bottom));display:flex;flex-direction:column}.qbody h2{font-size:21px;line-height:1.08;margin:3px 0 7px}.bigArt{flex:0 0 min(38svh,320px);min-height:210px;border-radius:20px;border:1px solid #ffffff16;background:radial-gradient(circle,#222e3a,#07090c 72%);display:grid;place-items:center;overflow:hidden;margin-bottom:8px;position:relative}.bigArt img{width:100%;height:100%;object-fit:contain;padding:4px;filter:drop-shadow(0 10px 12px #0008)}.answers{display:grid;grid-template-columns:1fr 1fr;gap:7px}.answers button{min-height:52px;border-radius:15px;border:1px solid #ffffff16;background:#151d27;color:#fff;padding:8px;font-size:11px;font-weight:850}.answers button.ok{border-color:#6fd092;background:#183326}.answers button.bad{border-color:#e36e6e;background:#351b1b}.imageGrid{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:8px}.imageChoice{border:1px solid #ffffff16;background:#111923;border-radius:18px;padding:5px;color:#fff;overflow:hidden;display:flex;flex-direction:column;min-height:0}.imageChoice img{width:100%;flex:1;min-height:130px;object-fit:contain;border-radius:13px;background:#080a0e}.imageChoice span{padding:5px 4px 2px;font-size:10px;font-weight:850}.clues{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:7px}.clue{padding:9px 5px;border-radius:13px;background:#2b2417;border:1px solid #f4ce6638;text-align:center;font-size:9px;font-weight:850}.reward{position:absolute;z-index:100;left:50%;top:34%;transform:translate(-50%,-50%) scale(.7);opacity:0;pointer-events:none;padding:15px 18px;border-radius:18px;background:#0b131cea;border:1px solid #f4cf68aa;font-size:22px;font-weight:950;color:#ffe28a}.reward.show{animation:reward 1.2s ease-out}@keyframes reward{20%{opacity:1;transform:translate(-50%,-50%) scale(1.08)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-75%) scale(.94)}}.lab{display:none;position:absolute;inset:0;z-index:60;background:linear-gradient(#0b131c,#06090d);overflow-y:auto}.lab.on{display:block}.labIn{padding:16px}.swatchRow{display:grid;grid-template-columns:1fr 1fr;gap:10px}.swatchBox{height:100px;border-radius:20px;border:1px solid #ffffff20;display:grid;place-items:end center;padding:8px;font-size:10px;font-weight:900}.slider{margin:15px 0}.slider label{display:flex;justify-content:space-between;font-size:11px;font-weight:900;margin-bottom:6px}.slider input{width:100%}.toneDots{display:flex;justify-content:center;gap:8px;margin:13px 0}.toneDots i{width:11px;height:11px;border-radius:50%;background:#ffffff25}.toneDots i.on{background:#f4cf68;box-shadow:0 0 9px #f4cf68}.accuracy{text-align:center;font-size:38px;font-weight:950;margin:8px 0}.bonus{text-align:center;color:#ffe28c;font-size:13px;font-weight:900;min-height:20px}.boss{overflow:hidden;background:radial-gradient(circle at 50% 28%,#7935a644,transparent 32%),linear-gradient(#120d1a,#05070b)}.bossTop{padding:14px}.bossArena{height:390px;position:relative;overflow:hidden;border-radius:26px;border:1px solid #ffffff18;background:radial-gradient(circle at 50% 55%,#963ce532,transparent 34%),#0a0d13}.bossImg{position:absolute;width:68%;height:70%;left:50%;top:8%;transform:translateX(-50%);object-fit:contain;filter:drop-shadow(0 20px 25px #000d);animation:bossFloat 2.4s ease-in-out infinite}.boss.hit .bossImg{animation:hit .5s ease}.bossPlayer{position:absolute;width:100px;height:120px;object-fit:contain;left:6%;bottom:3%;filter:drop-shadow(0 12px 12px #000b)}.hp{position:absolute;left:8%;right:8%;top:14px;height:10px;border-radius:99px;background:#ffffff12;overflow:hidden;z-index:4}.hp i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#d64b65,#ff906f);transition:.5s}.bossName{position:absolute;z-index:4;left:50%;bottom:19%;transform:translateX(-50%);font-size:22px;font-weight:950;text-align:center;width:90%;text-shadow:0 3px 13px #000}.particles{position:absolute;inset:0;pointer-events:none}.particles span{position:absolute;animation:orb 2.5s ease-in-out infinite alternate}.bossQ{padding:11px 14px}.bossQ h2{font-size:19px;margin:5px 0 9px}.bossAns{display:grid;grid-template-columns:1fr 1fr;gap:7px}.bossAns button{min-height:50px;border-radius:14px;border:1px solid #ffffff18;background:#171321;color:#fff;padding:8px;font-size:11px;font-weight:850}@keyframes bossFloat{50%{transform:translateX(-50%) translateY(-9px) scale(1.025)}}@keyframes hit{25%{transform:translateX(-55%) rotate(-4deg);filter:brightness(1.8)}50%{transform:translateX(-45%) rotate(4deg)}100%{transform:translateX(-50%)}}@keyframes orb{to{transform:translateY(-18px) scale(1.35);opacity:.35}}.result{overflow-y:auto!important;background:radial-gradient(circle at 50% 25%,#f1c65a3d,transparent 30%),linear-gradient(#141a23,#06090d);text-align:center}.ring{width:130px;height:130px;border-radius:50%;margin:16px auto;display:grid;place-items:center;background:conic-gradient(#f4ce65 0deg,#252b34 0);position:relative}.ring:after{content:"";position:absolute;inset:12px;border-radius:50%;background:#0c1118}.ring b{z-index:1;font-size:25px}.resultChar{width:130px;height:150px;object-fit:contain;filter:drop-shadow(0 14px 14px #000a)}@media(max-height:740px){.stage{height:330px}.mainChar{height:205px;top:55px}.peek{height:160px;top:88px}.charName{bottom:62px}.world{height:330px}.bigArt{min-height:180px;flex-basis:31svh}.bossArena{height:330px}.bossImg{height:65%}}@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}