@font-face{font-family:"Fredoka";src:url(../fonts/fredoka.woff2) format("woff2");font-weight:300 700;font-display:swap}:root{--navy: #1E3A5F;--night: #163049;--foam: #FFF6EA;--teal: #2A9C8C;--gold: #F2C23A;--paper: #F6ECD9;--body: #1C3553;--subtle: #5A6E86;--drift: #C9A46B}*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;color:var(--body);background:var(--paper)}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.skip{position:absolute;left:12px;top:-60px;z-index:50;padding:10px 16px;border-radius:10px;background:var(--navy);color:var(--foam);font:600 18px "Fredoka",sans-serif;text-decoration:none}.skip:focus{top:12px}body.kid{min-height:100vh;overflow-x:hidden;font-family:"Fredoka","Trebuchet MS",sans-serif;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#EAD9B8}body.kid{display:flex;flex-direction:column}.harbor{position:relative;width:100%;margin:auto 0}.stage{position:relative;margin:0 auto;overflow:hidden;isolation:isolate}.stage.wide{width:min(100vw,calc(100vh * 1.6));width:min(100vw,calc(100dvh * 1.6))}.stage.tall{width:100vw;display:none}@media(max-aspect-ratio:4/5){.stage.wide{display:none}.stage.tall{display:block}}.bleed{position:fixed;inset:-60px;z-index:-2;background-size:cover;background-position:center bottom;filter:blur(30px) saturate(.9)}.plate{position:absolute;inset:0;width:100%;height:100%;display:block}.grain{position:absolute;inset:0;z-index:40;pointer-events:none;background:url(../img/grain.png) center / cover;mix-blend-mode:soft-light;opacity:.3}.sp{position:absolute;display:block;margin:0;padding:0;border:0;background:none;cursor:pointer;font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}.sp img{display:block;width:100%;height:100%;pointer-events:none;transition:transform .22s cubic-bezier(.34,1.56,.64,1),filter .2s ease}span.sp,h1.sp{pointer-events:none;cursor:default}h1.sp{font-size:0}.games,.games li{list-style:none;margin:0;padding:0;display:contents}.feelings,.hud,nav.dock{display:contents}.hit{position:absolute;z-index:1;padding:0;margin:0;border:0;background:transparent;border-radius:28px;cursor:pointer;-webkit-tap-highlight-color:transparent}.sp:focus-visible,.hit:focus-visible{outline:5px solid var(--foam);outline-offset:3px;box-shadow:0 0 0 9px var(--navy);border-radius:22px;z-index:30}.sp:focus:not(:focus-visible),.hit:focus:not(:focus-visible){outline:none}.glow-nav,.glow-big{transition:left .28s cubic-bezier(.34,1.56,.64,1),top .28s cubic-bezier(.34,1.56,.64,1),opacity .25s ease}.off{opacity:0}.nav:hover img,.nav.lit img,.ring:hover img,.ring.lit img{transform:translateY(-5%) scale(1.06)}.bob:hover img,.bob.lit img{filter:drop-shadow(0 0 12px rgba(242,194,58,.9)) drop-shadow(0 0 4px var(--foam))}.nav[aria-current=page] img{transform:translateY(-3%)}.ring[aria-pressed=true] img{filter:drop-shadow(0 0 10px var(--gold))}.ring[data-act=sound][aria-pressed=false] img{filter:grayscale(.8) opacity(.75)}.sail{animation:sail 75s linear infinite;animation-delay:-18s}.sail img{animation:rock 3.2s ease-in-out infinite;transform-origin:50% 80%}@keyframes sail{from{transform:translateX(var(--sail-from, -200%))}to{transform:translateX(var(--sail-to, 180%))}}@keyframes rock{0%,100%{transform:rotate(-1.2deg) translateY(0)}50%{transform:rotate(1.2deg) translateY(-2%)}}.s-bobbin img{transform-origin:50% 100%;animation:breathe 4.2s ease-in-out infinite}@keyframes breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.012,.988)}}.s-gully img{transform-origin:50% 100%;animation:perch 5.5s ease-in-out infinite}@keyframes perch{0%,88%,100%{transform:rotate(0)}92%{transform:rotate(-4deg)}96%{transform:rotate(3deg)}}body.calm .sail,body.calm .sail img,body.calm .s-bobbin img,body.calm .s-gully img{animation:none}body.calm .sp img{transition-duration:.5s}@media(prefers-reduced-motion:reduce){.sail,.sail img,.s-bobbin img,.s-gully img{animation:none}}#caption{position:fixed;left:50%;bottom:max(18px,env(safe-area-inset-bottom));z-index:60;transform:translate(-50%,30px);opacity:0;pointer-events:none;min-width:min(420px,86vw);max-width:min(900px,94vw);padding:.42em 1em .48em 2.9em;color:var(--navy);font:600 clamp(20px,2.4vw,34px)/1.15 "Fredoka",sans-serif;background:url(../img/tag.png) center / 100% 100% no-repeat;transition:opacity .25s ease,transform .35s cubic-bezier(.34,1.56,.64,1)}#caption.on{opacity:1;transform:translate(-50%,0)}#caption.noface{padding-left:1em}#caption .face{position:absolute;left:.5em;top:50%;width:1.9em;height:1.9em;transform:translateY(-50%);border-radius:50%;overflow:hidden;background:#E6F3F6;box-shadow:0 0 0 4px #C7A355}#caption.noface .face{display:none}#caption .face img{position:absolute;width:140%;left:-20%;top:-4%}body.calm #caption{transition-duration:.5s}body.kid #caption{bottom:calc((100vh - min(100vh,62.5vw)) / 2 + min(100vh,62.5vw) * 0.205)}body.kid.play #caption,body.kid.friend #caption{bottom:auto;top:calc((100vh - min(100vh,62.5vw)) / 2 + min(100vh,62.5vw) * 0.13);transform:translate(-50%,-24px)}body.kid.friend #caption{top:calc((100vh - min(100vh,62.5vw)) / 2 + min(100vh,62.5vw) * 0.075);left:calc((100vw - min(100vw,160vh)) / 2 + min(100vw,160vh) * 0.37)}body.kid.play #caption.on,body.kid.friend #caption.on{transform:translate(-50%,0)}@media(max-aspect-ratio:4/5){body.kid.friend #caption{left:50%}body.kid #caption,body.kid.play #caption,body.kid.friend #caption{bottom:auto;top:calc(19vw + env(safe-area-inset-top));transform:translate(-50%,-24px)}body.kid #caption.on{transform:translate(-50%,0)}}body.nocaps #caption{display:none}body.grown{font:18px/1.6 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}.grown h1,.grown h2,.grown h3{font-family:"Fredoka","Trebuchet MS",sans-serif;color:var(--navy);line-height:1.15;margin:0}.grown a{color:var(--navy)}.grown a:focus-visible,.grown button:focus-visible,.grown input:focus-visible{outline:4px solid var(--teal);outline-offset:3px;border-radius:6px}.pier-hero{position:relative;overflow:hidden;border-bottom:6px solid #E2CFA5}.pier-hero img,.pier-hero picture{display:block;width:100%;height:auto}.pier-hero .back{position:absolute;left:22px;top:18px;display:flex;align-items:center;gap:10px;text-decoration:none;font:600 17px "Fredoka",sans-serif}.pier-hero .back img{width:62px;height:auto}.pier-hero .logo{position:absolute;right:2.2%;top:22px;width:15%;min-width:120px}.pier-hero .logo img{width:100%;height:auto}.hero-words{position:absolute;left:4.2%;top:37%;width:56%}.hero-words h1{font-size:clamp(40px,5.6vw,82px);font-weight:700}.hero-words.compact{width:66%}.hero-words.compact h1{font-size:clamp(34px,4.1vw,60px)}.hero-words .sub{margin:.5em 0 0;max-width:46ch;font-size:clamp(16px,1.55vw,22px);line-height:1.45;color:var(--navy)}.pier-body{display:grid;grid-template-columns:290px minmax(0,940px);gap:48px;max-width:1340px;margin:0 auto;padding:56px 40px 40px}.slips{position:sticky;top:24px;align-self:start}.slips p{margin:0 0 10px;font-size:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--subtle)}.slips ol{list-style:none;margin:0;padding:0 0 0 4px;border-left:3px solid #C9A46B;counter-reset:slip}.slips li{counter-increment:slip;margin:0 0 6px}.slips a{display:flex;align-items:center;gap:12px;padding:6px 8px 6px 0;margin-left:-17px;text-decoration:none;font-weight:600;font-size:17px}.slips a::before{content:counter(slip);flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--drift);color:var(--foam);font:700 15px "Fredoka",sans-serif;box-shadow:inset 0 0 0 2px #A9834C}.slips a:hover{text-decoration:underline}.pier-col section{scroll-margin-top:20px}.pier-col h2{display:flex;align-items:center;gap:14px;font-size:clamp(26px,2.6vw,36px);font-weight:600;margin:0 0 18px}.pile img{display:block;width:38px;height:auto}.pier-col h3{font-size:21px;font-weight:600;color:var(--teal);margin:0 0 6px}.pier-col p{margin:0 0 14px;max-width:70ch}.pier-col .lede{color:var(--subtle)}.plank{margin:36px 0 44px}.plank img{display:block;width:100%;height:auto}.week{display:grid;grid-template-columns:330px 1fr;gap:32px;margin-bottom:22px}.week .still img{display:block;width:100%;height:auto}.two{display:grid;grid-template-columns:62% 1fr;gap:32px}.two h3{color:var(--navy)}.talk p{color:var(--subtle)}.dots{margin:0 0 14px;padding:0;list-style:none}.dots li{position:relative;padding-left:24px;margin:0 0 8px}.dots li::before{content:"";position:absolute;left:4px;top:.62em;width:9px;height:9px;border-radius:50%;background:var(--teal)}.pdfs{list-style:none;margin:10px 0 0;padding:0}.pdfs.grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 28px}.pdfs li{margin:0 0 8px}.pdfs a,.pdfs li.soon{display:inline-flex;align-items:baseline;gap:12px;font-weight:600}.pdfs li.soon{color:var(--subtle)}.pdfs em{font-weight:400;font-size:15px}.tag{flex:none;padding:1px 10px;border-radius:12px;background:#D5EEEA;box-shadow:inset 0 0 0 1px #8CC9BF;color:#1F5F66;font:600 12.5px system-ui,sans-serif;letter-spacing:.03em}.line img{display:block;width:100%;height:auto;margin:6px 0 14px}.ft img{display:block;width:100%;max-width:380px;height:auto}.toggles{display:grid;grid-template-columns:1fr 1fr;gap:22px 32px;margin-top:18px}.tg{position:relative;display:flex;gap:16px;align-items:flex-start;cursor:pointer}.tg input{position:absolute;opacity:0;width:64px;height:34px;margin:0;cursor:pointer}.tg .knob{flex:none;position:relative;width:64px;height:34px;border-radius:17px;background:#B9B0A0;transition:background .2s}.tg .knob::after{content:"";position:absolute;left:4px;top:4px;width:26px;height:26px;border-radius:50%;background:var(--foam);transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.tg input:checked+.knob{background:#237E78}.tg input:checked+.knob::after{transform:translateX(30px)}.tg input:focus-visible+.knob{outline:4px solid var(--teal);outline-offset:3px}.tg b{display:block;color:var(--navy)}.tg small{display:block;font-size:15px;color:var(--subtle)}.credit{text-align:center;padding:10px 20px 40px;font-size:14px;color:var(--subtle)}.credit a{color:var(--subtle)}.pier-body.single{grid-template-columns:minmax(0,860px);justify-content:center}.pier-body.single section{margin:0 0 30px}.pier-body.single h2{font-size:clamp(22px,2.2vw,30px);margin-bottom:10px}.grown-link{position:relative;z-index:1;margin:0;padding:14px 20px 22px;text-align:center;font:500 15px system-ui,sans-serif;background:#F6EBD9}.grown-link a{color:#3E5570}@media(max-width:980px){.pier-body{grid-template-columns:1fr;gap:20px;padding:26px 20px 30px}.slips{position:static}.slips ol{display:flex;flex-wrap:wrap;gap:8px;border:0;padding:0}.slips li{margin:0}.slips a{margin:0;padding:4px 12px 4px 4px;gap:8px;border-radius:20px;background:#EFE2C6;font-size:15px}.slips a::before{width:24px;height:24px;font-size:13px}.week,.two,.toggles,.pdfs.grid{grid-template-columns:1fr}}@media(max-width:700px){.hero-words{position:static;width:auto;padding:20px 20px 24px}.hero-words h1{font-size:42px}.hero-words.compact{width:auto}.hero-words.compact h1{font-size:38px}.pier-hero{overflow:visible}.pier-hero .logo{display:none}.pier-hero .back span{display:none}.pier-hero .back img{width:46px}.hero-words .sub{font-size:17px;max-width:none}body.grown{font-size:17px}}.gate-hero{position:relative}.gate-art{position:absolute;left:50%;bottom:4%;width:46%;max-width:220px;transform:translateX(-50%)}.gate-art img{width:100%;height:auto}.gate .gate-hero>img{max-height:46vh;object-fit:cover}.gate-card{max-width:440px;margin:0 auto;padding:26px 22px 40px}.gate-card h1{font-size:28px;font-weight:600;margin-bottom:10px}.gate-card .words{margin:14px 0;text-align:center;font:700 36px "Fredoka",sans-serif;color:var(--teal);letter-spacing:.02em}.gate-card input{display:block;width:100%;height:66px;padding:0 18px;border:3px solid var(--navy);border-radius:12px;background:#fff;font:600 32px system-ui,sans-serif;color:var(--navy);letter-spacing:.3em;text-align:center}.gate-card button{display:block;width:100%;height:60px;margin-top:16px;border:0;border-radius:12px;background:#237E78;color:var(--foam);font:600 22px "Fredoka",sans-serif;cursor:pointer}.gate-card button:hover{background:#1D6B66}.gate-card .msg{min-height:1.6em;margin:12px 0 0;font-weight:600;color:#9B3B2B}.gate-card .small{font-size:14px;color:var(--subtle)}