:root{--bg: #f4f3f0;--bg-2: #efeee9;--surface: #ffffff;--surface-2: #faf9f6;--surface-3: #f1efe9;--ink: #15181d;--ink-2: #565b66;--ink-3: #898e99;--line: rgba(21, 24, 29, .1);--line-2: rgba(21, 24, 29, .06);--accent: #ef6f53;--accent-deep: color-mix(in srgb, var(--accent) 76%, #000 24%);--accent-soft: color-mix(in srgb, var(--accent) 12%, transparent);--accent-ink: #ffffff;--sky-1: #f7f6f2;--sky-2: #eceae3;--star: rgba(21,24,29,.1);--radius: 16px;--maxw: 1180px;--font: "IBM Plex Sans JP", system-ui, sans-serif;--mono: "IBM Plex Mono", ui-monospace, monospace;--round: "Zen Maru Gothic", "IBM Plex Sans JP", sans-serif;--fx-scale: 1}[data-theme=dark]{--bg: #111322;--bg-2: #0c0e1a;--surface: #1a1d31;--surface-2: #20243b;--surface-3: #262a44;--ink: #eef0f7;--ink-2: #aab0c6;--ink-3: #6f7591;--line: rgba(255,255,255,.12);--line-2: rgba(255,255,255,.06);--accent-soft: color-mix(in srgb, var(--accent) 24%, transparent);--sky-1: #161a30;--sky-2: #0b0d18;--star: rgba(255,255,255,.16)}[data-intensity=calm]{--fx-scale: .72}[data-intensity=lively]{--fx-scale: 1.32}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:var(--font);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow:hidden;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}a{color:inherit;text-decoration:none}button{font-family:inherit}.gate{position:fixed;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:clamp(18px,3vw,34px);background:radial-gradient(120% 80% at 50% -6%,var(--bg-2) 0%,var(--bg) 60%);transition:opacity .5s ease,visibility .5s}.gate.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.gate:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(to right,var(--line-2) 1px,transparent 1px),linear-gradient(to bottom,var(--line-2) 1px,transparent 1px);background-size:72px 72px;-webkit-mask-image:radial-gradient(120% 75% at 50% -8%,#000,transparent 72%);mask-image:radial-gradient(120% 75% at 50% -8%,#000,transparent 72%)}.gate__bar{position:relative;z-index:1;width:100%;max-width:var(--maxw);display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:11px}.brand__mark{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:50%;background:var(--surface);border:1px solid var(--line);color:var(--accent);position:relative;overflow:hidden}.brand__mark:before{content:"";position:absolute;width:30px;height:11px;border-radius:50%;border:2px solid currentColor;opacity:.55;transform:rotate(-22deg)}.brand__mark:after{content:"";width:15px;height:15px;border-radius:50%;background:currentColor}.brand__txt{line-height:1.15}.brand__name{font-family:var(--round);font-size:15px;font-weight:700;letter-spacing:.04em}.brand__sub{font-family:var(--mono);font-size:10.5px;letter-spacing:.22em;color:var(--ink-3);text-transform:uppercase}.gate__url{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--ink-3);padding:7px 12px;border-radius:9px;border:1px solid var(--line);background:var(--surface)}.gate__hero{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:clamp(14px,2.4vw,26px);margin:auto 0}.planet{position:relative;width:clamp(132px,20vw,196px);height:clamp(132px,20vw,196px);animation:planetFloat 5.5s ease-in-out infinite}.planet__body{position:absolute;inset:0;border-radius:50%;background:radial-gradient(60% 55% at 34% 30%,#ffd58a 0%,var(--accent) 46%,var(--accent-deep) 100%);box-shadow:inset -14px -16px 34px #78281457,inset 10px 12px 26px #ffffff80,0 24px 50px -22px color-mix(in srgb,var(--accent) 70%,#000 18%)}.planet__body:after{content:"";position:absolute;inset:0;border-radius:50%;opacity:.5;background:radial-gradient(circle at 64% 38%,rgba(120,40,20,.28) 0 9px,transparent 10px),radial-gradient(circle at 40% 66%,rgba(120,40,20,.22) 0 13px,transparent 14px),radial-gradient(circle at 30% 44%,rgba(255,255,255,.4) 0 6px,transparent 7px)}.planet__ring{position:absolute;left:50%;top:50%;width:172%;height:56%;transform:translate(-50%,-50%) rotate(-20deg);border-radius:50%;border:9px solid color-mix(in srgb,var(--accent) 52%,#fff 32%);opacity:.8}.planet__moon{position:absolute;width:26px;height:26px;border-radius:50%;background:radial-gradient(60% 60% at 36% 34%,#fff,#c9ccd8 70%,#9aa0b4);top:6%;right:-6%;box-shadow:0 6px 14px -6px #0006;animation:moonOrbit 5.5s ease-in-out infinite}.planet__spark{position:absolute;color:var(--accent);opacity:0;animation:twinkle 3s ease-in-out infinite}.planet__spark svg{width:100%;height:100%;display:block}.planet__spark.s1{width:20px;height:20px;top:-6%;left:8%;animation-delay:.2s}.planet__spark.s2{width:14px;height:14px;bottom:2%;left:-8%;animation-delay:1.1s;color:#2f7dd1}.planet__spark.s3{width:16px;height:16px;bottom:14%;right:-10%;animation-delay:1.9s;color:#3fa66a}.gate__title{font-family:var(--round);font-weight:700;font-size:clamp(34px,6.4vw,64px);letter-spacing:.04em;line-height:1.04;color:var(--ink)}.gate__title .dot{color:var(--accent)}.gate__lead{font-size:clamp(14px,1.8vw,18px);color:var(--ink-2);line-height:1.7;max-width:34ch;text-wrap:balance}.gate__keys{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;max-width:560px}.keychip{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border-radius:999px;border:1px solid var(--line);background:var(--surface);font-size:12.5px;color:var(--ink-2)}.keychip kbd{font-family:var(--mono);font-size:11px;font-weight:600;padding:2px 7px;border-radius:6px;background:var(--bg-2);border:1px solid var(--line);color:var(--ink)}.playbtn{display:inline-flex;align-items:center;gap:12px;font-family:var(--round);font-weight:700;font-size:clamp(19px,2.4vw,24px);letter-spacing:.08em;color:var(--accent-ink);padding:16px 38px;border:none;border-radius:999px;cursor:pointer;background:linear-gradient(180deg,var(--accent),var(--accent-deep));box-shadow:0 16px 34px -14px color-mix(in srgb,var(--accent) 75%,#000 10%),inset 0 2px #fff6;transition:transform .16s cubic-bezier(.3,.7,.4,1.4),box-shadow .16s}.playbtn:hover{transform:translateY(-2px) scale(1.02)}.playbtn:active{transform:translateY(0) scale(.98)}.playbtn svg{width:26px;height:26px}.gate__foot{position:relative;z-index:1;width:100%;max-width:var(--maxw);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;color:var(--ink-3);font-size:12px}.gate__foot .u{font-family:var(--mono);color:var(--ink-2)}.stage{position:fixed;inset:0;z-index:1;background:radial-gradient(130% 100% at 50% 0%,var(--sky-1),var(--sky-2));overflow:hidden;cursor:pointer}.stage:before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(var(--star) 1.4px,transparent 1.6px),radial-gradient(var(--star) 1px,transparent 1.2px);background-size:62px 62px,113px 113px;background-position:0 0,30px 40px;opacity:.8}.fxlayer{position:absolute;inset:0;z-index:2;pointer-events:none}.fxlayer--vehicles{z-index:3}.fxlayer--confetti{z-index:4}.bgflash{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;border-radius:0}.bgflash.go{animation:bgFlash .9s ease-out}.stagebar{position:absolute;top:0;left:0;right:0;z-index:6;display:flex;align-items:flex-start;justify-content:space-between;padding:clamp(12px,2vw,20px);pointer-events:none}.stagebar>*{pointer-events:auto}.stagebar__right{display:flex;gap:9px}.iconbtn{width:42px;height:42px;flex:none;display:grid;place-items:center;border-radius:12px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 80%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:var(--ink-2);cursor:pointer;position:relative;opacity:.5;transition:opacity .2s,color .18s,border-color .18s,transform .18s}.iconbtn:hover{opacity:1;color:var(--ink);border-color:var(--ink-3);transform:translateY(-1px)}.iconbtn svg{width:20px;height:20px}.iconbtn .tip{position:absolute;top:48px;left:50%;transform:translate(-50%);font-size:11px;letter-spacing:.04em;white-space:nowrap;background:var(--ink);color:var(--bg);padding:4px 8px;border-radius:6px;opacity:0;pointer-events:none;transition:opacity .15s}.iconbtn:hover .tip{opacity:.95}.iconbtn .tip.right{left:auto;right:0;transform:none}.stagehint{position:absolute;left:50%;bottom:clamp(26px,6vh,64px);transform:translate(-50%);z-index:5;pointer-events:none;text-align:center;font-family:var(--round);font-weight:500;font-size:clamp(15px,2vw,20px);letter-spacing:.06em;color:var(--ink-3);display:flex;flex-direction:column;align-items:center;gap:12px;transition:opacity .6s ease;animation:hintBob 2.6s ease-in-out infinite}.stagehint.gone{opacity:0}.stagehint .kbicon{width:54px;height:38px;border-radius:9px;border:2px solid var(--ink-3);position:relative;opacity:.7}.stagehint .kbicon:before,.stagehint .kbicon:after{content:"";position:absolute;background:var(--ink-3);border-radius:2px}.stagehint .kbicon:before{left:7px;right:7px;top:8px;height:5px;opacity:.6}.stagehint .kbicon:after{left:16px;right:16px;bottom:8px;height:6px}.fx-letter{position:absolute;z-index:2;font-family:var(--round);font-weight:700;line-height:1;transform:translate(-50%,-50%) scale(0);will-change:transform,opacity;text-shadow:0 6px 0 rgba(0,0,0,.1),0 2px 14px rgba(0,0,0,.12);animation:letterPop var(--dur,1.15s) cubic-bezier(.2,.8,.3,1.2) forwards}.fx-letter .sub{display:block;font-family:var(--mono);font-weight:600;font-size:.22em;letter-spacing:.14em;opacity:.7;margin-top:.18em;text-transform:uppercase}.fx-num{position:absolute;z-index:2;bottom:0;left:0;width:var(--bs,118px);height:var(--bs,118px);display:grid;place-items:center;border-radius:24px;font-family:var(--round);font-weight:700;color:#fff;font-size:calc(var(--bs,118px) * .52);box-shadow:inset 0 -10px #00000029,inset 0 6px #ffffff52,0 14px 30px -12px #0006;transform:translate(-50%,40px) scale(.4);opacity:0;will-change:transform,opacity;animation:numRise 1.2s cubic-bezier(.18,.9,.3,1.3) forwards}.confetti-piece{position:absolute;z-index:4;left:0;top:0;font-size:var(--cs,20px);line-height:1;will-change:transform,opacity;animation:confettiFly var(--dur,1.5s) cubic-bezier(.15,.6,.4,1) forwards}.vehicle{position:absolute;z-index:3;left:0;width:var(--vw,150px);height:auto;will-change:transform;animation:vehicleRun var(--dur,1.8s) linear forwards}.vehicle svg{display:block;width:100%;height:auto;animation:vehicleBob .42s ease-in-out infinite}.vehicle.flip svg{transform:scaleX(-1)}@keyframes planetFloat{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-14px) rotate(1deg)}}@keyframes moonOrbit{0%,to{transform:translate(0) scale(1)}50%{transform:translate(-10px,14px) scale(.9)}}@keyframes twinkle{0%,to{opacity:0;transform:scale(.6)}50%{opacity:.9;transform:scale(1)}}@keyframes hintBob{0%,to{transform:translate(-50%)}50%{transform:translate(-50%,-7px)}}@keyframes letterPop{0%{transform:translate(-50%,-50%) scale(0) rotate(0);opacity:0}16%{transform:translate(-50%,-50%) scale(1.18) rotate(var(--r0,0deg));opacity:1}34%{transform:translate(-50%,-50%) scale(1) rotate(var(--r0,0deg));opacity:1}to{transform:translate(calc(-50% + var(--tx,0px)),calc(-50% + var(--ty,-90px))) scale(.86) rotate(var(--rot,0deg));opacity:0}}@keyframes numRise{0%{transform:translate(-50%,40px) scale(.4);opacity:0}22%{transform:translate(-50%,var(--rise,-180px)) scale(1.12);opacity:1}58%{transform:translate(-50%,var(--rise,-180px)) scale(1);opacity:1}to{transform:translate(-50%,calc(var(--rise,-180px) - 46px)) scale(1.45);opacity:0}}@keyframes confettiFly{0%{transform:translate(0) rotate(0) scale(var(--s,1));opacity:1}to{transform:translate(var(--dx,0px),var(--dy,200px)) rotate(var(--spin,360deg)) scale(var(--s,1));opacity:0}}@keyframes vehicleRun{0%{transform:translate(var(--from,-30vw))}to{transform:translate(var(--to,130vw))}}@keyframes vehicleBob{0%,to{transform:var(--bobbase,translateY(0)) translateY(0)}50%{transform:var(--bobbase,translateY(0)) translateY(-5px)}}@keyframes bgFlash{0%{opacity:0}28%{opacity:.5}to{opacity:0}}.scrim{position:fixed;inset:0;z-index:140;background:color-mix(in srgb,var(--ink) 40%,transparent);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .25s}.scrim.open{opacity:1;pointer-events:auto}.sheet{position:fixed;z-index:141;top:0;right:0;height:100%;width:min(380px,92vw);background:var(--surface);border-left:1px solid var(--line);box-shadow:-24px 0 60px -34px #00000080;transform:translate(100%);transition:transform .32s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;overflow-y:auto;font-family:var(--font)}.sheet.open{transform:translate(0)}.sheet__head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--surface);z-index:2}.sheet__title{font-size:16px;font-weight:600;display:flex;align-items:baseline;gap:9px;color:var(--ink)}.sheet__title .en{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);font-weight:500}.sheet__body{padding:18px 20px 36px;display:flex;flex-direction:column;gap:18px}.sheet__x{width:34px;height:34px;flex:none;padding:0;border:1px solid var(--line);background:var(--surface-2);border-radius:9px;color:var(--ink-2);cursor:pointer;display:grid;place-items:center;transition:color .14s,border-color .14s}.sheet__x:hover{color:var(--ink);border-color:var(--ink-3)}.sheet__x svg{width:17px;height:17px}.fgroup{display:flex;flex-direction:column;gap:10px}.flabel{font-size:11.5px;letter-spacing:.05em;color:var(--ink-2);display:flex;align-items:center;justify-content:space-between}.flabel .en{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}.seg{display:flex;padding:3px;gap:3px;background:var(--surface-3);border-radius:11px;border:1px solid var(--line)}.seg button{flex:1;height:36px;border:0;border-radius:8px;background:transparent;color:var(--ink-2);font-size:13px;font-weight:500;letter-spacing:.01em;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:7px;transition:color .15s;font-family:var(--font)}.seg button[aria-pressed=true]{background:var(--surface);color:var(--ink);box-shadow:0 1px 3px #00000014;border:1px solid var(--line)}.field{display:flex;flex-direction:column;gap:8px}.switch-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 14px;border-radius:11px;border:1px solid var(--line);background:var(--surface-2)}.switch-row__txt{display:flex;flex-direction:column;gap:2px;min-width:0}.switch-row__t{font-size:13.5px;font-weight:600;color:var(--ink)}.switch{position:relative;width:46px;height:26px;flex:none;border:0;border-radius:999px;background:var(--line);cursor:pointer;padding:0;transition:background .16s}.switch[aria-checked=true]{background:var(--accent)}.switch i{position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0000004d;transition:transform .16s}.switch[aria-checked=true] i{transform:translate(20px)}.swatches{display:flex;flex-wrap:wrap;gap:9px}.swatch{width:34px;height:34px;padding:0;border-radius:10px;cursor:pointer;background:var(--sw);border:2px solid transparent;box-shadow:0 0 0 1px var(--line) inset;transition:transform .12s,box-shadow .12s;position:relative}.swatch:hover{transform:translateY(-2px)}.swatch[aria-pressed=true]{box-shadow:0 0 0 2px var(--surface) inset,0 0 0 2px var(--sw)}.swatch[aria-pressed=true]:after{content:"";position:absolute;inset:0;margin:auto;width:10px;height:10px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px #0000002e}.rangeslider{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:999px;background:var(--line);outline:none;cursor:pointer}.rangeslider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:18px;height:18px;border-radius:50%;background:var(--accent);border:2px solid var(--surface);box-shadow:0 1px 4px #0000004d;cursor:pointer}.rangeslider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--accent);border:2px solid var(--surface);box-shadow:0 1px 4px #0000004d;cursor:pointer}@media(max-width:560px){.gate__url,.brand__sub{display:none}}@media(prefers-reduced-motion:reduce){.planet,.planet__moon,.planet__spark,.stagehint{animation:none}.vehicle svg{animation:none}}
