:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--ink:#191622;--paper:#fff8e8;--lime:#ddfa54;--lavender:#baabf4;color:var(--paper);background:var(--ink);font-family:Noto Sans JP,Hiragino Sans,Meiryo,sans-serif}*{box-sizing:border-box}body{margin:0}.wrap{width:min(1100px,100% - 64px);margin-inline:auto}.masthead{border-bottom:1px solid #4c4557}.brand{align-items:center;gap:10px;padding-block:12px;font-size:clamp(14px,2.8vw,17px);font-weight:900;display:flex}.hero{text-align:center;padding-block:clamp(28px,5vw,64px) 42px}h1{letter-spacing:-.07em;margin:0 0 clamp(22px,3vw,38px);font-size:clamp(36px,6vw,78px);font-weight:950;line-height:1.1}h1 em{color:var(--lime);font-style:normal;display:inline-block}.comic{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.8vw,36px);margin:0;padding:0;list-style:none;display:grid}.panel{background:var(--paper);border:2px solid var(--paper);min-width:0;color:var(--ink);border-radius:12px;grid-template-rows:1fr auto;display:grid;position:relative}.panel+.panel:before{content:"";z-index:2;background:var(--lime);clip-path:polygon(0 36%,59% 36%,59% 0,100% 50%,59% 100%,59% 64%,0 64%);width:clamp(16px,2vw,25px);height:15px;position:absolute;top:50%;right:calc(100% + clamp(2px,.6vw,8px));transform:translateY(-50%)}.panel p{margin:0;padding:12px 6px 14px;font-size:clamp(16px,2vw,24px);font-weight:900;line-height:1.35}.mobile-break{display:none}.scene{aspect-ratio:1.55;border-radius:10px 10px 0 0;place-items:center;min-height:0;display:grid;position:relative;overflow:hidden}.name-scene{background:#ffda90 radial-gradient(#9d602b44 1px,#0000 1px) 0 0/10px 10px}.example{border:2px solid var(--ink);box-shadow:4px 4px 0 var(--ink);white-space:nowrap;background:#fffefa;border-radius:8px;align-items:center;gap:.04em;padding:.35em .48em .42em;font-size:clamp(16px,2.8vw,34px);font-weight:900;display:flex;rotate:-5deg}.example span{background:#a32b38;width:2px;height:1.1em;margin-inline-start:.12em}.pencil{inset-inline-end:8%;font-size:clamp(23px,5vw,63px);line-height:1;position:absolute;bottom:9%;rotate:-12deg}.comparison-scene{background:var(--lavender);background-image:linear-gradient(#241b4423 1px,#0000 1px),linear-gradient(90deg,#241b4423 1px,#0000 1px);background-size:18px 18px}.comparison{grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:3px;display:grid;position:absolute;inset:7% 4%}.comparison figure{grid-template-rows:auto minmax(0,1fr) auto;place-items:center;height:100%;margin:0;font-weight:900;display:grid}.comparison figcaption{white-space:nowrap;font-size:clamp(10px,1.55vw,19px)}.comparison mark{color:var(--ink);border-radius:2px;margin-inline-end:1px;display:inline-block}.name-fire{background:#ffc097}.name-ice{background:#b4eeff}.comparison img{object-fit:contain;width:100%;height:100%}.comparison-arrow{font-size:clamp(12px,2.1vw,26px);font-weight:900}.attack{border:1px solid var(--ink);background:var(--paper);border-radius:5px;padding:1px 7px;font-size:clamp(10px,1.25vw,15px)}.attack b{font-size:1.22em}.fight-scene{background:radial-gradient(circle at 8% 17%,#fff9 1px,#0000 2px),radial-gradient(circle at 41% 10%,#fff9 1px,#0000 2px),radial-gradient(circle at 59% 24%,#fff9 1px,#0000 2px),radial-gradient(circle at 94% 12%,#fff9 1px,#0000 2px),linear-gradient(#221936,#4a3967)}.battle-sky{position:absolute;inset:0}.orbit{border:1px dashed #f5e4ff66;border-radius:50%;height:22%;position:absolute;inset:7% 12% auto;rotate:-7deg}.planet{top:var(--start-top);left:var(--start-left);aspect-ratio:1;background:currentColor;border-radius:50%;width:clamp(9px,1.6vw,20px);animation:9s ease-in-out infinite alternate star-position;position:absolute;translate:-50% -50%;box-shadow:0 0 12px}.planet-fire{--start-top:23%;--start-left:14%;--end-top:12%;--end-left:32%;color:#ff976e}.planet-ice{--start-top:18%;--start-left:77%;--end-top:5%;--end-left:65%;color:#91ecff;animation-delay:-9s}@keyframes star-position{0%{opacity:.55;scale:.8}to{top:var(--end-top);left:var(--end-left);opacity:1;scale:1.12}}@media (prefers-reduced-motion:reduce){.planet{animation:none}.planet-ice{opacity:.65}}.fighters{grid-template-columns:repeat(2,minmax(0,1fr));gap:5%;display:grid;position:absolute;inset:32% 7% 11%}.fighter{min-height:0;position:relative}.fighter img{top:14%;object-fit:contain;width:100%;height:86%;position:absolute;inset-inline-start:0}.health{border:2px solid var(--ink);background:linear-gradient(90deg,#3b973c 84%,#fff8e8 84%);border-radius:6px;height:clamp(7px,1vw,12px);margin-inline:12%}.fighter-cat .health{background:linear-gradient(90deg,#dd6934 47%,#fff8e8 47%)}.impact{aspect-ratio:1;clip-path:polygon(52% 0,61% 33%,88% 12%,76% 45%,100% 50%,75% 61%,91% 87%,63% 75%,51% 100%,41% 74%,14% 91%,28% 62%,0 53%,29% 44%,15% 13%,42% 31%);background:#fffef0;width:20%;position:absolute;inset:37% auto auto 40%}.impact:after{content:"";clip-path:inherit;background:#ffb136;position:absolute;inset:13%}.cheer{border:2px solid var(--ink);background:var(--paper);box-shadow:2px 2px 0 var(--ink);border-radius:10px;padding:4px 9px;font-size:clamp(12px,1.5vw,18px);font-weight:900;position:absolute;bottom:7%;right:8%;rotate:-7deg}.finish{flex-wrap:wrap;justify-content:center;align-items:center;gap:20px 32px;margin-top:30px;display:flex}.play{background:var(--lime);border:2px solid var(--ink);min-width:min(280px,100%);color:var(--ink);box-shadow:4px 4px 0 var(--lavender);border-radius:10px;justify-content:center;align-items:center;gap:22px;padding:12px 24px;font-size:clamp(23px,3vw,32px);font-weight:900;text-decoration:none;display:inline-flex}.play:hover{background:var(--paper)}.play:focus-visible{outline:2px solid var(--paper);outline-offset:6px}@media (width<=680px){.wrap{width:min(460px,100% - 32px)}.brand{padding-block:8px}.hero{padding-block:24px 26px}h1{font-size:clamp(30px,8.8vw,44px)}.comic{grid-template-columns:1fr;gap:16px}.panel{grid-template:1fr/minmax(0,1.6fr) minmax(0,1fr);align-items:center}.panel+.panel:before{top:-10px;right:50%;transform:translate(50%,-50%)rotate(90deg)}.panel p{padding:6px;font-size:clamp(13px,4.1vw,20px)}.mobile-break{display:initial}.scene{aspect-ratio:1.9;border-radius:10px 0 0 10px}.example{font-size:clamp(16px,5.4vw,27px)}.pencil{font-size:30px}.comparison figcaption{font-size:clamp(10px,3vw,15px)}.cheer{padding:2px 6px}.finish{flex-direction:column;margin-top:20px}}.landing-rank-route{--venue-size:clamp(34px, 9vw, 72px);grid-template-columns:repeat(5,minmax(0,1fr));max-width:680px;margin:clamp(20px,4vw,34px) auto 0;padding:0;list-style:none;display:grid}.landing-rank-route li{min-width:0;color:var(--paper);justify-items:center;gap:4px;font-size:clamp(9px,2vw,14px);font-weight:800;display:grid;position:relative}.landing-rank-route li:not(:last-child):before{content:"";top:calc(var(--venue-size) / 2);border-top:2px dashed #806d97;width:100%;position:absolute;left:50%}.landing-rank-route li:last-child{color:var(--lime)}.landing-rank-route img{width:var(--venue-size);height:var(--venue-size);object-fit:contain;background:#3a2e48;border:1px solid #645077;border-radius:10px;position:relative}.landing-rank-route li:last-child img{border-color:#d4a64d}
