/* First homepage visit only. The bootstrap always releases the page within 4s. */
html.intro-active{overflow:hidden}
html.intro-active .intro-loader{display:grid}
.intro-loader{position:fixed;inset:0;z-index:200;place-items:center;background:var(--cream,#faf8f2);color:var(--ink,#4e4836);opacity:1;transition:opacity .36s ease;isolation:isolate}
.intro-scene{display:flex;flex-direction:column;align-items:center;width:min(320px,80vw);transform:translateY(-10px);transition:transform .36s ease}
.intro-logo{display:block;object-fit:contain;width:180px;height:169px;opacity:0;transform:translateY(8px)}
.intro-harvest{position:relative;width:230px;height:150px;margin-top:8px}
.intro-potato-window{position:absolute;inset:0 0 12px;overflow:hidden}
.intro-potato{position:absolute;left:47px;bottom:-91px;width:136px;height:136px;object-fit:contain;transform:translateY(0) rotate(-4deg);transform-origin:50% 85%}
.intro-soil{position:absolute;left:21px;right:21px;bottom:12px;height:1px;background:#b8b3a5;transform:scaleX(.7);opacity:0}
.intro-earth{position:absolute;bottom:15px;width:4px;height:3px;border-radius:50%;background:#a18f68;opacity:0}
.earth-one{left:72px;--earth-x:-15px;--earth-y:-14px}
.earth-two{left:153px;--earth-x:17px;--earth-y:-18px}
.earth-three{left:133px;--earth-x:8px;--earth-y:-27px;width:3px;height:3px}
.intro-caption{margin:22px 0 0;font-family:"Noto Sans JP", sans-serif;font-size:14px;line-height:1.9;letter-spacing:.13em;opacity:0;transform:translateY(5px)}
.intro-skip{position:absolute;right:36px;bottom:28px;display:inline-flex;align-items:center;gap:15px;min-height:44px;padding:8px 0;border:0;border-bottom:1px solid #c2bdaf;background:transparent;color:var(--muted,#7a7564);font-family:"Noto Sans JP", sans-serif;font-size:11px;letter-spacing:.1em;cursor:pointer}
.intro-skip span{font-size:17px}
.intro-animating .intro-logo{animation:intro-logo-in .4s ease-out both}
.intro-animating .intro-soil{animation:intro-soil-in .4s .1s ease-out both}
.intro-animating .intro-potato{animation:intro-harvest 1.1s .22s cubic-bezier(.22,1,.36,1) both}
.intro-animating .intro-earth{animation:intro-earth .42s .72s ease-out both}
.intro-animating .intro-caption{animation:intro-caption-in .4s .85s ease-out both}
html.intro-leaving .intro-loader{opacity:0;pointer-events:none}
html.intro-leaving .intro-scene{transform:translateY(-22px)}
@keyframes intro-logo-in{to{opacity:1;transform:translateY(0)}}
@keyframes intro-soil-in{to{opacity:1;transform:scaleX(1)}}
@keyframes intro-harvest{0%{transform:translateY(0) rotate(-4deg)}25%{transform:translateY(5px) rotate(3deg)}72%{transform:translateY(-104px) rotate(-5deg)}100%{transform:translateY(-98px) rotate(0)}}
@keyframes intro-earth{0%{opacity:0;transform:translate(0,0)}20%{opacity:.8}100%{opacity:0;transform:translate(var(--earth-x),var(--earth-y))}}
@keyframes intro-caption-in{to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.intro-logo{width:155px;height:146px}.intro-harvest{margin-top:4px}.intro-caption{font-size:13px}.intro-skip{right:24px;bottom:20px}}
@media(max-height:480px){.intro-scene{transform:translateY(-10px) scale(.75)}html.intro-leaving .intro-scene{transform:translateY(-22px) scale(.75)}.intro-skip{bottom:12px}}
@media(prefers-reduced-motion:reduce){html.intro-active{overflow:visible}html.intro-active .intro-loader{display:none}.intro-loader,.intro-scene{transition:none}.intro-loader *{animation:none!important}}