:root{--c:#75efff;--r:#ff6b61;--ink:#e9fbff;--mut:#78959e;--line:#284751}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#03090e;color:var(--ink);font-family:Inter,"PingFang TC",sans-serif}button{font:inherit}.hidden{display:none!important}#app,#stage,#stage canvas{position:absolute;inset:0;width:100%;height:100%}.shade{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle,transparent 45%,#010509bb);z-index:2}.screen{position:absolute;inset:0;z-index:20}.intro{background:radial-gradient(circle at 72% 45%,#173b47,#071821 35%,#02070b 72%)}.moon{position:absolute;right:5%;top:50%;width:min(52vw,680px);aspect-ratio:1;transform:translateY(-50%);border-radius:50%;background:#9eeaf3;box-shadow:0 0 100px #70eafa55}.moon:after{content:"";position:absolute;inset:-2%;border-radius:50%;background:#041018;transform:translate(15%,-10%)}.hero{position:absolute;left:9vw;top:50%;transform:translateY(-52%);z-index:2}.hero p,.card>p,.guide>p{font-size:10px;letter-spacing:.35em;color:var(--c);font-weight:bold}.hero h1{font:clamp(74px,10vw,140px)/.78 Georgia,serif;margin:20px 0}.hero h1 em{display:block;margin-left:.5em;color:transparent;-webkit-text-stroke:1px #a9f7ff;font-style:normal}.hero>span{display:block;color:#9ab4bc;letter-spacing:.1em}.hero button,.card button{margin-top:25px;width:250px;padding:16px 18px;display:flex;justify-content:space-between;border:1px solid #65d9e5;background:#83ecf5;color:#061116;font-weight:bold;cursor:pointer}.hero kbd,.card kbd{font-size:9px}.hero+aside{position:absolute;right:5%;bottom:5%;z-index:2;border-left:1px solid var(--c);padding-left:16px;color:#78959e;font-size:11px;line-height:2}.hero+aside b{display:block;color:#dffaff;font:20px Georgia,serif}header{position:absolute;z-index:8;left:0;right:0;top:0;height:75px;padding:20px 30px;display:grid;grid-template-columns:1fr auto 1fr;background:linear-gradient(#02090ddd,transparent)}header>b{font:19px Georgia,serif;letter-spacing:.15em}header button{justify-self:end;width:32px;height:32px;border:1px solid var(--line);border-radius:50%;background:#091821;color:#8aa6ae}#steps{display:flex;gap:8px;padding-top:10px}#steps i{width:40px;height:3px;background:#263f48;transform:skewX(-20deg)}#steps .done{background:var(--c)}#steps .now{background:#ffd17a}.unit{position:absolute;z-index:7;width:min(410px,38vw)}.enemy{right:35px;top:95px;text-align:right}.player{left:35px;bottom:220px}.unit>div:first-child{display:flex;gap:9px;align-items:center}.enemy>div:first-child{justify-content:flex-end}.unit h2{margin:0;font:23px Georgia,serif}.unit i{padding:4px 8px;border:1px solid;font-size:9px;font-style:normal}.unit .hp{height:10px;margin-top:8px;background:#071319;border:1px solid var(--line);position:relative;overflow:hidden;transform:skewX(-16deg)}.unit .hp span,.unit .hp em{position:absolute;inset:0 auto 0 0;width:100%;background:linear-gradient(90deg,#dd4949,#ff8771);transition:.5s}.unit .hp em{width:0;background:#68eaffaa}.unit small{font-size:10px}.unit p{margin:7px 0;color:#6f8b94;font-size:10px}.states span{display:inline-block;margin:2px;padding:3px 6px;background:#10242d;border:1px solid #36525c;font-size:9px}.command{position:absolute;z-index:9;bottom:20px;left:50%;transform:translateX(-50%);width:min(1040px,calc(100vw - 50px));display:grid;grid-template-columns:170px 1fr;gap:8px}.turn{grid-row:1/3;padding:15px;border-left:3px solid var(--c);background:#07161dde}.turn small,.turn b{display:block}.turn small{color:#6d8c95;font-size:9px;letter-spacing:.2em}.turn b{margin-top:10px;font:17px Georgia,serif}.skills{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.skill{text-align:left;padding:11px;border:1px solid var(--line);background:#0a1d25e8;color:var(--ink);cursor:pointer;min-height:65px}.skill:hover:not(:disabled){border-color:var(--c);transform:translateY(-2px)}.skill:disabled{opacity:.35}.skill b,.skill small{display:block}.skill small{margin-top:7px;color:#718f98}.skill em{float:right;font-size:9px;color:#66818a}.good{color:#7ef5a6!important}.bad{color:#ff8d83!important}.info{padding:8px 12px;background:#061118de;border:1px solid #1d3640;color:#819da5;font-size:10px}.message{position:absolute;z-index:13;left:50%;top:46%;transform:translate(-50%,-50%);width:min(520px,72vw);padding:17px;text-align:center;background:#030b10ed;border-block:1px solid #477481}.message small,.message b,.message span{display:block}.message small{color:var(--c);font-size:9px;letter-spacing:.25em}.message b{margin:7px;font:25px Georgia,serif}.message span{font-size:11px;color:#8da8b0}.damage{position:absolute;z-index:14;font:bold 33px Georgia;color:white;text-shadow:0 3px 12px #000;animation:pop 1s forwards}.damage.left{left:27%;top:50%;color:#ff776e}.damage.right{right:27%;top:30%}.damage.heal{color:#72f6a7}@keyframes pop{to{transform:translateY(-65px);opacity:0}}.overlay{display:grid;place-items:center;background:#02080cdd;backdrop-filter:blur(9px)}.card{text-align:center;width:min(760px,90vw)}.card h2{font:clamp(44px,6vw,72px) Georgia,serif;margin:12px}.card>em{display:block;color:#89a5ad;font-style:normal}.card button{margin:24px auto}.vs{display:grid;grid-template-columns:1fr 60px 1fr;align-items:center;margin:28px 0}.vs span{padding:22px;border:1px solid var(--line);background:#081820}.vs small,.vs b,.vs i{display:block}.vs b{margin:9px;font:27px Georgia,serif}.vs i{color:#718d96;font-style:normal}.vs>strong{color:var(--r);font:italic 23px Georgia,serif}.evo{background:radial-gradient(circle,#123642f4,#02080cf8 67%)}.rings{position:absolute;width:min(60vw,620px);aspect-ratio:1;border:1px solid #74efff66;border-radius:50%;animation:spin 3s linear infinite}.rings:after{content:"";position:absolute;inset:18%;border:1px dashed #74efff77;border-radius:50%}@keyframes spin{to{transform:rotate(360deg)}}.evo .card{z-index:2}.evo .card>i{display:inline-block;padding:4px 10px;border:1px solid var(--c);color:var(--c);font-style:normal}.evo #stats,.evo #kit,#lineage{display:flex;justify-content:center;gap:7px;flex-wrap:wrap;margin:18px}.evo #stats span,.evo #kit span,#lineage span{padding:7px 10px;border:1px solid var(--line);background:#0a1e26;font-size:10px}.blood{border-color:#c6904c!important;color:#ffd28a}.guide{position:relative;width:min(700px,90vw);padding:32px;background:#081820;border:1px solid #355761}.guide>button{position:absolute;right:14px;top:8px;border:0;background:none;color:#78949c;font-size:28px}.guide h2{font:35px Georgia,serif}.guide>div{display:grid;grid-template-columns:1fr 1fr;gap:9px}.guide span{padding:13px;background:#0d252e;color:#7f9aa3;font-size:11px;line-height:1.7}.guide span b{display:block;color:#e1f8fb}.loading{position:absolute;z-index:50;inset:0;display:grid;place-items:center;background:#02080c;letter-spacing:.25em;font-size:10px;transition:.5s}.loading.off{opacity:0;pointer-events:none}.loading i{width:22px;height:22px;border:1px solid var(--line);border-top-color:var(--c);border-radius:50%;animation:spin 1s linear infinite}@media(max-width:720px){.hero+aside{display:none}.moon{right:-45%;width:100vw}.unit{width:calc(100vw - 30px)}.enemy{right:15px}.player{left:15px;bottom:280px}.command{grid-template-columns:1fr;width:calc(100vw - 18px);bottom:8px}.turn{grid-row:auto;padding:9px}.skills{grid-template-columns:1fr 1fr}.info{display:none}.guide>div{grid-template-columns:1fr}}