/* The Fumbling Fellow: coming soon. Static page, no scripts, no inline styles. */
@font-face{font-family:"Press Start 2P";src:url("PressStart2P-Regular.ttf") format("truetype");font-display:swap}
:root{
  --sky1:#0a94d6;--sky2:#7dd3fc;--grass:#4ade80;--grass-edge:#22c55e;--dirt:#78350f;--dirt2:#6e300c;
  --card:rgba(15,23,42,.9);--card-edge:rgba(255,255,255,.28);--ink:#fff;--gold:#fde68a;--foot:#fde68a;
  --cloud:#fff;--cloud-a:.92;--px:min(7px,2.1vw);
  --pixel:"Press Start 2P",ui-monospace,Menlo,Consolas,monospace;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){:root{
  --sky1:#0f172a;--sky2:#1e1b4b;--grass:#16a34a;--grass-edge:#15803d;--dirt:#3a1a05;--dirt2:#321504;
  --card:rgba(2,6,23,.84);--card-edge:rgba(199,210,254,.3);--foot:#fcd9a0;
  --cloud:#475569;--cloud-a:.7;
}}
@media (min-width:700px){:root{--px:9px}}
@media (min-width:1100px){:root{--px:11px}}
*{box-sizing:border-box}
html{background:var(--dirt)}
body{margin:0;overflow-x:hidden;color:var(--ink);font:17px/1.6 var(--sans);background:var(--dirt)}
.world{min-height:100vh;min-height:100svh;display:flex;flex-direction:column}

/* sky */
.sky{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;padding:84px 16px 0;background:linear-gradient(to bottom,var(--sky1),var(--sky2))}
.celestial{position:absolute;top:26px;right:7vw;width:36px;height:36px;display:none}
@media (min-width:700px){.celestial{top:22px;width:48px;height:48px}}
.sun{display:block;background:#fde047;box-shadow:0 0 0 8px rgba(253,224,71,.35),0 0 0 16px rgba(253,224,71,.16)}
.moon{background:
  linear-gradient(#cbd5e1,#cbd5e1) 62% 20%/16% 16% no-repeat,
  linear-gradient(#cbd5e1,#cbd5e1) 20% 58%/21% 21% no-repeat,
  linear-gradient(#cbd5e1,#cbd5e1) 64% 66%/12% 12% no-repeat,
  #fef9c3;box-shadow:0 0 0 8px rgba(199,210,254,.2),0 0 0 16px rgba(199,210,254,.1)}
.stars{display:none}
@media (prefers-color-scheme:dark){
  .sun{display:none}.moon{display:block}.stars{display:block}
}
.st{position:absolute;left:0;top:0;width:4px;height:4px;opacity:.95}
.st.b{width:3px;height:3px}.st.c{width:2px;height:2px}

/* clouds */
.drift{position:absolute;left:0;right:0;top:0;height:50%;overflow:hidden;pointer-events:none}
.cloud{position:absolute;left:0;color:var(--cloud);opacity:var(--cloud-a);fill:currentColor;transform:translateX(var(--rx,10vw))}
.cloud.c1{top:15%;width:132px;--rx:6vw;animation:drift 110s linear infinite;animation-delay:-30s}
.cloud.c2{top:44%;width:88px;--rx:62vw;animation:drift 150s linear infinite;animation-delay:-95s}
.cloud.c3{top:72%;width:154px;--rx:84vw;animation:drift 190s linear infinite;animation-delay:-150s}
@keyframes drift{from{transform:translateX(-200px)}to{transform:translateX(calc(100vw + 40px))}}

/* mountains */
.peaks{position:absolute;left:0;right:0;bottom:0;height:min(48%,340px);background:url("peaks-day.svg") center bottom/max(100%,820px) 100% no-repeat}
@media (prefers-color-scheme:dark){.peaks{background-image:url("peaks-night.svg")}}

/* text card */
.card{position:relative;z-index:3;width:100%;max-width:38rem;margin:0;padding:22px 22px 24px;text-align:center;background:var(--card);border:4px solid var(--card-edge);border-radius:6px;box-shadow:6px 6px 0 rgba(0,0,0,.22)}
h1{margin:0 0 16px;font:400 21px/1.5 var(--pixel);text-shadow:3px 3px 0 rgba(0,0,0,.45)}
.what{margin:0 auto 18px;max-width:30rem}
.soon{margin:0;font:400 14px/1.8 var(--pixel);color:var(--gold)}
.soon span{display:block}
@media (min-width:700px){
  .sky{padding-top:56px}
  h1{font-size:30px}
  .what{font-size:19px}
  .soon{font-size:16px}
  .card{padding:30px 32px 32px}
}

/* the two on the grass */
.stage{position:relative;z-index:4;margin-top:auto;padding-top:24px;display:flex;align-items:flex-end;justify-content:center;gap:calc(var(--px)*-1);margin-bottom:calc(var(--px)*-1.5)}
.wiz{width:calc(var(--px)*26);height:calc(var(--px)*25);display:block}
.fel{width:calc(var(--px)*22);height:calc(var(--px)*23);display:block;margin-left:calc(var(--px)*-1)}
.nod,.eyes,.orb{transform-box:fill-box}
.nod{animation:nod 3.4s steps(1,end) infinite}
.fel .nod{animation-delay:-1.1s}
.eyes{transform-origin:center;animation:blink 5.2s steps(1,end) infinite}
.fel .eyes{animation-duration:6.4s;animation-delay:-2s}
.orb{animation:glint 2.6s steps(1,end) infinite}
@keyframes nod{0%{transform:translateY(0)}50%{transform:translateY(1px)}}
@keyframes blink{0%,94%{transform:scaleY(1)}95%,98%{transform:scaleY(.1)}99%,100%{transform:scaleY(1)}}
@keyframes glint{0%{opacity:1}50%{opacity:0}}

/* ground */
.grass{position:relative;z-index:1;height:28px;background:var(--grass);border-top:4px solid var(--grass-edge)}
.dirt{position:relative;z-index:1;padding:26px 16px 32px;text-align:center;background:var(--dirt) conic-gradient(var(--dirt2) 25%,transparent 0 50%,var(--dirt2) 0 75%,transparent 0) 0 0/16px 16px}
.dirt p{margin:0;font-size:15px;color:var(--foot)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

.st.a{box-shadow:43vw 11vh 0 #fff,52vw 43vh 0 #fff,8vw 6vh 0 #fff,70vw 8vh 0 #fff,48vw 39vh 0 #fff,9vw 34vh 0 #fff,29vw 4vh 0 #fff,13vw 29vh 0 #fff,55vw 6vh 0 #fff,32vw 7vh 0 #fff,72vw 29vh 0 #fff,9vw 54vh 0 #fff,74vw 9vh 0 #fff,30vw 42vh 0 #fff,82vw 39vh 0 #fff,9vw 38vh 0 #fff,76vw 27vh 0 #fff,8vw 16vh 0 #fff,7vw 37vh 0 #fff,19vw 20vh 0 #fff,55vw 11vh 0 #fff,71vw 9vh 0 #fff,75vw 21vh 0 #fff,73vw 54vh 0 #fff,89vw 13vh 0 #fff,15vw 39vh 0 #fff}
.st.b{box-shadow:75vw 42vh 0 #e0f2fe,26vw 25vh 0 #e0f2fe,14vw 37vh 0 #e0f2fe,93vw 6vh 0 #e0f2fe,74vw 5vh 0 #e0f2fe,81vw 15vh 0 #e0f2fe,65vw 45vh 0 #e0f2fe,70vw 29vh 0 #e0f2fe,42vw 31vh 0 #e0f2fe,76vw 31vh 0 #e0f2fe,48vw 21vh 0 #e0f2fe,33vw 52vh 0 #e0f2fe,25vw 46vh 0 #e0f2fe,33vw 7vh 0 #e0f2fe,75vw 21vh 0 #e0f2fe,69vw 33vh 0 #e0f2fe,45vw 48vh 0 #e0f2fe,59vw 20vh 0 #e0f2fe,79vw 6vh 0 #e0f2fe,17vw 34vh 0 #e0f2fe,55vw 12vh 0 #e0f2fe,98vw 23vh 0 #e0f2fe}
.st.c{box-shadow:21vw 33vh 0 #fef9c3,55vw 4vh 0 #fef9c3,87vw 6vh 0 #fef9c3,73vw 38vh 0 #fef9c3,42vw 23vh 0 #fef9c3,90vw 24vh 0 #fef9c3,78vw 33vh 0 #fef9c3,76vw 53vh 0 #fef9c3,60vw 6vh 0 #fef9c3,13vw 19vh 0 #fef9c3,62vw 46vh 0 #fef9c3,87vw 6vh 0 #fef9c3,9vw 48vh 0 #fef9c3,91vw 21vh 0 #fef9c3,84vw 38vh 0 #fef9c3,89vw 54vh 0 #fef9c3,59vw 20vh 0 #fef9c3,93vw 26vh 0 #fef9c3}
