*{box-sizing:border-box}html,body{margin:0;height:100%;background:#05060d;color:#f4f0e8;overflow:hidden}body{font-family:Zen Maru Gothic,Hiragino Maru Gothic ProN,Hiragino Sans,sans-serif;font-weight:500;-webkit-font-smoothing:antialiased}button{font:inherit}.stage{height:100vh;height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent}.screen{--up: 0px;--fz: 0px;--grow: calc((var(--up) + var(--fz)) * 6);position:relative;width:768px;height:432px;transform:scale(var(--k, 1));transform-origin:top left;margin-right:calc(var(--sw) - 768px);margin-bottom:calc(var(--sh) - 432px);flex:none;overflow:hidden;background:#000;box-shadow:0 0 0 2px #1a1c30,0 10px 40px #000}.screen canvas{position:absolute;inset:0;width:768px;height:432px}#ui,#fx{position:absolute;inset:0}#dof,#glow{position:absolute;inset:0;width:768px;height:432px;pointer-events:none}#glow{filter:blur(8px) brightness(.7) contrast(3) saturate(1.4);mix-blend-mode:screen;opacity:.22}#dof{filter:blur(.9px) saturate(1.1);-webkit-mask-image:linear-gradient(to bottom,#000 0%,transparent 16%,transparent 84%,#000 100%);mask-image:linear-gradient(to bottom,#000 0%,transparent 16%,transparent 84%,#000 100%)}#vig{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 75% 70% at 50% 48%,transparent 55%,rgba(4,2,16,.55) 100%)}.screen[data-fx=battle] #dof,.screen[data-fx=none] #dof,.screen[data-fx=none] #glow{display:none}.screen[data-fx=battle] #glow{opacity:.45}.screen[data-fx=title] #glow{opacity:.55}.face{position:absolute;left:4px;bottom:120px;width:176px;height:176px;object-fit:cover;object-position:top;pointer-events:none;filter:drop-shadow(0 4px 0 #05060d) drop-shadow(0 0 10px rgba(0,0,0,.6));-webkit-mask-image:linear-gradient(to bottom,#000 78%,transparent 100%);mask-image:linear-gradient(to bottom,#000 78%,transparent 100%)}.face.in{animation:facein .25s ease-out}@keyframes facein{0%{opacity:0;translate:-14px 0}to{opacity:1;translate:0 0}}.msg.withface{padding-left:176px}.msg.withface .tag{left:182px}#fx{pointer-events:none}#fade{position:absolute;inset:0;background:#000;opacity:1;pointer-events:none}.shake{animation:shake .28s linear}.shake-big{animation:shake .6s linear}@keyframes shake{0%,to{translate:0 0}20%{translate:-6px 2px}40%{translate:5px -2px}60%{translate:-4px 1px}80%{translate:3px 0}}.win{position:absolute;padding:12px 20px;font-size:calc(18px + var(--up) + var(--fz));line-height:1.6;color:#f6f2ea;white-space:pre-wrap;letter-spacing:.02em;background:linear-gradient(180deg,#161e48d1,#0a0e28e6);border:1px solid rgba(240,214,150,.55);border-radius:14px;box-shadow:0 10px 28px #00000073,inset 0 1px #ffffff1f,inset 0 0 0 1px #0a0e2899;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-shadow:0 1px 2px rgba(0,0,0,.6)}.win:before{content:"";position:absolute;inset:3px;border-radius:11px;border:1px solid rgba(255,255,255,.06);pointer-events:none}.msg{top:calc(300px - var(--grow))!important;height:calc(132px + var(--grow))!important}.pstat,.stats,.party,.names,.info,.namebox,.credits{white-space:normal}.info{white-space:pre-line}.msg .tag{position:absolute;top:calc(-16px - var(--up));left:18px;padding:0 14px;font-size:calc(15px + var(--up) + var(--fz) / 2);font-weight:700;line-height:1.7;letter-spacing:.08em;background:linear-gradient(180deg,#b8404e,#7a2232);border:1px solid rgba(255,220,180,.6);border-radius:13px;box-shadow:0 4px 10px #0006}.msg .txt{min-height:84px}.msg .more{position:absolute;right:18px;bottom:8px;animation:bob .9s ease-in-out infinite;font-size:calc(12px + var(--up) * 2);color:#f0d070}@keyframes bob{50%{translate:0 3px;opacity:.6}}.msg.log .line{height:1.55em;overflow:hidden}@keyframes blink{50%{opacity:0}}.choose .ttl{font-size:calc(13px + var(--up) * 1.5 + var(--fz) / 2);color:#f0d890;margin:-4px 0 4px;letter-spacing:.1em}.choose{max-height:420px;overflow-y:auto;scrollbar-width:none}.choose.more:after{content:"▼";position:sticky;bottom:0;display:block;height:0;overflow:visible;grid-column:1 / -1;text-align:center;color:#f0d890;font-size:14px;line-height:1;transform:translateY(-15px);text-shadow:0 0 6px #0a0c22,0 0 10px #0a0c22;animation:blink 1.2s ease-in-out infinite;pointer-events:none}.choose:not(.grid) .opt{white-space:nowrap}.choose .opt{position:relative;padding:0 10px 0 14px;margin:0 -10px;display:flex;justify-content:space-between;gap:12px;border-radius:8px;transition:background .12s}.choose .opt.off{color:#7078a8}.choose .opt.sel{background:linear-gradient(90deg,#f0c86e61,#f0c86e0f);box-shadow:inset 3px 0 #f4cf70}.choose .opt.picked{background:#f0c86e29}.choose .opt .pr{color:#f0d890}.choose .opt.off .pr{color:#7078a8}.choose.grid{display:grid;column-gap:4px}.choose.grid .ttl{grid-column:1 / -1}.choose.grid .opt{padding:0 4px;margin:0;justify-content:center;white-space:nowrap;line-height:1.5}.choose.grid.spells .opt{justify-content:space-between;padding:0 10px}.choose.grid .opt.sel{box-shadow:inset 0 -2px #f4cf70}.choose.grid .opt:has(.wide){grid-column:span 2}.gold,.info{font-size:calc(16px + var(--up) * 1.34 + var(--fz))}.info .eqp{display:flex;flex-wrap:wrap;gap:4px 18px}.info .off,.eqp .off{color:#7078a8}.up{color:#8af08a;font-weight:400}.down{color:#f08a8a;font-weight:400}.names .row{display:flex;justify-content:space-between;line-height:1.55}.pstat{padding:7px 12px 6px;font-size:calc(15px + var(--up) + var(--fz) / 2);line-height:1.4;transition:transform .15s,box-shadow .15s;border-radius:12px}.pstat .nm{display:flex;justify-content:space-between;color:#fff;font-weight:700}.pstat .nm span{font-size:calc(12px + var(--up) * 1.5);font-weight:500;color:#c8c0e8}.pstat .row{display:flex;align-items:center;gap:6px;white-space:pre;font-variant-numeric:tabular-nums}.pstat .row b{font-weight:700;font-size:calc(11px + var(--up) * 2);color:#a8b0e0;min-width:14px}.pstat .bar{flex:1;height:5px;background:#00001499;border-radius:3px;overflow:hidden;box-shadow:inset 0 0 0 1px #7882c84d}.pstat .bar i{display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#3cc07a,#9af0a0);transition:width .35s ease}.pstat .bar.mp i{background:linear-gradient(90deg,#3a7ae8,#8ac8ff)}.pstat.act{border-color:#f4cf70;transform:translateY(5px);box-shadow:0 0 0 1px #f4cf70,0 0 18px #f4cf7073,0 10px 28px #00000073}.pstat .tags{display:flex;gap:3px;min-height:18px;font-size:calc(11px + var(--up) * 2);line-height:1.45}.st{font-style:normal;padding:0 5px;border-radius:8px;background:#2a2a4a;color:#fff}.st.poison{background:#7a3a9a}.st.sleep{background:#3a5a9a}.st.para{background:#9a8a2a}.st.conf{background:#9a3a6a}.st.up{background:#2a7a4a}.st.down{background:#8a3a3a}.party .row .sm{font-size:calc(13px + var(--up) * 1.5);color:#f0d890}.party .row.poison .nm{color:#d8a0f0}.pstat.low{color:#ffc060}.pstat.low .bar.hp i{background:linear-gradient(90deg,#e07a20,#f8c060)}.pstat.dead{color:#a8b0cc;filter:brightness(.8)}.pstat.dead .bar.hp i{width:0!important}.party .row{display:flex;gap:10px;line-height:1.6;font-size:calc(16px + var(--up) * 1.34 + var(--fz));white-space:pre}.party .row .nm{min-width:80px}.party .row.dead{color:#a8b0cc}.party .row.gold{justify-content:space-between;color:#f0d890}.stats .row{display:flex;gap:24px}.stats .row span{min-width:130px}.stats .row.small{font-size:calc(14px + var(--up) * 1.5);color:#c8c0e8}.pop{position:absolute;font-family:Shippori Mincho B1,serif;font-weight:800;font-size:30px;color:#fff;-webkit-text-stroke:1px rgba(20,10,30,.9);text-shadow:0 2px 0 #1a0a24,0 0 12px rgba(0,0,0,.6);animation:pop .9s cubic-bezier(.2,.9,.3,1.2) forwards;white-space:nowrap}.pop.fdmg{color:#fff}.pop.crit{color:#ffe060;font-size:38px;text-shadow:0 2px 0 #5a2a00,0 0 18px rgba(255,200,60,.8)}.pop.dmg{color:#ff7070}.pop.heal{color:#8af08a}@keyframes pop{0%{transform:translateY(8px) scale(.6);opacity:0}15%{transform:translateY(-14px) scale(1.15);opacity:1}30%{transform:translateY(-8px) scale(1)}75%{opacity:1}to{transform:translateY(-22px);opacity:0}}.banner{position:absolute;left:50%;top:30px;translate:-50% 0;padding:8px 60px;font-family:Shippori Mincho B1,serif;font-weight:800;font-size:24px;letter-spacing:.3em;color:#fff8e0;background:linear-gradient(90deg,transparent,rgba(8,12,40,.72) 22%,rgba(8,12,40,.72) 78%,transparent);border-top:1px solid;border-bottom:1px solid;border-image:linear-gradient(90deg,transparent,rgba(240,214,150,.8),transparent) 1;text-shadow:0 0 12px rgba(255,220,140,.5),0 2px 4px #000;animation:banner 2.4s ease forwards;white-space:nowrap}@keyframes banner{0%{opacity:0;translate:-50% -8px}15%,75%{opacity:1;translate:-50% 0}to{opacity:0}}.namebox{text-align:center}.namebox .ttl{font-size:calc(15px + var(--up) * 1.5);color:#f0d890}.namebox .nm{font-family:Shippori Mincho B1,serif;font-weight:800;font-size:30px;line-height:44px;letter-spacing:.15em}.title{position:absolute;inset:0;text-align:center;padding-top:70px;text-shadow:0 2px 8px rgba(0,0,0,.8)}.title .sub{font-family:Shippori Mincho B1,serif;font-size:calc(13px + var(--up) * 1.5);color:#d8d8ff;letter-spacing:.6em;opacity:.9}.title h1{margin:6px 0 0;font-family:Shippori Mincho B1,serif;font-size:72px;font-weight:800;letter-spacing:.14em;color:#fff4cc;background:linear-gradient(180deg,#fffbe8 20%,#f2c860 70%,#b07a28);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 16px rgba(255,210,120,.45)) drop-shadow(0 3px 2px rgba(20,8,30,.9))}.title .ch{margin-top:8px;font-family:Shippori Mincho B1,serif;font-size:17px;color:#f0e8ff;letter-spacing:.35em}.title .press{position:absolute;left:0;right:0;bottom:54px;font-size:calc(16px + var(--up) * 1.5);letter-spacing:.2em;animation:breathe 2.4s ease-in-out infinite}@keyframes breathe{50%{opacity:.35}}.card{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#f8f0d8;letter-spacing:.3em;text-shadow:0 0 14px rgba(255,220,140,.4);font-family:Shippori Mincho B1,serif}.card div{font-size:20px;color:#c8b8e8}.card h2{margin:12px 0 0;font-size:42px;font-weight:800}.credits{position:absolute;inset:0;overflow:hidden;color:#fff8e8;text-shadow:0 2px 6px #10082a;text-align:center;font-family:Shippori Mincho B1,serif}.credits .roll{position:absolute;left:0;right:0;top:432px;animation:roll 11s linear forwards}.credits h2{font-size:32px;font-weight:400;margin:0;letter-spacing:.15em}.credits h3{font-size:24px;font-weight:400;margin:0 0 12px;color:#fff0b8}.credits .done{font-size:22px;color:#f0d890;letter-spacing:.3em}.credits p{margin:6px;font-size:20px}.credits .sp{height:34px}.credits .small{font-size:15px;opacity:.85}@keyframes roll{to{top:70px}}.help{margin:0;font-size:13px;color:#7880a8}.pad{display:none;width:min(100vw,560px);justify-content:space-between;align-items:center;padding:0 20px}.dpad{position:relative;width:140px;height:140px}.dpad button,.ab button{position:absolute;width:48px;height:48px;border-radius:14px;border:1px solid rgba(240,214,150,.4);background:#141a46b3;color:#e0e4f8;font-size:16px;touch-action:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.dpad .u{left:46px;top:0}.dpad .d{left:46px;bottom:0}.dpad .l{left:0;top:46px}.dpad .r{right:0;top:46px}.ab{position:relative;width:140px;height:110px}.ab button{width:60px;height:60px;border-radius:50%;font-size:20px;font-weight:700;background:linear-gradient(180deg,#be3c50d9,#6e1828d9);border-color:#ffc8b480;color:#fff}.ab .a{right:0;top:0}.ab .b{left:0;bottom:0}html.touch .pad{display:flex}html.touch .help{display:none}html.touch.land .stage{gap:0}html.touch.land .pad{position:fixed;inset:0;width:auto;padding:0 max(10px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-left));align-items:flex-end;pointer-events:none}html.touch.land .pad button{pointer-events:auto}html.touch.land .dpad{width:124px;height:124px}html.touch.land .dpad button{width:44px;height:44px}html.touch.land .dpad .u,html.touch.land .dpad .d{left:40px}html.touch.land .dpad .l,html.touch.land .dpad .r{top:40px}html.touch.land .ab{width:124px;height:124px}html.touch.land .ab button{width:56px;height:56px}html.touch.land .ab .a{right:0;top:10px}html.touch.land .ab .b{left:0;bottom:0}html.rot #app{position:fixed;left:0;top:0;transform-origin:top left;overflow:hidden}html.rot .stage{height:100%}.rotHint{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:20;padding:12px 26px;border-radius:12px;background:#06081aeb;border:1px solid rgba(240,214,150,.7);font-family:Shippori Mincho B1,serif;font-size:18px;color:#fff8e0;pointer-events:none;white-space:nowrap;animation:rotHint 4.2s ease forwards}@keyframes rotHint{0%{opacity:0}10%,85%{opacity:1}to{opacity:0}}.openHint{position:absolute;left:50%;top:max(8px,env(safe-area-inset-top));translate:-50% 0;z-index:15;display:flex;align-items:flex-start;gap:10px;width:min(92%,560px);padding:10px 12px 10px 16px;border-radius:12px;background:#080c28f0;border:1px solid rgba(240,214,150,.6);color:#fff8e0;font-size:15px;line-height:1.6;box-shadow:0 6px 20px #00000080}.openHint p{margin:0;flex:1}.openHint button{flex:none;width:34px;height:34px;border-radius:50%;border:1px solid rgba(240,214,150,.5);background:#28326ee6;color:#fff;font-size:16px}.fullhint{display:none;position:fixed;left:50%;bottom:max(4px,env(safe-area-inset-bottom));translate:-50% 0;z-index:9;padding:4px 14px;font-size:15px;color:#fff8e0;background:#0a0e32d9;border:1px solid #8a7a4a;border-radius:12px;pointer-events:none}.fullhint.show{display:block;animation:fullhintOut 6s ease forwards}@keyframes fullhintOut{0%,80%{opacity:1}to{opacity:0}}.screen.warp #cv,.screen.warp #glow,.screen.warp #dof{animation:warp .5s cubic-bezier(.5,0,.9,.4) forwards}@keyframes warp{0%{transform:none;filter:none}to{transform:scale(1.6) rotate(8deg);filter:blur(10px) brightness(1.8)}}.pstat{overflow:hidden}.pstat>:not(.pf){position:relative}.pstat .pf{position:absolute;right:-14px;top:-8px;width:112px;height:112px;object-fit:cover;object-position:top;opacity:.5;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 55%);mask-image:linear-gradient(90deg,transparent 0%,#000 55%)}.pstat.act .pf{opacity:.8}.pstat.dead .pf{filter:grayscale(.4) brightness(.75);opacity:.7}.cutin{position:absolute;inset:0;pointer-events:none;overflow:hidden}.cutin .band{position:absolute;left:-10%;right:-10%;top:120px;height:150px;rotate:-8deg;background:linear-gradient(90deg,#0a0c28e6,#1e245aeb 50%,#0a0c28e6),repeating-linear-gradient(90deg,rgba(255,255,255,.08) 0 2px,transparent 2px 22px);background-blend-mode:screen;border-top:2px solid var(--c);border-bottom:2px solid var(--c);box-shadow:0 0 30px color-mix(in srgb,var(--c) 50%,transparent);animation:cutband .95s cubic-bezier(.2,.8,.2,1) forwards}.cutin img{position:absolute;right:60px;top:60px;width:300px;height:300px;object-fit:cover;object-position:top;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent);filter:drop-shadow(0 0 12px color-mix(in srgb,var(--c) 70%,transparent));animation:cutface .95s cubic-bezier(.2,.8,.2,1) forwards}.cutin .sk{position:absolute;left:70px;top:170px;font-family:Shippori Mincho B1,serif;font-weight:800;font-size:40px;letter-spacing:.18em;color:#fff;text-shadow:0 0 16px var(--c),0 3px 2px #000;animation:cutname .95s cubic-bezier(.2,.8,.2,1) forwards}@keyframes cutband{0%{transform:scaleY(0);opacity:0}12%{transform:scaleY(1);opacity:1}80%{transform:scaleY(1);opacity:1}to{transform:scaleY(.2);opacity:0}}@keyframes cutface{0%{translate:260px 0;opacity:0}18%{translate:0 0;opacity:1}75%{translate:-24px 0;opacity:1}to{translate:-200px 0;opacity:0}}@keyframes cutname{0%{translate:-120px 0;opacity:0}20%{translate:0 0;opacity:1}75%{translate:16px 0;opacity:1}to{translate:60px 0;opacity:0}}.face.re{animation:facere .22s ease-out}@keyframes facere{0%{opacity:.55}to{opacity:1}}.face.x-surprise{animation:facehop .32s ease-out}@keyframes facehop{0%{translate:0 0}35%{translate:0 -10px}to{translate:0 0}}.face.x-angry{animation:faceshake .3s linear}@keyframes faceshake{0%,to{translate:0 0}25%{translate:-4px 0}50%{translate:4px 0}75%{translate:-2px 0}}.face.x-sad{animation:facesink .6s ease-out forwards}@keyframes facesink{0%{translate:0 -4px;opacity:.7}to{translate:0 3px;opacity:1}}.face.x-smile{animation:facebob .4s ease-out}@keyframes facebob{0%{scale:1}40%{scale:1.035}to{scale:1}}.face{animation-fill-mode:both}.face:not(.in):not(.re):not([class*=x-]){animation:breatheFace 4s ease-in-out infinite}@keyframes breatheFace{50%{translate:0 -1.5px}}.pstat .pf.jolt{animation:jolt .4s ease-out}@keyframes jolt{0%{translate:0 0;filter:brightness(2) saturate(.4)}30%{translate:-6px 2px}60%{translate:4px -1px}to{translate:0 0;filter:none}}.screen.tiny{--up: 3px}.screen.fz1{--fz: 2px}.screen.fz2{--fz: 4px}.screen[data-fx=map] #cv,.screen[data-fx=map] #dof,.screen[data-fx=map] #glow{scale:var(--mapzoom, 1)}html.touch.rot .dpad{width:112px;height:112px}html.touch.rot .dpad button{width:40px;height:40px}html.touch.rot .dpad .u,html.touch.rot .dpad .d{left:36px}html.touch.rot .dpad .l,html.touch.rot .dpad .r{top:36px}html.touch.rot .ab{width:112px;height:112px}html.touch.rot .ab button{width:50px;height:50px}html.rot .msg{padding-left:52px;padding-right:64px}html.rot .msg.withface{padding-left:176px}html.rot .msg .more{right:64px}html.rot .choose.leftEdge{padding-left:76px}html.rot .choose.rightEdge{padding-right:76px}
